@clubmed/trident-ui 2.0.0-alpha.2 → 2.0.0-alpha.4

package/examples/portal-demo.js

@@ -0,0 +1,33 @@
+"use client";
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import { Portal as a } from "../ui/Portal.js";
+import { useState as d } from "react";
+function n() {
+  const [r, o] = d(!1);
+  return /* @__PURE__ */ t("div", { className: "space-y-16", children: [
+    /* @__PURE__ */ t(
+      "button",
+      {
+        onClick: () => o(!r),
+        className: "rounded-md bg-blue-600 px-16 py-8 text-white hover:bg-blue-700",
+        children: [
+          r ? "Hide" : "Show",
+          " Portal Content"
+        ]
+      }
+    ),
+    r && /* @__PURE__ */ e(a, { target: "portal-demo-target", children: /* @__PURE__ */ e("div", { className: "rounded-md border border-gray-300 bg-white p-16 shadow-lg", children: /* @__PURE__ */ e("p", { className: "text-gray-900", children: "This content is rendered in a portal outside the normal DOM hierarchy." }) }) }),
+    /* @__PURE__ */ e(
+      "div",
+      {
+        id: "portal-demo-target",
+        className: "min-h-64 rounded-md border-2 border-dashed border-gray-400 p-16",
+        children: /* @__PURE__ */ e("p", { className: "mb-8 text-sm text-gray-600", children: "Portal Target Container:" })
+      }
+    )
+  ] });
+}
+export {
+  n as default
+};
+//# sourceMappingURL=portal-demo.js.map

package/examples/portal-demo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"portal-demo.js","sources":["../../lib/examples/portal-demo.tsx"],"sourcesContent":["'use client';\n\nimport { Portal } from '@/ui/Portal';\nimport { useState } from 'react';\n\nexport default function PortalDemo() {\n  const [showPortal, setShowPortal] = useState(false);\n\n  return (\n    <div className=\"space-y-16\">\n      <button\n        onClick={() => setShowPortal(!showPortal)}\n        className=\"rounded-md bg-blue-600 px-16 py-8 text-white hover:bg-blue-700\"\n      >\n        {showPortal ? 'Hide' : 'Show'} Portal Content\n      </button>\n\n      {showPortal && (\n        <Portal target=\"portal-demo-target\">\n          <div className=\"rounded-md border border-gray-300 bg-white p-16 shadow-lg\">\n            <p className=\"text-gray-900\">\n              This content is rendered in a portal outside the normal DOM hierarchy.\n            </p>\n          </div>\n        </Portal>\n      )}\n\n      <div\n        id=\"portal-demo-target\"\n        className=\"min-h-64 rounded-md border-2 border-dashed border-gray-400 p-16\"\n      >\n        <p className=\"mb-8 text-sm text-gray-600\">Portal Target Container:</p>\n      </div>\n    </div>\n  );\n}\n"],"names":["PortalDemo","showPortal","setShowPortal","useState","jsxs","jsx","Portal"],"mappings":";;;;AAKA,SAAwBA,IAAa;AACnC,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAAS,EAAK;AAElD,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAU,cACb,UAAA;AAAA,IAAA,gBAAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAAS,MAAMF,EAAc,CAACD,CAAU;AAAA,QACxC,WAAU;AAAA,QAET,UAAA;AAAA,UAAAA,IAAa,SAAS;AAAA,UAAO;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAG/BA,KACC,gBAAAI,EAACC,GAAA,EAAO,QAAO,sBACb,UAAA,gBAAAD,EAAC,OAAA,EAAI,WAAU,6DACb,4BAAC,KAAA,EAAE,WAAU,iBAAgB,UAAA,yEAAA,CAE7B,GACF,GACF;AAAA,IAGF,gBAAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAG;AAAA,QACH,WAAU;AAAA,QAEV,UAAA,gBAAAA,EAAC,KAAA,EAAE,WAAU,8BAA6B,UAAA,2BAAA,CAAwB;AAAA,MAAA;AAAA,IAAA;AAAA,EACpE,GACF;AAEJ;"}

package/examples/prose-demo.d.ts

@@ -0,0 +1 @@
+export default function ProseDemo(): import("react/jsx-runtime").JSX.Element;

package/examples/prose-demo.js

@@ -0,0 +1,17 @@
+import { jsx as t } from "react/jsx-runtime";
+import { Prose as e } from "../ui/Prose.js";
+function s() {
+  return /* @__PURE__ */ t(e, { text: `
+    <h2>Welcome to Prose</h2>
+    <p>The Prose component renders rich HTML content with automatic typography styling.</p>
+    <ul>
+      <li>Supports all standard HTML elements</li>
+      <li>Applies beautiful default styles</li>
+      <li>Perfect for blog posts and articles</li>
+    </ul>
+  `, className: "max-w-prose" });
+}
+export {
+  s as default
+};
+//# sourceMappingURL=prose-demo.js.map

package/examples/prose-demo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"prose-demo.js","sources":["../../lib/examples/prose-demo.tsx"],"sourcesContent":["import { Prose } from '@/ui/Prose';\n\nexport default function ProseDemo() {\n  const htmlContent = `\n    <h2>Welcome to Prose</h2>\n    <p>The Prose component renders rich HTML content with automatic typography styling.</p>\n    <ul>\n      <li>Supports all standard HTML elements</li>\n      <li>Applies beautiful default styles</li>\n      <li>Perfect for blog posts and articles</li>\n    </ul>\n  `;\n\n  return <Prose text={htmlContent} className=\"max-w-prose\" />;\n}\n"],"names":["ProseDemo","jsx","Prose"],"mappings":";;AAEA,SAAwBA,IAAY;AAWlC,SAAO,gBAAAC,EAACC,GAAA,EAAM,MAVM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAUa,WAAU,eAAc;AAC3D;"}

package/examples/radio-demo.d.ts

@@ -0,0 +1 @@
+export default function RadioDemo(): import("react/jsx-runtime").JSX.Element;

package/examples/radio-demo.js

@@ -0,0 +1,10 @@
+"use client";
+import { jsx as o } from "react/jsx-runtime";
+import { Radio as e } from "../ui/forms/radios/Radio.js";
+function n() {
+  return /* @__PURE__ */ o(e, { name: "option", value: "option1", checked: !1, children: "Select this option" });
+}
+export {
+  n as default
+};
+//# sourceMappingURL=radio-demo.js.map

