@e-burgos/tucu-ui 2.6.0 → 2.7.1

package/documentation/SwitchSection-ByC85Kap.js

@@ -1,223 +0,0 @@
-import { jsxs as c, Fragment as w, jsx as e } from "react/jsx-runtime";
-import { useState as d } from "react";
-import { H as C, C as a, a as i, T as r, u as l, P as u, A as f, c as N } from "../index-DoxeCFUJ.js";
-import { ToggleLeft as S } from "lucide-react";
-import "react-router-dom";
-import "react-dom";
-const v = [
-  { label: "Primary", color: "primary" },
-  { label: "Secondary", color: "secondary" },
-  { label: "Danger", color: "danger" },
-  { label: "Info", color: "info" },
-  { label: "Success", color: "success" },
-  { label: "Warning", color: "warning" }
-], D = () => {
-  const [s, n] = d(!1), [t, m] = d(!0), [g, b] = d({
-    primary: !0,
-    secondary: !0,
-    danger: !0,
-    info: !0,
-    success: !0,
-    warning: !0
-  }), p = (h) => (o) => {
-    b((k) => ({
-      ...k,
-      [h]: o
-    }));
-  };
-  return /* @__PURE__ */ c(w, { children: [
-    /* @__PURE__ */ e(
-      C,
-      {
-        title: "Switch",
-        description: "A toggle switch component for binary on/off states.",
-        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-emerald-500 via-green-500 to-lime-500 rounded-full flex items-center justify-center shadow-lg border border-emerald-500/50", children: /* @__PURE__ */ e(S, { className: "w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg" }) })
-      }
-    ),
-    /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ c("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
-      /* @__PURE__ */ c(a, { className: "p-4", children: [
-        /* @__PURE__ */ e(r, { tag: "h5", className: "mb-3", children: "Basic Switch" }),
-        /* @__PURE__ */ e(
-          l,
-          {
-            label: "Enable notifications",
-            checked: s,
-            onChange: n
-          }
-        )
-      ] }),
-      /* @__PURE__ */ c(a, { className: "p-4", children: [
-        /* @__PURE__ */ e(r, { tag: "h5", className: "mb-3", children: "Custom Labels" }),
-        /* @__PURE__ */ e(
-          l,
-          {
-            label: "Dark mode",
-            onLabel: "ON",
-            offLabel: "OFF",
-            checked: s,
-            onChange: n
-          }
-        )
-      ] }),
-      /* @__PURE__ */ c(a, { className: "p-4", children: [
-        /* @__PURE__ */ e(r, { tag: "h5", className: "mb-3", children: "With Helper Text" }),
-        /* @__PURE__ */ e(
-          l,
-          {
-            label: "Auto-save",
-            helperText: "Automatically save your work",
-            checked: s,
-            onChange: n
-          }
-        )
-      ] }),
-      /* @__PURE__ */ c(a, { className: "p-4", children: [
-        /* @__PURE__ */ e(r, { tag: "h5", className: "mb-3", children: "With Error" }),
-        /* @__PURE__ */ e(
-          l,
-          {
-            label: "Required switch",
-            errorMessage: "This field is required",
-            checked: s,
-            onChange: n
-          }
-        )
-      ] }),
-      /* @__PURE__ */ c(a, { className: "p-4", children: [
-        /* @__PURE__ */ e(r, { tag: "h5", className: "mb-3", children: "Disabled" }),
-        /* @__PURE__ */ e(
-          l,
-          {
-            label: "Disabled switch",
-            disabled: !0,
-            checked: s,
-            onChange: n
-          }
-        )
-      ] })
-    ] }) }) }) }),
-    /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Variants", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ c("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
-      /* @__PURE__ */ c(a, { className: "p-4", children: [
-        /* @__PURE__ */ e(r, { tag: "h5", className: "mb-3", children: "Ghost (default)" }),
-        /* @__PURE__ */ e(
-          l,
-          {
-            label: "Ghost Variant",
-            variant: "ghost",
-            checked: s,
-            onChange: n
-          }
-        )
-      ] }),
-      /* @__PURE__ */ c(a, { className: "p-4", children: [
-        /* @__PURE__ */ e(r, { tag: "h5", className: "mb-3", children: "Solid" }),
-        /* @__PURE__ */ e(
-          l,
-          {
-            label: "Solid Variant",
-            variant: "solid",
-            checked: s,
-            onChange: n
-          }
-        )
-      ] }),
-      /* @__PURE__ */ c(a, { className: "p-4", children: [
-        /* @__PURE__ */ e(r, { tag: "h5", className: "mb-3", children: "Transparent" }),
-        /* @__PURE__ */ e(
-          l,
-          {
-            label: "Transparent Variant",
-            variant: "transparent",
-            checked: s,
-            onChange: n
-          }
-        )
-      ] })
-    ] }) }) }) }),
-    /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Colors", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2 xl:grid-cols-3", children: v.map(({ label: h, color: o }) => /* @__PURE__ */ c(a, { className: "p-4", children: [
-      /* @__PURE__ */ e(r, { tag: "h5", className: "mb-3", children: h }),
-      /* @__PURE__ */ e(
-        l,
-        {
-          label: `${h} Switch`,
-          color: o,
-          checked: g[o],
-          onChange: p(o)
-        }
-      )
-    ] }, o)) }) }) }) }),
-    /* @__PURE__ */ e(
-      u,
-      {
-        componentName: "Switch",
-        defaultValues: {
-          label: "Preview Switch",
-          onLabel: "ON",
-          offLabel: "OFF",
-          variant: "ghost",
-          color: "primary",
-          helperText: "",
-          errorMessage: "",
-          disabled: !1
-        },
-        includeProps: [
-          "label",
-          "onLabel",
-          "offLabel",
-          "variant",
-          "color",
-          "helperText",
-          "errorMessage",
-          "disabled"
-        ],
-        excludeProps: ["checked", "onChange"],
-        children: (h) => /* @__PURE__ */ e(
-          l,
-          {
-            ...h,
-            checked: t,
-            onChange: m
-          }
-        )
-      }
-    ),
-    /* @__PURE__ */ e(f, { componentName: "Switch" }),
-    /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
-      N,
-      {
-        language: "tsx",
-        code: `import { Switch } from '@e-burgos/tucu-ui';
-
-<Switch
-  label="Enable notifications"
-  checked={checked}
-  onChange={setChecked}
-/>
-
-<Switch
-  label="Dark mode"
-  onLabel="ON"
-  offLabel="OFF"
-  checked={checked}
-  onChange={setChecked}
-/>
-
-// Variants
-<Switch label="Ghost" variant="ghost" checked={checked} onChange={setChecked} />
-<Switch label="Solid" variant="solid" checked={checked} onChange={setChecked} />
-<Switch label="Transparent" variant="transparent" checked={checked} onChange={setChecked} />
-
-// Colors
-<Switch label="Primary" color="primary" checked={checked} onChange={setChecked} />
-<Switch label="Secondary" color="secondary" checked={checked} onChange={setChecked} />
-<Switch label="Danger" color="danger" checked={checked} onChange={setChecked} />
-<Switch label="Info" color="info" checked={checked} onChange={setChecked} />
-<Switch label="Success" color="success" checked={checked} onChange={setChecked} />
-<Switch label="Warning" color="warning" checked={checked} onChange={setChecked} />`
-      }
-    ) }) }) })
-  ] });
-};
-export {
-  D as default
-};

