@e-burgos/tucu-ui 2.0.7 → 2.0.9

package/documentation/TahoeSearchBarSection-BGwmcq39.js

@@ -0,0 +1,117 @@
+import { jsxs as a, Fragment as n, jsx as e } from "react/jsx-runtime";
+import { useState as d } from "react";
+import { H as h, C as r, a as s, bH as l, c as u, P as p, A as x } from "../index-lfg6LZ1p.js";
+import { Search as S } from "lucide-react";
+import "react-router-dom";
+import "react-dom";
+const C = () => {
+  const [c, o] = d(""), [i, m] = d("Documents");
+  return /* @__PURE__ */ a(n, { children: [
+    /* @__PURE__ */ e(
+      h,
+      {
+        title: "Search Bar",
+        description: "Liquid Glass search field with glass material background, clear button, and submit/escape keyboard support.",
+        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-cyan-500 via-sky-500 to-blue-600 rounded-full flex items-center justify-center shadow-lg border border-cyan-500/50", children: /* @__PURE__ */ e(S, { className: "w-10 h-10 sm:w-12 sm:h-12 md:w-16 md:h-16 text-white filter drop-shadow-lg" }) })
+      }
+    ),
+    /* @__PURE__ */ e(r, { children: /* @__PURE__ */ e(s, { title: "Sizes", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "flex flex-col gap-4 max-w-sm", children: [
+      /* @__PURE__ */ a("div", { children: [
+        /* @__PURE__ */ e("span", { className: "text-[12px] text-[var(--macos-tahoe-text-muted)] mb-1 block", children: "Small" }),
+        /* @__PURE__ */ e(
+          l,
+          {
+            size: "sm",
+            placeholder: "Search...",
+            className: "w-full"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ a("div", { children: [
+        /* @__PURE__ */ e("span", { className: "text-[12px] text-[var(--macos-tahoe-text-muted)] mb-1 block", children: "Medium (default)" }),
+        /* @__PURE__ */ e(
+          l,
+          {
+            size: "md",
+            placeholder: "Search...",
+            className: "w-full"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ a("div", { children: [
+        /* @__PURE__ */ e("span", { className: "text-[12px] text-[var(--macos-tahoe-text-muted)] mb-1 block", children: "Large" }),
+        /* @__PURE__ */ e(
+          l,
+          {
+            size: "lg",
+            placeholder: "Search...",
+            className: "w-full"
+          }
+        )
+      ] })
+    ] }) }) }),
+    /* @__PURE__ */ e(r, { children: /* @__PURE__ */ e(s, { title: "Interactive", className: "mt-2 mb-2", children: /* @__PURE__ */ a("div", { className: "max-w-md space-y-3", children: [
+      /* @__PURE__ */ e(
+        l,
+        {
+          value: c,
+          onChange: o,
+          onClear: () => o(""),
+          onSubmit: (t) => alert(`Searched: ${t}`),
+          placeholder: "Type and press Enter...",
+          className: "w-full"
+        }
+      ),
+      /* @__PURE__ */ a("p", { className: "text-[12px] text-[var(--macos-tahoe-text-muted)]", children: [
+        "Current value: “",
+        c,
+        "”"
+      ] })
+    ] }) }) }),
+    /* @__PURE__ */ e(r, { children: /* @__PURE__ */ e(s, { title: "With Pre-filled Value", className: "mt-2 mb-2", children: /* @__PURE__ */ e(
+      l,
+      {
+        value: i,
+        onChange: m,
+        onClear: () => m(""),
+        size: "lg",
+        className: "max-w-sm"
+      }
+    ) }) }),
+    /* @__PURE__ */ e(r, { children: /* @__PURE__ */ e(s, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e(
+      u,
+      {
+        code: `import { MacOSTahoeSearchBar } from '@e-burgos/tucu-ui';
+
+<MacOSTahoeSearchBar
+  value={query}
+  placeholder="Search files..."
+  size="md"
+  onChange={setQuery}
+  onClear={() => setQuery('')}
+  onSubmit={(q) => search(q)}
+/>`,
+        language: "tsx"
+      }
+    ) }) }),
+    /* @__PURE__ */ e(
+      p,
+      {
+        componentName: "MacOSTahoeSearchBar",
+        defaultValues: {
+          placeholder: "Search...",
+          size: "md",
+          autoFocus: !1
+        },
+        includeProps: ["placeholder", "size", "autoFocus"],
+        excludeProps: ["className", "value", "onChange", "onClear", "onSubmit"],
+        children: (t) => /* @__PURE__ */ e("div", { className: "max-w-sm", children: /* @__PURE__ */ e(l, { ...t, className: "w-full" }) })
+      }
+    ),
+    /* @__PURE__ */ e(x, { componentName: "MacOSTahoeSearchBar" })
+  ] });
+};
+export {
+  C as TahoeSearchBarSection,
+  C as default
+};

package/documentation/TahoeSegmentedControlSection-C2tTySf8.js

@@ -0,0 +1,178 @@
+import { jsxs as l, Fragment as r, jsx as e } from "react/jsx-runtime";
+import { useState as d } from "react";
+import { H as h, C as o, a as i, bI as a, c as u, P as v, A as b } from "../index-lfg6LZ1p.js";
+import { ToggleLeft as p, List as g, Grid3x3 as x, Columns3 as f } from "lucide-react";
+import "react-router-dom";
+import "react-dom";
+function C(t) {
+  const [n, s] = d("day");
+  return /* @__PURE__ */ e(
+    a,
+    {
+      options: [
+        { label: "Day", value: "day" },
+        { label: "Week", value: "week" },
+        { label: "Month", value: "month" }
+      ],
+      value: n,
+      onChange: s,
+      size: t.size,
+      fullWidth: t.fullWidth
+    }
+  );
+}
+const z = () => {
+  const [t, n] = d("list"), [s, m] = d("all");
+  return /* @__PURE__ */ l(r, { children: [
+    /* @__PURE__ */ e(
+      h,
+      {
+        title: "Segmented Control",
+        description: "Glass-material segmented control with prominent backdrop for the active segment. Supports icons, sizes, full-width mode, and disabled options.",
+        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-600 rounded-full flex items-center justify-center shadow-lg border border-teal-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(o, { children: /* @__PURE__ */ e(i, { title: "Sizes", className: "mt-2 mb-2", children: /* @__PURE__ */ l("div", { className: "flex flex-col gap-4 items-start", children: [
+      /* @__PURE__ */ l("div", { children: [
+        /* @__PURE__ */ e("span", { className: "text-[12px] text-(--macos-tahoe-text-muted) mb-1 block", children: "Small" }),
+        /* @__PURE__ */ e(
+          a,
+          {
+            size: "sm",
+            options: [
+              { label: "Day", value: "day" },
+              { label: "Week", value: "week" },
+              { label: "Month", value: "month" }
+            ],
+            value: "day",
+            onChange: () => {
+            }
+          }
+        )
+      ] }),
+      /* @__PURE__ */ l("div", { children: [
+        /* @__PURE__ */ e("span", { className: "text-[12px] text-(--macos-tahoe-text-muted) mb-1 block", children: "Medium (default)" }),
+        /* @__PURE__ */ e(
+          a,
+          {
+            size: "md",
+            options: [
+              { label: "Day", value: "day" },
+              { label: "Week", value: "week" },
+              { label: "Month", value: "month" }
+            ],
+            value: "week",
+            onChange: () => {
+            }
+          }
+        )
+      ] }),
+      /* @__PURE__ */ l("div", { children: [
+        /* @__PURE__ */ e("span", { className: "text-[12px] text-(--macos-tahoe-text-muted) mb-1 block", children: "Large" }),
+        /* @__PURE__ */ e(
+          a,
+          {
+            size: "lg",
+            options: [
+              { label: "Day", value: "day" },
+              { label: "Week", value: "week" },
+              { label: "Month", value: "month" }
+            ],
+            value: "month",
+            onChange: () => {
+            }
+          }
+        )
+      ] })
+    ] }) }) }),
+    /* @__PURE__ */ e(o, { children: /* @__PURE__ */ l(i, { title: "With Icons", className: "mt-2 mb-2", children: [
+      /* @__PURE__ */ e(
+        a,
+        {
+          options: [
+            {
+              label: "List",
+              value: "list",
+              icon: /* @__PURE__ */ e(g, { className: "h-3.5 w-3.5" })
+            },
+            {
+              label: "Grid",
+              value: "grid",
+              icon: /* @__PURE__ */ e(x, { className: "h-3.5 w-3.5" })
+            },
+            {
+              label: "Columns",
+              value: "columns",
+              icon: /* @__PURE__ */ e(f, { className: "h-3.5 w-3.5" })
+            }
+          ],
+          value: t,
+          onChange: n
+        }
+      ),
+      /* @__PURE__ */ l("p", { className: "mt-2 text-[12px] text-(--macos-tahoe-text-muted)", children: [
+        "Selected: ",
+        t
+      ] })
+    ] }) }),
+    /* @__PURE__ */ e(o, { children: /* @__PURE__ */ e(i, { title: "Full Width", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "max-w-md", children: /* @__PURE__ */ e(
+      a,
+      {
+        fullWidth: !0,
+        options: [
+          { label: "All", value: "all" },
+          { label: "Active", value: "active" },
+          { label: "Archived", value: "archived" }
+        ],
+        value: s,
+        onChange: m
+      }
+    ) }) }) }),
+    /* @__PURE__ */ e(o, { children: /* @__PURE__ */ e(i, { title: "With Disabled Option", className: "mt-2 mb-2", children: /* @__PURE__ */ e(
+      a,
+      {
+        options: [
+          { label: "Option A", value: "a" },
+          { label: "Option B", value: "b", disabled: !0 },
+          { label: "Option C", value: "c" }
+        ],
+        value: "a",
+        onChange: () => {
+        }
+      }
+    ) }) }),
+    /* @__PURE__ */ e(o, { children: /* @__PURE__ */ e(i, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e(
+      u,
+      {
+        code: `import { MacOSTahoeSegmentedControl } from '@e-burgos/tucu-ui';
+
+<MacOSTahoeSegmentedControl
+  options={[
+    { label: 'List', value: 'list', icon: <ListIcon /> },
+    { label: 'Grid', value: 'grid', icon: <GridIcon /> },
+  ]}
+  value={view}
+  onChange={setView}
+  size="md"
+  fullWidth={false}
+/>`,
+        language: "tsx"
+      }
+    ) }) }),
+    /* @__PURE__ */ e(
+      v,
+      {
+        componentName: "MacOSTahoeSegmentedControl",
+        defaultValues: { size: "md", fullWidth: !1 },
+        includeProps: ["size", "fullWidth"],
+        excludeProps: ["className", "options", "value", "onChange"],
+        children: (c) => /* @__PURE__ */ e(C, { ...c })
+      }
+    ),
+    /* @__PURE__ */ e(b, { componentName: "MacOSTahoeSegmentedControl" })
+  ] });
+};
+export {
+  z as TahoeSegmentedControlSection,
+  z as default
+};

package/documentation/TahoeSegmentedControlSection-gNZlSqSs.js

@@ -0,0 +1,12 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),n=require("react"),l=require("../index-BaGqriuz.js"),t=require("lucide-react");require("react-router-dom");require("react-dom");function c(a){const[o,s]=n.useState("day");return e.jsx(l.MacOSTahoeSegmentedControl,{options:[{label:"Day",value:"day"},{label:"Week",value:"week"},{label:"Month",value:"month"}],value:o,onChange:s,size:a.size,fullWidth:a.fullWidth})}const i=()=>{const[a,o]=n.useState("list"),[s,d]=n.useState("all");return e.jsxs(e.Fragment,{children:[e.jsx(l.HeroCard,{title:"Segmented Control",description:"Glass-material segmented control with prominent backdrop for the active segment. Supports icons, sizes, full-width mode, and disabled options.",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-600 rounded-full flex items-center justify-center shadow-lg border border-teal-500/50",children:e.jsx(t.ToggleLeft,{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(l.CardContainer,{children:e.jsx(l.CardTitle,{title:"Sizes",className:"mt-2 mb-2",children:e.jsxs("div",{className:"flex flex-col gap-4 items-start",children:[e.jsxs("div",{children:[e.jsx("span",{className:"text-[12px] text-(--macos-tahoe-text-muted) mb-1 block",children:"Small"}),e.jsx(l.MacOSTahoeSegmentedControl,{size:"sm",options:[{label:"Day",value:"day"},{label:"Week",value:"week"},{label:"Month",value:"month"}],value:"day",onChange:()=>{}})]}),e.jsxs("div",{children:[e.jsx("span",{className:"text-[12px] text-(--macos-tahoe-text-muted) mb-1 block",children:"Medium (default)"}),e.jsx(l.MacOSTahoeSegmentedControl,{size:"md",options:[{label:"Day",value:"day"},{label:"Week",value:"week"},{label:"Month",value:"month"}],value:"week",onChange:()=>{}})]}),e.jsxs("div",{children:[e.jsx("span",{className:"text-[12px] text-(--macos-tahoe-text-muted) mb-1 block",children:"Large"}),e.jsx(l.MacOSTahoeSegmentedControl,{size:"lg",options:[{label:"Day",value:"day"},{label:"Week",value:"week"},{label:"Month",value:"month"}],value:"month",onChange:()=>{}})]})]})})}),e.jsx(l.CardContainer,{children:e.jsxs(l.CardTitle,{title:"With Icons",className:"mt-2 mb-2",children:[e.jsx(l.MacOSTahoeSegmentedControl,{options:[{label:"List",value:"list",icon:e.jsx(t.List,{className:"h-3.5 w-3.5"})},{label:"Grid",value:"grid",icon:e.jsx(t.Grid3x3,{className:"h-3.5 w-3.5"})},{label:"Columns",value:"columns",icon:e.jsx(t.Columns3,{className:"h-3.5 w-3.5"})}],value:a,onChange:o}),e.jsxs("p",{className:"mt-2 text-[12px] text-(--macos-tahoe-text-muted)",children:["Selected: ",a]})]})}),e.jsx(l.CardContainer,{children:e.jsx(l.CardTitle,{title:"Full Width",className:"mt-2 mb-2",children:e.jsx("div",{className:"max-w-md",children:e.jsx(l.MacOSTahoeSegmentedControl,{fullWidth:!0,options:[{label:"All",value:"all"},{label:"Active",value:"active"},{label:"Archived",value:"archived"}],value:s,onChange:d})})})}),e.jsx(l.CardContainer,{children:e.jsx(l.CardTitle,{title:"With Disabled Option",className:"mt-2 mb-2",children:e.jsx(l.MacOSTahoeSegmentedControl,{options:[{label:"Option A",value:"a"},{label:"Option B",value:"b",disabled:!0},{label:"Option C",value:"c"}],value:"a",onChange:()=>{}})})}),e.jsx(l.CardContainer,{children:e.jsx(l.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx(l.CodeBlock,{code:`import { MacOSTahoeSegmentedControl } from '@e-burgos/tucu-ui';
+
+<MacOSTahoeSegmentedControl
+  options={[
+    { label: 'List', value: 'list', icon: <ListIcon /> },
+    { label: 'Grid', value: 'grid', icon: <GridIcon /> },
+  ]}
+  value={view}
+  onChange={setView}
+  size="md"
+  fullWidth={false}
+/>`,language:"tsx"})})}),e.jsx(l.PropPlayground,{componentName:"MacOSTahoeSegmentedControl",defaultValues:{size:"md",fullWidth:!1},includeProps:["size","fullWidth"],excludeProps:["className","options","value","onChange"],children:r=>e.jsx(c,{...r})}),e.jsx(l.AutoPropsTable,{componentName:"MacOSTahoeSegmentedControl"})]})};exports.TahoeSegmentedControlSection=i;exports.default=i;

package/documentation/TahoeToolbarSection-B_mWA-L_.js

@@ -0,0 +1,17 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("../index-BaGqriuz.js"),r=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const s=()=>e.jsxs(e.Fragment,{children:[e.jsx(a.HeroCard,{title:"MacOSToolbarTahoe",description:"Tahoe-style toolbar with Liquid Glass blur, leading / center / trailing slots, optional border, and a title shorthand.",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:"With 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-[14px] overflow-hidden border border-[var(--macos-tahoe-border,rgba(0,0,0,0.1))] shadow-[var(--shadow-card)]",children:[e.jsx(a.MacOSToolbarTahoe,{leading:e.jsxs("button",{className:"flex items-center gap-1.5 text-sm text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200",children:[e.jsx(r.ChevronLeft,{className:"h-4 w-4"}),"Back"]}),title:"Dashboard",trailing:e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx("button",{className:"rounded-[8px] p-1.5 text-gray-500 hover:bg-black/5 dark:hover:bg-white/8",children:e.jsx(r.Search,{className:"h-4 w-4"})}),e.jsx("button",{className:"rounded-[8px] p-1.5 text-gray-500 hover:bg-black/5 dark:hover:bg-white/8",children:e.jsx(r.Bell,{className:"h-4 w-4"})}),e.jsxs("button",{className:"flex items-center gap-1.5 rounded-[10px] px-3 py-1 text-sm bg-blue-500 text-white hover:bg-blue-600",children:[e.jsx(r.Plus,{className:"h-3.5 w-3.5"}),"New"]})]})}),e.jsx("div",{className:"flex h-24 items-center justify-center bg-[var(--color-semantic-bg)] text-sm text-gray-400",children:"Content area"})]})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Center Slot (Custom Content)",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"rounded-[14px] overflow-hidden border border-[var(--macos-tahoe-border,rgba(0,0,0,0.1))] shadow-[var(--shadow-card)]",children:[e.jsx(a.MacOSToolbarTahoe,{center:e.jsxs("div",{className:"flex items-center gap-2 rounded-[10px] bg-black/5 dark:bg-white/8 px-3 py-1.5",children:[e.jsx(r.Search,{className:"h-3.5 w-3.5 text-gray-400"}),e.jsx("span",{className:"text-sm text-gray-400",children:"Search…"})]}),trailing:e.jsx("button",{className:"rounded-[8px] p-1.5 text-gray-500 hover:bg-black/5 dark:hover:bg-white/8",children:e.jsx(r.Settings,{className:"h-4 w-4"})})}),e.jsx("div",{className:"flex h-24 items-center justify-center bg-[var(--color-semantic-bg)] text-sm text-gray-400",children:"Content area"})]})})})}),e.jsx(a.CardContainer,{className:"overflow-hidden",children:e.jsx(a.CardTitle,{title:"Without Border",className:"mt-2 mb-2",children:e.jsx("div",{className:"w-full p-4 sm:p-6",children:e.jsxs("div",{className:"rounded-[14px] overflow-hidden border border-[var(--macos-tahoe-border,rgba(0,0,0,0.1))] shadow-[var(--shadow-card)]",children:[e.jsx(a.MacOSToolbarTahoe,{title:"No Border",bordered:!1}),e.jsx("div",{className:"flex h-24 items-center justify-center bg-[var(--color-semantic-bg)] text-sm text-gray-400",children:"Content area"})]})})})}),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 { MacOSToolbarTahoe } from '@e-burgos/tucu-ui';
+
+function Page() {
+  return (
+    <div className="flex flex-col h-full">
+      <MacOSToolbarTahoe
+        leading={<BackButton />}
+        title="Dashboard"
+        trailing={<NewButton />}
+        bordered
+      />
+      <main className="flex-1 overflow-auto p-6">
+        <YourContent />
+      </main>
+    </div>
+  );
+}`})})})})]});exports.TahoeToolbarSection=s;exports.default=s;

