@webiny/admin-ui 0.0.0-unstable.7be00a75a9 → 0.0.0-unstable.7c2def32a7

package/Drawer/components/Icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Drawer/components/Icon.js","sources":["../../../src/Drawer/components/Icon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn, makeDecoratable } from \"~/utils.js\";\nimport type { IconProps as IconComponentProps } from \"~/Icon/index.js\";\nimport { Icon as IconComponent } from \"~/Icon/index.js\";\n\ntype IconProps = IconComponentProps;\n\nconst IconBase = ({ className, ...props }: IconProps) => {\n    return (\n        <IconComponent\n            size={\"lg\"}\n            color={\"neutral-strong\"}\n            {...props}\n            className={cn(\"pt-xs\", className)}\n        />\n    );\n};\n\nexport const Icon = makeDecoratable(\"Icon\", IconBase);\n"],"names":["IconBase","className","props","IconComponent","cn","Icon","makeDecoratable"],"mappings":";;;AAOA,MAAMA,WAAW,CAAC,EAAEC,SAAS,EAAE,GAAGC,OAAkB,GACzC,WAAP,GACI,sCAACC,MAAaA;QACV,MAAM;QACN,OAAO;QACN,GAAGD,KAAK;QACT,WAAWE,GAAG,SAASH;;AAK5B,MAAMI,YAAOC,gBAAgB,QAAQN"}
+{"version":3,"file":"Drawer/components/Icon.js","sources":["../../../src/Drawer/components/Icon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { makeDecoratable } from \"~/utils.js\";\nimport type { IconProps as IconComponentProps } from \"~/Icon/index.js\";\nimport { Icon as IconComponent } from \"~/Icon/index.js\";\n\ntype IconProps = IconComponentProps;\n\nconst IconBase = (props: IconProps) => {\n    return <IconComponent size={\"lg\"} color={\"neutral-strong\"} {...props} />;\n};\n\nexport const Icon = makeDecoratable(\"Icon\", IconBase);\n"],"names":["IconBase","props","IconComponent","Icon","makeDecoratable"],"mappings":";;;AAOA,MAAMA,WAAW,CAACC,QACP,WAAP,GAAO,sCAACC,MAAaA;QAAC,MAAM;QAAM,OAAO;QAAmB,GAAGD,KAAK;;AAGjE,MAAME,YAAOC,gBAAgB,QAAQJ"}

package/DropdownMenu/DropdownMenu.stories.d.ts

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

