@e-burgos/tucu-ui 2.4.1 → 2.6.0

package/documentation/MacOSTextStylesSection-DOz_80JV.js

@@ -1,366 +0,0 @@
-import { jsxs as a, Fragment as c, jsx as e } from "react/jsx-runtime";
-import { ay as d, H as m, C as o, a as i, T as l, y as g } from "../index-BOVWnu1L.js";
-import { Type as p, Info as f } from "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const n = [
-  {
-    name: "Large Title",
-    size: "26px",
-    leading: "32px",
-    weight: "400 (Regular)",
-    tracking: "0",
-    font: "SF Pro Display",
-    cssVar: "--macos-font-size-large-title"
-  },
-  {
-    name: "Title 1",
-    size: "22px",
-    leading: "26px",
-    weight: "400 (Regular)",
-    tracking: "0",
-    font: "SF Pro Display",
-    cssVar: "--macos-font-size-title1"
-  },
-  {
-    name: "Title 2",
-    size: "17px",
-    leading: "22px",
-    weight: "400 (Regular)",
-    tracking: "0",
-    font: "SF Pro Text",
-    cssVar: "--macos-font-size-title2"
-  },
-  {
-    name: "Title 3",
-    size: "15px",
-    leading: "20px",
-    weight: "600 (Semibold)",
-    tracking: "0",
-    font: "SF Pro Text",
-    cssVar: "--macos-font-size-title3"
-  },
-  {
-    name: "Headline",
-    size: "13px",
-    leading: "16px",
-    weight: "700 (Bold)",
-    tracking: "0",
-    font: "SF Pro Text",
-    cssVar: "--macos-font-size-body"
-  },
-  {
-    name: "Body",
-    size: "13px",
-    leading: "16px",
-    weight: "400 (Regular)",
-    tracking: "0",
-    font: "SF Pro Text",
-    cssVar: "--macos-font-size-body"
-  },
-  {
-    name: "Callout",
-    size: "12px",
-    leading: "15px",
-    weight: "400 (Regular)",
-    tracking: "0",
-    font: "SF Pro Text",
-    cssVar: "--macos-font-size-callout"
-  },
-  {
-    name: "Subheadline",
-    size: "11px",
-    leading: "14px",
-    weight: "400 (Regular)",
-    tracking: "0.006em",
-    font: "SF Pro Text",
-    cssVar: "--macos-font-size-subheadline"
-  },
-  {
-    name: "Footnote",
-    size: "10px",
-    leading: "13px",
-    weight: "400 (Regular)",
-    tracking: "0.012em",
-    font: "SF Pro Text",
-    cssVar: "--macos-font-size-footnote"
-  },
-  {
-    name: "Caption 1",
-    size: "10px",
-    leading: "13px",
-    weight: "500 (Medium)",
-    tracking: "0.012em",
-    font: "SF Pro Text",
-    cssVar: "--macos-font-size-caption"
-  },
-  {
-    name: "Caption 2",
-    size: "10px",
-    leading: "13px",
-    weight: "400 (Regular)",
-    tracking: "0.012em",
-    font: "SF Pro Text",
-    cssVar: "--macos-font-size-caption"
-  }
-];
-function h(s) {
-  return s.weight.includes("700") ? 700 : s.weight.includes("600") ? 600 : s.weight.includes("500") ? 500 : 400;
-}
-function x(s) {
-  return s.font === "SF Pro Display" ? "var(--macos-font-display, 'Inter', system-ui)" : "var(--macos-font-family, 'Inter', system-ui)";
-}
-const v = () => {
-  const { mode: s } = d(), t = s === "dark";
-  return /* @__PURE__ */ a(c, { children: [
-    /* @__PURE__ */ e(
-      m,
-      {
-        title: "Text Styles",
-        description: "The macOS type scale defines size, weight, leading, and tracking for each text style. Each style adapts to the current appearance mode.",
-        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-gray-800 via-gray-600 to-gray-400 dark:from-gray-200 dark:via-gray-400 dark:to-gray-600 rounded-full flex items-center justify-center shadow-lg border border-gray-500/50", children: /* @__PURE__ */ e(p, { className: "w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white dark:text-gray-900 filter drop-shadow-lg" }) })
-      }
-    ),
-    /* @__PURE__ */ e(o, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Font Family", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "w-full p-4 sm:p-6", children: [
-      /* @__PURE__ */ a("div", { className: "flex items-start gap-3 p-4 rounded-lg bg-blue-50 dark:bg-blue-950/30 border border-blue-200 dark:border-blue-800", children: [
-        /* @__PURE__ */ e(f, { className: "w-5 h-5 text-blue-500 shrink-0 mt-0.5" }),
-        /* @__PURE__ */ a("div", { className: "space-y-2", children: [
-          /* @__PURE__ */ e(
-            l,
-            {
-              tag: "p",
-              className: "text-sm text-blue-800 dark:text-blue-200 font-medium",
-              children: "Alternative Font: Inter Variable"
-            }
-          ),
-          /* @__PURE__ */ a(
-            l,
-            {
-              tag: "p",
-              className: "text-xs text-blue-700 dark:text-blue-300",
-              children: [
-                "Apple's SF Pro is restricted by its license to Apple platforms only. To comply with this restriction, this design system uses",
-                " ",
-                /* @__PURE__ */ e("strong", { children: "Inter" }),
-                " (SIL Open Font License) as the primary typeface and ",
-                /* @__PURE__ */ e("strong", { children: "JetBrains Mono" }),
-                " for monospaced content. Inter closely matches SF Pro's metrics, proportions, and optical sizing, making it an excellent open-source alternative that renders consistently across all platforms."
-              ]
-            }
-          )
-        ] })
-      ] }),
-      /* @__PURE__ */ a("div", { className: "grid grid-cols-1 sm:grid-cols-3 gap-4 mt-6", children: [
-        /* @__PURE__ */ a(
-          "div",
-          {
-            className: "p-4 rounded-lg border border-border",
-            style: { backgroundColor: t ? "#1e1e1e" : "#ffffff" },
-            children: [
-              /* @__PURE__ */ e(
-                "p",
-                {
-                  className: "text-lg mb-2",
-                  style: {
-                    fontFamily: "var(--macos-font-display, 'Inter', system-ui)",
-                    color: t ? "rgba(255, 255, 255, 0.85)" : "rgba(0, 0, 0, 0.85)"
-                  },
-                  children: "Inter (Display)"
-                }
-              ),
-              /* @__PURE__ */ e("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: "Used at ≥20pt. Replaces SF Pro Display for large headlines and titles." })
-            ]
-          }
-        ),
-        /* @__PURE__ */ a(
-          "div",
-          {
-            className: "p-4 rounded-lg border border-border",
-            style: { backgroundColor: t ? "#1e1e1e" : "#ffffff" },
-            children: [
-              /* @__PURE__ */ e(
-                "p",
-                {
-                  className: "text-lg mb-2",
-                  style: {
-                    fontFamily: "var(--macos-font-family, 'Inter', system-ui)",
-                    color: t ? "rgba(255, 255, 255, 0.85)" : "rgba(0, 0, 0, 0.85)"
-                  },
-                  children: "Inter (Text)"
-                }
-              ),
-              /* @__PURE__ */ e("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: "Used at <20pt. Replaces SF Pro Text for body text and UI labels." })
-            ]
-          }
-        ),
-        /* @__PURE__ */ a(
-          "div",
-          {
-            className: "p-4 rounded-lg border border-border",
-            style: { backgroundColor: t ? "#1e1e1e" : "#ffffff" },
-            children: [
-              /* @__PURE__ */ e(
-                "p",
-                {
-                  className: "text-lg mb-2",
-                  style: {
-                    fontFamily: "var(--macos-font-mono, 'JetBrains Mono', monospace)",
-                    color: t ? "rgba(255, 255, 255, 0.85)" : "rgba(0, 0, 0, 0.85)"
-                  },
-                  children: "JetBrains Mono"
-                }
-              ),
-              /* @__PURE__ */ e("p", { className: "text-xs text-gray-500 dark:text-gray-400", children: "Monospaced variant. Replaces SF Mono for code, terminal output, and technical data." })
-            ]
-          }
-        )
-      ] })
-    ] }) }) }),
-    /* @__PURE__ */ e(o, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Type Scale", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
-      "div",
-      {
-        className: "rounded-xl p-6 border border-border",
-        style: { backgroundColor: t ? "#1e1e1e" : "#ffffff" },
-        children: /* @__PURE__ */ e("div", { className: "flex flex-col gap-4", children: n.map((r) => /* @__PURE__ */ a(
-          "div",
-          {
-            className: "flex flex-col sm:flex-row sm:items-baseline gap-2 sm:gap-6 pb-3 border-b border-[var(--color-border)] last:border-0",
-            children: [
-              /* @__PURE__ */ e(
-                "span",
-                {
-                  className: "shrink-0",
-                  style: {
-                    fontFamily: x(r),
-                    fontSize: r.size,
-                    lineHeight: r.leading,
-                    fontWeight: h(r),
-                    letterSpacing: r.tracking,
-                    color: t ? "rgba(255, 255, 255, 0.85)" : "rgba(0, 0, 0, 0.85)"
-                  },
-                  children: r.name
-                }
-              ),
-              /* @__PURE__ */ a("div", { className: "flex flex-wrap gap-3 text-[10px] font-mono text-gray-400", children: [
-                /* @__PURE__ */ e("span", { children: r.size }),
-                /* @__PURE__ */ a("span", { children: [
-                  "/ ",
-                  r.leading
-                ] }),
-                /* @__PURE__ */ e("span", { children: r.weight }),
-                r.tracking !== "0" && /* @__PURE__ */ a("span", { children: [
-                  "tracking: ",
-                  r.tracking
-                ] })
-              ] })
-            ]
-          },
-          r.name
-        )) })
-      }
-    ) }) }) }),
-    /* @__PURE__ */ e(o, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Label Colors", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "w-full p-4 sm:p-6", children: [
-      /* @__PURE__ */ a(
-        l,
-        {
-          tag: "p",
-          className: "text-sm text-gray-500 dark:text-gray-400 mb-4",
-          children: [
-            "Text styles combine with label colors to create visual hierarchy. Showing ",
-            t ? "dark" : "light",
-            " appearance values."
-          ]
-        }
-      ),
-      /* @__PURE__ */ e(
-        "div",
-        {
-          className: "rounded-xl p-6 border border-border",
-          style: { backgroundColor: t ? "#1e1e1e" : "#ffffff" },
-          children: /* @__PURE__ */ a("div", { className: "space-y-3", children: [
-            /* @__PURE__ */ a(
-              "p",
-              {
-                style: {
-                  fontFamily: "var(--macos-font-family, 'Inter', system-ui)",
-                  fontSize: "13px",
-                  lineHeight: "16px",
-                  color: t ? "rgba(255, 255, 255, 0.85)" : "rgba(0, 0, 0, 0.85)"
-                },
-                children: [
-                  /* @__PURE__ */ e("span", { className: "inline-block w-20 text-[10px] font-mono opacity-50", children: "Primary" }),
-                  " ",
-                  "The quick brown fox jumps over the lazy dog"
-                ]
-              }
-            ),
-            /* @__PURE__ */ a(
-              "p",
-              {
-                style: {
-                  fontFamily: "var(--macos-font-family, 'Inter', system-ui)",
-                  fontSize: "13px",
-                  lineHeight: "16px",
-                  color: t ? "rgba(235, 235, 245, 0.6)" : "rgba(60, 60, 67, 0.6)"
-                },
-                children: [
-                  /* @__PURE__ */ e("span", { className: "inline-block w-20 text-[10px] font-mono opacity-70", children: "Secondary" }),
-                  " ",
-                  "The quick brown fox jumps over the lazy dog"
-                ]
-              }
-            ),
-            /* @__PURE__ */ a(
-              "p",
-              {
-                style: {
-                  fontFamily: "var(--macos-font-family, 'Inter', system-ui)",
-                  fontSize: "13px",
-                  lineHeight: "16px",
-                  color: t ? "rgba(235, 235, 245, 0.3)" : "rgba(60, 60, 67, 0.3)"
-                },
-                children: [
-                  /* @__PURE__ */ e("span", { className: "inline-block w-20 text-[10px] font-mono opacity-70", children: "Tertiary" }),
-                  " ",
-                  "The quick brown fox jumps over the lazy dog"
-                ]
-              }
-            )
-          ] })
-        }
-      )
-    ] }) }) }),
-    /* @__PURE__ */ e(o, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "CSS Variables", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e(
-      g,
-      {
-        columns: [
-          { key: "name", label: "Style" },
-          {
-            key: "cssVar",
-            label: "CSS Variable",
-            className: "font-mono text-gray-500"
-          },
-          {
-            key: "size",
-            label: "Size",
-            className: "font-mono text-gray-500"
-          },
-          {
-            key: "leading",
-            label: "Leading",
-            className: "font-mono text-gray-500"
-          },
-          { key: "font", label: "Font", className: "text-gray-500" }
-        ],
-        data: n,
-        maxRows: 15,
-        resizable: !1
-      }
-    ) }) }) })
-  ] });
-};
-export {
-  v as MacOSTextStylesSection,
-  v as default
-};