package/documentation/SystemOverviewSection-CAWlhqIB.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("../index-DWDUS-PU.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=()=>{const r=[{icon:e.jsx(t.Router,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"React Router v6",description:"Built on React Router with full compatibility, browser history, and modern routing features.",iconBgClassName:"from-blue-500 to-cyan-500"},{icon:e.jsx(t.Menu,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Automatic Navigation",description:"Generate navigation menus automatically from menuItems configuration with active states.",iconBgClassName:"from-green-500 to-emerald-500"},{icon:e.jsx(t.Layers3,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Nested Routes",description:"Unlimited nesting levels via dropdownItems with automatic sidebar dropdown generation.",iconBgClassName:"from-purple-500 to-indigo-500"},{icon:e.jsx(t.Box,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Dual Architecture",description:"Supports Standalone (menu-driven) and MFE (explicit config) via the architecturalPatterns prop.",iconBgClassName:"from-orange-500 to-amber-500"}];return e.jsxs(e.Fragment,{children:[e.jsx(i.HeroCard,{title:"System Overview",description:"Built on React Router v6 with automatic menu generation and nested route support. Supports both Standalone and Micro Frontend (MFE) architectural patterns via TypeScript-enforced discriminated unions.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-blue-500 via-cyan-500 to-teal-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(t.Map,{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(i.Typography,{tag:"h2",className:"mb-2",children:"Core Capabilities"}),e.jsx(i.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Key features of the routing system"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 sm:gap-6",children:r.map(a=>e.jsx(i.FeatureCard,{layout:"vertical",...a},a.title))})]})]})};exports.default=s;

package/documentation/SystemOverviewSection-ydaPDpDw.js

@@ -1,58 +0,0 @@
-import { jsxs as t, Fragment as r, jsx as e } from "react/jsx-runtime";
-import { H as o, T as i, ax as s } from "../index-DoxeCFUJ.js";
-import { Map as n, Router as l, Menu as m, Layers3 as c, Box as d } from "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const x = () => /* @__PURE__ */ t(r, { children: [
-  /* @__PURE__ */ e(
-    o,
-    {
-      title: "System Overview",
-      description: "Built on React Router v6 with automatic menu generation and nested route support. Supports both Standalone and Micro Frontend (MFE) architectural patterns via TypeScript-enforced discriminated unions.",
-      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-blue-500 via-cyan-500 to-teal-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(i, { tag: "h2", className: "mb-2", children: "Core Capabilities" }),
-      /* @__PURE__ */ e(
-        i,
-        {
-          tag: "p",
-          className: "text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",
-          children: "Key features of the routing system"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ e("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 sm:gap-6", children: [
-      {
-        icon: /* @__PURE__ */ e(l, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-        title: "React Router v6",
-        description: "Built on React Router with full compatibility, browser history, and modern routing features.",
-        iconBgClassName: "from-blue-500 to-cyan-500"
-      },
-      {
-        icon: /* @__PURE__ */ e(m, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-        title: "Automatic Navigation",
-        description: "Generate navigation menus automatically from menuItems configuration with active states.",
-        iconBgClassName: "from-green-500 to-emerald-500"
-      },
-      {
-        icon: /* @__PURE__ */ e(c, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-        title: "Nested Routes",
-        description: "Unlimited nesting levels via dropdownItems with automatic sidebar dropdown generation.",
-        iconBgClassName: "from-purple-500 to-indigo-500"
-      },
-      {
-        icon: /* @__PURE__ */ e(d, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
-        title: "Dual Architecture",
-        description: "Supports Standalone (menu-driven) and MFE (explicit config) via the architecturalPatterns prop.",
-        iconBgClassName: "from-orange-500 to-amber-500"
-      }
-    ].map((a) => /* @__PURE__ */ e(s, { layout: "vertical", ...a }, a.title)) })
-  ] })
-] });
-export {
-  x as default
-};

package/documentation/TabModalSection-Bu3a4ryu.js

@@ -1,52 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("react"),t=require("../index-DWDUS-PU.js"),a=require("lucide-react");require("react-router-dom");require("react-dom");const h=()=>{const[l,s]=o.useState(!1),[r,n]=o.useState(!1),[c,i]=o.useState(!1);return e.jsxs(e.Fragment,{children:[e.jsx(t.HeroCard,{title:"TabModal",description:`A modal dialog with built-in tab navigation, header with icon/badge,
-          expandable footer, and mobile-first responsive design.`,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-orange-500 to-amber-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(a.SquareStack,{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(t.CardContainer,{className:"overflow-hidden",children:e.jsx(t.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(t.CardContainer,{className:"p-4",children:[e.jsx(t.Typography,{tag:"h5",className:"mb-3",children:"With Tabs"}),e.jsx(t.Button,{onClick:()=>n(!0),children:"Open TabModal (Tabs)"}),r&&e.jsx(t.TabModal,{icon:a.Activity,title:"Dashboard",subtitle:"View your activity and stats",badgeHeader:"LIVE",badgeHeaderClassName:"text-green-600 bg-green-100 border-green-300",tabs:[{icon:a.BarChart3,name:"Overview",content:e.jsxs("div",{className:"space-y-3",children:[e.jsx(t.Typography,{tag:"h5",children:"Overview Tab"}),e.jsx(t.Typography,{tag:"p",children:"This is the overview content with charts and metrics."})]})},{icon:a.Settings,name:"Settings",content:e.jsxs("div",{className:"space-y-3",children:[e.jsx(t.Typography,{tag:"h5",children:"Settings Tab"}),e.jsx(t.Typography,{tag:"p",children:"Configure your preferences here."})]})}],footerLabel:"Last updated: 2 minutes ago",successButton:{label:"Save",onClick:()=>n(!1)},onClose:()=>n(!1)})]}),e.jsxs(t.CardContainer,{className:"p-4",children:[e.jsx(t.Typography,{tag:"h5",className:"mb-3",children:"With Direct Content"}),e.jsx(t.Button,{onClick:()=>i(!0),children:"Open TabModal (Content)"}),c&&e.jsx(t.TabModal,{icon:a.Settings,title:"Preferences",subtitle:"Manage your account settings",content:e.jsx("div",{className:"space-y-4",children:e.jsxs(t.Typography,{tag:"p",children:["When you pass the ",e.jsx("code",{children:"content"})," prop directly, the tab bar is hidden and this content fills the body."]})}),onClose:()=>i(!1)})]}),e.jsxs(t.CardContainer,{className:"p-4",children:[e.jsx(t.Typography,{tag:"h5",className:"mb-3",children:"Minimal (No Tabs, No Content)"}),e.jsx(t.Button,{onClick:()=>s(!0),children:"Open Minimal TabModal"}),l&&e.jsx(t.TabModal,{title:"Confirmation",successButton:{label:"Confirm",onClick:()=>s(!1)},closeButton:{label:"Cancel",onClick:()=>s(!1)},onClose:()=>s(!1)})]})]})})})}),e.jsx(t.PropPlayground,{componentName:"TabModal",title:"TabModal Playground",defaultValues:{title:"Modal Title",subtitle:"Modal subtitle",footerLabel:"Footer text",closeLabel:"Cancel"},excludeProps:["onClose","tabs","content","icon","className","closeButton","successButton","badgeHeader","badgeHeaderClassName"],children:d=>e.jsx(t.TabModal,{...d,onClose:()=>{},tabs:[{title:"Tab 1",content:e.jsx(t.Typography,{tag:"p",children:"Content 1"})},{title:"Tab 2",content:e.jsx(t.Typography,{tag:"p",children:"Content 2"})}]})}),e.jsx(t.AutoPropsTable,{componentName:"TabModal"}),e.jsx(t.CardContainer,{className:"overflow-hidden",children:e.jsx(t.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(t.CodeBlock,{language:"tsx",code:`import { TabModal } from '@e-burgos/tucu-ui';
-import { Activity, BarChart3, Settings } from 'lucide-react';
-import { useState } from 'react';
-
-function MyComponent() {
-  const [isOpen, setIsOpen] = useState(false);
-
-  return (
-    <>
-      <button onClick={() => setIsOpen(true)}>Open</button>
-      {isOpen && (
-        <TabModal
-          icon={Activity}
-          title="Dashboard"
-          subtitle="Activity overview"
-          badgeHeader="LIVE"
-          tabs={[
-            {
-              icon: BarChart3,
-              name: 'Overview',
-              content: <div>Overview content</div>,
-            },
-            {
-              icon: Settings,
-              name: 'Settings',
-              content: <div>Settings content</div>,
-            },
-          ]}
-          footerLabel="Last updated: 2 min ago"
-          successButton={{ label: 'Save', onClick: () => setIsOpen(false) }}
-          onClose={() => setIsOpen(false)}
-        />
-      )}
-    </>
-  );
-}
-
-// Direct content (no tabs)
-<TabModal
-  title="Preferences"
-  content={<div>Direct body content</div>}
-  onClose={() => setIsOpen(false)}
-/>
-
-// With expandable footer label
-<TabModal
-  title="Details"
-  content={<div>Body</div>}
-  footerLabel="Long description that expands on click..."
-  onClose={() => setIsOpen(false)}
-/>`})})})})]})};exports.default=h;

package/documentation/TabModalSection-TRVdGNTT.js

@@ -1,200 +0,0 @@
-import { jsxs as a, Fragment as f, jsx as e } from "react/jsx-runtime";
-import { useState as l } from "react";
-import { H as g, C as n, a as d, T as t, x as c, a4 as o, P as C, A as v, c as T } from "../index-DoxeCFUJ.js";
-import { SquareStack as N, BarChart3 as w, Settings as m, Activity as y } from "lucide-react";
-import "react-router-dom";
-import "react-dom";
-const I = () => {
-  const [b, s] = l(!1), [h, i] = l(!1), [p, r] = l(!1);
-  return /* @__PURE__ */ a(f, { children: [
-    /* @__PURE__ */ e(
-      g,
-      {
-        title: "TabModal",
-        description: `A modal dialog with built-in tab navigation, header with icon/badge,
-          expandable footer, and mobile-first responsive design.`,
-        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-orange-500 to-amber-500 rounded-full flex items-center justify-center shadow-lg", children: /* @__PURE__ */ e(N, { 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(n, { className: "overflow-hidden", children: /* @__PURE__ */ e(d, { title: "Basic Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a("div", { className: "space-y-4", children: [
-      /* @__PURE__ */ a(n, { className: "p-4", children: [
-        /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "With Tabs" }),
-        /* @__PURE__ */ e(c, { onClick: () => i(!0), children: "Open TabModal (Tabs)" }),
-        h && /* @__PURE__ */ e(
-          o,
-          {
-            icon: y,
-            title: "Dashboard",
-            subtitle: "View your activity and stats",
-            badgeHeader: "LIVE",
-            badgeHeaderClassName: "text-green-600 bg-green-100 border-green-300",
-            tabs: [
-              {
-                icon: w,
-                name: "Overview",
-                content: /* @__PURE__ */ a("div", { className: "space-y-3", children: [
-                  /* @__PURE__ */ e(t, { tag: "h5", children: "Overview Tab" }),
-                  /* @__PURE__ */ e(t, { tag: "p", children: "This is the overview content with charts and metrics." })
-                ] })
-              },
-              {
-                icon: m,
-                name: "Settings",
-                content: /* @__PURE__ */ a("div", { className: "space-y-3", children: [
-                  /* @__PURE__ */ e(t, { tag: "h5", children: "Settings Tab" }),
-                  /* @__PURE__ */ e(t, { tag: "p", children: "Configure your preferences here." })
-                ] })
-              }
-            ],
-            footerLabel: "Last updated: 2 minutes ago",
-            successButton: {
-              label: "Save",
-              onClick: () => i(!1)
-            },
-            onClose: () => i(!1)
-          }
-        )
-      ] }),
-      /* @__PURE__ */ a(n, { className: "p-4", children: [
-        /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "With Direct Content" }),
-        /* @__PURE__ */ e(c, { onClick: () => r(!0), children: "Open TabModal (Content)" }),
-        p && /* @__PURE__ */ e(
-          o,
-          {
-            icon: m,
-            title: "Preferences",
-            subtitle: "Manage your account settings",
-            content: /* @__PURE__ */ e("div", { className: "space-y-4", children: /* @__PURE__ */ a(t, { tag: "p", children: [
-              "When you pass the ",
-              /* @__PURE__ */ e("code", { children: "content" }),
-              " prop directly, the tab bar is hidden and this content fills the body."
-            ] }) }),
-            onClose: () => r(!1)
-          }
-        )
-      ] }),
-      /* @__PURE__ */ a(n, { className: "p-4", children: [
-        /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "Minimal (No Tabs, No Content)" }),
-        /* @__PURE__ */ e(c, { onClick: () => s(!0), children: "Open Minimal TabModal" }),
-        b && /* @__PURE__ */ e(
-          o,
-          {
-            title: "Confirmation",
-            successButton: {
-              label: "Confirm",
-              onClick: () => s(!1)
-            },
-            closeButton: {
-              label: "Cancel",
-              onClick: () => s(!1)
-            },
-            onClose: () => s(!1)
-          }
-        )
-      ] })
-    ] }) }) }) }),
-    /* @__PURE__ */ e(
-      C,
-      {
-        componentName: "TabModal",
-        title: "TabModal Playground",
-        defaultValues: {
-          title: "Modal Title",
-          subtitle: "Modal subtitle",
-          footerLabel: "Footer text",
-          closeLabel: "Cancel"
-        },
-        excludeProps: [
-          "onClose",
-          "tabs",
-          "content",
-          "icon",
-          "className",
-          "closeButton",
-          "successButton",
-          "badgeHeader",
-          "badgeHeaderClassName"
-        ],
-        children: (u) => /* @__PURE__ */ e(
-          o,
-          {
-            ...u,
-            onClose: () => {
-            },
-            tabs: [
-              {
-                title: "Tab 1",
-                content: /* @__PURE__ */ e(t, { tag: "p", children: "Content 1" })
-              },
-              {
-                title: "Tab 2",
-                content: /* @__PURE__ */ e(t, { tag: "p", children: "Content 2" })
-              }
-            ]
-          }
-        )
-      }
-    ),
-    /* @__PURE__ */ e(v, { componentName: "TabModal" }),
-    /* @__PURE__ */ e(n, { className: "overflow-hidden", children: /* @__PURE__ */ e(d, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
-      T,
-      {
-        language: "tsx",
-        code: `import { TabModal } from '@e-burgos/tucu-ui';
-import { Activity, BarChart3, Settings } from 'lucide-react';
-import { useState } from 'react';
-
-function MyComponent() {
-  const [isOpen, setIsOpen] = useState(false);
-
-  return (
-    <>
-      <button onClick={() => setIsOpen(true)}>Open</button>
-      {isOpen && (
-        <TabModal
-          icon={Activity}
-          title="Dashboard"
-          subtitle="Activity overview"
-          badgeHeader="LIVE"
-          tabs={[
-            {
-              icon: BarChart3,
-              name: 'Overview',
-              content: <div>Overview content</div>,
-            },
-            {
-              icon: Settings,
-              name: 'Settings',
-              content: <div>Settings content</div>,
-            },
-          ]}
-          footerLabel="Last updated: 2 min ago"
-          successButton={{ label: 'Save', onClick: () => setIsOpen(false) }}
-          onClose={() => setIsOpen(false)}
-        />
-      )}
-    </>
-  );
-}
-
-// Direct content (no tabs)
-<TabModal
-  title="Preferences"
-  content={<div>Direct body content</div>}
-  onClose={() => setIsOpen(false)}
-/>
-
-// With expandable footer label
-<TabModal
-  title="Details"
-  content={<div>Body</div>}
-  footerLabel="Long description that expands on click..."
-  onClose={() => setIsOpen(false)}
-/>`
-      }
-    ) }) }) })
-  ] });
-};
-export {
-  I as default
-};

