@e-burgos/tucu-ui 2.0.8 → 2.0.9

package/documentation/DefiAppLogoSection-BkneLGwI.js

@@ -1,120 +0,0 @@
-import { jsxs as t, Fragment as o, jsx as e } from "react/jsx-runtime";
-import { T as s, C as a, a as r, af as l, q as n, c as p } from "../index-D3gBsvbO.js";
-import "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const b = () => /* @__PURE__ */ t(o, { children: [
-  /* @__PURE__ */ t("div", { className: "text-center space-y-4", children: [
-    /* @__PURE__ */ e(s, { tag: "h2", className: "text-3xl md:text-4xl font-bold", children: "DefiAppLogo" }),
-    /* @__PURE__ */ e(
-      s,
-      {
-        tag: "p",
-        className: "text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",
-        children: "An animated brain-inspired logo component designed for DeFi applications, featuring pulsing nodes and signal flows that represent financial data processing."
-      }
-    )
-  ] }),
-  /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(r, { title: "Basic Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ t("div", { className: "space-y-4", children: [
-    /* @__PURE__ */ t(a, { className: "p-4", children: [
-      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Default Animated Logo" }),
-      /* @__PURE__ */ e("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ e(l, { width: 100, height: 100 }) })
-    ] }),
-    /* @__PURE__ */ t(a, { className: "p-4", children: [
-      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Different Sizes" }),
-      /* @__PURE__ */ t("div", { className: "flex items-center gap-4 flex-wrap justify-center", children: [
-        /* @__PURE__ */ e(l, { width: 60, height: 60 }),
-        /* @__PURE__ */ e(l, { width: 100, height: 100 }),
-        /* @__PURE__ */ e(l, { width: 150, height: 150 })
-      ] })
-    ] }),
-    /* @__PURE__ */ t(a, { className: "p-4", children: [
-      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "With Custom Classes" }),
-      /* @__PURE__ */ e("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ e(
-        l,
-        {
-          width: 120,
-          height: 120,
-          className: "opacity-90 hover:opacity-100 transition-opacity"
-        }
-      ) })
-    ] })
-  ] }) }) }) }),
-  /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(r, { title: "Props", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(n, { columns: [
-    {
-      key: "prop",
-      label: "Prop",
-      render: (i) => /* @__PURE__ */ e("code", { className: "text-xs text-brand", children: String(i) })
-    },
-    {
-      key: "type",
-      label: "Type",
-      render: (i) => /* @__PURE__ */ e("code", { className: "text-xs", children: String(i) })
-    },
-    {
-      key: "default",
-      label: "Default",
-      render: (i) => {
-        const c = String(i);
-        return c === "required" ? /* @__PURE__ */ e("span", { className: "text-xs text-red-500", children: "required" }) : /* @__PURE__ */ e("code", { className: "text-xs", children: c });
-      }
-    },
-    {
-      key: "description",
-      label: "Description"
-    }
-  ], data: [
-    {
-      prop: "...SVGAttributes",
-      type: "React.SVGAttributes<SVGElement>",
-      default: "-",
-      description: "All standard SVG attributes are supported"
-    }
-  ] }) }) }) }),
-  /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(r, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
-    p,
-    {
-      language: "tsx",
-      code: `import { DefiAppLogo } from '@e-burgos/tucu-ui';
-
-// Basic usage
-<DefiAppLogo width={100} height={100} />
-
-// Different sizes
-<DefiAppLogo width={60} height={60} />
-<DefiAppLogo width={100} height={100} />
-<DefiAppLogo width={150} height={150} />
-
-// With custom classes
-<DefiAppLogo 
-  width={120} 
-  height={120} 
-  className="opacity-90 hover:opacity-100 transition-opacity" 
-/>
-
-// With SVG attributes
-<DefiAppLogo 
-  width={80} 
-  height={80} 
-  className="custom-class"
-  viewBox="0 0 100 100"
-/>
-
-// Perfect for DeFi applications
-<div className="flex items-center gap-2">
-  <DefiAppLogo width={40} height={40} />
-  <span>My DeFi App</span>
-</div>
-
-// Features:
-// - Animated pulsing nodes
-// - Signal flow animations
-// - Gradient colors (blue, purple, pink)
-// - Perfect for financial/blockchain apps`
-    }
-  ) }) }) })
-] });
-export {
-  b as default
-};