package/examples/radio-demo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-demo.js","sources":["../../lib/examples/radio-demo.tsx"],"sourcesContent":["'use client';\n\nimport { Radio } from '@/ui/forms/radios/Radio';\n\nexport default function RadioDemo() {\n  return (\n    <Radio name=\"option\" value=\"option1\" checked={false}>\n      Select this option\n    </Radio>\n  );\n}\n"],"names":["RadioDemo","jsx","Radio"],"mappings":";;;AAIA,SAAwBA,IAAY;AAClC,SACE,gBAAAC,EAACC,KAAM,MAAK,UAAS,OAAM,WAAU,SAAS,IAAO,UAAA,qBAAA,CAErD;AAEJ;"}

package/examples/radio-group-demo.d.ts

@@ -0,0 +1 @@
+export default function RadioGroupDemo(): import("react/jsx-runtime").JSX.Element;

package/examples/radio-group-demo.js

@@ -0,0 +1,25 @@
+"use client";
+import { jsxs as r, jsx as o } from "react/jsx-runtime";
+import { RadioGroup as p } from "../ui/forms/radios/RadioGroup.js";
+import { Radio as e } from "../ui/forms/radios/Radio.js";
+import { useState as a } from "react";
+function c() {
+  const [i, t] = a("option1");
+  return /* @__PURE__ */ r(
+    p,
+    {
+      value: i,
+      onChange: (u, n) => t(n),
+      name: "demo-radio-group",
+      children: [
+        /* @__PURE__ */ o(e, { value: "option1", children: "Option 1" }),
+        /* @__PURE__ */ o(e, { value: "option2", children: "Option 2" }),
+        /* @__PURE__ */ o(e, { value: "option3", children: "Option 3" })
+      ]
+    }
+  );
+}
+export {
+  c as default
+};
+//# sourceMappingURL=radio-group-demo.js.map

package/examples/radio-group-demo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group-demo.js","sources":["../../lib/examples/radio-group-demo.tsx"],"sourcesContent":["'use client';\n\nimport { RadioGroup } from '@/ui/forms/radios/RadioGroup';\nimport { Radio } from '@/ui/forms/radios/Radio';\nimport { useState } from 'react';\n\nexport default function RadioGroupDemo() {\n  const [value, setValue] = useState('option1');\n\n  return (\n    <RadioGroup\n      value={value}\n      onChange={(_, newValue) => setValue(newValue)}\n      name=\"demo-radio-group\"\n    >\n      <Radio value=\"option1\">Option 1</Radio>\n      <Radio value=\"option2\">Option 2</Radio>\n      <Radio value=\"option3\">Option 3</Radio>\n    </RadioGroup>\n  );\n}\n"],"names":["RadioGroupDemo","value","setValue","useState","jsxs","RadioGroup","_","newValue","jsx","Radio"],"mappings":";;;;;AAMA,SAAwBA,IAAiB;AACvC,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAS,SAAS;AAE5C,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAAJ;AAAA,MACA,UAAU,CAACK,GAAGC,MAAaL,EAASK,CAAQ;AAAA,MAC5C,MAAK;AAAA,MAEL,UAAA;AAAA,QAAA,gBAAAC,EAACC,GAAA,EAAM,OAAM,WAAU,UAAA,YAAQ;AAAA,QAC/B,gBAAAD,EAACC,GAAA,EAAM,OAAM,WAAU,UAAA,YAAQ;AAAA,QAC/B,gBAAAD,EAACC,GAAA,EAAM,OAAM,WAAU,UAAA,WAAA,CAAQ;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGrC;"}

package/examples/range-demo.d.ts

@@ -0,0 +1 @@
+export default function RangeDemo(): import("react/jsx-runtime").JSX.Element;

package/examples/range-demo.js

@@ -0,0 +1,23 @@
+"use client";
+import { jsx as e } from "react/jsx-runtime";
+import { Range as a } from "../ui/forms/Range.js";
+function o() {
+  return /* @__PURE__ */ e(
+    a,
+    {
+      options: [
+        { value: 0, label: "$0" },
+        { value: 25, label: "$25" },
+        { value: 50, label: "$50" },
+        { value: 75, label: "$75" },
+        { value: 100, label: "$100" }
+      ],
+      ariaLabel: "Price range",
+      className: "max-w-md"
+    }
+  );
+}
+export {
+  o as default
+};
+//# sourceMappingURL=range-demo.js.map

package/examples/range-demo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"range-demo.js","sources":["../../lib/examples/range-demo.tsx"],"sourcesContent":["'use client';\n\nimport { Range } from '@/ui/forms/Range';\n\nexport default function RangeDemo() {\n  return (\n    <Range\n      options={[\n        { value: 0, label: '$0' },\n        { value: 25, label: '$25' },\n        { value: 50, label: '$50' },\n        { value: 75, label: '$75' },\n        { value: 100, label: '$100' },\n      ]}\n      ariaLabel=\"Price range\"\n      className=\"max-w-md\"\n    />\n  );\n}\n"],"names":["RangeDemo","jsx","Range"],"mappings":";;;AAIA,SAAwBA,IAAY;AAClC,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAS;AAAA,QACP,EAAE,OAAO,GAAG,OAAO,KAAA;AAAA,QACnB,EAAE,OAAO,IAAI,OAAO,MAAA;AAAA,QACpB,EAAE,OAAO,IAAI,OAAO,MAAA;AAAA,QACpB,EAAE,OAAO,IAAI,OAAO,MAAA;AAAA,QACpB,EAAE,OAAO,KAAK,OAAO,OAAA;AAAA,MAAO;AAAA,MAE9B,WAAU;AAAA,MACV,WAAU;AAAA,IAAA;AAAA,EAAA;AAGhB;"}

package/examples/select-demo.d.ts

@@ -0,0 +1 @@
+export default function SelectDemo(): import("react/jsx-runtime").JSX.Element;

package/examples/select-demo.js

@@ -0,0 +1,16 @@
+"use client";
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
+import { Select as n } from "../ui/forms/Select.js";
+function r() {
+  return /* @__PURE__ */ o(n, { label: "Country", description: "Select your country", children: [
+    /* @__PURE__ */ e("option", { value: "", children: "Choose a country" }),
+    /* @__PURE__ */ e("option", { value: "us", children: "United States" }),
+    /* @__PURE__ */ e("option", { value: "uk", children: "United Kingdom" }),
+    /* @__PURE__ */ e("option", { value: "ca", children: "Canada" }),
+    /* @__PURE__ */ e("option", { value: "fr", children: "France" })
+  ] });
+}
+export {
+  r as default
+};
+//# sourceMappingURL=select-demo.js.map

