@e-burgos/tucu-ui 2.0.8 → 2.0.10

package/documentation/ImplementationExamplesSection-DXqrijp1.js

@@ -1,284 +0,0 @@
-import { jsx as e, Fragment as n, jsxs as t } from "react/jsx-runtime";
-import { C as r, a as i, T as o, c as a } from "../index-D3gBsvbO.js";
-import { Code as s } from "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const h = () => /* @__PURE__ */ e(n, { children: /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Implementation Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ t("div", { className: "w-full space-y-8 p-4 sm:p-6", children: [
-  /* @__PURE__ */ t("div", { className: "flex items-center gap-3", children: [
-    /* @__PURE__ */ e("div", { className: "p-2 rounded-lg bg-gradient-to-br from-indigo-500 via-purple-500 to-violet-500 shadow-md", children: /* @__PURE__ */ e(s, { className: "w-6 h-6 text-white filter drop-shadow-sm" }) }),
-    /* @__PURE__ */ e(o, { tag: "h3", className: "text-xl font-semibold", children: "Basic Usage" })
-  ] }),
-  /* @__PURE__ */ t("div", { className: "space-y-6", children: [
-    /* @__PURE__ */ t("div", { className: "space-y-3", children: [
-      /* @__PURE__ */ e(o, { tag: "h4", className: "font-semibold", children: "1. Automatic Routing with menuItems" }),
-      /* @__PURE__ */ t(
-        o,
-        {
-          tag: "p",
-          className: "text-sm text-gray-600 dark:text-gray-400",
-          children: [
-            "ThemeProvider automatically generates routes from menuItems. Each menu item with a ",
-            /* @__PURE__ */ e("code", { children: "component" }),
-            " prop becomes a route."
-          ]
-        }
-      ),
-      /* @__PURE__ */ e(
-        a,
-        {
-          language: "tsx",
-          code: `import { ThemeProvider, LAYOUT_OPTIONS, LucideIcons } from '@ui/tucu-ui';
-import { Dashboard } from './pages/Dashboard';
-import { Settings } from './pages/Settings';
-import { Profile } from './pages/Profile';
-
-// Menu items with components - routes are generated automatically
-// Note: Use 'path' for internal routing, 'href' for external links
-const menuItems = [
-  {
-    name: 'Dashboard',
-    path: '/', // Internal route path
-    icon: <LucideIcons.Home />,
-    component: <Dashboard />, // This becomes a route
-  },
-  {
-    name: 'Settings',
-    path: '/settings', // Internal route path
-    icon: <LucideIcons.Settings />,
-    component: <Settings />, // This becomes a route
-  },
-  {
-    name: 'Profile',
-    path: '/profile', // Internal route path
-    icon: <LucideIcons.User />,
-    component: <Profile />, // This becomes a route
-  },
-];
-
-function App() {
-  return (
-    <ThemeProvider
-      menuItems={menuItems}
-      layout={LAYOUT_OPTIONS.ADMIN}
-      logo={{ path: '/', name: 'My App' }}
-    />
-    {/* No children needed - routing is handled automatically */}
-  );
-}
-
-// Routes are automatically created:
-// / -> Dashboard component
-// /settings -> Settings component
-// /profile -> Profile component`
-        }
-      )
-    ] }),
-    /* @__PURE__ */ t("div", { className: "space-y-3", children: [
-      /* @__PURE__ */ e(o, { tag: "h4", className: "font-semibold", children: "2. Landing Page (No Routing)" }),
-      /* @__PURE__ */ t(
-        o,
-        {
-          tag: "p",
-          className: "text-sm text-gray-600 dark:text-gray-400",
-          children: [
-            "For landing pages or single-page applications without routing, use ",
-            /* @__PURE__ */ e("code", { children: "customRoutes" }),
-            " with a single route."
-          ]
-        }
-      ),
-      /* @__PURE__ */ e(
-        a,
-        {
-          language: "tsx",
-          code: `import { ThemeProvider, LAYOUT_OPTIONS, Routes, Route } from '@ui/tucu-ui';
-import { LandingPage } from './pages/LandingPage';
-
-function App() {
-  return (
-    <ThemeProvider
-      menuItems={[]} // Empty - no navigation needed for landing page
-      layout={LAYOUT_OPTIONS.CLEAN} // Clean layout for landing pages
-      logo={{ path: '/', name: 'My Brand' }}
-      customRoutes={
-        <Routes>
-          <Route path="*" element={<LandingPage />} />
-        </Routes>
-      }
-    />
-  );
-}
-
-// The customRoutes prop overrides automatic routing
-// BrowserRouter is already included in ThemeProvider
-// No need to import or wrap with BrowserRouter`
-        }
-      )
-    ] }),
-    /* @__PURE__ */ t("div", { className: "space-y-3", children: [
-      /* @__PURE__ */ e(o, { tag: "h4", className: "font-semibold", children: "3. Custom Routing with customRoutes" }),
-      /* @__PURE__ */ t(
-        o,
-        {
-          tag: "p",
-          className: "text-sm text-gray-600 dark:text-gray-400",
-          children: [
-            "For complex routing scenarios, provide your own",
-            " ",
-            /* @__PURE__ */ e("code", { children: "<Routes>" }),
-            " component via",
-            " ",
-            /* @__PURE__ */ e("code", { children: "customRoutes" }),
-            " prop."
-          ]
-        }
-      ),
-      /* @__PURE__ */ e(
-        a,
-        {
-          language: "tsx",
-          code: `import { ThemeProvider, LAYOUT_OPTIONS, Routes, Route } from '@ui/tucu-ui';
-import { BrowserRouter } from 'react-router-dom'; // Already included in ThemeProvider
-import { Home } from './pages/Home';
-import { About } from './pages/About';
-import { Contact } from './pages/Contact';
-import { NotFound } from './pages/NotFound';
-
-function App() {
-  // Menu items for navigation (optional - can be empty if using customRoutes)
-  // Note: 'path' is used for internal routing, 'href' would be for external links
-  const menuItems = [
-    {
-      name: 'Home',
-      path: '/', // Internal route path
-      icon: <LucideIcons.Home />,
-    },
-    {
-      name: 'About',
-      path: '/about', // Internal route path
-      icon: <LucideIcons.Info />,
-    },
-    {
-      name: 'Contact',
-      path: '/contact', // Internal route path
-      icon: <LucideIcons.Mail />,
-    },
-  ];
-
-  return (
-    <ThemeProvider
-      menuItems={menuItems} // For navigation menu
-      layout={LAYOUT_OPTIONS.HORIZONTAL}
-      logo={{ path: '/', name: 'My App' }}
-      customRoutes={
-        <Routes>
-          <Route path="/" element={<Home />} />
-          <Route path="/about" element={<About />} />
-          <Route path="/contact" element={<Contact />} />
-          <Route path="*" element={<NotFound />} />
-        </Routes>
-      }
-    />
-  );
-}
-
-// Note: BrowserRouter is already included in ThemeProvider,
-// so you don't need to wrap it again`
-        }
-      )
-    ] }),
-    /* @__PURE__ */ t("div", { className: "space-y-3", children: [
-      /* @__PURE__ */ e(o, { tag: "h4", className: "font-semibold", children: "4. Using Theme Hooks" }),
-      /* @__PURE__ */ e(
-        a,
-        {
-          language: "tsx",
-          code: `import { useTheme, LAYOUT_OPTIONS } from '@ui/tucu-ui';
-
-function ThemeControls() {
-  const { 
-    mode, 
-    setMode, 
-    layout, 
-    setLayout,
-    primaryPreset,
-    setPrimaryPreset 
-  } = useTheme();
-  
-  return (
-    <div className="space-y-4">
-      <button 
-        onClick={() => setMode(mode === 'light' ? 'dark' : 'light')}
-      >
-        Toggle Theme: {mode}
-      </button>
-      
-      <select 
-        value={layout} 
-        onChange={(e) => setLayout(e.target.value as any)}
-      >
-        <option value={LAYOUT_OPTIONS.CLEAN}>Clean</option>
-        <option value={LAYOUT_OPTIONS.ADMIN}>Admin</option>
-        <option value={LAYOUT_OPTIONS.HORIZONTAL}>Horizontal</option>
-      </select>
-      
-      <div>
-        Current Primary Color: {primaryPreset?.label}
-      </div>
-    </div>
-  );
-}
-
-// Usage with ThemeProvider
-function App() {
-  const menuItems = [
-    { 
-      name: 'Theme Controls', 
-      href: '/theme-controls',
-      component: <ThemeControls />
-    }
-  ];
-
-  return <ThemeProvider menuItems={menuItems} />;
-}`
-        }
-      )
-    ] }),
-    /* @__PURE__ */ t("div", { className: "space-y-3", children: [
-      /* @__PURE__ */ e(o, { tag: "h4", className: "font-semibold", children: "5. Layout-Specific Configuration" }),
-      /* @__PURE__ */ e(
-        a,
-        {
-          language: "tsx",
-          code: `import { ThemeProvider, LAYOUT_OPTIONS } from '@ui/tucu-ui';
-
-function App() {
-  const menuItems = [
-    { name: 'Home', href: '/', icon: <LucideIcons.Home /> },
-    { name: 'About', href: '/about', icon: <LucideIcons.Info /> },
-  ];
-
-  return (
-    <ThemeProvider
-      menuItems={menuItems}
-      layout={LAYOUT_OPTIONS.ADMIN}
-      logo={{ path: '/', name: 'My App' }}
-      rightButton={<SettingsButton />}
-      fullWidth={false} // Set to true for full-width content
-      className="custom-layout-class"
-      headerClassName="custom-header-class"
-      contentClassName="custom-content-class"
-    >
-      <YourAppContent />
-    </ThemeProvider>
-  );
-}`
-        }
-      )
-    ] })
-  ] })
-] }) }) }) });
-export {
-  h as default
-};

