@e-burgos/tucu-ui 2.0.9 → 2.0.10

package/documentation/{BestPracticesSection-DL24k5DX.js → BestPracticesSection-B9oMqKhX.js}

@@ -1,5 +1,5 @@
 import { jsxs as s, Fragment as m, jsx as e } from "react/jsx-runtime";
-import { H as h, T as a, C as t, c as l } from "../index-lfg6LZ1p.js";
+import { H as h, T as a, C as t, c as l } from "../index-19KsCnyX.js";
 import { ShieldCheck as p, Check as i, X as n, Puzzle as u, Monitor as g } from "lucide-react";
 import "react-router-dom";
 import "react";
@@ -89,7 +89,7 @@ const N = () => {
           /* @__PURE__ */ e("div", { className: "p-2 rounded-lg bg-linear-to-br from-indigo-500 to-purple-500 shadow-lg", children: /* @__PURE__ */ e(u, { className: "w-5 h-5 text-white filter drop-shadow-sm" }) }),
           /* @__PURE__ */ e(a, { tag: "h3", className: "font-semibold", children: "Accessible Modal Pattern" })
         ] }),
-        /* @__PURE__ */ e("div", { className: "bg-light-dark p-4 rounded-xl border dark:border-gray-700 overflow-x-auto", children: /* @__PURE__ */ e(
+        /* @__PURE__ */ e("div", { className: "bg-light-dark p-4 rounded-xl border dark:border-border overflow-x-auto", children: /* @__PURE__ */ e(
           l,
           {
             language: "tsx",
@@ -119,7 +119,7 @@ const N = () => {
           /* @__PURE__ */ e("div", { className: "p-2 rounded-lg bg-linear-to-br from-blue-500 to-cyan-500 shadow-lg", children: /* @__PURE__ */ e(g, { className: "w-5 h-5 text-white filter drop-shadow-sm" }) }),
           /* @__PURE__ */ e(a, { tag: "h3", className: "font-semibold", children: "Responsive Layout Pattern" })
         ] }),
-        /* @__PURE__ */ e("div", { className: "bg-light-dark p-4 rounded-xl border dark:border-gray-700 overflow-x-auto", children: /* @__PURE__ */ e(
+        /* @__PURE__ */ e("div", { className: "bg-light-dark p-4 rounded-xl border dark:border-border overflow-x-auto", children: /* @__PURE__ */ e(
           l,
           {
             language: "tsx",

package/documentation/{BestPracticesSection-BklrYpDV.js → BestPracticesSection-BFNYdJVh.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-BaGqriuz.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>{const r=["Use LucideIcons namespace for general UI icons (1500+ available)","Use custom icons for domain-specific needs (crypto, layouts, brands)","Size icons with Tailwind classes: w-4 h-4, w-5 h-5, w-6 h-6","Use currentColor via text-* classes for theme-aware coloring",'Add aria-hidden="true" on decorative icons next to text',"Add aria-label on buttons containing only an icon","Use consistent sizes within the same context (buttons, nav, etc.)","Prefer className over inline style for sizing and color"],n=["Don't import Lucide icons individually — use LucideIcons.* namespace","Don't mix sizing approaches (className vs size prop) in same project","Don't use icon-only buttons without aria-label","Don't use color alone to convey meaning (pair with text or shape)","Don't hardcode colors with fill/stroke — use Tailwind text-* classes","Don't import the entire icon set manually — rely on tree-shaking","Don't use custom Tucu icons when Lucide has an equivalent","Don't forget hover/focus states on interactive icons"],c=[{title:"Lucide is External",description:"lucide-react is not bundled inside tucu-ui — your bundler tree-shakes it. Only icons you reference are included.",icon:e.jsx(a.Package,{className:"w-5 h-5 text-green-500"})},{title:"Custom Icons Are Bundled",description:"All 96 custom icons are always included in the tucu-ui bundle. They are small SVGs (~200B each).",icon:e.jsx(a.HardDrive,{className:"w-5 h-5 text-blue-500"})},{title:"Avoid Dynamic Imports",description:"Don't lazy-load individual icons. SVGs are tiny and the network overhead outweighs the savings.",icon:e.jsx(a.Zap,{className:"w-5 h-5 text-amber-500"})},{title:"Use Namespace Pattern",description:"LucideIcons.Home is a single import. Your bundler only includes Home, not the entire library.",icon:e.jsx(a.TreeDeciduous,{className:"w-5 h-5 text-purple-500"})}];return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Best Practices",description:"Guidelines for optimal icon usage — performance, accessibility, consistency, and maintainability patterns.",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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(a.CheckCircle,{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(s.Typography,{tag:"h2",className:"mb-2",children:"Do's and Don'ts"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Quick reference for icon best practices"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4 sm:gap-6",children:[e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-3",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-4",children:[e.jsx(a.CheckCircle,{className:"w-5 h-5 text-green-500"}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold text-green-700 dark:text-green-400",children:"Do"})]}),r.map((t,i)=>e.jsxs("div",{className:"flex items-start gap-2",children:[e.jsx(a.Check,{className:"w-4 h-4 text-green-500 shrink-0 mt-0.5"}),e.jsx(s.Typography,{tag:"span",className:"text-sm text-gray-600 dark:text-gray-400",children:t})]},i))]})}),e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-3",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-4",children:[e.jsx(a.XCircle,{className:"w-5 h-5 text-red-500"}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold text-red-700 dark:text-red-400",children:"Don't"})]}),n.map((t,i)=>e.jsxs("div",{className:"flex items-start gap-2",children:[e.jsx(a.X,{className:"w-4 h-4 text-red-500 shrink-0 mt-0.5"}),e.jsx(s.Typography,{tag:"span",className:"text-sm text-gray-600 dark:text-gray-400",children:t})]},i))]})})]})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(s.Typography,{tag:"h2",className:"mb-2",children:"Performance Tips"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"How the icon system affects bundle size"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6",children:c.map((t,i)=>e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[t.icon,e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:t.title})]}),e.jsx(s.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400 leading-relaxed",children:t.description})]})},i))})]})]})};exports.default=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-DMs_SmPq.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>{const r=["Use LucideIcons namespace for general UI icons (1500+ available)","Use custom icons for domain-specific needs (crypto, layouts, brands)","Size icons with Tailwind classes: w-4 h-4, w-5 h-5, w-6 h-6","Use currentColor via text-* classes for theme-aware coloring",'Add aria-hidden="true" on decorative icons next to text',"Add aria-label on buttons containing only an icon","Use consistent sizes within the same context (buttons, nav, etc.)","Prefer className over inline style for sizing and color"],n=["Don't import Lucide icons individually — use LucideIcons.* namespace","Don't mix sizing approaches (className vs size prop) in same project","Don't use icon-only buttons without aria-label","Don't use color alone to convey meaning (pair with text or shape)","Don't hardcode colors with fill/stroke — use Tailwind text-* classes","Don't import the entire icon set manually — rely on tree-shaking","Don't use custom Tucu icons when Lucide has an equivalent","Don't forget hover/focus states on interactive icons"],c=[{title:"Lucide is External",description:"lucide-react is not bundled inside tucu-ui — your bundler tree-shakes it. Only icons you reference are included.",icon:e.jsx(a.Package,{className:"w-5 h-5 text-green-500"})},{title:"Custom Icons Are Bundled",description:"All 96 custom icons are always included in the tucu-ui bundle. They are small SVGs (~200B each).",icon:e.jsx(a.HardDrive,{className:"w-5 h-5 text-blue-500"})},{title:"Avoid Dynamic Imports",description:"Don't lazy-load individual icons. SVGs are tiny and the network overhead outweighs the savings.",icon:e.jsx(a.Zap,{className:"w-5 h-5 text-amber-500"})},{title:"Use Namespace Pattern",description:"LucideIcons.Home is a single import. Your bundler only includes Home, not the entire library.",icon:e.jsx(a.TreeDeciduous,{className:"w-5 h-5 text-purple-500"})}];return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Best Practices",description:"Guidelines for optimal icon usage — performance, accessibility, consistency, and maintainability patterns.",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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(a.CheckCircle,{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(s.Typography,{tag:"h2",className:"mb-2",children:"Do's and Don'ts"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Quick reference for icon best practices"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4 sm:gap-6",children:[e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-3",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-4",children:[e.jsx(a.CheckCircle,{className:"w-5 h-5 text-green-500"}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold text-green-700 dark:text-green-400",children:"Do"})]}),r.map((t,i)=>e.jsxs("div",{className:"flex items-start gap-2",children:[e.jsx(a.Check,{className:"w-4 h-4 text-green-500 shrink-0 mt-0.5"}),e.jsx(s.Typography,{tag:"span",className:"text-sm text-gray-600 dark:text-gray-400",children:t})]},i))]})}),e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-3",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-4",children:[e.jsx(a.XCircle,{className:"w-5 h-5 text-red-500"}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold text-red-700 dark:text-red-400",children:"Don't"})]}),n.map((t,i)=>e.jsxs("div",{className:"flex items-start gap-2",children:[e.jsx(a.X,{className:"w-4 h-4 text-red-500 shrink-0 mt-0.5"}),e.jsx(s.Typography,{tag:"span",className:"text-sm text-gray-600 dark:text-gray-400",children:t})]},i))]})})]})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(s.Typography,{tag:"h2",className:"mb-2",children:"Performance Tips"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"How the icon system affects bundle size"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6",children:c.map((t,i)=>e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[t.icon,e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:t.title})]}),e.jsx(s.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400 leading-relaxed",children:t.description})]})},i))})]})]})};exports.default=l;

package/documentation/{BestPracticesSection-41CW61J-.js → BestPracticesSection-BIbDXxnD.js}

@@ -1,5 +1,5 @@
 import { jsxs as t, Fragment as n, jsx as e } from "react/jsx-runtime";
