@pglevy/sailwind 0.5.0 → 0.5.1

package/dist/components/Tabs/Tabs.stories.d.ts

@@ -6,6 +6,23 @@ declare const meta: {
     parameters: {
         layout: string;
     };
+    argTypes: {
+        size: {
+            control: "select";
+            options: string[];
+        };
+        color: {
+            control: "text";
+        };
+        orientation: {
+            control: "select";
+            options: string[];
+        };
+        activationMode: {
+            control: "select";
+            options: string[];
+        };
+    };
 };
 export default meta;
 type Story = StoryObj<typeof meta>;

package/dist/components/Tabs/Tabs.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/Tabs.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAQ3D,QAAA,MAAM,IAAI;;;;;;;CAKwB,CAAA;AAElC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAoBlC,eAAO,MAAM,OAAO,EAAE,KAOrB,CAAA;AAED,eAAO,MAAM,0BAA0B,EAAE,KA8ExC,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KA6DjC,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KASvB,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KASvB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAU3B,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAU3B,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAU5B,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAU9B,CAAA"}
+{"version":3,"file":"Tabs.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Tabs/Tabs.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAQ3D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;CAWwB,CAAA;AAElC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAoBlC,eAAO,MAAM,OAAO,EAAE,KAOrB,CAAA;AAED,eAAO,MAAM,0BAA0B,EAAE,KA8ExC,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KA6DjC,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KASvB,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KASvB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAU3B,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAU3B,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAU5B,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAU9B,CAAA"}

package/dist/components/Tag/Tag.stories.d.ts

@@ -13,6 +13,16 @@ declare const meta: {
             backgroundColor: string;
         }[];
     };
+    argTypes: {
+        size: {
+            control: "select";
+            options: string[];
+        };
+        marginBelow: {
+            control: "select";
+            options: string[];
+        };
+    };
 };
 export default meta;
 type Story = StoryObj<typeof meta>;

package/dist/components/Tag/Tag.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Tag/Tag.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAG3D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;CAWuB,CAAA;AAEjC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAA;AAEhC,eAAO,MAAM,cAAc,EAAE,KAW5B,CAAA;AAED,eAAO,MAAM,eAAe,EAAE,KAW7B,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAQvB,CAAA"}
+{"version":3,"file":"Tag.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Tag/Tag.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAG3D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;CAeuB,CAAA;AAEjC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAA;AAEhC,eAAO,MAAM,cAAc,EAAE,KAS5B,CAAA;AAED,eAAO,MAAM,eAAe,EAAE,KAS7B,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAQvB,CAAA"}

