@e-burgos/tucu-ui 2.0.2 → 2.0.4

package/documentation/TooltipSection-BeW0mvEG.js

@@ -0,0 +1,62 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),o=require("../index-QnI4b7wS.js");require("lucide-react");require("react-router-dom");require("react");require("react-dom");const r=()=>t.jsxs(t.Fragment,{children:[t.jsxs("div",{className:"text-center space-y-4",children:[t.jsx(o.Typography,{tag:"h2",className:"text-3xl md:text-4xl font-bold",children:"Tooltip"}),t.jsx(o.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"A portal-based tooltip component that renders above all other DOM elements. Supports configurable placement, arrow, color themes, and delays."})]}),t.jsx(o.CardContainer,{className:"overflow-hidden",children:t.jsx(o.CardTitle,{title:"Placement",className:"mt-2 mb-2",children:t.jsx("div",{className:"w-full p-4 sm:p-6",children:t.jsxs("div",{className:"flex flex-wrap items-center justify-center gap-4",children:[t.jsx(o.Tooltip,{content:"Top tooltip",placement:"top",arrow:!0,children:t.jsx(o.Button,{variant:"ghost",size:"small",children:"Top"})}),t.jsx(o.Tooltip,{content:"Bottom tooltip",placement:"bottom",arrow:!0,children:t.jsx(o.Button,{variant:"ghost",size:"small",children:"Bottom"})}),t.jsx(o.Tooltip,{content:"Left tooltip",placement:"left",arrow:!0,children:t.jsx(o.Button,{variant:"ghost",size:"small",children:"Left"})}),t.jsx(o.Tooltip,{content:"Right tooltip",placement:"right",arrow:!0,children:t.jsx(o.Button,{variant:"ghost",size:"small",children:"Right"})})]})})})}),t.jsx(o.CardContainer,{className:"overflow-hidden",children:t.jsx(o.CardTitle,{title:"Color Themes",className:"mt-2 mb-2",children:t.jsx("div",{className:"w-full p-4 sm:p-6",children:t.jsxs("div",{className:"flex flex-wrap items-center justify-center gap-4",children:[t.jsx(o.Tooltip,{content:"Auto (uses theme mode)",arrow:!0,children:t.jsx(o.Button,{variant:"ghost",size:"small",children:"Auto"})}),t.jsx(o.Tooltip,{content:"Dark theme",color:"dark",arrow:!0,children:t.jsx(o.Button,{variant:"ghost",size:"small",children:"Dark"})}),t.jsx(o.Tooltip,{content:"Light theme",color:"light",arrow:!0,children:t.jsx(o.Button,{variant:"ghost",size:"small",children:"Light"})}),t.jsx(o.Tooltip,{content:"Primary color",color:"primary",arrow:!0,children:t.jsx(o.Button,{variant:"ghost",size:"small",color:"primary",children:"Primary"})}),t.jsx(o.Tooltip,{content:"Success message",color:"success",arrow:!0,children:t.jsx(o.Button,{variant:"ghost",size:"small",color:"success",children:"Success"})}),t.jsx(o.Tooltip,{content:"Info message",color:"info",arrow:!0,children:t.jsx(o.Button,{variant:"ghost",size:"small",color:"info",children:"Info"})}),t.jsx(o.Tooltip,{content:"Warning message",color:"warning",arrow:!0,children:t.jsx(o.Button,{variant:"ghost",size:"small",color:"warning",children:"Warning"})}),t.jsx(o.Tooltip,{content:"Danger message",color:"danger",arrow:!0,children:t.jsx(o.Button,{variant:"ghost",size:"small",color:"danger",children:"Danger"})})]})})})}),t.jsx(o.CardContainer,{className:"overflow-hidden",children:t.jsx(o.CardTitle,{title:"Arrow Options",className:"mt-2 mb-2",children:t.jsx("div",{className:"w-full p-4 sm:p-6",children:t.jsxs("div",{className:"flex flex-wrap items-center justify-center gap-4",children:[t.jsx(o.Tooltip,{content:"With arrow",arrow:!0,children:t.jsx(o.Button,{variant:"ghost",size:"small",color:"info",children:"With Arrow"})}),t.jsx(o.Tooltip,{content:"Without arrow",arrow:!1,children:t.jsx(o.Button,{variant:"ghost",size:"small",color:"info",children:"No Arrow"})})]})})})}),t.jsx(o.CardContainer,{className:"overflow-hidden",children:t.jsx(o.CardTitle,{title:"Rich Content",className:"mt-2 mb-2",children:t.jsx("div",{className:"w-full p-4 sm:p-6",children:t.jsxs("div",{className:"flex flex-wrap items-center justify-center gap-4",children:[t.jsx(o.Tooltip,{content:t.jsxs("div",{className:"space-y-1",children:[t.jsx(o.Typography,{tag:"strong",className:"text-xs",children:"Rich Tooltip"}),t.jsx(o.Typography,{tag:"p",className:"text-xs opacity-80",children:"Supports any React node as content."})]}),placement:"bottom",color:"light",arrow:!0,children:t.jsx(o.Button,{variant:"ghost",size:"small",color:"success",children:"Rich Content"})}),t.jsx(o.Tooltip,{content:"Delayed tooltip",enterDelay:500,arrow:!0,children:t.jsx(o.Button,{variant:"ghost",size:"small",color:"warning",children:"500ms Delay"})})]})})})}),t.jsx(o.CardContainer,{className:"overflow-hidden",children:t.jsx(o.CardTitle,{title:"Component Integration",className:"mt-2 mb-2",children:t.jsx("div",{className:"w-full p-4 sm:p-6",children:t.jsxs("div",{className:"space-y-4",children:[t.jsxs(o.CardContainer,{className:"p-4",children:[t.jsx(o.Typography,{tag:"h5",className:"mb-3",children:"Button with tooltip prop"}),t.jsxs("div",{className:"flex flex-wrap gap-4",children:[t.jsx(o.Button,{tooltip:"Save changes",tooltipPlacement:"top",children:"Save"}),t.jsx(o.Button,{tooltip:"Delete item",tooltipPlacement:"bottom",tooltipColor:"light",color:"danger",children:"Delete"})]})]}),t.jsxs(o.CardContainer,{className:"p-4",children:[t.jsx(o.Typography,{tag:"h5",className:"mb-3",children:"Typography with tooltip prop"}),t.jsxs("div",{className:"flex flex-wrap gap-4 items-center",children:[t.jsx(o.Typography,{tag:"span",tooltip:"This is an abbreviation",tooltipPlacement:"top",className:"underline decoration-dotted cursor-help",children:"Hover this text"}),t.jsx(o.Typography,{tag:"strong",tooltip:"Important information",tooltipPlacement:"right",tooltipColor:"light",children:"Bold with tooltip"})]})]})]})})})}),t.jsx(o.PropPlayground,{componentName:"Tooltip",defaultValues:{placement:"top",color:"primary",arrow:!0,disabled:!1,enterDelay:0,leaveDelay:100},excludeProps:["children","content"],children:e=>t.jsx(o.Tooltip,{...e,content:"Tooltip preview text",children:t.jsx(o.Button,{children:"Hover me"})})}),t.jsx(o.AutoPropsTable,{componentName:"Tooltip"}),t.jsx(o.CardContainer,{className:"overflow-hidden",children:t.jsx(o.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:t.jsx("div",{className:"w-full p-4 sm:p-6",children:t.jsx(o.CodeBlock,{language:"tsx",code:`import { Tooltip, Button, Typography } from '@e-burgos/tucu-ui';
+
+// Standalone Tooltip wrapping any element
+<Tooltip content="Hello!" placement="top" arrow>
+  <Button>Hover me</Button>
+</Tooltip>
+
+// Auto color — adapts to current theme (dark in light mode, light in dark mode)
+<Tooltip content="Auto color">
+  <Button>Auto</Button>
+</Tooltip>
+
+// Semantic color variants
+<Tooltip content="Primary" color="primary" arrow>
+  <Button>Primary</Button>
+</Tooltip>
+<Tooltip content="Success!" color="success" arrow>
+  <Button>Success</Button>
+</Tooltip>
+<Tooltip content="Warning" color="warning" arrow>
+  <Button>Warning</Button>
+</Tooltip>
+<Tooltip content="Danger!" color="danger" arrow>
+  <Button>Danger</Button>
+</Tooltip>
+<Tooltip content="Info" color="info" arrow>
+  <Button>Info</Button>
+</Tooltip>
+
+// Without arrow
+<Tooltip content="No arrow" arrow={false}>
+  <Button>No arrow</Button>
+</Tooltip>
+
+// Rich content
+<Tooltip
+  content={
+    <div>
+      <strong>Title</strong>
+      <p>Description</p>
+    </div>
+  }
+  placement="right"
+  color="light"
+  arrow
+>
+  <Button>Rich</Button>
+</Tooltip>
+
+// Enter delay
+<Tooltip content="Delayed" enterDelay={500} arrow>
+  <Button>500ms delay</Button>
+</Tooltip>
+
+// Built-in tooltip props on Button (with arrow control)
+<Button tooltip="Save" tooltipPlacement="top" tooltipArrow={false}>Save</Button>
+<Button tooltip="Delete" tooltipColor="danger">Delete</Button>
+
+// Built-in tooltip props on Typography
+<Typography tag="span" tooltip="Info" tooltipPlacement="right" tooltipArrow>
+  Hover text
+</Typography>`})})})})]});exports.default=r;

