@e-burgos/tucu-ui 2.0.2 → 2.0.3

package/documentation/LoaderSection-Ch955wVE.js

@@ -0,0 +1,98 @@
+import { jsxs as e, Fragment as o, jsx as a } from "react/jsx-runtime";
+import { T as l, C as r, a as i, _ as s, s as c, A as t, c as m } from "../index-DsiBIFwo.js";
+import "lucide-react";
+import "react-router-dom";
+import "react";
+import "react-dom";
+const u = () => /* @__PURE__ */ e(o, { children: [
+  /* @__PURE__ */ e("div", { className: "text-center space-y-4", children: [
+    /* @__PURE__ */ a(l, { tag: "h2", className: "text-3xl md:text-4xl font-bold", children: "Loader" }),
+    /* @__PURE__ */ a(
+      l,
+      {
+        tag: "p",
+        className: "text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",
+        children: "A versatile loader component with multiple animation variants and sizes for indicating loading states."
+      }
+    )
+  ] }),
+  /* @__PURE__ */ a(r, { className: "overflow-hidden", children: /* @__PURE__ */ a(i, { title: "Basic Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
+    /* @__PURE__ */ e(r, { className: "p-4", children: [
+      /* @__PURE__ */ a(l, { tag: "h5", className: "mb-3", children: "Default Loader" }),
+      /* @__PURE__ */ a(s, {})
+    ] }),
+    /* @__PURE__ */ e(r, { className: "p-4", children: [
+      /* @__PURE__ */ a(l, { tag: "h5", className: "mb-3", children: "Small Loader" }),
+      /* @__PURE__ */ a(s, { size: "small" })
+    ] }),
+    /* @__PURE__ */ e(r, { className: "p-4", children: [
+      /* @__PURE__ */ a(l, { tag: "h5", className: "mb-3", children: "Large Loader" }),
+      /* @__PURE__ */ a(s, { size: "large" })
+    ] }),
+    /* @__PURE__ */ e(r, { className: "p-4", children: [
+      /* @__PURE__ */ a(l, { tag: "h5", className: "mb-3", children: "Three Dots Only" }),
+      /* @__PURE__ */ a(s, { showOnlyThreeDots: !0 })
+    ] })
+  ] }) }) }) }),
+  /* @__PURE__ */ a(r, { className: "overflow-hidden", children: /* @__PURE__ */ a(i, { title: "Variants", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
+    /* @__PURE__ */ e(r, { className: "p-4", children: [
+      /* @__PURE__ */ a(l, { tag: "h5", className: "mb-3", children: "Blink Variant" }),
+      /* @__PURE__ */ a(s, { variant: "blink" })
+    ] }),
+    /* @__PURE__ */ e(r, { className: "p-4", children: [
+      /* @__PURE__ */ a(l, { tag: "h5", className: "mb-3", children: "Scale Up Variant" }),
+      /* @__PURE__ */ a(s, { variant: "scaleUp" })
+    ] }),
+    /* @__PURE__ */ e(r, { className: "p-4", children: [
+      /* @__PURE__ */ a(l, { tag: "h5", className: "mb-3", children: "Move Up Variant" }),
+      /* @__PURE__ */ a(s, { variant: "moveUp" })
+    ] })
+  ] }) }) }) }),
+  /* @__PURE__ */ a(
+    c,
+    {
+      componentName: "Loader",
+      defaultValues: {
+        variant: "moveUp",
+        size: "medium",
+        color: "primary",
+        showOnlyThreeDots: !1,
+        tag: "div"
+      },
+      excludeProps: [],
+      children: (d) => /* @__PURE__ */ a(s, { ...d })
+    }
+  ),
+  /* @__PURE__ */ a(t, { componentName: "Loader" }),
+  /* @__PURE__ */ a(r, { className: "overflow-hidden", children: /* @__PURE__ */ a(i, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a(
+    m,
+    {
+      language: "tsx",
+      code: `import { Loader } from '@e-burgos/tucu-ui';
+
+// Basic usage
+<Loader />
+
+// Different sizes
+<Loader size="small" />
+<Loader size="medium" />
+<Loader size="large" />
+
+// Different variants
+<Loader variant="blink" />
+<Loader variant="scaleUp" />
+<Loader variant="moveUp" />
+
+// Different colors
+<Loader color="primary" />
+<Loader color="success" />
+<Loader color="danger" />
+
+// Three dots only
+<Loader showOnlyThreeDots />`
+    }
+  ) }) }) })
+] });
+export {
+  u as default
+};

