@e-burgos/tucu-ui 2.0.1 → 2.0.3

package/{TabSelectSection-8ubM-IJD.mjs → documentation/TabSelectSection-DNb8f96f.js}

@@ -1,11 +1,11 @@
-import { jsxs as t, Fragment as S, jsx as e } from "react/jsx-runtime";
+import { jsxs as t, Fragment as N, jsx as e } from "react/jsx-runtime";
 import { useState as c } from "react";
-import { T as a, C as s, a as l, ad as d, B as x, c as T } from "./index-DAzR4tRy.mjs";
-import { Home as w, User as I, Settings as k } from "lucide-react";
+import { T as a, C as s, a as n, ad as d, A as f, c as y } from "../index-DsiBIFwo.js";
+import { Home as v, User as S, Settings as T } from "lucide-react";
 import "react-router-dom";
 import "react-dom";
-const O = () => {
-  const [o, u] = c(0), [m, f] = c(0), [i, N] = c(0), p = [
+const z = () => {
+  const [o, b] = c(0), [m, g] = c(0), [i, x] = c(0), p = [
     { title: "Dashboard", path: "dashboard" },
     { title: "Analytics", path: "analytics" },
     { title: "Reports", path: "reports" },
@@ -13,21 +13,21 @@ const O = () => {
   ], h = [
     {
       title: /* @__PURE__ */ t("span", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ e(w, { size: 16 }),
+        /* @__PURE__ */ e(v, { size: 16 }),
         "Home"
       ] }),
       path: "home"
     },
     {
       title: /* @__PURE__ */ t("span", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ e(I, { size: 16 }),
+        /* @__PURE__ */ e(S, { size: 16 }),
         "Profile"
       ] }),
       path: "profile"
     },
     {
       title: /* @__PURE__ */ t("span", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ e(k, { size: 16 }),
+        /* @__PURE__ */ e(T, { size: 16 }),
         "Settings"
       ] }),
       path: "settings"
