@servicetitan/design-system 14.3.1 → 14.3.3

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

@@ -37,3 +37,4 @@ export declare const testOverlayComponents: {
     };
 };
 export declare const testActionMenuOverflow: (args: any) => JSX.Element;
+export declare const TestingMultipleActionMenu: () => JSX.Element;

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

@@ -10,7 +10,7 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import React, { useEffect, useState } from 'react';
-import { ActionMenu, ActionMenuContext, BodyText, Button, Card, Icon, Tooltip, Modal, Drawer, Dialog, Takeover, Popover, useStorybookFigmaAddon, } from '../../system';
+import { ActionMenu, ActionMenuContext, BodyText, Button, Card, Icon, Tooltip, Modal, Drawer, Dialog, Takeover, Popover, useStorybookFigmaAddon, Stack, } from '../../system';
 export default {
     title: 'Components/ActionMenu',
     parameters: Object.assign({}, useStorybookFigmaAddon('32%3A1082')),
@@ -19,6 +19,7 @@ export default {
         'testContextMenu',
         'testOverlayComponents',
         'testActionMenuOverflow',
+        'TestingMultipleActionMenu',
     ],
 };
 const log = () => console.log('item clicked, closing');
@@ -246,4 +247,13 @@ export const testActionMenuOverflow = (args) => {
         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);
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", null,
+            React.createElement(Stack, { alignItems: "center", justifyContent: "center", className: "p-4", style: { height: '1500px' } },
+                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")))));
+};
 //# 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} 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],\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"]}
+{"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"]}

package/dist/components/OptionList/Option.js