package/documentation/MacOSToolbarSection-C-uYtli7.js

@@ -1,100 +0,0 @@
-import { jsxs as a, Fragment as n, jsx as e } from "react/jsx-runtime";
-import { useState as i } from "react";
-import { H as d, C as r, a as t, bn as l, bo as c, c as m } from "../index-BOVWnu1L.js";
-import { PanelTop as h, Share2 as b, MoreHorizontal as g, ChevronLeft as u, SlidersHorizontal as p, Mail as f } from "lucide-react";
-import "react-router-dom";
-import "react-dom";
-const T = () => {
-  const [s, o] = i("");
-  return /* @__PURE__ */ a(n, { children: [
-    /* @__PURE__ */ e(
-      d,
-      {
-        title: "MacOSToolbar",
-        description: "A macOS-style toolbar with leading, center, and trailing slots. Supports vibrancy backdrop blur, a transparent mode, and an optional bottom border.",
-        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-sky-400 via-blue-500 to-indigo-600 rounded-full flex items-center justify-center shadow-lg border border-sky-400/50", children: /* @__PURE__ */ e(h, { 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(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(t, { title: "Title + Leading + Trailing", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a("div", { className: "rounded-xl overflow-hidden border border-(--color-semantic-line-primary-subtle) shadow-(--shadow-card)", children: [
-      /* @__PURE__ */ e(
-        l,
-        {
-          title: "Documents",
-          leading: /* @__PURE__ */ a("button", { className: "flex items-center gap-1 text-xs text-[#007aff] hover:opacity-80", children: [
-            /* @__PURE__ */ e(u, { className: "w-3.5 h-3.5" }),
-            "Back"
-          ] }),
-          trailing: /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ e("button", { className: "p-1.5 rounded-md hover:bg-gray-500/10 text-gray-600 dark:text-gray-400", children: /* @__PURE__ */ e(b, { className: "w-4 h-4" }) }),
-            /* @__PURE__ */ e("button", { className: "p-1.5 rounded-md hover:bg-gray-500/10 text-gray-600 dark:text-gray-400", children: /* @__PURE__ */ e(g, { className: "w-4 h-4" }) })
-          ] })
-        }
-      ),
-      /* @__PURE__ */ e("div", { className: "h-24 bg-(--color-semantic-bg) flex items-center justify-center text-sm text-gray-400", children: "Content area" })
-    ] }) }) }) }),
-    /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(t, { title: "Search Bar in Center", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a("div", { className: "rounded-xl overflow-hidden border border-(--color-semantic-line-primary-subtle) shadow-(--shadow-card)", children: [
-      /* @__PURE__ */ e(
-        l,
-        {
-          leading: /* @__PURE__ */ e(f, { className: "w-4 h-4 text-gray-500" }),
-          center: /* @__PURE__ */ e(
-            c,
-            {
-              value: s,
-              onChange: o,
-              onClear: () => o(""),
-              className: "w-56",
-              placeholder: "Search messages"
-            }
-          ),
-          trailing: /* @__PURE__ */ e("button", { className: "p-1.5 rounded-md hover:bg-gray-500/10 text-gray-600 dark:text-gray-400", children: /* @__PURE__ */ e(p, { className: "w-4 h-4" }) })
-        }
-      ),
-      /* @__PURE__ */ e("div", { className: "h-24 bg-(--color-semantic-bg) flex items-center justify-center text-sm text-gray-400", children: "Content area" })
-    ] }) }) }) }),
-    /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(t, { title: "Transparent (no background)", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a("div", { className: "rounded-xl overflow-hidden border border-(--color-semantic-line-primary-subtle) shadow-(--shadow-card) bg-linear-to-br from-blue-50 to-indigo-100 dark:from-gray-800 dark:to-gray-900", children: [
-      /* @__PURE__ */ e(
-        l,
-        {
-          title: "Transparent Toolbar",
-          transparent: !0,
-          bordered: !1
-        }
-      ),
-      /* @__PURE__ */ e("div", { className: "h-24 flex items-center justify-center text-sm text-gray-500", children: "Toolbar blends into background" })
-    ] }) }) }) }),
-    /* @__PURE__ */ e(r, { 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(
-      m,
-      {
-        language: "tsx",
-        code: `import { MacOSToolbar, MacOSSearchBar } from '@e-burgos/tucu-ui';
-
-// Title with leading and trailing slots
-<MacOSToolbar
-  title="Documents"
-  leading={<BackButton />}
-  trailing={<MoreButton />}
-/>
-
-// Search bar in center slot
-<MacOSToolbar
-  center={
-    <MacOSSearchBar
-      value={search}
-      onChange={setSearch}
-      onClear={() => setSearch('')}
-    />
-  }
-  trailing={<FilterButton />}
-/>
-
-// Transparent — blends into parent background
-<MacOSToolbar title="Overlay" transparent bordered={false} />`
-      }
-    ) }) }) })
-  ] });
-};
-export {
-  T as MacOSToolbarSection,
-  T as default
-};