@@ -41,55 +41,7 @@ const O = () => {
     { title: "Reports", path: "reports" },
     { title: "Integrations", path: "integrations" },
     { title: "Settings", path: "settings" }
-  ], b = [
-    {
-      key: "prop",
-      label: "Prop",
-      render: (n) => /* @__PURE__ */ e("code", { className: "text-xs text-brand", children: String(n) })
-    },
-    {
-      key: "type",
-      label: "Type",
-      render: (n) => /* @__PURE__ */ e("code", { className: "text-xs", children: String(n) })
-    },
-    {
-      key: "default",
-      label: "Default",
-      render: (n) => {
-        const g = String(n);
-        return g === "required" ? /* @__PURE__ */ e("span", { className: "text-xs text-red-500", children: "required" }) : /* @__PURE__ */ e("code", { className: "text-xs", children: g });
-      }
-    },
-    {
-      key: "description",
-      label: "Description"
-    }
-  ], y = [
-    {
-      prop: "tabMenu",
-      type: "TabSelectMenuItem[]",
-      default: "required",
-      description: "Array of menu items with title and path"
-    },
-    {
-      prop: "selectedTabIndex",
-      type: "number",
-      default: "required",
-      description: "Currently selected tab index (0-based)"
-    },
-    {
-      prop: "onChange",
-      type: "(index: number) => void",
-      default: "required",
-      description: "Callback function when tab selection changes"
-    },
-    {
-      prop: "ref",
-      type: "React.Ref<HTMLElement | null>",
-      default: "-",
-      description: "Forward ref to the select element"
-    }
-  ], v = [
+  ], u = [
     {
       prop: "title",
       type: "React.ReactNode",
@@ -103,7 +55,7 @@ const O = () => {
       description: "Unique identifier/route path for the tab"
     }
   ];
-  return /* @__PURE__ */ t(S, { children: [
+  return /* @__PURE__ */ t(N, { children: [
     /* @__PURE__ */ t("div", { className: "text-center space-y-4", children: [
       /* @__PURE__ */ e(a, { tag: "h2", className: "text-3xl md:text-4xl font-bold", children: "TabSelect" }),
       /* @__PURE__ */ e(
@@ -115,7 +67,7 @@ const O = () => {
         }
       )
     ] }),
-    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "Basic Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ t("div", { className: "space-y-8", children: [
+    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(n, { title: "Basic Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ t("div", { className: "space-y-8", children: [
       /* @__PURE__ */ t("div", { children: [
         /* @__PURE__ */ e(a, { tag: "h5", className: "mb-3", children: "Basic TabSelect" }),
         /* @__PURE__ */ e(
@@ -131,7 +83,7 @@ const O = () => {
           {
             tabMenu: p,
             selectedTabIndex: o,
-            onChange: u
+            onChange: b
           }
         ) }),
         /* @__PURE__ */ e("div", { className: "mt-4 p-4 bg-light-dark rounded-lg", children: /* @__PURE__ */ t(a, { tag: "p", className: "text-sm", children: [
@@ -155,7 +107,7 @@ const O = () => {
           {
             tabMenu: h,
             selectedTabIndex: m,
-            onChange: f
+            onChange: g
           }
         ) }),
         /* @__PURE__ */ e("div", { className: "mt-4 p-4 bg-light-dark rounded-lg", children: /* @__PURE__ */ t(a, { tag: "p", className: "text-sm", children: [
@@ -179,7 +131,7 @@ const O = () => {
           {
             tabMenu: r,
             selectedTabIndex: i,
-            onChange: N
+            onChange: x
           }
         ) }),
         /* @__PURE__ */ e("div", { className: "mt-4 p-4 bg-light-dark rounded-lg", children: /* @__PURE__ */ t(a, { tag: "p", className: "text-sm", children: [
@@ -195,7 +147,7 @@ const O = () => {
         ] }) })
       ] })
     ] }) }) }) }),
-    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "Use Cases", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ t("div", { className: "space-y-6", children: [
+    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(n, { title: "Use Cases", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ t("div", { className: "space-y-6", children: [
       /* @__PURE__ */ t("div", { children: [
         /* @__PURE__ */ e(a, { tag: "h5", className: "mb-2", children: "Mobile Navigation" }),
         /* @__PURE__ */ t(
@@ -241,7 +193,7 @@ const O = () => {
         )
       ] })
     ] }) }) }) }),
-    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "Features", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ t("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
+    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(n, { title: "Features", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ t("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
       /* @__PURE__ */ t(s, { className: "p-4", children: [
         /* @__PURE__ */ t(a, { tag: "h5", className: "mb-2", children: [
           /* @__PURE__ */ e("span", { role: "img", "aria-label": "palette", children: "🎨" }),
@@ -303,10 +255,30 @@ const O = () => {
         )
       ] })
     ] }) }) }) }),
-    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "TabSelectMenuItem Interface", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(x, { columns: b, data: v }) }) }) }),
-    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "Props", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(x, { columns: b, data: y }) }) }) }),
-    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "Code Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
-      T,
+    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(n, { title: "TabSelectMenuItem Interface", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ t("table", { className: "w-full text-sm text-left", children: [
+      /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ t("tr", { className: "border-b border-gray-200 dark:border-gray-700", children: [
+        /* @__PURE__ */ e("th", { className: "px-3 py-2 font-semibold", children: "Prop" }),
+        /* @__PURE__ */ e("th", { className: "px-3 py-2 font-semibold", children: "Type" }),
+        /* @__PURE__ */ e("th", { className: "px-3 py-2 font-semibold", children: "Default" }),
+        /* @__PURE__ */ e("th", { className: "px-3 py-2 font-semibold", children: "Description" })
+      ] }) }),
+      /* @__PURE__ */ e("tbody", { children: u.map((l) => /* @__PURE__ */ t(
+        "tr",
+        {
+          className: "border-b border-gray-100 dark:border-gray-800",
+          children: [
+            /* @__PURE__ */ e("td", { className: "px-3 py-2", children: /* @__PURE__ */ e("code", { className: "text-xs text-brand", children: l.prop }) }),
+            /* @__PURE__ */ e("td", { className: "px-3 py-2", children: /* @__PURE__ */ e("code", { className: "text-xs", children: l.type }) }),
+            /* @__PURE__ */ e("td", { className: "px-3 py-2", children: l.default === "required" ? /* @__PURE__ */ e("span", { className: "text-xs text-red-500", children: "required" }) : /* @__PURE__ */ e("code", { className: "text-xs", children: l.default }) }),
+            /* @__PURE__ */ e("td", { className: "px-3 py-2 text-gray-600 dark:text-gray-400", children: l.description })
+          ]
+        },
+        l.prop
+      )) })
+    ] }) }) }) }),
+    /* @__PURE__ */ e(f, { componentName: "TabSelect" }),
+    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(n, { title: "Code Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
+      y,
       {
         language: "tsx",
         code: `import { TabSelect } from '@e-burgos/tucu-ui';
@@ -414,5 +386,5 @@ function CustomExample() {
   ] });
 };
 export {
-  O as default
+  z as default
 };

package/{TailwindConfigSection-Tzjd2fi_.mjs → documentation/TailwindConfigSection-dxsLjDuJ.js}

@@ -1,5 +1,5 @@
 import { jsxs as a, Fragment as i, jsx as e } from "react/jsx-runtime";
-import { T as s, C as c, a as l, c as t, a4 as n } from "./index-DAzR4tRy.mjs";
+import { T as s, C as c, a as l, c as t, a4 as n } from "../index-DsiBIFwo.js";
 import { Palette as o, Circle as r, Code as d, Ruler as g } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/TailwindConfigSection-xK7ymNHB.js

@@ -0,0 +1,19 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-D874Kozv.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const r=()=>e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"text-center",children:[e.jsx(s.Typography,{tag:"h2",className:"mb-4 text-2xl sm:text-3xl md:text-4xl font-bold",children:"Tailwind CSS Configuration"}),e.jsx(s.Typography,{tag:"p",className:"text-base sm:text-lg text-gray-600 dark:text-gray-300 max-w-2xl mx-auto",children:"Built on Tailwind CSS v4 with Tucu UI Design Tokens"})]}),e.jsx(s.CardContainer,{children:e.jsx(s.CardTitle,{title:"Design Tokens & Configuration",className:"mt-2 mb-6",children:e.jsxs("div",{className:"space-y-8",children:[e.jsxs("div",{className:"grid grid-cols-1 gap-6",children:[e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 bg-gradient-to-br from-indigo-500 to-purple-500 rounded-lg shadow-lg",children:e.jsx(a.Palette,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h4",className:"font-semibold",children:"Color Spectrums"})]}),e.jsx(s.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400 text-sm",children:"The system uses Tucu UI Design Tokens organized into color spectrums:"}),e.jsxs("ul",{className:"space-y-2 text-sm text-gray-600 dark:text-gray-400",children:[e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(a.Circle,{className:"w-2 h-2 mt-1.5 shrink-0 text-brand"}),e.jsxs("span",{children:[e.jsx("strong",{children:"Color Spectrums:"})," Blue, Green, Orange, Gray, Indigo, Pink, Purple, Red, Teal, Yellow, Chartreuse"]})]}),e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(a.Circle,{className:"w-2 h-2 mt-1.5 shrink-0 text-brand"}),e.jsxs("span",{children:[e.jsx("strong",{children:"Color Scale:"})," Each spectrum has values from 0-100 (e.g., blue-0 to blue-100)"]})]}),e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(a.Circle,{className:"w-2 h-2 mt-1.5 shrink-0 text-brand"}),e.jsxs("span",{children:[e.jsx("strong",{children:"Light & Dark Variants:"})," Separate color sets for light and dark modes"]})]})]})]}),e.jsxs("div",{className:"space-y-4 mt-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 bg-gradient-to-br from-cyan-500 to-blue-500 rounded-lg shadow-lg",children:e.jsx(a.Code,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h4",className:"font-semibold",children:"Semantic Colors"})]}),e.jsx(s.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400 text-sm mb-3",children:"Semantic colors map design tokens to functional purposes:"}),e.jsx(s.CodeBlock,{language:"css",code:`/* Semantic Background Colors */
+--color-semantic-bg-primary: var(--color-tucu-ui-blue-60);
+--color-semantic-bg-secondary: var(--color-tucu-ui-gray-10);
+--color-semantic-bg-positive: var(--color-tucu-ui-green-60);
+--color-semantic-bg-negative: var(--color-tucu-ui-red-60);
+
+/* Semantic Foreground Colors */
+--color-semantic-fg: var(--color-tucu-ui-gray-100);
+--color-semantic-fg-muted: var(--color-tucu-ui-gray-60);
+--color-semantic-fg-primary: var(--color-tucu-ui-blue-60);`})]})]}),e.jsxs("div",{className:"space-y-4 mt-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 bg-gradient-to-br from-green-500 to-emerald-500 rounded-lg shadow-lg",children:e.jsx(a.Ruler,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h4",className:"font-semibold",children:"Spacing Scale"})]}),e.jsx(s.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400 text-sm mb-3",children:"The spacing scale is mapped to Tucu UI Design Tokens. All spacing values use arbitrary values in pixels to maintain consistency:"}),e.jsx(s.CodeBlock,{language:"css",code:`/* Spacing Scale - Mapped to Tucu UI Design Tokens */
+--spacing-0: 0px;
+--spacing-1: 8px;    /* --spacing-tucu-ui-1 */
+--spacing-2: 16px;   /* --spacing-tucu-ui-2 */
+--spacing-3: 24px;   /* --spacing-tucu-ui-3 */
+--spacing-4: 32px;   /* --spacing-tucu-ui-4 */
+--spacing-5: 40px;   /* --spacing-tucu-ui-5 */
+--spacing-6: 48px;   /* --spacing-tucu-ui-6 */
+--spacing-8: 64px;   /* --spacing-tucu-ui-8 */
+--spacing-10: 80px;  /* --spacing-tucu-ui-10 */`}),e.jsxs(s.Alert,{variant:"info",children:[" ",e.jsxs(s.Typography,{tag:"p",className:"text-sm",children:[e.jsx("strong",{children:"Note:"})," Components use arbitrary values like"," ",e.jsx("code",{className:"p-1 border border-gray-300 dark:border-gray-700 rounded text-xs",children:"p-[16px]"})," ","instead of"," ",e.jsx("code",{className:"p-1 border border-gray-300 dark:border-gray-700 rounded text-xs",children:"p-4"})," ","to maintain original Tailwind spacing values."]})]})]})]})})})]});exports.default=r;

package/documentation/TestingSection-D97U6rzs.js

@@ -0,0 +1,12 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-D874Kozv.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const r=()=>e.jsx("div",{className:"space-y-8",children:e.jsx(s.CardContainer,{className:"overflow-hidden",children:e.jsx(s.CardTitle,{title:"Accessibility Testing",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full space-y-8 p-4 sm:p-6",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-orange-500 via-amber-500 to-yellow-500 shadow-lg",children:e.jsx(a.TestTube,{className:"w-6 h-6 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h3",className:"text-xl font-semibold",children:"Testing Guidelines"})]}),e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{className:"space-y-4",children:[e.jsx(s.Typography,{tag:"h4",className:"font-semibold",children:"Manual Testing Checklist"}),e.jsx("div",{className:"space-y-2",children:["Navigate using only keyboard","Test with screen reader (NVDA, JAWS, VoiceOver)","Check color contrast ratios","Verify focus indicators are visible","Test at 200% zoom level","Validate HTML markup","Check for proper heading hierarchy","Test form labels and error messages"].map((i,t)=>e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(a.Check,{className:"w-4 h-4 text-green-500"}),e.jsx(s.Typography,{tag:"p",className:"text-sm",children:i})]},t))})]}),e.jsxs("div",{className:"space-y-4",children:[e.jsx(s.Typography,{tag:"h4",className:"font-semibold",children:"Automated Testing Example"}),e.jsx(s.CodeBlock,{code:`import { render, screen } from '@testing-library/react';
+import { axe, toHaveNoViolations } from 'jest-axe';
+
+expect.extend(toHaveNoViolations);
+
+test('Input has no accessibility violations', async () => {
+  const { container } = render(
+    <Input label="Email" required error="Invalid email" />
+  );
+  const results = await axe(container);
+  expect(results).toHaveNoViolations();
+});`,language:"js"})]})]})]})})})});exports.default=r;

package/{TestingSection-CIeBdZoD.mjs → documentation/TestingSection-DqHtOy40.js}

@@ -1,5 +1,5 @@
 import { jsx as e, jsxs as a } from "react/jsx-runtime";
-import { C as r, a as l, T as s, c as o } from "./index-DAzR4tRy.mjs";
+import { C as r, a as l, T as s, c as o } from "../index-DsiBIFwo.js";
 import { TestTube as c, Check as n } from "lucide-react";
 import "react-router-dom";
 import "react";

package/{TextareaSection-BesPi1oh.mjs → documentation/TextareaSection-LoLfm6tE.js}

@@ -1,16 +1,16 @@
 import { jsxs as a, Fragment as c, jsx as e } from "react/jsx-runtime";
-import { useState as p } from "react";
-import { T as t, C as r, a as i, q as s, B as m, c as h } from "./index-DAzR4tRy.mjs";
+import { useState as d } from "react";
+import { T as l, C as r, a as s, p as t, A as m, c as h } from "../index-DsiBIFwo.js";
 import "lucide-react";
 import "react-router-dom";
 import "react-dom";
-const T = () => {
-  const [n, d] = p("");
+const v = () => {
+  const [i, o] = d("");
   return /* @__PURE__ */ a(c, { children: [
     /* @__PURE__ */ a("div", { className: "text-center space-y-4", children: [
-      /* @__PURE__ */ e(t, { tag: "h2", className: "text-3xl md:text-4xl font-bold", children: "Textarea" }),
+      /* @__PURE__ */ e(l, { tag: "h2", className: "text-3xl md:text-4xl font-bold", children: "Textarea" }),
       /* @__PURE__ */ e(
-        t,
+        l,
         {
           tag: "p",
           className: "text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",
@@ -18,24 +18,24 @@ const T = () => {
         }
       )
     ] }),
-    /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
+    /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(s, { title: "Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
       /* @__PURE__ */ a(r, { className: "p-4", children: [
-        /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "Basic Textarea" }),
+        /* @__PURE__ */ e(l, { tag: "h5", className: "mb-3", children: "Basic Textarea" }),
         /* @__PURE__ */ e(
-          s,
+          t,
           {
             label: "Message",
             placeholder: "Write your message here",
-            value: n,
-            onChange: (l) => d(l.target.value),
+            value: i,
+            onChange: (n) => o(n.target.value),
             rows: 4
           }
         )
       ] }),
       /* @__PURE__ */ a(r, { className: "p-4", children: [
-        /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "With Helper Text" }),
+        /* @__PURE__ */ e(l, { tag: "h5", className: "mb-3", children: "With Helper Text" }),
         /* @__PURE__ */ e(
-          s,
+          t,
           {
             label: "Description",
             placeholder: "Enter description",
@@ -45,9 +45,9 @@ const T = () => {
         )
       ] }),
       /* @__PURE__ */ a(r, { className: "p-4", children: [
-        /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "With Error" }),
+        /* @__PURE__ */ e(l, { tag: "h5", className: "mb-3", children: "With Error" }),
         /* @__PURE__ */ e(
-          s,
+          t,
           {
             label: "Comments",
             placeholder: "Enter comments",
@@ -57,9 +57,9 @@ const T = () => {
         )
       ] }),
       /* @__PURE__ */ a(r, { className: "p-4", children: [
-        /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "Disabled" }),
+        /* @__PURE__ */ e(l, { tag: "h5", className: "mb-3", children: "Disabled" }),
         /* @__PURE__ */ e(
-          s,
+          t,
           {
             label: "Notes",
             placeholder: "Disabled textarea",
@@ -69,11 +69,11 @@ const T = () => {
         )
       ] })
     ] }) }) }) }),
-    /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Variants", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
+    /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(s, { title: "Variants", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
       /* @__PURE__ */ a(r, { className: "p-4", children: [
-        /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "Ghost (default)" }),
+        /* @__PURE__ */ e(l, { tag: "h5", className: "mb-3", children: "Ghost (default)" }),
         /* @__PURE__ */ e(
-          s,
+          t,
           {
             label: "Ghost Variant",
             placeholder: "Enter text",
@@ -83,9 +83,9 @@ const T = () => {
         )
       ] }),
       /* @__PURE__ */ a(r, { className: "p-4", children: [
-        /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "Solid" }),
+        /* @__PURE__ */ e(l, { tag: "h5", className: "mb-3", children: "Solid" }),
         /* @__PURE__ */ e(
-          s,
+          t,
           {
             label: "Solid Variant",
             placeholder: "Enter text",
@@ -95,9 +95,9 @@ const T = () => {
         )
       ] }),
       /* @__PURE__ */ a(r, { className: "p-4", children: [
-        /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "Transparent" }),
+        /* @__PURE__ */ e(l, { tag: "h5", className: "mb-3", children: "Transparent" }),
         /* @__PURE__ */ e(
-          s,
+          t,
           {
             label: "Transparent Variant",
             placeholder: "Enter text",
@@ -107,86 +107,8 @@ const T = () => {
         )
       ] })
     ] }) }) }) }),
-    /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Props", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(m, { columns: [
-      {
-        key: "prop",
-        label: "Prop",
-        render: (l) => /* @__PURE__ */ e("code", { className: "text-xs text-brand", children: String(l) })
-      },
-      {
-        key: "type",
-        label: "Type",
-        render: (l) => /* @__PURE__ */ e("code", { className: "text-xs", children: String(l) })
-      },
-      {
-        key: "default",
-        label: "Default",
-        render: (l) => {
-          const o = String(l);
-          return o === "required" ? /* @__PURE__ */ e("span", { className: "text-xs text-red-500", children: "required" }) : /* @__PURE__ */ e("code", { className: "text-xs", children: o });
-        }
-      },
-      {
-        key: "description",
-        label: "Description"
-      }
-    ], data: [
-      {
-        prop: "label",
-        type: "string",
-        default: "-",
-        description: "Field label text"
-      },
-      {
-        prop: "variant",
-        type: "'ghost' | 'solid' | 'transparent'",
-        default: "'ghost'",
-        description: "Visual variant of the textarea"
-      },
-      {
-        prop: "error",
-        type: "string",
-        default: "-",
-        description: "Error message to display"
-      },
-      {
-        prop: "helperText",
-        type: "string",
-        default: "-",
-        description: "Helper text displayed below the textarea"
-      },
-      {
-        prop: "disabled",
-        type: "boolean",
-        default: "false",
-        description: "Disables the textarea field"
-      },
-      {
-        prop: "rows",
-        type: "number",
-        default: "-",
-        description: "Number of visible text lines"
-      },
-      {
-        prop: "useUppercaseLabel",
-        type: "boolean",
-        default: "false",
-        description: "Display label in uppercase"
-      },
-      {
-        prop: "className",
-        type: "string",
-        default: "-",
-        description: "Custom CSS classes for the container"
-      },
-      {
-        prop: "inputClassName",
-        type: "string",
-        default: "-",
-        description: "Custom CSS classes for the textarea element"
-      }
-    ] }) }) }) }),
-    /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
+    /* @__PURE__ */ e(m, { componentName: "Textarea" }),
+    /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(s, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
       h,
       {
         language: "tsx",
@@ -216,5 +138,5 @@ const T = () => {
   ] });
 };
 export {
-  T as default
+  v as default
 };

package/documentation/TextareaSection-cq-8Cb4V.js

@@ -0,0 +1,21 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("react"),a=require("../index-D874Kozv.js");require("lucide-react");require("react-router-dom");require("react-dom");const i=()=>{const[r,s]=l.useState("");return e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"text-center space-y-4",children:[e.jsx(a.Typography,{tag:"h2",className:"text-3xl md:text-4xl font-bold",children:"Textarea"}),e.jsx(a.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"A multi-line text input component for longer text content."})]}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Examples",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4",children:[e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Basic Textarea"}),e.jsx(a.Textarea,{label:"Message",placeholder:"Write your message here",value:r,onChange:t=>s(t.target.value),rows:4})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Helper Text"}),e.jsx(a.Textarea,{label:"Description",placeholder:"Enter description",helperText:"Provide a detailed description",rows:4})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Error"}),e.jsx(a.Textarea,{label:"Comments",placeholder:"Enter comments",error:"Comments are required",rows:4})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Disabled"}),e.jsx(a.Textarea,{label:"Notes",placeholder:"Disabled textarea",disabled:!0,rows:4})]})]})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Variants",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-3 gap-4",children:[e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Ghost (default)"}),e.jsx(a.Textarea,{label:"Ghost Variant",placeholder:"Enter text",variant:"ghost",rows:3})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Solid"}),e.jsx(a.Textarea,{label:"Solid Variant",placeholder:"Enter text",variant:"solid",rows:3})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Transparent"}),e.jsx(a.Textarea,{label:"Transparent Variant",placeholder:"Enter text",variant:"transparent",rows:3})]})]})})})}),e.jsx(a.AutoPropsTable,{componentName:"Textarea"}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.CodeBlock,{language:"tsx",code:`import { Textarea } from '@e-burgos/tucu-ui';
+
+<Textarea
+  label="Message"
+  placeholder="Write your message here"
+  value={value}
+  onChange={(e) => setValue(e.target.value)}
+  rows={4}
+/>
+
+<Textarea
+  label="Description"
+  placeholder="Enter description"
+  helperText="Provide a detailed description"
+  rows={4}
+/>
+
+// Variants
+<Textarea label="Ghost" variant="ghost" rows={4} />
+<Textarea label="Solid" variant="solid" rows={4} />
+<Textarea label="Transparent" variant="transparent" rows={4} />`})})})})]})};exports.default=i;

package/{ThemeArchitectureSection-BeYX2LDb.mjs → documentation/ThemeArchitectureSection-D3s-iFek.js}

@@ -1,5 +1,5 @@
 import { jsxs as a, Fragment as s, jsx as e } from "react/jsx-runtime";
-import { T as r, C as n, D as c } from "./index-DAzR4tRy.mjs";
+import { T as r, C as n, G as c } from "../index-DsiBIFwo.js";
 import { Zap as d, Palette as m, Moon as p } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/ThemeArchitectureSection-kTqICQZj.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-D874Kozv.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"text-center",children:[e.jsx(t.Typography,{tag:"h2",className:"mb-4 text-2xl sm:text-3xl md:text-4xl font-bold",children:"Theme Architecture"}),e.jsx(t.Typography,{tag:"p",className:"text-base sm:text-lg text-gray-600 dark:text-gray-300 max-w-2xl mx-auto",children:"Built on modern technologies for flexibility and performance"})]}),e.jsx("div",{className:"grid grid-cols-1 md:grid-cols-3 gap-6",children:[{icon:e.jsx(a.Zap,{className:"w-8 h-8 text-white filter drop-shadow-sm"}),title:"Zustand State Management",description:"Centralized theme state with minimal boilerplate and excellent TypeScript support",color:"from-yellow-500 via-amber-500 to-orange-500",features:["Lightweight","TypeScript First","DevTools Support"]},{icon:e.jsx(a.Palette,{className:"w-8 h-8 text-white filter drop-shadow-sm"}),title:"CSS Custom Properties",description:"Dynamic brand colors using CSS variables for real-time theme updates",color:"from-blue-500 via-cyan-500 to-teal-500",features:["Dynamic Colors","Alpha Support","No Rebuilds"]},{icon:e.jsx(a.Moon,{className:"w-8 h-8 text-white filter drop-shadow-sm"}),title:"Dark Mode Support",description:"Automatic dark/light mode switching with smooth transitions",color:"from-purple-500 via-violet-500 to-indigo-500",features:["Auto Detection","Smooth Transitions","System Sync"]}].map((r,i)=>e.jsx(t.CardContainer,{className:"group hover:shadow-large transition-all duration-300 hover:-translate-y-1",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-4",children:[e.jsx("div",{className:`p-3 rounded-xl bg-gradient-to-br ${r.color} group-hover:scale-110 transition-all duration-300 shadow-lg`,children:r.icon}),e.jsx(t.Typography,{tag:"h3",className:"font-semibold text-lg group-hover:text-primary transition-colors duration-300",children:r.title})]}),e.jsx(t.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400 leading-relaxed",children:r.description}),e.jsx("div",{className:"flex flex-wrap gap-2",children:r.features.map((s,o)=>e.jsx(t.Badge,{variant:"outline",className:"text-xs",children:s},o))})]})},i))})]});exports.default=l;

package/documentation/ThemeConfigurationSection-CIorDmNk.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("../index-D874Kozv.js"),o=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=()=>e.jsx(l.CardContainer,{children:e.jsx(l.CardTitle,{title:"Theme Configuration",className:"mt-2 mb-6",children:e.jsx("div",{className:"space-y-8",children:e.jsxs("div",{className:"grid grid-cols-1 gap-6",children:[e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 bg-gradient-to-br from-emerald-500 to-teal-500 rounded-lg shadow-lg",children:e.jsx(o.Settings,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(l.Typography,{tag:"h4",className:"font-semibold",children:"Available Options"})]}),e.jsx("div",{className:"space-y-3",children:[{label:"Mode",value:"'light' | 'dark'"},{label:"Direction",value:"'ltr' | 'rtl'"},{label:"Layout",value:"'clean' | 'admin' | 'horizontal'"},{label:"Primary Color",value:"34+ predefined colors"},{label:"Dark Primary Color",value:"34+ predefined colors"},{label:"Secondary Color",value:"34+ predefined colors"},{label:"Dark Secondary Color",value:"34+ predefined colors"},{label:"Accent Color",value:"34+ predefined colors"},{label:"Dark Accent Color",value:"34+ predefined colors"},{label:"Muted Color",value:"34+ predefined colors"},{label:"Dark Muted Color",value:"34+ predefined colors"},{label:"Dark Background",value:"Theme base colors"},{label:"Light Background",value:"Theme base colors"},{label:"Light Dark",value:"Theme base colors"},{label:"Dark Light Dark",value:"Theme base colors"},{label:"Language",value:"'en' | 'es' | 'fr'"}].map((a,r)=>e.jsxs("div",{className:"flex justify-between items-center py-2 px-3 bg-gray-200 dark:bg-gray-800 rounded-lg",children:[e.jsx("span",{className:"font-medium",children:a.label}),e.jsx("code",{className:"text-sm text-gray-600 dark:text-gray-400",children:a.value})]},r))})]}),e.jsxs("div",{className:"space-y-4 mt-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 bg-gradient-to-br from-pink-500 to-rose-500 rounded-lg shadow-lg",children:e.jsx(o.Palette,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(l.Typography,{tag:"h4",className:"font-semibold",children:"Color Presets"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-3 overflow-y-auto",children:[{name:"DEFAULT_PRIMARY",color:"#0052ff"},{name:"DEFAULT_DARK_PRIMARY",color:"#578bfa"},{name:"DEFAULT_SECONDARY",color:"#eef0f3"},{name:"DEFAULT_DARK_SECONDARY",color:"#282b31"},{name:"DEFAULT_ACCENT",color:"#f7d21a"},{name:"DEFAULT_DARK_ACCENT",color:"#936000"},{name:"DEFAULT_MUTED",color:"#5b616e"},{name:"DEFAULT_DARK_MUTED",color:"#8a919e"},{name:"DEFAULT_LIGHT_BG",color:"#ffffff"},{name:"DEFAULT_DARK_BG",color:"#0a0b0d"},{name:"DEFAULT_LIGHT_DARK",color:"#f7f8f9"},{name:"DEFAULT_DARK_LIGHT_DARK",color:"#141519"},{name:"BLUE",color:"#105eff"},{name:"DARK_BLUE",color:"#2162ee"},{name:"GREEN",color:"#129961"},{name:"DARK_GREEN",color:"#159962"},{name:"ORANGE",color:"#e1591b"},{name:"DARK_ORANGE",color:"#e66020"},{name:"GRAY",color:"#717886"},{name:"DARK_GRAY",color:"#727886"},{name:"INDIGO",color:"#596ff2"},{name:"DARK_INDIGO",color:"#5c71ee"},{name:"PINK",color:"#cb51bb"},{name:"DARK_PINK",color:"#d058c1"},{name:"PURPLE",color:"#9d6bf2"},{name:"DARK_PURPLE",color:"#bc7bfb"},{name:"RED",color:"#e13947"},{name:"DARK_RED",color:"#e6404e"},{name:"TEAL",color:"#0093cb"},{name:"DARK_TEAL",color:"#0095cd"},{name:"YELLOW",color:"#cf9700"},{name:"DARK_YELLOW",color:"#c79e00"},{name:"CHARTREUSE",color:"#56b340"},{name:"DARK_CHARTREUSE",color:"#7bc869"}].map((a,r)=>e.jsxs("div",{className:"flex items-center gap-2 p-2 bg-gray-200 dark:bg-gray-800 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors",children:[e.jsx("div",{className:"w-4 h-4 rounded-full border border-gray-300 dark:border-gray-600 shadow-sm",style:{backgroundColor:a.color}}),e.jsx("span",{className:"text-xs font-medium truncate",children:a.name})]},r))}),e.jsx(l.Typography,{tag:"p",className:"text-xs text-gray-500 dark:text-gray-400 mt-2",children:"34 total color presets available (12 default + 22 spectrum colors)"})]})]})})})});exports.default=s;

package/{ThemeConfigurationSection-_DXIBuk6.mjs → documentation/ThemeConfigurationSection-DKZz_tZ0.js}

@@ -1,5 +1,5 @@
 import { jsx as e, jsxs as a } from "react/jsx-runtime";
-import { C as c, a as d, T as r } from "./index-DAzR4tRy.mjs";
+import { C as c, a as d, T as r } from "../index-DsiBIFwo.js";
 import { Settings as s, Palette as n } from "lucide-react";
 import "react-router-dom";
 import "react";

package/{ThemeHooksSection-B6KG30vE.mjs → documentation/ThemeHooksSection-C0sZ6k8a.js}

@@ -1,5 +1,5 @@
 import { jsxs as t, Fragment as l, jsx as e } from "react/jsx-runtime";
-import { T as r, C as s, a } from "./index-DAzR4tRy.mjs";
+import { T as r, C as s, a } from "../index-DsiBIFwo.js";
 import "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/ThemeHooksSection-D-mw-Fbu.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-D874Kozv.js");require("lucide-react");require("react-router-dom");require("react");require("react-dom");const t=()=>e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"text-center",children:[e.jsx(s.Typography,{tag:"h2",className:"mb-4 text-2xl sm:text-3xl md:text-4xl font-bold",children:"Theme Hooks"}),e.jsx(s.Typography,{tag:"p",className:"text-base sm:text-lg text-gray-600 dark:text-gray-300 max-w-2xl mx-auto",children:"Powerful hooks for theme management and customization"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-6",children:[e.jsx(s.CardContainer,{children:e.jsx(s.CardTitle,{title:"useTheme Hook",className:"mt-2 mb-6",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs(s.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400 text-sm",children:["The"," ",e.jsx("code",{className:"px-2 py-1 bg-light-dark rounded text-sm",children:"useTheme"})," ","hook provides access to all theme state and setters. It uses Zustand for state management with localStorage persistence."]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(s.Typography,{tag:"h5",className:"font-semibold text-sm",children:"Available State:"}),e.jsxs("ul",{className:"text-xs text-gray-600 dark:text-gray-400 space-y-1 ml-4 list-disc",children:[e.jsx("li",{children:"mode, layout, direction, logo, lang"}),e.jsx("li",{children:"primaryPreset, darkPrimaryPreset"}),e.jsx("li",{children:"secondaryPreset, darkSecondaryPreset"}),e.jsx("li",{children:"accentPreset, darkAccentPreset"}),e.jsx("li",{children:"mutedPreset, darkMutedPreset"}),e.jsx("li",{children:"darkBgPreset, lightBgPreset"}),e.jsx("li",{children:"lightDarkPreset, darkLightDarkPreset"}),e.jsx("li",{children:"isSettingsOpen, showSettings"})]})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(s.Typography,{tag:"h5",className:"font-semibold text-sm",children:"Available Setters:"}),e.jsxs("ul",{className:"text-xs text-gray-600 dark:text-gray-400 space-y-1 ml-4 list-disc",children:[e.jsx("li",{children:"setMode, setLayout, setDirection"}),e.jsx("li",{children:"setPrimaryPreset, setDarkPrimaryPreset"}),e.jsx("li",{children:"setSecondaryPreset, setDarkSecondaryPreset"}),e.jsx("li",{children:"setAccentPreset, setDarkAccentPreset"}),e.jsx("li",{children:"setMutedPreset, setDarkMutedPreset"}),e.jsx("li",{children:"setDarkBgPreset, setLightBgPreset"}),e.jsx("li",{children:"setLightDarkPreset, setDarkLightDarkPreset"}),e.jsx("li",{children:"setLogo, setLang, setIsSettingsOpen"}),e.jsx("li",{children:"setShowSettings, restoreDefaultColors"})]})]})]})})}),e.jsx(s.CardContainer,{children:e.jsx(s.CardTitle,{title:"useThemeColor & useDirection",className:"mt-2 mb-6",children:e.jsx("div",{className:"space-y-4",children:e.jsxs("div",{className:"space-y-3",children:[e.jsxs("div",{children:[e.jsx(s.Typography,{tag:"h5",className:"font-semibold text-sm mb-2",children:"useThemeColor"}),e.jsx(s.Typography,{tag:"p",className:"text-xs text-gray-600 dark:text-gray-400 mb-2",children:"Automatically used by ThemeWrapper to inject CSS variables into the document root:"}),e.jsxs("ul",{className:"text-xs text-gray-600 dark:text-gray-400 space-y-1 ml-4 list-disc",children:[e.jsx("li",{children:"--color-semantic-bg-primary"}),e.jsx("li",{children:"--color-semantic-dark-bg-primary"}),e.jsx("li",{children:"--color-semantic-bg-secondary"}),e.jsx("li",{children:"--color-semantic-accent-bold-yellow"}),e.jsx("li",{children:"--color-semantic-fg-muted"}),e.jsx("li",{children:"--color-semantic-bg"}),e.jsx("li",{children:"--color-semantic-bg-secondary-wash"})]})]}),e.jsxs("div",{children:[e.jsx(s.Typography,{tag:"h5",className:"font-semibold text-sm mb-2",children:"useDirection"}),e.jsxs(s.Typography,{tag:"p",className:"text-xs text-gray-600 dark:text-gray-400",children:["Sets the document direction for RTL/LTR support. Sets"," ",e.jsx("code",{className:"px-1 py-0.5 bg-light-dark rounded text-xs",children:"document.documentElement.dir"}),"."]})]})]})})})})]})]});exports.default=t;

package/{ThemeProviderIntegrationSection-CW8KEw1O.mjs → documentation/ThemeProviderIntegrationSection-BfBFuERd.js}

@@ -1,5 +1,5 @@
 import { jsx as e, jsxs as t } from "react/jsx-runtime";
-import { C as r, a as s, T as o, c as a } from "./index-DAzR4tRy.mjs";
+import { C as r, a as s, T as o, c as a } from "../index-DsiBIFwo.js";
 import "lucide-react";
 import "react-router-dom";
 import "react";

package/{ThemeProviderIntegrationSection-DDSnnzZu.js → documentation/ThemeProviderIntegrationSection-macU3-6q.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("./index-Cj89iBVR.js");require("lucide-react");require("react-router-dom");require("react");require("react-dom");const o=()=>e.jsx("div",{className:"space-y-8",children:e.jsx(t.CardContainer,{children:e.jsx(t.CardTitle,{title:"ThemeProvider Integration",className:"mt-2 mb-6",children:e.jsxs("div",{className:"space-y-6",children:[e.jsxs(t.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:["The routing system is fully integrated with the ThemeProvider, providing seamless navigation, layout management, and theming support. The ThemeProvider supports two architectural patterns:",e.jsx("strong",{children:" Standalone"})," (default) for traditional SPAs and",e.jsx("strong",{children:" Micro Frontends (MFE)"})," for distributed architectures."]}),e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{className:"space-y-4",children:[e.jsx(t.Typography,{tag:"h4",className:"font-semibold",children:"StandaloneAppThemeProvider Props"}),e.jsx(t.CodeBlock,{language:"typescript",code:`interface StandaloneAppProviderProps
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-D874Kozv.js");require("lucide-react");require("react-router-dom");require("react");require("react-dom");const o=()=>e.jsx("div",{className:"space-y-8",children:e.jsx(t.CardContainer,{children:e.jsx(t.CardTitle,{title:"ThemeProvider Integration",className:"mt-2 mb-6",children:e.jsxs("div",{className:"space-y-6",children:[e.jsxs(t.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:["The routing system is fully integrated with the ThemeProvider, providing seamless navigation, layout management, and theming support. The ThemeProvider supports two architectural patterns:",e.jsx("strong",{children:" Standalone"})," (default) for traditional SPAs and",e.jsx("strong",{children:" Micro Frontends (MFE)"})," for distributed architectures."]}),e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{className:"space-y-4",children:[e.jsx(t.Typography,{tag:"h4",className:"font-semibold",children:"StandaloneAppThemeProvider Props"}),e.jsx(t.CodeBlock,{language:"typescript",code:`interface StandaloneAppProviderProps
   extends Omit<ThemeWrapperProps, 'menuItems' | 'children'> {
   menuItems: StandaloneAppRoutesMenuItem[];  // Required: Array of route items
   customRoutes?: React.ReactElement<typeof Routes>; // Override default routing

package/documentation/ThemeProviderRequiredSection-BRbwv1wN.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../index-D874Kozv.js"),o=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const t=()=>e.jsxs(e.Fragment,{children:[e.jsx(r.Alert,{variant:"warning",children:e.jsxs("div",{children:[e.jsxs("div",{className:"flex items-center gap-2 font-semibold",children:[e.jsx(o.AlertTriangle,{className:"h-4 w-4"}),"ThemeProvider Required"]}),e.jsxs("div",{children:["Before using any layout components or theme hooks, you MUST wrap your application with ThemeProvider. All layout components and theme hooks depend on the theme context provided by ThemeProvider. Located in"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-700 rounded text-xs",children:"ui/tucu-ui/src/themes/components/theme-provider"}),"."]})]})}),e.jsx(r.CardContainer,{className:"overflow-hidden",children:e.jsx(r.CardTitle,{title:"Routing System",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full space-y-6 p-4 sm:p-6",children:[e.jsxs(r.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:[e.jsx("strong",{children:"ThemeProvider"})," includes"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-700 rounded text-xs",children:"BrowserRouter"})," ","from React Router and handles routing automatically. You have two options:"]}),e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"p-4 bg-blue-50 dark:bg-blue-900/20 rounded-lg border border-blue-200 dark:border-blue-800",children:[e.jsx(r.Typography,{tag:"h4",className:"font-semibold mb-2",children:"1. Automatic Routing (Default)"}),e.jsxs(r.Typography,{tag:"p",className:"text-sm text-gray-700 dark:text-gray-300 mb-2",children:["Provide ",e.jsx("code",{children:"menuItems"})," with ",e.jsx("code",{children:"component"})," ","prop. ThemeProvider will automatically generate routes from your menu items."]}),e.jsxs(r.Typography,{tag:"p",className:"text-xs text-gray-600 dark:text-gray-400",children:[e.jsx("strong",{children:"Use when:"})," You want routing based on menu items. Each menu item with a ",e.jsx("code",{children:"component"})," prop becomes a route."]})]}),e.jsxs("div",{className:"p-4 bg-green-50 dark:bg-green-900/20 rounded-lg border border-green-200 dark:border-green-800",children:[e.jsx(r.Typography,{tag:"h4",className:"font-semibold mb-2",children:"2. Custom Routing"}),e.jsxs(r.Typography,{tag:"p",className:"text-sm text-gray-700 dark:text-gray-300 mb-2",children:["Provide ",e.jsx("code",{children:"customRoutes"})," prop with your own"," ",e.jsx("code",{children:"<Routes>"})," component. This gives you full control over routing."]}),e.jsxs(r.Typography,{tag:"p",className:"text-xs text-gray-600 dark:text-gray-400",children:[e.jsx("strong",{children:"Use when:"})," You need custom routing logic, landing pages without navigation, or complex routing scenarios."]})]})]})]})})})]});exports.default=t;

package/{ThemeProviderRequiredSection-DdQg1QoB.mjs → documentation/ThemeProviderRequiredSection-CqDOwaWl.js}

@@ -1,5 +1,5 @@
 import { jsxs as r, Fragment as t, jsx as e } from "react/jsx-runtime";
-import { a4 as a, C as d, a as n, T as o } from "./index-DAzR4tRy.mjs";
+import { a4 as a, C as d, a as n, T as o } from "../index-DsiBIFwo.js";
 import { AlertTriangle as i } from "lucide-react";
 import "react-router-dom";
 import "react";

package/{ThemeProviderSection-CfMenkEO.mjs → documentation/ThemeProviderSection-C8LEFOeB.js}

@@ -1,5 +1,5 @@
 import { jsxs as o, Fragment as n, jsx as e } from "react/jsx-runtime";
-import { T as a, C as p, a as l, B as d } from "./index-DAzR4tRy.mjs";
+import { T as a, C as p, a as l, l as d } from "../index-DsiBIFwo.js";
 import "lucide-react";
 import "react-router-dom";
 import "react";