@webiny/admin-ui 6.4.0-beta.3 → 6.4.0-beta.5

package/Sidebar/Sidebar.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Sidebar/Sidebar.stories.js","sources":["../../src/Sidebar/Sidebar.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { ReactComponent as AuditLogsIcon } from \"@webiny/icons/assignment.svg\";\nimport { ReactComponent as FormBuilderIcon } from \"@webiny/icons/check_box.svg\";\nimport { ReactComponent as CmsIcon } from \"@webiny/icons/web.svg\";\nimport { ReactComponent as PageBuilderIcon } from \"@webiny/icons/table_chart.svg\";\nimport { ReactComponent as InfoIcon } from \"@webiny/icons/info.svg\";\nimport { ReactComponent as ChatIcon } from \"@webiny/icons/chat.svg\";\nimport { ReactComponent as GithubIcon } from \"@webiny/icons/gite.svg\";\nimport { ReactComponent as DocsIcon } from \"@webiny/icons/summarize.svg\";\nimport { ReactComponent as ApiPlaygroundIcon } from \"@webiny/icons/swap_horiz.svg\";\nimport { ReactComponent as MoreVertIcon } from \"@webiny/icons/more_vert.svg\";\nimport { ReactComponent as FileManagerIcon } from \"@webiny/icons/insert_drive_file.svg\";\nimport { ReactComponent as GridIcon } from \"@webiny/icons/grid_4x4.svg\";\nimport { ReactComponent as CarIcon } from \"@webiny/icons/car_rental.svg\";\nimport { ReactComponent as VehiclesIcon } from \"@webiny/icons/expand.svg\";\nimport { Sidebar } from \"./Sidebar.js\";\nimport { SidebarProvider } from \"~/Sidebar/components/SidebarProvider.js\";\nimport { DropdownMenu } from \"~/DropdownMenu/index.js\";\nimport { Tag } from \"~/Tag/index.js\";\nimport { Tooltip } from \"~/Tooltip/index.js\";\nimport { AdminUiProvider } from \"~/AdminUiProvider/index.js\";\nimport { HashLink } from \"~/Sidebar/stories/HashLink.js\";\nimport { useHash } from \"~/Sidebar/stories/useHash.js\";\n\nconst meta: Meta<typeof Sidebar> = {\n    title: \"Components/Sidebar\",\n    component: Sidebar,\n\n    parameters: {\n        layout: \"fullscreen\"\n    },\n\n    // We removed this because in the \"all stories\" view, the menu gets visually\n    // broken because of the fixed positioning of the sidebar. This is not a problem\n    // when the story is viewed in isolation.\n    // tags: [\"autodocs\"],\n\n    argTypes: {},\n    decorators: [\n        Story => (\n            <Tooltip.Provider>\n                <Story />\n            </Tooltip.Provider>\n        )\n    ]\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof Sidebar>;\n\nexport const MainMenu: Story = {\n    render: () => (\n        <AdminUiProvider linkComponent={HashLink}>\n            <SidebarComponent />\n        </AdminUiProvider>\n    )\n};\n\nconst SidebarComponent = () => {\n    const hash = useHash();\n\n    const [sidebarState, setSidebarState] = React.useState<{\n        pinned: boolean;\n        expandedSections: string[];\n        pinnedItems: string[];\n    }>({\n        pinned: false,\n        expandedSections: [],\n        pinnedItems: []\n    });\n\n    return (\n        <SidebarProvider state={sidebarState} onChangeState={setSidebarState}>\n            <Sidebar\n                title={\"Webiny\"}\n                icon={\n                    <Sidebar.Icon\n                        element={<img src=\"/images/wby-logo.png\" alt=\"Webiny\" />}\n                        label={\"Webiny\"}\n                    />\n                }\n                footer={\n                    <DropdownMenu\n                        trigger={\n                            <Sidebar.Item\n                                icon={<Sidebar.Item.Icon label=\"Settings\" element={<InfoIcon />} />}\n                                text={\"Support\"}\n                                action={<Sidebar.Item.Action element={<MoreVertIcon />} />}\n                            />\n                        }\n                        className={\"w-[225px]\"}\n                    >\n                        <DropdownMenu.Item text={\"API Playground\"} icon={<ApiPlaygroundIcon />} />\n                        <DropdownMenu.Item text={\"Documentation\"} icon={<DocsIcon />} />\n                        <DropdownMenu.Item text={\"GitHub\"} icon={<GithubIcon />} />\n                        <DropdownMenu.Item text={\"Slack\"} icon={<ChatIcon />} />\n                        <DropdownMenu.Separator />\n                        <DropdownMenu.Item\n                            text={\n                                <div className={\"flex items-center\"}>\n                                    Webiny 6.0.0\n                                    <Tag\n                                        variant={\"accent\"}\n                                        content={\"WCP \"}\n                                        className={\"ml-sm-extra\"}\n                                    />\n                                </div>\n                            }\n                        />\n                    </DropdownMenu>\n                }\n            >\n                <Sidebar.Link\n                    pinnable\n                    text={\"Audit Logs\"}\n                    action={\n                        <Sidebar.Item.Action\n                            element={<MoreVertIcon />}\n                            onClick={() => console.log(\"More action clicked\")}\n                        />\n                    }\n                    to={\"#audit-logs\"}\n                    active={hash === \"#audit-logs\"}\n                    icon={<Sidebar.Item.Icon label=\"Audit Logs\" element={<AuditLogsIcon />} />}\n                />\n                <Sidebar.Link\n                    pinnable\n                    text={\"Form Builder\"}\n                    to={\"#form-builder\"}\n                    active={hash === \"#form-builder\"}\n                    icon={<Sidebar.Item.Icon label=\"Form Builder\" element={<FormBuilderIcon />} />}\n                />\n                <Sidebar.Item\n                    pinnable\n                    text={\"File Manager\"}\n                    onClick={() => {\n                        alert(\"File Manager clicked\");\n                    }}\n                    icon={<Sidebar.Item.Icon label=\"File Manager\" element={<FileManagerIcon />} />}\n                />\n                <Sidebar.Item\n                    text={\"Content\"}\n                    icon={<Sidebar.Item.Icon label=\"Headless CMS\" element={<CmsIcon />} />}\n                >\n                    <Sidebar.Item\n                        text={\"Vehicles\"}\n                        icon={<Sidebar.Item.Icon label=\"Headless CMS\" element={<VehiclesIcon />} />}\n                        action={<Sidebar.Item.Action element={<MoreVertIcon />} />}\n                    >\n                        <Sidebar.Link\n                            pinnable\n                            pinnedIcon={\n                                <Sidebar.Item.Icon label=\"File Manager\" element={<CarIcon />} />\n                            }\n                            text={\"Cars\"}\n                            to={\"#cms-cars\"}\n                            active={hash === \"#cms-cars\"}\n                        />\n                        <Sidebar.Link\n                            pinnable\n                            text={\"Planes\"}\n                            to={\"#cms-planes\"}\n                            active={hash === \"#cms-planes\"}\n                        />\n                    </Sidebar.Item>{\" \"}\n                    <Sidebar.Item\n                        text={\"Ungrouped\"}\n                        icon={<Sidebar.Item.Icon label=\"Headless CMS\" element={<GridIcon />} />}\n                        action={<Sidebar.Item.Action element={<MoreVertIcon />} />}\n                    >\n                        <Sidebar.Link\n                            text={\"Articles\"}\n                            to={\"#cms-articles\"}\n                            active={hash === \"#cms-articles\"}\n                        />\n                        <Sidebar.Link\n                            text={\"Settings\"}\n                            to={\"#cms-settings\"}\n                            active={hash === \"#cms-settings\"}\n                        />\n                    </Sidebar.Item>\n                </Sidebar.Item>\n                <Sidebar.Item\n                    text={\"Headless CMS\"}\n                    icon={<Sidebar.Item.Icon label=\"Headless CMS\" element={<CmsIcon />} />}\n                >\n                    <Sidebar.Group text={\"Content Models\"} />\n                    <Sidebar.Link\n                        pinnable\n                        text={\"Groups\"}\n                        to={\"#cms-groups\"}\n                        active={hash === \"#cms-groups\"}\n                    />\n                    <Sidebar.Link\n                        pinnable\n                        text={\"Models\"}\n                        to={\"#cms-models\"}\n                        active={hash === \"#cms-models\"}\n                    />\n                </Sidebar.Item>\n                <Sidebar.Item\n                    text={\"Page Builder\"}\n                    icon={<Sidebar.Item.Icon label=\"Page Builder\" element={<PageBuilderIcon />} />}\n                >\n                    <Sidebar.Group text={\"Blocks\"} />\n                    <Sidebar.Link\n                        text={\"Blocks\"}\n                        to={\"#pb-blocks\"}\n                        active={hash === \"#pb-blocks\"}\n                    />\n                    <Sidebar.Link\n                        text={\"Categories\"}\n                        to={\"#pb-blocks-categories\"}\n                        active={hash === \"#pb-blocks-categories\"}\n                    />\n\n                    <Sidebar.Group text={\"Pages\"} active={hash === `#pb-pages`} />\n                    <Sidebar.Link\n                        to={\"#pb-pages-categories\"}\n                        text={\"Categories\"}\n                        active={hash === `#pb-pages-categories`}\n                    />\n                    <Sidebar.Link\n                        to={\"#pb-pages-menus\"}\n                        text={\"Menus\"}\n                        active={hash === `#pb-pages-menus`}\n                    />\n                    <Sidebar.Link\n                        to={\"#pb-pages-pages\"}\n                        text={\"Pages\"}\n                        active={hash === `#pb-pages-pages`}\n                    />\n                    <Sidebar.Link\n                        to={\"#pb-pages-templates\"}\n                        text={\"Templates\"}\n                        disabled={true}\n                        active={hash === `#pb-pages-templates`}\n                    />\n                </Sidebar.Item>\n            </Sidebar>\n        </SidebarProvider>\n    );\n};\n"],"names":["meta","Sidebar","Story","Tooltip","MainMenu","AdminUiProvider","HashLink","SidebarComponent","hash","useHash","sidebarState","setSidebarState","React","SidebarProvider","DropdownMenu","InfoIcon","MoreVertIcon","ApiPlaygroundIcon","DocsIcon","GithubIcon","ChatIcon","Tag","console","AuditLogsIcon","FormBuilderIcon","alert","FileManagerIcon","CmsIcon","VehiclesIcon","CarIcon","GridIcon","PageBuilderIcon"],"mappings":"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"}
+{"version":3,"file":"Sidebar/Sidebar.stories.js","sources":["../../src/Sidebar/Sidebar.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { ReactComponent as AuditLogsIcon } from \"@webiny/icons/assignment.svg\";\nimport { ReactComponent as FormBuilderIcon } from \"@webiny/icons/check_box.svg\";\nimport { ReactComponent as CmsIcon } from \"@webiny/icons/web.svg\";\nimport { ReactComponent as PageBuilderIcon } from \"@webiny/icons/table_chart.svg\";\nimport { ReactComponent as InfoIcon } from \"@webiny/icons/info.svg\";\nimport { ReactComponent as ChatIcon } from \"@webiny/icons/chat.svg\";\nimport { ReactComponent as GithubIcon } from \"@webiny/icons/gite.svg\";\nimport { ReactComponent as DocsIcon } from \"@webiny/icons/summarize.svg\";\nimport { ReactComponent as ApiPlaygroundIcon } from \"@webiny/icons/swap_horiz.svg\";\nimport { ReactComponent as MoreVertIcon } from \"@webiny/icons/more_vert.svg\";\nimport { ReactComponent as FileManagerIcon } from \"@webiny/icons/insert_drive_file.svg\";\nimport { ReactComponent as GridIcon } from \"@webiny/icons/grid_4x4.svg\";\nimport { ReactComponent as CarIcon } from \"@webiny/icons/car_rental.svg\";\nimport { ReactComponent as VehiclesIcon } from \"@webiny/icons/expand.svg\";\nimport { Sidebar } from \"./Sidebar.js\";\nimport { SidebarProvider } from \"~/Sidebar/components/SidebarProvider.js\";\nimport { DropdownMenu } from \"~/DropdownMenu/index.js\";\nimport { Tag } from \"~/Tag/index.js\";\nimport { Tooltip } from \"~/Tooltip/index.js\";\nimport { AdminUiProvider } from \"~/AdminUiProvider/index.js\";\nimport { HashLink } from \"~/Sidebar/stories/HashLink.js\";\nimport { useHash } from \"~/Sidebar/stories/useHash.js\";\n\nconst meta: Meta<typeof Sidebar> = {\n    title: \"Components/Sidebar\",\n    component: Sidebar,\n\n    parameters: {\n        layout: \"fullscreen\"\n    },\n\n    // We removed this because in the \"all stories\" view, the menu gets visually\n    // broken because of the fixed positioning of the sidebar. This is not a problem\n    // when the story is viewed in isolation.\n    // tags: [\"autodocs\"],\n\n    argTypes: {},\n    decorators: [\n        Story => (\n            <Tooltip.Provider>\n                <Story />\n            </Tooltip.Provider>\n        )\n    ]\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof Sidebar>;\n\nexport const MainMenu: Story = {\n    render: () => (\n        <AdminUiProvider linkComponent={HashLink}>\n            <SidebarComponent />\n        </AdminUiProvider>\n    )\n};\n\nconst SidebarComponent = () => {\n    const hash = useHash();\n\n    const [sidebarState, setSidebarState] = React.useState<{\n        pinned: boolean;\n        expandedSections: string[];\n        pinnedItems: string[];\n    }>({\n        pinned: false,\n        expandedSections: [],\n        pinnedItems: []\n    });\n\n    return (\n        <SidebarProvider state={sidebarState} onChangeState={setSidebarState}>\n            <Sidebar\n                title={\"Webiny\"}\n                icon={\n                    <Sidebar.Icon\n                        element={<img src=\"/images/wby-logo.png\" alt=\"Webiny\" />}\n                        label={\"Webiny\"}\n                    />\n                }\n                footer={\n                    <DropdownMenu\n                        trigger={\n                            <Sidebar.Item\n                                icon={<Sidebar.Item.Icon label=\"Settings\" element={<InfoIcon />} />}\n                                text={\"Support\"}\n                                action={<Sidebar.Item.Action element={<MoreVertIcon />} />}\n                            />\n                        }\n                        className={\"w-[225px]\"}\n                    >\n                        <DropdownMenu.Item text={\"API Playground\"} icon={<ApiPlaygroundIcon />} />\n                        <DropdownMenu.Item text={\"Documentation\"} icon={<DocsIcon />} />\n                        <DropdownMenu.Item text={\"GitHub\"} icon={<GithubIcon />} />\n                        <DropdownMenu.Item text={\"Slack\"} icon={<ChatIcon />} />\n                        <DropdownMenu.Separator />\n                        <DropdownMenu.Item\n                            text={\n                                <div className={\"flex items-center\"}>\n                                    Webiny 6.0.0\n                                    <Tag\n                                        variant={\"accent\"}\n                                        content={\"WCP \"}\n                                        className={\"ml-sm-extra\"}\n                                    />\n                                </div>\n                            }\n                        />\n                    </DropdownMenu>\n                }\n            >\n                <Sidebar.Link\n                    pinnable\n                    text={\"Audit Logs\"}\n                    action={\n                        <Sidebar.Item.Action\n                            element={<MoreVertIcon />}\n                            onClick={() => console.log(\"More action clicked\")}\n                        />\n                    }\n                    to={\"#audit-logs\"}\n                    active={hash === \"#audit-logs\"}\n                    icon={<Sidebar.Item.Icon label=\"Audit Logs\" element={<AuditLogsIcon />} />}\n                />\n                <Sidebar.Link\n                    pinnable\n                    text={\"Form Builder\"}\n                    to={\"#form-builder\"}\n                    active={hash === \"#form-builder\"}\n                    icon={<Sidebar.Item.Icon label=\"Form Builder\" element={<FormBuilderIcon />} />}\n                />\n                <Sidebar.Item\n                    pinnable\n                    text={\"File Manager\"}\n                    onClick={() => {\n                        alert(\"File Manager clicked\");\n                    }}\n                    icon={<Sidebar.Item.Icon label=\"File Manager\" element={<FileManagerIcon />} />}\n                />\n                <Sidebar.Item\n                    text={\"Content\"}\n                    icon={<Sidebar.Item.Icon label=\"Headless CMS\" element={<CmsIcon />} />}\n                >\n                    <Sidebar.Item\n                        text={\"Vehicles\"}\n                        icon={<Sidebar.Item.Icon label=\"Headless CMS\" element={<VehiclesIcon />} />}\n                        action={<Sidebar.Item.Action element={<MoreVertIcon />} />}\n                    >\n                        <Sidebar.Link\n                            pinnable\n                            pinnedIcon={\n                                <Sidebar.Item.Icon label=\"File Manager\" element={<CarIcon />} />\n                            }\n                            text={\"Cars\"}\n                            to={\"#cms-cars\"}\n                            active={hash === \"#cms-cars\"}\n                        />\n                        <Sidebar.Link\n                            pinnable\n                            text={\"Planes\"}\n                            to={\"#cms-planes\"}\n                            active={hash === \"#cms-planes\"}\n                        />\n                    </Sidebar.Item>{\" \"}\n                    <Sidebar.Item\n                        text={\"Ungrouped\"}\n                        icon={<Sidebar.Item.Icon label=\"Headless CMS\" element={<GridIcon />} />}\n                        action={<Sidebar.Item.Action element={<MoreVertIcon />} />}\n                    >\n                        <Sidebar.Link\n                            text={\"Articles\"}\n                            to={\"#cms-articles\"}\n                            active={hash === \"#cms-articles\"}\n                        />\n                        <Sidebar.Link\n                            text={\"Settings\"}\n                            to={\"#cms-settings\"}\n                            active={hash === \"#cms-settings\"}\n                        />\n                    </Sidebar.Item>\n                </Sidebar.Item>\n                <Sidebar.Item\n                    text={\"Headless CMS\"}\n                    icon={<Sidebar.Item.Icon label=\"Headless CMS\" element={<CmsIcon />} />}\n                >\n                    <Sidebar.Group text={\"Content Models\"} />\n                    <Sidebar.Link\n                        pinnable\n                        text={\"Groups\"}\n                        to={\"#cms-groups\"}\n                        active={hash === \"#cms-groups\"}\n                    />\n                    <Sidebar.Link\n                        pinnable\n                        text={\"Models\"}\n                        to={\"#cms-models\"}\n                        active={hash === \"#cms-models\"}\n                    />\n                </Sidebar.Item>\n                <Sidebar.Item\n                    text={\"Page Builder\"}\n                    icon={<Sidebar.Item.Icon label=\"Page Builder\" element={<PageBuilderIcon />} />}\n                >\n                    <Sidebar.Group text={\"Blocks\"} />\n                    <Sidebar.Link\n                        text={\"Blocks\"}\n                        to={\"#pb-blocks\"}\n                        active={hash === \"#pb-blocks\"}\n                    />\n                    <Sidebar.Link\n                        text={\"Categories\"}\n                        to={\"#pb-blocks-categories\"}\n                        active={hash === \"#pb-blocks-categories\"}\n                    />\n\n                    <Sidebar.Group text={\"Pages\"} active={hash === `#pb-pages`} />\n                    <Sidebar.Link\n                        to={\"#pb-pages-categories\"}\n                        text={\"Categories\"}\n                        active={hash === `#pb-pages-categories`}\n                    />\n                    <Sidebar.Link\n                        to={\"#pb-pages-menus\"}\n                        text={\"Menus\"}\n                        active={hash === `#pb-pages-menus`}\n                    />\n                    <Sidebar.Link\n                        to={\"#pb-pages-pages\"}\n                        text={\"Pages\"}\n                        active={hash === `#pb-pages-pages`}\n                    />\n                    <Sidebar.Link\n                        to={\"#pb-pages-templates\"}\n                        text={\"Templates\"}\n                        disabled={true}\n                        active={hash === `#pb-pages-templates`}\n                    />\n                </Sidebar.Item>\n            </Sidebar>\n        </SidebarProvider>\n    );\n};\n"],"names":["meta","Sidebar","Story","Tooltip","MainMenu","AdminUiProvider","HashLink","SidebarComponent","hash","useHash","sidebarState","setSidebarState","React","SidebarProvider","DropdownMenu","InfoIcon","MoreVertIcon","ApiPlaygroundIcon","DocsIcon","GithubIcon","ChatIcon","Tag","console","AuditLogsIcon","FormBuilderIcon","alert","FileManagerIcon","CmsIcon","VehiclesIcon","CarIcon","GridIcon","PageBuilderIcon"],"mappings":"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"}