package/documentation/TopupButtonSection-C419_R5w.js

@@ -0,0 +1,24 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-QnI4b7wS.js"),s=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const l=()=>e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:"text-center space-y-4",children:[e.jsx(a.Typography,{tag:"h2",className:"text-3xl md:text-4xl font-bold",children:"TopupButton"}),e.jsx(a.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"A specialized button component for top-up or recharge actions, with support for icons and links."})]}),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:"Basic Topup Button"}),e.jsx(a.TopupButton,{label:"Add Funds"})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Icon"}),e.jsx(a.TopupButton,{label:"Top Up Account",icon:e.jsx(s.Plus,{className:"w-4 h-4"})})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Link"}),e.jsx(a.TopupButton,{label:"Recharge Now",href:"/topup",icon:e.jsx(s.CreditCard,{className:"w-4 h-4"})})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With onClick Handler"}),e.jsx(a.TopupButton,{label:"Add Balance",icon:e.jsx(s.Wallet,{className:"w-4 h-4"}),onClick:()=>console.log("Topup clicked")})]})]})})})}),e.jsx(a.PropPlayground,{componentName:"TopupButton",defaultValues:{label:"Top Up"},excludeProps:["onClick","icon"],children:o=>e.jsx(a.TopupButton,{...o})}),e.jsx(a.AutoPropsTable,{componentName:"TopupButton"}),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 { TopupButton, LucideIcons } from '@e-burgos/tucu-ui';
+
+// Basic usage
+<TopupButton label="Add Funds" />
+
+// With icon
+<TopupButton
+  label="Top Up Account"
+  icon={<LucideIcons.Plus className="w-4 h-4" />}
+/>
+
+// With link
+<TopupButton
+  label="Recharge Now"
+  href="/topup"
+  icon={<LucideIcons.CreditCard className="w-4 h-4" />}
+/>
+
+// With onClick handler
+<TopupButton
+  label="Add Balance"
+  icon={<LucideIcons.Wallet className="w-4 h-4" />}
+  onClick={() => handleTopup()}
+/>`})})})})]});exports.default=l;

package/documentation/TopupButtonSection-Cw92WCuk.js

@@ -0,0 +1,100 @@
+import { jsxs as a, Fragment as n, jsx as e } from "react/jsx-runtime";
+import { T as l, C as o, a as t, z as c, P as i, A as p, c as r } from "../index-B6CStnMG.js";
+import { Plus as d, CreditCard as m, Wallet as u } from "lucide-react";
+import "react-router-dom";
+import "react";
+import "react-dom";
+const B = () => /* @__PURE__ */ a(n, { children: [
+  /* @__PURE__ */ a("div", { className: "text-center space-y-4", children: [
+    /* @__PURE__ */ e(l, { tag: "h2", className: "text-3xl md:text-4xl font-bold", children: "TopupButton" }),
+    /* @__PURE__ */ e(
+      l,
+      {
+        tag: "p",
+        className: "text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",
+        children: "A specialized button component for top-up or recharge actions, with support for icons and links."
+      }
+    )
+  ] }),
+  /* @__PURE__ */ e(o, { className: "overflow-hidden", children: /* @__PURE__ */ e(t, { 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: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
+    /* @__PURE__ */ a(o, { className: "p-4", children: [
+      /* @__PURE__ */ e(l, { tag: "h5", className: "mb-3", children: "Basic Topup Button" }),
+      /* @__PURE__ */ e(c, { label: "Add Funds" })
+    ] }),
+    /* @__PURE__ */ a(o, { className: "p-4", children: [
+      /* @__PURE__ */ e(l, { tag: "h5", className: "mb-3", children: "With Icon" }),
+      /* @__PURE__ */ e(
+        c,
+        {
+          label: "Top Up Account",
+          icon: /* @__PURE__ */ e(d, { className: "w-4 h-4" })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ a(o, { className: "p-4", children: [
+      /* @__PURE__ */ e(l, { tag: "h5", className: "mb-3", children: "With Link" }),
+      /* @__PURE__ */ e(
+        c,
+        {
+          label: "Recharge Now",
+          href: "/topup",
+          icon: /* @__PURE__ */ e(m, { className: "w-4 h-4" })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ a(o, { className: "p-4", children: [
+      /* @__PURE__ */ e(l, { tag: "h5", className: "mb-3", children: "With onClick Handler" }),
+      /* @__PURE__ */ e(
+        c,
+        {
+          label: "Add Balance",
+          icon: /* @__PURE__ */ e(u, { className: "w-4 h-4" }),
+          onClick: () => console.log("Topup clicked")
+        }
+      )
+    ] })
+  ] }) }) }) }),
+  /* @__PURE__ */ e(
+    i,
+    {
+      componentName: "TopupButton",
+      defaultValues: { label: "Top Up" },
+      excludeProps: ["onClick", "icon"],
+      children: (s) => /* @__PURE__ */ e(c, { ...s })
+    }
+  ),
+  /* @__PURE__ */ e(p, { componentName: "TopupButton" }),
+  /* @__PURE__ */ e(o, { className: "overflow-hidden", children: /* @__PURE__ */ e(t, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
+    r,
+    {
+      language: "tsx",
+      code: `import { TopupButton, LucideIcons } from '@e-burgos/tucu-ui';
+
+// Basic usage
+<TopupButton label="Add Funds" />
+
+// With icon
+<TopupButton
+  label="Top Up Account"
+  icon={<LucideIcons.Plus className="w-4 h-4" />}
+/>
+
+// With link
+<TopupButton
+  label="Recharge Now"
+  href="/topup"
+  icon={<LucideIcons.CreditCard className="w-4 h-4" />}
+/>
+
+// With onClick handler
+<TopupButton
+  label="Add Balance"
+  icon={<LucideIcons.Wallet className="w-4 h-4" />}
+  onClick={() => handleTopup()}
+/>`
+    }
+  ) }) }) })
+] });
+export {
+  B as default
+};

package/documentation/TransactionInfoSection-CF0j2oxc.js

@@ -0,0 +1,16 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),e=require("../index-QnI4b7wS.js");require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=()=>a.jsxs(a.Fragment,{children:[a.jsxs("div",{className:"text-center space-y-4",children:[a.jsx(e.Typography,{tag:"h2",className:"text-3xl md:text-4xl font-bold",children:"TransactionInfo"}),a.jsx(e.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"Simple component for displaying transaction information with label and value."})]}),a.jsx(e.CardContainer,{className:"overflow-hidden",children:a.jsx(e.CardTitle,{title:"Basic Examples",className:"mt-2 mb-2",children:a.jsx("div",{className:"w-full p-4 sm:p-6",children:a.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-2 gap-4",children:[a.jsxs(e.CardContainer,{className:"p-4",children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"With Value"}),a.jsx(e.TransactionInfo,{label:"Transaction Hash",value:"0x1234...5678"})]}),a.jsxs(e.CardContainer,{className:"p-4",children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Without Value"}),a.jsx(e.TransactionInfo,{label:"Gas Fee"})]}),a.jsxs(e.CardContainer,{className:"p-4",children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Number Value"}),a.jsx(e.TransactionInfo,{label:"Block Number",value:12345678})]})]})})})}),a.jsx(e.AutoPropsTable,{componentName:"TransactionInfo"}),a.jsx(e.CardContainer,{className:"overflow-hidden",children:a.jsx(e.CardTitle,{title:"Code Example",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 { TransactionInfo } from '@e-burgos/tucu-ui';
+
+<TransactionInfo
+  label="Transaction Hash"
+  value="0x1234...5678"
+/>
+
+<TransactionInfo
+  label="Gas Fee"
+  // value is optional, shows "_ _" if not provided
+/>
+
+<TransactionInfo
+  label="Block Number"
+  value={12345678}
+/>`})})})})]});exports.default=s;