package/documentation/TahoeToolbarSection-CndSLUyc.js

@@ -0,0 +1,81 @@
+import { jsxs as a, Fragment as s, jsx as e } from "react/jsx-runtime";
+import { H as d, C as r, a as t, bB as l, c as i } from "../index-lfg6LZ1p.js";
+import { PanelTop as c, Search as o, Bell as n, Plus as h, ChevronLeft as m, Settings as b } from "lucide-react";
+import "react-router-dom";
+import "react";
+import "react-dom";
+const f = () => /* @__PURE__ */ a(s, { children: [
+  /* @__PURE__ */ e(
+    d,
+    {
+      title: "MacOSToolbarTahoe",
+      description: "Tahoe-style toolbar with Liquid Glass blur, leading / center / trailing slots, optional border, and a title shorthand.",
+      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(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(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(t, { title: "With 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-[14px] overflow-hidden border border-[var(--macos-tahoe-border,rgba(0,0,0,0.1))] shadow-[var(--shadow-card)]", children: [
+    /* @__PURE__ */ e(
+      l,
+      {
+        leading: /* @__PURE__ */ a("button", { className: "flex items-center gap-1.5 text-sm text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200", children: [
+          /* @__PURE__ */ e(m, { className: "h-4 w-4" }),
+          "Back"
+        ] }),
+        title: "Dashboard",
+        trailing: /* @__PURE__ */ a("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ e("button", { className: "rounded-[8px] p-1.5 text-gray-500 hover:bg-black/5 dark:hover:bg-white/8", children: /* @__PURE__ */ e(o, { className: "h-4 w-4" }) }),
+          /* @__PURE__ */ e("button", { className: "rounded-[8px] p-1.5 text-gray-500 hover:bg-black/5 dark:hover:bg-white/8", children: /* @__PURE__ */ e(n, { className: "h-4 w-4" }) }),
+          /* @__PURE__ */ a("button", { className: "flex items-center gap-1.5 rounded-[10px] px-3 py-1 text-sm bg-blue-500 text-white hover:bg-blue-600", children: [
+            /* @__PURE__ */ e(h, { className: "h-3.5 w-3.5" }),
+            "New"
+          ] })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ e("div", { className: "flex h-24 items-center justify-center bg-[var(--color-semantic-bg)] text-sm text-gray-400", children: "Content area" })
+  ] }) }) }) }),
+  /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(t, { title: "Center Slot (Custom Content)", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a("div", { className: "rounded-[14px] overflow-hidden border border-[var(--macos-tahoe-border,rgba(0,0,0,0.1))] shadow-[var(--shadow-card)]", children: [
+    /* @__PURE__ */ e(
+      l,
+      {
+        center: /* @__PURE__ */ a("div", { className: "flex items-center gap-2 rounded-[10px] bg-black/5 dark:bg-white/8 px-3 py-1.5", children: [
+          /* @__PURE__ */ e(o, { className: "h-3.5 w-3.5 text-gray-400" }),
+          /* @__PURE__ */ e("span", { className: "text-sm text-gray-400", children: "Search…" })
+        ] }),
+        trailing: /* @__PURE__ */ e("button", { className: "rounded-[8px] p-1.5 text-gray-500 hover:bg-black/5 dark:hover:bg-white/8", children: /* @__PURE__ */ e(b, { className: "h-4 w-4" }) })
+      }
+    ),
+    /* @__PURE__ */ e("div", { className: "flex h-24 items-center justify-center bg-[var(--color-semantic-bg)] text-sm text-gray-400", children: "Content area" })
+  ] }) }) }) }),
+  /* @__PURE__ */ e(r, { className: "overflow-hidden", children: /* @__PURE__ */ e(t, { title: "Without Border", className: "mt-2 mb-2", children: /* @__PURE__ */ e("div", { className: "w-full p-4 sm:p-6", children: /* @__PURE__ */ a("div", { className: "rounded-[14px] overflow-hidden border border-[var(--macos-tahoe-border,rgba(0,0,0,0.1))] shadow-[var(--shadow-card)]", children: [
+    /* @__PURE__ */ e(l, { title: "No Border", bordered: !1 }),
+    /* @__PURE__ */ e("div", { className: "flex h-24 items-center justify-center bg-[var(--color-semantic-bg)] text-sm text-gray-400", children: "Content area" })
+  ] }) }) }) }),
+  /* @__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(
+    i,
+    {
+      language: "tsx",
+      code: `import { MacOSToolbarTahoe } from '@e-burgos/tucu-ui';
+
+function Page() {
+  return (
+    <div className="flex flex-col h-full">
+      <MacOSToolbarTahoe
+        leading={<BackButton />}
+        title="Dashboard"
+        trailing={<NewButton />}
+        bordered
+      />
+      <main className="flex-1 overflow-auto p-6">
+        <YourContent />
+      </main>
+    </div>
+  );
+}`
+    }
+  ) }) }) })
+] });
+export {
+  f as TahoeToolbarSection,
+  f as default
+};

package/documentation/TahoeWidgetSection-CxG_Uvly.js

@@ -0,0 +1,13 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("../index-BaGqriuz.js"),a=require("lucide-react");require("react-router-dom");require("react");require("react-dom");const i=()=>e.jsxs(e.Fragment,{children:[e.jsx(t.HeroCard,{title:"Widget",description:"Glass-material widget cards in four fixed sizes, matching Apple HIG widget dimensions. Includes an optional header with icon, title, subtitle, and actions.",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-violet-500 via-purple-500 to-fuchsia-600 rounded-full flex items-center justify-center shadow-lg border border-violet-500/50",children:e.jsx(a.LayoutDashboard,{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(t.CardContainer,{children:e.jsx(t.CardTitle,{title:"Sizes",className:"mt-2 mb-2",children:e.jsxs("div",{className:"flex flex-wrap gap-5 items-end",children:[e.jsxs(t.MacOSTahoeWidget,{size:"sm",children:[e.jsx(t.MacOSTahoeWidgetHeader,{title:"Weather",icon:e.jsx(a.CloudSun,{className:"h-4 w-4"})}),e.jsx("div",{className:"flex flex-1 items-center justify-center",children:e.jsx("span",{className:"text-3xl font-light text-[var(--macos-tahoe-text)]",children:"24°"})})]}),e.jsxs(t.MacOSTahoeWidget,{size:"md",children:[e.jsx(t.MacOSTahoeWidgetHeader,{title:"Calendar",subtitle:"Today",icon:e.jsx(a.Calendar,{className:"h-4 w-4"})}),e.jsx("div",{className:"flex flex-1 items-center px-4",children:e.jsxs("div",{className:"text-[var(--macos-tahoe-text)]",children:[e.jsx("p",{className:"text-[20px] font-semibold",children:"December 15"}),e.jsx("p",{className:"text-[13px] text-[var(--macos-tahoe-text-muted)]",children:"3 upcoming events"})]})})]})]})})}),e.jsx(t.CardContainer,{children:e.jsx(t.CardTitle,{title:"Large & Extra Large",className:"mt-2 mb-2",children:e.jsxs("div",{className:"flex flex-wrap gap-5 items-end",children:[e.jsxs(t.MacOSTahoeWidget,{size:"lg",children:[e.jsx(t.MacOSTahoeWidgetHeader,{title:"Activity",icon:e.jsx(a.Activity,{className:"h-4 w-4"})}),e.jsx("div",{className:"flex flex-1 items-center justify-center p-3",children:e.jsxs("div",{className:"text-center text-[var(--macos-tahoe-text)]",children:[e.jsx("p",{className:"text-[36px] font-light",children:"520"}),e.jsx("p",{className:"text-[11px] uppercase tracking-wider text-[var(--macos-tahoe-text-muted)]",children:"calories"})]})})]}),e.jsxs(t.MacOSTahoeWidget,{size:"xl",children:[e.jsx(t.MacOSTahoeWidgetHeader,{title:"Notes",subtitle:"3 notes",icon:e.jsx(a.StickyNote,{className:"h-4 w-4"}),actions:e.jsx("button",{className:"text-[12px] text-[var(--macos-tahoe-accent)]",children:"View All"})}),e.jsx("div",{className:"flex-1 space-y-2 overflow-auto p-3.5 pt-2",children:["Meeting notes","Shopping list","Ideas for project"].map(s=>e.jsx("div",{className:"rounded-lg bg-[var(--macos-glass-clear-bg)] p-2.5 text-[13px] text-[var(--macos-tahoe-text)] backdrop-blur-sm border border-[var(--macos-glass-border-subtle)]",children:s},s))})]})]})})}),e.jsx(t.CardContainer,{children:e.jsx(t.CardTitle,{title:"Code Example",className:"mt-2 mb-2",children:e.jsx(t.CodeBlock,{code:`import { MacOSTahoeWidget, MacOSTahoeWidgetHeader } from '@e-burgos/tucu-ui';
+
+<MacOSTahoeWidget size="md">
+  <MacOSTahoeWidgetHeader
+    title="Calendar"
+    subtitle="Today"
+    icon={<CalendarIcon />}
+    actions={<button>View All</button>}
+  />
+  <div className="p-4">Widget content</div>
+</MacOSTahoeWidget>
+
+// Sizes: 'sm' (170×170), 'md' (364×170), 'lg' (170×364), 'xl' (364×364)`,language:"tsx"})})}),e.jsx(t.PropPlayground,{componentName:"MacOSTahoeWidget",defaultValues:{size:"md"},includeProps:["size"],excludeProps:["className"],children:s=>e.jsx("div",{className:"flex justify-center p-4",children:e.jsxs(t.MacOSTahoeWidget,{...s,children:[e.jsx(t.MacOSTahoeWidgetHeader,{title:"Preview",icon:e.jsx(a.LayoutDashboard,{className:"h-4 w-4"})}),e.jsx("div",{className:"flex flex-1 items-center justify-center",children:e.jsx("span",{className:"text-2xl font-light text-[var(--macos-tahoe-text)]",children:"Content"})})]})})}),e.jsx(t.AutoPropsTable,{componentName:"MacOSTahoeWidget"})]});exports.TahoeWidgetSection=i;exports.default=i;

package/documentation/TahoeWidgetSection-DvFhIsO1.js

@@ -0,0 +1,121 @@
+import { jsxs as t, Fragment as o, jsx as e } from "react/jsx-runtime";
+import { H as d, C as l, a as c, bF as a, bG as i, c as n, P as m, A as h } from "../index-lfg6LZ1p.js";
+import { LayoutDashboard as r, CloudSun as x, Calendar as p, Activity as u, StickyNote as g } from "lucide-react";
+import "react-router-dom";
+import "react";
+import "react-dom";
+const T = () => /* @__PURE__ */ t(o, { children: [
+  /* @__PURE__ */ e(
+    d,
+    {
+      title: "Widget",
+      description: "Glass-material widget cards in four fixed sizes, matching Apple HIG widget dimensions. Includes an optional header with icon, title, subtitle, and actions.",
+      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-violet-500 via-purple-500 to-fuchsia-600 rounded-full flex items-center justify-center shadow-lg border border-violet-500/50", children: /* @__PURE__ */ e(r, { 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(l, { children: /* @__PURE__ */ e(c, { title: "Sizes", className: "mt-2 mb-2", children: /* @__PURE__ */ t("div", { className: "flex flex-wrap gap-5 items-end", children: [
+    /* @__PURE__ */ t(a, { size: "sm", children: [
+      /* @__PURE__ */ e(
+        i,
+        {
+          title: "Weather",
+          icon: /* @__PURE__ */ e(x, { className: "h-4 w-4" })
+        }
+      ),
+      /* @__PURE__ */ e("div", { className: "flex flex-1 items-center justify-center", children: /* @__PURE__ */ e("span", { className: "text-3xl font-light text-[var(--macos-tahoe-text)]", children: "24°" }) })
+    ] }),
+    /* @__PURE__ */ t(a, { size: "md", children: [
+      /* @__PURE__ */ e(
+        i,
+        {
+          title: "Calendar",
+          subtitle: "Today",
+          icon: /* @__PURE__ */ e(p, { className: "h-4 w-4" })
+        }
+      ),
+      /* @__PURE__ */ e("div", { className: "flex flex-1 items-center px-4", children: /* @__PURE__ */ t("div", { className: "text-[var(--macos-tahoe-text)]", children: [
+        /* @__PURE__ */ e("p", { className: "text-[20px] font-semibold", children: "December 15" }),
+        /* @__PURE__ */ e("p", { className: "text-[13px] text-[var(--macos-tahoe-text-muted)]", children: "3 upcoming events" })
+      ] }) })
+    ] })
+  ] }) }) }),
+  /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e(c, { title: "Large & Extra Large", className: "mt-2 mb-2", children: /* @__PURE__ */ t("div", { className: "flex flex-wrap gap-5 items-end", children: [
+    /* @__PURE__ */ t(a, { size: "lg", children: [
+      /* @__PURE__ */ e(
+        i,
+        {
+          title: "Activity",
+          icon: /* @__PURE__ */ e(u, { className: "h-4 w-4" })
+        }
+      ),
+      /* @__PURE__ */ e("div", { className: "flex flex-1 items-center justify-center p-3", children: /* @__PURE__ */ t("div", { className: "text-center text-[var(--macos-tahoe-text)]", children: [
+        /* @__PURE__ */ e("p", { className: "text-[36px] font-light", children: "520" }),
+        /* @__PURE__ */ e("p", { className: "text-[11px] uppercase tracking-wider text-[var(--macos-tahoe-text-muted)]", children: "calories" })
+      ] }) })
+    ] }),
+    /* @__PURE__ */ t(a, { size: "xl", children: [
+      /* @__PURE__ */ e(
+        i,
+        {
+          title: "Notes",
+          subtitle: "3 notes",
+          icon: /* @__PURE__ */ e(g, { className: "h-4 w-4" }),
+          actions: /* @__PURE__ */ e("button", { className: "text-[12px] text-[var(--macos-tahoe-accent)]", children: "View All" })
+        }
+      ),
+      /* @__PURE__ */ e("div", { className: "flex-1 space-y-2 overflow-auto p-3.5 pt-2", children: ["Meeting notes", "Shopping list", "Ideas for project"].map(
+        (s) => /* @__PURE__ */ e(
+          "div",
+          {
+            className: "rounded-lg bg-[var(--macos-glass-clear-bg)] p-2.5 text-[13px] text-[var(--macos-tahoe-text)] backdrop-blur-sm border border-[var(--macos-glass-border-subtle)]",
+            children: s
+          },
+          s
+        )
+      ) })
+    ] })
+  ] }) }) }),
+  /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e(c, { title: "Code Example", className: "mt-2 mb-2", children: /* @__PURE__ */ e(
+    n,
+    {
+      code: `import { MacOSTahoeWidget, MacOSTahoeWidgetHeader } from '@e-burgos/tucu-ui';
+
+<MacOSTahoeWidget size="md">
+  <MacOSTahoeWidgetHeader
+    title="Calendar"
+    subtitle="Today"
+    icon={<CalendarIcon />}
+    actions={<button>View All</button>}
+  />
+  <div className="p-4">Widget content</div>
+</MacOSTahoeWidget>
+
+// Sizes: 'sm' (170×170), 'md' (364×170), 'lg' (170×364), 'xl' (364×364)`,
+      language: "tsx"
+    }
+  ) }) }),
+  /* @__PURE__ */ e(
+    m,
+    {
+      componentName: "MacOSTahoeWidget",
+      defaultValues: { size: "md" },
+      includeProps: ["size"],
+      excludeProps: ["className"],
+      children: (s) => /* @__PURE__ */ e("div", { className: "flex justify-center p-4", children: /* @__PURE__ */ t(a, { ...s, children: [
+        /* @__PURE__ */ e(
+          i,
+          {
+            title: "Preview",
+            icon: /* @__PURE__ */ e(r, { className: "h-4 w-4" })
+          }
+        ),
+        /* @__PURE__ */ e("div", { className: "flex flex-1 items-center justify-center", children: /* @__PURE__ */ e("span", { className: "text-2xl font-light text-[var(--macos-tahoe-text)]", children: "Content" }) })
+      ] }) })
+    }
+  ),
+  /* @__PURE__ */ e(h, { componentName: "MacOSTahoeWidget" })
+] });
+export {
+  T as TahoeWidgetSection,
+  T as default
+};