package/DropdownMenu/DropdownMenu.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownMenu/DropdownMenu.stories.js","sources":["../../src/DropdownMenu/DropdownMenu.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { DropdownMenu } from \"./DropdownMenu.js\";\nimport { Button } from \"~/Button/index.js\";\nimport { ReactComponent as Cloud } from \"@webiny/icons/cloud.svg\";\nimport { ReactComponent as LogOut } from \"@webiny/icons/logout.svg\";\nimport { ReactComponent as LifeBuoy } from \"@webiny/icons/safety_check.svg\";\nimport { ReactComponent as CreditCard } from \"@webiny/icons/credit_score.svg\";\nimport { ReactComponent as Plus } from \"@webiny/icons/add.svg\";\nimport { ReactComponent as PlusCircle } from \"@webiny/icons/add_circle.svg\";\nimport { ReactComponent as Settings } from \"@webiny/icons/settings.svg\";\nimport { ReactComponent as Users } from \"@webiny/icons/people.svg\";\nimport { ReactComponent as UserPlus } from \"@webiny/icons/person_add.svg\";\nimport { ReactComponent as User } from \"@webiny/icons/person.svg\";\nimport { ReactComponent as Keyboard } from \"@webiny/icons/keyboard.svg\";\nimport { ReactComponent as Mail } from \"@webiny/icons/mail.svg\";\nimport { ReactComponent as MessageSquare } from \"@webiny/icons/chat_bubble.svg\";\nimport { ReactComponent as LinkIcon } from \"@webiny/icons/link.svg\";\nimport { Text } from \"~/Text/index.js\";\n\nconst meta: Meta<typeof DropdownMenu> = {\n    title: \"Components/Dropdown Menu\",\n    component: DropdownMenu,\n    argTypes: {}\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof DropdownMenu>;\n\nconst { Label, Separator, Group, Item, Link, CheckboxItem } = DropdownMenu;\n\nexport const Default: Story = {\n    args: {\n        trigger: <Button variant=\"primary\" text={\"Open\"} />,\n        children: (\n            <>\n                <Label text={\"My Account\"} />\n                <Item icon={<Item.Icon label={\"Profile\"} element={<User />} />} text={\"Profile\"} />\n                <Group>\n                    <Item\n                        icon={<Item.Icon element={<CreditCard />} label={\"Billing\"} />}\n                        text={\"Billing\"}\n                    />\n                    <Item\n                        icon={<Item.Icon element={<Settings />} label={\"Settings\"} />}\n                        text={\"Settings\"}\n                    />\n                    <Item\n                        icon={<Item.Icon element={<Keyboard />} label={\"Keyboard shortcuts\"} />}\n                        text={\"Keyboard shortcuts\"}\n                    />\n                </Group>\n                <Separator />\n                <Group>\n                    <Item icon={<Item.Icon element={<Users />} label={\"Team\"} />} text={\"Team\"} />\n                    <Item\n                        icon={<Item.Icon element={<UserPlus />} label={\"Invite users\"} />}\n                        text={\"Invite users\"}\n                    >\n                        <Item\n                            icon={<Item.Icon element={<Mail />} label={\"Email\"} />}\n                            text={\"Email\"}\n                        />\n                        <Item\n                            icon={<Item.Icon element={<MessageSquare />} label={\"Message\"} />}\n                            text={\"Message\"}\n                        />\n                        <Separator />\n                        <Item\n                            icon={<Item.Icon label={\"More...\"} element={<PlusCircle />} />}\n                            text={\"More...\"}\n                        />\n                    </Item>\n                    <Item\n                        icon={<Item.Icon label={\"New Team\"} element={<Plus />} />}\n                        text={\"New Team\"}\n                    />\n                </Group>\n                <Separator />\n                <Item\n                    icon={<Item.Icon label={\"Support\"} element={<LifeBuoy />} />}\n                    text={\"Support\"}\n                />\n                <Item\n                    icon={<Item.Icon label={\"API\"} element={<Cloud />} />}\n                    text={\"API\"}\n                    disabled\n                />\n                <Separator />\n                <Item\n                    icon={<Item.Icon label={\"Log out\"} element={<LogOut />} />}\n                    text={\"Log out\"}\n                />\n                <Separator />\n                <Label text={\"Links\"} />\n                <Link\n                    text={\"Link 1\"}\n                    to={\"#link-1\"}\n                    icon={<Link.Icon label=\"Link 1\" element={<LinkIcon />} />}\n                />\n                <Link\n                    text={\"Link 2 (target: _blank)\"}\n                    to={\"#link-2\"}\n                    icon={<Link.Icon label=\"Link 2\" element={<LinkIcon />} />}\n                    target={\"_blank\"}\n                />\n                <Link\n                    text={\"Link 3\"}\n                    to={\"#link-3\"}\n                    icon={<Link.Icon label=\"Link 3\" element={<LinkIcon />} />}\n                />\n            </>\n        )\n    },\n    argTypes: {}\n};\n\nexport const SimpleMenuWithIcons: Story = {\n    args: {\n        trigger: <Button variant=\"primary\" text={\"Open\"} />,\n        children: (\n            <>\n                <Item\n                    icon={<Item.Icon label={\"Billing\"} element={<CreditCard />} />}\n                    text={\"Billing\"}\n                />\n                <Item\n                    icon={<Item.Icon label={\"Settings\"} element={<Settings />} />}\n                    text={\"Settings\"}\n                />\n                <Item\n                    icon={<Item.Icon label={\"Keyboard shortcuts\"} element={<Keyboard />} />}\n                    text={\"Keyboard shortcuts\"}\n                />\n            </>\n        )\n    },\n    argTypes: {}\n};\n\nexport const WithSubMenus: Story = {\n    args: {\n        trigger: <Button variant=\"primary\" text={\"Open\"} />,\n        children: (\n            <>\n                <Label text={\"My Account\"} />\n                <Item icon={<Item.Icon element={<User />} label={\"Profile\"} />} text={\"Profile\"} />\n                <Group>\n                    <Item\n                        icon={<Item.Icon label={\"Billing\"} element={<CreditCard />} />}\n                        text={\"Billing\"}\n                    />\n                    <Item\n                        icon={<Item.Icon label={\"Settings\"} element={<Settings />} />}\n                        text={\"Settings\"}\n                    />\n                    <Item\n                        icon={<Item.Icon label={\"Keyboard shortcuts\"} element={<Keyboard />} />}\n                        text={\"Keyboard shortcuts\"}\n                    />\n                </Group>\n                <Separator />\n                <Group>\n                    <Item icon={<Item.Icon label={\"Team\"} element={<Users />} />} text={\"Team\"} />\n                    <Item\n                        icon={<Item.Icon label={\"Invite user\"} element={<UserPlus />} />}\n                        text={\"Invite users\"}\n                    >\n                        <Item\n                            icon={<Item.Icon label={\"Email\"} element={<Mail />} />}\n                            text={\"Email\"}\n                        />\n                        <Item\n                            icon={<Item.Icon label={\"Message\"} element={<MessageSquare />} />}\n                            text={\"Message\"}\n                        />\n                        <Separator />\n                        <Item\n                            icon={<Item.Icon label={\"More...\"} element={<PlusCircle />} />}\n                            text={\"More...\"}\n                        >\n                            <Item\n                                icon={<Item.Icon label={\"Email\"} element={<Mail />} />}\n                                text={\"Email\"}\n                            />\n                            <Item\n                                icon={<Item.Icon label={\"Message\"} element={<MessageSquare />} />}\n                                text={\"Message\"}\n                            />\n                            <Separator />\n                            <Item\n                                icon={<Item.Icon label={\"More...\"} element={<PlusCircle />} />}\n                                text={\"More...\"}\n                            />\n                        </Item>\n                    </Item>\n                    <Item\n                        icon={<Item.Icon label={\"New Team\"} element={<Plus />} />}\n                        text={\"New Team\"}\n                    />\n                </Group>\n                <Separator />\n                <Item\n                    icon={<Item.Icon label={\"Support\"} element={<LifeBuoy />} />}\n                    text={\"Support\"}\n                />\n                <Item\n                    icon={<Item.Icon label={\"API\"} element={<Cloud />} />}\n                    text={\"API\"}\n                    disabled\n                />\n                <Separator />\n                <Item\n                    icon={<Item.Icon label={\"Log out\"} element={<LogOut />} />}\n                    text={\"Log out\"}\n                />\n            </>\n        )\n    },\n    argTypes: {}\n};\n\nconst TARGET_LEVELS = [\n    {\n        id: \"viewer\",\n        label: \"Viewer\",\n        description: \"Can view content, but not modify it\"\n    },\n    {\n        id: \"editor\",\n        label: \"Editor\",\n        description: \"Can view and modify content\"\n    },\n    {\n        id: \"owner\",\n        label: \"Owner\",\n        description: \"Can edit and manage content permissions\"\n    }\n];\n\nexport const WithCheckboxItems: Story = {\n    args: {\n        trigger: <Button variant=\"primary\" text={\"Open\"} />,\n        children: (\n            <>\n                {TARGET_LEVELS.map(level => (\n                    <CheckboxItem\n                        key={level.id}\n                        checked={level.id === \"viewer\"}\n                        text={\n                            <div>\n                                <Text as={\"div\"}>{level.label}</Text>\n                                <Text as={\"div\"} size={\"sm\"} className={\"text-neutral-strong\"}>\n                                    {level.description}\n                                </Text>\n                            </div>\n                        }\n                        onClick={() => {\n                            console.log(\"Selected level:\", level.id);\n                        }}\n                    />\n                ))}\n                <DropdownMenu.Separator />\n                <DropdownMenu.Item text={\"Remove access\"} />\n            </>\n        )\n    },\n    argTypes: {}\n};\n\nexport const WithOnOpenChange: Story = {\n    args: {\n        trigger: <Button variant=\"primary\" text={\"Open\"} />,\n        onOpenChange: opened => {\n            console.log(`Menu is ${opened ? \"opened\" : \"closed\"}.`);\n        },\n        children: (\n            <>\n                <Item\n                    icon={<Item.Icon element={<CreditCard />} label={\"Billing\"} />}\n                    text={\"Billing\"}\n                />\n                <Item\n                    icon={<Item.Icon element={<Settings />} label={\"Settings\"} />}\n                    text={\"Settings\"}\n                />\n                <Item\n                    icon={<Item.Icon element={<Keyboard />} label={\"Keyboard shortcuts\"} />}\n                    text={\"Keyboard shortcuts\"}\n                />\n            </>\n        )\n    },\n    argTypes: {}\n};\n\nexport const Documentation: Story = {\n    args: {\n        trigger: <Button variant=\"primary\" text={\"Open\"} />,\n        children: (\n            <>\n                <Label text={\"My Account\"} />\n                <Item icon={<Item.Icon label={\"Profile\"} element={<User />} />} text={\"Profile\"} />\n                <Group>\n                    <Item\n                        icon={<Item.Icon element={<CreditCard />} label={\"Billing\"} />}\n                        text={\"Billing\"}\n                    />\n                    <Item\n                        icon={<Item.Icon element={<Settings />} label={\"Settings\"} />}\n                        text={\"Settings\"}\n                    />\n                    <Item\n                        icon={<Item.Icon element={<Keyboard />} label={\"Keyboard shortcuts\"} />}\n                        text={\"Keyboard shortcuts\"}\n                    />\n                </Group>\n                <Separator />\n                <Group>\n                    <Item icon={<Item.Icon element={<Users />} label={\"Team\"} />} text={\"Team\"} />\n                    <Item\n                        icon={<Item.Icon element={<UserPlus />} label={\"Invite users\"} />}\n                        text={\"Invite users\"}\n                    >\n                        <Item\n                            icon={<Item.Icon element={<Mail />} label={\"Email\"} />}\n                            text={\"Email\"}\n                        />\n                        <Item\n                            icon={<Item.Icon element={<MessageSquare />} label={\"Message\"} />}\n                            text={\"Message\"}\n                        />\n                        <Separator />\n                        <Item\n                            icon={<Item.Icon label={\"More...\"} element={<PlusCircle />} />}\n                            text={\"More...\"}\n                        />\n                    </Item>\n                    <Item\n                        icon={<Item.Icon label={\"New Team\"} element={<Plus />} />}\n                        text={\"New Team\"}\n                    />\n                </Group>\n                <Separator />\n                <Item\n                    icon={<Item.Icon label={\"Support\"} element={<LifeBuoy />} />}\n                    text={\"Support\"}\n                />\n                <Item\n                    icon={<Item.Icon label={\"API\"} element={<Cloud />} />}\n                    text={\"API\"}\n                    disabled\n                />\n                <Separator />\n                <Item\n                    icon={<Item.Icon label={\"Log out\"} element={<LogOut />} />}\n                    text={\"Log out\"}\n                />\n                <Separator />\n                <Label text={\"Links\"} />\n                <Link\n                    text={\"Link 1\"}\n                    to={\"#link-1\"}\n                    icon={<Link.Icon label=\"Link 1\" element={<LinkIcon />} />}\n                />\n                <Link\n                    text={\"Link 2\"}\n                    to={\"#link-2\"}\n                    icon={<Link.Icon label=\"Link 2\" element={<LinkIcon />} />}\n                />\n                <Link\n                    text={\"Link 3\"}\n                    to={\"#link-3\"}\n                    icon={<Link.Icon label=\"Link 3\" element={<LinkIcon />} />}\n                />\n            </>\n        )\n    },\n    argTypes: {\n        trigger: {\n            description:\n                \"The trigger element that opens the menu. Please refer to the example code for details.\"\n        },\n        children: {\n            description: \"The content of the menu. Please refer to the example code for details.\"\n        }\n    }\n};\n"],"names":["meta","DropdownMenu","Label","Separator","Group","Item","Link","CheckboxItem","Default","Button","User","CreditCard","Settings","Keyboard","Users","UserPlus","Mail","MessageSquare","PlusCircle","Plus","LifeBuoy","Cloud","LogOut","LinkIcon","SimpleMenuWithIcons","WithSubMenus","TARGET_LEVELS","WithCheckboxItems","level","Text","console","WithOnOpenChange","opened","Documentation"],"mappings":"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"}
+{"version":3,"file":"DropdownMenu/DropdownMenu.stories.js","sources":["../../src/DropdownMenu/DropdownMenu.stories.tsx"],"sourcesContent":["import React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { DropdownMenu } from \"./DropdownMenu.js\";\nimport { Button } from \"~/Button/index.js\";\nimport { ReactComponent as Cloud } from \"@webiny/icons/cloud.svg\";\nimport { ReactComponent as LogOut } from \"@webiny/icons/logout.svg\";\nimport { ReactComponent as LifeBuoy } from \"@webiny/icons/safety_check.svg\";\nimport { ReactComponent as CreditCard } from \"@webiny/icons/credit_score.svg\";\nimport { ReactComponent as Plus } from \"@webiny/icons/add.svg\";\nimport { ReactComponent as PlusCircle } from \"@webiny/icons/add_circle.svg\";\nimport { ReactComponent as Settings } from \"@webiny/icons/settings.svg\";\nimport { ReactComponent as Users } from \"@webiny/icons/people.svg\";\nimport { ReactComponent as UserPlus } from \"@webiny/icons/person_add.svg\";\nimport { ReactComponent as User } from \"@webiny/icons/person.svg\";\nimport { ReactComponent as Keyboard } from \"@webiny/icons/keyboard.svg\";\nimport { ReactComponent as Mail } from \"@webiny/icons/mail.svg\";\nimport { ReactComponent as MessageSquare } from \"@webiny/icons/chat_bubble.svg\";\nimport { ReactComponent as LinkIcon } from \"@webiny/icons/link.svg\";\nimport { Text } from \"~/Text/index.js\";\n\nconst meta: Meta<typeof DropdownMenu> = {\n    title: \"Components/Dropdown Menu\",\n    component: DropdownMenu,\n    argTypes: {}\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof DropdownMenu>;\n\nconst { Label, Separator, Group, Item, Link, CheckboxItem } = DropdownMenu;\n\nexport const Default: Story = {\n    args: {\n        trigger: <Button variant=\"primary\" text={\"Open\"} />,\n        children: (\n            <>\n                <Label text={\"My Account\"} />\n                <Item icon={<Item.Icon label={\"Profile\"} element={<User />} />} text={\"Profile\"} />\n                <Group>\n                    <Item\n                        icon={<Item.Icon element={<CreditCard />} label={\"Billing\"} />}\n                        text={\"Billing\"}\n                    />\n                    <Item\n                        icon={<Item.Icon element={<Settings />} label={\"Settings\"} />}\n                        text={\"Settings\"}\n                    />\n                    <Item\n                        icon={<Item.Icon element={<Keyboard />} label={\"Keyboard shortcuts\"} />}\n                        text={\"Keyboard shortcuts\"}\n                    />\n                </Group>\n                <Separator />\n                <Group>\n                    <Item icon={<Item.Icon element={<Users />} label={\"Team\"} />} text={\"Team\"} />\n                    <Item\n                        icon={<Item.Icon element={<UserPlus />} label={\"Invite users\"} />}\n                        text={\"Invite users\"}\n                    >\n                        <Item\n                            icon={<Item.Icon element={<Mail />} label={\"Email\"} />}\n                            text={\"Email\"}\n                        />\n                        <Item\n                            icon={<Item.Icon element={<MessageSquare />} label={\"Message\"} />}\n                            text={\"Message\"}\n                        />\n                        <Separator />\n                        <Item\n                            icon={<Item.Icon label={\"More...\"} element={<PlusCircle />} />}\n                            text={\"More...\"}\n                        />\n                    </Item>\n                    <Item\n                        icon={<Item.Icon label={\"New Team\"} element={<Plus />} />}\n                        text={\"New Team\"}\n                    />\n                </Group>\n                <Separator />\n                <Item\n                    icon={<Item.Icon label={\"Support\"} element={<LifeBuoy />} />}\n                    text={\"Support\"}\n                />\n                <Item\n                    icon={<Item.Icon label={\"API\"} element={<Cloud />} />}\n                    text={\"API\"}\n                    disabled\n                />\n                <Separator />\n                <Item\n                    icon={<Item.Icon label={\"Log out\"} element={<LogOut />} />}\n                    text={\"Log out\"}\n                />\n                <Separator />\n                <Label text={\"Links\"} />\n                <Link\n                    text={\"Link 1\"}\n                    to={\"#link-1\"}\n                    icon={<Link.Icon label=\"Link 1\" element={<LinkIcon />} />}\n                />\n                <Link\n                    text={\"Link 2 (target: _blank)\"}\n                    to={\"#link-2\"}\n                    icon={<Link.Icon label=\"Link 2\" element={<LinkIcon />} />}\n                    target={\"_blank\"}\n                />\n                <Link\n                    text={\"Link 3\"}\n                    to={\"#link-3\"}\n                    icon={<Link.Icon label=\"Link 3\" element={<LinkIcon />} />}\n                />\n            </>\n        )\n    },\n    argTypes: {}\n};\n\nexport const SimpleMenuWithIcons: Story = {\n    args: {\n        trigger: <Button variant=\"primary\" text={\"Open\"} />,\n        children: (\n            <>\n                <Item\n                    icon={<Item.Icon label={\"Billing\"} element={<CreditCard />} />}\n                    text={\"Billing\"}\n                />\n                <Item\n                    icon={<Item.Icon label={\"Settings\"} element={<Settings />} />}\n                    text={\"Settings\"}\n                />\n                <Item\n                    icon={<Item.Icon label={\"Keyboard shortcuts\"} element={<Keyboard />} />}\n                    text={\"Keyboard shortcuts\"}\n                />\n            </>\n        )\n    },\n    argTypes: {}\n};\n\nexport const WithSubMenus: Story = {\n    args: {\n        trigger: <Button variant=\"primary\" text={\"Open\"} />,\n        children: (\n            <>\n                <Label text={\"My Account\"} />\n                <Item icon={<Item.Icon element={<User />} label={\"Profile\"} />} text={\"Profile\"} />\n                <Group>\n                    <Item\n                        icon={<Item.Icon label={\"Billing\"} element={<CreditCard />} />}\n                        text={\"Billing\"}\n                    />\n                    <Item\n                        icon={<Item.Icon label={\"Settings\"} element={<Settings />} />}\n                        text={\"Settings\"}\n                    />\n                    <Item\n                        icon={<Item.Icon label={\"Keyboard shortcuts\"} element={<Keyboard />} />}\n                        text={\"Keyboard shortcuts\"}\n                    />\n                </Group>\n                <Separator />\n                <Group>\n                    <Item icon={<Item.Icon label={\"Team\"} element={<Users />} />} text={\"Team\"} />\n                    <Item\n                        icon={<Item.Icon label={\"Invite user\"} element={<UserPlus />} />}\n                        text={\"Invite users\"}\n                    >\n                        <Item\n                            icon={<Item.Icon label={\"Email\"} element={<Mail />} />}\n                            text={\"Email\"}\n                        />\n                        <Item\n                            icon={<Item.Icon label={\"Message\"} element={<MessageSquare />} />}\n                            text={\"Message\"}\n                        />\n                        <Separator />\n                        <Item\n                            icon={<Item.Icon label={\"More...\"} element={<PlusCircle />} />}\n                            text={\"More...\"}\n                        >\n                            <Item\n                                icon={<Item.Icon label={\"Email\"} element={<Mail />} />}\n                                text={\"Email\"}\n                            />\n                            <Item\n                                icon={<Item.Icon label={\"Message\"} element={<MessageSquare />} />}\n                                text={\"Message\"}\n                            />\n                            <Separator />\n                            <Item\n                                icon={<Item.Icon label={\"More...\"} element={<PlusCircle />} />}\n                                text={\"More...\"}\n                            />\n                        </Item>\n                    </Item>\n                    <Item\n                        icon={<Item.Icon label={\"New Team\"} element={<Plus />} />}\n                        text={\"New Team\"}\n                    />\n                </Group>\n                <Separator />\n                <Item\n                    icon={<Item.Icon label={\"Support\"} element={<LifeBuoy />} />}\n                    text={\"Support\"}\n                />\n                <Item\n                    icon={<Item.Icon label={\"API\"} element={<Cloud />} />}\n                    text={\"API\"}\n                    disabled\n                />\n                <Separator />\n                <Item\n                    icon={<Item.Icon label={\"Log out\"} element={<LogOut />} />}\n                    text={\"Log out\"}\n                />\n            </>\n        )\n    },\n    argTypes: {}\n};\n\nconst TARGET_LEVELS = [\n    {\n        id: \"viewer\",\n        label: \"Viewer\",\n        description: \"Can view content, but not modify it\"\n    },\n    {\n        id: \"editor\",\n        label: \"Editor\",\n        description: \"Can view and modify content\"\n    },\n    {\n        id: \"owner\",\n        label: \"Owner\",\n        description: \"Can edit and manage content permissions\"\n    }\n];\n\nexport const WithCheckboxItems: Story = {\n    args: {\n        trigger: <Button variant=\"primary\" text={\"Open\"} />,\n        children: (\n            <>\n                {TARGET_LEVELS.map(level => (\n                    <CheckboxItem\n                        key={level.id}\n                        checked={level.id === \"viewer\"}\n                        text={\n                            <div>\n                                <Text as={\"div\"}>{level.label}</Text>\n                                <Text as={\"div\"} size={\"sm\"} className={\"text-neutral-strong\"}>\n                                    {level.description}\n                                </Text>\n                            </div>\n                        }\n                        onClick={() => {\n                            console.log(\"Selected level:\", level.id);\n                        }}\n                    />\n                ))}\n                <DropdownMenu.Separator />\n                <DropdownMenu.Item text={\"Remove access\"} />\n            </>\n        )\n    },\n    argTypes: {}\n};\n\nexport const WithOnOpenChange: Story = {\n    args: {\n        trigger: <Button variant=\"primary\" text={\"Open\"} />,\n        onOpenChange: opened => {\n            console.log(`Menu is ${opened ? \"opened\" : \"closed\"}.`);\n        },\n        children: (\n            <>\n                <Item\n                    icon={<Item.Icon element={<CreditCard />} label={\"Billing\"} />}\n                    text={\"Billing\"}\n                />\n                <Item\n                    icon={<Item.Icon element={<Settings />} label={\"Settings\"} />}\n                    text={\"Settings\"}\n                />\n                <Item\n                    icon={<Item.Icon element={<Keyboard />} label={\"Keyboard shortcuts\"} />}\n                    text={\"Keyboard shortcuts\"}\n                />\n            </>\n        )\n    },\n    argTypes: {}\n};\n\nexport const Documentation: Story = {\n    args: {\n        trigger: <Button variant=\"primary\" text={\"Open\"} />,\n        children: (\n            <>\n                <Label text={\"My Account\"} />\n                <Item icon={<Item.Icon label={\"Profile\"} element={<User />} />} text={\"Profile\"} />\n                <Group>\n                    <Item\n                        icon={<Item.Icon element={<CreditCard />} label={\"Billing\"} />}\n                        text={\"Billing\"}\n                    />\n                    <Item\n                        icon={<Item.Icon element={<Settings />} label={\"Settings\"} />}\n                        text={\"Settings\"}\n                    />\n                    <Item\n                        icon={<Item.Icon element={<Keyboard />} label={\"Keyboard shortcuts\"} />}\n                        text={\"Keyboard shortcuts\"}\n                    />\n                </Group>\n                <Separator />\n                <Group>\n                    <Item icon={<Item.Icon element={<Users />} label={\"Team\"} />} text={\"Team\"} />\n                    <Item\n                        icon={<Item.Icon element={<UserPlus />} label={\"Invite users\"} />}\n                        text={\"Invite users\"}\n                    >\n                        <Item\n                            icon={<Item.Icon element={<Mail />} label={\"Email\"} />}\n                            text={\"Email\"}\n                        />\n                        <Item\n                            icon={<Item.Icon element={<MessageSquare />} label={\"Message\"} />}\n                            text={\"Message\"}\n                        />\n                        <Separator />\n                        <Item\n                            icon={<Item.Icon label={\"More...\"} element={<PlusCircle />} />}\n                            text={\"More...\"}\n                        />\n                    </Item>\n                    <Item\n                        icon={<Item.Icon label={\"New Team\"} element={<Plus />} />}\n                        text={\"New Team\"}\n                    />\n                </Group>\n                <Separator />\n                <Item\n                    icon={<Item.Icon label={\"Support\"} element={<LifeBuoy />} />}\n                    text={\"Support\"}\n                />\n                <Item\n                    icon={<Item.Icon label={\"API\"} element={<Cloud />} />}\n                    text={\"API\"}\n                    disabled\n                />\n                <Separator />\n                <Item\n                    icon={<Item.Icon label={\"Log out\"} element={<LogOut />} />}\n                    text={\"Log out\"}\n                />\n                <Separator />\n                <Label text={\"Links\"} />\n                <Link\n                    text={\"Link 1\"}\n                    to={\"#link-1\"}\n                    icon={<Link.Icon label=\"Link 1\" element={<LinkIcon />} />}\n                />\n                <Link\n                    text={\"Link 2\"}\n                    to={\"#link-2\"}\n                    icon={<Link.Icon label=\"Link 2\" element={<LinkIcon />} />}\n                />\n                <Link\n                    text={\"Link 3\"}\n                    to={\"#link-3\"}\n                    icon={<Link.Icon label=\"Link 3\" element={<LinkIcon />} />}\n                />\n            </>\n        )\n    },\n    argTypes: {\n        trigger: {\n            description:\n                \"The trigger element that opens the menu. Please refer to the example code for details.\"\n        },\n        children: {\n            description: \"The content of the menu. Please refer to the example code for details.\"\n        }\n    }\n};\n"],"names":["meta","DropdownMenu","Label","Separator","Group","Item","Link","CheckboxItem","Default","Button","User","CreditCard","Settings","Keyboard","Users","UserPlus","Mail","MessageSquare","PlusCircle","Plus","LifeBuoy","Cloud","LogOut","LinkIcon","SimpleMenuWithIcons","WithSubMenus","TARGET_LEVELS","WithCheckboxItems","level","Text","console","WithOnOpenChange","opened","Documentation"],"mappings":"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"}