package/documentation/TransactionInfoSection-cKwmQpgL.js

@@ -0,0 +1,65 @@
+import { jsxs as e, Fragment as t, jsx as a } from "react/jsx-runtime";
+import { T as l, C as s, a as o, j as n, A as i, c as r } from "../index-B6CStnMG.js";
+import "lucide-react";
+import "react-router-dom";
+import "react";
+import "react-dom";
+const f = () => /* @__PURE__ */ e(t, { 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: "TransactionInfo" }),
+    /* @__PURE__ */ a(
+      l,
+      {
+        tag: "p",
+        className: "text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",
+        children: "Simple component for displaying transaction information with label and value."
+      }
+    )
+  ] }),
+  /* @__PURE__ */ a(s, { className: "overflow-hidden", children: /* @__PURE__ */ a(o, { 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(s, { className: "p-4", children: [
+      /* @__PURE__ */ a(l, { tag: "h5", className: "mb-3", children: "With Value" }),
+      /* @__PURE__ */ a(
+        n,
+        {
+          label: "Transaction Hash",
+          value: "0x1234...5678"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ e(s, { className: "p-4", children: [
+      /* @__PURE__ */ a(l, { tag: "h5", className: "mb-3", children: "Without Value" }),
+      /* @__PURE__ */ a(n, { label: "Gas Fee" })
+    ] }),
+    /* @__PURE__ */ e(s, { className: "p-4", children: [
+      /* @__PURE__ */ a(l, { tag: "h5", className: "mb-3", children: "Number Value" }),
+      /* @__PURE__ */ a(n, { label: "Block Number", value: 12345678 })
+    ] })
+  ] }) }) }) }),
+  /* @__PURE__ */ a(i, { componentName: "TransactionInfo" }),
+  /* @__PURE__ */ a(s, { className: "overflow-hidden", children: /* @__PURE__ */ a(o, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a(
+    r,
+    {
+      language: "tsx",
+      code: `import { TransactionInfo } from '@e-burgos/tucu-ui';
+
+<TransactionInfo
+  label="Transaction Hash"
+  value="0x1234...5678"
+/>
+
+<TransactionInfo
+  label="Gas Fee"
+  // value is optional, shows "_ _" if not provided
+/>
+
+<TransactionInfo
+  label="Block Number"
+  value={12345678}
+/>`
+    }
+  ) }) }) })
+] });
+export {
+  f as default
+};