-import { H as l, T as a, C as m } from "../index-lfg6LZ1p.js";
+import { H as l, T as a, C as m } from "../index-19KsCnyX.js";
 import { Star as c, CheckCircle as d, ArrowRight as p } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{BestPracticesSection-wKpFsyId.js → BestPracticesSection-BYBZdfg8.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-BaGqriuz.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const o=()=>{const i=["Use descriptive route names and paths","Keep route hierarchy shallow (max 2-3 levels)","Use consistent naming conventions across routes","Leverage TypeScript for type-safe route definitions","Use useMemo for dynamic route generation","Include icons for better navigation UX","Test routes with different user roles and permissions","Use basePath for MFE applications","Provide isAuthenticated and loginUrl in MFE mode","Use enableNestedRoutes when child components need internal routing"],n=["Create overly deep nesting (>3 levels)",'Use generic names like "Page" or "Component"',"Hardcode paths in components — use ReactRouter hooks","Forget to handle 404 pages with customRoutes","Mix routing logic with business logic","Skip accessibility considerations in navigation","Ignore mobile navigation UX patterns","Mix Standalone and MFE props in the same ThemeProvider","Import directly from react-router-dom — use ReactRouter namespace","Use StandaloneAppThemeProvider directly — use ThemeProvider"];return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Best Practices",description:"Guidelines for building maintainable, accessible, and type-safe routing 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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(a.ShieldCheck,{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(s.Typography,{tag:"h2",className:"mb-2",children:"Recommendations"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Follow these guidelines for robust routing"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-6",children:[e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"p-6 space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-green-500 to-emerald-500 shadow-lg",children:e.jsx(a.Check,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:"Do's"})]}),e.jsx("ul",{className:"space-y-2",children:i.map((t,r)=>e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(a.Check,{className:"w-4 h-4 text-green-500 mt-0.5 shrink-0"}),e.jsx("span",{className:"text-sm",children:t})]},r))})]})}),e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"p-6 space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-red-500 to-rose-500 shadow-lg",children:e.jsx(a.X,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:"Don'ts"})]}),e.jsx("ul",{className:"space-y-2",children:n.map((t,r)=>e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(a.X,{className:"w-4 h-4 text-red-500 mt-0.5 shrink-0"}),e.jsx("span",{className:"text-sm",children:t})]},r))})]})})]})]})]})};exports.default=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-DMs_SmPq.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const o=()=>{const i=["Use descriptive route names and paths","Keep route hierarchy shallow (max 2-3 levels)","Use consistent naming conventions across routes","Leverage TypeScript for type-safe route definitions","Use useMemo for dynamic route generation","Include icons for better navigation UX","Test routes with different user roles and permissions","Use basePath for MFE applications","Provide isAuthenticated and loginUrl in MFE mode","Use enableNestedRoutes when child components need internal routing"],n=["Create overly deep nesting (>3 levels)",'Use generic names like "Page" or "Component"',"Hardcode paths in components — use ReactRouter hooks","Forget to handle 404 pages with customRoutes","Mix routing logic with business logic","Skip accessibility considerations in navigation","Ignore mobile navigation UX patterns","Mix Standalone and MFE props in the same ThemeProvider","Import directly from react-router-dom — use ReactRouter namespace","Use StandaloneAppThemeProvider directly — use ThemeProvider"];return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Best Practices",description:"Guidelines for building maintainable, accessible, and type-safe routing 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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(a.ShieldCheck,{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(s.Typography,{tag:"h2",className:"mb-2",children:"Recommendations"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Follow these guidelines for robust routing"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-6",children:[e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"p-6 space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-green-500 to-emerald-500 shadow-lg",children:e.jsx(a.Check,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:"Do's"})]}),e.jsx("ul",{className:"space-y-2",children:i.map((t,r)=>e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(a.Check,{className:"w-4 h-4 text-green-500 mt-0.5 shrink-0"}),e.jsx("span",{className:"text-sm",children:t})]},r))})]})}),e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"p-6 space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-red-500 to-rose-500 shadow-lg",children:e.jsx(a.X,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:"Don'ts"})]}),e.jsx("ul",{className:"space-y-2",children:n.map((t,r)=>e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(a.X,{className:"w-4 h-4 text-red-500 mt-0.5 shrink-0"}),e.jsx("span",{className:"text-sm",children:t})]},r))})]})})]})]})]})};exports.default=o;

