@e-burgos/tucu-ui 2.0.9 → 2.0.11

package/documentation/{AuthorCardSection-DpUU5KDU.js → AuthorCardSection-DD1rPOTi.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"),o=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const r=require("../1-CArqgiQa.js"),s=()=>e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"AuthorCard",description:`A card component for displaying author information with avatar, name,
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-C0NugKZs.js"),o=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const r=require("../1-CArqgiQa.js"),s=()=>e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"AuthorCard",description:`A card component for displaying author information with avatar, name,
           and role.`,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-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(o.UserCircle,{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:"With Name and Role"}),e.jsx(a.AuthorCard,{image:r.avatar1Img,name:"John Doe",authorRole:"Senior Developer"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Name Only"}),e.jsx(a.AuthorCard,{image:r.avatar1Img,name:"Jane Smith"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Avatar Only"}),e.jsx(a.AuthorCard,{image:r.avatar1Img})]})]})})})}),e.jsx(a.PropPlayground,{componentName:"AuthorCard",defaultValues:{name:"John Doe",authorRole:"Developer",image:"https://randomuser.me/api/portraits/men/1.jpg"},excludeProps:[],children:t=>e.jsx(a.AuthorCard,{...t})}),e.jsx(a.AutoPropsTable,{componentName:"AuthorCard"}),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 { AuthorCard } from '@e-burgos/tucu-ui';
 
 // With name and role

package/documentation/{AuthorCardSection-cB8Liia6.js → AuthorCardSection-DKWXsN5r.js}

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

package/documentation/{AvatarSection-DZCiBPX4.js → AvatarSection-CEy3tSFZ.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),e=require("../index-BaGqriuz.js"),i=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=require("../1-CArqgiQa.js"),t=()=>a.jsxs(a.Fragment,{children:[a.jsx(e.HeroCard,{title:"Avatar",description:`A versatile avatar component for displaying user profile images with
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),e=require("../index-C0NugKZs.js"),i=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=require("../1-CArqgiQa.js"),t=()=>a.jsxs(a.Fragment,{children:[a.jsx(e.HeroCard,{title:"Avatar",description:`A versatile avatar component for displaying user profile images with
           multiple sizes and shapes.`,icon:a.jsx("div",{className:"w-16 h-16 sm:w-20 sm:h-20 md:w-24 md:h-24 bg-linear-to-br from-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:a.jsx(i.CircleUser,{className:"w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 text-white filter drop-shadow-lg"})})}),a.jsx(e.CardContainer,{className:"overflow-hidden",children:a.jsx(e.CardTitle,{title:"Basic Examples",className:"mt-2 mb-2",children:a.jsx("div",{className:"w-full p-4 sm:p-6",children:a.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4",children:[a.jsxs(e.CardContainer,{className:"p-4",children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Default Avatar"}),a.jsx(e.Avatar,{image:s.avatar1Img,alt:"User avatar"})]}),a.jsxs(e.CardContainer,{className:"p-4",children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Without Border"}),a.jsx(e.Avatar,{image:s.avatar1Img,alt:"User avatar",border:!1})]})]})})})}),a.jsx(e.CardContainer,{className:"overflow-hidden",children:a.jsx(e.CardTitle,{title:"Variants",className:"mt-2 mb-2",children:a.jsx("div",{className:"w-full p-4 sm:p-6",children:a.jsxs("div",{className:"space-y-6",children:[a.jsxs("div",{children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Sizes"}),a.jsxs("div",{className:"flex items-center gap-4",children:[a.jsx(e.Avatar,{image:s.avatar1Img,alt:"XS",size:"xs"}),a.jsx(e.Avatar,{image:s.avatar1Img,alt:"SM",size:"sm"}),a.jsx(e.Avatar,{image:s.avatar1Img,alt:"MD",size:"md"}),a.jsx(e.Avatar,{image:s.avatar1Img,alt:"LG",size:"lg"}),a.jsx(e.Avatar,{image:s.avatar1Img,alt:"XL",size:"xl"})]})]}),a.jsxs("div",{children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Shapes"}),a.jsxs("div",{className:"flex items-center gap-4",children:[a.jsx(e.Avatar,{image:s.avatar1Img,alt:"Circle",shape:"circle"}),a.jsx(e.Avatar,{image:s.avatar1Img,alt:"Rounded",shape:"rounded"})]})]})]})})})}),a.jsx(e.PropPlayground,{componentName:"Avatar",defaultValues:{size:"md",shape:"circle",border:!0,image:"https://randomuser.me/api/portraits/men/1.jpg",alt:"Avatar"},children:r=>a.jsx(e.Avatar,{...r})}),a.jsx(e.AutoPropsTable,{componentName:"Avatar"}),a.jsx(e.CardContainer,{className:"overflow-hidden",children:a.jsx(e.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:a.jsx("div",{className:"w-full p-4 sm:p-6",children:a.jsx(e.CodeBlock,{language:"tsx",code:`import { Avatar } from '@e-burgos/tucu-ui';
 
 // Basic usage

package/documentation/{AvatarSection-DpUjg_yW.js → AvatarSection-D6q5cCro.js}

@@ -1,5 +1,5 @@
 import { jsxs as s, Fragment as d, jsx as a } from "react/jsx-runtime";
-import { H as c, C as i, a as t, T as l, X as e, P as o, A as n, c as g } from "../index-lfg6LZ1p.js";
+import { H as c, C as i, a as t, T as l, X as e, P as o, A as n, c as g } from "../index-4GONhZIF.js";
 import { CircleUser as h } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/BackgroundsSection-DIO489vW.js

@@ -0,0 +1,6 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-C0NugKZs.js"),l=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const d=[{id:"base",name:"Base",type:"css",desc:"Spatial radial gradient. Default body/window background that adapts between light and dark.",usage:"Body, root window, app shell"},{id:"sonoma",name:"Sonoma",type:"css",desc:"Flat neutral surface matching macOS Sonoma system colors.",usage:"System-like flat interfaces"},{id:"radial",name:"Radial",type:"css",desc:"Vibrant radial gradient with brand colors for expressive surfaces.",usage:"Hero sections, expressive cards"},{id:"aurora",name:"Aurora",type:"css",desc:"Spatial aurora with animated-style blurred color orbs.",usage:"Landing pages, immersive UIs"},{id:"depth",name:"Depth",type:"css",desc:"Sober linear gradient, data-focused and subtle.",usage:"Dashboards, data-heavy layouts"},{id:"demo",name:"Demo",type:"css",desc:"Expressive dual-ellipse gradient for showcases and presentations.",usage:"Demos, showcases, marketing"},{id:"window",name:"Window",type:"css",desc:"Frosted glass surface with subtle backdrop blur.",usage:"Modal backdrops, floating panels"},{id:"wave",name:"Wave",type:"svg",desc:"Full-width decorative flowing shapes for desktop/tablet viewports.",usage:"Hero sections, landing pages, desktop full-screen"},{id:"wallpaper",name:"Wallpaper",type:"svg",desc:"Compact landscape format for banners and contained sections.",usage:"Banners, feature sections, contained backgrounds"},{id:"mobile",name:"Mobile",type:"svg",desc:"Portrait-oriented asset optimized for mobile viewports.",usage:"Mobile screens, narrow containers, portrait layouts"}],o=d.filter(t=>t.type==="css");d.filter(t=>t.type==="svg");const n=()=>{const{mode:t}=a.useTheme(),r=t==="dark";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(a.HeroCard,{title:"Backgrounds",description:"Unified background system with 10 variants available across all theme layouts. CSS-only gradients and SVG assets that adapt automatically between light and dark modes.",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-cyan-400 via-blue-500 to-indigo-600 rounded-full flex items-center justify-center shadow-lg border border-cyan-400/50",children:e.jsx(l.Image,{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:"All Background Variants",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full p-4 sm:p-6",children:[e.jsxs(a.Typography,{tag:"p",className:"text-sm text-gray-500 dark:text-gray-400 mb-6",children:["The"," ",e.jsx("code",{className:"text-xs px-1.5 py-0.5 rounded bg-gray-100 dark:bg-gray-800 font-mono",children:"ThemeBackground"})," ","component supports ",e.jsx("strong",{children:"10 variants"})," (7 CSS-only + 3 SVG assets). All are available in every theme layout via the"," ",e.jsx("code",{className:"text-xs px-1.5 py-0.5 rounded bg-gray-100 dark:bg-gray-800 font-mono",children:"backgroundVariant"})," ","store value."]}),e.jsx(a.BasicTable,{columns:[{key:"name",label:"Variant"},{key:"type",label:"Type",className:"font-mono"},{key:"desc",label:"Description"},{key:"usage",label:"Usage"}],data:d.map(s=>({name:s.name,type:s.type.toUpperCase(),desc:s.desc,usage:s.usage})),hoverable:!0,striped:!1})]})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"CSS Variants",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full p-4 sm:p-6",children:[e.jsx(a.Typography,{tag:"p",className:"text-sm text-gray-500 dark:text-gray-400 mb-4",children:"Pure CSS backgrounds generated with gradients and custom properties. No image downloads required."}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4",children:o.map(s=>e.jsxs("div",{className:"space-y-2",children:[e.jsx("div",{className:"relative w-full h-32 rounded-xl overflow-hidden border border-border",children:e.jsx(a.ThemeBackground,{mode:"absolute",variant:s.id,className:"!z-0"})}),e.jsx("p",{className:"text-xs font-semibold text-center text-gray-700 dark:text-gray-300",children:s.name}),e.jsx("p",{className:"text-[10px] text-center text-gray-400",children:s.desc})]},s.id))})]})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"SVG Asset Variants",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full p-4 sm:p-6",children:[e.jsx(a.Typography,{tag:"p",className:"text-sm text-gray-500 dark:text-gray-400 mb-4",children:"SVG backgrounds loaded from CDN. Optimized for specific viewport sizes. The component handles loading states and fallback gracefully."}),e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{className:"space-y-2",children:[e.jsxs("p",{className:"text-sm font-semibold text-gray-700 dark:text-gray-300",children:["Wave"," ",e.jsx("span",{className:"text-[10px] font-mono font-normal text-gray-400",children:"1512 × 982 — Landscape (desktop full-screen)"})]}),e.jsx("div",{className:"relative rounded-xl overflow-hidden border border-border h-[200px]",children:e.jsx(a.ThemeBackground,{mode:"absolute",variant:"wave",className:"!z-0"})}),e.jsx("div",{className:"p-2 rounded-lg bg-gray-100 dark:bg-gray-800/50",children:e.jsxs("p",{className:"text-[11px] font-mono text-gray-500 dark:text-gray-400 truncate",children:[e.jsx("span",{className:"text-gray-700 dark:text-gray-300",children:"url:"})," ",a.getBackgroundUrl("wave",r)]})})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsxs("p",{className:"text-sm font-semibold text-gray-700 dark:text-gray-300",children:["Wallpaper"," ",e.jsx("span",{className:"text-[10px] font-mono font-normal text-gray-400",children:"1080 × 560 — Landscape (contained sections)"})]}),e.jsx("div",{className:"relative rounded-xl overflow-hidden border border-border h-[180px]",children:e.jsx(a.ThemeBackground,{mode:"absolute",variant:"wallpaper",className:"!z-0"})}),e.jsx("div",{className:"p-2 rounded-lg bg-gray-100 dark:bg-gray-800/50",children:e.jsxs("p",{className:"text-[11px] font-mono text-gray-500 dark:text-gray-400 truncate",children:[e.jsx("span",{className:"text-gray-700 dark:text-gray-300",children:"url:"})," ",a.getBackgroundUrl("wallpaper",r)]})})]}),e.jsxs("div",{className:"space-y-2",children:[e.jsxs("p",{className:"text-sm font-semibold text-gray-700 dark:text-gray-300",children:["Mobile"," ",e.jsx("span",{className:"text-[10px] font-mono font-normal text-gray-400",children:"402 × 874 — Portrait (mobile screens)"})]}),e.jsx("div",{className:"flex justify-center",children:e.jsx("div",{className:"relative rounded-xl overflow-hidden border border-border w-[180px] h-[390px]",children:e.jsx(a.ThemeBackground,{mode:"absolute",variant:"mobile",className:"!z-0"})})}),e.jsx("div",{className:"p-2 rounded-lg bg-gray-100 dark:bg-gray-800/50",children:e.jsxs("p",{className:"text-[11px] font-mono text-gray-500 dark:text-gray-400 truncate",children:[e.jsx("span",{className:"text-gray-700 dark:text-gray-300",children:"url:"})," ",a.getBackgroundUrl("mobile",r)]})})]})]})]})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Usage",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-4",children:[e.jsxs(a.Typography,{tag:"p",className:"text-sm text-gray-500 dark:text-gray-400",children:["Use"," ",e.jsx("code",{className:"text-xs px-1.5 py-0.5 rounded bg-gray-100 dark:bg-gray-800 font-mono",children:"ThemeBackground"})," ","with two positioning modes:"]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4",children:[e.jsxs("div",{className:"p-4 rounded-xl border border-border space-y-2",children:[e.jsx("p",{className:"text-xs font-semibold text-gray-700 dark:text-gray-300",children:"Fixed Mode (Default Layouts)"}),e.jsx("p",{className:"text-[11px] text-gray-500 dark:text-gray-400",children:"Fullscreen fixed layer behind content. Content is wrapped automatically."}),e.jsx("pre",{className:"text-[10px] font-mono bg-gray-100 dark:bg-gray-800 rounded-lg p-3 overflow-x-auto",children:`<ThemeBackground>
+  {children}
+</ThemeBackground>`})]}),e.jsxs("div",{className:"p-4 rounded-xl border border-border space-y-2",children:[e.jsx("p",{className:"text-xs font-semibold text-gray-700 dark:text-gray-300",children:"Absolute Mode (macOS Layouts)"}),e.jsx("p",{className:"text-[11px] text-gray-500 dark:text-gray-400",children:"Absolute layer within parent container. No children wrapper."}),e.jsx("pre",{className:"text-[10px] font-mono bg-gray-100 dark:bg-gray-800 rounded-lg p-3 overflow-x-auto",children:`<div className="relative">
+  <ThemeBackground mode="absolute" />
+  {/* your content */}
+</div>`})]})]})]})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"ThemeBackground Props",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.BasicTable,{columns:[{key:"prop",label:"Prop"},{key:"type",label:"Type",className:"font-mono text-xs"},{key:"default",label:"Default",className:"font-mono"},{key:"desc",label:"Description"}],data:[{prop:"mode",type:"'fixed' | 'absolute'",default:"'fixed'",desc:"Positioning mode."},{prop:"variant",type:"BackgroundVariant",default:"store value",desc:"Override variant (defaults to theme store)."},{prop:"cdnBase",type:"string",default:"CDN URL",desc:"Override CDN base for SVG assets."},{prop:"className",type:"string",default:"—",desc:"Additional CSS class for the bg container."},{prop:"style",type:"CSSProperties",default:"—",desc:"Inline styles for the bg container."},{prop:"children",type:"ReactNode",default:"—",desc:"Content (only wrapped in fixed mode)."}],hoverable:!0,striped:!1})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Viewport Recommendations",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full p-4 sm:p-6",children:[e.jsx(a.Typography,{tag:"p",className:"text-sm text-gray-500 dark:text-gray-400 mb-4",children:"Recommended SVG background variant per viewport breakpoint for responsive implementations."}),e.jsx(a.BasicTable,{columns:[{key:"viewport",label:"Viewport"},{key:"breakpoint",label:"Breakpoint",className:"font-mono"},{key:"variant",label:"Variant"},{key:"asset",label:"Asset",className:"font-mono"}],data:[{viewport:"Mobile",breakpoint:"< 640px",variant:"mobile",asset:`${r?"dark":"light"}-mobile.svg`},{viewport:"Tablet",breakpoint:"640–1024px",variant:"wallpaper",asset:`${r?"dark":"light"}-wallpaper.svg`},{viewport:"Desktop",breakpoint:"> 1024px",variant:"wave",asset:`${r?"dark":"light"}-wave.svg`},{viewport:"Any",breakpoint:"All",variant:"CSS variants",asset:"No asset needed"}],hoverable:!0,striped:!1})]})})})]})};exports.default=n;

package/documentation/BackgroundsSection-ml2K7sVT.js

@@ -0,0 +1,367 @@
+import { jsxs as a, jsx as e } from "react/jsx-runtime";
+import { ay as p, H as g, C as s, a as l, T as o, y as i, az as n, aA as c } from "../index-4GONhZIF.js";
+import { Image as y } from "lucide-react";
+import "react-router-dom";
+import "react";
+import "react-dom";
+const m = [
+  {
+    id: "base",
+    name: "Base",
+    type: "css",
+    desc: "Spatial radial gradient. Default body/window background that adapts between light and dark.",
+    usage: "Body, root window, app shell"
+  },
+  {
+    id: "sonoma",
+    name: "Sonoma",
+    type: "css",
+    desc: "Flat neutral surface matching macOS Sonoma system colors.",
+    usage: "System-like flat interfaces"
+  },
+  {
+    id: "radial",
+    name: "Radial",
+    type: "css",
+    desc: "Vibrant radial gradient with brand colors for expressive surfaces.",
+    usage: "Hero sections, expressive cards"
+  },
+  {
+    id: "aurora",
+    name: "Aurora",
+    type: "css",
+    desc: "Spatial aurora with animated-style blurred color orbs.",
+    usage: "Landing pages, immersive UIs"
+  },
+  {
+    id: "depth",
+    name: "Depth",
+    type: "css",
+    desc: "Sober linear gradient, data-focused and subtle.",
+    usage: "Dashboards, data-heavy layouts"
+  },
+  {
+    id: "demo",
+    name: "Demo",
+    type: "css",
+    desc: "Expressive dual-ellipse gradient for showcases and presentations.",
+    usage: "Demos, showcases, marketing"
+  },
+  {
+    id: "window",
+    name: "Window",
+    type: "css",
+    desc: "Frosted glass surface with subtle backdrop blur.",
+    usage: "Modal backdrops, floating panels"
+  },
+  {
+    id: "wave",
+    name: "Wave",
+    type: "svg",
+    desc: "Full-width decorative flowing shapes for desktop/tablet viewports.",
+    usage: "Hero sections, landing pages, desktop full-screen"
+  },
+  {
+    id: "wallpaper",
+    name: "Wallpaper",
+    type: "svg",
+    desc: "Compact landscape format for banners and contained sections.",
+    usage: "Banners, feature sections, contained backgrounds"
+  },
+  {
+    id: "mobile",
+    name: "Mobile",
+    type: "svg",
+    desc: "Portrait-oriented asset optimized for mobile viewports.",
+    usage: "Mobile screens, narrow containers, portrait layouts"
+  }
+], h = m.filter((d) => d.type === "css");
+m.filter((d) => d.type === "svg");
+const k = () => {
+  const { mode: d } = p(), t = d === "dark";
+  return /* @__PURE__ */ a("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: [
+    /* @__PURE__ */ e(
+      g,
+      {
+        title: "Backgrounds",
+        description: "Unified background system with 10 variants available across all theme layouts. CSS-only gradients and SVG assets that adapt automatically between light and dark modes.",
+        icon: /* @__PURE__ */ e("div", { className: "w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-cyan-400 via-blue-500 to-indigo-600 rounded-full flex items-center justify-center shadow-lg border border-cyan-400/50", children: /* @__PURE__ */ e(y, { className: "w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg" }) })
+      }
+    ),
+    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "All Background Variants", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "w-full p-4 sm:p-6", children: [
+      /* @__PURE__ */ a(
+        o,
+        {
+          tag: "p",
+          className: "text-sm text-gray-500 dark:text-gray-400 mb-6",
+          children: [
+            "The",
+            " ",
+            /* @__PURE__ */ e("code", { className: "text-xs px-1.5 py-0.5 rounded bg-gray-100 dark:bg-gray-800 font-mono", children: "ThemeBackground" }),
+            " ",
+            "component supports ",
+            /* @__PURE__ */ e("strong", { children: "10 variants" }),
+            " (7 CSS-only + 3 SVG assets). All are available in every theme layout via the",
+            " ",
+            /* @__PURE__ */ e("code", { className: "text-xs px-1.5 py-0.5 rounded bg-gray-100 dark:bg-gray-800 font-mono", children: "backgroundVariant" }),
+            " ",
+            "store value."
+          ]
+        }
+      ),
+      /* @__PURE__ */ e(
+        i,
+        {
+          columns: [
+            { key: "name", label: "Variant" },
+            { key: "type", label: "Type", className: "font-mono" },
+            { key: "desc", label: "Description" },
+            { key: "usage", label: "Usage" }
+          ],
+          data: m.map((r) => ({
+            name: r.name,
+            type: r.type.toUpperCase(),
+            desc: r.desc,
+            usage: r.usage
+          })),
+          hoverable: !0,
+          striped: !1
+        }
+      )
+    ] }) }) }),
+    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "CSS Variants", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "w-full p-4 sm:p-6", children: [
+      /* @__PURE__ */ e(
+        o,
+        {
+          tag: "p",
+          className: "text-sm text-gray-500 dark:text-gray-400 mb-4",
+          children: "Pure CSS backgrounds generated with gradients and custom properties. No image downloads required."
+        }
+      ),
+      /* @__PURE__ */ e("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-4", children: h.map((r) => /* @__PURE__ */ a("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ e("div", { className: "relative w-full h-32 rounded-xl overflow-hidden border border-border", children: /* @__PURE__ */ e(
+          n,
+          {
+            mode: "absolute",
+            variant: r.id,
+            className: "!z-0"
+          }
+        ) }),
+        /* @__PURE__ */ e("p", { className: "text-xs font-semibold text-center text-gray-700 dark:text-gray-300", children: r.name }),
+        /* @__PURE__ */ e("p", { className: "text-[10px] text-center text-gray-400", children: r.desc })
+      ] }, r.id)) })
+    ] }) }) }),
+    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "SVG Asset Variants", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "w-full p-4 sm:p-6", children: [
+      /* @__PURE__ */ e(
+        o,
+        {
+          tag: "p",
+          className: "text-sm text-gray-500 dark:text-gray-400 mb-4",
+          children: "SVG backgrounds loaded from CDN. Optimized for specific viewport sizes. The component handles loading states and fallback gracefully."
+        }
+      ),
+      /* @__PURE__ */ a("div", { className: "space-y-6", children: [
+        /* @__PURE__ */ a("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ a("p", { className: "text-sm font-semibold text-gray-700 dark:text-gray-300", children: [
+            "Wave",
+            " ",
+            /* @__PURE__ */ e("span", { className: "text-[10px] font-mono font-normal text-gray-400", children: "1512 × 982 — Landscape (desktop full-screen)" })
+          ] }),
+          /* @__PURE__ */ e("div", { className: "relative rounded-xl overflow-hidden border border-border h-[200px]", children: /* @__PURE__ */ e(
+            n,
+            {
+              mode: "absolute",
+              variant: "wave",
+              className: "!z-0"
+            }
+          ) }),
+          /* @__PURE__ */ e("div", { className: "p-2 rounded-lg bg-gray-100 dark:bg-gray-800/50", children: /* @__PURE__ */ a("p", { className: "text-[11px] font-mono text-gray-500 dark:text-gray-400 truncate", children: [
+            /* @__PURE__ */ e("span", { className: "text-gray-700 dark:text-gray-300", children: "url:" }),
+            " ",
+            c("wave", t)
+          ] }) })
+        ] }),
+        /* @__PURE__ */ a("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ a("p", { className: "text-sm font-semibold text-gray-700 dark:text-gray-300", children: [
+            "Wallpaper",
+            " ",
+            /* @__PURE__ */ e("span", { className: "text-[10px] font-mono font-normal text-gray-400", children: "1080 × 560 — Landscape (contained sections)" })
+          ] }),
+          /* @__PURE__ */ e("div", { className: "relative rounded-xl overflow-hidden border border-border h-[180px]", children: /* @__PURE__ */ e(
+            n,
+            {
+              mode: "absolute",
+              variant: "wallpaper",
+              className: "!z-0"
+            }
+          ) }),
+          /* @__PURE__ */ e("div", { className: "p-2 rounded-lg bg-gray-100 dark:bg-gray-800/50", children: /* @__PURE__ */ a("p", { className: "text-[11px] font-mono text-gray-500 dark:text-gray-400 truncate", children: [
+            /* @__PURE__ */ e("span", { className: "text-gray-700 dark:text-gray-300", children: "url:" }),
+            " ",
+            c("wallpaper", t)
+          ] }) })
+        ] }),
+        /* @__PURE__ */ a("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ a("p", { className: "text-sm font-semibold text-gray-700 dark:text-gray-300", children: [
+            "Mobile",
+            " ",
+            /* @__PURE__ */ e("span", { className: "text-[10px] font-mono font-normal text-gray-400", children: "402 × 874 — Portrait (mobile screens)" })
+          ] }),
+          /* @__PURE__ */ e("div", { className: "flex justify-center", children: /* @__PURE__ */ e("div", { className: "relative rounded-xl overflow-hidden border border-border w-[180px] h-[390px]", children: /* @__PURE__ */ e(
+            n,
+            {
+              mode: "absolute",
+              variant: "mobile",
+              className: "!z-0"
+            }
+          ) }) }),
+          /* @__PURE__ */ e("div", { className: "p-2 rounded-lg bg-gray-100 dark:bg-gray-800/50", children: /* @__PURE__ */ a("p", { className: "text-[11px] font-mono text-gray-500 dark:text-gray-400 truncate", children: [
+            /* @__PURE__ */ e("span", { className: "text-gray-700 dark:text-gray-300", children: "url:" }),
+            " ",
+            c("mobile", t)
+          ] }) })
+        ] })
+      ] })
+    ] }) }) }),
+    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "Usage", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "w-full p-4 sm:p-6 space-y-4", children: [
+      /* @__PURE__ */ a(
+        o,
+        {
+          tag: "p",
+          className: "text-sm text-gray-500 dark:text-gray-400",
+          children: [
+            "Use",
+            " ",
+            /* @__PURE__ */ e("code", { className: "text-xs px-1.5 py-0.5 rounded bg-gray-100 dark:bg-gray-800 font-mono", children: "ThemeBackground" }),
+            " ",
+            "with two positioning modes:"
+          ]
+        }
+      ),
+      /* @__PURE__ */ a("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
+        /* @__PURE__ */ a("div", { className: "p-4 rounded-xl border border-border space-y-2", children: [
+          /* @__PURE__ */ e("p", { className: "text-xs font-semibold text-gray-700 dark:text-gray-300", children: "Fixed Mode (Default Layouts)" }),
+          /* @__PURE__ */ e("p", { className: "text-[11px] text-gray-500 dark:text-gray-400", children: "Fullscreen fixed layer behind content. Content is wrapped automatically." }),
+          /* @__PURE__ */ e("pre", { className: "text-[10px] font-mono bg-gray-100 dark:bg-gray-800 rounded-lg p-3 overflow-x-auto", children: `<ThemeBackground>
+  {children}
+</ThemeBackground>` })
+        ] }),
+        /* @__PURE__ */ a("div", { className: "p-4 rounded-xl border border-border space-y-2", children: [
+          /* @__PURE__ */ e("p", { className: "text-xs font-semibold text-gray-700 dark:text-gray-300", children: "Absolute Mode (macOS Layouts)" }),
+          /* @__PURE__ */ e("p", { className: "text-[11px] text-gray-500 dark:text-gray-400", children: "Absolute layer within parent container. No children wrapper." }),
+          /* @__PURE__ */ e("pre", { className: "text-[10px] font-mono bg-gray-100 dark:bg-gray-800 rounded-lg p-3 overflow-x-auto", children: `<div className="relative">
+  <ThemeBackground mode="absolute" />
+  {/* your content */}
+</div>` })
+        ] })
+      ] })
+    ] }) }) }),
+    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "ThemeBackground Props", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
+      i,
+      {
+        columns: [
+          { key: "prop", label: "Prop" },
+          { key: "type", label: "Type", className: "font-mono text-xs" },
+          { key: "default", label: "Default", className: "font-mono" },
+          { key: "desc", label: "Description" }
+        ],
+        data: [
+          {
+            prop: "mode",
+            type: "'fixed' | 'absolute'",
+            default: "'fixed'",
+            desc: "Positioning mode."
+          },
+          {
+            prop: "variant",
+            type: "BackgroundVariant",
+            default: "store value",
+            desc: "Override variant (defaults to theme store)."
+          },
+          {
+            prop: "cdnBase",
+            type: "string",
+            default: "CDN URL",
+            desc: "Override CDN base for SVG assets."
+          },
+          {
+            prop: "className",
+            type: "string",
+            default: "—",
+            desc: "Additional CSS class for the bg container."
+          },
+          {
+            prop: "style",
+            type: "CSSProperties",
+            default: "—",
+            desc: "Inline styles for the bg container."
+          },
+          {
+            prop: "children",
+            type: "ReactNode",
+            default: "—",
+            desc: "Content (only wrapped in fixed mode)."
+          }
+        ],
+        hoverable: !0,
+        striped: !1
+      }
+    ) }) }) }),
+    /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "Viewport Recommendations", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "w-full p-4 sm:p-6", children: [
+      /* @__PURE__ */ e(
+        o,
+        {
+          tag: "p",
+          className: "text-sm text-gray-500 dark:text-gray-400 mb-4",
+          children: "Recommended SVG background variant per viewport breakpoint for responsive implementations."
+        }
+      ),
+      /* @__PURE__ */ e(
+        i,
+        {
+          columns: [
+            { key: "viewport", label: "Viewport" },
+            {
+              key: "breakpoint",
+              label: "Breakpoint",
+              className: "font-mono"
+            },
+            { key: "variant", label: "Variant" },
+            { key: "asset", label: "Asset", className: "font-mono" }
+          ],
+          data: [
+            {
+              viewport: "Mobile",
+              breakpoint: "< 640px",
+              variant: "mobile",
+              asset: `${t ? "dark" : "light"}-mobile.svg`
+            },
+            {
+              viewport: "Tablet",
+              breakpoint: "640–1024px",
+              variant: "wallpaper",
+              asset: `${t ? "dark" : "light"}-wallpaper.svg`
+            },
+            {
+              viewport: "Desktop",
+              breakpoint: "> 1024px",
+              variant: "wave",
+              asset: `${t ? "dark" : "light"}-wave.svg`
+            },
+            {
+              viewport: "Any",
+              breakpoint: "All",
+              variant: "CSS variants",
+              asset: "No asset needed"
+            }
+          ],
+          hoverable: !0,
+          striped: !1
+        }
+      )
+    ] }) }) })
+  ] });
+};
+export {
+  k as default
+};

package/documentation/{BadgeSection-Cteg--jV.js → BadgeSection-D87SEfxH.js}

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

package/documentation/{BadgeSection-B7mtSvQv.js → BadgeSection-Nan3Lkev.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"),i=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const r=()=>e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Badge",description:`A badge component for displaying status indicators and labels with
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-C0NugKZs.js"),i=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const r=()=>e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Badge",description:`A badge component for displaying status indicators and labels with
           various styles and sizes.`,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-teal-500 to-emerald-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(i.Award,{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-6",children:[e.jsxs("div",{children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Status Badges"}),e.jsxs("div",{className:"flex flex-wrap items-center gap-3",children:[e.jsx(a.Badge,{status:"active",children:"Active"}),e.jsx(a.Badge,{status:"inactive",children:"Inactive"}),e.jsx(a.Badge,{status:"pending",children:"Pending"}),e.jsx(a.Badge,{status:"default",children:"Default"})]})]}),e.jsxs("div",{children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Status Indicators (Dots Only)"}),e.jsxs("div",{className:"flex flex-wrap items-center gap-3",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(a.Badge,{status:"active",withDot:!0}),e.jsx("span",{className:"text-sm",children:"Online"})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(a.Badge,{status:"inactive",withDot:!0}),e.jsx("span",{className:"text-sm",children:"Offline"})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(a.Badge,{status:"pending",withDot:!0}),e.jsx("span",{className:"text-sm",children:"Away"})]})]})]}),e.jsxs("div",{children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Dot Indicator"}),e.jsxs("div",{className:"flex flex-wrap items-center gap-3",children:[e.jsx(a.Badge,{status:"active",withDot:!0,children:"Active"}),e.jsx(a.Badge,{status:"inactive",withDot:!0,children:"Inactive"}),e.jsx(a.Badge,{status:"pending",withDot:!0,children:"Pending"})]})]})]})})})}),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.jsxs("div",{className:"flex flex-wrap items-center gap-3",children:[e.jsx(a.Badge,{color:"primary",children:"Primary"}),e.jsx(a.Badge,{color:"success",children:"Success"}),e.jsx(a.Badge,{color:"info",children:"Info"}),e.jsx(a.Badge,{color:"warning",children:"Warning"}),e.jsx(a.Badge,{color:"danger",children:"Danger"}),e.jsx(a.Badge,{color:"gray",children:"Gray"})]})})})}),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.jsxs("div",{className:"flex flex-wrap items-center gap-3",children:[e.jsx(a.Badge,{size:"tiny",color:"primary",children:"Tiny"}),e.jsx(a.Badge,{size:"small",color:"primary",children:"Small"}),e.jsx(a.Badge,{size:"medium",color:"primary",children:"Medium"}),e.jsx(a.Badge,{size:"large",color:"primary",children:"Large"})]})})})}),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:"space-y-4",children:[e.jsxs("div",{children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Solid"}),e.jsxs("div",{className:"flex flex-wrap items-center gap-3",children:[e.jsx(a.Badge,{variant:"solid",color:"primary",children:"Primary"}),e.jsx(a.Badge,{variant:"solid",color:"success",children:"Success"}),e.jsx(a.Badge,{variant:"solid",color:"danger",children:"Danger"})]})]}),e.jsxs("div",{children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Soft"}),e.jsxs("div",{className:"flex flex-wrap items-center gap-3",children:[e.jsx(a.Badge,{variant:"soft",color:"primary",children:"Primary"}),e.jsx(a.Badge,{variant:"soft",color:"success",children:"Success"}),e.jsx(a.Badge,{variant:"soft",color:"danger",children:"Danger"})]})]}),e.jsxs("div",{children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Outline"}),e.jsxs("div",{className:"flex flex-wrap items-center gap-3",children:[e.jsx(a.Badge,{variant:"outline",color:"primary",children:"Primary"}),e.jsx(a.Badge,{variant:"outline",color:"success",children:"Success"}),e.jsx(a.Badge,{variant:"outline",color:"danger",children:"Danger"})]})]}),e.jsxs("div",{children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Ghost"}),e.jsxs("div",{className:"flex flex-wrap items-center gap-3",children:[e.jsx(a.Badge,{variant:"ghost",color:"primary",children:"Primary"}),e.jsx(a.Badge,{variant:"ghost",color:"success",children:"Success"}),e.jsx(a.Badge,{variant:"ghost",color:"danger",children:"Danger"})]})]})]})})})}),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:"flex flex-wrap items-center gap-3",children:[e.jsx(a.Badge,{shape:"rounded",color:"primary",children:"Rounded"}),e.jsx(a.Badge,{shape:"pill",color:"success",children:"Pill"}),e.jsx(a.Badge,{shape:"circle",color:"danger",size:"large",withDot:!0})]})})})}),e.jsx(a.PropPlayground,{componentName:"Badge",defaultValues:{variant:"solid",size:"small",shape:"pill",color:"primary",withDot:!1},excludeProps:["status"],children:s=>e.jsx(a.Badge,{...s,children:"Badge"})}),e.jsx(a.AutoPropsTable,{componentName:"Badge"}),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 { Badge } from '@e-burgos/tucu-ui';
 
 // Basic usage with status

