@e-burgos/tucu-ui 2.5.0 → 2.6.0

package/documentation/SecuritySection-DKj4sx3q.js

@@ -0,0 +1,27 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("../index-DWDUS-PU.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=()=>e.jsxs("div",{className:"flex flex-col gap-8",children:[e.jsx(r.HeroCard,{title:"Security",description:"Authentication, rate limiting, and hardening measures for production deployments.",icon:e.jsx("div",{className:"w-16 h-16 sm:w-20 sm:h-20 bg-linear-to-br from-red-500 to-rose-600 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(t.Shield,{className:"w-8 h-8 sm:w-10 sm:h-10 text-white"})})}),e.jsx(r.CardContainer,{children:e.jsxs(r.CardTitle,{title:"Bearer Token Authentication",children:[e.jsxs(r.Typography,{className:"text-sm text-foreground/70 mb-3",children:["The HTTP transport requires a Bearer token when"," ",e.jsx("code",{className:"px-1.5 py-0.5 bg-muted rounded text-xs font-mono",children:"MCP_API_KEY"})," ","is set. All requests must include the Authorization header:"]}),e.jsx(r.CodeBlock,{code:`# Set the API key on the server
+export MCP_API_KEY="your-secure-random-string"
+
+# Clients must send:
+Authorization: Bearer your-secure-random-string
+
+# Generate a secure key:
+openssl rand -base64 32`}),e.jsx("div",{className:"mt-3 p-3 rounded-lg border border-amber-500/20 bg-amber-500/5",children:e.jsxs("div",{className:"flex items-start gap-2",children:[e.jsx(t.AlertTriangle,{className:"w-4 h-4 text-amber-500 mt-0.5"}),e.jsxs(r.Typography,{className:"text-xs text-amber-600 dark:text-amber-400",children:["If ",e.jsx("code",{className:"font-mono",children:"MCP_API_KEY"})," is not set, the server runs without auth — only suitable for local/stdio usage."]})]})})]})}),e.jsx(r.CardContainer,{children:e.jsxs(r.CardTitle,{title:"Rate Limiting",children:[e.jsx(r.Typography,{className:"text-sm text-foreground/70 mb-3",children:"Built-in rate limiting protects the server from abuse:"}),e.jsxs("div",{className:"grid grid-cols-1 sm:grid-cols-3 gap-3",children:[e.jsxs("div",{className:"p-3 rounded-lg border border-border bg-muted/30 text-center",children:[e.jsx(r.Typography,{className:"text-2xl font-bold text-foreground",children:"100"}),e.jsx(r.Typography,{className:"text-xs text-foreground/50",children:"requests/min per IP"})]}),e.jsxs("div",{className:"p-3 rounded-lg border border-border bg-muted/30 text-center",children:[e.jsx(r.Typography,{className:"text-2xl font-bold text-foreground",children:"429"}),e.jsx(r.Typography,{className:"text-xs text-foreground/50",children:"status when exceeded"})]}),e.jsxs("div",{className:"p-3 rounded-lg border border-border bg-muted/30 text-center",children:[e.jsx(r.Typography,{className:"text-2xl font-bold text-foreground",children:"60s"}),e.jsx(r.Typography,{className:"text-xs text-foreground/50",children:"window reset"})]})]}),e.jsx(r.CodeBlock,{code:`// Rate limit response when exceeded:
+HTTP/1.1 429 Too Many Requests
+Retry-After: 60
+Content-Type: application/json
+
+{ "error": "Rate limit exceeded. Try again in 60 seconds." }`})]})}),e.jsx(r.CardContainer,{children:e.jsxs(r.CardTitle,{title:"Timing-Safe Comparison",children:[e.jsx(r.Typography,{className:"text-sm text-foreground/70 mb-3",children:"Token validation uses constant-time comparison to prevent timing attacks:"}),e.jsx(r.CodeBlock,{code:`import { timingSafeEqual } from 'node:crypto';
+
+function verifyToken(provided: string, expected: string): boolean {
+  const a = Buffer.from(provided);
+  const b = Buffer.from(expected);
+  if (a.length !== b.length) return false;
+  return timingSafeEqual(a, b);
+}`})]})}),e.jsxs("section",{className:"space-y-6",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(r.Typography,{tag:"h2",className:"mb-2",children:"Infrastructure Security"}),e.jsx(r.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Docker hardening and HTTPS enforcement for production deployments"})]}),e.jsxs("div",{className:"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4",children:[e.jsx(r.FeatureCard,{layout:"vertical",icon:e.jsx(t.User,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Non-Root User",description:"Runs as node user (UID 1000) — never as root",iconBgClassName:"from-blue-500 to-indigo-500"}),e.jsx(r.FeatureCard,{layout:"vertical",icon:e.jsx(t.Layers,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Multi-Stage Build",description:"Only production deps in final Alpine-based image",iconBgClassName:"from-emerald-500 to-teal-500"}),e.jsx(r.FeatureCard,{layout:"vertical",icon:e.jsx(t.Lock,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Auto TLS",description:"Automatic certificate provisioning and HTTP→HTTPS redirect",iconBgClassName:"from-violet-500 to-purple-500"}),e.jsx(r.FeatureCard,{layout:"vertical",icon:e.jsx(t.KeyRound,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Encrypted Secrets",description:"Secrets stored encrypted at rest with fly secrets",iconBgClassName:"from-rose-500 to-red-500"})]})]}),e.jsx(r.CardContainer,{children:e.jsxs(r.CardTitle,{title:"Security Checklist",children:[e.jsx(r.Typography,{className:"text-sm text-foreground/70 mb-3",children:"Before deploying to production, ensure:"}),e.jsx(r.CodeBlock,{code:`✓ MCP_API_KEY is set to a strong random value (32+ chars)
+✓ HTTPS is enforced (automatic on Fly.io)
+✓ Rate limiting is enabled (default: 100 req/min)
+✓ Docker runs as non-root user
+✓ No secrets in source code or Docker image layers
+✓ Fly.io secrets set via 'fly secrets set' (not env files)
+✓ Health endpoint (/health) does not expose internals
+✓ CORS restricted to known origins in production`})]})})]});exports.default=s;

package/documentation/SecuritySection-fTtKf_Se.js

@@ -0,0 +1,164 @@
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import { H as n, C as o, a as s, T as r, c as i, ax as a } from "../index-DoxeCFUJ.js";
+import { Shield as d, AlertTriangle as l, User as c, Layers as m, Lock as u, KeyRound as h } from "lucide-react";
+import "react-router-dom";
+import "react";
+import "react-dom";
+const N = () => /* @__PURE__ */ t("div", { className: "flex flex-col gap-8", children: [
+  /* @__PURE__ */ e(
+    n,
+    {
+      title: "Security",
+      description: "Authentication, rate limiting, and hardening measures for production deployments.",
+      icon: /* @__PURE__ */ e("div", { className: "w-16 h-16 sm:w-20 sm:h-20 bg-linear-to-br from-red-500 to-rose-600 rounded-full flex items-center justify-center shadow-lg", children: /* @__PURE__ */ e(d, { className: "w-8 h-8 sm:w-10 sm:h-10 text-white" }) })
+    }
+  ),
+  /* @__PURE__ */ e(o, { children: /* @__PURE__ */ t(s, { title: "Bearer Token Authentication", children: [
+    /* @__PURE__ */ t(r, { className: "text-sm text-foreground/70 mb-3", children: [
+      "The HTTP transport requires a Bearer token when",
+      " ",
+      /* @__PURE__ */ e("code", { className: "px-1.5 py-0.5 bg-muted rounded text-xs font-mono", children: "MCP_API_KEY" }),
+      " ",
+      "is set. All requests must include the Authorization header:"
+    ] }),
+    /* @__PURE__ */ e(
+      i,
+      {
+        code: `# Set the API key on the server
+export MCP_API_KEY="your-secure-random-string"
+
+# Clients must send:
+Authorization: Bearer your-secure-random-string
+
+# Generate a secure key:
+openssl rand -base64 32`
+      }
+    ),
+    /* @__PURE__ */ e("div", { className: "mt-3 p-3 rounded-lg border border-amber-500/20 bg-amber-500/5", children: /* @__PURE__ */ t("div", { className: "flex items-start gap-2", children: [
+      /* @__PURE__ */ e(l, { className: "w-4 h-4 text-amber-500 mt-0.5" }),
+      /* @__PURE__ */ t(r, { className: "text-xs text-amber-600 dark:text-amber-400", children: [
+        "If ",
+        /* @__PURE__ */ e("code", { className: "font-mono", children: "MCP_API_KEY" }),
+        " is not set, the server runs without auth — only suitable for local/stdio usage."
+      ] })
+    ] }) })
+  ] }) }),
+  /* @__PURE__ */ e(o, { children: /* @__PURE__ */ t(s, { title: "Rate Limiting", children: [
+    /* @__PURE__ */ e(r, { className: "text-sm text-foreground/70 mb-3", children: "Built-in rate limiting protects the server from abuse:" }),
+    /* @__PURE__ */ t("div", { className: "grid grid-cols-1 sm:grid-cols-3 gap-3", children: [
+      /* @__PURE__ */ t("div", { className: "p-3 rounded-lg border border-border bg-muted/30 text-center", children: [
+        /* @__PURE__ */ e(r, { className: "text-2xl font-bold text-foreground", children: "100" }),
+        /* @__PURE__ */ e(r, { className: "text-xs text-foreground/50", children: "requests/min per IP" })
+      ] }),
+      /* @__PURE__ */ t("div", { className: "p-3 rounded-lg border border-border bg-muted/30 text-center", children: [
+        /* @__PURE__ */ e(r, { className: "text-2xl font-bold text-foreground", children: "429" }),
+        /* @__PURE__ */ e(r, { className: "text-xs text-foreground/50", children: "status when exceeded" })
+      ] }),
+      /* @__PURE__ */ t("div", { className: "p-3 rounded-lg border border-border bg-muted/30 text-center", children: [
+        /* @__PURE__ */ e(r, { className: "text-2xl font-bold text-foreground", children: "60s" }),
+        /* @__PURE__ */ e(r, { className: "text-xs text-foreground/50", children: "window reset" })
+      ] })
+    ] }),
+    /* @__PURE__ */ e(
+      i,
+      {
+        code: `// Rate limit response when exceeded:
+HTTP/1.1 429 Too Many Requests
+Retry-After: 60
+Content-Type: application/json
+
+{ "error": "Rate limit exceeded. Try again in 60 seconds." }`
+      }
+    )
+  ] }) }),
+  /* @__PURE__ */ e(o, { children: /* @__PURE__ */ t(s, { title: "Timing-Safe Comparison", children: [
+    /* @__PURE__ */ e(r, { className: "text-sm text-foreground/70 mb-3", children: "Token validation uses constant-time comparison to prevent timing attacks:" }),
+    /* @__PURE__ */ e(
+      i,
+      {
+        code: `import { timingSafeEqual } from 'node:crypto';
+
+function verifyToken(provided: string, expected: string): boolean {
+  const a = Buffer.from(provided);
+  const b = Buffer.from(expected);
+  if (a.length !== b.length) return false;
+  return timingSafeEqual(a, b);
+}`
+      }
+    )
+  ] }) }),
+  /* @__PURE__ */ t("section", { className: "space-y-6", children: [
+    /* @__PURE__ */ t("div", { className: "text-center", children: [
+      /* @__PURE__ */ e(r, { tag: "h2", className: "mb-2", children: "Infrastructure Security" }),
+      /* @__PURE__ */ e(
+        r,
+        {
+          tag: "p",
+          className: "text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",
+          children: "Docker hardening and HTTPS enforcement for production deployments"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ t("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4", children: [
+      /* @__PURE__ */ e(
+        a,
+        {
+          layout: "vertical",
+          icon: /* @__PURE__ */ e(c, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
+          title: "Non-Root User",
+          description: "Runs as node user (UID 1000) — never as root",
+          iconBgClassName: "from-blue-500 to-indigo-500"
+        }
+      ),
+      /* @__PURE__ */ e(
+        a,
+        {
+          layout: "vertical",
+          icon: /* @__PURE__ */ e(m, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
+          title: "Multi-Stage Build",
+          description: "Only production deps in final Alpine-based image",
+          iconBgClassName: "from-emerald-500 to-teal-500"
+        }
+      ),
+      /* @__PURE__ */ e(
+        a,
+        {
+          layout: "vertical",
+          icon: /* @__PURE__ */ e(u, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
+          title: "Auto TLS",
+          description: "Automatic certificate provisioning and HTTP→HTTPS redirect",
+          iconBgClassName: "from-violet-500 to-purple-500"
+        }
+      ),
+      /* @__PURE__ */ e(
+        a,
+        {
+          layout: "vertical",
+          icon: /* @__PURE__ */ e(h, { className: "w-6 h-6 text-white filter drop-shadow-sm" }),
+          title: "Encrypted Secrets",
+          description: "Secrets stored encrypted at rest with fly secrets",
+          iconBgClassName: "from-rose-500 to-red-500"
+        }
+      )
+    ] })
+  ] }),
+  /* @__PURE__ */ e(o, { children: /* @__PURE__ */ t(s, { title: "Security Checklist", children: [
+    /* @__PURE__ */ e(r, { className: "text-sm text-foreground/70 mb-3", children: "Before deploying to production, ensure:" }),
+    /* @__PURE__ */ e(
+      i,
+      {
+        code: `✓ MCP_API_KEY is set to a strong random value (32+ chars)
+✓ HTTPS is enforced (automatic on Fly.io)
+✓ Rate limiting is enabled (default: 100 req/min)
+✓ Docker runs as non-root user
+✓ No secrets in source code or Docker image layers
+✓ Fly.io secrets set via 'fly secrets set' (not env files)
+✓ Health endpoint (/health) does not expose internals
+✓ CORS restricted to known origins in production`
+      }
+    )
+  ] }) })
+] });
+export {
+  N as default
+};

package/documentation/SelectSection-ChCN6Gvt.js

@@ -0,0 +1,346 @@
+import { jsxs as l, Fragment as S, jsx as e } from "react/jsx-runtime";
+import { useState as d } from "react";
+import { H as N, C as a, a as n, T as s, S as o, P as f, A as w, c as y } from "../index-DoxeCFUJ.js";
+import { ChevronDown as C, Globe as i, Star as x, Zap as P, Shield as O } from "lucide-react";
+import "react-router-dom";
+import "react-dom";
+const E = () => {
+  const [p, m] = d(void 0), r = [
+    { name: "Argentina", value: "ar" },
+    { name: "Brasil", value: "br" },
+    { name: "Chile", value: "cl" },
+    { name: "Colombia", value: "co" },
+    { name: "México", value: "mx" },
+    { name: "Perú", value: "pe" },
+    { name: "Uruguay", value: "uy" },
+    { name: "Venezuela", value: "ve" }
+  ], h = [
+    {
+      name: "Free",
+      value: "free",
+      description: "Basic features, 1 user",
+      icon: /* @__PURE__ */ e(x, { className: "h-4 w-4 text-gray-400" })
+    },
+    {
+      name: "Pro",
+      value: "pro",
+      description: "Advanced features, 5 users",
+      icon: /* @__PURE__ */ e(P, { className: "h-4 w-4 text-brand" })
+    },
+    {
+      name: "Enterprise",
+      value: "enterprise",
+      description: "Custom features, unlimited",
+      icon: /* @__PURE__ */ e(O, { className: "h-4 w-4 text-green-500" })
+    },
+    {
+      name: "Legacy",
+      value: "legacy",
+      description: "No longer available",
+      disabled: !0
+    }
+  ], u = [
+    { label: "Primary", color: "primary" },
+    { label: "Secondary", color: "secondary" },
+    { label: "Danger", color: "danger" },
+    { label: "Info", color: "info" },
+    { label: "Success", color: "success" },
+    { label: "Warning", color: "warning" }
+  ], g = [
+    { label: "Small", size: "sm" },
+    { label: "Medium", size: "md" },
+    { label: "Large", size: "lg" }
+  ], [b, v] = d(r[0]);
+  return /* @__PURE__ */ l(S, { children: [
+    /* @__PURE__ */ e(
+      N,
+      {
+        title: "Select",
+        description: "A dropdown select component with search, descriptions, disabled options, and check indicators.",
+        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-teal-500 via-emerald-500 to-green-500 rounded-full flex items-center justify-center shadow-lg border border-teal-500/50", children: /* @__PURE__ */ e(C, { 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(n, { title: "Examples", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ l("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", children: [
+      /* @__PURE__ */ l(a, { className: "p-4", children: [
+        /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Basic Select" }),
+        /* @__PURE__ */ e(
+          o,
+          {
+            label: "Country",
+            placeholder: "Select a country",
+            options: r,
+            selectedOption: p,
+            onChange: m
+          }
+        )
+      ] }),
+      /* @__PURE__ */ l(a, { className: "p-4", children: [
+        /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Searchable" }),
+        /* @__PURE__ */ e(
+          o,
+          {
+            label: "Country",
+            placeholder: "Search and select...",
+            options: r,
+            searchable: !0,
+            searchPlaceholder: "Type to filter...",
+            showCheck: !0
+          }
+        )
+      ] }),
+      /* @__PURE__ */ l(a, { className: "p-4", children: [
+        /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "With Descriptions & Icons" }),
+        /* @__PURE__ */ e(
+          o,
+          {
+            label: "Plan",
+            placeholder: "Choose a plan",
+            options: h,
+            showCheck: !0
+          }
+        )
+      ] }),
+      /* @__PURE__ */ l(a, { className: "p-4", children: [
+        /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "With Helper Text" }),
+        /* @__PURE__ */ e(
+          o,
+          {
+            label: "Language",
+            placeholder: "Select a language",
+            helperText: "Choose your preferred language",
+            options: [
+              {
+                name: "English",
+                value: "en",
+                icon: /* @__PURE__ */ e(i, { className: "h-4 w-4" })
+              },
+              {
+                name: "Spanish",
+                value: "es",
+                icon: /* @__PURE__ */ e(i, { className: "h-4 w-4" })
+              },
+              {
+                name: "French",
+                value: "fr",
+                icon: /* @__PURE__ */ e(i, { className: "h-4 w-4" })
+              }
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ l(a, { className: "p-4", children: [
+        /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "With Error" }),
+        /* @__PURE__ */ e(
+          o,
+          {
+            label: "Category",
+            placeholder: "Select a category",
+            errorMessage: "Category is required",
+            options: [
+              { name: "Option 1", value: "opt1" },
+              { name: "Option 2", value: "opt2" }
+            ]
+          }
+        )
+      ] }),
+      /* @__PURE__ */ l(a, { className: "p-4", children: [
+        /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Disabled" }),
+        /* @__PURE__ */ e(
+          o,
+          {
+            label: "Status",
+            placeholder: "Select status",
+            disabled: !0,
+            options: [
+              { name: "Active", value: "active" },
+              { name: "Inactive", value: "inactive" }
+            ]
+          }
+        )
+      ] })
+    ] }) }) }) }),
+    /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(n, { title: "Variants", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ l("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-4", children: [
+      /* @__PURE__ */ l(a, { className: "p-4", children: [
+        /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Ghost (default)" }),
+        /* @__PURE__ */ e(
+          o,
+          {
+            label: "Ghost Variant",
+            placeholder: "Select option",
+            variant: "ghost",
+            options: r
+          }
+        )
+      ] }),
+      /* @__PURE__ */ l(a, { className: "p-4", children: [
+        /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Solid" }),
+        /* @__PURE__ */ e(
+          o,
+          {
+            label: "Solid Variant",
+            placeholder: "Select option",
+            variant: "solid",
+            options: r
+          }
+        )
+      ] }),
+      /* @__PURE__ */ l(a, { className: "p-4", children: [
+        /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: "Transparent" }),
+        /* @__PURE__ */ e(
+          o,
+          {
+            label: "Transparent Variant",
+            placeholder: "Select option",
+            variant: "transparent",
+            options: r
+          }
+        )
+      ] })
+    ] }) }) }) }),
+    /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(n, { 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: u.map(({ label: t, color: c }) => /* @__PURE__ */ l(a, { className: "p-4", children: [
+      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: t }),
+      /* @__PURE__ */ e(
+        o,
+        {
+          label: `${t} Select`,
+          placeholder: "Select option",
+          color: c,
+          options: r
+        }
+      )
+    ] }, c)) }) }) }) }),
+    /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(n, { title: "Sizes", 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 md:grid-cols-3", children: g.map(({ label: t, size: c }) => /* @__PURE__ */ l(a, { className: "p-4", children: [
+      /* @__PURE__ */ e(s, { tag: "h5", className: "mb-3", children: t }),
+      /* @__PURE__ */ e(
+        o,
+        {
+          label: `${t} Select`,
+          placeholder: "Select option",
+          size: c,
+          options: r
+        }
+      )
+    ] }, c)) }) }) }) }),
+    /* @__PURE__ */ e(
+      f,
+      {
+        componentName: "Select",
+        defaultValues: {
+          label: "Preview Select",
+          placeholder: "Select a country",
+          variant: "ghost",
+          color: "primary",
+          size: "md",
+          helperText: "",
+          errorMessage: "",
+          searchable: !1,
+          searchPlaceholder: "Search...",
+          showCheck: !0,
+          disabled: !1
+        },
+        controlOverrides: [
+          {
+            name: "placeholder",
+            type: "text",
+            description: "Placeholder text rendered before selecting an option"
+          }
+        ],
+        includeProps: [
+          "label",
+          "placeholder",
+          "variant",
+          "color",
+          "size",
+          "helperText",
+          "errorMessage",
+          "searchable",
+          "searchPlaceholder",
+          "showCheck",
+          "disabled"
+        ],
+        excludeProps: [
+          "options",
+          "selectedOption",
+          "onChange",
+          "onSelect",
+          "value",
+          "name",
+          "buttonClassName",
+          "children"
+        ],
+        children: (t) => /* @__PURE__ */ e("div", { className: "w-full max-w-lg", children: /* @__PURE__ */ e(
+          o,
+          {
+            ...t,
+            placeholder: t.placeholder || "Select a country",
+            options: r,
+            selectedOption: b,
+            onChange: (c) => v(c)
+          }
+        ) })
+      }
+    ),
+    /* @__PURE__ */ e(w, { componentName: "Select" }),
+    /* @__PURE__ */ e(a, { className: "overflow-hidden", children: /* @__PURE__ */ e(n, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
+      y,
+      {
+        language: "tsx",
+        code: `import { Select } from '@e-burgos/tucu-ui';
+
+const options = [
+  { name: 'Argentina', value: 'ar' },
+  { name: 'Brasil', value: 'br' },
+  { name: 'Chile', value: 'cl' },
+];
+
+// Basic
+<Select
+  label="Country"
+  placeholder="Select a country"
+  options={options}
+  selectedOption={selectedOption}
+  onChange={setSelectedOption}
+/>
+
+// Searchable with check
+<Select
+  label="Country"
+  placeholder="Search..."
+  options={options}
+  searchable
+  searchPlaceholder="Type to filter..."
+  showCheck
+/>
+
+// With descriptions, icons, and disabled options
+const plans = [
+  { name: 'Free', value: 'free', description: 'Basic features' },
+  { name: 'Pro', value: 'pro', description: 'Advanced', icon: <Zap /> },
+  { name: 'Legacy', value: 'legacy', disabled: true },
+];
+<Select label="Plan" options={plans} showCheck />
+
+// Variants
+<Select variant="ghost" options={options} />
+<Select variant="solid" options={options} />
+<Select variant="transparent" options={options} />
+
+// Colors
+<Select color="primary" options={options} />
+<Select color="secondary" options={options} />
+<Select color="danger" options={options} />
+<Select color="info" options={options} />
+<Select color="success" options={options} />
+<Select color="warning" options={options} />
+
+// Sizes
+<Select size="sm" options={options} />
+<Select size="md" options={options} />
+<Select size="lg" options={options} />`
+      }
+    ) }) }) })
+  ] });
+};
+export {
+  E as default
+};

package/documentation/SelectSection-XHHIw0x1.js

@@ -0,0 +1,52 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react"),a=require("../index-DWDUS-PU.js"),r=require("lucide-react");require("react-router-dom");require("react-dom");const u=()=>{const[n,c]=t.useState(void 0),l=[{name:"Argentina",value:"ar"},{name:"Brasil",value:"br"},{name:"Chile",value:"cl"},{name:"Colombia",value:"co"},{name:"México",value:"mx"},{name:"Perú",value:"pe"},{name:"Uruguay",value:"uy"},{name:"Venezuela",value:"ve"}],i=[{name:"Free",value:"free",description:"Basic features, 1 user",icon:e.jsx(r.Star,{className:"h-4 w-4 text-gray-400"})},{name:"Pro",value:"pro",description:"Advanced features, 5 users",icon:e.jsx(r.Zap,{className:"h-4 w-4 text-brand"})},{name:"Enterprise",value:"enterprise",description:"Custom features, unlimited",icon:e.jsx(r.Shield,{className:"h-4 w-4 text-green-500"})},{name:"Legacy",value:"legacy",description:"No longer available",disabled:!0}],d=[{label:"Primary",color:"primary"},{label:"Secondary",color:"secondary"},{label:"Danger",color:"danger"},{label:"Info",color:"info"},{label:"Success",color:"success"},{label:"Warning",color:"warning"}],p=[{label:"Small",size:"sm"},{label:"Medium",size:"md"},{label:"Large",size:"lg"}],[h,m]=t.useState(l[0]);return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"Select",description:"A dropdown select component with search, descriptions, disabled options, and check indicators.",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-teal-500 via-emerald-500 to-green-500 rounded-full flex items-center justify-center shadow-lg border border-teal-500/50",children:e.jsx(r.ChevronDown,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Examples",className:"mt-2 mb-2",children:e.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 Select"}),e.jsx(a.Select,{label:"Country",placeholder:"Select a country",options:l,selectedOption:n,onChange:c})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Searchable"}),e.jsx(a.Select,{label:"Country",placeholder:"Search and select...",options:l,searchable:!0,searchPlaceholder:"Type to filter...",showCheck:!0})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Descriptions & Icons"}),e.jsx(a.Select,{label:"Plan",placeholder:"Choose a plan",options:i,showCheck:!0})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Helper Text"}),e.jsx(a.Select,{label:"Language",placeholder:"Select a language",helperText:"Choose your preferred language",options:[{name:"English",value:"en",icon:e.jsx(r.Globe,{className:"h-4 w-4"})},{name:"Spanish",value:"es",icon:e.jsx(r.Globe,{className:"h-4 w-4"})},{name:"French",value:"fr",icon:e.jsx(r.Globe,{className:"h-4 w-4"})}]})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"With Error"}),e.jsx(a.Select,{label:"Category",placeholder:"Select a category",errorMessage:"Category is required",options:[{name:"Option 1",value:"opt1"},{name:"Option 2",value:"opt2"}]})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Disabled"}),e.jsx(a.Select,{label:"Status",placeholder:"Select status",disabled:!0,options:[{name:"Active",value:"active"},{name:"Inactive",value:"inactive"}]})]})]})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Variants",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"grid grid-cols-1 md:grid-cols-3 gap-4",children:[e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Ghost (default)"}),e.jsx(a.Select,{label:"Ghost Variant",placeholder:"Select option",variant:"ghost",options:l})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Solid"}),e.jsx(a.Select,{label:"Solid Variant",placeholder:"Select option",variant:"solid",options:l})]}),e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:"Transparent"}),e.jsx(a.Select,{label:"Transparent Variant",placeholder:"Select option",variant:"transparent",options:l})]})]})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Colors",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx("div",{className:"grid grid-cols-1 gap-4 sm:grid-cols-2 xl:grid-cols-3",children:d.map(({label:s,color:o})=>e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:s}),e.jsx(a.Select,{label:`${s} Select`,placeholder:"Select option",color:o,options:l})]},o))})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Sizes",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx("div",{className:"grid grid-cols-1 gap-4 md:grid-cols-3",children:p.map(({label:s,size:o})=>e.jsxs(a.CardContainer,{className:"p-4",children:[e.jsx(a.Typography,{tag:"h5",className:"mb-3",children:s}),e.jsx(a.Select,{label:`${s} Select`,placeholder:"Select option",size:o,options:l})]},o))})})})}),e.jsx(a.PropPlayground,{componentName:"Select",defaultValues:{label:"Preview Select",placeholder:"Select a country",variant:"ghost",color:"primary",size:"md",helperText:"",errorMessage:"",searchable:!1,searchPlaceholder:"Search...",showCheck:!0,disabled:!1},controlOverrides:[{name:"placeholder",type:"text",description:"Placeholder text rendered before selecting an option"}],includeProps:["label","placeholder","variant","color","size","helperText","errorMessage","searchable","searchPlaceholder","showCheck","disabled"],excludeProps:["options","selectedOption","onChange","onSelect","value","name","buttonClassName","children"],children:s=>e.jsx("div",{className:"w-full max-w-lg",children:e.jsx(a.Select,{...s,placeholder:s.placeholder||"Select a country",options:l,selectedOption:h,onChange:o=>m(o)})})}),e.jsx(a.AutoPropsTable,{componentName:"Select"}),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 { Select } from '@e-burgos/tucu-ui';
+
+const options = [
+  { name: 'Argentina', value: 'ar' },
+  { name: 'Brasil', value: 'br' },
+  { name: 'Chile', value: 'cl' },
+];
+
+// Basic
+<Select
+  label="Country"
+  placeholder="Select a country"
+  options={options}
+  selectedOption={selectedOption}
+  onChange={setSelectedOption}
+/>
+
+// Searchable with check
+<Select
+  label="Country"
+  placeholder="Search..."
+  options={options}
+  searchable
+  searchPlaceholder="Type to filter..."
+  showCheck
+/>
+
+// With descriptions, icons, and disabled options
+const plans = [
+  { name: 'Free', value: 'free', description: 'Basic features' },
+  { name: 'Pro', value: 'pro', description: 'Advanced', icon: <Zap /> },
+  { name: 'Legacy', value: 'legacy', disabled: true },
+];
+<Select label="Plan" options={plans} showCheck />
+
+// Variants
+<Select variant="ghost" options={options} />
+<Select variant="solid" options={options} />
+<Select variant="transparent" options={options} />
+
+// Colors
+<Select color="primary" options={options} />
+<Select color="secondary" options={options} />
+<Select color="danger" options={options} />
+<Select color="info" options={options} />
+<Select color="success" options={options} />
+<Select color="warning" options={options} />
+
+// Sizes
+<Select size="sm" options={options} />
+<Select size="md" options={options} />
+<Select size="lg" options={options} />`})})})})]})};exports.default=u;

