npm - @webiny/admin-ui - Versions diffs - 6.0.0-alpha.0 → 6.0.0-alpha.2 - Mend

@webiny/admin-ui 6.0.0-alpha.0 → 6.0.0-alpha.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (413) hide show

package/Accordion/Accordion.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import React from "react";
 import { type VariantProps } from "../utils";
-import { AccordionRoot } from "./components/AccordionRoot";
+import type { AccordionRoot } from "./components/AccordionRoot";
 import { type AccordionItemProps } from "./components/AccordionItem";
 declare const accordionVariants: (props?: ({
     variant?: "container" | "underline" | null | undefined;
@@ -105,25 +105,6 @@ declare const Accordion: (({ children, variant, background, className, ...props
                 }>) => (props: unknown) => React.JSX.Element;
             };
         };
-        Handle: (({ onClick, ...props }: import("./components/AccordionItemHandle").AccordionItemHandleProps) => React.JSX.Element) & {
-            original: ({ onClick, ...props }: import("./components/AccordionItemHandle").AccordionItemHandleProps) => React.JSX.Element;
-            originalName: string;
-            displayName: string;
-        } & {
-            original: (({ onClick, ...props }: import("./components/AccordionItemHandle").AccordionItemHandleProps) => React.JSX.Element) & {
-                original: ({ onClick, ...props }: import("./components/AccordionItemHandle").AccordionItemHandleProps) => React.JSX.Element;
-                originalName: string;
-                displayName: string;
-            };
-            originalName: string;
-            displayName: string;
-        } & {
-            createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<(({ onClick, ...props }: import("./components/AccordionItemHandle").AccordionItemHandleProps) => React.JSX.Element) & {
-                original: ({ onClick, ...props }: import("./components/AccordionItemHandle").AccordionItemHandleProps) => React.JSX.Element;
-                originalName: string;
-                displayName: string;
-            }>) => (props: unknown) => React.JSX.Element;
-        };
     };
 };
 export { Accordion, type AccordionProps, type AccordionItemProps };