package/documentation/DefiAppLogoSection-Dytt0bXd.js

@@ -1,36 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-VrMogvDN.js");require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>{const a=[{key:"prop",label:"Prop",render:i=>e.jsx("code",{className:"text-xs text-brand",children:String(i)})},{key:"type",label:"Type",render:i=>e.jsx("code",{className:"text-xs",children:String(i)})},{key:"default",label:"Default",render:i=>{const t=String(i);return t==="required"?e.jsx("span",{className:"text-xs text-red-500",children:"required"}):e.jsx("code",{className:"text-xs",children:t})}},{key:"description",label:"Description"}],r=[{prop:"...SVGAttributes",type:"React.SVGAttributes<SVGElement>",default:"-",description:"All standard SVG attributes are supported"}];return e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"text-center space-y-4",children:[e.jsx(s.Typography,{tag:"h2",className:"text-3xl md:text-4xl font-bold",children:"DefiAppLogo"}),e.jsx(s.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"An animated brain-inspired logo component designed for DeFi applications, featuring pulsing nodes and signal flows that represent financial data processing."})]}),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 Animated Logo"}),e.jsx("div",{className:"flex items-center justify-center",children:e.jsx(s.DefiAppLogo,{width:100,height:100})})]}),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 justify-center",children:[e.jsx(s.DefiAppLogo,{width:60,height:60}),e.jsx(s.DefiAppLogo,{width:100,height:100}),e.jsx(s.DefiAppLogo,{width:150,height:150})]})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"With Custom Classes"}),e.jsx("div",{className:"flex items-center justify-center",children:e.jsx(s.DefiAppLogo,{width:120,height:120,className:"opacity-90 hover:opacity-100 transition-opacity"})})]})]})})})}),e.jsx(s.CardContainer,{className:"overflow-hidden",children:e.jsx(s.CardTitle,{title:"Props",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(s.BasicTable,{columns:a,data:r})})})}),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 { DefiAppLogo } from '@e-burgos/tucu-ui';
-
-// Basic usage
-<DefiAppLogo width={100} height={100} />
-
-// Different sizes
-<DefiAppLogo width={60} height={60} />
-<DefiAppLogo width={100} height={100} />
-<DefiAppLogo width={150} height={150} />
-
-// With custom classes
-<DefiAppLogo 
-  width={120} 
-  height={120} 
-  className="opacity-90 hover:opacity-100 transition-opacity" 
-/>
-
-// With SVG attributes
-<DefiAppLogo 
-  width={80} 
-  height={80} 
-  className="custom-class"
-  viewBox="0 0 100 100"
-/>
-
-// Perfect for DeFi applications
-<div className="flex items-center gap-2">
-  <DefiAppLogo width={40} height={40} />
-  <span>My DeFi App</span>
-</div>
-
-// Features:
-// - Animated pulsing nodes
-// - Signal flow animations
-// - Gradient colors (blue, purple, pink)
-// - Perfect for financial/blockchain apps`})})})})]})};exports.default=l;