package/documentation/{BestPracticesSection-CCTlvAEc.js → BestPracticesSection-BihjJ2QU.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-BaGqriuz.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const o=()=>{const i=["Use semantic HTML elements (button, nav, main, aside, header)","Always provide label prop on Input, Select, and Checkbox","Use helperText to give additional context to form fields","Test with keyboard-only navigation before shipping","Use aria-label when visual label is not possible","Set dismissible={true} on non-critical alerts","Use the correct variant on Alert (info/warning/error/success)","Trust built-in ARIA — components auto-wire roles and attributes"],l=["Don't use div or span for interactive elements — use Button","Don't rely on color alone to convey information","Don't suppress focus outlines (outline-none without replacement)","Don't use aria-label when a visible label exists (duplicates)","Don't auto-play animations without prefers-reduced-motion check","Don't trap focus in elements that shouldn't trap (non-modal)","Don't use placeholder as a substitute for label","Don't disable zoom on mobile viewports"],n=[{title:"Color Contrast",description:"Maintain minimum 4.5:1 ratio for normal text, 3:1 for large text. Use browser DevTools to check.",icon:e.jsx(t.Palette,{className:"w-5 h-5 text-purple-500"})},{title:"Focus Order",description:"Ensure Tab order follows visual reading order. Never use positive tabIndex values.",icon:e.jsx(t.ArrowDownUp,{className:"w-5 h-5 text-blue-500"})},{title:"Error Messages",description:"Connect errors to fields via aria-describedby. tucu-ui Input/Select/Checkbox do this automatically.",icon:e.jsx(t.AlertCircle,{className:"w-5 h-5 text-red-500"})},{title:"Live Regions",description:'Use Alert component for dynamic content — it includes role="alert" and aria-live="assertive" built-in.',icon:e.jsx(t.Bell,{className:"w-5 h-5 text-amber-500"})}];return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Best Practices",description:"Guidelines for maintaining accessibility when building with tucu-ui. Follow these patterns to ensure your application is usable by everyone.",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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(t.ShieldCheck,{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(s.Typography,{tag:"h2",className:"mb-2",children:"Do's and Don'ts"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Quick reference for accessible patterns"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4 sm:gap-6",children:[e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-3",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-4",children:[e.jsx(t.CheckCircle,{className:"w-5 h-5 text-green-500"}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold text-green-700 dark:text-green-400",children:"Do"})]}),i.map((a,r)=>e.jsxs("div",{className:"flex items-start gap-2",children:[e.jsx(t.Check,{className:"w-4 h-4 text-green-500 shrink-0 mt-0.5"}),e.jsx(s.Typography,{tag:"span",className:"text-sm text-gray-600 dark:text-gray-400",children:a})]},r))]})}),e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-3",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-4",children:[e.jsx(t.XCircle,{className:"w-5 h-5 text-red-500"}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold text-red-700 dark:text-red-400",children:"Don't"})]}),l.map((a,r)=>e.jsxs("div",{className:"flex items-start gap-2",children:[e.jsx(t.X,{className:"w-4 h-4 text-red-500 shrink-0 mt-0.5"}),e.jsx(s.Typography,{tag:"span",className:"text-sm text-gray-600 dark:text-gray-400",children:a})]},r))]})})]})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(s.Typography,{tag:"h2",className:"mb-2",children:"Quick Tips"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Common accessibility patterns to keep in mind"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6",children:n.map((a,r)=>e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[a.icon,e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:a.title})]}),e.jsx(s.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400 leading-relaxed",children:a.description})]})},r))})]})]})};exports.default=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-DMs_SmPq.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const o=()=>{const i=["Use semantic HTML elements (button, nav, main, aside, header)","Always provide label prop on Input, Select, and Checkbox","Use helperText to give additional context to form fields","Test with keyboard-only navigation before shipping","Use aria-label when visual label is not possible","Set dismissible={true} on non-critical alerts","Use the correct variant on Alert (info/warning/error/success)","Trust built-in ARIA — components auto-wire roles and attributes"],l=["Don't use div or span for interactive elements — use Button","Don't rely on color alone to convey information","Don't suppress focus outlines (outline-none without replacement)","Don't use aria-label when a visible label exists (duplicates)","Don't auto-play animations without prefers-reduced-motion check","Don't trap focus in elements that shouldn't trap (non-modal)","Don't use placeholder as a substitute for label","Don't disable zoom on mobile viewports"],n=[{title:"Color Contrast",description:"Maintain minimum 4.5:1 ratio for normal text, 3:1 for large text. Use browser DevTools to check.",icon:e.jsx(t.Palette,{className:"w-5 h-5 text-purple-500"})},{title:"Focus Order",description:"Ensure Tab order follows visual reading order. Never use positive tabIndex values.",icon:e.jsx(t.ArrowDownUp,{className:"w-5 h-5 text-blue-500"})},{title:"Error Messages",description:"Connect errors to fields via aria-describedby. tucu-ui Input/Select/Checkbox do this automatically.",icon:e.jsx(t.AlertCircle,{className:"w-5 h-5 text-red-500"})},{title:"Live Regions",description:'Use Alert component for dynamic content — it includes role="alert" and aria-live="assertive" built-in.',icon:e.jsx(t.Bell,{className:"w-5 h-5 text-amber-500"})}];return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Best Practices",description:"Guidelines for maintaining accessibility when building with tucu-ui. Follow these patterns to ensure your application is usable by everyone.",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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(t.ShieldCheck,{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(s.Typography,{tag:"h2",className:"mb-2",children:"Do's and Don'ts"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Quick reference for accessible patterns"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4 sm:gap-6",children:[e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-3",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-4",children:[e.jsx(t.CheckCircle,{className:"w-5 h-5 text-green-500"}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold text-green-700 dark:text-green-400",children:"Do"})]}),i.map((a,r)=>e.jsxs("div",{className:"flex items-start gap-2",children:[e.jsx(t.Check,{className:"w-4 h-4 text-green-500 shrink-0 mt-0.5"}),e.jsx(s.Typography,{tag:"span",className:"text-sm text-gray-600 dark:text-gray-400",children:a})]},r))]})}),e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-3",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-4",children:[e.jsx(t.XCircle,{className:"w-5 h-5 text-red-500"}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold text-red-700 dark:text-red-400",children:"Don't"})]}),l.map((a,r)=>e.jsxs("div",{className:"flex items-start gap-2",children:[e.jsx(t.X,{className:"w-4 h-4 text-red-500 shrink-0 mt-0.5"}),e.jsx(s.Typography,{tag:"span",className:"text-sm text-gray-600 dark:text-gray-400",children:a})]},r))]})})]})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(s.Typography,{tag:"h2",className:"mb-2",children:"Quick Tips"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Common accessibility patterns to keep in mind"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6",children:n.map((a,r)=>e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[a.icon,e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:a.title})]}),e.jsx(s.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400 leading-relaxed",children:a.description})]})},r))})]})]})};exports.default=o;

package/documentation/{BestPracticesSection-BiznpoaJ.js → BestPracticesSection-BrTenNsc.js}

@@ -1,5 +1,5 @@
 import { jsxs as s, Fragment as d, jsx as e } from "react/jsx-runtime";
-import { H as m, T as t, C as i } from "../index-lfg6LZ1p.js";
+import { H as m, T as t, C as i } from "../index-19KsCnyX.js";
 import { CheckCircle as l, Check as h, XCircle as p, X as f, Zap as u, Timer as g, Eye as x, Layers as y } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{BestPracticesSection-CGBKNc2j.js → BestPracticesSection-Bsi45c48.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-BaGqriuz.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>{const o=["Use useIsMounted to guard async state updates and prevent memory leaks","Prefer useElementSize over useMeasure for simple width/height tracking","Leverage generic types: useElementSize<HTMLCanvasElement>()","Debounce rapid state changes when using useToastStore","Import only needed hooks for optimal tree-shaking","Combine useLockBodyScroll with focus management for accessible modals","Use useEventListener for keyboard navigation instead of inline handlers","Pass proper event types to useEventListener for type safety","Use useClickAway with a RefObject for dropdown/popover close behavior","Call useAnchorScroll once at root level for smooth scroll navigation"],i=["Destructure useCopyToClipboard as [value, fn] — it returns [stateObj, fn]","Forget that useScrollableSlider requires react-router-dom context","Use useMeasure when you only need width/height — it has more overhead","Lock body scroll without preserving scrollbar width (useLockBodyScroll handles this)","Create multiple useToastStore instances — it is a singleton Zustand store","Ignore the noUserInteraction field in useCopyToClipboard state","Use useIsMounted as a function — it returns a boolean directly","Mix up useElementSize ref (callback ref) with useRef (RefObject)","Hardcode breakpoint pixel values — use useBreakpoint named values instead","Forget cleanup when using useEventListener with custom elements"];return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Best Practices",description:"Guidelines for optimal hook usage, common pitfalls to avoid, and patterns that ensure performance, type safety, and accessibility.",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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(a.ShieldCheck,{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(s.Typography,{tag:"h2",className:"mb-2",children:"Recommendations"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Follow these guidelines for robust hook implementations"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-6",children:[e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"p-6 space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-green-500 to-emerald-500 shadow-lg",children:e.jsx(a.Check,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:"Do's"})]}),e.jsx("ul",{className:"space-y-2",children:o.map((t,r)=>e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(a.Check,{className:"w-4 h-4 text-green-500 mt-0.5 shrink-0"}),e.jsx("span",{className:"text-sm",children:t})]},r))})]})}),e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"p-6 space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-red-500 to-rose-500 shadow-lg",children:e.jsx(a.X,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:"Don'ts"})]}),e.jsx("ul",{className:"space-y-2",children:i.map((t,r)=>e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(a.X,{className:"w-4 h-4 text-red-500 mt-0.5 shrink-0"}),e.jsx("span",{className:"text-sm",children:t})]},r))})]})})]})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(s.Typography,{tag:"h2",className:"mb-2",children:"Common Patterns"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Recommended hook composition patterns"})]}),e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"p-6 space-y-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-indigo-500 to-purple-500 shadow-lg",children:e.jsx(a.Puzzle,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:"Accessible Modal Pattern"})]}),e.jsx("div",{className:"bg-light-dark p-4 rounded-xl border dark:border-gray-700 overflow-x-auto",children:e.jsx(s.CodeBlock,{language:"tsx",noExpand:!0,code:`function Modal({ isOpen, onClose, children }) {
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-DMs_SmPq.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>{const o=["Use useIsMounted to guard async state updates and prevent memory leaks","Prefer useElementSize over useMeasure for simple width/height tracking","Leverage generic types: useElementSize<HTMLCanvasElement>()","Debounce rapid state changes when using useToastStore","Import only needed hooks for optimal tree-shaking","Combine useLockBodyScroll with focus management for accessible modals","Use useEventListener for keyboard navigation instead of inline handlers","Pass proper event types to useEventListener for type safety","Use useClickAway with a RefObject for dropdown/popover close behavior","Call useAnchorScroll once at root level for smooth scroll navigation"],i=["Destructure useCopyToClipboard as [value, fn] — it returns [stateObj, fn]","Forget that useScrollableSlider requires react-router-dom context","Use useMeasure when you only need width/height — it has more overhead","Lock body scroll without preserving scrollbar width (useLockBodyScroll handles this)","Create multiple useToastStore instances — it is a singleton Zustand store","Ignore the noUserInteraction field in useCopyToClipboard state","Use useIsMounted as a function — it returns a boolean directly","Mix up useElementSize ref (callback ref) with useRef (RefObject)","Hardcode breakpoint pixel values — use useBreakpoint named values instead","Forget cleanup when using useEventListener with custom elements"];return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Best Practices",description:"Guidelines for optimal hook usage, common pitfalls to avoid, and patterns that ensure performance, type safety, and accessibility.",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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(a.ShieldCheck,{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(s.Typography,{tag:"h2",className:"mb-2",children:"Recommendations"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Follow these guidelines for robust hook implementations"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-6",children:[e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"p-6 space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-green-500 to-emerald-500 shadow-lg",children:e.jsx(a.Check,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:"Do's"})]}),e.jsx("ul",{className:"space-y-2",children:o.map((r,t)=>e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(a.Check,{className:"w-4 h-4 text-green-500 mt-0.5 shrink-0"}),e.jsx("span",{className:"text-sm",children:r})]},t))})]})}),e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"p-6 space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-red-500 to-rose-500 shadow-lg",children:e.jsx(a.X,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:"Don'ts"})]}),e.jsx("ul",{className:"space-y-2",children:i.map((r,t)=>e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(a.X,{className:"w-4 h-4 text-red-500 mt-0.5 shrink-0"}),e.jsx("span",{className:"text-sm",children:r})]},t))})]})})]})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(s.Typography,{tag:"h2",className:"mb-2",children:"Common Patterns"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Recommended hook composition patterns"})]}),e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"p-6 space-y-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-indigo-500 to-purple-500 shadow-lg",children:e.jsx(a.Puzzle,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:"Accessible Modal Pattern"})]}),e.jsx("div",{className:"bg-light-dark p-4 rounded-xl border dark:border-border overflow-x-auto",children:e.jsx(s.CodeBlock,{language:"tsx",noExpand:!0,code:`function Modal({ isOpen, onClose, children }) {
   const modalRef = useRef<HTMLDivElement>(null);
   
   // Lock scroll when modal opens
@@ -14,7 +14,7 @@
 
   if (!isOpen) return null;
   return <div ref={modalRef} role="dialog">{children}</div>;
-}`})})]})}),e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"p-6 space-y-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-blue-500 to-cyan-500 shadow-lg",children:e.jsx(a.Monitor,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:"Responsive Layout Pattern"})]}),e.jsx("div",{className:"bg-light-dark p-4 rounded-xl border dark:border-gray-700 overflow-x-auto",children:e.jsx(s.CodeBlock,{language:"tsx",noExpand:!0,code:`function ResponsiveGrid({ children }) {
+}`})})]})}),e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"p-6 space-y-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-blue-500 to-cyan-500 shadow-lg",children:e.jsx(a.Monitor,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:"Responsive Layout Pattern"})]}),e.jsx("div",{className:"bg-light-dark p-4 rounded-xl border dark:border-border overflow-x-auto",children:e.jsx(s.CodeBlock,{language:"tsx",noExpand:!0,code:`function ResponsiveGrid({ children }) {
   const { isMobile } = useIsMobile();
   const { isGridCompact, setIsGridCompact } = useGridSwitcher();
   const breakpoint = useBreakpoint();

package/documentation/{BestPracticesSection-C7p3sqSS.js → BestPracticesSection-BwTc9PvE.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-BaGqriuz.js"),r=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>{const i=["Use the useTheme hook to access theme state","Utilize built-in color presets for consistency","Test your application in both light and dark modes","Use the settings panel for user customization","Leverage persistent storage for user preferences","Use semantic Tailwind classes (bg-brand, text-secondary)","Respect THEME_STYLE_LAYOUTS constraints when changing layouts"],n=["Directly manipulate CSS custom properties","Hardcode colors that don't adapt to themes","Override theme state without using setters","Ignore RTL support for international apps","Disable all settings without providing alternatives","Use arbitrary hex values instead of design tokens","Assign layouts incompatible with the current theme style"];return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Best Practices",description:"Recommended patterns and anti-patterns for working with the theme system effectively.",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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(r.ShieldCheck,{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(s.Typography,{tag:"h2",className:"mb-2",children:"Guidelines"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Follow these patterns to keep your theming consistent and maintainable"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4 sm:gap-6",children:[e.jsx(s.CardContainer,{children:e.jsx(s.CardTitle,{title:"Do's",children:e.jsx("ul",{className:"space-y-2",children:i.map((t,a)=>e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(r.Check,{className:"w-4 h-4 text-green-500 mt-0.5 shrink-0"}),e.jsx("span",{className:"text-sm",children:t})]},a))})})}),e.jsx(s.CardContainer,{children:e.jsx(s.CardTitle,{title:"Don'ts",children:e.jsx("ul",{className:"space-y-2",children:n.map((t,a)=>e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(r.X,{className:"w-4 h-4 text-red-500 mt-0.5 shrink-0"}),e.jsx("span",{className:"text-sm",children:t})]},a))})})})]})]})]})};exports.default=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-DMs_SmPq.js"),r=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>{const i=["Use the useTheme hook to access theme state","Utilize built-in color presets for consistency","Test your application in both light and dark modes","Use the settings panel for user customization","Leverage persistent storage for user preferences","Use semantic Tailwind classes (bg-brand, text-secondary)","Respect THEME_STYLE_LAYOUTS constraints when changing layouts"],n=["Directly manipulate CSS custom properties","Hardcode colors that don't adapt to themes","Override theme state without using setters","Ignore RTL support for international apps","Disable all settings without providing alternatives","Use arbitrary hex values instead of design tokens","Assign layouts incompatible with the current theme style"];return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Best Practices",description:"Recommended patterns and anti-patterns for working with the theme system effectively.",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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(r.ShieldCheck,{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(s.Typography,{tag:"h2",className:"mb-2",children:"Guidelines"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Follow these patterns to keep your theming consistent and maintainable"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4 sm:gap-6",children:[e.jsx(s.CardContainer,{children:e.jsx(s.CardTitle,{title:"Do's",children:e.jsx("ul",{className:"space-y-2",children:i.map((t,a)=>e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(r.Check,{className:"w-4 h-4 text-green-500 mt-0.5 shrink-0"}),e.jsx("span",{className:"text-sm",children:t})]},a))})})}),e.jsx(s.CardContainer,{children:e.jsx(s.CardTitle,{title:"Don'ts",children:e.jsx("ul",{className:"space-y-2",children:n.map((t,a)=>e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(r.X,{className:"w-4 h-4 text-red-500 mt-0.5 shrink-0"}),e.jsx("span",{className:"text-sm",children:t})]},a))})})})]})]})]})};exports.default=l;

