@clasing/ui 2.6.0 → 2.7.1

package/dist/ui.css

@@ -1,7 +1,7 @@
 @import 'tailwindcss';
 @import 'tw-animate-css';
 
-@source "./**/*.{js,jsx,ts,tsx}";
+@source './**/*.{js,jsx,ts,tsx}';
 
 @custom-variant dark (&:is(.dark *));
 
@@ -58,83 +58,108 @@
   --font-weight-semibold: 600;
 
   --color-*: initial;
-  --color-black: oklch(0.2 0.0102 248.34);
-  --color-white: oklch(1 0 0);
-
-  --color-primary-050: oklch(0.97 0.0129 17.38);
-  --color-primary-100: oklch(0.94 0.0252 17.61);
-  --color-primary-200: oklch(0.9 0.0462 16.39);
-  --color-primary-300: oklch(0.81 0.0886 17.43);
-  --color-primary-400: oklch(0.72 0.1426 18.07);
-  --color-primary-500: oklch(0.63 0.1885 19.94);
-  --color-primary-600: oklch(0.57 0.1984 19.87);
-  --color-primary-700: oklch(0.5 0.1792 19.3);
-  --color-primary-800: oklch(0.44 0.1532 16.66);
-  --color-primary-900: oklch(0.4 0.1332 13.25);
-  --color-primary-950: oklch(0.26 0.0879 15.52);
-
-  --color-blue-050: oklch(0.97 0.0137 247.97);
-  --color-blue-100: oklch(0.95 0.0276 248.12);
-  --color-blue-200: oklch(0.89 0.0607 240.99);
-  --color-blue-300: oklch(0.8 0.1116 240.95);
-  --color-blue-400: oklch(0.71 0.1604 244.29);
-  --color-blue-500: oklch(0.64 0.1771 249.33);
-  --color-blue-600: oklch(0.55 0.1681 252.8);
-  --color-blue-700: oklch(0.47 0.1433 252.81);
-  --color-blue-800: oklch(0.4 0.1167 251.1);
-  --color-blue-900: oklch(0.37 0.1013 251.39);
-  --color-blue-950: oklch(0.28 0.0757 251.93);
-
-  --color-violet-050: oklch(0.95 0.007 268.55);
-  --color-violet-100: oklch(0.97 0.0096 273.36);
-  --color-violet-200: oklch(0.94 0.0191 276.34);
-  --color-violet-300: oklch(0.89 0.0361 277);
-  --color-violet-400: oklch(0.81 0.0581 278.49);
-  --color-violet-500: oklch(0.73 0.0884 281.04);
-  --color-violet-600: oklch(0.64 0.1155 283.25);
-  --color-violet-700: oklch(0.57 0.1311 285.66);
-  --color-violet-800: oklch(0.5 0.124 286.15);
-  --color-violet-900: oklch(0.45 0.1011 285.88);
-  --color-violet-950: oklch(0.4 0.0748 285.53);
-
-  --color-yellow-050: oklch(0.99 0.0158 102.82);
-  --color-yellow-100: oklch(0.99 0.0249 101.95);
-  --color-yellow-200: oklch(0.97 0.0658 101.01);
-  --color-yellow-300: oklch(0.95 0.1313 102.51);
-  --color-yellow-400: oklch(0.92 0.1692 99.19);
-  --color-yellow-500: oklch(0.88 0.176 93.13);
-  --color-yellow-600: oklch(0.82 0.1693 79.17);
-  --color-yellow-700: oklch(0.71 0.1583 65.12);
-  --color-yellow-800: oklch(0.58 0.145 54.45);
-  --color-yellow-900: oklch(0.5 0.1252 51.36);
-  --color-yellow-950: oklch(0.4 0.0955 51.15);
-
-  --color-neutral-000: oklch(0.97 0.0042 236.5);
-  --color-neutral-050: oklch(0.95 0.0046 258.32);
-  --color-neutral-100: oklch(0.93 0.0046 258.33);
-  --color-neutral-200: oklch(0.91 0.0035 247.86);
-  --color-neutral-300: oklch(0.9 0.0035 247.86);
-  --color-neutral-400: oklch(0.88 0.0035 247.86);
-  --color-neutral-500: oklch(0.87 0.0035 247.86);
-  --color-neutral-600: oklch(0.84 0.0036 247.87);
-  --color-neutral-700: oklch(0.79 0.0036 247.87);
-  --color-neutral-800: oklch(0.63 0.0032 264.54);
-  --color-neutral-900: oklch(0.45 0.0021 247.87);
-  --color-neutral-1000: oklch(0.2 0.0102 248.34);
-
-  --color-error-light: oklch(0.93 0.0394 52.37);
-  --color-error-main: oklch(0.64 0.2475 31.2);
-
-  --color-warning-light: oklch(0.98 0.0348 94.54);
-  --color-warning-main: oklch(0.82 0.17046 77.4296);
-
-  --color-info-light: oklch(0.97 0.0137 247.97);
-  --color-info-main: oklch(0.55 0.1681 252.8);
-
-  --color-success-light: oklch(0.97 0.0511 146.04);
-  --color-success-main: oklch(0.62 0.1446 144.41);
-
-  --color-ring-default: var(--color-blue-800);
+  --color-black: #0c1717;
+  --color-white: #ffffff;
+
+  --color-neutral-900: #0c1717;
+  --color-neutral-800: #364141;
+  --color-neutral-700: #515a5a;
+  --color-neutral-600: #6d7272;
+  --color-neutral-500: #9ea2a2;
+  --color-neutral-400: #bbbfbf;
+  --color-neutral-300: #c8cbcb;
+  --color-neutral-200: #eceded;
+  --color-neutral-100: #f8f8f8;
+
+  --color-yellow-900: #332400;
+  --color-yellow-800: #624600;
+  --color-yellow-700: #946900;
+  --color-yellow-600: #c58c00;
+  --color-yellow-500: #f6af00;
+  --color-yellow-400: #f8bf33;
+  --color-yellow-300: #facf66;
+  --color-yellow-200: #fbdf99;
+  --color-yellow-100: #fdefcc;
+  --color-yellow-050: #fffaed;
+
+  --color-orange-900: #331601;
+  --color-orange-800: #662c01;
+  --color-orange-700: #994302;
+  --color-orange-600: #cc5902;
+  --color-orange-500: #ff6f03;
+  --color-orange-400: #ff740d;
+  --color-orange-300: #fe852a;
+  --color-orange-200: #fda05b;
+  --color-orange-100: #fac7a0;
+  --color-orange-050: #f8eae0;
+
+  --color-pink-900: #331922;
+  --color-pink-800: #663144;
+  --color-pink-700: #994a66;
+  --color-pink-600: #cc6288;
+  --color-pink-500: #ff7baa;
+  --color-pink-400: #ff80ad;
+  --color-pink-300: #fe8fb6;
+  --color-pink-200: #fda8c6;
+  --color-pink-100: #facbdc;
+  --color-pink-050: #f8ecf0;
+
+  --color-red-900: #290406;
+  --color-red-800: #53090b;
+  --color-red-700: #7c0d11;
+  --color-red-600: #a61216;
+  --color-red-500: #cf161c;
+  --color-red-400: #d2262c;
+  --color-red-300: #d53a3f;
+  --color-red-200: #de686b;
+  --color-red-100: #e9a7a9;
+  --color-red-050: #f4e2e3;
+
+  --color-violet-900: #2c1633;
+  --color-violet-800: #582c66;
+  --color-violet-700: #854199;
+  --color-violet-600: #b157cc;
+  --color-violet-500: #dd6dff;
+  --color-violet-400: #de72ff;
+  --color-violet-300: #e183fe;
+  --color-violet-200: #e79ffd;
+  --color-violet-100: #efc6fa;
+  --color-violet-050: #f6eaf8;
+
+  --color-blue-900: #000d30;
+  --color-blue-800: #011b60;
+  --color-blue-700: #012891;
+  --color-blue-600: #0236c1;
+  --color-blue-500: #0243f1;
+  --color-blue-400: #1450f1;
+  --color-blue-300: #2960f2;
+  --color-blue-200: #5b84f3;
+  --color-blue-100: #bfcef7;
+  --color-blue-050: #e0e6f8;
+
+  --color-green-900: #162707;
+  --color-green-800: #2b4e0e;
+  --color-green-700: #417614;
+  --color-green-600: #569d1b;
+  --color-green-500: #6cc422;
+  --color-green-400: #72c62b;
+  --color-green-300: #90d159;
+  --color-green-200: #b2de8e;
+  --color-green-100: #c6e6ab;
+  --color-green-050: #eaf3e3;
+
+  --color-turquoise-900: #002c25;
+  --color-turquoise-800: #005849;
+  --color-turquoise-700: #00836e;
+  --color-turquoise-600: #00af92;
+  --color-turquoise-500: #00dbb7;
+  --color-turquoise-400: #0adcba;
+  --color-turquoise-300: #28e0c1;
+  --color-turquoise-200: #59e5ce;
+  --color-turquoise-100: #9eede1;
+  --color-turquoise-050: #e0f6f2;
+
+  --color-ring-default: var(--color-blue-600);
 
   --color-accent: var(--color-neutral-000);
   --color-accent-foreground: var(--color-neutral-1000);
