@e-burgos/tucu-ui 2.0.10 → 2.1.0

package/documentation/{LayoutTypesSection-DtAUqzLt.js → LayoutTypesSection-CRx7XS_d.js}

@@ -1,17 +1,17 @@
 import { jsx as e, jsxs as a, Fragment as d } from "react/jsx-runtime";
-import { aB as n, H as m, T as t, C as p, K as h } from "../index-19KsCnyX.js";
-import { Layout as u, Menu as g, Minimize2 as w, Monitor as v, Sparkles as b, AppWindow as f, Layers as x, Gem as y, LayoutGrid as N, Zap as S, CheckCircle as k, Star as L, Check as O, Code as C } from "lucide-react";
+import { aB as i, H as m, T as t, C as p, K as h } from "../index-sdOMz8GW.js";
+import { Layout as u, Menu as g, Minimize2 as v, Monitor as w, Sparkles as b, AppWindow as f, Layers as y, Gem as x, PanelTop as S, GalleryHorizontalEnd as N, LayoutGrid as k, Zap as O, CheckCircle as L, Star as T, Check as C, Code as A } from "lucide-react";
 import "react-router-dom";
 import "react";
 import "react-dom";
-const q = () => {
+const B = () => {
   const r = [
     {
       name: "Admin Layout",
       description: "Traditional admin layout with expandable sidebar and fixed header. Designed for complex applications with hierarchical navigation and multiple sections.",
       icon: /* @__PURE__ */ e(u, { className: "w-8 h-8 text-white filter drop-shadow-sm" }),
       color: "from-blue-500 via-cyan-500 to-teal-500",
-      value: n.ADMIN,
+      value: i.ADMIN,
       useCases: [
         "Dashboard applications",
         "Admin panels and management systems",
@@ -41,7 +41,7 @@ const q = () => {
       description: "Modern horizontal navigation layout with top menu bar. Ideal for content-focused sites, marketing pages, and applications with simple navigation.",
       icon: /* @__PURE__ */ e(g, { className: "w-8 h-8 text-white filter drop-shadow-sm" }),
       color: "from-purple-500 via-violet-500 to-indigo-500",
-      value: n.HORIZONTAL,
+      value: i.HORIZONTAL,
       useCases: [
         "Content-focused websites",
         "Marketing and landing pages",
@@ -69,9 +69,9 @@ const q = () => {
     {
       name: "Clean Layout",
       description: "Minimal layout without navigation elements. Perfect for authentication pages, standalone content, and full-screen experiences.",
-      icon: /* @__PURE__ */ e(w, { className: "w-8 h-8 text-white filter drop-shadow-sm" }),
+      icon: /* @__PURE__ */ e(v, { className: "w-8 h-8 text-white filter drop-shadow-sm" }),
       color: "from-emerald-500 via-green-500 to-teal-500",
-      value: n.CLEAN,
+      value: i.CLEAN,
       useCases: [
         "Authentication pages (login, signup, password reset)",
         "Landing pages and marketing sites",
@@ -99,9 +99,9 @@ const q = () => {
     {
       name: "macOS Sonoma Layout",
       description: "macOS Sonoma desktop-style layout with frosted sidebar, toolbar, and window chrome. Ideal for desktop-like applications with macOS-inspired aesthetics.",
-      icon: /* @__PURE__ */ e(v, { className: "w-8 h-8 text-white filter drop-shadow-sm" }),
+      icon: /* @__PURE__ */ e(w, { className: "w-8 h-8 text-white filter drop-shadow-sm" }),
       color: "from-gray-500 via-slate-500 to-zinc-500",
-      value: n.MACOS,
+      value: i.MACOS,
       useCases: [
         "Desktop-like applications",
         "macOS-inspired user interfaces",
@@ -131,7 +131,7 @@ const q = () => {
       description: "macOS Tahoe (macOS 26) layout with Liquid Glass aesthetics, translucent sidebar and refined toolbar. The most modern desktop-inspired layout.",
       icon: /* @__PURE__ */ e(b, { className: "w-8 h-8 text-white filter drop-shadow-sm" }),
       color: "from-indigo-500 via-purple-500 to-pink-500",
-      value: n.MACOS_TAHOE,
+      value: i.MACOS_TAHOE,
       useCases: [
         "Modern desktop applications",
         "Liquid Glass UI experiences",
@@ -161,7 +161,7 @@ const q = () => {
       description: "macOS Tahoe dock-based layout with floating app dock at the bottom and maximized content area. Best for full-screen and immersive experiences.",
       icon: /* @__PURE__ */ e(f, { className: "w-8 h-8 text-white filter drop-shadow-sm" }),
       color: "from-violet-500 via-fuchsia-500 to-pink-500",
-      value: n.MACOS_TAHOE_DOCK,
+      value: i.MACOS_TAHOE_DOCK,
       useCases: [
         "Full-screen applications",
         "Media and entertainment apps",
@@ -189,9 +189,9 @@ const q = () => {
     {
       name: "macOS Sonoma Clean Layout",
       description: "Minimal Sonoma layout with only background and content, no sidebar or toolbar. Inherits Sonoma visual styling without navigation chrome.",
-      icon: /* @__PURE__ */ e(x, { className: "w-8 h-8 text-white filter drop-shadow-sm" }),
+      icon: /* @__PURE__ */ e(y, { className: "w-8 h-8 text-white filter drop-shadow-sm" }),
       color: "from-slate-400 via-gray-400 to-zinc-400",
-      value: n.MACOS_CLEAN,
+      value: i.MACOS_CLEAN,
       useCases: [
         "Authentication pages within Sonoma theme",
         "Landing pages with macOS aesthetics",
@@ -219,9 +219,9 @@ const q = () => {
     {
       name: "macOS Tahoe Clean Layout",
       description: "Minimal Tahoe layout with only Liquid Glass background and content area. Perfect for standalone views that need Tahoe visual identity without navigation.",
-      icon: /* @__PURE__ */ e(y, { className: "w-8 h-8 text-white filter drop-shadow-sm" }),
+      icon: /* @__PURE__ */ e(x, { className: "w-8 h-8 text-white filter drop-shadow-sm" }),
       color: "from-purple-400 via-violet-400 to-indigo-400",
-      value: n.MACOS_TAHOE_CLEAN,
+      value: i.MACOS_TAHOE_CLEAN,
       useCases: [
         "Authentication pages within Tahoe theme",
         "Full-screen content experiences",
@@ -245,6 +245,66 @@ const q = () => {
         dependencies: "No navigation components required",
         useWhen: "Auth pages, standalone content within Tahoe theme"
       }
+    },
+    {
+      name: "macOS Sonoma Navbar Layout",
+      description: "macOS Sonoma layout with horizontal top navigation bar instead of sidebar, providing a streamlined navigation experience.",
+      icon: /* @__PURE__ */ e(S, { className: "w-8 h-8 text-white filter drop-shadow-sm" }),
+      color: "from-gray-500 via-slate-400 to-zinc-500",
+      value: i.MACOS_NAVBAR,
+      useCases: [
+        "Content-focused macOS-style apps",
+        "Documentation sites with macOS aesthetics",
+        "Applications preferring horizontal navigation",
+        "Portfolio and showcase sites with Sonoma theme",
+        "Simple apps without sidebar complexity",
+        "Landing pages with macOS visual identity"
+      ],
+      features: [
+        "Top horizontal navigation bar",
+        "Sonoma visual styling and effects",
+        "No sidebar — navbar-only navigation",
+        "Responsive layout adapts to screen size",
+        "Background effects from Sonoma theme",
+        "Seamless transition to/from Sonoma layouts",
+        "AccentBundles support (9 color presets)"
+      ],
+      technical: {
+        component: 'MacOSNavbarLayout or MacOSLayout variant="sonoma-navbar"',
+        navbar: "Horizontal top navigation with Sonoma styling",
+        content: "Full-width content area without sidebar",
+        navigation: "Navbar items act as primary navigation"
+      }
+    },
+    {
+      name: "macOS Tahoe Navbar Layout",
+      description: "macOS Tahoe layout with horizontal top navigation bar combining Liquid Glass aesthetics with streamlined navigation.",
+      icon: /* @__PURE__ */ e(N, { className: "w-8 h-8 text-white filter drop-shadow-sm" }),
+      color: "from-indigo-400 via-violet-500 to-purple-500",
+      value: i.MACOS_TAHOE_NAVBAR,
+      useCases: [
+        "Content-focused Tahoe-style apps",
+        "Modern desktop applications preferring horizontal nav",
+        "Portfolio and showcase sites",
+        "Applications with few top-level sections",
+        "Documentation and knowledge bases",
+        "Creative tools with immersive content areas"
+      ],
+      features: [
+        "Liquid Glass top navigation bar",
+        "Tahoe visual styling and effects",
+        "No sidebar or dock — navbar-only navigation",
+        "Dynamic mesh backgrounds",
+        "Full-width content area",
+        "Seamless transition to/from Tahoe layouts",
+        "Accent color bundles support"
+      ],
+      technical: {
+        component: 'MacOSTahoeNavbarLayout or MacOSLayout variant="tahoe-navbar"',
+        navbar: "Liquid Glass horizontal navigation bar",
+        content: "Full viewport content area without sidebar or dock",
+        navigation: "Navbar items act as primary navigation"
+      }
     }
   ];
   return /* @__PURE__ */ a(d, { children: [
@@ -252,8 +312,8 @@ const q = () => {
       m,
       {
         title: "Layout Types",
-        description: "Eight layout patterns spanning classic admin panels, modern horizontal menus, and macOS-inspired desktop experiences with Sonoma and Tahoe aesthetics.",
-        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-500 via-teal-500 to-emerald-500 rounded-full flex items-center justify-center shadow-lg", children: /* @__PURE__ */ e(N, { className: "w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg" }) })
+        description: "Ten layout patterns spanning classic admin panels, modern horizontal menus, and macOS-inspired desktop experiences with Sonoma and Tahoe aesthetics.",
+        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-500 via-teal-500 to-emerald-500 rounded-full flex items-center justify-center shadow-lg", children: /* @__PURE__ */ e(k, { className: "w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg" }) })
       }
     ),
     /* @__PURE__ */ a("div", { className: "text-center", children: [
@@ -263,11 +323,11 @@ const q = () => {
         {
           tag: "p",
           className: "text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",
-          children: "Eight layout patterns for every use case — from classic admin panels to macOS-inspired desktop experiences with Liquid Glass aesthetics."
+          children: "Ten layout patterns for every use case — from classic admin panels to macOS-inspired desktop experiences with Liquid Glass aesthetics."
         }
       )
     ] }),
-    /* @__PURE__ */ e("div", { className: "space-y-8", children: r.map((i, l) => /* @__PURE__ */ e(
+    /* @__PURE__ */ e("div", { className: "space-y-8", children: r.map((o, l) => /* @__PURE__ */ e(
       p,
       {
         className: "group hover:shadow-large transition-all duration-300 overflow-hidden",
@@ -276,8 +336,8 @@ const q = () => {
             /* @__PURE__ */ e(
               "div",
               {
-                className: `p-3 rounded-xl bg-linear-to-br ${i.color} group-hover:scale-110 transition-all duration-300 shadow-lg shrink-0`,
-                children: i.icon
+                className: `p-3 rounded-xl bg-linear-to-br ${o.color} group-hover:scale-110 transition-all duration-300 shadow-lg shrink-0`,
+                children: o.icon
               }
             ),
             /* @__PURE__ */ a("div", { className: "flex-1", children: [
@@ -287,38 +347,38 @@ const q = () => {
                   {
                     tag: "h3",
                     className: "font-semibold text-lg group-hover:text-primary transition-colors duration-300",
-                    children: i.name
+                    children: o.name
                   }
                 ),
-                /* @__PURE__ */ e(h, { variant: "outline", className: "text-xs", children: i.value })
+                /* @__PURE__ */ e(h, { variant: "outline", className: "text-xs", children: o.value })
               ] }),
               /* @__PURE__ */ e(
                 t,
                 {
                   tag: "p",
                   className: "text-gray-600 dark:text-gray-400 leading-relaxed",
-                  children: i.description
+                  children: o.description
                 }
               )
             ] })
           ] }),
           /* @__PURE__ */ a("div", { className: "space-y-3", children: [
             /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ e(S, { className: "w-5 h-5 text-primary" }),
+              /* @__PURE__ */ e(O, { className: "w-5 h-5 text-primary" }),
               /* @__PURE__ */ e(t, { tag: "h4", className: "font-semibold text-base", children: "When to Use" })
             ] }),
-            /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-2", children: i.useCases.map((o, s) => /* @__PURE__ */ a(
+            /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-2", children: o.useCases.map((n, s) => /* @__PURE__ */ a(
               "div",
               {
                 className: "flex items-start gap-2 p-2 bg-gray-100 dark:bg-gray-800 rounded-lg",
                 children: [
-                  /* @__PURE__ */ e(k, { className: "w-3 h-3 text-primary mt-1 shrink-0" }),
+                  /* @__PURE__ */ e(L, { className: "w-3 h-3 text-primary mt-1 shrink-0" }),
                   /* @__PURE__ */ e(
                     t,
                     {
                       tag: "span",
                       className: "text-sm text-gray-700 dark:text-gray-300",
-                      children: o
+                      children: n
                     }
                   )
                 ]
@@ -328,28 +388,28 @@ const q = () => {
           ] }),
           /* @__PURE__ */ a("div", { className: "space-y-3", children: [
             /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ e(L, { className: "w-5 h-5 text-primary" }),
+              /* @__PURE__ */ e(T, { className: "w-5 h-5 text-primary" }),
               /* @__PURE__ */ e(t, { tag: "h4", className: "font-semibold text-base", children: "Features" })
             ] }),
-            /* @__PURE__ */ e("div", { className: "space-y-2", children: i.features.map((o, s) => /* @__PURE__ */ a("div", { className: "flex items-start gap-2", children: [
-              /* @__PURE__ */ e(O, { className: "w-4 h-4 text-green-500 shrink-0 mt-0.5" }),
+            /* @__PURE__ */ e("div", { className: "space-y-2", children: o.features.map((n, s) => /* @__PURE__ */ a("div", { className: "flex items-start gap-2", children: [
+              /* @__PURE__ */ e(C, { className: "w-4 h-4 text-green-500 shrink-0 mt-0.5" }),
               /* @__PURE__ */ e(
                 t,
                 {
                   tag: "span",
                   className: "text-sm text-gray-600 dark:text-gray-400",
-                  children: o
+                  children: n
                 }
               )
             ] }, s)) })
           ] }),
           /* @__PURE__ */ a("div", { className: "space-y-3 pt-3 border-t border-border", children: [
             /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ e(C, { className: "w-5 h-5 text-primary" }),
+              /* @__PURE__ */ e(A, { className: "w-5 h-5 text-primary" }),
               /* @__PURE__ */ e(t, { tag: "h4", className: "font-semibold text-base", children: "Technical Details" })
             ] }),
-            /* @__PURE__ */ e("div", { className: "space-y-2", children: Object.entries(i.technical).map(
-              ([o, s], c) => /* @__PURE__ */ a(
+            /* @__PURE__ */ e("div", { className: "space-y-2", children: Object.entries(o.technical).map(
+              ([n, s], c) => /* @__PURE__ */ a(
                 "div",
                 {
                   className: "flex items-start gap-2 text-sm",
@@ -360,7 +420,7 @@ const q = () => {
                         tag: "span",
                         className: "font-medium text-gray-700 dark:text-gray-300 capitalize min-w-25",
                         children: [
-                          o.replace(/([A-Z])/g, " $1").trim(),
+                          n.replace(/([A-Z])/g, " $1").trim(),
                           ":"
                         ]
                       }
@@ -386,5 +446,5 @@ const q = () => {
   ] });
 };
 export {
-  q as default
+  B as default
 };

package/documentation/{LineChartSection-HJuiXWwE.js → LineChartSection-BD-gRg7P.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-DMs_SmPq.js");require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=[{name:"Jan",revenue:4e3,expenses:2400,profit:1600},{name:"Feb",revenue:3e3,expenses:1398,profit:1602},{name:"Mar",revenue:5e3,expenses:3200,profit:1800},{name:"Apr",revenue:4780,expenses:2908,profit:1872},{name:"May",revenue:5890,expenses:4800,profit:1090},{name:"Jun",revenue:6390,expenses:3800,profit:2590},{name:"Jul",revenue:7490,expenses:4300,profit:3190}],n=()=>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:"LineChart"}),e.jsx(a.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"Line chart component for displaying trends and time-series data with multiple series, custom curves, and theme integration."})]}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Basic Line Chart",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.LineChart,{data:s,series:[{dataKey:"revenue",name:"Revenue"},{dataKey:"expenses",name:"Expenses"}],height:300})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Multiple Series with Dots",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.LineChart,{data:s,series:[{dataKey:"revenue",name:"Revenue"},{dataKey:"expenses",name:"Expenses"},{dataKey:"profit",name:"Profit"}],showDots:!0,height:300})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Straight Lines (No Curve)",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.LineChart,{data:s,series:[{dataKey:"revenue",name:"Revenue"},{dataKey:"profit",name:"Profit"}],curved:!1,strokeWidth:3,height:300})})})}),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 { LineChart } from '@e-burgos/tucu-ui';
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-DEZRGktf.js");require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=[{name:"Jan",revenue:4e3,expenses:2400,profit:1600},{name:"Feb",revenue:3e3,expenses:1398,profit:1602},{name:"Mar",revenue:5e3,expenses:3200,profit:1800},{name:"Apr",revenue:4780,expenses:2908,profit:1872},{name:"May",revenue:5890,expenses:4800,profit:1090},{name:"Jun",revenue:6390,expenses:3800,profit:2590},{name:"Jul",revenue:7490,expenses:4300,profit:3190}],n=()=>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:"LineChart"}),e.jsx(a.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"Line chart component for displaying trends and time-series data with multiple series, custom curves, and theme integration."})]}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Basic Line Chart",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.LineChart,{data:s,series:[{dataKey:"revenue",name:"Revenue"},{dataKey:"expenses",name:"Expenses"}],height:300})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Multiple Series with Dots",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.LineChart,{data:s,series:[{dataKey:"revenue",name:"Revenue"},{dataKey:"expenses",name:"Expenses"},{dataKey:"profit",name:"Profit"}],showDots:!0,height:300})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Straight Lines (No Curve)",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.LineChart,{data:s,series:[{dataKey:"revenue",name:"Revenue"},{dataKey:"profit",name:"Profit"}],curved:!1,strokeWidth:3,height:300})})})}),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 { LineChart } from '@e-burgos/tucu-ui';
 
 const data = [
   { name: 'Jan', revenue: 4000, expenses: 2400 },

package/documentation/{LineChartSection-CzARfWf9.js → LineChartSection-vBfTY7os.js}

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

package/documentation/{ListContainerSection-Ca8Y_cJJ.js → ListContainerSection-BRYroZcs.js}

@@ -1,6 +1,6 @@
 import { jsxs as i, Fragment as m, jsx as e } from "react/jsx-runtime";
 import { useState as d } from "react";
-import { H as h, C as o, a, T as n, ab as s, P as p, A as g, c as C } from "../index-19KsCnyX.js";
+import { H as h, C as o, a, T as n, ab as s, P as p, A as g, c as C } from "../index-sdOMz8GW.js";
 import { List as N, Activity as u, Edit as f, Trash as b, Share as w } from "lucide-react";
 import "react-router-dom";
 import "react-dom";
@@ -84,18 +84,33 @@ const E = () => {
           isOpen: !0,
           keepOpen: !1
         },
-        excludeProps: ["items", "onOpenChange", "triggerIcon", "className", "dropdownClassName"],
+        excludeProps: [
+          "items",
+          "onOpenChange",
+          "triggerIcon",
+          "className",
+          "dropdownClassName"
+        ],
         children: (c) => /* @__PURE__ */ e(
           s,
           {
             ...c,
             items: [
-              { label: "Option 1", onClick: () => {
-              } },
-              { label: "Option 2", onClick: () => {
-              } },
-              { label: "Option 3", onClick: () => {
-              } }
+              {
+                label: "Option 1",
+                onClick: () => {
+                }
+              },
+              {
+                label: "Option 2",
+                onClick: () => {
+                }
+              },
+              {
+                label: "Option 3",
+                onClick: () => {
+                }
+              }
             ]
           }
         )

package/documentation/{ListContainerSection-CkEy8kTD.js → ListContainerSection-CZRk2YlI.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),i=require("../index-DMs_SmPq.js"),t=require("lucide-react");require("react-router-dom");require("react-dom");const l=()=>{const[n,o]=r.useState(!1),s=[{id:"1",label:"Edit",icon:e.jsx(t.Edit,{className:"w-4 h-4"}),onClick:()=>console.log("Edit clicked")},{id:"2",label:"Delete",icon:e.jsx(t.Trash,{className:"w-4 h-4"}),onClick:()=>console.log("Delete clicked")},{id:"3",label:"Share",icon:e.jsx(t.Share,{className:"w-4 h-4"}),onClick:()=>console.log("Share clicked")}];return e.jsxs(e.Fragment,{children:[e.jsx(i.HeroCard,{title:"ListContainer",description:`A dropdown container component for displaying lists of items with
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),i=require("../index-DEZRGktf.js"),t=require("lucide-react");require("react-router-dom");require("react-dom");const l=()=>{const[n,o]=r.useState(!1),s=[{id:"1",label:"Edit",icon:e.jsx(t.Edit,{className:"w-4 h-4"}),onClick:()=>console.log("Edit clicked")},{id:"2",label:"Delete",icon:e.jsx(t.Trash,{className:"w-4 h-4"}),onClick:()=>console.log("Delete clicked")},{id:"3",label:"Share",icon:e.jsx(t.Share,{className:"w-4 h-4"}),onClick:()=>console.log("Share clicked")}];return e.jsxs(e.Fragment,{children:[e.jsx(i.HeroCard,{title:"ListContainer",description:`A dropdown container component for displaying lists of items with
           customizable trigger and positioning.`,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-green-500 to-emerald-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(t.List,{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(i.CardContainer,{className:"overflow-hidden",children:e.jsx(i.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(i.CardContainer,{className:"p-4",children:[e.jsx(i.Typography,{tag:"h5",className:"mb-3",children:"Hover Trigger"}),e.jsx(i.ListContainer,{items:s,trigger:"hover"})]}),e.jsxs(i.CardContainer,{className:"p-4",children:[e.jsx(i.Typography,{tag:"h5",className:"mb-3",children:"Click Trigger"}),e.jsx(i.ListContainer,{items:s,trigger:"click",isOpen:n,onOpenChange:o})]}),e.jsxs(i.CardContainer,{className:"p-4",children:[e.jsx(i.Typography,{tag:"h5",className:"mb-3",children:"With Custom Icon"}),e.jsx(i.ListContainer,{items:s,triggerIcon:e.jsx(t.Activity,{className:"w-4! h-4!"})})]}),e.jsxs(i.CardContainer,{className:"p-4",children:[e.jsx(i.Typography,{tag:"h5",className:"mb-3",children:"Different Positions"}),e.jsxs("div",{className:"flex gap-4",children:[e.jsx(i.ListContainer,{items:s,position:"top"}),e.jsx(i.ListContainer,{items:s,position:"right"}),e.jsx(i.ListContainer,{items:s,position:"left"})]})]})]})})})}),e.jsx(i.PropPlayground,{componentName:"ListContainer",title:"ListContainer Playground",defaultValues:{label:"Select an option",position:"bottom",align:"start",trigger:"click",isOpen:!0,keepOpen:!1},excludeProps:["items","onOpenChange","triggerIcon","className","dropdownClassName"],children:a=>e.jsx(i.ListContainer,{...a,items:[{label:"Option 1",onClick:()=>{}},{label:"Option 2",onClick:()=>{}},{label:"Option 3",onClick:()=>{}}]})}),e.jsx(i.AutoPropsTable,{componentName:"ListContainer"}),e.jsx(i.CardContainer,{className:"overflow-hidden",children:e.jsx(i.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(i.CodeBlock,{language:"tsx",code:`import { ListContainer, ListItem, LucideIcons } from '@e-burgos/tucu-ui';
 
 const items = [

package/documentation/{ListItemSection-CrUwVDa7.js → ListItemSection-CkDB2F-d.js}

@@ -1,5 +1,5 @@
 import { jsxs as a, Fragment as m, jsx as e } from "react/jsx-runtime";
-import { H as d, C as l, a as t, T as i, ac as s, P as n, A as o, c as r } from "../index-19KsCnyX.js";
+import { H as d, C as l, a as t, T as i, ac as s, P as n, A as o, c as r } from "../index-sdOMz8GW.js";
 import { ListMinus as h, Home as p, Settings as u, User as b, Star as N } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{ListItemSection-C57wh8xh.js → ListItemSection-Cqk5vWav.js}

@@ -1,4 +1,4 @@
-"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 a=()=>e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"ListItem",description:`A list item component for displaying items in dropdowns and menus with
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-DEZRGktf.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const a=()=>e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"ListItem",description:`A list item component for displaying items in dropdowns and menus with
           support for icons, labels, and custom 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-emerald-500 to-green-600 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(t.ListMinus,{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 List Items"}),e.jsxs("ul",{className:"space-y-1",children:[e.jsx(s.ListItem,{id:"1",label:"Item 1"}),e.jsx(s.ListItem,{id:"2",label:"Item 2"}),e.jsx(s.ListItem,{id:"3",label:"Item 3"})]})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"With Icons"}),e.jsxs("ul",{className:"space-y-1",children:[e.jsx(s.ListItem,{id:"1",label:"Home",icon:e.jsx(t.Home,{className:"w-4 h-4"})}),e.jsx(s.ListItem,{id:"2",label:"Settings",icon:e.jsx(t.Settings,{className:"w-4 h-4"})}),e.jsx(s.ListItem,{id:"3",label:"Profile",icon:e.jsx(t.User,{className:"w-4 h-4"})})]})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"States"}),e.jsxs("ul",{className:"space-y-1",children:[e.jsx(s.ListItem,{id:"1",label:"Active Item",active:!0}),e.jsx(s.ListItem,{id:"2",label:"Normal Item"}),e.jsx(s.ListItem,{id:"3",label:"Disabled Item",disabled:!0})]})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"With Custom Content"}),e.jsx("ul",{className:"space-y-1",children:e.jsx(s.ListItem,{id:"1",content:e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(t.Star,{className:"w-4 h-4"}),e.jsx("span",{children:"Custom Content"})]})})})]})]})})})}),e.jsx(s.PropPlayground,{componentName:"ListItem",defaultValues:{label:"List Item",active:!1,disabled:!1},excludeProps:["onClick","content","icon","id"],children:i=>e.jsx(s.ListItem,{...i})}),e.jsx(s.AutoPropsTable,{componentName:"ListItem"}),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 { ListItem, LucideIcons } from '@e-burgos/tucu-ui';
 
 // Basic usage

package/documentation/{LiveDemoSection-Di6_Ljzt.js → LiveDemoSection-DoAzFVlP.js}

@@ -1,5 +1,5 @@
 import { jsxs as a, Fragment as s, jsx as e } from "react/jsx-runtime";
-import { H as m, T as t, C as n, x as r, a9 as i } from "../index-19KsCnyX.js";
+import { H as m, T as t, C as n, x as r, a9 as i } from "../index-sdOMz8GW.js";
 import { Play as l, ExternalLink as d, Code as c } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{LiveDemoSection-C6YvjWGX.js → LiveDemoSection-mmMg2Dho.js}

@@ -1 +1 @@
-"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 r=()=>e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Live Demo Form",description:"See the form system in action with a fully functional interactive example featuring validation, error states, and submission handling.",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-teal-500 to-cyan-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(s.Play,{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:"Interactive Example"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Navigate to the full form example to interact with all input types, validation modes, and form methods"})]}),e.jsx(a.CardContainer,{children:e.jsx("div",{className:"w-full p-6 sm:p-8 space-y-6",children:e.jsxs("div",{className:"flex flex-col items-center text-center space-y-4",children:[e.jsx("div",{className:"p-4 rounded-full bg-green-50 dark:bg-green-900/20 border border-green-200 dark:border-green-800",children:e.jsx(s.ExternalLink,{className:"w-8 h-8 text-white"})}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(a.Typography,{tag:"h3",className:"font-semibold text-lg",children:"Form Example Page"}),e.jsx(a.Typography,{tag:"p",className:"text-sm text-gray-500 dark:text-gray-400 max-w-md",children:"A complete form with all available input types, centralized validation, real-time error feedback, and submission handling."})]}),e.jsxs("div",{className:"flex gap-3",children:[e.jsx(a.Button,{size:"medium",children:e.jsx(a.AnchorLink,{to:"/form-system/example",children:e.jsxs("span",{className:"flex items-center gap-2",children:[e.jsx(s.Play,{className:"w-4 h-4"}),"Open Form Example"]})})}),e.jsx(a.Button,{size:"medium",variant:"ghost",children:e.jsx(a.AnchorLink,{to:"/form-system/code-example",children:e.jsxs("span",{className:"flex items-center gap-2",children:[e.jsx(s.Code,{className:"w-4 h-4"}),"View Source Code"]})})})]})]})})})]})]});exports.default=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-DEZRGktf.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const r=()=>e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Live Demo Form",description:"See the form system in action with a fully functional interactive example featuring validation, error states, and submission handling.",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-teal-500 to-cyan-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(s.Play,{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:"Interactive Example"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Navigate to the full form example to interact with all input types, validation modes, and form methods"})]}),e.jsx(a.CardContainer,{children:e.jsx("div",{className:"w-full p-6 sm:p-8 space-y-6",children:e.jsxs("div",{className:"flex flex-col items-center text-center space-y-4",children:[e.jsx("div",{className:"p-4 rounded-full bg-green-50 dark:bg-green-900/20 border border-green-200 dark:border-green-800",children:e.jsx(s.ExternalLink,{className:"w-8 h-8 text-white"})}),e.jsxs("div",{className:"space-y-2",children:[e.jsx(a.Typography,{tag:"h3",className:"font-semibold text-lg",children:"Form Example Page"}),e.jsx(a.Typography,{tag:"p",className:"text-sm text-gray-500 dark:text-gray-400 max-w-md",children:"A complete form with all available input types, centralized validation, real-time error feedback, and submission handling."})]}),e.jsxs("div",{className:"flex gap-3",children:[e.jsx(a.Button,{size:"medium",children:e.jsx(a.AnchorLink,{to:"/form-system/example",children:e.jsxs("span",{className:"flex items-center gap-2",children:[e.jsx(s.Play,{className:"w-4 h-4"}),"Open Form Example"]})})}),e.jsx(a.Button,{size:"medium",variant:"ghost",children:e.jsx(a.AnchorLink,{to:"/form-system/code-example",children:e.jsxs("span",{className:"flex items-center gap-2",children:[e.jsx(s.Code,{className:"w-4 h-4"}),"View Source Code"]})})})]})]})})})]})]});exports.default=r;

package/documentation/{LiveDemonstrationsSection-D7NGWZ3I.js → LiveDemonstrationsSection-BvsFlesQ.js}

@@ -1,6 +1,6 @@
 import { jsxs as a, Fragment as K, jsx as e } from "react/jsx-runtime";
 import { useState as d, useRef as X, useEffect as Y } from "react";
-import { aD as Z, aE as q, aF as J, al as _, aG as Q, aH as V, aI as ee, aJ as ae, aK as se, aL as te, aM as re, aN as le, aO as de, H as ie, T as s, C as i, K as l, c, x as r } from "../index-19KsCnyX.js";
+import { aD as Z, aE as q, aF as J, al as _, aG as Q, aH as V, aI as ee, aJ as ae, aK as se, aL as te, aM as re, aN as le, aO as de, H as ie, T as s, C as i, K as l, c, x as r } from "../index-sdOMz8GW.js";
 import { Play as oe, Monitor as ce, Ruler as ne, MousePointer as me, ChevronDown as he, Copy as ge, Settings as ue, LayoutGrid as pe, Zap as be, ChevronLeft as xe, ChevronRight as Ne, Lock as fe, X as we } from "lucide-react";
 import "react-router-dom";
 import "react-dom";

package/documentation/{LiveDemonstrationsSection-Dby6VHKw.js → LiveDemonstrationsSection-Dg4rzCys.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),s=require("../index-DMs_SmPq.js"),t=require("lucide-react");require("react-router-dom");require("react-dom");const O=()=>{const[o,N]=r.useState("Hello, World!"),[d,i]=r.useState(!1),[m,x]=r.useState(!1),[f,g]=r.useState(""),[w,p]=r.useState("Checking..."),k=s.useBreakpoint(),{isMobile:v}=s.useIsMobile(),[u,T]=s.useCopyToClipboard(),{addToast:n}=s.useToastStore(),{isGridCompact:c,setIsGridCompact:C}=s.useGridSwitcher(),{x:S,y:M}=s.useWindowScroll(),y=s.useIsMounted(),b=r.useRef(null),[B,{width:E,height:R}]=s.useElementSize(),[I,j]=s.useMeasure(),{sliderEl:L,sliderPrevBtn:z,sliderNextBtn:G,scrollToTheRight:D,scrollToTheLeft:W}=s.useScrollableSlider("/");s.useLockBodyScroll(d),s.useClickAway(b,()=>{x(!1)}),s.useEventListener("keydown",a=>{g(a.key),setTimeout(()=>g(""),1e3)}),r.useEffect(()=>{p(y?"Component is mounted":"Component is not mounted")},[y]);const $=()=>{T(o),n({id:`copy-${Date.now()}`,title:"Copied!",message:`Copied "${o}" to clipboard`,variant:"success"})},q=()=>{const a=!c;C(a),n({id:`layout-${Date.now()}`,title:"Layout Changed",message:`Switched to ${a?"Compact":"Normal"} layout`,variant:"info"})},l=(a="success")=>{n({id:`toast-${Date.now()}`,title:"Test Toast",message:`This is a ${a} toast notification`,variant:a,timeout:3e3})},A=Array.from({length:10},(a,h)=>({id:h+1,title:`Item ${h+1}`,content:`Content for item ${h+1}`}));return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Live Hook Demonstrations",description:"Interactive examples showing every hook in action. Resize the window, click buttons, and interact with the demos to see real-time hook behavior.",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.Play,{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:"Responsive Detection"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Real-time breakpoint detection and mobile state tracking"})]}),e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full space-y-6 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-blue-500 to-cyan-500 shadow-lg",children:e.jsx(t.Monitor,{className:"w-6 h-6 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h3",className:"text-base font-semibold",children:"useBreakpoint & useIsMobile"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-6",children:[e.jsxs("div",{className:"bg-white dark:bg-gray-800 p-4 rounded-lg border",children:[e.jsx(s.Typography,{tag:"h5",className:"font-medium mb-3",children:"useBreakpoint"}),e.jsxs("div",{className:"space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"text-sm text-gray-600 dark:text-gray-400",children:"Current:"}),e.jsx(s.Badge,{className:"text-dark dark:text-white",children:k})]}),e.jsx(s.Typography,{tag:"p",className:"text-xs text-gray-500",children:"Resize your window to see changes"})]})]}),e.jsxs("div",{className:"bg-white dark:bg-gray-800 p-4 rounded-lg border",children:[e.jsx(s.Typography,{tag:"h5",className:"font-medium mb-3",children:"useIsMobile"}),e.jsxs("div",{className:"space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"text-sm text-gray-600 dark:text-gray-400",children:"Is Mobile:"}),e.jsx(s.Badge,{className:"text-dark dark:text-white",children:v?"Yes":"No"})]}),e.jsx(s.Typography,{tag:"p",className:"text-xs text-gray-500",children:"True for xs, sm, md breakpoints (≤768px)"})]})]})]}),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:`const breakpoint = useBreakpoint();
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),s=require("../index-DEZRGktf.js"),t=require("lucide-react");require("react-router-dom");require("react-dom");const O=()=>{const[o,N]=r.useState("Hello, World!"),[d,i]=r.useState(!1),[m,x]=r.useState(!1),[f,g]=r.useState(""),[w,p]=r.useState("Checking..."),k=s.useBreakpoint(),{isMobile:v}=s.useIsMobile(),[u,T]=s.useCopyToClipboard(),{addToast:n}=s.useToastStore(),{isGridCompact:c,setIsGridCompact:C}=s.useGridSwitcher(),{x:S,y:M}=s.useWindowScroll(),y=s.useIsMounted(),b=r.useRef(null),[B,{width:E,height:R}]=s.useElementSize(),[I,j]=s.useMeasure(),{sliderEl:L,sliderPrevBtn:z,sliderNextBtn:G,scrollToTheRight:D,scrollToTheLeft:W}=s.useScrollableSlider("/");s.useLockBodyScroll(d),s.useClickAway(b,()=>{x(!1)}),s.useEventListener("keydown",a=>{g(a.key),setTimeout(()=>g(""),1e3)}),r.useEffect(()=>{p(y?"Component is mounted":"Component is not mounted")},[y]);const $=()=>{T(o),n({id:`copy-${Date.now()}`,title:"Copied!",message:`Copied "${o}" to clipboard`,variant:"success"})},q=()=>{const a=!c;C(a),n({id:`layout-${Date.now()}`,title:"Layout Changed",message:`Switched to ${a?"Compact":"Normal"} layout`,variant:"info"})},l=(a="success")=>{n({id:`toast-${Date.now()}`,title:"Test Toast",message:`This is a ${a} toast notification`,variant:a,timeout:3e3})},A=Array.from({length:10},(a,h)=>({id:h+1,title:`Item ${h+1}`,content:`Content for item ${h+1}`}));return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Live Hook Demonstrations",description:"Interactive examples showing every hook in action. Resize the window, click buttons, and interact with the demos to see real-time hook behavior.",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.Play,{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:"Responsive Detection"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Real-time breakpoint detection and mobile state tracking"})]}),e.jsx(s.CardContainer,{children:e.jsxs("div",{className:"w-full space-y-6 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-blue-500 to-cyan-500 shadow-lg",children:e.jsx(t.Monitor,{className:"w-6 h-6 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h3",className:"text-base font-semibold",children:"useBreakpoint & useIsMobile"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-6",children:[e.jsxs("div",{className:"bg-white dark:bg-gray-800 p-4 rounded-lg border",children:[e.jsx(s.Typography,{tag:"h5",className:"font-medium mb-3",children:"useBreakpoint"}),e.jsxs("div",{className:"space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"text-sm text-gray-600 dark:text-gray-400",children:"Current:"}),e.jsx(s.Badge,{className:"text-dark dark:text-white",children:k})]}),e.jsx(s.Typography,{tag:"p",className:"text-xs text-gray-500",children:"Resize your window to see changes"})]})]}),e.jsxs("div",{className:"bg-white dark:bg-gray-800 p-4 rounded-lg border",children:[e.jsx(s.Typography,{tag:"h5",className:"font-medium mb-3",children:"useIsMobile"}),e.jsxs("div",{className:"space-y-2",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("span",{className:"text-sm text-gray-600 dark:text-gray-400",children:"Is Mobile:"}),e.jsx(s.Badge,{className:"text-dark dark:text-white",children:v?"Yes":"No"})]}),e.jsx(s.Typography,{tag:"p",className:"text-xs text-gray-500",children:"True for xs, sm, md breakpoints (≤768px)"})]})]})]}),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:`const breakpoint = useBreakpoint();
 // Returns: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl'
 
 const { isMobile } = useIsMobile();

package/documentation/{LivePriceFeedSection-B_GgiNK8.js → LivePriceFeedSection-BKDFj31H.js}

@@ -1,5 +1,5 @@
 import { jsxs as a, Fragment as t, jsx as e } from "react/jsx-runtime";
-import { H as m, C as i, a as r, T as c, L as n, B as l, E as d, P as h, A as u, c as p } from "../index-19KsCnyX.js";
+import { H as m, C as i, a as r, T as c, L as n, B as l, E as d, P as h, A as u, c as p } from "../index-sdOMz8GW.js";
 import { TrendingUp as v } from "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/{LivePriceFeedSection-BGUKPNUb.js → LivePriceFeedSection-C_6AOF62.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-DMs_SmPq.js"),n=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const r=()=>{const i=[{name:1,value:45e3},{name:2,value:45200},{name:3,value:44800},{name:4,value:45100},{name:5,value:45300}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"LivePriceFeed",description:"Real-time price display with integrated chart visualization for cryptocurrency price tracking.",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(n.TrendingUp,{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:"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:"With Chart"}),e.jsx(a.LivePriceFeed,{id:"bitcoin",name:"Bitcoin",symbol:"BTC",icon:e.jsx(a.Bitcoin,{className:"w-6 h-6"}),balance:"1.25",usdBalance:"45,000",change:"+2.5%",isChangePositive:!0,prices:i})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Negative Change"}),e.jsx(a.LivePriceFeed,{id:"ethereum",name:"Ethereum",symbol:"ETH",icon:e.jsx(a.Ethereum,{className:"w-6 h-6"}),balance:"5.5",usdBalance:"16,500",change:"-1.8%",isChangePositive:!1,prices:[{name:1,value:3e3},{name:2,value:2950},{name:3,value:2980},{name:4,value:2920},{name:5,value:2900}]})]})]})})})}),e.jsx(a.PropPlayground,{componentName:"LivePriceFeed",defaultValues:{id:"bitcoin",name:"Bitcoin",symbol:"BTC",balance:"1.25",usdBalance:"45,000",change:"+2.5%",isChangePositive:!0,isBorder:!1},controlOverrides:[{name:"isChangePositive",type:"boolean",description:"Whether the price change is positive"},{name:"isBorder",type:"boolean",description:"Show border around the component"}],includeProps:["id","name","symbol","balance","usdBalance","change","isChangePositive","isBorder"],children:s=>e.jsx("div",{className:"w-full",children:e.jsx(a.LivePriceFeed,{...s,icon:e.jsx(a.Bitcoin,{className:"w-6 h-6"}),prices:i})})}),e.jsx(a.AutoPropsTable,{componentName:"LivePriceFeed"}),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 { LivePriceFeed } from '@e-burgos/tucu-ui';
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-DEZRGktf.js"),n=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const r=()=>{const i=[{name:1,value:45e3},{name:2,value:45200},{name:3,value:44800},{name:4,value:45100},{name:5,value:45300}];return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"LivePriceFeed",description:"Real-time price display with integrated chart visualization for cryptocurrency price tracking.",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(n.TrendingUp,{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:"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:"With Chart"}),e.jsx(a.LivePriceFeed,{id:"bitcoin",name:"Bitcoin",symbol:"BTC",icon:e.jsx(a.Bitcoin,{className:"w-6 h-6"}),balance:"1.25",usdBalance:"45,000",change:"+2.5%",isChangePositive:!0,prices:i})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Negative Change"}),e.jsx(a.LivePriceFeed,{id:"ethereum",name:"Ethereum",symbol:"ETH",icon:e.jsx(a.Ethereum,{className:"w-6 h-6"}),balance:"5.5",usdBalance:"16,500",change:"-1.8%",isChangePositive:!1,prices:[{name:1,value:3e3},{name:2,value:2950},{name:3,value:2980},{name:4,value:2920},{name:5,value:2900}]})]})]})})})}),e.jsx(a.PropPlayground,{componentName:"LivePriceFeed",defaultValues:{id:"bitcoin",name:"Bitcoin",symbol:"BTC",balance:"1.25",usdBalance:"45,000",change:"+2.5%",isChangePositive:!0,isBorder:!1},controlOverrides:[{name:"isChangePositive",type:"boolean",description:"Whether the price change is positive"},{name:"isBorder",type:"boolean",description:"Show border around the component"}],includeProps:["id","name","symbol","balance","usdBalance","change","isChangePositive","isBorder"],children:s=>e.jsx("div",{className:"w-full",children:e.jsx(a.LivePriceFeed,{...s,icon:e.jsx(a.Bitcoin,{className:"w-6 h-6"}),prices:i})})}),e.jsx(a.AutoPropsTable,{componentName:"LivePriceFeed"}),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 { LivePriceFeed } from '@e-burgos/tucu-ui';
 
 const priceData = [
   { name: 1, value: 45000 },

package/documentation/{LoaderSection-Chy1mcXx.js → LoaderSection-C7PPbO0x.js}

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

package/documentation/{LoaderSection-yuB9Toxf.js → LoaderSection-DdIGjFqh.js}

@@ -1,4 +1,4 @@
-"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 i=()=>e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Loader",description:`A versatile loader component with multiple animation variants and
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-DEZRGktf.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const i=()=>e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Loader",description:`A versatile loader component with multiple animation variants and
           sizes for indicating 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-indigo-500 to-violet-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(s.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:"Default Loader"}),e.jsx(a.Loader,{})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Small Loader"}),e.jsx(a.Loader,{size:"small"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Large Loader"}),e.jsx(a.Loader,{size:"large"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Three Dots Only"}),e.jsx(a.Loader,{showOnlyThreeDots:!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:"Blink Variant"}),e.jsx(a.Loader,{variant:"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.Loader,{variant:"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.Loader,{variant:"moveUp"})]})]})})})}),e.jsx(a.PropPlayground,{componentName:"Loader",defaultValues:{variant:"moveUp",size:"medium",color:"primary",showOnlyThreeDots:!1,tag:"div"},excludeProps:[],children:r=>e.jsx(a.Loader,{...r})}),e.jsx(a.AutoPropsTable,{componentName:"Loader"}),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 { Loader } from '@e-burgos/tucu-ui';
 
 // Basic usage

package/documentation/{LogoSection-iUxlu-_p.js → LogoSection-Cxz7mIhJ.js}

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

package/documentation/{LogoSection-BVWSaZET.js → LogoSection-Du6WZHrv.js}

@@ -1,4 +1,4 @@
-"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 t=()=>e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Logo",description:`A flexible logo component that automatically adapts to light/dark mode
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-DEZRGktf.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const t=()=>e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Logo",description:`A flexible logo component that automatically adapts to light/dark mode
           and supports various sizes and configurations.`,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(a.Sparkles,{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:"Default Logo (uses defaults)"}),e.jsx(s.Logo,{})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Custom Names"}),e.jsx(s.Logo,{name:"Custom",secondName:"App"})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Different Sizes"}),e.jsxs("div",{className:"flex items-center gap-4 flex-wrap",children:[e.jsx(s.Logo,{name:"TUCU",size:"small"}),e.jsx(s.Logo,{name:"TUCU",size:"medium"}),e.jsx(s.Logo,{name:"TUCU",size:"large"}),e.jsx(s.Logo,{name:"TUCU",size:"xlarge"})]})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"With Custom Link Path"}),e.jsx(s.Logo,{name:"TUCU",path:"/home"})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Isotype Mode (First Letters Only)"}),e.jsx(s.Logo,{name:"TUCU",secondName:"UI",isoType:!0})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"With Custom Classes"}),e.jsx(s.Logo,{name:"TUCU",className:"opacity-80 hover:opacity-100 transition-opacity"})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Custom Logo Component"}),e.jsx(s.Logo,{name:"MY",secondName:"APP",logo:e.jsx("div",{className:"w-16 h-16 bg-linear-to-br from-blue-500 to-purple-600 rounded-lg flex items-center justify-center text-white font-bold text-xl shadow-lg",children:"M"})})]})]})})})}),e.jsx(s.CardContainer,{className:"overflow-hidden",children:e.jsx(s.CardTitle,{title:"Advanced 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:"Custom Logo with SVG Icon"}),e.jsx(s.Logo,{name:"COMPANY",secondName:"LLC",logo:e.jsxs("svg",{width:"64",height:"64",viewBox:"0 0 64 64",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"rounded-lg",children:[e.jsx("rect",{width:"64",height:"64",rx:"12",fill:"url(#gradient)"}),e.jsx("defs",{children:e.jsxs("linearGradient",{id:"gradient",x1:"0",y1:"0",x2:"64",y2:"64",children:[e.jsx("stop",{offset:"0%",stopColor:"#3B82F6"}),e.jsx("stop",{offset:"100%",stopColor:"#8B5CF6"})]})}),e.jsx("path",{d:"M32 20L40 28L32 36L24 28L32 20Z",fill:"white"}),e.jsx("path",{d:"M20 32L28 40L36 32L28 24L20 32Z",fill:"white",opacity:"0.8"})]})})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Custom Logo with Image"}),e.jsx(s.Logo,{name:"COMPANY",secondName:"",logo:e.jsx("div",{className:"w-16 h-16 bg-linear-to-br from-indigo-500 via-purple-500 to-pink-500 rounded-xl flex items-center justify-center text-white font-bold text-2xl shadow-lg border-2 border-white/20",children:"C"})})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Only Primary Name"}),e.jsx(s.Logo,{name:"MYAPP",secondName:""})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Only Secondary Name"}),e.jsx(s.Logo,{name:"",secondName:"BRAND"})]})]})})})}),e.jsx(s.PropPlayground,{componentName:"Logo",defaultValues:{name:"Tucu",secondName:"UI",size:"medium",isoType:!1},excludeProps:["path","logo","preset"],children:o=>e.jsx(s.Logo,{...o})}),e.jsx(s.AutoPropsTable,{componentName:"Logo"}),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 { Logo } from '@e-burgos/tucu-ui';
 
 // Default usage (uses "TUCU" and "UI" as defaults)

package/documentation/{LucideIconsSection-CX6vVBZA.js → LucideIconsSection-BFj8rXHy.js}

@@ -1,6 +1,6 @@
 import { jsxs as o, Fragment as d, jsx as e } from "react/jsx-runtime";
 import { useState as h } from "react";
-import { H as p, T as s, C as w, a as g } from "../index-19KsCnyX.js";
+import { H as p, T as s, C as w, a as g } from "../index-sdOMz8GW.js";
 import { Sparkles as N, Home as u, Menu as f, ArrowLeft as x, ArrowRight as y, ChevronUp as v, ChevronDown as C, Grid3X3 as b, List as k, Navigation as I, Plus as L, Minus as A, X as T, Check as S, Edit as E, Trash2 as D, Download as H, Upload as M, Zap as U, CheckCircle as X, AlertCircle as j, AlertTriangle as P, Info as R, Loader2 as $, Clock as F, Eye as G, EyeOff as O, Bell as q } from "lucide-react";
 import "react-router-dom";
 import "react-dom";

package/documentation/{LucideIconsSection-CXfT5lQb.js → LucideIconsSection-CWdQXv9Y.js}

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),d=require("react"),o=require("../index-DMs_SmPq.js"),s=require("lucide-react");require("react-router-dom");require("react-dom");const h=()=>{const[r,t]=d.useState(null),l=[{category:"Navigation & Layout",description:"Essential navigation and layout icons",icon:e.jsx(s.Navigation,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),color:"from-blue-500 via-indigo-500 to-purple-500",icons:[{name:"Home",component:e.jsx(s.Home,{className:"w-6 h-6"})},{name:"Menu",component:e.jsx(s.Menu,{className:"w-6 h-6"})},{name:"ArrowLeft",component:e.jsx(s.ArrowLeft,{className:"w-6 h-6"})},{name:"ArrowRight",component:e.jsx(s.ArrowRight,{className:"w-6 h-6"})},{name:"ChevronUp",component:e.jsx(s.ChevronUp,{className:"w-6 h-6"})},{name:"ChevronDown",component:e.jsx(s.ChevronDown,{className:"w-6 h-6"})},{name:"Grid3X3",component:e.jsx(s.Grid3X3,{className:"w-6 h-6"})},{name:"List",component:e.jsx(s.List,{className:"w-6 h-6"})}]},{category:"Actions & Controls",description:"Common action and interactive control icons",icon:e.jsx(s.Zap,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),color:"from-purple-500 via-pink-500 to-rose-500",icons:[{name:"Plus",component:e.jsx(s.Plus,{className:"w-6 h-6"})},{name:"Minus",component:e.jsx(s.Minus,{className:"w-6 h-6"})},{name:"X",component:e.jsx(s.X,{className:"w-6 h-6"})},{name:"Check",component:e.jsx(s.Check,{className:"w-6 h-6"})},{name:"Edit",component:e.jsx(s.Edit,{className:"w-6 h-6"})},{name:"Trash2",component:e.jsx(s.Trash2,{className:"w-6 h-6"})},{name:"Download",component:e.jsx(s.Download,{className:"w-6 h-6"})},{name:"Upload",component:e.jsx(s.Upload,{className:"w-6 h-6"})}]},{category:"Status & Feedback",description:"Icons for status indicators and user feedback",icon:e.jsx(s.Bell,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),color:"from-green-500 via-emerald-500 to-teal-500",icons:[{name:"CheckCircle",component:e.jsx(s.CheckCircle,{className:"w-6 h-6"})},{name:"AlertCircle",component:e.jsx(s.AlertCircle,{className:"w-6 h-6"})},{name:"AlertTriangle",component:e.jsx(s.AlertTriangle,{className:"w-6 h-6"})},{name:"Info",component:e.jsx(s.Info,{className:"w-6 h-6"})},{name:"Loader2",component:e.jsx(s.Loader2,{className:"w-6 h-6"})},{name:"Clock",component:e.jsx(s.Clock,{className:"w-6 h-6"})},{name:"Eye",component:e.jsx(s.Eye,{className:"w-6 h-6"})},{name:"EyeOff",component:e.jsx(s.EyeOff,{className:"w-6 h-6"})}]}],i=a=>{const c=`<LucideIcons.${a} className="w-6 h-6" />`;navigator.clipboard.writeText(c),t(a),setTimeout(()=>t(null),2e3)};return e.jsxs(e.Fragment,{children:[e.jsx(o.HeroCard,{title:"Lucide React Icons",description:"Access to 1500+ high-quality open-source icons through the LucideIcons namespace. Stroke-based, consistent, and fully compatible with Tailwind CSS.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-blue-500 via-cyan-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(s.Sparkles,{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(o.Typography,{tag:"h2",className:"mb-2",children:"Popular Icons"}),e.jsx(o.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"A sample of commonly used Lucide icons — click to copy usage code"})]}),e.jsx("div",{className:"space-y-6",children:l.map((a,c)=>e.jsx(o.CardContainer,{className:"overflow-hidden",children:e.jsx(o.CardTitle,{title:a.category,className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full space-y-6 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 ${a.color} shadow-lg`,children:a.icon}),e.jsxs("div",{children:[e.jsx(o.Typography,{tag:"h3",className:"text-base font-semibold",children:a.category}),e.jsx(o.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:a.description})]})]}),e.jsx("div",{className:"grid grid-cols-4 sm:grid-cols-6 md:grid-cols-8 gap-4",children:a.icons.map((n,m)=>e.jsxs("div",{className:"flex flex-col items-center gap-2 p-3 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors cursor-pointer group relative",onClick:()=>i(n.name),title:`Click to copy: LucideIcons.${n.name}`,children:[e.jsx("div",{className:"text-gray-700 dark:text-gray-300 group-hover:text-brand transition-colors",children:n.component}),e.jsx(o.Typography,{tag:"span",className:"text-xs text-center text-gray-500 dark:text-gray-400",children:n.name}),r===n.name&&e.jsx("div",{className:"absolute -top-8 left-1/2 transform -translate-x-1/2 px-2 py-1 bg-green-500 text-white text-xs rounded whitespace-nowrap z-10",children:"Copied!"})]},m))})]})})},c))})]})]})};exports.default=h;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),d=require("react"),o=require("../index-DEZRGktf.js"),s=require("lucide-react");require("react-router-dom");require("react-dom");const h=()=>{const[r,t]=d.useState(null),l=[{category:"Navigation & Layout",description:"Essential navigation and layout icons",icon:e.jsx(s.Navigation,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),color:"from-blue-500 via-indigo-500 to-purple-500",icons:[{name:"Home",component:e.jsx(s.Home,{className:"w-6 h-6"})},{name:"Menu",component:e.jsx(s.Menu,{className:"w-6 h-6"})},{name:"ArrowLeft",component:e.jsx(s.ArrowLeft,{className:"w-6 h-6"})},{name:"ArrowRight",component:e.jsx(s.ArrowRight,{className:"w-6 h-6"})},{name:"ChevronUp",component:e.jsx(s.ChevronUp,{className:"w-6 h-6"})},{name:"ChevronDown",component:e.jsx(s.ChevronDown,{className:"w-6 h-6"})},{name:"Grid3X3",component:e.jsx(s.Grid3X3,{className:"w-6 h-6"})},{name:"List",component:e.jsx(s.List,{className:"w-6 h-6"})}]},{category:"Actions & Controls",description:"Common action and interactive control icons",icon:e.jsx(s.Zap,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),color:"from-purple-500 via-pink-500 to-rose-500",icons:[{name:"Plus",component:e.jsx(s.Plus,{className:"w-6 h-6"})},{name:"Minus",component:e.jsx(s.Minus,{className:"w-6 h-6"})},{name:"X",component:e.jsx(s.X,{className:"w-6 h-6"})},{name:"Check",component:e.jsx(s.Check,{className:"w-6 h-6"})},{name:"Edit",component:e.jsx(s.Edit,{className:"w-6 h-6"})},{name:"Trash2",component:e.jsx(s.Trash2,{className:"w-6 h-6"})},{name:"Download",component:e.jsx(s.Download,{className:"w-6 h-6"})},{name:"Upload",component:e.jsx(s.Upload,{className:"w-6 h-6"})}]},{category:"Status & Feedback",description:"Icons for status indicators and user feedback",icon:e.jsx(s.Bell,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),color:"from-green-500 via-emerald-500 to-teal-500",icons:[{name:"CheckCircle",component:e.jsx(s.CheckCircle,{className:"w-6 h-6"})},{name:"AlertCircle",component:e.jsx(s.AlertCircle,{className:"w-6 h-6"})},{name:"AlertTriangle",component:e.jsx(s.AlertTriangle,{className:"w-6 h-6"})},{name:"Info",component:e.jsx(s.Info,{className:"w-6 h-6"})},{name:"Loader2",component:e.jsx(s.Loader2,{className:"w-6 h-6"})},{name:"Clock",component:e.jsx(s.Clock,{className:"w-6 h-6"})},{name:"Eye",component:e.jsx(s.Eye,{className:"w-6 h-6"})},{name:"EyeOff",component:e.jsx(s.EyeOff,{className:"w-6 h-6"})}]}],i=a=>{const c=`<LucideIcons.${a} className="w-6 h-6" />`;navigator.clipboard.writeText(c),t(a),setTimeout(()=>t(null),2e3)};return e.jsxs(e.Fragment,{children:[e.jsx(o.HeroCard,{title:"Lucide React Icons",description:"Access to 1500+ high-quality open-source icons through the LucideIcons namespace. Stroke-based, consistent, and fully compatible with Tailwind CSS.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-blue-500 via-cyan-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(s.Sparkles,{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(o.Typography,{tag:"h2",className:"mb-2",children:"Popular Icons"}),e.jsx(o.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"A sample of commonly used Lucide icons — click to copy usage code"})]}),e.jsx("div",{className:"space-y-6",children:l.map((a,c)=>e.jsx(o.CardContainer,{className:"overflow-hidden",children:e.jsx(o.CardTitle,{title:a.category,className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full space-y-6 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 ${a.color} shadow-lg`,children:a.icon}),e.jsxs("div",{children:[e.jsx(o.Typography,{tag:"h3",className:"text-base font-semibold",children:a.category}),e.jsx(o.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:a.description})]})]}),e.jsx("div",{className:"grid grid-cols-4 sm:grid-cols-6 md:grid-cols-8 gap-4",children:a.icons.map((n,m)=>e.jsxs("div",{className:"flex flex-col items-center gap-2 p-3 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors cursor-pointer group relative",onClick:()=>i(n.name),title:`Click to copy: LucideIcons.${n.name}`,children:[e.jsx("div",{className:"text-gray-700 dark:text-gray-300 group-hover:text-brand transition-colors",children:n.component}),e.jsx(o.Typography,{tag:"span",className:"text-xs text-center text-gray-500 dark:text-gray-400",children:n.name}),r===n.name&&e.jsx("div",{className:"absolute -top-8 left-1/2 transform -translate-x-1/2 px-2 py-1 bg-green-500 text-white text-xs rounded whitespace-nowrap z-10",children:"Copied!"})]},m))})]})})},c))})]})]})};exports.default=h;