package/documentation/DesignPrinciplesSection-BOiDQmuk.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("../index-VrMogvDN.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const r=()=>e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"text-center space-y-4",children:[e.jsx(i.Typography,{tag:"h2",className:"text-3xl md:text-4xl font-bold",children:"Design Principles"}),e.jsx(i.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"Core principles that guide our design decisions and ensure consistency"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6",children:[{title:"Consistency",description:"Unified visual language and interaction patterns across all components.",icon:e.jsx(s.CheckCircle,{className:"h-6 w-6 text-white filter drop-shadow-sm"}),color:"from-emerald-500 via-green-500 to-teal-500"},{title:"Simplicity",description:"Clean, intuitive interfaces that reduce cognitive load.",icon:e.jsx(s.Minimize2,{className:"h-6 w-6 text-white filter drop-shadow-sm"}),color:"from-blue-500 via-cyan-500 to-sky-500"},{title:"Flexibility",description:"Adaptable components that work across different contexts.",icon:e.jsx(s.Layers,{className:"h-6 w-6 text-white filter drop-shadow-sm"}),color:"from-purple-500 via-violet-500 to-indigo-500"},{title:"Accessibility",description:"Inclusive design that works for everyone.",icon:e.jsx(s.Eye,{className:"h-6 w-6 text-white filter drop-shadow-sm"}),color:"from-orange-500 via-amber-500 to-yellow-500"}].map(t=>e.jsx(i.CardContainer,{className:"group hover:shadow-large transition-all duration-300 hover:-translate-y-1",children:e.jsxs("div",{className:"w-full space-y-4 p-2 sm:p-2",children:[e.jsxs("div",{className:"flex items-center gap-4",children:[e.jsx("div",{className:`p-3 rounded-xl bg-linear-to-br ${t.color} group-hover:scale-110 transition-all duration-300 shadow-lg hover:shadow-xl`,children:t.icon}),e.jsx(i.Typography,{tag:"h3",className:"font-semibold text-lg group-hover:text-primary transition-colors duration-300",children:t.title})]}),e.jsx(i.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400 leading-relaxed",children:t.description})]})},t.title))})]});exports.default=r;

package/documentation/DesignPrinciplesSection-GaW5AHDx.js

@@ -1,81 +0,0 @@
-import { jsxs as i, Fragment as r, jsx as e } from "react/jsx-runtime";
-import { T as a, C as o } from "../index-D3gBsvbO.js";
-import { CheckCircle as s, Minimize2 as l, Layers as n, Eye as c } from "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const f = () => /* @__PURE__ */ i(r, { children: [
-  /* @__PURE__ */ i("div", { className: "text-center space-y-4", children: [
-    /* @__PURE__ */ e(a, { tag: "h2", className: "text-3xl md:text-4xl font-bold", children: "Design Principles" }),
-    /* @__PURE__ */ e(
-      a,
-      {
-        tag: "p",
-        className: "text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",
-        children: "Core principles that guide our design decisions and ensure consistency"
-      }
-    )
-  ] }),
-  /* @__PURE__ */ e("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6", children: [
-    {
-      title: "Consistency",
-      description: "Unified visual language and interaction patterns across all components.",
-      icon: /* @__PURE__ */ e(s, { className: "h-6 w-6 text-white filter drop-shadow-sm" }),
-      color: "from-emerald-500 via-green-500 to-teal-500"
-    },
-    {
-      title: "Simplicity",
-      description: "Clean, intuitive interfaces that reduce cognitive load.",
-      icon: /* @__PURE__ */ e(l, { className: "h-6 w-6 text-white filter drop-shadow-sm" }),
-      color: "from-blue-500 via-cyan-500 to-sky-500"
-    },
-    {
-      title: "Flexibility",
-      description: "Adaptable components that work across different contexts.",
-      icon: /* @__PURE__ */ e(n, { className: "h-6 w-6 text-white filter drop-shadow-sm" }),
-      color: "from-purple-500 via-violet-500 to-indigo-500"
-    },
-    {
-      title: "Accessibility",
-      description: "Inclusive design that works for everyone.",
-      icon: /* @__PURE__ */ e(c, { className: "h-6 w-6 text-white filter drop-shadow-sm" }),
-      color: "from-orange-500 via-amber-500 to-yellow-500"
-    }
-  ].map((t) => /* @__PURE__ */ e(
-    o,
-    {
-      className: "group hover:shadow-large transition-all duration-300 hover:-translate-y-1",
-      children: /* @__PURE__ */ i("div", { className: "w-full space-y-4 p-2 sm:p-2", children: [
-        /* @__PURE__ */ i("div", { className: "flex items-center gap-4", children: [
-          /* @__PURE__ */ e(
-            "div",
-            {
-              className: `p-3 rounded-xl bg-linear-to-br ${t.color} group-hover:scale-110 transition-all duration-300 shadow-lg hover:shadow-xl`,
-              children: t.icon
-            }
-          ),
-          /* @__PURE__ */ e(
-            a,
-            {
-              tag: "h3",
-              className: "font-semibold text-lg group-hover:text-primary transition-colors duration-300",
-              children: t.title
-            }
-          )
-        ] }),
-        /* @__PURE__ */ e(
-          a,
-          {
-            tag: "p",
-            className: "text-gray-600 dark:text-gray-400 leading-relaxed",
-            children: t.description
-          }
-        )
-      ] })
-    },
-    t.title
-  )) })
-] });
-export {
-  f as default
-};

package/documentation/DrawerSection-Hniq0ExB.js

@@ -1,41 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("react"),r=require("../index-VrMogvDN.js");require("lucide-react");require("react-router-dom");require("react-dom");const o=()=>{const[s,t]=i.useState(!1),[l,a]=i.useState("sidebar");return e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"text-center space-y-4",children:[e.jsx(r.Typography,{tag:"h2",className:"text-3xl md:text-4xl font-bold",children:"Drawer"}),e.jsx(r.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"A drawer component that slides in from the side, supporting both simple sidebar and sidebar-menu variants."})]}),e.jsx(r.CardContainer,{className:"overflow-hidden",children:e.jsx(r.CardTitle,{title:"Basic Examples",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs(r.CardContainer,{className:"p-4",children:[e.jsx(r.Typography,{tag:"h5",className:"mb-3",children:"Sidebar Drawer"}),e.jsx(r.Button,{onClick:()=>{a("sidebar"),t(!0)},children:"Open Sidebar"}),e.jsx(r.Drawer,{isOpen:s,setIsOpen:t,type:"sidebar",title:"Sidebar Title",children:e.jsx(r.Typography,{tag:"p",children:"Sidebar content goes here"})})]}),e.jsxs(r.CardContainer,{className:"p-4",children:[e.jsx(r.Typography,{tag:"h5",className:"mb-3",children:"Right Position"}),e.jsx(r.Button,{onClick:()=>{a("sidebar"),t(!0)},children:"Open Right Drawer"}),e.jsx(r.Drawer,{isOpen:s,setIsOpen:t,type:"sidebar",position:"right",title:"Right Drawer",children:e.jsx(r.Typography,{tag:"p",children:"Content on the right"})})]})]})})})}),e.jsx(r.PropPlayground,{componentName:"Drawer",defaultValues:{isOpen:s,setIsOpen:t,position:"left",backdrop:!0},excludeProps:["setIsOpen","onClose","actionContent","logo","menuItems","type"],children:n=>e.jsx("div",{style:{position:"relative",height:300,overflow:"hidden"},children:e.jsx(r.Drawer,{...n,setIsOpen:t,isOpen:s,title:"Drawer Preview",children:e.jsx("p",{className:"text-sm p-4",children:"Drawer content"})})})}),e.jsx(r.AutoPropsTable,{componentName:"Drawer"}),e.jsx(r.CardContainer,{className:"overflow-hidden",children:e.jsx(r.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(r.CodeBlock,{language:"tsx",code:`import { Drawer, Button } from '@e-burgos/tucu-ui';
-import { useState } from 'react';
-
-function MyComponent() {
-  const [isOpen, setIsOpen] = useState(false);
-
-  return (
-    <>
-      <Button onClick={() => setIsOpen(true)}>Open Drawer</Button>
-      <Drawer
-        isOpen={isOpen}
-        setIsOpen={setIsOpen}
-        type="sidebar"
-        title="Drawer Title"
-      >
-        <div>Drawer content</div>
-      </Drawer>
-    </>
-  );
-}
-
-// Right position
-<Drawer
-  isOpen={isOpen}
-  setIsOpen={setIsOpen}
-  type="sidebar"
-  position="right"
-  title="Right Drawer"
->
-  <div>Content</div>
-</Drawer>
-
-// Without backdrop
-<Drawer
-  isOpen={isOpen}
-  setIsOpen={setIsOpen}
-  type="sidebar"
-  backdrop={false}
->
-  <div>Content</div>
-</Drawer>`})})})})]})};exports.default=o;