package/documentation/ImplementationGuidelinesSection-7Y4ZRzgG.js

@@ -1,52 +0,0 @@
-import { jsxs as i, Fragment as a, jsx as e } from "react/jsx-runtime";
-import { T as s, C as l, a as t } from "../index-D3gBsvbO.js";
-import { CheckCircle as r, XCircle as n } from "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const g = () => /* @__PURE__ */ i(a, { children: [
-  /* @__PURE__ */ i("div", { className: "text-center space-y-4", children: [
-    /* @__PURE__ */ e(s, { tag: "h2", className: "text-3xl md:text-4xl font-bold", children: "Implementation Guidelines" }),
-    /* @__PURE__ */ e(
-      s,
-      {
-        tag: "p",
-        className: "text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",
-        children: "Best practices and common pitfalls when implementing the design system"
-      }
-    )
-  ] }),
-  /* @__PURE__ */ i("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4 sm:gap-6", children: [
-    /* @__PURE__ */ e(l, { className: "group hover:shadow-large transition-all duration-300 hover:-translate-y-1", children: /* @__PURE__ */ e(t, { title: "Best Practices", className: "mt-2 mb-2", children: /* @__PURE__ */ i("div", { className: "w-full space-y-4 p-4 sm:p-6", children: [
-      /* @__PURE__ */ i("div", { className: "flex items-center gap-3", children: [
-        /* @__PURE__ */ e("div", { className: "p-1.5 rounded-lg bg-linear-to-br from-green-500 via-emerald-500 to-teal-500 shadow-sm", children: /* @__PURE__ */ e(r, { className: "h-5 w-5 text-white filter drop-shadow-sm" }) }),
-        /* @__PURE__ */ e(s, { tag: "h4", className: "font-semibold text-green-700", children: "Best Practices" })
-      ] }),
-      /* @__PURE__ */ i("ul", { className: "space-y-2 text-sm", children: [
-        /* @__PURE__ */ e("li", { children: "• Use semantic HTML elements" }),
-        /* @__PURE__ */ e("li", { children: "• Follow consistent naming conventions" }),
-        /* @__PURE__ */ e("li", { children: "• Implement proper ARIA attributes" }),
-        /* @__PURE__ */ e("li", { children: "• Test across different devices" }),
-        /* @__PURE__ */ e("li", { children: "• Optimize for performance" }),
-        /* @__PURE__ */ e("li", { children: "• Document component usage" })
-      ] })
-    ] }) }) }),
-    /* @__PURE__ */ e(l, { className: "group hover:shadow-large transition-all duration-300 hover:-translate-y-1", children: /* @__PURE__ */ e(t, { title: "Common Pitfalls", className: "mt-2 mb-2", children: /* @__PURE__ */ i("div", { className: "w-full space-y-4 p-4 sm:p-6", children: [
-      /* @__PURE__ */ i("div", { className: "flex items-center gap-3", children: [
-        /* @__PURE__ */ e("div", { className: "p-1.5 rounded-lg bg-linear-to-br from-red-500 via-rose-500 to-pink-500 shadow-sm", children: /* @__PURE__ */ e(n, { className: "h-5 w-5 text-white filter drop-shadow-sm" }) }),
-        /* @__PURE__ */ e(s, { tag: "h4", className: "font-semibold text-red-700", children: "Common Pitfalls" })
-      ] }),
-      /* @__PURE__ */ i("ul", { className: "space-y-2 text-sm", children: [
-        /* @__PURE__ */ e("li", { children: "• Inconsistent spacing usage" }),
-        /* @__PURE__ */ e("li", { children: "• Mixing different color systems" }),
-        /* @__PURE__ */ e("li", { children: "• Ignoring responsive design" }),
-        /* @__PURE__ */ e("li", { children: "• Overriding component styles" }),
-        /* @__PURE__ */ e("li", { children: "• Missing accessibility features" }),
-        /* @__PURE__ */ e("li", { children: "• Not following design tokens" })
-      ] })
-    ] }) }) })
-  ] })
-] });
-export {
-  g as default
-};