package/documentation/MacOSToolbarSection-CATKLz6C.js

@@ -1,23 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("react"),a=require("../index-CQ1tqJiQ.js"),r=require("lucide-react");require("react-router-dom");require("react-dom");const s=()=>{const[l,t]=o.useState("");return e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"MacOSToolbar",description:"A macOS-style toolbar with leading, center, and trailing slots. Supports vibrancy backdrop blur, a transparent mode, and an optional bottom border.",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-sky-400 via-blue-500 to-indigo-600 rounded-full flex items-center justify-center shadow-lg border border-sky-400/50",children:e.jsx(r.PanelTop,{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:"Title + Leading + Trailing",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"rounded-xl overflow-hidden border border-(--color-semantic-line-primary-subtle) shadow-(--shadow-card)",children:[e.jsx(a.MacOSToolbarSonoma,{title:"Documents",leading:e.jsxs("button",{className:"flex items-center gap-1 text-xs text-[#007aff] hover:opacity-80",children:[e.jsx(r.ChevronLeft,{className:"w-3.5 h-3.5"}),"Back"]}),trailing:e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("button",{className:"p-1.5 rounded-md hover:bg-gray-500/10 text-gray-600 dark:text-gray-400",children:e.jsx(r.Share2,{className:"w-4 h-4"})}),e.jsx("button",{className:"p-1.5 rounded-md hover:bg-gray-500/10 text-gray-600 dark:text-gray-400",children:e.jsx(r.MoreHorizontal,{className:"w-4 h-4"})})]})}),e.jsx("div",{className:"h-24 bg-(--color-semantic-bg) flex items-center justify-center text-sm text-gray-400",children:"Content area"})]})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Search Bar in Center",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"rounded-xl overflow-hidden border border-(--color-semantic-line-primary-subtle) shadow-(--shadow-card)",children:[e.jsx(a.MacOSToolbarSonoma,{leading:e.jsx(r.Mail,{className:"w-4 h-4 text-gray-500"}),center:e.jsx(a.MacOSSearchBar,{value:l,onChange:t,onClear:()=>t(""),className:"w-56",placeholder:"Search messages"}),trailing:e.jsx("button",{className:"p-1.5 rounded-md hover:bg-gray-500/10 text-gray-600 dark:text-gray-400",children:e.jsx(r.SlidersHorizontal,{className:"w-4 h-4"})})}),e.jsx("div",{className:"h-24 bg-(--color-semantic-bg) flex items-center justify-center text-sm text-gray-400",children:"Content area"})]})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Transparent (no background)",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"rounded-xl overflow-hidden border border-(--color-semantic-line-primary-subtle) shadow-(--shadow-card) bg-linear-to-br from-blue-50 to-indigo-100 dark:from-gray-800 dark:to-gray-900",children:[e.jsx(a.MacOSToolbarSonoma,{title:"Transparent Toolbar",transparent:!0,bordered:!1}),e.jsx("div",{className:"h-24 flex items-center justify-center text-sm text-gray-500",children:"Toolbar blends into background"})]})})})}),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 { MacOSToolbar, MacOSSearchBar } from '@e-burgos/tucu-ui';
-
-// Title with leading and trailing slots
-<MacOSToolbar
-  title="Documents"
-  leading={<BackButton />}
-  trailing={<MoreButton />}
-/>
-
-// Search bar in center slot
-<MacOSToolbar
-  center={
-    <MacOSSearchBar
-      value={search}
-      onChange={setSearch}
-      onClear={() => setSearch('')}
-    />
-  }
-  trailing={<FilterButton />}
-/>
-
-// Transparent — blends into parent background
-<MacOSToolbar title="Overlay" transparent bordered={false} />`})})})})]})};exports.MacOSToolbarSection=s;exports.default=s;

package/documentation/MacOSWidgetSection-3qzvChkc.js

@@ -1,19 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),s=require("../index-CQ1tqJiQ.js"),t=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const i=()=>e.jsxs(e.Fragment,{children:[e.jsx(s.HeroCard,{title:"Widget",description:"macOS-style widget cards in four sizes with optional glass/vibrancy backdrop, icon header, and subtitle. Perfect for dashboards, quick-glance info, and control center items.",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-emerald-500 via-teal-500 to-cyan-600 rounded-full flex items-center justify-center shadow-lg border border-emerald-500/50",children:e.jsx(t.LayoutGrid,{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(s.CardContainer,{className:"overflow-hidden",children:e.jsx(s.CardTitle,{title:"All Sizes",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx("div",{className:"flex flex-wrap gap-6 items-start justify-center",children:["sm","md","lg","xl"].map(a=>e.jsxs(s.MacOSWidget,{size:a,children:[e.jsx(s.MacOSWidgetHeader,{title:`Widget ${a.toUpperCase()}`,subtitle:"Description",icon:e.jsx(t.Cloud,{className:"w-4 h-4"})}),e.jsxs("div",{className:"px-3 pb-3 text-xs text-gray-500 dark:text-gray-400",children:["Content area for the ",a," widget."]})]},a))})})})}),e.jsx(s.CardContainer,{className:"overflow-hidden",children:e.jsx(s.CardTitle,{title:"Glass Mode",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6 bg-linear-to-br from-purple-600/30 via-blue-500/30 to-cyan-400/30 rounded-lg",children:e.jsx("div",{className:"flex flex-wrap gap-6 items-start justify-center",children:["sm","md","lg"].map(a=>e.jsxs(s.MacOSWidget,{size:a,glass:!0,children:[e.jsx(s.MacOSWidgetHeader,{title:`Glass ${a.toUpperCase()}`,icon:e.jsx(t.Sparkles,{className:"w-4 h-4"})}),e.jsx("div",{className:"px-3 pb-3 text-xs text-gray-300",children:"Glass vibrancy mode — blurred background."})]},a))})})})}),e.jsx(s.PropPlayground,{componentName:"MacOSWidget",defaultValues:{size:"md",glass:!1},controlOverrides:[{name:"size",type:"select",options:["sm","md","lg","xl"],description:"Widget size preset"},{name:"glass",type:"boolean",description:"Enable glass/vibrancy backdrop"}],includeProps:["size","glass"],excludeProps:["className"],children:a=>e.jsx("div",{className:"flex items-center justify-center p-6 rounded-lg bg-linear-to-br from-purple-600/20 via-blue-500/20 to-cyan-400/20",children:e.jsxs(s.MacOSWidget,{...a,children:[e.jsx(s.MacOSWidgetHeader,{title:"Preview Widget",subtitle:"Subtitle text",icon:e.jsx(t.Activity,{className:"w-4 h-4"})}),e.jsx("div",{className:"px-3 pb-3 text-xs text-gray-600 dark:text-gray-400",children:"Widget content — adjust props above."})]})})}),e.jsx(s.AutoPropsTable,{componentName:"MacOSWidget"}),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 { MacOSWidget, MacOSWidgetHeader } from '@e-burgos/tucu-ui';
-
-// Basic widget
-<MacOSWidget size="md">
-  <MacOSWidgetHeader
-    title="Weather"
-    subtitle="San Francisco"
-    icon={<CloudIcon />}
-  />
-  <div className="px-3 pb-3">72°F — Sunny</div>
-</MacOSWidget>
-
-// Glass mode on gradient background
-<MacOSWidget size="lg" glass>
-  <MacOSWidgetHeader title="Music" icon={<MusicIcon />} />
-  <div className="px-3 pb-3">Now Playing — Song Title</div>
-</MacOSWidget>
-
-// Sizes: 'sm' | 'md' | 'lg' | 'xl'`})})})})]});exports.MacOSWidgetSection=i;exports.default=i;

