@elliemae/ds-legacy-dropdownmenu 1.0.0-rc.1

package/dist/esm/deprecated/MenuItemClickableHOC.js

@@ -0,0 +1,31 @@
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import { useContext } from "react";
+import { runAll, get } from "@elliemae/ds-legacy-utilities";
+import { DropdownMenuContext } from "./DropdownMenuContext.js";
+const noop = () => null;
+const defaultConfig = { type: "default", handlerName: "onClick" };
+function MenuItemClickableHOC(WrappedComponent, config) {
+  return function({ item = {}, ...restProps }) {
+    const { type, handlerName } = { ...defaultConfig, ...config };
+    const { onItemClick, selection } = useContext(DropdownMenuContext);
+    const propHandler = restProps[handlerName] || noop;
+    const handler = {
+      [handlerName]: () => runAll(onItemClick, propHandler)({ item, type })
+    };
+    return /* @__PURE__ */ jsx(
+      WrappedComponent,
+      {
+        ...restProps,
+        ...type === "selectable" && selection ? { checked: get(selection, [item.id]) } : {},
+        ...handler
+      }
+    );
+  };
+}
+var MenuItemClickableHOC_default = MenuItemClickableHOC;
+export {
+  MenuItemClickableHOC,
+  MenuItemClickableHOC_default as default
+};
+//# sourceMappingURL=MenuItemClickableHOC.js.map

package/dist/esm/deprecated/MenuItemClickableHOC.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/deprecated/MenuItemClickableHOC.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "// @ts-nocheck\n/* eslint-disable react/display-name */\nimport React, { useContext } from 'react';\nimport { runAll, get } from '@elliemae/ds-legacy-utilities';\nimport { DropdownMenuContext } from './DropdownMenuContext.js';\n\nconst noop = () => null;\n\nconst defaultConfig = { type: 'default', handlerName: 'onClick' };\n\nfunction MenuItemClickableHOC(WrappedComponent, config) {\n  return function ({ item = {}, ...restProps }) {\n    const { type, handlerName } = { ...defaultConfig, ...config };\n    const { onItemClick, selection } = useContext(DropdownMenuContext);\n    const propHandler = restProps[handlerName] || noop;\n    const handler = {\n      [handlerName]: () => runAll(onItemClick, propHandler)({ item, type }),\n    };\n    return (\n      <WrappedComponent\n        {...restProps}\n        {...(type === 'selectable' && selection ? { checked: get(selection, [item.id]) } : {})}\n        {...handler}\n      />\n    );\n  };\n}\n\nexport { MenuItemClickableHOC };\nexport default MenuItemClickableHOC;\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACmBjB;AAjBN,SAAgB,kBAAkB;AAClC,SAAS,QAAQ,WAAW;AAC5B,SAAS,2BAA2B;AAEpC,MAAM,OAAO,MAAM;AAEnB,MAAM,gBAAgB,EAAE,MAAM,WAAW,aAAa,UAAU;AAEhE,SAAS,qBAAqB,kBAAkB,QAAQ;AACtD,SAAO,SAAU,EAAE,OAAO,CAAC,GAAG,GAAG,UAAU,GAAG;AAC5C,UAAM,EAAE,MAAM,YAAY,IAAI,EAAE,GAAG,eAAe,GAAG,OAAO;AAC5D,UAAM,EAAE,aAAa,UAAU,IAAI,WAAW,mBAAmB;AACjE,UAAM,cAAc,UAAU,WAAW,KAAK;AAC9C,UAAM,UAAU;AAAA,MACd,CAAC,WAAW,GAAG,MAAM,OAAO,aAAa,WAAW,EAAE,EAAE,MAAM,KAAK,CAAC;AAAA,IACtE;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACH,GAAI,SAAS,gBAAgB,YAAY,EAAE,SAAS,IAAI,WAAW,CAAC,KAAK,EAAE,CAAC,EAAE,IAAI,CAAC;AAAA,QACnF,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAGA,IAAO,+BAAQ;",
+  "names": []
+}

package/dist/esm/deprecated/MenuItemGroupSelectionHOC.js

@@ -0,0 +1,29 @@
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import { useContext } from "react";
+import { runAll, get } from "@elliemae/ds-legacy-utilities";
+import { DropdownMenuContext } from "./DropdownMenuContext.js";
+const noop = () => null;
+function MenuItemGroupSelectionHOC(WrappedComponent, handlerName = "onSelect") {
+  return function({ item = {}, ...restProps }) {
+    const { onItemClick, selection } = useContext(DropdownMenuContext);
+    const propHandler = restProps[handlerName] || noop;
+    const handler = {
+      [handlerName]: (active, itemOption) => runAll(item.onSelect, onItemClick, propHandler)({ item: itemOption, group: { ...item, active } })
+    };
+    return /* @__PURE__ */ jsx(
+      WrappedComponent,
+      {
+        ...restProps,
+        ...selection ? { active: get(selection, [item.id]) || item.active } : {},
+        ...handler
+      }
+    );
+  };
+}
+var MenuItemGroupSelectionHOC_default = MenuItemGroupSelectionHOC;
+export {
+  MenuItemGroupSelectionHOC,
+  MenuItemGroupSelectionHOC_default as default
+};
+//# sourceMappingURL=MenuItemGroupSelectionHOC.js.map