package/examples/select-demo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-demo.js","sources":["../../lib/examples/select-demo.tsx"],"sourcesContent":["'use client';\n\nimport { Select } from '@/ui/forms/Select';\n\nexport default function SelectDemo() {\n  return (\n    <Select label=\"Country\" description=\"Select your country\">\n      <option value=\"\">Choose a country</option>\n      <option value=\"us\">United States</option>\n      <option value=\"uk\">United Kingdom</option>\n      <option value=\"ca\">Canada</option>\n      <option value=\"fr\">France</option>\n    </Select>\n  );\n}\n"],"names":["SelectDemo","jsxs","Select","jsx"],"mappings":";;;AAIA,SAAwBA,IAAa;AACnC,SACE,gBAAAC,EAACC,GAAA,EAAO,OAAM,WAAU,aAAY,uBAClC,UAAA;AAAA,IAAA,gBAAAC,EAAC,UAAA,EAAO,OAAM,IAAG,UAAA,oBAAgB;AAAA,IACjC,gBAAAA,EAAC,UAAA,EAAO,OAAM,MAAK,UAAA,iBAAa;AAAA,IAChC,gBAAAA,EAAC,UAAA,EAAO,OAAM,MAAK,UAAA,kBAAc;AAAA,IACjC,gBAAAA,EAAC,UAAA,EAAO,OAAM,MAAK,UAAA,UAAM;AAAA,IACzB,gBAAAA,EAAC,UAAA,EAAO,OAAM,MAAK,UAAA,SAAA,CAAM;AAAA,EAAA,GAC3B;AAEJ;"}

package/examples/spinner-demo.d.ts

@@ -0,0 +1 @@
+export default function SpinnerDemo(): import("react/jsx-runtime").JSX.Element;

package/examples/spinner-demo.js

@@ -0,0 +1,9 @@
+import { jsx as r } from "react/jsx-runtime";
+import { Spinner as e } from "../ui/Spinner.js";
+function m() {
+  return /* @__PURE__ */ r(e, { className: "w-12" });
+}
+export {
+  m as default
+};
+//# sourceMappingURL=spinner-demo.js.map

package/examples/spinner-demo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"spinner-demo.js","sources":["../../lib/examples/spinner-demo.tsx"],"sourcesContent":["import { Spinner } from '@/ui/Spinner';\n\nexport default function SpinnerDemo() {\n  return <Spinner className=\"w-12\" />;\n}\n"],"names":["SpinnerDemo","jsx","Spinner"],"mappings":";;AAEA,SAAwBA,IAAc;AACpC,SAAO,gBAAAC,EAACC,GAAA,EAAQ,WAAU,OAAA,CAAO;AACnC;"}

package/examples/switch-demo.d.ts

@@ -0,0 +1 @@
+export default function SwitchDemo(): import("react/jsx-runtime").JSX.Element;

package/examples/switch-demo.js

@@ -0,0 +1,12 @@
+"use client";
+import { jsx as o } from "react/jsx-runtime";
+import { useState as i } from "react";
+import { Switch as r } from "../ui/forms/Switch.js";
+function l() {
+  const [e, t] = i(!1);
+  return /* @__PURE__ */ o(r, { checked: e, onChange: (s, n) => t(n), children: "Enable notifications" });
+}
+export {
+  l as default
+};
+//# sourceMappingURL=switch-demo.js.map

package/examples/switch-demo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch-demo.js","sources":["../../lib/examples/switch-demo.tsx"],"sourcesContent":["'use client';\n\nimport { useState } from 'react';\nimport { Switch } from '@/ui/forms/Switch';\n\nexport default function SwitchDemo() {\n  const [isEnabled, setIsEnabled] = useState(false);\n\n  return (\n    <Switch checked={isEnabled} onChange={(_, value) => setIsEnabled(value)}>\n      Enable notifications\n    </Switch>\n  );\n}\n"],"names":["SwitchDemo","isEnabled","setIsEnabled","useState","jsx","Switch","_","value"],"mappings":";;;;AAKA,SAAwBA,IAAa;AACnC,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK;AAEhD,SACE,gBAAAC,EAACC,GAAA,EAAO,SAASJ,GAAW,UAAU,CAACK,GAAGC,MAAUL,EAAaK,CAAK,GAAG,UAAA,uBAAA,CAEzE;AAEJ;"}

package/examples/tabs-demo.d.ts

@@ -0,0 +1 @@
+export default function TabsDemo(): import("react/jsx-runtime").JSX.Element;

package/examples/tabs-demo.js

@@ -0,0 +1,27 @@
+import { jsxs as n, jsx as a } from "react/jsx-runtime";
+import { Tabs as u, TabList as i, Tab as t, TabsBody as b, TabPanel as c } from "../ui/tabs/Tabs.js";
+function m() {
+  const l = new Array(3).fill(void 0).map((e, r) => ({ label: `${r + 1}`, value: r + 1 })), s = (e) => {
+    switch (e % 3) {
+      case 0:
+        return "bg-lightSand";
+      case 1:
+        return "bg-saffron";
+      case 2:
+        return "bg-lavender";
+      default:
+        return "bg-sienna";
+    }
+  };
+  return /* @__PURE__ */ n(u, { selected: 1, children: [
+    /* @__PURE__ */ a(i, { children: l.map((e) => /* @__PURE__ */ a(t, { label: `Tab - ${e.label}`, value: e.value }, e.label)) }),
+    /* @__PURE__ */ a(b, { children: l.map((e) => /* @__PURE__ */ a(c, { value: e.value, children: /* @__PURE__ */ n("div", { className: `p-16 ${s(e.value)}`, children: [
+      "Panel - ",
+      e.label
+    ] }) }, e.label)) })
+  ] });
+}
+export {
+  m as default
+};
+//# sourceMappingURL=tabs-demo.js.map