package/Sidebar/components/items/SidebarMenuItem.d.ts

@@ -1,6 +1,7 @@
 import React from "react";
 import { type SidebarMenuItemIconProps } from "./SidebarMenuItemIcon.js";
 import { type SidebarMenuItemActionProps } from "./SidebarMenuItemAction.js";
+import { type SidebarMenuItemBadgeProps } from "./SidebarMenuItemBadge.js";
 import { LinkProps } from "../../../index.js";
 export interface SidebarMenuItemBaseProps {
     text: React.ReactNode;
@@ -15,6 +16,7 @@ export interface SidebarMenuItemBaseProps {
     disabled?: boolean;
     pinnable?: boolean;
     pinnedIcon?: React.ReactNode;
+    badge?: React.ReactNode;
 }
 type SidebarMenuItemButtonProps = SidebarMenuItemBaseProps & {
     to?: never;
@@ -63,5 +65,6 @@ declare const SidebarMenuItem: ((props: SidebarMenuItemProps) => React.JSX.Eleme
         }>) => (props: unknown) => React.JSX.Element;
     };
     Action: ({ element, showOnHover, className, ...props }: SidebarMenuItemActionProps) => React.JSX.Element | null;
+    Badge: ({ text }: SidebarMenuItemBadgeProps) => React.JSX.Element;
 };
-export { SidebarMenuItem, type SidebarMenuItemProps, type SidebarMenuItemButtonProps, type SidebarMenuItemLinkProps, type SidebarMenuItemGroupProps, type SidebarMenuItemIconProps, type SidebarMenuItemActionProps };
+export { SidebarMenuItem, type SidebarMenuItemProps, type SidebarMenuItemButtonProps, type SidebarMenuItemLinkProps, type SidebarMenuItemGroupProps, type SidebarMenuItemIconProps, type SidebarMenuItemActionProps, type SidebarMenuItemBadgeProps };

package/Sidebar/components/items/SidebarMenuItem.js

@@ -2,6 +2,7 @@ import react from "react";
 import { makeDecoratable, withStaticProps } from "../../../utils.js";
 import { SidebarMenuItemIcon } from "./SidebarMenuItemIcon.js";
 import { SidebarMenuItemAction } from "./SidebarMenuItemAction.js";
+import { SidebarMenuItemBadge } from "./SidebarMenuItemBadge.js";
 import { SidebarMenuSubItem } from "./SidebarMenuSubItem.js";
 import { useSidebarMenu } from "./SidebarMenuProvider.js";
 import { SidebarMenuRootItem } from "./SidebarMenuRootItem.js";
@@ -13,7 +14,8 @@ const SidebarMenuItemBase = (props)=>{
 const DecoratableSidebarMenuItem = makeDecoratable("SidebarMenuItem", SidebarMenuItemBase);
 const SidebarMenuItem = withStaticProps(DecoratableSidebarMenuItem, {
     Icon: SidebarMenuItemIcon,
-    Action: SidebarMenuItemAction
+    Action: SidebarMenuItemAction,
+    Badge: SidebarMenuItemBadge
 });
 export { SidebarMenuItem };
 

package/Sidebar/components/items/SidebarMenuItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"Sidebar/components/items/SidebarMenuItem.js","sources":["../../../../src/Sidebar/components/items/SidebarMenuItem.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable, withStaticProps } from \"~/utils.js\";\nimport { SidebarMenuItemIcon, type SidebarMenuItemIconProps } from \"./SidebarMenuItemIcon.js\";\nimport { SidebarMenuItemAction, type SidebarMenuItemActionProps } from \"./SidebarMenuItemAction.js\";\nimport { SidebarMenuSubItem } from \"./SidebarMenuSubItem.js\";\nimport { useSidebarMenu } from \"./SidebarMenuProvider.js\";\nimport { SidebarMenuRootItem } from \"~/Sidebar/components/items/SidebarMenuRootItem.js\";\nimport { LinkProps } from \"~/index.js\";\n\nexport interface SidebarMenuItemBaseProps {\n    text: React.ReactNode;\n    className?: string;\n    collapsible?: boolean;\n    children?: React.ReactNode;\n    onClick?: React.MouseEventHandler;\n    icon?: React.ReactNode;\n    action?: React.ReactNode;\n    variant?: \"group-label\";\n    active?: boolean;\n    disabled?: boolean;\n    pinnable?: boolean;\n    pinnedIcon?: React.ReactNode;\n}\n\ntype SidebarMenuItemButtonProps = SidebarMenuItemBaseProps & {\n    to?: never;\n    route?: never;\n    params?: never;\n};\n\ntype SidebarMenuItemGroupProps = SidebarMenuItemButtonProps;\ntype SidebarMenuItemLinkProps = SidebarMenuItemBaseProps & LinkProps;\n\ntype SidebarMenuItemProps = SidebarMenuItemButtonProps | SidebarMenuItemLinkProps;\n\nconst SidebarMenuItemBase = (props: SidebarMenuItemProps) => {\n    const { currentLevel } = useSidebarMenu();\n\n    if (currentLevel === 0) {\n        return <SidebarMenuRootItem {...props} />;\n    }\n\n    return <SidebarMenuSubItem {...props} />;\n};\n\nconst DecoratableSidebarMenuItem = makeDecoratable(\"SidebarMenuItem\", SidebarMenuItemBase);\n\nconst SidebarMenuItem = withStaticProps(DecoratableSidebarMenuItem, {\n    Icon: SidebarMenuItemIcon,\n    Action: SidebarMenuItemAction\n});\n\nexport {\n    SidebarMenuItem,\n    type SidebarMenuItemProps,\n    type SidebarMenuItemButtonProps,\n    type SidebarMenuItemLinkProps,\n    type SidebarMenuItemGroupProps,\n    type SidebarMenuItemIconProps,\n    type SidebarMenuItemActionProps\n};\n"],"names":["SidebarMenuItemBase","props","currentLevel","useSidebarMenu","SidebarMenuRootItem","SidebarMenuSubItem","DecoratableSidebarMenuItem","makeDecoratable","SidebarMenuItem","withStaticProps","SidebarMenuItemIcon","SidebarMenuItemAction"],"mappings":";;;;;;;AAmCA,MAAMA,sBAAsB,CAACC;IACzB,MAAM,EAAEC,YAAY,EAAE,GAAGC;IAEzB,IAAID,AAAiB,MAAjBA,cACA,OAAO,WAAP,GAAO,oBAACE,qBAAwBH;IAGpC,OAAO,WAAP,GAAO,oBAACI,oBAAuBJ;AACnC;AAEA,MAAMK,6BAA6BC,gBAAgB,mBAAmBP;AAEtE,MAAMQ,kBAAkBC,gBAAgBH,4BAA4B;IAChE,MAAMI;IACN,QAAQC;AACZ"}
+{"version":3,"file":"Sidebar/components/items/SidebarMenuItem.js","sources":["../../../../src/Sidebar/components/items/SidebarMenuItem.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable, withStaticProps } from \"~/utils.js\";\nimport { SidebarMenuItemIcon, type SidebarMenuItemIconProps } from \"./SidebarMenuItemIcon.js\";\nimport { SidebarMenuItemAction, type SidebarMenuItemActionProps } from \"./SidebarMenuItemAction.js\";\nimport { SidebarMenuItemBadge, type SidebarMenuItemBadgeProps } from \"./SidebarMenuItemBadge.js\";\nimport { SidebarMenuSubItem } from \"./SidebarMenuSubItem.js\";\nimport { useSidebarMenu } from \"./SidebarMenuProvider.js\";\nimport { SidebarMenuRootItem } from \"~/Sidebar/components/items/SidebarMenuRootItem.js\";\nimport { LinkProps } from \"~/index.js\";\n\nexport interface SidebarMenuItemBaseProps {\n    text: React.ReactNode;\n    className?: string;\n    collapsible?: boolean;\n    children?: React.ReactNode;\n    onClick?: React.MouseEventHandler;\n    icon?: React.ReactNode;\n    action?: React.ReactNode;\n    variant?: \"group-label\";\n    active?: boolean;\n    disabled?: boolean;\n    pinnable?: boolean;\n    pinnedIcon?: React.ReactNode;\n    badge?: React.ReactNode;\n}\n\ntype SidebarMenuItemButtonProps = SidebarMenuItemBaseProps & {\n    to?: never;\n    route?: never;\n    params?: never;\n};\n\ntype SidebarMenuItemGroupProps = SidebarMenuItemButtonProps;\ntype SidebarMenuItemLinkProps = SidebarMenuItemBaseProps & LinkProps;\n\ntype SidebarMenuItemProps = SidebarMenuItemButtonProps | SidebarMenuItemLinkProps;\n\nconst SidebarMenuItemBase = (props: SidebarMenuItemProps) => {\n    const { currentLevel } = useSidebarMenu();\n\n    if (currentLevel === 0) {\n        return <SidebarMenuRootItem {...props} />;\n    }\n\n    return <SidebarMenuSubItem {...props} />;\n};\n\nconst DecoratableSidebarMenuItem = makeDecoratable(\"SidebarMenuItem\", SidebarMenuItemBase);\n\nconst SidebarMenuItem = withStaticProps(DecoratableSidebarMenuItem, {\n    Icon: SidebarMenuItemIcon,\n    Action: SidebarMenuItemAction,\n    Badge: SidebarMenuItemBadge\n});\n\nexport {\n    SidebarMenuItem,\n    type SidebarMenuItemProps,\n    type SidebarMenuItemButtonProps,\n    type SidebarMenuItemLinkProps,\n    type SidebarMenuItemGroupProps,\n    type SidebarMenuItemIconProps,\n    type SidebarMenuItemActionProps,\n    type SidebarMenuItemBadgeProps\n};\n"],"names":["SidebarMenuItemBase","props","currentLevel","useSidebarMenu","SidebarMenuRootItem","SidebarMenuSubItem","DecoratableSidebarMenuItem","makeDecoratable","SidebarMenuItem","withStaticProps","SidebarMenuItemIcon","SidebarMenuItemAction","SidebarMenuItemBadge"],"mappings":";;;;;;;;AAqCA,MAAMA,sBAAsB,CAACC;IACzB,MAAM,EAAEC,YAAY,EAAE,GAAGC;IAEzB,IAAID,AAAiB,MAAjBA,cACA,OAAO,WAAP,GAAO,oBAACE,qBAAwBH;IAGpC,OAAO,WAAP,GAAO,oBAACI,oBAAuBJ;AACnC;AAEA,MAAMK,6BAA6BC,gBAAgB,mBAAmBP;AAEtE,MAAMQ,kBAAkBC,gBAAgBH,4BAA4B;IAChE,MAAMI;IACN,QAAQC;IACR,OAAOC;AACX"}

package/Sidebar/components/items/SidebarMenuItemBadge.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+interface SidebarMenuItemBadgeProps {
+    text: React.ReactNode;
+}
+declare const SidebarMenuItemBadge: ({ text }: SidebarMenuItemBadgeProps) => React.JSX.Element;
+export { SidebarMenuItemBadge, type SidebarMenuItemBadgeProps };

package/Sidebar/components/items/SidebarMenuItemBadge.js

@@ -0,0 +1,7 @@
+import react from "react";
+const SidebarMenuItemBadge = ({ text })=>/*#__PURE__*/ react.createElement("span", {
+        className: "inline-flex items-center rounded-sm bg-primary/50 px-xs text-[10px] font-semibold text-neutral-light leading-none h-md shrink-0"
+    }, text);
+export { SidebarMenuItemBadge };
+
+//# sourceMappingURL=SidebarMenuItemBadge.js.map