package/documentation/ImplementationGuidelinesSection-CdbW-zbQ.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-VrMogvDN.js"),i=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>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:"Implementation Guidelines"}),e.jsx(s.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"Best practices and common pitfalls when implementing the design system"})]}),e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4 sm:gap-6",children:[e.jsx(s.CardContainer,{className:"group hover:shadow-large transition-all duration-300 hover:-translate-y-1",children:e.jsx(s.CardTitle,{title:"Best Practices",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full space-y-4 p-4 sm:p-6",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-1.5 rounded-lg bg-linear-to-br from-green-500 via-emerald-500 to-teal-500 shadow-sm",children:e.jsx(i.CheckCircle,{className:"h-5 w-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h4",className:"font-semibold text-green-700",children:"Best Practices"})]}),e.jsxs("ul",{className:"space-y-2 text-sm",children:[e.jsx("li",{children:"• Use semantic HTML elements"}),e.jsx("li",{children:"• Follow consistent naming conventions"}),e.jsx("li",{children:"• Implement proper ARIA attributes"}),e.jsx("li",{children:"• Test across different devices"}),e.jsx("li",{children:"• Optimize for performance"}),e.jsx("li",{children:"• Document component usage"})]})]})})}),e.jsx(s.CardContainer,{className:"group hover:shadow-large transition-all duration-300 hover:-translate-y-1",children:e.jsx(s.CardTitle,{title:"Common Pitfalls",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full space-y-4 p-4 sm:p-6",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-1.5 rounded-lg bg-linear-to-br from-red-500 via-rose-500 to-pink-500 shadow-sm",children:e.jsx(i.XCircle,{className:"h-5 w-5 text-white filter drop-shadow-sm"})}),e.jsx(s.Typography,{tag:"h4",className:"font-semibold text-red-700",children:"Common Pitfalls"})]}),e.jsxs("ul",{className:"space-y-2 text-sm",children:[e.jsx("li",{children:"• Inconsistent spacing usage"}),e.jsx("li",{children:"• Mixing different color systems"}),e.jsx("li",{children:"• Ignoring responsive design"}),e.jsx("li",{children:"• Overriding component styles"}),e.jsx("li",{children:"• Missing accessibility features"}),e.jsx("li",{children:"• Not following design tokens"})]})]})})})]})]});exports.default=l;

