@e-burgos/tucu-ui 2.0.11 → 2.1.0

package/documentation/{TailwindConfigSection-qnCValDL.js → TailwindConfigSection-Dm8FmmJo.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-C0NugKZs.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const c=()=>{const i=[{icon:e.jsx(s.Circle,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Color Spectrums",description:"Blue, Green, Orange, Gray, Indigo, Pink, Purple, Red, Teal, Yellow, Chartreuse — 11 spectrums total.",iconBgClassName:"from-indigo-500 to-purple-500"},{icon:e.jsx(s.Layers,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Scale 0-100",description:"Each spectrum has values from 0 to 100 in steps of 5/10 (e.g., blue-0, blue-5, blue-10 ... blue-100).",iconBgClassName:"from-cyan-500 to-blue-500"},{icon:e.jsx(s.Moon,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Light & Dark Variants",description:"Separate color sets for light and dark modes (e.g., --color-tucu-ui-blue-60 vs --color-tucu-ui-dark-blue-70).",iconBgClassName:"from-violet-500 to-purple-500"}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Tailwind CSS Configuration",description:"Built on Tailwind CSS v4 with Tucu UI Design Tokens for a CSS-first configuration system.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-indigo-500 via-blue-500 to-cyan-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(s.Code,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"h2",className:"mb-2",children:"Design Tokens"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Primitive color tokens organized into spectrums"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6",children:i.map(r=>e.jsx(a.FeatureCard,{layout:"horizontal",...r},r.title))})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"h2",className:"mb-2",children:"Semantic Colors"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Design tokens mapped to functional purposes"})]}),e.jsx(a.CardContainer,{children:e.jsx(a.CardTitle,{title:"Semantic Color Variables",children:e.jsx("div",{className:"space-y-4",children:e.jsx(a.CodeBlock,{language:"css",code:`/* Semantic Background Colors */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-DEZRGktf.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const c=()=>{const i=[{icon:e.jsx(s.Circle,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Color Spectrums",description:"Blue, Green, Orange, Gray, Indigo, Pink, Purple, Red, Teal, Yellow, Chartreuse — 11 spectrums total.",iconBgClassName:"from-indigo-500 to-purple-500"},{icon:e.jsx(s.Layers,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Scale 0-100",description:"Each spectrum has values from 0 to 100 in steps of 5/10 (e.g., blue-0, blue-5, blue-10 ... blue-100).",iconBgClassName:"from-cyan-500 to-blue-500"},{icon:e.jsx(s.Moon,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Light & Dark Variants",description:"Separate color sets for light and dark modes (e.g., --color-tucu-ui-blue-60 vs --color-tucu-ui-dark-blue-70).",iconBgClassName:"from-violet-500 to-purple-500"}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Tailwind CSS Configuration",description:"Built on Tailwind CSS v4 with Tucu UI Design Tokens for a CSS-first configuration system.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-indigo-500 via-blue-500 to-cyan-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(s.Code,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"h2",className:"mb-2",children:"Design Tokens"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Primitive color tokens organized into spectrums"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6",children:i.map(r=>e.jsx(a.FeatureCard,{layout:"horizontal",...r},r.title))})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"h2",className:"mb-2",children:"Semantic Colors"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Design tokens mapped to functional purposes"})]}),e.jsx(a.CardContainer,{children:e.jsx(a.CardTitle,{title:"Semantic Color Variables",children:e.jsx("div",{className:"space-y-4",children:e.jsx(a.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);

package/documentation/{TestingSection-CVlwcTS4.js → TestingSection-50uHRrhh.js}

@@ -1,5 +1,5 @@
 import { jsxs as t, Fragment as l, jsx as e } from "react/jsx-runtime";
-import { H as c, T as a, ax as m, c as d, C as h } from "../index-4GONhZIF.js";
+import { H as c, T as a, ax as m, c as d, C as h } from "../index-sdOMz8GW.js";
 import { TestTube as u, Scan as g, Monitor as p, Accessibility as x, Keyboard as y } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{TestingSection-B8qrXvks.js → TestingSection-ZwHKbrfu.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-C0NugKZs.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>{const r=[{icon:e.jsx(s.Scan,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"jest-axe",description:"Automated WCAG violation detection in unit tests. Run axe-core checks on rendered components.",iconBgClassName:"from-red-500 to-pink-500"},{icon:e.jsx(s.Monitor,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Lighthouse",description:"Full page accessibility audit with scoring. Available in Chrome DevTools or CI pipelines.",iconBgClassName:"from-blue-500 to-indigo-500"},{icon:e.jsx(s.Accessibility,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Screen Reader Testing",description:"Manual testing with VoiceOver (macOS), NVDA (Windows), or Orca (Linux) to verify announcements.",iconBgClassName:"from-purple-500 to-violet-500"},{icon:e.jsx(s.Keyboard,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Keyboard-Only Testing",description:"Navigate the entire interface using only Tab, Arrow keys, Enter, and Escape. No mouse allowed.",iconBgClassName:"from-teal-500 to-cyan-500"}],o=`import { render } from '@testing-library/react';
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-DEZRGktf.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>{const r=[{icon:e.jsx(s.Scan,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"jest-axe",description:"Automated WCAG violation detection in unit tests. Run axe-core checks on rendered components.",iconBgClassName:"from-red-500 to-pink-500"},{icon:e.jsx(s.Monitor,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Lighthouse",description:"Full page accessibility audit with scoring. Available in Chrome DevTools or CI pipelines.",iconBgClassName:"from-blue-500 to-indigo-500"},{icon:e.jsx(s.Accessibility,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Screen Reader Testing",description:"Manual testing with VoiceOver (macOS), NVDA (Windows), or Orca (Linux) to verify announcements.",iconBgClassName:"from-purple-500 to-violet-500"},{icon:e.jsx(s.Keyboard,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Keyboard-Only Testing",description:"Navigate the entire interface using only Tab, Arrow keys, Enter, and Escape. No mouse allowed.",iconBgClassName:"from-teal-500 to-cyan-500"}],o=`import { render } from '@testing-library/react';
 import { axe, toHaveNoViolations } from 'jest-axe';
 import { Input, Modal, Alert, Select } from '@e-burgos/tucu-ui';
 

package/documentation/{TextareaSection-DvcVNcQx.js → TextareaSection-CRC0p58d.js}

@@ -1,6 +1,6 @@
 import { jsxs as l, Fragment as b, jsx as e } from "react/jsx-runtime";
 import { useState as c } from "react";
-import { H as x, C as a, a as i, T as t, v as s, P as u, A as w, c as N } from "../index-4GONhZIF.js";
+import { H as x, C as a, a as i, T as t, v as s, P as u, A as w, c as N } from "../index-sdOMz8GW.js";
 import { AlignLeft as v } from "lucide-react";
 import "react-router-dom";
 import "react-dom";

package/documentation/{TextareaSection-D2ucvmZ7.js → TextareaSection-RHt7tBFi.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("react"),a=require("../index-C0NugKZs.js"),m=require("lucide-react");require("react-router-dom");require("react-dom");const x=()=>{const[t,o]=l.useState(""),[i,n]=l.useState(""),d=[{label:"Primary",color:"primary"},{label:"Secondary",color:"secondary"},{label:"Danger",color:"danger"},{label:"Info",color:"info"},{label:"Success",color:"success"},{label:"Warning",color:"warning"}],c=[{label:"Small",size:"sm"},{label:"Medium",size:"md"},{label:"Large",size:"lg"}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Textarea",description:"A multi-line text input component for longer text content.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-rose-500 via-pink-500 to-fuchsia-500 rounded-full flex items-center justify-center shadow-lg border border-rose-500/50",children:e.jsx(m.AlignLeft,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),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:t,onChange:r=>o(r.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.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Colors",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx("div",{className:"grid grid-cols-1 gap-4 sm:grid-cols-2 xl:grid-cols-3",children:d.map(({label:r,color:s})=>e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:r}),e.jsx(a.Textarea,{label:`${r} Textarea`,placeholder:"Enter text",rows:3,color:s})]},s))})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Sizes",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx("div",{className:"grid grid-cols-1 gap-4 md:grid-cols-3",children:c.map(({label:r,size:s})=>e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:r}),e.jsx(a.Textarea,{label:`${r} Textarea`,placeholder:"Enter text",rows:3,size:s})]},s))})})})}),e.jsx(a.PropPlayground,{componentName:"Textarea",defaultValues:{label:"Preview Textarea",placeholder:"Enter text",variant:"ghost",color:"primary",size:"md",rows:4,helperText:"",error:"",useUppercaseLabel:!1,disabled:!1},controlOverrides:[{name:"placeholder",type:"text",description:"Placeholder text rendered inside the textarea"},{name:"color",type:"select",options:["primary","secondary","danger","info","success","warning"],description:"Color treatment applied to the control"},{name:"rows",type:"number",description:"Visible row count for the textarea preview"},{name:"disabled",type:"boolean",description:"Disables the textarea and prevents interaction"}],includeProps:["label","placeholder","variant","color","size","rows","helperText","error","useUppercaseLabel","disabled"],excludeProps:["inputClassName"],children:r=>e.jsx("div",{className:"w-full max-w-lg",children:e.jsx(a.Textarea,{...r,rows:typeof r.rows=="number"?r.rows:4,placeholder:r.placeholder||"Enter text",value:i,onChange:s=>n(s.target.value)})})}),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';
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("react"),a=require("../index-DEZRGktf.js"),m=require("lucide-react");require("react-router-dom");require("react-dom");const x=()=>{const[t,o]=l.useState(""),[i,n]=l.useState(""),d=[{label:"Primary",color:"primary"},{label:"Secondary",color:"secondary"},{label:"Danger",color:"danger"},{label:"Info",color:"info"},{label:"Success",color:"success"},{label:"Warning",color:"warning"}],c=[{label:"Small",size:"sm"},{label:"Medium",size:"md"},{label:"Large",size:"lg"}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Textarea",description:"A multi-line text input component for longer text content.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-rose-500 via-pink-500 to-fuchsia-500 rounded-full flex items-center justify-center shadow-lg border border-rose-500/50",children:e.jsx(m.AlignLeft,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),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:t,onChange:r=>o(r.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.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Colors",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx("div",{className:"grid grid-cols-1 gap-4 sm:grid-cols-2 xl:grid-cols-3",children:d.map(({label:r,color:s})=>e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:r}),e.jsx(a.Textarea,{label:`${r} Textarea`,placeholder:"Enter text",rows:3,color:s})]},s))})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Sizes",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx("div",{className:"grid grid-cols-1 gap-4 md:grid-cols-3",children:c.map(({label:r,size:s})=>e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:r}),e.jsx(a.Textarea,{label:`${r} Textarea`,placeholder:"Enter text",rows:3,size:s})]},s))})})})}),e.jsx(a.PropPlayground,{componentName:"Textarea",defaultValues:{label:"Preview Textarea",placeholder:"Enter text",variant:"ghost",color:"primary",size:"md",rows:4,helperText:"",error:"",useUppercaseLabel:!1,disabled:!1},controlOverrides:[{name:"placeholder",type:"text",description:"Placeholder text rendered inside the textarea"},{name:"color",type:"select",options:["primary","secondary","danger","info","success","warning"],description:"Color treatment applied to the control"},{name:"rows",type:"number",description:"Visible row count for the textarea preview"},{name:"disabled",type:"boolean",description:"Disables the textarea and prevents interaction"}],includeProps:["label","placeholder","variant","color","size","rows","helperText","error","useUppercaseLabel","disabled"],excludeProps:["inputClassName"],children:r=>e.jsx("div",{className:"w-full max-w-lg",children:e.jsx(a.Textarea,{...r,rows:typeof r.rows=="number"?r.rows:4,placeholder:r.placeholder||"Enter text",value:i,onChange:s=>n(s.target.value)})})}),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"

package/documentation/{ThemeArchitectureSection-CFA5PLA5.js → ThemeArchitectureSection-DHZ5sm1Q.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-C0NugKZs.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const r=()=>{const o=[{icon:e.jsx(s.Zap,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Zustand State Management",description:"Centralized theme state with minimal boilerplate, localStorage persistence, and excellent TypeScript support.",iconBgClassName:"from-yellow-500 via-amber-500 to-orange-500"},{icon:e.jsx(s.Palette,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"CSS Custom Properties",description:"Dynamic brand colors using 12 CSS variables (6 light/dark pairs) for real-time theme updates without rebuilds.",iconBgClassName:"from-blue-500 via-cyan-500 to-teal-500"},{icon:e.jsx(s.Moon,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Dark Mode Support",description:"Automatic dark/light mode switching with smooth transitions and system preference detection.",iconBgClassName:"from-purple-500 via-violet-500 to-indigo-500"}],i=[{icon:e.jsx(s.Layout,{className:"w-5 h-5"}),title:"Default",description:"Standard theme with Clean, Admin, and Horizontal layouts.",color:"blue"},{icon:e.jsx(s.Monitor,{className:"w-5 h-5"}),title:"macOS (Sonoma)",description:"macOS-inspired dock layout with Sonoma visual style.",color:"purple"},{icon:e.jsx(s.Sparkles,{className:"w-5 h-5"}),title:"macOS Tahoe",description:"Latest macOS Tahoe style with Tahoe and Tahoe Dock layouts.",color:"teal"}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Theme Architecture",description:"Built on Zustand, CSS custom properties, and Tailwind CSS v4 for a flexible, performant, and type-safe theming system.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-purple-500 via-violet-500 to-indigo-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(s.Layers,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"h2",className:"mb-2",children:"Core Technologies"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Three pillars that power the theming system"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6",children:o.map(t=>e.jsx(a.FeatureCard,{layout:"horizontal",...t},t.title))})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"h2",className:"mb-2",children:"Theme Variants"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Three visual styles with their own layout constraints"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6",children:i.map(t=>e.jsx(a.ColorCard,{icon:t.icon,title:t.title,description:t.description,color:t.color},t.title))})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"h2",className:"mb-2",children:"Layout Constraint Map"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Each theme variant restricts which layouts are available"})]}),e.jsx(a.CodeBlock,{language:"typescript",code:`// THEME_STYLE_LAYOUTS mapping
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-DEZRGktf.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const r=()=>{const o=[{icon:e.jsx(s.Zap,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Zustand State Management",description:"Centralized theme state with minimal boilerplate, localStorage persistence, and excellent TypeScript support.",iconBgClassName:"from-yellow-500 via-amber-500 to-orange-500"},{icon:e.jsx(s.Palette,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"CSS Custom Properties",description:"Dynamic brand colors using 12 CSS variables (6 light/dark pairs) for real-time theme updates without rebuilds.",iconBgClassName:"from-blue-500 via-cyan-500 to-teal-500"},{icon:e.jsx(s.Moon,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Dark Mode Support",description:"Automatic dark/light mode switching with smooth transitions and system preference detection.",iconBgClassName:"from-purple-500 via-violet-500 to-indigo-500"}],i=[{icon:e.jsx(s.Layout,{className:"w-5 h-5"}),title:"Default",description:"Standard theme with Clean, Admin, and Horizontal layouts.",color:"blue"},{icon:e.jsx(s.Monitor,{className:"w-5 h-5"}),title:"macOS (Sonoma)",description:"macOS-inspired dock layout with Sonoma visual style.",color:"purple"},{icon:e.jsx(s.Sparkles,{className:"w-5 h-5"}),title:"macOS Tahoe",description:"Latest macOS Tahoe style with Tahoe and Tahoe Dock layouts.",color:"teal"}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Theme Architecture",description:"Built on Zustand, CSS custom properties, and Tailwind CSS v4 for a flexible, performant, and type-safe theming system.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-purple-500 via-violet-500 to-indigo-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(s.Layers,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"h2",className:"mb-2",children:"Core Technologies"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Three pillars that power the theming system"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6",children:o.map(t=>e.jsx(a.FeatureCard,{layout:"horizontal",...t},t.title))})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"h2",className:"mb-2",children:"Theme Variants"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Three visual styles with their own layout constraints"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6",children:i.map(t=>e.jsx(a.ColorCard,{icon:t.icon,title:t.title,description:t.description,color:t.color},t.title))})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"h2",className:"mb-2",children:"Layout Constraint Map"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Each theme variant restricts which layouts are available"})]}),e.jsx(a.CodeBlock,{language:"TS",code:`// THEME_STYLE_LAYOUTS mapping
 const THEME_STYLE_LAYOUTS: Record<THEME_VARIANT, ThemeStyleConfig> = {
   default: {
     validLayouts: [CLEAN, ADMIN, HORIZONTAL],

package/documentation/{ThemeArchitectureSection-DtwFtzPZ.js → ThemeArchitectureSection-Df9D_p1G.js}

@@ -1,6 +1,6 @@
-import { jsxs as t, Fragment as r, jsx as e } from "react/jsx-runtime";
-import { H as l, T as o, ax as c, aC as n, c as m } from "../index-4GONhZIF.js";
-import { Layers as d, Zap as h, Palette as p, Moon as u, Layout as g, Monitor as y, Sparkles as A } from "lucide-react";
+import { jsxs as t, Fragment as l, jsx as e } from "react/jsx-runtime";
+import { H as r, T as o, ax as c, aC as n, c as m } from "../index-sdOMz8GW.js";
+import { Layers as d, Zap as h, Palette as p, Moon as u, Layout as g, Monitor as S, Sparkles as A } from "lucide-react";
 import "react-router-dom";
 import "react";
 import "react-dom";
@@ -32,7 +32,7 @@ const x = () => {
       color: "blue"
     },
     {
-      icon: /* @__PURE__ */ e(y, { className: "w-5 h-5" }),
+      icon: /* @__PURE__ */ e(S, { className: "w-5 h-5" }),
       title: "macOS (Sonoma)",
       description: "macOS-inspired dock layout with Sonoma visual style.",
       color: "purple"
@@ -44,9 +44,9 @@ const x = () => {
       color: "teal"
     }
   ];
-  return /* @__PURE__ */ t(r, { children: [
+  return /* @__PURE__ */ t(l, { children: [
     /* @__PURE__ */ e(
-      l,
+      r,
       {
         title: "Theme Architecture",
         description: "Built on Zustand, CSS custom properties, and Tailwind CSS v4 for a flexible, performant, and type-safe theming system.",
@@ -105,7 +105,7 @@ const x = () => {
       /* @__PURE__ */ e(
         m,
         {
-          language: "typescript",
+          language: "TS",
           code: `// THEME_STYLE_LAYOUTS mapping
 const THEME_STYLE_LAYOUTS: Record<THEME_VARIANT, ThemeStyleConfig> = {
   default: {

package/documentation/{ThemeConfigurationSection-25YbgMAK.js → ThemeConfigurationSection-Bx--qzB0.js}

@@ -1,5 +1,5 @@
 import { jsxs as a, Fragment as m, jsx as e } from "react/jsx-runtime";
-import { H as d, T as l, C as t, a as c } from "../index-4GONhZIF.js";
+import { H as d, T as l, C as t, a as c } from "../index-sdOMz8GW.js";
 import { Settings as i } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{ThemeConfigurationSection-C5tQbIaa.js → ThemeConfigurationSection-wLp0xt1x.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-C0NugKZs.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const c=()=>{const o=[{label:"Mode",value:"'light' | 'dark'"},{label:"Theme Style",value:"'default' | 'macos' | 'macos-tahoe'"},{label:"Direction",value:"'ltr' | 'rtl'"},{label:"Layout",value:"6 options (constrained by theme style)"},{label:"Primary Color",value:"34+ predefined presets"},{label:"Dark Primary Color",value:"34+ predefined presets"},{label:"Secondary Color",value:"34+ predefined presets"},{label:"Dark Secondary Color",value:"34+ predefined presets"},{label:"Accent Color",value:"34+ predefined presets"},{label:"Dark Accent Color",value:"34+ predefined presets"},{label:"Muted Color",value:"34+ predefined presets"},{label:"Dark Muted Color",value:"34+ predefined presets"},{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'"}],s=[{name:"DEFAULT_PRIMARY",color:"#0052ff"},{name:"DEFAULT_DARK_PRIMARY",color:"#578bfa"},{name:"DEFAULT_SECONDARY",color:"#f3f4f6"},{name:"DEFAULT_DARK_SECONDARY",color:"#172131"},{name:"DEFAULT_ACCENT",color:"#f7d21a"},{name:"DEFAULT_DARK_ACCENT",color:"#936000"},{name:"DEFAULT_MUTED",color:"#4a5565"},{name:"DEFAULT_DARK_MUTED",color:"#828a99"},{name:"DEFAULT_LIGHT_BG",color:"#ffffff"},{name:"DEFAULT_DARK_BG",color:"#030712"},{name:"DEFAULT_LIGHT_DARK",color:"#f9fafb"},{name:"DEFAULT_DARK_LIGHT_DARK",color:"#0a101d"},{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:"#6a7282"},{name:"DARK_GRAY",color:"#6a7282"},{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"}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Theme Configuration",description:"All available configuration options and the 34 color presets that power the theming system.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-emerald-500 via-teal-500 to-cyan-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(t.Settings,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"h2",className:"mb-2",children:"Available Options"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"All configurable properties managed by the theme store"})]}),e.jsx(a.CardContainer,{children:e.jsx(a.CardTitle,{title:"Configuration Options",children:e.jsx("div",{className:"space-y-3",children:o.map((r,l)=>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 text-sm",children:r.label}),e.jsx("code",{className:"text-xs text-gray-600 dark:text-gray-400",children:r.value})]},l))})})})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"h2",className:"mb-2",children:"Color Presets"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"34 predefined colors (12 default + 22 spectrum)"})]}),e.jsx(a.CardContainer,{children:e.jsx(a.CardTitle,{title:"Preset Palette",children:e.jsxs("div",{className:"space-y-4",children:[e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-3",children:s.map((r,l)=>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-border shadow-sm",style:{backgroundColor:r.color}}),e.jsx("span",{className:"text-xs font-medium truncate",children:r.name})]},l))}),e.jsx(a.Typography,{tag:"p",className:"text-xs text-gray-500 dark:text-gray-400 mt-2",children:"Spectrum colors use the -50 value from Tucu UI Design Tokens. Default colors use semantic mappings (e.g., blue-60 for primary)."})]})})})]})]})};exports.default=c;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-DEZRGktf.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const c=()=>{const o=[{label:"Mode",value:"'light' | 'dark'"},{label:"Theme Style",value:"'default' | 'macos' | 'macos-tahoe'"},{label:"Direction",value:"'ltr' | 'rtl'"},{label:"Layout",value:"6 options (constrained by theme style)"},{label:"Primary Color",value:"34+ predefined presets"},{label:"Dark Primary Color",value:"34+ predefined presets"},{label:"Secondary Color",value:"34+ predefined presets"},{label:"Dark Secondary Color",value:"34+ predefined presets"},{label:"Accent Color",value:"34+ predefined presets"},{label:"Dark Accent Color",value:"34+ predefined presets"},{label:"Muted Color",value:"34+ predefined presets"},{label:"Dark Muted Color",value:"34+ predefined presets"},{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'"}],s=[{name:"DEFAULT_PRIMARY",color:"#0052ff"},{name:"DEFAULT_DARK_PRIMARY",color:"#578bfa"},{name:"DEFAULT_SECONDARY",color:"#f3f4f6"},{name:"DEFAULT_DARK_SECONDARY",color:"#172131"},{name:"DEFAULT_ACCENT",color:"#f7d21a"},{name:"DEFAULT_DARK_ACCENT",color:"#936000"},{name:"DEFAULT_MUTED",color:"#4a5565"},{name:"DEFAULT_DARK_MUTED",color:"#828a99"},{name:"DEFAULT_LIGHT_BG",color:"#ffffff"},{name:"DEFAULT_DARK_BG",color:"#030712"},{name:"DEFAULT_LIGHT_DARK",color:"#f9fafb"},{name:"DEFAULT_DARK_LIGHT_DARK",color:"#0a101d"},{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:"#6a7282"},{name:"DARK_GRAY",color:"#6a7282"},{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"}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Theme Configuration",description:"All available configuration options and the 34 color presets that power the theming system.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-emerald-500 via-teal-500 to-cyan-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(t.Settings,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"h2",className:"mb-2",children:"Available Options"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"All configurable properties managed by the theme store"})]}),e.jsx(a.CardContainer,{children:e.jsx(a.CardTitle,{title:"Configuration Options",children:e.jsx("div",{className:"space-y-3",children:o.map((r,l)=>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 text-sm",children:r.label}),e.jsx("code",{className:"text-xs text-gray-600 dark:text-gray-400",children:r.value})]},l))})})})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"h2",className:"mb-2",children:"Color Presets"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"34 predefined colors (12 default + 22 spectrum)"})]}),e.jsx(a.CardContainer,{children:e.jsx(a.CardTitle,{title:"Preset Palette",children:e.jsxs("div",{className:"space-y-4",children:[e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-3",children:s.map((r,l)=>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-border shadow-sm",style:{backgroundColor:r.color}}),e.jsx("span",{className:"text-xs font-medium truncate",children:r.name})]},l))}),e.jsx(a.Typography,{tag:"p",className:"text-xs text-gray-500 dark:text-gray-400 mt-2",children:"Spectrum colors use the -50 value from Tucu UI Design Tokens. Default colors use semantic mappings (e.g., blue-60 for primary)."})]})})})]})]})};exports.default=c;

package/documentation/{ThemeHooksSection-W_-66rEy.js → ThemeHooksSection-CAcrTFnG.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../index-C0NugKZs.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const i=()=>{const a=[{icon:e.jsx(s.Zap,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"useTheme",description:"Main hook — all state, setters, and actions. Zustand-based with localStorage persistence.",iconBgClassName:"from-yellow-500 via-amber-500 to-orange-500"},{icon:e.jsx(s.Palette,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"useThemeColor",description:"Injects 24 CSS variables (12 light/dark pairs) into document root for real-time theming.",iconBgClassName:"from-blue-500 via-cyan-500 to-teal-500"},{icon:e.jsx(s.Globe,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"useDirection",description:"Sets document.documentElement.dir for RTL/LTR layout support.",iconBgClassName:"from-purple-500 via-violet-500 to-indigo-500"}];return e.jsxs(e.Fragment,{children:[e.jsx(r.HeroCard,{title:"Theme Hooks",description:"Powerful hooks for accessing, modifying, and reacting to theme state throughout your application.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-yellow-500 via-amber-500 to-orange-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(s.Anchor,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(r.Typography,{tag:"h2",className:"mb-2",children:"Available Hooks"}),e.jsx(r.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Three hooks that power the theming system"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6",children:a.map(t=>e.jsx(r.FeatureCard,{layout:"horizontal",...t},t.title))})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(r.Typography,{tag:"h2",className:"mb-2",children:"useTheme Hook API"}),e.jsx(r.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Complete state, setters, and actions reference"})]}),e.jsxs("div",{className:"grid grid-cols-1 lg:grid-cols-2 gap-6",children:[e.jsx(r.CardContainer,{children:e.jsx(r.CardTitle,{title:"State Properties",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs(r.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400 text-sm",children:["Accessed via"," ",e.jsx("code",{className:"px-1 py-0.5 border border-border rounded text-xs",children:"useTheme()"})," ","— persisted to localStorage automatically."]}),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:"colorScheme (theme variant: default | macos | macos-tahoe)"}),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:"successPreset, darkSuccessPreset"}),e.jsx("li",{children:"warningPreset, darkWarningPreset"}),e.jsx("li",{children:"errorPreset, darkErrorPreset"}),e.jsx("li",{children:"infoPreset, darkInfoPreset"}),e.jsx("li",{children:"fgPreset, darkFgPreset"}),e.jsx("li",{children:"borderPreset, darkBorderPreset"}),e.jsx("li",{children:"backgroundVariant"}),e.jsx("li",{children:"isSettingsOpen, showSettings"})]})]})})}),e.jsx(r.CardContainer,{children:e.jsx(r.CardTitle,{title:"Setters",children:e.jsxs("div",{className:"space-y-4",children:[e.jsx(r.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400 text-sm",children:"Each setter updates the store and persists to localStorage."}),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:"setSuccessPreset, setDarkSuccessPreset"}),e.jsx("li",{children:"setWarningPreset, setDarkWarningPreset"}),e.jsx("li",{children:"setErrorPreset, setDarkErrorPreset"}),e.jsx("li",{children:"setInfoPreset, setDarkInfoPreset"}),e.jsx("li",{children:"setFgPreset, setDarkFgPreset"}),e.jsx("li",{children:"setBorderPreset, setDarkBorderPreset"}),e.jsx("li",{children:"setBackgroundVariant"}),e.jsx("li",{children:"setLogo, setLang, setIsSettingsOpen, setShowSettings"})]})]})})}),e.jsx(r.CardContainer,{children:e.jsx(r.CardTitle,{title:"Actions",children:e.jsxs("div",{className:"space-y-4",children:[e.jsx(r.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400 text-sm",children:"Compound actions that apply multiple state changes at once."}),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:"restoreDefaultColors — resets all color presets to defaults"}),e.jsx("li",{children:"applyMacOSTheme — sets layout to MACOS + Sonoma style"}),e.jsx("li",{children:"applyMacOSTahoeTheme — sets layout to MACOS_TAHOE + Tahoe style"}),e.jsx("li",{children:"applyThemeStyle(style: THEME_VARIANT) — generic applicator for any variant"})]})]})})}),e.jsx(r.CardContainer,{children:e.jsx(r.CardTitle,{title:"useThemeColor Variables",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs(r.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400 text-sm",children:["24 CSS variables injected into"," ",e.jsx("code",{className:"px-1 py-0.5 border border-border rounded text-xs",children:"document.documentElement"}),":"]}),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 / dark variant"}),e.jsx("li",{children:"--color-semantic-bg-secondary / dark variant"}),e.jsx("li",{children:"--color-semantic-accent-bold-yellow / dark variant"}),e.jsx("li",{children:"--color-semantic-fg-muted / dark variant"}),e.jsx("li",{children:"--color-semantic-bg / dark variant"}),e.jsx("li",{children:"--color-semantic-bg-secondary-wash / dark variant"}),e.jsx("li",{children:"--color-semantic-bg-positive / dark variant (success)"}),e.jsx("li",{children:"--color-semantic-bg-warning / dark variant (warning)"}),e.jsx("li",{children:"--color-semantic-bg-negative / dark variant (error)"}),e.jsx("li",{children:"--color-semantic-bg-info / dark variant (info)"}),e.jsx("li",{children:"--color-semantic-fg / dark variant (text foreground)"}),e.jsx("li",{children:"--color-semantic-line-primary-subtle / dark variant (border)"})]})]})})})]})]})]})};exports.default=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../index-DEZRGktf.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const i=()=>{const a=[{icon:e.jsx(s.Zap,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"useTheme",description:"Main hook — all state, setters, and actions. Zustand-based with localStorage persistence.",iconBgClassName:"from-yellow-500 via-amber-500 to-orange-500"},{icon:e.jsx(s.Palette,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"useThemeColor",description:"Injects 24 CSS variables (12 light/dark pairs) into document root for real-time theming.",iconBgClassName:"from-blue-500 via-cyan-500 to-teal-500"},{icon:e.jsx(s.Globe,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"useDirection",description:"Sets document.documentElement.dir for RTL/LTR layout support.",iconBgClassName:"from-purple-500 via-violet-500 to-indigo-500"}];return e.jsxs(e.Fragment,{children:[e.jsx(r.HeroCard,{title:"Theme Hooks",description:"Powerful hooks for accessing, modifying, and reacting to theme state throughout your application.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-yellow-500 via-amber-500 to-orange-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(s.Anchor,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(r.Typography,{tag:"h2",className:"mb-2",children:"Available Hooks"}),e.jsx(r.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Three hooks that power the theming system"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6",children:a.map(t=>e.jsx(r.FeatureCard,{layout:"horizontal",...t},t.title))})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(r.Typography,{tag:"h2",className:"mb-2",children:"useTheme Hook API"}),e.jsx(r.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Complete state, setters, and actions reference"})]}),e.jsxs("div",{className:"grid grid-cols-1 lg:grid-cols-2 gap-6",children:[e.jsx(r.CardContainer,{children:e.jsx(r.CardTitle,{title:"State Properties",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs(r.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400 text-sm",children:["Accessed via"," ",e.jsx("code",{className:"px-1 py-0.5 border border-border rounded text-xs",children:"useTheme()"})," ","— persisted to localStorage automatically."]}),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:"colorScheme (theme variant: default | macos | macos-tahoe)"}),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:"successPreset, darkSuccessPreset"}),e.jsx("li",{children:"warningPreset, darkWarningPreset"}),e.jsx("li",{children:"errorPreset, darkErrorPreset"}),e.jsx("li",{children:"infoPreset, darkInfoPreset"}),e.jsx("li",{children:"fgPreset, darkFgPreset"}),e.jsx("li",{children:"borderPreset, darkBorderPreset"}),e.jsx("li",{children:"backgroundVariant"}),e.jsx("li",{children:"isSettingsOpen, showSettings"})]})]})})}),e.jsx(r.CardContainer,{children:e.jsx(r.CardTitle,{title:"Setters",children:e.jsxs("div",{className:"space-y-4",children:[e.jsx(r.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400 text-sm",children:"Each setter updates the store and persists to localStorage."}),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:"setSuccessPreset, setDarkSuccessPreset"}),e.jsx("li",{children:"setWarningPreset, setDarkWarningPreset"}),e.jsx("li",{children:"setErrorPreset, setDarkErrorPreset"}),e.jsx("li",{children:"setInfoPreset, setDarkInfoPreset"}),e.jsx("li",{children:"setFgPreset, setDarkFgPreset"}),e.jsx("li",{children:"setBorderPreset, setDarkBorderPreset"}),e.jsx("li",{children:"setBackgroundVariant"}),e.jsx("li",{children:"setLogo, setLang, setIsSettingsOpen, setShowSettings"})]})]})})}),e.jsx(r.CardContainer,{children:e.jsx(r.CardTitle,{title:"Actions",children:e.jsxs("div",{className:"space-y-4",children:[e.jsx(r.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400 text-sm",children:"Compound actions that apply multiple state changes at once."}),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:"restoreDefaultColors — resets all color presets to defaults"}),e.jsx("li",{children:"applyMacOSTheme — sets layout to MACOS + Sonoma style"}),e.jsx("li",{children:"applyMacOSTahoeTheme — sets layout to MACOS_TAHOE + Tahoe style"}),e.jsx("li",{children:"applyThemeStyle(style: THEME_VARIANT) — generic applicator for any variant"})]})]})})}),e.jsx(r.CardContainer,{children:e.jsx(r.CardTitle,{title:"useThemeColor Variables",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs(r.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400 text-sm",children:["24 CSS variables injected into"," ",e.jsx("code",{className:"px-1 py-0.5 border border-border rounded text-xs",children:"document.documentElement"}),":"]}),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 / dark variant"}),e.jsx("li",{children:"--color-semantic-bg-secondary / dark variant"}),e.jsx("li",{children:"--color-semantic-accent-bold-yellow / dark variant"}),e.jsx("li",{children:"--color-semantic-fg-muted / dark variant"}),e.jsx("li",{children:"--color-semantic-bg / dark variant"}),e.jsx("li",{children:"--color-semantic-bg-secondary-wash / dark variant"}),e.jsx("li",{children:"--color-semantic-bg-positive / dark variant (success)"}),e.jsx("li",{children:"--color-semantic-bg-warning / dark variant (warning)"}),e.jsx("li",{children:"--color-semantic-bg-negative / dark variant (error)"}),e.jsx("li",{children:"--color-semantic-bg-info / dark variant (info)"}),e.jsx("li",{children:"--color-semantic-fg / dark variant (text foreground)"}),e.jsx("li",{children:"--color-semantic-line-primary-subtle / dark variant (border)"})]})]})})})]})]})]})};exports.default=i;

package/documentation/{ThemeHooksSection-C-kIo8WZ.js → ThemeHooksSection-e7GuW9VE.js}

@@ -1,5 +1,5 @@
 import { jsxs as r, Fragment as l, jsx as e } from "react/jsx-runtime";
-import { H as c, T as t, ax as o, C as a, a as s } from "../index-4GONhZIF.js";
+import { H as c, T as t, ax as o, C as a, a as s } from "../index-sdOMz8GW.js";
 import { Anchor as n, Zap as d, Palette as h, Globe as m } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{ThemeProviderIntegrationSection-Cx2QOk6u.js → ThemeProviderIntegrationSection-CIyksSxQ.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-C0NugKZs.js"),o=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const a=()=>e.jsxs(e.Fragment,{children:[e.jsx(t.HeroCard,{title:"ThemeProvider Integration",description:"The routing system is fully integrated with ThemeProvider. It provides seamless navigation, layout management, and theming through the architecturalPatterns prop.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-blue-500 via-indigo-500 to-purple-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(o.Puzzle,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(t.Typography,{tag:"h2",className:"mb-2",children:"ThemeProvider Props"}),e.jsx(t.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"The ThemeProvider accepts layout, theming, and routing configuration"})]}),e.jsx(t.CardContainer,{children:e.jsx(t.CardTitle,{title:"Interface Definition",children: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-DEZRGktf.js"),o=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const a=()=>e.jsxs(e.Fragment,{children:[e.jsx(t.HeroCard,{title:"ThemeProvider Integration",description:"The routing system is fully integrated with ThemeProvider. It provides seamless navigation, layout management, and theming through the architecturalPatterns prop.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-blue-500 via-indigo-500 to-purple-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(o.Puzzle,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(t.Typography,{tag:"h2",className:"mb-2",children:"ThemeProvider Props"}),e.jsx(t.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"The ThemeProvider accepts layout, theming, and routing configuration"})]}),e.jsx(t.CardContainer,{children:e.jsx(t.CardTitle,{title:"Interface Definition",children:e.jsx(t.CodeBlock,{language:"TS",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/{ThemeProviderIntegrationSection-Bq7eJCE2.js → ThemeProviderIntegrationSection-EWhbzybV.js}

@@ -1,16 +1,16 @@
 import { jsxs as t, Fragment as n, jsx as e } from "react/jsx-runtime";
-import { H as i, T as o, C as a, a as r, c as s } from "../index-4GONhZIF.js";
-import { Puzzle as m } from "lucide-react";
+import { H as m, T as o, C as a, a as r, c as s } from "../index-sdOMz8GW.js";
+import { Puzzle as i } from "lucide-react";
 import "react-router-dom";
 import "react";
 import "react-dom";
 const P = () => /* @__PURE__ */ t(n, { children: [
   /* @__PURE__ */ e(
-    i,
+    m,
     {
       title: "ThemeProvider Integration",
       description: "The routing system is fully integrated with ThemeProvider. It provides seamless navigation, layout management, and theming through the architecturalPatterns prop.",
-      icon: /* @__PURE__ */ e("div", { className: "w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-blue-500 via-indigo-500 to-purple-500 rounded-full flex items-center justify-center shadow-lg", children: /* @__PURE__ */ e(m, { className: "w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg" }) })
+      icon: /* @__PURE__ */ e("div", { className: "w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-blue-500 via-indigo-500 to-purple-500 rounded-full flex items-center justify-center shadow-lg", children: /* @__PURE__ */ e(i, { className: "w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg" }) })
     }
   ),
   /* @__PURE__ */ t("section", { className: "space-y-8", children: [
@@ -25,7 +25,7 @@ const P = () => /* @__PURE__ */ t(n, { children: [
         }
       )
     ] }),
-    /* @__PURE__ */ e(a, { children: /* @__PURE__ */ e(r, { title: "Interface Definition", children: /* @__PURE__ */ e(s, { language: "typescript", code: `interface StandaloneAppProviderProps
+    /* @__PURE__ */ e(a, { children: /* @__PURE__ */ e(r, { title: "Interface Definition", children: /* @__PURE__ */ e(s, { language: "TS", 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-FqbgJmWa.js → ThemeProviderRequiredSection-DwaR2kyw.js}

@@ -1,5 +1,5 @@
 import { jsxs as r, Fragment as o, jsx as e } from "react/jsx-runtime";
-import { H as a, T as t, aj as d, C as i, a as n } from "../index-4GONhZIF.js";
+import { H as a, T as t, aj as d, C as i, a as n } from "../index-sdOMz8GW.js";
 import { Shield as s, AlertTriangle as l } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{ThemeProviderRequiredSection-HBMuiqAj.js → ThemeProviderRequiredSection-uFOhg-q9.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../index-C0NugKZs.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=()=>e.jsxs(e.Fragment,{children:[e.jsx(r.HeroCard,{title:"ThemeProvider Required",description:"Essential prerequisite for using the layout system and theme hooks. All layout components depend on the theme context.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-purple-500 via-violet-500 to-indigo-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(t.Shield,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("div",{className:"text-center",children:[e.jsx(r.Typography,{tag:"h2",className:"mb-2",children:"ThemeProvider Required"}),e.jsx(r.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Essential prerequisite for using the layout system and theme hooks"})]}),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(t.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-border dark:border-border 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-border dark:border-border 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=s;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../index-DEZRGktf.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=()=>e.jsxs(e.Fragment,{children:[e.jsx(r.HeroCard,{title:"ThemeProvider Required",description:"Essential prerequisite for using the layout system and theme hooks. All layout components depend on the theme context.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-purple-500 via-violet-500 to-indigo-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(t.Shield,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("div",{className:"text-center",children:[e.jsx(r.Typography,{tag:"h2",className:"mb-2",children:"ThemeProvider Required"}),e.jsx(r.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Essential prerequisite for using the layout system and theme hooks"})]}),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(t.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-border dark:border-border 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-border dark:border-border 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=s;

package/documentation/{ThemeProviderSection-tPE7Fvv3.js → ThemeProviderSection-BcFx0JTn.js}

@@ -1,5 +1,5 @@
 import { jsxs as r, Fragment as i, jsx as e } from "react/jsx-runtime";
-import { H as d, T as o, C as p, a as l, y as c } from "../index-4GONhZIF.js";
+import { H as d, T as o, C as p, a as l, y as c } from "../index-sdOMz8GW.js";
 import { Component as m } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{ThemeProviderSection-QT77eC5J.js → ThemeProviderSection-CcGXxj81.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-C0NugKZs.js"),n=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const i=()=>{const o=[{key:"prop",label:"Prop"},{key:"type",label:"Type"},{key:"default",label:"Default"},{key:"description",label:"Description"}],s=[{prop:"menuItems",type:"IMenuItem[]",default:"Required",description:"Navigation menu items"},{prop:"themeStyle",type:"'default' | 'macos' | 'macos-tahoe'",default:"'default'",description:"Visual theme variant — constrains available layouts"},{prop:"layout",type:"LAYOUT_OPTIONS",default:"HORIZONTAL",description:"Layout type (constrained by themeStyle)"},{prop:"mode",type:"'light' | 'dark'",default:"'dark'",description:"Color mode"},{prop:"showSettings",type:"boolean",default:"false",description:"Show theme settings drawer button"},{prop:"customPaletteColor",type:"object",default:"-",description:"Custom color palette with 24 color slots organized in groups: Brand (primary, accent), Surfaces (secondary, backgrounds), Text (fg, muted, border), and Status (success, warning, error, info) — each with light/dark variants"},{prop:"logo",type:"LogoType",default:"{ path: '/', name: '' }",description:"Logo configuration object with path and name"},{prop:"brandColor",type:"PresetColorType",default:"-",description:"Brand color preset name"},{prop:"headerClassName",type:"string",default:"-",description:"Custom CSS classes for header"},{prop:"contentClassName",type:"string",default:"-",description:"Custom CSS classes for content area"},{prop:"fullWidth",type:"boolean",default:"false",description:"Enable full width layout"},{prop:"rightButton",type:"ReactNode",default:"-",description:"Custom button component for header right area"},{prop:"className",type:"string",default:"-",description:"Custom CSS classes for root layout"},{prop:"setCurrentPathname",type:"(pathname: string) => void",default:"-",description:"Callback invoked on route change with current pathname"}];return e.jsxs(e.Fragment,{children:[e.jsx(t.HeroCard,{title:"ThemeProvider Component",description:"The root component that wraps your application, manages all theme state, handles routing, and applies color configurations.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-blue-500 via-cyan-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(n.Component,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(t.Typography,{tag:"h2",className:"mb-2",children:"Props Reference"}),e.jsx(t.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Complete list of ThemeProvider configuration props"})]}),e.jsx(t.CardContainer,{children:e.jsx(t.CardTitle,{title:"ThemeProvider Props",children:e.jsxs("div",{className:"space-y-6",children:[e.jsxs(t.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:["Located in"," ",e.jsx("code",{className:"px-1 py-0.5 border border-border rounded text-xs",children:"ui/tucu-ui/src/themes/components/theme-provider/"})]}),e.jsx(t.BasicTable,{columns:o.map(r=>({...r,render:a=>r.key==="prop"?e.jsx("code",{className:"text-xs text-brand",children:String(a??"")}):r.key==="type"||r.key==="default"?e.jsx("code",{className:"text-xs text-gray-600 dark:text-gray-400",children:String(a??"")}):r.key==="description"?e.jsx("span",{className:"text-xs text-gray-600 dark:text-gray-400",children:String(a??"")}):String(a??"")})),data:s,containerClassName:"mb-4"})]})})})]})]})};exports.default=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-DEZRGktf.js"),n=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const i=()=>{const o=[{key:"prop",label:"Prop"},{key:"type",label:"Type"},{key:"default",label:"Default"},{key:"description",label:"Description"}],s=[{prop:"menuItems",type:"IMenuItem[]",default:"Required",description:"Navigation menu items"},{prop:"themeStyle",type:"'default' | 'macos' | 'macos-tahoe'",default:"'default'",description:"Visual theme variant — constrains available layouts"},{prop:"layout",type:"LAYOUT_OPTIONS",default:"HORIZONTAL",description:"Layout type (constrained by themeStyle)"},{prop:"mode",type:"'light' | 'dark'",default:"'dark'",description:"Color mode"},{prop:"showSettings",type:"boolean",default:"false",description:"Show theme settings drawer button"},{prop:"customPaletteColor",type:"object",default:"-",description:"Custom color palette with 24 color slots organized in groups: Brand (primary, accent), Surfaces (secondary, backgrounds), Text (fg, muted, border), and Status (success, warning, error, info) — each with light/dark variants"},{prop:"logo",type:"LogoType",default:"{ path: '/', name: '' }",description:"Logo configuration object with path and name"},{prop:"brandColor",type:"PresetColorType",default:"-",description:"Brand color preset name"},{prop:"headerClassName",type:"string",default:"-",description:"Custom CSS classes for header"},{prop:"contentClassName",type:"string",default:"-",description:"Custom CSS classes for content area"},{prop:"fullWidth",type:"boolean",default:"false",description:"Enable full width layout"},{prop:"rightButton",type:"ReactNode",default:"-",description:"Custom button component for header right area"},{prop:"className",type:"string",default:"-",description:"Custom CSS classes for root layout"},{prop:"setCurrentPathname",type:"(pathname: string) => void",default:"-",description:"Callback invoked on route change with current pathname"}];return e.jsxs(e.Fragment,{children:[e.jsx(t.HeroCard,{title:"ThemeProvider Component",description:"The root component that wraps your application, manages all theme state, handles routing, and applies color configurations.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-blue-500 via-cyan-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(n.Component,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(t.Typography,{tag:"h2",className:"mb-2",children:"Props Reference"}),e.jsx(t.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Complete list of ThemeProvider configuration props"})]}),e.jsx(t.CardContainer,{children:e.jsx(t.CardTitle,{title:"ThemeProvider Props",children:e.jsxs("div",{className:"space-y-6",children:[e.jsxs(t.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:["Located in"," ",e.jsx("code",{className:"px-1 py-0.5 border border-border rounded text-xs",children:"ui/tucu-ui/src/themes/components/theme-provider/"})]}),e.jsx(t.BasicTable,{columns:o.map(r=>({...r,render:a=>r.key==="prop"?e.jsx("code",{className:"text-xs text-brand",children:String(a??"")}):r.key==="type"||r.key==="default"?e.jsx("code",{className:"text-xs text-gray-600 dark:text-gray-400",children:String(a??"")}):r.key==="description"?e.jsx("span",{className:"text-xs text-gray-600 dark:text-gray-400",children:String(a??"")}):String(a??"")})),data:s,containerClassName:"mb-4"})]})})})]})]})};exports.default=i;

package/documentation/{ToastSection-CwyCI-Ba.js → ToastSection-DOaIp0-s.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-C0NugKZs.js"),i=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>{const{addToast:a}=t.useToastStore(),r=[{key:"prop",label:"Prop",render:s=>e.jsx("code",{className:"text-xs text-brand",children:String(s)})},{key:"type",label:"Type",render:s=>e.jsx("code",{className:"text-xs",children:String(s)})},{key:"default",label:"Default",render:s=>{const o=String(s);return o==="required"?e.jsx("span",{className:"text-xs text-red-500",children:"required"}):e.jsx("code",{className:"text-xs",children:o})}},{key:"description",label:"Description"}],n=[{prop:"Toast Component",type:"React.FC",default:"-",description:"The Toast component renders automatically from the toast store"},{prop:"useToastStore",type:"Hook",default:"-",description:"Hook to manage toast notifications"}];return e.jsxs(e.Fragment,{children:[e.jsx(t.HeroCard,{title:"Toast",description:`A toast notification system for displaying temporary messages with
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-DEZRGktf.js"),i=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>{const{addToast:a}=t.useToastStore(),r=[{key:"prop",label:"Prop",render:s=>e.jsx("code",{className:"text-xs text-brand",children:String(s)})},{key:"type",label:"Type",render:s=>e.jsx("code",{className:"text-xs",children:String(s)})},{key:"default",label:"Default",render:s=>{const o=String(s);return o==="required"?e.jsx("span",{className:"text-xs text-red-500",children:"required"}):e.jsx("code",{className:"text-xs",children:o})}},{key:"description",label:"Description"}],n=[{prop:"Toast Component",type:"React.FC",default:"-",description:"The Toast component renders automatically from the toast store"},{prop:"useToastStore",type:"Hook",default:"-",description:"Hook to manage toast notifications"}];return e.jsxs(e.Fragment,{children:[e.jsx(t.HeroCard,{title:"Toast",description:`A toast notification system for displaying temporary messages with
           multiple variants and auto-dismiss functionality.`,icon:e.jsx("div",{className:"w-16 h-16 sm:w-20 sm:h-20 md:w-24 md:h-24 bg-linear-to-br from-red-600 to-orange-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(i.BellRing,{className:"w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 text-white filter drop-shadow-lg"})})}),e.jsx(t.CardContainer,{className:"overflow-hidden",children:e.jsx(t.CardTitle,{title:"Basic Examples",className:"mt-2 mb-2",children:e.jsxs("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(t.CardContainer,{className:"p-4",children:[e.jsx(t.Typography,{tag:"h5",className:"mb-3",children:"Success Toast"}),e.jsx(t.Button,{onClick:()=>a({id:Date.now().toString(),title:"Success!",message:"Operation completed successfully.",variant:"success"}),children:"Show Success Toast"})]}),e.jsxs(t.CardContainer,{className:"p-4",children:[e.jsx(t.Typography,{tag:"h5",className:"mb-3",children:"Error Toast"}),e.jsx(t.Button,{onClick:()=>a({id:Date.now().toString(),title:"Error!",message:"Something went wrong.",variant:"destructive"}),children:"Show Error Toast"})]}),e.jsxs(t.CardContainer,{className:"p-4",children:[e.jsx(t.Typography,{tag:"h5",className:"mb-3",children:"Warning Toast"}),e.jsx(t.Button,{onClick:()=>a({id:Date.now().toString(),title:"Warning!",message:"Please review this information.",variant:"warning"}),children:"Show Warning Toast"})]}),e.jsxs(t.CardContainer,{className:"p-4",children:[e.jsx(t.Typography,{tag:"h5",className:"mb-3",children:"Info Toast"}),e.jsx(t.Button,{onClick:()=>a({id:Date.now().toString(),title:"Info",message:"Here is some information.",variant:"info"}),children:"Show Info Toast"})]})]}),e.jsx(t.Toast,{})]})})}),e.jsx(t.CardContainer,{className:"overflow-hidden",children:e.jsx(t.CardTitle,{title:"Props",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(t.BasicTable,{columns:r,data:n})})})}),e.jsx(t.CardContainer,{className:"overflow-hidden",children:e.jsx(t.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(t.CodeBlock,{language:"tsx",code:`import { Toast, useToastStore } from '@e-burgos/tucu-ui';
 
 function MyComponent() {

package/documentation/{ToastSection-H1vwT3GU.js → ToastSection-DdwtcOTv.js}

@@ -1,5 +1,5 @@
 import { jsxs as t, Fragment as c, jsx as e } from "react/jsx-runtime";
-import { al as d, H as m, C as s, a as n, T as r, x as i, am as h, y as p, c as u } from "../index-4GONhZIF.js";
+import { al as d, H as m, C as s, a as n, T as r, x as i, am as h, y as p, c as u } from "../index-sdOMz8GW.js";
 import { BellRing as g } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{ToggleBarSection-D0omE45k.js → ToggleBarSection-Cm-9D7PK.js}

@@ -1,6 +1,6 @@
 import { jsxs as t, Fragment as T, jsx as e } from "react/jsx-runtime";
 import { useState as d } from "react";
-import { H as b, C as l, a as i, T as r, w as s, P as w, A as N, c as f } from "../index-4GONhZIF.js";
+import { H as b, C as l, a as i, T as r, w as s, P as w, A as N, c as f } from "../index-sdOMz8GW.js";
 import { ToggleRight as B, Save as h } from "lucide-react";
 import "react-router-dom";
 import "react-dom";

package/documentation/{ToggleBarSection-DX_2Mvkt.js → ToggleBarSection-kJfpBDL1.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("react"),a=require("../index-C0NugKZs.js"),r=require("lucide-react");require("react-router-dom");require("react-dom");const u=()=>{const[l,t]=o.useState(!1),[n,d]=o.useState(!0),i=[{label:"Primary",color:"primary"},{label:"Secondary",color:"secondary"},{label:"Danger",color:"danger"},{label:"Info",color:"info"},{label:"Success",color:"success"},{label:"Warning",color:"warning"}],[h,g]=o.useState({primary:!0,secondary:!0,danger:!0,info:!0,success:!0,warning:!0}),m=s=>()=>{g(c=>({...c,[s]:!c[s]}))};return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"ToggleBar",description:"A toggle bar component with title, subtitle, icon, and optional content. Perfect for settings panels and feature toggles.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-orange-500 via-amber-500 to-yellow-500 rounded-full flex items-center justify-center shadow-lg border border-orange-500/50",children:e.jsx(r.ToggleRight,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),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 ToggleBar"}),e.jsx(a.ToggleBar,{title:"Enable Notifications",checked:l,onChange:()=>t(!l)})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Subtitle"}),e.jsx(a.ToggleBar,{title:"Dark Mode",subTitle:"Switch between light and dark themes",checked:l,onChange:()=>t(!l)})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Icon"}),e.jsx(a.ToggleBar,{title:"Auto Save",subTitle:"Automatically save your work",icon:e.jsx(r.Save,{className:"w-5 h-5"}),checked:l,onChange:()=>t(!l)})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Children"}),e.jsx(a.ToggleBar,{title:"Advanced Settings",subTitle:"Show advanced configuration options",checked:l,onChange:()=>t(!l),children:e.jsx("div",{className:"mt-4 space-y-2",children:e.jsx(a.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:"Additional content appears here when toggle is enabled."})})})]})]})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Colors",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx("div",{className:"grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-3",children:i.map(({label:s,color:c})=>e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:s}),e.jsx(a.ToggleBar,{title:`${s} Toggle`,subTitle:"Toggle with inherited Switch color",color:c,checked:h[c],onChange:m(c)})]},c))})})})}),e.jsx(a.PropPlayground,{componentName:"ToggleBar",defaultValues:{title:"Preview ToggleBar",subTitle:"Use the controls to adjust the component",color:"primary"},includeProps:["title","subTitle","color"],excludeProps:["checked","onChange","icon","children"],children:s=>e.jsx("div",{className:"w-full max-w-2xl",children:e.jsx(a.ToggleBar,{...s,icon:e.jsx(r.Save,{className:"w-5 h-5"}),checked:n,onChange:()=>d(c=>!c)})})}),e.jsx(a.AutoPropsTable,{componentName:"ToggleBar"}),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 { ToggleBar, LucideIcons } from '@e-burgos/tucu-ui';
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("react"),a=require("../index-DEZRGktf.js"),r=require("lucide-react");require("react-router-dom");require("react-dom");const u=()=>{const[l,t]=o.useState(!1),[n,d]=o.useState(!0),i=[{label:"Primary",color:"primary"},{label:"Secondary",color:"secondary"},{label:"Danger",color:"danger"},{label:"Info",color:"info"},{label:"Success",color:"success"},{label:"Warning",color:"warning"}],[h,g]=o.useState({primary:!0,secondary:!0,danger:!0,info:!0,success:!0,warning:!0}),m=s=>()=>{g(c=>({...c,[s]:!c[s]}))};return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"ToggleBar",description:"A toggle bar component with title, subtitle, icon, and optional content. Perfect for settings panels and feature toggles.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-orange-500 via-amber-500 to-yellow-500 rounded-full flex items-center justify-center shadow-lg border border-orange-500/50",children:e.jsx(r.ToggleRight,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),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 ToggleBar"}),e.jsx(a.ToggleBar,{title:"Enable Notifications",checked:l,onChange:()=>t(!l)})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Subtitle"}),e.jsx(a.ToggleBar,{title:"Dark Mode",subTitle:"Switch between light and dark themes",checked:l,onChange:()=>t(!l)})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Icon"}),e.jsx(a.ToggleBar,{title:"Auto Save",subTitle:"Automatically save your work",icon:e.jsx(r.Save,{className:"w-5 h-5"}),checked:l,onChange:()=>t(!l)})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Children"}),e.jsx(a.ToggleBar,{title:"Advanced Settings",subTitle:"Show advanced configuration options",checked:l,onChange:()=>t(!l),children:e.jsx("div",{className:"mt-4 space-y-2",children:e.jsx(a.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:"Additional content appears here when toggle is enabled."})})})]})]})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Colors",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx("div",{className:"grid grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-3",children:i.map(({label:s,color:c})=>e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:s}),e.jsx(a.ToggleBar,{title:`${s} Toggle`,subTitle:"Toggle with inherited Switch color",color:c,checked:h[c],onChange:m(c)})]},c))})})})}),e.jsx(a.PropPlayground,{componentName:"ToggleBar",defaultValues:{title:"Preview ToggleBar",subTitle:"Use the controls to adjust the component",color:"primary"},includeProps:["title","subTitle","color"],excludeProps:["checked","onChange","icon","children"],children:s=>e.jsx("div",{className:"w-full max-w-2xl",children:e.jsx(a.ToggleBar,{...s,icon:e.jsx(r.Save,{className:"w-5 h-5"}),checked:n,onChange:()=>d(c=>!c)})})}),e.jsx(a.AutoPropsTable,{componentName:"ToggleBar"}),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 { ToggleBar, LucideIcons } from '@e-burgos/tucu-ui';
 
 const [checked, setChecked] = useState(false);