@worknice/whiteboard 0.23.3 → 0.25.0

package/dist/controls/Disclosure.stories.js

@@ -0,0 +1,132 @@
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__ from "storybook/test";
+import * as __WEBPACK_EXTERNAL_MODULE__presentation_Card_js_6a9e15fd__ from "../presentation/Card.js";
+import * as __WEBPACK_EXTERNAL_MODULE__presentation_CardContent_js_72373f62__ from "../presentation/CardContent.js";
+import * as __WEBPACK_EXTERNAL_MODULE__presentation_ConfirmationModal_js_ded519be__ from "../presentation/ConfirmationModal.js";
+import * as __WEBPACK_EXTERNAL_MODULE__presentation_Icon_js_6961aa57__ from "../presentation/Icon.js";
+import * as __WEBPACK_EXTERNAL_MODULE__presentation_Modal_js_31b952b2__ from "../presentation/Modal.js";
+import * as __WEBPACK_EXTERNAL_MODULE__presentation_PlainText_js_e98763ad__ from "../presentation/PlainText.js";
+import * as __WEBPACK_EXTERNAL_MODULE__presentation_VStack_js_fd392b79__ from "../presentation/VStack.js";
+import * as __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_3cc1ba9c__ from "../utils/storybook.js";
+import * as __WEBPACK_EXTERNAL_MODULE__Disclosure_js_c4149207__ from "./Disclosure.js";
+const meta = {
+    component: __WEBPACK_EXTERNAL_MODULE__Disclosure_js_c4149207__["default"],
+    argTypes: {
+        id: {
+            control: false
+        },
+        title: {
+            control: false
+        },
+        children: {
+            table: {
+                type: {
+                    summary: "ReactNode"
+                }
+            }
+        },
+        icon: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_3cc1ba9c__.iconStoryControl)()
+    },
+    args: {
+        id: "default-button",
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+            children: "Open modal"
+        }),
+        type: "secondary",
+        size: "normal",
+        disabled: false,
+        tooltip: "This is a tooltip",
+        render: (onClose)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_Modal_js_31b952b2__["default"], {
+                onClose: onClose,
+                children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_Card_js_6a9e15fd__["default"], {
+                    header: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_PlainText_js_e98763ad__["default"], {
+                        font: "h6",
+                        tagName: "h6",
+                        children: "Simple Modal"
+                    }),
+                    children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_CardContent_js_72373f62__["default"], {
+                        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE__presentation_VStack_js_fd392b79__["default"], {
+                            spacing: "p2",
+                            children: [
+                                /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_PlainText_js_e98763ad__["default"], {
+                                    children: "This is a simple modal opened by Disclosure."
+                                }),
+                                /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_PlainText_js_e98763ad__["default"], {
+                                    tone: "muted",
+                                    children: "Click outside or press Escape to close."
+                                })
+                            ]
+                        })
+                    })
+                })
+            })
+    }
+};
+const Disclosure_stories_rslib_entry_ = meta;
+const WithSimpleModal = {
+    args: {
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+            children: "Open modal"
+        })
+    }
+};
+const WithConfirmationModal = {
+    args: {
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+            children: "Archive"
+        }),
+        icon: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_Icon_js_6961aa57__["default"], {
+            symbol: "Archive"
+        }),
+        render: (onClose)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_ConfirmationModal_js_ded519be__["default"], {
+                title: "Archive item",
+                primaryLabel: "Archive",
+                onClose: onClose,
+                onSubmit: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)(async ()=>{
+                    await new Promise((resolve)=>setTimeout(resolve, 1000));
+                }),
+                onSuccess: onClose,
+                children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_PlainText_js_e98763ad__["default"], {
+                    children: "Are you sure you want to archive this item? This action cannot be undone."
+                })
+            })
+    }
+};
+const WithIcon = {
+    args: {
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+            children: "Edit"
+        }),
+        icon: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_Icon_js_6961aa57__["default"], {
+            symbol: "Edit"
+        })
+    }
+};
+const Primary = {
+    args: {
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+            children: "Save"
+        }),
+        type: "primary"
+    }
+};
+const Small = {
+    args: {
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+            children: "Duplicate"
+        }),
+        icon: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_Icon_js_6961aa57__["default"], {
+            symbol: "Copy"
+        }),
+        size: "small"
+    }
+};
+const Disabled = {
+    args: {
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+            children: "Disabled"
+        }),
+        disabled: true
+    }
+};
+export { Disabled, Primary, Small, WithConfirmationModal, WithIcon, WithSimpleModal, Disclosure_stories_rslib_entry_ as default };

