@servicetitan/design-system 14.4.3 → 14.5.1

package/dist/components/ActionMenu/ActionMenu.d.ts

@@ -1,11 +1,16 @@
-import React, { FC } from 'react';
+import React, { FC, ReactNode } from 'react';
 import { PopoverProps } from '../Popover';
 import { ActionMenuGroup } from './ActionMenuGroup';
 import { ActionMenuItem } from './ActionMenuItem';
 /**
  * ActionMenu properties
  */
-export declare type ActionMenuProps = PopoverProps;
+export declare type ActionMenuProps = Omit<PopoverProps, 'trigger'> & {
+    trigger?: PopoverProps['trigger'] | ((params: {
+        toggle: (newValue?: boolean) => void;
+        isOpen: boolean;
+    }) => ReactNode);
+};
 export interface ActionMenuContext {
     itemsContainerRef: React.RefObject<HTMLElement>;
     onClickOutside: PopoverProps['onClickOutside'];

package/dist/components/ActionMenu/ActionMenu.js

@@ -18,9 +18,29 @@ import { useArrowNav } from '../../hooks/useArrowNav';
 import { useLatestEvent } from './useLatestEvent';
 export const ActionMenu = (_a) => {
     var { children, className, direction = 'br', focusTrapOptions, padding = null, // Disable Popover's default padding
-    wrapperClassName, width = 's' } = _a, rest = __rest(_a, ["children", "className", "direction", "focusTrapOptions", "padding", "wrapperClassName", "width"]);
+    wrapperClassName, width = 's', open: openProp, trigger: triggerProp, onClickOutside } = _a, rest = __rest(_a, ["children", "className", "direction", "focusTrapOptions", "padding", "wrapperClassName", "width", "open", "trigger", "onClickOutside"]);
     const menuContext = React.useContext(ActionMenuContext);
     const isNested = () => (menuContext === null || menuContext === void 0 ? void 0 : menuContext.length) && (menuContext === null || menuContext === void 0 ? void 0 : menuContext.length) > 0;
+    const isControlled = typeof openProp !== 'undefined';
+    const [internalOpen, setInternalOpen] = React.useState(false);
+    const open = isControlled ? openProp : internalOpen;
+    const handleOpenToggle = (newValue) => {
+        if (!isControlled) {
+            setInternalOpen(typeof newValue === 'boolean' ? newValue : (prev) => !prev);
+        }
+    };
+    const handleClickOutside = () => {
+        if (!isControlled) {
+            setInternalOpen(false);
+        }
+        onClickOutside === null || onClickOutside === void 0 ? void 0 : onClickOutside();
+    };
+    const trigger = typeof triggerProp === 'function'
+        ? triggerProp({
+            isOpen: open,
+            toggle: handleOpenToggle,
+        })
+        : triggerProp;
     const handleArrowKeys = (e, data) => {
         var _a, _b, _c, _d, _e;
         const cascadingItem = (_b = (_a = data.active) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.contains('ActionMenuItem--cascading');
@@ -47,16 +67,14 @@ export const ActionMenu = (_a) => {
             }
             else {
                 el.tabIndex = 0;
-                setTimeout(() => {
-                    el.focus(); // Pointer event ? set focus wrapper
-                }, 0);
+                el.focus(); // Pointer event ? set focus wrapper
                 el.addEventListener('blur', () => el.removeAttribute('tabIndex'));
             }
         };
         if (rest.open && el)
             Promise.resolve().then(setFocus);
     }, [rest.open]); // eslint-disable-line