package/Sidebar/components/items/SidebarMenuItemBadge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sidebar/components/items/SidebarMenuItemBadge.js","sources":["../../../../src/Sidebar/components/items/SidebarMenuItemBadge.tsx"],"sourcesContent":["import React from \"react\";\n\ninterface SidebarMenuItemBadgeProps {\n    text: React.ReactNode;\n}\n\nconst SidebarMenuItemBadge = ({ text }: SidebarMenuItemBadgeProps) => {\n    return (\n        <span\n            className={\n                \"inline-flex items-center rounded-sm bg-primary/50 px-xs text-[10px] font-semibold text-neutral-light leading-none h-md shrink-0\"\n            }\n        >\n            {text}\n        </span>\n    );\n};\n\nexport { SidebarMenuItemBadge, type SidebarMenuItemBadgeProps };\n"],"names":["SidebarMenuItemBadge","text"],"mappings":";AAMA,MAAMA,uBAAuB,CAAC,EAAEC,IAAI,EAA6B,GACtD,WAAP,GACI,oBAAC;QACG,WACI;OAGHA"}

package/Sidebar/components/items/SidebarMenuLink.d.ts

@@ -2,6 +2,7 @@ import React from "react";
 import { type SidebarMenuItemLinkProps } from "./SidebarMenuItem.js";
 import { type SidebarMenuItemIconProps } from "../../../Sidebar/components/items/SidebarMenuItemIcon.js";
 import { type SidebarMenuItemActionProps } from "../../../Sidebar/components/items/SidebarMenuItemAction.js";
+import { type SidebarMenuItemBadgeProps } from "../../../Sidebar/components/items/SidebarMenuItemBadge.js";
 declare const SidebarMenuLink: ((props: SidebarMenuItemLinkProps) => React.JSX.Element) & {
     original: (props: SidebarMenuItemLinkProps) => React.JSX.Element;
     originalName: string;
@@ -41,5 +42,6 @@ declare const SidebarMenuLink: ((props: SidebarMenuItemLinkProps) => React.JSX.E
         }>) => (props: unknown) => React.JSX.Element;
     };
     Action: ({ element, showOnHover, className, ...props }: SidebarMenuItemActionProps) => React.JSX.Element | null;
+    Badge: ({ text }: SidebarMenuItemBadgeProps) => React.JSX.Element;
 };
-export { SidebarMenuLink, type SidebarMenuItemLinkProps, type SidebarMenuItemIconProps, type SidebarMenuItemActionProps };
+export { SidebarMenuLink, type SidebarMenuItemLinkProps, type SidebarMenuItemIconProps, type SidebarMenuItemActionProps, type SidebarMenuItemBadgeProps };

package/Sidebar/components/items/SidebarMenuLink.js

@@ -3,11 +3,13 @@ import { SidebarMenuItem } from "./SidebarMenuItem.js";
 import { makeDecoratable, withStaticProps } from "../../../utils.js";
 import { SidebarMenuItemIcon } from "./SidebarMenuItemIcon.js";
 import { SidebarMenuItemAction } from "./SidebarMenuItemAction.js";
+import { SidebarMenuItemBadge } from "./SidebarMenuItemBadge.js";
 const SidebarMenuLinkBase = (props)=>/*#__PURE__*/ react.createElement(SidebarMenuItem, props);
 const DecoratableSidebarMenuLink = makeDecoratable("SidebarMenuLink", SidebarMenuLinkBase);
 const SidebarMenuLink = withStaticProps(DecoratableSidebarMenuLink, {
     Icon: SidebarMenuItemIcon,
-    Action: SidebarMenuItemAction
+    Action: SidebarMenuItemAction,
+    Badge: SidebarMenuItemBadge
 });
 export { SidebarMenuLink };
 

package/Sidebar/components/items/SidebarMenuLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"Sidebar/components/items/SidebarMenuLink.js","sources":["../../../../src/Sidebar/components/items/SidebarMenuLink.tsx"],"sourcesContent":["import React from \"react\";\nimport { SidebarMenuItem, type SidebarMenuItemLinkProps } from \"./SidebarMenuItem.js\";\nimport { makeDecoratable, withStaticProps } from \"~/utils.js\";\nimport {\n    SidebarMenuItemIcon,\n    type SidebarMenuItemIconProps\n} from \"~/Sidebar/components/items/SidebarMenuItemIcon.js\";\nimport {\n    SidebarMenuItemAction,\n    type SidebarMenuItemActionProps\n} from \"~/Sidebar/components/items/SidebarMenuItemAction.js\";\n\nconst SidebarMenuLinkBase = (props: SidebarMenuItemLinkProps) => {\n    return <SidebarMenuItem {...props} />;\n};\n\nconst DecoratableSidebarMenuLink = makeDecoratable(\"SidebarMenuLink\", SidebarMenuLinkBase);\n\nconst SidebarMenuLink = withStaticProps(DecoratableSidebarMenuLink, {\n    Icon: SidebarMenuItemIcon,\n    Action: SidebarMenuItemAction\n});\n\nexport {\n    SidebarMenuLink,\n    type SidebarMenuItemLinkProps,\n    type SidebarMenuItemIconProps,\n    type SidebarMenuItemActionProps\n};\n"],"names":["SidebarMenuLinkBase","props","SidebarMenuItem","DecoratableSidebarMenuLink","makeDecoratable","SidebarMenuLink","withStaticProps","SidebarMenuItemIcon","SidebarMenuItemAction"],"mappings":";;;;;AAYA,MAAMA,sBAAsB,CAACC,QAClB,WAAP,GAAO,oBAACC,iBAAoBD;AAGhC,MAAME,6BAA6BC,gBAAgB,mBAAmBJ;AAEtE,MAAMK,kBAAkBC,gBAAgBH,4BAA4B;IAChE,MAAMI;IACN,QAAQC;AACZ"}
+{"version":3,"file":"Sidebar/components/items/SidebarMenuLink.js","sources":["../../../../src/Sidebar/components/items/SidebarMenuLink.tsx"],"sourcesContent":["import React from \"react\";\nimport { SidebarMenuItem, type SidebarMenuItemLinkProps } from \"./SidebarMenuItem.js\";\nimport { makeDecoratable, withStaticProps } from \"~/utils.js\";\nimport {\n    SidebarMenuItemIcon,\n    type SidebarMenuItemIconProps\n} from \"~/Sidebar/components/items/SidebarMenuItemIcon.js\";\nimport {\n    SidebarMenuItemAction,\n    type SidebarMenuItemActionProps\n} from \"~/Sidebar/components/items/SidebarMenuItemAction.js\";\nimport {\n    SidebarMenuItemBadge,\n    type SidebarMenuItemBadgeProps\n} from \"~/Sidebar/components/items/SidebarMenuItemBadge.js\";\n\nconst SidebarMenuLinkBase = (props: SidebarMenuItemLinkProps) => {\n    return <SidebarMenuItem {...props} />;\n};\n\nconst DecoratableSidebarMenuLink = makeDecoratable(\"SidebarMenuLink\", SidebarMenuLinkBase);\n\nconst SidebarMenuLink = withStaticProps(DecoratableSidebarMenuLink, {\n    Icon: SidebarMenuItemIcon,\n    Action: SidebarMenuItemAction,\n    Badge: SidebarMenuItemBadge\n});\n\nexport {\n    SidebarMenuLink,\n    type SidebarMenuItemLinkProps,\n    type SidebarMenuItemIconProps,\n    type SidebarMenuItemActionProps,\n    type SidebarMenuItemBadgeProps\n};\n"],"names":["SidebarMenuLinkBase","props","SidebarMenuItem","DecoratableSidebarMenuLink","makeDecoratable","SidebarMenuLink","withStaticProps","SidebarMenuItemIcon","SidebarMenuItemAction","SidebarMenuItemBadge"],"mappings":";;;;;;AAgBA,MAAMA,sBAAsB,CAACC,QAClB,WAAP,GAAO,oBAACC,iBAAoBD;AAGhC,MAAME,6BAA6BC,gBAAgB,mBAAmBJ;AAEtE,MAAMK,kBAAkBC,gBAAgBH,4BAA4B;IAChE,MAAMI;IACN,QAAQC;IACR,OAAOC;AACX"}

package/Sidebar/components/items/SidebarMenuRootButton.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
 import type { SidebarMenuItemProps } from "./SidebarMenuRootItem.js";
 type SidebarMenuButtonBaseProps = Omit<SidebarMenuItemProps, "children">;
-declare const SidebarMenuRootButton: ({ className, onClick, variant, active, disabled, icon, pinnedIcon, action, text, to, ...linkProps }: SidebarMenuButtonBaseProps) => React.JSX.Element;
+declare const SidebarMenuRootButton: ({ className, onClick, variant, active, disabled, icon, pinnedIcon, action, text, badge, to, ...linkProps }: SidebarMenuButtonBaseProps) => React.JSX.Element;
 export { SidebarMenuRootButton };

package/Sidebar/components/items/SidebarMenuRootButton.js

@@ -1,6 +1,7 @@
 import react from "react";
 import { cn, cva } from "../../../utils.js";
 import { DivButton } from "./DivButton.js";
+import { SidebarMenuItemBadge } from "./SidebarMenuItemBadge.js";
 import { useAdminUi } from "../../../index.js";
 const variants = cva([
     "flex w-full items-center gap-sm rounded-md",
@@ -22,7 +23,7 @@ const variants = cva([
         }
     }
 });