package/documentation/{BarChartSection-rkETKOO2.js → BarChartSection-CDVExS5W.js}

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

package/documentation/{BarChartSection-Clrho1um.js → BarChartSection-kjXT_9gz.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");require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=[{name:"Jan",sales:4e3,returns:400,target:4500},{name:"Feb",sales:3e3,returns:300,target:3500},{name:"Mar",sales:5e3,returns:500,target:4800},{name:"Apr",sales:4780,returns:478,target:5e3},{name:"May",sales:5890,returns:589,target:5500},{name:"Jun",sales:6390,returns:639,target:6e3}],t=()=>e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"text-center space-y-4",children:[e.jsx(a.Typography,{tag:"h2",className:"text-base md:text-base font-semibold",children:"BarChart"}),e.jsx(a.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"Bar chart component for comparing categorical data with support for stacking, horizontal layout, and custom bar styling."})]}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Basic Bar Chart",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.BarChart,{data:s,series:[{dataKey:"sales",name:"Sales"},{dataKey:"returns",name:"Returns"}],height:300})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Stacked Bars",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.BarChart,{data:s,series:[{dataKey:"sales",name:"Sales",stackId:"a"},{dataKey:"returns",name:"Returns",stackId:"a"}],stacked:!0,height:300})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Horizontal Layout",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.BarChart,{data:s,series:[{dataKey:"sales",name:"Sales"}],layout:"vertical",height:350})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Usage",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.CodeBlock,{code:`import { BarChart } from '@e-burgos/tucu-ui';
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-C0NugKZs.js");require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=[{name:"Jan",sales:4e3,returns:400,target:4500},{name:"Feb",sales:3e3,returns:300,target:3500},{name:"Mar",sales:5e3,returns:500,target:4800},{name:"Apr",sales:4780,returns:478,target:5e3},{name:"May",sales:5890,returns:589,target:5500},{name:"Jun",sales:6390,returns:639,target:6e3}],t=()=>e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"text-center space-y-4",children:[e.jsx(a.Typography,{tag:"h2",className:"text-base md:text-base font-semibold",children:"BarChart"}),e.jsx(a.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"Bar chart component for comparing categorical data with support for stacking, horizontal layout, and custom bar styling."})]}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Basic Bar Chart",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.BarChart,{data:s,series:[{dataKey:"sales",name:"Sales"},{dataKey:"returns",name:"Returns"}],height:300})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Stacked Bars",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.BarChart,{data:s,series:[{dataKey:"sales",name:"Sales",stackId:"a"},{dataKey:"returns",name:"Returns",stackId:"a"}],stacked:!0,height:300})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Horizontal Layout",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.BarChart,{data:s,series:[{dataKey:"sales",name:"Sales"}],layout:"vertical",height:350})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Usage",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.CodeBlock,{code:`import { BarChart } from '@e-burgos/tucu-ui';
 
 const data = [
   { name: 'Jan', sales: 4000, returns: 400 },

package/documentation/{BasicTableSection-Cf3FcRGV.js → BasicTableSection-6_00z3Ow.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 o=()=>{const s=[{key:"name",label:"Name"},{key:"age",label:"Age"},{key:"city",label:"City"}],l=[{name:"John Doe",age:30,city:"New York"},{name:"Jane Smith",age:25,city:"Los Angeles"},{name:"Bob Johnson",age:35,city:"Chicago"}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"BasicTable",description:`A flexible and customizable table component with support for custom
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-C0NugKZs.js"),r=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const o=()=>{const s=[{key:"name",label:"Name"},{key:"age",label:"Age"},{key:"city",label:"City"}],l=[{name:"John Doe",age:30,city:"New York"},{name:"Jane Smith",age:25,city:"Los Angeles"},{name:"Bob Johnson",age:35,city:"Chicago"}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"BasicTable",description:`A flexible and customizable table component with support for custom
           rendering, styling, and interactions.`,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-teal-500 to-cyan-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(r.Table2,{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 Table"}),e.jsx(a.BasicTable,{columns:s,data:l})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Striped Table"}),e.jsx(a.BasicTable,{columns:s,data:l,striped:!0})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Without Border"}),e.jsx(a.BasicTable,{columns:s,data:l,border:!1})]})]})})})}),e.jsx(a.PropPlayground,{componentName:"BasicTable",title:"BasicTable Playground",defaultValues:{border:!1,hoverable:!0,rounded:!0,striped:!1,showHeader:!0,resizable:!1},excludeProps:["columns","data","className","containerClassName","headerClassName","tableClassName","rowClassName","maxRows"],children:t=>e.jsx(a.BasicTable,{...t,columns:[{key:"name",label:"Name"},{key:"role",label:"Role"},{key:"status",label:"Status"}],data:[{name:"Alice",role:"Developer",status:"Active"},{name:"Bob",role:"Designer",status:"Inactive"},{name:"Carol",role:"Manager",status:"Active"}]})}),e.jsx(a.AutoPropsTable,{componentName:"BasicTable"}),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 { BasicTable } from '@e-burgos/tucu-ui';
 
 const columns = [

package/documentation/{BasicTableSection-7S3mV6WL.js → BasicTableSection-BZZ4LZPr.js}

@@ -1,5 +1,5 @@
 import { jsxs as a, Fragment as m, jsx as e } from "react/jsx-runtime";
-import { H as i, C as l, a as n, T as r, y as s, P as d, A as u, c as h } from "../index-lfg6LZ1p.js";
+import { H as i, C as l, a as n, T as r, y as s, P as d, A as u, c as h } from "../index-4GONhZIF.js";
 import { Table2 as b } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{BasicUsageSection-C04Vk4Xo.js → BasicUsageSection-C0jPVah2.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 s=()=>e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Basic Usage",description:"Get started with the form system in three steps: define your types, set defaults, and compose your form with Form + FormField.",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.Code,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"h2",className:"mb-2",children:"Step by Step"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Three steps to create a fully typed, validated form"})]}),e.jsxs("div",{className:"space-y-6",children:[e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"1. Define Form Values Interface",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full space-y-4 p-4 sm:p-6",children:[e.jsx(a.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:"Start by defining a TypeScript interface for your form data. This enables type-safe field names and submission handlers."}),e.jsx(a.CodeBlock,{language:"tsx",code:`export interface FormValues {
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-C0NugKZs.js"),r=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=()=>e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Basic Usage",description:"Get started with the form system in three steps: define your types, set defaults, and compose your form with Form + FormField.",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.Code,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"h2",className:"mb-2",children:"Step by Step"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Three steps to create a fully typed, validated form"})]}),e.jsxs("div",{className:"space-y-6",children:[e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"1. Define Form Values Interface",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full space-y-4 p-4 sm:p-6",children:[e.jsx(a.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:"Start by defining a TypeScript interface for your form data. This enables type-safe field names and submission handlers."}),e.jsx(a.CodeBlock,{language:"tsx",code:`export interface FormValues {
   name: string;
   email: string;
   password: string;
@@ -7,7 +7,7 @@
   age: number;
   gender: string;
   country: string;
-}`})]})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"2. Create Default Values",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full space-y-4 p-4 sm:p-6",children:[e.jsxs(a.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:["Define default values matching your interface. These initialize the form and are used by"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"reset()"}),"."]}),e.jsx(a.CodeBlock,{language:"ts",code:`export const defaultValues: FormValues = {
+}`})]})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"2. Create Default Values",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full space-y-4 p-4 sm:p-6",children:[e.jsxs(a.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:["Define default values matching your interface. These initialize the form and are used by"," ",e.jsx("code",{className:"px-1 py-0.5 border border-border rounded text-xs",children:"reset()"}),"."]}),e.jsx(a.CodeBlock,{language:"ts",code:`export const defaultValues: FormValues = {
   name: '',
   email: '',
   password: '',
@@ -16,7 +16,7 @@
   age: 0,
   gender: '',
   country: 'ar',
-};`})]})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"3. Compose the Form",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full space-y-4 p-4 sm:p-6",children:[e.jsxs(a.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:["Use"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"<Form>"})," ","as the container and"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"<FormField>"})," ","to wrap each input. FormField handles registration, error display, and labeling."]}),e.jsx(a.CodeBlock,{language:"tsx",code:`import { Form, FormField, Input, Button } from '@e-burgos/tucu-ui';
+};`})]})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"3. Compose the Form",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full space-y-4 p-4 sm:p-6",children:[e.jsxs(a.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:["Use"," ",e.jsx("code",{className:"px-1 py-0.5 border border-border rounded text-xs",children:"<Form>"})," ","as the container and"," ",e.jsx("code",{className:"px-1 py-0.5 border border-border rounded text-xs",children:"<FormField>"})," ","to wrap each input. FormField handles registration, error display, and labeling."]}),e.jsx(a.CodeBlock,{language:"tsx",code:`import { Form, FormField, Input, Button } from '@e-burgos/tucu-ui';
 
 function ContactForm() {
   const handleSubmit = (data: FormValues) => {