@@ -34,6 +34,7 @@ export const Option = (_a) => {
         'OptionList__option--read-only': readOnly || disabled,
         'OptionList__option--custom': content && typeof content !== 'string',
         'OptionList__option--text': !(content && typeof content !== 'string'),
+        'OptionList__option--collapsible': collapseControl,
     });
     const getCollapseButton = () => {
         if (!collapseControl)

package/dist/components/OptionList/Option.js.map

@@ -1 +1 @@
-{"version":3,"file":"Option.js","sourceRoot":"","sources":["../../../src/components/OptionList/Option.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useLayoutEffect, useRef, FC } from 'react';\nimport { Checkbox } from '../Checkbox';\nimport { Spinner } from '../Spinner';\nimport { Button } from '../Button';\nimport classnames from 'classnames';\n\nexport interface SingleOptionPropStrict {\n\t/** Adds one or more classnames for an element */\n\tclassName?: string;\n\n\t/** Whether child options are visible or not. */\n\tcollapsed?: boolean;\n\n\t/** Whether the option should have the expand/collapse button. */\n\tcollapseControl?: boolean;\n\n\t/** The default visualization of an option in the Popover of the Select */\n\tcontent?: React.ReactNode | string;\n\n\t/** Indicates whether the option is disabled or not. It makes the option unselectable */\n\tdisabled?: boolean;\n\n\t/** Function to allow OptionList to set focus */\n\tgetFocus?: (value: any) => boolean;\n\n\t/** Indeterminate visual for a checkbox */\n\tindeterminate?: boolean;\n\n\t/** Function to allow OptionList to set indeterminate */\n\tgetIndeterminate?: (value: any) => boolean;\n\n\t/** Provides tree-type styling to option, and ARIA label. Can be automatically calculated. */\n\tlevel?: number;\n\n\t/** Visual that an option is loading. Used when child options need to be brought in on expand */\n\tloading?: boolean;\n\n\t/** Calls when the option changes in value */\n\tonChange?: (\n\t\tdata: SingleOptionProps['value'],\n\t\tchecked: boolean,\n\t\tchildObject: SingleOptionProps[],\n\t\tselfObject: SingleOptionProps\n\t) => void;\n\n\t/** Calls when the expand/collapse button is clicked */\n\tonExpand?: (data: SingleOptionProps['value']) => void;\n\n\t/** Grouping of options within options */\n\toptions?: SingleOptionProps[];\n\n\t/** A secondary action a user can take on a single option */\n\tsecondaryAction?: React.ReactNode;\n\n\t/** Whether or not the option is selected */\n\tselected?: boolean;\n\n\t/** Function to allow OptionList to set selected */\n\tgetSelected?: (value: any) => boolean;\n\n\t/** Prevents a user from selecting the option, without giving it the disabled styling/state */\n\treadOnly?: boolean;\n\n\t/** Function to pass option data (value, DOM element) to OptionList */\n\tregisterOption?: (optionData: RegisterOptionData) => void;\n\n\t/** The default string of an option in the trigger of the Select */\n\ttext?: string;\n\n\t/** Value of the option, passed into Anvil's Checkbox value */\n\tvalue?: any;\n}\n\nexport interface SingleOptionProps extends SingleOptionPropStrict {\n\t/** Unstrict Props */\n\t[propName: string]: any;\n}\n\nexport interface RegisterOptionData {\n\ttext?: SingleOptionProps['string'];\n\tvalue?: SingleOptionProps['value'];\n\tdisabled?: SingleOptionProps['disabled'];\n\telement?: HTMLDivElement | null; // TODO: Make this type more generic\n}\n\nexport const Option: FC<SingleOptionProps> = ({\n\tclassName,\n\tcollapseControl,\n\tcollapsed,\n\tcontent,\n\tdisabled,\n\tfocus,\n\tgetFocus,\n\tindeterminate,\n\tgetIndeterminate,\n\tlabel,\n\tlevel,\n\tloading,\n\tonChange,\n\tonExpand,\n\tonKeyDown,\n\toptions,\n\treadOnly,\n\tregisterOption,\n\tsecondaryAction,\n\tselected,\n\tgetSelected,\n\tselfObject,\n\ttext,\n\tvalue,\n\t...props\n}) => {\n\t// after the component has rendered, pass the option data to registerOption\n\tconst checkboxRef = useRef<RegisterOptionData['element']>(null);\n\n\tuseLayoutEffect(() => {\n\t\tif (registerOption) {\n\t\t\tregisterOption({\n\t\t\t\ttext,\n\t\t\t\tvalue,\n\t\t\t\tdisabled,\n\t\t\t\telement: checkboxRef.current,\n\t\t\t});\n\t\t}\n\t});\n\n\tconst OptionClasses = classnames('OptionList__option', className, {\n\t\t'OptionList__option--selected': selected,\n\t\t'OptionList__option--disabled': disabled,\n\t\t'OptionList__option--read-only': readOnly || disabled,\n\t\t'OptionList__option--custom': content && typeof content !== 'string',\n\t\t'OptionList__option--text': !(content && typeof content !== 'string'),\n\t});\n\n\tconst getCollapseButton = () => {\n\t\tif (!collapseControl) return;\n\t\tconst arrow = collapsed\n\t\t\t? 'keyboard_arrow_down'\n\t\t\t: 'keyboard_arrow_right';\n\t\treturn (\n\t\t\t<Button\n\t\t\t\ticonName={arrow}\n\t\t\t\txsmall\n\t\t\t\tfill=\"subtle\"\n\t\t\t\tonClick={handleOnClick}\n\t\t\t\tclassName=\"OptionList__collapse\"\n\t\t\t\taria-expanded={collapsed}\n\t\t\t\taria-label={collapsed ? 'collapse options' : 'expand options'}\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst getLabel = () => {\n\t\tif (label) return label;\n\t\tif (content !== undefined && content !== null) return content;\n\t\tif (text !== undefined && text !== null) return text;\n\t\treturn String(value);\n\t};\n\n\tconst getLoading = () => {\n\t\tif (!loading) return;\n\t\treturn <Spinner size=\"tiny\" className=\"OptionList__spinner\" />;\n\t};\n\n\tconst getSecondaryAction = () => {\n\t\tif (secondaryAction === undefined) return;\n\t\treturn (\n\t\t\t<div className=\"OptionList__option--secondary-action\">\n\t\t\t\t{secondaryAction}\n\t\t\t</div>\n\t\t);\n\t};\n\n\tconst handleOnClick = () => {\n\t\treturn onExpand(value);\n\t};\n\n\tconst handleOnChange = (value: any, checked: boolean) => {\n\t\tif (readOnly || onChange === undefined) return;\n\t\treturn onChange(value, checked, options, selfObject);\n\t};\n\n\tconst handleOnKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n\t\tif (onKeyDown === undefined) return;\n\t\treturn onKeyDown(e, selfObject);\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tclassName={OptionClasses}\n\t\t\trole=\"treeitem\"\n\t\t\taria-level={level}\n\t\t\t{...props}\n\t\t>\n\t\t\t{getLoading() || getCollapseButton()}\n\t\t\t<Checkbox\n\t\t\t\tref={checkboxRef}\n\t\t\t\tchecked={\n\t\t\t\t\tselected != null\n\t\t\t\t\t\t? selected\n\t\t\t\t\t\t: getSelected\n\t\t\t\t\t\t? getSelected(value)\n\t\t\t\t\t\t: null\n\t\t\t\t}\n\t\t\t\tdisabled={disabled}\n\t\t\t\tfocus={\n\t\t\t\t\tfocus != null ? focus : getFocus ? getFocus(value) : null\n\t\t\t\t}\n\t\t\t\tindeterminate={\n\t\t\t\t\tindeterminate != null\n\t\t\t\t\t\t? indeterminate\n\t\t\t\t\t\t: getIndeterminate\n\t\t\t\t\t\t? getIndeterminate(value)\n\t\t\t\t\t\t: null\n\t\t\t\t}\n\t\t\t\tlabel={getLabel()}\n\t\t\t\tonChange={handleOnChange}\n\t\t\t\tonKeyDown={handleOnKeyDown}\n\t\t\t\tvalue={value}\n\t\t\t/>\n\t\t\t{getSecondaryAction()}\n\t\t</div>\n\t);\n};\n"]}
+{"version":3,"file":"Option.js","sourceRoot":"","sources":["../../../src/components/OptionList/Option.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { useLayoutEffect, useRef, FC } from 'react';\nimport { Checkbox } from '../Checkbox';\nimport { Spinner } from '../Spinner';\nimport { Button } from '../Button';\nimport classnames from 'classnames';\n\nexport interface SingleOptionPropStrict {\n\t/** Adds one or more classnames for an element */\n\tclassName?: string;\n\n\t/** Whether child options are visible or not. */\n\tcollapsed?: boolean;\n\n\t/** Whether the option should have the expand/collapse button. */\n\tcollapseControl?: boolean;\n\n\t/** The default visualization of an option in the Popover of the Select */\n\tcontent?: React.ReactNode | string;\n\n\t/** Indicates whether the option is disabled or not. It makes the option unselectable */\n\tdisabled?: boolean;\n\n\t/** Function to allow OptionList to set focus */\n\tgetFocus?: (value: any) => boolean;\n\n\t/** Indeterminate visual for a checkbox */\n\tindeterminate?: boolean;\n\n\t/** Function to allow OptionList to set indeterminate */\n\tgetIndeterminate?: (value: any) => boolean;\n\n\t/** Provides tree-type styling to option, and ARIA label. Can be automatically calculated. */\n\tlevel?: number;\n\n\t/** Visual that an option is loading. Used when child options need to be brought in on expand */\n\tloading?: boolean;\n\n\t/** Calls when the option changes in value */\n\tonChange?: (\n\t\tdata: SingleOptionProps['value'],\n\t\tchecked: boolean,\n\t\tchildObject: SingleOptionProps[],\n\t\tselfObject: SingleOptionProps\n\t) => void;\n\n\t/** Calls when the expand/collapse button is clicked */\n\tonExpand?: (data: SingleOptionProps['value']) => void;\n\n\t/** Grouping of options within options */\n\toptions?: SingleOptionProps[];\n\n\t/** A secondary action a user can take on a single option */\n\tsecondaryAction?: React.ReactNode;\n\n\t/** Whether or not the option is selected */\n\tselected?: boolean;\n\n\t/** Function to allow OptionList to set selected */\n\tgetSelected?: (value: any) => boolean;\n\n\t/** Prevents a user from selecting the option, without giving it the disabled styling/state */\n\treadOnly?: boolean;\n\n\t/** Function to pass option data (value, DOM element) to OptionList */\n\tregisterOption?: (optionData: RegisterOptionData) => void;\n\n\t/** The default string of an option in the trigger of the Select */\n\ttext?: string;\n\n\t/** Value of the option, passed into Anvil's Checkbox value */\n\tvalue?: any;\n}\n\nexport interface SingleOptionProps extends SingleOptionPropStrict {\n\t/** Unstrict Props */\n\t[propName: string]: any;\n}\n\nexport interface RegisterOptionData {\n\ttext?: SingleOptionProps['string'];\n\tvalue?: SingleOptionProps['value'];\n\tdisabled?: SingleOptionProps['disabled'];\n\telement?: HTMLDivElement | null; // TODO: Make this type more generic\n}\n\nexport const Option: FC<SingleOptionProps> = ({\n\tclassName,\n\tcollapseControl,\n\tcollapsed,\n\tcontent,\n\tdisabled,\n\tfocus,\n\tgetFocus,\n\tindeterminate,\n\tgetIndeterminate,\n\tlabel,\n\tlevel,\n\tloading,\n\tonChange,\n\tonExpand,\n\tonKeyDown,\n\toptions,\n\treadOnly,\n\tregisterOption,\n\tsecondaryAction,\n\tselected,\n\tgetSelected,\n\tselfObject,\n\ttext,\n\tvalue,\n\t...props\n}) => {\n\t// after the component has rendered, pass the option data to registerOption\n\tconst checkboxRef = useRef<RegisterOptionData['element']>(null);\n\n\tuseLayoutEffect(() => {\n\t\tif (registerOption) {\n\t\t\tregisterOption({\n\t\t\t\ttext,\n\t\t\t\tvalue,\n\t\t\t\tdisabled,\n\t\t\t\telement: checkboxRef.current,\n\t\t\t});\n\t\t}\n\t});\n\n\tconst OptionClasses = classnames('OptionList__option', className, {\n\t\t'OptionList__option--selected': selected,\n\t\t'OptionList__option--disabled': disabled,\n\t\t'OptionList__option--read-only': readOnly || disabled,\n\t\t'OptionList__option--custom': content && typeof content !== 'string',\n\t\t'OptionList__option--text': !(content && typeof content !== 'string'),\n\t\t'OptionList__option--collapsible': collapseControl,\n\t});\n\n\tconst getCollapseButton = () => {\n\t\tif (!collapseControl) return;\n\t\tconst arrow = collapsed\n\t\t\t? 'keyboard_arrow_down'\n\t\t\t: 'keyboard_arrow_right';\n\t\treturn (\n\t\t\t<Button\n\t\t\t\ticonName={arrow}\n\t\t\t\txsmall\n\t\t\t\tfill=\"subtle\"\n\t\t\t\tonClick={handleOnClick}\n\t\t\t\tclassName=\"OptionList__collapse\"\n\t\t\t\taria-expanded={collapsed}\n\t\t\t\taria-label={collapsed ? 'collapse options' : 'expand options'}\n\t\t\t/>\n\t\t);\n\t};\n\n\tconst getLabel = () => {\n\t\tif (label) return label;\n\t\tif (content !== undefined && content !== null) return content;\n\t\tif (text !== undefined && text !== null) return text;\n\t\treturn String(value);\n\t};\n\n\tconst getLoading = () => {\n\t\tif (!loading) return;\n\t\treturn <Spinner size=\"tiny\" className=\"OptionList__spinner\" />;\n\t};\n\n\tconst getSecondaryAction = () => {\n\t\tif (secondaryAction === undefined) return;\n\t\treturn (\n\t\t\t<div className=\"OptionList__option--secondary-action\">\n\t\t\t\t{secondaryAction}\n\t\t\t</div>\n\t\t);\n\t};\n\n\tconst handleOnClick = () => {\n\t\treturn onExpand(value);\n\t};\n\n\tconst handleOnChange = (value: any, checked: boolean) => {\n\t\tif (readOnly || onChange === undefined) return;\n\t\treturn onChange(value, checked, options, selfObject);\n\t};\n\n\tconst handleOnKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {\n\t\tif (onKeyDown === undefined) return;\n\t\treturn onKeyDown(e, selfObject);\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tclassName={OptionClasses}\n\t\t\trole=\"treeitem\"\n\t\t\taria-level={level}\n\t\t\t{...props}\n\t\t>\n\t\t\t{getLoading() || getCollapseButton()}\n\t\t\t<Checkbox\n\t\t\t\tref={checkboxRef}\n\t\t\t\tchecked={\n\t\t\t\t\tselected != null\n\t\t\t\t\t\t? selected\n\t\t\t\t\t\t: getSelected\n\t\t\t\t\t\t? getSelected(value)\n\t\t\t\t\t\t: null\n\t\t\t\t}\n\t\t\t\tdisabled={disabled}\n\t\t\t\tfocus={\n\t\t\t\t\tfocus != null ? focus : getFocus ? getFocus(value) : null\n\t\t\t\t}\n\t\t\t\tindeterminate={\n\t\t\t\t\tindeterminate != null\n\t\t\t\t\t\t? indeterminate\n\t\t\t\t\t\t: getIndeterminate\n\t\t\t\t\t\t? getIndeterminate(value)\n\t\t\t\t\t\t: null\n\t\t\t\t}\n\t\t\t\tlabel={getLabel()}\n\t\t\t\tonChange={handleOnChange}\n\t\t\t\tonKeyDown={handleOnKeyDown}\n\t\t\t\tvalue={value}\n\t\t\t/>\n\t\t\t{getSecondaryAction()}\n\t\t</div>\n\t);\n};\n"]}

package/dist/components/OptionList/OptionList.css

@@ -51,6 +51,9 @@
 .OptionList__option .Checkbox__box {
   top: 0;
 }
+.OptionList__option.OptionList__option--collapsible .Checkbox__label::after {
+  inset: -8px -16px -8px 0;
+}
 
 .OptionList__header {
   line-height: normal;

package/dist/components/OptionList/OptionList.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/OptionList/OptionList.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/core/tokens.scss"],"names":[],"mappings":"AAAA;ACSC;EACC;EACA;EACA;EACA;EACA;EACA;EACA,kBAXwB;;;AAe1B;ACjBC;EACA;AAEA;EACA;;;ADiBD;AAEC;EACC;;;AAIF;AACA;EACC,eE8FW;EF7FX,eEbiB;EFcjB;EACA;EACA;AAuBA;;AAhBA;EACC,WE4FY;EF3FZ,aE8DoB;EF7DpB;;AAGA;EACC;EACA;EACA;EACA;;AAIF;EAAc;;AAGd;EACC;EACA;;AAED;EAAiB;;;AAGlB;EACC;EACA,gBEwDW;EFvDX,cEwDW;;;AFpDX;EAKC,kBA5EyB;;AAwEzB;EACC,OAvEkB;;AA8ElB;EAAY,kBAhFY;;;AAqF3B;AACA;EAAsC,cEqC1B;;;AFjCV;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AAKH;AACA;EACC;EACA;EACA;EACA,cE6Bc;;;AF1Bf;AACA;EACC;EACA;EACA;;;AAGD;AAEC;EAAwB;;AACxB;EAAiB;;;AAGlB;AACA;EACC;EACA;EACA;EACA;EACA,cEDW;;;AFIZ;AAAA;AAAA;AAAA;AAKC;AAAA;EAGC;;AAEA;AAAA;EACC;;AAIF;EAAwB;;;AAGzB;AAAA;AAAA;AAAA;AAKC;EAAwB","file":"OptionList.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/OptionList/OptionList.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/core/tokens.scss"],"names":[],"mappings":"AAAA;ACSC;EACC;EACA;EACA;EACA;EACA;EACA;EACA,kBAXwB;;;AAe1B;ACjBC;EACA;AAEA;EACA;;;ADiBD;AAEC;EACC;;;AAIF;AACA;EACC,eE8FW;EF7FX,eEbiB;EFcjB;EACA;EACA;AAuBA;;AAhBA;EACC,WE4FY;EF3FZ,aE8DoB;EF7DpB;;AAGA;EACC;EACA;EACA;EACA;;AAIF;EAAc;;AAGd;EACC;EACA;;AAED;EAAiB;;AAIf;EACC;;;AAOJ;EACC;EACA,gBE+CW;EF9CX,cE+CW;;;AF3CX;EAKC,kBArFyB;;AAiFzB;EACC,OAhFkB;;AAuFlB;EAAY,kBAzFY;;;AA8F3B;AACA;EAAsC,cE4B1B;;;AFxBV;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AAKH;AACA;EACC;EACA;EACA;EACA,cEoBc;;;AFjBf;AACA;EACC;EACA;EACA;;;AAGD;AAEC;EAAwB;;AACxB;EAAiB;;;AAGlB;AACA;EACC;EACA;EACA;EACA;EACA,cEVW;;;AFaZ;AAAA;AAAA;AAAA;AAKC;AAAA;EAGC;;AAEA;AAAA;EACC;;AAIF;EAAwB;;;AAGzB;AAAA;AAAA;AAAA;AAKC;EAAwB","file":"OptionList.css"}

package/dist/components/OptionList/index.css

@@ -51,6 +51,9 @@
 .OptionList__option .Checkbox__box {
   top: 0;
 }
+.OptionList__option.OptionList__option--collapsible .Checkbox__label::after {
+  inset: -8px -16px -8px 0;
+}
 
 .OptionList__header {
   line-height: normal;

package/dist/components/OptionList/index.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/OptionList/OptionList.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/core/tokens.scss"],"names":[],"mappings":"AAAA;ACSC;EACC;EACA;EACA;EACA;EACA;EACA;EACA,kBAXwB;;;AAe1B;ACjBC;EACA;AAEA;EACA;;;ADiBD;AAEC;EACC;;;AAIF;AACA;EACC,eE8FW;EF7FX,eEbiB;EFcjB;EACA;EACA;AAuBA;;AAhBA;EACC,WE4FY;EF3FZ,aE8DoB;EF7DpB;;AAGA;EACC;EACA;EACA;EACA;;AAIF;EAAc;;AAGd;EACC;EACA;;AAED;EAAiB;;;AAGlB;EACC;EACA,gBEwDW;EFvDX,cEwDW;;;AFpDX;EAKC,kBA5EyB;;AAwEzB;EACC,OAvEkB;;AA8ElB;EAAY,kBAhFY;;;AAqF3B;AACA;EAAsC,cEqC1B;;;AFjCV;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AAKH;AACA;EACC;EACA;EACA;EACA,cE6Bc;;;AF1Bf;AACA;EACC;EACA;EACA;;;AAGD;AAEC;EAAwB;;AACxB;EAAiB;;;AAGlB;AACA;EACC;EACA;EACA;EACA;EACA,cEDW;;;AFIZ;AAAA;AAAA;AAAA;AAKC;AAAA;EAGC;;AAEA;AAAA;EACC;;AAIF;EAAwB;;;AAGzB;AAAA;AAAA;AAAA;AAKC;EAAwB","file":"index.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/OptionList/OptionList.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/core/tokens.scss"],"names":[],"mappings":"AAAA;ACSC;EACC;EACA;EACA;EACA;EACA;EACA;EACA,kBAXwB;;;AAe1B;ACjBC;EACA;AAEA;EACA;;;ADiBD;AAEC;EACC;;;AAIF;AACA;EACC,eE8FW;EF7FX,eEbiB;EFcjB;EACA;EACA;AAuBA;;AAhBA;EACC,WE4FY;EF3FZ,aE8DoB;EF7DpB;;AAGA;EACC;EACA;EACA;EACA;;AAIF;EAAc;;AAGd;EACC;EACA;;AAED;EAAiB;;AAIf;EACC;;;AAOJ;EACC;EACA,gBE+CW;EF9CX,cE+CW;;;AF3CX;EAKC,kBArFyB;;AAiFzB;EACC,OAhFkB;;AAuFlB;EAAY,kBAzFY;;;AA8F3B;AACA;EAAsC,cE4B1B;;;AFxBV;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AAKH;AACA;EACC;EACA;EACA;EACA,cEoBc;;;AFjBf;AACA;EACC;EACA;EACA;;;AAGD;AAEC;EAAwB;;AACxB;EAAiB;;;AAGlB;AACA;EACC;EACA;EACA;EACA;EACA,cEVW;;;AFaZ;AAAA;AAAA;AAAA;AAKC;AAAA;EAGC;;AAEA;AAAA;EACC;;AAIF;EAAwB;;;AAGzB;AAAA;AAAA;AAAA;AAKC;EAAwB","file":"index.css"}

package/dist/components/StatusLight/StatusLight.js

@@ -13,7 +13,7 @@ import React from 'react';
 import classnames from 'classnames';
 import { BodyText } from '../BodyText';
 export const StatusLight = (_a) => {
-    var { children, className, full, reverse, split, disabled, pulsing, onClick, onMouseOver, href, color = 'default' } = _a, props = __rest(_a, ["children", "className", "full", "reverse", "split", "disabled", "pulsing", "onClick", "onMouseOver", "href", "color"]);
+    var { children, className, full, reverse, split, disabled, pulsing, href, color = 'default' } = _a, props = __rest(_a, ["children", "className", "full", "reverse", "split", "disabled", "pulsing", "href", "color"]);
     const isCustomColor = () => {
         const uniqueColors = [
             'default',
@@ -41,7 +41,7 @@ export const StatusLight = (_a) => {
         'StatusLight--full': full,
         'StatusLight--split': split,
         'StatusLight--pulsing': pulsing,
-        'StatusLight--action': onClick || onMouseOver || href,
+        'StatusLight--action': 'onClick' in props || 'onMouseOver' in props || href,
     });
     const StatusLightElement = href ? 'a' : 'div';
     return (React.createElement(StatusLightElement, Object.assign({ className: StatusLightClasses, href: href, "data-anvil-component": "StatusLight" }, props),

package/dist/components/StatusLight/StatusLight.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusLight.js","sourceRoot":"","sources":["../../../src/components/StatusLight/StatusLight.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAa,MAAM,OAAO,CAAC;AAClC,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAyCvC,MAAM,CAAC,MAAM,WAAW,GAAyB,CAAC,EAajD,EAAE,EAAE;QAb6C,EACjD,QAAQ,EACR,SAAS,EACT,IAAI,EACJ,OAAO,EACP,KAAK,EACL,QAAQ,EACR,OAAO,EACP,OAAO,EACP,WAAW,EACX,IAAI,EACJ,KAAK,GAAG,SAAS,OAEjB,EADG,KAAK,cAZyC,uHAajD,CADQ;IAER,MAAM,aAAa,GAAG,GAAG,EAAE;QAC1B,MAAM,YAAY,GAAG;YACpB,SAAS;YACT,MAAM;YACN,SAAS;YACT,SAAS;YACT,UAAU;SACV,CAAC;QAEF,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,CAAC;YAAE,OAAO,IAAI,CAAC;QAC/C,OAAO,KAAK,CAAC;IACd,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,GAAG,EAAE;QACzB,IAAI,CAAC,QAAQ,IAAI,CAAC,aAAa,EAAE,EAAE;YAClC,OAAO,2BAA2B,KAAK,EAAE,CAAC;SAC1C;QACD,OAAO,KAAK,CAAC;IACd,CAAC,CAAC;IAEF,MAAM,2BAA2B,GAAG,UAAU,CAC7C,wBAAwB,EACxB,YAAY,EAAE,EACd;QACC,kCAAkC,EAAE,QAAQ;KAC5C,CACD,CAAC;IAEF,MAAM,kBAAkB,GAAG,UAAU,CAAC,aAAa,EAAE,SAAS,EAAE;QAC/D,uBAAuB,EAAE,QAAQ;QACjC,sBAAsB,EAAE,OAAO;QAC/B,mBAAmB,EAAE,IAAI;QACzB,oBAAoB,EAAE,KAAK;QAC3B,sBAAsB,EAAE,OAAO;QAC/B,qBAAqB,EAAE,OAAO,IAAI,WAAW,IAAI,IAAI;KACrD,CAAC,CAAC;IAEH,MAAM,kBAAkB,GAAG,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC;IAE9C,OAAO,CACN,oBAAC,kBAAkB,kBAClB,SAAS,EAAE,kBAAkB,EAC7B,IAAI,EAAE,IAAI,0BACW,aAAa,IAC9B,KAAK;QAET,8BACC,SAAS,EAAE,2BAA2B,EACtC,KAAK,EAAE,aAAa,EAAE,CAAC,CAAC,CAAC,EAAE,eAAe,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,IAAI,GACzD;QACD,QAAQ,KAAK,SAAS,IAAI,QAAQ,KAAK,IAAI,IAAI,CAC/C,oBAAC,QAAQ,IAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,oBAAoB,IACnD,QAAQ,CACC,CACX,CACmB,CACrB,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { FC } from 'react';\nimport classnames from 'classnames';\nimport { BodyText } from '../BodyText';\n\n/**\n * StatusLight properties\n */\nexport interface StatusLightPropsStrict {\n\t/** Adds one or more classnames for an element */\n\tclassName?: string;\n\n\t/** Disabled StatusLight, unclickable */\n\tdisabled?: boolean;\n\n\t/** Shortcut for full width StatusLight */\n\tfull?: boolean;\n\n\t/** Shortcut for reverse order */\n\treverse?: boolean;\n\n\t/** Shortcut for justify-content:spacebetween */\n\tsplit?: boolean;\n\n\t/** Shortcut for pulsing ripple */\n\tpulsing?: boolean;\n\n\t/** Making hyperlink out of StatusLight */\n\thref?: string;\n\n\t/** Action for when StatusLight is clicked */\n\tonClick?: (e: React.SyntheticEvent<HTMLElement>) => void;\n\n\t/** Action for when StatusLight is hovered */\n\tonMouseOver?: (e: React.SyntheticEvent<HTMLElement>) => void;\n\n\t/** Indicator color */\n\tcolor?: 'default' | 'info' | 'success' | 'warning' | 'critical' | string;\n}\n\nexport interface StatusLightProps extends StatusLightPropsStrict {\n\t[propName: string]: any;\n}\n\nexport const StatusLight: FC<StatusLightProps> = ({\n\tchildren,\n\tclassName,\n\tfull,\n\treverse,\n\tsplit,\n\tdisabled,\n\tpulsing,\n\tonClick,\n\tonMouseOver,\n\thref,\n\tcolor = 'default',\n\t...props\n}) => {\n\tconst isCustomColor = () => {\n\t\tconst uniqueColors = [\n\t\t\t'default',\n\t\t\t'info',\n\t\t\t'success',\n\t\t\t'warning',\n\t\t\t'critical',\n\t\t];\n\n\t\tif (!uniqueColors.includes(color)) return true;\n\t\treturn false;\n\t};\n\n\tconst colorClasses = () => {\n\t\tif (!disabled && !isCustomColor()) {\n\t\t\treturn `StatusLight__indicator--${color}`;\n\t\t}\n\t\treturn false;\n\t};\n\n\tconst StatusLightIndicatorClasses = classnames(\n\t\t'StatusLight__indicator',\n\t\tcolorClasses(),\n\t\t{\n\t\t\t'StatusLight__indicator--disabled': disabled,\n\t\t}\n\t);\n\n\tconst StatusLightClasses = classnames('StatusLight', className, {\n\t\t'StatusLight--disabled': disabled,\n\t\t'StatusLight--reverse': reverse,\n\t\t'StatusLight--full': full,\n\t\t'StatusLight--split': split,\n\t\t'StatusLight--pulsing': pulsing,\n\t\t'StatusLight--action': onClick || onMouseOver || href,\n\t});\n\n\tconst StatusLightElement = href ? 'a' : 'div';\n\n\treturn (\n\t\t<StatusLightElement\n\t\t\tclassName={StatusLightClasses}\n\t\t\thref={href}\n\t\t\tdata-anvil-component=\"StatusLight\"\n\t\t\t{...props}\n\t\t>\n\t\t\t<span\n\t\t\t\tclassName={StatusLightIndicatorClasses}\n\t\t\t\tstyle={isCustomColor() ? { backgroundColor: color } : null}\n\t\t\t/>\n\t\t\t{children !== undefined && children !== null && (\n\t\t\t\t<BodyText size=\"small\" className=\"StatusLight__label\">\n\t\t\t\t\t{children}\n\t\t\t\t</BodyText>\n\t\t\t)}\n\t\t</StatusLightElement>\n\t);\n};\n"]}
+{"version":3,"file":"StatusLight.js","sourceRoot":"","sources":["../../../src/components/StatusLight/StatusLight.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAa,MAAM,OAAO,CAAC;AAClC,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAyCvC,MAAM,CAAC,MAAM,WAAW,GAAyB,CAAC,EAWjD,EAAE,EAAE;QAX6C,EACjD,QAAQ,EACR,SAAS,EACT,IAAI,EACJ,OAAO,EACP,KAAK,EACL,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,KAAK,GAAG,SAAS,OAEjB,EADG,KAAK,cAVyC,6FAWjD,CADQ;IAER,MAAM,aAAa,GAAG,GAAG,EAAE;QAC1B,MAAM,YAAY,GAAG;YACpB,SAAS;YACT,MAAM;YACN,SAAS;YACT,SAAS;YACT,UAAU;SACV,CAAC;QAEF,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,CAAC;YAAE,OAAO,IAAI,CAAC;QAC/C,OAAO,KAAK,CAAC;IACd,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,GAAG,EAAE;QACzB,IAAI,CAAC,QAAQ,IAAI,CAAC,aAAa,EAAE,EAAE;YAClC,OAAO,2BAA2B,KAAK,EAAE,CAAC;SAC1C;QACD,OAAO,KAAK,CAAC;IACd,CAAC,CAAC;IAEF,MAAM,2BAA2B,GAAG,UAAU,CAC7C,wBAAwB,EACxB,YAAY,EAAE,EACd;QACC,kCAAkC,EAAE,QAAQ;KAC5C,CACD,CAAC;IAEF,MAAM,kBAAkB,GAAG,UAAU,CAAC,aAAa,EAAE,SAAS,EAAE;QAC/D,uBAAuB,EAAE,QAAQ;QACjC,sBAAsB,EAAE,OAAO;QAC/B,mBAAmB,EAAE,IAAI;QACzB,oBAAoB,EAAE,KAAK;QAC3B,sBAAsB,EAAE,OAAO;QAC/B,qBAAqB,EACpB,SAAS,IAAI,KAAK,IAAI,aAAa,IAAI,KAAK,IAAI,IAAI;KACrD,CAAC,CAAC;IAEH,MAAM,kBAAkB,GAAG,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,CAAC;IAE9C,OAAO,CACN,oBAAC,kBAAkB,kBAClB,SAAS,EAAE,kBAAkB,EAC7B,IAAI,EAAE,IAAI,0BACW,aAAa,IAC9B,KAAK;QAET,8BACC,SAAS,EAAE,2BAA2B,EACtC,KAAK,EAAE,aAAa,EAAE,CAAC,CAAC,CAAC,EAAE,eAAe,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,IAAI,GACzD;QACD,QAAQ,KAAK,SAAS,IAAI,QAAQ,KAAK,IAAI,IAAI,CAC/C,oBAAC,QAAQ,IAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,oBAAoB,IACnD,QAAQ,CACC,CACX,CACmB,CACrB,CAAC;AACH,CAAC,CAAC","sourcesContent":["import React, { FC } from 'react';\nimport classnames from 'classnames';\nimport { BodyText } from '../BodyText';\n\n/**\n * StatusLight properties\n */\nexport interface StatusLightPropsStrict {\n\t/** Adds one or more classnames for an element */\n\tclassName?: string;\n\n\t/** Disabled StatusLight, unclickable */\n\tdisabled?: boolean;\n\n\t/** Shortcut for full width StatusLight */\n\tfull?: boolean;\n\n\t/** Shortcut for reverse order */\n\treverse?: boolean;\n\n\t/** Shortcut for justify-content:spacebetween */\n\tsplit?: boolean;\n\n\t/** Shortcut for pulsing ripple */\n\tpulsing?: boolean;\n\n\t/** Making hyperlink out of StatusLight */\n\thref?: string;\n\n\t/** Action for when StatusLight is clicked */\n\tonClick?: (e: React.SyntheticEvent<HTMLElement>) => void;\n\n\t/** Action for when StatusLight is hovered */\n\tonMouseOver?: (e: React.SyntheticEvent<HTMLElement>) => void;\n\n\t/** Indicator color */\n\tcolor?: 'default' | 'info' | 'success' | 'warning' | 'critical' | string;\n}\n\nexport interface StatusLightProps extends StatusLightPropsStrict {\n\t[propName: string]: any;\n}\n\nexport const StatusLight: FC<StatusLightProps> = ({\n\tchildren,\n\tclassName,\n\tfull,\n\treverse,\n\tsplit,\n\tdisabled,\n\tpulsing,\n\thref,\n\tcolor = 'default',\n\t...props\n}) => {\n\tconst isCustomColor = () => {\n\t\tconst uniqueColors = [\n\t\t\t'default',\n\t\t\t'info',\n\t\t\t'success',\n\t\t\t'warning',\n\t\t\t'critical',\n\t\t];\n\n\t\tif (!uniqueColors.includes(color)) return true;\n\t\treturn false;\n\t};\n\n\tconst colorClasses = () => {\n\t\tif (!disabled && !isCustomColor()) {\n\t\t\treturn `StatusLight__indicator--${color}`;\n\t\t}\n\t\treturn false;\n\t};\n\n\tconst StatusLightIndicatorClasses = classnames(\n\t\t'StatusLight__indicator',\n\t\tcolorClasses(),\n\t\t{\n\t\t\t'StatusLight__indicator--disabled': disabled,\n\t\t}\n\t);\n\n\tconst StatusLightClasses = classnames('StatusLight', className, {\n\t\t'StatusLight--disabled': disabled,\n\t\t'StatusLight--reverse': reverse,\n\t\t'StatusLight--full': full,\n\t\t'StatusLight--split': split,\n\t\t'StatusLight--pulsing': pulsing,\n\t\t'StatusLight--action':\n\t\t\t'onClick' in props || 'onMouseOver' in props || href,\n\t});\n\n\tconst StatusLightElement = href ? 'a' : 'div';\n\n\treturn (\n\t\t<StatusLightElement\n\t\t\tclassName={StatusLightClasses}\n\t\t\thref={href}\n\t\t\tdata-anvil-component=\"StatusLight\"\n\t\t\t{...props}\n\t\t>\n\t\t\t<span\n\t\t\t\tclassName={StatusLightIndicatorClasses}\n\t\t\t\tstyle={isCustomColor() ? { backgroundColor: color } : null}\n\t\t\t/>\n\t\t\t{children !== undefined && children !== null && (\n\t\t\t\t<BodyText size=\"small\" className=\"StatusLight__label\">\n\t\t\t\t\t{children}\n\t\t\t\t</BodyText>\n\t\t\t)}\n\t\t</StatusLightElement>\n\t);\n};\n"]}

package/dist/components/TimePicker/TimePicker.css

@@ -51,6 +51,9 @@
 .OptionList__option .Checkbox__box {
   top: 0;
 }
+.OptionList__option.OptionList__option--collapsible .Checkbox__label::after {
+  inset: -8px -16px -8px 0;
+}
 
 .OptionList__header {
   line-height: normal;

package/dist/components/TimePicker/TimePicker.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/OptionList/OptionList.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/core/tokens.scss","../../../src/components/TimePicker/TimePicker.scss"],"names":[],"mappings":"AAAA;ACSC;EACC;EACA;EACA;EACA;EACA;EACA;EACA,kBAXwB;;;AAe1B;ACjBC;EACA;AAEA;EACA;;;ADiBD;AAEC;EACC;;;AAIF;AACA;EACC,eE8FW;EF7FX,eEbiB;EFcjB;EACA;EACA;AAuBA;;AAhBA;EACC,WE4FY;EF3FZ,aE8DoB;EF7DpB;;AAGA;EACC;EACA;EACA;EACA;;AAIF;EAAc;;AAGd;EACC;EACA;;AAED;EAAiB;;;AAGlB;EACC;EACA,gBEwDW;EFvDX,cEwDW;;;AFpDX;EAKC,kBA5EyB;;AAwEzB;EACC,OAvEkB;;AA8ElB;EAAY,kBAhFY;;;AAqF3B;AACA;EAAsC,cEqC1B;;;AFjCV;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AAKH;AACA;EACC;EACA;EACA;EACA,cE6Bc;;;AF1Bf;AACA;EACC;EACA;EACA;;;AAGD;AAEC;EAAwB;;AACxB;EAAiB;;;AAGlB;AACA;EACC;EACA;EACA;EACA;EACA,cEDW;;;AFIZ;AAAA;AAAA;AAAA;AAKC;AAAA;EAGC;;AAEA;AAAA;EACC;;AAIF;EAAwB;;;AAGzB;AAAA;AAAA;AAAA;AAKC;EAAwB;;;AG/IzB;AFPC;EACA;AAEA;EACA;EEMA;;AAEA;EACC;EACA;;;AAIF;EAAqB;;;AACrB;EAAgD;;;AAEhD;EACC;EACA;;AAEA;EAAoB;;;AAQrB;EAAuC,eD0F3B;;;ACrFV;EACC,kBArCkB;EAsClB,cApCe;;AAyChB;EACC,kBA3CgB;EA4ChB,cA1CY","file":"TimePicker.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/OptionList/OptionList.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/core/tokens.scss","../../../src/components/TimePicker/TimePicker.scss"],"names":[],"mappings":"AAAA;ACSC;EACC;EACA;EACA;EACA;EACA;EACA;EACA,kBAXwB;;;AAe1B;ACjBC;EACA;AAEA;EACA;;;ADiBD;AAEC;EACC;;;AAIF;AACA;EACC,eE8FW;EF7FX,eEbiB;EFcjB;EACA;EACA;AAuBA;;AAhBA;EACC,WE4FY;EF3FZ,aE8DoB;EF7DpB;;AAGA;EACC;EACA;EACA;EACA;;AAIF;EAAc;;AAGd;EACC;EACA;;AAED;EAAiB;;AAIf;EACC;;;AAOJ;EACC;EACA,gBE+CW;EF9CX,cE+CW;;;AF3CX;EAKC,kBArFyB;;AAiFzB;EACC,OAhFkB;;AAuFlB;EAAY,kBAzFY;;;AA8F3B;AACA;EAAsC,cE4B1B;;;AFxBV;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AAKH;AACA;EACC;EACA;EACA;EACA,cEoBc;;;AFjBf;AACA;EACC;EACA;EACA;;;AAGD;AAEC;EAAwB;;AACxB;EAAiB;;;AAGlB;AACA;EACC;EACA;EACA;EACA;EACA,cEVW;;;AFaZ;AAAA;AAAA;AAAA;AAKC;AAAA;EAGC;;AAEA;AAAA;EACC;;AAIF;EAAwB;;;AAGzB;AAAA;AAAA;AAAA;AAKC;EAAwB;;;AGxJzB;AFPC;EACA;AAEA;EACA;EEMA;;AAEA;EACC;EACA;;;AAIF;EAAqB;;;AACrB;EAAgD;;;AAEhD;EACC;EACA;;AAEA;EAAoB;;;AAQrB;EAAuC,eD0F3B;;;ACrFV;EACC,kBArCkB;EAsClB,cApCe;;AAyChB;EACC,kBA3CgB;EA4ChB,cA1CY","file":"TimePicker.css"}

package/dist/components/TimePicker/index.css

@@ -51,6 +51,9 @@
 .OptionList__option .Checkbox__box {
   top: 0;
 }
+.OptionList__option.OptionList__option--collapsible .Checkbox__label::after {
+  inset: -8px -16px -8px 0;
+}
 
 .OptionList__header {
   line-height: normal;

package/dist/components/TimePicker/index.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/OptionList/OptionList.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/core/tokens.scss","../../../src/components/TimePicker/TimePicker.scss"],"names":[],"mappings":"AAAA;ACSC;EACC;EACA;EACA;EACA;EACA;EACA;EACA,kBAXwB;;;AAe1B;ACjBC;EACA;AAEA;EACA;;;ADiBD;AAEC;EACC;;;AAIF;AACA;EACC,eE8FW;EF7FX,eEbiB;EFcjB;EACA;EACA;AAuBA;;AAhBA;EACC,WE4FY;EF3FZ,aE8DoB;EF7DpB;;AAGA;EACC;EACA;EACA;EACA;;AAIF;EAAc;;AAGd;EACC;EACA;;AAED;EAAiB;;;AAGlB;EACC;EACA,gBEwDW;EFvDX,cEwDW;;;AFpDX;EAKC,kBA5EyB;;AAwEzB;EACC,OAvEkB;;AA8ElB;EAAY,kBAhFY;;;AAqF3B;AACA;EAAsC,cEqC1B;;;AFjCV;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AAKH;AACA;EACC;EACA;EACA;EACA,cE6Bc;;;AF1Bf;AACA;EACC;EACA;EACA;;;AAGD;AAEC;EAAwB;;AACxB;EAAiB;;;AAGlB;AACA;EACC;EACA;EACA;EACA;EACA,cEDW;;;AFIZ;AAAA;AAAA;AAAA;AAKC;AAAA;EAGC;;AAEA;AAAA;EACC;;AAIF;EAAwB;;;AAGzB;AAAA;AAAA;AAAA;AAKC;EAAwB;;;AG/IzB;AFPC;EACA;AAEA;EACA;EEMA;;AAEA;EACC;EACA;;;AAIF;EAAqB;;;AACrB;EAAgD;;;AAEhD;EACC;EACA;;AAEA;EAAoB;;;AAQrB;EAAuC,eD0F3B;;;ACrFV;EACC,kBArCkB;EAsClB,cApCe;;AAyChB;EACC,kBA3CgB;EA4ChB,cA1CY","file":"index.css"}
+{"version":3,"sourceRoot":"","sources":["../../../src/utilities/_visually-hidden.scss","../../../src/components/OptionList/OptionList.scss","../../../src/utilities/_component-reset.scss","../../../node_modules/@servicetitan/tokens/core/tokens.scss","../../../src/components/TimePicker/TimePicker.scss"],"names":[],"mappings":"AAAA;ACSC;EACC;EACA;EACA;EACA;EACA;EACA;EACA,kBAXwB;;;AAe1B;ACjBC;EACA;AAEA;EACA;;;ADiBD;AAEC;EACC;;;AAIF;AACA;EACC,eE8FW;EF7FX,eEbiB;EFcjB;EACA;EACA;AAuBA;;AAhBA;EACC,WE4FY;EF3FZ,aE8DoB;EF7DpB;;AAGA;EACC;EACA;EACA;EACA;;AAIF;EAAc;;AAGd;EACC;EACA;;AAED;EAAiB;;AAIf;EACC;;;AAOJ;EACC;EACA,gBE+CW;EF9CX,cE+CW;;;AF3CX;EAKC,kBArFyB;;AAiFzB;EACC,OAhFkB;;AAuFlB;EAAY,kBAzFY;;;AA8F3B;AACA;EAAsC,cE4B1B;;;AFxBV;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AADD;EACC;;;AAKH;AACA;EACC;EACA;EACA;EACA,cEoBc;;;AFjBf;AACA;EACC;EACA;EACA;;;AAGD;AAEC;EAAwB;;AACxB;EAAiB;;;AAGlB;AACA;EACC;EACA;EACA;EACA;EACA,cEVW;;;AFaZ;AAAA;AAAA;AAAA;AAKC;AAAA;EAGC;;AAEA;AAAA;EACC;;AAIF;EAAwB;;;AAGzB;AAAA;AAAA;AAAA;AAKC;EAAwB;;;AGxJzB;AFPC;EACA;AAEA;EACA;EEMA;;AAEA;EACC;EACA;;;AAIF;EAAqB;;;AACrB;EAAgD;;;AAEhD;EACC;EACA;;AAEA;EAAoB;;;AAQrB;EAAuC,eD0F3B;;;ACrFV;EACC,kBArCkB;EAsClB,cApCe;;AAyChB;EACC,kBA3CgB;EA4ChB,cA1CY","file":"index.css"}

package/dist/components/index.css

@@ -8882,6 +8882,9 @@ button.a-Icon svg {
 .OptionList__option .Checkbox__box {
   top: 0;
 }
+.OptionList__option.OptionList__option--collapsible .Checkbox__label::after {
+  inset: -8px -16px -8px 0;
+}
 
 .OptionList__header {
   line-height: normal;