package/documentation/MacOSWidgetSection-Cj0SdOxn.js

@@ -1,107 +0,0 @@
-import { jsxs as t, Fragment as d, jsx as e } from "react/jsx-runtime";
-import { H as c, C as s, a as i, bs as l, bt as r, P as o, A as n, c as m } from "../index-BOVWnu1L.js";
-import { LayoutGrid as p, Cloud as g, Sparkles as u, Activity as h } from "lucide-react";
-import "react-router-dom";
-import "react";
-import "react-dom";
-const y = () => /* @__PURE__ */ t(d, { children: [
-  /* @__PURE__ */ e(
-    c,
-    {
-      title: "Widget",
-      description: "macOS-style widget cards in four sizes with optional glass/vibrancy backdrop, icon header, and subtitle. Perfect for dashboards, quick-glance info, and control center items.",
-      icon: /* @__PURE__ */ e("div", { className: "w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-emerald-500 via-teal-500 to-cyan-600 rounded-full flex items-center justify-center shadow-lg border border-emerald-500/50", children: /* @__PURE__ */ e(p, { 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(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "All Sizes", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-6 items-start justify-center", children: ["sm", "md", "lg", "xl"].map((a) => /* @__PURE__ */ t(l, { size: a, children: [
-    /* @__PURE__ */ e(
-      r,
-      {
-        title: `Widget ${a.toUpperCase()}`,
-        subtitle: "Description",
-        icon: /* @__PURE__ */ e(g, { className: "w-4 h-4" })
-      }
-    ),
-    /* @__PURE__ */ t("div", { className: "px-3 pb-3 text-xs text-gray-500 dark:text-gray-400", children: [
-      "Content area for the ",
-      a,
-      " widget."
-    ] })
-  ] }, a)) }) }) }) }),
-  /* @__PURE__ */ e(s, { className: "overflow-hidden", children: /* @__PURE__ */ e(i, { title: "Glass Mode", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6 bg-linear-to-br from-purple-600/30 via-blue-500/30 to-cyan-400/30 rounded-lg", children: /* @__PURE__ */ e("div", { className: "flex flex-wrap gap-6 items-start justify-center", children: ["sm", "md", "lg"].map((a) => /* @__PURE__ */ t(l, { size: a, glass: !0, children: [
-    /* @__PURE__ */ e(
-      r,
-      {
-        title: `Glass ${a.toUpperCase()}`,
-        icon: /* @__PURE__ */ e(u, { className: "w-4 h-4" })
-      }
-    ),
-    /* @__PURE__ */ e("div", { className: "px-3 pb-3 text-xs text-gray-300", children: "Glass vibrancy mode — blurred background." })
-  ] }, a)) }) }) }) }),
-  /* @__PURE__ */ e(
-    o,
-    {
-      componentName: "MacOSWidget",
-      defaultValues: {
-        size: "md",
-        glass: !1
-      },
-      controlOverrides: [
-        {
-          name: "size",
-          type: "select",
-          options: ["sm", "md", "lg", "xl"],
-          description: "Widget size preset"
-        },
-        {
-          name: "glass",
-          type: "boolean",
-          description: "Enable glass/vibrancy backdrop"
-        }
-      ],
-      includeProps: ["size", "glass"],
-      excludeProps: ["className"],
-      children: (a) => /* @__PURE__ */ e("div", { className: "flex items-center justify-center p-6 rounded-lg bg-linear-to-br from-purple-600/20 via-blue-500/20 to-cyan-400/20", children: /* @__PURE__ */ t(l, { ...a, children: [
-        /* @__PURE__ */ e(
-          r,
-          {
-            title: "Preview Widget",
-            subtitle: "Subtitle text",
-            icon: /* @__PURE__ */ e(h, { className: "w-4 h-4" })
-          }
-        ),
-        /* @__PURE__ */ e("div", { className: "px-3 pb-3 text-xs text-gray-600 dark:text-gray-400", children: "Widget content — adjust props above." })
-      ] }) })
-    }
-  ),
-  /* @__PURE__ */ e(n, { componentName: "MacOSWidget" }),
-  /* @__PURE__ */ e(s, { 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,
-    {
-      language: "tsx",
-      code: `import { MacOSWidget, MacOSWidgetHeader } from '@e-burgos/tucu-ui';
-
-// Basic widget
-<MacOSWidget size="md">
-  <MacOSWidgetHeader
-    title="Weather"
-    subtitle="San Francisco"
-    icon={<CloudIcon />}
-  />
-  <div className="px-3 pb-3">72°F — Sunny</div>
-</MacOSWidget>
-
-// Glass mode on gradient background
-<MacOSWidget size="lg" glass>
-  <MacOSWidgetHeader title="Music" icon={<MusicIcon />} />
-  <div className="px-3 pb-3">Now Playing — Song Title</div>
-</MacOSWidget>
-
-// Sizes: 'sm' | 'md' | 'lg' | 'xl'`
-    }
-  ) }) }) })
-] });
-export {
-  y as MacOSWidgetSection,
-  y as default
-};