package/dist/controls/Link.d.ts

@@ -1,7 +1,12 @@
 import { type ReactNode } from "react";
 type Props = {
     children: ReactNode;
+    /** What to download, if true the href is used as the download filename.
+     *
+     * See: https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/a#download
+     * */
     download?: string | boolean;
+    /** Whether the link should open in a new tab. */
     external?: boolean;
     font?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "monospace" | "regular-bold-italic" | "regular-bold" | "regular-italic" | "regular" | "small-bold-italic" | "small-bold" | "small-italic" | "small" | "tiny-bold-italic" | "tiny-bold" | "tiny-italic" | "tiny";
     href: string;

package/dist/controls/Link.stories.d.ts

@@ -0,0 +1,38 @@
+import type { StoryObj } from "@storybook/nextjs-vite";
+declare const meta: {
+    component: ({ children, download, external, font, href, tone, id, icon, iconRight, }: {
+        children: import("react").ReactNode;
+        download?: string | boolean;
+        external?: boolean;
+        font?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "monospace" | "regular-bold-italic" | "regular-bold" | "regular-italic" | "regular" | "small-bold-italic" | "small-bold" | "small-italic" | "small" | "tiny-bold-italic" | "tiny-bold" | "tiny-italic" | "tiny";
+        href: string;
+        id?: string;
+        tone?: "default" | "primary" | "muted" | "danger" | "warning" | "success" | "info";
+        icon?: import("react").ReactNode;
+        iconRight?: import("react").ReactNode;
+    }) => import("react/jsx-runtime").JSX.Element;
+    argTypes: {
+        id: {
+            control: false;
+        };
+        children: {
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+        icon: import("storybook/internal/csf").InputType;
+        iconRight: import("storybook/internal/csf").InputType;
+    };
+    args: {
+        download: false;
+        href: string;
+        children: import("react/jsx-runtime").JSX.Element;
+        external: false;
+        id: string;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;

package/dist/controls/Link.stories.js

@@ -0,0 +1,34 @@
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_3cc1ba9c__ from "../utils/storybook.js";
+import * as __WEBPACK_EXTERNAL_MODULE__Link_js_42733813__ from "./Link.js";
+const meta = {
+    component: __WEBPACK_EXTERNAL_MODULE__Link_js_42733813__["default"],
+    argTypes: {
+        id: {
+            control: false
+        },
+        children: {
+            table: {
+                type: {
+                    summary: "ReactNode"
+                }
+            }
+        },
+        icon: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_3cc1ba9c__.iconStoryControl)(),
+        iconRight: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_3cc1ba9c__.iconStoryControl)()
+    },
+    args: {
+        download: false,
+        href: "#",
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+            children: "Click me!"
+        }),
+        external: false,
+        id: "button-link-1"
+    }
+};
+const Link_stories_rslib_entry_ = meta;
+const Default = {
+    args: {}
+};
+export { Default, Link_stories_rslib_entry_ as default };

package/dist/controls/LinkCard.stories.d.ts