package/documentation/LoaderSection-D6oWK2Bd.js

@@ -0,0 +1,22 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-D874Kozv.js");require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=()=>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:"Loader"}),e.jsx(a.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"A versatile loader component with multiple animation variants and sizes for indicating loading states."})]}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Basic Examples",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4",children:[e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Default Loader"}),e.jsx(a.Loader,{})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Small Loader"}),e.jsx(a.Loader,{size:"small"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Large Loader"}),e.jsx(a.Loader,{size:"large"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Three Dots Only"}),e.jsx(a.Loader,{showOnlyThreeDots:!0})]})]})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Variants",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-3 gap-4",children:[e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Blink Variant"}),e.jsx(a.Loader,{variant:"blink"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Scale Up Variant"}),e.jsx(a.Loader,{variant:"scaleUp"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Move Up Variant"}),e.jsx(a.Loader,{variant:"moveUp"})]})]})})})}),e.jsx(a.PropPlayground,{componentName:"Loader",defaultValues:{variant:"moveUp",size:"medium",color:"primary",showOnlyThreeDots:!1,tag:"div"},excludeProps:[],children:r=>e.jsx(a.Loader,{...r})}),e.jsx(a.AutoPropsTable,{componentName:"Loader"}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(a.CodeBlock,{language:"tsx",code:`import { Loader } from '@e-burgos/tucu-ui';
+
+// Basic usage
+<Loader />
+
+// Different sizes
+<Loader size="small" />
+<Loader size="medium" />
+<Loader size="large" />
+
+// Different variants
+<Loader variant="blink" />
+<Loader variant="scaleUp" />
+<Loader variant="moveUp" />
+
+// Different colors
+<Loader color="primary" />
+<Loader color="success" />
+<Loader color="danger" />
+
+// Three dots only
+<Loader showOnlyThreeDots />`})})})})]});exports.default=s;

package/{LogoSection-CiWXGv0N.mjs → documentation/LogoSection-DihjtnI3.js}

@@ -1,14 +1,14 @@
-import { jsxs as a, Fragment as r, jsx as e } from "react/jsx-runtime";
-import { T as s, C as o, a as i, a1 as t, B as d, c as m } from "./index-HwvOEWI7.mjs";
+import { jsxs as a, Fragment as n, jsx as e } from "react/jsx-runtime";
+import { T as t, C as s, a as l, a1 as o, s as m, A as r, c as d } from "../index-DsiBIFwo.js";
 import "lucide-react";
 import "react-router-dom";
 import "react";
 import "react-dom";