package/DropdownMenu/components/DropdownMenuItem.d.ts

@@ -1,12 +1,18 @@
 import * as React from "react";
-import { type DropdownMenuItemIconProps } from "./DropdownMenuItemIcon.js";
+import { DropdownMenuItemIcon, type DropdownMenuItemIconProps } from "./DropdownMenuItemIcon.js";
 import { LinkComponentProps } from "../../index.js";
 interface DropdownMenuItemBaseProps {
     icon?: React.ReactNode;
     readOnly?: boolean;
+    variant?: "destructive";
     text?: React.ReactNode;
     disabled?: boolean;
     onClick?: React.MouseEventHandler;
+    /**
+     * Keep the menu open after selecting this item. Useful for items that toggle a value
+     * (e.g. a checkbox), where the user expects to make multiple selections in one session.
+     */
+    preventClose?: boolean;
 }
 type DropdownMenuItemButtonProps = (DropdownMenuItemBaseProps & React.HTMLAttributes<HTMLDivElement>) & {
     to?: never;
@@ -32,6 +38,6 @@ declare const DropdownMenuItem: React.ForwardRefExoticComponent<DropdownMenuItem
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;
 } & {
-    Icon: (props: DropdownMenuItemIconProps) => React.JSX.Element;
+    Icon: typeof DropdownMenuItemIcon;
 };
 export { DropdownMenuItem, type DropdownMenuItemProps, type DropdownMenuItemButtonProps, type DropdownMenuItemLinkProps, type DropdownMenuItemIconProps };