package/documentation/ImplementationStatusSection-BFNsxVIb.js

@@ -1,23 +0,0 @@
-import { jsx as t, jsxs as e } from "react/jsx-runtime";
-import { ag as i, T as a } from "../index-D3gBsvbO.js";
-import { AlertTriangle as s } from "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const p = () => /* @__PURE__ */ t("div", { className: "space-y-8", children: /* @__PURE__ */ t(
-  i,
-  {
-    variant: "warning",
-    "aria-label": "Accessibility Implementation Status",
-    children: /* @__PURE__ */ e("div", { className: "flex flex-col gap-2", children: [
-      /* @__PURE__ */ e("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ t(s, { className: "h-6 w-6" }),
-        /* @__PURE__ */ t(a, { tag: "span", className: "font-semibold", children: "Accessibility Implementation Status" })
-      ] }),
-      /* @__PURE__ */ t(a, { tag: "p", className: "text-sm", children: "This library is actively working towards full accessibility compliance. We're transparent about our current state and committed to continuous improvement." })
-    ] })
-  }
-) });
-export {
-  p as default
-};

package/documentation/ImplementationStatusSection-eRpOuc9O.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-VrMogvDN.js"),i=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=()=>e.jsx("div",{className:"space-y-8",children:e.jsx(t.Alert,{variant:"warning","aria-label":"Accessibility Implementation Status",children:e.jsxs("div",{className:"flex flex-col gap-2",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(i.AlertTriangle,{className:"h-6 w-6"}),e.jsx(t.Typography,{tag:"span",className:"font-semibold",children:"Accessibility Implementation Status"})]}),e.jsx(t.Typography,{tag:"p",className:"text-sm",children:"This library is actively working towards full accessibility compliance. We're transparent about our current state and committed to continuous improvement."})]})})});exports.default=s;

