New loading icon

2026-06-12 17:34:27 +02:00 · 2025-02-04 06:52:25 -08:00
parent 4d80c8d993
commit 25c1b04043
11 changed files with 82 additions and 33 deletions
@@ -0,0 +1,35 @@
+import classNames from 'classnames';
+
+interface Props {
+  size?: '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+  className?: string;
+}
+
+export function LoadingIcon({ size = 'md', className }: Props) {
+  const classes = classNames(
+    className,
+    'text-inherit flex-shrink-0',
+    size === 'xl' && 'h-6 w-6',
+    size === 'lg' && 'h-5 w-5',
+    size === 'md' && 'h-4 w-4',
+    size === 'sm' && 'h-3.5 w-3.5',
+    size === 'xs' && 'h-3 w-3',
+    size === '2xs' && 'h-2.5 w-2.5',
+    'animate-spin',
+  );
+
+  return (
+    <div
+      className={classNames(
+        classes,
+        'border-[currentColor] border-b-transparent rounded-full',
+        size === 'xl' && 'border-[0.2rem]',
+        size === 'lg' && 'border-[0.16rem]',
+        size === 'md' && 'border-[0.13rem]',
+        size === 'sm' && 'border-[0.1rem]',
+        size === 'xs' && 'border-[0.08rem]',
+        size === '2xs' && 'border-[0.06rem]',
+      )}
+    />
+  );
+}