package/documentation/TucuUiLogoSection-BuasEv--.js

@@ -0,0 +1,26 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-QnI4b7wS.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:"TucuUiLogo"}),e.jsx(s.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:'The core logo icon component featuring the distinctive double T design with "ui" text, representing the Tucu UI design system.'})]}),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 Size"}),e.jsx(s.TucuUiLogo,{})]}),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.TucuUiLogo,{size:60}),e.jsx(s.TucuUiLogo,{size:120}),e.jsx(s.TucuUiLogo,{size:180})]})]}),e.jsxs(s.CardContainer,{className:"p-4",children:[e.jsx(s.Typography,{tag:"h5",className:"mb-3",children:"With Custom Classes"}),e.jsx(s.TucuUiLogo,{size:100,className:"opacity-80 hover:opacity-100 transition-opacity"})]})]})})})}),e.jsx(s.PropPlayground,{componentName:"TucuUiLogo",defaultValues:{size:60},excludeProps:["props"],children:i=>e.jsx(s.TucuUiLogo,{...i})}),e.jsx(s.AutoPropsTable,{componentName:"TucuUiLogo"}),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 { TucuUiLogo } from '@e-burgos/tucu-ui';
+
+// Basic usage (default 120x120)
+<TucuUiLogo />
+
+// Custom sizes
+<TucuUiLogo size={60} />
+<TucuUiLogo size={120} />
+<TucuUiLogo size={180} />
+
+// With custom classes
+<TucuUiLogo 
+  size={100} 
+  className="opacity-80 hover:opacity-100 transition-opacity" 
+/>
+
+// With SVG attributes
+<TucuUiLogo 
+  size={80} 
+  className="custom-class"
+  props={{ viewBox: '0 0 240 240' }}
+/>
+
+// The component automatically:
+// - Adapts to light/dark mode
+// - Shows the double T design with "ui" text`})})})})]});exports.default=a;