package/documentation/DynamicRoutesSection-B-wIQRz6.js

@@ -1,100 +0,0 @@
-import { jsx as e, jsxs as a } from "react/jsx-runtime";
-import { C as r, a as n, T as s, c as i } from "../index-D3gBsvbO.js";
-import { Shield as m, Flag as d, Database as c } from "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const y = () => /* @__PURE__ */ e("div", { className: "space-y-8", children: /* @__PURE__ */ e(r, { children: /* @__PURE__ */ e(n, { title: "Dynamic & Conditional Routes", className: "mt-2 mb-6", children: /* @__PURE__ */ a("div", { className: "space-y-6", children: [
-  /* @__PURE__ */ e(s, { tag: "p", className: "text-gray-600 dark:text-gray-400", children: "Create dynamic routing based on user permissions, feature flags, or application state." }),
-  /* @__PURE__ */ e(i, { language: "tsx", code: `import { useMemo } from 'react';
-
-export const useMenuItems = () => {
-  const { userRole, featureFlags } = useAppState();
-  
-  const menuItems = useMemo(() => [
-    // Static routes
-    {
-      name: 'Home',
-      path: '/',
-      component: <HomePage />,
-    },
-
-    // Dynamic routes based on user permissions
-    ...(userRole === 'admin' ? [{
-      name: 'Admin',
-      path: '/admin',
-      component: <AdminPage />,
-      dropdownItems: [
-        {
-          name: 'Users',
-          path: '/admin/users',
-          component: <UsersPage />,
-        },
-        {
-          name: 'Settings',
-          path: '/admin/settings',
-          component: <AdminSettingsPage />,
-        },
-      ],
-    }] : []),
-
-    // Feature-flagged routes
-    ...(featureFlags.newFeature ? [{
-      name: 'New Feature',
-      path: '/new-feature',
-      component: <NewFeaturePage />,
-    }] : []),
-  ], [userRole, featureFlags]);
-
-  return { menuItems };
-};` }),
-  /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
-    {
-      title: "Role-Based Access",
-      description: "Show/hide routes based on user permissions",
-      icon: /* @__PURE__ */ e(m, { className: "w-5 h-5 text-white filter drop-shadow-sm" }),
-      color: "from-red-500 to-rose-500"
-    },
-    {
-      title: "Feature Flags",
-      description: "Enable routes based on feature toggles",
-      icon: /* @__PURE__ */ e(d, { className: "w-5 h-5 text-white filter drop-shadow-sm" }),
-      color: "from-blue-500 to-cyan-500"
-    },
-    {
-      title: "State-Driven",
-      description: "Routes that change based on app state",
-      icon: /* @__PURE__ */ e(c, { className: "w-5 h-5 text-white filter drop-shadow-sm" }),
-      color: "from-green-500 to-emerald-500"
-    }
-  ].map((t, o) => /* @__PURE__ */ a(
-    "div",
-    {
-      className: "flex items-start gap-3 p-3 bg-light-dark rounded-lg",
-      children: [
-        /* @__PURE__ */ e(
-          "div",
-          {
-            className: `p-2 rounded-lg bg-linear-to-br ${t.color} shadow-lg shrink-0`,
-            children: t.icon
-          }
-        ),
-        /* @__PURE__ */ a("div", { children: [
-          /* @__PURE__ */ e(s, { tag: "h5", className: "font-medium mb-1", children: t.title }),
-          /* @__PURE__ */ e(
-            s,
-            {
-              tag: "p",
-              className: "text-sm text-gray-600 dark:text-gray-400",
-              children: t.description
-            }
-          )
-        ] })
-      ]
-    },
-    o
-  )) })
-] }) }) }) });
-export {
-  y as default
-};