-const SidebarMenuRootButton = ({ className, onClick, variant, active, disabled, icon, pinnedIcon, action, text, to, ...linkProps })=>{
+const SidebarMenuRootButton = ({ className, onClick, variant, active, disabled, icon, pinnedIcon, action, text, badge, to, ...linkProps })=>{
     const sharedProps = {
         "data-sidebar": "menu-button",
         "data-active": active,
@@ -37,11 +38,15 @@ const SidebarMenuRootButton = ({ className, onClick, variant, active, disabled,
         ...sharedProps,
         to: to,
         ...linkProps
-    }, icon, text) : /*#__PURE__*/ react.createElement(DivButton, {
+    }, icon, text, badge && ("string" == typeof badge ? /*#__PURE__*/ react.createElement(SidebarMenuItemBadge, {
+        text: badge
+    }) : badge)) : /*#__PURE__*/ react.createElement(DivButton, {
         ...sharedProps,
         disabled: disabled,
         tabIndex: "group-label" === variant ? -1 : void 0
-    }, icon, text);
+    }, icon, text, badge && ("string" == typeof badge ? /*#__PURE__*/ react.createElement(SidebarMenuItemBadge, {
+        text: badge
+    }) : badge));
     return /*#__PURE__*/ react.createElement("div", {
         className: cn("flex items-center w-full relative group/menu-root-button", className)
     }, content, action && /*#__PURE__*/ react.createElement("div", {

package/Sidebar/components/items/SidebarMenuRootButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"Sidebar/components/items/SidebarMenuRootButton.js","sources":["../../../../src/Sidebar/components/items/SidebarMenuRootButton.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn, cva } from \"~/utils.js\";\nimport type { SidebarMenuItemProps } from \"./SidebarMenuRootItem.js\";\nimport { DivButton } from \"./DivButton.js\";\nimport { useAdminUi } from \"~/index.js\";\n\nconst variants = cva(\n    [\n        \"flex w-full items-center gap-sm rounded-md\",\n        \"no-underline! text-neutral-primary cursor-pointer px-sm py-xs-plus text-left\",\n        \"text-md outline-none transition-[width,height,padding]\",\n        \"whitespace-nowrap overflow-hidden\",\n        \"hover:bg-neutral-dark/5\",\n        \"group-hover/menu-root-button:bg-neutral-dark/5\",\n        \"focus:bg-neutral-dark/5 focus:ring-none focus:ring-transparent\",\n        \"data-[active=true]:bg-neutral-dark/5 data-[active=true]:font-semibold data-[active=true]:pointer-events-none\",\n        \"group-data-[state=open]/menu-item-collapsible:font-semibold!\"\n    ],\n    {\n        variants: {\n            variant: {\n                \"group-label\":\n                    \"text-neutral-muted! uppercase hover:bg-transparent! group-hover/menu-root-button:bg-transparent! focus:bg-transparent! cursor-default!\"\n            },\n            disabled: {\n                true: \"pointer-events-none text-neutral-disabled!\"\n            }\n        }\n    }\n);\n\ntype SidebarMenuButtonBaseProps = Omit<SidebarMenuItemProps, \"children\">;\n\nconst SidebarMenuRootButton = ({\n    className,\n    onClick,\n    variant,\n    active,\n    disabled,\n    icon,\n\n    // oxlint-disable-next-line\n    pinnedIcon,\n\n    action,\n    text,\n    to,\n    ...linkProps\n}: SidebarMenuButtonBaseProps) => {\n    const sharedProps = {\n        \"data-sidebar\": \"menu-button\",\n        \"data-active\": active,\n        className: variants({ variant, disabled }),\n        onClick\n    };\n\n    const { linkComponent: LinkComponent } = useAdminUi();\n\n    const content = to ? (\n        <LinkComponent {...sharedProps} to={to} {...linkProps}>\n            {icon}\n            {text}\n        </LinkComponent>\n    ) : (\n        <DivButton\n            {...sharedProps}\n            disabled={disabled}\n            tabIndex={variant === \"group-label\" ? -1 : undefined}\n        >\n            {icon}\n            {text}\n        </DivButton>\n    );\n\n    return (\n        <div className={cn(\"flex items-center w-full relative group/menu-root-button\", className)}>\n            {content}\n            {action && (\n                <div className=\"absolute top-0 right-0 mr-sm h-full flex items-center\">\n                    {action}\n                </div>\n            )}\n        </div>\n    );\n};\n\nexport { SidebarMenuRootButton };\n"],"names":["variants","cva","SidebarMenuRootButton","className","onClick","variant","active","disabled","icon","pinnedIcon","action","text","to","linkProps","sharedProps","LinkComponent","useAdminUi","content","DivButton","undefined","cn"],"mappings":";;;;AAMA,MAAMA,WAAWC,IACb;IACI;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;CACH,EACD;IACI,UAAU;QACN,SAAS;YACL,eACI;QACR;QACA,UAAU;YACN,MAAM;QACV;IACJ;AACJ;AAKJ,MAAMC,wBAAwB,CAAC,EAC3BC,SAAS,EACTC,OAAO,EACPC,OAAO,EACPC,MAAM,EACNC,QAAQ,EACRC,IAAI,EAGJC,UAAU,EAEVC,MAAM,EACNC,IAAI,EACJC,EAAE,EACF,GAAGC,WACsB;IACzB,MAAMC,cAAc;QAChB,gBAAgB;QAChB,eAAeR;QACf,WAAWN,SAAS;YAAEK;YAASE;QAAS;QACxCH;IACJ;IAEA,MAAM,EAAE,eAAeW,aAAa,EAAE,GAAGC;IAEzC,MAAMC,UAAUL,KAAK,WAALA,GACZ,oBAACG,eAAAA;QAAe,GAAGD,WAAW;QAAE,IAAIF;QAAK,GAAGC,SAAS;OAChDL,MACAG,QAAAA,WAAAA,GAGL,oBAACO,WAASA;QACL,GAAGJ,WAAW;QACf,UAAUP;QACV,UAAUF,AAAY,kBAAZA,UAA4B,KAAKc;OAE1CX,MACAG;IAIT,OAAO,WAAP,GACI,oBAAC;QAAI,WAAWS,GAAG,4DAA4DjB;OAC1Ec,SACAP,UAAU,WAAVA,GACG,oBAAC;QAAI,WAAU;OACVA;AAKrB"}
+{"version":3,"file":"Sidebar/components/items/SidebarMenuRootButton.js","sources":["../../../../src/Sidebar/components/items/SidebarMenuRootButton.tsx"],"sourcesContent":["import React from \"react\";\nimport { cn, cva } from \"~/utils.js\";\nimport type { SidebarMenuItemProps } from \"./SidebarMenuRootItem.js\";\nimport { DivButton } from \"./DivButton.js\";\nimport { SidebarMenuItemBadge } from \"./SidebarMenuItemBadge.js\";\nimport { useAdminUi } from \"~/index.js\";\n\nconst variants = cva(\n    [\n        \"flex w-full items-center gap-sm rounded-md\",\n        \"no-underline! text-neutral-primary cursor-pointer px-sm py-xs-plus text-left\",\n        \"text-md outline-none transition-[width,height,padding]\",\n        \"whitespace-nowrap overflow-hidden\",\n        \"hover:bg-neutral-dark/5\",\n        \"group-hover/menu-root-button:bg-neutral-dark/5\",\n        \"focus:bg-neutral-dark/5 focus:ring-none focus:ring-transparent\",\n        \"data-[active=true]:bg-neutral-dark/5 data-[active=true]:font-semibold data-[active=true]:pointer-events-none\",\n        \"group-data-[state=open]/menu-item-collapsible:font-semibold!\"\n    ],\n    {\n        variants: {\n            variant: {\n                \"group-label\":\n                    \"text-neutral-muted! uppercase hover:bg-transparent! group-hover/menu-root-button:bg-transparent! focus:bg-transparent! cursor-default!\"\n            },\n            disabled: {\n                true: \"pointer-events-none text-neutral-disabled!\"\n            }\n        }\n    }\n);\n\ntype SidebarMenuButtonBaseProps = Omit<SidebarMenuItemProps, \"children\">;\n\nconst SidebarMenuRootButton = ({\n    className,\n    onClick,\n    variant,\n    active,\n    disabled,\n    icon,\n\n    // oxlint-disable-next-line\n    pinnedIcon,\n\n    action,\n    text,\n    badge,\n    to,\n    ...linkProps\n}: SidebarMenuButtonBaseProps) => {\n    const sharedProps = {\n        \"data-sidebar\": \"menu-button\",\n        \"data-active\": active,\n        className: variants({ variant, disabled }),\n        onClick\n    };\n\n    const { linkComponent: LinkComponent } = useAdminUi();\n\n    const content = to ? (\n        <LinkComponent {...sharedProps} to={to} {...linkProps}>\n            {icon}\n            {text}\n            {badge && (typeof badge === \"string\" ? <SidebarMenuItemBadge text={badge} /> : badge)}\n        </LinkComponent>\n    ) : (\n        <DivButton\n            {...sharedProps}\n            disabled={disabled}\n            tabIndex={variant === \"group-label\" ? -1 : undefined}\n        >\n            {icon}\n            {text}\n            {badge && (typeof badge === \"string\" ? <SidebarMenuItemBadge text={badge} /> : badge)}\n        </DivButton>\n    );\n\n    return (\n        <div className={cn(\"flex items-center w-full relative group/menu-root-button\", className)}>\n            {content}\n            {action && (\n                <div className=\"absolute top-0 right-0 mr-sm h-full flex items-center\">\n                    {action}\n                </div>\n            )}\n        </div>\n    );\n};\n\nexport { SidebarMenuRootButton };\n"],"names":["variants","cva","SidebarMenuRootButton","className","onClick","variant","active","disabled","icon","pinnedIcon","action","text","badge","to","linkProps","sharedProps","LinkComponent","useAdminUi","content","SidebarMenuItemBadge","DivButton","undefined","cn"],"mappings":";;;;;AAOA,MAAMA,WAAWC,IACb;IACI;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;CACH,EACD;IACI,UAAU;QACN,SAAS;YACL,eACI;QACR;QACA,UAAU;YACN,MAAM;QACV;IACJ;AACJ;AAKJ,MAAMC,wBAAwB,CAAC,EAC3BC,SAAS,EACTC,OAAO,EACPC,OAAO,EACPC,MAAM,EACNC,QAAQ,EACRC,IAAI,EAGJC,UAAU,EAEVC,MAAM,EACNC,IAAI,EACJC,KAAK,EACLC,EAAE,EACF,GAAGC,WACsB;IACzB,MAAMC,cAAc;QAChB,gBAAgB;QAChB,eAAeT;QACf,WAAWN,SAAS;YAAEK;YAASE;QAAS;QACxCH;IACJ;IAEA,MAAM,EAAE,eAAeY,aAAa,EAAE,GAAGC;IAEzC,MAAMC,UAAUL,KAAK,WAALA,GACZ,oBAACG,eAAAA;QAAe,GAAGD,WAAW;QAAE,IAAIF;QAAK,GAAGC,SAAS;OAChDN,MACAG,MACAC,SAAU,CAAiB,YAAjB,OAAOA,QAAqB,WAAX,GAAW,oBAACO,sBAAoBA;QAAC,MAAMP;SAAYA,KAAI,mBAGvF,oBAACQ,WAASA;QACL,GAAGL,WAAW;QACf,UAAUR;QACV,UAAUF,AAAY,kBAAZA,UAA4B,KAAKgB;OAE1Cb,MACAG,MACAC,SAAU,CAAiB,YAAjB,OAAOA,QAAqB,WAAX,GAAW,oBAACO,sBAAoBA;QAAC,MAAMP;SAAYA,KAAI;IAI3F,OAAO,WAAP,GACI,oBAAC;QAAI,WAAWU,GAAG,4DAA4DnB;OAC1Ee,SACAR,UAAU,WAAVA,GACG,oBAAC;QAAI,WAAU;OACVA;AAKrB"}

package/Sidebar/components/items/SidebarMenuSubButton.d.ts

@@ -2,5 +2,5 @@ import React from "react";
 import type { SidebarMenuItemProps } from "./SidebarMenuRootItem.js";
 import { DistributedOmit } from "type-fest";
 type SidebarMenuSubButtonProps = DistributedOmit<SidebarMenuItemProps, "children">;
-declare const SidebarMenuSubButton: ({ onClick, variant, active, disabled, icon, pinnedIcon, action, text, className, to, ...linkProps }: SidebarMenuSubButtonProps) => React.JSX.Element;
+declare const SidebarMenuSubButton: ({ onClick, variant, active, disabled, icon, pinnedIcon, action, text, badge, className, to, ...linkProps }: SidebarMenuSubButtonProps) => React.JSX.Element;
 export { SidebarMenuSubButton };

package/Sidebar/components/items/SidebarMenuSubButton.js

@@ -1,6 +1,7 @@
 import react from "react";
 import { cva } from "../../../utils.js";
 import { DivButton } from "./DivButton.js";
+import { SidebarMenuItemBadge } from "./SidebarMenuItemBadge.js";
 import { useAdminUi } from "../../../index.js";
 const variants = cva([
     "flex w-full cursor-pointer items-center gap-sm",
@@ -26,7 +27,7 @@ const variants = cva([
         }
     }
 });
-const SidebarMenuSubButton = ({ onClick, variant, active, disabled, icon, pinnedIcon, action, text, className, to, ...linkProps })=>{
+const SidebarMenuSubButton = ({ onClick, variant, active, disabled, icon, pinnedIcon, action, text, badge, className, to, ...linkProps })=>{
     const { linkComponent: LinkComponent } = useAdminUi();
     const sharedProps = {
         "data-sidebar": "menu-sub-button",
@@ -42,11 +43,15 @@ const SidebarMenuSubButton = ({ onClick, variant, active, disabled, icon, pinned
         ...sharedProps,
         to: to,
         ...linkProps
-    }, icon, text) : /*#__PURE__*/ react.createElement(DivButton, {
+    }, icon, text, badge && ("string" == typeof badge ? /*#__PURE__*/ react.createElement(SidebarMenuItemBadge, {
+        text: badge
+    }) : badge)) : /*#__PURE__*/ react.createElement(DivButton, {
         ...sharedProps,
         disabled: disabled,
         tabIndex: "group-label" === variant ? -1 : void 0
-    }, icon, text);
+    }, icon, text, badge && ("string" == typeof badge ? /*#__PURE__*/ react.createElement(SidebarMenuItemBadge, {
+        text: badge
+    }) : badge));
     return /*#__PURE__*/ react.createElement("div", {
         className: "flex items-center w-full relative group/menu-sub-button"
     }, content, action && /*#__PURE__*/ react.createElement("div", {

package/Sidebar/components/items/SidebarMenuSubButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"Sidebar/components/items/SidebarMenuSubButton.js","sources":["../../../../src/Sidebar/components/items/SidebarMenuSubButton.tsx"],"sourcesContent":["import React from \"react\";\nimport { cva } from \"~/utils.js\";\nimport type { SidebarMenuItemProps } from \"./SidebarMenuRootItem.js\";\nimport { DivButton } from \"./DivButton.js\";\nimport { DistributedOmit } from \"type-fest\";\nimport { useAdminUi } from \"~/index.js\";\n\nconst variants = cva(\n    [\n        \"flex w-full cursor-pointer items-center gap-sm\",\n        \"text-md text-neutral-primary no-underline!\",\n        \"rounded-md p-xs-plus pr-sm outline-none\",\n        \"whitespace-nowrap overflow-hidden\",\n        \"hover:bg-neutral-dark/5\",\n        \"group-hover/menu-sub-button:bg-neutral-dark/5\",\n        \"focus:bg-neutral-dark/5 focus:ring-none focus:ring-transparent\",\n        \"data-[active=true]:bg-neutral-dark/5 data-[active=true]:font-semibold data-[active=true]:pointer-events-none\",\n        \"group-data-[state=collapsed]:hidden\"\n    ],\n    {\n        variants: {\n            variant: {\n                \"group-label\": [\n                    \"uppercase font-semibold text-neutral-muted! text-sm\",\n                    \"pt-md pb-xs-plus pointer-events-none\",\n                    \"hover:bg-transparent! group-hover/menu-sub-button:bg-transparent! focus:bg-transparent! cursor-default!\"\n                ]\n            },\n            disabled: {\n                true: \"pointer-events-none text-neutral-disabled!\"\n            }\n        }\n    }\n);\n\ntype SidebarMenuSubButtonProps = DistributedOmit<SidebarMenuItemProps, \"children\">;\n\nconst SidebarMenuSubButton = ({\n    onClick,\n    variant,\n    active,\n    disabled,\n    icon,\n\n    // oxlint-disable-next-line\n    pinnedIcon,\n\n    action,\n    text,\n    className,\n    to,\n    ...linkProps\n}: SidebarMenuSubButtonProps) => {\n    const { linkComponent: LinkComponent } = useAdminUi();\n\n    const sharedProps = {\n        \"data-sidebar\": \"menu-sub-button\",\n        \"data-active\": active,\n        className: variants({ variant, disabled, className }),\n        onClick\n    };\n\n    const content = to ? (\n        <LinkComponent {...sharedProps} to={to} {...linkProps}>\n            {icon}\n            {text}\n        </LinkComponent>\n    ) : (\n        // We can't use the default button element here because the content of the button\n        // can also contain a button, which is not allowed in HTML.\n        <DivButton\n            {...sharedProps}\n            disabled={disabled}\n            tabIndex={variant === \"group-label\" ? -1 : undefined}\n        >\n            {icon}\n            {text}\n        </DivButton>\n    );\n\n    return (\n        <div className={\"flex items-center w-full relative group/menu-sub-button\"}>\n            {content}\n\n            {action && (\n                <div className=\"absolute top-0 right-0 mr-sm h-full flex items-center\">\n                    {action}\n                </div>\n            )}\n        </div>\n    );\n};\n\nexport { SidebarMenuSubButton };\n"],"names":["variants","cva","SidebarMenuSubButton","onClick","variant","active","disabled","icon","pinnedIcon","action","text","className","to","linkProps","LinkComponent","useAdminUi","sharedProps","content","DivButton","undefined"],"mappings":";;;;AAOA,MAAMA,WAAWC,IACb;IACI;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;CACH,EACD;IACI,UAAU;QACN,SAAS;YACL,eAAe;gBACX;gBACA;gBACA;aACH;QACL;QACA,UAAU;YACN,MAAM;QACV;IACJ;AACJ;AAKJ,MAAMC,uBAAuB,CAAC,EAC1BC,OAAO,EACPC,OAAO,EACPC,MAAM,EACNC,QAAQ,EACRC,IAAI,EAGJC,UAAU,EAEVC,MAAM,EACNC,IAAI,EACJC,SAAS,EACTC,EAAE,EACF,GAAGC,WACqB;IACxB,MAAM,EAAE,eAAeC,aAAa,EAAE,GAAGC;IAEzC,MAAMC,cAAc;QAChB,gBAAgB;QAChB,eAAeX;QACf,WAAWL,SAAS;YAAEI;YAASE;YAAUK;QAAU;QACnDR;IACJ;IAEA,MAAMc,UAAUL,KAAK,WAALA,GACZ,oBAACE,eAAAA;QAAe,GAAGE,WAAW;QAAE,IAAIJ;QAAK,GAAGC,SAAS;OAChDN,MACAG,Q,cAKL,oBAACQ,WAASA;QACL,GAAGF,WAAW;QACf,UAAUV;QACV,UAAUF,AAAY,kBAAZA,UAA4B,KAAKe;OAE1CZ,MACAG;IAIT,OAAO,WAAP,GACI,oBAAC;QAAI,WAAW;OACXO,SAEAR,UAAU,WAAVA,GACG,oBAAC;QAAI,WAAU;OACVA;AAKrB"}
+{"version":3,"file":"Sidebar/components/items/SidebarMenuSubButton.js","sources":["../../../../src/Sidebar/components/items/SidebarMenuSubButton.tsx"],"sourcesContent":["import React from \"react\";\nimport { cva } from \"~/utils.js\";\nimport type { SidebarMenuItemProps } from \"./SidebarMenuRootItem.js\";\nimport { DivButton } from \"./DivButton.js\";\nimport { SidebarMenuItemBadge } from \"./SidebarMenuItemBadge.js\";\nimport { DistributedOmit } from \"type-fest\";\nimport { useAdminUi } from \"~/index.js\";\n\nconst variants = cva(\n    [\n        \"flex w-full cursor-pointer items-center gap-sm\",\n        \"text-md text-neutral-primary no-underline!\",\n        \"rounded-md p-xs-plus pr-sm outline-none\",\n        \"whitespace-nowrap overflow-hidden\",\n        \"hover:bg-neutral-dark/5\",\n        \"group-hover/menu-sub-button:bg-neutral-dark/5\",\n        \"focus:bg-neutral-dark/5 focus:ring-none focus:ring-transparent\",\n        \"data-[active=true]:bg-neutral-dark/5 data-[active=true]:font-semibold data-[active=true]:pointer-events-none\",\n        \"group-data-[state=collapsed]:hidden\"\n    ],\n    {\n        variants: {\n            variant: {\n                \"group-label\": [\n                    \"uppercase font-semibold text-neutral-muted! text-sm\",\n                    \"pt-md pb-xs-plus pointer-events-none\",\n                    \"hover:bg-transparent! group-hover/menu-sub-button:bg-transparent! focus:bg-transparent! cursor-default!\"\n                ]\n            },\n            disabled: {\n                true: \"pointer-events-none text-neutral-disabled!\"\n            }\n        }\n    }\n);\n\ntype SidebarMenuSubButtonProps = DistributedOmit<SidebarMenuItemProps, \"children\">;\n\nconst SidebarMenuSubButton = ({\n    onClick,\n    variant,\n    active,\n    disabled,\n    icon,\n\n    // oxlint-disable-next-line\n    pinnedIcon,\n\n    action,\n    text,\n    badge,\n    className,\n    to,\n    ...linkProps\n}: SidebarMenuSubButtonProps) => {\n    const { linkComponent: LinkComponent } = useAdminUi();\n\n    const sharedProps = {\n        \"data-sidebar\": \"menu-sub-button\",\n        \"data-active\": active,\n        className: variants({ variant, disabled, className }),\n        onClick\n    };\n\n    const content = to ? (\n        <LinkComponent {...sharedProps} to={to} {...linkProps}>\n            {icon}\n            {text}\n            {badge && (typeof badge === \"string\" ? <SidebarMenuItemBadge text={badge} /> : badge)}\n        </LinkComponent>\n    ) : (\n        // We can't use the default button element here because the content of the button\n        // can also contain a button, which is not allowed in HTML.\n        <DivButton\n            {...sharedProps}\n            disabled={disabled}\n            tabIndex={variant === \"group-label\" ? -1 : undefined}\n        >\n            {icon}\n            {text}\n            {badge && (typeof badge === \"string\" ? <SidebarMenuItemBadge text={badge} /> : badge)}\n        </DivButton>\n    );\n\n    return (\n        <div className={\"flex items-center w-full relative group/menu-sub-button\"}>\n            {content}\n\n            {action && (\n                <div className=\"absolute top-0 right-0 mr-sm h-full flex items-center\">\n                    {action}\n                </div>\n            )}\n        </div>\n    );\n};\n\nexport { SidebarMenuSubButton };\n"],"names":["variants","cva","SidebarMenuSubButton","onClick","variant","active","disabled","icon","pinnedIcon","action","text","badge","className","to","linkProps","LinkComponent","useAdminUi","sharedProps","content","SidebarMenuItemBadge","DivButton","undefined"],"mappings":";;;;;AAQA,MAAMA,WAAWC,IACb;IACI;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;CACH,EACD;IACI,UAAU;QACN,SAAS;YACL,eAAe;gBACX;gBACA;gBACA;aACH;QACL;QACA,UAAU;YACN,MAAM;QACV;IACJ;AACJ;AAKJ,MAAMC,uBAAuB,CAAC,EAC1BC,OAAO,EACPC,OAAO,EACPC,MAAM,EACNC,QAAQ,EACRC,IAAI,EAGJC,UAAU,EAEVC,MAAM,EACNC,IAAI,EACJC,KAAK,EACLC,SAAS,EACTC,EAAE,EACF,GAAGC,WACqB;IACxB,MAAM,EAAE,eAAeC,aAAa,EAAE,GAAGC;IAEzC,MAAMC,cAAc;QAChB,gBAAgB;QAChB,eAAeZ;QACf,WAAWL,SAAS;YAAEI;YAASE;YAAUM;QAAU;QACnDT;IACJ;IAEA,MAAMe,UAAUL,KAAK,WAALA,GACZ,oBAACE,eAAAA;QAAe,GAAGE,WAAW;QAAE,IAAIJ;QAAK,GAAGC,SAAS;OAChDP,MACAG,MACAC,SAAU,CAAiB,YAAjB,OAAOA,QAAqB,WAAX,GAAW,oBAACQ,sBAAoBA;QAAC,MAAMR;SAAYA,KAAI,K,cAKvF,oBAACS,WAASA;QACL,GAAGH,WAAW;QACf,UAAUX;QACV,UAAUF,AAAY,kBAAZA,UAA4B,KAAKiB;OAE1Cd,MACAG,MACAC,SAAU,CAAiB,YAAjB,OAAOA,QAAqB,WAAX,GAAW,oBAACQ,sBAAoBA;QAAC,MAAMR;SAAYA,KAAI;IAI3F,OAAO,WAAP,GACI,oBAAC;QAAI,WAAW;OACXO,SAEAT,UAAU,WAAVA,GACG,oBAAC;QAAI,WAAU;OACVA;AAKrB"}

package/Sidebar/components/items/SidebarMenuSubItemIndentation.js

@@ -24,7 +24,8 @@ const SidebarMenuSubItemIndentation = ({ lvl, variant })=>/*#__PURE__*/ react.cr
             margin: "none",
             variant: "strong",
             className: separatorVariants({
-                variant
+                variant,
+                className: "!h-full"
             })
         }))));
 export { SidebarMenuSubItemIndentation };

package/Sidebar/components/items/SidebarMenuSubItemIndentation.js.map

@@ -1 +1 @@
-{"version":3,"file":"Sidebar/components/items/SidebarMenuSubItemIndentation.js","sources":["../../../../src/Sidebar/components/items/SidebarMenuSubItemIndentation.tsx"],"sourcesContent":["import React from \"react\";\nimport { Separator } from \"~/Separator/index.js\";\n\nimport { cva, type VariantProps } from \"~/utils.js\";\n\nconst separatorVariants = cva([\"h-xl ml-px\"], {\n    variants: {\n        variant: {\n            \"group-label\": \"h-[38px]!\"\n        }\n    }\n});\n\nexport interface SidebarMenuSubItemIndentationProps\n    extends\n        Omit<React.HTMLAttributes<HTMLLIElement>, \"content\">,\n        VariantProps<typeof separatorVariants> {\n    lvl: number;\n}\n\nconst SidebarMenuSubItemIndentation = ({ lvl, variant }: SidebarMenuSubItemIndentationProps) => {\n    return (\n        <div data-sidebar=\"indentation\" className={\"gap-x-xs flex mr-sm\"}>\n            {Array.from({ length: lvl }, (_, index) => (\n                <div data-sidebar={\"indentation-element\"} className={\"ml-md\"} key={lvl + index}>\n                    <Separator\n                        orientation={\"vertical\"}\n                        margin={\"none\"}\n                        variant={\"strong\"}\n                        className={separatorVariants({ variant })}\n                    />\n                </div>\n            ))}\n        </div>\n    );\n};\n\nexport { SidebarMenuSubItemIndentation };\n"],"names":["separatorVariants","cva","SidebarMenuSubItemIndentation","lvl","variant","Array","_","index","Separator"],"mappings":";;;AAKA,MAAMA,oBAAoBC,IAAI;IAAC;CAAa,EAAE;IAC1C,UAAU;QACN,SAAS;YACL,eAAe;QACnB;IACJ;AACJ;AASA,MAAMC,gCAAgC,CAAC,EAAEC,GAAG,EAAEC,OAAO,EAAsC,GAChF,WAAP,GACI,oBAAC;QAAI,gBAAa;QAAc,WAAW;OACtCC,MAAM,IAAI,CAAC;QAAE,QAAQF;IAAI,GAAG,CAACG,GAAGC,QAAAA,WAAAA,GAC7B,oBAAC;YAAI,gBAAc;YAAuB,WAAW;YAAS,KAAKJ,MAAMI;yBACrE,oBAACC,WAASA;YACN,aAAa;YACb,QAAQ;YACR,SAAS;YACT,WAAWR,kBAAkB;gBAAEI;YAAQ"}
+{"version":3,"file":"Sidebar/components/items/SidebarMenuSubItemIndentation.js","sources":["../../../../src/Sidebar/components/items/SidebarMenuSubItemIndentation.tsx"],"sourcesContent":["import React from \"react\";\nimport { Separator } from \"~/Separator/index.js\";\n\nimport { cva, type VariantProps } from \"~/utils.js\";\n\nconst separatorVariants = cva([\"h-xl ml-px\"], {\n    variants: {\n        variant: {\n            \"group-label\": \"h-[38px]!\"\n        }\n    }\n});\n\nexport interface SidebarMenuSubItemIndentationProps\n    extends\n        Omit<React.HTMLAttributes<HTMLLIElement>, \"content\">,\n        VariantProps<typeof separatorVariants> {\n    lvl: number;\n}\n\nconst SidebarMenuSubItemIndentation = ({ lvl, variant }: SidebarMenuSubItemIndentationProps) => {\n    return (\n        <div data-sidebar=\"indentation\" className={\"gap-x-xs flex mr-sm\"}>\n            {Array.from({ length: lvl }, (_, index) => (\n                <div data-sidebar={\"indentation-element\"} className={\"ml-md\"} key={lvl + index}>\n                    <Separator\n                        orientation={\"vertical\"}\n                        margin={\"none\"}\n                        variant={\"strong\"}\n                        className={separatorVariants({ variant, className: \"!h-full\" })}\n                    />\n                </div>\n            ))}\n        </div>\n    );\n};\n\nexport { SidebarMenuSubItemIndentation };\n"],"names":["separatorVariants","cva","SidebarMenuSubItemIndentation","lvl","variant","Array","_","index","Separator"],"mappings":";;;AAKA,MAAMA,oBAAoBC,IAAI;IAAC;CAAa,EAAE;IAC1C,UAAU;QACN,SAAS;YACL,eAAe;QACnB;IACJ;AACJ;AASA,MAAMC,gCAAgC,CAAC,EAAEC,GAAG,EAAEC,OAAO,EAAsC,GAChF,WAAP,GACI,oBAAC;QAAI,gBAAa;QAAc,WAAW;OACtCC,MAAM,IAAI,CAAC;QAAE,QAAQF;IAAI,GAAG,CAACG,GAAGC,QAAAA,WAAAA,GAC7B,oBAAC;YAAI,gBAAc;YAAuB,WAAW;YAAS,KAAKJ,MAAMI;yBACrE,oBAACC,WAASA;YACN,aAAa;YACb,QAAQ;YACR,SAAS;YACT,WAAWR,kBAAkB;gBAAEI;gBAAS,WAAW;YAAU"}

package/Skeleton/Skeleton.stories.d.ts

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from "@storybook/react-webpack5";
+import type { Meta, StoryObj } from "@storybook/react";
 import { Skeleton } from "./Skeleton.js";
 declare const meta: Meta<typeof Skeleton>;
 export default meta;

package/Skeleton/Skeleton.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton/Skeleton.stories.js","sources":["../../src/Skeleton/Skeleton.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { Skeleton } from \"./Skeleton.js\";\n\nconst meta: Meta<typeof Skeleton> = {\n    title: \"Components/Skeleton\",\n    component: Skeleton,\n    parameters: {\n        layout: \"padded\"\n    },\n    argTypes: {\n        type: {\n            control: \"select\",\n            options: [\"text\", \"thumbnail\", \"area\"]\n        },\n        size: {\n            control: \"select\",\n            options: [\"xs\", \"sm\", \"md\", \"lg\", \"xl\", \"xxl\", \"3xl\"]\n        }\n    }\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof Skeleton>;\n\nexport const Default: Story = {};\n\nexport const Text: Story = {\n    args: {\n        type: \"text\"\n    }\n};\n\nexport const Thumbnail: Story = {\n    args: {\n        type: \"thumbnail\"\n    }\n};\n\nexport const Area: Story = {\n    args: {\n        type: \"area\",\n        className: \"w-1/2 h-32\"\n    }\n};\n\nexport const MultipleAreas: Story = {\n    render: () => (\n        <div className=\"flex gap-md\">\n            <div className=\"flex flex-col gap-md\">\n                <Skeleton type=\"area\" className={\"w-32 h-32\"} />\n                <Skeleton type=\"area\" className={\"w-32 h-32\"} />\n            </div>\n            <div>\n                <Skeleton type=\"area\" className=\"w-32 h-full\" />\n            </div>\n        </div>\n    )\n};\n\nexport const ExtraSmall: Story = {\n    args: {\n        size: \"xs\"\n    }\n};\n\nexport const Small: Story = {\n    args: {\n        size: \"sm\"\n    }\n};\n\nexport const Medium: Story = {\n    args: {\n        size: \"md\"\n    }\n};\n\nexport const Large: Story = {\n    args: {\n        size: \"lg\"\n    }\n};\n\nexport const ExtraLarge: Story = {\n    args: {\n        size: \"xl\"\n    }\n};\n\nexport const DoubleExtraLarge: Story = {\n    args: {\n        size: \"xxl\"\n    }\n};\n\nexport const TripleExtraLarge: Story = {\n    args: {\n        size: \"3xl\"\n    }\n};\n\nexport const Documentation: Story = {\n    args: {\n        type: \"area\",\n        size: \"lg\"\n    },\n    argTypes: {\n        type: {\n            control: \"select\",\n            description: \"The type of skeleton to display\",\n            options: [\"text\", \"thumbnail\", \"area\"]\n        },\n        size: {\n            control: \"select\",\n            description: \"The size of the skeleton\",\n            options: [\"xs\", \"sm\", \"md\", \"lg\", \"xl\", \"xxl\", \"3xl\"]\n        }\n    }\n};\n"],"names":["meta","Skeleton","Default","Text","Thumbnail","Area","MultipleAreas","ExtraSmall","Small","Medium","Large","ExtraLarge","DoubleExtraLarge","TripleExtraLarge","Documentation"],"mappings":";;AAIA,MAAMA,OAA8B;IAChC,OAAO;IACP,WAAWC;IACX,YAAY;QACR,QAAQ;IACZ;IACA,UAAU;QACN,MAAM;YACF,SAAS;YACT,SAAS;gBAAC;gBAAQ;gBAAa;aAAO;QAC1C;QACA,MAAM;YACF,SAAS;YACT,SAAS;gBAAC;gBAAM;gBAAM;gBAAM;gBAAM;gBAAM;gBAAO;aAAM;QACzD;IACJ;AACJ;AAEA,yBAAeD;AAIR,MAAME,UAAiB,CAAC;AAExB,MAAMC,OAAc;IACvB,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,YAAmB;IAC5B,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,OAAc;IACvB,MAAM;QACF,MAAM;QACN,WAAW;IACf;AACJ;AAEO,MAAMC,gBAAuB;IAChC,QAAQ,kBACJ,oBAAC;YAAI,WAAU;yBACX,oBAAC;YAAI,WAAU;yBACX,oBAACL,UAAQA;YAAC,MAAK;YAAO,WAAW;0BACjC,oBAACA,UAAQA;YAAC,MAAK;YAAO,WAAW;2BAErC,oBAAC,2BACG,oBAACA,UAAQA;YAAC,MAAK;YAAO,WAAU;;AAIhD;AAEO,MAAMM,aAAoB;IAC7B,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,QAAe;IACxB,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,SAAgB;IACzB,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,QAAe;IACxB,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,aAAoB;IAC7B,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,mBAA0B;IACnC,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,mBAA0B;IACnC,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,gBAAuB;IAChC,MAAM;QACF,MAAM;QACN,MAAM;IACV;IACA,UAAU;QACN,MAAM;YACF,SAAS;YACT,aAAa;YACb,SAAS;gBAAC;gBAAQ;gBAAa;aAAO;QAC1C;QACA,MAAM;YACF,SAAS;YACT,aAAa;YACb,SAAS;gBAAC;gBAAM;gBAAM;gBAAM;gBAAM;gBAAM;gBAAO;aAAM;QACzD;IACJ;AACJ"}
+{"version":3,"file":"Skeleton/Skeleton.stories.js","sources":["../../src/Skeleton/Skeleton.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { Skeleton } from \"./Skeleton.js\";\n\nconst meta: Meta<typeof Skeleton> = {\n    title: \"Components/Skeleton\",\n    component: Skeleton,\n    parameters: {\n        layout: \"padded\"\n    },\n    argTypes: {\n        type: {\n            control: \"select\",\n            options: [\"text\", \"thumbnail\", \"area\"]\n        },\n        size: {\n            control: \"select\",\n            options: [\"xs\", \"sm\", \"md\", \"lg\", \"xl\", \"xxl\", \"3xl\"]\n        }\n    }\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof Skeleton>;\n\nexport const Default: Story = {};\n\nexport const Text: Story = {\n    args: {\n        type: \"text\"\n    }\n};\n\nexport const Thumbnail: Story = {\n    args: {\n        type: \"thumbnail\"\n    }\n};\n\nexport const Area: Story = {\n    args: {\n        type: \"area\",\n        className: \"w-1/2 h-32\"\n    }\n};\n\nexport const MultipleAreas: Story = {\n    render: () => (\n        <div className=\"flex gap-md\">\n            <div className=\"flex flex-col gap-md\">\n                <Skeleton type=\"area\" className={\"w-32 h-32\"} />\n                <Skeleton type=\"area\" className={\"w-32 h-32\"} />\n            </div>\n            <div>\n                <Skeleton type=\"area\" className=\"w-32 h-full\" />\n            </div>\n        </div>\n    )\n};\n\nexport const ExtraSmall: Story = {\n    args: {\n        size: \"xs\"\n    }\n};\n\nexport const Small: Story = {\n    args: {\n        size: \"sm\"\n    }\n};\n\nexport const Medium: Story = {\n    args: {\n        size: \"md\"\n    }\n};\n\nexport const Large: Story = {\n    args: {\n        size: \"lg\"\n    }\n};\n\nexport const ExtraLarge: Story = {\n    args: {\n        size: \"xl\"\n    }\n};\n\nexport const DoubleExtraLarge: Story = {\n    args: {\n        size: \"xxl\"\n    }\n};\n\nexport const TripleExtraLarge: Story = {\n    args: {\n        size: \"3xl\"\n    }\n};\n\nexport const Documentation: Story = {\n    args: {\n        type: \"area\",\n        size: \"lg\"\n    },\n    argTypes: {\n        type: {\n            control: \"select\",\n            description: \"The type of skeleton to display\",\n            options: [\"text\", \"thumbnail\", \"area\"]\n        },\n        size: {\n            control: \"select\",\n            description: \"The size of the skeleton\",\n            options: [\"xs\", \"sm\", \"md\", \"lg\", \"xl\", \"xxl\", \"3xl\"]\n        }\n    }\n};\n"],"names":["meta","Skeleton","Default","Text","Thumbnail","Area","MultipleAreas","ExtraSmall","Small","Medium","Large","ExtraLarge","DoubleExtraLarge","TripleExtraLarge","Documentation"],"mappings":";;AAIA,MAAMA,OAA8B;IAChC,OAAO;IACP,WAAWC;IACX,YAAY;QACR,QAAQ;IACZ;IACA,UAAU;QACN,MAAM;YACF,SAAS;YACT,SAAS;gBAAC;gBAAQ;gBAAa;aAAO;QAC1C;QACA,MAAM;YACF,SAAS;YACT,SAAS;gBAAC;gBAAM;gBAAM;gBAAM;gBAAM;gBAAM;gBAAO;aAAM;QACzD;IACJ;AACJ;AAEA,yBAAeD;AAIR,MAAME,UAAiB,CAAC;AAExB,MAAMC,OAAc;IACvB,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,YAAmB;IAC5B,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,OAAc;IACvB,MAAM;QACF,MAAM;QACN,WAAW;IACf;AACJ;AAEO,MAAMC,gBAAuB;IAChC,QAAQ,kBACJ,oBAAC;YAAI,WAAU;yBACX,oBAAC;YAAI,WAAU;yBACX,oBAACL,UAAQA;YAAC,MAAK;YAAO,WAAW;0BACjC,oBAACA,UAAQA;YAAC,MAAK;YAAO,WAAW;2BAErC,oBAAC,2BACG,oBAACA,UAAQA;YAAC,MAAK;YAAO,WAAU;;AAIhD;AAEO,MAAMM,aAAoB;IAC7B,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,QAAe;IACxB,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,SAAgB;IACzB,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,QAAe;IACxB,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,aAAoB;IAC7B,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,mBAA0B;IACnC,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,mBAA0B;IACnC,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,gBAAuB;IAChC,MAAM;QACF,MAAM;QACN,MAAM;IACV;IACA,UAAU;QACN,MAAM;YACF,SAAS;YACT,aAAa;YACb,SAAS;gBAAC;gBAAQ;gBAAa;aAAO;QAC1C;QACA,MAAM;YACF,SAAS;YACT,aAAa;YACb,SAAS;gBAAC;gBAAM;gBAAM;gBAAM;gBAAM;gBAAM;gBAAO;aAAM;QACzD;IACJ;AACJ"}