package/dist/esm/deprecated/MenuItemGroupSelectionHOC.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/deprecated/MenuItemGroupSelectionHOC.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "// @ts-nocheck\n/* eslint-disable react/display-name */\nimport React, { useContext } from 'react';\nimport { runAll, get } from '@elliemae/ds-legacy-utilities';\nimport { DropdownMenuContext } from './DropdownMenuContext.js';\n\nconst noop = () => null;\n\nfunction MenuItemGroupSelectionHOC(WrappedComponent, handlerName = 'onSelect') {\n  return function ({ item = {}, ...restProps }) {\n    const { onItemClick, selection } = useContext(DropdownMenuContext);\n    const propHandler = restProps[handlerName] || noop;\n    const handler = {\n      [handlerName]: (active, itemOption) =>\n        runAll(item.onSelect, onItemClick, propHandler)({ item: itemOption, group: { ...item, active } }),\n    };\n    return (\n      <WrappedComponent\n        {...restProps}\n        {...(selection ? { active: get(selection, [item.id]) || item.active } : {})}\n        {...handler}\n      />\n    );\n  };\n}\n\nexport { MenuItemGroupSelectionHOC };\nexport default MenuItemGroupSelectionHOC;\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACiBjB;AAfN,SAAgB,kBAAkB;AAClC,SAAS,QAAQ,WAAW;AAC5B,SAAS,2BAA2B;AAEpC,MAAM,OAAO,MAAM;AAEnB,SAAS,0BAA0B,kBAAkB,cAAc,YAAY;AAC7E,SAAO,SAAU,EAAE,OAAO,CAAC,GAAG,GAAG,UAAU,GAAG;AAC5C,UAAM,EAAE,aAAa,UAAU,IAAI,WAAW,mBAAmB;AACjE,UAAM,cAAc,UAAU,WAAW,KAAK;AAC9C,UAAM,UAAU;AAAA,MACd,CAAC,WAAW,GAAG,CAAC,QAAQ,eACtB,OAAO,KAAK,UAAU,aAAa,WAAW,EAAE,EAAE,MAAM,YAAY,OAAO,EAAE,GAAG,MAAM,OAAO,EAAE,CAAC;AAAA,IACpG;AACA,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACH,GAAI,YAAY,EAAE,QAAQ,IAAI,WAAW,CAAC,KAAK,EAAE,CAAC,KAAK,KAAK,OAAO,IAAI,CAAC;AAAA,QACxE,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AACF;AAGA,IAAO,oCAAQ;",
+  "names": []
+}

package/dist/esm/deprecated/decoratedMenuItemFactory.js

@@ -0,0 +1,19 @@
+import * as React from "react";
+import { Menu, renderMenuItems, menuItemFactory } from "@elliemae/ds-legacy-common";
+import { MenuItemClickableHOC } from "./MenuItemClickableHOC.js";
+import { MenuItemGroupSelectionHOC } from "./MenuItemGroupSelectionHOC.js";
+const itemTypes = {
+  separator: Menu.Separator,
+  menuitem: MenuItemClickableHOC(Menu.Item),
+  radio: MenuItemClickableHOC(Menu.ItemRadio, { type: "selectable" }),
+  checkbox: MenuItemClickableHOC(Menu.ItemCheckbox, { type: "selectable" }),
+  submenu: Menu.SubMenu,
+  "selection-group": MenuItemGroupSelectionHOC(Menu.SelectionGroup)
+};
+const factory = (type) => menuItemFactory(type, itemTypes, itemTypes.menuitem);
+const renderOptions = (options) => renderMenuItems(options, factory);
+export {
+  factory,
+  renderOptions
+};
+//# sourceMappingURL=decoratedMenuItemFactory.js.map

package/dist/esm/deprecated/decoratedMenuItemFactory.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/deprecated/decoratedMenuItemFactory.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "// @ts-nocheck\nimport { Menu, renderMenuItems, menuItemFactory } from '@elliemae/ds-legacy-common';\nimport { MenuItemClickableHOC } from './MenuItemClickableHOC.js';\nimport { MenuItemGroupSelectionHOC } from './MenuItemGroupSelectionHOC.js';\n\nconst itemTypes = {\n  separator: Menu.Separator,\n  menuitem: MenuItemClickableHOC(Menu.Item),\n  radio: MenuItemClickableHOC(Menu.ItemRadio, { type: 'selectable' }),\n  checkbox: MenuItemClickableHOC(Menu.ItemCheckbox, { type: 'selectable' }),\n  submenu: Menu.SubMenu,\n  'selection-group': MenuItemGroupSelectionHOC(Menu.SelectionGroup),\n};\n\nexport const factory = (type) => menuItemFactory(type, itemTypes, itemTypes.menuitem);\nexport const renderOptions = (options) => renderMenuItems(options, factory);\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,MAAM,iBAAiB,uBAAuB;AACvD,SAAS,4BAA4B;AACrC,SAAS,iCAAiC;AAE1C,MAAM,YAAY;AAAA,EAChB,WAAW,KAAK;AAAA,EAChB,UAAU,qBAAqB,KAAK,IAAI;AAAA,EACxC,OAAO,qBAAqB,KAAK,WAAW,EAAE,MAAM,aAAa,CAAC;AAAA,EAClE,UAAU,qBAAqB,KAAK,cAAc,EAAE,MAAM,aAAa,CAAC;AAAA,EACxE,SAAS,KAAK;AAAA,EACd,mBAAmB,0BAA0B,KAAK,cAAc;AAClE;AAEO,MAAM,UAAU,CAAC,SAAS,gBAAgB,MAAM,WAAW,UAAU,QAAQ;AAC7E,MAAM,gBAAgB,CAAC,YAAY,gBAAgB,SAAS,OAAO;",
+  "names": []
+}

package/dist/esm/deprecated/index.js

@@ -0,0 +1,10 @@
+import * as React from "react";
+import { default as default2, DropdownMenuWithSchema, DSDropdownMenu } from "./DSDropdownMenu.js";
+import { CustomPhoneRenderer } from "./CustomPhoneRenderer.js";
+export {
+  CustomPhoneRenderer,
+  DSDropdownMenu,
+  DropdownMenuWithSchema,
+  default2 as default
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/deprecated/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/deprecated/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "// @ts-nocheck\nexport { default, DropdownMenuWithSchema, DSDropdownMenu } from './DSDropdownMenu.js';\nexport { CustomPhoneRenderer } from './CustomPhoneRenderer.js';\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,WAAAA,UAAS,wBAAwB,sBAAsB;AAChE,SAAS,2BAA2B;",
+  "names": ["default"]
+}

package/dist/esm/exported-related/constants.js

@@ -0,0 +1,15 @@
+import * as React from "react";
+const DSDropdownMenuName = "DSDropdownMenu";
+const DSDropdownMenuSlots = {
+  ROOT: "root",
+  LOADING_WRAPPER: "loading-wrapper",
+  LISTBOX_WRAPPER: "listbox-wrapper",
+  HEADER_WRAPPER: "header-wrapper",
+  OPTION_LIST_WRAPPER: "option-list-wrapper",
+  EMPTY_STATE_WRAPPER: "empty-state-wrapper"
+};
+export {
+  DSDropdownMenuName,
+  DSDropdownMenuSlots
+};
+//# sourceMappingURL=constants.js.map

