ui-lab-registry 0.3.44 → 0.3.45

package/dist/components/Menu/examples/06-view-options.d.ts

@@ -0,0 +1,6 @@
+export declare const metadata: {
+    title: string;
+    description: string;
+};
+export default function Example(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=06-view-options.d.ts.map

package/dist/components/Menu/examples/06-view-options.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"06-view-options.d.ts","sourceRoot":"","sources":["../../../../src/components/Menu/examples/06-view-options.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,QAAQ;;;CAGpB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,OAAO,4CA4B9B"}

package/dist/components/Menu/examples/06-view-options.js

@@ -0,0 +1,15 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { Menu, Button } from "ui-lab-components";
+export const metadata = {
+    title: "View Options",
+    description: "Mixed checkbox and radio items for toggling display state and selecting a single density.",
+};
+export default function Example() {
+    const [showGrid, setShowGrid] = useState(true);
+    const [showRulers, setShowRulers] = useState(false);
+    const [density, setDensity] = useState("comfortable");
+    return (_jsxs(Menu, { type: "pop-over", children: [_jsx(Menu.Trigger, { children: _jsx(Button, { children: "View" }) }), _jsxs(Menu.Content, { align: "start", children: [_jsx(Menu.Label, { children: "Display" }), _jsx(Menu.CheckboxItem, { checked: showGrid, onCheckedChange: setShowGrid, children: "Show grid" }), _jsx(Menu.CheckboxItem, { checked: showRulers, onCheckedChange: setShowRulers, children: "Show rulers" }), _jsx(Menu.Separator, {}), _jsx(Menu.Label, { children: "Density" }), _jsxs(Menu.RadioGroup, { value: density, onValueChange: setDensity, children: [_jsx(Menu.RadioItem, { value: "compact", children: "Compact" }), _jsx(Menu.RadioItem, { value: "comfortable", children: "Comfortable" }), _jsx(Menu.RadioItem, { value: "spacious", children: "Spacious" })] })] })] }));
+}
+//# sourceMappingURL=06-view-options.js.map

package/dist/components/Menu/examples/06-view-options.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"06-view-options.js","sourceRoot":"","sources":["../../../../src/components/Menu/examples/06-view-options.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAEjD,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,KAAK,EAAE,cAAc;IACrB,WAAW,EAAE,2FAA2F;CACzG,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,OAAO;IAC7B,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAC/C,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACpD,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAC;IAEtD,OAAO,CACL,MAAC,IAAI,IAAC,IAAI,EAAC,UAAU,aACnB,KAAC,IAAI,CAAC,OAAO,cACX,KAAC,MAAM,uBAAc,GACR,EACf,MAAC,IAAI,CAAC,OAAO,IAAC,KAAK,EAAC,OAAO,aACzB,KAAC,IAAI,CAAC,KAAK,0BAAqB,EAChC,KAAC,IAAI,CAAC,YAAY,IAAC,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAE,WAAW,0BAE9C,EACpB,KAAC,IAAI,CAAC,YAAY,IAAC,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,aAAa,4BAElD,EACpB,KAAC,IAAI,CAAC,SAAS,KAAG,EAClB,KAAC,IAAI,CAAC,KAAK,0BAAqB,EAChC,MAAC,IAAI,CAAC,UAAU,IAAC,KAAK,EAAE,OAAO,EAAE,aAAa,EAAE,UAAU,aACxD,KAAC,IAAI,CAAC,SAAS,IAAC,KAAK,EAAC,SAAS,wBAAyB,EACxD,KAAC,IAAI,CAAC,SAAS,IAAC,KAAK,EAAC,aAAa,4BAA6B,EAChE,KAAC,IAAI,CAAC,SAAS,IAAC,KAAK,EAAC,UAAU,yBAA0B,IAC1C,IACL,IACV,CACR,CAAC;AACJ,CAAC"}

package/dist/components/Menu/examples/index.d.ts

@@ -2,4 +2,12 @@ export { default as Example1 } from './01-basic-menu.js';
 export { metadata as metadata1 } from './01-basic-menu.js';
 export { default as Example2 } from './02-nested-menu.js';
 export { metadata as metadata2 } from './02-nested-menu.js';
+export { default as Example3 } from './03-toolbar-dropdown.js';
+export { metadata as metadata3 } from './03-toolbar-dropdown.js';
+export { default as Example4 } from './04-table-row-actions.js';
+export { metadata as metadata4 } from './04-table-row-actions.js';
+export { default as Example5 } from './05-context-menu.js';
+export { metadata as metadata5 } from './05-context-menu.js';
+export { default as Example6 } from './06-view-options.js';
+export { metadata as metadata6 } from './06-view-options.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Menu/examples/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Menu/examples/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Menu/examples/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,0BAA0B,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAChE,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/components/Menu/examples/index.js

@@ -2,4 +2,12 @@ export { default as Example1 } from './01-basic-menu.js';
 export { metadata as metadata1 } from './01-basic-menu.js';
 export { default as Example2 } from './02-nested-menu.js';
 export { metadata as metadata2 } from './02-nested-menu.js';
+export { default as Example3 } from './03-toolbar-dropdown.js';
+export { metadata as metadata3 } from './03-toolbar-dropdown.js';
+export { default as Example4 } from './04-table-row-actions.js';
+export { metadata as metadata4 } from './04-table-row-actions.js';
+export { default as Example5 } from './05-context-menu.js';
+export { metadata as metadata5 } from './05-context-menu.js';
+export { default as Example6 } from './06-view-options.js';
+export { metadata as metadata6 } from './06-view-options.js';
 //# sourceMappingURL=index.js.map

package/dist/components/Menu/examples/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Menu/examples/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,qBAAqB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Menu/examples/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,0BAA0B,CAAC;AACjE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAChE,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,sBAAsB,CAAC;AAC3D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/components/Menu/examples.json

@@ -8,5 +8,25 @@
         "title": "Nested Menu",
         "description": "Context menu with submenus for organizing related actions. Hover over items with arrows to reveal nested options.",
         "code": "import { Menu } from 'ui-lab-components';\n\nexport default function Example() {\n  return (\n    <Menu>\n      <Menu.Trigger className=\"flex items-center justify-center rounded-md border-2 border-dashed border-background-600 p-12 w-full cursor-context-menu select-none text-foreground-300 hover:border-background-500 transition-colors\">\n        Right click here\n      </Menu.Trigger>\n      <Menu.Content>\n        <Menu.Item>New File</Menu.Item>\n        <Menu.Item>New Folder</Menu.Item>\n        <Menu.Separator />\n        <Menu.Sub>\n          <Menu.SubTrigger>Open with...</Menu.SubTrigger>\n          <Menu.SubContent>\n            <Menu.Item>VS Code</Menu.Item>\n            <Menu.Item>Sublime Text</Menu.Item>\n            <Menu.Item>Vim</Menu.Item>\n            <Menu.Separator />\n            <Menu.Item>Other Application...</Menu.Item>\n          </Menu.SubContent>\n        </Menu.Sub>\n        <Menu.Sub>\n          <Menu.SubTrigger>Share</Menu.SubTrigger>\n          <Menu.SubContent>\n            <Menu.Item>Copy Link</Menu.Item>\n            <Menu.Item>Email</Menu.Item>\n            <Menu.Sub>\n              <Menu.SubTrigger>Social Media</Menu.SubTrigger>\n              <Menu.SubContent>\n                <Menu.Item>Twitter</Menu.Item>\n                <Menu.Item>LinkedIn</Menu.Item>\n                <Menu.Item>Facebook</Menu.Item>\n              </Menu.SubContent>\n            </Menu.Sub>\n          </Menu.SubContent>\n        </Menu.Sub>\n        <Menu.Separator />\n        <Menu.Item>Rename</Menu.Item>\n        <Menu.Item disabled>Delete</Menu.Item>\n      </Menu.Content>\n    </Menu>\n  );\n}"
+    },
+    "03-toolbar-dropdown": {
+        "title": "Toolbar Dropdown",
+        "description": "Dropdown menu of actions with keyboard shortcuts and a disabled item.",
+        "code": "import { Menu, Button } from \"ui-lab-components\";\nimport { FaChevronDown } from \"react-icons/fa6\";\n\nexport default function Example() {\n  return (\n    <Menu type=\"pop-over\">\n      <Menu.Trigger>\n        <Button variant=\"ghost\">\n          File <FaChevronDown className=\"w-3 h-3 ml-1\" />\n        </Button>\n      </Menu.Trigger>\n      <Menu.Content align=\"start\">\n        <Menu.Item onSelect={() => {}}>\n          New file\n          <Menu.Shortcut>⌘N</Menu.Shortcut>\n        </Menu.Item>\n        <Menu.Item onSelect={() => {}}>\n          Open…\n          <Menu.Shortcut>⌘O</Menu.Shortcut>\n        </Menu.Item>\n        <Menu.Item onSelect={() => {}}>\n          Save\n          <Menu.Shortcut>⌘S</Menu.Shortcut>\n        </Menu.Item>\n        <Menu.Separator />\n        <Menu.Item disabled>Recent files</Menu.Item>\n      </Menu.Content>\n    </Menu>\n  );\n}"
+    },
+    "04-table-row-actions": {
+        "title": "Table Row Actions",
+        "description": "Per-row overflow menu in a table, with a destructive action separated from neutral ones.",
+        "code": "import { Menu, Button } from \"ui-lab-components\";\nimport { FaEllipsis } from \"react-icons/fa6\";\n\nconst rows = [\n  { id: \"doc_1\", name: \"Q3 roadmap\", updated: \"2h ago\" },\n  { id: \"doc_2\", name: \"Pricing review\", updated: \"yesterday\" },\n  { id: \"doc_3\", name: \"Hiring plan\", updated: \"3 days ago\" },\n];\n\nexport default function Example() {\n  return (\n    <table className=\"w-full text-sm border-collapse\">\n      <thead>\n        <tr className=\"border-b border-background-700\">\n          <th className=\"text-left py-2 px-3 font-medium text-foreground-200\">Document</th>\n          <th className=\"text-left py-2 px-3 font-medium text-foreground-200\">Updated</th>\n          <th className=\"py-2 px-3\" />\n        </tr>\n      </thead>\n      <tbody>\n        {rows.map((row) => (\n          <tr key={row.id} className=\"border-b border-background-700 last:border-0\">\n            <td className=\"py-2 px-3\">{row.name}</td>\n            <td className=\"py-2 px-3 text-foreground-400\">{row.updated}</td>\n            <td className=\"py-2 px-3 text-right\">\n              <Menu type=\"pop-over\">\n                <Menu.Trigger>\n                  <Button\n                    icon={<FaEllipsis />}\n                    size=\"icon\"\n                    variant=\"ghost\"\n                    styles=\"p-2\"\n                    aria-label={`Actions for ${row.name}`}\n                  />\n                </Menu.Trigger>\n                <Menu.Content align=\"end\">\n                  <Menu.Item onSelect={() => {}}>Open</Menu.Item>\n                  <Menu.Item onSelect={() => {}}>Rename</Menu.Item>\n                  <Menu.Item onSelect={() => {}}>Duplicate</Menu.Item>\n                  <Menu.Separator />\n                  <Menu.Item\n                    onSelect={() => {}}\n                    styles={{ root: \"text-destructive\" }}\n                  >\n                    Delete\n                  </Menu.Item>\n                </Menu.Content>\n              </Menu>\n            </td>\n          </tr>\n        ))}\n      </tbody>\n    </table>\n  );\n}"
+    },
+    "05-context-menu": {
+        "title": "Context Menu",
+        "description": "Right-click anywhere in the surface to open the menu at the cursor position.",
+        "code": "import { Menu } from \"ui-lab-components\";\n\nexport default function Example() {\n  return (\n    <Menu type=\"context-menu\">\n      <Menu.Trigger>\n        <div className=\"flex items-center justify-center w-80 h-32 border border-dashed border-background-700 rounded-sm text-sm text-foreground-400 select-none\">\n          Right-click anywhere in this area\n        </div>\n      </Menu.Trigger>\n      <Menu.Content>\n        <Menu.Item onSelect={() => {}}>\n          Cut\n          <Menu.Shortcut>⌘X</Menu.Shortcut>\n        </Menu.Item>\n        <Menu.Item onSelect={() => {}}>\n          Copy\n          <Menu.Shortcut>⌘C</Menu.Shortcut>\n        </Menu.Item>\n        <Menu.Item onSelect={() => {}}>\n          Paste\n          <Menu.Shortcut>⌘V</Menu.Shortcut>\n        </Menu.Item>\n        <Menu.Separator />\n        <Menu.Item onSelect={() => {}} styles={{ root: \"text-destructive\" }}>\n          Delete\n        </Menu.Item>\n      </Menu.Content>\n    </Menu>\n  );\n}"
+    },
+    "06-view-options": {
+        "title": "View Options",
+        "description": "Mixed checkbox and radio items for toggling display state and selecting a single density.",
+        "code": "\"use client\";\n\nimport { useState } from \"react\";\nimport { Menu, Button } from \"ui-lab-components\";\n\nexport default function Example() {\n  const [showGrid, setShowGrid] = useState(true);\n  const [showRulers, setShowRulers] = useState(false);\n  const [density, setDensity] = useState(\"comfortable\");\n\n  return (\n    <Menu type=\"pop-over\">\n      <Menu.Trigger>\n        <Button>View</Button>\n      </Menu.Trigger>\n      <Menu.Content align=\"start\">\n        <Menu.Label>Display</Menu.Label>\n        <Menu.CheckboxItem checked={showGrid} onCheckedChange={setShowGrid}>\n          Show grid\n        </Menu.CheckboxItem>\n        <Menu.CheckboxItem checked={showRulers} onCheckedChange={setShowRulers}>\n          Show rulers\n        </Menu.CheckboxItem>\n        <Menu.Separator />\n        <Menu.Label>Density</Menu.Label>\n        <Menu.RadioGroup value={density} onValueChange={setDensity}>\n          <Menu.RadioItem value=\"compact\">Compact</Menu.RadioItem>\n          <Menu.RadioItem value=\"comfortable\">Comfortable</Menu.RadioItem>\n          <Menu.RadioItem value=\"spacious\">Spacious</Menu.RadioItem>\n        </Menu.RadioGroup>\n      </Menu.Content>\n    </Menu>\n  );\n}"
     }
 }