package/documentation/TabSection-BdLxBPop.js

@@ -1,85 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),e=require("../index-DWDUS-PU.js"),n=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=()=>a.jsxs(a.Fragment,{children:[a.jsx(e.HeroCard,{title:"Tabs",description:`A flexible tab component system with multiple variants, smooth
-          animations, and mobile-responsive design built on Headless UI.`,icon:a.jsx("div",{className:"w-16 h-16 sm:w-20 sm:h-20 md:w-24 md:h-24 bg-linear-to-br from-purple-500 to-indigo-500 rounded-full flex items-center justify-center shadow-lg",children:a.jsx(n.LayoutList,{className:"w-8 h-8 sm:w-10 sm:h-10 md:w-12 md:h-12 text-white filter drop-shadow-lg"})})}),a.jsx(e.CardContainer,{className:"overflow-hidden",children:a.jsx(e.CardTitle,{title:"Variants",className:"mt-2 mb-2",children:a.jsx("div",{className:"w-full p-4 sm:p-6",children:a.jsxs("div",{className:"space-y-8",children:[a.jsxs("div",{children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Underline Variant (Default)"}),a.jsxs(e.TabGroup,{variant:"underline",children:[a.jsxs(e.TabList,{variant:"underline",children:[a.jsx(e.TabItem,{variant:"underline",children:"Overview"}),a.jsx(e.TabItem,{variant:"underline",children:"Details"}),a.jsx(e.TabItem,{variant:"underline",children:"Settings"})]}),a.jsxs(e.TabPanels,{children:[a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Overview content with clean underline design."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Detailed information with professional styling."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Settings panel with modern appearance."})})})]})]})]}),a.jsxs("div",{children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Pills Variant"}),a.jsxs(e.TabGroup,{variant:"pills",children:[a.jsxs(e.TabList,{variant:"pills",children:[a.jsx(e.TabItem,{variant:"pills",children:"Dashboard"}),a.jsx(e.TabItem,{variant:"pills",children:"Analytics"}),a.jsx(e.TabItem,{variant:"pills",children:"Reports"})]}),a.jsxs(e.TabPanels,{children:[a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Dashboard with rounded pill tabs for a modern look."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Analytics data with smooth transitions."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Reports section with clean design."})})})]})]})]}),a.jsxs("div",{children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Bordered Variant"}),a.jsxs(e.TabGroup,{variant:"bordered",children:[a.jsxs(e.TabList,{variant:"bordered",children:[a.jsx(e.TabItem,{variant:"bordered",children:"Account"}),a.jsx(e.TabItem,{variant:"bordered",children:"Security"}),a.jsx(e.TabItem,{variant:"bordered",children:"Billing"})]}),a.jsxs(e.TabPanels,{children:[a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Account settings with bordered tab style."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Security options with clear visual distinction."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Billing information with professional appearance."})})})]})]})]}),a.jsxs("div",{children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Solid Variant"}),a.jsxs(e.TabGroup,{variant:"solid",children:[a.jsxs(e.TabList,{variant:"solid",children:[a.jsx(e.TabItem,{variant:"solid",children:"Profile"}),a.jsx(e.TabItem,{variant:"solid",children:"Notifications"}),a.jsx(e.TabItem,{variant:"solid",children:"Privacy"})]}),a.jsxs(e.TabPanels,{children:[a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Profile section with solid background tabs."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Notifications center with modern design."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Privacy settings with clean interface."})})})]})]})]})]})})})}),a.jsx(e.CardContainer,{className:"overflow-hidden",children:a.jsx(e.CardTitle,{title:"With Icons",className:"mt-2 mb-2",children:a.jsx("div",{className:"w-full p-4 sm:p-6",children:a.jsxs("div",{className:"space-y-6",children:[a.jsxs("div",{children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Pills with Icons"}),a.jsxs(e.TabGroup,{variant:"pills",children:[a.jsxs(e.TabList,{variant:"pills",children:[a.jsx(e.TabItem,{variant:"pills",icon:a.jsx(n.Home,{size:16}),children:"Home"}),a.jsx(e.TabItem,{variant:"pills",icon:a.jsx(n.User,{size:16}),children:"Profile"}),a.jsx(e.TabItem,{variant:"pills",icon:a.jsx(n.Settings,{size:16}),children:"Settings"})]}),a.jsxs(e.TabPanels,{children:[a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Home dashboard content."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"User profile information."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Application settings."})})})]})]})]}),a.jsxs("div",{children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Bordered with Icons"}),a.jsxs(e.TabGroup,{variant:"bordered",children:[a.jsxs(e.TabList,{variant:"bordered",children:[a.jsx(e.TabItem,{variant:"bordered",icon:a.jsx(n.Mail,{size:16}),children:"Messages"}),a.jsx(e.TabItem,{variant:"bordered",icon:a.jsx(n.Bell,{size:16}),children:"Alerts"}),a.jsx(e.TabItem,{variant:"bordered",icon:a.jsx(n.Calendar,{size:16}),children:"Schedule"})]}),a.jsxs(e.TabPanels,{children:[a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Your messages and conversations."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"System alerts and notifications."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Calendar and scheduled events."})})})]})]})]})]})})})}),a.jsx(e.CardContainer,{className:"overflow-hidden",children:a.jsx(e.CardTitle,{title:"Sizes",className:"mt-2 mb-2",children:a.jsx("div",{className:"w-full p-4 sm:p-6",children:a.jsxs("div",{className:"space-y-6",children:[a.jsxs("div",{children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Small Size"}),a.jsxs(e.TabGroup,{variant:"pills",children:[a.jsxs(e.TabList,{variant:"pills",children:[a.jsx(e.TabItem,{variant:"pills",size:"small",children:"Tab 1"}),a.jsx(e.TabItem,{variant:"pills",size:"small",children:"Tab 2"}),a.jsx(e.TabItem,{variant:"pills",size:"small",children:"Tab 3"})]}),a.jsxs(e.TabPanels,{children:[a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Small size tabs content."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Compact design for space-constrained layouts."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Perfect for dense information displays."})})})]})]})]}),a.jsxs("div",{children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Large Size"}),a.jsxs(e.TabGroup,{variant:"pills",children:[a.jsxs(e.TabList,{variant:"pills",children:[a.jsx(e.TabItem,{variant:"pills",size:"large",children:"Tab 1"}),a.jsx(e.TabItem,{variant:"pills",size:"large",children:"Tab 2"}),a.jsx(e.TabItem,{variant:"pills",size:"large",children:"Tab 3"})]}),a.jsxs(e.TabPanels,{children:[a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Large size tabs content."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Prominent design for main navigation."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Great for primary interface elements."})})})]})]})]})]})})})}),a.jsx(e.CardContainer,{className:"overflow-hidden",children:a.jsx(e.CardTitle,{title:"States",className:"mt-2 mb-2",children:a.jsx("div",{className:"w-full p-4 sm:p-6",children:a.jsxs("div",{className:"space-y-6",children:[a.jsxs("div",{children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"With Disabled Tab"}),a.jsxs(e.TabGroup,{variant:"pills",children:[a.jsxs(e.TabList,{variant:"pills",children:[a.jsx(e.TabItem,{variant:"pills",children:"Active"}),a.jsx(e.TabItem,{variant:"pills",disabled:!0,children:"Disabled"}),a.jsx(e.TabItem,{variant:"pills",children:"Available"})]}),a.jsxs(e.TabPanels,{children:[a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Active tab content."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"This tab is disabled."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Available tab content."})})})]})]})]}),a.jsxs("div",{children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Color Variants"}),a.jsxs(e.TabGroup,{variant:"underline",children:[a.jsxs(e.TabList,{variant:"underline",children:[a.jsx(e.TabItem,{variant:"underline",color:"primary",children:"Primary"}),a.jsx(e.TabItem,{variant:"underline",color:"success",children:"Success"}),a.jsx(e.TabItem,{variant:"underline",color:"danger",children:"Danger"})]}),a.jsxs(e.TabPanels,{children:[a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Primary color theme."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Success color theme."})})}),a.jsx(e.TabPanel,{children:a.jsx(e.CardContainer,{className:"p-4",children:a.jsx(e.Typography,{tag:"p",children:"Danger color theme."})})})]})]})]})]})})})}),a.jsx(e.PropPlayground,{componentName:"TabGroup",title:"Tab Playground",defaultValues:{variant:"solid",defaultIndex:0},excludeProps:["onChange","selectedIndex","className"],children:i=>a.jsxs(e.TabGroup,{...i,children:[a.jsxs(e.TabList,{children:[a.jsx(e.TabItem,{children:"Tab 1"}),a.jsx(e.TabItem,{children:"Tab 2"}),a.jsx(e.TabItem,{children:"Tab 3"})]}),a.jsxs(e.TabPanels,{children:[a.jsx(e.TabPanel,{children:"Content 1"}),a.jsx(e.TabPanel,{children:"Content 2"}),a.jsx(e.TabPanel,{children:"Content 3"})]})]})}),a.jsx(e.AutoPropsTable,{componentName:"Tab"}),a.jsx(e.CardContainer,{className:"overflow-hidden",children:a.jsx(e.CardTitle,{title:"Code Examples",className:"mt-2 mb-2",children:a.jsx("div",{className:"w-full p-4 sm:p-6",children:a.jsx(e.CodeBlock,{language:"tsx",code:`import {
-  TabGroup,
-  TabList,
-  TabItem,
-  TabPanels,
-  TabPanel,
-} from '@e-burgos/tucu-ui';
-import { Home, User, Settings } from 'lucide-react';
-
-// Basic underline tabs
-<TabGroup variant="underline">
-  <TabList variant="underline">
-    <TabItem variant="underline">Tab 1</TabItem>
-    <TabItem variant="underline">Tab 2</TabItem>
-    <TabItem variant="underline">Tab 3</TabItem>
-  </TabList>
-  <TabPanels>
-    <TabPanel>Content 1</TabPanel>
-    <TabPanel>Content 2</TabPanel>
-    <TabPanel>Content 3</TabPanel>
-  </TabPanels>
-</TabGroup>
-
-// Pills variant with icons
-<TabGroup variant="pills">
-  <TabList variant="pills">
-    <TabItem variant="pills" icon={<Home size={16} />}>
-      Home
-    </TabItem>
-    <TabItem variant="pills" icon={<User size={16} />}>
-      Profile
-    </TabItem>
-    <TabItem variant="pills" icon={<Settings size={16} />}>
-      Settings
-    </TabItem>
-  </TabList>
-  <TabPanels>
-    <TabPanel>Home content</TabPanel>
-    <TabPanel>Profile content</TabPanel>
-    <TabPanel>Settings content</TabPanel>
-  </TabPanels>
-</TabGroup>
-
-// Bordered variant with sizes
-<TabGroup variant="bordered">
-  <TabList variant="bordered">
-    <TabItem variant="bordered" size="small">Small</TabItem>
-    <TabItem variant="bordered" size="medium">Medium</TabItem>
-    <TabItem variant="bordered" size="large">Large</TabItem>
-  </TabList>
-  <TabPanels>
-    <TabPanel>Small content</TabPanel>
-    <TabPanel>Medium content</TabPanel>
-    <TabPanel>Large content</TabPanel>
-  </TabPanels>
-</TabGroup>
-
-// Solid variant with disabled tab
-<TabGroup variant="solid">
-  <TabList variant="solid">
-    <TabItem variant="solid">Active</TabItem>
-    <TabItem variant="solid" disabled>Disabled</TabItem>
-    <TabItem variant="solid">Available</TabItem>
-  </TabList>
-  <TabPanels>
-    <TabPanel>Active content</TabPanel>
-    <TabPanel>Disabled content</TabPanel>
-    <TabPanel>Available content</TabPanel>
-  </TabPanels>
-</TabGroup>
-
-// With color variants
-<TabGroup variant="underline">
-  <TabList variant="underline">
-    <TabItem variant="underline" color="primary">Primary</TabItem>
-    <TabItem variant="underline" color="success">Success</TabItem>
-    <TabItem variant="underline" color="danger">Danger</TabItem>
-  </TabList>
-  <TabPanels>
-    <TabPanel>Primary content</TabPanel>
-    <TabPanel>Success content</TabPanel>
-    <TabPanel>Danger content</TabPanel>
-  </TabPanels>
-</TabGroup>`})})})})]});exports.default=s;