@clasing/ui 2.9.0 → 2.9.2

package/dist/ui.css

@@ -239,55 +239,9 @@
     0px 16px 32px 0px rgba(25, 25, 25, 0.1),
     0px 0px 12px 0px rgba(25, 25, 25, 0.08);
 
-  --animate-fade-in-scale-up: fadeInScaleUp 0.15s ease-out;
-  --animate-fade-out-scale-up: fadeOutScaleUp 0.15s ease-out;
-  --animate-fade-in-scale-down: fadeInScaleDown 0.15s ease-out;
-  --animate-fade-out-scale-down: fadeOutScaleDown 0.15s ease-out;
-
   --ease-circ-in: cubic-bezier(0.6, 0.04, 0.98, 0.335);
   --ease-circ-out: cubic-bezier(0.075, 0.82, 0.165, 1);
   --ease-circ-in-out: cubic-bezier(0.785, 0.135, 0.15, 0.86);
-
-  @keyframes fadeInScaleUp {
-    0% {
-      opacity: 0;
-      transform: scale(0.9) translateY(50px);
-    }
-    100% {
-      opacity: 1;
-      transform: scale(1) translateY(0);
-    }
-  }
-  @keyframes fadeOutScaleUp {
-    0% {
-      opacity: 1;
-      transform: scale(1) translateY(0);
-    }
-    100% {
-      opacity: 0;
-      transform: scale(0.9) translateY(50px);
-    }
-  }
-  @keyframes fadeInScaleDown {
-    0% {
-      opacity: 0;
-      transform: scale(0.9) translateY(-50px);
-    }
-    100% {
-      opacity: 1;
-      transform: scale(1) translateY(0);
-    }
-  }
-  @keyframes fadeOutScaleDown {
-    0% {
-      opacity: 1;
-      transform: scale(1) translateY(0);
-    }
-    100% {
-      opacity: 0;
-      transform: scale(0.9) translateY(-50px);
-    }
-  }
 }
 
 :root {
@@ -326,13 +280,16 @@
   --sidebar-foreground: var(--foreground);
   --sidebar-primary: var(--primary);
   --sidebar-primary-foreground: var(--primary-foreground);
-  --sidebar-accent: var(--accent);
-  --sidebar-accent-foreground: var(--accent-foreground);
+  --sidebar-accent: var(--color-blue-050);
+  --sidebar-accent-foreground: var(--color-blue-500);
   --sidebar-border: var(--border);
   --surface: var(--color-neutral-100);
   --surface-foreground: var(--foreground);
   --code: var(--color-neutral-100);
   --code-foreground: var(--color-neutral-950);
+  --scrollbar: var(--color-neutral-100);
+  --scrollbar-foreground: var(--color-neutral-200);
+  --scrollbar-hover: var(--color-neutral-300);
 }
 
 .dark {
@@ -370,13 +327,16 @@
   --sidebar-foreground: var(--foreground);
   --sidebar-primary: var(--primary);
   --sidebar-primary-foreground: var(--primary-foreground);
-  --sidebar-accent: var(--accent);
-  --sidebar-accent-foreground: var(--accent-foreground);
+  --sidebar-accent: var(--color-blue-900);
+  --sidebar-accent-foreground: var(--color-blue-200);
   --sidebar-border: var(--border);
   --surface: var(--color-neutral-900);
   --surface-foreground: var(--foreground);
   --code: var(--color-neutral-900);
   --code-foreground: var(--color-neutral-100);
+  --scrollbar: var(--color-neutral-800);
+  --scrollbar-foreground: var(--color-neutral-700);
+  --scrollbar-hover: var(--color-neutral-600);
 }
 /*
   The default border color has changed to `currentcolor` in Tailwind CSS v4,
@@ -713,17 +673,17 @@ input[type='color']::-webkit-color-swatch {
 }
 
 *::-webkit-scrollbar-track {
-  background: var(--color-neutral-000);
+  background: var(--scrollbar);
   border-radius: 30px;
 }
 
 *::-webkit-scrollbar-thumb {
-  background-color: var(--color-neutral-100);
+  background-color: var(--scrollbar-foreground);
   border-radius: 14px;
 }
 
 ::-webkit-scrollbar-thumb:hover {
-  background-color: var(--color-neutral-200);
+  background-color: var(--scrollbar-hover);
 }
 
 @utility active-card {
@@ -731,5 +691,16 @@ input[type='color']::-webkit-color-swatch {
 }
 
 @utility focusable-item {
-  @apply transition-[color,background-color,box-shadow] focus-visible:ring-[2px] focus-visible:ring-ring-default focus-visible:ring-offset-1 focus-visible:outline-hidden;
+  @apply transition-[color,background-color,box-shadow] focus-visible:ring-[2px] focus-visible:ring-ring-default/80 focus-visible:ring-offset-1 focus-visible:outline-hidden;
+}
+
+/* Reduced motion support */
+@media (prefers-reduced-motion: reduce) {
+  *,
+  *::before,
+  *::after {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+  }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clasing/ui",
-  "version": "2.9.0",
+  "version": "2.9.2",
   "type": "module",
   "files": [
     "dist"
@@ -179,6 +179,10 @@
       "import": "./dist/components/table.js",
       "types": "./dist/components/table.d.ts"
     },
+    "./tabs": {
+      "import": "./dist/components/tabs.js",
+      "types": "./dist/components/tabs.d.ts"
+    },
     "./toggle": {
       "import": "./dist/components/toggle.js",
       "types": "./dist/components/toggle.d.ts"
@@ -191,6 +195,22 @@
       "import": "./dist/components/tooltip.js",
       "types": "./dist/components/tooltip.d.ts"
     },
+    "./tree": {
+      "import": "./dist/components/tree.js",
+      "types": "./dist/components/tree.d.ts"
+    },
+    "./radio-group": {
+      "import": "./dist/components/radio-group.js",
+      "types": "./dist/components/radio-group.d.ts"
+    },
+    "./pagination": {
+      "import": "./dist/components/pagination.js",
+      "types": "./dist/components/pagination.d.ts"
+    },
+    "./field": {
+      "import": "./dist/components/field.js",
+      "types": "./dist/components/field.d.ts"
+    },
     "./blocks/interactive-card": {
       "import": "./dist/components/blocks/interactive-card.js",
       "types": "./dist/components/blocks/interactive-card.d.ts"
@@ -240,7 +260,8 @@
     "@chromatic-com/storybook": "^4.1.3",
     "@eslint/css": "^0.14.1",
     "@eslint/js": "^9.39.3",
-    "@radix-ui/react-tooltip": "^1.2.8",
+    "@radix-ui/react-radio-group": "^1.3.8",
+    "@radix-ui/react-tabs": "^1.1.13",
     "@storybook/addon-docs": "^10.2.15",
     "@storybook/addon-links": "^10.2.15",
     "@storybook/addon-onboarding": "^10.2.15",
@@ -300,13 +321,15 @@
     "@radix-ui/react-navigation-menu": "^1.2.13",
     "@radix-ui/react-popover": "^1.1.14",
     "@radix-ui/react-progress": "^1.1.7",
+    "@radix-ui/react-radio-group": "^1.3.14",
     "@radix-ui/react-scroll-area": "^1.2.9",
     "@radix-ui/react-select": "^2.2.5",
     "@radix-ui/react-slider": "^1.3.5",
     "@radix-ui/react-slot": "^1.2.3",
+    "@radix-ui/react-tabs": "^1.1.12",
     "@radix-ui/react-toggle": "^1.1.9",
     "@radix-ui/react-toggle-group": "^1.1.10",
-    "@radix-ui/react-tooltip": "^1.2.7",
+    "@radix-ui/react-tooltip": "^1.2.8",
     "@tailwindcss/forms": "^0.5.7",
     "cmdk": "^1.1.1",
     "date-fns": "^4.1.0",
@@ -317,7 +340,7 @@
     "react-resizable-panels": "^3.0.3",
     "recharts": "^3.1.0",
     "sonner": "^2.0.6",
-    "tw-animate-css": "^1.3.5",
+    "tw-animate-css": "^1.4.0",
     "vaul": "^1.1.2",
     "zod": "^4.0.17"
   }