package/Slider/Slider.stories.d.ts

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from "@storybook/react-webpack5";
+import type { Meta, StoryObj } from "@storybook/react";
 import { Slider } from "./Slider.js";
 declare const meta: Meta<typeof Slider>;
 export default meta;

package/Slider/Slider.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Slider/Slider.stories.js","sources":["../../src/Slider/Slider.stories.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { Slider } from \"./Slider.js\";\n\nconst meta: Meta<typeof Slider> = {\n    title: \"Components/Form/Slider\",\n    component: Slider,\n    argTypes: {\n        onValueChange: { action: \"onValueChange\" },\n        onValueCommit: { action: \"onValueCommit\" },\n        disabled: {\n            control: \"boolean\",\n            defaultValue: false\n        }\n    },\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => {\n        const [value, setValue] = useState(args.value);\n        return <Slider {...args} value={value} onValueChange={value => setValue(value)} />;\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Slider>;\n\nexport const Default: Story = {};\n\nexport const WithLabel: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\"\n    }\n};\n\nexport const WithLabelRequired: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        required: true\n    }\n};\n\nexport const WithDescription: Story = {\n    args: {\n        ...Default.args,\n        description: \"Provide the required information for processing your request.\"\n    }\n};\n\nexport const WithNotes: Story = {\n    args: {\n        ...Default.args,\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\"\n    }\n};\n\nexport const WithErrors: Story = {\n    args: {\n        ...Default.args,\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const Disabled: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        disabled: true\n    }\n};\n\nexport const FullExample: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        required: true,\n        description: \"Provide the required information for processing your request.\",\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\",\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const WithSideLabel: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        labelPosition: \"side\"\n    }\n};\n\nexport const WithSideLabelRequired: Story = {\n    args: {\n        ...WithSideLabel.args,\n        required: true\n    }\n};\n\nexport const WithSideLabelAndDescription: Story = {\n    args: {\n        ...WithSideLabel.args,\n        description: \"Provide the required information for processing your request.\"\n    }\n};\n\nexport const WithSideLabelAndNotes: Story = {\n    args: {\n        ...WithSideLabel.args,\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\"\n    }\n};\n\nexport const WithSideLabelAndErrors: Story = {\n    args: {\n        ...WithSideLabel.args,\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const WithSideLabelDisabled: Story = {\n    args: {\n        ...WithSideLabel.args,\n        label: \"Any field label\",\n        disabled: true\n    }\n};\n\nexport const WithSideLabelFullExample: Story = {\n    args: {\n        ...WithSideLabel.args,\n        label: \"Any field label\",\n        required: true,\n        description: \"Provide the required information for processing your request.\",\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\",\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const Documentation: Story = {\n    render: args => {\n        const [value, setValue] = useState(args.value || 50);\n        const [validation, setValidation] = useState({ isValid: true, message: \"\" });\n\n        // Update value when args.value changes\n        useEffect(() => {\n            setValue(args.value ?? 50);\n        }, [args.value]);\n\n        const handleChange = (newValue: number) => {\n            setValue(newValue);\n\n            if (args.required && newValue === 0) {\n                setValidation({ isValid: false, message: \"Please select a value\" });\n            } else {\n                setValidation({ isValid: true, message: \"\" });\n            }\n        };\n\n        // Validate on required change or value change\n        useEffect(() => {\n            if (args.required && value === 0) {\n                setValidation({ isValid: false, message: \"Please select a value\" });\n            } else {\n                setValidation({ isValid: true, message: \"\" });\n            }\n        }, [args.required, value]);\n\n        return (\n            <Slider\n                {...args}\n                value={value}\n                onValueChange={handleChange}\n                validation={validation}\n                required={args.required}\n                showTooltip={args.showTooltip}\n                transformValue={args.transformValue}\n            />\n        );\n    },\n    args: {\n        label: \"Volume Level\",\n        required: true,\n        disabled: false,\n        description: \"Adjust the volume level of your device\",\n        note: \"Note: Higher values may cause distortion on some devices\",\n        min: 0,\n        max: 100,\n        step: 1,\n        value: 50,\n        showTooltip: true,\n        transformValue: (value: number) => `${value}%`,\n        validation: undefined\n    },\n    argTypes: {\n        label: {\n            description: \"Label text for the slider\",\n            control: \"text\"\n        },\n        required: {\n            description: \"Makes the field required when set to true\",\n            control: \"boolean\"\n        },\n        disabled: {\n            description: \"Disables the slider when set to true\",\n            control: \"boolean\"\n        },\n        description: {\n            description: \"Additional description text below the field\",\n            control: \"text\"\n        },\n        note: {\n            description: \"Additional note text below the field\",\n            control: \"text\"\n        },\n        min: {\n            description: \"Minimum value for the slider\",\n            control: \"number\"\n        },\n        max: {\n            description: \"Maximum value for the slider\",\n            control: \"number\"\n        },\n        step: {\n            description: \"Step increment for the slider\",\n            control: \"number\"\n        },\n        value: {\n            description: \"Current value of the slider\",\n            control: \"number\"\n        },\n        showTooltip: {\n            description: \"Whether to show a tooltip with the current value\",\n            control: \"boolean\",\n            defaultValue: true\n        },\n        transformValue: {\n            description: \"Function to transform the numeric value to display text\"\n        },\n        labelPosition: {\n            description: \"Position of the label relative to the slider\",\n            control: \"radio\",\n            options: [\"top\", \"side\"]\n        },\n        validation: {\n            description:\n                \"Object containing validation state and message. Please refer to the example code for details on usage.\"\n        },\n        onValueChange: {\n            description: \"Function called when the slider value changes\"\n        },\n        onValueCommit: {\n            description: \"Function called when the slider value is committed (on release)\"\n        }\n    }\n};\n"],"names":["meta","Slider","args","value","setValue","useState","Default","WithLabel","WithLabelRequired","WithDescription","WithNotes","WithErrors","Disabled","FullExample","WithSideLabel","WithSideLabelRequired","WithSideLabelAndDescription","WithSideLabelAndNotes","WithSideLabelAndErrors","WithSideLabelDisabled","WithSideLabelFullExample","Documentation","validation","setValidation","useEffect","handleChange","newValue","undefined"],"mappings":"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ACb,gBAAgB,CAACC,QAAkB,GAAGA,MAAM,CAAC,CAAC;QAC9C,YAAYwB;IAChB;IACA,UAAU;QACN,OAAO;YACH,aAAa;YACb,SAAS;QACb;QACA,UAAU;YACN,aAAa;YACb,SAAS;QACb;QACA,UAAU;YACN,aAAa;YACb,SAAS;QACb;QACA,aAAa;YACT,aAAa;YACb,SAAS;QACb;QACA,MAAM;YACF,aAAa;YACb,SAAS;QACb;QACA,KAAK;YACD,aAAa;YACb,SAAS;QACb;QACA,KAAK;YACD,aAAa;YACb,SAAS;QACb;QACA,MAAM;YACF,aAAa;YACb,SAAS;QACb;QACA,OAAO;YACH,aAAa;YACb,SAAS;QACb;QACA,aAAa;YACT,aAAa;YACb,SAAS;YACT,cAAc;QAClB;QACA,gBAAgB;YACZ,aAAa;QACjB;QACA,eAAe;YACX,aAAa;YACb,SAAS;YACT,SAAS;gBAAC;gBAAO;aAAO;QAC5B;QACA,YAAY;YACR,aACI;QACR;QACA,eAAe;YACX,aAAa;QACjB;QACA,eAAe;YACX,aAAa;QACjB;IACJ;AACJ"}
+{"version":3,"file":"Slider/Slider.stories.js","sources":["../../src/Slider/Slider.stories.tsx"],"sourcesContent":["import React, { useState, useEffect } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { Slider } from \"./Slider.js\";\n\nconst meta: Meta<typeof Slider> = {\n    title: \"Components/Form/Slider\",\n    component: Slider,\n    argTypes: {\n        onValueChange: { action: \"onValueChange\" },\n        onValueCommit: { action: \"onValueCommit\" },\n        disabled: {\n            control: \"boolean\",\n            defaultValue: false\n        }\n    },\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => {\n        const [value, setValue] = useState(args.value);\n        return <Slider {...args} value={value} onValueChange={value => setValue(value)} />;\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Slider>;\n\nexport const Default: Story = {};\n\nexport const WithLabel: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\"\n    }\n};\n\nexport const WithLabelRequired: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        required: true\n    }\n};\n\nexport const WithDescription: Story = {\n    args: {\n        ...Default.args,\n        description: \"Provide the required information for processing your request.\"\n    }\n};\n\nexport const WithNotes: Story = {\n    args: {\n        ...Default.args,\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\"\n    }\n};\n\nexport const WithErrors: Story = {\n    args: {\n        ...Default.args,\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const Disabled: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        disabled: true\n    }\n};\n\nexport const FullExample: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        required: true,\n        description: \"Provide the required information for processing your request.\",\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\",\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const WithSideLabel: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        labelPosition: \"side\"\n    }\n};\n\nexport const WithSideLabelRequired: Story = {\n    args: {\n        ...WithSideLabel.args,\n        required: true\n    }\n};\n\nexport const WithSideLabelAndDescription: Story = {\n    args: {\n        ...WithSideLabel.args,\n        description: \"Provide the required information for processing your request.\"\n    }\n};\n\nexport const WithSideLabelAndNotes: Story = {\n    args: {\n        ...WithSideLabel.args,\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\"\n    }\n};\n\nexport const WithSideLabelAndErrors: Story = {\n    args: {\n        ...WithSideLabel.args,\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const WithSideLabelDisabled: Story = {\n    args: {\n        ...WithSideLabel.args,\n        label: \"Any field label\",\n        disabled: true\n    }\n};\n\nexport const WithSideLabelFullExample: Story = {\n    args: {\n        ...WithSideLabel.args,\n        label: \"Any field label\",\n        required: true,\n        description: \"Provide the required information for processing your request.\",\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\",\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const Documentation: Story = {\n    render: args => {\n        const [value, setValue] = useState(args.value || 50);\n        const [validation, setValidation] = useState({ isValid: true, message: \"\" });\n\n        // Update value when args.value changes\n        useEffect(() => {\n            setValue(args.value ?? 50);\n        }, [args.value]);\n\n        const handleChange = (newValue: number) => {\n            setValue(newValue);\n\n            if (args.required && newValue === 0) {\n                setValidation({ isValid: false, message: \"Please select a value\" });\n            } else {\n                setValidation({ isValid: true, message: \"\" });\n            }\n        };\n\n        // Validate on required change or value change\n        useEffect(() => {\n            if (args.required && value === 0) {\n                setValidation({ isValid: false, message: \"Please select a value\" });\n            } else {\n                setValidation({ isValid: true, message: \"\" });\n            }\n        }, [args.required, value]);\n\n        return (\n            <Slider\n                {...args}\n                value={value}\n                onValueChange={handleChange}\n                validation={validation}\n                required={args.required}\n                showTooltip={args.showTooltip}\n                transformValue={args.transformValue}\n            />\n        );\n    },\n    args: {\n        label: \"Volume Level\",\n        required: true,\n        disabled: false,\n        description: \"Adjust the volume level of your device\",\n        note: \"Note: Higher values may cause distortion on some devices\",\n        min: 0,\n        max: 100,\n        step: 1,\n        value: 50,\n        showTooltip: true,\n        transformValue: (value: number) => `${value}%`,\n        validation: undefined\n    },\n    argTypes: {\n        label: {\n            description: \"Label text for the slider\",\n            control: \"text\"\n        },\n        required: {\n            description: \"Makes the field required when set to true\",\n            control: \"boolean\"\n        },\n        disabled: {\n            description: \"Disables the slider when set to true\",\n            control: \"boolean\"\n        },\n        description: {\n            description: \"Additional description text below the field\",\n            control: \"text\"\n        },\n        note: {\n            description: \"Additional note text below the field\",\n            control: \"text\"\n        },\n        min: {\n            description: \"Minimum value for the slider\",\n            control: \"number\"\n        },\n        max: {\n            description: \"Maximum value for the slider\",\n            control: \"number\"\n        },\n        step: {\n            description: \"Step increment for the slider\",\n            control: \"number\"\n        },\n        value: {\n            description: \"Current value of the slider\",\n            control: \"number\"\n        },\n        showTooltip: {\n            description: \"Whether to show a tooltip with the current value\",\n            control: \"boolean\",\n            defaultValue: true\n        },\n        transformValue: {\n            description: \"Function to transform the numeric value to display text\"\n        },\n        labelPosition: {\n            description: \"Position of the label relative to the slider\",\n            control: \"radio\",\n            options: [\"top\", \"side\"]\n        },\n        validation: {\n            description:\n                \"Object containing validation state and message. Please refer to the example code for details on usage.\"\n        },\n        onValueChange: {\n            description: \"Function called when the slider value changes\"\n        },\n        onValueCommit: {\n            description: \"Function called when the slider value is committed (on release)\"\n        }\n    }\n};\n"],"names":["meta","Slider","args","value","setValue","useState","Default","WithLabel","WithLabelRequired","WithDescription","WithNotes","WithErrors","Disabled","FullExample","WithSideLabel","WithSideLabelRequired","WithSideLabelAndDescription","WithSideLabelAndNotes","WithSideLabelAndErrors","WithSideLabelDisabled","WithSideLabelFullExample","Documentation","validation","setValidation","useEffect","handleChange","newValue","undefined"],"mappings":";;AAIA,MAAMA,OAA4B;IAC9B,OAAO;IACP,WAAWC;IACX,UAAU;QACN,eAAe;YAAE,QAAQ;QAAgB;QACzC,eAAe;YAAE,QAAQ;QAAgB;QACzC,UAAU;YACN,SAAS;YACT,cAAc;QAClB;IACJ;IACA,YAAY;QACR,QAAQ;IACZ;IACA,QAAQC,CAAAA;QACJ,MAAM,CAACC,OAAOC,SAAS,GAAGC,SAASH,KAAK,KAAK;QAC7C,OAAO,WAAP,GAAO,oBAACD,QAAMA;YAAE,GAAGC,IAAI;YAAE,OAAOC;YAAO,eAAeA,CAAAA,QAASC,SAASD;;IAC5E;AACJ;AAEA,uBAAeH;AAGR,MAAMM,UAAiB,CAAC;AAExB,MAAMC,YAAmB;IAC5B,MAAM;QACF,GAAGD,QAAQ,IAAI;QACf,OAAO;IACX;AACJ;AAEO,MAAME,oBAA2B;IACpC,MAAM;QACF,GAAGF,QAAQ,IAAI;QACf,OAAO;QACP,UAAU;IACd;AACJ;AAEO,MAAMG,kBAAyB;IAClC,MAAM;QACF,GAAGH,QAAQ,IAAI;QACf,aAAa;IACjB;AACJ;AAEO,MAAMI,YAAmB;IAC5B,MAAM;QACF,GAAGJ,QAAQ,IAAI;QACf,MAAM;IACV;AACJ;AAEO,MAAMK,aAAoB;IAC7B,MAAM;QACF,GAAGL,QAAQ,IAAI;QACf,YAAY;YACR,SAAS;YACT,SAAS;QACb;IACJ;AACJ;AAEO,MAAMM,WAAkB;IAC3B,MAAM;QACF,GAAGN,QAAQ,IAAI;QACf,OAAO;QACP,UAAU;IACd;AACJ;AAEO,MAAMO,cAAqB;IAC9B,MAAM;QACF,GAAGP,QAAQ,IAAI;QACf,OAAO;QACP,UAAU;QACV,aAAa;QACb,MAAM;QACN,YAAY;YACR,SAAS;YACT,SAAS;QACb;IACJ;AACJ;AAEO,MAAMQ,gBAAuB;IAChC,MAAM;QACF,GAAGR,QAAQ,IAAI;QACf,OAAO;QACP,eAAe;IACnB;AACJ;AAEO,MAAMS,wBAA+B;IACxC,MAAM;QACF,GAAGD,cAAc,IAAI;QACrB,UAAU;IACd;AACJ;AAEO,MAAME,8BAAqC;IAC9C,MAAM;QACF,GAAGF,cAAc,IAAI;QACrB,aAAa;IACjB;AACJ;AAEO,MAAMG,wBAA+B;IACxC,MAAM;QACF,GAAGH,cAAc,IAAI;QACrB,MAAM;IACV;AACJ;AAEO,MAAMI,yBAAgC;IACzC,MAAM;QACF,GAAGJ,cAAc,IAAI;QACrB,YAAY;YACR,SAAS;YACT,SAAS;QACb;IACJ;AACJ;AAEO,MAAMK,wBAA+B;IACxC,MAAM;QACF,GAAGL,cAAc,IAAI;QACrB,OAAO;QACP,UAAU;IACd;AACJ;AAEO,MAAMM,2BAAkC;IAC3C,MAAM;QACF,GAAGN,cAAc,IAAI;QACrB,OAAO;QACP,UAAU;QACV,aAAa;QACb,MAAM;QACN,YAAY;YACR,SAAS;YACT,SAAS;QACb;IACJ;AACJ;AAEO,MAAMO,gBAAuB;IAChC,QAAQnB,CAAAA;QACJ,MAAM,CAACC,OAAOC,SAAS,GAAGC,SAASH,KAAK,KAAK,IAAI;QACjD,MAAM,CAACoB,YAAYC,cAAc,GAAGlB,SAAS;YAAE,SAAS;YAAM,SAAS;QAAG;QAG1EmB,UAAU;YACNpB,SAASF,KAAK,KAAK,IAAI;QAC3B,GAAG;YAACA,KAAK,KAAK;SAAC;QAEf,MAAMuB,eAAe,CAACC;YAClBtB,SAASsB;YAELxB,KAAK,QAAQ,IAAIwB,AAAa,MAAbA,WACjBH,cAAc;gBAAE,SAAS;gBAAO,SAAS;YAAwB,KAEjEA,cAAc;gBAAE,SAAS;gBAAM,SAAS;YAAG;QAEnD;QAGAC,UAAU;YACFtB,KAAK,QAAQ,IAAIC,AAAU,MAAVA,QACjBoB,cAAc;gBAAE,SAAS;gBAAO,SAAS;YAAwB,KAEjEA,cAAc;gBAAE,SAAS;gBAAM,SAAS;YAAG;QAEnD,GAAG;YAACrB,KAAK,QAAQ;YAAEC;SAAM;QAEzB,OAAO,WAAP,GACI,oBAACF,QAAMA;YACF,GAAGC,IAAI;YACR,OAAOC;YACP,eAAesB;YACf,YAAYH;YACZ,UAAUpB,KAAK,QAAQ;YACvB,aAAaA,KAAK,WAAW;YAC7B,gBAAgBA,KAAK,cAAc;;IAG/C;IACA,MAAM;QACF,OAAO;QACP,UAAU;QACV,UAAU;QACV,aAAa;QACb,MAAM;QACN,KAAK;QACL,KAAK;QACL,MAAM;QACN,OAAO;QACP,aAAa;QACb,gBAAgB,CAACC,QAAkB,GAAGA,MAAM,CAAC,CAAC;QAC9C,YAAYwB;IAChB;IACA,UAAU;QACN,OAAO;YACH,aAAa;YACb,SAAS;QACb;QACA,UAAU;YACN,aAAa;YACb,SAAS;QACb;QACA,UAAU;YACN,aAAa;YACb,SAAS;QACb;QACA,aAAa;YACT,aAAa;YACb,SAAS;QACb;QACA,MAAM;YACF,aAAa;YACb,SAAS;QACb;QACA,KAAK;YACD,aAAa;YACb,SAAS;QACb;QACA,KAAK;YACD,aAAa;YACb,SAAS;QACb;QACA,MAAM;YACF,aAAa;YACb,SAAS;QACb;QACA,OAAO;YACH,aAAa;YACb,SAAS;QACb;QACA,aAAa;YACT,aAAa;YACb,SAAS;YACT,cAAc;QAClB;QACA,gBAAgB;YACZ,aAAa;QACjB;QACA,eAAe;YACX,aAAa;YACb,SAAS;YACT,SAAS;gBAAC;gBAAO;aAAO;QAC5B;QACA,YAAY;YACR,aACI;QACR;QACA,eAAe;YACX,aAAa;QACjB;QACA,eAAe;YACX,aAAa;QACjB;IACJ;AACJ"}