package/documentation/SettingsPanelSection-C7_20M4F.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-DWDUS-PU.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const h=()=>{const{mode:a,layout:n,primaryPreset:l,secondaryPreset:d,accentPreset:c,direction:o,setMode:m,setIsSettingsOpen:g,isSettingsOpen:r}=s.useTheme(),x=[{icon:e.jsx(t.Moon,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Mode Switching",description:"Toggle between light and dark modes.",iconBgClassName:"from-blue-500 to-indigo-500"},{icon:e.jsx(t.Globe,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"RTL/LTR Direction",description:"Switch text direction for international apps.",iconBgClassName:"from-green-500 to-emerald-500"},{icon:e.jsx(t.Layout,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Layout Options",description:"Choose between Clean, Admin, and Horizontal layouts.",iconBgClassName:"from-orange-500 to-red-500"},{icon:e.jsx(t.Palette,{className:"w-6 h-6 text-white filter drop-shadow-sm"}),title:"Color Management",description:"Organized in groups: Brand (primary, accent), Surfaces (secondary, backgrounds), Text (primary, muted, border), and Status (success, warning, error, info).",iconBgClassName:"from-pink-500 to-rose-500"}];return e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Settings Panel",description:"Built-in UI for users to customize theme mode, layout, direction, and all color presets at runtime.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-orange-500 via-red-500 to-pink-500 rounded-full flex items-center justify-center shadow-lg",children:e.jsx(t.Settings,{className:"w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg"})})}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(s.Typography,{tag:"h2",className:"mb-2",children:"Panel Features"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"What users can customize through the settings panel"})]}),e.jsx("div",{className:"grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6",children:x.map(i=>e.jsx(s.FeatureCard,{layout:"horizontal",...i},i.title))})]}),e.jsxs("section",{className:"space-y-8",children:[e.jsxs("div",{className:"text-center",children:[e.jsx(s.Typography,{tag:"h2",className:"mb-2",children:"Live Preview"}),e.jsx(s.Typography,{tag:"p",className:"text-gray-500 dark:text-gray-400 max-w-2xl mx-auto",children:"Current theme state and interactive controls"})]}),e.jsx(s.CardContainer,{children:e.jsx(s.CardTitle,{title:"Current Settings",children:e.jsxs("div",{className:"space-y-4",children:[e.jsxs("div",{className:"grid grid-cols-2 sm:grid-cols-3 gap-3",children:[e.jsxs("div",{className:"flex justify-between items-center p-3 bg-gray-200 dark:bg-gray-800 rounded-lg",children:[e.jsx("span",{className:"text-sm font-medium",children:"Mode"}),e.jsx(s.Badge,{variant:"outline",className:"text-xs",children:a})]}),e.jsxs("div",{className:"flex justify-between items-center p-3 bg-gray-200 dark:bg-gray-800 rounded-lg",children:[e.jsx("span",{className:"text-sm font-medium",children:"Layout"}),e.jsx(s.Badge,{variant:"outline",className:"text-xs",children:n})]}),e.jsxs("div",{className:"flex justify-between items-center p-3 bg-gray-200 dark:bg-gray-800 rounded-lg",children:[e.jsx("span",{className:"text-sm font-medium",children:"Primary"}),e.jsx(s.Badge,{variant:"outline",className:"text-xs",children:l?.label||"DEFAULT_PRIMARY"})]}),e.jsxs("div",{className:"flex justify-between items-center p-3 bg-gray-200 dark:bg-gray-800 rounded-lg",children:[e.jsx("span",{className:"text-sm font-medium",children:"Secondary"}),e.jsx(s.Badge,{variant:"outline",className:"text-xs",children:d?.label||"DEFAULT_SECONDARY"})]}),e.jsxs("div",{className:"flex justify-between items-center p-3 bg-gray-200 dark:bg-gray-800 rounded-lg",children:[e.jsx("span",{className:"text-sm font-medium",children:"Accent"}),e.jsx(s.Badge,{variant:"outline",className:"text-xs",children:c?.label||"DEFAULT_ACCENT"})]}),e.jsxs("div",{className:"flex justify-between items-center p-3 bg-gray-200 dark:bg-gray-800 rounded-lg",children:[e.jsx("span",{className:"text-sm font-medium",children:"Direction"}),e.jsx(s.Badge,{variant:"outline",className:"text-xs",children:o||"LTR"})]})]}),e.jsxs("div",{className:"flex gap-2 w-full mt-4",children:[e.jsxs(s.Button,{size:"small",onClick:()=>m(a==="dark"?"light":"dark"),className:"flex-1",children:["Toggle ",a==="dark"?"Light":"Dark"]}),e.jsxs(s.Button,{size:"small",variant:"ghost",onClick:()=>g(!r),className:"flex-1",children:[r?"Close":"Open"," Settings"]})]})]})})})]})]})};exports.default=h;