package/dist/components/Menu/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAYtD,QAAA,MAAM,YAAY,EAAE,UAAU,EAAO,CAAC;AAiBtC,eAAO,MAAM,UAAU,EAAE,eA0DxB,CAAC;AAEF,OAAO,EAAE,YAAY,EAAE,CAAC;AACxB,cAAc,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Menu/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAoBtD,QAAA,MAAM,YAAY,EAAE,UAAU,EAAO,CAAC;AAiBtC,eAAO,MAAM,UAAU,EAAE,eA0DxB,CAAC;AAEF,OAAO,EAAE,YAAY,EAAE,CAAC;AACxB,cAAc,qBAAqB,CAAC"}

package/dist/components/Menu/index.js

@@ -2,11 +2,19 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Menu } from 'ui-lab-components';
 import Example1, { metadata as metadata1 } from './examples/01-basic-menu.js';
 import Example2, { metadata as metadata2 } from './examples/02-nested-menu.js';
+import Example3, { metadata as metadata3 } from './examples/03-toolbar-dropdown.js';
+import Example4, { metadata as metadata4 } from './examples/04-table-row-actions.js';
+import Example5, { metadata as metadata5 } from './examples/05-context-menu.js';
+import Example6, { metadata as metadata6 } from './examples/06-view-options.js';
 import examplesJson from './examples.json' with { type: 'json' };
 import { loadComponentExamples } from '../../utils/load-component-examples.js';
 const examplesData = [
     { id: '01-basic-menu', Component: Example1, metadata: metadata1 },
     { id: '02-nested-menu', Component: Example2, metadata: metadata2 },
+    { id: '03-toolbar-dropdown', Component: Example3, metadata: metadata3 },
+    { id: '04-table-row-actions', Component: Example4, metadata: metadata4 },
+    { id: '05-context-menu', Component: Example5, metadata: metadata5 },
+    { id: '06-view-options', Component: Example6, metadata: metadata6 },
 ];
 const menuControls = [];
 const menuBasicCode = `import { Menu } from "ui-lab-components";

package/dist/components/Menu/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Menu/index.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAEzC,OAAO,QAAQ,EAAE,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,6BAA6B,CAAC;AAC9E,OAAO,QAAQ,EAAE,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAC/E,OAAO,YAAY,MAAM,iBAAiB,CAAC,OAAO,IAAI,EAAE,MAAM,EAAE,CAAC;AACjE,OAAO,EAAE,qBAAqB,EAAE,MAAM,wCAAwC,CAAC;AAG/E,MAAM,YAAY,GAAG;IACnB,EAAE,EAAE,EAAE,eAAe,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE;IACjE,EAAE,EAAE,EAAE,gBAAgB,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE;CACnE,CAAC;AAEF,MAAM,YAAY,GAAiB,EAAE,CAAC;AAEtC,MAAM,aAAa,GAAG;;;;;;;;;;;;;EAapB,CAAC;AAEH,MAAM,CAAC,MAAM,UAAU,GAAoB;IACzC,EAAE,EAAE,MAAM;IACV,IAAI,EAAE,MAAM;IACZ,WAAW,EAAE,uEAAuE;IAEpF,QAAQ,EAAE,CACR,eAAK,SAAS,EAAC,+BAA+B,aAC5C,qSAEI,EACJ,sIAEI,IACA,CACP;IAED,QAAQ,EAAE;QACR;YACE,EAAE,EAAE,SAAS;YACb,KAAK,EAAE,SAAS;YAChB,WAAW,EAAE,yCAAyC;YACtD,IAAI,EAAE,aAAa;YACnB,OAAO,EAAE,CACP,MAAC,IAAI,eACH,KAAC,IAAI,CAAC,OAAO,IAAC,SAAS,EAAC,wMAAwM,iCAEjN,EACf,MAAC,IAAI,CAAC,OAAO,eACX,KAAC,IAAI,CAAC,IAAI,uBAAiB,EAC3B,KAAC,IAAI,CAAC,IAAI,wBAAkB,EAC5B,KAAC,IAAI,CAAC,IAAI,IAAC,QAAQ,0BAAgB,IACtB,IACV,CACR;SACF;QACD,GAAG,qBAAqB,CAAC,YAAY,EAAE,YAAY,CAAC;KACrD;IAED,QAAQ,EAAE;QACR;YACE,EAAE,EAAE,SAAS;YACb,IAAI,EAAE,SAAS;YACf,WAAW,EAAE,8CAA8C;YAC3D,IAAI,EAAE,aAAa;YACnB,OAAO,EAAE,CACP,MAAC,IAAI,eACH,KAAC,IAAI,CAAC,OAAO,IAAC,SAAS,EAAC,kJAAkJ,4BAE3J,EACf,MAAC,IAAI,CAAC,OAAO,eACX,KAAC,IAAI,CAAC,IAAI,uBAAiB,EAC3B,KAAC,IAAI,CAAC,IAAI,wBAAkB,EAC5B,KAAC,IAAI,CAAC,IAAI,IAAC,QAAQ,0BAAgB,IACtB,IACV,CACR;SACF;KACF;CACF,CAAC;AAEF,OAAO,EAAE,YAAY,EAAE,CAAC;AACxB,cAAc,qBAAqB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Menu/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/Modal/examples/02-form-modal.js

@@ -18,6 +18,6 @@ export default function Example() {
         // Handle form submission
         setIsOpen(false);
     };
-    return (_jsxs(_Fragment, { children: [_jsx(Button, { onClick: () => setIsOpen(true), children: "Edit Profile" }), _jsxs(Modal, { isOpen: isOpen, onOpenChange: setIsOpen, size: "auto", children: [_jsx(Modal.Header, { children: "Edit Profile" }), _jsx(Modal.Body, { children: _jsx("form", { id: "profile-form", onSubmit: handleSubmit, children: _jsxs(Flex, { direction: "column", gap: "md", children: [_jsxs("div", { children: [_jsx(Label, { htmlFor: "name", required: true, children: "Full Name" }), _jsx(Input, { id: "name", value: formData.name, onChange: (e) => setFormData({ ...formData, name: e.target.value }), placeholder: "Enter your name" })] }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "email", required: true, children: "Email Address" }), _jsx(Input, { id: "email", type: "email", value: formData.email, onChange: (e) => setFormData({ ...formData, email: e.target.value }), placeholder: "Enter your email" })] }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "bio", children: "Bio" }), _jsx(TextArea, { id: "bio", value: formData.bio, onChange: (e) => setFormData({ ...formData, bio: e.target.value }), placeholder: "Tell us about yourself", rows: 3 })] })] }) }) }), _jsx(Modal.Footer, { children: _jsxs(Flex, { gap: "sm", justify: "flex-end", children: [_jsx(Button, { variant: "ghost", onClick: () => setIsOpen(false), children: "Cancel" }), _jsx(Button, { type: "submit", form: "profile-form", children: "Save Changes" })] }) })] })] }));
+    return (_jsxs(_Fragment, { children: [_jsx(Button, { onClick: () => setIsOpen(true), children: "Edit Profile" }), _jsxs(Modal, { isOpen: isOpen, onOpenChange: setIsOpen, size: "auto", children: [_jsx(Modal.Header, { children: "Edit Profile" }), _jsx(Modal.Body, { children: _jsx("form", { id: "profile-form", onSubmit: handleSubmit, children: _jsxs(Flex, { direction: "column", gap: "md", children: [_jsxs("div", { children: [_jsx(Label, { htmlFor: "name", required: true, children: "Full Name" }), _jsx(Input, { id: "name", value: formData.name, onChange: (e) => setFormData({ ...formData, name: e.target.value }), placeholder: "Enter your name" })] }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "email", required: true, children: "Email Address" }), _jsx(Input, { id: "email", type: "email", value: formData.email, onChange: (e) => setFormData({ ...formData, email: e.target.value }), placeholder: "Enter your email" })] }), _jsxs("div", { children: [_jsx(Label, { htmlFor: "bio", children: "Bio" }), _jsx(TextArea, { id: "bio", value: formData.bio, onChange: (e) => setFormData({ ...formData, bio: e.target.value }), placeholder: "Tell us about yourself", rows: 3 })] })] }) }) }), _jsx(Modal.Footer, { children: _jsxs(Flex, { gap: "sm", justify: "end", children: [_jsx(Button, { variant: "ghost", onClick: () => setIsOpen(false), children: "Cancel" }), _jsx(Button, { type: "submit", form: "profile-form", children: "Save Changes" })] }) })] })] }));
 }
 //# sourceMappingURL=02-form-modal.js.map

package/dist/components/Modal/examples/02-form-modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"02-form-modal.js","sourceRoot":"","sources":["../../../../src/components/Modal/examples/02-form-modal.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"02-form-modal.js","sourceRoot":"","sources":["../../../../src/components/Modal/examples/02-form-modal.tsx"],"names":[],"mappings":"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"}

package/dist/components/Modal/examples/03-delete-confirmation.d.ts

@@ -0,0 +1,6 @@
+export declare const metadata: {
+    title: string;
+    description: string;
+};
+export default function Example(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=03-delete-confirmation.d.ts.map

package/dist/components/Modal/examples/03-delete-confirmation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"03-delete-confirmation.d.ts","sourceRoot":"","sources":["../../../../src/components/Modal/examples/03-delete-confirmation.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,QAAQ;;;CAGpB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,OAAO,4CA+B9B"}

package/dist/components/Modal/examples/03-delete-confirmation.js

@@ -0,0 +1,13 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from "react";
+import { Modal, Button } from "ui-lab-components";
+export const metadata = {
+    title: "Delete Confirmation",
+    description: "Destructive action dialog that blocks the user until they explicitly confirm or cancel.",
+};
+export default function Example() {
+    const [isOpen, setIsOpen] = useState(false);
+    return (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "destructive", onClick: () => setIsOpen(true), children: "Delete workspace" }), _jsx(Modal, { isOpen: isOpen, onOpenChange: setIsOpen, title: "Delete workspace", footer: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "ghost", onClick: () => setIsOpen(false), children: "Cancel" }), _jsx(Button, { variant: "destructive", onClick: () => setIsOpen(false), children: "Delete" })] }), children: _jsxs("p", { className: "text-sm text-foreground-300", children: ["This will permanently delete ", _jsx("strong", { className: "text-foreground-100", children: "acme-corp" }), " and all its data. This action cannot be undone."] }) })] }));
+}
+//# sourceMappingURL=03-delete-confirmation.js.map

package/dist/components/Modal/examples/03-delete-confirmation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"03-delete-confirmation.js","sourceRoot":"","sources":["../../../../src/components/Modal/examples/03-delete-confirmation.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAElD,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,KAAK,EAAE,qBAAqB;IAC5B,WAAW,EAAE,yFAAyF;CACvG,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,OAAO;IAC7B,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE5C,OAAO,CACL,8BACE,KAAC,MAAM,IAAC,OAAO,EAAC,aAAa,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,iCAEnD,EAET,KAAC,KAAK,IACJ,MAAM,EAAE,MAAM,EACd,YAAY,EAAE,SAAS,EACvB,KAAK,EAAC,kBAAkB,EACxB,MAAM,EACJ,8BACE,KAAC,MAAM,IAAC,OAAO,EAAC,OAAO,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,uBAE9C,EACT,KAAC,MAAM,IAAC,OAAO,EAAC,aAAa,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,uBAEpD,IACR,YAGL,aAAG,SAAS,EAAC,6BAA6B,8CACX,iBAAQ,SAAS,EAAC,qBAAqB,0BAAmB,wDAErF,GACE,IACP,CACJ,CAAC;AACJ,CAAC"}

package/dist/components/Modal/examples/04-create-api-key.d.ts

@@ -0,0 +1,6 @@
+export declare const metadata: {
+    title: string;
+    description: string;
+};
+export default function Example(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=04-create-api-key.d.ts.map

package/dist/components/Modal/examples/04-create-api-key.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"04-create-api-key.d.ts","sourceRoot":"","sources":["../../../../src/components/Modal/examples/04-create-api-key.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,QAAQ;;;CAGpB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,OAAO,4CA2C9B"}

package/dist/components/Modal/examples/04-create-api-key.js

@@ -0,0 +1,14 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from "react";
+import { Modal, Button, Input, Label } from "ui-lab-components";
+export const metadata = {
+    title: "Create API Key",
+    description: "Form modal with a single required input. The primary action stays disabled until the field has a value.",
+};
+export default function Example() {
+    const [isOpen, setIsOpen] = useState(false);
+    const [name, setName] = useState("");
+    return (_jsxs(_Fragment, { children: [_jsx(Button, { onClick: () => setIsOpen(true), children: "New API key" }), _jsx(Modal, { isOpen: isOpen, onOpenChange: setIsOpen, title: "New API key", footer: _jsxs(_Fragment, { children: [_jsx(Button, { variant: "ghost", onClick: () => setIsOpen(false), children: "Cancel" }), _jsx(Button, { onClick: () => setIsOpen(false), isDisabled: !name.trim(), children: "Create" })] }), children: _jsxs("div", { className: "flex flex-col gap-4 px-6 py-4", children: [_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: "key-name", children: "Name" }), _jsx(Input, { id: "key-name", placeholder: "e.g. CI deploy key", value: name, onChange: (e) => setName(e.target.value) })] }), _jsx("p", { className: "text-xs text-foreground-400", children: "The key will only be shown once after creation." })] }) })] }));
+}
+//# sourceMappingURL=04-create-api-key.js.map

package/dist/components/Modal/examples/04-create-api-key.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"04-create-api-key.js","sourceRoot":"","sources":["../../../../src/components/Modal/examples/04-create-api-key.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAEhE,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,KAAK,EAAE,gBAAgB;IACvB,WAAW,EAAE,yGAAyG;CACvH,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,OAAO;IAC7B,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAErC,OAAO,CACL,8BACE,KAAC,MAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,4BAAsB,EAE5D,KAAC,KAAK,IACJ,MAAM,EAAE,MAAM,EACd,YAAY,EAAE,SAAS,EACvB,KAAK,EAAC,aAAa,EACnB,MAAM,EACJ,8BACE,KAAC,MAAM,IAAC,OAAO,EAAC,OAAO,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,uBAE9C,EACT,KAAC,MAAM,IACL,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,EAC/B,UAAU,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,uBAGjB,IACR,YAGL,eAAK,SAAS,EAAC,+BAA+B,aAC5C,eAAK,SAAS,EAAC,uBAAuB,aACpC,KAAC,KAAK,IAAC,OAAO,EAAC,UAAU,qBAAa,EACtC,KAAC,KAAK,IACJ,EAAE,EAAC,UAAU,EACb,WAAW,EAAC,oBAAoB,EAChC,KAAK,EAAE,IAAI,EACX,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,GACxC,IACE,EACN,YAAG,SAAS,EAAC,6BAA6B,gEAEtC,IACA,GACA,IACP,CACJ,CAAC;AACJ,CAAC"}

package/dist/components/Modal/examples/05-notification-settings.d.ts

@@ -0,0 +1,6 @@
+export declare const metadata: {
+    title: string;
+    description: string;
+};
+export default function Example(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=05-notification-settings.d.ts.map

package/dist/components/Modal/examples/05-notification-settings.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"05-notification-settings.d.ts","sourceRoot":"","sources":["../../../../src/components/Modal/examples/05-notification-settings.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,QAAQ;;;CAGpB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,OAAO,4CA+C9B"}

package/dist/components/Modal/examples/05-notification-settings.js

@@ -0,0 +1,19 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState } from "react";
+import { Modal, Button, Switch } from "ui-lab-components";
+export const metadata = {
+    title: "Notification Settings",
+    description: "Settings panel using the compound Modal.Header / Modal.Body / Modal.Footer API with toggle rows.",
+};
+export default function Example() {
+    const [isOpen, setIsOpen] = useState(false);
+    const [prefs, setPrefs] = useState({ email: true, push: false, marketing: false });
+    const toggle = (key) => setPrefs((p) => ({ ...p, [key]: !p[key] }));
+    return (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "ghost", onClick: () => setIsOpen(true), children: "Notification settings" }), _jsxs(Modal, { isOpen: isOpen, onOpenChange: setIsOpen, children: [_jsx(Modal.Header, { children: _jsx("span", { className: "text-sm font-semibold text-foreground-100", children: "Notification preferences" }) }), _jsx(Modal.Body, { children: _jsx("div", { className: "flex flex-col divide-y divide-border px-6", children: [
+                                { key: "email", label: "Email notifications", description: "Receive updates and alerts by email" },
+                                { key: "push", label: "Push notifications", description: "Browser and mobile push alerts" },
+                                { key: "marketing", label: "Product updates", description: "New features and announcements" },
+                            ].map(({ key, label, description }) => (_jsxs("div", { className: "flex items-center justify-between py-4", children: [_jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsx("span", { className: "text-sm text-foreground-100", children: label }), _jsx("span", { className: "text-xs text-foreground-400", children: description })] }), _jsx(Switch, { isSelected: prefs[key], onChange: () => toggle(key) })] }, key))) }) }), _jsxs(Modal.Footer, { children: [_jsx(Button, { variant: "ghost", onClick: () => setIsOpen(false), children: "Cancel" }), _jsx(Button, { onClick: () => setIsOpen(false), children: "Save" })] })] })] }));
+}
+//# sourceMappingURL=05-notification-settings.js.map

package/dist/components/Modal/examples/05-notification-settings.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"05-notification-settings.js","sourceRoot":"","sources":["../../../../src/components/Modal/examples/05-notification-settings.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAE1D,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,KAAK,EAAE,uBAAuB;IAC9B,WAAW,EAAE,kGAAkG;CAChH,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,OAAO;IAC7B,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC,CAAC;IAEnF,MAAM,MAAM,GAAG,CAAC,GAAuB,EAAE,EAAE,CACzC,QAAQ,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC;IAE9C,OAAO,CACL,8BACE,KAAC,MAAM,IAAC,OAAO,EAAC,OAAO,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,sCAE7C,EAET,MAAC,KAAK,IAAC,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,SAAS,aAC5C,KAAC,KAAK,CAAC,MAAM,cACX,eAAM,SAAS,EAAC,2CAA2C,yCAAgC,GAC9E,EAEf,KAAC,KAAK,CAAC,IAAI,cACT,cAAK,SAAS,EAAC,2CAA2C,YAEtD;gCACE,EAAE,GAAG,EAAE,OAAO,EAAE,KAAK,EAAE,qBAAqB,EAAE,WAAW,EAAE,qCAAqC,EAAE;gCAClG,EAAE,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,oBAAoB,EAAE,WAAW,EAAE,gCAAgC,EAAE;gCAC3F,EAAE,GAAG,EAAE,WAAW,EAAE,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,gCAAgC,EAAE;6BAEhG,CAAC,GAAG,CAAC,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,CACrC,eAAe,SAAS,EAAC,wCAAwC,aAC/D,eAAK,SAAS,EAAC,uBAAuB,aACpC,eAAM,SAAS,EAAC,6BAA6B,YAAE,KAAK,GAAQ,EAC5D,eAAM,SAAS,EAAC,6BAA6B,YAAE,WAAW,GAAQ,IAC9D,EACN,KAAC,MAAM,IAAC,UAAU,EAAE,KAAK,CAAC,GAAG,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,GAAG,CAAC,GAAI,KALvD,GAAG,CAMP,CACP,CAAC,GACE,GACK,EAEb,MAAC,KAAK,CAAC,MAAM,eACX,KAAC,MAAM,IAAC,OAAO,EAAC,OAAO,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,uBAE9C,EACT,KAAC,MAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,qBAAe,IACzC,IACT,IACP,CACJ,CAAC;AACJ,CAAC"}

package/dist/components/Modal/examples/index.d.ts

@@ -2,4 +2,10 @@ export { default as Example1 } from './01-basic-modal.js';
 export { metadata as metadata1 } from './01-basic-modal.js';
 export { default as Example2 } from './02-form-modal.js';
 export { metadata as metadata2 } from './02-form-modal.js';
+export { default as Example3 } from './03-delete-confirmation.js';
+export { metadata as metadata3 } from './03-delete-confirmation.js';
+export { default as Example4 } from './04-create-api-key.js';
+export { metadata as metadata4 } from './04-create-api-key.js';
+export { default as Example5 } from './05-notification-settings.js';
+export { metadata as metadata5 } from './05-notification-settings.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Modal/examples/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Modal/examples/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Modal/examples/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,6BAA6B,CAAC;AACpE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACpE,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,+BAA+B,CAAC"}

package/dist/components/Modal/examples/index.js

@@ -2,4 +2,10 @@ export { default as Example1 } from './01-basic-modal.js';
 export { metadata as metadata1 } from './01-basic-modal.js';
 export { default as Example2 } from './02-form-modal.js';
 export { metadata as metadata2 } from './02-form-modal.js';
+export { default as Example3 } from './03-delete-confirmation.js';
+export { metadata as metadata3 } from './03-delete-confirmation.js';
+export { default as Example4 } from './04-create-api-key.js';
+export { metadata as metadata4 } from './04-create-api-key.js';
+export { default as Example5 } from './05-notification-settings.js';
+export { metadata as metadata5 } from './05-notification-settings.js';
 //# sourceMappingURL=index.js.map

package/dist/components/Modal/examples/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Modal/examples/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Modal/examples/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAC5D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAClE,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,6BAA6B,CAAC;AACpE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACpE,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,+BAA+B,CAAC"}

package/dist/components/Modal/examples.json

@@ -7,6 +7,21 @@
     "02-form-modal": {
         "title": "Form Modal",
         "description": "A modal dialog containing a form for editing user profile settings. Demonstrates using form inputs, labels, and action buttons within a modal.",
-        "code": "'use client';\n\nimport React from 'react';\nimport { Modal, Button, Input, Label, TextArea, Flex } from 'ui-lab-components';\n\nexport default function Example() {\n  const [isOpen, setIsOpen] = React.useState(false);\n  const [formData, setFormData] = React.useState({\n    name: 'John Doe',\n    email: 'john.doe@example.com',\n    bio: 'Software developer passionate about building great user experiences.',\n  });\n\n  const handleSubmit = (e: React.FormEvent) => {\n    e.preventDefault();\n    // Handle form submission\n    setIsOpen(false);\n  };\n\n  return (\n    <>\n      <Button onClick={() => setIsOpen(true)}>Edit Profile</Button>\n      <Modal isOpen={isOpen} onOpenChange={setIsOpen} size=\"auto\">\n        <Modal.Header>Edit Profile</Modal.Header>\n        <Modal.Body>\n          <form id=\"profile-form\" onSubmit={handleSubmit}>\n            <Flex direction=\"column\" gap=\"md\">\n              <div>\n                <Label htmlFor=\"name\" required>\n                  Full Name\n                </Label>\n                <Input\n                  id=\"name\"\n                  value={formData.name}\n                  onChange={(e) =>\n                    setFormData({ ...formData, name: e.target.value })\n                  }\n                  placeholder=\"Enter your name\"\n                />\n              </div>\n              <div>\n                <Label htmlFor=\"email\" required>\n                  Email Address\n                </Label>\n                <Input\n                  id=\"email\"\n                  type=\"email\"\n                  value={formData.email}\n                  onChange={(e) =>\n                    setFormData({ ...formData, email: e.target.value })\n                  }\n                  placeholder=\"Enter your email\"\n                />\n              </div>\n              <div>\n                <Label htmlFor=\"bio\">Bio</Label>\n                <TextArea\n                  id=\"bio\"\n                  value={formData.bio}\n                  onChange={(e) =>\n                    setFormData({ ...formData, bio: e.target.value })\n                  }\n                  placeholder=\"Tell us about yourself\"\n                  rows={3}\n                />\n              </div>\n            </Flex>\n          </form>\n        </Modal.Body>\n        <Modal.Footer>\n          <Flex gap=\"sm\" justify=\"flex-end\">\n            <Button variant=\"ghost\" onClick={() => setIsOpen(false)}>\n              Cancel\n            </Button>\n            <Button type=\"submit\" form=\"profile-form\">\n              Save Changes\n            </Button>\n          </Flex>\n        </Modal.Footer>\n      </Modal>\n    </>\n  );\n}"
+        "code": "'use client';\n\nimport React from 'react';\nimport { Modal, Button, Input, Label, TextArea, Flex } from 'ui-lab-components';\n\nexport default function Example() {\n  const [isOpen, setIsOpen] = React.useState(false);\n  const [formData, setFormData] = React.useState({\n    name: 'John Doe',\n    email: 'john.doe@example.com',\n    bio: 'Software developer passionate about building great user experiences.',\n  });\n\n  const handleSubmit = (e: React.FormEvent) => {\n    e.preventDefault();\n    // Handle form submission\n    setIsOpen(false);\n  };\n\n  return (\n    <>\n      <Button onClick={() => setIsOpen(true)}>Edit Profile</Button>\n      <Modal isOpen={isOpen} onOpenChange={setIsOpen} size=\"auto\">\n        <Modal.Header>Edit Profile</Modal.Header>\n        <Modal.Body>\n          <form id=\"profile-form\" onSubmit={handleSubmit}>\n            <Flex direction=\"column\" gap=\"md\">\n              <div>\n                <Label htmlFor=\"name\" required>\n                  Full Name\n                </Label>\n                <Input\n                  id=\"name\"\n                  value={formData.name}\n                  onChange={(e) =>\n                    setFormData({ ...formData, name: e.target.value })\n                  }\n                  placeholder=\"Enter your name\"\n                />\n              </div>\n              <div>\n                <Label htmlFor=\"email\" required>\n                  Email Address\n                </Label>\n                <Input\n                  id=\"email\"\n                  type=\"email\"\n                  value={formData.email}\n                  onChange={(e) =>\n                    setFormData({ ...formData, email: e.target.value })\n                  }\n                  placeholder=\"Enter your email\"\n                />\n              </div>\n              <div>\n                <Label htmlFor=\"bio\">Bio</Label>\n                <TextArea\n                  id=\"bio\"\n                  value={formData.bio}\n                  onChange={(e) =>\n                    setFormData({ ...formData, bio: e.target.value })\n                  }\n                  placeholder=\"Tell us about yourself\"\n                  rows={3}\n                />\n              </div>\n            </Flex>\n          </form>\n        </Modal.Body>\n        <Modal.Footer>\n          <Flex gap=\"sm\" justify=\"end\">\n            <Button variant=\"ghost\" onClick={() => setIsOpen(false)}>\n              Cancel\n            </Button>\n            <Button type=\"submit\" form=\"profile-form\">\n              Save Changes\n            </Button>\n          </Flex>\n        </Modal.Footer>\n      </Modal>\n    </>\n  );\n}"
+    },
+    "03-delete-confirmation": {
+        "title": "Delete Confirmation",
+        "description": "Destructive action dialog that blocks the user until they explicitly confirm or cancel.",
+        "code": "\"use client\";\n\nimport { useState } from \"react\";\nimport { Modal, Button } from \"ui-lab-components\";\n\nexport default function Example() {\n  const [isOpen, setIsOpen] = useState(false);\n\n  return (\n    <>\n      <Button variant=\"destructive\" onClick={() => setIsOpen(true)}>\n        Delete workspace\n      </Button>\n\n      <Modal\n        isOpen={isOpen}\n        onOpenChange={setIsOpen}\n        title=\"Delete workspace\"\n        footer={\n          <>\n            <Button variant=\"ghost\" onClick={() => setIsOpen(false)}>\n              Cancel\n            </Button>\n            <Button variant=\"destructive\" onClick={() => setIsOpen(false)}>\n              Delete\n            </Button>\n          </>\n        }\n      >\n        <p className=\"text-sm text-foreground-300\">\n          This will permanently delete <strong className=\"text-foreground-100\">acme-corp</strong> and all\n          its data. This action cannot be undone.\n        </p>\n      </Modal>\n    </>\n  );\n}"
+    },
+    "04-create-api-key": {
+        "title": "Create API Key",
+        "description": "Form modal with a single required input. The primary action stays disabled until the field has a value.",
+        "code": "\"use client\";\n\nimport { useState } from \"react\";\nimport { Modal, Button, Input, Label } from \"ui-lab-components\";\n\nexport default function Example() {\n  const [isOpen, setIsOpen] = useState(false);\n  const [name, setName] = useState(\"\");\n\n  return (\n    <>\n      <Button onClick={() => setIsOpen(true)}>New API key</Button>\n\n      <Modal\n        isOpen={isOpen}\n        onOpenChange={setIsOpen}\n        title=\"New API key\"\n        footer={\n          <>\n            <Button variant=\"ghost\" onClick={() => setIsOpen(false)}>\n              Cancel\n            </Button>\n            <Button\n              onClick={() => setIsOpen(false)}\n              isDisabled={!name.trim()}\n            >\n              Create\n            </Button>\n          </>\n        }\n      >\n        <div className=\"flex flex-col gap-4 px-6 py-4\">\n          <div className=\"flex flex-col gap-1.5\">\n            <Label htmlFor=\"key-name\">Name</Label>\n            <Input\n              id=\"key-name\"\n              placeholder=\"e.g. CI deploy key\"\n              value={name}\n              onChange={(e) => setName(e.target.value)}\n            />\n          </div>\n          <p className=\"text-xs text-foreground-400\">\n            The key will only be shown once after creation.\n          </p>\n        </div>\n      </Modal>\n    </>\n  );\n}"
+    },
+    "05-notification-settings": {
+        "title": "Notification Settings",
+        "description": "Settings panel using the compound Modal.Header / Modal.Body / Modal.Footer API with toggle rows.",
+        "code": "\"use client\";\n\nimport { useState } from \"react\";\nimport { Modal, Button, Switch } from \"ui-lab-components\";\n\nexport default function Example() {\n  const [isOpen, setIsOpen] = useState(false);\n  const [prefs, setPrefs] = useState({ email: true, push: false, marketing: false });\n\n  const toggle = (key: keyof typeof prefs) =>\n    setPrefs((p) => ({ ...p, [key]: !p[key] }));\n\n  return (\n    <>\n      <Button variant=\"ghost\" onClick={() => setIsOpen(true)}>\n        Notification settings\n      </Button>\n\n      <Modal isOpen={isOpen} onOpenChange={setIsOpen}>\n        <Modal.Header>\n          <span className=\"text-sm font-semibold text-foreground-100\">Notification preferences</span>\n        </Modal.Header>\n\n        <Modal.Body>\n          <div className=\"flex flex-col divide-y divide-border px-6\">\n            {(\n              [\n                { key: \"email\", label: \"Email notifications\", description: \"Receive updates and alerts by email\" },\n                { key: \"push\", label: \"Push notifications\", description: \"Browser and mobile push alerts\" },\n                { key: \"marketing\", label: \"Product updates\", description: \"New features and announcements\" },\n              ] as const\n            ).map(({ key, label, description }) => (\n              <div key={key} className=\"flex items-center justify-between py-4\">\n                <div className=\"flex flex-col gap-0.5\">\n                  <span className=\"text-sm text-foreground-100\">{label}</span>\n                  <span className=\"text-xs text-foreground-400\">{description}</span>\n                </div>\n                <Switch isSelected={prefs[key]} onChange={() => toggle(key)} />\n              </div>\n            ))}\n          </div>\n        </Modal.Body>\n\n        <Modal.Footer>\n          <Button variant=\"ghost\" onClick={() => setIsOpen(false)}>\n            Cancel\n          </Button>\n          <Button onClick={() => setIsOpen(false)}>Save</Button>\n        </Modal.Footer>\n      </Modal>\n    </>\n  );\n}"
     }
 }

package/dist/components/Modal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAUtD,QAAA,MAAM,aAAa,EAAE,UAAU,EAY9B,CAAC;AAqBF,eAAO,MAAM,WAAW,EAAE,eAyDzB,CAAC;AAEF,OAAO,EAAE,aAAa,EAAE,CAAC;AACzB,cAAc,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Modal/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAkBtD,QAAA,MAAM,aAAa,EAAE,UAAU,EAY9B,CAAC;AAqBF,eAAO,MAAM,WAAW,EAAE,eAyDzB,CAAC;AAEF,OAAO,EAAE,aAAa,EAAE,CAAC;AACzB,cAAc,qBAAqB,CAAC"}

package/dist/components/Modal/index.js

@@ -2,10 +2,18 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import React from 'react';
 import { Modal, Button } from 'ui-lab-components';
 import Example1, { metadata as metadata1 } from './examples/01-basic-modal.js';
+import Example2, { metadata as metadata2 } from './examples/02-form-modal.js';
+import Example3, { metadata as metadata3 } from './examples/03-delete-confirmation.js';
+import Example4, { metadata as metadata4 } from './examples/04-create-api-key.js';
+import Example5, { metadata as metadata5 } from './examples/05-notification-settings.js';
 import examplesJson from './examples.json' with { type: 'json' };
 import { loadComponentExamples } from '../../utils/load-component-examples.js';
 const examplesData = [
     { id: '01-basic-modal', Component: Example1, metadata: metadata1 },
+    { id: '02-form-modal', Component: Example2, metadata: metadata2 },
+    { id: '03-delete-confirmation', Component: Example3, metadata: metadata3 },
+    { id: '04-create-api-key', Component: Example4, metadata: metadata4 },
+    { id: '05-notification-settings', Component: Example5, metadata: metadata5 },
 ];
 const modalControls = [
     {

package/dist/components/Modal/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Modal/index.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAGlD,OAAO,QAAQ,EAAE,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAC/E,OAAO,YAAY,MAAM,iBAAiB,CAAC,OAAO,IAAI,EAAE,MAAM,EAAE,CAAC;AACjE,OAAO,EAAE,qBAAqB,EAAE,MAAM,wCAAwC,CAAC;AAE/E,MAAM,YAAY,GAAG;IACnB,EAAE,EAAE,EAAE,gBAAgB,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE;CACnE,CAAC;AAEF,MAAM,aAAa,GAAiB;IAClC;QACE,IAAI,EAAE,MAAM;QACZ,KAAK,EAAE,MAAM;QACb,IAAI,EAAE,QAAQ;QACd,OAAO,EAAE;YACP,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE;YAC/B,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,EAAE;YAChC,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE;SAChC;QACD,YAAY,EAAE,IAAI;KACnB;CACF,CAAC;AAEF,MAAM,cAAc,GAAG;;;;;;;;;;;;;;;;;EAiBrB,CAAC;AAEH,MAAM,CAAC,MAAM,WAAW,GAAoB;IAC1C,EAAE,EAAE,OAAO;IACX,IAAI,EAAE,OAAO;IACb,WAAW,EAAE,iHAAiH;IAE9H,QAAQ,EAAE,CACR,eAAK,SAAS,EAAC,+BAA+B,aAC5C,yPAEI,EACJ,oOAEI,IACA,CACP;IAED,QAAQ,EAAE;QACR;YACE,EAAE,EAAE,SAAS;YACb,KAAK,EAAE,SAAS;YAChB,WAAW,EAAE,yCAAyC;YACtD,IAAI,EAAE,cAAc;YACpB,OAAO,EAAE,CACP,cAAK,SAAS,EAAC,6BAA6B,2CAEtC,CACP;YACD,QAAQ,EAAE,aAAa;YACvB,aAAa,EAAE,CAAC,KAAU,EAAE,EAAE;gBAC5B,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;gBAClD,OAAO,CACL,8BACE,KAAC,MAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,2BAAqB,EAC3D,MAAC,KAAK,IAAC,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,aAC9D,KAAC,KAAK,CAAC,MAAM,8BAA2B,EACxC,KAAC,KAAK,CAAC,IAAI,4CAAuC,IAC5C,IACP,CACJ,CAAC;YACJ,CAAC;SACF;QACD,GAAG,qBAAqB,CAAC,YAAY,EAAE,YAAY,CAAC;KACrD;IAED,QAAQ,EAAE;QACR;YACE,EAAE,EAAE,SAAS;YACb,IAAI,EAAE,SAAS;YACf,WAAW,EAAE,wCAAwC;YACrD,IAAI,EAAE,cAAc;YACpB,OAAO,EAAE,CACP,cAAK,SAAS,EAAC,6BAA6B,kCAEtC,CACP;SACF;KACF;CACF,CAAC;AAEF,OAAO,EAAE,aAAa,EAAE,CAAC;AACzB,cAAc,qBAAqB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Modal/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/Panel/examples/01-sidebar-toggle.d.ts

@@ -0,0 +1,6 @@
+export declare const metadata: {
+    title: string;
+    description: string;
+};
+export default function Example(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=01-sidebar-toggle.d.ts.map

package/dist/components/Panel/examples/01-sidebar-toggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"01-sidebar-toggle.d.ts","sourceRoot":"","sources":["../../../../src/components/Panel/examples/01-sidebar-toggle.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,QAAQ;;;CAGpB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,OAAO,4CAY9B"}

package/dist/components/Panel/examples/01-sidebar-toggle.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Panel } from "ui-lab-components";
+export const metadata = {
+    title: "Sidebar with Toggle",
+    description: "Left sidebar that collapses and expands via a toggle button in the content area.",
+};
+export default function Example() {
+    return (_jsxs(Panel, { style: { height: "400px" }, className: "w-full border border-background-700 rounded-lg bg-background-900", children: [_jsx(Panel.Sidebar, { side: "left", defaultOpen: true, width: "200px", collapsedWidth: "0" }), _jsx(Panel.Content, { children: _jsx(Panel.Toggle, { children: _jsx("button", { children: "\u2630" }) }) })] }));
+}
+//# sourceMappingURL=01-sidebar-toggle.js.map

package/dist/components/Panel/examples/01-sidebar-toggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"01-sidebar-toggle.js","sourceRoot":"","sources":["../../../../src/components/Panel/examples/01-sidebar-toggle.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE1C,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,KAAK,EAAE,qBAAqB;IAC5B,WAAW,EAAE,kFAAkF;CAChG,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,OAAO;IAC7B,OAAO,CACL,MAAC,KAAK,IAAC,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,SAAS,EAAC,kEAAkE,aAC7G,KAAC,KAAK,CAAC,OAAO,IAAC,IAAI,EAAC,MAAM,EAAC,WAAW,QAAC,KAAK,EAAC,OAAO,EAAC,cAAc,EAAC,GAAG,GACvD,EAChB,KAAC,KAAK,CAAC,OAAO,cACZ,KAAC,KAAK,CAAC,MAAM,cACX,sCAAkB,GACL,GACD,IACV,CACT,CAAC;AACJ,CAAC"}

package/dist/components/Panel/examples/index.d.ts

@@ -0,0 +1,3 @@
+export { default as Example1 } from './01-sidebar-toggle.js';
+export { metadata as metadata1 } from './01-sidebar-toggle.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Panel/examples/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Panel/examples/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,wBAAwB,CAAC"}

package/dist/components/Panel/examples/index.js

@@ -0,0 +1,3 @@
+export { default as Example1 } from './01-sidebar-toggle.js';
+export { metadata as metadata1 } from './01-sidebar-toggle.js';
+//# sourceMappingURL=index.js.map

package/dist/components/Panel/examples/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Panel/examples/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,EAAE,QAAQ,IAAI,SAAS,EAAE,MAAM,wBAAwB,CAAC"}

package/dist/components/Panel/examples.json

@@ -0,0 +1,7 @@
+{
+    "01-sidebar-toggle": {
+        "title": "Sidebar with Toggle",
+        "description": "Left sidebar that collapses and expands via a toggle button in the content area.",
+        "code": "import { Panel } from \"ui-lab-components\";\n\nexport default function Example() {\n  return (\n    <Panel style={{ height: \"400px\" }} className=\"w-full border border-background-700 rounded-lg bg-background-900\">\n      <Panel.Sidebar side=\"left\" defaultOpen width=\"200px\" collapsedWidth=\"0\">\n      </Panel.Sidebar>\n      <Panel.Content>\n        <Panel.Toggle>\n          <button>☰</button>\n        </Panel.Toggle>\n      </Panel.Content>\n    </Panel>\n  );\n}"
+    }
+}

package/dist/components/Panel/index.d.ts

@@ -2,4 +2,5 @@ import { ControlDef, ComponentDetail } from '@/types';
 declare const panelControls: ControlDef[];
 export declare const panelDetail: ComponentDetail;
 export { panelControls };
+export * from './examples/index.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/Panel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Panel/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAErD,QAAA,MAAM,aAAa,EAAE,UAAU,EA6B9B,CAAA;AAoBD,eAAO,MAAM,WAAW,EAAE,eA0FzB,CAAA;AAED,OAAO,EAAE,aAAa,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Panel/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AASrD,QAAA,MAAM,aAAa,EAAE,UAAU,EA6B9B,CAAA;AAoBD,eAAO,MAAM,WAAW,EAAE,eA2FzB,CAAA;AAED,OAAO,EAAE,aAAa,EAAE,CAAA;AACxB,cAAc,qBAAqB,CAAC"}

package/dist/components/Panel/index.js

@@ -1,5 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Panel } from 'ui-lab-components';
+import Example1, { metadata as metadata1 } from './examples/01-sidebar-toggle.js';
+import examplesJson from './examples.json' with { type: 'json' };
+import { loadComponentExamples } from '../../utils/load-component-examples.js';
+const examplesData = [
+    { id: '01-sidebar-toggle', Component: Example1, metadata: metadata1 },
+];
 const panelControls = [
     {
         name: 'spacing',
@@ -78,7 +84,9 @@ export const panelDetail = {
                                     borderTop: '1px solid var(--color-border)',
                                 }, children: "Footer" }) })] }) })),
         },
+        ...loadComponentExamples(examplesData, examplesJson),
     ],
 };
 export { panelControls };
+export * from './examples/index.js';
 //# sourceMappingURL=index.js.map

package/dist/components/Panel/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Panel/index.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Panel/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/Path/examples/01-basic-path.js

@@ -1,10 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Path, PathItem } from 'ui-lab-components';
+import { Path } from 'ui-lab-components';
 export const metadata = {
     title: 'Basic Path',
     description: 'A simple path navigation showing the current page location. Use this to help users understand their position in the site hierarchy.'
 };
 export default function Example() {
-    return (_jsxs(Path, { children: [_jsx(PathItem, { href: "/", children: "Home" }), _jsx(PathItem, { href: "/products", children: "Products" }), _jsx(PathItem, { href: "/products/electronics", children: "Electronics" }), _jsx(PathItem, { children: "Laptop" })] }));
+    return (_jsxs(Path, { children: [_jsx(Path.Item, { href: "/", children: "Home" }), _jsx(Path.Item, { href: "/products", children: "Products" }), _jsx(Path.Item, { href: "/products/electronics", children: "Electronics" }), _jsx(Path.Item, { children: "Laptop" })] }));
 }
 //# sourceMappingURL=01-basic-path.js.map

package/dist/components/Path/examples/01-basic-path.js.map

@@ -1 +1 @@
-{"version":3,"file":"01-basic-path.js","sourceRoot":"","sources":["../../../../src/components/Path/examples/01-basic-path.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAEnD,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,KAAK,EAAE,YAAY;IACnB,WAAW,EAAE,qIAAqI;CACnJ,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,OAAO;IAC7B,OAAO,CACL,MAAC,IAAI,eACH,KAAC,QAAQ,IAAC,IAAI,EAAC,GAAG,qBAAgB,EAClC,KAAC,QAAQ,IAAC,IAAI,EAAC,WAAW,yBAAoB,EAC9C,KAAC,QAAQ,IAAC,IAAI,EAAC,uBAAuB,4BAAuB,EAC7D,KAAC,QAAQ,yBAAkB,IACtB,CACR,CAAC;AACJ,CAAC"}
+{"version":3,"file":"01-basic-path.js","sourceRoot":"","sources":["../../../../src/components/Path/examples/01-basic-path.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AAEzC,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,KAAK,EAAE,YAAY;IACnB,WAAW,EAAE,qIAAqI;CACnJ,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,OAAO;IAC7B,OAAO,CACL,MAAC,IAAI,eACH,KAAC,IAAI,CAAC,IAAI,IAAC,IAAI,EAAC,GAAG,qBAAiB,EACpC,KAAC,IAAI,CAAC,IAAI,IAAC,IAAI,EAAC,WAAW,yBAAqB,EAChD,KAAC,IAAI,CAAC,IAAI,IAAC,IAAI,EAAC,uBAAuB,4BAAwB,EAC/D,KAAC,IAAI,CAAC,IAAI,yBAAmB,IACxB,CACR,CAAC;AACJ,CAAC"}

package/dist/components/Path/examples/02-custom-separator.d.ts

@@ -0,0 +1,6 @@
+export declare const metadata: {
+    title: string;
+    description: string;
+};
+export default function Example(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=02-custom-separator.d.ts.map

package/dist/components/Path/examples/02-custom-separator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"02-custom-separator.d.ts","sourceRoot":"","sources":["../../../../src/components/Path/examples/02-custom-separator.tsx"],"names":[],"mappings":"AAGA,eAAO,MAAM,QAAQ;;;CAGpB,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,OAAO,4CAQ9B"}

package/dist/components/Path/examples/02-custom-separator.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Path } from "ui-lab-components";
+import { FaChevronRight } from "react-icons/fa6";
+export const metadata = {
+    title: "Custom Separator",
+    description: "Pass any node via the separator prop to replace the default slash.",
+};
+export default function Example() {
+    return (_jsxs(Path, { separator: _jsx(FaChevronRight, { className: "w-3 h-3 text-foreground-400" }), children: [_jsx(Path.Item, { href: "/projects", children: "Projects" }), _jsx(Path.Item, { href: "/projects/ui-lab", children: "ui-lab" }), _jsx(Path.Item, { children: "components" })] }));
+}
+//# sourceMappingURL=02-custom-separator.js.map

package/dist/components/Path/examples/02-custom-separator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"02-custom-separator.js","sourceRoot":"","sources":["../../../../src/components/Path/examples/02-custom-separator.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEjD,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,KAAK,EAAE,kBAAkB;IACzB,WAAW,EAAE,oEAAoE;CAClF,CAAC;AAEF,MAAM,CAAC,OAAO,UAAU,OAAO;IAC7B,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAE,KAAC,cAAc,IAAC,SAAS,EAAC,6BAA6B,GAAG,aACzE,KAAC,IAAI,CAAC,IAAI,IAAC,IAAI,EAAC,WAAW,yBAAqB,EAChD,KAAC,IAAI,CAAC,IAAI,IAAC,IAAI,EAAC,kBAAkB,uBAAmB,EACrD,KAAC,IAAI,CAAC,IAAI,6BAAuB,IAC5B,CACR,CAAC;AACJ,CAAC"}