package/DropdownMenu/components/DropdownMenuItem.js

@@ -16,6 +16,12 @@ const variants = cva([
     "[&_a]:no-underline! [&_a]:text-neutral-primary!"
 ], {
     variants: {
+        variant: {
+            destructive: [
+                "text-destructive-primary!",
+                "[&_svg]:fill-destructive"
+            ]
+        },
         readOnly: {
             true: "pointer-events-none"
         }
@@ -24,7 +30,7 @@ const variants = cva([
         readOnly: false
     }
 });
-const DropdownMenuItemBase = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, icon, text, readOnly, disabled, onClick, children, ...linkProps }, ref)=>{
+const DropdownMenuItemBase = /*#__PURE__*/ __rspack_external_react.forwardRef(({ className, icon, text, readOnly, variant, disabled, onClick, preventClose, children, ...linkProps }, ref)=>{
     const { linkComponent: LinkComponent } = useAdminUi();
     if (children) return /*#__PURE__*/ __rspack_external_react.createElement(DropdownMenuSubRoot, null, /*#__PURE__*/ __rspack_external_react.createElement(DropdownMenuSubTrigger, null, icon, /*#__PURE__*/ __rspack_external_react.createElement("span", null, text)), /*#__PURE__*/ __rspack_external_react.createElement(DropdownMenuPortal, null, /*#__PURE__*/ __rspack_external_react.createElement(DropdownMenuSubContent, null, children)));
     const sharedProps = {
@@ -43,8 +49,10 @@ const DropdownMenuItemBase = /*#__PURE__*/ __rspack_external_react.forwardRef(({
         disabled: disabled,
         ref: ref,
         className: cn(variants({
-            readOnly
-        }), className)
+            readOnly,
+            variant
+        }), className),
+        onSelect: preventClose ? (event)=>event.preventDefault() : void 0
     }, content);
 });
 DropdownMenuItemBase.displayName = DropdownMenu.Item.displayName;