package/dist/components/Tag/TagField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TagField.d.ts","sourceRoot":"","sources":["../../../src/components/Tag/TagField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAC7C,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAqB,MAAM,kBAAkB,CAAA;AAIjH;;GAEG;AACH,KAAK,OAAO,GAAG,OAAO,CAAC,QAAQ,EAAE,OAAO,GAAG,UAAU,CAAC,CAAA;AAEtD;;;GAGG;AACH,MAAM,WAAW,aAAa;IAC5B,oCAAoC;IACpC,IAAI,EAAE,YAAY,EAAE,CAAA;IACpB,yCAAyC;IACzC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iDAAiD;IACjD,aAAa,CAAC,EAAE,iBAAiB,CAAA;IACjC,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,6BAA6B;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,mCAAmC;IACnC,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,yCAAyC;IACzC,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,uBAAuB;IACvB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,gCAAgC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,mCAAmC;IACnC,WAAW,CAAC,EAAE,cAAc,CAAA;IAC5B,mCAAmC;IACnC,WAAW,CAAC,EAAE,cAAc,CAAA;IAC5B,wFAAwF;IACxF,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA8I5C,CAAA"}
+{"version":3,"file":"TagField.d.ts","sourceRoot":"","sources":["../../../src/components/Tag/TagField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,WAAW,CAAA;AAC7C,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,iBAAiB,EAAE,cAAc,EAAqB,MAAM,kBAAkB,CAAA;AAIjH;;GAEG;AACH,KAAK,OAAO,GAAG,OAAO,CAAC,QAAQ,EAAE,OAAO,GAAG,UAAU,CAAC,CAAA;AAEtD;;;GAGG;AACH,MAAM,WAAW,aAAa;IAC5B,oCAAoC;IACpC,IAAI,EAAE,YAAY,EAAE,CAAA;IACpB,yCAAyC;IACzC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iDAAiD;IACjD,aAAa,CAAC,EAAE,iBAAiB,CAAA;IACjC,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,6BAA6B;IAC7B,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,mCAAmC;IACnC,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,yCAAyC;IACzC,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,uBAAuB;IACvB,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,gCAAgC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,mCAAmC;IACnC,WAAW,CAAC,EAAE,cAAc,CAAA;IAC5B,mCAAmC;IACnC,WAAW,CAAC,EAAE,cAAc,CAAA;IAC5B,wFAAwF;IACxF,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA+I5C,CAAA"}

package/dist/components/Tag/TagField.js

@@ -73,6 +73,7 @@ const W = ({
       k,
       {
         ...y,
+        role: "listitem",
         className: `
           inline-block font-semibold max-w-full
           whitespace-nowrap overflow-hidden text-ellipsis

package/dist/components/TextField/TextField.stories.d.ts

@@ -32,6 +32,16 @@ declare const meta: {
         marginAbove?: import('../..').SAILMarginSize | undefined;
         marginBelow?: import('../..').SAILMarginSize | undefined;
     }>) => import("react/jsx-runtime").JSX.Element)[];
+    argTypes: {
+        labelPosition: {
+            control: "select";
+            options: string[];
+        };
+        align: {
+            control: "select";
+            options: string[];
+        };
+    };
 };
 export default meta;
 type Story = StoryObj<typeof meta>;

package/dist/components/TextField/TextField.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextField.stories.d.ts","sourceRoot":"","sources":["../../../src/components/TextField/TextField.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAG3D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAYwB,CAAA;AAElC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAA;AAED,eAAO,MAAM,kBAAkB,EAAE,KAQhC,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAOpB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAM3B,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAO1B,CAAA;AAED,eAAO,MAAM,eAAe,EAAE,KAQ7B,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KAkBjC,CAAA"}
+{"version":3,"file":"TextField.stories.d.ts","sourceRoot":"","sources":["../../../src/components/TextField/TextField.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAI3D,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgBwB,CAAA;AAElC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAkBrB,CAAA;AAED,eAAO,MAAM,kBAAkB,EAAE,KAQhC,CAAA;AAED,eAAO,MAAM,MAAM,EAAE,KAOpB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAM3B,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAO1B,CAAA;AAED,eAAO,MAAM,eAAe,EAAE,KAQ7B,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KAsBjC,CAAA"}

package/dist/components/Toggle/Toggle.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Toggle.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Toggle/Toggle.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAI3D,QAAA,MAAM,IAAI;;;;;;;CAK0B,CAAA;AAEpC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAWrB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAYtB,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAYxB,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAY1B,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAYxB,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAazB,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAavB,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAYzB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAY3B,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAY3B,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAY5B,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAOtB,CAAA"}
+{"version":3,"file":"Toggle.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Toggle/Toggle.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAK3D,QAAA,MAAM,IAAI;;;;;;;CAK0B,CAAA;AAEpC,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAqBrB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAYtB,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAYxB,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAY1B,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAYxB,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAazB,CAAA;AAED,eAAO,MAAM,SAAS,EAAE,KAavB,CAAA;AAED,eAAO,MAAM,WAAW,EAAE,KAYzB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAY3B,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAY3B,CAAA;AAED,eAAO,MAAM,cAAc,EAAE,KAY5B,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAOtB,CAAA"}

package/dist/components/Toggle/ToggleField.js

@@ -8,7 +8,7 @@ const J = ({
   text: d,
   instructions: h,
   required: c = !1,
-  disabled: b = !1,
+  disabled: g = !1,
   value: p = !1,
   validations: u = [],
   saveInto: S,
@@ -23,12 +23,12 @@ const J = ({
   marginBelow: L = "STANDARD",
   size: G = "STANDARD",
   color: E = "ACCENT",
-  style: n = "OUTLINE",
-  icon: s,
+  style: s = "OUTLINE",
+  icon: o,
   iconPosition: x = "START"
 }) => {
   if (!y) return null;
-  const o = `togglefield-${Math.random().toString(36).substr(2, 9)}`, U = {
+  const n = `togglefield-${Math.random().toString(36).substr(2, 9)}`, U = {
     SMALL: "px-3 py-1.5 text-sm",
     STANDARD: "px-4 py-2.5 text-base",
     MEDIUM: "px-6 py-3 text-lg",
@@ -37,17 +37,17 @@ const J = ({
     if (E.startsWith("#"))
       return "border-2";
     const e = E;
-    return n === "SOLID" ? {
+    return s === "SOLID" ? {
       ACCENT: "border-2 border-blue-500 bg-white text-blue-500 data-[state=on]:bg-blue-500 data-[state=on]:text-white data-[state=on]:border-blue-500 hover:bg-blue-50 data-[state=on]:hover:bg-blue-700",
       POSITIVE: "border-2 border-green-700 bg-white text-green-700 data-[state=on]:bg-green-700 data-[state=on]:text-white data-[state=on]:border-green-700 hover:bg-green-50 data-[state=on]:hover:bg-green-900",
       NEGATIVE: "border-2 border-red-700 bg-white text-red-700 data-[state=on]:bg-red-700 data-[state=on]:text-white data-[state=on]:border-red-700 hover:bg-red-50 data-[state=on]:hover:bg-red-900",
       SECONDARY: "border-2 border-gray-700 bg-white text-gray-700 data-[state=on]:bg-gray-700 data-[state=on]:text-white data-[state=on]:border-gray-700 hover:bg-gray-50 data-[state=on]:hover:bg-gray-900"
-    }[e] : n === "OUTLINE" ? {
+    }[e] : s === "OUTLINE" ? {
       ACCENT: "border-2 border-blue-500 text-blue-500 bg-white data-[state=on]:bg-blue-100 hover:bg-blue-50",
       POSITIVE: "border-2 border-green-700 text-green-700 bg-white data-[state=on]:bg-green-100 hover:bg-green-50",
       NEGATIVE: "border-2 border-red-700 text-red-700 bg-white data-[state=on]:bg-red-100 hover:bg-red-50",
       SECONDARY: "border-2 border-gray-700 text-gray-700 bg-white data-[state=on]:bg-gray-100 hover:bg-gray-50"
-    }[e] : n === "GHOST" ? {
+    }[e] : s === "GHOST" ? {
       ACCENT: "border-2 border-transparent text-blue-500 bg-transparent data-[state=on]:bg-blue-100 hover:bg-blue-50",
       POSITIVE: "border-2 border-transparent text-green-700 bg-transparent data-[state=on]:bg-green-100 hover:bg-green-50",
       NEGATIVE: "border-2 border-transparent text-red-700 bg-transparent data-[state=on]:bg-red-100 hover:bg-red-50",
@@ -55,7 +55,7 @@ const J = ({
     }[e] : "";
   }, V = (e) => {
     const r = v || S;
-    r && !b && r(e);
+    r && !g && r(e);
   }, C = (e) => {
     const T = ((j) => j.split("-").map((f) => f.charAt(0).toUpperCase() + f.slice(1)).join(""))(e);
     if (T in a)
@@ -76,32 +76,32 @@ const J = ({
       ARROW_DOWN: "ArrowDown"
     }[e];
     return i && i in a ? a[i] : a.Circle;
-  }, g = u.length > 0, W = c && !p && m, F = /* @__PURE__ */ I(
+  }, b = u.length > 0, W = c && !p && m, F = /* @__PURE__ */ I(
     _.Root,
     {
-      id: o,
+      id: n,
       pressed: p,
       onPressedChange: V,
-      disabled: b,
+      disabled: g,
       className: [
         "inline-flex items-center justify-center gap-2",
         "font-medium transition-colors rounded-sm",
         U[G],
         M(),
-        b ? "opacity-50 cursor-not-allowed" : "cursor-pointer"
+        g ? "opacity-50 cursor-not-allowed" : "cursor-pointer"
       ].filter(Boolean).join(" "),
-      "aria-label": A || d || l,
-      "aria-describedby": h ? `${o}-instructions` : void 0,
-      "aria-invalid": g,
-      "aria-errormessage": g ? `${o}-error` : void 0,
+      "aria-label": A || d || l || (o ? o.replace(/-/g, " ") : void 0),
+      "aria-describedby": h ? `${n}-instructions` : void 0,
+      "aria-invalid": b,
+      "aria-errormessage": b ? `${n}-error` : void 0,
       children: [
-        s && x === "START" && /* @__PURE__ */ t("span", { "aria-hidden": "true", children: N.createElement(C(s), { size: 16 }) }),
+        o && x === "START" && /* @__PURE__ */ t("span", { "aria-hidden": "true", children: N.createElement(C(o), { size: 16 }) }),
         d && /* @__PURE__ */ t("span", { children: d }),
-        s && x === "END" && /* @__PURE__ */ t("span", { "aria-hidden": "true", children: N.createElement(C(s), { size: 16 }) })
+        o && x === "END" && /* @__PURE__ */ t("span", { "aria-hidden": "true", children: N.createElement(C(o), { size: 16 }) })
       ]
     }
   ), P = /* @__PURE__ */ I(H, { children: [
-    g && /* @__PURE__ */ t("div", { id: `${o}-error`, className: "mt-2", role: "alert", children: u.map((e, r) => /* @__PURE__ */ t("p", { className: "text-sm text-red-700", children: e }, r)) }),
+    b && /* @__PURE__ */ t("div", { id: `${n}-error`, className: "mt-2", role: "alert", children: u.map((e, r) => /* @__PURE__ */ t("p", { className: "text-sm text-red-700", children: e }, r)) }),
     W && /* @__PURE__ */ t("p", { className: "text-sm text-red-700 mt-2", role: "alert", children: m })
   ] });
   return /* @__PURE__ */ t(
@@ -113,7 +113,7 @@ const J = ({
       instructions: h,
       helpTooltip: O,
       accessibilityText: A,
-      inputId: o,
+      inputId: n,
       marginAbove: D,
       marginBelow: L,
       footer: P,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pglevy/sailwind",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "description": "Appian SAIL components for React - Pre-release version under active development",
   "type": "module",
   "main": "./dist/index.js",
@@ -54,7 +54,10 @@
     "version:minor": "npm version minor",
     "version:major": "npm version major",
     "release": "npm run build:lib && npm publish --access public",
-    "test": "vitest --run"
+    "test": "vitest --run",
+    "test-storybook": "vitest --run --project=storybook",
+    "test:unit": "vitest --run --project=unit",
+    "a11y-audit": "node scripts/a11y-audit.cjs"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",
@@ -72,10 +75,11 @@
   },
   "devDependencies": {
     "@eslint/js": "^9.36.0",
-    "@storybook/addon-a11y": "^10.2.8",
-    "@storybook/addon-docs": "^10.2.8",
-    "@storybook/addon-themes": "^10.2.8",
-    "@storybook/react-vite": "^10.2.8",
+    "@storybook/addon-a11y": "^10.2.19",
+    "@storybook/addon-docs": "^10.2.19",
+    "@storybook/addon-themes": "^10.2.19",
+    "@storybook/addon-vitest": "^10.2.19",
+    "@storybook/react-vite": "^10.2.19",
     "@tailwindcss/postcss": "^4.1.14",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
@@ -83,7 +87,10 @@
     "@types/react": "^19.1.13",
     "@types/react-dom": "^19.1.9",
     "@vitejs/plugin-react": "^5.0.3",
+    "@vitest/browser-playwright": "^4.0.18",
+    "@vitest/coverage-v8": "^4.0.18",
     "autoprefixer": "^10.4.21",
+    "baseline-browser-mapping": "^2.10.8",
     "eslint": "^9.36.0",
     "eslint-plugin-react-hooks": "^5.2.0",
     "eslint-plugin-react-refresh": "^0.4.20",
@@ -94,12 +101,13 @@
     "postcss": "^8.5.6",
     "react": "^19.1.1",
     "react-dom": "^19.1.1",
-    "storybook": "^10.2.8",
+    "storybook": "^10.2.19",
     "tailwindcss": "^4.1.14",
     "typescript": "~5.8.3",
     "typescript-eslint": "^8.44.0",
     "vite": "^7.1.7",
     "vite-plugin-dts": "^4.5.4",
-    "vitest": "^4.0.18"
+    "vitest": "^4.0.18",
+    "eslint-plugin-storybook": "10.2.19"
   }
 }