package/dist/esm/exported-related/constants.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/exported-related/constants.ts"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSDropdownMenuName = 'DSDropdownMenu';\n\nexport const DSDropdownMenuSlots = {\n  ROOT: 'root',\n  LOADING_WRAPPER: 'loading-wrapper',\n  LISTBOX_WRAPPER: 'listbox-wrapper',\n  HEADER_WRAPPER: 'header-wrapper',\n  OPTION_LIST_WRAPPER: 'option-list-wrapper',\n  EMPTY_STATE_WRAPPER: 'empty-state-wrapper',\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,qBAAqB;AAE3B,MAAM,sBAAsB;AAAA,EACjC,MAAM;AAAA,EACN,iBAAiB;AAAA,EACjB,iBAAiB;AAAA,EACjB,gBAAgB;AAAA,EAChB,qBAAqB;AAAA,EACrB,qBAAqB;AACvB;",
+  "names": []
+}

package/dist/esm/exported-related/index.js

@@ -0,0 +1,3 @@
+import * as React from "react";
+export * from "./constants.js";
+//# sourceMappingURL=index.js.map

package/dist/esm/exported-related/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/exported-related/index.ts"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './constants.js';\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;",
+  "names": []
+}

package/dist/esm/hooks/index.js

@@ -0,0 +1,5 @@
+import * as React from "react";
+export * from "./useAutofocusContainerOnOpen.js";
+export * from "./useDropdownMenuItemHandlers.js";
+export * from "./useGetOptionSpecialAttributes.js";
+//# sourceMappingURL=index.js.map

package/dist/esm/hooks/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/hooks/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './useAutofocusContainerOnOpen.js';\nexport * from './useDropdownMenuItemHandlers.js';\nexport * from './useGetOptionSpecialAttributes.js';\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;AACd,cAAc;AACd,cAAc;",
+  "names": []
+}

package/dist/esm/hooks/useAutofocusContainerOnOpen.js

@@ -0,0 +1,19 @@
+import * as React from "react";
+import { useContext, useLayoutEffect } from "react";
+import { DSDropdownMenuContext } from "../DropdownMenuContext.js";
+const useAutofocusContainerOnOpen = () => {
+  const { listboxReference, inputReference } = useContext(DSDropdownMenuContext);
+  useLayoutEffect(() => {
+    requestAnimationFrame(() => {
+      if (inputReference.current) {
+        inputReference.current.focus();
+      } else if (listboxReference.current) {
+        listboxReference.current.focus();
+      }
+    });
+  }, [inputReference, listboxReference]);
+};
+export {
+  useAutofocusContainerOnOpen
+};
+//# sourceMappingURL=useAutofocusContainerOnOpen.js.map

package/dist/esm/hooks/useAutofocusContainerOnOpen.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/hooks/useAutofocusContainerOnOpen.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useContext, useLayoutEffect } from 'react';\nimport { DSDropdownMenuContext } from '../DropdownMenuContext.js';\n\nexport const useAutofocusContainerOnOpen = () => {\n  const { listboxReference, inputReference } = useContext(DSDropdownMenuContext);\n\n  useLayoutEffect(() => {\n    requestAnimationFrame(() => {\n      if (inputReference.current) {\n        inputReference.current.focus();\n      } else if (listboxReference.current) {\n        listboxReference.current.focus();\n      }\n    });\n  }, [inputReference, listboxReference]);\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,YAAY,uBAAuB;AAC5C,SAAS,6BAA6B;AAE/B,MAAM,8BAA8B,MAAM;AAC/C,QAAM,EAAE,kBAAkB,eAAe,IAAI,WAAW,qBAAqB;AAE7E,kBAAgB,MAAM;AACpB,0BAAsB,MAAM;AAC1B,UAAI,eAAe,SAAS;AAC1B,uBAAe,QAAQ,MAAM;AAAA,MAC/B,WAAW,iBAAiB,SAAS;AACnC,yBAAiB,QAAQ,MAAM;AAAA,MACjC;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,gBAAgB,gBAAgB,CAAC;AACvC;",
+  "names": []
+}

package/dist/esm/hooks/useDropdownListboxHandlers.js

@@ -0,0 +1,96 @@
+import * as React from "react";
+import { useCallback, useContext } from "react";
+import { DSDropdownMenuContext } from "../DropdownMenuContext.js";
+import { findInCircularList, isOptionFocuseable, manageOpenedSubmenus } from "../utils/index.js";
+const useDropdownListboxHandlers = () => {
+  const {
+    props: {
+      options,
+      onOptionClick,
+      openedSubmenus,
+      onSubmenuToggle,
+      onKeyDown: userOnKeyDown,
+      selectedOptions,
+      onClickOutside,
+      onMouseEnter: userOnMouseEnter,
+      onMouseLeave
+    },
+    activeDescendant,
+    setActiveDescendant,
+    scrollOptionIntoView,
+    listboxReference,
+    inputReference
+  } = useContext(DSDropdownMenuContext);
+  const onKeyDown = useCallback(
+    (e) => {
+      const currentItemIndex = options.findIndex((opt) => opt.dsId === activeDescendant);
+      if (currentItemIndex === -1)
+        return;
+      const option = options[currentItemIndex];
+      e.stopPropagation();
+      if (e.code === "ArrowDown") {
+        e.preventDefault();
+        const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable);
+        setActiveDescendant(options[nextItemIndex].dsId);
+        scrollOptionIntoView(options[nextItemIndex].dsId);
+      } else if (e.code === "ArrowUp") {
+        e.preventDefault();
+        const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable, -1);
+        setActiveDescendant(options[nextItemIndex].dsId);
+        scrollOptionIntoView(options[nextItemIndex].dsId);
+      } else if (e.code === "ArrowRight" && ["submenu", "singleWithSubmenu"].includes(option.type) && !openedSubmenus[option.dsId]) {
+        e.preventDefault();
+        onSubmenuToggle(manageOpenedSubmenus(options, { ...openedSubmenus, [option.dsId]: true }, option), option, e);
+      } else if (["Space", "Enter"].includes(e.code)) {
+        e.preventDefault();
+        const nextSelectedOptions = { ...selectedOptions };
+        nextSelectedOptions[option.dsId] = !selectedOptions[option.dsId];
+        if (option?.disabled)
+          return;
+        onOptionClick(nextSelectedOptions, option, e);
+        if (option.onClick)
+          option.onClick(e);
+      } else if (e.code === "Escape") {
+        onClickOutside(e);
+      } else if (e.code === "Home") {
+        const nextItemIndex = findInCircularList(options, options.length - 1, isOptionFocuseable);
+        setActiveDescendant(options[nextItemIndex].dsId);
+        scrollOptionIntoView(options[nextItemIndex].dsId);
+      } else if (e.code === "End") {
+        const nextItemIndex = findInCircularList(options, 0, isOptionFocuseable, -1);
+        setActiveDescendant(options[nextItemIndex].dsId);
+        scrollOptionIntoView(options[nextItemIndex].dsId);
+      }
+      if (option.onKeyDown)
+        option.onKeyDown(e);
+      userOnKeyDown(e);
+    },
+    [
+      options,
+      openedSubmenus,
+      userOnKeyDown,
+      activeDescendant,
+      setActiveDescendant,
+      scrollOptionIntoView,
+      onSubmenuToggle,
+      selectedOptions,
+      onOptionClick,
+      onClickOutside
+    ]
+  );
+  const onMouseEnter = useCallback(
+    (e) => {
+      if (inputReference.current)
+        inputReference.current.focus();
+      else
+        listboxReference.current?.focus();
+      userOnMouseEnter(e);
+    },
+    [inputReference, listboxReference, userOnMouseEnter]
+  );
+  return { onKeyDown, onMouseEnter, onMouseLeave };
+};
+export {
+  useDropdownListboxHandlers
+};
+//# sourceMappingURL=useDropdownListboxHandlers.js.map