@@ -0,0 +1,23 @@
+import type { StoryObj } from "@storybook/nextjs-vite";
+declare const meta: {
+    component: ({ children, href }: {
+        children: import("react").ReactNode;
+        href: string;
+    }) => import("react/jsx-runtime").JSX.Element;
+    argTypes: {
+        children: {
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+    };
+    args: {
+        href: string;
+        children: import("react/jsx-runtime").JSX.Element;
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;

package/dist/controls/LinkCard.stories.js

@@ -0,0 +1,25 @@
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE__LinkCard_js_900a4437__ from "./LinkCard.js";
+const meta = {
+    component: __WEBPACK_EXTERNAL_MODULE__LinkCard_js_900a4437__["default"],
+    argTypes: {
+        children: {
+            table: {
+                type: {
+                    summary: "ReactNode"
+                }
+            }
+        }
+    },
+    args: {
+        href: "#",
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+            children: "Click me!"
+        })
+    }
+};
+const LinkCard_stories_rslib_entry_ = meta;
+const Default = {
+    args: {}
+};
+export { Default, LinkCard_stories_rslib_entry_ as default };

package/dist/controls/MenuButton.d.ts

@@ -28,10 +28,12 @@ type Props = {
     children?: ReactNode;
     icon: ReactNode;
 }) & ({
+    /** An array of options to display in the menu. Can be a link or use render or onClick callbacks. It is mutually exclusive with optionGroups. */
     options: Array<Option | null>;
     optionGroups?: never;
 } | {
     options?: never;
+    /** An array of option groups to display in the menu. Each group has a header and an array of options. It is mutually exclusive with options. */
     optionGroups: Array<{
         header: string;
         options: Array<Option | null>;

package/dist/controls/MenuButton.js

@@ -157,7 +157,8 @@ const MenuButton = ({ autoFocus = false, disabled = false, id, options, optionGr
         activeIndex,
         getItemProps,
         optionsRef,
-        NextLink
+        NextLink,
+        triggerOption
     ]);
     const triggerOptionAtIndex = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((index)=>{
         if (null == index) return;

package/dist/controls/MenuButton.stories.d.ts

@@ -0,0 +1,71 @@
+import type { StoryObj } from "@storybook/nextjs-vite";
+declare const meta: {
+    component: ({ autoFocus, disabled, id, options, optionGroups, searchPlaceholder, children, icon, iconRight, displaySearch, fullWidth, }: {
+        autoFocus?: boolean;
+        disabled?: boolean;
+        id?: string;
+        searchPlaceholder?: string;
+        displaySearch?: boolean;
+        iconRight?: import("react").ReactNode;
+        fullWidth?: boolean;
+    } & ({
+        children: import("react").ReactNode;
+        icon?: import("react").ReactNode;
+    } | {
+        children?: import("react").ReactNode;
+        icon: import("react").ReactNode;
+    }) & ({
+        options: Array<import("./MenuButton").MenuButtonOption | null>;
+        optionGroups?: never;
+    } | {
+        options?: never;
+        optionGroups: Array<{
+            header: string;
+            options: Array<import("./MenuButton").MenuButtonOption | null>;
+        }>;
+    })) => import("react/jsx-runtime").JSX.Element;
+    argTypes: {
+        id: {
+            control: false;
+        };
+        children: {
+            table: {
+                type: {
+                    summary: string;
+                };
+            };
+        };
+        icon: import("storybook/internal/csf").InputType;
+        iconRight: import("storybook/internal/csf").InputType;
+        options: {
+            control: false;
+        };
+        optionGroups: {
+            control: false;
+        };
+    };
+    args: {
+        id: string;
+        disabled: false;
+        fullWidth: false;
+        displaySearch: false;
+        searchPlaceholder: string;
+        autoFocus: false;
+        options: {
+            id: string;
+            label: string;
+            type: "onClick";
+            onClick: import("storybook/test").Mock<(...args: any[]) => any>;
+        }[];
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Normal: Story;
+export declare const WithChildrenAndIcon: Story;
+export declare const WithSearch: Story;
+export declare const WithOptionGroups: Story;
+export declare const WithDisabledOptions: Story;
+export declare const Disabled: Story;
+export declare const WithManyOptions: Story;
+export declare const WithMixedOptionTypes: Story;

package/dist/controls/MenuButton.stories.js

@@ -0,0 +1,275 @@
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__ from "storybook/test";
+import * as __WEBPACK_EXTERNAL_MODULE__presentation_Card_js_6a9e15fd__ from "../presentation/Card.js";
+import * as __WEBPACK_EXTERNAL_MODULE__presentation_CardContent_js_72373f62__ from "../presentation/CardContent.js";
+import * as __WEBPACK_EXTERNAL_MODULE__presentation_Icon_js_6961aa57__ from "../presentation/Icon.js";
+import * as __WEBPACK_EXTERNAL_MODULE__presentation_Modal_js_31b952b2__ from "../presentation/Modal.js";
+import * as __WEBPACK_EXTERNAL_MODULE__presentation_PlainText_js_e98763ad__ from "../presentation/PlainText.js";
+import * as __WEBPACK_EXTERNAL_MODULE__presentation_VStack_js_fd392b79__ from "../presentation/VStack.js";
+import * as __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_3cc1ba9c__ from "../utils/storybook.js";
+import * as __WEBPACK_EXTERNAL_MODULE__MenuButton_js_7e3407c7__ from "./MenuButton.js";
+const meta = {
+    component: __WEBPACK_EXTERNAL_MODULE__MenuButton_js_7e3407c7__["default"],
+    argTypes: {
+        id: {
+            control: false
+        },
+        children: {
+            table: {
+                type: {
+                    summary: "ReactNode"
+                }
+            }
+        },
+        icon: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_3cc1ba9c__.iconStoryControl)(),
+        iconRight: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_3cc1ba9c__.iconStoryControl)(),
+        options: {
+            control: false
+        },
+        optionGroups: {
+            control: false
+        }
+    },
+    args: {
+        id: "default-menu-button",
+        disabled: false,
+        fullWidth: false,
+        displaySearch: false,
+        searchPlaceholder: "Search...",
+        autoFocus: false,
+        options: [
+            {
+                id: "option-1",
+                label: "Option 1",
+                type: "onClick",
+                onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+            },
+            {
+                id: "option-2",
+                label: "Option 2",
+                type: "onClick",
+                onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+            },
+            {
+                id: "option-3",
+                label: "Option 3",
+                type: "onClick",
+                onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+            }
+        ]
+    }
+};
+const MenuButton_stories_rslib_entry_ = meta;
+const Normal = {
+    args: {
+        id: "icon-only-menu-button",
+        icon: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_Icon_js_6961aa57__["default"], {
+            symbol: "Overflow"
+        })
+    }
+};
+const WithChildrenAndIcon = {
+    args: {
+        id: "with-children-and-icon-menu-button",
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+            children: "Add item"
+        }),
+        icon: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_Icon_js_6961aa57__["default"], {
+            symbol: "Plus"
+        })
+    }
+};
+const WithSearch = {
+    args: {
+        id: "with-search-menu-button",
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+            children: "Find option"
+        }),
+        displaySearch: true,
+        searchPlaceholder: "Find option...",
+        options: [
+            {
+                id: "option-1",
+                label: "Apple",
+                type: "onClick",
+                onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+            },
+            {
+                id: "option-2",
+                label: "Banana",
+                type: "onClick",
+                onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+            },
+            {
+                id: "option-3",
+                label: "Cherry",
+                type: "onClick",
+                onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+            },
+            {
+                id: "option-4",
+                label: "Date",
+                type: "onClick",
+                onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+            },
+            {
+                id: "option-5",
+                label: "Elderberry",
+                type: "onClick",
+                onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+            }
+        ]
+    }
+};
+const WithOptionGroups = {
+    args: {
+        id: "with-groups-menu-button",
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+            children: "Choose with category"
+        }),
+        options: void 0,
+        optionGroups: [
+            {
+                header: "Fruits",
+                options: [
+                    {
+                        id: "apple",
+                        label: "Apple",
+                        type: "onClick",
+                        onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+                    },
+                    {
+                        id: "banana",
+                        label: "Banana",
+                        type: "onClick",
+                        onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+                    }
+                ]
+            },
+            {
+                header: "Vegetables",
+                options: [
+                    {
+                        id: "carrot",
+                        label: "Carrot",
+                        type: "onClick",
+                        onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+                    },
+                    {
+                        id: "lettuce",
+                        label: "Lettuce",
+                        type: "onClick",
+                        onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+                    }
+                ]
+            }
+        ]
+    }
+};
+const WithDisabledOptions = {
+    args: {
+        id: "with-disabled-menu-button",
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+            children: "Choose option"
+        }),
+        options: [
+            {
+                id: "option-1",
+                label: "Enabled Option",
+                type: "onClick",
+                onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+            },
+            {
+                id: "option-2",
+                label: "Disabled Option",
+                disabled: true,
+                type: "onClick",
+                onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+            },
+            {
+                id: "option-3",
+                label: "Another Enabled",
+                type: "onClick",
+                onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+            }
+        ]
+    }
+};
+const Disabled = {
+    args: {
+        id: "disabled-menu-button",
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+            children: "Disabled"
+        }),
+        disabled: true
+    }
+};
+const WithManyOptions = {
+    args: {
+        id: "many-options-menu-button",
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+            children: "Choose from many"
+        }),
+        displaySearch: true,
+        options: Array.from({
+            length: 20
+        }, (_, i)=>({
+                id: `option-${i + 1}`,
+                label: `Option ${i + 1}`,
+                type: "onClick",
+                onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+            }))
+    }
+};
+const WithMixedOptionTypes = {
+    args: {
+        id: "with-links-menu-button",
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
+            children: "Navigate"
+        }),
+        options: [
+            {
+                id: "link-1",
+                label: "Link",
+                type: "link",
+                href: "#"
+            },
+            {
+                id: "click-1",
+                label: "OnClick Callback",
+                type: "onClick",
+                onClick: (0, __WEBPACK_EXTERNAL_MODULE_storybook_test_a99c99ea__.fn)()
+            },
+            {
+                id: "render-1",
+                label: "Render callback with modal",
+                type: "render",
+                render: (onClose)=>/*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_Modal_js_31b952b2__["default"], {
+                        onClose: onClose,
+                        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_Card_js_6a9e15fd__["default"], {
+                            header: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_PlainText_js_e98763ad__["default"], {
+                                font: "h6",
+                                tagName: "h6",
+                                children: "Simple Modal"
+                            }),
+                            children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_CardContent_js_72373f62__["default"], {
+                                children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE__presentation_VStack_js_fd392b79__["default"], {
+                                    spacing: "p2",
+                                    children: [
+                                        /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_PlainText_js_e98763ad__["default"], {
+                                            children: "This is a simple modal opened by Disclosure."
+                                        }),
+                                        /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__presentation_PlainText_js_e98763ad__["default"], {
+                                            tone: "muted",
+                                            children: "Click outside or press Escape to close."
+                                        })
+                                    ]
+                                })
+                            })
+                        })
+                    })
+            }
+        ]
+    }
+};
+export { Disabled, Normal, WithChildrenAndIcon, WithDisabledOptions, WithManyOptions, WithMixedOptionTypes, WithOptionGroups, WithSearch, MenuButton_stories_rslib_entry_ as default };

package/dist/controls/PageTabSet.d.ts

@@ -1,12 +1,16 @@
 import { type ReactNode } from "react";
 type Props = {
     id?: string;
-    pages: Array<{
+    pages: {
         path: string;
         label: ReactNode;
         key: string;
-    }>;
+    }[];
     variant?: "default" | "steps";
 };
+/**
+ * A set of tabs that can be used to navigate between pages. Depends on Link and pathname from NextContext.
+ * For a controlled version of this, see TabSetLink.
+ */
 declare const PageTabSet: ({ id, pages, variant }: Props) => import("react/jsx-runtime").JSX.Element;
 export default PageTabSet;