package/{TucuUiLogoSection-DKvsi70K.mjs → documentation/TucuUiLogoSection-NYK0oUdj.js}

@@ -1,10 +1,10 @@
-import { jsxs as s, Fragment as r, jsx as e } from "react/jsx-runtime";
-import { T as i, C as t, a as o, a2 as l, B as n, c as d } from "./index-HwvOEWI7.mjs";
+import { jsxs as s, Fragment as l, jsx as e } from "react/jsx-runtime";
+import { T as i, C as t, a as o, ae as a, P as r, A as m, c as u } from "../index-B6CStnMG.js";
 import "lucide-react";
 import "react-router-dom";
 import "react";
 import "react-dom";
-const y = () => /* @__PURE__ */ s(r, { children: [
+const N = () => /* @__PURE__ */ s(l, { children: [
   /* @__PURE__ */ s("div", { className: "text-center space-y-4", children: [
     /* @__PURE__ */ e(i, { tag: "h2", className: "text-3xl md:text-4xl font-bold", children: "TucuUiLogo" }),
     /* @__PURE__ */ e(
@@ -19,20 +19,20 @@ const y = () => /* @__PURE__ */ s(r, { children: [
   /* @__PURE__ */ e(t, { className: "overflow-hidden", children: /* @__PURE__ */ e(o, { title: "Basic Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ s("div", { className: "space-y-4", children: [
     /* @__PURE__ */ s(t, { className: "p-4", children: [
       /* @__PURE__ */ e(i, { tag: "h5", className: "mb-3", children: "Default Size" }),
-      /* @__PURE__ */ e(l, {})
+      /* @__PURE__ */ e(a, {})
     ] }),
     /* @__PURE__ */ s(t, { className: "p-4", children: [
       /* @__PURE__ */ e(i, { tag: "h5", className: "mb-3", children: "Different Sizes" }),
       /* @__PURE__ */ s("div", { className: "flex items-center gap-4 flex-wrap", children: [
-        /* @__PURE__ */ e(l, { size: 60 }),
-        /* @__PURE__ */ e(l, { size: 120 }),
-        /* @__PURE__ */ e(l, { size: 180 })
+        /* @__PURE__ */ e(a, { size: 60 }),
+        /* @__PURE__ */ e(a, { size: 120 }),
+        /* @__PURE__ */ e(a, { size: 180 })
       ] })
     ] }),
     /* @__PURE__ */ s(t, { className: "p-4", children: [
       /* @__PURE__ */ e(i, { tag: "h5", className: "mb-3", children: "With Custom Classes" }),
       /* @__PURE__ */ e(
-        l,
+        a,
         {
           size: 100,
           className: "opacity-80 hover:opacity-100 transition-opacity"
@@ -40,51 +40,18 @@ const y = () => /* @__PURE__ */ s(r, { children: [
       )
     ] })
   ] }) }) }) }),
-  /* @__PURE__ */ e(t, { className: "overflow-hidden", children: /* @__PURE__ */ e(o, { title: "Props", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(n, { columns: [
+  /* @__PURE__ */ e(
+    r,
     {
-      key: "prop",
-      label: "Prop",
-      render: (a) => /* @__PURE__ */ e("code", { className: "text-xs text-brand", children: String(a) })
-    },
-    {
-      key: "type",
-      label: "Type",
-      render: (a) => /* @__PURE__ */ e("code", { className: "text-xs", children: String(a) })
-    },
-    {
-      key: "default",
-      label: "Default",
-      render: (a) => {
-        const c = String(a);
-        return c === "required" ? /* @__PURE__ */ e("span", { className: "text-xs text-red-500", children: "required" }) : /* @__PURE__ */ e("code", { className: "text-xs", children: c });
-      }
-    },
-    {
-      key: "description",
-      label: "Description"
+      componentName: "TucuUiLogo",
+      defaultValues: { size: 60 },
+      excludeProps: ["props"],
+      children: (c) => /* @__PURE__ */ e(a, { ...c })
     }
-  ], data: [
-    {
-      prop: "size",
-      type: "number | string",
-      default: "120",
-      description: "Size of the logo icon"
-    },
-    {
-      prop: "className",
-      type: "string",
-      default: "''",
-      description: "Additional CSS classes"
-    },
-    {
-      prop: "props",
-      type: "React.SVGAttributes<SVGElement>",
-      default: "-",
-      description: "Additional SVG attributes"
-    }
-  ] }) }) }) }),
+  ),
+  /* @__PURE__ */ e(m, { componentName: "TucuUiLogo" }),
   /* @__PURE__ */ e(t, { className: "overflow-hidden", children: /* @__PURE__ */ e(o, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
-    d,
+    u,
     {
       language: "tsx",
       code: `import { TucuUiLogo } from '@e-burgos/tucu-ui';
@@ -117,5 +84,5 @@ const y = () => /* @__PURE__ */ s(r, { children: [
   ) }) }) })
 ] });
 export {
-  y as default
+  N as default
 };

package/documentation/TypographySection-02IMtWN4.js

@@ -0,0 +1,144 @@
+import { jsxs as t, Fragment as r, jsx as a } from "react/jsx-runtime";
+import { T as e, C as o, a as l, P as i, A as h, c as n } from "../index-B6CStnMG.js";
+import "lucide-react";
+import "react-router-dom";
+import "react";
+import "react-dom";
+const T = () => /* @__PURE__ */ t(r, { children: [
+  /* @__PURE__ */ t("div", { className: "text-center space-y-4", children: [
+    /* @__PURE__ */ a(e, { tag: "h2", className: "text-3xl md:text-4xl font-bold", children: "Typography" }),
+    /* @__PURE__ */ a(
+      e,
+      {
+        tag: "p",
+        className: "text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",
+        children: "A comprehensive typography component system with semantic HTML tags and predefined text styles."
+      }
+    )
+  ] }),
+  /* @__PURE__ */ a(o, { className: "overflow-hidden", children: /* @__PURE__ */ a(l, { title: "Basic Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ t("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ t(o, { className: "p-4", children: [
+      /* @__PURE__ */ a(e, { tag: "h5", className: "mb-3", children: "Headings" }),
+      /* @__PURE__ */ t("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ a(e, { tag: "h1", children: "Heading 1" }),
+        /* @__PURE__ */ a(e, { tag: "h2", children: "Heading 2" }),
+        /* @__PURE__ */ a(e, { tag: "h3", children: "Heading 3" }),
+        /* @__PURE__ */ a(e, { tag: "h4", children: "Heading 4" }),
+        /* @__PURE__ */ a(e, { tag: "h5", children: "Heading 5" }),
+        /* @__PURE__ */ a(e, { tag: "h6", children: "Heading 6" })
+      ] })
+    ] }),
+    /* @__PURE__ */ t(o, { className: "p-4", children: [
+      /* @__PURE__ */ a(e, { tag: "h5", className: "mb-3", children: "Text Variants" }),
+      /* @__PURE__ */ t("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ a(e, { tag: "headline", children: "Headline Text" }),
+        /* @__PURE__ */ a(e, { tag: "body", children: "Body Text" }),
+        /* @__PURE__ */ a(e, { tag: "label-1", children: "Label 1" }),
+        /* @__PURE__ */ a(e, { tag: "h5", children: "Label 2" }),
+        /* @__PURE__ */ a(e, { tag: "caption", children: "Caption Text" }),
+        /* @__PURE__ */ a(e, { tag: "legal", children: "Legal Text" })
+      ] })
+    ] }),
+    /* @__PURE__ */ t(o, { className: "p-4", children: [
+      /* @__PURE__ */ a(e, { tag: "h5", className: "mb-3", children: "Semantic Elements" }),
+      /* @__PURE__ */ t("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ a(e, { tag: "p", children: "Paragraph text" }),
+        /* @__PURE__ */ a(e, { tag: "strong", children: "Strong text" }),
+        /* @__PURE__ */ a(e, { tag: "em", children: "Emphasized text" }),
+        /* @__PURE__ */ a(e, { tag: "code", children: "Code text" }),
+        /* @__PURE__ */ a(e, { tag: "pre", children: "Preformatted text" })
+      ] })
+    ] }),
+    /* @__PURE__ */ t(o, { className: "p-4", children: [
+      /* @__PURE__ */ a(e, { tag: "h5", className: "mb-3", children: "With Tooltip" }),
+      /* @__PURE__ */ t("div", { className: "flex flex-wrap gap-4 items-center", children: [
+        /* @__PURE__ */ a(
+          e,
+          {
+            tag: "span",
+            tooltip: "This is an abbreviation",
+            tooltipPlacement: "top",
+            className: "underline decoration-dotted cursor-help",
+            children: "Hover this text"
+          }
+        ),
+        /* @__PURE__ */ a(
+          e,
+          {
+            tag: "strong",
+            tooltip: "Important information",
+            tooltipPlacement: "right",
+            tooltipColor: "light",
+            children: "Bold with tooltip"
+          }
+        ),
+        /* @__PURE__ */ a(
+          e,
+          {
+            tag: "code",
+            tooltip: "Copied!",
+            tooltipPlacement: "bottom",
+            children: "Code with tooltip"
+          }
+        )
+      ] })
+    ] })
+  ] }) }) }) }),
+  /* @__PURE__ */ a(
+    i,
+    {
+      componentName: "Typography",
+      defaultValues: { tag: "p", color: "default" },
+      excludeProps: [
+        "tooltip",
+        "tooltipArrow",
+        "tooltipColor",
+        "tooltipPlacement",
+        "title"
+      ],
+      children: (p) => /* @__PURE__ */ a(e, { ...p, children: "The quick brown fox jumps over the lazy dog." })
+    }
+  ),
+  /* @__PURE__ */ a(h, { componentName: "Typography" }),
+  /* @__PURE__ */ a(o, { className: "overflow-hidden", children: /* @__PURE__ */ a(l, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a(
+    n,
+    {
+      language: "tsx",
+      code: `import { Typography } from '@e-burgos/tucu-ui';
+
+// Headings
+<Typography tag="h1">Heading 1</Typography>
+<Typography tag="h2">Heading 2</Typography>
+<Typography tag="h3">Heading 3</Typography>
+
+// Text variants
+<Typography tag="headline">Headline Text</Typography>
+<Typography tag="body">Body Text</Typography>
+<Typography tag="label-1">Label 1</Typography>
+<Typography tag="h5">Label 2</Typography>
+<Typography tag="caption">Caption Text</Typography>
+
+// Semantic elements
+<Typography tag="p">Paragraph text</Typography>
+<Typography tag="strong">Strong text</Typography>
+<Typography tag="em">Emphasized text</Typography>
+<Typography tag="code">Code text</Typography>
+
+// With custom className
+<Typography tag="h1" className="text-blue-500">
+  Custom Styled Heading
+</Typography>
+
+// With tooltip
+<Typography tag="span" tooltip="Extra info" tooltipPlacement="top">
+  Hover me
+</Typography>
+<Typography tag="strong" tooltip="Details" tooltipPlacement="right" tooltipColor="light">
+  Bold with tooltip
+</Typography>`
+    }
+  ) }) }) })
+] });
+export {
+  T as default
+};

package/{TypographySection-BOk8SfCz.mjs → documentation/TypographySection-CjGIv22g.js}

@@ -1,5 +1,5 @@
 import { jsxs as l, Fragment as g, jsx as a } from "react/jsx-runtime";
-import { T as r, C as t, a as d, D as i } from "./index-HwvOEWI7.mjs";
+import { T as r, C as t, a as d, J as i } from "../index-B6CStnMG.js";
 import "lucide-react";
 import "react-router-dom";
 import "react";

package/documentation/TypographySection-CpjtNAfZ.js

@@ -0,0 +1,32 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),e=require("../index-QnI4b7wS.js");require("lucide-react");require("react-router-dom");require("react");require("react-dom");const o=()=>a.jsxs(a.Fragment,{children:[a.jsxs("div",{className:"text-center space-y-4",children:[a.jsx(e.Typography,{tag:"h2",className:"text-3xl md:text-4xl font-bold",children:"Typography"}),a.jsx(e.Typography,{tag:"p",className:"text-xl text-gray-600 dark:text-gray-400 max-w-2xl mx-auto",children:"A comprehensive typography component system with semantic HTML tags and predefined text styles."})]}),a.jsx(e.CardContainer,{className:"overflow-hidden",children:a.jsx(e.CardTitle,{title:"Basic Examples",className:"mt-2 mb-2",children:a.jsx("div",{className:"w-full p-4 sm:p-6",children:a.jsxs("div",{className:"space-y-4",children:[a.jsxs(e.CardContainer,{className:"p-4",children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Headings"}),a.jsxs("div",{className:"space-y-2",children:[a.jsx(e.Typography,{tag:"h1",children:"Heading 1"}),a.jsx(e.Typography,{tag:"h2",children:"Heading 2"}),a.jsx(e.Typography,{tag:"h3",children:"Heading 3"}),a.jsx(e.Typography,{tag:"h4",children:"Heading 4"}),a.jsx(e.Typography,{tag:"h5",children:"Heading 5"}),a.jsx(e.Typography,{tag:"h6",children:"Heading 6"})]})]}),a.jsxs(e.CardContainer,{className:"p-4",children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Text Variants"}),a.jsxs("div",{className:"space-y-2",children:[a.jsx(e.Typography,{tag:"headline",children:"Headline Text"}),a.jsx(e.Typography,{tag:"body",children:"Body Text"}),a.jsx(e.Typography,{tag:"label-1",children:"Label 1"}),a.jsx(e.Typography,{tag:"h5",children:"Label 2"}),a.jsx(e.Typography,{tag:"caption",children:"Caption Text"}),a.jsx(e.Typography,{tag:"legal",children:"Legal Text"})]})]}),a.jsxs(e.CardContainer,{className:"p-4",children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"Semantic Elements"}),a.jsxs("div",{className:"space-y-2",children:[a.jsx(e.Typography,{tag:"p",children:"Paragraph text"}),a.jsx(e.Typography,{tag:"strong",children:"Strong text"}),a.jsx(e.Typography,{tag:"em",children:"Emphasized text"}),a.jsx(e.Typography,{tag:"code",children:"Code text"}),a.jsx(e.Typography,{tag:"pre",children:"Preformatted text"})]})]}),a.jsxs(e.CardContainer,{className:"p-4",children:[a.jsx(e.Typography,{tag:"h5",className:"mb-3",children:"With Tooltip"}),a.jsxs("div",{className:"flex flex-wrap gap-4 items-center",children:[a.jsx(e.Typography,{tag:"span",tooltip:"This is an abbreviation",tooltipPlacement:"top",className:"underline decoration-dotted cursor-help",children:"Hover this text"}),a.jsx(e.Typography,{tag:"strong",tooltip:"Important information",tooltipPlacement:"right",tooltipColor:"light",children:"Bold with tooltip"}),a.jsx(e.Typography,{tag:"code",tooltip:"Copied!",tooltipPlacement:"bottom",children:"Code with tooltip"})]})]})]})})})}),a.jsx(e.PropPlayground,{componentName:"Typography",defaultValues:{tag:"p",color:"default"},excludeProps:["tooltip","tooltipArrow","tooltipColor","tooltipPlacement","title"],children:t=>a.jsx(e.Typography,{...t,children:"The quick brown fox jumps over the lazy dog."})}),a.jsx(e.AutoPropsTable,{componentName:"Typography"}),a.jsx(e.CardContainer,{className:"overflow-hidden",children:a.jsx(e.CardTitle,{title:"Code Example",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 { Typography } from '@e-burgos/tucu-ui';
+
+// Headings
+<Typography tag="h1">Heading 1</Typography>
+<Typography tag="h2">Heading 2</Typography>
+<Typography tag="h3">Heading 3</Typography>
+
+// Text variants
+<Typography tag="headline">Headline Text</Typography>
+<Typography tag="body">Body Text</Typography>
+<Typography tag="label-1">Label 1</Typography>
+<Typography tag="h5">Label 2</Typography>
+<Typography tag="caption">Caption Text</Typography>
+
+// Semantic elements
+<Typography tag="p">Paragraph text</Typography>
+<Typography tag="strong">Strong text</Typography>
+<Typography tag="em">Emphasized text</Typography>
+<Typography tag="code">Code text</Typography>
+
+// With custom className
+<Typography tag="h1" className="text-blue-500">
+  Custom Styled Heading
+</Typography>
+
+// With tooltip
+<Typography tag="span" tooltip="Extra info" tooltipPlacement="top">
+  Hover me
+</Typography>
+<Typography tag="strong" tooltip="Details" tooltipPlacement="right" tooltipColor="light">
+  Bold with tooltip
+</Typography>`})})})})]});exports.default=o;