package/dist/esm/hooks/useDropdownListboxHandlers.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/hooks/useDropdownListboxHandlers.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-params */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport type React from 'react';\nimport { useCallback, useContext } from 'react';\nimport { DSDropdownMenuContext } from '../DropdownMenuContext.js';\nimport type { DSDropdownMenuT } from '../react-desc-prop-types.js';\nimport { findInCircularList, isOptionFocuseable, manageOpenedSubmenus } from '../utils/index.js';\n\ntype UseDropdownListboxHandlersType = () => {\n  onKeyDown: React.KeyboardEventHandler;\n  onMouseEnter: React.MouseEventHandler;\n  onMouseLeave?: React.MouseEventHandler;\n};\n\nexport const useDropdownListboxHandlers: UseDropdownListboxHandlersType = () => {\n  const {\n    props: {\n      options,\n      onOptionClick,\n      openedSubmenus,\n      onSubmenuToggle,\n      onKeyDown: userOnKeyDown,\n      selectedOptions,\n      onClickOutside,\n      onMouseEnter: userOnMouseEnter,\n      onMouseLeave,\n    },\n    activeDescendant,\n    setActiveDescendant,\n    scrollOptionIntoView,\n    listboxReference,\n    inputReference,\n  } = useContext(DSDropdownMenuContext);\n\n  const onKeyDown: React.KeyboardEventHandler = useCallback(\n    (e) => {\n      const currentItemIndex = options.findIndex((opt) => opt.dsId === activeDescendant);\n      if (currentItemIndex === -1) return;\n\n      const option = options[currentItemIndex];\n\n      e.stopPropagation();\n\n      if (e.code === 'ArrowDown') {\n        e.preventDefault();\n        const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable);\n        setActiveDescendant(options[nextItemIndex].dsId);\n        scrollOptionIntoView(options[nextItemIndex].dsId);\n      } else if (e.code === 'ArrowUp') {\n        e.preventDefault();\n        const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable, -1);\n        setActiveDescendant(options[nextItemIndex].dsId);\n        scrollOptionIntoView(options[nextItemIndex].dsId);\n      } else if (\n        e.code === 'ArrowRight' &&\n        ['submenu', 'singleWithSubmenu'].includes(option.type) &&\n        !openedSubmenus[option.dsId]\n      ) {\n        e.preventDefault();\n        onSubmenuToggle(manageOpenedSubmenus(options, { ...openedSubmenus, [option.dsId]: true }, option), option, e);\n      } else if (['Space', 'Enter'].includes(e.code)) {\n        e.preventDefault();\n        const nextSelectedOptions = { ...selectedOptions };\n        nextSelectedOptions[option.dsId] = !selectedOptions[option.dsId];\n        if ((option as DSDropdownMenuT.ItemActionOptions)?.disabled) return; // prevent click when is disabled\n        onOptionClick(nextSelectedOptions, option, e);\n        if (option.onClick) option.onClick(e);\n      } else if (e.code === 'Escape') {\n        onClickOutside(e);\n      } else if (e.code === 'Home') {\n        const nextItemIndex = findInCircularList(options, options.length - 1, isOptionFocuseable);\n        setActiveDescendant(options[nextItemIndex].dsId);\n        scrollOptionIntoView(options[nextItemIndex].dsId);\n      } else if (e.code === 'End') {\n        const nextItemIndex = findInCircularList(options, 0, isOptionFocuseable, -1);\n        setActiveDescendant(options[nextItemIndex].dsId);\n        scrollOptionIntoView(options[nextItemIndex].dsId);\n      }\n      if (option.onKeyDown) option.onKeyDown(e);\n      userOnKeyDown(e);\n    },\n    [\n      options,\n      openedSubmenus,\n      userOnKeyDown,\n      activeDescendant,\n      setActiveDescendant,\n      scrollOptionIntoView,\n      onSubmenuToggle,\n      selectedOptions,\n      onOptionClick,\n      onClickOutside,\n    ],\n  );\n\n  const onMouseEnter: React.MouseEventHandler = useCallback(\n    (e: React.MouseEvent) => {\n      if (inputReference.current) inputReference.current.focus();\n      else listboxReference.current?.focus();\n      userOnMouseEnter(e);\n    },\n    [inputReference, listboxReference, userOnMouseEnter],\n  );\n  return { onKeyDown, onMouseEnter, onMouseLeave };\n};\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/esm/hooks/useDropdownMenuItemHandlers.js

@@ -0,0 +1,98 @@
+import * as React from "react";
+import { useCallback, useContext, useMemo } from "react";
+import { useMakeMutable } from "@elliemae/ds-legacy-utilities";
+import { DSDropdownMenuContext } from "../DropdownMenuContext.js";
+import { manageOpenedSubmenus } from "../utils/index.js";
+const useDropdownMenuItemHandlers = (option) => {
+  const {
+    props: {
+      options,
+      selectedOptions,
+      onOptionClick,
+      openedSubmenus,
+      onSubmenuToggle,
+      onMouseEnter,
+      onMouseLeave,
+      onMouseDown
+    },
+    listboxReference,
+    inputReference
+  } = useContext(DSDropdownMenuContext);
+  const mutableOption = useMakeMutable(option);
+  const mutableOptions = useMakeMutable(options);
+  const mutableOpenedSubmenus = useMakeMutable(openedSubmenus);
+  const mutableOnSubmenuToggle = useMakeMutable(onSubmenuToggle);
+  const mutableOnOptionClick = useMakeMutable(onOptionClick);
+  const mutableSelectedOptions = useMakeMutable(selectedOptions);
+  const onClick = useCallback(
+    (e) => {
+      e.stopPropagation();
+      e.preventDefault();
+      const nextSelectedOptions = { ...mutableSelectedOptions.current };
+      nextSelectedOptions[mutableOption.current.dsId] = !mutableSelectedOptions.current[mutableOption.current.dsId];
+      if (mutableOption?.current?.disabled)
+        return;
+      mutableOnOptionClick?.current?.(nextSelectedOptions, mutableOption.current, e);
+      if (e.type === "click")
+        mutableOption?.current?.onClick?.(e);
+    },
+    [mutableOnOptionClick, mutableOption, mutableSelectedOptions]
+  );
+  const onSubmenuOpen = useCallback(
+    (e) => {
+      mutableOnSubmenuToggle?.current?.(
+        manageOpenedSubmenus(
+          mutableOptions.current,
+          { ...mutableOpenedSubmenus?.current || {}, [mutableOption.current.dsId]: true },
+          mutableOption.current
+        ),
+        mutableOption.current,
+        e
+      );
+    },
+    [mutableOnSubmenuToggle, mutableOpenedSubmenus, mutableOption, mutableOptions]
+  );
+  const onSubmenuClose = useCallback(
+    (e) => {
+      mutableOnSubmenuToggle?.current?.(
+        manageOpenedSubmenus(
+          mutableOptions.current,
+          { ...mutableOpenedSubmenus?.current || {}, [mutableOption.current.dsId]: false },
+          mutableOption.current
+        ),
+        mutableOption.current,
+        e
+      );
+      if (inputReference.current)
+        inputReference.current.focus();
+      else
+        listboxReference.current?.focus();
+    },
+    [inputReference, listboxReference, mutableOnSubmenuToggle, mutableOpenedSubmenus, mutableOption, mutableOptions]
+  );
+  const onDropdownKeyDown = useCallback(
+    (e) => {
+      if (e.code === "ArrowLeft") {
+        onSubmenuClose(e);
+        e.preventDefault();
+      }
+    },
+    [onSubmenuClose]
+  );
+  return useMemo(
+    () => ({
+      onClick,
+      onSubmenuOpen,
+      onSubmenuClose,
+      onDropdownKeyDown,
+      onMouseEnter,
+      onMouseLeave,
+      onMouseDown
+    }),
+    [onClick, onSubmenuOpen, onSubmenuClose, onDropdownKeyDown, onMouseEnter, onMouseLeave, onMouseDown]
+  );
+};
+export {
+  useDropdownMenuItemHandlers
+};
+//# sourceMappingURL=useDropdownMenuItemHandlers.js.map

package/dist/esm/hooks/useDropdownMenuItemHandlers.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/hooks/useDropdownMenuItemHandlers.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport { useCallback, useContext, useMemo } from 'react';\nimport { useMakeMutable } from '@elliemae/ds-legacy-utilities';\nimport { DSDropdownMenuContext } from '../DropdownMenuContext.js';\nimport { manageOpenedSubmenus } from '../utils/index.js';\nimport type { DSDropdownMenuT } from '../react-desc-prop-types.js';\n\ntype UseDropdownMenuItemHandlersType = (option: DSDropdownMenuT.Item) => {\n  onClick: (e: React.MouseEvent | React.KeyboardEvent) => void;\n  onSubmenuOpen: (e: React.MouseEvent | React.KeyboardEvent) => void;\n  onSubmenuClose: (e: React.MouseEvent | React.KeyboardEvent) => void;\n  onDropdownKeyDown: React.KeyboardEventHandler;\n  onMouseEnter: React.MouseEventHandler;\n  onMouseLeave: React.MouseEventHandler;\n};\n\nexport const useDropdownMenuItemHandlers: UseDropdownMenuItemHandlersType = (option) => {\n  const {\n    props: {\n      options,\n      selectedOptions,\n      onOptionClick,\n      openedSubmenus,\n      onSubmenuToggle,\n      onMouseEnter,\n      onMouseLeave,\n      onMouseDown,\n    },\n    listboxReference,\n    inputReference,\n  } = useContext(DSDropdownMenuContext);\n\n  // it's vital for the opinionated onSubmenuOpen / onSubmenuClose to\n  //   - have access to the latest information about openedSubmenus\n  //   - be as \"pure\" as possible to guarantee that usage with the \"bridge\" pattern\n  //       will be as \"transparent\" as possible (if nested inside async code, redefing the callback may invoke a stale closure)\n  // the whole component is kind of messy so I'm going to implement a quick and dirty solution\n  // I'm going to make all the arguments for the callbacks \"mutable\",\n  //    this is sub-optimal on a performance level but will have to do for now\n  const mutableOption = useMakeMutable(option);\n  const mutableOptions = useMakeMutable(options);\n  const mutableOpenedSubmenus = useMakeMutable(openedSubmenus);\n  const mutableOnSubmenuToggle = useMakeMutable(onSubmenuToggle);\n  const mutableOnOptionClick = useMakeMutable(onOptionClick);\n  const mutableSelectedOptions = useMakeMutable(selectedOptions);\n\n  // This callback is used on single / multi items to toggle the selection\n  const onClick = useCallback(\n    (e: React.MouseEvent | React.KeyboardEvent) => {\n      e.stopPropagation();\n      e.preventDefault();\n      const nextSelectedOptions = { ...mutableSelectedOptions.current };\n      nextSelectedOptions[mutableOption.current.dsId] = !mutableSelectedOptions.current[mutableOption.current.dsId];\n      if ((mutableOption?.current as DSDropdownMenuT.ItemActionOptions)?.disabled) return; // prevent click when is disabled\n      mutableOnOptionClick?.current?.(nextSelectedOptions, mutableOption.current, e);\n      // we avoid invoking \"onClick\" twice when the users \"key-down - enter\" on the item by checking if the event is keyboard related\n      if (e.type === 'click') mutableOption?.current?.onClick?.(e);\n    },\n    [mutableOnOptionClick, mutableOption, mutableSelectedOptions],\n  );\n\n  // This callback is used on submenu items to open it onMouseEnter\n  const onSubmenuOpen = useCallback(\n    (e: React.MouseEvent | React.KeyboardEvent) => {\n      mutableOnSubmenuToggle?.current?.(\n        manageOpenedSubmenus(\n          mutableOptions.current,\n          { ...(mutableOpenedSubmenus?.current || {}), [mutableOption.current.dsId]: true },\n          mutableOption.current,\n        ),\n        mutableOption.current,\n        e,\n      );\n    },\n    [mutableOnSubmenuToggle, mutableOpenedSubmenus, mutableOption, mutableOptions],\n  );\n\n  // This callback is used on submenu to close it onMouseLeave\n  const onSubmenuClose = useCallback(\n    (e: React.MouseEvent | React.KeyboardEvent) => {\n      mutableOnSubmenuToggle?.current?.(\n        manageOpenedSubmenus(\n          mutableOptions.current,\n          { ...(mutableOpenedSubmenus?.current || {}), [mutableOption.current.dsId]: false },\n          mutableOption.current,\n        ),\n        mutableOption.current,\n        e,\n      );\n      if (inputReference.current) inputReference.current.focus();\n      else listboxReference.current?.focus();\n    },\n    [inputReference, listboxReference, mutableOnSubmenuToggle, mutableOpenedSubmenus, mutableOption, mutableOptions],\n  );\n\n  // This callback is used on child dropdown to close the current opened submenu (which spawned it)\n  const onDropdownKeyDown: React.KeyboardEventHandler = useCallback(\n    (e) => {\n      if (e.code === 'ArrowLeft') {\n        onSubmenuClose(e);\n        e.preventDefault();\n      }\n    },\n    [onSubmenuClose],\n  );\n\n  return useMemo(\n    () => ({\n      onClick,\n      onSubmenuOpen,\n      onSubmenuClose,\n      onDropdownKeyDown,\n      onMouseEnter,\n      onMouseLeave,\n      onMouseDown,\n    }),\n    [onClick, onSubmenuOpen, onSubmenuClose, onDropdownKeyDown, onMouseEnter, onMouseLeave, onMouseDown],\n  );\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,aAAa,YAAY,eAAe;AACjD,SAAS,sBAAsB;AAC/B,SAAS,6BAA6B;AACtC,SAAS,4BAA4B;AAY9B,MAAM,8BAA+D,CAAC,WAAW;AACtF,QAAM;AAAA,IACJ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,WAAW,qBAAqB;AASpC,QAAM,gBAAgB,eAAe,MAAM;AAC3C,QAAM,iBAAiB,eAAe,OAAO;AAC7C,QAAM,wBAAwB,eAAe,cAAc;AAC3D,QAAM,yBAAyB,eAAe,eAAe;AAC7D,QAAM,uBAAuB,eAAe,aAAa;AACzD,QAAM,yBAAyB,eAAe,eAAe;AAG7D,QAAM,UAAU;AAAA,IACd,CAAC,MAA8C;AAC7C,QAAE,gBAAgB;AAClB,QAAE,eAAe;AACjB,YAAM,sBAAsB,EAAE,GAAG,uBAAuB,QAAQ;AAChE,0BAAoB,cAAc,QAAQ,IAAI,IAAI,CAAC,uBAAuB,QAAQ,cAAc,QAAQ,IAAI;AAC5G,UAAK,eAAe,SAA+C;AAAU;AAC7E,4BAAsB,UAAU,qBAAqB,cAAc,SAAS,CAAC;AAE7E,UAAI,EAAE,SAAS;AAAS,uBAAe,SAAS,UAAU,CAAC;AAAA,IAC7D;AAAA,IACA,CAAC,sBAAsB,eAAe,sBAAsB;AAAA,EAC9D;AAGA,QAAM,gBAAgB;AAAA,IACpB,CAAC,MAA8C;AAC7C,8BAAwB;AAAA,QACtB;AAAA,UACE,eAAe;AAAA,UACf,EAAE,GAAI,uBAAuB,WAAW,CAAC,GAAI,CAAC,cAAc,QAAQ,IAAI,GAAG,KAAK;AAAA,UAChF,cAAc;AAAA,QAChB;AAAA,QACA,cAAc;AAAA,QACd;AAAA,MACF;AAAA,IACF;AAAA,IACA,CAAC,wBAAwB,uBAAuB,eAAe,cAAc;AAAA,EAC/E;AAGA,QAAM,iBAAiB;AAAA,IACrB,CAAC,MAA8C;AAC7C,8BAAwB;AAAA,QACtB;AAAA,UACE,eAAe;AAAA,UACf,EAAE,GAAI,uBAAuB,WAAW,CAAC,GAAI,CAAC,cAAc,QAAQ,IAAI,GAAG,MAAM;AAAA,UACjF,cAAc;AAAA,QAChB;AAAA,QACA,cAAc;AAAA,QACd;AAAA,MACF;AACA,UAAI,eAAe;AAAS,uBAAe,QAAQ,MAAM;AAAA;AACpD,yBAAiB,SAAS,MAAM;AAAA,IACvC;AAAA,IACA,CAAC,gBAAgB,kBAAkB,wBAAwB,uBAAuB,eAAe,cAAc;AAAA,EACjH;AAGA,QAAM,oBAAgD;AAAA,IACpD,CAAC,MAAM;AACL,UAAI,EAAE,SAAS,aAAa;AAC1B,uBAAe,CAAC;AAChB,UAAE,eAAe;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,cAAc;AAAA,EACjB;AAEA,SAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,SAAS,eAAe,gBAAgB,mBAAmB,cAAc,cAAc,WAAW;AAAA,EACrG;AACF;",
+  "names": []
+}

package/dist/esm/hooks/useGetOptionSpecialAttributes.js

@@ -0,0 +1,17 @@
+import * as React from "react";
+import { useContext, useMemo } from "react";
+import { DSDropdownMenuContext } from "../DropdownMenuContext.js";
+const useGetOptionSpecialAttributes = () => {
+  const {
+    props: { options }
+  } = useContext(DSDropdownMenuContext);
+  const optionsShouldHavePadding = useMemo(
+    () => options.some((option) => ["single", "checkbox", "singleWithSubmenu"].includes(option.type)),
+    [options]
+  );
+  return { optionsShouldHavePadding };
+};
+export {
+  useGetOptionSpecialAttributes
+};
+//# sourceMappingURL=useGetOptionSpecialAttributes.js.map

package/dist/esm/hooks/useGetOptionSpecialAttributes.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/hooks/useGetOptionSpecialAttributes.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useContext, useMemo } from 'react';\nimport { DSDropdownMenuContext } from '../DropdownMenuContext.js';\n\nexport const useGetOptionSpecialAttributes = () => {\n  const {\n    props: { options },\n  } = useContext(DSDropdownMenuContext);\n\n  const optionsShouldHavePadding = useMemo(\n    () => options.some((option) => ['single', 'checkbox', 'singleWithSubmenu'].includes(option.type)),\n    [options],\n  );\n\n  return { optionsShouldHavePadding };\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,YAAY,eAAe;AACpC,SAAS,6BAA6B;AAE/B,MAAM,gCAAgC,MAAM;AACjD,QAAM;AAAA,IACJ,OAAO,EAAE,QAAQ;AAAA,EACnB,IAAI,WAAW,qBAAqB;AAEpC,QAAM,2BAA2B;AAAA,IAC/B,MAAM,QAAQ,KAAK,CAAC,WAAW,CAAC,UAAU,YAAY,mBAAmB,EAAE,SAAS,OAAO,IAAI,CAAC;AAAA,IAChG,CAAC,OAAO;AAAA,EACV;AAEA,SAAO,EAAE,yBAAyB;AACpC;",
+  "names": []
+}

package/dist/esm/index.js

@@ -0,0 +1,15 @@
+import * as React from "react";
+import DSDropdownMenu from "./deprecated/index.js";
+export * from "./DSDropdownMenu.js";
+export * from "./exported-related/index.js";
+import { DropdownMenuDataTestId } from "./DropdownMenuDataTestId.js";
+import { DSDropdownMenu as DSDropdownMenu2, DropdownMenuWithSchema, CustomPhoneRenderer } from "./deprecated/index.js";
+var src_default = DSDropdownMenu;
+export {
+  CustomPhoneRenderer,
+  DSDropdownMenu2 as DSDropdownMenu,
+  DropdownMenuDataTestId,
+  DropdownMenuWithSchema,
+  src_default as default
+};
+//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import DSDropdownMenu from './deprecated/index.js';\nimport type {} from '@xstyled/system';\n\nexport * from './DSDropdownMenu.js';\nexport * from './exported-related/index.js';\nexport type { DSDropdownMenuT } from './react-desc-prop-types.js';\nexport { DropdownMenuDataTestId } from './DropdownMenuDataTestId.js';\n\n// Deprecated part\nexport { DSDropdownMenu, DropdownMenuWithSchema, CustomPhoneRenderer } from './deprecated/index.js';\nexport default DSDropdownMenu;\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAO,oBAAoB;AAG3B,cAAc;AACd,cAAc;AAEd,SAAS,8BAA8B;AAGvC,SAAS,kBAAAA,iBAAgB,wBAAwB,2BAA2B;AAC5E,IAAO,cAAQ;",
+  "names": ["DSDropdownMenu"]
+}