package/documentation/ImplementedFeaturesSection-LQqKN75c.js

@@ -1,116 +0,0 @@
-import { jsxs as t, jsx as e } from "react/jsx-runtime";
-import { T as r, C as l } from "../index-D3gBsvbO.js";
-import { Check as n, Target as c, Keyboard as d, Volume2 as m, Palette as p } from "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const N = () => /* @__PURE__ */ t("div", { className: "space-y-8", children: [
-  /* @__PURE__ */ t("div", { className: "text-center space-y-4", children: [
-    /* @__PURE__ */ e(r, { tag: "h2", className: "text-3xl md:text-4xl font-bold", children: "Implemented Features" }),
-    /* @__PURE__ */ e(
-      r,
-      {
-        tag: "p",
-        className: "text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",
-        children: "Accessibility features currently available in our component library"
-      }
-    )
-  ] }),
-  /* @__PURE__ */ e("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6", children: [
-    {
-      title: "Focus Management",
-      description: "Complete control over focus behavior and visual indicators",
-      icon: /* @__PURE__ */ e(c, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-      color: "from-red-500 via-orange-500 to-red-500",
-      features: [
-        "Visible focus indicators",
-        "Focus trapping in modals",
-        "Focus restoration",
-        "Skip navigation links"
-      ]
-    },
-    {
-      title: "Keyboard Navigation",
-      description: "Full keyboard accessibility across all interactive elements",
-      icon: /* @__PURE__ */ e(d, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-      color: "from-red-500 via-orange-500 to-red-500",
-      features: [
-        "Tab navigation",
-        "Enter/Space activation",
-        "Escape key support",
-        "Arrow key navigation"
-      ]
-    },
-    {
-      title: "Screen Reader Support",
-      description: "Comprehensive support for assistive technologies",
-      icon: /* @__PURE__ */ e(m, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-      color: "from-red-500 via-orange-500 to-red-500",
-      features: [
-        "Semantic HTML structure",
-        "ARIA labels and descriptions",
-        "Live regions",
-        "Role attributes"
-      ]
-    },
-    {
-      title: "Visual Accessibility",
-      description: "Enhanced visual accessibility features",
-      icon: /* @__PURE__ */ e(p, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-      color: "from-red-500 via-orange-500 to-red-500",
-      features: [
-        "High contrast support",
-        "Error state indicators",
-        "Loading state announcements",
-        "Color independence"
-      ]
-    }
-  ].map((a, i) => /* @__PURE__ */ e(
-    l,
-    {
-      className: "group hover:shadow-large transition-all duration-300 hover:-translate-y-1",
-      children: /* @__PURE__ */ t("div", { className: "w-full space-y-4 p-4 sm:p-6", children: [
-        /* @__PURE__ */ t("div", { className: "flex items-center gap-4", children: [
-          /* @__PURE__ */ e(
-            "div",
-            {
-              className: `p-3 rounded-xl bg-linear-to-br ${a.color} group-hover:scale-110 transition-all duration-300 shadow-lg hover:shadow-xl`,
-              children: a.icon
-            }
-          ),
-          /* @__PURE__ */ e(
-            r,
-            {
-              tag: "h3",
-              className: "font-semibold text-lg group-hover:text-primary transition-colors duration-300",
-              children: a.title
-            }
-          )
-        ] }),
-        /* @__PURE__ */ e(
-          r,
-          {
-            tag: "p",
-            className: "text-gray-600 dark:text-gray-400 leading-relaxed",
-            children: a.description
-          }
-        ),
-        /* @__PURE__ */ e("div", { className: "space-y-2", children: a.features.map((s, o) => /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ e(n, { className: "w-4 h-4 text-green-500 shrink-0" }),
-          /* @__PURE__ */ e(
-            r,
-            {
-              tag: "span",
-              className: "text-sm text-gray-600 dark:text-gray-400",
-              children: s
-            }
-          )
-        ] }, o)) })
-      ] })
-    },
-    i
-  )) })
-] });
-export {
-  N as default
-};