package/documentation/{BestPracticesSection-C8R3e6wG.js → BestPracticesSection-CdqrTgh6.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-BaGqriuz.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>{const i=[{category:"Layout Selection",items:["Admin: Use for complex applications with many navigation items and sidebar menus","Horizontal: Use for content-focused sites and simple applications with top navigation","Clean: Use for authentication flows, landing pages, and standalone content"]},{category:"ThemeProvider Setup",items:["Always wrap your application with ThemeProvider before using layouts","Provide menuItems prop for Admin and Horizontal layouts","Use layout prop to control which layout is rendered","Theme settings are automatically persisted to localStorage"]},{category:"Responsive Design",items:["Always test layouts on mobile devices","Use provided breakpoint system for responsive behavior","Consider touch interactions for mobile navigation","Admin layout automatically shows drawer on mobile"]},{category:"Accessibility",items:["Provide meaningful menu item names","Use semantic HTML structure","Test keyboard navigation","Ensure proper color contrast in all themes","Support RTL/LTR for international users"]}];return e.jsxs(e.Fragment,{children:[e.jsx(t.HeroCard,{title:"Best Practices",description:"Guidelines for optimal layout system implementation and common patterns.",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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(s.Star,{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(t.Typography,{tag:"h2",className:"mb-2",children:"Best Practices"}),e.jsx(t.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Guidelines for optimal layout system implementation"})]}),e.jsx("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4 sm:gap-6",children:i.map((a,r)=>e.jsx(t.CardContainer,{className:"group hover:shadow-large transition-all duration-300 hover:-translate-y-1",children:e.jsxs("div",{className:"w-full space-y-4 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-green-500 via-emerald-500 to-teal-500 shadow-md",children:e.jsx(s.CheckCircle,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(t.Typography,{tag:"h3",className:"font-semibold text-lg",children:a.category})]}),e.jsx("ul",{className:"space-y-2",children:a.items.map((o,n)=>e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(s.ArrowRight,{className:"w-4 h-4 text-primary mt-0.5 shrink-0"}),e.jsx(t.Typography,{tag:"span",className:"text-sm text-gray-600 dark:text-gray-400",children:o})]},n))})]})},r))})]})};exports.default=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-DMs_SmPq.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>{const i=[{category:"Layout Selection",items:["Admin: Use for complex applications with many navigation items and sidebar menus","Horizontal: Use for content-focused sites and simple applications with top navigation","Clean: Use for authentication flows, landing pages, and standalone content"]},{category:"ThemeProvider Setup",items:["Always wrap your application with ThemeProvider before using layouts","Provide menuItems prop for Admin and Horizontal layouts","Use layout prop to control which layout is rendered","Theme settings are automatically persisted to localStorage"]},{category:"Responsive Design",items:["Always test layouts on mobile devices","Use provided breakpoint system for responsive behavior","Consider touch interactions for mobile navigation","Admin layout automatically shows drawer on mobile"]},{category:"Accessibility",items:["Provide meaningful menu item names","Use semantic HTML structure","Test keyboard navigation","Ensure proper color contrast in all themes","Support RTL/LTR for international users"]}];return e.jsxs(e.Fragment,{children:[e.jsx(t.HeroCard,{title:"Best Practices",description:"Guidelines for optimal layout system implementation and common patterns.",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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(s.Star,{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(t.Typography,{tag:"h2",className:"mb-2",children:"Best Practices"}),e.jsx(t.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Guidelines for optimal layout system implementation"})]}),e.jsx("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4 sm:gap-6",children:i.map((a,r)=>e.jsx(t.CardContainer,{className:"group hover:shadow-large transition-all duration-300 hover:-translate-y-1",children:e.jsxs("div",{className:"w-full space-y-4 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-green-500 via-emerald-500 to-teal-500 shadow-md",children:e.jsx(s.CheckCircle,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(t.Typography,{tag:"h3",className:"font-semibold text-lg",children:a.category})]}),e.jsx("ul",{className:"space-y-2",children:a.items.map((o,n)=>e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(s.ArrowRight,{className:"w-4 h-4 text-primary mt-0.5 shrink-0"}),e.jsx(t.Typography,{tag:"span",className:"text-sm text-gray-600 dark:text-gray-400",children:o})]},n))})]})},r))})]})};exports.default=l;

package/documentation/{BestPracticesSection-4oonl6Xs.js → BestPracticesSection-D3PLwaiL.js}

@@ -1,5 +1,5 @@
 import { jsxs as t, Fragment as c, jsx as e } from "react/jsx-runtime";
-import { H as m, T as r, C as i, a as n } from "../index-lfg6LZ1p.js";
+import { H as m, T as r, C as i, a as n } from "../index-19KsCnyX.js";
 import { ShieldCheck as d, Check as h, X as p } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{BestPracticesSection-CNwUYNOW.js → BestPracticesSection-D9x1gLFW.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-BaGqriuz.js"),r=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const o=()=>{const i=["Always define a TypeScript interface for your form values","Use generic types: Form<FormValues>, FormField<FormValues>","Prefer centralized validationSchema for consistency","Provide clear, user-friendly error messages",'Use mode: "onBlur" for large forms (fewer re-renders)','Use mode: "onChange" when real-time feedback is needed',"Always add labels for accessibility (FormField label prop)","Use reset() to clear forms after successful submission"],l=["Don't use uncontrolled inputs outside FormField — they won't register","Don't call setValue without shouldValidate: true if you need instant feedback","Don't put useFormContext in a component outside Form — it will crash","Don't mix controlled and uncontrolled patterns in the same field","Don't use watch() for values you only read on submit — use getValues() instead","Don't forget defaultValues — required for reset() and initial state","Don't validate on every keystroke for complex async checks — use debounce","Don't skip FormField for inputs that need error display"],n=[{title:"Isolated Re-renders",description:"react-hook-form only re-renders the field that changed, not the whole form. This is automatic.",icon:e.jsx(r.Zap,{className:"w-5 h-5 text-amber-500"})},{title:"Use onBlur Mode",description:'For forms with 10+ fields, mode: "onBlur" validates only when the user leaves a field, reducing re-renders.',icon:e.jsx(r.Timer,{className:"w-5 h-5 text-blue-500"})},{title:"Avoid watch() Overuse",description:"Each watch() call subscribes to re-renders. Use getValues() for one-time reads in handlers.",icon:e.jsx(r.Eye,{className:"w-5 h-5 text-purple-500"})},{title:"Split Large Forms",description:"For wizard/multi-step flows, split into multiple Form instances or conditional sections.",icon:e.jsx(r.Layers,{className:"w-5 h-5 text-green-500"})}];return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Best Practices",description:"Guidelines for building performant, accessible, and maintainable forms with the tucu-ui form 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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(r.CheckCircle,{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(s.Typography,{tag:"h2",className:"mb-2",children:"Do's and Don'ts"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Quick reference for form development"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4 sm:gap-6",children:[e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-3",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-4",children:[e.jsx(r.CheckCircle,{className:"w-5 h-5 text-green-500"}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold text-green-700 dark:text-green-400",children:"Do"})]}),i.map((t,a)=>e.jsxs("div",{className:"flex items-start gap-2",children:[e.jsx(r.Check,{className:"w-4 h-4 text-green-500 shrink-0 mt-0.5"}),e.jsx(s.Typography,{tag:"span",className:"text-sm text-gray-600 dark:text-gray-400",children:t})]},a))]})}),e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-3",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-4",children:[e.jsx(r.XCircle,{className:"w-5 h-5 text-red-500"}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold text-red-700 dark:text-red-400",children:"Don't"})]}),l.map((t,a)=>e.jsxs("div",{className:"flex items-start gap-2",children:[e.jsx(r.X,{className:"w-4 h-4 text-red-500 shrink-0 mt-0.5"}),e.jsx(s.Typography,{tag:"span",className:"text-sm text-gray-600 dark:text-gray-400",children:t})]},a))]})})]})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(s.Typography,{tag:"h2",className:"mb-2",children:"Performance Tips"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"How to keep forms fast as they grow in complexity"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6",children:n.map((t,a)=>e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[t.icon,e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:t.title})]}),e.jsx(s.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400 leading-relaxed",children:t.description})]})},a))})]})]})};exports.default=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-DMs_SmPq.js"),r=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const o=()=>{const i=["Always define a TypeScript interface for your form values","Use generic types: Form<FormValues>, FormField<FormValues>","Prefer centralized validationSchema for consistency","Provide clear, user-friendly error messages",'Use mode: "onBlur" for large forms (fewer re-renders)','Use mode: "onChange" when real-time feedback is needed',"Always add labels for accessibility (FormField label prop)","Use reset() to clear forms after successful submission"],l=["Don't use uncontrolled inputs outside FormField — they won't register","Don't call setValue without shouldValidate: true if you need instant feedback","Don't put useFormContext in a component outside Form — it will crash","Don't mix controlled and uncontrolled patterns in the same field","Don't use watch() for values you only read on submit — use getValues() instead","Don't forget defaultValues — required for reset() and initial state","Don't validate on every keystroke for complex async checks — use debounce","Don't skip FormField for inputs that need error display"],n=[{title:"Isolated Re-renders",description:"react-hook-form only re-renders the field that changed, not the whole form. This is automatic.",icon:e.jsx(r.Zap,{className:"w-5 h-5 text-amber-500"})},{title:"Use onBlur Mode",description:'For forms with 10+ fields, mode: "onBlur" validates only when the user leaves a field, reducing re-renders.',icon:e.jsx(r.Timer,{className:"w-5 h-5 text-blue-500"})},{title:"Avoid watch() Overuse",description:"Each watch() call subscribes to re-renders. Use getValues() for one-time reads in handlers.",icon:e.jsx(r.Eye,{className:"w-5 h-5 text-purple-500"})},{title:"Split Large Forms",description:"For wizard/multi-step flows, split into multiple Form instances or conditional sections.",icon:e.jsx(r.Layers,{className:"w-5 h-5 text-green-500"})}];return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Best Practices",description:"Guidelines for building performant, accessible, and maintainable forms with the tucu-ui form 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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(r.CheckCircle,{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(s.Typography,{tag:"h2",className:"mb-2",children:"Do's and Don'ts"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Quick reference for form development"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4 sm:gap-6",children:[e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-3",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-4",children:[e.jsx(r.CheckCircle,{className:"w-5 h-5 text-green-500"}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold text-green-700 dark:text-green-400",children:"Do"})]}),i.map((t,a)=>e.jsxs("div",{className:"flex items-start gap-2",children:[e.jsx(r.Check,{className:"w-4 h-4 text-green-500 shrink-0 mt-0.5"}),e.jsx(s.Typography,{tag:"span",className:"text-sm text-gray-600 dark:text-gray-400",children:t})]},a))]})}),e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-3",children:[e.jsxs("div",{className:"flex items-center gap-2 mb-4",children:[e.jsx(r.XCircle,{className:"w-5 h-5 text-red-500"}),e.jsx(s.Typography,{tag:"h3",className:"font-semibold text-red-700 dark:text-red-400",children:"Don't"})]}),l.map((t,a)=>e.jsxs("div",{className:"flex items-start gap-2",children:[e.jsx(r.X,{className:"w-4 h-4 text-red-500 shrink-0 mt-0.5"}),e.jsx(s.Typography,{tag:"span",className:"text-sm text-gray-600 dark:text-gray-400",children:t})]},a))]})})]})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(s.Typography,{tag:"h2",className:"mb-2",children:"Performance Tips"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"How to keep forms fast as they grow in complexity"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6",children:n.map((t,a)=>e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[t.icon,e.jsx(s.Typography,{tag:"h3",className:"font-semibold",children:t.title})]}),e.jsx(s.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400 leading-relaxed",children:t.description})]})},a))})]})]})};exports.default=o;