package/dist/esm/package.json

@@ -0,0 +1,7 @@
+{
+  "type": "module",
+  "sideEffects": [
+    "*.css",
+    "*.scss"
+  ]
+}

package/dist/esm/parts/DropdownMenuContent.js

@@ -0,0 +1,70 @@
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useContext } from "react";
+import { DSPopperJS } from "@elliemae/ds-legacy-popperjs";
+import { useGetGlobalAttributes, useGetXstyledProps } from "@elliemae/ds-legacy-props-helpers";
+import { DropdownMenuDataTestId } from "../DropdownMenuDataTestId.js";
+import { StyledTriggerWrapper } from "../styled.js";
+import { DropdownMenuListBox } from "./DropdownMenuListBox.js";
+import { DSDropdownMenuContext } from "../DropdownMenuContext.js";
+import { DropdownMenuLoading } from "./DropdownMenuLoading.js";
+const DropdownMenuContent = () => {
+  const { props, triggerReferenceElement, setTriggerReferenceElement } = useContext(DSDropdownMenuContext);
+  const {
+    children,
+    isOpened,
+    onClickOutside,
+    startPlacementPreference,
+    placementOrderPreference,
+    customOffset,
+    wrapperStyles,
+    isLoading,
+    zIndex,
+    as
+  } = props;
+  const { "data-popover-label": dataPopoverLabel, ...globalAttributes } = useGetGlobalAttributes(props);
+  const { minWidth, minHeight, ...restXstyledProps } = useGetXstyledProps(props);
+  const onClickOutsideHandler = (e) => {
+    const dropdownListboxes = [
+      ...document.body.querySelectorAll(`[data-testid="${DropdownMenuDataTestId.MENU_WRAPPER}"]`)
+    ];
+    if (dropdownListboxes.every((listbox) => !listbox.contains(e.target))) {
+      onClickOutside(e);
+    }
+  };
+  return /* @__PURE__ */ jsxs(
+    StyledTriggerWrapper,
+    {
+      "data-testid": `${DropdownMenuDataTestId.TRIGGER_WRAPPER}`,
+      ref: setTriggerReferenceElement,
+      "aria-haspopup": "listbox",
+      ...wrapperStyles,
+      ...globalAttributes,
+      ...restXstyledProps,
+      as,
+      children: [
+        children,
+        triggerReferenceElement && /* @__PURE__ */ jsx(
+          DSPopperJS,
+          {
+            referenceElement: triggerReferenceElement,
+            showPopover: isOpened,
+            withoutArrow: true,
+            withoutAnimation: true,
+            customOffset,
+            onClickOutside: onClickOutsideHandler,
+            startPlacementPreference,
+            placementOrderPreference,
+            zIndex,
+            "aria-label": dataPopoverLabel || "dropdown-menu popover",
+            children: isLoading ? /* @__PURE__ */ jsx(DropdownMenuLoading, {}) : /* @__PURE__ */ jsx(DropdownMenuListBox, {})
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  DropdownMenuContent
+};
+//# sourceMappingURL=DropdownMenuContent.js.map

package/dist/esm/parts/DropdownMenuContent.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/DropdownMenuContent.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-unused-vars */\nimport React, { useContext } from 'react';\nimport { DSPopperJS } from '@elliemae/ds-legacy-popperjs';\nimport { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-legacy-props-helpers';\nimport { DropdownMenuDataTestId } from '../DropdownMenuDataTestId.js';\nimport { StyledTriggerWrapper } from '../styled.js';\nimport { DropdownMenuListBox } from './DropdownMenuListBox.js';\nimport { DSDropdownMenuContext } from '../DropdownMenuContext.js';\nimport { DropdownMenuLoading } from './DropdownMenuLoading.js';\n\nexport const DropdownMenuContent: React.ComponentType<Record<string, never>> = () => {\n  const { props, triggerReferenceElement, setTriggerReferenceElement } = useContext(DSDropdownMenuContext);\n\n  const {\n    children,\n    isOpened,\n    onClickOutside,\n    startPlacementPreference,\n    placementOrderPreference,\n    customOffset,\n    wrapperStyles,\n    isLoading,\n    zIndex,\n    as,\n  } = props;\n  const { 'data-popover-label': dataPopoverLabel, ...globalAttributes } = useGetGlobalAttributes(props);\n  // we need to exclude this props from the xstyled props because there is a conflict\n  // using submenus items with the name of the prop of ddmenu and xstyled\n  const { minWidth, minHeight, ...restXstyledProps } = useGetXstyledProps(props);\n  const onClickOutsideHandler = (e: MouseEvent | TouchEvent) => {\n    // We need to find out if the click was originated inside a child's dropdownmenu\n    const dropdownListboxes = [\n      ...document.body.querySelectorAll(`[data-testid=\"${DropdownMenuDataTestId.MENU_WRAPPER}\"]`),\n    ];\n    if (dropdownListboxes.every((listbox) => !listbox.contains(e.target as Node))) {\n      onClickOutside(e);\n    }\n  };\n\n  return (\n    <StyledTriggerWrapper\n      data-testid={`${DropdownMenuDataTestId.TRIGGER_WRAPPER}`}\n      ref={setTriggerReferenceElement}\n      aria-haspopup=\"listbox\"\n      {...wrapperStyles}\n      {...globalAttributes}\n      {...restXstyledProps}\n      as={as}\n    >\n      {children}\n      {triggerReferenceElement && (\n        <DSPopperJS\n          referenceElement={triggerReferenceElement}\n          showPopover={isOpened}\n          withoutArrow\n          withoutAnimation\n          customOffset={customOffset}\n          onClickOutside={onClickOutsideHandler}\n          startPlacementPreference={startPlacementPreference}\n          placementOrderPreference={placementOrderPreference}\n          zIndex={zIndex}\n          aria-label={(dataPopoverLabel as string) || 'dropdown-menu popover'}\n        >\n          {isLoading ? <DropdownMenuLoading /> : <DropdownMenuListBox />}\n        </DSPopperJS>\n      )}\n    </StyledTriggerWrapper>\n  );\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACwCnB,SAuBmB,KAvBnB;AAvCJ,SAAgB,kBAAkB;AAClC,SAAS,kBAAkB;AAC3B,SAAS,wBAAwB,0BAA0B;AAC3D,SAAS,8BAA8B;AACvC,SAAS,4BAA4B;AACrC,SAAS,2BAA2B;AACpC,SAAS,6BAA6B;AACtC,SAAS,2BAA2B;AAE7B,MAAM,sBAAkE,MAAM;AACnF,QAAM,EAAE,OAAO,yBAAyB,2BAA2B,IAAI,WAAW,qBAAqB;AAEvG,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,EAAE,sBAAsB,kBAAkB,GAAG,iBAAiB,IAAI,uBAAuB,KAAK;AAGpG,QAAM,EAAE,UAAU,WAAW,GAAG,iBAAiB,IAAI,mBAAmB,KAAK;AAC7E,QAAM,wBAAwB,CAAC,MAA+B;AAE5D,UAAM,oBAAoB;AAAA,MACxB,GAAG,SAAS,KAAK,iBAAiB,iBAAiB,uBAAuB,gBAAgB;AAAA,IAC5F;AACA,QAAI,kBAAkB,MAAM,CAAC,YAAY,CAAC,QAAQ,SAAS,EAAE,MAAc,CAAC,GAAG;AAC7E,qBAAe,CAAC;AAAA,IAClB;AAAA,EACF;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,GAAG,uBAAuB;AAAA,MACvC,KAAK;AAAA,MACL,iBAAc;AAAA,MACb,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACJ;AAAA,MAEC;AAAA;AAAA,QACA,2BACC;AAAA,UAAC;AAAA;AAAA,YACC,kBAAkB;AAAA,YAClB,aAAa;AAAA,YACb,cAAY;AAAA,YACZ,kBAAgB;AAAA,YAChB;AAAA,YACA,gBAAgB;AAAA,YAChB;AAAA,YACA;AAAA,YACA;AAAA,YACA,cAAa,oBAA+B;AAAA,YAE3C,sBAAY,oBAAC,uBAAoB,IAAK,oBAAC,uBAAoB;AAAA;AAAA,QAC9D;AAAA;AAAA;AAAA,EAEJ;AAEJ;",
+  "names": []
+}

package/dist/esm/parts/DropdownMenuEmptyState.js

@@ -0,0 +1,8 @@
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import { StyledEmptyStateWrapper } from "../styled.js";
+const DropdownMenuEmptyState = (props) => /* @__PURE__ */ jsx(StyledEmptyStateWrapper, { px: "xxs", py: "xxxs", role: "alert", ...props, children: "No content available" });
+export {
+  DropdownMenuEmptyState
+};
+//# sourceMappingURL=DropdownMenuEmptyState.js.map

package/dist/esm/parts/DropdownMenuEmptyState.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/DropdownMenuEmptyState.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { StyledEmptyStateWrapper } from '../styled.js';\nimport type { SizingProps } from '@elliemae/ds-legacy-system';\n\ninterface DropdownMenuEmptyStateProps {\n  minWidth: SizingProps['minWidth'];\n  maxHeight: SizingProps['maxHeight'];\n}\nexport const DropdownMenuEmptyState: React.FC<DropdownMenuEmptyStateProps> = (props) => (\n  <StyledEmptyStateWrapper px=\"xxs\" py=\"xxxs\" role=\"alert\" {...props}>\n    No content available\n  </StyledEmptyStateWrapper>\n);\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACSrB;AARF,SAAS,+BAA+B;AAOjC,MAAM,yBAAgE,CAAC,UAC5E,oBAAC,2BAAwB,IAAG,OAAM,IAAG,QAAO,MAAK,SAAS,GAAG,OAAO,kCAEpE;",
+  "names": []
+}