package/documentation/DynamicRoutesSection-EyN4-iMU.js

@@ -1,42 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-VrMogvDN.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const o=()=>e.jsx("div",{className:"space-y-8",children:e.jsx(s.CardContainer,{children:e.jsx(s.CardTitle,{title:"Dynamic & Conditional Routes",className:"mt-2 mb-6",children:e.jsxs("div",{className:"space-y-6",children:[e.jsx(s.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:"Create dynamic routing based on user permissions, feature flags, or application state."}),e.jsx(s.CodeBlock,{language:"tsx",code:`import { useMemo } from 'react';
-
-export const useMenuItems = () => {
-  const { userRole, featureFlags } = useAppState();
-  
-  const menuItems = useMemo(() => [
-    // Static routes
-    {
-      name: 'Home',
-      path: '/',
-      component: <HomePage />,
-    },
-
-    // Dynamic routes based on user permissions
-    ...(userRole === 'admin' ? [{
-      name: 'Admin',
-      path: '/admin',
-      component: <AdminPage />,
-      dropdownItems: [
-        {
-          name: 'Users',
-          path: '/admin/users',
-          component: <UsersPage />,
-        },
-        {
-          name: 'Settings',
-          path: '/admin/settings',
-          component: <AdminSettingsPage />,
-        },
-      ],
-    }] : []),
-
-    // Feature-flagged routes
-    ...(featureFlags.newFeature ? [{
-      name: 'New Feature',
-      path: '/new-feature',
-      component: <NewFeaturePage />,
-    }] : []),
-  ], [userRole, featureFlags]);
-
-  return { menuItems };
-};`}),e.jsx("div",{className:"grid grid-cols-1 md:grid-cols-3 gap-4",children:[{title:"Role-Based Access",description:"Show/hide routes based on user permissions",icon:e.jsx(a.Shield,{className:"w-5 h-5 text-white filter drop-shadow-sm"}),color:"from-red-500 to-rose-500"},{title:"Feature Flags",description:"Enable routes based on feature toggles",icon:e.jsx(a.Flag,{className:"w-5 h-5 text-white filter drop-shadow-sm"}),color:"from-blue-500 to-cyan-500"},{title:"State-Driven",description:"Routes that change based on app state",icon:e.jsx(a.Database,{className:"w-5 h-5 text-white filter drop-shadow-sm"}),color:"from-green-500 to-emerald-500"}].map((t,r)=>e.jsxs("div",{className:"flex items-start gap-3 p-3 bg-light-dark rounded-lg",children:[e.jsx("div",{className:`p-2 rounded-lg bg-linear-to-br ${t.color} shadow-lg shrink-0`,children:t.icon}),e.jsxs("div",{children:[e.jsx(s.Typography,{tag:"h5",className:"font-medium mb-1",children:t.title}),e.jsx(s.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:t.description})]})]},r))})]})})})});exports.default=o;