-    return (React.createElement(Popover, Object.assign({ className: classnames(className, 'ActionMenu__OverlayWrapper'), focusTrapOptions: Object.assign({ autoFocus: false, autoFocusContainer: false, focusLock: false, restoreFocus: true }, focusTrapOptions), wrapperClassName: classnames(wrapperClassName, 'ActionMenu__TriggerWrapper'), popoverContentClassName: "ActionMenu", direction: direction, padding: padding, portal: true, width: width, "data-anvil-component": "ActionMenu" }, rest),
+    return (React.createElement(Popover, Object.assign({ className: classnames(className, 'ActionMenu__OverlayWrapper'), focusTrapOptions: Object.assign({ autoFocus: false, autoFocusContainer: false, focusLock: false, restoreFocus: true }, focusTrapOptions), wrapperClassName: classnames(wrapperClassName, 'ActionMenu__TriggerWrapper'), popoverContentClassName: "ActionMenu", direction: direction, padding: padding, portal: true, width: width, "data-anvil-component": "ActionMenu", trigger: trigger, open: open, onClickOutside: handleClickOutside }, rest),
         React.createElement(ActionMenuContext.Provider, { value: menuContext.concat({
                 itemsContainerRef: containerRef,
                 onClickOutside: rest === null || rest === void 0 ? void 0 : rest.onClickOutside,

package/dist/components/ActionMenu/ActionMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionMenu.js","sourceRoot":"","sources":["../../../src/components/ActionMenu/ActionMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { FC } from 'react';\nimport classnames from 'classnames';\n\nimport { Popover, PopoverProps } from '../Popover';\nimport { ActionMenuGroup } from './ActionMenuGroup';\nimport { ActionMenuItem } from './ActionMenuItem';\nimport { useArrowNav } from '../../hooks/useArrowNav';\nimport { useLatestEvent } from './useLatestEvent';\n\n/**\n * ActionMenu properties\n */\nexport type ActionMenuProps = PopoverProps;\nexport interface ActionMenuContext {\n\titemsContainerRef: React.RefObject<HTMLElement>;\n\tonClickOutside: PopoverProps['onClickOutside'];\n}\n\ninterface ActionMenu extends FC<ActionMenuProps> {\n\t/** Subcomponents */\n\tGroup: typeof ActionMenuGroup;\n\tItem: typeof ActionMenuItem;\n}\n\nexport const ActionMenu: ActionMenu = ({\n\tchildren,\n\tclassName,\n\tdirection = 'br',\n\tfocusTrapOptions,\n\tpadding = null, // Disable Popover's default padding\n\twrapperClassName,\n\twidth = 's',\n\t...rest\n}) => {\n\tconst menuContext = React.useContext(ActionMenuContext);\n\tconst isNested = () => menuContext?.length && menuContext?.length > 0;\n\n\tconst handleArrowKeys = (e: KeyboardEvent, data: any) => {\n\t\tconst cascadingItem = data.active?.classList?.contains(\n\t\t\t'ActionMenuItem--cascading'\n\t\t);\n\n\t\tif (e.key === 'ArrowLeft' || e.key === 'ArrowRight') data.disableOnce(); // Prevent focus move on left-right or when focus is not visible yet (no keyboard interaction)\n\t\tif (e.key === 'ArrowLeft' && isNested())\n\t\t\trest.onClickOutside?.(e as any); // Close ActionMenu, if nested\n\t\tif (e.key === 'ArrowRight' && cascadingItem) data.active?.click?.(); // Open nested\n\t};\n\n\tconst containerRef = useArrowNav({\n\t\tdisabled: !rest.open,\n\t\tonKeyDown: handleArrowKeys,\n\t});\n\n\tconst latestEvent = useLatestEvent();\n\n\tReact.useEffect(() => {\n\t\tconst el = containerRef.current;\n\n\t\tconst setFocus = () => {\n\t\t\tif (!latestEvent.current) return; // Latest event is undefined yet\n\t\t\tif (latestEvent.current?.type === 'keydown') {\n\t\t\t\tel.querySelector('button:not([disabled])')?.focus(); // Keyboard event ? set focus first item\n\t\t\t} else {\n\t\t\t\tel.tabIndex = 0;\n\t\t\t\tsetTimeout(() => {\n\t\t\t\t\tel.focus(); // Pointer event ? set focus wrapper\n\t\t\t\t}, 0);\n\t\t\t\tel.addEventListener('blur', () =>\n\t\t\t\t\tel.removeAttribute('tabIndex')\n\t\t\t\t);\n\t\t\t}\n\t\t};\n\n\t\tif (rest.open && el) Promise.resolve().then(setFocus);\n\t}, [rest.open]); // eslint-disable-line\n\n\treturn (\n\t\t<Popover\n\t\t\tclassName={classnames(className, 'ActionMenu__OverlayWrapper')}\n\t\t\tfocusTrapOptions={{\n\t\t\t\tautoFocus: false,\n\t\t\t\tautoFocusContainer: false,\n\t\t\t\tfocusLock: false,\n\t\t\t\trestoreFocus: true,\n\t\t\t\t...focusTrapOptions,\n\t\t\t}}\n\t\t\twrapperClassName={classnames(\n\t\t\t\twrapperClassName,\n\t\t\t\t'ActionMenu__TriggerWrapper'\n\t\t\t)}\n\t\t\tpopoverContentClassName=\"ActionMenu\"\n\t\t\tdirection={direction}\n\t\t\tpadding={padding}\n\t\t\tportal\n\t\t\twidth={width}\n\t\t\tdata-anvil-component=\"ActionMenu\"\n\t\t\t{...rest}\n\t\t>\n\t\t\t<ActionMenuContext.Provider\n\t\t\t\tvalue={menuContext.concat({\n\t\t\t\t\titemsContainerRef: containerRef,\n\t\t\t\t\tonClickOutside: rest?.onClickOutside,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t<div className=\"ActionMenu__ItemsWrapper\" ref={containerRef}>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</ActionMenuContext.Provider>\n\t\t</Popover>\n\t);\n};\n\nActionMenu.Group = ActionMenuGroup;\nActionMenu.Item = ActionMenuItem;\n\nexport const ActionMenuContext = React.createContext<ActionMenuContext[]>([]);\n"]}
+{"version":3,"file":"ActionMenu.js","sourceRoot":"","sources":["../../../src/components/ActionMenu/ActionMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { FC, ReactNode } from 'react';\nimport classnames from 'classnames';\n\nimport { Popover, PopoverProps } from '../Popover';\nimport { ActionMenuGroup } from './ActionMenuGroup';\nimport { ActionMenuItem } from './ActionMenuItem';\nimport { useArrowNav } from '../../hooks/useArrowNav';\nimport { useLatestEvent } from './useLatestEvent';\n\n/**\n * ActionMenu properties\n */\nexport type ActionMenuProps = Omit<PopoverProps, 'trigger'> & {\n\ttrigger?:\n\t\t| PopoverProps['trigger']\n\t\t| ((params: {\n\t\t\t\ttoggle: (newValue?: boolean) => void;\n\t\t\t\tisOpen: boolean;\n\t\t  }) => ReactNode);\n};\nexport interface ActionMenuContext {\n\titemsContainerRef: React.RefObject<HTMLElement>;\n\tonClickOutside: PopoverProps['onClickOutside'];\n}\n\ninterface ActionMenu extends FC<ActionMenuProps> {\n\t/** Subcomponents */\n\tGroup: typeof ActionMenuGroup;\n\tItem: typeof ActionMenuItem;\n}\n\nexport const ActionMenu: ActionMenu = ({\n\tchildren,\n\tclassName,\n\tdirection = 'br',\n\tfocusTrapOptions,\n\tpadding = null, // Disable Popover's default padding\n\twrapperClassName,\n\twidth = 's',\n\topen: openProp,\n\ttrigger: triggerProp,\n\tonClickOutside,\n\t...rest\n}) => {\n\tconst menuContext = React.useContext(ActionMenuContext);\n\tconst isNested = () => menuContext?.length && menuContext?.length > 0;\n\n\tconst isControlled = typeof openProp !== 'undefined';\n\tconst [internalOpen, setInternalOpen] = React.useState(false);\n\tconst open = isControlled ? openProp : internalOpen;\n\n\tconst handleOpenToggle = (newValue?: boolean) => {\n\t\tif (!isControlled) {\n\t\t\tsetInternalOpen(\n\t\t\t\ttypeof newValue === 'boolean' ? newValue : (prev) => !prev\n\t\t\t);\n\t\t}\n\t};\n\n\tconst handleClickOutside = () => {\n\t\tif (!isControlled) {\n\t\t\tsetInternalOpen(false);\n\t\t}\n\t\tonClickOutside?.();\n\t};\n\n\tconst trigger =\n\t\ttypeof triggerProp === 'function'\n\t\t\t? triggerProp({\n\t\t\t\t\tisOpen: open,\n\t\t\t\t\ttoggle: handleOpenToggle,\n\t\t\t  })\n\t\t\t: triggerProp;\n\n\tconst handleArrowKeys = (e: KeyboardEvent, data: any) => {\n\t\tconst cascadingItem = data.active?.classList?.contains(\n\t\t\t'ActionMenuItem--cascading'\n\t\t);\n\n\t\tif (e.key === 'ArrowLeft' || e.key === 'ArrowRight') data.disableOnce(); // Prevent focus move on left-right or when focus is not visible yet (no keyboard interaction)\n\t\tif (e.key === 'ArrowLeft' && isNested())\n\t\t\trest.onClickOutside?.(e as any); // Close ActionMenu, if nested\n\t\tif (e.key === 'ArrowRight' && cascadingItem) data.active?.click?.(); // Open nested\n\t};\n\n\tconst containerRef = useArrowNav({\n\t\tdisabled: !rest.open,\n\t\tonKeyDown: handleArrowKeys,\n\t});\n\n\tconst latestEvent = useLatestEvent();\n\n\tReact.useEffect(() => {\n\t\tconst el = containerRef.current;\n\n\t\tconst setFocus = () => {\n\t\t\tif (!latestEvent.current) return; // Latest event is undefined yet\n\t\t\tif (latestEvent.current?.type === 'keydown') {\n\t\t\t\tel.querySelector('button:not([disabled])')?.focus(); // Keyboard event ? set focus first item\n\t\t\t} else {\n\t\t\t\tel.tabIndex = 0;\n\t\t\t\tel.focus(); // Pointer event ? set focus wrapper\n\t\t\t\tel.addEventListener('blur', () =>\n\t\t\t\t\tel.removeAttribute('tabIndex')\n\t\t\t\t);\n\t\t\t}\n\t\t};\n\n\t\tif (rest.open && el) Promise.resolve().then(setFocus);\n\t}, [rest.open]); // eslint-disable-line\n\n\treturn (\n\t\t<Popover\n\t\t\tclassName={classnames(className, 'ActionMenu__OverlayWrapper')}\n\t\t\tfocusTrapOptions={{\n\t\t\t\tautoFocus: false,\n\t\t\t\tautoFocusContainer: false,\n\t\t\t\tfocusLock: false,\n\t\t\t\trestoreFocus: true,\n\t\t\t\t...focusTrapOptions,\n\t\t\t}}\n\t\t\twrapperClassName={classnames(\n\t\t\t\twrapperClassName,\n\t\t\t\t'ActionMenu__TriggerWrapper'\n\t\t\t)}\n\t\t\tpopoverContentClassName=\"ActionMenu\"\n\t\t\tdirection={direction}\n\t\t\tpadding={padding}\n\t\t\tportal\n\t\t\twidth={width}\n\t\t\tdata-anvil-component=\"ActionMenu\"\n\t\t\ttrigger={trigger}\n\t\t\topen={open}\n\t\t\tonClickOutside={handleClickOutside}\n\t\t\t{...rest}\n\t\t>\n\t\t\t<ActionMenuContext.Provider\n\t\t\t\tvalue={menuContext.concat({\n\t\t\t\t\titemsContainerRef: containerRef,\n\t\t\t\t\tonClickOutside: rest?.onClickOutside,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t<div className=\"ActionMenu__ItemsWrapper\" ref={containerRef}>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</ActionMenuContext.Provider>\n\t\t</Popover>\n\t);\n};\n\nActionMenu.Group = ActionMenuGroup;\nActionMenu.Item = ActionMenuItem;\n\nexport const ActionMenuContext = React.createContext<ActionMenuContext[]>([]);\n"]}

package/dist/components/ActionMenu/ActionMenu.stories.d.ts

@@ -10,6 +10,7 @@ declare const _default: {
     includeStories: string[];
 };
 export default _default;
+export declare const Tester: () => JSX.Element;
 export declare const Menu: (props: any) => JSX.Element;
 export declare const MenuItem: (props: any) => JSX.Element;
 export declare const actionMenu: {
@@ -18,7 +19,6 @@ export declare const actionMenu: {
         sharp: boolean;
         width: string;
         direction: string;
-        open: boolean;
     };
 };
 export declare const testContextMenu: {

package/dist/components/ActionMenu/ActionMenu.stories.js

@@ -20,9 +20,17 @@ export default {
         'testOverlayComponents',
         'testActionMenuOverflow',
         'TestingMultipleActionMenu',
+        'Tester',
     ],
 };
 const log = () => console.log('item clicked, closing');
+export const Tester = () => {
+    return (React.createElement(ActionMenu, { "data-tester": "test", trigger: ({ toggle }) => (React.createElement(Button, { onClick: toggle }, "Open Menu")) },
+        React.createElement(ActionMenu, { direction: "rb", trigger: ({ toggle }) => (React.createElement(ActionMenu.Item, { cascading: true, onClick: toggle }, "Menu 01")) },
+            React.createElement(ActionMenu.Item, null, "Nested Menu 01"),
+            React.createElement(ActionMenu.Item, null, "Nested Menu 02")),
+        React.createElement(ActionMenu.Item, null, "Menu 02")));
+};
 export const Menu = (props) => {
     var _a, _b;
     const { direction, onClose, onOpen, trigger, portal = true } = props, rest = __rest(props, ["direction", "onClose", "onOpen", "trigger", "portal"]);
@@ -120,21 +128,43 @@ const ContactItems = () => (React.createElement(React.Fragment, null,
                 React.createElement(MenuItem, { onClick: log }, "Item 5"),
                 React.createElement(MenuItem, { onClick: log }, "Item 6"))))));
 export const actionMenu = (args) => {
+    const [open, setOpen] = useState(true);
+    const handleClick = () => setOpen(!open);
+    const handleClickOutside = () => setOpen(false);
     const [key, setKey] = React.useState(0);
-    const refresh = () => setKey(key + 1);
+    const handleRefresh = () => setKey(key + 1);
     return (React.createElement("div", { key: key, className: "p-4 ta-center" },
         loremIpsum,
-        React.createElement(Menu, Object.assign({}, args, { className: "classname-test", wrapperClassName: "wrapper-classname-test", trigger: (props) => (React.createElement(Button, Object.assign({}, props, { iconName: "more_vert", iconPosition: "right" }), "Action Menu")), onOpen: () => console.log('onOpen fired'), onClose: () => console.log('onClose fired') }),
+        React.createElement(ActionMenu, Object.assign({}, args, { className: "classname-test", wrapperClassName: "wrapper-classname-test", trigger: (props) => (React.createElement(Button, Object.assign({}, props, { onClick: handleClick }),
+                "Action Menu",
+                React.createElement(Icon, { name: "more_vert", size: "24", className: "m-l-2" }))), open: open, onClickOutside: handleClickOutside, onOpen: () => console.log('onOpen fired'), onClose: () => console.log('onClose fired') }),
+            React.createElement(ActionMenu.Item, { onClick: log }, "Item"),
+            React.createElement(ActionMenu.Item, { disabled: true }, "Disabled"),
+            React.createElement(Menu, { direction: "rb", trigger: (p) => (React.createElement(MenuItem, Object.assign({}, p, { cascading: true }), "Cascading")) },
+                React.createElement(ContactItems, null)),
+            React.createElement(ActionMenu.Group, null,
+                React.createElement(MenuItem, { disabled: true }, "Disabled"),
+                React.createElement(MenuItem, { onClick: log, icon: "help" }, "Icon"),
+                React.createElement(MenuItem, { onClick: log, icon: "help", disabled: true }, "Icon Disabled")),
+            React.createElement(ActionMenu.Group, { label: "Group with Label" },
+                React.createElement(MenuItem, { onClick: log, icon: "help" }, "Icon"),
+                React.createElement(Menu, { direction: "rb", trigger: (p) => (React.createElement(MenuItem, Object.assign({}, p, { cascading: true, icon: "help", iconColor: "red" }), "Colored Icon Cascading Submenu")) },
+                    React.createElement(ContactItems, null)),
+                React.createElement(MenuItem, { onClick: log },
+                    React.createElement(BodyText, { size: "medium", className: "m-b-0-i" }, "Download XLSX")))),
+        React.createElement(ActionMenu, Object.assign({}, args, { className: "classname-test", wrapperClassName: "wrapper-classname-test", popoverContentClassName: "ActionMenu" // This is only added to fix SB issue
+            , trigger: ({ isOpen, toggle }) => (React.createElement(Button, { className: "m-l-4", onClick: toggle, selected: isOpen },
+                "Action Menu Uncontrolled",
+                React.createElement(Icon, { name: "more_vert", size: "24", className: "m-l-2" }))) }),
             React.createElement(MenuItems, null)),
         loremIpsum,
         React.createElement("div", { className: "m-x-8 ta-left" },
-            React.createElement(Button, { onClick: refresh }, "Refresh"))));
+            React.createElement(Button, { onClick: handleRefresh }, "Refresh"))));
 };
 actionMenu.args = {
     sharp: false,
     width: 's',
     direction: 'bl',
-    open: true,
 };
 export const testContextMenu = (args) => {
     const [open, setOpen] = useState(false);
@@ -169,6 +199,7 @@ testContextMenu.args = {
     width: 's',
 };
 export const testOverlayComponents = (args) => {
+    const [menuOpen, setMenuOpen] = useState(true);
     const [modalOpen, setModalOpen] = useState(false);
     const [drawerOpen, setDrawerOpen] = useState(false);
     const [dialogOpen, setDialogOpen] = useState(false);
@@ -186,7 +217,7 @@ export const testOverlayComponents = (args) => {
             skipFromButtons: true,
         },
     ];
-    const CounterButton = () => (React.createElement(Button, { className: "m-x-1", iconName: "plus_one", onClick: () => {
+    const CounterButton = () => (React.createElement(Button, { className: "m-x-1", iconName: "project", onClick: () => {
             setCounter(counter + 1);
             console.log('counter:', counter);
         } }));
@@ -197,7 +228,7 @@ export const testOverlayComponents = (args) => {
         i)))));
     return (React.createElement("div", null,
         React.createElement(BodyText, { className: "m-y-2" }, "ActionMenu to open Modal, Drawer, Dialog, Takeover, Popover, Tooltip:"),
-        React.createElement(Menu, Object.assign({ trigger: (props) => (React.createElement(Button, Object.assign({}, props),
+        React.createElement(Menu, Object.assign({ open: menuOpen, onClick: () => setMenuOpen(!menuOpen), onClickOutside: () => setMenuOpen(false), trigger: (props) => (React.createElement(Button, Object.assign({}, props),
                 "Action Menu",
                 React.createElement(Icon, { name: "more_vert", size: "24", className: "m-l-2" }))) }, args),
             overlays.map((i, ix) => (React.createElement(MenuItem, { onClick: i.fn, key: ix },
@@ -234,8 +265,11 @@ testOverlayComponents.args = {
     direction: 'bl',
 };
 export const testActionMenuOverflow = (args) => {
+    const [open, setOpen] = useState(true);
+    const handleClick = () => setOpen(!open);
+    const handleClickOutside = () => setOpen(false);
     return (React.createElement("div", { style: { width: '740px' } },
-        React.createElement(Menu, Object.assign({}, args, { direction: "br", width: "xs", scrollHeight: "256px", trigger: (p) => React.createElement(Button, Object.assign({}, p), "Action Menu") }),
+        React.createElement(Menu, Object.assign({}, args, { direction: "br", width: "xs", scrollHeight: "256px", trigger: (p) => (React.createElement(Button, Object.assign({}, p, { onClick: handleClick }), "Action Menu")), open: open, onClickOutside: handleClickOutside }),
             React.createElement(MenuItem, null, "Item 1"),
             React.createElement(MenuItem, { disabled: true }, "Item 2 (disabled)"),
             React.createElement(MenuItem, null, "Item 3"),
@@ -246,7 +280,6 @@ export const testActionMenuOverflow = (args) => {
             React.createElement(MenuItem, null, "Item 6")),
         loremIpsum));
 };
-const loremIpsum = (React.createElement(BodyText, { className: "m-x-8 m-y-4 ta-left" }, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."));
 export const TestingMultipleActionMenu = () => {
     const [firstOpen, setFirstOpen] = useState(false);
     const [secondOpen, setSecondOpen] = useState(false);
@@ -256,4 +289,5 @@ export const TestingMultipleActionMenu = () => {
                 React.createElement(ActionMenu, { open: firstOpen, direction: "br", trigger: React.createElement(Button, { onClick: () => setFirstOpen(!firstOpen) }, "Element1") }, "aa"),
                 React.createElement(ActionMenu, { open: secondOpen, direction: "br", trigger: React.createElement(Button, { onClick: () => setSecondOpen(!secondOpen) }, "Element2") }, "aa")))));
 };
+const loremIpsum = (React.createElement(BodyText, { className: "m-x-8 m-y-4 ta-left" }, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."));
 //# sourceMappingURL=ActionMenu.stories.js.map

package/dist/components/ActionMenu/ActionMenu.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionMenu.stories.js","sourceRoot":"","sources":["../../../src/components/ActionMenu/ActionMenu.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect, useState } from 'react';\nimport {\n\tActionMenu,\n\tActionMenuContext,\n\tBodyText,\n\tButton,\n\tCard,\n\tIcon,\n\tTooltip,\n\tModal,\n\tDrawer,\n\tDialog,\n\tTakeover,\n\tPopover,\n\tuseStorybookFigmaAddon,\n\tStack,\n} from '../../system';\n\nexport default {\n\ttitle: 'Components/ActionMenu',\n\tparameters: {\n\t\t...useStorybookFigmaAddon('32%3A1082'),\n\t},\n\tincludeStories: [\n\t\t'actionMenu',\n\t\t'testContextMenu',\n\t\t'testOverlayComponents',\n\t\t'testActionMenuOverflow',\n\t\t'TestingMultipleActionMenu',\n\t],\n};\n\nconst log = () => console.log('item clicked, closing');\n\nexport const Menu = (props: any) => {\n\tconst {\n\t\tdirection,\n\t\tonClose,\n\t\tonOpen,\n\t\ttrigger,\n\t\tportal = true,\n\t\t...rest\n\t} = props;\n\tconst [open, setOpen] = React.useState(rest.open || false);\n\tconst parentContext = React.useContext(ActionMenuContext)?.slice(-1)[0];\n\tconst parentMenuContainer = parentContext?.itemsContainerRef?.current;\n\tconst handleClickOutside = (e: any) => {\n\t\tif (portal) {\n\t\t\tsetOpen(false); // Close current menu\n\t\t\tif (e.key === 'ArrowLeft') return; // Close only one menu\n\t\t\tif (parentMenuContainer?.contains(e.target)) return;\n\t\t\tparentContext?.onClickOutside?.(e); // Close higher level menus\n\t\t} else {\n\t\t\tif (parentMenuContainer?.contains(e.target)) {\n\t\t\t\tconst nestedMenus = Array.from(\n\t\t\t\t\tparentMenuContainer?.querySelectorAll(\n\t\t\t\t\t\t'[data-anvil-component=ActionMenu]'\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t\t// Exclude event on non-portaled submenu\n\t\t\t\tif (!nestedMenus.some((el: any) => el.contains(e.target)))\n\t\t\t\t\treturn;\n\t\t\t\tsetOpen(false); // Close current menu\n\t\t\t\tif (e.key === 'ArrowLeft') return; // Close only one menu\n\t\t\t\tparentContext?.onClickOutside?.(e); // Close higher level menus\n\t\t\t}\n\t\t}\n\t};\n\n\tuseEffect(() => {\n\t\topen ? onOpen?.() : onClose?.();\n\t}, [open]); // eslint-disable-line\n\n\treturn (\n\t\t<ActionMenu\n\t\t\t{...rest}\n\t\t\tdirection={direction || 'rb'}\n\t\t\topen={open}\n\t\t\tonClickOutside={handleClickOutside}\n\t\t\tportal={portal}\n\t\t\ttrigger={trigger?.({ onClick: () => setOpen(!open) })}\n\t\t/>\n\t);\n};\n\nexport const MenuItem = (props: any) => {\n\tconst parentContext = React.useContext(ActionMenuContext)?.slice(-1)[0];\n\tconst handleClick = (e: any) => {\n\t\tprops.onClick?.(e);\n\t\tif (props.cascading) return;\n\t\tparentContext?.onClickOutside?.(e);\n\t};\n\tconst handleExit = (e: React.KeyboardEvent) => {\n\t\tprops.onKeyDown?.(e);\n\t\tif (e.key === 'Escape' || e.key === 'Tab') {\n\t\t\tparentContext?.onClickOutside?.(e as any); // Close all the nested Menus\n\t\t\tif (e.shiftKey && e.key === 'Tab') e.preventDefault(); // To keep focus on trigger\n\t\t}\n\t};\n\n\treturn (\n\t\t<ActionMenu.Item\n\t\t\t{...props}\n\t\t\tonClick={handleClick}\n\t\t\tonKeyDown={handleExit}\n\t\t/>\n\t);\n};\n\nconst MenuItems = () => (\n\t<>\n\t\t<MenuItem onClick={log}>Item</MenuItem>\n\t\t<MenuItem disabled>Disabled</MenuItem>\n\t\t<Menu\n\t\t\tdirection=\"rb\"\n\t\t\ttrigger={(p: any) => (\n\t\t\t\t<MenuItem {...p} cascading>\n\t\t\t\t\tCascading\n\t\t\t\t</MenuItem>\n\t\t\t)}\n\t\t>\n\t\t\t<ContactItems />\n\t\t</Menu>\n\t\t<ActionMenu.Group>\n\t\t\t<MenuItem disabled>Disabled</MenuItem>\n\t\t\t<MenuItem onClick={log} icon=\"help\">\n\t\t\t\tIcon\n\t\t\t</MenuItem>\n\t\t\t<MenuItem onClick={log} icon=\"help\" disabled>\n\t\t\t\tIcon Disabled\n\t\t\t</MenuItem>\n\t\t</ActionMenu.Group>\n\t\t<ActionMenu.Group label=\"Group with Label\">\n\t\t\t<MenuItem onClick={log} icon=\"help\">\n\t\t\t\tIcon\n\t\t\t</MenuItem>\n\t\t\t<Menu\n\t\t\t\tdirection=\"rb\"\n\t\t\t\ttrigger={(p: any) => (\n\t\t\t\t\t<MenuItem {...p} cascading icon=\"help\" iconColor=\"red\">\n\t\t\t\t\t\tColored Icon Cascading Submenu\n\t\t\t\t\t</MenuItem>\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t<ContactItems />\n\t\t\t</Menu>\n\t\t\t<MenuItem onClick={log}>\n\t\t\t\t<BodyText size=\"medium\" className=\"m-b-0-i\">\n\t\t\t\t\tDownload XLSX\n\t\t\t\t</BodyText>\n\t\t\t</MenuItem>\n\t\t</ActionMenu.Group>\n\t</>\n);\n\nconst ContactItems = () => (\n\t<>\n\t\t<ActionMenu.Group label=\"Text\">\n\t\t\t<MenuItem onClick={log} icon=\"phone_android\">\n\t\t\t\t<BodyText subdued size=\"xsmall\">\n\t\t\t\t\tMonica’s cell\n\t\t\t\t</BodyText>\n\t\t\t\t(555) 123-4567\n\t\t\t</MenuItem>\n\t\t</ActionMenu.Group>\n\t\t<ActionMenu.Group label=\"Call\">\n\t\t\t<MenuItem onClick={log} icon=\"phone\">\n\t\t\t\t<BodyText subdued size=\"xsmall\">\n\t\t\t\t\tHome\n\t\t\t\t</BodyText>\n\t\t\t\t(555) 123-4567\n\t\t\t</MenuItem>\n\t\t\t<MenuItem onClick={log} icon=\"phone_android\">\n\t\t\t\t<BodyText subdued size=\"xsmall\">\n\t\t\t\t\tMonica’s cell\n\t\t\t\t</BodyText>\n\t\t\t\t(555) 123-4567\n\t\t\t</MenuItem>\n\t\t</ActionMenu.Group>\n\t\t<ActionMenu.Group label=\"Email\">\n\t\t\t<MenuItem onClick={log} icon=\"email\">\n\t\t\t\t<BodyText subdued size=\"xsmall\">\n\t\t\t\t\tMonica's personal\n\t\t\t\t</BodyText>\n\t\t\t\tmonicadoe@gmail.com\n\t\t\t</MenuItem>\n\t\t\t<ActionMenu.Group>\n\t\t\t\t<Menu\n\t\t\t\t\tdirection=\"rb\"\n\t\t\t\t\ttrigger={(p: any) => (\n\t\t\t\t\t\t<MenuItem {...p} cascading>\n\t\t\t\t\t\t\tOne more menu\n\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t<MenuItem onClick={log}>Item 1</MenuItem>\n\t\t\t\t\t<MenuItem onClick={log}>Item 2</MenuItem>\n\t\t\t\t\t<MenuItem onClick={log}>Item 3</MenuItem>\n\t\t\t\t</Menu>\n\t\t\t\t<Menu\n\t\t\t\t\tdirection=\"rb\"\n\t\t\t\t\ttrigger={(p: any) => (\n\t\t\t\t\t\t<MenuItem {...p} cascading>\n\t\t\t\t\t\t\tAnother menu\n\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t<MenuItem onClick={log}>Item 4</MenuItem>\n\t\t\t\t\t<MenuItem onClick={log}>Item 5</MenuItem>\n\t\t\t\t\t<MenuItem onClick={log}>Item 6</MenuItem>\n\t\t\t\t</Menu>\n\t\t\t</ActionMenu.Group>\n\t\t</ActionMenu.Group>\n\t</>\n);\n\nexport const actionMenu = (args: any) => {\n\tconst [key, setKey]: [number, Function] = React.useState(0);\n\tconst refresh = () => setKey(key + 1);\n\n\treturn (\n\t\t<div key={key} className=\"p-4 ta-center\">\n\t\t\t{loremIpsum}\n\t\t\t<Menu\n\t\t\t\t{...args}\n\t\t\t\tclassName=\"classname-test\"\n\t\t\t\twrapperClassName=\"wrapper-classname-test\"\n\t\t\t\ttrigger={(props: any) => (\n\t\t\t\t\t<Button\n\t\t\t\t\t\t{...props}\n\t\t\t\t\t\ticonName=\"more_vert\"\n\t\t\t\t\t\ticonPosition=\"right\"\n\t\t\t\t\t>\n\t\t\t\t\t\tAction Menu\n\t\t\t\t\t</Button>\n\t\t\t\t)}\n\t\t\t\tonOpen={() => console.log('onOpen fired')}\n\t\t\t\tonClose={() => console.log('onClose fired')}\n\t\t\t>\n\t\t\t\t<MenuItems />\n\t\t\t</Menu>\n\t\t\t{loremIpsum}\n\t\t\t<div className=\"m-x-8 ta-left\">\n\t\t\t\t<Button onClick={refresh}>Refresh</Button>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\nactionMenu.args = {\n\tsharp: false,\n\twidth: 's',\n\tdirection: 'bl',\n\topen: true,\n};\n\nexport const testContextMenu = (args: any) => {\n\tconst [open, setOpen] = useState(false);\n\tconst [position, setPosition] = useState({ x: 0, y: 0 });\n\n\tconst close = () => setOpen(false);\n\tconst handleEscape = (e: any) =>\n\t\t['Tab', 'Escape'].includes(e.key) && close();\n\n\tconst handleContextMenu = (e: any) => {\n\t\te.preventDefault();\n\t\te.persist();\n\t\tsetOpen(true);\n\t\tsetPosition({\n\t\t\tx: e.pageX,\n\t\t\ty: e.pageY,\n\t\t});\n\t};\n\n\tconst styles: React.CSSProperties = {\n\t\tposition: 'absolute',\n\t\twidth: 0,\n\t\theight: 0,\n\t\ttop: position.y,\n\t\tleft: position.x,\n\t};\n\n\treturn (\n\t\t<div className=\"p-8 ta-center ta-c cursor-default\">\n\t\t\t<Card\n\t\t\t\tonContextMenu={handleContextMenu}\n\t\t\t\tstyle={{ textAlign: 'center' }}\n\t\t\t>\n\t\t\t\t<BodyText>Right-click here to reveal context menu.</BodyText>\n\t\t\t</Card>\n\t\t\t<div style={styles}>\n\t\t\t\t<ActionMenu\n\t\t\t\t\t{...args}\n\t\t\t\t\topen={open}\n\t\t\t\t\tonClickOutside={close}\n\t\t\t\t\tonKeyDown={handleEscape}\n\t\t\t\t>\n\t\t\t\t\t<MenuItems />\n\t\t\t\t</ActionMenu>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\ntestContextMenu.args = {\n\tdirection: 'br',\n\twidth: 's',\n};\n\nexport const testOverlayComponents = (args: any) => {\n\tconst [modalOpen, setModalOpen] = useState(false);\n\tconst [drawerOpen, setDrawerOpen] = useState(false);\n\tconst [dialogOpen, setDialogOpen] = useState(false);\n\tconst [takeoverOpen, setTakeoverOpen] = useState(false);\n\tconst [popoverOpen, setPopoverOpen] = useState(false);\n\n\tconst [counter, setCounter] = useState(0);\n\n\tconst overlays = [\n\t\t{ name: 'Modal', fn: () => setModalOpen(!modalOpen) },\n\t\t{ name: 'Drawer', fn: () => setDrawerOpen(!drawerOpen) },\n\t\t{ name: 'Dialog', fn: () => setDialogOpen(!dialogOpen) },\n\t\t{ name: 'Takeover', fn: () => setTakeoverOpen(!takeoverOpen) },\n\t\t{\n\t\t\tname: 'Popover',\n\t\t\tfn: () => setPopoverOpen(!popoverOpen),\n\t\t\tskipFromButtons: true,\n\t\t},\n\t];\n\n\tconst CounterButton = () => (\n\t\t<Button\n\t\t\tclassName=\"m-x-1\"\n\t\t\ticonName=\"plus_one\"\n\t\t\tonClick={() => {\n\t\t\t\tsetCounter(counter + 1);\n\t\t\t\tconsole.log('counter:', counter);\n\t\t\t}}\n\t\t/>\n\t);\n\n\tconst SecondaryMenu = () => (\n\t\t<Menu\n\t\t\ttrigger={(props: any) => (\n\t\t\t\t<Button {...props}>\n\t\t\t\t\tAction Menu\n\t\t\t\t\t<Icon name=\"more_vert\" size=\"24\" className=\"m-l-2\" />\n\t\t\t\t</Button>\n\t\t\t)}\n\t\t>\n\t\t\t{['1', '2', '3'].map((i, ix) => (\n\t\t\t\t<MenuItem key={ix}>Item {i}</MenuItem>\n\t\t\t))}\n\t\t</Menu>\n\t);\n\n\treturn (\n\t\t<div>\n\t\t\t<BodyText className=\"m-y-2\">\n\t\t\t\tActionMenu to open Modal, Drawer, Dialog, Takeover, Popover,\n\t\t\t\tTooltip:\n\t\t\t</BodyText>\n\t\t\t<Menu\n\t\t\t\ttrigger={(props: any) => (\n\t\t\t\t\t<Button {...props}>\n\t\t\t\t\t\tAction Menu\n\t\t\t\t\t\t<Icon name=\"more_vert\" size=\"24\" className=\"m-l-2\" />\n\t\t\t\t\t</Button>\n\t\t\t\t)}\n\t\t\t\t{...args}\n\t\t\t>\n\t\t\t\t{overlays.map((i, ix) => (\n\t\t\t\t\t<MenuItem onClick={i.fn} key={ix}>\n\t\t\t\t\t\tOpen {i.name}\n\t\t\t\t\t</MenuItem>\n\t\t\t\t))}\n\t\t\t\t<MenuItem icon=\"help\">\n\t\t\t\t\t<Tooltip text=\"Tooltip Text\" el=\"div\" direction=\"r\">\n\t\t\t\t\t\tShow Tooltip\n\t\t\t\t\t</Tooltip>\n\t\t\t\t</MenuItem>\n\t\t\t</Menu>\n\t\t\t<BodyText className=\"m-y-2\">\n\t\t\t\tActionMenu placed inside Modal, Drawer, Dialog, Takeover,\n\t\t\t\tPopover:\n\t\t\t</BodyText>\n\t\t\t{overlays\n\t\t\t\t.filter((i) => i.skipFromButtons !== true)\n\t\t\t\t.map((i, ix) => (\n\t\t\t\t\t<div className=\"m-y-2\" key={ix}>\n\t\t\t\t\t\t<Button onClick={i.fn}>Open {i.name}</Button>\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t<Modal\n\t\t\t\ttitle=\"Modal\"\n\t\t\t\topen={modalOpen}\n\t\t\t\tclosable\n\t\t\t\tonClose={() => overlays[0].fn()}\n\t\t\t>\n\t\t\t\t<SecondaryMenu />\n\t\t\t\t<CounterButton />\n\t\t\t</Modal>\n\t\t\t<Drawer\n\t\t\t\theader=\"Drawer\"\n\t\t\t\tbackdrop\n\t\t\t\topen={drawerOpen}\n\t\t\t\tonClose={() => overlays[1].fn()}\n\t\t\t\tfooter={<Button onClick={overlays[1].fn}>Close Drawer</Button>}\n\t\t\t>\n\t\t\t\t<SecondaryMenu />\n\t\t\t\t<CounterButton />\n\t\t\t</Drawer>\n\t\t\t<Dialog\n\t\t\t\ttitle=\"Dialog\"\n\t\t\t\topen={dialogOpen}\n\t\t\t\tonClose={() => overlays[2].fn()}\n\t\t\t\tonPrimaryActionClick={overlays[2].fn}\n\t\t\t\tprimaryActionName=\"Close Dialog\"\n\t\t\t>\n\t\t\t\t<SecondaryMenu />\n\t\t\t\t<CounterButton />\n\t\t\t</Dialog>\n\t\t\t{takeoverOpen && (\n\t\t\t\t<Takeover title=\"Takeover\" onClose={() => overlays[3].fn()}>\n\t\t\t\t\t<SecondaryMenu />\n\t\t\t\t\t<CounterButton />\n\t\t\t\t</Takeover>\n\t\t\t)}\n\t\t\t<Popover\n\t\t\t\theader=\"Popover\"\n\t\t\t\topen={popoverOpen}\n\t\t\t\tonClickOutside={() => (popoverOpen ? overlays[4].fn() : null)}\n\t\t\t\tportal\n\t\t\t\ttrigger={<Button onClick={overlays[4].fn}>Open Popover</Button>}\n\t\t\t\tdirection=\"tr\"\n\t\t\t>\n\t\t\t\t<SecondaryMenu />\n\t\t\t\t<CounterButton />\n\t\t\t</Popover>\n\t\t</div>\n\t);\n};\ntestOverlayComponents.args = {\n\tsharp: false,\n\twidth: 's',\n\tdirection: 'bl',\n};\n\nexport const testActionMenuOverflow = (args: any) => {\n\treturn (\n\t\t<div style={{ width: '740px' }}>\n\t\t\t<Menu\n\t\t\t\t{...args}\n\t\t\t\tdirection=\"br\"\n\t\t\t\twidth=\"xs\"\n\t\t\t\tscrollHeight=\"256px\"\n\t\t\t\ttrigger={(p: any) => <Button {...p}>Action Menu</Button>}\n\t\t\t>\n\t\t\t\t<MenuItem>Item 1</MenuItem>\n\t\t\t\t<MenuItem disabled>Item 2 (disabled)</MenuItem>\n\t\t\t\t<MenuItem>Item 3</MenuItem>\n\t\t\t\t<MenuItem>Item 4</MenuItem>\n\t\t\t\t<MenuItem>Item 5</MenuItem>\n\t\t\t\t<Menu\n\t\t\t\t\tdirection=\"rb\"\n\t\t\t\t\ttrigger={(p: any) => (\n\t\t\t\t\t\t<MenuItem {...p} cascading className=\"bg-blue-100\">\n\t\t\t\t\t\t\tSubmenu 1\n\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t<ContactItems />\n\t\t\t\t</Menu>\n\t\t\t\t<MenuItem>Item 6</MenuItem>\n\t\t\t</Menu>\n\t\t\t{loremIpsum}\n\t\t</div>\n\t);\n};\n\nconst loremIpsum = (\n\t<BodyText className=\"m-x-8 m-y-4 ta-left\">\n\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod\n\t\ttempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim\n\t\tveniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea\n\t\tcommodo consequat. Duis aute irure dolor in reprehenderit in voluptate\n\t\tvelit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint\n\t\toccaecat cupidatat non proident, sunt in culpa qui officia deserunt\n\t\tmollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur\n\t\tadipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore\n\t\tmagna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco\n\t\tlaboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor\n\t\tin reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla\n\t\tpariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa\n\t\tqui officia deserunt mollit anim id est laborum.\n\t</BodyText>\n);\n\nexport const TestingMultipleActionMenu = () => {\n\tconst [firstOpen, setFirstOpen] = useState(false);\n\tconst [secondOpen, setSecondOpen] = useState(false);\n\treturn (\n\t\t<>\n\t\t\t<div>\n\t\t\t\t<Stack\n\t\t\t\t\talignItems=\"center\"\n\t\t\t\t\tjustifyContent=\"center\"\n\t\t\t\t\tclassName=\"p-4\"\n\t\t\t\t\tstyle={{ height: '1500px' }}\n\t\t\t\t>\n\t\t\t\t\t<ActionMenu\n\t\t\t\t\t\topen={firstOpen}\n\t\t\t\t\t\tdirection=\"br\"\n\t\t\t\t\t\ttrigger={\n\t\t\t\t\t\t\t<Button onClick={() => setFirstOpen(!firstOpen)}>\n\t\t\t\t\t\t\t\tElement1\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\taa\n\t\t\t\t\t</ActionMenu>\n\t\t\t\t\t<ActionMenu\n\t\t\t\t\t\topen={secondOpen}\n\t\t\t\t\t\tdirection=\"br\"\n\t\t\t\t\t\ttrigger={\n\t\t\t\t\t\t\t<Button onClick={() => setSecondOpen(!secondOpen)}>\n\t\t\t\t\t\t\t\tElement2\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\taa\n\t\t\t\t\t</ActionMenu>\n\t\t\t\t</Stack>\n\t\t\t</div>\n\t\t</>\n\t);\n};\n"]}
+{"version":3,"file":"ActionMenu.stories.js","sourceRoot":"","sources":["../../../src/components/ActionMenu/ActionMenu.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useEffect, useState } from 'react';\nimport {\n\tActionMenu,\n\tActionMenuContext,\n\tBodyText,\n\tButton,\n\tCard,\n\tIcon,\n\tTooltip,\n\tModal,\n\tDrawer,\n\tDialog,\n\tTakeover,\n\tPopover,\n\tuseStorybookFigmaAddon,\n\tStack,\n} from '../../system';\n\nexport default {\n\ttitle: 'Components/ActionMenu',\n\tparameters: {\n\t\t...useStorybookFigmaAddon('32%3A1082'),\n\t},\n\tincludeStories: [\n\t\t'actionMenu',\n\t\t'testContextMenu',\n\t\t'testOverlayComponents',\n\t\t'testActionMenuOverflow',\n\t\t'TestingMultipleActionMenu',\n\t\t'Tester',\n\t],\n};\n\nconst log = () => console.log('item clicked, closing');\n\nexport const Tester = () => {\n\treturn (\n\t\t<ActionMenu\n\t\t\tdata-tester=\"test\"\n\t\t\ttrigger={({ toggle }) => (\n\t\t\t\t<Button onClick={toggle}>Open Menu</Button>\n\t\t\t)}\n\t\t>\n\t\t\t<ActionMenu\n\t\t\t\tdirection=\"rb\"\n\t\t\t\ttrigger={({ toggle }) => (\n\t\t\t\t\t<ActionMenu.Item cascading onClick={toggle}>\n\t\t\t\t\t\tMenu 01\n\t\t\t\t\t</ActionMenu.Item>\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t<ActionMenu.Item>Nested Menu 01</ActionMenu.Item>\n\t\t\t\t<ActionMenu.Item>Nested Menu 02</ActionMenu.Item>\n\t\t\t</ActionMenu>\n\t\t\t<ActionMenu.Item>Menu 02</ActionMenu.Item>\n\t\t</ActionMenu>\n\t);\n};\nexport const Menu = (props: any) => {\n\tconst {\n\t\tdirection,\n\t\tonClose,\n\t\tonOpen,\n\t\ttrigger,\n\t\tportal = true,\n\t\t...rest\n\t} = props;\n\tconst [open, setOpen] = React.useState(rest.open || false);\n\tconst parentContext = React.useContext(ActionMenuContext)?.slice(-1)[0];\n\tconst parentMenuContainer = parentContext?.itemsContainerRef?.current;\n\tconst handleClickOutside = (e: any) => {\n\t\tif (portal) {\n\t\t\tsetOpen(false); // Close current menu\n\t\t\tif (e.key === 'ArrowLeft') return; // Close only one menu\n\t\t\tif (parentMenuContainer?.contains(e.target)) return;\n\t\t\tparentContext?.onClickOutside?.(e); // Close higher level menus\n\t\t} else {\n\t\t\tif (parentMenuContainer?.contains(e.target)) {\n\t\t\t\tconst nestedMenus = Array.from(\n\t\t\t\t\tparentMenuContainer?.querySelectorAll(\n\t\t\t\t\t\t'[data-anvil-component=ActionMenu]'\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t\t// Exclude event on non-portaled submenu\n\t\t\t\tif (!nestedMenus.some((el: any) => el.contains(e.target)))\n\t\t\t\t\treturn;\n\t\t\t\tsetOpen(false); // Close current menu\n\t\t\t\tif (e.key === 'ArrowLeft') return; // Close only one menu\n\t\t\t\tparentContext?.onClickOutside?.(e); // Close higher level menus\n\t\t\t}\n\t\t}\n\t};\n\n\tuseEffect(() => {\n\t\topen ? onOpen?.() : onClose?.();\n\t}, [open]); // eslint-disable-line\n\n\treturn (\n\t\t<ActionMenu\n\t\t\t{...rest}\n\t\t\tdirection={direction || 'rb'}\n\t\t\topen={open}\n\t\t\tonClickOutside={handleClickOutside}\n\t\t\tportal={portal}\n\t\t\ttrigger={trigger?.({ onClick: () => setOpen(!open) })}\n\t\t/>\n\t);\n};\n\nexport const MenuItem = (props: any) => {\n\tconst parentContext = React.useContext(ActionMenuContext)?.slice(-1)[0];\n\tconst handleClick = (e: any) => {\n\t\tprops.onClick?.(e);\n\t\tif (props.cascading) return;\n\t\tparentContext?.onClickOutside?.(e);\n\t};\n\tconst handleExit = (e: React.KeyboardEvent) => {\n\t\tprops.onKeyDown?.(e);\n\t\tif (e.key === 'Escape' || e.key === 'Tab') {\n\t\t\tparentContext?.onClickOutside?.(e as any); // Close all the nested Menus\n\t\t\tif (e.shiftKey && e.key === 'Tab') e.preventDefault(); // To keep focus on trigger\n\t\t}\n\t};\n\n\treturn (\n\t\t<ActionMenu.Item\n\t\t\t{...props}\n\t\t\tonClick={handleClick}\n\t\t\tonKeyDown={handleExit}\n\t\t/>\n\t);\n};\n\nconst MenuItems = () => (\n\t<>\n\t\t<MenuItem onClick={log}>Item</MenuItem>\n\t\t<MenuItem disabled>Disabled</MenuItem>\n\t\t<Menu\n\t\t\tdirection=\"rb\"\n\t\t\ttrigger={(p: any) => (\n\t\t\t\t<MenuItem {...p} cascading>\n\t\t\t\t\tCascading\n\t\t\t\t</MenuItem>\n\t\t\t)}\n\t\t>\n\t\t\t<ContactItems />\n\t\t</Menu>\n\t\t<ActionMenu.Group>\n\t\t\t<MenuItem disabled>Disabled</MenuItem>\n\t\t\t<MenuItem onClick={log} icon=\"help\">\n\t\t\t\tIcon\n\t\t\t</MenuItem>\n\t\t\t<MenuItem onClick={log} icon=\"help\" disabled>\n\t\t\t\tIcon Disabled\n\t\t\t</MenuItem>\n\t\t</ActionMenu.Group>\n\t\t<ActionMenu.Group label=\"Group with Label\">\n\t\t\t<MenuItem onClick={log} icon=\"help\">\n\t\t\t\tIcon\n\t\t\t</MenuItem>\n\t\t\t<Menu\n\t\t\t\tdirection=\"rb\"\n\t\t\t\ttrigger={(p: any) => (\n\t\t\t\t\t<MenuItem {...p} cascading icon=\"help\" iconColor=\"red\">\n\t\t\t\t\t\tColored Icon Cascading Submenu\n\t\t\t\t\t</MenuItem>\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t<ContactItems />\n\t\t\t</Menu>\n\t\t\t<MenuItem onClick={log}>\n\t\t\t\t<BodyText size=\"medium\" className=\"m-b-0-i\">\n\t\t\t\t\tDownload XLSX\n\t\t\t\t</BodyText>\n\t\t\t</MenuItem>\n\t\t</ActionMenu.Group>\n\t</>\n);\n\nconst ContactItems = () => (\n\t<>\n\t\t<ActionMenu.Group label=\"Text\">\n\t\t\t<MenuItem onClick={log} icon=\"phone_android\">\n\t\t\t\t<BodyText subdued size=\"xsmall\">\n\t\t\t\t\tMonica’s cell\n\t\t\t\t</BodyText>\n\t\t\t\t(555) 123-4567\n\t\t\t</MenuItem>\n\t\t</ActionMenu.Group>\n\t\t<ActionMenu.Group label=\"Call\">\n\t\t\t<MenuItem onClick={log} icon=\"phone\">\n\t\t\t\t<BodyText subdued size=\"xsmall\">\n\t\t\t\t\tHome\n\t\t\t\t</BodyText>\n\t\t\t\t(555) 123-4567\n\t\t\t</MenuItem>\n\t\t\t<MenuItem onClick={log} icon=\"phone_android\">\n\t\t\t\t<BodyText subdued size=\"xsmall\">\n\t\t\t\t\tMonica’s cell\n\t\t\t\t</BodyText>\n\t\t\t\t(555) 123-4567\n\t\t\t</MenuItem>\n\t\t</ActionMenu.Group>\n\t\t<ActionMenu.Group label=\"Email\">\n\t\t\t<MenuItem onClick={log} icon=\"email\">\n\t\t\t\t<BodyText subdued size=\"xsmall\">\n\t\t\t\t\tMonica's personal\n\t\t\t\t</BodyText>\n\t\t\t\tmonicadoe@gmail.com\n\t\t\t</MenuItem>\n\t\t\t<ActionMenu.Group>\n\t\t\t\t<Menu\n\t\t\t\t\tdirection=\"rb\"\n\t\t\t\t\ttrigger={(p: any) => (\n\t\t\t\t\t\t<MenuItem {...p} cascading>\n\t\t\t\t\t\t\tOne more menu\n\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t<MenuItem onClick={log}>Item 1</MenuItem>\n\t\t\t\t\t<MenuItem onClick={log}>Item 2</MenuItem>\n\t\t\t\t\t<MenuItem onClick={log}>Item 3</MenuItem>\n\t\t\t\t</Menu>\n\t\t\t\t<Menu\n\t\t\t\t\tdirection=\"rb\"\n\t\t\t\t\ttrigger={(p: any) => (\n\t\t\t\t\t\t<MenuItem {...p} cascading>\n\t\t\t\t\t\t\tAnother menu\n\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t<MenuItem onClick={log}>Item 4</MenuItem>\n\t\t\t\t\t<MenuItem onClick={log}>Item 5</MenuItem>\n\t\t\t\t\t<MenuItem onClick={log}>Item 6</MenuItem>\n\t\t\t\t</Menu>\n\t\t\t</ActionMenu.Group>\n\t\t</ActionMenu.Group>\n\t</>\n);\n\nexport const actionMenu = (args: any) => {\n\tconst [open, setOpen] = useState(true);\n\tconst handleClick = () => setOpen(!open);\n\tconst handleClickOutside = () => setOpen(false);\n\n\tconst [key, setKey]: [number, Function] = React.useState(0);\n\tconst handleRefresh = () => setKey(key + 1);\n\n\treturn (\n\t\t<div key={key} className=\"p-4 ta-center\">\n\t\t\t{loremIpsum}\n\t\t\t<ActionMenu\n\t\t\t\t{...args}\n\t\t\t\tclassName=\"classname-test\"\n\t\t\t\twrapperClassName=\"wrapper-classname-test\"\n\t\t\t\ttrigger={(props: any) => (\n\t\t\t\t\t<Button {...props} onClick={handleClick}>\n\t\t\t\t\t\tAction Menu\n\t\t\t\t\t\t<Icon name=\"more_vert\" size=\"24\" className=\"m-l-2\" />\n\t\t\t\t\t</Button>\n\t\t\t\t)}\n\t\t\t\topen={open}\n\t\t\t\tonClickOutside={handleClickOutside}\n\t\t\t\tonOpen={() => console.log('onOpen fired')}\n\t\t\t\tonClose={() => console.log('onClose fired')}\n\t\t\t>\n\t\t\t\t<ActionMenu.Item onClick={log}>Item</ActionMenu.Item>\n\t\t\t\t<ActionMenu.Item disabled>Disabled</ActionMenu.Item>\n\t\t\t\t<Menu\n\t\t\t\t\tdirection=\"rb\"\n\t\t\t\t\ttrigger={(p: any) => (\n\t\t\t\t\t\t<MenuItem {...p} cascading>\n\t\t\t\t\t\t\tCascading\n\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t<ContactItems />\n\t\t\t\t</Menu>\n\t\t\t\t<ActionMenu.Group>\n\t\t\t\t\t<MenuItem disabled>Disabled</MenuItem>\n\t\t\t\t\t<MenuItem onClick={log} icon=\"help\">\n\t\t\t\t\t\tIcon\n\t\t\t\t\t</MenuItem>\n\t\t\t\t\t<MenuItem onClick={log} icon=\"help\" disabled>\n\t\t\t\t\t\tIcon Disabled\n\t\t\t\t\t</MenuItem>\n\t\t\t\t</ActionMenu.Group>\n\t\t\t\t<ActionMenu.Group label=\"Group with Label\">\n\t\t\t\t\t<MenuItem onClick={log} icon=\"help\">\n\t\t\t\t\t\tIcon\n\t\t\t\t\t</MenuItem>\n\t\t\t\t\t<Menu\n\t\t\t\t\t\tdirection=\"rb\"\n\t\t\t\t\t\ttrigger={(p: any) => (\n\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t{...p}\n\t\t\t\t\t\t\t\tcascading\n\t\t\t\t\t\t\t\ticon=\"help\"\n\t\t\t\t\t\t\t\ticonColor=\"red\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\tColored Icon Cascading Submenu\n\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ContactItems />\n\t\t\t\t\t</Menu>\n\t\t\t\t\t<MenuItem onClick={log}>\n\t\t\t\t\t\t<BodyText size=\"medium\" className=\"m-b-0-i\">\n\t\t\t\t\t\t\tDownload XLSX\n\t\t\t\t\t\t</BodyText>\n\t\t\t\t\t</MenuItem>\n\t\t\t\t</ActionMenu.Group>\n\t\t\t</ActionMenu>\n\t\t\t<ActionMenu\n\t\t\t\t{...args}\n\t\t\t\tclassName=\"classname-test\"\n\t\t\t\twrapperClassName=\"wrapper-classname-test\"\n\t\t\t\tpopoverContentClassName=\"ActionMenu\" // This is only added to fix SB issue\n\t\t\t\ttrigger={({ isOpen, toggle }) => (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName=\"m-l-4\"\n\t\t\t\t\t\tonClick={toggle}\n\t\t\t\t\t\tselected={isOpen}\n\t\t\t\t\t>\n\t\t\t\t\t\tAction Menu Uncontrolled\n\t\t\t\t\t\t<Icon name=\"more_vert\" size=\"24\" className=\"m-l-2\" />\n\t\t\t\t\t</Button>\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t<MenuItems />\n\t\t\t</ActionMenu>\n\t\t\t{loremIpsum}\n\t\t\t<div className=\"m-x-8 ta-left\">\n\t\t\t\t<Button onClick={handleRefresh}>Refresh</Button>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\nactionMenu.args = {\n\tsharp: false,\n\twidth: 's',\n\tdirection: 'bl',\n};\n\nexport const testContextMenu = (args: any) => {\n\tconst [open, setOpen] = useState(false);\n\tconst [position, setPosition] = useState({ x: 0, y: 0 });\n\n\tconst close = () => setOpen(false);\n\tconst handleEscape = (e: any) =>\n\t\t['Tab', 'Escape'].includes(e.key) && close();\n\n\tconst handleContextMenu = (e: any) => {\n\t\te.preventDefault();\n\t\te.persist();\n\t\tsetOpen(true);\n\t\tsetPosition({\n\t\t\tx: e.pageX,\n\t\t\ty: e.pageY,\n\t\t});\n\t};\n\n\tconst styles: React.CSSProperties = {\n\t\tposition: 'absolute',\n\t\twidth: 0,\n\t\theight: 0,\n\t\ttop: position.y,\n\t\tleft: position.x,\n\t};\n\n\treturn (\n\t\t<div className=\"p-8 ta-center ta-c cursor-default\">\n\t\t\t<Card\n\t\t\t\tonContextMenu={handleContextMenu}\n\t\t\t\tstyle={{ textAlign: 'center' }}\n\t\t\t>\n\t\t\t\t<BodyText>Right-click here to reveal context menu.</BodyText>\n\t\t\t</Card>\n\t\t\t<div style={styles}>\n\t\t\t\t<ActionMenu\n\t\t\t\t\t{...args}\n\t\t\t\t\topen={open}\n\t\t\t\t\tonClickOutside={close}\n\t\t\t\t\tonKeyDown={handleEscape}\n\t\t\t\t>\n\t\t\t\t\t<MenuItems />\n\t\t\t\t</ActionMenu>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\ntestContextMenu.args = {\n\tdirection: 'br',\n\twidth: 's',\n};\n\nexport const testOverlayComponents = (args: any) => {\n\tconst [menuOpen, setMenuOpen] = useState(true);\n\n\tconst [modalOpen, setModalOpen] = useState(false);\n\tconst [drawerOpen, setDrawerOpen] = useState(false);\n\tconst [dialogOpen, setDialogOpen] = useState(false);\n\tconst [takeoverOpen, setTakeoverOpen] = useState(false);\n\tconst [popoverOpen, setPopoverOpen] = useState(false);\n\n\tconst [counter, setCounter] = useState(0);\n\n\tconst overlays = [\n\t\t{ name: 'Modal', fn: () => setModalOpen(!modalOpen) },\n\t\t{ name: 'Drawer', fn: () => setDrawerOpen(!drawerOpen) },\n\t\t{ name: 'Dialog', fn: () => setDialogOpen(!dialogOpen) },\n\t\t{ name: 'Takeover', fn: () => setTakeoverOpen(!takeoverOpen) },\n\t\t{\n\t\t\tname: 'Popover',\n\t\t\tfn: () => setPopoverOpen(!popoverOpen),\n\t\t\tskipFromButtons: true,\n\t\t},\n\t];\n\n\tconst CounterButton = () => (\n\t\t<Button\n\t\t\tclassName=\"m-x-1\"\n\t\t\ticonName=\"project\"\n\t\t\tonClick={() => {\n\t\t\t\tsetCounter(counter + 1);\n\t\t\t\tconsole.log('counter:', counter);\n\t\t\t}}\n\t\t/>\n\t);\n\n\tconst SecondaryMenu = () => (\n\t\t<Menu\n\t\t\ttrigger={(props: any) => (\n\t\t\t\t<Button {...props}>\n\t\t\t\t\tAction Menu\n\t\t\t\t\t<Icon name=\"more_vert\" size=\"24\" className=\"m-l-2\" />\n\t\t\t\t</Button>\n\t\t\t)}\n\t\t>\n\t\t\t{['1', '2', '3'].map((i, ix) => (\n\t\t\t\t<MenuItem key={ix}>Item {i}</MenuItem>\n\t\t\t))}\n\t\t</Menu>\n\t);\n\n\treturn (\n\t\t<div>\n\t\t\t<BodyText className=\"m-y-2\">\n\t\t\t\tActionMenu to open Modal, Drawer, Dialog, Takeover, Popover,\n\t\t\t\tTooltip:\n\t\t\t</BodyText>\n\t\t\t<Menu\n\t\t\t\topen={menuOpen}\n\t\t\t\tonClick={() => setMenuOpen(!menuOpen)}\n\t\t\t\tonClickOutside={() => setMenuOpen(false)}\n\t\t\t\ttrigger={(props: any) => (\n\t\t\t\t\t<Button {...props}>\n\t\t\t\t\t\tAction Menu\n\t\t\t\t\t\t<Icon name=\"more_vert\" size=\"24\" className=\"m-l-2\" />\n\t\t\t\t\t</Button>\n\t\t\t\t)}\n\t\t\t\t{...args}\n\t\t\t>\n\t\t\t\t{overlays.map((i, ix) => (\n\t\t\t\t\t<MenuItem onClick={i.fn} key={ix}>\n\t\t\t\t\t\tOpen {i.name}\n\t\t\t\t\t</MenuItem>\n\t\t\t\t))}\n\t\t\t\t<MenuItem icon=\"help\">\n\t\t\t\t\t<Tooltip text=\"Tooltip Text\" el=\"div\" direction=\"r\">\n\t\t\t\t\t\tShow Tooltip\n\t\t\t\t\t</Tooltip>\n\t\t\t\t</MenuItem>\n\t\t\t</Menu>\n\t\t\t<BodyText className=\"m-y-2\">\n\t\t\t\tActionMenu placed inside Modal, Drawer, Dialog, Takeover,\n\t\t\t\tPopover:\n\t\t\t</BodyText>\n\t\t\t{overlays\n\t\t\t\t.filter((i) => i.skipFromButtons !== true)\n\t\t\t\t.map((i, ix) => (\n\t\t\t\t\t<div className=\"m-y-2\" key={ix}>\n\t\t\t\t\t\t<Button onClick={i.fn}>Open {i.name}</Button>\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t<Modal\n\t\t\t\ttitle=\"Modal\"\n\t\t\t\topen={modalOpen}\n\t\t\t\tclosable\n\t\t\t\tonClose={() => overlays[0].fn()}\n\t\t\t>\n\t\t\t\t<SecondaryMenu />\n\t\t\t\t<CounterButton />\n\t\t\t</Modal>\n\t\t\t<Drawer\n\t\t\t\theader=\"Drawer\"\n\t\t\t\tbackdrop\n\t\t\t\topen={drawerOpen}\n\t\t\t\tonClose={() => overlays[1].fn()}\n\t\t\t\tfooter={<Button onClick={overlays[1].fn}>Close Drawer</Button>}\n\t\t\t>\n\t\t\t\t<SecondaryMenu />\n\t\t\t\t<CounterButton />\n\t\t\t</Drawer>\n\t\t\t<Dialog\n\t\t\t\ttitle=\"Dialog\"\n\t\t\t\topen={dialogOpen}\n\t\t\t\tonClose={() => overlays[2].fn()}\n\t\t\t\tonPrimaryActionClick={overlays[2].fn}\n\t\t\t\tprimaryActionName=\"Close Dialog\"\n\t\t\t>\n\t\t\t\t<SecondaryMenu />\n\t\t\t\t<CounterButton />\n\t\t\t</Dialog>\n\t\t\t{takeoverOpen && (\n\t\t\t\t<Takeover title=\"Takeover\" onClose={() => overlays[3].fn()}>\n\t\t\t\t\t<SecondaryMenu />\n\t\t\t\t\t<CounterButton />\n\t\t\t\t</Takeover>\n\t\t\t)}\n\t\t\t<Popover\n\t\t\t\theader=\"Popover\"\n\t\t\t\topen={popoverOpen}\n\t\t\t\tonClickOutside={() => (popoverOpen ? overlays[4].fn() : null)}\n\t\t\t\tportal\n\t\t\t\ttrigger={<Button onClick={overlays[4].fn}>Open Popover</Button>}\n\t\t\t\tdirection=\"tr\"\n\t\t\t>\n\t\t\t\t<SecondaryMenu />\n\t\t\t\t<CounterButton />\n\t\t\t</Popover>\n\t\t</div>\n\t);\n};\ntestOverlayComponents.args = {\n\tsharp: false,\n\twidth: 's',\n\tdirection: 'bl',\n};\n\nexport const testActionMenuOverflow = (args: any) => {\n\tconst [open, setOpen] = useState(true);\n\tconst handleClick = () => setOpen(!open);\n\tconst handleClickOutside = () => setOpen(false);\n\n\treturn (\n\t\t<div style={{ width: '740px' }}>\n\t\t\t<Menu\n\t\t\t\t{...args}\n\t\t\t\tdirection=\"br\"\n\t\t\t\twidth=\"xs\"\n\t\t\t\tscrollHeight=\"256px\"\n\t\t\t\ttrigger={(p: any) => (\n\t\t\t\t\t<Button {...p} onClick={handleClick}>\n\t\t\t\t\t\tAction Menu\n\t\t\t\t\t</Button>\n\t\t\t\t)}\n\t\t\t\topen={open}\n\t\t\t\tonClickOutside={handleClickOutside}\n\t\t\t>\n\t\t\t\t<MenuItem>Item 1</MenuItem>\n\t\t\t\t<MenuItem disabled>Item 2 (disabled)</MenuItem>\n\t\t\t\t<MenuItem>Item 3</MenuItem>\n\t\t\t\t<MenuItem>Item 4</MenuItem>\n\t\t\t\t<MenuItem>Item 5</MenuItem>\n\t\t\t\t<Menu\n\t\t\t\t\tdirection=\"rb\"\n\t\t\t\t\ttrigger={(p: any) => (\n\t\t\t\t\t\t<MenuItem {...p} cascading className=\"bg-blue-100\">\n\t\t\t\t\t\t\tSubmenu 1\n\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t<ContactItems />\n\t\t\t\t</Menu>\n\t\t\t\t<MenuItem>Item 6</MenuItem>\n\t\t\t</Menu>\n\t\t\t{loremIpsum}\n\t\t</div>\n\t);\n};\n\nexport const TestingMultipleActionMenu = () => {\n\tconst [firstOpen, setFirstOpen] = useState(false);\n\tconst [secondOpen, setSecondOpen] = useState(false);\n\treturn (\n\t\t<>\n\t\t\t<div>\n\t\t\t\t<Stack\n\t\t\t\t\talignItems=\"center\"\n\t\t\t\t\tjustifyContent=\"center\"\n\t\t\t\t\tclassName=\"p-4\"\n\t\t\t\t\tstyle={{ height: '1500px' }}\n\t\t\t\t>\n\t\t\t\t\t<ActionMenu\n\t\t\t\t\t\topen={firstOpen}\n\t\t\t\t\t\tdirection=\"br\"\n\t\t\t\t\t\ttrigger={\n\t\t\t\t\t\t\t<Button onClick={() => setFirstOpen(!firstOpen)}>\n\t\t\t\t\t\t\t\tElement1\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\taa\n\t\t\t\t\t</ActionMenu>\n\t\t\t\t\t<ActionMenu\n\t\t\t\t\t\topen={secondOpen}\n\t\t\t\t\t\tdirection=\"br\"\n\t\t\t\t\t\ttrigger={\n\t\t\t\t\t\t\t<Button onClick={() => setSecondOpen(!secondOpen)}>\n\t\t\t\t\t\t\t\tElement2\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\taa\n\t\t\t\t\t</ActionMenu>\n\t\t\t\t</Stack>\n\t\t\t</div>\n\t\t</>\n\t);\n};\n\nconst loremIpsum = (\n\t<BodyText className=\"m-x-8 m-y-4 ta-left\">\n\t\tLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod\n\t\ttempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim\n\t\tveniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea\n\t\tcommodo consequat. Duis aute irure dolor in reprehenderit in voluptate\n\t\tvelit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint\n\t\toccaecat cupidatat non proident, sunt in culpa qui officia deserunt\n\t\tmollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur\n\t\tadipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore\n\t\tmagna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco\n\t\tlaboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor\n\t\tin reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla\n\t\tpariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa\n\t\tqui officia deserunt mollit anim id est laborum.\n\t</BodyText>\n);\n"]}

package/dist/components/ActionMenu/ActionMenu.test.js

@@ -1,10 +1,33 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 import React from 'react';
-import { render } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { getByText, render, waitFor } from '@testing-library/react';
 import { ActionMenu } from './ActionMenu';
 import { BodyText } from '../BodyText';
+import { Button } from '../Button';
 describe('ActionMenu', () => {
     beforeEach(() => jest.spyOn(console, 'error'));
-    it('should pass through data automation attributes', () => {
+    it('uncontrolled: should open nested onClick', () => __awaiter(void 0, void 0, void 0, function* () {
+        const user = userEvent.setup();
+        const { getByTestId } = render(React.createElement(ActionMenu, { trigger: ({ toggle }) => (React.createElement(Button, { "data-testid": "trigger-button", onClick: toggle }, "Open Menu")) },
+            React.createElement(ActionMenu, { "data-testid": "first-item", direction: "rb", trigger: ({ toggle }) => (React.createElement(ActionMenu.Item, { "data-testid": "nest-trigger-button", cascading: true, onClick: toggle }, "Menu 01")) },
+                React.createElement(ActionMenu.Item, { "data-testid": "nested-menu-01" }, "Nested Menu 01"),
+                React.createElement(ActionMenu.Item, null, "Nested Menu 02")),
+            React.createElement(ActionMenu.Item, null, "Menu 02")));
+        yield user.click(getByTestId('trigger-button'));
+        expect(getByTestId('first-item')).toBeTruthy();
+        yield user.click(getByTestId('nest-trigger-button'));
+        expect(getByTestId('nested-menu-01')).toBeTruthy();
+    }));
+    it('should pass through data automation attributes', () => __awaiter(void 0, void 0, void 0, function* () {
         const { container, baseElement } = render(React.createElement(ActionMenu, { open: true },
             React.createElement(ActionMenu.Group, { label: "Text", "data-auto-sel": "automation-selector" },
                 React.createElement(ActionMenu.Item, { icon: "phone_android" },
@@ -14,10 +37,13 @@ describe('ActionMenu', () => {
          * NOTE: Using "baseElement" instead of "container" because
          *       ActionMenu's children are rendered in a portal
          */
+        yield waitFor(() => {
+            expect(getByText(baseElement, 'Monica', { exact: false })).toBeInTheDocument();
+        });
         const nonPortalElement = container.querySelector('[data-auto-sel="automation-selector"]');
         const portalElement = baseElement.querySelector('[data-auto-sel="automation-selector"]');
         expect(nonPortalElement).toBeNull();
         expect(portalElement).not.toBeNull();
-    });
+    }));
 });
 //# sourceMappingURL=ActionMenu.test.js.map

package/dist/components/ActionMenu/ActionMenu.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionMenu.test.js","sourceRoot":"","sources":["../../../src/components/ActionMenu/ActionMenu.test.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,wBAAwB,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAEvC,QAAQ,CAAC,YAAY,EAAE,GAAG,EAAE;IAC3B,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC;IAE/C,EAAE,CAAC,gDAAgD,EAAE,GAAG,EAAE;QACzD,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,GAAG,MAAM,CACxC,oBAAC,UAAU,IAAC,IAAI;YACf,oBAAC,UAAU,CAAC,KAAK,IAChB,KAAK,EAAC,MAAM,mBACE,qBAAqB;gBAEnC,oBAAC,UAAU,CAAC,IAAI,IAAC,IAAI,EAAC,eAAe;oBACpC,oBAAC,QAAQ,IAAC,OAAO,QAAC,IAAI,EAAC,QAAQ,yBAEpB;qCAEM,CACA,CACP,CACb,CAAC;QAEF;;;WAGG;QACH,MAAM,gBAAgB,GAAG,SAAS,CAAC,aAAa,CAC/C,uCAAuC,CACvC,CAAC;QACF,MAAM,aAAa,GAAG,WAAW,CAAC,aAAa,CAC9C,uCAAuC,CACvC,CAAC;QAEF,MAAM,CAAC,gBAAgB,CAAC,CAAC,QAAQ,EAAE,CAAC;QACpC,MAAM,CAAC,aAAa,CAAC,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC;IACtC,CAAC,CAAC,CAAC;AACJ,CAAC,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport { render } from '@testing-library/react';\nimport { ActionMenu } from './ActionMenu';\nimport { BodyText } from '../BodyText';\n\ndescribe('ActionMenu', () => {\n\tbeforeEach(() => jest.spyOn(console, 'error'));\n\n\tit('should pass through data automation attributes', () => {\n\t\tconst { container, baseElement } = render(\n\t\t\t<ActionMenu open>\n\t\t\t\t<ActionMenu.Group\n\t\t\t\t\tlabel=\"Text\"\n\t\t\t\t\tdata-auto-sel=\"automation-selector\"\n\t\t\t\t>\n\t\t\t\t\t<ActionMenu.Item icon=\"phone_android\">\n\t\t\t\t\t\t<BodyText subdued size=\"xsmall\">\n\t\t\t\t\t\t\tMonica’s cell\n\t\t\t\t\t\t</BodyText>\n\t\t\t\t\t\t(555) 123-4567\n\t\t\t\t\t</ActionMenu.Item>\n\t\t\t\t</ActionMenu.Group>\n\t\t\t</ActionMenu>\n\t\t);\n\n\t\t/**\n\t\t * NOTE: Using \"baseElement\" instead of \"container\" because\n\t\t *       ActionMenu's children are rendered in a portal\n\t\t */\n\t\tconst nonPortalElement = container.querySelector(\n\t\t\t'[data-auto-sel=\"automation-selector\"]'\n\t\t);\n\t\tconst portalElement = baseElement.querySelector(\n\t\t\t'[data-auto-sel=\"automation-selector\"]'\n\t\t);\n\n\t\texpect(nonPortalElement).toBeNull();\n\t\texpect(portalElement).not.toBeNull();\n\t});\n});\n"]}
+{"version":3,"file":"ActionMenu.test.js","sourceRoot":"","sources":["../../../src/components/ActionMenu/ActionMenu.test.tsx"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,6BAA6B,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,wBAAwB,CAAC;AACpE,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAEnC,QAAQ,CAAC,YAAY,EAAE,GAAG,EAAE;IAC3B,UAAU,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC;IAE/C,EAAE,CAAC,0CAA0C,EAAE,GAAS,EAAE;QACzD,MAAM,IAAI,GAAG,SAAS,CAAC,KAAK,EAAE,CAAC;QAC/B,MAAM,EAAE,WAAW,EAAE,GAAG,MAAM,CAC7B,oBAAC,UAAU,IACV,OAAO,EAAE,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CACxB,oBAAC,MAAM,mBAAa,gBAAgB,EAAC,OAAO,EAAE,MAAM,gBAE3C,CACT;YAED,oBAAC,UAAU,mBACE,YAAY,EACxB,SAAS,EAAC,IAAI,EACd,OAAO,EAAE,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CACxB,oBAAC,UAAU,CAAC,IAAI,mBACH,qBAAqB,EACjC,SAAS,QACT,OAAO,EAAE,MAAM,cAGE,CAClB;gBAED,oBAAC,UAAU,CAAC,IAAI,mBAAa,gBAAgB,qBAE3B;gBAClB,oBAAC,UAAU,CAAC,IAAI,yBAAiC,CACrC;YACb,oBAAC,UAAU,CAAC,IAAI,kBAA0B,CAC9B,CACb,CAAC;QACF,MAAM,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,CAAC,CAAC;QAChD,MAAM,CAAC,WAAW,CAAC,YAAY,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC;QAC/C,MAAM,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,qBAAqB,CAAC,CAAC,CAAC;QACrD,MAAM,CAAC,WAAW,CAAC,gBAAgB,CAAC,CAAC,CAAC,UAAU,EAAE,CAAC;IACpD,CAAC,CAAA,CAAC,CAAC;IAEH,EAAE,CAAC,gDAAgD,EAAE,GAAS,EAAE;QAC/D,MAAM,EAAE,SAAS,EAAE,WAAW,EAAE,GAAG,MAAM,CACxC,oBAAC,UAAU,IAAC,IAAI;YACf,oBAAC,UAAU,CAAC,KAAK,IAChB,KAAK,EAAC,MAAM,mBACE,qBAAqB;gBAEnC,oBAAC,UAAU,CAAC,IAAI,IAAC,IAAI,EAAC,eAAe;oBACpC,oBAAC,QAAQ,IAAC,OAAO,QAAC,IAAI,EAAC,QAAQ,yBAEpB;qCAEM,CACA,CACP,CACb,CAAC;QAEF;;;WAGG;QAEH,MAAM,OAAO,CAAC,GAAG,EAAE;YAClB,MAAM,CACL,SAAS,CAAC,WAAW,EAAE,QAAQ,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,CAClD,CAAC,iBAAiB,EAAE,CAAC;QACvB,CAAC,CAAC,CAAC;QAEH,MAAM,gBAAgB,GAAG,SAAS,CAAC,aAAa,CAC/C,uCAAuC,CACvC,CAAC;QACF,MAAM,aAAa,GAAG,WAAW,CAAC,aAAa,CAC9C,uCAAuC,CACvC,CAAC;QAEF,MAAM,CAAC,gBAAgB,CAAC,CAAC,QAAQ,EAAE,CAAC;QACpC,MAAM,CAAC,aAAa,CAAC,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC;IACtC,CAAC,CAAA,CAAC,CAAC;AACJ,CAAC,CAAC,CAAC","sourcesContent":["import React from 'react';\nimport userEvent from '@testing-library/user-event';\nimport { getByText, render, waitFor } from '@testing-library/react';\nimport { ActionMenu } from './ActionMenu';\nimport { BodyText } from '../BodyText';\nimport { Button } from '../Button';\n\ndescribe('ActionMenu', () => {\n\tbeforeEach(() => jest.spyOn(console, 'error'));\n\n\tit('uncontrolled: should open nested onClick', async () => {\n\t\tconst user = userEvent.setup();\n\t\tconst { getByTestId } = render(\n\t\t\t<ActionMenu\n\t\t\t\ttrigger={({ toggle }) => (\n\t\t\t\t\t<Button data-testid=\"trigger-button\" onClick={toggle}>\n\t\t\t\t\t\tOpen Menu\n\t\t\t\t\t</Button>\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t<ActionMenu\n\t\t\t\t\tdata-testid=\"first-item\"\n\t\t\t\t\tdirection=\"rb\"\n\t\t\t\t\ttrigger={({ toggle }) => (\n\t\t\t\t\t\t<ActionMenu.Item\n\t\t\t\t\t\t\tdata-testid=\"nest-trigger-button\"\n\t\t\t\t\t\t\tcascading\n\t\t\t\t\t\t\tonClick={toggle}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\tMenu 01\n\t\t\t\t\t\t</ActionMenu.Item>\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t<ActionMenu.Item data-testid=\"nested-menu-01\">\n\t\t\t\t\t\tNested Menu 01\n\t\t\t\t\t</ActionMenu.Item>\n\t\t\t\t\t<ActionMenu.Item>Nested Menu 02</ActionMenu.Item>\n\t\t\t\t</ActionMenu>\n\t\t\t\t<ActionMenu.Item>Menu 02</ActionMenu.Item>\n\t\t\t</ActionMenu>\n\t\t);\n\t\tawait user.click(getByTestId('trigger-button'));\n\t\texpect(getByTestId('first-item')).toBeTruthy();\n\t\tawait user.click(getByTestId('nest-trigger-button'));\n\t\texpect(getByTestId('nested-menu-01')).toBeTruthy();\n\t});\n\n\tit('should pass through data automation attributes', async () => {\n\t\tconst { container, baseElement } = render(\n\t\t\t<ActionMenu open>\n\t\t\t\t<ActionMenu.Group\n\t\t\t\t\tlabel=\"Text\"\n\t\t\t\t\tdata-auto-sel=\"automation-selector\"\n\t\t\t\t>\n\t\t\t\t\t<ActionMenu.Item icon=\"phone_android\">\n\t\t\t\t\t\t<BodyText subdued size=\"xsmall\">\n\t\t\t\t\t\t\tMonica’s cell\n\t\t\t\t\t\t</BodyText>\n\t\t\t\t\t\t(555) 123-4567\n\t\t\t\t\t</ActionMenu.Item>\n\t\t\t\t</ActionMenu.Group>\n\t\t\t</ActionMenu>\n\t\t);\n\n\t\t/**\n\t\t * NOTE: Using \"baseElement\" instead of \"container\" because\n\t\t *       ActionMenu's children are rendered in a portal\n\t\t */\n\n\t\tawait waitFor(() => {\n\t\t\texpect(\n\t\t\t\tgetByText(baseElement, 'Monica', { exact: false })\n\t\t\t).toBeInTheDocument();\n\t\t});\n\n\t\tconst nonPortalElement = container.querySelector(\n\t\t\t'[data-auto-sel=\"automation-selector\"]'\n\t\t);\n\t\tconst portalElement = baseElement.querySelector(\n\t\t\t'[data-auto-sel=\"automation-selector\"]'\n\t\t);\n\n\t\texpect(nonPortalElement).toBeNull();\n\t\texpect(portalElement).not.toBeNull();\n\t});\n});\n"]}

package/dist/components/AnvilSelect/AnvilSelect.test.js

@@ -1,5 +1,14 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 import React from 'react';
-import { render } from '@testing-library/react';
+import { render, waitFor } from '@testing-library/react';
 import '@testing-library/jest-dom/extend-expect';
 import { AnvilSelect } from './';
 const dummyOptions = [
@@ -76,7 +85,7 @@ describe('AnvilSelect', () => {
         const element = container.querySelector('[data-auto-sel="automation-selector"]');
         expect(element).not.toBeNull();
     });
-    it('should respect actionButtonProps on footer', () => {
+    it('should respect actionButtonProps on footer', () => __awaiter(void 0, void 0, void 0, function* () {
         const props = {
             open: true,
             footer: {
@@ -90,8 +99,11 @@ describe('AnvilSelect', () => {
             },
         };
         const { getByTestId } = render(React.createElement(AnvilSelect, Object.assign({}, props)));
+        yield waitFor(() => {
+            expect(getByTestId('submit-button')).toBeInTheDocument();
+        });
         const element = getByTestId('submit-button');
         expect(element).toHaveAttribute('disabled');
-    });
+    }));
 });
 //# sourceMappingURL=AnvilSelect.test.js.map

package/dist/components/AnvilSelect/AnvilSelect.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"AnvilSelect.test.js","sourceRoot":"","sources":["../../../src/components/AnvilSelect/AnvilSelect.test.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { render } from '@testing-library/react';\nimport '@testing-library/jest-dom/extend-expect';\nimport { AnvilSelect } from './';\n\nconst dummyOptions = [\n\t{\n\t\ttext: 'Jane Doe',\n\t\tvalue: 1,\n\t\tdisabled: true,\n\t},\n\t{\n\t\ttext: 'Bob Ross',\n\t\tvalue: 2,\n\t},\n\t{\n\t\ttext: 'Jackie Robinson',\n\t\tvalue: 3,\n\t},\n\t{\n\t\ttext: 'Alexandria Garcia',\n\t\tvalue: 4,\n\t},\n\t{\n\t\ttext: 'Zack Bower',\n\t\tvalue: 5,\n\t},\n\t{\n\t\ttext: 'Erin Smith',\n\t\tvalue: 6,\n\t},\n\t{\n\t\ttext: 'Jarrod Saltalamacchia',\n\t\tvalue: 7,\n\t},\n\t{\n\t\ttext: 'Natalia McPhearson',\n\t\tvalue: 8,\n\t},\n\t{\n\t\ttext: 'Valente Zero',\n\t\tvalue: 0,\n\t},\n];\n\ndescribe('AnvilSelect', () => {\n\tbeforeEach(() => {\n\t\tglobal.innerWidth = 400;\n\t\tglobal.innerHeight = 2000;\n\t\tglobal.dispatchEvent(new Event('resize'));\n\t});\n\n\tit('trigger should show X selected if rows is 0', () => {\n\t\tconst selectedCount = 1;\n\t\tconst props = {\n\t\t\toptions: dummyOptions,\n\t\t\tvalue: dummyOptions.slice(0, selectedCount),\n\t\t\ttrigger: {\n\t\t\t\tplaceholder: 'Select several technicians',\n\t\t\t\trows: 0,\n\t\t\t},\n\t\t\tmultiple: true,\n\t\t};\n\t\tconst { getByText } = render(<AnvilSelect {...props} />);\n\n\t\texpect(getByText(`${selectedCount} selected`)).toBeInTheDocument();\n\t});\n\n\tit.skip('should pass through data automation attributes', () => {\n\t\tconst selectedCount = 1;\n\t\tconst props = {\n\t\t\toptions: dummyOptions,\n\t\t\tvalue: dummyOptions.slice(0, selectedCount),\n\t\t\ttrigger: {\n\t\t\t\tplaceholder: 'Select several technicians',\n\t\t\t\trows: 0,\n\t\t\t},\n\t\t\tmultiple: true,\n\t\t};\n\n\t\tconst { container } = render(\n\t\t\t<AnvilSelect {...props} data-auto-sel=\"automation-selector\" />\n\t\t);\n\n\t\tconst element = container.querySelector(\n\t\t\t'[data-auto-sel=\"automation-selector\"]'\n\t\t);\n\n\t\texpect(element).not.toBeNull();\n\t});\n\n\tit('should respect actionButtonProps on footer', () => {\n\t\tconst props = {\n\t\t\topen: true,\n\t\t\tfooter: {\n\t\t\t\tactionName: 'Submit',\n\t\t\t\tactionButtonProps: {\n\t\t\t\t\t// eslint-disable-next-line no-useless-computed-key\n\t\t\t\t\t['data-testid']: 'submit-button',\n\t\t\t\t\tdisabled: true,\n\t\t\t\t},\n\t\t\t\tonActionClick: () => {},\n\t\t\t},\n\t\t};\n\n\t\tconst { getByTestId } = render(<AnvilSelect {...props} />);\n\t\tconst element = getByTestId('submit-button');\n\n\t\texpect(element).toHaveAttribute('disabled');\n\t});\n});\n"]}
+{"version":3,"file":"AnvilSelect.test.js","sourceRoot":"","sources":["../../../src/components/AnvilSelect/AnvilSelect.test.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport { render, waitFor } from '@testing-library/react';\nimport '@testing-library/jest-dom/extend-expect';\nimport { AnvilSelect } from './';\n\nconst dummyOptions = [\n\t{\n\t\ttext: 'Jane Doe',\n\t\tvalue: 1,\n\t\tdisabled: true,\n\t},\n\t{\n\t\ttext: 'Bob Ross',\n\t\tvalue: 2,\n\t},\n\t{\n\t\ttext: 'Jackie Robinson',\n\t\tvalue: 3,\n\t},\n\t{\n\t\ttext: 'Alexandria Garcia',\n\t\tvalue: 4,\n\t},\n\t{\n\t\ttext: 'Zack Bower',\n\t\tvalue: 5,\n\t},\n\t{\n\t\ttext: 'Erin Smith',\n\t\tvalue: 6,\n\t},\n\t{\n\t\ttext: 'Jarrod Saltalamacchia',\n\t\tvalue: 7,\n\t},\n\t{\n\t\ttext: 'Natalia McPhearson',\n\t\tvalue: 8,\n\t},\n\t{\n\t\ttext: 'Valente Zero',\n\t\tvalue: 0,\n\t},\n];\n\ndescribe('AnvilSelect', () => {\n\tbeforeEach(() => {\n\t\tglobal.innerWidth = 400;\n\t\tglobal.innerHeight = 2000;\n\t\tglobal.dispatchEvent(new Event('resize'));\n\t});\n\n\tit('trigger should show X selected if rows is 0', () => {\n\t\tconst selectedCount = 1;\n\t\tconst props = {\n\t\t\toptions: dummyOptions,\n\t\t\tvalue: dummyOptions.slice(0, selectedCount),\n\t\t\ttrigger: {\n\t\t\t\tplaceholder: 'Select several technicians',\n\t\t\t\trows: 0,\n\t\t\t},\n\t\t\tmultiple: true,\n\t\t};\n\t\tconst { getByText } = render(<AnvilSelect {...props} />);\n\n\t\texpect(getByText(`${selectedCount} selected`)).toBeInTheDocument();\n\t});\n\n\tit.skip('should pass through data automation attributes', () => {\n\t\tconst selectedCount = 1;\n\t\tconst props = {\n\t\t\toptions: dummyOptions,\n\t\t\tvalue: dummyOptions.slice(0, selectedCount),\n\t\t\ttrigger: {\n\t\t\t\tplaceholder: 'Select several technicians',\n\t\t\t\trows: 0,\n\t\t\t},\n\t\t\tmultiple: true,\n\t\t};\n\n\t\tconst { container } = render(\n\t\t\t<AnvilSelect {...props} data-auto-sel=\"automation-selector\" />\n\t\t);\n\n\t\tconst element = container.querySelector(\n\t\t\t'[data-auto-sel=\"automation-selector\"]'\n\t\t);\n\n\t\texpect(element).not.toBeNull();\n\t});\n\n\tit('should respect actionButtonProps on footer', async () => {\n\t\tconst props = {\n\t\t\topen: true,\n\t\t\tfooter: {\n\t\t\t\tactionName: 'Submit',\n\t\t\t\tactionButtonProps: {\n\t\t\t\t\t// eslint-disable-next-line no-useless-computed-key\n\t\t\t\t\t['data-testid']: 'submit-button',\n\t\t\t\t\tdisabled: true,\n\t\t\t\t},\n\t\t\t\tonActionClick: () => {},\n\t\t\t},\n\t\t};\n\n\t\tconst { getByTestId } = render(<AnvilSelect {...props} />);\n\n\t\tawait waitFor(() => {\n\t\t\texpect(getByTestId('submit-button')).toBeInTheDocument();\n\t\t});\n\t\tconst element = getByTestId('submit-button');\n\n\t\texpect(element).toHaveAttribute('disabled');\n\t});\n});\n"]}

package/dist/components/AnvilSelect/components/Trigger.js

@@ -74,7 +74,7 @@ export const Trigger = (_a) => {
         var _a;
         e.stopPropagation();
         onClearClick(e);
-        open ? (_a = triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus() : handleClick(e); // Focus select and open dropdown
+        (_a = triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
     };
     const handleKey = (e) => {
         if (onKeyDown)