package/examples/tabs-demo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabs-demo.js","sources":["../../lib/examples/tabs-demo.tsx"],"sourcesContent":["import { Tab, TabList, TabPanel, Tabs, TabsBody } from '../ui/tabs/Tabs';\n\nexport default function TabsDemo() {\n  const tabs = new Array(3).fill(undefined).map((_, n) => ({ label: `${n + 1}`, value: n + 1 }));\n\n  const bgs = (count: number) => {\n    switch (count % 3) {\n      case 0:\n        return 'bg-lightSand';\n      case 1:\n        return 'bg-saffron';\n      case 2:\n        return 'bg-lavender';\n      default:\n        return 'bg-sienna';\n    }\n  };\n  return (\n    <Tabs selected={1}>\n      <TabList>\n        {tabs.map((tab) => {\n          return <Tab key={tab.label} label={`Tab - ${tab.label}`} value={tab.value} />;\n        })}\n      </TabList>\n      <TabsBody>\n        {tabs.map((tab) => {\n          return (\n            <TabPanel key={tab.label} value={tab.value}>\n              <div className={`p-16 ${bgs(tab.value)}`}>Panel - {tab.label}</div>\n            </TabPanel>\n          );\n        })}\n      </TabsBody>\n    </Tabs>\n  );\n}\n"],"names":["TabsDemo","tabs","_","n","bgs","count","jsxs","Tabs","jsx","TabList","tab","Tab","TabsBody","TabPanel"],"mappings":";;AAEA,SAAwBA,IAAW;AACjC,QAAMC,IAAO,IAAI,MAAM,CAAC,EAAE,KAAK,MAAS,EAAE,IAAI,CAACC,GAAGC,OAAO,EAAE,OAAO,GAAGA,IAAI,CAAC,IAAI,OAAOA,IAAI,EAAA,EAAI,GAEvFC,IAAM,CAACC,MAAkB;AAC7B,YAAQA,IAAQ,GAAA;AAAA,MACd,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT,KAAK;AACH,eAAO;AAAA,MACT;AACE,eAAO;AAAA,IAAA;AAAA,EAEb;AACA,SACE,gBAAAC,EAACC,GAAA,EAAK,UAAU,GACd,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EACE,UAAAR,EAAK,IAAI,CAACS,MACF,gBAAAF,EAACG,GAAA,EAAoB,OAAO,SAASD,EAAI,KAAK,IAAI,OAAOA,EAAI,MAAA,GAAnDA,EAAI,KAAsD,CAC5E,EAAA,CACH;AAAA,IACA,gBAAAF,EAACI,GAAA,EACE,UAAAX,EAAK,IAAI,CAACS,MAEP,gBAAAF,EAACK,GAAA,EAAyB,OAAOH,EAAI,OACnC,UAAA,gBAAAJ,EAAC,OAAA,EAAI,WAAW,QAAQF,EAAIM,EAAI,KAAK,CAAC,IAAI,UAAA;AAAA,MAAA;AAAA,MAASA,EAAI;AAAA,IAAA,GAAM,EAAA,GADhDA,EAAI,KAEnB,CAEH,EAAA,CACH;AAAA,EAAA,GACF;AAEJ;"}

package/examples/tabs-within-tabs-demo.d.ts

@@ -0,0 +1 @@
+export default function TabsWithinTabsDemo(): import("react/jsx-runtime").JSX.Element;

package/examples/tabs-within-tabs-demo.js

@@ -0,0 +1,60 @@
+"use client";
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import { Tabs as n, TabList as r, Tab as c, TabsBody as d, TabPanel as a } from "../ui/tabs/Tabs.js";
+function u() {
+  const i = (t) => {
+    console.log("Selected tab:", t.value);
+  };
+  return /* @__PURE__ */ l(n, { compacted: !0, selected: 1, children: [
+    /* @__PURE__ */ l(r, { children: [
+      /* @__PURE__ */ e(c, { label: "Au ski", value: 1, onSelect: i }),
+      /* @__PURE__ */ e(c, { label: "Au soleil", value: 2, onSelect: i }),
+      /* @__PURE__ */ e(c, { label: "En croisière", value: 3, onSelect: i })
+    ] }),
+    /* @__PURE__ */ l(d, { children: [
+      /* @__PURE__ */ e(a, { value: 1, children: /* @__PURE__ */ l("div", { className: "bg-lightSand p-16", children: [
+        /* @__PURE__ */ e("h4", { children: "Au ski" }),
+        /* @__PURE__ */ l(n, { selected: 2, compacted: !0, children: [
+          /* @__PURE__ */ l(r, { constrained: !0, children: [
+            /* @__PURE__ */ e(c, { label: "Sur les pistes", theme: "black", value: 1, onSelect: i }),
+            /* @__PURE__ */ e(c, { label: "A la patinoire", theme: "black", value: 2, onSelect: i })
+          ] }),
+          /* @__PURE__ */ l(d, { children: [
+            /* @__PURE__ */ e(a, { value: 1, children: /* @__PURE__ */ e("div", { children: "Sur les pistes" }) }),
+            /* @__PURE__ */ e(a, { value: 2, children: /* @__PURE__ */ e("div", { children: "A la patinoire" }) })
+          ] })
+        ] })
+      ] }) }),
+      /* @__PURE__ */ e(a, { value: 2, children: /* @__PURE__ */ l("div", { className: "bg-saffron p-16", children: [
+        /* @__PURE__ */ e("h4", { children: "Au soleil" }),
+        /* @__PURE__ */ l(n, { selected: 2, compacted: !0, children: [
+          /* @__PURE__ */ l(r, { constrained: !0, children: [
+            /* @__PURE__ */ e(c, { label: "A la plage", theme: "black", value: 1, onSelect: i }),
+            /* @__PURE__ */ e(c, { label: "A la piscine", theme: "black", value: 2, onSelect: i })
+          ] }),
+          /* @__PURE__ */ l(d, { children: [
+            /* @__PURE__ */ e(a, { value: 1, children: /* @__PURE__ */ e("div", { children: "A la plage" }) }),
+            /* @__PURE__ */ e(a, { value: 2, children: /* @__PURE__ */ e("div", { children: "A la piscine" }) })
+          ] })
+        ] })
+      ] }) }),
+      /* @__PURE__ */ e(a, { value: 3, children: /* @__PURE__ */ l("div", { className: "bg-lavender p-16", children: [
+        /* @__PURE__ */ e("h4", { children: "En croisière" }),
+        /* @__PURE__ */ l(n, { selected: 2, compacted: !0, children: [
+          /* @__PURE__ */ l(r, { constrained: !0, children: [
+            /* @__PURE__ */ e(c, { label: "Au Karting", theme: "black", value: 1, onSelect: i }),
+            /* @__PURE__ */ e(c, { label: "Au minigolf", theme: "black", value: 2, onSelect: i })
+          ] }),
+          /* @__PURE__ */ l(d, { children: [
+            /* @__PURE__ */ e(a, { value: 1, children: /* @__PURE__ */ e("div", { children: "Au Karting" }) }),
+            /* @__PURE__ */ e(a, { value: 2, children: /* @__PURE__ */ e("div", { children: "Au minigolf" }) })
+          ] })
+        ] })
+      ] }) })
+    ] })
+  ] });
+}
+export {
+  u as default
+};
+//# sourceMappingURL=tabs-within-tabs-demo.js.map