package/documentation/FileInputSection-BRBK7QWu.js

@@ -1,65 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),l=require("../index-VrMogvDN.js");require("lucide-react");require("react-router-dom");require("react");require("react-dom");const p=()=>{const s=[{key:"prop",label:"Prop",render:a=>e.jsx("code",{className:"text-xs text-brand",children:String(a)})},{key:"type",label:"Type",render:a=>e.jsx("code",{className:"text-xs",children:String(a)})},{key:"default",label:"Default",render:a=>{const t=String(a);return t==="required"?e.jsx("span",{className:"text-xs text-red-500",children:"required"}):e.jsx("code",{className:"text-xs",children:t})}},{key:"description",label:"Description"}],i=[{prop:"accept",type:"'img' | 'pdf' | 'csvAndExcel' | 'imgAndPdf' | 'all'",default:"undefined (accepts all)",description:'File types to accept. If not provided or set to "all", accepts any file type'},{prop:"multiple",type:"boolean",default:"false",description:"Allow multiple file selection"},{prop:"disabled",type:"boolean",default:"false",description:"Disables the upload component"},{prop:"label",type:"React.ReactNode",default:"'CHOOSE FILE'",description:"Button label text"},{prop:"placeholderText",type:"React.ReactNode",default:"'PNG, GIF, WEBP, MP4 or MP3. Max 100mb.'",description:"Placeholder text displayed in the upload area"},{prop:"children",type:"React.ReactNode",default:"-",description:"Custom content to display in the upload area"},{prop:"wrapperClassName",type:"string",default:"-",description:"Custom CSS classes for the wrapper container"},{prop:"className",type:"string",default:"-",description:"Custom CSS classes for the input element"},{prop:"labelClassName",type:"string",default:"-",description:"Custom CSS classes for the label/button"},{prop:"containerClassName",type:"string",default:"-",description:"Custom CSS classes for the container element"},{prop:"containerProps",type:"React.HTMLAttributes<HTMLDivElement>",default:"-",description:"Additional props to pass to the container element"},{prop:"additionalInputProps",type:"React.InputHTMLAttributes<HTMLInputElement>",default:"-",description:"Additional props to pass to the input element"}];return e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"text-center space-y-4",children:[e.jsx(l.Typography,{tag:"h2",className:"text-3xl md:text-4xl font-bold",children:"FileInput"}),e.jsx(l.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"An advanced file input component with native HTML5 drag-and-drop support, image preview, and flexible file type validation. The component implements native drag and drop functionality without external dependencies."})]}),e.jsx(l.CardContainer,{className:"overflow-hidden",children:e.jsx(l.CardTitle,{title:"Examples",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4",children:[e.jsxs(l.CardContainer,{className:"p-4",children:[e.jsx(l.Typography,{tag:"h5",className:"mb-3",children:"Images Only"}),e.jsx(l.FileInputWithRef,{label:"Upload Images",accept:"img",placeholderText:"PNG, JPG, GIF, WEBP. Max 100mb."})]}),e.jsxs(l.CardContainer,{className:"p-4",children:[e.jsx(l.Typography,{tag:"h5",className:"mb-3",children:"Multiple Images"}),e.jsx(l.FileInputWithRef,{label:"Upload Multiple Images",accept:"img",multiple:!0,placeholderText:"Select multiple images"})]}),e.jsxs(l.CardContainer,{className:"p-4",children:[e.jsx(l.Typography,{tag:"h5",className:"mb-3",children:"PDF Documents"}),e.jsx(l.FileInputWithRef,{label:"Upload PDF",accept:"pdf",placeholderText:"PDF files only. Max 100mb."})]}),e.jsxs(l.CardContainer,{className:"p-4",children:[e.jsx(l.Typography,{tag:"h5",className:"mb-3",children:"CSV & Excel Files"}),e.jsx(l.FileInputWithRef,{label:"Upload CSV or Excel",accept:"csvAndExcel",multiple:!0,placeholderText:"CSV, XLSX, or XLS files. Max 100mb."})]}),e.jsxs(l.CardContainer,{className:"p-4",children:[e.jsx(l.Typography,{tag:"h5",className:"mb-3",children:"Images & PDFs"}),e.jsx(l.FileInputWithRef,{label:"Upload Images or PDFs",accept:"imgAndPdf",multiple:!0,placeholderText:"Images or PDF documents"})]}),e.jsxs(l.CardContainer,{className:"p-4",children:[e.jsx(l.Typography,{tag:"h5",className:"mb-3",children:"All File Types"}),e.jsx(l.FileInputWithRef,{label:"Upload Any File",accept:"all",multiple:!0,placeholderText:"Drag and drop any file type or click to browse"})]}),e.jsxs(l.CardContainer,{className:"p-4",children:[e.jsx(l.Typography,{tag:"h5",className:"mb-3",children:"Any File (No Restriction)"}),e.jsx(l.FileInputWithRef,{label:"Upload Files",multiple:!0,placeholderText:"Accept any file type - no restrictions"})]}),e.jsxs(l.CardContainer,{className:"p-4",children:[e.jsx(l.Typography,{tag:"h5",className:"mb-3",children:"Disabled"}),e.jsx(l.FileInputWithRef,{accept:"img",disabled:!0})]})]})})})}),e.jsx(l.CardContainer,{className:"overflow-hidden",children:e.jsx(l.CardTitle,{title:"Props",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(l.BasicTable,{columns:s,data:i})})})}),e.jsx(l.CardContainer,{className:"overflow-hidden",children:e.jsx(l.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(l.CodeBlock,{language:"tsx",code:`import { FileInput } from '@e-burgos/tucu-ui';
-
-// Images only
-<FileInput
-  label="Upload Images"
-  accept="img"
-  placeholderText="PNG, JPG, GIF, WEBP. Max 100mb."
-/>
-
-// Multiple images
-<FileInput
-  label="Upload Multiple Images"
-  accept="img"
-  multiple
-  placeholderText="Select multiple images"
-/>
-
-// PDF documents
-<FileInput
-  label="Upload PDF"
-  accept="pdf"
-  placeholderText="PDF files only. Max 100mb."
-/>
-
-// CSV and Excel files
-<FileInput
-  label="Upload CSV or Excel"
-  accept="csvAndExcel"
-  multiple
-  placeholderText="CSV, XLSX, or XLS files. Max 100mb."
-/>
-
-// Images and PDFs
-<FileInput
-  label="Upload Images or PDFs"
-  accept="imgAndPdf"
-  multiple
-  placeholderText="Images or PDF documents"
-/>
-
-// All predefined file types
-<FileInput
-  label="Upload Any File"
-  accept="all"
-  multiple
-  placeholderText="Drag and drop any file type or click to browse"
-/>
-
-// Any file type (no restrictions)
-<FileInput
-  label="Upload Files"
-  multiple
-  placeholderText="Accept any file type - no restrictions"
-/>
-
-// Disabled
-<FileInput accept="img" disabled />
-
-// Custom styling
-<FileInput
-  accept="img"
-  wrapperClassName="custom-wrapper"
-  containerClassName="custom-container"
-  labelClassName="custom-label"
-/>`})})})})]})};exports.default=p;