package/documentation/ImplementedFeaturesSection-vdhErGHI.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-VrMogvDN.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const n=()=>{const r=[{title:"Focus Management",description:"Complete control over focus behavior and visual indicators",icon:e.jsx(t.Target,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),color:"from-red-500 via-orange-500 to-red-500",features:["Visible focus indicators","Focus trapping in modals","Focus restoration","Skip navigation links"]},{title:"Keyboard Navigation",description:"Full keyboard accessibility across all interactive elements",icon:e.jsx(t.Keyboard,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),color:"from-red-500 via-orange-500 to-red-500",features:["Tab navigation","Enter/Space activation","Escape key support","Arrow key navigation"]},{title:"Screen Reader Support",description:"Comprehensive support for assistive technologies",icon:e.jsx(t.Volume2,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),color:"from-red-500 via-orange-500 to-red-500",features:["Semantic HTML structure","ARIA labels and descriptions","Live regions","Role attributes"]},{title:"Visual Accessibility",description:"Enhanced visual accessibility features",icon:e.jsx(t.Palette,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),color:"from-red-500 via-orange-500 to-red-500",features:["High contrast support","Error state indicators","Loading state announcements","Color independence"]}];return e.jsxs("div",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center space-y-4",children:[e.jsx(a.Typography,{tag:"h2",className:"text-3xl md:text-4xl font-bold",children:"Implemented Features"}),e.jsx(a.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"Accessibility features currently available in our component library"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6",children:r.map((s,i)=>e.jsx(a.CardContainer,{className:"group hover:shadow-large transition-all duration-300 hover:-translate-y-1",children:e.jsxs("div",{className:"w-full space-y-4 p-4 sm:p-6",children:[e.jsxs("div",{className:"flex items-center gap-4",children:[e.jsx("div",{className:`p-3 rounded-xl bg-linear-to-br ${s.color} group-hover:scale-110 transition-all duration-300 shadow-lg hover:shadow-xl`,children:s.icon}),e.jsx(a.Typography,{tag:"h3",className:"font-semibold text-lg group-hover:text-primary transition-colors duration-300",children:s.title})]}),e.jsx(a.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400 leading-relaxed",children:s.description}),e.jsx("div",{className:"space-y-2",children:s.features.map((o,l)=>e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(t.Check,{className:"w-4 h-4 text-green-500 shrink-0"}),e.jsx(a.Typography,{tag:"span",className:"text-sm text-gray-600 dark:text-gray-400",children:o})]},l))})]})},i))})]})};exports.default=n;

package/documentation/InfoCardSection-Brt8Px1M.js

@@ -1,37 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-VrMogvDN.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"text-center space-y-4",children:[e.jsx(a.Typography,{tag:"h2",className:"text-3xl md:text-4xl font-bold",children:"InfoCard"}),e.jsx(a.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"A structured card for displaying key-value data in columns, with optional header, footer tags, and tooltips."})]}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Examples",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-6",children:[e.jsx(a.InfoCard,{title:"Revenue Summary",subtitle:"Q4 2025 Financial Report",icon:e.jsx(t.DollarSign,{className:"h-4 w-4 text-brand"}),headerRight:e.jsx(a.Badge,{color:"success",size:"small",children:"+12%"}),columns:[{key:"revenue",label:"Revenue",icon:e.jsx(t.DollarSign,{className:"h-3 w-3"}),items:[{label:"Total",value:"$1,234,567"},{label:"Growth",value:"+12.3%",color:"text-green-500"},{label:"Target",value:"$1,500,000"}]},{key:"metrics",label:"Metrics",accent:"bg-blue-500",accentText:"text-blue-500",icon:e.jsx(t.TrendingUp,{className:"h-3 w-3"}),items:[{label:"Customers",value:"8,432"},{label:"Conversion",value:"3.2%"},{label:"Avg. Order",value:"$146"}]},{key:"performance",label:"Performance",accent:"bg-orange-500",accentText:"text-orange-500",icon:e.jsx(t.Activity,{className:"h-3 w-3"}),items:[{label:"Uptime",value:"99.9%",color:"text-green-500"},{label:"Latency",value:"45ms"},{label:"Errors",value:"0.01%"}]}],gridCols:3,footerLabel:"Tags",footerTags:[{label:"Quarterly",tooltip:"Q4 2025 data"},{label:"Verified",className:"bg-green-200 dark:bg-green-900/30 border border-green-300/50 dark:border-green-700/50 text-green-700 dark:text-green-400"},{label:"Updated 2h ago",icon:e.jsx(t.Clock,{className:"h-3 w-3"})}]}),e.jsx(a.InfoCard,{title:"Simple Card",columns:[{key:"info",label:"Basic Info",items:[{label:"Name",value:"John Doe"},{label:"Email",value:"john@example.com"},{label:"Role",value:"Admin"}]},{key:"stats",label:"Statistics",items:[{label:"Projects",value:"12"},{label:"Tasks",value:"48"},{label:"Completed",value:"89%",color:"text-green-500"}]}],gridCols:2}),e.jsx(a.InfoCard,{title:"Custom Content",subtitle:"Without columns — just children",icon:e.jsx(t.Activity,{className:"h-4 w-4 text-brand"}),headerRight:e.jsx(a.Badge,{color:"info",size:"small",children:"Live"}),footer:e.jsxs("div",{className:"px-5 py-3 border-t border-gray-200/40 dark:border-gray-700/40 flex items-center justify-between",children:[e.jsx(a.Typography,{tag:"span",className:"text-[11px] text-gray-500",children:"Last synced 5 min ago"}),e.jsx(a.Typography,{tag:"span",className:"text-[11px] text-brand font-medium cursor-pointer hover:underline",children:"Refresh"})]}),children:e.jsxs("div",{className:"grid grid-cols-2 sm:grid-cols-4 gap-4",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"p",className:"text-2xl font-bold text-gray-900 dark:text-gray-100",children:"2.4k"}),e.jsx(a.Typography,{tag:"p",className:"text-[11px] text-gray-500 mt-1",children:"Active Users"})]}),e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"p",className:"text-2xl font-bold text-green-500",children:"98.2%"}),e.jsx(a.Typography,{tag:"p",className:"text-[11px] text-gray-500 mt-1",children:"Uptime"})]}),e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"p",className:"text-2xl font-bold text-gray-900 dark:text-gray-100",children:"12ms"}),e.jsx(a.Typography,{tag:"p",className:"text-[11px] text-gray-500 mt-1",children:"Avg Latency"})]}),e.jsxs("div",{className:"text-center",children:[e.jsx(a.Typography,{tag:"p",className:"text-2xl font-bold text-orange-500",children:"3"}),e.jsx(a.Typography,{tag:"p",className:"text-[11px] text-gray-500 mt-1",children:"Warnings"})]})]})})]})})}),e.jsx(a.AutoPropsTable,{componentName:"InfoCard"}),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 { InfoCard, Badge } from '@e-burgos/tucu-ui';
-import { DollarSign, TrendingUp } from 'lucide-react';
-
-<InfoCard
-  title="Revenue"
-  subtitle="Q4 Report"
-  icon={<DollarSign className="h-4 w-4 text-brand" />}
-  headerRight={<Badge color="success">+12%</Badge>}
-  columns={[
-    {
-      key: 'revenue',
-      label: 'Revenue',
-      icon: <DollarSign className="h-3 w-3" />,
-      items: [
-        { label: 'Total', value: '$1,234,567' },
-        { label: 'Growth', value: '+12%', color: 'text-green-500' },
-      ],
-    },
-    {
-      key: 'metrics',
-      label: 'Metrics',
-      accent: 'bg-blue-500',
-      accentText: 'text-blue-500',
-      icon: <TrendingUp className="h-3 w-3" />,
-      items: [
-        { label: 'Users', value: '8,432' },
-        { label: 'Conversion', value: '3.2%' },
-      ],
-    },
-  ]}
-  gridCols={2}
-  footerLabel="Tags"
-  footerTags={[
-    { label: 'Quarterly', tooltip: 'Q4 2025' },
-    { label: 'Verified', className: 'bg-green-200 dark:bg-green-900/30 border border-green-300/50 dark:border-green-700/50 text-green-700 dark:text-green-400' },
-  ]}
-/>`})})})})]});exports.default=l;

package/documentation/InputSearcherSection-BDc9Ymtf.js

@@ -1,32 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("react"),a=require("../index-VrMogvDN.js");require("lucide-react");require("react-router-dom");require("react-dom");const o=()=>{const[r,t]=n.useState(void 0),s=[{name:"React",value:"react"},{name:"Vue",value:"vue"},{name:"Angular",value:"angular"},{name:"Svelte",value:"svelte"},{name:"Next.js",value:"nextjs"}];return e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"text-center space-y-4",children:[e.jsx(a.Typography,{tag:"h2",className:"text-3xl md:text-4xl font-bold",children:"InputSearcher"}),e.jsx(a.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"A search input component with dropdown suggestions and filtering capabilities."})]}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Examples",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4",children:[e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Basic InputSearcher"}),e.jsx(a.InputSearcher,{label:"Search Framework",placeholder:"Search frameworks",options:s,initialValue:r?.value,onOptionSelect:l=>{Array.isArray(l)||t(l)}})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Multiple Selection"}),e.jsx(a.InputSearcher,{label:"Select Frameworks",placeholder:"Select frameworks",options:s,multiple:!0,onOptionSelect:l=>{console.log("Selected:",l)}})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Custom No Matches Message"}),e.jsx(a.InputSearcher,{label:"Search",placeholder:"Search...",options:s,noMatchesMessage:"No results found",onOptionSelect:l=>{console.log("Selected:",l)}})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Disabled"}),e.jsx(a.InputSearcher,{label:"Search",disabled:!0,placeholder:"Disabled",options:s,noMatchesMessage:"No results found",onOptionSelect:l=>{console.log("Selected:",l)}})]})]})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Variants",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-3 gap-4",children:[e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Ghost (default)"}),e.jsx(a.InputSearcher,{label:"Ghost Variant",placeholder:"Search...",variant:"ghost",options:s,onOptionSelect:l=>{console.log("Selected:",l)}})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Solid"}),e.jsx(a.InputSearcher,{label:"Solid Variant",placeholder:"Search...",variant:"solid",options:s,onOptionSelect:l=>{console.log("Selected:",l)}})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Transparent"}),e.jsx(a.InputSearcher,{label:"Transparent Variant",placeholder:"Search...",variant:"transparent",options:s,onOptionSelect:l=>{console.log("Selected:",l)}})]})]})})})}),e.jsx(a.AutoPropsTable,{componentName:"InputSearcher"}),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 { InputSearcher } from '@e-burgos/tucu-ui';
-
-const options = [
-  { name: 'React', value: 'react' },
-  { name: 'Vue', value: 'vue' },
-  { name: 'Angular', value: 'angular' },
-];
-
-<InputSearcher
-  label="Search Framework"
-  options={options}
-  initialValue={selectedOption?.value}
-  onOptionSelect={(option) => {
-    if (!Array.isArray(option)) {
-      setSelectedOption(option);
-    }
-  }}
-/>
-
-<InputSearcher
-  label="Select Frameworks"
-  options={options}
-  multiple
-  onOptionSelect={(option) => {
-    console.log('Selected:', option);
-  }}
-/>
-
-// Variants
-<InputSearcher label="Ghost" variant="ghost" options={options} />
-<InputSearcher label="Solid" variant="solid" options={options} />
-<InputSearcher label="Transparent" variant="transparent" options={options} />`})})})})]})};exports.default=o;