@e-burgos/tucu-ui 2.5.0 → 2.7.0

package/documentation/ImplementationGuidelinesSection-D2ms5PqO.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-COp_AWCS.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const n=()=>{const t=[{title:"Semantic HTML",description:"Use semantic HTML elements for better accessibility and SEO.",icon:e.jsx(s.Code,{className:"h-6 w-6"}),iconBgClassName:"from-green-500 via-emerald-500 to-teal-500"},{title:"Consistent Naming",description:"Follow consistent naming conventions across your codebase.",icon:e.jsx(s.Tag,{className:"h-6 w-6"}),iconBgClassName:"from-blue-500 via-cyan-500 to-sky-500"},{title:"ARIA Attributes",description:"Implement proper ARIA attributes for screen reader support.",icon:e.jsx(s.Eye,{className:"h-6 w-6"}),iconBgClassName:"from-purple-500 via-violet-500 to-indigo-500"},{title:"Cross-Device Testing",description:"Test across different devices and screen sizes.",icon:e.jsx(s.Monitor,{className:"h-6 w-6"}),iconBgClassName:"from-orange-500 via-amber-500 to-yellow-500"},{title:"Performance Optimization",description:"Optimize for performance with lazy loading and code splitting.",icon:e.jsx(s.Zap,{className:"h-6 w-6"}),iconBgClassName:"from-pink-500 via-rose-500 to-red-500"},{title:"Document Usage",description:"Document component usage with clear examples and props tables.",icon:e.jsx(s.FileText,{className:"h-6 w-6"}),iconBgClassName:"from-teal-500 via-cyan-500 to-blue-500"}],o=[{title:"Inconsistent Spacing",description:"Mixing arbitrary values instead of using design tokens.",icon:e.jsx(s.AlertTriangle,{className:"h-6 w-6"}),iconBgClassName:"from-red-500 via-rose-500 to-pink-500"},{title:"Mixed Color Systems",description:"Using raw hex values instead of semantic color tokens.",icon:e.jsx(s.Palette,{className:"h-6 w-6"}),iconBgClassName:"from-red-500 via-rose-500 to-pink-500"},{title:"Ignoring Responsive",description:"Not testing across breakpoints and device sizes.",icon:e.jsx(s.Smartphone,{className:"h-6 w-6"}),iconBgClassName:"from-red-500 via-rose-500 to-pink-500"},{title:"Overriding Styles",description:"Overriding component styles instead of using variants.",icon:e.jsx(s.Ban,{className:"h-6 w-6"}),iconBgClassName:"from-red-500 via-rose-500 to-pink-500"},{title:"Missing Accessibility",description:"Forgetting focus states, labels, and keyboard navigation.",icon:e.jsx(s.EyeOff,{className:"h-6 w-6"}),iconBgClassName:"from-red-500 via-rose-500 to-pink-500"},{title:"Ignoring Design Tokens",description:"Not following the established token hierarchy.",icon:e.jsx(s.XCircle,{className:"h-6 w-6"}),iconBgClassName:"from-red-500 via-rose-500 to-pink-500"}];return e.jsxs("div",{className:"space-y-8 max-w-6xl sm:space-y-12 w-full mx-auto px-4 sm:px-6 lg:px-8 relative pt-8 lg:pt-12",children:[e.jsx(a.HeroCard,{title:"Implementation Guidelines",description:"Best practices and common pitfalls when implementing the design system.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-orange-500 via-amber-500 to-yellow-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(s.BookCheck,{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:"Best Practices"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Follow these guidelines for a consistent and maintainable implementation"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6",children:t.map(i=>e.jsx(a.FeatureCard,{layout:"horizontal",title:i.title,description:i.description,icon:i.icon,iconBgClassName:i.iconBgClassName},i.title))})]}),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:"Common Pitfalls"}),e.jsx(a.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Avoid these common mistakes when working with the design system"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6",children:o.map(i=>e.jsx(a.FeatureCard,{layout:"horizontal",title:i.title,description:i.description,icon:i.icon,iconBgClassName:i.iconBgClassName},i.title))})]})]})};exports.default=n;

package/documentation/ImplementationGuidelinesSection-DlpKMLZ_.js

@@ -1,144 +0,0 @@
-import { jsxs as s, jsx as e } from "react/jsx-runtime";
-import { H as r, T as a, ax as t } from "../index-DYDFy1df.js";
-import { BookCheck as l, Code as c, Tag as m, Eye as d, Monitor as g, Zap as p, FileText as h, AlertTriangle as N, Palette as f, Smartphone as w, Ban as v, EyeOff as y, XCircle as u } from "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const A = () => {
-  const o = [
-    {
-      title: "Semantic HTML",
-      description: "Use semantic HTML elements for better accessibility and SEO.",
-      icon: /* @__PURE__ */ e(c, { className: "h-6 w-6" }),
-      iconBgClassName: "from-green-500 via-emerald-500 to-teal-500"
-    },
-    {
-      title: "Consistent Naming",
-      description: "Follow consistent naming conventions across your codebase.",
-      icon: /* @__PURE__ */ e(m, { className: "h-6 w-6" }),
-      iconBgClassName: "from-blue-500 via-cyan-500 to-sky-500"
-    },
-    {
-      title: "ARIA Attributes",
-      description: "Implement proper ARIA attributes for screen reader support.",
-      icon: /* @__PURE__ */ e(d, { className: "h-6 w-6" }),
-      iconBgClassName: "from-purple-500 via-violet-500 to-indigo-500"
-    },
-    {
-      title: "Cross-Device Testing",
-      description: "Test across different devices and screen sizes.",
-      icon: /* @__PURE__ */ e(g, { className: "h-6 w-6" }),
-      iconBgClassName: "from-orange-500 via-amber-500 to-yellow-500"
-    },
-    {
-      title: "Performance Optimization",
-      description: "Optimize for performance with lazy loading and code splitting.",
-      icon: /* @__PURE__ */ e(p, { className: "h-6 w-6" }),
-      iconBgClassName: "from-pink-500 via-rose-500 to-red-500"
-    },
-    {
-      title: "Document Usage",
-      description: "Document component usage with clear examples and props tables.",
-      icon: /* @__PURE__ */ e(h, { className: "h-6 w-6" }),
-      iconBgClassName: "from-teal-500 via-cyan-500 to-blue-500"
-    }
-  ], n = [
-    {
-      title: "Inconsistent Spacing",
-      description: "Mixing arbitrary values instead of using design tokens.",
-      icon: /* @__PURE__ */ e(N, { className: "h-6 w-6" }),
-      iconBgClassName: "from-red-500 via-rose-500 to-pink-500"
-    },
-    {
-      title: "Mixed Color Systems",
-      description: "Using raw hex values instead of semantic color tokens.",
-      icon: /* @__PURE__ */ e(f, { className: "h-6 w-6" }),
-      iconBgClassName: "from-red-500 via-rose-500 to-pink-500"
-    },
-    {
-      title: "Ignoring Responsive",
-      description: "Not testing across breakpoints and device sizes.",
-      icon: /* @__PURE__ */ e(w, { className: "h-6 w-6" }),
-      iconBgClassName: "from-red-500 via-rose-500 to-pink-500"
-    },
-    {
-      title: "Overriding Styles",
-      description: "Overriding component styles instead of using variants.",
-      icon: /* @__PURE__ */ e(v, { className: "h-6 w-6" }),
-      iconBgClassName: "from-red-500 via-rose-500 to-pink-500"
-    },
-    {
-      title: "Missing Accessibility",
-      description: "Forgetting focus states, labels, and keyboard navigation.",
-      icon: /* @__PURE__ */ e(y, { className: "h-6 w-6" }),
-      iconBgClassName: "from-red-500 via-rose-500 to-pink-500"
-    },
-    {
-      title: "Ignoring Design Tokens",
-      description: "Not following the established token hierarchy.",
-      icon: /* @__PURE__ */ e(u, { className: "h-6 w-6" }),
-      iconBgClassName: "from-red-500 via-rose-500 to-pink-500"
-    }
-  ];
-  return /* @__PURE__ */ s("div", { className: "space-y-8 max-w-6xl sm:space-y-12 w-full mx-auto px-4 sm:px-6 lg:px-8 relative pt-8 lg:pt-12", children: [
-    /* @__PURE__ */ e(
-      r,
-      {
-        title: "Implementation Guidelines",
-        description: "Best practices and common pitfalls when implementing the design system.",
-        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-orange-500 via-amber-500 to-yellow-500 rounded-full flex items-center justify-center shadow-lg", children: /* @__PURE__ */ e(l, { className: "w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg" }) })
-      }
-    ),
-    /* @__PURE__ */ s("section", { className: "space-y-8", children: [
-      /* @__PURE__ */ s("div", { className: "text-center", children: [
-        /* @__PURE__ */ e(a, { tag: "h2", className: "mb-2", children: "Best Practices" }),
-        /* @__PURE__ */ e(
-          a,
-          {
-            tag: "p",
-            className: "text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",
-            children: "Follow these guidelines for a consistent and maintainable implementation"
-          }
-        )
-      ] }),
-      /* @__PURE__ */ e("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6", children: o.map((i) => /* @__PURE__ */ e(
-        t,
-        {
-          layout: "horizontal",
-          title: i.title,
-          description: i.description,
-          icon: i.icon,
-          iconBgClassName: i.iconBgClassName
-        },
-        i.title
-      )) })
-    ] }),
-    /* @__PURE__ */ s("section", { className: "space-y-8", children: [
-      /* @__PURE__ */ s("div", { className: "text-center", children: [
-        /* @__PURE__ */ e(a, { tag: "h2", className: "mb-2", children: "Common Pitfalls" }),
-        /* @__PURE__ */ e(
-          a,
-          {
-            tag: "p",
-            className: "text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",
-            children: "Avoid these common mistakes when working with the design system"
-          }
-        )
-      ] }),
-      /* @__PURE__ */ e("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6", children: n.map((i) => /* @__PURE__ */ e(
-        t,
-        {
-          layout: "horizontal",
-          title: i.title,
-          description: i.description,
-          icon: i.icon,
-          iconBgClassName: i.iconBgClassName
-        },
-        i.title
-      )) })
-    ] })
-  ] });
-};
-export {
-  A as default
-};

package/documentation/ImplementationStatusSection-BnEi6nv4.js

@@ -1,62 +0,0 @@
-import { jsxs as t, Fragment as s, jsx as e } from "react/jsx-runtime";
-import { H as i, T as a, aj as o, ax as l } from "../index-DYDFy1df.js";
-import { Activity as n, Info as c, CheckCircle as m, Keyboard as d, Volume2 as p, AlertTriangle as h } from "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const N = () => /* @__PURE__ */ t(s, { children: [
-  /* @__PURE__ */ e(
-    i,
-    {
-      title: "Implementation Status",
-      description: "Current state of accessibility compliance across the tucu-ui component library. We follow WCAG 2.1 AA guidelines and are transparent about our progress.",
-      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-amber-500 via-yellow-500 to-orange-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" }) })
-    }
-  ),
-  /* @__PURE__ */ t("section", { className: "space-y-8", children: [
-    /* @__PURE__ */ t("div", { className: "text-center", children: [
-      /* @__PURE__ */ e(a, { tag: "h2", className: "mb-2", children: "Current State" }),
-      /* @__PURE__ */ e(
-        a,
-        {
-          tag: "p",
-          className: "text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",
-          children: "Overview of accessibility features across core components"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ e(o, { variant: "info", dismissible: !1, children: /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ e(c, { className: "h-5 w-5 shrink-0" }),
-      /* @__PURE__ */ e(a, { tag: "p", className: "text-sm", children: "This library is actively working towards full accessibility compliance. Most interactive components include proper ARIA attributes, keyboard navigation, and screen reader support." })
-    ] }) }),
-    /* @__PURE__ */ e("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6", children: [
-      {
-        icon: /* @__PURE__ */ e(m, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-        title: "Fully Accessible",
-        description: "Input, Checkbox, Modal, Alert, Button, Tabs, Drawer, Select — all with ARIA attributes and keyboard support.",
-        iconBgClassName: "from-green-500 to-emerald-500"
-      },
-      {
-        icon: /* @__PURE__ */ e(d, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-        title: "Keyboard Navigation",
-        description: "Tab, Escape, Enter/Space, Arrow keys — all interactive components are fully operable without a mouse.",
-        iconBgClassName: "from-blue-500 to-cyan-500"
-      },
-      {
-        icon: /* @__PURE__ */ e(p, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-        title: "Screen Reader Ready",
-        description: "Semantic HTML, ARIA labels, live regions, role attributes, and aria-describedby connections throughout.",
-        iconBgClassName: "from-purple-500 to-violet-500"
-      },
-      {
-        icon: /* @__PURE__ */ e(h, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-        title: "Known Limitation",
-        description: "Modal component lacks focus trapping (Tab can escape). Drawer has full focus trap — Modal improvement planned.",
-        iconBgClassName: "from-amber-500 to-orange-500"
-      }
-    ].map((r) => /* @__PURE__ */ e(l, { layout: "horizontal", ...r }, r.title)) })
-  ] })
-] });
-export {
-  N as default
-};

package/documentation/ImplementationStatusSection-ChX-zdjZ.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-COp_AWCS.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const i=()=>{const r=[{icon:e.jsx(a.CheckCircle,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Fully Accessible",description:"Input, Checkbox, Modal, Alert, Button, Tabs, Drawer, Select — all with ARIA attributes and keyboard support.",iconBgClassName:"from-green-500 to-emerald-500"},{icon:e.jsx(a.Keyboard,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Keyboard Navigation",description:"Tab, Escape, Enter/Space, Arrow keys — all interactive components are fully operable without a mouse.",iconBgClassName:"from-blue-500 to-cyan-500"},{icon:e.jsx(a.Volume2,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Screen Reader Ready",description:"Semantic HTML, ARIA labels, live regions, role attributes, and aria-describedby connections throughout.",iconBgClassName:"from-purple-500 to-violet-500"},{icon:e.jsx(a.AlertTriangle,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Known Limitation",description:"Modal component lacks focus trapping (Tab can escape). Drawer has full focus trap — Modal improvement planned.",iconBgClassName:"from-amber-500 to-orange-500"}];return e.jsxs(e.Fragment,{children:[e.jsx(t.HeroCard,{title:"Implementation Status",description:"Current state of accessibility compliance across the tucu-ui component library. We follow WCAG 2.1 AA guidelines and are transparent about our progress.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-amber-500 via-yellow-500 to-orange-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(a.Activity,{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(t.Typography,{tag:"h2",className:"mb-2",children:"Current State"}),e.jsx(t.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Overview of accessibility features across core components"})]}),e.jsx(t.Alert,{variant:"info",dismissible:!1,children:e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(a.Info,{className:"h-5 w-5 shrink-0"}),e.jsx(t.Typography,{tag:"p",className:"text-sm",children:"This library is actively working towards full accessibility compliance. Most interactive components include proper ARIA attributes, keyboard navigation, and screen reader support."})]})}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6",children:r.map(s=>e.jsx(t.FeatureCard,{layout:"horizontal",...s},s.title))})]})]})};exports.default=i;

package/documentation/ImplementedFeaturesSection-C7ep5GNQ.js

@@ -1,70 +0,0 @@
-import { jsxs as a, Fragment as r, jsx as e } from "react/jsx-runtime";
-import { H as i, T as s, ax as o } from "../index-DYDFy1df.js";
-import { CheckCircle as l, Target as c, Keyboard as n, Volume2 as d, Palette as m, Lock as p, FormInput as h } from "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const x = () => /* @__PURE__ */ a(r, { children: [
-  /* @__PURE__ */ e(
-    i,
-    {
-      title: "Implemented Features",
-      description: "Accessibility features currently available across the component library. Each feature has been verified against the source code.",
-      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-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg", children: /* @__PURE__ */ e(l, { 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("section", { className: "space-y-8", children: [
-    /* @__PURE__ */ a("div", { className: "text-center", children: [
-      /* @__PURE__ */ e(s, { tag: "h2", className: "mb-2", children: "What's Available Today" }),
-      /* @__PURE__ */ e(
-        s,
-        {
-          tag: "p",
-          className: "text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",
-          children: "Core accessibility features implemented across components"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ e("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6", children: [
-      {
-        icon: /* @__PURE__ */ e(c, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-        title: "Focus Management",
-        description: "Visible focus indicators, focus restoration on close (Modal, Drawer), auto-focus on open, and skip-navigation support.",
-        iconBgClassName: "from-red-500 to-orange-500"
-      },
-      {
-        icon: /* @__PURE__ */ e(n, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-        title: "Keyboard Navigation",
-        description: "Tab/Shift+Tab traversal, Enter/Space activation, Escape to close, Arrow keys in Tabs and Select, Home/End support.",
-        iconBgClassName: "from-blue-500 to-indigo-500"
-      },
-      {
-        icon: /* @__PURE__ */ e(d, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-        title: "Screen Reader Support",
-        description: "Semantic HTML, ARIA labels, aria-describedby connections, live regions (Alert), and proper role attributes.",
-        iconBgClassName: "from-purple-500 to-violet-500"
-      },
-      {
-        icon: /* @__PURE__ */ e(m, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-        title: "Visual Accessibility",
-        description: "High contrast modes, color-independent error indicators (aria-invalid), loading state announcements (aria-busy).",
-        iconBgClassName: "from-teal-500 to-cyan-500"
-      },
-      {
-        icon: /* @__PURE__ */ e(p, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-        title: "Focus Trapping",
-        description: "Drawer implements full focus trap (Tab cycles within). Modal has Escape close and focus restoration but Tab can escape.",
-        iconBgClassName: "from-amber-500 to-yellow-500"
-      },
-      {
-        icon: /* @__PURE__ */ e(h, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-        title: "Form Accessibility",
-        description: "Auto-generated IDs (useId), label association (htmlFor), aria-required, aria-invalid, and aria-describedby for helpers/errors.",
-        iconBgClassName: "from-green-500 to-emerald-500"
-      }
-    ].map((t) => /* @__PURE__ */ e(o, { layout: "vertical", ...t }, t.title)) })
-  ] })
-] });
-export {
-  x as default
-};

package/documentation/ImplementedFeaturesSection-CFHFcIUm.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-COp_AWCS.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const i=()=>{const r=[{icon:e.jsx(a.Target,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Focus Management",description:"Visible focus indicators, focus restoration on close (Modal, Drawer), auto-focus on open, and skip-navigation support.",iconBgClassName:"from-red-500 to-orange-500"},{icon:e.jsx(a.Keyboard,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Keyboard Navigation",description:"Tab/Shift+Tab traversal, Enter/Space activation, Escape to close, Arrow keys in Tabs and Select, Home/End support.",iconBgClassName:"from-blue-500 to-indigo-500"},{icon:e.jsx(a.Volume2,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Screen Reader Support",description:"Semantic HTML, ARIA labels, aria-describedby connections, live regions (Alert), and proper role attributes.",iconBgClassName:"from-purple-500 to-violet-500"},{icon:e.jsx(a.Palette,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Visual Accessibility",description:"High contrast modes, color-independent error indicators (aria-invalid), loading state announcements (aria-busy).",iconBgClassName:"from-teal-500 to-cyan-500"},{icon:e.jsx(a.Lock,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Focus Trapping",description:"Drawer implements full focus trap (Tab cycles within). Modal has Escape close and focus restoration but Tab can escape.",iconBgClassName:"from-amber-500 to-yellow-500"},{icon:e.jsx(a.FormInput,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Form Accessibility",description:"Auto-generated IDs (useId), label association (htmlFor), aria-required, aria-invalid, and aria-describedby for helpers/errors.",iconBgClassName:"from-green-500 to-emerald-500"}];return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Implemented Features",description:"Accessibility features currently available across the component library. Each feature has been verified against the source code.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-green-500 via-emerald-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(a.CheckCircle,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(s.Typography,{tag:"h2",className:"mb-2",children:"What's Available Today"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Core accessibility features implemented across components"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4 sm:gap-6",children:r.map(t=>e.jsx(s.FeatureCard,{layout:"vertical",...t},t.title))})]})]})};exports.default=i;

package/documentation/InfoCardSection-B02qLuF6.js

@@ -1,38 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-COp_AWCS.js"),l=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const r=()=>e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"InfoCard",description:`A structured card for displaying key-value data in columns, with
-          optional header, footer tags, and tooltips.`,icon:e.jsx("div",{className:"w-16 h-16 sm:w-20 sm:h-20 md:w-24 md:h-24 bg-linear-to-br from-violet-600 to-purple-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(l.Info,{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:"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(l.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(l.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(l.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(l.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(l.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(l.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-border 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.PropPlayground,{componentName:"InfoCard",title:"InfoCard Playground",defaultValues:{title:"Info Card Title",subtitle:"Subtitle text here",gridCols:2},excludeProps:["columns","children","footer","footerLabel","footerTags","headerRight","icon","className"],children:t=>e.jsx(a.InfoCard,{...t,columns:[{label:"Status",value:"Active"},{label:"Type",value:"Premium"},{label:"Created",value:"2024-01-01"},{label:"Updated",value:"2024-06-15"}]})}),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=r;

package/documentation/InfoCardSection-CTygtxPU.js

@@ -1,291 +0,0 @@
-import { jsxs as l, Fragment as d, jsx as e } from "react/jsx-runtime";
-import { H as m, C as r, a as s, M as t, K as o, T as a, P as g, A as u, c as b } from "../index-DYDFy1df.js";
-import { Info as h, Clock as p, DollarSign as n, TrendingUp as x, Activity as i } from "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const T = () => /* @__PURE__ */ l(d, { children: [
-  /* @__PURE__ */ e(
-    m,
-    {
-      title: "InfoCard",
-      description: `A structured card for displaying key-value data in columns, with
-          optional header, footer tags, and tooltips.`,
-      icon: /* @__PURE__ */ e("div", { className: "w-16 h-16 sm:w-20 sm:h-20 md:w-24 md:h-24 bg-linear-to-br from-violet-600 to-purple-500 rounded-full flex items-center justify-center shadow-lg", children: /* @__PURE__ */ e(h, { className: "w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 text-white filter drop-shadow-lg" }) })
-    }
-  ),
-  /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(s, { title: "Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ l("div", { className: "w-full p-4 sm:p-6 space-y-6", children: [
-    /* @__PURE__ */ e(
-      t,
-      {
-        title: "Revenue Summary",
-        subtitle: "Q4 2025 Financial Report",
-        icon: /* @__PURE__ */ e(n, { className: "h-4 w-4 text-brand" }),
-        headerRight: /* @__PURE__ */ e(o, { color: "success", size: "small", children: "+12%" }),
-        columns: [
-          {
-            key: "revenue",
-            label: "Revenue",
-            icon: /* @__PURE__ */ e(n, { 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: /* @__PURE__ */ e(x, { 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: /* @__PURE__ */ e(i, { 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: /* @__PURE__ */ e(p, { className: "h-3 w-3" })
-          }
-        ]
-      }
-    ),
-    /* @__PURE__ */ e(
-      t,
-      {
-        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
-      }
-    ),
-    /* @__PURE__ */ e(
-      t,
-      {
-        title: "Custom Content",
-        subtitle: "Without columns — just children",
-        icon: /* @__PURE__ */ e(i, { className: "h-4 w-4 text-brand" }),
-        headerRight: /* @__PURE__ */ e(o, { color: "info", size: "small", children: "Live" }),
-        footer: /* @__PURE__ */ l("div", { className: "px-5 py-3 border-t border-border flex items-center justify-between", children: [
-          /* @__PURE__ */ e(a, { tag: "span", className: "text-[11px] text-gray-500", children: "Last synced 5 min ago" }),
-          /* @__PURE__ */ e(
-            a,
-            {
-              tag: "span",
-              className: "text-[11px] text-brand font-medium cursor-pointer hover:underline",
-              children: "Refresh"
-            }
-          )
-        ] }),
-        children: /* @__PURE__ */ l("div", { className: "grid grid-cols-2 sm:grid-cols-4 gap-4", children: [
-          /* @__PURE__ */ l("div", { className: "text-center", children: [
-            /* @__PURE__ */ e(
-              a,
-              {
-                tag: "p",
-                className: "text-2xl font-bold text-gray-900 dark:text-gray-100",
-                children: "2.4k"
-              }
-            ),
-            /* @__PURE__ */ e(
-              a,
-              {
-                tag: "p",
-                className: "text-[11px] text-gray-500 mt-1",
-                children: "Active Users"
-              }
-            )
-          ] }),
-          /* @__PURE__ */ l("div", { className: "text-center", children: [
-            /* @__PURE__ */ e(
-              a,
-              {
-                tag: "p",
-                className: "text-2xl font-bold text-green-500",
-                children: "98.2%"
-              }
-            ),
-            /* @__PURE__ */ e(
-              a,
-              {
-                tag: "p",
-                className: "text-[11px] text-gray-500 mt-1",
-                children: "Uptime"
-              }
-            )
-          ] }),
-          /* @__PURE__ */ l("div", { className: "text-center", children: [
-            /* @__PURE__ */ e(
-              a,
-              {
-                tag: "p",
-                className: "text-2xl font-bold text-gray-900 dark:text-gray-100",
-                children: "12ms"
-              }
-            ),
-            /* @__PURE__ */ e(
-              a,
-              {
-                tag: "p",
-                className: "text-[11px] text-gray-500 mt-1",
-                children: "Avg Latency"
-              }
-            )
-          ] }),
-          /* @__PURE__ */ l("div", { className: "text-center", children: [
-            /* @__PURE__ */ e(
-              a,
-              {
-                tag: "p",
-                className: "text-2xl font-bold text-orange-500",
-                children: "3"
-              }
-            ),
-            /* @__PURE__ */ e(
-              a,
-              {
-                tag: "p",
-                className: "text-[11px] text-gray-500 mt-1",
-                children: "Warnings"
-              }
-            )
-          ] })
-        ] })
-      }
-    )
-  ] }) }) }),
-  /* @__PURE__ */ e(
-    g,
-    {
-      componentName: "InfoCard",
-      title: "InfoCard Playground",
-      defaultValues: {
-        title: "Info Card Title",
-        subtitle: "Subtitle text here",
-        gridCols: 2
-      },
-      excludeProps: [
-        "columns",
-        "children",
-        "footer",
-        "footerLabel",
-        "footerTags",
-        "headerRight",
-        "icon",
-        "className"
-      ],
-      children: (c) => /* @__PURE__ */ e(
-        t,
-        {
-          ...c,
-          columns: [
-            { label: "Status", value: "Active" },
-            { label: "Type", value: "Premium" },
-            { label: "Created", value: "2024-01-01" },
-            { label: "Updated", value: "2024-06-15" }
-          ]
-        }
-      )
-    }
-  ),
-  /* @__PURE__ */ e(u, { componentName: "InfoCard" }),
-  /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(s, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
-    b,
-    {
-      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' },
-  ]}
-/>`
-    }
-  ) }) }) })
-] });
-export {
-  T as default
-};