-const y = () => /* @__PURE__ */ a(r, { children: [
+const f = () => /* @__PURE__ */ a(n, { children: [
   /* @__PURE__ */ a("div", { className: "text-center space-y-4", children: [
-    /* @__PURE__ */ e(s, { tag: "h2", className: "text-3xl md:text-4xl font-bold", children: "Logo" }),
+    /* @__PURE__ */ e(t, { tag: "h2", className: "text-3xl md:text-4xl font-bold", children: "Logo" }),
     /* @__PURE__ */ e(
-      s,
+      t,
       {
         tag: "p",
         className: "text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",
@@ -16,46 +16,46 @@ const y = () => /* @__PURE__ */ a(r, { children: [
       }
     )
   ] }),
-  /* @__PURE__ */ e(o, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { 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(o, { className: "p-4", children: [
-      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Default Logo (uses defaults)" }),
-      /* @__PURE__ */ e(t, {})
+  /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { 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(s, { className: "p-4", children: [
+      /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "Default Logo (uses defaults)" }),
+      /* @__PURE__ */ e(o, {})
     ] }),
-    /* @__PURE__ */ a(o, { className: "p-4", children: [
-      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Custom Names" }),
-      /* @__PURE__ */ e(t, { name: "Custom", secondName: "App" })
+    /* @__PURE__ */ a(s, { className: "p-4", children: [
+      /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "Custom Names" }),
+      /* @__PURE__ */ e(o, { name: "Custom", secondName: "App" })
     ] }),
-    /* @__PURE__ */ a(o, { className: "p-4", children: [
-      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Different Sizes" }),
+    /* @__PURE__ */ a(s, { className: "p-4", children: [
+      /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "Different Sizes" }),
       /* @__PURE__ */ a("div", { className: "flex items-center gap-4 flex-wrap", children: [
-        /* @__PURE__ */ e(t, { name: "TUCU", size: "small" }),
-        /* @__PURE__ */ e(t, { name: "TUCU", size: "medium" }),
-        /* @__PURE__ */ e(t, { name: "TUCU", size: "large" }),
-        /* @__PURE__ */ e(t, { name: "TUCU", size: "xlarge" })
+        /* @__PURE__ */ e(o, { name: "TUCU", size: "small" }),
+        /* @__PURE__ */ e(o, { name: "TUCU", size: "medium" }),
+        /* @__PURE__ */ e(o, { name: "TUCU", size: "large" }),
+        /* @__PURE__ */ e(o, { name: "TUCU", size: "xlarge" })
       ] })
     ] }),
-    /* @__PURE__ */ a(o, { className: "p-4", children: [
-      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "With Custom Link Path" }),
-      /* @__PURE__ */ e(t, { name: "TUCU", path: "/home" })
+    /* @__PURE__ */ a(s, { className: "p-4", children: [
+      /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "With Custom Link Path" }),
+      /* @__PURE__ */ e(o, { name: "TUCU", path: "/home" })
     ] }),
-    /* @__PURE__ */ a(o, { className: "p-4", children: [
-      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Isotype Mode (First Letters Only)" }),
-      /* @__PURE__ */ e(t, { name: "TUCU", secondName: "UI", isoType: !0 })
+    /* @__PURE__ */ a(s, { className: "p-4", children: [
+      /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "Isotype Mode (First Letters Only)" }),
+      /* @__PURE__ */ e(o, { name: "TUCU", secondName: "UI", isoType: !0 })
     ] }),
-    /* @__PURE__ */ a(o, { className: "p-4", children: [
-      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "With Custom Classes" }),
+    /* @__PURE__ */ a(s, { className: "p-4", children: [
+      /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "With Custom Classes" }),
       /* @__PURE__ */ e(
-        t,
+        o,
         {
           name: "TUCU",
           className: "opacity-80 hover:opacity-100 transition-opacity"
         }
       )
     ] }),
-    /* @__PURE__ */ a(o, { className: "p-4", children: [
-      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Custom Logo Component" }),
+    /* @__PURE__ */ a(s, { className: "p-4", children: [
+      /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "Custom Logo Component" }),
       /* @__PURE__ */ e(
-        t,
+        o,
         {
           name: "MY",
           secondName: "APP",
@@ -64,11 +64,11 @@ const y = () => /* @__PURE__ */ a(r, { children: [
       )
     ] })
   ] }) }) }) }),
-  /* @__PURE__ */ e(o, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Advanced 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(o, { className: "p-4", children: [
-      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Custom Logo with SVG Icon" }),
+  /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "Advanced 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(s, { className: "p-4", children: [
+      /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "Custom Logo with SVG Icon" }),
       /* @__PURE__ */ e(
-        t,
+        o,
         {
           name: "COMPANY",
           secondName: "LLC",
@@ -120,10 +120,10 @@ const y = () => /* @__PURE__ */ a(r, { children: [
         }
       )
     ] }),
-    /* @__PURE__ */ a(o, { className: "p-4", children: [
-      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Custom Logo with Image" }),
+    /* @__PURE__ */ a(s, { className: "p-4", children: [
+      /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "Custom Logo with Image" }),
       /* @__PURE__ */ e(
-        t,
+        o,
         {
           name: "COMPANY",
           secondName: "",
@@ -131,84 +131,32 @@ const y = () => /* @__PURE__ */ a(r, { children: [
         }
       )
     ] }),
-    /* @__PURE__ */ a(o, { className: "p-4", children: [
-      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Only Primary Name" }),
-      /* @__PURE__ */ e(t, { name: "MYAPP", secondName: "" })
+    /* @__PURE__ */ a(s, { className: "p-4", children: [
+      /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "Only Primary Name" }),
+      /* @__PURE__ */ e(o, { name: "MYAPP", secondName: "" })
     ] }),
-    /* @__PURE__ */ a(o, { className: "p-4", children: [
-      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Only Secondary Name" }),
-      /* @__PURE__ */ e(t, { name: "", secondName: "BRAND" })
+    /* @__PURE__ */ a(s, { className: "p-4", children: [
+      /* @__PURE__ */ e(t, { tag: "h5", className: "mb-3", children: "Only Secondary Name" }),
+      /* @__PURE__ */ e(o, { name: "", secondName: "BRAND" })
     ] })
   ] }) }) }) }),
-  /* @__PURE__ */ e(o, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Props", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(d, { columns: [
-    {
-      key: "prop",
-      label: "Prop",
-      render: (l) => /* @__PURE__ */ e("code", { className: "text-xs text-brand", children: String(l) })
-    },
-    {
-      key: "type",
-      label: "Type",
-      render: (l) => /* @__PURE__ */ e("code", { className: "text-xs", children: String(l) })
-    },
-    {
-      key: "default",
-      label: "Default",
-      render: (l) => {
-        const n = String(l);
-        return n === "required" ? /* @__PURE__ */ e("span", { className: "text-xs text-red-500", children: "required" }) : /* @__PURE__ */ e("code", { className: "text-xs", children: n });
-      }
-    },
-    {
-      key: "description",
-      label: "Description"
-    }
-  ], data: [
-    {
-      prop: "name",
-      type: "string",
-      default: "-",
-      description: 'Primary logo text. Defaults to "TUCU" if not provided'
-    },
-    {
-      prop: "secondName",
-      type: "string",
-      default: "-",
-      description: 'Secondary logo text. Defaults to "UI" if not provided'
-    },
-    {
-      prop: "path",
-      type: "string",
-      default: "'/'",
-      description: "Link path for the logo anchor link"
-    },
-    {
-      prop: "className",
-      type: "string",
-      default: "-",
-      description: "Additional CSS classes for the logo container"
-    },
-    {
-      prop: "size",
-      type: "'small' | 'medium' | 'large' | 'xlarge'",
-      default: "'medium'",
-      description: "Size of the logo. Affects both icon and text sizes"
-    },
-    {
-      prop: "logo",
-      type: "React.ReactNode | null",
-      default: "null",
-      description: "Custom logo component to replace the default TucuUiLogo"
-    },
+  /* @__PURE__ */ e(
+    m,
     {
-      prop: "isoType",
-      type: "boolean",
-      default: "false",
-      description: "Show only the first letter of each name (isotype mode)"
+      componentName: "Logo",
+      defaultValues: {
+        name: "Tucu",
+        secondName: "UI",
+        size: "medium",
+        isoType: !1
+      },
+      excludeProps: ["path", "logo", "preset"],
+      children: (i) => /* @__PURE__ */ e(o, { ...i })
     }
-  ] }) }) }) }),
-  /* @__PURE__ */ e(o, { 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(
-    m,
+  ),
+  /* @__PURE__ */ e(r, { componentName: "Logo" }),
+  /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(l, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
+    d,
     {
       language: "tsx",
       code: `import { Logo } from '@e-burgos/tucu-ui';
@@ -315,5 +263,5 @@ const y = () => /* @__PURE__ */ a(r, { children: [
   ) }) }) })
 ] });
 export {
-  y as default
+  f as default
 };

package/documentation/LogoSection-DwxPyRYp.js

@@ -0,0 +1,100 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-D874Kozv.js");require("lucide-react");require("react-router-dom");require("react");require("react-dom");const a=()=>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:"Logo"}),e.jsx(s.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"A flexible logo component that automatically adapts to light/dark mode and supports various sizes and configurations."})]}),e.jsx(s.CardContainer,{className:"overflow-hidden",children:e.jsx(s.CardTitle,{title:"Basic Examples",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Default Logo (uses defaults)"}),e.jsx(s.Logo,{})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Custom Names"}),e.jsx(s.Logo,{name:"Custom",secondName:"App"})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Different Sizes"}),e.jsxs("div",{className:"flex items-center gap-4 flex-wrap",children:[e.jsx(s.Logo,{name:"TUCU",size:"small"}),e.jsx(s.Logo,{name:"TUCU",size:"medium"}),e.jsx(s.Logo,{name:"TUCU",size:"large"}),e.jsx(s.Logo,{name:"TUCU",size:"xlarge"})]})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"With Custom Link Path"}),e.jsx(s.Logo,{name:"TUCU",path:"/home"})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Isotype Mode (First Letters Only)"}),e.jsx(s.Logo,{name:"TUCU",secondName:"UI",isoType:!0})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"With Custom Classes"}),e.jsx(s.Logo,{name:"TUCU",className:"opacity-80 hover:opacity-100 transition-opacity"})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Custom Logo Component"}),e.jsx(s.Logo,{name:"MY",secondName:"APP",logo:e.jsx("div",{className:"w-16 h-16 bg-linear-to-br from-blue-500 to-purple-600 rounded-lg flex items-center justify-center text-white font-bold text-xl shadow-lg",children:"M"})})]})]})})})}),e.jsx(s.CardContainer,{className:"overflow-hidden",children:e.jsx(s.CardTitle,{title:"Advanced Examples",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Custom Logo with SVG Icon"}),e.jsx(s.Logo,{name:"COMPANY",secondName:"LLC",logo:e.jsxs("svg",{width:"64",height:"64",viewBox:"0 0 64 64",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"rounded-lg",children:[e.jsx("rect",{width:"64",height:"64",rx:"12",fill:"url(#gradient)"}),e.jsx("defs",{children:e.jsxs("linearGradient",{id:"gradient",x1:"0",y1:"0",x2:"64",y2:"64",children:[e.jsx("stop",{offset:"0%",stopColor:"#3B82F6"}),e.jsx("stop",{offset:"100%",stopColor:"#8B5CF6"})]})}),e.jsx("path",{d:"M32 20L40 28L32 36L24 28L32 20Z",fill:"white"}),e.jsx("path",{d:"M20 32L28 40L36 32L28 24L20 32Z",fill:"white",opacity:"0.8"})]})})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Custom Logo with Image"}),e.jsx(s.Logo,{name:"COMPANY",secondName:"",logo:e.jsx("div",{className:"w-16 h-16 bg-linear-to-br from-indigo-500 via-purple-500 to-pink-500 rounded-xl flex items-center justify-center text-white font-bold text-2xl shadow-lg border-2 border-white/20",children:"C"})})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Only Primary Name"}),e.jsx(s.Logo,{name:"MYAPP",secondName:""})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"Only Secondary Name"}),e.jsx(s.Logo,{name:"",secondName:"BRAND"})]})]})})})}),e.jsx(s.PropPlayground,{componentName:"Logo",defaultValues:{name:"Tucu",secondName:"UI",size:"medium",isoType:!1},excludeProps:["path","logo","preset"],children:o=>e.jsx(s.Logo,{...o})}),e.jsx(s.AutoPropsTable,{componentName:"Logo"}),e.jsx(s.CardContainer,{className:"overflow-hidden",children:e.jsx(s.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(s.CodeBlock,{language:"tsx",code:`import { Logo } from '@e-burgos/tucu-ui';
+
+// Default usage (uses "TUCU" and "UI" as defaults)
+<Logo />
+
+// Custom names
+<Logo name="Custom" secondName="App" />
+
+// Different sizes
+<Logo name="TUCU" size="small" />
+<Logo name="TUCU" size="medium" />
+<Logo name="TUCU" size="large" />
+<Logo name="TUCU" size="xlarge" />
+
+// With custom link path
+<Logo name="TUCU" path="/home" />
+
+// Isotype mode (shows only first letters)
+<Logo name="TUCU" secondName="UI" isoType />
+
+// With custom CSS classes
+<Logo 
+  name="TUCU" 
+  className="opacity-80 hover:opacity-100 transition-opacity" 
+/>
+
+// With custom logo component (ReactNode)
+<Logo
+  name="MY"
+  secondName="APP"
+  logo={
+    <div className="w-16 h-16 bg-linear-to-br from-blue-500 to-purple-600 rounded-lg flex items-center justify-center text-white font-bold text-xl shadow-lg">
+      M
+    </div>
+  }
+/>
+
+// With custom SVG logo
+<Logo
+  name="COMPANY"
+  secondName="LLC"
+  logo={
+    <svg
+      width="64"
+      height="64"
+      viewBox="0 0 64 64"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className="rounded-lg"
+    >
+      <rect
+        width="64"
+        height="64"
+        rx="12"
+        fill="url(#gradient)"
+      />
+      <defs>
+        <linearGradient
+          id="gradient"
+          x1="0"
+          y1="0"
+          x2="64"
+          y2="64"
+        >
+          <stop offset="0%" stopColor="#3B82F6" />
+          <stop offset="100%" stopColor="#8B5CF6" />
+        </linearGradient>
+      </defs>
+      <path d="M32 20L40 28L32 36L24 28L32 20Z" fill="white" />
+      <path
+        d="M20 32L28 40L36 32L28 24L20 32Z"
+        fill="white"
+        opacity="0.8"
+      />
+    </svg>
+  }
+/>
+
+// Custom logo with image/div component
+<Logo
+  name="COMPANY"
+  secondName=""
+  logo={
+    <div className="w-16 h-16 bg-linear-to-br from-indigo-500 via-purple-500 to-pink-500 rounded-xl flex items-center justify-center text-white font-bold text-2xl shadow-lg border-2 border-white/20">
+      C
+    </div>
+  }
+/>
+
+// Only primary name (empty secondName)
+<Logo name="MYAPP" secondName="" />
+
+// Only secondary name (empty name)
+<Logo name="" secondName="BRAND" />
+
+// The component automatically:
+// - Adapts to light/dark mode
+// - Shows TucuUiLogo icon when no custom logo is provided
+// - Defaults to "TUCU" and "UI" if names are undefined
+// - Handles empty strings for name or secondName`})})})})]});exports.default=a;

package/{LucideIconsSection-tkVj8_2g.mjs → documentation/LucideIconsSection-UTZdlP4l.js}

@@ -1,6 +1,6 @@
 import { jsxs as o, jsx as e } from "react/jsx-runtime";
 import { useState as d } from "react";
-import { T as t, C as p, a as h } from "./index-HwvOEWI7.mjs";
+import { T as t, C as p, a as h } from "../index-DsiBIFwo.js";
 import { Home as w, Menu as g, ArrowLeft as x, ArrowRight as N, ChevronUp as u, ChevronDown as v, Grid3X3 as f, List as y, Navigation as C, Plus as b, Minus as L, X as k, Check as I, Edit as T, Trash2 as A, Download as D, Upload as M, Zap as R } from "lucide-react";
 import "react-router-dom";
 import "react-dom";

package/documentation/LucideIconsSection-jyTOH9vA.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),d=require("react"),o=require("../index-D874Kozv.js"),s=require("lucide-react");require("react-router-dom");require("react-dom");const p=()=>{const[r,c]=d.useState(null),i=[{category:"Navigation & Layout",description:"Essential navigation and layout icons from Lucide",icon:e.jsx(s.Navigation,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),color:"from-blue-500 via-indigo-500 to-purple-500",icons:[{name:"Home",component:e.jsx(s.Home,{className:"w-6 h-6"})},{name:"Menu",component:e.jsx(s.Menu,{className:"w-6 h-6"})},{name:"ArrowLeft",component:e.jsx(s.ArrowLeft,{className:"w-6 h-6"})},{name:"ArrowRight",component:e.jsx(s.ArrowRight,{className:"w-6 h-6"})},{name:"ChevronUp",component:e.jsx(s.ChevronUp,{className:"w-6 h-6"})},{name:"ChevronDown",component:e.jsx(s.ChevronDown,{className:"w-6 h-6"})},{name:"Grid",component:e.jsx(s.Grid3X3,{className:"w-6 h-6"})},{name:"List",component:e.jsx(s.List,{className:"w-6 h-6"})}]},{category:"Actions & Controls",description:"Common action and control icons from Lucide",icon:e.jsx(s.Zap,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),color:"from-purple-500 via-pink-500 to-rose-500",icons:[{name:"Plus",component:e.jsx(s.Plus,{className:"w-6 h-6"})},{name:"Minus",component:e.jsx(s.Minus,{className:"w-6 h-6"})},{name:"X",component:e.jsx(s.X,{className:"w-6 h-6"})},{name:"Check",component:e.jsx(s.Check,{className:"w-6 h-6"})},{name:"Edit",component:e.jsx(s.Edit,{className:"w-6 h-6"})},{name:"Trash2",component:e.jsx(s.Trash2,{className:"w-6 h-6"})},{name:"Download",component:e.jsx(s.Download,{className:"w-6 h-6"})},{name:"Upload",component:e.jsx(s.Upload,{className:"w-6 h-6"})}]}],l=a=>{const t=`<LucideIcons.${a} className="w-6 h-6" />`;navigator.clipboard.writeText(t),c(a),setTimeout(()=>c(null),2e3)};return e.jsxs("div",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center space-y-4",children:[e.jsx(o.Typography,{tag:"h2",className:"text-3xl md:text-4xl font-bold",children:"Lucide React Icons"}),e.jsx(o.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"Popular icons from the Lucide React library (5000+ available)"})]}),e.jsx("div",{className:"space-y-8",children:i.map((a,t)=>e.jsx(o.CardContainer,{className:"overflow-hidden",children:e.jsx(o.CardTitle,{title:a.category,className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full space-y-6 p-4 sm:p-6",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:`p-2 rounded-lg bg-linear-to-br ${a.color} shadow-lg`,children:a.icon}),e.jsxs("div",{children:[e.jsx(o.Typography,{tag:"h3",className:"text-xl font-semibold",children:a.category}),e.jsx(o.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:a.description})]})]}),e.jsx("div",{className:"grid grid-cols-4 sm:grid-cols-6 md:grid-cols-8 gap-4",children:a.icons.map((n,m)=>e.jsxs("div",{className:"flex flex-col items-center gap-2 p-3 rounded-lg hover:bg-gray-50 dark:hover:bg-gray-800 transition-colors cursor-pointer group relative",onClick:()=>l(n.name),title:`Click to copy: LucideIcons.${n.name}`,children:[e.jsx("div",{className:"text-gray-700 dark:text-gray-300 group-hover:text-brand transition-colors",children:n.component}),e.jsx(o.Typography,{tag:"span",className:"text-xs text-center text-gray-500 dark:text-gray-400",children:n.name}),r===n.name&&e.jsx("div",{className:"absolute -top-8 left-1/2 transform -translate-x-1/2 px-2 py-1 bg-green-500 text-white text-xs rounded whitespace-nowrap z-10",children:"Copied!"})]},m))})]})})},t))})]})};exports.default=p;