package/Accordion/Accordion.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","makeDecoratable","withStaticProps","cva","cn","AccordionItem","accordionVariants","variants","variant","container","underline","background","base","light","transparent","defaultVariants","AccordionBase","children","className","props","createElement","Object","assign","DecoratableAccordion","Accordion","Item"],"sources":["Accordion.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable, withStaticProps, cva, type VariantProps, cn } from \"~/utils\";\nimport { AccordionRoot } from \"./components/AccordionRoot\";\nimport { AccordionItem, type AccordionItemProps } from \"./components/AccordionItem\";\n\nconst accordionVariants = cva(\"wby-group wby-w-full\", {\n variants: {\n variant: {\n container: \"wby-accordion-variant-container wby-gap-xs wby-flex wby-flex-col\",\n underline: \"wby-accordion-variant-underline \"\n },\n background: {\n base: \"wby-accordion-background-base\",\n light: \"wby-accordion-background-light\",\n transparent: \"wby-accordion-background-transparent\"\n }\n },\n defaultVariants: {\n variant: \"underline\",\n background: \"base\"\n }\n});\n\ntype AccordionProps = React.ComponentPropsWithoutRef<typeof AccordionRoot> &\n VariantProps<typeof accordionVariants> & {\n children: React.ReactNode;\n };\n\nconst AccordionBase = ({ children, variant, background, className, ...props }: AccordionProps) => {\n return (\n <div {...props} className={cn(accordionVariants({ variant, background }), className)}>\n {children}\n </div>\n );\n};\n\nconst DecoratableAccordion = makeDecoratable(\"Accordion\", AccordionBase);\n\nconst Accordion = withStaticProps(DecoratableAccordion, {\n Item: AccordionItem\n});\n\nexport { Accordion, type AccordionProps, type AccordionItemProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,EAAEC,eAAe,EAAEC,GAAG,EAAqBC,EAAE;AAErE,SAASC,aAAa;AAEtB,MAAMC,iBAAiB,GAAGH,GAAG,CAAC,sBAAsB,EAAE;EAClDI,QAAQ,EAAE;IACNC,OAAO,EAAE;MACLC,SAAS,EAAE,kEAAkE;MAC7EC,SAAS,EAAE;IACf,CAAC;IACDC,UAAU,EAAE;MACRC,IAAI,EAAE,+BAA+B;MACrCC,KAAK,EAAE,gCAAgC;MACvCC,WAAW,EAAE;IACjB;EACJ,CAAC;EACDC,eAAe,EAAE;IACbP,OAAO,EAAE,WAAW;IACpBG,UAAU,EAAE;EAChB;AACJ,CAAC,CAAC;AAOF,MAAMK,aAAa,GAAGA,CAAC;EAAEC,QAAQ;EAAET,OAAO;EAAEG,UAAU;EAAEO,SAAS;EAAE,GAAGC;AAAsB,CAAC,KAAK;EAC9F,oBACInB,KAAA,CAAAoB,aAAA,QAAAC,MAAA,CAAAC,MAAA,KAASH,KAAK;IAAED,SAAS,EAAEd,EAAE,CAACE,iBAAiB,CAAC;MAAEE,OAAO;MAAEG;IAAW,CAAC,CAAC,EAAEO,SAAS;EAAE,IAChFD,QACA,CAAC;AAEd,CAAC;AAED,MAAMM,oBAAoB,GAAGtB,eAAe,CAAC,WAAW,EAAEe,aAAa,CAAC;AAExE,MAAMQ,SAAS,GAAGtB,eAAe,CAACqB,oBAAoB,EAAE;EACpDE,IAAI,EAAEpB;AACV,CAAC,CAAC;AAEF,SAASmB,SAAS","ignoreList":[]}
1	+ {"version":3,"names":["React","makeDecoratable","withStaticProps","cva","cn","AccordionItem","accordionVariants","variants","variant","container","underline","background","base","light","transparent","defaultVariants","AccordionBase","children","className","props","createElement","Object","assign","DecoratableAccordion","Accordion","Item"],"sources":["Accordion.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable, withStaticProps, cva, type VariantProps, cn } from \"~/utils\";\nimport type { AccordionRoot } from \"./components/AccordionRoot\";\nimport { AccordionItem, type AccordionItemProps } from \"./components/AccordionItem\";\n\nconst accordionVariants = cva(\"wby-group wby-w-full\", {\n variants: {\n variant: {\n container: \"wby-accordion-variant-container wby-gap-xs wby-flex wby-flex-col\",\n underline: \"wby-accordion-variant-underline \"\n },\n background: {\n base: \"wby-accordion-background-base\",\n light: \"wby-accordion-background-light\",\n transparent: \"wby-accordion-background-transparent\"\n }\n },\n defaultVariants: {\n variant: \"underline\",\n background: \"base\"\n }\n});\n\ntype AccordionProps = React.ComponentPropsWithoutRef<typeof AccordionRoot> &\n VariantProps<typeof accordionVariants> & {\n children: React.ReactNode;\n };\n\nconst AccordionBase = ({ children, variant, background, className, ...props }: AccordionProps) => {\n return (\n <div {...props} className={cn(accordionVariants({ variant, background }), className)}>\n {children}\n </div>\n );\n};\n\nconst DecoratableAccordion = makeDecoratable(\"Accordion\", AccordionBase);\n\nconst Accordion = withStaticProps(DecoratableAccordion, {\n Item: AccordionItem\n});\n\nexport { Accordion, type AccordionProps, type AccordionItemProps };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,EAAEC,eAAe,EAAEC,GAAG,EAAqBC,EAAE;AAErE,SAASC,aAAa;AAEtB,MAAMC,iBAAiB,GAAGH,GAAG,CAAC,sBAAsB,EAAE;EAClDI,QAAQ,EAAE;IACNC,OAAO,EAAE;MACLC,SAAS,EAAE,kEAAkE;MAC7EC,SAAS,EAAE;IACf,CAAC;IACDC,UAAU,EAAE;MACRC,IAAI,EAAE,+BAA+B;MACrCC,KAAK,EAAE,gCAAgC;MACvCC,WAAW,EAAE;IACjB;EACJ,CAAC;EACDC,eAAe,EAAE;IACbP,OAAO,EAAE,WAAW;IACpBG,UAAU,EAAE;EAChB;AACJ,CAAC,CAAC;AAOF,MAAMK,aAAa,GAAGA,CAAC;EAAEC,QAAQ;EAAET,OAAO;EAAEG,UAAU;EAAEO,SAAS;EAAE,GAAGC;AAAsB,CAAC,KAAK;EAC9F,oBACInB,KAAA,CAAAoB,aAAA,QAAAC,MAAA,CAAAC,MAAA,KAASH,KAAK;IAAED,SAAS,EAAEd,EAAE,CAACE,iBAAiB,CAAC;MAAEE,OAAO;MAAEG;IAAW,CAAC,CAAC,EAAEO,SAAS;EAAE,IAChFD,QACA,CAAC;AAEd,CAAC;AAED,MAAMM,oBAAoB,GAAGtB,eAAe,CAAC,WAAW,EAAEe,aAAa,CAAC;AAExE,MAAMQ,SAAS,GAAGtB,eAAe,CAACqB,oBAAoB,EAAE;EACpDE,IAAI,EAAEpB;AACV,CAAC,CAAC;AAEF,SAASmB,SAAS","ignoreList":[]}

package/Accordion/Accordion.mdx CHANGED Viewed

@@ -275,9 +275,9 @@ const WithActionsExample = () => {
 export default WithActionsExample;
 ` } } />
-### With Handle
+### With Draggable Item
-<Canvas of={AccordionStories.WithHandleIcon} source={ { code: `
+<Canvas of={AccordionStories.WithDraggableItem} source={ { code: `
 import React from "react";
 import { Accordion } from "@webiny/admin-ui";
 import { ReactComponent as WarningIcon } from "@webiny/icons/insert_chart.svg";
@@ -289,7 +289,7 @@ const WithHandleExample = () => {
                 title="Accordion item 1"
                 description="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
                 icon={<Accordion.Item.Icon icon={<WarningIcon />} label={"Warning icon"} />}
-                handle={<Accordion.Item.Handle />}
+                 draggable={true}
             >
                 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed elit sem, pretium sit amet
                 convallis nec, consequat non nulla. Nunc sit amet sagittis tellus.
@@ -297,7 +297,14 @@ const WithHandleExample = () => {
             <Accordion.Item
                 title="Accordion item 2"
                 description="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
-                handle={<Accordion.Item.Handle />}
+                 draggable={true}
+            >
+                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed elit sem, pretium sit amet
+                convallis nec, consequat non nulla. Nunc sit amet sagittis tellus.
+            </Accordion.Item>
+             <Accordion.Item
+                title="Accordion item 3"
+                description="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
             >
                 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed elit sem, pretium sit amet
                 convallis nec, consequat non nulla. Nunc sit amet sagittis tellus.

package/Accordion/Accordion.stories.d.ts CHANGED Viewed

@@ -7,7 +7,7 @@ export declare const Default: Story;
 export declare const WithDescriptions: Story;
 export declare const WithIcon: Story;
 export declare const WithActionsIcon: Story;
-export declare const WithHandleIcon: Story;
+export declare const WithDraggableItem: Story;
 export declare const WithNotInteractiveItem: Story;
 export declare const WithDefaultOpenedItem: Story;
 export declare const WithDisabledItem: Story;

package/Accordion/Accordion.stories.js CHANGED Viewed

@@ -108,7 +108,7 @@ export const WithActionsIcon = {
     }))
   }
 };
-export const WithHandleIcon = {
+export const WithDraggableItem = {
   ...Default,
   args: {
     children: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(AccordionItem, {
@@ -118,11 +118,14 @@ export const WithHandleIcon = {
         icon: /*#__PURE__*/React.createElement(WarningIcon, null),
         label: "Warning icon"
       }),
-      handle: /*#__PURE__*/React.createElement(Accordion.Item.Handle, null)
+      draggable: true
     }), /*#__PURE__*/React.createElement(AccordionItem, {
       index: 2,
       description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
-      handle: /*#__PURE__*/React.createElement(Accordion.Item.Handle, null)
+      draggable: true
+    }), /*#__PURE__*/React.createElement(AccordionItem, {
+      index: 3,
+      description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit."
     }))
   }
 };
@@ -180,26 +183,29 @@ export const WithControlledOpenedItem = {
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Accordion, args, /*#__PURE__*/React.createElement(AccordionItem, {
       index: 1,
       description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
-      defaultOpen: openFirstItem
+      open: openFirstItem,
+      onOpenChange: open => setOpenFirstItem(open)
     }), /*#__PURE__*/React.createElement(AccordionItem, {
       index: 2,
       description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
-      defaultOpen: openSecondItem
+      open: openSecondItem,
+      onOpenChange: open => setOpenSecondItem(open)
     }), /*#__PURE__*/React.createElement(AccordionItem, {
       index: 3,
       description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit.",
-      defaultOpen: openThirdItem
+      open: openThirdItem,
+      onOpenChange: open => setOpenThirdItem(open)
     })), /*#__PURE__*/React.createElement("div", {
       className: "wby-flex wby-justify-center wby-mt-lg wby-gap-md"
     }, /*#__PURE__*/React.createElement(Button, {
       onClick: () => setOpenFirstItem(!openFirstItem),
-      text: "Trigger First Item"
+      text: "Toggle First Item"
     }), /*#__PURE__*/React.createElement(Button, {
       onClick: () => setOpenSecondItem(!openSecondItem),
-      text: "Trigger Second Item"
+      text: "Toggle Second Item"
     }), /*#__PURE__*/React.createElement(Button, {
       onClick: () => setOpenThirdItem(!openThirdItem),
-      text: "Trigger Third Item"
+      text: "Toggle Third Item"
     })));
   }
 };

package/Accordion/Accordion.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","useState","Accordion","ReactComponent","WarningIcon","ArrowUp","ArrowDown","EditIcon","TrashIcon","Button","meta","title","component","argTypes","decorators","Story","createElement","className","render","args","AccordionItem","props","Item","Object","assign","index","Default","children","Fragment","WithDescriptions","description","WithIcon","icon","Icon","label","WithActionsIcon","actions","Action","Separator","WithHandleIcon","handle","Handle","WithNotInteractiveItem","interactive","WithDefaultOpenedItem","defaultOpen","WithDisabledItem","disabled","WithControlledOpenedItem","openFirstItem","setOpenFirstItem","openSecondItem","setOpenSecondItem","openThirdItem","setOpenThirdItem","onClick","text","ContainerVariant","variant","LightBackground","background","ContainerVariantWithLightBackground","Documentation","control","options"],"sources":["Accordion.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { Accordion, type AccordionItemProps as BaseAccordionItemProps } from \"./Accordion\";\n\nimport { ReactComponent as WarningIcon } from \"@webiny/icons/insert_chart.svg\";\nimport { ReactComponent as ArrowUp } from \"@webiny/icons/arrow_upward.svg\";\nimport { ReactComponent as ArrowDown } from \"@webiny/icons/arrow_downward.svg\";\nimport { ReactComponent as EditIcon } from \"@webiny/icons/edit.svg\";\nimport { ReactComponent as TrashIcon } from \"@webiny/icons/delete.svg\";\nimport { Button } from \"~/Button\";\n\nconst meta: Meta<typeof Accordion> = {\n title: \"Components/Accordion\",\n component: Accordion,\n argTypes: {},\n decorators: [\n Story => (\n <div className=\"wby-w-[750px] wby-p-[50px] wby-min-h-[500px] wby-bg-[#f6f7f8]\">\n <Story />\n </div>\n )\n ],\n render: args => {\n return <Accordion {...args} />;\n }\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof Accordion>;\n\ninterface AccordionItemProps extends Omit<BaseAccordionItemProps, \"value\" \| \"title\" \| \"children\"> {\n index: number;\n}\n\nconst AccordionItem = (props: AccordionItemProps) => {\n return (\n <Accordion.Item title={`Accordion item ${props.index}`} {...props}>\n Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed elit sem, pretium sit amet\n convallis nec, consequat non nulla. Nunc sit amet sagittis tellus. Etiam venenatis, odio\n sed consectetur consectetur, quam quam blandit ante, semper maximus lorem est vel dolor.\n Praesent ac neque rutrum, elementum turpis et, vulputate enim. In ex lorem,\n </Accordion.Item>\n );\n};\n\nexport const Default: Story = {\n args: {\n children: (\n <>\n <AccordionItem index={1} />\n <AccordionItem index={2} />\n <AccordionItem index={3} />\n </>\n )\n }\n};\n\nexport const WithDescriptions: Story = {\n ...Default,\n args: {\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n />\n <AccordionItem\n index={3}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n />\n </>\n )\n },\n argTypes: {}\n};\n\nexport const WithIcon: Story = {\n ...Default,\n args: {\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n />\n </>\n )\n }\n};\n\nexport const WithActionsIcon: Story = {\n ...Default,\n args: {\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n actions={\n <>\n <Accordion.Item.Action icon={<ArrowUp />} />\n <Accordion.Item.Action icon={<ArrowDown />} />\n <Accordion.Item.Action.Separator />\n <Accordion.Item.Action icon={<EditIcon />} />\n <Accordion.Item.Action icon={<TrashIcon />} />\n </>\n }\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n actions={\n <>\n <Accordion.Item.Action icon={<ArrowUp />} />\n <Accordion.Item.Action icon={<ArrowDown />} />\n <Accordion.Item.Action.Separator />\n <Accordion.Item.Action icon={<EditIcon />} />\n <Accordion.Item.Action icon={<TrashIcon />} />\n </>\n }\n />\n </>\n )\n }\n};\n\nexport const WithHandleIcon: Story = {\n ...Default,\n args: {\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n handle={<Accordion.Item.Handle />}\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n handle={<Accordion.Item.Handle />}\n />\n </>\n )\n }\n};\n\nexport const WithNotInteractiveItem: Story = {\n ...Default,\n args: {\n children: (\n <>\n <AccordionItem index={1} description=\"Not interactive item.\" interactive={false} />\n <AccordionItem index={2} />\n <AccordionItem index={3} />\n </>\n )\n }\n};\n\nexport const WithDefaultOpenedItem: Story = {\n ...Default,\n args: {\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n defaultOpen={true}\n />\n </>\n )\n }\n};\n\nexport const WithDisabledItem: Story = {\n ...Default,\n args: {\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n disabled={true}\n />\n <AccordionItem\n index={3}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n defaultOpen={true}\n disabled={true}\n />\n </>\n )\n }\n};\n\nexport const WithControlledOpenedItem: Story = {\n ...Default,\n render: args => {\n const [openFirstItem, setOpenFirstItem] = useState<boolean>();\n const [openSecondItem, setOpenSecondItem] = useState<boolean>();\n const [openThirdItem, setOpenThirdItem] = useState<boolean>();\n\n return (\n <>\n <Accordion {...args}>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n defaultOpen={openFirstItem}\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n defaultOpen={openSecondItem}\n />\n <AccordionItem\n index={3}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n defaultOpen={openThirdItem}\n />\n </Accordion>\n <div className={\"wby-flex wby-justify-center wby-mt-lg wby-gap-md\"}>\n <Button\n onClick={() => setOpenFirstItem(!openFirstItem)}\n text={\"Trigger First Item\"}\n />\n <Button\n onClick={() => setOpenSecondItem(!openSecondItem)}\n text={\"Trigger Second Item\"}\n />\n <Button\n onClick={() => setOpenThirdItem(!openThirdItem)}\n text={\"Trigger Third Item\"}\n />\n </div>\n </>\n );\n }\n};\n\nexport const ContainerVariant: Story = {\n ...Default,\n args: {\n variant: \"container\",\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n />\n </>\n )\n }\n};\n\nexport const LightBackground: Story = {\n ...Default,\n decorators: [\n Story => (\n <div className=\"wby-w-[750px] wby-p-[50px] wby-min-h-[500px]\">\n <Story />\n </div>\n )\n ],\n args: {\n background: \"light\",\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n />\n </>\n )\n }\n};\n\nexport const ContainerVariantWithLightBackground: Story = {\n ...Default,\n decorators: [\n Story => (\n <div className=\"wby-w-[750px] wby-p-[50px] wby-min-h-[500px]\">\n <Story />\n </div>\n )\n ],\n args: {\n variant: \"container\",\n background: \"light\",\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n />\n </>\n )\n }\n};\n\n// Add a Documentation story\nexport const Documentation: Story = {\n render: args => {\n return <Accordion {...args} />;\n },\n args: {\n variant: \"underline\",\n background: \"base\",\n children: (\n <>\n <Accordion.Item\n title=\"Accordion Item 1\"\n description=\"This is a description for the first item\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n actions={\n <>\n <Accordion.Item.Action icon={<EditIcon />} />\n <Accordion.Item.Action icon={<TrashIcon />} />\n </>\n }\n >\n This is the content for the first accordion item. It can contain any React\n elements.\n </Accordion.Item>\n\n <Accordion.Item\n title=\"Accordion Item 2\"\n description=\"This is a description for the second item\"\n defaultOpen={true}\n >\n This is the content for the second accordion item. It's open by default.\n </Accordion.Item>\n\n <Accordion.Item\n title=\"Disabled Item\"\n description=\"This item cannot be interacted with\"\n disabled={true}\n >\n This content won't be visible because the item is disabled.\n </Accordion.Item>\n </>\n )\n },\n argTypes: {\n variant: {\n control: \"select\",\n options: [\"underline\", \"container\"],\n description: \"The visual style of the accordion\"\n },\n background: {\n control: \"select\",\n options: [\"base\", \"light\", \"transparent\"],\n description: \"The background color of the accordion\"\n },\n children: {\n description:\n \"The content of the accordion. Please refer to the example code for details.\",\n control: \"none\"\n }\n }\n};\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["React","useState","Accordion","ReactComponent","WarningIcon","ArrowUp","ArrowDown","EditIcon","TrashIcon","Button","meta","title","component","argTypes","decorators","Story","createElement","className","render","args","AccordionItem","props","Item","Object","assign","index","Default","children","Fragment","WithDescriptions","description","WithIcon","icon","Icon","label","WithActionsIcon","actions","Action","Separator","WithDraggableItem","draggable","WithNotInteractiveItem","interactive","WithDefaultOpenedItem","defaultOpen","WithDisabledItem","disabled","WithControlledOpenedItem","openFirstItem","setOpenFirstItem","openSecondItem","setOpenSecondItem","openThirdItem","setOpenThirdItem","open","onOpenChange","onClick","text","ContainerVariant","variant","LightBackground","background","ContainerVariantWithLightBackground","Documentation","control","options"],"sources":["Accordion.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\nimport { Accordion, type AccordionItemProps as BaseAccordionItemProps } from \"./Accordion\";\n\nimport { ReactComponent as WarningIcon } from \"@webiny/icons/insert_chart.svg\";\nimport { ReactComponent as ArrowUp } from \"@webiny/icons/arrow_upward.svg\";\nimport { ReactComponent as ArrowDown } from \"@webiny/icons/arrow_downward.svg\";\nimport { ReactComponent as EditIcon } from \"@webiny/icons/edit.svg\";\nimport { ReactComponent as TrashIcon } from \"@webiny/icons/delete.svg\";\nimport { Button } from \"~/Button\";\n\nconst meta: Meta<typeof Accordion> = {\n title: \"Components/Accordion\",\n component: Accordion,\n argTypes: {},\n decorators: [\n Story => (\n <div className=\"wby-w-[750px] wby-p-[50px] wby-min-h-[500px] wby-bg-[#f6f7f8]\">\n <Story />\n </div>\n )\n ],\n render: args => {\n return <Accordion {...args} />;\n }\n};\n\nexport default meta;\n\ntype Story = StoryObj<typeof Accordion>;\n\ninterface AccordionItemProps extends Omit<BaseAccordionItemProps, \"value\" \| \"title\" \| \"children\"> {\n index: number;\n}\n\nconst AccordionItem = (props: AccordionItemProps) => {\n return (\n <Accordion.Item title={`Accordion item ${props.index}`} {...props}>\n Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed elit sem, pretium sit amet\n convallis nec, consequat non nulla. Nunc sit amet sagittis tellus. Etiam venenatis, odio\n sed consectetur consectetur, quam quam blandit ante, semper maximus lorem est vel dolor.\n Praesent ac neque rutrum, elementum turpis et, vulputate enim. In ex lorem,\n </Accordion.Item>\n );\n};\n\nexport const Default: Story = {\n args: {\n children: (\n <>\n <AccordionItem index={1} />\n <AccordionItem index={2} />\n <AccordionItem index={3} />\n </>\n )\n }\n};\n\nexport const WithDescriptions: Story = {\n ...Default,\n args: {\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n />\n <AccordionItem\n index={3}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n />\n </>\n )\n },\n argTypes: {}\n};\n\nexport const WithIcon: Story = {\n ...Default,\n args: {\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n />\n </>\n )\n }\n};\n\nexport const WithActionsIcon: Story = {\n ...Default,\n args: {\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n actions={\n <>\n <Accordion.Item.Action icon={<ArrowUp />} />\n <Accordion.Item.Action icon={<ArrowDown />} />\n <Accordion.Item.Action.Separator />\n <Accordion.Item.Action icon={<EditIcon />} />\n <Accordion.Item.Action icon={<TrashIcon />} />\n </>\n }\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n actions={\n <>\n <Accordion.Item.Action icon={<ArrowUp />} />\n <Accordion.Item.Action icon={<ArrowDown />} />\n <Accordion.Item.Action.Separator />\n <Accordion.Item.Action icon={<EditIcon />} />\n <Accordion.Item.Action icon={<TrashIcon />} />\n </>\n }\n />\n </>\n )\n }\n};\n\nexport const WithDraggableItem: Story = {\n ...Default,\n args: {\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n draggable={true}\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n draggable={true}\n />\n <AccordionItem\n index={3}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n />\n </>\n )\n }\n};\n\nexport const WithNotInteractiveItem: Story = {\n ...Default,\n args: {\n children: (\n <>\n <AccordionItem index={1} description=\"Not interactive item.\" interactive={false} />\n <AccordionItem index={2} />\n <AccordionItem index={3} />\n </>\n )\n }\n};\n\nexport const WithDefaultOpenedItem: Story = {\n ...Default,\n args: {\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n defaultOpen={true}\n />\n </>\n )\n }\n};\n\nexport const WithDisabledItem: Story = {\n ...Default,\n args: {\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n disabled={true}\n />\n <AccordionItem\n index={3}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n defaultOpen={true}\n disabled={true}\n />\n </>\n )\n }\n};\n\nexport const WithControlledOpenedItem: Story = {\n ...Default,\n render: args => {\n const [openFirstItem, setOpenFirstItem] = useState<boolean>();\n const [openSecondItem, setOpenSecondItem] = useState<boolean>();\n const [openThirdItem, setOpenThirdItem] = useState<boolean>();\n\n return (\n <>\n <Accordion {...args}>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n open={openFirstItem}\n onOpenChange={open => setOpenFirstItem(open)}\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n open={openSecondItem}\n onOpenChange={open => setOpenSecondItem(open)}\n />\n <AccordionItem\n index={3}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n open={openThirdItem}\n onOpenChange={open => setOpenThirdItem(open)}\n />\n </Accordion>\n <div className={\"wby-flex wby-justify-center wby-mt-lg wby-gap-md\"}>\n <Button\n onClick={() => setOpenFirstItem(!openFirstItem)}\n text={\"Toggle First Item\"}\n />\n <Button\n onClick={() => setOpenSecondItem(!openSecondItem)}\n text={\"Toggle Second Item\"}\n />\n <Button\n onClick={() => setOpenThirdItem(!openThirdItem)}\n text={\"Toggle Third Item\"}\n />\n </div>\n </>\n );\n }\n};\n\nexport const ContainerVariant: Story = {\n ...Default,\n args: {\n variant: \"container\",\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n />\n </>\n )\n }\n};\n\nexport const LightBackground: Story = {\n ...Default,\n decorators: [\n Story => (\n <div className=\"wby-w-[750px] wby-p-[50px] wby-min-h-[500px]\">\n <Story />\n </div>\n )\n ],\n args: {\n background: \"light\",\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n />\n </>\n )\n }\n};\n\nexport const ContainerVariantWithLightBackground: Story = {\n ...Default,\n decorators: [\n Story => (\n <div className=\"wby-w-[750px] wby-p-[50px] wby-min-h-[500px]\">\n <Story />\n </div>\n )\n ],\n args: {\n variant: \"container\",\n background: \"light\",\n children: (\n <>\n <AccordionItem\n index={1}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n />\n <AccordionItem\n index={2}\n description=\"Lorem ipsum dolor sit amet, consectetur adipiscing elit.\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n />\n </>\n )\n }\n};\n\n// Add a Documentation story\nexport const Documentation: Story = {\n render: args => {\n return <Accordion {...args} />;\n },\n args: {\n variant: \"underline\",\n background: \"base\",\n children: (\n <>\n <Accordion.Item\n title=\"Accordion Item 1\"\n description=\"This is a description for the first item\"\n icon={<Accordion.Item.Icon icon={<WarningIcon />} label={\"Warning icon\"} />}\n actions={\n <>\n <Accordion.Item.Action icon={<EditIcon />} />\n <Accordion.Item.Action icon={<TrashIcon />} />\n </>\n }\n >\n This is the content for the first accordion item. It can contain any React\n elements.\n </Accordion.Item>\n\n <Accordion.Item\n title=\"Accordion Item 2\"\n description=\"This is a description for the second item\"\n defaultOpen={true}\n >\n This is the content for the second accordion item. It's open by default.\n </Accordion.Item>\n\n <Accordion.Item\n title=\"Disabled Item\"\n description=\"This item cannot be interacted with\"\n disabled={true}\n >\n This content won't be visible because the item is disabled.\n </Accordion.Item>\n </>\n )\n },\n argTypes: {\n variant: {\n control: \"select\",\n options: [\"underline\", \"container\"],\n description: \"The visual style of the accordion\"\n },\n background: {\n control: \"select\",\n options: [\"base\", \"light\", \"transparent\"],\n description: \"The background color of the accordion\"\n },\n children: {\n description:\n \"The content of the accordion. Please refer to the example code for details.\",\n control: \"none\"\n }\n }\n};\n"],"mappings":"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","ignoreList":[]}

package/Accordion/components/AccordionContent.js CHANGED Viewed

@@ -33,7 +33,7 @@ const AccordionContent = ({
       withIcon
     }), props.className)
   }), /*#__PURE__*/React.createElement("div", {
-    className: "wby-pt-sm wby-pb-lg wby-pl-md wby-pr-[52px]"
+    className: "wby-pt-sm wby-pb-lg wby-px-md"
   }, children));
 };
 export { AccordionContent };

package/Accordion/components/AccordionContent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","Collapsible","CollapsiblePrimitive","cva","cn","accordionContentVariants","variants","withIcon","true","withHandle","compoundVariants","className","defaultVariants","AccordionContent","children","props","createElement","Content","Object","assign"],"sources":["AccordionContent.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Collapsible as CollapsiblePrimitive } from \"radix-ui\";\nimport { cva, type VariantProps, cn } from \"~/utils\";\n\nconst accordionContentVariants = cva(\n [\n \"wby-overflow-hidden wby-text-md\",\n \"wby-transition-all data-[state=closed]:wby-animate-collapsible-up data-[state=open]:wby-animate-collapsible-down\"\n ],\n {\n // Using pixel values here because of non-existing design tokens.\n variants: {\n withIcon: {\n true: \"wby-pl-9\"\n },\n withHandle: {\n true: \"wby-pl-5\"\n }\n },\n compoundVariants: [\n {\n withIcon: true,\n withHandle: true,\n className: \"wby-pl-14\"\n }\n ],\n defaultVariants: {\n withIcon: false,\n withHandle: false\n }\n }\n);\n\nexport interface AccordionContentProps\n extends React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content>,\n VariantProps<typeof accordionContentVariants> {}\n\nconst AccordionContent = ({ children, withIcon, withHandle, ...props }: AccordionContentProps) => {\n return (\n <CollapsiblePrimitive.Content\n {...props}\n className={cn(accordionContentVariants({ withHandle, withIcon }), props.className)}\n >\n <div className={\"wby-pt-sm wby-pb-lg wby-pl-md ~~wby-pr-[52px]~~\"}>{children}</div>\n </CollapsiblePrimitive.Content>\n );\n};\n\nexport { AccordionContent };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,WAAW,IAAIC,oBAAoB,QAAQ,UAAU;AAC9D,SAASC,GAAG,EAAqBC,EAAE;AAEnC,MAAMC,wBAAwB,GAAGF,GAAG,CAChC,CACI,iCAAiC,EACjC,kHAAkH,CACrH,EACD;EACI;EACAG,QAAQ,EAAE;IACNC,QAAQ,EAAE;MACNC,IAAI,EAAE;IACV,CAAC;IACDC,UAAU,EAAE;MACRD,IAAI,EAAE;IACV;EACJ,CAAC;EACDE,gBAAgB,EAAE,CACd;IACIH,QAAQ,EAAE,IAAI;IACdE,UAAU,EAAE,IAAI;IAChBE,SAAS,EAAE;EACf,CAAC,CACJ;EACDC,eAAe,EAAE;IACbL,QAAQ,EAAE,KAAK;IACfE,UAAU,EAAE;EAChB;AACJ,CACJ,CAAC;AAMD,MAAMI,gBAAgB,GAAGA,CAAC;EAAEC,QAAQ;EAAEP,QAAQ;EAAEE,UAAU;EAAE,GAAGM;AAA6B,CAAC,KAAK;EAC9F,oBACIf,KAAA,CAAAgB,aAAA,CAACd,oBAAoB,CAACe,OAAO,EAAAC,MAAA,CAAAC,MAAA,KACrBJ,KAAK;IACTJ,SAAS,EAAEP,EAAE,CAACC,wBAAwB,CAAC;MAAEI,UAAU;MAAEF;IAAS,CAAC,CAAC,EAAEQ,KAAK,CAACJ,SAAS;EAAE,iBAEnFX,KAAA,CAAAgB,aAAA;IAAKL,SAAS,EAAE;~~EAA8C~~,GAAEG,QAAc,~~CACpD~~,CAAC;AAEvC,CAAC;AAED,SAASD,gBAAgB","ignoreList":[]}
1	+ {"version":3,"names":["React","Collapsible","CollapsiblePrimitive","cva","cn","accordionContentVariants","variants","withIcon","true","withHandle","compoundVariants","className","defaultVariants","AccordionContent","children","props","createElement","Content","Object","assign"],"sources":["AccordionContent.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Collapsible as CollapsiblePrimitive } from \"radix-ui\";\nimport { cva, type VariantProps, cn } from \"~/utils\";\n\nconst accordionContentVariants = cva(\n [\n \"wby-overflow-hidden wby-text-md\",\n \"wby-transition-all data-[state=closed]:wby-animate-collapsible-up data-[state=open]:wby-animate-collapsible-down\"\n ],\n {\n // Using pixel values here because of non-existing design tokens.\n variants: {\n withIcon: {\n true: \"wby-pl-9\"\n },\n withHandle: {\n true: \"wby-pl-5\"\n }\n },\n compoundVariants: [\n {\n withIcon: true,\n withHandle: true,\n className: \"wby-pl-14\"\n }\n ],\n defaultVariants: {\n withIcon: false,\n withHandle: false\n }\n }\n);\n\nexport interface AccordionContentProps\n extends React.ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content>,\n VariantProps<typeof accordionContentVariants> {}\n\nconst AccordionContent = ({ children, withIcon, withHandle, ...props }: AccordionContentProps) => {\n return (\n <CollapsiblePrimitive.Content\n {...props}\n className={cn(accordionContentVariants({ withHandle, withIcon }), props.className)}\n >\n <div className={\"wby-pt-sm wby-pb-lg wby-px-md\"}>{children}</div>\n </CollapsiblePrimitive.Content>\n );\n};\n\nexport { AccordionContent };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,WAAW,IAAIC,oBAAoB,QAAQ,UAAU;AAC9D,SAASC,GAAG,EAAqBC,EAAE;AAEnC,MAAMC,wBAAwB,GAAGF,GAAG,CAChC,CACI,iCAAiC,EACjC,kHAAkH,CACrH,EACD;EACI;EACAG,QAAQ,EAAE;IACNC,QAAQ,EAAE;MACNC,IAAI,EAAE;IACV,CAAC;IACDC,UAAU,EAAE;MACRD,IAAI,EAAE;IACV;EACJ,CAAC;EACDE,gBAAgB,EAAE,CACd;IACIH,QAAQ,EAAE,IAAI;IACdE,UAAU,EAAE,IAAI;IAChBE,SAAS,EAAE;EACf,CAAC,CACJ;EACDC,eAAe,EAAE;IACbL,QAAQ,EAAE,KAAK;IACfE,UAAU,EAAE;EAChB;AACJ,CACJ,CAAC;AAMD,MAAMI,gBAAgB,GAAGA,CAAC;EAAEC,QAAQ;EAAEP,QAAQ;EAAEE,UAAU;EAAE,GAAGM;AAA6B,CAAC,KAAK;EAC9F,oBACIf,KAAA,CAAAgB,aAAA,CAACd,oBAAoB,CAACe,OAAO,EAAAC,MAAA,CAAAC,MAAA,KACrBJ,KAAK;IACTJ,SAAS,EAAEP,EAAE,CAACC,wBAAwB,CAAC;MAAEI,UAAU;MAAEF;IAAS,CAAC,CAAC,EAAEQ,KAAK,CAACJ,SAAS;EAAE,iBAEnFX,KAAA,CAAAgB,aAAA;IAAKL,SAAS,EAAE;EAAgC,GAAEG,QAAc,CACtC,CAAC;AAEvC,CAAC;AAED,SAASD,gBAAgB","ignoreList":[]}

package/Accordion/components/AccordionItem.d.ts CHANGED Viewed

@@ -6,6 +6,7 @@ interface AccordionItemProps extends Omit<AccordionRootProps, "title"> {
     icon?: React.ReactNode;
     handle?: React.ReactNode;
     interactive?: boolean;
+    draggable?: boolean;
     actions?: React.ReactNode;
     children: React.ReactNode;
 }
@@ -86,24 +87,5 @@ declare const AccordionItem: ((props: AccordionItemProps) => React.JSX.Element)
             }>) => (props: unknown) => React.JSX.Element;
         };
     };
-    Handle: (({ onClick, ...props }: import("./AccordionItemHandle").AccordionItemHandleProps) => React.JSX.Element) & {
-        original: ({ onClick, ...props }: import("./AccordionItemHandle").AccordionItemHandleProps) => React.JSX.Element;
-        originalName: string;
-        displayName: string;
-    } & {
-        original: (({ onClick, ...props }: import("./AccordionItemHandle").AccordionItemHandleProps) => React.JSX.Element) & {
-            original: ({ onClick, ...props }: import("./AccordionItemHandle").AccordionItemHandleProps) => React.JSX.Element;
-            originalName: string;
-            displayName: string;
-        };
-        originalName: string;
-        displayName: string;
-    } & {
-        createDecorator: (decorator: import("@webiny/react-composition").ComponentDecorator<(({ onClick, ...props }: import("./AccordionItemHandle").AccordionItemHandleProps) => React.JSX.Element) & {
-            original: ({ onClick, ...props }: import("./AccordionItemHandle").AccordionItemHandleProps) => React.JSX.Element;
-            originalName: string;
-            displayName: string;
-        }>) => (props: unknown) => React.JSX.Element;
-    };
 };
 export { AccordionItem, type AccordionItemProps };

package/Accordion/components/AccordionItem.js CHANGED Viewed

@@ -4,7 +4,6 @@ import { AccordionTrigger } from "./AccordionTrigger";
 import { AccordionContent } from "./AccordionContent";
 import { AccordionItemIcon } from "./AccordionItemIcon";
 import { AccordionItemAction } from "./AccordionItemAction";
-import { AccordionItemHandle } from "./AccordionItemHandle";
 import { AccordionRoot } from "./AccordionRoot";
 const AccordionItemBase = props => {
   const {
@@ -17,7 +16,6 @@ const AccordionItemBase = props => {
       className,
       defaultOpen,
       disabled,
-      interactive,
       onOpenChange,
       open,
       // Content props.
@@ -34,8 +32,7 @@ const AccordionItemBase = props => {
         open
       },
       triggerProps: {
-        ...triggerProps,
-        interactive
+        ...triggerProps
       },
       contentProps: {
         children,
@@ -45,14 +42,13 @@ const AccordionItemBase = props => {
     };
   }, [props]);
   return /*#__PURE__*/React.createElement(AccordionRoot, Object.assign({}, itemProps, {
-    className: cn(["wby-border-b-sm wby-border-b-neutral-dimmed data-[state=open]:wby-rounded-bl-lg data-[state=open]:wby-rounded-br-lg", "group-[.wby-accordion-variant-container]:wby-rounded-lg", "group-[.wby-accordion-background-base]:wby-bg-neutral-base", "group-[.wby-accordion-background-light]:wby-bg-neutral-light", "data-[disabled]:wby-pointer-events-none data-[disabled]:wby-opacity-50"], itemProps.className)
+    className: cn(["wby-group-item wby-border-b-sm wby-border-b-neutral-dimmed data-[state=open]:wby-rounded-bl-lg data-[state=open]:wby-rounded-br-lg", "group-[.wby-accordion-variant-container]:wby-rounded-lg", "group-[.wby-accordion-background-base]:wby-bg-neutral-base", "group-[.wby-accordion-background-light]:wby-bg-neutral-light", "data-[disabled]:wby-pointer-events-none data-[disabled]:wby-opacity-50"], itemProps.className)
   }), /*#__PURE__*/React.createElement(AccordionTrigger, triggerProps), /*#__PURE__*/React.createElement(AccordionContent, contentProps));
 };
 const DecoratableAccordionItem = makeDecoratable("AccordionItem", AccordionItemBase);
 const AccordionItem = withStaticProps(DecoratableAccordionItem, {
   Icon: AccordionItemIcon,
-  Action: AccordionItemAction,
-  Handle: AccordionItemHandle
+  Action: AccordionItemAction
 });
 export { AccordionItem };

package/Accordion/components/AccordionItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","cn","makeDecoratable","withStaticProps","AccordionTrigger","AccordionContent","AccordionItemIcon","AccordionItemAction","~~AccordionItemHandle","~~AccordionRoot","AccordionItemBase","props","itemProps","triggerProps","contentProps","useMemo","className","defaultOpen","disabled","~~interactive","~~onOpenChange","open","children","withIcon","icon","withHandle","handle","createElement","Object","assign","DecoratableAccordionItem","AccordionItem","Icon","Action"~~,"Handle"~~],"sources":["AccordionItem.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn, makeDecoratable, withStaticProps } from \"~/utils\";\nimport { AccordionTrigger } from \"./AccordionTrigger\";\nimport { AccordionContent } from \"./AccordionContent\";\nimport { AccordionItemIcon } from \"./AccordionItemIcon\";\nimport { AccordionItemAction } from \"./AccordionItemAction\";\nimport { ~~AccordionItemHandle } from \"./AccordionItemHandle\";\nimport {~~ AccordionRoot, type AccordionRootProps } from \"~/Accordion/components/AccordionRoot\";\n\ninterface AccordionItemProps extends Omit<AccordionRootProps, \"title\"> {\n title: React.ReactNode;\n description?: React.ReactNode;\n icon?: React.ReactNode;\n handle?: React.ReactNode;\n interactive?: boolean;\n actions?: React.ReactNode;\n children: React.ReactNode;\n}\n\nconst AccordionItemBase = (props: AccordionItemProps) => {\n const { itemProps, triggerProps, contentProps } = React.useMemo(() => {\n const {\n // Item props.\n className,\n defaultOpen,\n disabled,\n ~~interactive,\n~~ onOpenChange,\n open,\n\n // Content props.\n children,\n\n // Trigger props.\n ...triggerProps\n } = props;\n\n return {\n itemProps: {\n className,\n defaultOpen,\n disabled,\n onOpenChange,\n open\n },\n triggerProps: {\n ...triggerProps~~,\n interactive~~\n },\n contentProps: { children, withIcon: !!props.icon, withHandle: !!props.handle }\n };\n }, [props]);\n\n return (\n <AccordionRoot\n {...itemProps}\n className={cn(\n [\n \"wby-border-b-sm wby-border-b-neutral-dimmed data-[state=open]:wby-rounded-bl-lg data-[state=open]:wby-rounded-br-lg\",\n \"group-[.wby-accordion-variant-container]:wby-rounded-lg\",\n \"group-[.wby-accordion-background-base]:wby-bg-neutral-base\",\n \"group-[.wby-accordion-background-light]:wby-bg-neutral-light\",\n \"data-[disabled]:wby-pointer-events-none data-[disabled]:wby-opacity-50\"\n ],\n itemProps.className\n )}\n >\n <AccordionTrigger {...triggerProps} />\n <AccordionContent {...contentProps} />\n </AccordionRoot>\n );\n};\n\nconst DecoratableAccordionItem = makeDecoratable(\"AccordionItem\", AccordionItemBase);\n\nconst AccordionItem = withStaticProps(DecoratableAccordionItem, {\n Icon: AccordionItemIcon,\n Action: AccordionItemAction~~,\n Handle: AccordionItemHandle~~\n});\n\nexport { AccordionItem, type AccordionItemProps };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,EAAE,EAAEC,eAAe,EAAEC,eAAe;AAC7C,SAASC,gBAAgB;AACzB,SAASC,gBAAgB;AACzB,SAASC,iBAAiB;AAC1B,SAASC,mBAAmB;AAC5B,SAASC,~~mBAAmB;AAC5B,SAASC,~~aAAa;~~AAYtB~~,MAAMC,iBAAiB,GAAIC,KAAyB,IAAK;EACrD,MAAM;IAAEC,SAAS;IAAEC,YAAY;IAAEC;EAAa,CAAC,~~GAAGd~~,KAAK,~~CAACe~~,OAAO,CAAC,MAAM;IAClE,MAAM;MACF;MACAC,SAAS;MACTC,WAAW;MACXC,QAAQ;MACRC,~~WAAW;MACXC,~~YAAY;MACZC,IAAI;MAEJ;MACAC,QAAQ;MAER;MACA,~~GAAGT~~;IACP,CAAC,GAAGF,KAAK;IAET,OAAO;MACHC,SAAS,EAAE;QACPI,SAAS;QACTC,WAAW;QACXC,QAAQ;~~QACRE~~,YAAY;QACZC;MACJ,CAAC;~~MACDR~~,YAAY,EAAE;QACV,GAAGA~~,YAAY~~;~~QACfM;MACJ~~,CAAC;~~MACDL~~,YAAY,EAAE;~~QAAEQ~~,QAAQ;QAAEC,QAAQ,EAAE,CAAC,~~CAACZ~~,KAAK,~~CAACa~~,IAAI;QAAEC,UAAU,EAAE,CAAC,~~CAACd~~,KAAK,~~CAACe~~;MAAO;IACjF,CAAC;EACL,CAAC,EAAE,~~CAACf~~,KAAK,CAAC,CAAC;EAEX,~~oBACIX~~,KAAA,~~CAAA2B~~,aAAA,~~CAAClB~~,aAAa,~~EAAAmB~~,MAAA,CAAAC,MAAA,~~KACNjB~~,SAAS;IACbI,SAAS,~~EAAEf~~,EAAE,CACT,CACI,~~qHAAqH~~,~~EACrH~~,yDAAyD,EACzD,4DAA4D,EAC5D,8DAA8D,EAC9D,wEAAwE,CAC3E,~~EACDW~~,SAAS,CAACI,SACd;EAAE,~~iBAEFhB~~,KAAA,~~CAAA2B~~,aAAA,~~CAACvB~~,gBAAgB,~~EAAKS~~,YAAe,CAAC,~~eACtCb~~,KAAA,~~CAAA2B~~,aAAA,~~CAACtB~~,gBAAgB,~~EAAKS~~,YAAe,CAC1B,CAAC;AAExB,CAAC;AAED,~~MAAMgB~~,wBAAwB,~~GAAG5B~~,eAAe,CAAC,eAAe,~~EAAEQ~~,iBAAiB,CAAC;AAEpF,~~MAAMqB~~,aAAa,~~GAAG5B~~,eAAe,~~CAAC2B~~,wBAAwB,EAAE;EAC5DE,IAAI,~~EAAE1B~~,iBAAiB;~~EACvB2B~~,MAAM,~~EAAE1B,mBAAmB~~;~~EAC3B2B,MAAM,EAAE1B;~~AACZ,CAAC,CAAC;AAEF,~~SAASuB~~,aAAa","ignoreList":[]}
1	+ {"version":3,"names":["React","cn","makeDecoratable","withStaticProps","AccordionTrigger","AccordionContent","AccordionItemIcon","AccordionItemAction","AccordionRoot","AccordionItemBase","props","itemProps","triggerProps","contentProps","useMemo","className","defaultOpen","disabled","onOpenChange","open","children","withIcon","icon","withHandle","handle","createElement","Object","assign","DecoratableAccordionItem","AccordionItem","Icon","Action"],"sources":["AccordionItem.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn, makeDecoratable, withStaticProps } from \"~/utils\";\nimport { AccordionTrigger } from \"./AccordionTrigger\";\nimport { AccordionContent } from \"./AccordionContent\";\nimport { AccordionItemIcon } from \"./AccordionItemIcon\";\nimport { AccordionItemAction } from \"./AccordionItemAction\";\nimport { AccordionRoot, type AccordionRootProps } from \"~/Accordion/components/AccordionRoot\";\n\ninterface AccordionItemProps extends Omit<AccordionRootProps, \"title\"> {\n title: React.ReactNode;\n description?: React.ReactNode;\n icon?: React.ReactNode;\n handle?: React.ReactNode;\n interactive?: boolean;\n draggable?: boolean;\n actions?: React.ReactNode;\n children: React.ReactNode;\n}\n\nconst AccordionItemBase = (props: AccordionItemProps) => {\n const { itemProps, triggerProps, contentProps } = React.useMemo(() => {\n const {\n // Item props.\n className,\n defaultOpen,\n disabled,\n onOpenChange,\n open,\n\n // Content props.\n children,\n\n // Trigger props.\n ...triggerProps\n } = props;\n\n return {\n itemProps: {\n className,\n defaultOpen,\n disabled,\n onOpenChange,\n open\n },\n triggerProps: {\n ...triggerProps\n },\n contentProps: { children, withIcon: !!props.icon, withHandle: !!props.handle }\n };\n }, [props]);\n\n return (\n <AccordionRoot\n {...itemProps}\n className={cn(\n [\n \"wby-group-item wby-border-b-sm wby-border-b-neutral-dimmed data-[state=open]:wby-rounded-bl-lg data-[state=open]:wby-rounded-br-lg\",\n \"group-[.wby-accordion-variant-container]:wby-rounded-lg\",\n \"group-[.wby-accordion-background-base]:wby-bg-neutral-base\",\n \"group-[.wby-accordion-background-light]:wby-bg-neutral-light\",\n \"data-[disabled]:wby-pointer-events-none data-[disabled]:wby-opacity-50\"\n ],\n itemProps.className\n )}\n >\n <AccordionTrigger {...triggerProps} />\n <AccordionContent {...contentProps} />\n </AccordionRoot>\n );\n};\n\nconst DecoratableAccordionItem = makeDecoratable(\"AccordionItem\", AccordionItemBase);\n\nconst AccordionItem = withStaticProps(DecoratableAccordionItem, {\n Icon: AccordionItemIcon,\n Action: AccordionItemAction\n});\n\nexport { AccordionItem, type AccordionItemProps };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,EAAE,EAAEC,eAAe,EAAEC,eAAe;AAC7C,SAASC,gBAAgB;AACzB,SAASC,gBAAgB;AACzB,SAASC,iBAAiB;AAC1B,SAASC,mBAAmB;AAC5B,SAASC,aAAa;AAatB,MAAMC,iBAAiB,GAAIC,KAAyB,IAAK;EACrD,MAAM;IAAEC,SAAS;IAAEC,YAAY;IAAEC;EAAa,CAAC,GAAGb,KAAK,CAACc,OAAO,CAAC,MAAM;IAClE,MAAM;MACF;MACAC,SAAS;MACTC,WAAW;MACXC,QAAQ;MACRC,YAAY;MACZC,IAAI;MAEJ;MACAC,QAAQ;MAER;MACA,GAAGR;IACP,CAAC,GAAGF,KAAK;IAET,OAAO;MACHC,SAAS,EAAE;QACPI,SAAS;QACTC,WAAW;QACXC,QAAQ;QACRC,YAAY;QACZC;MACJ,CAAC;MACDP,YAAY,EAAE;QACV,GAAGA;MACP,CAAC;MACDC,YAAY,EAAE;QAAEO,QAAQ;QAAEC,QAAQ,EAAE,CAAC,CAACX,KAAK,CAACY,IAAI;QAAEC,UAAU,EAAE,CAAC,CAACb,KAAK,CAACc;MAAO;IACjF,CAAC;EACL,CAAC,EAAE,CAACd,KAAK,CAAC,CAAC;EAEX,oBACIV,KAAA,CAAAyB,aAAA,CAACjB,aAAa,EAAAkB,MAAA,CAAAC,MAAA,KACNhB,SAAS;IACbI,SAAS,EAAEd,EAAE,CACT,CACI,oIAAoI,EACpI,yDAAyD,EACzD,4DAA4D,EAC5D,8DAA8D,EAC9D,wEAAwE,CAC3E,EACDU,SAAS,CAACI,SACd;EAAE,iBAEFf,KAAA,CAAAyB,aAAA,CAACrB,gBAAgB,EAAKQ,YAAe,CAAC,eACtCZ,KAAA,CAAAyB,aAAA,CAACpB,gBAAgB,EAAKQ,YAAe,CAC1B,CAAC;AAExB,CAAC;AAED,MAAMe,wBAAwB,GAAG1B,eAAe,CAAC,eAAe,EAAEO,iBAAiB,CAAC;AAEpF,MAAMoB,aAAa,GAAG1B,eAAe,CAACyB,wBAAwB,EAAE;EAC5DE,IAAI,EAAExB,iBAAiB;EACvByB,MAAM,EAAExB;AACZ,CAAC,CAAC;AAEF,SAASsB,aAAa","ignoreList":[]}

package/Accordion/components/AccordionItemAction.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { IconButtonProps as IconButtonProps } from "../../Button";
+import type { IconButtonProps as IconButtonProps } from "../../Button";
 type AccordionItemActionProps = IconButtonProps;
 declare const AccordionItemAction: (({ onClick, ...props }: AccordionItemActionProps) => React.JSX.Element) & {
     original: ({ onClick, ...props }: AccordionItemActionProps) => React.JSX.Element;

package/Accordion/components/AccordionItemAction.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","makeDecoratable","withStaticProps","IconButton","AccordionItemSeparator","AccordionItemActionBase","onClick","props","onClickCallback","useCallback","e","stopPropagation","createElement","Object","assign","variant","size","DecoratableAccordionItemAction","AccordionItemAction","Separator"],"sources":["AccordionItemAction.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { makeDecoratable, withStaticProps } from \"~/utils\";\nimport { ~~IconButton,~~ IconButtonProps as IconButtonProps } from \"~/Button\";\nimport { AccordionItemSeparator } from \"./AccordionItemSeparator\";\n\ntype AccordionItemActionProps = IconButtonProps;\n\nconst AccordionItemActionBase = ({ onClick, ...props }: AccordionItemActionProps) => {\n // We need to stop the event propagation to prevent the accordion from opening/closing when the action is clicked.\n const onClickCallback = React.useCallback(\n (e: React.MouseEvent<HTMLButtonElement>) => {\n e.stopPropagation();\n\n if (onClick) {\n onClick(e);\n }\n },\n [onClick]\n );\n\n return <IconButton variant={\"ghost\"} size={\"sm\"} {...props} onClick={onClickCallback} />;\n};\n\nconst DecoratableAccordionItemAction = makeDecoratable(\n \"AccordionItemAction\",\n AccordionItemActionBase\n);\n\nconst AccordionItemAction = withStaticProps(DecoratableAccordionItemAction, {\n Separator: AccordionItemSeparator\n});\n\nexport { AccordionItemAction, type AccordionItemActionProps };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,eAAe,EAAEC,eAAe;~~AACzC~~,SAASC,UAAU;AACnB,SAASC,sBAAsB;AAI/B,MAAMC,uBAAuB,GAAGA,CAAC;EAAEC,OAAO;EAAE,GAAGC;AAAgC,CAAC,KAAK;EACjF;EACA,MAAMC,eAAe,GAAGR,KAAK,CAACS,WAAW,CACpCC,CAAsC,IAAK;IACxCA,CAAC,CAACC,eAAe,CAAC,CAAC;IAEnB,IAAIL,OAAO,EAAE;MACTA,OAAO,CAACI,CAAC,CAAC;IACd;EACJ,CAAC,EACD,CAACJ,OAAO,CACZ,CAAC;EAED,oBAAON,KAAA,CAAAY,aAAA,CAACT,UAAU,EAAAU,MAAA,CAAAC,MAAA;IAACC,OAAO,EAAE,OAAQ;IAACC,IAAI,EAAE;EAAK,GAAKT,KAAK;IAAED,OAAO,EAAEE;EAAgB,EAAE,CAAC;AAC5F,CAAC;AAED,MAAMS,8BAA8B,GAAGhB,eAAe,CAClD,qBAAqB,EACrBI,uBACJ,CAAC;AAED,MAAMa,mBAAmB,GAAGhB,eAAe,CAACe,8BAA8B,EAAE;EACxEE,SAAS,EAAEf;AACf,CAAC,CAAC;AAEF,SAASc,mBAAmB","ignoreList":[]}
1	+ {"version":3,"names":["React","makeDecoratable","withStaticProps","IconButton","AccordionItemSeparator","AccordionItemActionBase","onClick","props","onClickCallback","useCallback","e","stopPropagation","createElement","Object","assign","variant","size","DecoratableAccordionItemAction","AccordionItemAction","Separator"],"sources":["AccordionItemAction.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { makeDecoratable, withStaticProps } from \"~/utils\";\nimport type { IconButtonProps as IconButtonProps } from \"~/Button\";\nimport { IconButton } from \"~/Button\";\nimport { AccordionItemSeparator } from \"./AccordionItemSeparator\";\n\ntype AccordionItemActionProps = IconButtonProps;\n\nconst AccordionItemActionBase = ({ onClick, ...props }: AccordionItemActionProps) => {\n // We need to stop the event propagation to prevent the accordion from opening/closing when the action is clicked.\n const onClickCallback = React.useCallback(\n (e: React.MouseEvent<HTMLButtonElement>) => {\n e.stopPropagation();\n\n if (onClick) {\n onClick(e);\n }\n },\n [onClick]\n );\n\n return <IconButton variant={\"ghost\"} size={\"sm\"} {...props} onClick={onClickCallback} />;\n};\n\nconst DecoratableAccordionItemAction = makeDecoratable(\n \"AccordionItemAction\",\n AccordionItemActionBase\n);\n\nconst AccordionItemAction = withStaticProps(DecoratableAccordionItemAction, {\n Separator: AccordionItemSeparator\n});\n\nexport { AccordionItemAction, type AccordionItemActionProps };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,eAAe,EAAEC,eAAe;AAEzC,SAASC,UAAU;AACnB,SAASC,sBAAsB;AAI/B,MAAMC,uBAAuB,GAAGA,CAAC;EAAEC,OAAO;EAAE,GAAGC;AAAgC,CAAC,KAAK;EACjF;EACA,MAAMC,eAAe,GAAGR,KAAK,CAACS,WAAW,CACpCC,CAAsC,IAAK;IACxCA,CAAC,CAACC,eAAe,CAAC,CAAC;IAEnB,IAAIL,OAAO,EAAE;MACTA,OAAO,CAACI,CAAC,CAAC;IACd;EACJ,CAAC,EACD,CAACJ,OAAO,CACZ,CAAC;EAED,oBAAON,KAAA,CAAAY,aAAA,CAACT,UAAU,EAAAU,MAAA,CAAAC,MAAA;IAACC,OAAO,EAAE,OAAQ;IAACC,IAAI,EAAE;EAAK,GAAKT,KAAK;IAAED,OAAO,EAAEE;EAAgB,EAAE,CAAC;AAC5F,CAAC;AAED,MAAMS,8BAA8B,GAAGhB,eAAe,CAClD,qBAAqB,EACrBI,uBACJ,CAAC;AAED,MAAMa,mBAAmB,GAAGhB,eAAe,CAACe,8BAA8B,EAAE;EACxEE,SAAS,EAAEf;AACf,CAAC,CAAC;AAEF,SAASc,mBAAmB","ignoreList":[]}

package/Accordion/components/AccordionItemDragHandle.d.ts ADDED Viewed

@@ -0,0 +1,8 @@
+import * as React from "react";
+import { type IconButtonProps } from "../../Button";
+interface AccordionItemDragHandleProps extends Omit<IconButtonProps, "icon"> {
+    icon?: React.ReactElement;
+    label?: string;
+}
+declare const AccordionItemDragHandle: ({ onClick, className, ...props }: AccordionItemDragHandleProps) => React.JSX.Element;
+export { AccordionItemDragHandle, type AccordionItemDragHandleProps };

package/Accordion/components/AccordionItemDragHandle.js ADDED Viewed

@@ -0,0 +1,36 @@
+import * as React from "react";
+import { ReactComponent as DragHandleIcon } from "@webiny/icons/drag_indicator.svg";
+import { Icon } from "../../Icon";
+import { IconButton } from "../../Button";
+import { cn } from "../../utils";
+const AccordionItemDragHandle = ({
+  onClick,
+  className,
+  ...props
+}) => {
+  // We need to stop the event propagation to prevent the accordion from opening/closing when the handle is clicked.
+  const onClickCallback = React.useCallback(e => {
+    e.stopPropagation();
+    if (onClick) {
+      onClick(e);
+    }
+  }, [onClick]);
+  return /*#__PURE__*/React.createElement("span", {
+    className: cn(["wby-absolute wby-top-1/2 -wby-left-sm -wby-translate-y-sm", "wby-invisible group-hover/trigger:wby-visible"], className)
+  }, /*#__PURE__*/React.createElement(IconButton, Object.assign({}, props, {
+    onClick: onClickCallback,
+    size: "xs",
+    iconSize: "default",
+    variant: "secondary",
+    className: "wby-cursor-grab",
+    icon: /*#__PURE__*/React.createElement(Icon, {
+      size: "sm",
+      color: "neutral-strong",
+      icon: /*#__PURE__*/React.createElement(DragHandleIcon, null),
+      label: "Drag handle"
+    })
+  })));
+};
+export { AccordionItemDragHandle };
+//# sourceMappingURL=AccordionItemDragHandle.js.map

package/Accordion/components/AccordionItemDragHandle.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["React","ReactComponent","DragHandleIcon","Icon","IconButton","cn","AccordionItemDragHandle","onClick","className","props","onClickCallback","useCallback","e","stopPropagation","createElement","Object","assign","size","iconSize","variant","icon","color","label"],"sources":["AccordionItemDragHandle.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { ReactComponent as DragHandleIcon } from \"@webiny/icons/drag_indicator.svg\";\nimport { Icon } from \"~/Icon\";\nimport { IconButton, type IconButtonProps } from \"~/Button\";\nimport { cn } from \"~/utils\";\n\ninterface AccordionItemDragHandleProps extends Omit<IconButtonProps, \"icon\"> {\n icon?: React.ReactElement;\n label?: string;\n}\n\nconst AccordionItemDragHandle = ({\n onClick,\n className,\n ...props\n}: AccordionItemDragHandleProps) => {\n // We need to stop the event propagation to prevent the accordion from opening/closing when the handle is clicked.\n const onClickCallback = React.useCallback(\n (e: React.MouseEvent<HTMLButtonElement>) => {\n e.stopPropagation();\n\n if (onClick) {\n onClick(e);\n }\n },\n [onClick]\n );\n\n return (\n <span\n className={cn(\n [\n \"wby-absolute wby-top-1/2 -wby-left-sm -wby-translate-y-sm\",\n \"wby-invisible group-hover/trigger:wby-visible\"\n ],\n className\n )}\n >\n <IconButton\n {...props}\n onClick={onClickCallback}\n size={\"xs\"}\n iconSize={\"default\"}\n variant={\"secondary\"}\n className={\"wby-cursor-grab\"}\n icon={\n <Icon\n size={\"sm\"}\n color={\"neutral-strong\"}\n icon={<DragHandleIcon />}\n label={\"Drag handle\"}\n />\n }\n />\n </span>\n );\n};\n\nexport { AccordionItemDragHandle, type AccordionItemDragHandleProps };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,cAAc,IAAIC,cAAc,QAAQ,kCAAkC;AACnF,SAASC,IAAI;AACb,SAASC,UAAU;AACnB,SAASC,EAAE;AAOX,MAAMC,uBAAuB,GAAGA,CAAC;EAC7BC,OAAO;EACPC,SAAS;EACT,GAAGC;AACuB,CAAC,KAAK;EAChC;EACA,MAAMC,eAAe,GAAGV,KAAK,CAACW,WAAW,CACpCC,CAAsC,IAAK;IACxCA,CAAC,CAACC,eAAe,CAAC,CAAC;IAEnB,IAAIN,OAAO,EAAE;MACTA,OAAO,CAACK,CAAC,CAAC;IACd;EACJ,CAAC,EACD,CAACL,OAAO,CACZ,CAAC;EAED,oBACIP,KAAA,CAAAc,aAAA;IACIN,SAAS,EAAEH,EAAE,CACT,CACI,2DAA2D,EAC3D,+CAA+C,CAClD,EACDG,SACJ;EAAE,gBAEFR,KAAA,CAAAc,aAAA,CAACV,UAAU,EAAAW,MAAA,CAAAC,MAAA,KACHP,KAAK;IACTF,OAAO,EAAEG,eAAgB;IACzBO,IAAI,EAAE,IAAK;IACXC,QAAQ,EAAE,SAAU;IACpBC,OAAO,EAAE,WAAY;IACrBX,SAAS,EAAE,iBAAkB;IAC7BY,IAAI,eACApB,KAAA,CAAAc,aAAA,CAACX,IAAI;MACDc,IAAI,EAAE,IAAK;MACXI,KAAK,EAAE,gBAAiB;MACxBD,IAAI,eAAEpB,KAAA,CAAAc,aAAA,CAACZ,cAAc,MAAE,CAAE;MACzBoB,KAAK,EAAE;IAAc,CACxB;EACJ,EACJ,CACC,CAAC;AAEf,CAAC;AAED,SAAShB,uBAAuB","ignoreList":[]}

package/Accordion/components/AccordionItemIcon.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { IconProps as IconComponentProps } from "../../Icon";
+import type { IconProps as IconComponentProps } from "../../Icon";
 type AccordionItemIconProps = IconComponentProps;
 export declare const AccordionItemIcon: ((props: AccordionItemIconProps) => React.JSX.Element) & {
     original: (props: AccordionItemIconProps) => React.JSX.Element;

package/Accordion/components/AccordionItemIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","makeDecoratable","Icon","IconComponent","AccordionItemIconBase","props","createElement","Object","assign","size","color","AccordionItemIcon"],"sources":["AccordionItemIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { makeDecoratable } from \"~/utils\";\nimport { ~~Icon~~ as ~~IconComponent,~~ ~~IconProps~~ as ~~IconComponentProps~~ } from \"~/Icon\";\n\ntype AccordionItemIconProps = IconComponentProps;\n\nconst AccordionItemIconBase = (props: AccordionItemIconProps) => {\n return <IconComponent size={\"md\"} color={\"neutral-strong\"} {...props} />;\n};\n\nexport const AccordionItemIcon = makeDecoratable(\"AccordionItemIcon\", AccordionItemIconBase);\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,eAAe;~~AACxB~~,SAASC,IAAI,IAAIC,aAAa;AAI9B,MAAMC,qBAAqB,GAAIC,KAA6B,IAAK;EAC7D,oBAAOL,KAAA,CAAAM,aAAA,CAACH,aAAa,EAAAI,MAAA,CAAAC,MAAA;IAACC,IAAI,EAAE,IAAK;IAACC,KAAK,EAAE;EAAiB,GAAKL,KAAK,CAAG,CAAC;AAC5E,CAAC;AAED,OAAO,MAAMM,iBAAiB,GAAGV,eAAe,CAAC,mBAAmB,EAAEG,qBAAqB,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["React","makeDecoratable","Icon","IconComponent","AccordionItemIconBase","props","createElement","Object","assign","size","color","AccordionItemIcon"],"sources":["AccordionItemIcon.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { makeDecoratable } from \"~/utils\";\nimport type { IconProps as IconComponentProps } from \"~/Icon\";\nimport { Icon as IconComponent } from \"~/Icon\";\n\ntype AccordionItemIconProps = IconComponentProps;\n\nconst AccordionItemIconBase = (props: AccordionItemIconProps) => {\n return <IconComponent size={\"md\"} color={\"neutral-strong\"} {...props} />;\n};\n\nexport const AccordionItemIcon = makeDecoratable(\"AccordionItemIcon\", AccordionItemIconBase);\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,eAAe;AAExB,SAASC,IAAI,IAAIC,aAAa;AAI9B,MAAMC,qBAAqB,GAAIC,KAA6B,IAAK;EAC7D,oBAAOL,KAAA,CAAAM,aAAA,CAACH,aAAa,EAAAI,MAAA,CAAAC,MAAA;IAACC,IAAI,EAAE,IAAK;IAACC,KAAK,EAAE;EAAiB,GAAKL,KAAK,CAAG,CAAC;AAC5E,CAAC;AAED,OAAO,MAAMM,iBAAiB,GAAGV,eAAe,CAAC,mBAAmB,EAAEG,qBAAqB,CAAC","ignoreList":[]}

package/Accordion/components/AccordionTrigger.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as React from "react";
 import { type AccordionItemProps } from "./AccordionItem";
-type AccordionTriggerProps = Pick<AccordionItemProps, "title" | "description" | "icon" | "handle" | "interactive" | "actions">;
-declare const AccordionTrigger: ({ title, description, actions, icon, handle, interactive }: AccordionTriggerProps) => React.JSX.Element;
+type AccordionTriggerProps = Pick<AccordionItemProps, "title" | "description" | "icon" | "handle" | "interactive" | "actions" | "draggable">;
+declare const AccordionTrigger: ({ title, description, actions, icon, interactive, draggable }: AccordionTriggerProps) => React.JSX.Element;
 export { AccordionTrigger };

package/Accordion/components/AccordionTrigger.js CHANGED Viewed

@@ -4,13 +4,14 @@ import { Collapsible as CollapsiblePrimitive } from "radix-ui";
 import { cn } from "../../utils";
 import { AccordionItemAction } from "./AccordionItemAction";
 import { Icon } from "../../Icon";
+import { AccordionItemDragHandle } from "./AccordionItemDragHandle";
 const AccordionTrigger = ({
   title,
   description,
   actions,
   icon,
-  handle,
-  interactive = true
+  interactive = true,
+  draggable
 }) => {
   // The following three attributes are required for the trigger to act as a button.
   // We can't use the default button element here because the content of the trigger
@@ -32,8 +33,8 @@ const AccordionTrigger = ({
     asChild: true,
     onClick: e => !interactive && e.preventDefault() // Prevent clicking if not interactive
   }, /*#__PURE__*/React.createElement("div", Object.assign({}, divAsButtonProps, {
-    className: cn("wby-w-full wby-flex wby-items-center wby-cursor-pointer", "focus-visible:wby-outline-none focus-visible:wby-border-none focus-visible:wby-ring-sm focus-visible:wby-ring-primary-dimmed", "hover:wby-bg-neutral-dimmed", "group-[.wby-accordion-variant-container]:wby-rounded-lg", "[&[data-state=open]_[data-role=open-close-indicator]]:wby-rotate-180", interactive ? "wby-cursor-pointer" : "wby-cursor-default")
-  }), handle, /*#__PURE__*/React.createElement("div", {
+    className: cn("wby-group/trigger wby-w-full wby-flex wby-items-center wby-cursor-pointer wby-relative", "focus-visible:wby-outline-none focus-visible:wby-border-none focus-visible:wby-ring-sm focus-visible:wby-ring-primary-dimmed", "hover:wby-bg-neutral-dimmed", "group-[.wby-accordion-variant-container]:wby-rounded-lg", "[&[data-state=open]_[data-role=open-close-indicator]]:wby-rotate-180", interactive ? "wby-cursor-pointer" : "wby-cursor-default")
+  }), draggable ? /*#__PURE__*/React.createElement(AccordionItemDragHandle, null) : null, /*#__PURE__*/React.createElement("div", {
     className: "wby-w-full wby-flex wby-justify-between wby-items-center wby-px-md wby-py-sm-extra"
   }, icon && /*#__PURE__*/React.createElement("div", {
     className: "wby-mr-md"