@@ -162,6 +187,13 @@
   --color-accent: var(--accent);
   --color-accent-foreground: var(--accent-foreground);
   --color-destructive: var(--destructive);
+  --color-destructive-foreground: var(--destructive-foreground);
+  --color-success: var(--success);
+  --color-success-foreground: var(--success-foreground);
+  --color-info: var(--info);
+  --color-info-foreground: var(--info-foreground);
+  --color-warning: var(--warning);
+  --color-warning-foreground: var(--warning-foreground);
   --color-border: var(--border);
   --color-input: var(--input);
   --color-ring: var(--ring);
@@ -261,89 +293,100 @@
 :root {
   --radius: 1rem;
   --background: var(--color-white);
-  --foreground: var(--color-neutral-1000);
-  --card: var(--color-white);
-  --card-foreground: var(--color-neutral-1000);
-  --popover: var(--color-white);
-  --popover-foreground: var(--color-neutral-1000);
-  --primary: var(--color-primary-600);
-  --primary-foreground: var(--color-white);
-  --secondary: var(--color-blue-800);
-  --secondary-foreground: var(--color-white);
-  --muted: var(--color-neutral-000);
-  --muted-foreground: var(--color-neutral-900);
-  --accent: var(--color-neutral-000);
-  --accent-foreground: var(--color-neutral-1000);
-  --destructive: var(--color-error-main);
-  --warning: var(--color-warning-main);
-  --info: var(--color-info-main);
-  --success: var(--color-success-main);
-  --border: var(--color-neutral-050);
-  --input: var(--color-neutral-050);
-  --ring: var(--color-blue-800);
+  --foreground: var(--color-black);
+  --card: var(--background);
+  --card-foreground: var(--foreground);
+  --popover: var(--background);
+  --popover-foreground: var(--foreground);
+  --primary: var(--color-neutral-900);
+  --primary-foreground: var(--color-neutral-100);
+  --secondary: var(--color-neutral-200);
+  --secondary-foreground: var(--foreground);
+  --muted: var(--color-neutral-200);
+  --muted-foreground: var(--color-neutral-500);
+  --accent: var(--color-neutral-200);
+  --accent-foreground: var(--color-black);
+  --destructive: var(--color-red-050);
+  --destructive-foreground: var(--color-red-500);
+  --success: var(--color-green-050);
+  --success-foreground: var(--color-green-500);
+  --warning: var(--color-yellow-050);
+  --warning-foreground: var(--color-yellow-500);
+  --info: var(--color-blue-050);
+  --info-foreground: var(--color-blue-500);
+  --border: var(--color-neutral-200);
+  --input: var(--color-neutral-300);
+  --ring: var(--color-ring-default);
   --chart-1: var(--color-blue-300);
   --chart-2: var(--color-blue-500);
   --chart-3: var(--color-blue-600);
   --chart-4: var(--color-blue-700);
   --chart-5: var(--color-blue-800);
-  --sidebar: var(--color-white);
-  --sidebar-foreground: var(--color-neutral-1000);
-  --sidebar-primary: var(--color-primary-600);
-  --sidebar-primary-foreground: var(--color-white);
-  --sidebar-accent: var(--color-neutral-200);
-  --sidebar-accent-foreground: var(--color-neutral-1000);
-  --sidebar-border: var(--color-neutral-050);
-  --sidebar-ring: var(--color-blue-800);
-  --surface: var(--color-white);
-  --surface-foreground: var(--color-neutral-1000);
+  --sidebar: var(--background);
+  --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-border: var(--border);
+  --sidebar-ring: var(--color-blue-500);
+  --surface: var(--background);
+  --surface-foreground: var(--color-foreground);
   --code: var(--surface);
   --code-foreground: var(--surface-foreground);
-  --code-highlight: var(--color-blue-800);
-  --code-number: var(--color-blue-800);
+  --code-highlight: var(--color-blue-500);
+  --code-number: var(--color-blue-500);
   --selection: var(--color-blue-050);
   --selection-foreground: var(--color-blue-600);
 }
 
 .dark {
-  --background: var(--color-neutral-1000);
+  --background: var(--color-black);
   --foreground: var(--color-white);
-  --card: var(--color-neutral-1000);
-  --card-foreground: var(--color-white);
-  --popover: var(--color-neutral-1000);
-  --popover-foreground: var(--color-white);
-  --primary: var(--color-primary-600);
-  --primary-foreground: var(--color-white);
-  --secondary: var(--color-blue-800);
+  --card: var(--background);
+  --card-foreground: var(--foreground);
+  --popover: var(--background);
+  --popover-foreground: var(--foreground);
+  --primary: var(--color-white);
+  --primary-foreground: var(--color-neutral-900);
+  --secondary: var(--color-neutral-800);
   --secondary-foreground: var(--color-white);
   --muted: var(--color-neutral-700);
-  --muted-foreground: var(--color-neutral-200);
-  --accent: var(--color-neutral-900);
+  --muted-foreground: var(--color-neutral-500);
+  --accent: var(--color-neutral-800);
   --accent-foreground: var(--color-white);
-  --destructive: var(--color-error-main);
-  --border: var(--color-neutral-900);
-  --input: var(--color-neutral-900);
-  --ring: var(--color-blue-800);
+  --destructive: var(--color-red-900);
+  --destructive-foreground: var(--color-red-300);
+  --success: var(--color-green-900);
+  --success-foreground: var(--color-green-500);
+  --warning: var(--color-yellow-900);
+  --warning-foreground: var(--color-yellow-500);
+  --info: var(--color-blue-900);
+  --info-foreground: var(--color-blue-200);
+  --border: var(--color-neutral-800);
+  --input: var(--color-neutral-800);
+  --ring: var(--color-blue-500);
   --chart-1: var(--color-blue-300);
   --chart-2: var(--color-blue-500);
   --chart-3: var(--color-blue-600);
   --chart-4: var(--color-blue-700);
   --chart-5: var(--color-blue-800);
-  --sidebar: var(--color-neutral-1000);
-  --sidebar-foreground: var(--color-white);
-  --sidebar-primary: var(--color-primary-600);
-  --sidebar-primary-foreground: var(--color-white);
-  --sidebar-accent: var(--color-neutral-1000);
-  --sidebar-accent-foreground: var(--color-white);
-  --sidebar-border: var(--color-neutral-900);
-  --sidebar-ring: var(--color-blue-800);
-  --surface: var(--color-neutral-1000);
-  --surface-foreground: var(--color-white);
+  --sidebar: var(--background);
+  --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-border: var(--border);
+  --sidebar-ring: var(--color-blue-500);
+  --surface: var(--background);
+  --surface-foreground: var(--color-foreground);
   --code: var(--surface);
   --code-foreground: var(--surface-foreground);
-  --code-highlight: var(--color-blue-800);
-  --code-number: var(--color-blue-800);
-  --selection: var(--color-blue-800);
-  --selection-foreground: var(--color-white);
+  --code-highlight: var(--color-blue-500);
+  --code-number: var(--color-blue-500);
+  --selection: var(--color-blue-900);
+  --selection-foreground: var(--color-blue-600);
 }
 
 /*
@@ -360,7 +403,7 @@
   ::before,
   ::backdrop,
   ::file-selector-button {
-    border-color: var(--color-neutral-050, currentcolor);
+    border-color: var(--color-border, currentcolor);
   }
 
   * {
@@ -375,6 +418,7 @@
   body {
     font-synthesis-weight: none;
     text-rendering: optimizeLegibility;
+    @apply bg-background text-foreground;
   }
 
   @supports (font: -apple-system-body) and (-webkit-appearance: none) {
@@ -394,7 +438,7 @@
 }
 
 @utility section-soft {
-  @apply from-background to-surface/40 dark:bg-background 3xl:fixed:bg-none bg-gradient-to-b;
+  @apply from-background to-surface/40 dark:bg-background 3xl:fixed:bg-none bg-linear-to-b;
 }
 
 @utility theme-container {
@@ -439,153 +483,109 @@
 }
 
 @utility display-sm {
-  font-size: 44px;
-  line-height: 110%;
-  letter-spacing: -0.03em;
+  @apply text-7xl leading-[110%] tracking-[-0.03em];
 }
 
 @utility display-lg {
-  font-size: 52px;
-  line-height: 110%;
-  letter-spacing: -0.03em;
+  @apply text-9xl leading-[110%] tracking-[-0.03em];
 }
 
 @utility title-2xs {
-  font-size: 20px;
-  line-height: 120%;
-  letter-spacing: -0.02em;
+  @apply text-xl leading-[120%] tracking-[-0.02em];
 }
 
 @utility title-xs {
-  font-size: 24px;
-  line-height: 120%;
-  letter-spacing: -0.03em;
+  @apply text-2xl leading-[120%] tracking-[-0.03em];
 }
 
 @utility title-sm {
-  font-size: 28px;
-  line-height: 120%;
-  letter-spacing: -0.03em;
+  @apply text-3xl leading-[120%] tracking-[-0.03em];
 }
 
 @utility title-md {
-  font-size: 32px;
-  line-height: 120%;
-  letter-spacing: -0.03em;
+  @apply text-4xl leading-[120%] tracking-[-0.03em];
 }
 
 @utility title-lg {
-  font-size: 36px;
-  line-height: 120%;
-  letter-spacing: -0.03em;
+  @apply text-5xl leading-[120%] tracking-[-0.03em];
 }
 
 @utility title-xl {
-  font-size: 40px;
-  line-height: 120%;
-  letter-spacing: -0.03em;
+  @apply text-6xl leading-[120%] tracking-[-0.03em];
 }
 
 @utility label-xs {
-  font-size: 10px;
-  line-height: 110%;
-  letter-spacing: -0.01em;
+  @apply text-2xs leading-[110%] tracking-[-0.01em];
 }
 
 @utility label-sm {
-  font-size: 12px;
-  line-height: 110%;
-  letter-spacing: -0.01em;
+  @apply text-xs leading-[110%] tracking-[-0.01em];
 }
 
 @utility label-md {
-  font-size: 14px;
-  line-height: 110%;
-  letter-spacing: -0.01em;
+  @apply text-sm leading-[110%] tracking-[-0.01em];
 }
 
 @utility label-lg {
-  font-size: 16px;
-  line-height: 110%;
-  letter-spacing: -0.01em;
+  @apply text-base leading-[110%] tracking-[-0.01em];
 }
 
 @utility label-xl {
-  font-size: 18px;
-  line-height: 110%;
-  letter-spacing: -0.01em;
+  @apply text-lg leading-[110%] tracking-[-0.01em];
 }
 
 @utility label-2xl {
-  font-size: 20px;
-  line-height: 110%;
-  letter-spacing: -0.02em;
+  @apply text-xl leading-[110%] tracking-[-0.02em];
 }
 
 @utility label-3xl {
-  font-size: 24px;
-  line-height: 110%;
-  letter-spacing: -0.03em;
+  @apply text-2xl leading-[110%] tracking-[-0.03em];
 }
 
 @utility paragraph-xs {
-  font-size: 12px;
-  line-height: 140%;
-  letter-spacing: -0.01em;
+  @apply text-xs leading-[140%] tracking-[-0.01em];
 }
 
 @utility paragraph-sm {
-  font-size: 14px;
-  line-height: 140%;
-  letter-spacing: -0.01em;
+  @apply text-sm leading-[140%] tracking-[-0.01em];
 }
 
 @utility paragraph-md {
-  font-size: 16px;
-  line-height: 140%;
-  letter-spacing: -0.01em;
+  @apply text-base leading-[140%] tracking-[-0.01em];
 }
 
 @utility paragraph-lg {
-  font-size: 18px;
-  line-height: 140%;
-  letter-spacing: -0.01em;
+  @apply text-lg leading-[140%] tracking-[-0.01em];
 }
 
 @utility button-text-sm {
-  font-size: 12px;
-  line-height: 14px;
-  letter-spacing: -0.01em;
+  @apply text-xs leading-[14px] tracking-[-0.01em];
 }
 
 @utility button-text-md {
-  font-size: 14px;
-  line-height: 16px;
-  letter-spacing: -0.01em;
+  @apply text-sm leading-xs tracking-[-0.01em];
 }
 
 @utility button-text-lg {
-  font-size: 16px;
-  line-height: 20px;
-  letter-spacing: -0.01em;
+  @apply text-base leading-md tracking-[-0.01em];
 }
 
 @layer components {
   .steps {
     &:first-child {
-      @apply !mt-0;
+      @apply mt-0!;
     }
 
     &:first-child > h3:first-child {
-      @apply !mt-0;
+      @apply mt-0!;
     }
 
     > h3 {
-      @apply !mt-16;
+      @apply mt-16!;
     }
 
     > h3 + p {
-      @apply !mt-2;
+      @apply mt-2!;
     }
   }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clasing/ui",
-  "version": "2.6.0",
+  "version": "2.7.1",
   "type": "module",
   "main": "./dist/index.umd.js",
   "module": "./dist/index.es.js",
@@ -265,7 +265,7 @@
     "dev": "vite",
     "build": "vite build && pnpm run generate-types",
     "generate-types": "tsc --project tsconfig.build.json",
-    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "lint": "eslint",
     "preview": "vite preview",
     "test": "vitest --run",
     "test:watch": "vitest",
@@ -287,50 +287,54 @@
     "clsx": "^2.1.1",
     "express": "^5.2.1",
     "express-basic-auth": "^1.2.1",
-    "next-themes": "^0.4.6",
-    "react": "^19.2.3",
-    "react-dom": "^19.2.3",
-    "tailwind-merge": "^3.4.0"
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
+    "tailwind-merge": "^3.5.0"
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^4.1.3",
+    "@eslint/css": "^0.14.1",
+    "@eslint/js": "^9.39.3",
     "@radix-ui/react-tooltip": "^1.2.8",
-    "@storybook/addon-docs": "^10.1.10",
-    "@storybook/addon-links": "^10.1.10",
-    "@storybook/addon-onboarding": "^10.1.10",
-    "@storybook/react-vite": "^10.1.10",
+    "@storybook/addon-docs": "^10.2.15",
+    "@storybook/addon-links": "^10.2.15",
+    "@storybook/addon-onboarding": "^10.2.15",
+    "@storybook/react-vite": "^10.2.15",
     "@tailwindcss/forms": "^0.5.11",
-    "@tailwindcss/vite": "^4.1.18",
+    "@tailwindcss/vite": "^4.2.1",
     "@testing-library/jest-dom": "^6.9.1",
-    "@testing-library/react": "^16.3.1",
+    "@testing-library/react": "^16.3.2",
     "@testing-library/user-event": "^14.6.1",
-    "@types/node": "^25.0.3",
-    "@types/react": "^19.2.7",
+    "@types/node": "^25.3.3",
+    "@types/react": "^19.2.14",
     "@types/react-dom": "^19.2.3",
-    "@typescript-eslint/eslint-plugin": "^8.50.1",
-    "@typescript-eslint/parser": "^8.50.1",
-    "@vitejs/plugin-react-swc": "^4.2.2",
-    "eslint": "^9.39.2",
+    "@typescript-eslint/eslint-plugin": "^8.56.1",
+    "@typescript-eslint/parser": "^8.56.1",
+    "@vitejs/plugin-react-swc": "^4.2.3",
+    "@vueless/storybook-dark-mode": "^10.0.7",
+    "eslint": "^9.39.3",
     "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-better-tailwindcss": "^4.3.1",
     "eslint-plugin-import": "^2.32.0",
-    "eslint-plugin-prettier": "^5.5.4",
+    "eslint-plugin-prettier": "^5.5.5",
     "eslint-plugin-react-hooks": "^7.0.1",
     "eslint-plugin-react-refresh": "^0.4.26",
-    "eslint-plugin-storybook": "^10.1.10",
-    "jsdom": "^27.3.0",
+    "eslint-plugin-storybook": "^10.2.15",
+    "globals": "^17.4.0",
+    "jsdom": "^27.4.0",
+    "next-themes": "^0.4.6",
     "prettier": "3.7.4",
     "prettier-plugin-organize-imports": "^4.3.0",
-    "prettier-plugin-tailwindcss": "^0.7.2",
     "react-docgen": "^8.0.2",
-    "rollup-plugin-visualizer": "^6.0.5",
+    "rollup-plugin-visualizer": "^6.0.11",
     "standard-version": "^9.5.0",
-    "storybook": "^10.1.10",
-    "tailwindcss": "^4.1.18",
+    "storybook": "^10.2.15",
+    "tailwindcss": "^4.2.1",
     "typescript": "^5.9.3",
-    "vite": "^7.3.0",
+    "vite": "^7.3.1",
     "vite-plugin-dts": "^4.5.4",
-    "vite-tsconfig-paths": "^6.0.3",
-    "vitest": "^4.0.16"
+    "vite-tsconfig-paths": "^6.1.1",
+    "vitest": "^4.0.18"
   },
   "peerDependencies": {
     "@hookform/resolvers": "^5.2.1",