package/{MFESupportSection-Dn9acP8Z.mjs → documentation/MFESupportSection-CL4XaGSc.js}

@@ -1,5 +1,5 @@
 import { jsx as e, jsxs as r } from "react/jsx-runtime";
-import { C as t, a as o, T as a, a4 as d, c as s } from "./index-HwvOEWI7.mjs";
+import { C as t, a as o, T as a, a4 as d, c as s } from "../index-DsiBIFwo.js";
 import { Box as n, Info as c, Code as l, Settings as p, Play as m, Zap as h, Shield as g, CheckCircle as i } from "lucide-react";
 import "react-router-dom";
 import "react";

package/{MFESupportSection-aHdgyVxJ.js → documentation/MFESupportSection-D5-xNtty.js}

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("./index-BOfUOCHe.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const t=()=>e.jsx("div",{className:"space-y-8",children:e.jsx(r.CardContainer,{children:e.jsx(r.CardTitle,{title:"Micro Frontends (MFE) Support",className:"mt-2 mb-6",children:e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-purple-500 to-indigo-500 shadow-lg",children:e.jsx(a.Box,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(r.Typography,{tag:"h4",className:"font-semibold",children:"Micro Frontend (MFE) Pattern"})]}),e.jsxs(r.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:["The ",e.jsx("strong",{children:"Micro Frontend (MFE) Pattern"})," is designed for distributed architectures where multiple applications need to be deployed independently. It requires explicit route configuration with"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"appRoutesConfig"})," ","and a"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"basePath"}),". Perfect for micro frontend architectures that need route isolation, authentication boundaries, and independent deployments."]}),e.jsx(r.Alert,{variant:"info",dismissible:!1,children:e.jsxs("div",{className:"flex flex-col gap-2",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(a.Info,{className:"w-4 h-4"}),e.jsx(r.Typography,{tag:"span",className:"font-semibold",children:"MFE Mode Requirements"})]}),e.jsxs(r.Typography,{tag:"p",className:"text-sm",children:["When using"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:'architecturalPatterns="mfe"'}),", you must provide"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"basePath"})," ","and"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"appRoutesConfig"}),". TypeScript will enforce these requirements at compile time."]})]})}),e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-indigo-500 to-purple-500 shadow-lg",children:e.jsx(a.Code,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(r.Typography,{tag:"h4",className:"font-semibold",children:"Conditional TypeScript Types"})]}),e.jsxs(r.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:["The ThemeProvider uses discriminated unions to automatically enforce the correct props based on"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"architecturalPatterns"}),'. When set to "mfe", TypeScript requires MFE-specific props.']}),e.jsx(r.CodeBlock,{language:"typescript",code:`// Conditional TypeScript Types
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../index-D874Kozv.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const t=()=>e.jsx("div",{className:"space-y-8",children:e.jsx(r.CardContainer,{children:e.jsx(r.CardTitle,{title:"Micro Frontends (MFE) Support",className:"mt-2 mb-6",children:e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-purple-500 to-indigo-500 shadow-lg",children:e.jsx(a.Box,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(r.Typography,{tag:"h4",className:"font-semibold",children:"Micro Frontend (MFE) Pattern"})]}),e.jsxs(r.Typography,{tag:"p",className:"text-gray-600 dark:text-gray-400",children:["The ",e.jsx("strong",{children:"Micro Frontend (MFE) Pattern"})," is designed for distributed architectures where multiple applications need to be deployed independently. It requires explicit route configuration with"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"appRoutesConfig"})," ","and a"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"basePath"}),". Perfect for micro frontend architectures that need route isolation, authentication boundaries, and independent deployments."]}),e.jsx(r.Alert,{variant:"info",dismissible:!1,children:e.jsxs("div",{className:"flex flex-col gap-2",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(a.Info,{className:"w-4 h-4"}),e.jsx(r.Typography,{tag:"span",className:"font-semibold",children:"MFE Mode Requirements"})]}),e.jsxs(r.Typography,{tag:"p",className:"text-sm",children:["When using"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:'architecturalPatterns="mfe"'}),", you must provide"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"basePath"})," ","and"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"appRoutesConfig"}),". TypeScript will enforce these requirements at compile time."]})]})}),e.jsxs("div",{className:"space-y-6",children:[e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"p-2 rounded-lg bg-linear-to-br from-indigo-500 to-purple-500 shadow-lg",children:e.jsx(a.Code,{className:"w-5 h-5 text-white filter drop-shadow-sm"})}),e.jsx(r.Typography,{tag:"h4",className:"font-semibold",children:"Conditional TypeScript Types"})]}),e.jsxs(r.Typography,{tag:"p",className:"text-sm text-gray-600 dark:text-gray-400",children:["The ThemeProvider uses discriminated unions to automatically enforce the correct props based on"," ",e.jsx("code",{className:"px-1 py-0.5 border border-gray-300 dark:border-gray-600 rounded text-xs",children:"architecturalPatterns"}),'. When set to "mfe", TypeScript requires MFE-specific props.']}),e.jsx(r.CodeBlock,{language:"typescript",code:`// Conditional TypeScript Types
 // The ThemeProvider automatically infers the correct props based on architecturalPatterns
 
 // MFE Pattern