package/examples/tabs-within-tabs-demo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabs-within-tabs-demo.js","sources":["../../lib/examples/tabs-within-tabs-demo.tsx"],"sourcesContent":["'use client';\n\nimport { Tab, TabList, TabPanel, Tabs, TabsBody } from '../ui/tabs/Tabs';\n\nexport default function TabsWithinTabsDemo() {\n  const handleSelect = (context: { value: number }) => {\n    console.log('Selected tab:', context.value);\n  };\n\n  return (\n    <Tabs compacted selected={1}>\n      <TabList>\n        <Tab label=\"Au ski\" value={1} onSelect={handleSelect} />\n        <Tab label=\"Au soleil\" value={2} onSelect={handleSelect} />\n        <Tab label=\"En croisière\" value={3} onSelect={handleSelect} />\n      </TabList>\n      <TabsBody>\n        <TabPanel value={1}>\n          <div className=\"bg-lightSand p-16\">\n            <h4>Au ski</h4>\n            <Tabs selected={2} compacted>\n              <TabList constrained>\n                <Tab label=\"Sur les pistes\" theme=\"black\" value={1} onSelect={handleSelect} />\n                <Tab label=\"A la patinoire\" theme=\"black\" value={2} onSelect={handleSelect} />\n              </TabList>\n              <TabsBody>\n                <TabPanel value={1}>\n                  <div>Sur les pistes</div>\n                </TabPanel>\n                <TabPanel value={2}>\n                  <div>A la patinoire</div>\n                </TabPanel>\n              </TabsBody>\n            </Tabs>\n          </div>\n        </TabPanel>\n        <TabPanel value={2}>\n          <div className=\"bg-saffron p-16\">\n            <h4>Au soleil</h4>\n            <Tabs selected={2} compacted>\n              <TabList constrained>\n                <Tab label=\"A la plage\" theme=\"black\" value={1} onSelect={handleSelect} />\n                <Tab label=\"A la piscine\" theme=\"black\" value={2} onSelect={handleSelect} />\n              </TabList>\n              <TabsBody>\n                <TabPanel value={1}>\n                  <div>A la plage</div>\n                </TabPanel>\n                <TabPanel value={2}>\n                  <div>A la piscine</div>\n                </TabPanel>\n              </TabsBody>\n            </Tabs>\n          </div>\n        </TabPanel>\n        <TabPanel value={3}>\n          <div className=\"bg-lavender p-16\">\n            <h4>En croisière</h4>\n            <Tabs selected={2} compacted>\n              <TabList constrained>\n                <Tab label=\"Au Karting\" theme=\"black\" value={1} onSelect={handleSelect} />\n                <Tab label=\"Au minigolf\" theme=\"black\" value={2} onSelect={handleSelect} />\n              </TabList>\n              <TabsBody>\n                <TabPanel value={1}>\n                  <div>Au Karting</div>\n                </TabPanel>\n                <TabPanel value={2}>\n                  <div>Au minigolf</div>\n                </TabPanel>\n              </TabsBody>\n            </Tabs>\n          </div>\n        </TabPanel>\n      </TabsBody>\n    </Tabs>\n  );\n}\n"],"names":["TabsWithinTabsDemo","handleSelect","context","jsxs","Tabs","TabList","jsx","Tab","TabsBody","TabPanel"],"mappings":"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"}

package/examples/tag-demo.d.ts

@@ -0,0 +1 @@
+export default function TagDemo(): import("react/jsx-runtime").JSX.Element;

package/examples/tag-demo.js

@@ -0,0 +1,11 @@
+"use client";
+import { jsx as e } from "react/jsx-runtime";
+import { IconsFixture as o } from "@clubmed/trident-icons/tests/IconsFixture";
+import { Tag as r } from "../ui/Tag.js";
+function n() {
+  return /* @__PURE__ */ e(o, { children: /* @__PURE__ */ e(r, { label: "New Feature", icon: "Diamond", theme: "both" }) });
+}
+export {
+  n as default
+};
+//# sourceMappingURL=tag-demo.js.map

package/examples/tag-demo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag-demo.js","sources":["../../lib/examples/tag-demo.tsx"],"sourcesContent":["'use client';\n\nimport { IconsFixture } from '@clubmed/trident-icons/tests/IconsFixture';\n\nimport { Tag } from '@/ui/Tag';\n\nexport default function TagDemo() {\n  return (\n    <IconsFixture>\n      <Tag label=\"New Feature\" icon=\"Diamond\" theme=\"both\" />\n    </IconsFixture>\n  );\n}\n"],"names":["TagDemo","jsx","IconsFixture","Tag"],"mappings":";;;;AAMA,SAAwBA,IAAU;AAChC,SACE,gBAAAC,EAACC,GAAA,EACC,UAAA,gBAAAD,EAACE,GAAA,EAAI,OAAM,eAAc,MAAK,WAAU,OAAM,OAAA,CAAO,EAAA,CACvD;AAEJ;"}

package/examples/text-field-demo.d.ts

@@ -0,0 +1 @@
+export default function TextFieldDemo(): import("react/jsx-runtime").JSX.Element;

package/examples/text-field-demo.js

@@ -0,0 +1,18 @@
+"use client";
+import { jsx as e } from "react/jsx-runtime";
+import { TextField as r } from "../ui/forms/TextField.js";
+function o() {
+  return /* @__PURE__ */ e(
+    r,
+    {
+      label: "Email Address",
+      description: "Enter your email address",
+      placeholder: "you@example.com",
+      className: "max-w-sm"
+    }
+  );
+}
+export {
+  o as default
+};
+//# sourceMappingURL=text-field-demo.js.map

package/examples/text-field-demo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-field-demo.js","sources":["../../lib/examples/text-field-demo.tsx"],"sourcesContent":["'use client';\n\nimport { TextField } from '@/ui/forms/TextField';\n\nexport default function TextFieldDemo() {\n  return (\n    <TextField\n      label=\"Email Address\"\n      description=\"Enter your email address\"\n      placeholder=\"you@example.com\"\n      className=\"max-w-sm\"\n    />\n  );\n}\n"],"names":["TextFieldDemo","jsx","TextField"],"mappings":";;;AAIA,SAAwBA,IAAgB;AACtC,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,aAAY;AAAA,MACZ,aAAY;AAAA,MACZ,WAAU;AAAA,IAAA;AAAA,EAAA;AAGhB;"}

package/examples/validation-message-demo.d.ts

@@ -0,0 +1 @@
+export default function ValidationMessageDemo(): import("react/jsx-runtime").JSX.Element;

package/examples/validation-message-demo.js

@@ -0,0 +1,14 @@
+"use client";
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
+import { ValidationMessage as a } from "../ui/forms/password/ValidationMessage.js";
+function r() {
+  return /* @__PURE__ */ s("div", { className: "flex flex-col gap-16", children: [
+    /* @__PURE__ */ e(a, { label: "At least 8 characters", status: "success" }),
+    /* @__PURE__ */ e(a, { label: "Include a number", status: "error" }),
+    /* @__PURE__ */ e(a, { label: "Include a special character", status: "default" })
+  ] });
+}
+export {
+  r as default
+};
+//# sourceMappingURL=validation-message-demo.js.map