package/Slider/primitives/SliderPrimitive.stories.d.ts

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from "@storybook/react-webpack5";
+import type { Meta, StoryObj } from "@storybook/react";
 import { SliderPrimitive } from "./SliderPrimitive.js";
 declare const meta: Meta<typeof SliderPrimitive>;
 export default meta;

package/Slider/primitives/SliderPrimitive.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Slider/primitives/SliderPrimitive.stories.js","sources":["../../../src/Slider/primitives/SliderPrimitive.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { SliderPrimitive } from \"./SliderPrimitive.js\";\nimport { Button } from \"~/Button/index.js\";\n\nconst meta: Meta<typeof SliderPrimitive> = {\n    title: \"Components/Form Primitives/Slider\",\n    component: SliderPrimitive,\n    argTypes: {\n        onValueChange: { action: \"onValueChange\" },\n        onValueCommit: { action: \"onValueCommit\" }\n    },\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => {\n        const [value, setValue] = useState(args.value);\n        return <SliderPrimitive {...args} value={value} onValueChange={value => setValue(value)} />;\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof SliderPrimitive>;\n\nexport const Default: Story = {};\n\nexport const WithDefaultValue: Story = {\n    args: {\n        value: 50\n    }\n};\n\nexport const WithMinAndMaxValues: Story = {\n    args: {\n        min: 10,\n        max: 20\n    }\n};\n\nexport const WithNegativeMinValue: Story = {\n    args: {\n        min: -100,\n        max: 100,\n        value: 0\n    }\n};\n\nexport const WithSteps: Story = {\n    args: {\n        step: 10\n    }\n};\n\nexport const Disabled: Story = {\n    args: {\n        disabled: true,\n        value: 50\n    }\n};\n\nexport const WithTooltip: Story = {\n    args: {\n        showTooltip: true\n    }\n};\n\nexport const WithTooltipSideTop: Story = {\n    args: {\n        showTooltip: true,\n        tooltipSide: \"top\"\n    }\n};\n\nexport const WithTooltipAndCustomValueTransformer: Story = {\n    args: {\n        showTooltip: true,\n        transformValue: (value: number) => {\n            return `${Math.round(value)}%`;\n        }\n    }\n};\n\nexport const WithExternalValueControl: Story = {\n    args: {\n        showTooltip: true,\n        transformValue: (value: number) => {\n            return `${Math.round(value)}%`;\n        }\n    },\n    render: args => {\n        const defaultValue = 50;\n        const [value, setValue] = useState(defaultValue);\n        return (\n            <div className={\"w-full\"}>\n                <div>\n                    <SliderPrimitive\n                        {...args}\n                        value={value}\n                        onValueChange={value => setValue(value)}\n                    />\n                </div>\n                <div className={\"mt-4 text-center\"}>\n                    <Button text={\"Reset\"} onClick={() => setValue(defaultValue)} />\n                </div>\n                <div className={\"mt-4 text-center\"}>\n                    Current value: <code>{value}</code>\n                </div>\n            </div>\n        );\n    }\n};\n"],"names":["meta","SliderPrimitive","args","value","setValue","useState","Default","WithDefaultValue","WithMinAndMaxValues","WithNegativeMinValue","WithSteps","Disabled","WithTooltip","WithTooltipSideTop","WithTooltipAndCustomValueTransformer","Math","WithExternalValueControl","defaultValue","Button"],"mappings":";;;AAKA,MAAMA,OAAqC;IACvC,OAAO;IACP,WAAWC;IACX,UAAU;QACN,eAAe;YAAE,QAAQ;QAAgB;QACzC,eAAe;YAAE,QAAQ;QAAgB;IAC7C;IACA,YAAY;QACR,QAAQ;IACZ;IACA,QAAQC,CAAAA;QACJ,MAAM,CAACC,OAAOC,SAAS,GAAGC,SAASH,KAAK,KAAK;QAC7C,OAAO,WAAP,GAAO,oBAACD,iBAAeA;YAAE,GAAGC,IAAI;YAAE,OAAOC;YAAO,eAAeA,CAAAA,QAASC,SAASD;;IACrF;AACJ;AAEA,gCAAeH;AAGR,MAAMM,UAAiB,CAAC;AAExB,MAAMC,mBAA0B;IACnC,MAAM;QACF,OAAO;IACX;AACJ;AAEO,MAAMC,sBAA6B;IACtC,MAAM;QACF,KAAK;QACL,KAAK;IACT;AACJ;AAEO,MAAMC,uBAA8B;IACvC,MAAM;QACF,KAAK;QACL,KAAK;QACL,OAAO;IACX;AACJ;AAEO,MAAMC,YAAmB;IAC5B,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,WAAkB;IAC3B,MAAM;QACF,UAAU;QACV,OAAO;IACX;AACJ;AAEO,MAAMC,cAAqB;IAC9B,MAAM;QACF,aAAa;IACjB;AACJ;AAEO,MAAMC,qBAA4B;IACrC,MAAM;QACF,aAAa;QACb,aAAa;IACjB;AACJ;AAEO,MAAMC,uCAA8C;IACvD,MAAM;QACF,aAAa;QACb,gBAAgB,CAACX,QACN,GAAGY,KAAK,KAAK,CAACZ,OAAO,CAAC,CAAC;IAEtC;AACJ;AAEO,MAAMa,2BAAkC;IAC3C,MAAM;QACF,aAAa;QACb,gBAAgB,CAACb,QACN,GAAGY,KAAK,KAAK,CAACZ,OAAO,CAAC,CAAC;IAEtC;IACA,QAAQD,CAAAA;QACJ,MAAMe,eAAe;QACrB,MAAM,CAACd,OAAOC,SAAS,GAAGC,SAASY;QACnC,OAAO,WAAP,GACI,oBAAC;YAAI,WAAW;yBACZ,oBAAC,2BACG,oBAAChB,iBAAeA;YACX,GAAGC,IAAI;YACR,OAAOC;YACP,eAAeA,CAAAA,QAASC,SAASD;2BAGzC,oBAAC;YAAI,WAAW;yBACZ,oBAACe,QAAMA;YAAC,MAAM;YAAS,SAAS,IAAMd,SAASa;2BAEnD,oBAAC;YAAI,WAAW;WAAoB,iCACjB,oBAAC,cAAMd;IAItC;AACJ"}
+{"version":3,"file":"Slider/primitives/SliderPrimitive.stories.js","sources":["../../../src/Slider/primitives/SliderPrimitive.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { SliderPrimitive } from \"./SliderPrimitive.js\";\nimport { Button } from \"~/Button/index.js\";\n\nconst meta: Meta<typeof SliderPrimitive> = {\n    title: \"Components/Form Primitives/Slider\",\n    component: SliderPrimitive,\n    argTypes: {\n        onValueChange: { action: \"onValueChange\" },\n        onValueCommit: { action: \"onValueCommit\" }\n    },\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => {\n        const [value, setValue] = useState(args.value);\n        return <SliderPrimitive {...args} value={value} onValueChange={value => setValue(value)} />;\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof SliderPrimitive>;\n\nexport const Default: Story = {};\n\nexport const WithDefaultValue: Story = {\n    args: {\n        value: 50\n    }\n};\n\nexport const WithMinAndMaxValues: Story = {\n    args: {\n        min: 10,\n        max: 20\n    }\n};\n\nexport const WithNegativeMinValue: Story = {\n    args: {\n        min: -100,\n        max: 100,\n        value: 0\n    }\n};\n\nexport const WithSteps: Story = {\n    args: {\n        step: 10\n    }\n};\n\nexport const Disabled: Story = {\n    args: {\n        disabled: true,\n        value: 50\n    }\n};\n\nexport const WithTooltip: Story = {\n    args: {\n        showTooltip: true\n    }\n};\n\nexport const WithTooltipSideTop: Story = {\n    args: {\n        showTooltip: true,\n        tooltipSide: \"top\"\n    }\n};\n\nexport const WithTooltipAndCustomValueTransformer: Story = {\n    args: {\n        showTooltip: true,\n        transformValue: (value: number) => {\n            return `${Math.round(value)}%`;\n        }\n    }\n};\n\nexport const WithExternalValueControl: Story = {\n    args: {\n        showTooltip: true,\n        transformValue: (value: number) => {\n            return `${Math.round(value)}%`;\n        }\n    },\n    render: args => {\n        const defaultValue = 50;\n        const [value, setValue] = useState(defaultValue);\n        return (\n            <div className={\"w-full\"}>\n                <div>\n                    <SliderPrimitive\n                        {...args}\n                        value={value}\n                        onValueChange={value => setValue(value)}\n                    />\n                </div>\n                <div className={\"mt-4 text-center\"}>\n                    <Button text={\"Reset\"} onClick={() => setValue(defaultValue)} />\n                </div>\n                <div className={\"mt-4 text-center\"}>\n                    Current value: <code>{value}</code>\n                </div>\n            </div>\n        );\n    }\n};\n"],"names":["meta","SliderPrimitive","args","value","setValue","useState","Default","WithDefaultValue","WithMinAndMaxValues","WithNegativeMinValue","WithSteps","Disabled","WithTooltip","WithTooltipSideTop","WithTooltipAndCustomValueTransformer","Math","WithExternalValueControl","defaultValue","Button"],"mappings":";;;AAKA,MAAMA,OAAqC;IACvC,OAAO;IACP,WAAWC;IACX,UAAU;QACN,eAAe;YAAE,QAAQ;QAAgB;QACzC,eAAe;YAAE,QAAQ;QAAgB;IAC7C;IACA,YAAY;QACR,QAAQ;IACZ;IACA,QAAQC,CAAAA;QACJ,MAAM,CAACC,OAAOC,SAAS,GAAGC,SAASH,KAAK,KAAK;QAC7C,OAAO,WAAP,GAAO,oBAACD,iBAAeA;YAAE,GAAGC,IAAI;YAAE,OAAOC;YAAO,eAAeA,CAAAA,QAASC,SAASD;;IACrF;AACJ;AAEA,gCAAeH;AAGR,MAAMM,UAAiB,CAAC;AAExB,MAAMC,mBAA0B;IACnC,MAAM;QACF,OAAO;IACX;AACJ;AAEO,MAAMC,sBAA6B;IACtC,MAAM;QACF,KAAK;QACL,KAAK;IACT;AACJ;AAEO,MAAMC,uBAA8B;IACvC,MAAM;QACF,KAAK;QACL,KAAK;QACL,OAAO;IACX;AACJ;AAEO,MAAMC,YAAmB;IAC5B,MAAM;QACF,MAAM;IACV;AACJ;AAEO,MAAMC,WAAkB;IAC3B,MAAM;QACF,UAAU;QACV,OAAO;IACX;AACJ;AAEO,MAAMC,cAAqB;IAC9B,MAAM;QACF,aAAa;IACjB;AACJ;AAEO,MAAMC,qBAA4B;IACrC,MAAM;QACF,aAAa;QACb,aAAa;IACjB;AACJ;AAEO,MAAMC,uCAA8C;IACvD,MAAM;QACF,aAAa;QACb,gBAAgB,CAACX,QACN,GAAGY,KAAK,KAAK,CAACZ,OAAO,CAAC,CAAC;IAEtC;AACJ;AAEO,MAAMa,2BAAkC;IAC3C,MAAM;QACF,aAAa;QACb,gBAAgB,CAACb,QACN,GAAGY,KAAK,KAAK,CAACZ,OAAO,CAAC,CAAC;IAEtC;IACA,QAAQD,CAAAA;QACJ,MAAMe,eAAe;QACrB,MAAM,CAACd,OAAOC,SAAS,GAAGC,SAASY;QACnC,OAAO,WAAP,GACI,oBAAC;YAAI,WAAW;yBACZ,oBAAC,2BACG,oBAAChB,iBAAeA;YACX,GAAGC,IAAI;YACR,OAAOC;YACP,eAAeA,CAAAA,QAASC,SAASD;2BAGzC,oBAAC;YAAI,WAAW;yBACZ,oBAACe,QAAMA;YAAC,MAAM;YAAS,SAAS,IAAMd,SAASa;2BAEnD,oBAAC;YAAI,WAAW;WAAoB,iCACjB,oBAAC,cAAMd;IAItC;AACJ"}