package/documentation/{BestPracticesSection-Bnccg1L-.js → BestPracticesSection-DXd2F40Q.js}

@@ -1,5 +1,5 @@
 import { jsxs as s, Fragment as d, jsx as e } from "react/jsx-runtime";
-import { H as m, T as a, C as n } from "../index-lfg6LZ1p.js";
+import { H as m, T as a, C as n } from "../index-19KsCnyX.js";
 import { CheckCircle as c, Check as h, XCircle as p, X as u, Package as g, HardDrive as x, Zap as y, TreeDeciduous as f } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{BestPracticesSection-hs6vGhuu.js → BestPracticesSection-V_icrn3I.js}

@@ -1,5 +1,5 @@
 import { jsxs as t, Fragment as c, jsx as e } from "react/jsx-runtime";
-import { H as d, T as a, C as r } from "../index-lfg6LZ1p.js";
+import { H as d, T as a, C as r } from "../index-19KsCnyX.js";
 import { ShieldCheck as m, CheckCircle as h, Check as p, XCircle as u, X as g, Palette as x, ArrowDownUp as b, AlertCircle as f, Bell as w } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{BestPracticesSection-BJUyOw5K.js → BestPracticesSection-WJyPTPT5.js}

@@ -1,5 +1,5 @@
 import { jsxs as s, Fragment as d, jsx as e } from "react/jsx-runtime";
-import { H as m, T as a, C as r } from "../index-lfg6LZ1p.js";
+import { H as m, T as a, C as r } from "../index-19KsCnyX.js";
 import { ShieldCheck as h, Check as n, X as o } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{BorderRadiusSection-CgppX9KI.js → BorderRadiusSection-DnrQs0UO.js}

@@ -1,5 +1,5 @@
 import { jsxs as d, jsx as e } from "react/jsx-runtime";
-import { H as l, C as i, a as o, T as a } from "../index-lfg6LZ1p.js";
+import { H as l, C as i, a as o, T as a } from "../index-19KsCnyX.js";
 import { Circle as n } from "lucide-react";
 import "react-router-dom";
 import "react";
@@ -31,7 +31,7 @@ const f = () => /* @__PURE__ */ d("div", { className: "space-y-8 max-w-6xl sm:sp
       return /* @__PURE__ */ d(
         "div",
         {
-          className: "border border-gray-200 dark:border-gray-700 rounded-lg p-4 space-y-3",
+          className: "border border-border rounded-lg p-4 space-y-3",
           children: [
             /* @__PURE__ */ d("div", { className: "flex items-center justify-between", children: [
               /* @__PURE__ */ e(a, { tag: "h4", className: "font-semibold", children: s }),

package/documentation/{BorderRadiusSection-CY90awsm.js → BorderRadiusSection-DtqKxbF6.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../index-BaGqriuz.js"),l=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const t=()=>{const a={0:"rounded-[0px]",100:"rounded-[4px]",200:"rounded-[8px]",300:"rounded-[12px]",400:"rounded-[16px]",500:"rounded-[24px]",600:"rounded-[32px]",700:"rounded-[40px]",800:"rounded-[48px]",900:"rounded-[56px]",1e3:"rounded-[100000px]"};return e.jsxs("div",{className:"space-y-8 max-w-6xl sm:space-y-12 w-full mx-auto px-4 sm:px-6 lg:px-8 relative pt-8 lg:pt-12",children:[e.jsx(r.HeroCard,{title:"Border Radius",description:"Border radius scale using Tailwind arbitrary values for consistent rounded corners.",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-amber-500 via-yellow-500 to-orange-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(l.Circle,{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(r.CardContainer,{className:"overflow-hidden",children:e.jsx(r.CardTitle,{title:"Border Radius Scale",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full space-y-8 p-4 sm:p-6",children:e.jsx("div",{className:"grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4",children:Object.entries(a).map(([s,d])=>{const i=d.replace("rounded-[","").replace("]","");return e.jsxs("div",{className:"border border-gray-200 dark:border-gray-700 rounded-lg p-4 space-y-3",children:[e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsx(r.Typography,{tag:"h4",className:"font-semibold",children:s}),e.jsx(r.Typography,{tag:"h4",className:"text-muted text-[10px]",children:i})]}),e.jsx("div",{className:"flex justify-center",children:e.jsx("div",{className:`w-20 h-20 bg-primary ${d}`})}),e.jsx(r.Typography,{tag:"h4",className:"text-muted text-[9px] break-all px-1 text-center",children:d})]},s)})})})})})]})};exports.default=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../index-DMs_SmPq.js"),l=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const t=()=>{const a={0:"rounded-[0px]",100:"rounded-[4px]",200:"rounded-[8px]",300:"rounded-[12px]",400:"rounded-[16px]",500:"rounded-[24px]",600:"rounded-[32px]",700:"rounded-[40px]",800:"rounded-[48px]",900:"rounded-[56px]",1e3:"rounded-[100000px]"};return e.jsxs("div",{className:"space-y-8 max-w-6xl sm:space-y-12 w-full mx-auto px-4 sm:px-6 lg:px-8 relative pt-8 lg:pt-12",children:[e.jsx(r.HeroCard,{title:"Border Radius",description:"Border radius scale using Tailwind arbitrary values for consistent rounded corners.",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-amber-500 via-yellow-500 to-orange-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(l.Circle,{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(r.CardContainer,{className:"overflow-hidden",children:e.jsx(r.CardTitle,{title:"Border Radius Scale",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full space-y-8 p-4 sm:p-6",children:e.jsx("div",{className:"grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4",children:Object.entries(a).map(([s,d])=>{const i=d.replace("rounded-[","").replace("]","");return e.jsxs("div",{className:"border border-border rounded-lg p-4 space-y-3",children:[e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsx(r.Typography,{tag:"h4",className:"font-semibold",children:s}),e.jsx(r.Typography,{tag:"h4",className:"text-muted text-[10px]",children:i})]}),e.jsx("div",{className:"flex justify-center",children:e.jsx("div",{className:`w-20 h-20 bg-primary ${d}`})}),e.jsx(r.Typography,{tag:"h4",className:"text-muted text-[9px] break-all px-1 text-center",children:d})]},s)})})})})})]})};exports.default=t;

package/documentation/{ButtonDripSection-D8zkJ-6j.js → ButtonDripSection-C5biHmZq.js}

@@ -1,5 +1,5 @@
 import { jsxs as o, Fragment as n, jsx as t } from "react/jsx-runtime";