package/documentation/MacOSWindowSection-BoHCg9F6.js

@@ -1,22 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("react"),i=require("../index-CQ1tqJiQ.js"),n=require("lucide-react");require("react-router-dom");require("react-dom");function d(t){return e.jsx("div",{className:"relative rounded-xl bg-gray-100 dark:bg-gray-800/50 p-8",style:{minHeight:220},children:e.jsx(i.MacOSWindow,{...t,defaultWidth:t.defaultWidth??380,children:e.jsx("div",{className:"p-4 text-sm text-gray-700 dark:text-gray-300",children:"Interactive window — adjust props above."})})})}const l=()=>{const[t,s]=r.useState(!0);return e.jsxs(e.Fragment,{children:[e.jsx(i.HeroCard,{title:"Window",description:"A macOS-style window container with vibrancy title bar, traffic-light buttons, drag & resize support, maximize/minimize states, and optional action slots.",icon:e.jsx("div",{className:"w-20 h-20 sm:w-24 sm:h-24 md:w-32 md:h-32 bg-linear-to-br from-blue-500 via-indigo-500 to-purple-600 rounded-full flex items-center justify-center shadow-lg border border-blue-500/50",children:e.jsx(n.AppWindow,{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(i.CardContainer,{className:"overflow-hidden",children:e.jsx(i.CardTitle,{title:"Interactive — Drag, Resize, Maximize",className:"mt-2 mb-2",children:e.jsx("div",{className:"relative w-full overflow-hidden",style:{height:400},children:e.jsx(i.MacOSWindow,{title:"Drag & Resize Me",defaultWidth:420,defaultHeight:220,children:e.jsxs("div",{className:"p-6 text-sm text-gray-700 dark:text-gray-300",children:[e.jsx("p",{className:"mb-2 font-medium",children:"Try these interactions:"}),e.jsxs("ul",{className:"list-disc pl-5 space-y-1 text-[12px]",children:[e.jsx("li",{children:"Drag the title bar to move the window"}),e.jsx("li",{children:"Drag any edge or corner to resize"}),e.jsx("li",{children:"Double-click the title bar to maximize"}),e.jsx("li",{children:"Click the green traffic light to maximize/restore"}),e.jsx("li",{children:"Click the yellow traffic light to restore default size"})]})]})})})})}),e.jsx(i.CardContainer,{className:"overflow-hidden",children:e.jsx(i.CardTitle,{title:"Traffic Lights — Left (default)",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(i.MacOSWindow,{title:"My Application",draggable:!1,resizable:!1,onClose:()=>alert("close"),children:e.jsx("div",{className:"p-6 text-sm text-gray-700 dark:text-gray-300",children:"Window content goes here. The title bar uses vibrancy material and the traffic lights appear on hover."})})})})}),e.jsx(i.CardContainer,{className:"overflow-hidden",children:e.jsx(i.CardTitle,{title:"Traffic Lights — Right",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(i.MacOSWindow,{title:"Settings",trafficLightsPosition:"right",draggable:!1,resizable:!1,children:e.jsx("div",{className:"p-6 text-sm text-gray-700 dark:text-gray-300",children:"Traffic lights positioned on the right side of the title bar."})})})})}),e.jsx(i.CardContainer,{className:"overflow-hidden",children:e.jsx(i.CardTitle,{title:"Without Traffic Lights + Custom Actions",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(i.MacOSWindow,{title:"Document",showTrafficLights:!1,draggable:!1,resizable:!1,actions:e.jsx(i.Button,{size:"mini",shape:"rounded",color:"info",children:"Save"}),children:e.jsx("div",{className:"p-6 text-sm text-gray-700 dark:text-gray-300",children:"Traffic lights hidden. A custom action button appears in the trailing slot."})})})})}),e.jsx(i.CardContainer,{className:"overflow-hidden",children:e.jsx(i.CardTitle,{title:"Toggle Visibility",className:"mt-2 mb-2",children:e.jsxs("div",{className:"w-full p-4 sm:p-6 space-y-4",children:[e.jsx(i.Button,{onClick:()=>s(a=>!a),children:t?"Hide Window":"Show Window"}),t&&e.jsx(i.MacOSWindow,{title:"Toggled Window",draggable:!1,resizable:!1,onClose:()=>s(!1),children:e.jsx("div",{className:"p-6 text-sm text-gray-700 dark:text-gray-300",children:"Click the red traffic light or the button above to close."})})]})})}),e.jsx(i.PropPlayground,{componentName:"MacOSWindow",defaultValues:{title:"My Window",draggable:!0,resizable:!0,showTrafficLights:!0,trafficLightsPosition:"left",defaultWidth:380,defaultHeight:200,minWidth:200,minHeight:120},controlOverrides:[{name:"title",type:"text",description:"Window title displayed in the title bar"},{name:"draggable",type:"boolean",description:"Allow drag-moving by the title bar"},{name:"resizable",type:"boolean",description:"Allow resizing from edges/corners"},{name:"showTrafficLights",type:"boolean",description:"Show close/minimize/maximize buttons"},{name:"trafficLightsPosition",type:"select",options:["left","right"],description:"Position of traffic light buttons"},{name:"defaultWidth",type:"text",description:"Initial width (px or CSS value)"},{name:"defaultHeight",type:"text",description:"Initial height (px or CSS value)"},{name:"minWidth",type:"text",description:"Minimum width in pixels"},{name:"minHeight",type:"text",description:"Minimum height in pixels"}],includeProps:["title","draggable","resizable","showTrafficLights","trafficLightsPosition","defaultWidth","defaultHeight","minWidth","minHeight"],excludeProps:["className","titleBarClassName","actions","onClose","onMinimize","onMaximize"],children:a=>e.jsx(d,{...a})}),e.jsx(i.AutoPropsTable,{componentName:"MacOSWindow"}),e.jsx(i.CardContainer,{className:"overflow-hidden",children:e.jsx(i.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsx(i.CodeBlock,{language:"tsx",code:`import { MacOSWindow } from '@e-burgos/tucu-ui';
-
-// Interactive window — drag, resize, maximize
-<MacOSWindow
-  title="My Application"
-  defaultWidth={500}
-  defaultHeight={300}
-  minWidth={200}
-  minHeight={120}
->
-  <div className="p-6">Drag, resize, or double-click title bar</div>
-</MacOSWindow>
-
-// Static window (no drag/resize)
-<MacOSWindow title="Static" draggable={false} resizable={false}>
-  <div className="p-6">Content</div>
-</MacOSWindow>
-
-// Traffic lights on the right
-<MacOSWindow title="Settings" trafficLightsPosition="right">
-  <div className="p-6">Content</div>
-</MacOSWindow>`})})})})]})};exports.MacOSWindowSection=l;exports.default=l;