package/examples/validation-message-demo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"validation-message-demo.js","sources":["../../lib/examples/validation-message-demo.tsx"],"sourcesContent":["'use client';\n\nimport { ValidationMessage } from '@/ui/forms/password/ValidationMessage';\n\nexport default function ValidationMessageDemo() {\n  return (\n    <div className=\"flex flex-col gap-16\">\n      <ValidationMessage label=\"At least 8 characters\" status=\"success\" />\n      <ValidationMessage label=\"Include a number\" status=\"error\" />\n      <ValidationMessage label=\"Include a special character\" status=\"default\" />\n    </div>\n  );\n}\n"],"names":["ValidationMessageDemo","jsxs","jsx","ValidationMessage"],"mappings":";;;AAIA,SAAwBA,IAAwB;AAC9C,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAU,wBACb,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAA,EAAkB,OAAM,yBAAwB,QAAO,WAAU;AAAA,IAClE,gBAAAD,EAACC,GAAA,EAAkB,OAAM,oBAAmB,QAAO,SAAQ;AAAA,IAC3D,gBAAAD,EAACC,GAAA,EAAkB,OAAM,+BAA8B,QAAO,UAAA,CAAU;AAAA,EAAA,GAC1E;AAEJ;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clubmed/trident-ui",
-  "version": "2.0.0-alpha.2",
+  "version": "2.0.0-alpha.4",
   "type": "module",
   "description": "Shared ClubMed React UI components",
   "keywords": [

package/ui/contexts/TabControl.d.ts

@@ -37,16 +37,6 @@ interface TabControl<T extends HTMLElement = HTMLElement> extends TabsState<T> {
 export declare const TabControlContext: import('react').Context<TabControl<HTMLElement>>;
 export interface TabsProviderProps {
     selected?: number;
-    /**
-     * The selected tab value
-     * @deprecated Min props as no effect on the Tabs component and will be removed in future versions
-     */
-    min?: number;
-    /**
-     * The selected tab value
-     * @deprecated Max props as no effect on the Tabs component and will be removed in future versions
-     */
-    max?: number;
 }
 export declare function TabsProvider({ selected, children }: PropsWithChildren<TabsProviderProps>): import("react/jsx-runtime").JSX.Element;
 export {};

package/ui/contexts/TabControl.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabControl.js","sources":["../../../lib/ui/contexts/TabControl.tsx"],"sourcesContent":["'use client';\n\nimport {\n  createContext,\n  type Dispatch,\n  type PropsWithChildren,\n  type RefObject,\n  useCallback,\n  useId,\n  useReducer,\n} from 'react';\n\ntype RefTab<T extends HTMLElement = HTMLElement> = RefObject<T>;\ntype RefTabs<T extends HTMLElement = HTMLElement> = Map<number, RefTab<T>>;\n\ntype TabsUpdateAction = {\n  type: 'update';\n  payload: number;\n};\n\ntype TabsRegisterAction<T extends HTMLElement = HTMLElement> = {\n  type: 'register';\n  payload: { value: number; ref: RefObject<T> };\n};\n\ntype TabsUnregisterAction = {\n  type: 'unregister';\n  payload: { value: number };\n};\n\ntype TabsAction<T extends HTMLElement = HTMLElement> =\n  | { type: 'start' | 'end' | 'previous' | 'next' }\n  | TabsUpdateAction\n  | TabsRegisterAction<T>\n  | TabsUnregisterAction;\n\ninterface TabsState<T extends HTMLElement = HTMLElement> {\n  uid: string;\n  value: number;\n  refs: RefTabs<T>;\n}\n\ninterface TabControl<T extends HTMLElement = HTMLElement> extends TabsState<T> {\n  uid: string;\n  value: number;\n  refs: RefTabs<T>;\n  dispatch: Dispatch<TabsAction>;\n  register: (value: number, ref: RefTab<T>) => void;\n  unregister: (value: number) => void;\n}\n\nfunction next(state: TabsState) {\n  const keys = [...state.refs.keys()];\n  const index = keys.findIndex((value) => value === state.value);\n  const nextIndex = (index + 1) % keys.length;\n\n  return { ...state, value: keys[nextIndex] };\n}\n\nfunction previous(state: TabsState) {\n  const keys = [...state.refs.keys()];\n  const index = keys.findIndex((value) => value === state.value);\n  const previousIndex = (index - 1 + keys.length) % keys.length;\n\n  return { ...state, value: keys[previousIndex] };\n}\n\nfunction start(state: TabsState) {\n  const keys = [...state.refs.keys()];\n  const firstIndex = keys[0];\n\n  return {\n    ...state,\n    value: firstIndex,\n  };\n}\n\nfunction end(state: TabsState) {\n  const keys = [...state.refs.keys()];\n  const lastIndex = keys[keys.length - 1];\n\n  return {\n    ...state,\n    value: lastIndex,\n  };\n}\n\nfunction unregister(state: TabsState, action: TabsUnregisterAction) {\n  const deletedRefs = new Map(state.refs);\n  deletedRefs.delete(action.payload.value);\n\n  return {\n    ...state,\n    refs: deletedRefs,\n  };\n}\n\nfunction register(state: TabsState, action: TabsRegisterAction) {\n  return {\n    ...state,\n    ...(state.value === -1 && { value: action.payload.value }),\n    refs: new Map(state.refs).set(action.payload.value, action.payload.ref),\n  };\n}\n\nfunction update(state: TabsState, action: TabsUpdateAction) {\n  return { ...state, value: action.payload };\n}\n\nconst actions = {\n  next,\n  previous,\n  start,\n  end,\n  register,\n  unregister,\n  update,\n} as const;\n\nfunction tabsReducer(state: TabsState, action: TabsAction): TabsState {\n  if (action.type in actions) {\n    const actionFunction = actions[action.type] as (\n      state: TabsState,\n      action: TabsAction,\n    ) => TabsState;\n\n    return actionFunction(state, action);\n  }\n\n  return state;\n}\n\nexport const TabControlContext = createContext<TabControl>({\n  uid: '',\n  value: 0,\n  refs: new Map(),\n  dispatch: () => {\n    console.warn('Tab Controller Context dispatch used outside of Provider');\n  },\n  register: () => {\n    console.warn('Tab Controller Context register used outside of Provider');\n  },\n  unregister: () => {\n    console.warn('Tab Controller Context unregister used outside of Provider');\n  },\n});\n\nTabControlContext.displayName = 'TabControlContext';\n\nexport interface TabsProviderProps {\n  selected?: number;\n  /**\n   * The selected tab value\n   * @deprecated Min props as no effect on the Tabs component and will be removed in future versions\n   */\n  min?: number;\n\n  /**\n   * The selected tab value\n   * @deprecated Max props as no effect on the Tabs component and will be removed in future versions\n   */\n  max?: number;\n}\n\nexport function TabsProvider({ selected, children }: PropsWithChildren<TabsProviderProps>) {\n  const uid = useId();\n  const [state, dispatch] = useReducer(tabsReducer, {\n    uid,\n    value: selected || -1,\n    refs: new Map(),\n  });\n\n  const register = useCallback(<T extends HTMLElement>(value: number, ref: RefTab<T>) => {\n    dispatch({ type: 'register', payload: { value, ref } });\n  }, []);\n\n  const unregister = useCallback((value: number) => {\n    dispatch({ type: 'unregister', payload: { value } });\n  }, []);\n\n  return (\n    <TabControlContext.Provider value={{ ...state, dispatch, register, unregister }}>\n      {children}\n    </TabControlContext.Provider>\n  );\n}\n"],"names":["next","state","keys","nextIndex","value","previous","previousIndex","start","firstIndex","end","lastIndex","unregister","action","deletedRefs","register","update","actions","tabsReducer","actionFunction","TabControlContext","createContext","TabsProvider","selected","children","uid","useId","dispatch","useReducer","useCallback","ref","jsx"],"mappings":";;;AAmDA,SAASA,EAAKC,GAAkB;AAC9B,QAAMC,IAAO,CAAC,GAAGD,EAAM,KAAK,MAAM,GAE5BE,KADQD,EAAK,UAAU,CAACE,MAAUA,MAAUH,EAAM,KAAK,IAClC,KAAKC,EAAK;AAErC,SAAO,EAAE,GAAGD,GAAO,OAAOC,EAAKC,CAAS,EAAA;AAC1C;AAEA,SAASE,EAASJ,GAAkB;AAClC,QAAMC,IAAO,CAAC,GAAGD,EAAM,KAAK,MAAM,GAE5BK,KADQJ,EAAK,UAAU,CAACE,MAAUA,MAAUH,EAAM,KAAK,IAC9B,IAAIC,EAAK,UAAUA,EAAK;AAEvD,SAAO,EAAE,GAAGD,GAAO,OAAOC,EAAKI,CAAa,EAAA;AAC9C;AAEA,SAASC,EAAMN,GAAkB;AAE/B,QAAMO,IADO,CAAC,GAAGP,EAAM,KAAK,MAAM,EACV,CAAC;AAEzB,SAAO;AAAA,IACL,GAAGA;AAAA,IACH,OAAOO;AAAA,EAAA;AAEX;AAEA,SAASC,EAAIR,GAAkB;AAC7B,QAAMC,IAAO,CAAC,GAAGD,EAAM,KAAK,MAAM,GAC5BS,IAAYR,EAAKA,EAAK,SAAS,CAAC;AAEtC,SAAO;AAAA,IACL,GAAGD;AAAA,IACH,OAAOS;AAAA,EAAA;AAEX;AAEA,SAASC,EAAWV,GAAkBW,GAA8B;AAClE,QAAMC,IAAc,IAAI,IAAIZ,EAAM,IAAI;AACtC,SAAAY,EAAY,OAAOD,EAAO,QAAQ,KAAK,GAEhC;AAAA,IACL,GAAGX;AAAA,IACH,MAAMY;AAAA,EAAA;AAEV;AAEA,SAASC,EAASb,GAAkBW,GAA4B;AAC9D,SAAO;AAAA,IACL,GAAGX;AAAA,IACH,GAAIA,EAAM,UAAU,MAAM,EAAE,OAAOW,EAAO,QAAQ,MAAA;AAAA,IAClD,MAAM,IAAI,IAAIX,EAAM,IAAI,EAAE,IAAIW,EAAO,QAAQ,OAAOA,EAAO,QAAQ,GAAG;AAAA,EAAA;AAE1E;AAEA,SAASG,EAAOd,GAAkBW,GAA0B;AAC1D,SAAO,EAAE,GAAGX,GAAO,OAAOW,EAAO,QAAA;AACnC;AAEA,MAAMI,IAAU;AAAA,EACd,MAAAhB;AAAA,EACA,UAAAK;AAAA,EACA,OAAAE;AAAA,EACA,KAAAE;AAAA,EACA,UAAAK;AAAA,EACA,YAAAH;AAAA,EACA,QAAAI;AACF;AAEA,SAASE,EAAYhB,GAAkBW,GAA+B;AACpE,MAAIA,EAAO,QAAQI,GAAS;AAC1B,UAAME,IAAiBF,EAAQJ,EAAO,IAAI;AAK1C,WAAOM,EAAejB,GAAOW,CAAM;AAAA,EACrC;AAEA,SAAOX;AACT;AAEO,MAAMkB,IAAoBC,EAA0B;AAAA,EACzD,KAAK;AAAA,EACL,OAAO;AAAA,EACP,0BAAU,IAAA;AAAA,EACV,UAAU,MAAM;AACd,YAAQ,KAAK,0DAA0D;AAAA,EACzE;AAAA,EACA,UAAU,MAAM;AACd,YAAQ,KAAK,0DAA0D;AAAA,EACzE;AAAA,EACA,YAAY,MAAM;AAChB,YAAQ,KAAK,4DAA4D;AAAA,EAC3E;AACF,CAAC;AAEDD,EAAkB,cAAc;AAiBzB,SAASE,EAAa,EAAE,UAAAC,GAAU,UAAAC,KAAkD;AACzF,QAAMC,IAAMC,EAAA,GACN,CAACxB,GAAOyB,CAAQ,IAAIC,EAAWV,GAAa;AAAA,IAChD,KAAAO;AAAA,IACA,OAAOF,KAAY;AAAA,IACnB,0BAAU,IAAA;AAAA,EAAI,CACf,GAEKR,IAAWc,EAAY,CAAwBxB,GAAeyB,MAAmB;AACrF,IAAAH,EAAS,EAAE,MAAM,YAAY,SAAS,EAAE,OAAAtB,GAAO,KAAAyB,EAAA,GAAO;AAAA,EACxD,GAAG,CAAA,CAAE,GAEClB,IAAaiB,EAAY,CAACxB,MAAkB;AAChD,IAAAsB,EAAS,EAAE,MAAM,cAAc,SAAS,EAAE,OAAAtB,EAAA,GAAS;AAAA,EACrD,GAAG,CAAA,CAAE;AAEL,SACE,gBAAA0B,EAACX,EAAkB,UAAlB,EAA2B,OAAO,EAAE,GAAGlB,GAAO,UAAAyB,GAAU,UAAAZ,GAAU,YAAAH,EAAAA,GAChE,UAAAY,EAAA,CACH;AAEJ;"}
+{"version":3,"file":"TabControl.js","sources":["../../../lib/ui/contexts/TabControl.tsx"],"sourcesContent":["'use client';\n\nimport {\n  createContext,\n  type Dispatch,\n  type PropsWithChildren,\n  type RefObject,\n  useCallback,\n  useId,\n  useReducer,\n} from 'react';\n\ntype RefTab<T extends HTMLElement = HTMLElement> = RefObject<T>;\ntype RefTabs<T extends HTMLElement = HTMLElement> = Map<number, RefTab<T>>;\n\ntype TabsUpdateAction = {\n  type: 'update';\n  payload: number;\n};\n\ntype TabsRegisterAction<T extends HTMLElement = HTMLElement> = {\n  type: 'register';\n  payload: { value: number; ref: RefObject<T> };\n};\n\ntype TabsUnregisterAction = {\n  type: 'unregister';\n  payload: { value: number };\n};\n\ntype TabsAction<T extends HTMLElement = HTMLElement> =\n  | { type: 'start' | 'end' | 'previous' | 'next' }\n  | TabsUpdateAction\n  | TabsRegisterAction<T>\n  | TabsUnregisterAction;\n\ninterface TabsState<T extends HTMLElement = HTMLElement> {\n  uid: string;\n  value: number;\n  refs: RefTabs<T>;\n}\n\ninterface TabControl<T extends HTMLElement = HTMLElement> extends TabsState<T> {\n  uid: string;\n  value: number;\n  refs: RefTabs<T>;\n  dispatch: Dispatch<TabsAction>;\n  register: (value: number, ref: RefTab<T>) => void;\n  unregister: (value: number) => void;\n}\n\nfunction next(state: TabsState) {\n  const keys = [...state.refs.keys()];\n  const index = keys.findIndex((value) => value === state.value);\n  const nextIndex = (index + 1) % keys.length;\n\n  return { ...state, value: keys[nextIndex] };\n}\n\nfunction previous(state: TabsState) {\n  const keys = [...state.refs.keys()];\n  const index = keys.findIndex((value) => value === state.value);\n  const previousIndex = (index - 1 + keys.length) % keys.length;\n\n  return { ...state, value: keys[previousIndex] };\n}\n\nfunction start(state: TabsState) {\n  const keys = [...state.refs.keys()];\n  const firstIndex = keys[0];\n\n  return {\n    ...state,\n    value: firstIndex,\n  };\n}\n\nfunction end(state: TabsState) {\n  const keys = [...state.refs.keys()];\n  const lastIndex = keys[keys.length - 1];\n\n  return {\n    ...state,\n    value: lastIndex,\n  };\n}\n\nfunction unregister(state: TabsState, action: TabsUnregisterAction) {\n  const deletedRefs = new Map(state.refs);\n  deletedRefs.delete(action.payload.value);\n\n  return {\n    ...state,\n    refs: deletedRefs,\n  };\n}\n\nfunction register(state: TabsState, action: TabsRegisterAction) {\n  return {\n    ...state,\n    ...(state.value === -1 && { value: action.payload.value }),\n    refs: new Map(state.refs).set(action.payload.value, action.payload.ref),\n  };\n}\n\nfunction update(state: TabsState, action: TabsUpdateAction) {\n  return { ...state, value: action.payload };\n}\n\nconst actions = {\n  next,\n  previous,\n  start,\n  end,\n  register,\n  unregister,\n  update,\n} as const;\n\nfunction tabsReducer(state: TabsState, action: TabsAction): TabsState {\n  if (action.type in actions) {\n    const actionFunction = actions[action.type] as (\n      state: TabsState,\n      action: TabsAction,\n    ) => TabsState;\n\n    return actionFunction(state, action);\n  }\n\n  return state;\n}\n\nexport const TabControlContext = createContext<TabControl>({\n  uid: '',\n  value: 0,\n  refs: new Map(),\n  dispatch: () => {\n    console.warn('Tab Controller Context dispatch used outside of Provider');\n  },\n  register: () => {\n    console.warn('Tab Controller Context register used outside of Provider');\n  },\n  unregister: () => {\n    console.warn('Tab Controller Context unregister used outside of Provider');\n  },\n});\n\nTabControlContext.displayName = 'TabControlContext';\n\nexport interface TabsProviderProps {\n  selected?: number;\n}\n\nexport function TabsProvider({ selected, children }: PropsWithChildren<TabsProviderProps>) {\n  const uid = useId();\n  const [state, dispatch] = useReducer(tabsReducer, {\n    uid,\n    value: selected || -1,\n    refs: new Map(),\n  });\n\n  const register = useCallback(<T extends HTMLElement>(value: number, ref: RefTab<T>) => {\n    dispatch({ type: 'register', payload: { value, ref } });\n  }, []);\n\n  const unregister = useCallback((value: number) => {\n    dispatch({ type: 'unregister', payload: { value } });\n  }, []);\n\n  return (\n    <TabControlContext.Provider value={{ ...state, dispatch, register, unregister }}>\n      {children}\n    </TabControlContext.Provider>\n  );\n}\n"],"names":["next","state","keys","nextIndex","value","previous","previousIndex","start","firstIndex","end","lastIndex","unregister","action","deletedRefs","register","update","actions","tabsReducer","actionFunction","TabControlContext","createContext","TabsProvider","selected","children","uid","useId","dispatch","useReducer","useCallback","ref","jsx"],"mappings":"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"}

package/ui/tabs/Tabs.js

@@ -3,7 +3,7 @@ import { jsx as i, jsxs as g } from "react/jsx-runtime";
 import { c as l } from "../../chunks/clsx.js";
 import { useRef as m, useEffect as T, useCallback as p } from "react";
 import { TabsProvider as j } from "../contexts/TabControl.js";
-import { useActiveTab as v, useTabsUid as C, useRegisterTabControl as H, useActiveTabControl as I } from "../hooks/tabControl.js";
+import { useActiveTabControl as H, useActiveTab as v, useTabsUid as C, useRegisterTabControl as I } from "../hooks/tabControl.js";
 import { getTheme as W } from "./theme.js";
 import { useKeyboardControls as U } from "../hooks/useKeyboardControls.js";
 const V = ({
@@ -61,7 +61,7 @@ const V = ({
   constrained: n = !1,
   children: d
 }) => {
-  const e = m(null), u = m(null), [b, f] = I();
+  const e = m(null), u = m(null), [b, f] = H();
   T(() => {
     if (!f?.current || !e.current)
       return;
@@ -110,7 +110,7 @@ const V = ({
   className: f,
   ...o
 }) => {
-  const x = m(null), c = v(), y = C(), t = H({ value: e, ref: x }), h = m(c), a = m(c === e);
+  const x = m(null), c = v(), y = C(), t = I({ value: e, ref: x }), h = m(c), a = m(c === e);
   a.current = c === e;
   const k = { "--tab-index": e }, { textColor: N, textColorActive: R, bgColor: _ } = W(b);
   T(() => {