package/SteppedProgress/SteppedProgress.stories.d.ts

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from "@storybook/react-webpack5";
+import type { Meta, StoryObj } from "@storybook/react";
 import { SteppedProgress } from "./SteppedProgress.js";
 declare const meta: Meta<typeof SteppedProgress>;
 export default meta;

package/SteppedProgress/SteppedProgress.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"SteppedProgress/SteppedProgress.stories.js","sources":["../../src/SteppedProgress/SteppedProgress.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { SteppedProgress } from \"./SteppedProgress.js\";\nimport { ProgressItemState } from \"~/SteppedProgress/domains/index.js\";\n\nconst meta: Meta<typeof SteppedProgress> = {\n    title: \"Components/SteppedProgress\",\n    component: SteppedProgress,\n    argTypes: {},\n    parameters: {\n        layout: \"padded\"\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof SteppedProgress>;\n\nexport const Default: Story = {\n    args: {\n        items: [\n            {\n                label: \"Step\"\n            },\n            {\n                label: \"Step In Progress\",\n                state: ProgressItemState.IN_PROGRESS\n            },\n            {\n                label: \"Step Completed\",\n                state: ProgressItemState.COMPLETED\n            },\n            {\n                label: \"Completed Affirmative\",\n                state: ProgressItemState.COMPLETED_AFFIRMATIVE\n            }\n        ]\n    }\n};\n\nexport const WithMultipleLines: Story = {\n    decorators: [\n        Story => (\n            <div\n                style={{\n                    width: \"240px\"\n                }}\n            >\n                <Story />\n            </div>\n        )\n    ],\n    args: {\n        items: [\n            {\n                label: \"Step but with multiple lines of text.\"\n            },\n            {\n                label: \"Step in progress but with multiple lines of text.\",\n                state: ProgressItemState.IN_PROGRESS\n            },\n            {\n                label: \"Step completed but with multiple lines of text.\",\n                state: ProgressItemState.COMPLETED\n            },\n            {\n                label: \"Completed affirmative but with multiple lines of text.\",\n                state: ProgressItemState.COMPLETED_AFFIRMATIVE\n            }\n        ]\n    }\n};\n\nexport const Disabled: Story = {\n    args: {\n        items: [\n            {\n                label: \"Step\",\n                disabled: true\n            },\n            {\n                label: \"Step In Progress\",\n                state: ProgressItemState.IN_PROGRESS,\n                disabled: true\n            },\n            {\n                label: \"Step Completed\",\n                state: ProgressItemState.COMPLETED,\n                disabled: true\n            },\n            {\n                label: \"Completed Affirmative\",\n                state: ProgressItemState.COMPLETED_AFFIRMATIVE,\n                disabled: true\n            }\n        ]\n    }\n};\n\nexport const Errored: Story = {\n    args: {\n        items: [\n            {\n                label: \"Step\",\n                errored: true\n            },\n            {\n                label: \"Step In Progress\",\n                state: ProgressItemState.IN_PROGRESS,\n                errored: true\n            },\n            {\n                label: \"Step Completed\",\n                state: ProgressItemState.COMPLETED,\n                errored: true\n            },\n            {\n                label: \"Completed Affirmative\",\n                state: ProgressItemState.COMPLETED_AFFIRMATIVE,\n                errored: true\n            }\n        ]\n    }\n};\n\nexport const DisabledAndErrored: Story = {\n    args: {\n        items: [\n            {\n                label: \"Step\",\n                disabled: true,\n                errored: true\n            },\n            {\n                label: \"Step In Progress\",\n                state: ProgressItemState.IN_PROGRESS,\n                disabled: true,\n                errored: true\n            },\n            {\n                label: \"Step Completed\",\n                state: ProgressItemState.COMPLETED,\n                disabled: true,\n                errored: true\n            },\n            {\n                label: \"Completed Affirmative\",\n                state: ProgressItemState.COMPLETED_AFFIRMATIVE,\n                disabled: true,\n                errored: true\n            }\n        ]\n    }\n};\n"],"names":["meta","SteppedProgress","Default","ProgressItemState","WithMultipleLines","Story","Disabled","Errored","DisabledAndErrored"],"mappings":";;;AAKA,MAAMA,OAAqC;IACvC,OAAO;IACP,WAAWC;IACX,UAAU,CAAC;IACX,YAAY;QACR,QAAQ;IACZ;AACJ;AAEA,gCAAeD;AAGR,MAAME,UAAiB;IAC1B,MAAM;QACF,OAAO;YACH;gBACI,OAAO;YACX;YACA;gBACI,OAAO;gBACP,OAAOC,kBAAkB,WAAW;YACxC;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,SAAS;YACtC;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,qBAAqB;YAClD;SACH;IACL;AACJ;AAEO,MAAMC,oBAA2B;IACpC,YAAY;QACRC,CAAAA,QAAAA,WAAAA,GACI,oBAAC;gBACG,OAAO;oBACH,OAAO;gBACX;6BAEA,oBAACA,OAAAA;KAGZ;IACD,MAAM;QACF,OAAO;YACH;gBACI,OAAO;YACX;YACA;gBACI,OAAO;gBACP,OAAOF,kBAAkB,WAAW;YACxC;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,SAAS;YACtC;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,qBAAqB;YAClD;SACH;IACL;AACJ;AAEO,MAAMG,WAAkB;IAC3B,MAAM;QACF,OAAO;YACH;gBACI,OAAO;gBACP,UAAU;YACd;YACA;gBACI,OAAO;gBACP,OAAOH,kBAAkB,WAAW;gBACpC,UAAU;YACd;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,SAAS;gBAClC,UAAU;YACd;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,qBAAqB;gBAC9C,UAAU;YACd;SACH;IACL;AACJ;AAEO,MAAMI,UAAiB;IAC1B,MAAM;QACF,OAAO;YACH;gBACI,OAAO;gBACP,SAAS;YACb;YACA;gBACI,OAAO;gBACP,OAAOJ,kBAAkB,WAAW;gBACpC,SAAS;YACb;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,SAAS;gBAClC,SAAS;YACb;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,qBAAqB;gBAC9C,SAAS;YACb;SACH;IACL;AACJ;AAEO,MAAMK,qBAA4B;IACrC,MAAM;QACF,OAAO;YACH;gBACI,OAAO;gBACP,UAAU;gBACV,SAAS;YACb;YACA;gBACI,OAAO;gBACP,OAAOL,kBAAkB,WAAW;gBACpC,UAAU;gBACV,SAAS;YACb;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,SAAS;gBAClC,UAAU;gBACV,SAAS;YACb;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,qBAAqB;gBAC9C,UAAU;gBACV,SAAS;YACb;SACH;IACL;AACJ"}
+{"version":3,"file":"SteppedProgress/SteppedProgress.stories.js","sources":["../../src/SteppedProgress/SteppedProgress.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { SteppedProgress } from \"./SteppedProgress.js\";\nimport { ProgressItemState } from \"~/SteppedProgress/domains/index.js\";\n\nconst meta: Meta<typeof SteppedProgress> = {\n    title: \"Components/SteppedProgress\",\n    component: SteppedProgress,\n    argTypes: {},\n    parameters: {\n        layout: \"padded\"\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof SteppedProgress>;\n\nexport const Default: Story = {\n    args: {\n        items: [\n            {\n                label: \"Step\"\n            },\n            {\n                label: \"Step In Progress\",\n                state: ProgressItemState.IN_PROGRESS\n            },\n            {\n                label: \"Step Completed\",\n                state: ProgressItemState.COMPLETED\n            },\n            {\n                label: \"Completed Affirmative\",\n                state: ProgressItemState.COMPLETED_AFFIRMATIVE\n            }\n        ]\n    }\n};\n\nexport const WithMultipleLines: Story = {\n    decorators: [\n        Story => (\n            <div\n                style={{\n                    width: \"240px\"\n                }}\n            >\n                <Story />\n            </div>\n        )\n    ],\n    args: {\n        items: [\n            {\n                label: \"Step but with multiple lines of text.\"\n            },\n            {\n                label: \"Step in progress but with multiple lines of text.\",\n                state: ProgressItemState.IN_PROGRESS\n            },\n            {\n                label: \"Step completed but with multiple lines of text.\",\n                state: ProgressItemState.COMPLETED\n            },\n            {\n                label: \"Completed affirmative but with multiple lines of text.\",\n                state: ProgressItemState.COMPLETED_AFFIRMATIVE\n            }\n        ]\n    }\n};\n\nexport const Disabled: Story = {\n    args: {\n        items: [\n            {\n                label: \"Step\",\n                disabled: true\n            },\n            {\n                label: \"Step In Progress\",\n                state: ProgressItemState.IN_PROGRESS,\n                disabled: true\n            },\n            {\n                label: \"Step Completed\",\n                state: ProgressItemState.COMPLETED,\n                disabled: true\n            },\n            {\n                label: \"Completed Affirmative\",\n                state: ProgressItemState.COMPLETED_AFFIRMATIVE,\n                disabled: true\n            }\n        ]\n    }\n};\n\nexport const Errored: Story = {\n    args: {\n        items: [\n            {\n                label: \"Step\",\n                errored: true\n            },\n            {\n                label: \"Step In Progress\",\n                state: ProgressItemState.IN_PROGRESS,\n                errored: true\n            },\n            {\n                label: \"Step Completed\",\n                state: ProgressItemState.COMPLETED,\n                errored: true\n            },\n            {\n                label: \"Completed Affirmative\",\n                state: ProgressItemState.COMPLETED_AFFIRMATIVE,\n                errored: true\n            }\n        ]\n    }\n};\n\nexport const DisabledAndErrored: Story = {\n    args: {\n        items: [\n            {\n                label: \"Step\",\n                disabled: true,\n                errored: true\n            },\n            {\n                label: \"Step In Progress\",\n                state: ProgressItemState.IN_PROGRESS,\n                disabled: true,\n                errored: true\n            },\n            {\n                label: \"Step Completed\",\n                state: ProgressItemState.COMPLETED,\n                disabled: true,\n                errored: true\n            },\n            {\n                label: \"Completed Affirmative\",\n                state: ProgressItemState.COMPLETED_AFFIRMATIVE,\n                disabled: true,\n                errored: true\n            }\n        ]\n    }\n};\n"],"names":["meta","SteppedProgress","Default","ProgressItemState","WithMultipleLines","Story","Disabled","Errored","DisabledAndErrored"],"mappings":";;;AAKA,MAAMA,OAAqC;IACvC,OAAO;IACP,WAAWC;IACX,UAAU,CAAC;IACX,YAAY;QACR,QAAQ;IACZ;AACJ;AAEA,gCAAeD;AAGR,MAAME,UAAiB;IAC1B,MAAM;QACF,OAAO;YACH;gBACI,OAAO;YACX;YACA;gBACI,OAAO;gBACP,OAAOC,kBAAkB,WAAW;YACxC;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,SAAS;YACtC;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,qBAAqB;YAClD;SACH;IACL;AACJ;AAEO,MAAMC,oBAA2B;IACpC,YAAY;QACRC,CAAAA,QAAAA,WAAAA,GACI,oBAAC;gBACG,OAAO;oBACH,OAAO;gBACX;6BAEA,oBAACA,OAAAA;KAGZ;IACD,MAAM;QACF,OAAO;YACH;gBACI,OAAO;YACX;YACA;gBACI,OAAO;gBACP,OAAOF,kBAAkB,WAAW;YACxC;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,SAAS;YACtC;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,qBAAqB;YAClD;SACH;IACL;AACJ;AAEO,MAAMG,WAAkB;IAC3B,MAAM;QACF,OAAO;YACH;gBACI,OAAO;gBACP,UAAU;YACd;YACA;gBACI,OAAO;gBACP,OAAOH,kBAAkB,WAAW;gBACpC,UAAU;YACd;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,SAAS;gBAClC,UAAU;YACd;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,qBAAqB;gBAC9C,UAAU;YACd;SACH;IACL;AACJ;AAEO,MAAMI,UAAiB;IAC1B,MAAM;QACF,OAAO;YACH;gBACI,OAAO;gBACP,SAAS;YACb;YACA;gBACI,OAAO;gBACP,OAAOJ,kBAAkB,WAAW;gBACpC,SAAS;YACb;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,SAAS;gBAClC,SAAS;YACb;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,qBAAqB;gBAC9C,SAAS;YACb;SACH;IACL;AACJ;AAEO,MAAMK,qBAA4B;IACrC,MAAM;QACF,OAAO;YACH;gBACI,OAAO;gBACP,UAAU;gBACV,SAAS;YACb;YACA;gBACI,OAAO;gBACP,OAAOL,kBAAkB,WAAW;gBACpC,UAAU;gBACV,SAAS;YACb;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,SAAS;gBAClC,UAAU;gBACV,SAAS;YACb;YACA;gBACI,OAAO;gBACP,OAAOA,kBAAkB,qBAAqB;gBAC9C,UAAU;gBACV,SAAS;YACb;SACH;IACL;AACJ"}

package/Switch/Switch.stories.d.ts

@@ -1,4 +1,4 @@
-import type { Meta, StoryObj } from "@storybook/react-webpack5";
+import type { Meta, StoryObj } from "@storybook/react";
 import { Switch } from "../Switch/index.js";
 declare const meta: Meta<typeof Switch>;
 export default meta;