package/DropdownMenu/components/DropdownMenuItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownMenu/components/DropdownMenuItem.js","sources":["../../../src/DropdownMenu/components/DropdownMenuItem.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { DropdownMenu as DropdownMenuPrimitive } from \"radix-ui\";\nimport { cn, cva, makeDecoratable } from \"~/utils.js\";\nimport { DropdownMenuSubRoot } from \"./DropdownMenuSubRoot.js\";\nimport { DropdownMenuSubTrigger } from \"./DropdownMenuSubTrigger.js\";\nimport { DropdownMenuPortal } from \"./DropdownMenuPortal.js\";\nimport { DropdownMenuSubContent } from \"./DropdownMenuSubContent.js\";\nimport { DropdownMenuItemIcon, type DropdownMenuItemIconProps } from \"./DropdownMenuItemIcon.js\";\nimport { LinkComponentProps, useAdminUi } from \"~/index.js\";\n\ninterface DropdownMenuItemBaseProps {\n    icon?: React.ReactNode;\n    readOnly?: boolean;\n    text?: React.ReactNode;\n    disabled?: boolean;\n    onClick?: React.MouseEventHandler;\n}\n\ntype DropdownMenuItemButtonProps = (DropdownMenuItemBaseProps &\n    React.HTMLAttributes<HTMLDivElement>) & { to?: never };\ntype DropdownMenuItemLinkProps = DropdownMenuItemBaseProps & LinkComponentProps;\n\ntype DropdownMenuItemProps = DropdownMenuItemButtonProps | DropdownMenuItemLinkProps;\n\nconst variants = cva(\n    [\n        \"group relative cursor-default select-none items-center rounded-sm\",\n        \"text-md text-neutral-primary no-underline!\",\n        \"px-xs-plus outline-none transition-colors\",\n        \"[&_svg]:fill-neutral-xstrong [&_svg]:pointer-events-none [&_svg]:size-md [&_svg]:shrink-0\",\n        \"data-disabled:pointer-events-none data-disabled:text-neutral-disabled\",\n        \"[&_a]:no-underline! [&_a]:text-neutral-primary!\"\n    ],\n    {\n        variants: {\n            readOnly: {\n                true: \"pointer-events-none\"\n            }\n        },\n        defaultVariants: {\n            readOnly: false\n        }\n    }\n);\n\nconst DropdownMenuItemBase = React.forwardRef<\n    React.ElementRef<typeof DropdownMenuPrimitive.Item>,\n    DropdownMenuItemProps\n>(({ className, icon, text, readOnly, disabled, onClick, children, ...linkProps }, ref) => {\n    const { linkComponent: LinkComponent } = useAdminUi();\n\n    if (children) {\n        return (\n            <DropdownMenuSubRoot>\n                <DropdownMenuSubTrigger>\n                    {icon}\n                    <span>{text}</span>\n                </DropdownMenuSubTrigger>\n                <DropdownMenuPortal>\n                    <DropdownMenuSubContent>{children}</DropdownMenuSubContent>\n                </DropdownMenuPortal>\n            </DropdownMenuSubRoot>\n        );\n    }\n    const sharedProps = {\n        className: cn(\n            \"flex px-sm py-xs-plus gap-sm-extra items-center text-md rounded-sm transition-colors group-focus:bg-neutral-dimmed\",\n            {\n                \"[&_svg]:fill-neutral-disabled!\": disabled\n            }\n        )\n    };\n\n    const content = linkProps.to ? (\n        <LinkComponent {...sharedProps} {...linkProps}>\n            {icon}\n            <span>{text}</span>\n        </LinkComponent>\n    ) : (\n        <div {...sharedProps} onClick={onClick}>\n            {icon}\n            <span>{text}</span>\n        </div>\n    );\n\n    return (\n        <DropdownMenuPrimitive.Item\n            disabled={disabled}\n            ref={ref}\n            className={cn(variants({ readOnly }), className)}\n        >\n            {content}\n        </DropdownMenuPrimitive.Item>\n    );\n});\n\nDropdownMenuItemBase.displayName = DropdownMenuPrimitive.Item.displayName;\n\nconst DecoratableDropdownMenuItem = makeDecoratable(\"DropdownMenuItem\", DropdownMenuItemBase);\n\nconst DropdownMenuItem = Object.assign(DecoratableDropdownMenuItem, {\n    Icon: DropdownMenuItemIcon\n});\n\nexport {\n    DropdownMenuItem,\n    type DropdownMenuItemProps,\n    type DropdownMenuItemButtonProps,\n    type DropdownMenuItemLinkProps,\n    type DropdownMenuItemIconProps\n};\n"],"names":["variants","cva","DropdownMenuItemBase","React","className","icon","text","readOnly","disabled","onClick","children","linkProps","ref","LinkComponent","useAdminUi","DropdownMenuSubRoot","DropdownMenuSubTrigger","DropdownMenuPortal","DropdownMenuSubContent","sharedProps","cn","content","DropdownMenuPrimitive","DecoratableDropdownMenuItem","makeDecoratable","DropdownMenuItem","Object","DropdownMenuItemIcon"],"mappings":";;;;;;;;;AAwBA,MAAMA,WAAWC,IACb;IACI;IACA;IACA;IACA;IACA;IACA;CACH,EACD;IACI,UAAU;QACN,UAAU;YACN,MAAM;QACV;IACJ;IACA,iBAAiB;QACb,UAAU;IACd;AACJ;AAGJ,MAAMC,uBAAuB,WAAHA,GAAGC,wBAAAA,UAAgB,CAG3C,CAAC,EAAEC,SAAS,EAAEC,IAAI,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,OAAO,EAAEC,QAAQ,EAAE,GAAGC,WAAW,EAAEC;IAC/E,MAAM,EAAE,eAAeC,aAAa,EAAE,GAAGC;IAEzC,IAAIJ,UACA,OAAO,WAAP,GACI,sCAACK,qBAAmBA,MAAAA,WAAAA,GAChB,sCAACC,wBAAsBA,MAClBX,MAAAA,WAAAA,GACD,sCAAC,cAAMC,QAAAA,WAAAA,GAEX,sCAACW,oBAAkBA,MAAAA,WAAAA,GACf,sCAACC,wBAAsBA,MAAER;IAKzC,MAAMS,cAAc;QAChB,WAAWC,GACP,sHACA;YACI,kCAAkCZ;QACtC;IAER;IAEA,MAAMa,UAAUV,UAAU,EAAE,GAAG,WAAH,GACxB,sCAACE,eAAAA;QAAe,GAAGM,WAAW;QAAG,GAAGR,SAAS;OACxCN,MAAAA,WAAAA,GACD,sCAAC,cAAMC,SAAAA,WAAAA,GAGX,sCAAC;QAAK,GAAGa,WAAW;QAAE,SAASV;OAC1BJ,MAAAA,WAAAA,GACD,sCAAC,cAAMC;IAIf,OAAO,WAAP,GACI,sCAACgB,aAAAA,IAA0B;QACvB,UAAUd;QACV,KAAKI;QACL,WAAWQ,GAAGpB,SAAS;YAAEO;QAAS,IAAIH;OAErCiB;AAGb;AAEAnB,qBAAqB,WAAW,GAAGoB,aAAAA,IAAAA,CAAAA,WAAsC;AAEzE,MAAMC,8BAA8BC,gBAAgB,oBAAoBtB;AAExE,MAAMuB,mBAAmBC,OAAO,MAAM,CAACH,6BAA6B;IAChE,MAAMI;AACV"}
+{"version":3,"file":"DropdownMenu/components/DropdownMenuItem.js","sources":["../../../src/DropdownMenu/components/DropdownMenuItem.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { DropdownMenu as DropdownMenuPrimitive } from \"radix-ui\";\nimport { cn, cva, makeDecoratable } from \"~/utils.js\";\nimport { DropdownMenuSubRoot } from \"./DropdownMenuSubRoot.js\";\nimport { DropdownMenuSubTrigger } from \"./DropdownMenuSubTrigger.js\";\nimport { DropdownMenuPortal } from \"./DropdownMenuPortal.js\";\nimport { DropdownMenuSubContent } from \"./DropdownMenuSubContent.js\";\nimport { DropdownMenuItemIcon, type DropdownMenuItemIconProps } from \"./DropdownMenuItemIcon.js\";\nimport { LinkComponentProps, useAdminUi } from \"~/index.js\";\n\ninterface DropdownMenuItemBaseProps {\n    icon?: React.ReactNode;\n    readOnly?: boolean;\n    variant?: \"destructive\";\n    text?: React.ReactNode;\n    disabled?: boolean;\n    onClick?: React.MouseEventHandler;\n    /**\n     * Keep the menu open after selecting this item. Useful for items that toggle a value\n     * (e.g. a checkbox), where the user expects to make multiple selections in one session.\n     */\n    preventClose?: boolean;\n}\n\ntype DropdownMenuItemButtonProps = (DropdownMenuItemBaseProps &\n    React.HTMLAttributes<HTMLDivElement>) & { to?: never };\ntype DropdownMenuItemLinkProps = DropdownMenuItemBaseProps & LinkComponentProps;\n\ntype DropdownMenuItemProps = DropdownMenuItemButtonProps | DropdownMenuItemLinkProps;\n\nconst variants = cva(\n    [\n        \"group relative cursor-default select-none items-center rounded-sm\",\n        \"text-md text-neutral-primary no-underline!\",\n        \"px-xs-plus outline-none transition-colors\",\n        \"[&_svg]:fill-neutral-xstrong [&_svg]:pointer-events-none [&_svg]:size-md [&_svg]:shrink-0\",\n        \"data-disabled:pointer-events-none data-disabled:text-neutral-disabled\",\n        \"[&_a]:no-underline! [&_a]:text-neutral-primary!\"\n    ],\n    {\n        variants: {\n            variant: {\n                destructive: [\"text-destructive-primary!\", \"[&_svg]:fill-destructive\"]\n            },\n            readOnly: {\n                true: \"pointer-events-none\"\n            }\n        },\n        defaultVariants: {\n            readOnly: false\n        }\n    }\n);\n\nconst DropdownMenuItemBase = React.forwardRef<\n    React.ElementRef<typeof DropdownMenuPrimitive.Item>,\n    DropdownMenuItemProps\n>(\n    (\n        {\n            className,\n            icon,\n            text,\n            readOnly,\n            variant,\n            disabled,\n            onClick,\n            preventClose,\n            children,\n            ...linkProps\n        },\n        ref\n    ) => {\n        const { linkComponent: LinkComponent } = useAdminUi();\n\n        if (children) {\n            return (\n                <DropdownMenuSubRoot>\n                    <DropdownMenuSubTrigger>\n                        {icon}\n                        <span>{text}</span>\n                    </DropdownMenuSubTrigger>\n                    <DropdownMenuPortal>\n                        <DropdownMenuSubContent>{children}</DropdownMenuSubContent>\n                    </DropdownMenuPortal>\n                </DropdownMenuSubRoot>\n            );\n        }\n        const sharedProps = {\n            className: cn(\n                \"flex px-sm py-xs-plus gap-sm-extra items-center text-md rounded-sm transition-colors group-focus:bg-neutral-dimmed\",\n                {\n                    \"[&_svg]:fill-neutral-disabled!\": disabled\n                }\n            )\n        };\n\n        const content = linkProps.to ? (\n            <LinkComponent {...sharedProps} {...linkProps}>\n                {icon}\n                <span>{text}</span>\n            </LinkComponent>\n        ) : (\n            <div {...sharedProps} onClick={onClick}>\n                {icon}\n                <span>{text}</span>\n            </div>\n        );\n\n        return (\n            <DropdownMenuPrimitive.Item\n                disabled={disabled}\n                ref={ref}\n                className={cn(variants({ readOnly, variant }), className)}\n                onSelect={preventClose ? event => event.preventDefault() : undefined}\n            >\n                {content}\n            </DropdownMenuPrimitive.Item>\n        );\n    }\n);\n\nDropdownMenuItemBase.displayName = DropdownMenuPrimitive.Item.displayName;\n\nconst DecoratableDropdownMenuItem = makeDecoratable(\"DropdownMenuItem\", DropdownMenuItemBase);\n\nconst DropdownMenuItem = Object.assign(DecoratableDropdownMenuItem, {\n    Icon: DropdownMenuItemIcon\n});\n\nexport {\n    DropdownMenuItem,\n    type DropdownMenuItemProps,\n    type DropdownMenuItemButtonProps,\n    type DropdownMenuItemLinkProps,\n    type DropdownMenuItemIconProps\n};\n"],"names":["variants","cva","DropdownMenuItemBase","React","className","icon","text","readOnly","variant","disabled","onClick","preventClose","children","linkProps","ref","LinkComponent","useAdminUi","DropdownMenuSubRoot","DropdownMenuSubTrigger","DropdownMenuPortal","DropdownMenuSubContent","sharedProps","cn","content","DropdownMenuPrimitive","event","undefined","DecoratableDropdownMenuItem","makeDecoratable","DropdownMenuItem","Object","DropdownMenuItemIcon"],"mappings":";;;;;;;;;AA8BA,MAAMA,WAAWC,IACb;IACI;IACA;IACA;IACA;IACA;IACA;CACH,EACD;IACI,UAAU;QACN,SAAS;YACL,aAAa;gBAAC;gBAA6B;aAA2B;QAC1E;QACA,UAAU;YACN,MAAM;QACV;IACJ;IACA,iBAAiB;QACb,UAAU;IACd;AACJ;AAGJ,MAAMC,uBAAuB,WAAHA,GAAGC,wBAAAA,UAAgB,CAIzC,CACI,EACIC,SAAS,EACTC,IAAI,EACJC,IAAI,EACJC,QAAQ,EACRC,OAAO,EACPC,QAAQ,EACRC,OAAO,EACPC,YAAY,EACZC,QAAQ,EACR,GAAGC,WACN,EACDC;IAEA,MAAM,EAAE,eAAeC,aAAa,EAAE,GAAGC;IAEzC,IAAIJ,UACA,OAAO,WAAP,GACI,sCAACK,qBAAmBA,MAAAA,WAAAA,GAChB,sCAACC,wBAAsBA,MAClBb,MAAAA,WAAAA,GACD,sCAAC,cAAMC,QAAAA,WAAAA,GAEX,sCAACa,oBAAkBA,MAAAA,WAAAA,GACf,sCAACC,wBAAsBA,MAAER;IAKzC,MAAMS,cAAc;QAChB,WAAWC,GACP,sHACA;YACI,kCAAkCb;QACtC;IAER;IAEA,MAAMc,UAAUV,UAAU,EAAE,GAAG,WAAH,GACxB,sCAACE,eAAAA;QAAe,GAAGM,WAAW;QAAG,GAAGR,SAAS;OACxCR,MAAAA,WAAAA,GACD,sCAAC,cAAMC,SAAAA,WAAAA,GAGX,sCAAC;QAAK,GAAGe,WAAW;QAAE,SAASX;OAC1BL,MAAAA,WAAAA,GACD,sCAAC,cAAMC;IAIf,OAAO,WAAP,GACI,sCAACkB,aAAAA,IAA0B;QACvB,UAAUf;QACV,KAAKK;QACL,WAAWQ,GAAGtB,SAAS;YAAEO;YAAUC;QAAQ,IAAIJ;QAC/C,UAAUO,eAAec,CAAAA,QAASA,MAAM,cAAc,KAAKC;OAE1DH;AAGb;AAGJrB,qBAAqB,WAAW,GAAGsB,aAAAA,IAAAA,CAAAA,WAAsC;AAEzE,MAAMG,8BAA8BC,gBAAgB,oBAAoB1B;AAExE,MAAM2B,mBAAmBC,OAAO,MAAM,CAACH,6BAA6B;IAChE,MAAMI;AACV"}