-import { H as c, C as l, a as i, T as a, x as e, P as s, A as m, c as d } from "../index-lfg6LZ1p.js";
+import { H as c, C as l, a as i, T as a, x as e, P as s, A as m, c as d } from "../index-19KsCnyX.js";
 import { MousePointerClick as p } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{ButtonDripSection-BQkw59yH.js → ButtonDripSection-DEZ07Ezd.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),e=require("../index-BaGqriuz.js"),l=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const i=()=>t.jsxs(t.Fragment,{children:[t.jsx(e.HeroCard,{title:"ButtonDrip",description:"A button effect component that creates a ripple animation on click.",icon:t.jsx("div",{className:"w-16 h-16 sm:w-20 sm:h-20 md:w-24 md:h-24 bg-linear-to-br from-blue-500 to-indigo-500 rounded-full flex items-center justify-center shadow-lg",children:t.jsx(l.MousePointerClick,{className:"w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 text-white filter drop-shadow-lg"})})}),t.jsx(e.CardContainer,{className:"overflow-hidden",children:t.jsx(e.CardTitle,{title:"Basic Examples",className:"mt-2 mb-2",children:t.jsx("div",{className:"w-full p-4 sm:p-6",children:t.jsxs("div",{className:"space-y-4",children:[t.jsxs(e.CardContainer,{className:"p-4",children:[t.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Button with Drip Effect"}),t.jsx(e.Button,{children:"Click me"})]}),t.jsxs(e.CardContainer,{className:"p-4",children:[t.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Button with Tooltip"}),t.jsxs("div",{className:"flex flex-wrap gap-4",children:[t.jsx(e.Button,{tooltip:"Save changes",tooltipPlacement:"top",children:"Top"}),t.jsx(e.Button,{tooltip:"Delete item",tooltipPlacement:"bottom",tooltipColor:"light",color:"danger",children:"Bottom (light)"}),t.jsx(e.Button,{tooltip:"Go back",tooltipPlacement:"left",variant:"ghost",children:"Left"}),t.jsx(e.Button,{tooltip:"More info",tooltipPlacement:"right",variant:"ghost",color:"info",children:"Right"})]})]})]})})})}),t.jsx(e.PropPlayground,{componentName:"Button",defaultValues:{variant:"solid",color:"primary",size:"medium",shape:"rounded",tooltip:"",tooltipPlacement:"top"},excludeProps:["onClick","loaderSize","loaderVariant","aria-label","aria-describedby"],children:o=>t.jsx(e.Button,{...o,children:"Click me"})}),t.jsx(e.AutoPropsTable,{componentName:"Button"}),t.jsx(e.CardContainer,{className:"overflow-hidden",children:t.jsx(e.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:t.jsx("div",{className:"w-full p-4 sm:p-6",children:t.jsx(e.CodeBlock,{language:"tsx",code:`import { ButtonDrip } from '@e-burgos/tucu-ui';
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),e=require("../index-DMs_SmPq.js"),l=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const i=()=>t.jsxs(t.Fragment,{children:[t.jsx(e.HeroCard,{title:"ButtonDrip",description:"A button effect component that creates a ripple animation on click.",icon:t.jsx("div",{className:"w-16 h-16 sm:w-20 sm:h-20 md:w-24 md:h-24 bg-linear-to-br from-blue-500 to-indigo-500 rounded-full flex items-center justify-center shadow-lg",children:t.jsx(l.MousePointerClick,{className:"w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 text-white filter drop-shadow-lg"})})}),t.jsx(e.CardContainer,{className:"overflow-hidden",children:t.jsx(e.CardTitle,{title:"Basic Examples",className:"mt-2 mb-2",children:t.jsx("div",{className:"w-full p-4 sm:p-6",children:t.jsxs("div",{className:"space-y-4",children:[t.jsxs(e.CardContainer,{className:"p-4",children:[t.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Button with Drip Effect"}),t.jsx(e.Button,{children:"Click me"})]}),t.jsxs(e.CardContainer,{className:"p-4",children:[t.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Button with Tooltip"}),t.jsxs("div",{className:"flex flex-wrap gap-4",children:[t.jsx(e.Button,{tooltip:"Save changes",tooltipPlacement:"top",children:"Top"}),t.jsx(e.Button,{tooltip:"Delete item",tooltipPlacement:"bottom",tooltipColor:"light",color:"danger",children:"Bottom (light)"}),t.jsx(e.Button,{tooltip:"Go back",tooltipPlacement:"left",variant:"ghost",children:"Left"}),t.jsx(e.Button,{tooltip:"More info",tooltipPlacement:"right",variant:"ghost",color:"info",children:"Right"})]})]})]})})})}),t.jsx(e.PropPlayground,{componentName:"Button",defaultValues:{variant:"solid",color:"primary",size:"medium",shape:"rounded",tooltip:"",tooltipPlacement:"top"},excludeProps:["onClick","loaderSize","loaderVariant","aria-label","aria-describedby"],children:o=>t.jsx(e.Button,{...o,children:"Click me"})}),t.jsx(e.AutoPropsTable,{componentName:"Button"}),t.jsx(e.CardContainer,{className:"overflow-hidden",children:t.jsx(e.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:t.jsx("div",{className:"w-full p-4 sm:p-6",children:t.jsx(e.CodeBlock,{language:"tsx",code:`import { ButtonDrip } from '@e-burgos/tucu-ui';
 
 // ButtonDrip is typically used internally by Button component
 // It creates a ripple effect when a button is clicked

package/documentation/{ButtonLoaderSection-B5XP49FM.js → ButtonLoaderSection-BVgZFpeK.js}

@@ -1,5 +1,5 @@
 import { jsxs as i, Fragment as n, jsx as e } from "react/jsx-runtime";
-import { H as d, C as a, a as o, T as r, x as l, P as c, y as m, c as p } from "../index-lfg6LZ1p.js";
+import { H as d, C as a, a as o, T as r, x as l, P as c, y as m, c as p } from "../index-19KsCnyX.js";
 import { Loader2 as u } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{ButtonLoaderSection-CjGBMNiM.js → ButtonLoaderSection-CGJBeqr-.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-BaGqriuz.js"),l=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const n=()=>{const s=[{key:"prop",label:"Prop",render:t=>e.jsx("code",{className:"text-xs text-brand",children:String(t)})},{key:"type",label:"Type",render:t=>e.jsx("code",{className:"text-xs",children:String(t)})},{key:"default",label:"Default",render:t=>{const r=String(t);return r==="required"?e.jsx("span",{className:"text-xs text-red-500",children:"required"}):e.jsx("code",{className:"text-xs",children:r})}},{key:"description",label:"Description"}],i=[{prop:"size",type:"'large' | 'medium' | 'small'",default:"required",description:"Size of the loader"},{prop:"variant",type:"'blink' | 'scaleUp' | 'moveUp'",default:"required",description:"Animation variant of the loader"}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"ButtonLoader",description:`A loader component designed specifically for buttons, providing visual
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-DMs_SmPq.js"),l=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const n=()=>{const s=[{key:"prop",label:"Prop",render:t=>e.jsx("code",{className:"text-xs text-brand",children:String(t)})},{key:"type",label:"Type",render:t=>e.jsx("code",{className:"text-xs",children:String(t)})},{key:"default",label:"Default",render:t=>{const r=String(t);return r==="required"?e.jsx("span",{className:"text-xs text-red-500",children:"required"}):e.jsx("code",{className:"text-xs",children:r})}},{key:"description",label:"Description"}],i=[{prop:"size",type:"'large' | 'medium' | 'small'",default:"required",description:"Size of the loader"},{prop:"variant",type:"'blink' | 'scaleUp' | 'moveUp'",default:"required",description:"Animation variant of the loader"}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"ButtonLoader",description:`A loader component designed specifically for buttons, providing visual
           feedback during loading states.`,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-blue-500 to-indigo-600 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(l.Loader2,{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(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Basic 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:"Button with Loading State"}),e.jsx(a.Button,{isLoading:!0})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Button with Custom Loader"}),e.jsx(a.Button,{isLoading:!0,loaderSize:"small",loaderVariant:"blink"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Large Button with Loader"}),e.jsx(a.Button,{isLoading:!0,size:"large",loaderSize:"large"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Small Button with Loader"}),e.jsx(a.Button,{isLoading:!0,size:"small",loaderSize:"small"})]})]})})})}),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:"Blink Variant"}),e.jsx(a.Button,{isLoading:!0,loaderVariant:"blink"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Scale Up Variant"}),e.jsx(a.Button,{isLoading:!0,loaderVariant:"scaleUp"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Move Up Variant"}),e.jsx(a.Button,{isLoading:!0,loaderVariant:"moveUp"})]})]})})})}),e.jsx(a.PropPlayground,{componentName:"Button",title:"Button Loader Playground",defaultValues:{variant:"solid",color:"primary",size:"medium",isLoading:!0,loaderSize:"small",loaderVariant:"scaleUp"},excludeProps:["onClick","aria-label","aria-describedby","tooltip","tooltipArrow","tooltipColor","tooltipPlacement","shape","fullWidth","disabled"],children:t=>e.jsx(a.Button,{...t,children:"Loading..."})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Props",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.BasicTable,{columns:s,data:i})})})}),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 { Button } from '@e-burgos/tucu-ui';
 
 // Basic usage with loading state

package/documentation/{CardContainerSection-DcioQ7uD.js → CardContainerSection-Cs2cKwb4.js}

@@ -1,5 +1,5 @@
 import { jsxs as r, Fragment as n, jsx as a } from "react/jsx-runtime";
-import { H as i, C as e, a as o, T as t, A as s, c as d } from "../index-lfg6LZ1p.js";
+import { H as i, C as e, a as o, T as t, A as s, c as d } from "../index-19KsCnyX.js";
 import { LayoutGrid as l } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{CardContainerSection-DfKrRKR1.js → CardContainerSection-yjkb4krj.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-BaGqriuz.js"),r=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const t=()=>e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"CardContainer",description:`A container component that provides consistent styling and layout for
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-DMs_SmPq.js"),r=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const t=()=>e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"CardContainer",description:`A container component that provides consistent styling and layout for
           card-based content.`,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-purple-500 to-violet-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(r.LayoutGrid,{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(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Basic 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 Card"}),e.jsx(a.CardContainer,{children:e.jsx(a.Typography,{tag:"p",children:"Card content goes here"})})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Custom Content"}),e.jsxs(a.CardContainer,{children:[e.jsx(a.Typography,{tag:"h3",className:"font-bold mb-2",children:"Card Title"}),e.jsx(a.Typography,{tag:"p",children:"This is a card with custom content including a title and description."})]})]})]})})})}),e.jsx(a.AutoPropsTable,{componentName:"CardContainer"}),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 { CardContainer, Typography } from '@e-burgos/tucu-ui';
 
 // Basic usage

package/documentation/{CardSection-C6FmBvSW.js → CardSection-CWikpGMD.js}

@@ -1,5 +1,5 @@
 import { jsxs as i, Fragment as d, jsx as e } from "react/jsx-runtime";
-import { H as c, C as r, a as o, J as t, T as a, K as l, x as n, P as h, A as m, c as p } from "../index-lfg6LZ1p.js";
+import { H as c, C as r, a as o, J as t, T as a, K as l, x as n, P as h, A as m, c as p } from "../index-19KsCnyX.js";
 import { CreditCard as g, Users as C, Settings as u, Bell as f } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{CardSection-By7KZdmx.js → CardSection-FjHnUXDc.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-BaGqriuz.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const i=()=>e.jsxs(e.Fragment,{children:[e.jsx(t.HeroCard,{title:"Card",description:`A flexible card component with optional header, icon, footer, actions,
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-DMs_SmPq.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const i=()=>e.jsxs(e.Fragment,{children:[e.jsx(t.HeroCard,{title:"Card",description:`A flexible card component with optional header, icon, footer, actions,
           and clickable behavior.`,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-violet-500 to-purple-600 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(a.CreditCard,{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:"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.jsx(t.Card,{title:"Basic Card",description:"A simple card with title and description",icon:e.jsx(a.Users,{className:"h-5 w-5"}),children:e.jsx(t.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:"This is the card body content. You can place any content here."})}),e.jsx(t.Card,{title:"With Actions",description:"Card with action buttons in the header",icon:e.jsx(a.Settings,{className:"h-5 w-5"}),actions:e.jsx(t.Badge,{color:"success",size:"small",children:"Active"}),children:e.jsx(t.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:"The actions slot renders elements on the right side of the header."})}),e.jsx(t.Card,{title:"With Footer",description:"Card with a footer section",icon:e.jsx(a.Bell,{className:"h-5 w-5"}),footer:e.jsxs("div",{className:"flex items-center justify-between",children:[e.jsx(t.Typography,{tag:"span",className:"text-xs text-gray-500",children:"Last updated 2 hours ago"}),e.jsx(t.Button,{variant:"ghost",size:"mini",children:"View Details"})]}),children:e.jsx(t.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:"Footer content appears at the bottom with a top border separator."})}),e.jsx(t.Card,{title:"Clickable Card",description:"Click anywhere on this card",onClick:()=>alert("Card clicked!"),children:e.jsx(t.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:"Clickable cards show a hover effect on the border."})})]})})})}),e.jsx(t.PropPlayground,{componentName:"Card",title:"Card Playground",defaultValues:{title:"Card Title",description:"This is a card description with relevant content."},excludeProps:["onClick","icon","header","footer","actions","className"],children:r=>e.jsx(t.Card,{...r})}),e.jsx(t.AutoPropsTable,{componentName:"Card"}),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 { Card, Badge, Button } from '@e-burgos/tucu-ui';
 import { Users } from 'lucide-react';
 

package/documentation/{CardTitleSection-Cwlv3Iuv.js → CardTitleSection-B4OARul9.js}

@@ -1,5 +1,5 @@
 import { jsxs as a, Fragment as d, jsx as e } from "react/jsx-runtime";
-import { H as o, C as i, a as t, T as r, P as s, A as c, c as h } from "../index-lfg6LZ1p.js";
+import { H as o, C as i, a as t, T as r, P as s, A as c, c as h } from "../index-19KsCnyX.js";
 import { Heading as p } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{CardTitleSection-JuseDFmx.js → CardTitleSection-BwmJtkj8.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../index-BaGqriuz.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const i=()=>e.jsxs(e.Fragment,{children:[e.jsx(r.HeroCard,{title:"CardTitle",description:`A card component with an integrated title that appears above the card
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../index-DMs_SmPq.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const i=()=>e.jsxs(e.Fragment,{children:[e.jsx(r.HeroCard,{title:"CardTitle",description:`A card component with an integrated title that appears above the card
           border.`,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-purple-600 to-violet-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(t.Heading,{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(r.CardContainer,{className:"overflow-hidden",children:e.jsx(r.CardTitle,{title:"Basic 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(r.CardContainer,{className:"p-4",children:[e.jsx(r.Typography,{tag:"h5",className:"mb-3",children:"With Title"}),e.jsx(r.CardTitle,{title:"Card Title",children:e.jsx(r.Typography,{tag:"p",children:"Card content goes here"})})]}),e.jsxs(r.CardContainer,{className:"p-4",children:[e.jsx(r.Typography,{tag:"h5",className:"mb-3",children:"Without Border"}),e.jsx(r.CardTitle,{title:"No Border",border:!1,children:e.jsx(r.Typography,{tag:"p",children:"Card without border"})})]}),e.jsxs(r.CardContainer,{className:"p-4",children:[e.jsx(r.Typography,{tag:"h5",className:"mb-3",children:"With Rich Content"}),e.jsx(r.CardTitle,{title:"Rich Content",children:e.jsxs("div",{className:"space-y-2",children:[e.jsx(r.Typography,{tag:"p",children:"First paragraph"}),e.jsx(r.Typography,{tag:"p",children:"Second paragraph"})]})})]})]})})})}),e.jsx(r.PropPlayground,{componentName:"CardTitle",defaultValues:{title:"Card Title",border:!0},excludeProps:[],children:a=>e.jsx(r.CardTitle,{...a,children:e.jsx("div",{className:"p-4",children:"Card Content"})})}),e.jsx(r.AutoPropsTable,{componentName:"CardTitle"}),e.jsx(r.CardContainer,{className:"overflow-hidden",children:e.jsx(r.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(r.CodeBlock,{language:"tsx",code:`import { CardTitle, Typography } from '@e-burgos/tucu-ui';
 
 // With title

package/documentation/{CarouselCardsSection-t54tXA0y.js → CarouselCardsSection-DETthGNT.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-BaGqriuz.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const t=()=>{const i=[{title:"Performance",description:"Blazing fast performance with optimized rendering and minimal bundle size",icon:e.jsx(s.Zap,{className:"w-8 h-8"})},{title:"Customizable",description:"Highly customizable with extensive theming options and variants",icon:e.jsx(s.Palette,{className:"w-8 h-8"})},{title:"Accessible",description:"Built with accessibility in mind, WCAG 2.1 compliant",icon:e.jsx(s.Users,{className:"w-8 h-8"})},{title:"Responsive",description:"Mobile-first design that works seamlessly across all devices",icon:e.jsx(s.Smartphone,{className:"w-8 h-8"})},{title:"Type Safe",description:"Full TypeScript support with comprehensive type definitions",icon:e.jsx(s.Shield,{className:"w-8 h-8"})},{title:"Documentation",description:"Extensive documentation with examples and best practices",icon:e.jsx(s.BookOpen,{className:"w-8 h-8"})}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"CarouselCards",description:`A carousel component specifically designed for displaying cards with
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-DMs_SmPq.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const t=()=>{const i=[{title:"Performance",description:"Blazing fast performance with optimized rendering and minimal bundle size",icon:e.jsx(s.Zap,{className:"w-8 h-8"})},{title:"Customizable",description:"Highly customizable with extensive theming options and variants",icon:e.jsx(s.Palette,{className:"w-8 h-8"})},{title:"Accessible",description:"Built with accessibility in mind, WCAG 2.1 compliant",icon:e.jsx(s.Users,{className:"w-8 h-8"})},{title:"Responsive",description:"Mobile-first design that works seamlessly across all devices",icon:e.jsx(s.Smartphone,{className:"w-8 h-8"})},{title:"Type Safe",description:"Full TypeScript support with comprehensive type definitions",icon:e.jsx(s.Shield,{className:"w-8 h-8"})},{title:"Documentation",description:"Extensive documentation with examples and best practices",icon:e.jsx(s.BookOpen,{className:"w-8 h-8"})}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"CarouselCards",description:`A carousel component specifically designed for displaying cards with
           customizable sizes and variants.`,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-rose-500 to-pink-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(s.Layers,{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(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Basic Examples",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Basic Carousel Cards"}),e.jsx("div",{className:"w-full",children:e.jsx(a.CarouselCards,{cardClassName:"min-h-[250px]",cards:i})})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Navigation and Pagination"}),e.jsx("div",{className:"w-full",children:e.jsx(a.CarouselCards,{cards:i,showNavigation:!0,showPagination:!0})})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Elevated Variant - Medium Size"}),e.jsx("div",{className:"w-full",children:e.jsx(a.CarouselCards,{cards:i,variant:"elevated",cardSize:"md",showNavigation:!0})})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Outlined Variant - Large Size"}),e.jsx("div",{className:"w-full",children:e.jsx(a.CarouselCards,{cards:i,variant:"outlined",cardSize:"lg",showPagination:!0})})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Filled Variant - Small Size"}),e.jsx("div",{className:"w-full",children:e.jsx(a.CarouselCards,{cards:i,variant:"filled",cardSize:"sm",showNavigation:!0,showPagination:!0})})]})]})})})}),e.jsx(a.PropPlayground,{componentName:"CarouselCards",title:"CarouselCards Playground",defaultValues:{variant:"default",cardSize:"md",showCardTitles:!0,showNavigation:!0,showPagination:!0,loop:!0,grabCursor:!0,direction:"horizontal"},excludeProps:["cards","onSlideChange","onSwiper","breakpoints","autoplay","className","slideClassName","cardClassName","aria-label","effect","paginationType","centeredSlides","freeMode","mousewheel","slidesPerView","spaceBetween"],children:r=>e.jsx(a.CarouselCards,{...r,cards:[{title:"Card 1",description:"Description 1",image:""},{title:"Card 2",description:"Description 2",image:""},{title:"Card 3",description:"Description 3",image:""}]})}),e.jsx(a.AutoPropsTable,{componentName:"CarouselCards"}),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 { CarouselCards, LucideIcons } from '@e-burgos/tucu-ui';
 
 const cards = [

package/documentation/{CarouselCardsSection-HwS5Pilj.js → CarouselCardsSection-DV9s2xIN.js}

@@ -1,5 +1,5 @@
 import { jsxs as a, Fragment as d, jsx as e } from "react/jsx-runtime";
-import { H as n, C as i, a as l, T as t, V as s, P as o, A as m, c as h } from "../index-lfg6LZ1p.js";
+import { H as n, C as i, a as l, T as t, V as s, P as o, A as m, c as h } from "../index-19KsCnyX.js";
 import { Layers as p, Zap as u, Palette as C, Users as w, Smartphone as g, Shield as N, BookOpen as f } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{CarouselImageSection-DxcOoLwL.js → CarouselImageSection-B2VbVdOf.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-BaGqriuz.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const o=()=>{const s=[{src:"https://images.unsplash.com/photo-1682687220742-aba13b6e50ba?w=800&h=600&fit=crop",alt:"Mountain Landscape",title:"Mountain Peaks",description:"Breathtaking view of snow-capped mountain peaks at sunrise"},{src:"https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=800&h=600&fit=crop",alt:"Ocean View",title:"Ocean Horizon",description:"Serene ocean view with crystal clear blue waters"},{src:"https://images.unsplash.com/photo-1511593358241-7eea1f3c84e5?w=800&h=600&fit=crop",alt:"Forest Path",title:"Forest Trail",description:"Peaceful path through a lush green forest"},{src:"https://images.unsplash.com/photo-1501594907352-04cda38ebc29?w=800&h=600&fit=crop",alt:"Desert Sunset",title:"Desert Landscape",description:"Stunning sunset over golden desert dunes"},{src:"https://images.unsplash.com/photo-1542202229-7d93c33f5d07?w=800&h=600&fit=crop",alt:"City Skyline",title:"Urban Cityscape",description:"Modern city skyline illuminated at night"},{src:"https://images.unsplash.com/photo-1470071459604-3b5ec3a7fe05?w=800&h=600&fit=crop",alt:"Northern Lights",title:"Aurora Borealis",description:"Magical northern lights dancing across the night sky"}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"CarouselImage",description:`A carousel component specifically designed for displaying images with
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-DMs_SmPq.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const o=()=>{const s=[{src:"https://images.unsplash.com/photo-1682687220742-aba13b6e50ba?w=800&h=600&fit=crop",alt:"Mountain Landscape",title:"Mountain Peaks",description:"Breathtaking view of snow-capped mountain peaks at sunrise"},{src:"https://images.unsplash.com/photo-1506905925346-21bda4d32df4?w=800&h=600&fit=crop",alt:"Ocean View",title:"Ocean Horizon",description:"Serene ocean view with crystal clear blue waters"},{src:"https://images.unsplash.com/photo-1511593358241-7eea1f3c84e5?w=800&h=600&fit=crop",alt:"Forest Path",title:"Forest Trail",description:"Peaceful path through a lush green forest"},{src:"https://images.unsplash.com/photo-1501594907352-04cda38ebc29?w=800&h=600&fit=crop",alt:"Desert Sunset",title:"Desert Landscape",description:"Stunning sunset over golden desert dunes"},{src:"https://images.unsplash.com/photo-1542202229-7d93c33f5d07?w=800&h=600&fit=crop",alt:"City Skyline",title:"Urban Cityscape",description:"Modern city skyline illuminated at night"},{src:"https://images.unsplash.com/photo-1470071459604-3b5ec3a7fe05?w=800&h=600&fit=crop",alt:"Northern Lights",title:"Aurora Borealis",description:"Magical northern lights dancing across the night sky"}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"CarouselImage",description:`A carousel component specifically designed for displaying images with
           optional titles and descriptions.`,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-pink-600 to-rose-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(t.Image,{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(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Basic Examples",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Basic Image Carousel"}),e.jsx("div",{className:"w-full",children:e.jsx(a.CarouselImage,{images:s})})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Titles and Descriptions"}),e.jsx("div",{className:"w-full",children:e.jsx(a.CarouselImage,{images:s,showTitles:!0})})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Navigation and Pagination"}),e.jsx("div",{className:"w-full",children:e.jsx(a.CarouselImage,{images:s,showNavigation:!0,showPagination:!0})})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Contain Fit - Preserve Aspect Ratio"}),e.jsx("div",{className:"w-full",children:e.jsx(a.CarouselImage,{images:s,imageFit:"contain",showTitles:!0,showNavigation:!0})})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Square Aspect Ratio"}),e.jsx("div",{className:"w-full",children:e.jsx(a.CarouselImage,{images:s,aspectRatio:"aspect-square",showNavigation:!0,showPagination:!0})})]})]})})})}),e.jsx(a.PropPlayground,{componentName:"CarouselImage",title:"CarouselImage Playground",defaultValues:{showNavigation:!0,showPagination:!0,showTitles:!0,loop:!0,grabCursor:!0,lazy:!1,imageFit:"cover",direction:"horizontal"},excludeProps:["images","onSlideChange","onSwiper","breakpoints","autoplay","className","slideClassName","imageClassName","aria-label","aspectRatio","effect","paginationType","centeredSlides","freeMode","mousewheel","slidesPerView","spaceBetween"],children:i=>e.jsx(a.CarouselImage,{...i,images:[{src:"https://picsum.photos/seed/1/800/400",alt:"Image 1",title:"Image 1"},{src:"https://picsum.photos/seed/2/800/400",alt:"Image 2",title:"Image 2"},{src:"https://picsum.photos/seed/3/800/400",alt:"Image 3",title:"Image 3"}]})}),e.jsx(a.AutoPropsTable,{componentName:"CarouselImage"}),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 { CarouselImage } from '@e-burgos/tucu-ui';
 
 const images = [

package/documentation/{CarouselImageSection-yRgXBEHG.js → CarouselImageSection-BsgN88AS.js}

@@ -1,5 +1,5 @@
 import { jsxs as a, Fragment as n, jsx as e } from "react/jsx-runtime";
-import { H as c, C as s, a as l, T as o, W as i, P as m, A as p, c as h } from "../index-lfg6LZ1p.js";
+import { H as c, C as s, a as l, T as o, W as i, P as m, A as p, c as h } from "../index-19KsCnyX.js";
 import { Image as d } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{CarouselSection-Dyv4W4kt.js → CarouselSection-BuAhrfl8.js}

@@ -1,5 +1,5 @@
 import { jsxs as l, Fragment as n, jsx as e } from "react/jsx-runtime";
-import { H as c, C as a, a as o, T as s, U as i, P as m, A as u, c as h } from "../index-lfg6LZ1p.js";
+import { H as c, C as a, a as o, T as s, U as i, P as m, A as u, c as h } from "../index-19KsCnyX.js";
 import { GalleryHorizontal as p } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{CarouselSection-DVkA2Zts.js → CarouselSection-CBlMfgGw.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-BaGqriuz.js"),r=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const t=()=>{const l=[e.jsx("div",{className:"h-64 w-full bg-gradient-to-br from-brand to-sky-500 rounded-lg flex items-center justify-center text-white text-2xl",children:"Slide 1"},"1"),e.jsx("div",{className:"h-64 w-full bg-gradient-to-br from-brand to-green-500 rounded-lg flex items-center justify-center text-white text-2xl",children:"Slide 2"},"2"),e.jsx("div",{className:"h-64 w-full bg-gradient-to-br from-brand to-purple-500 rounded-lg flex items-center justify-center text-white text-2xl",children:"Slide 3"},"3")];return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Carousel",description:`A powerful carousel component built on Swiper.js with support for
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-DMs_SmPq.js"),r=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const t=()=>{const l=[e.jsx("div",{className:"h-64 w-full bg-gradient-to-br from-brand to-sky-500 rounded-lg flex items-center justify-center text-white text-2xl",children:"Slide 1"},"1"),e.jsx("div",{className:"h-64 w-full bg-gradient-to-br from-brand to-green-500 rounded-lg flex items-center justify-center text-white text-2xl",children:"Slide 2"},"2"),e.jsx("div",{className:"h-64 w-full bg-gradient-to-br from-brand to-purple-500 rounded-lg flex items-center justify-center text-white text-2xl",children:"Slide 3"},"3")];return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Carousel",description:`A powerful carousel component built on Swiper.js with support for
           navigation, pagination, autoplay, and various effects.`,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-pink-500 to-rose-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(r.GalleryHorizontal,{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(s.CardContainer,{className:"overflow-hidden",children:e.jsx(s.CardTitle,{title:"Basic Examples",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Basic Carousel"}),e.jsx("div",{className:"w-full",children:e.jsx(s.Carousel,{children:l})})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"With Navigation"}),e.jsx("div",{className:"w-full",children:e.jsx(s.Carousel,{showNavigation:!0,children:l})})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"With Pagination"}),e.jsx("div",{className:"w-full",children:e.jsx(s.Carousel,{showPagination:!0,children:l})})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Multiple Slides"}),e.jsx("div",{className:"w-full",children:e.jsx(s.Carousel,{slidesPerView:2,spaceBetween:20,children:l})})]})]})})})}),e.jsx(s.PropPlayground,{componentName:"Carousel",title:"Carousel Playground",defaultValues:{direction:"horizontal",effect:"slide",loop:!0,showNavigation:!0,showPagination:!0,paginationType:"bullets",grabCursor:!0,centeredSlides:!1,freeMode:!1,mousewheel:!1,slidesPerView:1,spaceBetween:16},excludeProps:["onSlideChange","onSwiper","breakpoints","autoplay","className","slideClassName","aria-label"],children:i=>e.jsx(s.Carousel,{...i,children:[1,2,3,4].map(a=>e.jsx("div",{className:"h-40 rounded-lg bg-brand/20 flex items-center justify-center",children:e.jsxs(s.Typography,{tag:"h4",children:["Slide ",a]})},a))})}),e.jsx(s.AutoPropsTable,{componentName:"Carousel"}),e.jsx(s.CardContainer,{className:"overflow-hidden",children:e.jsx(s.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(s.CodeBlock,{language:"tsx",code:`import { Carousel } from '@e-burgos/tucu-ui';
 
 const slides = [

package/documentation/{CheckboxSection-CFyl2-Lg.js → CheckboxSection-D5f8a17w.js}

@@ -1,6 +1,6 @@
 import { jsxs as l, Fragment as g, jsx as e } from "react/jsx-runtime";
 import { useState as n } from "react";
-import { H as u, C as a, a as d, T as r, p as c, P as k, A as C, c as N } from "../index-lfg6LZ1p.js";
+import { H as u, C as a, a as d, T as r, p as c, P as k, A as C, c as N } from "../index-19KsCnyX.js";
 import { CheckSquare as x } from "lucide-react";
 import "react-router-dom";
 import "react-dom";

package/documentation/{CheckboxSection-Cm9sabKa.js → CheckboxSection-DpC1rIxz.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-BaGqriuz.js"),t=require("lucide-react");require("react-router-dom");require("react-dom");const m=()=>{const[r,c]=o.useState(!1),[i,d]=o.useState(!0),n=[{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=[{label:"Small",size:"sm"},{label:"Medium",size:"md"},{label:"Large",size:"lg"}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Checkbox",description:"A checkbox component for binary selections.",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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg border border-green-500/50",children:e.jsx(t.CheckSquare,{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 Checkbox"}),e.jsx(a.Checkbox,{label:"I accept the terms and conditions",checked:r,onChange:s=>c(s.target.checked)})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Helper Text"}),e.jsx(a.Checkbox,{label:"Subscribe to newsletter",helperText:"Receive updates via email",checked:r,onChange:s=>c(s.target.checked)})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Error"}),e.jsx(a.Checkbox,{label:"Required checkbox",error:"This field is required"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Disabled"}),e.jsx(a.Checkbox,{label:"Disabled option",disabled:!0})]})]})})})}),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.Checkbox,{label:"Ghost Variant",variant:"ghost"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Solid"}),e.jsx(a.Checkbox,{label:"Solid Variant",variant:"solid"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Transparent"}),e.jsx(a.Checkbox,{label:"Transparent Variant",variant:"transparent"})]})]})})})}),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:n.map(({label:s,color:l})=>e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:s}),e.jsx(a.Checkbox,{label:`${s} Checkbox`,color:l})]},l))})})})}),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:h.map(({label:s,size:l})=>e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:s}),e.jsx(a.Checkbox,{label:`${s} Checkbox`,size:l})]},l))})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Shapes",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:"Rounded"}),e.jsx(a.Checkbox,{label:"Rounded Shape",shape:"rounded"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Square (default)"}),e.jsx(a.Checkbox,{label:"Square Shape",shape:"square"})]})]})})})}),e.jsx(a.PropPlayground,{componentName:"Checkbox",defaultValues:{label:"Preview Checkbox",variant:"ghost",color:"primary",size:"md",shape:"square",helperText:"",error:"",disabled:!1},includeProps:["label","variant","color","size","shape","helperText","error","disabled"],excludeProps:["checked","onChange"],children:s=>e.jsx(a.Checkbox,{...s,checked:i,onChange:l=>d(l.target.checked)})}),e.jsx(a.AutoPropsTable,{componentName:"Checkbox"}),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 { Checkbox } 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-DMs_SmPq.js"),t=require("lucide-react");require("react-router-dom");require("react-dom");const m=()=>{const[r,c]=o.useState(!1),[i,d]=o.useState(!0),n=[{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=[{label:"Small",size:"sm"},{label:"Medium",size:"md"},{label:"Large",size:"lg"}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Checkbox",description:"A checkbox component for binary selections.",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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg border border-green-500/50",children:e.jsx(t.CheckSquare,{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 Checkbox"}),e.jsx(a.Checkbox,{label:"I accept the terms and conditions",checked:r,onChange:s=>c(s.target.checked)})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Helper Text"}),e.jsx(a.Checkbox,{label:"Subscribe to newsletter",helperText:"Receive updates via email",checked:r,onChange:s=>c(s.target.checked)})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Error"}),e.jsx(a.Checkbox,{label:"Required checkbox",error:"This field is required"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Disabled"}),e.jsx(a.Checkbox,{label:"Disabled option",disabled:!0})]})]})})})}),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.Checkbox,{label:"Ghost Variant",variant:"ghost"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Solid"}),e.jsx(a.Checkbox,{label:"Solid Variant",variant:"solid"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Transparent"}),e.jsx(a.Checkbox,{label:"Transparent Variant",variant:"transparent"})]})]})})})}),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:n.map(({label:s,color:l})=>e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:s}),e.jsx(a.Checkbox,{label:`${s} Checkbox`,color:l})]},l))})})})}),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:h.map(({label:s,size:l})=>e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:s}),e.jsx(a.Checkbox,{label:`${s} Checkbox`,size:l})]},l))})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Shapes",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:"Rounded"}),e.jsx(a.Checkbox,{label:"Rounded Shape",shape:"rounded"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Square (default)"}),e.jsx(a.Checkbox,{label:"Square Shape",shape:"square"})]})]})})})}),e.jsx(a.PropPlayground,{componentName:"Checkbox",defaultValues:{label:"Preview Checkbox",variant:"ghost",color:"primary",size:"md",shape:"square",helperText:"",error:"",disabled:!1},includeProps:["label","variant","color","size","shape","helperText","error","disabled"],excludeProps:["checked","onChange"],children:s=>e.jsx(a.Checkbox,{...s,checked:i,onChange:l=>d(l.target.checked)})}),e.jsx(a.AutoPropsTable,{componentName:"Checkbox"}),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 { Checkbox } from '@e-burgos/tucu-ui';
 
 <Checkbox
   label="I accept the terms and conditions"

package/documentation/{CodeExamplesSection-D4BjomLZ.js → CodeExamplesSection-CzT6xoBd.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../index-BaGqriuz.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const o=()=>{const i=[{title:"Accessible Input with Error",description:"Input automatically connects label, error, and helper text via aria attributes.",code:`import { Input } from '@e-burgos/tucu-ui';
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../index-DMs_SmPq.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const o=()=>{const i=[{title:"Accessible Input with Error",description:"Input automatically connects label, error, and helper text via aria attributes.",code:`import { Input } from '@e-burgos/tucu-ui';
 
 // Input auto-generates IDs with useId()
 // label uses htmlFor → input id