package/DropdownMenu/components/DropdownMenuLink.d.ts

@@ -1,26 +1,27 @@
 import React from "react";
 import { type DropdownMenuItemLinkProps } from "./DropdownMenuItem.js";
-import { type DropdownMenuItemIconProps } from "./DropdownMenuItemIcon.js";
+import { DropdownMenuItemIcon, type DropdownMenuItemIconProps } from "./DropdownMenuItemIcon.js";
 export type DropdownMenuLinkProps = DropdownMenuItemLinkProps;
-declare const DropdownMenuLink: ((props: DropdownMenuLinkProps) => React.JSX.Element) & {
-    original: (props: DropdownMenuLinkProps) => React.JSX.Element;
+declare const DropdownMenuLinkBase: (props: DropdownMenuLinkProps) => React.JSX.Element;
+declare const DropdownMenuLink: typeof DropdownMenuLinkBase & {
+    original: typeof DropdownMenuLinkBase;
     originalName: string;
     displayName: string;
 } & {
-    original: ((props: DropdownMenuLinkProps) => React.JSX.Element) & {
-        original: (props: DropdownMenuLinkProps) => React.JSX.Element;
+    original: typeof DropdownMenuLinkBase & {
+        original: typeof DropdownMenuLinkBase;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<((props: DropdownMenuLinkProps) => React.JSX.Element) & {
-        original: (props: DropdownMenuLinkProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DropdownMenuLinkBase & {
+        original: typeof DropdownMenuLinkBase;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;
 } & {
-    Icon: (props: DropdownMenuItemIconProps) => React.JSX.Element;
+    Icon: typeof DropdownMenuItemIcon;
 };
 export { DropdownMenuLink, type DropdownMenuItemLinkProps, type DropdownMenuItemIconProps };

package/DropdownMenu/components/DropdownMenuSeparator.d.ts

@@ -1,21 +1,22 @@
 import * as React from "react";
 import { type SeparatorProps } from "../../Separator/index.js";
 type DropdownMenuSeparatorProps = SeparatorProps;
-declare const DropdownMenuSeparator: ((props: DropdownMenuSeparatorProps) => React.JSX.Element) & {
-    original: (props: DropdownMenuSeparatorProps) => React.JSX.Element;
+declare const DropdownMenuSeparatorBase: (props: DropdownMenuSeparatorProps) => React.JSX.Element;
+declare const DropdownMenuSeparator: typeof DropdownMenuSeparatorBase & {
+    original: typeof DropdownMenuSeparatorBase;
     originalName: string;
     displayName: string;
 } & {
-    original: ((props: DropdownMenuSeparatorProps) => React.JSX.Element) & {
-        original: (props: DropdownMenuSeparatorProps) => React.JSX.Element;
+    original: typeof DropdownMenuSeparatorBase & {
+        original: typeof DropdownMenuSeparatorBase;
         originalName: string;
         displayName: string;
     };
     originalName: string;
     displayName: string;
 } & {
-    createDecorator: (decorator: import("@webiny/react-composition/types").ComponentDecorator<((props: DropdownMenuSeparatorProps) => React.JSX.Element) & {
-        original: (props: DropdownMenuSeparatorProps) => React.JSX.Element;
+    createDecorator: (decorator: import("@webiny/react-composition/types").ComponentDecorator<typeof DropdownMenuSeparatorBase & {
+        original: typeof DropdownMenuSeparatorBase;
         originalName: string;
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;

package/EditableTitle/EditableTitle.d.ts

@@ -0,0 +1,67 @@
+import React from "react";
+interface EditableTitleProps {
+    /**
+     * The current title value.
+     */
+    value: string;
+    /**
+     * Called with the new value when editing is committed (blur or Enter).
+     */
+    onCommit: (value: string) => void;
+    /**
+     * If true, the title is rendered as plain (non-editable) text.
+     */
+    readOnly?: boolean;
+    /**
+     * Placeholder shown in the input while editing.
+     */
+    placeholder?: string;
+    /**
+     * Focus the input when entering edit mode. Defaults to `true`.
+     */
+    autoFocus?: boolean;
+    /**
+     * Select the input's content when entering edit mode. Defaults to `true`.
+     */
+    autoSelect?: boolean;
+    /**
+     * Content rendered before the title (e.g. a language tag).
+     */
+    startContent?: React.ReactNode;
+    /**
+     * Tooltip content shown when hovering the resting title.
+     */
+    tooltip?: React.ReactNode;
+    /**
+     * Controls the editing state. When provided, the component is controlled
+     * and `onEditingChange` must be used to react to state changes.
+     */
+    isEditing?: boolean;
+    /**
+     * Called whenever the editing state should change.
+     */
+    onEditingChange?: (editing: boolean) => void;
+    className?: string;
+    "data-testid"?: string;
+}
+declare const DecoratableEditableTitle: ({ value, onCommit, readOnly, placeholder, autoFocus, autoSelect, startContent, tooltip, isEditing: controlledEditing, onEditingChange, className, "data-testid": dataTestId }: EditableTitleProps) => React.JSX.Element;
+declare const EditableTitle: typeof DecoratableEditableTitle & {
+    original: typeof DecoratableEditableTitle;
+    originalName: string;
+    displayName: string;
+} & {
+    original: typeof DecoratableEditableTitle & {
+        original: typeof DecoratableEditableTitle;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/react-composition/types").ComponentDecorator<typeof DecoratableEditableTitle & {
+        original: typeof DecoratableEditableTitle;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};
+export { EditableTitle, type EditableTitleProps };

package/EditableTitle/EditableTitle.js

@@ -0,0 +1,73 @@
+import react, { useCallback, useState } from "react";
+import { Heading } from "../Heading/index.js";
+import { Input } from "../Input/index.js";
+import { Tooltip } from "../Tooltip/index.js";
+import { cn, makeDecoratable } from "../utils.js";
+const DecoratableEditableTitle = ({ value, onCommit, readOnly, placeholder, autoFocus = true, autoSelect = true, startContent, tooltip, isEditing: controlledEditing, onEditingChange, className, "data-testid": dataTestId })=>{
+    const isControlled = void 0 !== controlledEditing;
+    const [uncontrolledEditing, setUncontrolledEditing] = useState(false);
+    const [localValue, setLocalValue] = useState();
+    const isEditing = isControlled ? controlledEditing : uncontrolledEditing;
+    const setEditing = useCallback((editing)=>{
+        if (!isControlled) setUncontrolledEditing(editing);
+        onEditingChange?.(editing);
+    }, [
+        isControlled,
+        onEditingChange
+    ]);
+    const startEditing = useCallback(()=>{
+        setLocalValue(value);
+        setEditing(true);
+    }, [
+        value,
+        setEditing
+    ]);
+    const commit = useCallback((next)=>{
+        onCommit(next);
+        setLocalValue(void 0);
+        setEditing(false);
+    }, [
+        onCommit,
+        setEditing
+    ]);
+    const cancel = useCallback(()=>{
+        setLocalValue(void 0);
+        setEditing(false);
+    }, [
+        setEditing
+    ]);
+    const wrapper = (children)=>/*#__PURE__*/ react.createElement("div", {
+            className: cn("flex min-w-0 flex-row items-center gap-sm", className)
+        }, startContent, children);
+    if (readOnly) return wrapper(/*#__PURE__*/ react.createElement(Heading, {
+        level: 5,
+        className: "text-accent-primary truncate px-sm-extra py-xs-plus",
+        "data-testid": dataTestId
+    }, value));
+    if (isEditing) return wrapper(/*#__PURE__*/ react.createElement(Input, {
+        autoFocus: autoFocus,
+        autoSelect: autoSelect,
+        size: "md",
+        variant: "secondary",
+        placeholder: placeholder,
+        value: localValue ?? value,
+        onChange: setLocalValue,
+        onBlur: (e)=>commit(e.currentTarget.value),
+        onEnter: (e)=>commit(e.currentTarget.value),
+        onEscape: cancel
+    }));
+    const trigger = /*#__PURE__*/ react.createElement("div", {
+        onClick: startEditing,
+        "data-testid": dataTestId,
+        className: cn("font-sans text-h5 cursor-pointer truncate rounded-md", "px-[calc(var(--padding-sm-extra)-var(--border-width-sm))] py-[calc(var(--padding-xs)-var(--border-width-sm))]", "border-sm border-transparent text-accent-primary", "hover:bg-neutral-light")
+    }, value);
+    return wrapper(tooltip ? /*#__PURE__*/ react.createElement(Tooltip, {
+        side: "bottom",
+        content: tooltip,
+        trigger: trigger
+    }) : trigger);
+};
+const EditableTitle = makeDecoratable("EditableTitle", DecoratableEditableTitle);
+export { EditableTitle };
+
+//# sourceMappingURL=EditableTitle.js.map

package/EditableTitle/EditableTitle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditableTitle/EditableTitle.js","sources":["../../src/EditableTitle/EditableTitle.tsx"],"sourcesContent":["import React, { useCallback, useState } from \"react\";\nimport { Heading } from \"~/Heading/index.js\";\nimport { Input } from \"~/Input/index.js\";\nimport { Tooltip } from \"~/Tooltip/index.js\";\nimport { cn, makeDecoratable } from \"~/utils.js\";\n\ninterface EditableTitleProps {\n    /**\n     * The current title value.\n     */\n    value: string;\n    /**\n     * Called with the new value when editing is committed (blur or Enter).\n     */\n    onCommit: (value: string) => void;\n    /**\n     * If true, the title is rendered as plain (non-editable) text.\n     */\n    readOnly?: boolean;\n    /**\n     * Placeholder shown in the input while editing.\n     */\n    placeholder?: string;\n    /**\n     * Focus the input when entering edit mode. Defaults to `true`.\n     */\n    autoFocus?: boolean;\n    /**\n     * Select the input's content when entering edit mode. Defaults to `true`.\n     */\n    autoSelect?: boolean;\n    /**\n     * Content rendered before the title (e.g. a language tag).\n     */\n    startContent?: React.ReactNode;\n    /**\n     * Tooltip content shown when hovering the resting title.\n     */\n    tooltip?: React.ReactNode;\n    /**\n     * Controls the editing state. When provided, the component is controlled\n     * and `onEditingChange` must be used to react to state changes.\n     */\n    isEditing?: boolean;\n    /**\n     * Called whenever the editing state should change.\n     */\n    onEditingChange?: (editing: boolean) => void;\n    className?: string;\n    \"data-testid\"?: string;\n}\n\nconst DecoratableEditableTitle = ({\n    value,\n    onCommit,\n    readOnly,\n    placeholder,\n    autoFocus = true,\n    autoSelect = true,\n    startContent,\n    tooltip,\n    isEditing: controlledEditing,\n    onEditingChange,\n    className,\n    \"data-testid\": dataTestId\n}: EditableTitleProps) => {\n    const isControlled = controlledEditing !== undefined;\n    const [uncontrolledEditing, setUncontrolledEditing] = useState(false);\n    const [localValue, setLocalValue] = useState<string | undefined>();\n\n    const isEditing = isControlled ? controlledEditing : uncontrolledEditing;\n\n    const setEditing = useCallback(\n        (editing: boolean) => {\n            if (!isControlled) {\n                setUncontrolledEditing(editing);\n            }\n            onEditingChange?.(editing);\n        },\n        [isControlled, onEditingChange]\n    );\n\n    const startEditing = useCallback(() => {\n        setLocalValue(value);\n        setEditing(true);\n    }, [value, setEditing]);\n\n    const commit = useCallback(\n        (next: string) => {\n            onCommit(next);\n            setLocalValue(undefined);\n            setEditing(false);\n        },\n        [onCommit, setEditing]\n    );\n\n    const cancel = useCallback(() => {\n        setLocalValue(undefined);\n        setEditing(false);\n    }, [setEditing]);\n\n    const wrapper = (children: React.ReactNode) => (\n        <div className={cn(\"flex min-w-0 flex-row items-center gap-sm\", className)}>\n            {startContent}\n            {children}\n        </div>\n    );\n\n    if (readOnly) {\n        return wrapper(\n            <Heading\n                level={5}\n                className={\"text-accent-primary truncate px-sm-extra py-xs-plus\"}\n                data-testid={dataTestId}\n            >\n                {value}\n            </Heading>\n        );\n    }\n\n    if (isEditing) {\n        return wrapper(\n            <Input\n                autoFocus={autoFocus}\n                autoSelect={autoSelect}\n                size={\"md\"}\n                variant={\"secondary\"}\n                placeholder={placeholder}\n                value={localValue ?? value}\n                onChange={setLocalValue}\n                onBlur={e => commit(e.currentTarget.value)}\n                onEnter={e => commit(e.currentTarget.value)}\n                onEscape={cancel}\n            />\n        );\n    }\n\n    const trigger = (\n        <div\n            onClick={startEditing}\n            data-testid={dataTestId}\n            className={cn(\n                \"font-sans text-h5 cursor-pointer truncate rounded-md\",\n                \"px-[calc(var(--padding-sm-extra)-var(--border-width-sm))] py-[calc(var(--padding-xs)-var(--border-width-sm))]\",\n                \"border-sm border-transparent text-accent-primary\",\n                \"hover:bg-neutral-light\"\n            )}\n        >\n            {value}\n        </div>\n    );\n\n    return wrapper(\n        tooltip ? <Tooltip side={\"bottom\"} content={tooltip} trigger={trigger} /> : trigger\n    );\n};\n\nconst EditableTitle = makeDecoratable(\"EditableTitle\", DecoratableEditableTitle);\n\nexport { EditableTitle, type EditableTitleProps };\n"],"names":["DecoratableEditableTitle","value","onCommit","readOnly","placeholder","autoFocus","autoSelect","startContent","tooltip","controlledEditing","onEditingChange","className","dataTestId","isControlled","undefined","uncontrolledEditing","setUncontrolledEditing","useState","localValue","setLocalValue","isEditing","setEditing","useCallback","editing","startEditing","commit","next","cancel","wrapper","children","cn","Heading","Input","e","trigger","Tooltip","EditableTitle","makeDecoratable"],"mappings":";;;;;AAoDA,MAAMA,2BAA2B,CAAC,EAC9BC,KAAK,EACLC,QAAQ,EACRC,QAAQ,EACRC,WAAW,EACXC,YAAY,IAAI,EAChBC,aAAa,IAAI,EACjBC,YAAY,EACZC,OAAO,EACP,WAAWC,iBAAiB,EAC5BC,eAAe,EACfC,SAAS,EACT,eAAeC,UAAU,EACR;IACjB,MAAMC,eAAeJ,AAAsBK,WAAtBL;IACrB,MAAM,CAACM,qBAAqBC,uBAAuB,GAAGC,SAAS;IAC/D,MAAM,CAACC,YAAYC,cAAc,GAAGF;IAEpC,MAAMG,YAAYP,eAAeJ,oBAAoBM;IAErD,MAAMM,aAAaC,YACf,CAACC;QACG,IAAI,CAACV,cACDG,uBAAuBO;QAE3Bb,kBAAkBa;IACtB,GACA;QAACV;QAAcH;KAAgB;IAGnC,MAAMc,eAAeF,YAAY;QAC7BH,cAAclB;QACdoB,WAAW;IACf,GAAG;QAACpB;QAAOoB;KAAW;IAEtB,MAAMI,SAASH,YACX,CAACI;QACGxB,SAASwB;QACTP,cAAcL;QACdO,WAAW;IACf,GACA;QAACnB;QAAUmB;KAAW;IAG1B,MAAMM,SAASL,YAAY;QACvBH,cAAcL;QACdO,WAAW;IACf,GAAG;QAACA;KAAW;IAEf,MAAMO,UAAU,CAACC,WAAAA,WAAAA,GACb,oBAAC;YAAI,WAAWC,GAAG,6CAA6CnB;WAC3DJ,cACAsB;IAIT,IAAI1B,UACA,OAAOyB,QAAQ,WAARA,GACH,oBAACG,SAAOA;QACJ,OAAO;QACP,WAAW;QACX,eAAanB;OAEZX;IAKb,IAAImB,WACA,OAAOQ,QAAQ,WAARA,GACH,oBAACI,OAAKA;QACF,WAAW3B;QACX,YAAYC;QACZ,MAAM;QACN,SAAS;QACT,aAAaF;QACb,OAAOc,cAAcjB;QACrB,UAAUkB;QACV,QAAQc,CAAAA,IAAKR,OAAOQ,EAAE,aAAa,CAAC,KAAK;QACzC,SAASA,CAAAA,IAAKR,OAAOQ,EAAE,aAAa,CAAC,KAAK;QAC1C,UAAUN;;IAKtB,MAAMO,UAAU,WAAVA,GACF,oBAAC;QACG,SAASV;QACT,eAAaZ;QACb,WAAWkB,GACP,wDACA,iHACA,oDACA;OAGH7B;IAIT,OAAO2B,QACHpB,UAAU,WAAVA,GAAU,oBAAC2B,SAAOA;QAAC,MAAM;QAAU,SAAS3B;QAAS,SAAS0B;SAAcA;AAEpF;AAEA,MAAME,gBAAgBC,gBAAgB,iBAAiBrC"}

package/EditableTitle/index.d.ts

@@ -0,0 +1 @@
+export * from "./EditableTitle.js";

package/EditableTitle/index.js

@@ -0,0 +1 @@
+export * from "./EditableTitle.js";

package/EmptyState/EmptyState.d.ts

@@ -0,0 +1,43 @@
+import React from "react";
+import { type VariantProps } from "../utils.js";
+import { ContentIllustration, LayoutIllustration, ListingIllustration, SelectIllustration, TableIllustration, UploadIllustration } from "./illustrations/index.js";
+declare const ILLUSTRATIONS: {
+    content: typeof ContentIllustration;
+    table: typeof TableIllustration;
+    listing: typeof ListingIllustration;
+    layout: typeof LayoutIllustration;
+    upload: typeof UploadIllustration;
+    select: typeof SelectIllustration;
+};
+type EmptyStateType = keyof typeof ILLUSTRATIONS;
+declare const emptyStateVariants: (props?: ({
+    size?: "lg" | "md" | "sm" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+interface EmptyStateProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title">, VariantProps<typeof emptyStateVariants> {
+    type?: EmptyStateType;
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    illustration?: boolean;
+    actions?: React.ReactNode;
+}
+declare const DecoratableEmptyState: ({ size, type, title, description, illustration, actions, className, ...props }: EmptyStateProps) => React.JSX.Element;
+declare const EmptyState: typeof DecoratableEmptyState & {
+    original: typeof DecoratableEmptyState;
+    originalName: string;
+    displayName: string;
+} & {
+    original: typeof DecoratableEmptyState & {
+        original: typeof DecoratableEmptyState;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/react-composition/types.js").ComponentDecorator<typeof DecoratableEmptyState & {
+        original: typeof DecoratableEmptyState;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+};
+export { EmptyState, type EmptyStateProps, type EmptyStateType };

package/EmptyState/EmptyState.js

@@ -0,0 +1,93 @@
+import react from "react";
+import { cn, cva, makeDecoratable } from "../utils.js";
+import { Text } from "../Text/index.js";
+import { ContentIllustration, LayoutIllustration, ListingIllustration, SelectIllustration, TableIllustration, UploadIllustration } from "./illustrations/index.js";
+const ILLUSTRATIONS = {
+    content: ContentIllustration,
+    table: TableIllustration,
+    listing: ListingIllustration,
+    layout: LayoutIllustration,
+    upload: UploadIllustration,
+    select: SelectIllustration
+};
+const emptyStateVariants = cva("w-full flex flex-col items-center justify-center text-center px-lg", {
+    variants: {
+        size: {
+            sm: "gap-md py-[56px]",
+            md: "gap-md-plus py-[80px]",
+            lg: "gap-lg py-[96px]"
+        }
+    },
+    defaultVariants: {
+        size: "md"
+    }
+});
+const ILLUSTRATION_DIMENSIONS = {
+    sm: {
+        width: 88,
+        height: 73
+    },
+    md: {
+        width: 145,
+        height: 120
+    },
+    lg: {
+        width: 181,
+        height: 150
+    }
+};
+const contentVariants = cva("flex flex-col items-center w-full text-neutral-strong [word-break:break-word]", {
+    variants: {
+        size: {
+            sm: "gap-sm",
+            md: "gap-sm",
+            lg: "gap-sm-extra"
+        }
+    },
+    defaultVariants: {
+        size: "md"
+    }
+});
+const TITLE_SIZE = {
+    sm: "lg",
+    md: "lg",
+    lg: "xl"
+};
+const DESCRIPTION_SIZE = {
+    sm: "sm",
+    md: "md",
+    lg: "md"
+};
+const DecoratableEmptyState = ({ size = "md", type = "content", title, description, illustration = true, actions, className, ...props })=>{
+    const resolvedSize = size ?? "md";
+    const Illustration = ILLUSTRATIONS[type];
+    return /*#__PURE__*/ react.createElement("div", {
+        className: cn(emptyStateVariants({
+            size: resolvedSize
+        }), className),
+        ...props
+    }, illustration ? /*#__PURE__*/ react.createElement(Illustration, {
+        className: "shrink-0",
+        width: ILLUSTRATION_DIMENSIONS[resolvedSize].width,
+        height: ILLUSTRATION_DIMENSIONS[resolvedSize].height,
+        "aria-hidden": true
+    }) : null, title || description ? /*#__PURE__*/ react.createElement("div", {
+        className: contentVariants({
+            size: resolvedSize
+        })
+    }, title ? /*#__PURE__*/ react.createElement(Text, {
+        as: "div",
+        size: TITLE_SIZE[resolvedSize],
+        className: "font-semibold max-w-[520px]"
+    }, title) : null, description ? /*#__PURE__*/ react.createElement(Text, {
+        as: "div",
+        size: DESCRIPTION_SIZE[resolvedSize],
+        className: "max-w-[600px]"
+    }, description) : null) : null, actions ? /*#__PURE__*/ react.createElement("div", {
+        className: "flex items-center justify-center gap-sm-extra"
+    }, actions) : null);
+};
+const EmptyState = makeDecoratable("EmptyState", DecoratableEmptyState);
+export { EmptyState };
+
+//# sourceMappingURL=EmptyState.js.map