@elliemae/ds-menu-button 3.45.0-rc.1 → 3.45.0-rc.3

package/dist/cjs/parts/DSOpinionatedButton/react-desc-prop-types.js

@@ -0,0 +1,53 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var react_desc_prop_types_exports = {};
+__export(react_desc_prop_types_exports, {
+  DSOpinionatedButtonPropTypes: () => DSOpinionatedButtonPropTypes,
+  DSOpinionatedButtonPropTypesSchema: () => DSOpinionatedButtonPropTypesSchema,
+  defaultProps: () => defaultProps
+});
+module.exports = __toCommonJS(react_desc_prop_types_exports);
+var React = __toESM(require("react"));
+var import_ds_button_v2 = require("@elliemae/ds-button-v2");
+var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
+var import_react_desc_prop_types = require("../../react-desc-prop-types.js");
+var import_constants = require("./constants/index.js");
+const defaultProps = {
+  ...import_ds_button_v2.DSButtonV3DefaultProps
+};
+const DSOpinionatedButtonPropTypes = {
+  ...(0, import_ds_props_helpers.getPropsPerSlotPropTypes)(import_constants.DSOpinionatedButtonName, import_constants.OPINIONATED_BUTTON_SLOTS),
+  ...import_ds_button_v2.DSButtonV3PropTypes,
+  menuSpecificProps: import_ds_props_helpers.PropTypes.shape(import_react_desc_prop_types.DSMenuSpecificPropTypes).description("Props for the main flyout menu").isRequired,
+  innerRef: import_ds_props_helpers.PropTypes.func.description(
+    "Ref callback for the button, if not provided how is the flyout menu being positioned?"
+  ).isRequired
+};
+const DSOpinionatedButtonPropTypesSchema = DSOpinionatedButtonPropTypes;
+//# sourceMappingURL=react-desc-prop-types.js.map

package/dist/cjs/parts/DSOpinionatedButton/react-desc-prop-types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/parts/DSOpinionatedButton/react-desc-prop-types.ts", "../../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["/* eslint-disable @typescript-eslint/no-empty-interface */\nimport React from 'react';\nimport { DSButtonV3DefaultProps, DSButtonV3PropTypes } from '@elliemae/ds-button-v2';\nimport type { DSPropTypesSchema, ValidationMap } from '@elliemae/ds-props-helpers';\nimport { getPropsPerSlotPropTypes, PropTypes } from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { type DSMenuButtonT, DSMenuSpecificPropTypes } from '../../react-desc-prop-types.js';\nimport { DSOpinionatedButtonName, OPINIONATED_BUTTON_SLOTS } from './constants/index.js';\n\nexport declare namespace DSOpinionatedButtonT {\n  /*\n   * everything that is specifically added in this namespace declaration and is not part of the original component\n   * is because the original component is an \"opinionated widget\" that offloads a chunk of responsibilities from dev to dimsum\n   * as such, the widget generates those interfaces,\n   *  but the app developer is not supposed to know about them\n   *    untill they go atomic composition (this namespace)\n   */\n  export interface RequiredProps extends DSMenuButtonT.ButtonInheritedRequiredProps {\n    menuSpecificProps: DSMenuButtonT.MenuSpecificProps;\n  }\n\n  export interface DefaultProps extends DSMenuButtonT.ButtonInheiredDefaultProps {}\n\n  export interface OptionalProps\n    extends TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSOpinionatedButtonName, typeof OPINIONATED_BUTTON_SLOTS>,\n      DSMenuButtonT.ButtonInheritedOptionalProps {}\n\n  export interface Props\n    extends RequiredProps,\n      Partial<DefaultProps>,\n      OptionalProps,\n      // this is where global/xstyled props are inherited from DSButtonV3\n      DSMenuButtonT.ButtonInheritedProps {\n    innerRef: React.RefCallback<HTMLButtonElement>;\n  }\n\n  export interface InternalProps\n    extends RequiredProps,\n      DefaultProps,\n      OptionalProps,\n      // this is where global/xstyled props are inherited from DSButtonV3\n      DSMenuButtonT.ButtonInheritedInternalProps {\n    innerRef: React.RefCallback<HTMLButtonElement>;\n  }\n}\n\nexport const defaultProps: DSOpinionatedButtonT.DefaultProps = {\n  ...DSButtonV3DefaultProps,\n};\n\nexport const DSOpinionatedButtonPropTypes: DSPropTypesSchema<DSOpinionatedButtonT.Props> = {\n  ...getPropsPerSlotPropTypes(DSOpinionatedButtonName, OPINIONATED_BUTTON_SLOTS),\n  ...DSButtonV3PropTypes,\n  menuSpecificProps: PropTypes.shape(DSMenuSpecificPropTypes).description('Props for the main flyout menu').isRequired,\n  innerRef: PropTypes.func.description(\n    'Ref callback for the button, if not provided how is the flyout menu being positioned?',\n  ).isRequired,\n};\n\nexport const DSOpinionatedButtonPropTypesSchema =\n  DSOpinionatedButtonPropTypes as unknown as ValidationMap<DSOpinionatedButtonT.Props>;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,0BAA4D;AAE5D,8BAAoD;AAEpD,mCAA4D;AAC5D,uBAAkE;AAuC3D,MAAM,eAAkD;AAAA,EAC7D,GAAG;AACL;AAEO,MAAM,+BAA8E;AAAA,EACzF,OAAG,kDAAyB,0CAAyB,yCAAwB;AAAA,EAC7E,GAAG;AAAA,EACH,mBAAmB,kCAAU,MAAM,oDAAuB,EAAE,YAAY,gCAAgC,EAAE;AAAA,EAC1G,UAAU,kCAAU,KAAK;AAAA,IACvB;AAAA,EACF,EAAE;AACJ;AAEO,MAAM,qCACX;",
+  "names": []
+}

package/dist/cjs/react-desc-prop-types.js

@@ -28,37 +28,73 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var react_desc_prop_types_exports = {};
 __export(react_desc_prop_types_exports, {
-  DSDMenuButtonPropTypes: () => DSDMenuButtonPropTypes,
-  DSDMenuButtonPropTypesSchema: () => DSDMenuButtonPropTypesSchema,
+  DSMenuButtonPropTypes: () => DSMenuButtonPropTypes,
+  DSMenuButtonPropTypesSchema: () => DSMenuButtonPropTypesSchema,
+  DSMenuSpecificPropTypes: () => DSMenuSpecificPropTypes,
+  MenuBehaviouralLayerPropTypes: () => MenuBehaviouralLayerPropTypes,
   defaultProps: () => defaultProps
 });
 module.exports = __toCommonJS(react_desc_prop_types_exports);
 var React = __toESM(require("react"));
 var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
+var import_ds_button_v2 = require("@elliemae/ds-button-v2");
+var import_constants = require("./constants/index.js");
 const defaultProps = {
-  selectedKeys: [],
-  onSelectionChange: () => {
-  }
+  selectedOptions: {},
+  onClickOutside: () => null,
+  onOptionClick: () => null,
+  openedSubmenus: {},
+  onSubmenuToggle: () => null,
+  isLoading: false,
+  isSkeleton: false
+};
+const MenuBehaviouralLayerPropTypes = {
+  selectedItems: import_ds_props_helpers.PropTypes.arrayOf(import_ds_props_helpers.PropTypes.object).description(
+    "an array of tree-nodes that have to be marked as selected in the GUI"
+  ).isRequired,
+  onItemSelected: import_ds_props_helpers.PropTypes.func.description("IoC function in charge of handling the selection of a menu item").signature(`((
+      newSelection: DSMenuButtonT.PseudoFocusableMenuNodes[],
+      metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },
+    ) => void)`).isRequired,
+  onActivateItem: import_ds_props_helpers.PropTypes.func.description(
+    "IoC function in charge of handling the activation (NOT INVOKED ON SELECTION) of a menu item"
+  ).signature(`((
+      itemNode: DSMenuButtonT.PseudoFocusableMenuNodes,
+      metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },
+    ) => void)`).isRequired,
+  onOpen: import_ds_props_helpers.PropTypes.func.description("function triggered when the widget opens the menu").signature(`(()=>void)`),
+  onClose: import_ds_props_helpers.PropTypes.func.description("function triggered when the widget closes the menu").signature(`(()=>void)`),
+  onDisplayedSubmenuChange: import_ds_props_helpers.PropTypes.func.description("function triggered when the widget's closes or opens a submenu").signature(`((
+      newOpenedItems: DSMenuButtonT.PseudoFocusableMenuNodes[],
+      metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },
+    ) => void)`)
+};
+const DSMenuSpecificPropTypes = {
+  ItemRenderer: import_ds_props_helpers.PropTypes.node.description("Component to be used to render the items"),
+  onClickOutside: import_ds_props_helpers.PropTypes.func.description("Callback executed when you click outside the dropdown menu, or press the Esc key").defaultValue(() => null),
+  selectedOptions: import_ds_props_helpers.PropTypes.object.description(
+    "Object with the ids of the options as keys, and booleans as keys. Represents the state of the current selection in the dropdown menu"
+  ).defaultValue({}),
+  onOptionClick: import_ds_props_helpers.PropTypes.func.description(
+    "Callback triggered when an item is clicked or pressed. We provide the next selected options, the clicked option and the event, in that order"
+  ).defaultValue(() => null),
+  openedSubmenus: import_ds_props_helpers.PropTypes.object.description(
+    "Object with the ids of the submenus as keys, and booleans as keys. Represents the state of the current opened submenus"
+  ).defaultValue({}),
+  onSubmenuToggle: import_ds_props_helpers.PropTypes.func.description("Callback triggered when a submenu is opened or closed.").signature(
+    "((nextOpenedSubmenus: Record<string, boolean>, submenu: Item, e: React.MouseEvent | React.KeyboardEvent) => void)"
+  ).defaultValue(() => null),
+  isLoading: import_ds_props_helpers.PropTypes.bool.description("Whether the flyout menu should render the loading indicator").defaultValue(false),
+  isSkeleton: import_ds_props_helpers.PropTypes.bool.description("Whether the flyout menu should render the skeleton").defaultValue(false)
 };
-const DSDMenuButtonPropTypes = {
-  ...import_ds_props_helpers.globalAttributesPropTypes,
-  ...import_ds_props_helpers.xstyledPropTypes,
-  items: import_ds_props_helpers.PropTypes.arrayOf(
-    import_ds_props_helpers.PropTypes.shape({
-      dsId: import_ds_props_helpers.PropTypes.string.isRequired,
-      label: import_ds_props_helpers.PropTypes.string,
-      type: import_ds_props_helpers.PropTypes.oneOf(["separator", "section", "single", "multiple", void 0])
-    })
-  ).description("Array of items to be displayed in the dropdown").isRequired,
-  TriggerElement: import_ds_props_helpers.PropTypes.node.description("Component to be used as the trigger element").isRequired,
-  selectedKeys: import_ds_props_helpers.PropTypes.arrayOf(import_ds_props_helpers.PropTypes.string).description("Array of selected keys"),
-  onSelectionChange: import_ds_props_helpers.PropTypes.func.description("Function to be called when selection changes"),
-  triggerElementProps: import_ds_props_helpers.PropTypes.object.description("Props to be passed to the trigger element"),
-  selectionMode: import_ds_props_helpers.PropTypes.oneOf(["single", "multiple"]).description("Selection mode"),
-  menuMinWidth: import_ds_props_helpers.PropTypes.oneOfType([import_ds_props_helpers.PropTypes.string, import_ds_props_helpers.PropTypes.number]).description(
-    "Minimum width of the main dropdown"
-  ),
-  ItemRenderer: import_ds_props_helpers.PropTypes.node.description("Component to be used to render the items")
+const DSMenuButtonPropTypes = {
+  options: import_ds_props_helpers.PropTypes.oneOfType([import_ds_props_helpers.PropTypes.array, import_ds_props_helpers.PropTypes.object]).description(
+    "Array of options to display in the menu or a DSTree node to build branches from"
+  ).isRequired,
+  ...import_ds_button_v2.DSButtonV3PropTypes,
+  ...MenuBehaviouralLayerPropTypes,
+  ...DSMenuSpecificPropTypes,
+  ...(0, import_ds_props_helpers.getPropsPerSlotPropTypes)(import_constants.DSMenuButtonName, import_constants.MENU_BUTTON_SLOTS)
 };
-const DSDMenuButtonPropTypesSchema = DSDMenuButtonPropTypes;
+const DSMenuButtonPropTypesSchema = DSMenuButtonPropTypes;
 //# sourceMappingURL=react-desc-prop-types.js.map

package/dist/cjs/react-desc-prop-types.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/react-desc-prop-types.ts", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable @typescript-eslint/no-empty-interface */\nimport type { GlobalAttributesT, XstyledProps, DSPropTypesSchema } from '@elliemae/ds-props-helpers';\nimport { PropTypes, globalAttributesPropTypes, xstyledPropTypes } from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type { WeakValidationMap } from 'react';\n\nexport declare namespace MenuButtonT {\n  export interface RequiredProps<T> {\n    items: Item[];\n    TriggerElement: React.ComponentType<TriggerElementProps<T>>;\n  }\n\n  export interface DefaultProps {\n    selectedKeys: string[];\n    onSelectionChange: (selectedKeys: string[], parentId: string, item: MenuButtonT.Item) => void;\n  }\n\n  export interface OptionalProps<T extends object> {\n    triggerElementProps?: T;\n    selectionMode?: 'single' | 'multiple';\n    menuMinWidth?: string | number;\n    ItemRenderer?: ItemRendererT;\n  }\n\n  export interface Props<T extends object = object>\n    extends Partial<DefaultProps>,\n      OptionalProps<T>,\n      Omit<GlobalAttributesT<HTMLButtonElement>, keyof OptionalProps<T> | keyof XstyledProps>,\n      XstyledProps,\n      RequiredProps<T> {}\n\n  export interface InternalProps<T extends object = object>\n    extends DefaultProps,\n      OptionalProps<T>,\n      Omit<GlobalAttributesT<HTMLButtonElement>, keyof OptionalProps<T> | keyof XstyledProps>,\n      XstyledProps,\n      RequiredProps<T> {}\n\n  export type Item = {\n    dsId: string;\n    label: string;\n    type?: 'separator' | 'section';\n    childrens?: Item[];\n    subitems?: Item[];\n    selectionMode?: 'single' | 'multiple';\n    minWidth?: string | number;\n    disabled?: boolean;\n  };\n\n  export interface TriggerElementProps<T2> {\n    isOpen: boolean;\n    innerRef: TypescriptHelpersT.AnyRef<HTMLButtonElement | null>;\n    setIsOpen: React.Dispatch<React.SetStateAction<boolean>>;\n    attributes: {\n      'aria-haspopup'?: boolean | 'true' | 'false' | 'dialog' | 'grid' | 'listbox' | 'menu' | 'tree';\n      'aria-expanded': boolean;\n    };\n    listeners: {\n      onKeyDown: (e: React.KeyboardEvent) => void;\n    };\n    triggerElementProps: T2;\n  }\n\n  export type ItemRendererT = React.ComponentType<{ item: Item; isSelected: boolean }>;\n}\n\nexport const defaultProps: MenuButtonT.DefaultProps = {\n  selectedKeys: [],\n  onSelectionChange: () => {},\n};\n\nexport const DSDMenuButtonPropTypes: DSPropTypesSchema<MenuButtonT.Props<object>> = {\n  ...globalAttributesPropTypes,\n  ...xstyledPropTypes,\n  items: PropTypes.arrayOf(\n    PropTypes.shape({\n      dsId: PropTypes.string.isRequired,\n      label: PropTypes.string,\n      type: PropTypes.oneOf(['separator', 'section', 'single', 'multiple', undefined]),\n    }),\n  ).description('Array of items to be displayed in the dropdown').isRequired,\n  TriggerElement: PropTypes.node.description('Component to be used as the trigger element').isRequired,\n  selectedKeys: PropTypes.arrayOf(PropTypes.string).description('Array of selected keys'),\n  onSelectionChange: PropTypes.func.description('Function to be called when selection changes'),\n  triggerElementProps: PropTypes.object.description('Props to be passed to the trigger element'),\n  selectionMode: PropTypes.oneOf(['single', 'multiple']).description('Selection mode'),\n  menuMinWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description(\n    'Minimum width of the main dropdown',\n  ),\n  ItemRenderer: PropTypes.node.description('Component to be used to render the items'),\n};\n\nexport const DSDMenuButtonPropTypesSchema = DSDMenuButtonPropTypes as unknown as WeakValidationMap<\n  MenuButtonT.Props<object>\n>;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAAuE;AAgEhE,MAAM,eAAyC;AAAA,EACpD,cAAc,CAAC;AAAA,EACf,mBAAmB,MAAM;AAAA,EAAC;AAC5B;AAEO,MAAM,yBAAuE;AAAA,EAClF,GAAG;AAAA,EACH,GAAG;AAAA,EACH,OAAO,kCAAU;AAAA,IACf,kCAAU,MAAM;AAAA,MACd,MAAM,kCAAU,OAAO;AAAA,MACvB,OAAO,kCAAU;AAAA,MACjB,MAAM,kCAAU,MAAM,CAAC,aAAa,WAAW,UAAU,YAAY,MAAS,CAAC;AAAA,IACjF,CAAC;AAAA,EACH,EAAE,YAAY,gDAAgD,EAAE;AAAA,EAChE,gBAAgB,kCAAU,KAAK,YAAY,6CAA6C,EAAE;AAAA,EAC1F,cAAc,kCAAU,QAAQ,kCAAU,MAAM,EAAE,YAAY,wBAAwB;AAAA,EACtF,mBAAmB,kCAAU,KAAK,YAAY,8CAA8C;AAAA,EAC5F,qBAAqB,kCAAU,OAAO,YAAY,2CAA2C;AAAA,EAC7F,eAAe,kCAAU,MAAM,CAAC,UAAU,UAAU,CAAC,EAAE,YAAY,gBAAgB;AAAA,EACnF,cAAc,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,MAAM,CAAC,EAAE;AAAA,IACtE;AAAA,EACF;AAAA,EACA,cAAc,kCAAU,KAAK,YAAY,0CAA0C;AACrF;AAEO,MAAM,+BAA+B;",
+  "sourcesContent": ["/* eslint-disable max-lines */\n/* eslint-disable @typescript-eslint/no-empty-interface */\nimport { PropTypes, getPropsPerSlotPropTypes } from '@elliemae/ds-props-helpers';\nimport { DSButtonV3PropTypes } from '@elliemae/ds-button-v2';\nimport type { DSPropTypesSchema, ValidationMap } from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type { DSButtonV3T } from '@elliemae/ds-button-v2';\nimport type { UseDSTreeT } from '@elliemae/ds-tree-model';\n\nimport { DSMenuButtonName, MENU_BUTTON_SLOTS, type MENU_ITEMS_TYPES } from './constants/index.js';\nexport declare namespace DSMenuButtonT {\n  /* *******************************************************\n   * YURI's NOTE:\n   *\n   * This polymorphic interface \"looks similar\" between the diffent types\n   *  but it's actually different upon closer inspection\n   *\n   * If you are smarter then me, you can probably find a way to make this more DRY\n   *  but I prefeer AHA (Avoid Hasty Abstractions) that gives me an easier to mantain code\n   *   ESPECIALLY when the types are so similar but not the same & in typescript (polymorphism is hard in TS)\n   *\n   * So I'm going to keep them separate and explicit\n   *  key difference is what's required to exist and what is required to explicitly NOT exist\n   *\n   * If someone's review this and make this DRY, I'm NOT going to mantain this code moving forward\n   *   whoever makes this TS DRY will be responsible for it and own it.\n   ******************************************************* */\n  export interface RootItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n    type: 'ROOT_ITEM'; // HARDCODED BECAUSE THIS IS NOT A MENU ITEM, IT'S EXCLUSIVE TO THE ROOT NODE\n    dsId: string;\n    label?: undefined;\n    secondaryLabel?: undefined;\n    leftDecoration?: undefined;\n    minWidth?: undefined;\n    disabled?: undefined;\n    onClick?: undefined;\n    onKeyDown?: undefined;\n  }\n  export interface SeparatorItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n    type: (typeof MENU_ITEMS_TYPES)['SEPARATOR'];\n    dsId: string;\n    label?: undefined;\n    secondaryLabel?: undefined;\n    leftDecoration?: undefined;\n    minWidth?: undefined;\n    disabled?: undefined;\n    onClick?: undefined;\n    onKeyDown?: undefined;\n  }\n  export interface ActivableItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n    type: (typeof MENU_ITEMS_TYPES)['ACTIVABLE_ITEM'];\n    dsId: string;\n    label: string;\n    secondaryLabel?: string;\n    leftDecoration?: React.ComponentType;\n    minWidth?: string | number;\n    disabled?: boolean;\n    onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n    onKeyDown?: (e: React.KeyboardEvent) => null;\n  }\n  export interface ActionableWithSubmenuItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n    type: (typeof MENU_ITEMS_TYPES)['ACTIVABLE_WITH_SUBMENU_ITEM'];\n    dsId: string;\n    label: string;\n    secondaryLabel?: string;\n    leftDecoration?: React.ComponentType;\n    minWidth?: string | number;\n    disabled?: boolean;\n    onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n    onKeyDown?: (e: React.KeyboardEvent) => null;\n  }\n  export interface SkeletonItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n    type: (typeof MENU_ITEMS_TYPES)['SKELETON_ITEM'];\n    dsId: string;\n    minWidth?: string | number;\n    label?: undefined;\n    secondaryLabel?: undefined;\n    leftDecoration?: undefined;\n    disabled?: undefined;\n    onClick?: undefined;\n    onKeyDown?: undefined;\n  }\n  export interface MultipleSelectItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n    type: (typeof MENU_ITEMS_TYPES)['MULTIPLE_SELECT_ITEM'];\n    dsId: string;\n    label: string;\n    secondaryLabel?: string;\n    leftDecoration?: React.ComponentType;\n    minWidth?: string | number;\n    disabled?: boolean;\n    onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n    onKeyDown?: (e: React.KeyboardEvent) => null;\n  }\n\n  export interface MultiSelectWithSubmenuItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n    type: (typeof MENU_ITEMS_TYPES)['MULTIPLE_SELECT_WITH_SUBMENU_ITEM'];\n    dsId: string;\n    label: string;\n    secondaryLabel?: string;\n    leftDecoration?: React.ComponentType;\n    minWidth?: string | number;\n    disabled?: boolean;\n    onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n    onKeyDown?: (e: React.KeyboardEvent) => null;\n  }\n  export interface WithSubmenuItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n    type: (typeof MENU_ITEMS_TYPES)['WITH_SUBMENU_ITEM'];\n    dsId: string;\n    label: string;\n    secondaryLabel?: string;\n    leftDecoration?: React.ComponentType;\n    minWidth?: string | number;\n    disabled?: boolean;\n    onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n    onKeyDown?: (e: React.KeyboardEvent) => null;\n  }\n\n  /* ***********************************************************************\n   * Single select items MUST always have a \"group\" as parent\n   *   Failing the condition fails ADA announcements (role='group' -> role='menuitemradio')\n   *********************************************************************** */\n  export interface SingleSelectItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n    type: (typeof MENU_ITEMS_TYPES)['SINGLE_SELECT_ITEM'];\n    dsId: string;\n    label: string;\n    secondaryLabel?: string;\n    leftDecoration?: React.ComponentType;\n    minWidth?: string | number;\n    disabled?: boolean;\n    onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n    onKeyDown?: (e: React.KeyboardEvent) => null;\n  }\n  export interface SingleSelectWithSubmenuItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n    type: (typeof MENU_ITEMS_TYPES)['SINGLE_SELECT_WITH_SUBMENU_ITEM'];\n    dsId: string;\n    label: string;\n    secondaryLabel?: string;\n    leftDecoration?: React.ComponentType;\n    minWidth?: string | number;\n    disabled?: boolean;\n    onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n    onKeyDown?: (e: React.KeyboardEvent) => null;\n  }\n\n  export interface GroupItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n    type: (typeof MENU_ITEMS_TYPES)['GROUP'];\n    dsId: string;\n    label?: string; // if present, add a title to the group\n    leftDecoration?: React.ComponentType; // if present, a label must also be present\n    minWidth?: string | number;\n  }\n\n  export type MenuItemInterface =\n    | SeparatorItem\n    | ActivableItem\n    | ActionableWithSubmenuItem\n    | SkeletonItem\n    | MultipleSelectItem\n    | MultiSelectWithSubmenuItem\n    | WithSubmenuItem\n    | GroupItem;\n\n  export type PseudoFocusableItemInterface =\n    | ActivableItem\n    | ActionableWithSubmenuItem\n    | SkeletonItem\n    | MultipleSelectItem\n    | MultiSelectWithSubmenuItem\n    | WithSubmenuItem\n    | SingleSelectItem\n    | SingleSelectWithSubmenuItem;\n\n  // Define MenuNode types directly\n  export type MenuNodeRootItem = UseDSTreeT.TreeNode<RootItem>; // MenuNodesAllowedToHaveChildren is the only expected reference to this type\n  export type MenuNodeSeparatorItem = UseDSTreeT.TreeNode<SeparatorItem>;\n  export type MenuNodeActivableItem = UseDSTreeT.TreeNode<ActivableItem>;\n  export type MenuNodeActivableWithSubmenuItem = UseDSTreeT.TreeNode<ActionableWithSubmenuItem>;\n  export type MenuNodeSkeletonItem = UseDSTreeT.TreeNode<SkeletonItem>;\n  export type MenuNodeMultipleSelectItem = UseDSTreeT.TreeNode<MultipleSelectItem>;\n  export type MenuNodeMultipleSelectWithSubmenuItem = UseDSTreeT.TreeNode<MultiSelectWithSubmenuItem>;\n  export type MenuNodeWithSubmenuItem = UseDSTreeT.TreeNode<WithSubmenuItem>;\n  export type MenuNodeSingleSelectItem = UseDSTreeT.TreeNode<SingleSelectItem>;\n  export type MenuNodeSingleSelectWithSubmenuItem = UseDSTreeT.TreeNode<SingleSelectWithSubmenuItem>;\n  export type MenuNodeGroupItem = UseDSTreeT.TreeNode<GroupItem>;\n\n  // in the future we want to better describe the polymorphic nature of the MenuNode\n  //  having each type be able to have it's own \"subitems\" type that isn't necessarily the same as the parent\n  //  but currenctly the DS tree model typescript definitions don't support this\n  //  will be addresssed via PUI-XXXX\n  export type MenuNode =\n    // DO NOT ADD MenuNodeRootItem HERE, WILL BREAK THE SUBTREES\n    | MenuNodeSeparatorItem\n    | MenuNodeActivableItem\n    | MenuNodeActivableWithSubmenuItem\n    | MenuNodeSkeletonItem\n    | MenuNodeMultipleSelectItem\n    | MenuNodeMultipleSelectWithSubmenuItem\n    | MenuNodeWithSubmenuItem\n    | MenuNodeSingleSelectItem\n    | MenuNodeSingleSelectWithSubmenuItem\n    | MenuNodeGroupItem;\n\n  export type PseudoFocusableMenuNodes =\n    | MenuNodeActivableItem\n    | MenuNodeActivableWithSubmenuItem\n    | MenuNodeSkeletonItem\n    | MenuNodeSingleSelectItem\n    | MenuNodeMultipleSelectItem\n    | MenuNodeMultipleSelectWithSubmenuItem\n    | MenuNodeWithSubmenuItem\n    | MenuNodeSingleSelectWithSubmenuItem;\n\n  export type MenuNodesAllowedToHaveChildren =\n    | MenuNodeRootItem\n    | MenuNodeWithSubmenuItem\n    | MenuNodeGroupItem\n    | MenuNodeActivableWithSubmenuItem\n    | MenuNodeMultipleSelectWithSubmenuItem\n    | MenuNodeSingleSelectWithSubmenuItem;\n\n  export type ItemRendererT = React.ComponentType<{ itemNode: MenuNode }>;\n\n  export type SelectionableMenuNodes =\n    | DSMenuButtonT.MenuNodeMultipleSelectItem\n    | DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem\n    | DSMenuButtonT.MenuNodeSingleSelectItem\n    | DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem;\n\n  export type MultipleSelectionableMenuNodes =\n    | DSMenuButtonT.MenuNodeMultipleSelectItem\n    | DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem;\n\n  export type SingleSelectionableMenuNodes =\n    | DSMenuButtonT.MenuNodeSingleSelectItem\n    | DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem;\n\n  export type WithSubmenuMenuNodes =\n    | DSMenuButtonT.MenuNodeWithSubmenuItem\n    | DSMenuButtonT.MenuNodeActivableWithSubmenuItem\n    | DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem\n    | DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem;\n\n  export type SelectionablesWithSubmenuMenuNodes =\n    | DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem\n    | DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem;\n  /* *******************************************************\n   * From official source definition\n   *\n   * Menu Button Pattern\n   *  About This Pattern:\n   *    A menu button is a button\n   *      that opens a menu\n   *         (as described in the Menu and Menubar Pattern).\n   *\n   * Since the menu button is a button, it inherits all the props from the Button component.\n   * Since the menu button MUST have a menu, it also have a set of specific props used to handle the menu.\n   * Because we build with atomic composition in mind, the \"logic layer\" is separated and has a yet another set of props.\n   *\n   * This is effectively an OOP \"extension\" of the Button component,\n   *  so it has the same props,\n   *  BUT also a few more to handle the specific behavior of the menu.\n   ******************************************************* */\n\n  export interface MenuBehaviouralLayerRequiredProps {\n    selectedItems: SelectionableMenuNodes[];\n    onItemSelected: (\n      newSelection: SelectionableMenuNodes[],\n      metainfo: { itemNode: DSMenuButtonT.SelectionableMenuNodes; event?: React.SyntheticEvent },\n    ) => void | TypescriptHelpersT.StateSetter<DSMenuButtonT.SelectionableMenuNodes[]>;\n    onActivateItem: (\n      itemNode: DSMenuButtonT.PseudoFocusableMenuNodes,\n      metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },\n    ) => void;\n  }\n\n  export interface MenuSpecificRequiredProps {}\n  /* *******************************************************\n   * Required Props + Inherited Required Props\n   *  - We inherit the required props from the button\n   *  - We add the required props for the menu\n   *\n   *  - if a collision occurs, the menu specific are meant to be the most important and specific ones\n   ******************************************************* */\n  export interface ButtonInheritedRequiredProps\n    // by using Omit, we remove the keys that are present in the MenuSpecificRequiredProps to ensure collision are handled as expected\n    extends Omit<DSButtonV3T.RequiredProps, keyof MenuSpecificRequiredProps> {}\n  // the final RequiredProps will be the combination of the two with proper collision handling\n  export interface RequiredProps\n    extends MenuSpecificRequiredProps,\n      ButtonInheritedRequiredProps,\n      MenuBehaviouralLayerRequiredProps {\n    // it's the Menu Widget sole responsibility to receive the options and convert them to a tree\n    options: MenuItemInterface[] | MenuNode;\n  }\n\n  /* *******************************************************\n   * Since the menu button is a button, it inherits all the props from the Button component.\n   * Since the menu button MUST have a menu, it also have a set of specific props used to handle the menu.\n   * Because we build with atomic composition in mind, the \"logic layer\" is separated and has a yet another set of props.\n   ******************************************************* */\n  export interface MenuBehaviouralLayerDefaultProps {}\n  export interface MenuSpecifiDefaultProps {\n    onClickOutside: (e: MouseEvent | React.KeyboardEvent | TouchEvent) => void;\n    onOptionClick: (\n      nextSelectedOptions: Record<string, boolean>,\n      clickedOption: MenuItemInterface,\n      e: React.MouseEvent | React.KeyboardEvent,\n    ) => void;\n    openedSubmenus: Record<string, boolean>;\n    onSubmenuToggle: (\n      nextOpenedSubmenus: Record<string, boolean>,\n      submenu: MenuItemInterface,\n      e: React.MouseEvent | React.KeyboardEvent,\n    ) => void;\n    isLoading: boolean;\n    isSkeleton: boolean;\n    selectedOptions: Record<string, boolean>;\n  }\n\n  /* *******************************************************\n   * Default Props + Inherited Default Props\n   *  - We inherit the default props from the button\n   *  - We add the default props for the menu\n   *\n   * - if a collision occurs, the menu specific are meant to be the most important and specific ones\n   ******************************************************* */\n  // by using Omit, we remove the keys that are present in the MenuSpecificDefaultProps to ensure collision are handled as expected\n  export interface ButtonInheiredDefaultProps extends Omit<DSButtonV3T.DefaultProps, keyof MenuSpecifiDefaultProps> {}\n  // the final DefaultProps will be the combination of the two with proper collision handling\n  export interface DefaultProps\n    extends MenuSpecifiDefaultProps,\n      ButtonInheiredDefaultProps,\n      MenuBehaviouralLayerDefaultProps {}\n\n  /* *******************************************************\n   * Since the menu button is a button, it inherits all the props from the Button component.\n   * Since the menu button MUST have a menu, it also have a set of specific props used to handle the menu.\n   * Because we build with atomic composition in mind, the \"logic layer\" is separated and has a yet another set of props.\n   ******************************************************* */\n  export interface MenuBehaviouralLayerOptionalProps {\n    onOpen?: () => void;\n    onClose?: () => void;\n    onDisplayedSubmenuChange?: (\n      newOpenedItems: DSMenuButtonT.WithSubmenuMenuNodes[],\n      metainfo: {\n        itemNode: DSMenuButtonT.PseudoFocusableMenuNodes | null;\n        event?: React.SyntheticEvent | FocusEvent | TouchEvent;\n      },\n    ) => void | TypescriptHelpersT.StateSetter<DSMenuButtonT.WithSubmenuMenuNodes[]>;\n  }\n  export interface MenuSpecificOptionalProps {\n    ItemRenderer?: ItemRendererT;\n  }\n  /* *******************************************************\n   * Optional Props + Inherited Optional Props\n   *  - We inherit the optional props from the button\n   * - We add the optional props for the menu\n   *\n   * - if a collision occurs, the menu specific are meant to be the most important and specific ones\n   ******************************************************* */\n  export interface ButtonInheritedOptionalProps\n    // by using Omit, we remove the keys that are present in the MenuSpecificOptionalProps to ensure collision are handled as expected\n    extends Omit<DSButtonV3T.OptionalProps, keyof MenuSpecificOptionalProps> {}\n  export interface OptionalProps\n    extends MenuSpecificOptionalProps,\n      ButtonInheritedOptionalProps,\n      MenuBehaviouralLayerOptionalProps,\n      TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSMenuButtonName, typeof MENU_BUTTON_SLOTS> {}\n\n  /* *******************************************************\n   * Since the menu button is a button, it inherits all the props from the Button component.\n   * Since the menu button MUST have a menu, it also have a set of specific props used to handle the menu.\n   * Because we build with atomic composition in mind, the \"logic layer\" is separated and has a yet another set of props.\n   ******************************************************* */\n  export interface MenuBehaviouralLayerProps\n    extends Partial<MenuBehaviouralLayerDefaultProps>,\n      MenuBehaviouralLayerOptionalProps,\n      MenuBehaviouralLayerRequiredProps {}\n  export interface MenuSpecificProps\n    extends Partial<MenuSpecifiDefaultProps>,\n      MenuSpecificOptionalProps,\n      MenuSpecificRequiredProps {}\n  /* *******************************************************\n   * Props + Inherited Props\n   *  - We inherit the props from the button\n   *  - We add the props for the menu\n   *\n   * - if a collision occurs, the menu specific are meant to be the most important and specific ones\n   ******************************************************* */\n  // by using Omit, we remove the keys that are present in the MenuSpecificProps to ensure collision are handled as expected\n  //  THIS IS ALSO INHERITING THE GLOBAL ATTRIBUTES & XSTYLED PROPS FROM THE BUTTON!!!\n  export interface ButtonInheritedProps extends Omit<DSButtonV3T.Props, keyof MenuSpecificProps> {}\n\n  export interface Props extends RequiredProps, Partial<DefaultProps>, OptionalProps {}\n\n  /* *******************************************************\n   * Since the menu button is a button, it inherits all the props from the Button component.\n   * Since the menu button MUST have a menu, it also have a set of specific props used to handle the menu.\n   * Because we build with atomic composition in mind, the \"logic layer\" is separated and has a yet another set of props.\n   ******************************************************* */\n  export interface MenuBehaviouralLayerInternalProps\n    extends MenuBehaviouralLayerDefaultProps,\n      MenuBehaviouralLayerOptionalProps,\n      MenuBehaviouralLayerRequiredProps {}\n  export interface MenuSpecificInternalProps\n    extends MenuSpecifiDefaultProps,\n      MenuSpecificOptionalProps,\n      MenuSpecificRequiredProps {}\n\n  /* *******************************************************\n   * Internal Props\n   *  - We inherit the internal props from the button\n   *  - We add the internal props for the menu\n   *\n   * - if a collision occurs, the menu specific are meant to be the most important and specific ones\n   ******************************************************* */\n  export interface ButtonInheritedInternalProps\n    // by using Omit, we remove the keys that are present in the MenuSpecificInternalProps to ensure collision are handled as expected\n    //  THIS IS ALSO INHERITING THE GLOBAL ATTRIBUTES & XSTYLED PROPS FROM THE BUTTON!!!\n    extends Omit<DSButtonV3T.InternalProps, keyof MenuSpecificInternalProps> {}\n  export interface InternalProps extends RequiredProps, DefaultProps, OptionalProps {}\n}\n\nexport const defaultProps: DSMenuButtonT.MenuSpecifiDefaultProps = {\n  selectedOptions: {},\n  onClickOutside: () => null,\n  onOptionClick: () => null,\n  openedSubmenus: {},\n  onSubmenuToggle: () => null,\n  isLoading: false,\n  isSkeleton: false,\n};\n\nexport const MenuBehaviouralLayerPropTypes: DSPropTypesSchema<DSMenuButtonT.MenuBehaviouralLayerProps> = {\n  selectedItems: PropTypes.arrayOf(PropTypes.object).description(\n    'an array of tree-nodes that have to be marked as selected in the GUI',\n  ).isRequired,\n\n  onItemSelected: PropTypes.func.description('IoC function in charge of handling the selection of a menu item')\n    .signature(`((\n      newSelection: DSMenuButtonT.PseudoFocusableMenuNodes[],\n      metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },\n    ) => void)`).isRequired,\n  onActivateItem: PropTypes.func.description(\n    'IoC function in charge of handling the activation (NOT INVOKED ON SELECTION) of a menu item',\n  ).signature(`((\n      itemNode: DSMenuButtonT.PseudoFocusableMenuNodes,\n      metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },\n    ) => void)`).isRequired,\n  onOpen: PropTypes.func.description('function triggered when the widget opens the menu').signature(`(()=>void)`),\n  onClose: PropTypes.func.description('function triggered when the widget closes the menu').signature(`(()=>void)`),\n  onDisplayedSubmenuChange: PropTypes.func.description(\"function triggered when the widget's closes or opens a submenu\")\n    .signature(`((\n      newOpenedItems: DSMenuButtonT.PseudoFocusableMenuNodes[],\n      metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },\n    ) => void)`),\n};\n\nexport const DSMenuSpecificPropTypes: DSPropTypesSchema<DSMenuButtonT.MenuSpecificProps> = {\n  ItemRenderer: PropTypes.node.description('Component to be used to render the items'),\n  onClickOutside: PropTypes.func\n    .description('Callback executed when you click outside the dropdown menu, or press the Esc key')\n    .defaultValue(() => null),\n  selectedOptions: PropTypes.object\n    .description(\n      'Object with the ids of the options as keys, and booleans as keys. Represents the state of the current selection in the dropdown menu',\n    )\n    .defaultValue({}),\n  onOptionClick: PropTypes.func\n    .description(\n      'Callback triggered when an item is clicked or pressed. We provide the next selected options, the clicked option and the event, in that order',\n    )\n    .defaultValue(() => null),\n  openedSubmenus: PropTypes.object\n    .description(\n      'Object with the ids of the submenus as keys, and booleans as keys. Represents the state of the current opened submenus',\n    )\n    .defaultValue({}),\n  onSubmenuToggle: PropTypes.func\n    .description('Callback triggered when a submenu is opened or closed.')\n    .signature(\n      '((nextOpenedSubmenus: Record<string, boolean>, submenu: Item, e: React.MouseEvent | React.KeyboardEvent) => void)',\n    )\n    .defaultValue(() => null),\n  isLoading: PropTypes.bool\n    .description('Whether the flyout menu should render the loading indicator')\n    .defaultValue(false),\n  isSkeleton: PropTypes.bool.description('Whether the flyout menu should render the skeleton').defaultValue(false),\n};\n\nexport const DSMenuButtonPropTypes: DSPropTypesSchema<DSMenuButtonT.Props> = {\n  options: PropTypes.oneOfType([PropTypes.array, PropTypes.object]).description(\n    'Array of options to display in the menu or a DSTree node to build branches from',\n  ).isRequired,\n  ...DSButtonV3PropTypes,\n  ...MenuBehaviouralLayerPropTypes,\n  ...DSMenuSpecificPropTypes,\n  ...getPropsPerSlotPropTypes(DSMenuButtonName, MENU_BUTTON_SLOTS),\n};\n\nexport const DSMenuButtonPropTypesSchema = DSMenuButtonPropTypes as unknown as ValidationMap<DSMenuButtonT.Props>;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAAoD;AACpD,0BAAoC;AAMpC,uBAA2E;AA8ZpE,MAAM,eAAsD;AAAA,EACjE,iBAAiB,CAAC;AAAA,EAClB,gBAAgB,MAAM;AAAA,EACtB,eAAe,MAAM;AAAA,EACrB,gBAAgB,CAAC;AAAA,EACjB,iBAAiB,MAAM;AAAA,EACvB,WAAW;AAAA,EACX,YAAY;AACd;AAEO,MAAM,gCAA4F;AAAA,EACvG,eAAe,kCAAU,QAAQ,kCAAU,MAAM,EAAE;AAAA,IACjD;AAAA,EACF,EAAE;AAAA,EAEF,gBAAgB,kCAAU,KAAK,YAAY,iEAAiE,EACzG,UAAU;AAAA;AAAA;AAAA,eAGA,EAAE;AAAA,EACf,gBAAgB,kCAAU,KAAK;AAAA,IAC7B;AAAA,EACF,EAAE,UAAU;AAAA;AAAA;AAAA,eAGC,EAAE;AAAA,EACf,QAAQ,kCAAU,KAAK,YAAY,mDAAmD,EAAE,UAAU,YAAY;AAAA,EAC9G,SAAS,kCAAU,KAAK,YAAY,oDAAoD,EAAE,UAAU,YAAY;AAAA,EAChH,0BAA0B,kCAAU,KAAK,YAAY,gEAAgE,EAClH,UAAU;AAAA;AAAA;AAAA,eAGA;AACf;AAEO,MAAM,0BAA8E;AAAA,EACzF,cAAc,kCAAU,KAAK,YAAY,0CAA0C;AAAA,EACnF,gBAAgB,kCAAU,KACvB,YAAY,kFAAkF,EAC9F,aAAa,MAAM,IAAI;AAAA,EAC1B,iBAAiB,kCAAU,OACxB;AAAA,IACC;AAAA,EACF,EACC,aAAa,CAAC,CAAC;AAAA,EAClB,eAAe,kCAAU,KACtB;AAAA,IACC;AAAA,EACF,EACC,aAAa,MAAM,IAAI;AAAA,EAC1B,gBAAgB,kCAAU,OACvB;AAAA,IACC;AAAA,EACF,EACC,aAAa,CAAC,CAAC;AAAA,EAClB,iBAAiB,kCAAU,KACxB,YAAY,wDAAwD,EACpE;AAAA,IACC;AAAA,EACF,EACC,aAAa,MAAM,IAAI;AAAA,EAC1B,WAAW,kCAAU,KAClB,YAAY,6DAA6D,EACzE,aAAa,KAAK;AAAA,EACrB,YAAY,kCAAU,KAAK,YAAY,oDAAoD,EAAE,aAAa,KAAK;AACjH;AAEO,MAAM,wBAAgE;AAAA,EAC3E,SAAS,kCAAU,UAAU,CAAC,kCAAU,OAAO,kCAAU,MAAM,CAAC,EAAE;AAAA,IAChE;AAAA,EACF,EAAE;AAAA,EACF,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,OAAG,kDAAyB,mCAAkB,kCAAiB;AACjE;AAEO,MAAM,8BAA8B;",
   "names": []
 }

package/dist/cjs/utils/nodesTypeguardsAndGetters.js

@@ -0,0 +1,123 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var nodesTypeguardsAndGetters_exports = {};
+__export(nodesTypeguardsAndGetters_exports, {
+  getFocusableNodes: () => getFocusableNodes,
+  getSelectionableNodes: () => getSelectionableNodes,
+  getWithSubmenuNodes: () => getWithSubmenuNodes,
+  isActivableNode: () => isActivableNode,
+  isActivableWithSubmenuNode: () => isActivableWithSubmenuNode,
+  isFocusableNode: () => isFocusableNode,
+  isGroup: () => isGroup,
+  isMenuNodeAllowedToHaveChildren: () => isMenuNodeAllowedToHaveChildren,
+  isMultipleSelectNode: () => isMultipleSelectNode,
+  isMultipleSelectOnlyNode: () => isMultipleSelectOnlyNode,
+  isMultipleSelectWithSubmenuNode: () => isMultipleSelectWithSubmenuNode,
+  isRootNode: () => isRootNode,
+  isSelectionableNode: () => isSelectionableNode,
+  isSelectionableWithSubmenuNode: () => isSelectionableWithSubmenuNode,
+  isSeparatorNode: () => isSeparatorNode,
+  isSingleSelectNode: () => isSingleSelectNode,
+  isSingleSelectNodeWithSubmenu: () => isSingleSelectNodeWithSubmenu,
+  isSingleSelectOnlyNode: () => isSingleSelectOnlyNode,
+  isSkeletonNode: () => isSkeletonNode,
+  isWithSubmenuNode: () => isWithSubmenuNode,
+  isWithSubmenuOnlyNode: () => isWithSubmenuOnlyNode
+});
+module.exports = __toCommonJS(nodesTypeguardsAndGetters_exports);
+var React = __toESM(require("react"));
+var import_constants = require("../constants/index.js");
+const isActivableNode = (item) => {
+  const node = item;
+  return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.ACTIVABLE_ITEM;
+};
+const isActivableWithSubmenuNode = (item) => {
+  const node = item;
+  return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.ACTIVABLE_WITH_SUBMENU_ITEM;
+};
+const isSkeletonNode = (item) => {
+  const node = item;
+  return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SKELETON_ITEM;
+};
+const isMultipleSelectOnlyNode = (item) => {
+  const node = item;
+  return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.MULTIPLE_SELECT_ITEM;
+};
+const isMultipleSelectWithSubmenuNode = (item) => {
+  const node = item;
+  return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.MULTIPLE_SELECT_WITH_SUBMENU_ITEM;
+};
+const isMultipleSelectNode = (item) => isMultipleSelectOnlyNode(item) || isMultipleSelectWithSubmenuNode(item);
+const isSingleSelectOnlyNode = (item) => {
+  const node = item;
+  return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SINGLE_SELECT_ITEM;
+};
+const isSingleSelectNodeWithSubmenu = (item) => {
+  const node = item;
+  return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SINGLE_SELECT_WITH_SUBMENU_ITEM;
+};
+const isSingleSelectNode = (item) => isSingleSelectOnlyNode(item) || isSingleSelectNodeWithSubmenu(item);
+const isSelectionableNode = (item) => isMultipleSelectNode(item) || isSingleSelectNode(item);
+const getSelectionableNodes = (tree) => {
+  const flattenNodes = tree.flatten();
+  return flattenNodes.filter(isSelectionableNode);
+};
+const isWithSubmenuOnlyNode = (item) => {
+  const node = item;
+  return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.WITH_SUBMENU_ITEM;
+};
+const isSelectionableWithSubmenuNode = (item) => isSingleSelectNodeWithSubmenu(item) || isMultipleSelectWithSubmenuNode(item);
+const isWithSubmenuNode = (item) => isWithSubmenuOnlyNode(item) || isSingleSelectNodeWithSubmenu(item) || isMultipleSelectWithSubmenuNode(item) || isActivableWithSubmenuNode(item);
+const getWithSubmenuNodes = (tree) => {
+  const flattenNodes = tree.flatten();
+  return flattenNodes.filter(isWithSubmenuNode);
+};
+const isFocusableNode = (item) => {
+  const node = item;
+  return typeof item === "object" && item !== null && typeof node.plainItem === "object" && typeof node.plainItem.type === "string" && (node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.WITH_SUBMENU_ITEM || node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.MULTIPLE_SELECT_ITEM || node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.MULTIPLE_SELECT_WITH_SUBMENU_ITEM || node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SINGLE_SELECT_ITEM || node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SINGLE_SELECT_WITH_SUBMENU_ITEM || node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.ACTIVABLE_ITEM || node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.ACTIVABLE_WITH_SUBMENU_ITEM || node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SKELETON_ITEM);
+};
+const getFocusableNodes = (tree) => {
+  const flattenNodes = tree.flatten();
+  return flattenNodes.filter(isFocusableNode);
+};
+const isSeparatorNode = (item) => {
+  const node = item;
+  return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SEPARATOR;
+};
+const isGroup = (item) => {
+  const node = item;
+  return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.GROUP;
+};
+const isRootNode = (item) => {
+  const node = item;
+  return typeof item === "object" && item !== null && typeof node.plainItem === "object" && // hardcoded string because the root item is not a renderable item and must always be treated with special care
+  node.plainItem?.type === "ROOT_ITEM";
+};
+const isMenuNodeAllowedToHaveChildren = (item) => isRootNode(item) || isWithSubmenuNode(item) || isGroup(item) || isSingleSelectNodeWithSubmenu(item) || isMultipleSelectWithSubmenuNode(item) || isActivableWithSubmenuNode(item);
+//# sourceMappingURL=nodesTypeguardsAndGetters.js.map

package/dist/cjs/utils/nodesTypeguardsAndGetters.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/utils/nodesTypeguardsAndGetters.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["/* eslint-disable complexity */\nimport { type DSMenuButtonT } from '../react-desc-prop-types.js';\n\nimport { MENU_ITEMS_TYPES } from '../constants/index.js';\n// =============================================================================\n// Focusable nodes\n// =============================================================================\nexport const isActivableNode = (item: unknown): item is DSMenuButtonT.MenuNodeActivableItem => {\n  const node = item as { plainItem?: { type?: unknown } };\n  return (\n    typeof item === 'object' &&\n    item !== null &&\n    typeof node.plainItem === 'object' &&\n    node.plainItem?.type === MENU_ITEMS_TYPES.ACTIVABLE_ITEM\n  );\n};\nexport const isActivableWithSubmenuNode = (item: unknown): item is DSMenuButtonT.MenuNodeActivableWithSubmenuItem => {\n  const node = item as { plainItem?: { type?: unknown } };\n  return (\n    typeof item === 'object' &&\n    item !== null &&\n    typeof node.plainItem === 'object' &&\n    node.plainItem?.type === MENU_ITEMS_TYPES.ACTIVABLE_WITH_SUBMENU_ITEM\n  );\n};\nexport const isSkeletonNode = (item: unknown): item is DSMenuButtonT.MenuNodeSkeletonItem => {\n  const node = item as { plainItem?: { type?: unknown } };\n  return (\n    typeof item === 'object' &&\n    item !== null &&\n    typeof node.plainItem === 'object' &&\n    node.plainItem?.type === MENU_ITEMS_TYPES.SKELETON_ITEM\n  );\n};\n// =============================================================================\n// Focusable but more specifically specifically selectable nodes\n// =============================================================================\nexport const isMultipleSelectOnlyNode = (item: unknown): item is DSMenuButtonT.MenuNodeMultipleSelectItem => {\n  const node = item as { plainItem?: { type?: unknown } };\n  return (\n    typeof item === 'object' &&\n    item !== null &&\n    typeof node.plainItem === 'object' &&\n    node.plainItem?.type === MENU_ITEMS_TYPES.MULTIPLE_SELECT_ITEM\n  );\n};\n\nexport const isMultipleSelectWithSubmenuNode = (\n  item: unknown,\n): item is DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem => {\n  const node = item as { plainItem?: { type?: unknown } };\n  return (\n    typeof item === 'object' &&\n    item !== null &&\n    typeof node.plainItem === 'object' &&\n    node.plainItem?.type === MENU_ITEMS_TYPES.MULTIPLE_SELECT_WITH_SUBMENU_ITEM\n  );\n};\nexport const isMultipleSelectNode = (item: unknown): item is DSMenuButtonT.MultipleSelectionableMenuNodes =>\n  isMultipleSelectOnlyNode(item) || isMultipleSelectWithSubmenuNode(item);\n\nexport const isSingleSelectOnlyNode = (item: unknown): item is DSMenuButtonT.MenuNodeSingleSelectItem => {\n  const node = item as { plainItem?: { type?: unknown } };\n  return (\n    typeof item === 'object' &&\n    item !== null &&\n    typeof node.plainItem === 'object' &&\n    node.plainItem?.type === MENU_ITEMS_TYPES.SINGLE_SELECT_ITEM\n  );\n};\n\nexport const isSingleSelectNodeWithSubmenu = (\n  item: unknown,\n): item is DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem => {\n  const node = item as { plainItem?: { type?: unknown } };\n  return (\n    typeof item === 'object' &&\n    item !== null &&\n    typeof node.plainItem === 'object' &&\n    node.plainItem?.type === MENU_ITEMS_TYPES.SINGLE_SELECT_WITH_SUBMENU_ITEM\n  );\n};\n\nexport const isSingleSelectNode = (item: unknown): item is DSMenuButtonT.SingleSelectionableMenuNodes =>\n  isSingleSelectOnlyNode(item) || isSingleSelectNodeWithSubmenu(item);\n\nexport const isSelectionableNode = (item: unknown): item is DSMenuButtonT.SelectionableMenuNodes =>\n  isMultipleSelectNode(item) || isSingleSelectNode(item);\n\nexport const getSelectionableNodes = (tree: DSMenuButtonT.MenuNode): DSMenuButtonT.SelectionableMenuNodes[] => {\n  const flattenNodes = tree.flatten();\n  return flattenNodes.filter(isSelectionableNode);\n};\n\n// =============================================================================\n// Focusable but more specifically with submenu nodes\n// =============================================================================\nexport const isWithSubmenuOnlyNode = (item: unknown): item is DSMenuButtonT.MenuNodeWithSubmenuItem => {\n  const node = item as { plainItem?: { type?: unknown } };\n  return (\n    typeof item === 'object' &&\n    item !== null &&\n    typeof node.plainItem === 'object' &&\n    node.plainItem?.type === MENU_ITEMS_TYPES.WITH_SUBMENU_ITEM\n  );\n};\n\nexport const isSelectionableWithSubmenuNode = (\n  item: unknown,\n): item is DSMenuButtonT.SelectionablesWithSubmenuMenuNodes =>\n  isSingleSelectNodeWithSubmenu(item) || isMultipleSelectWithSubmenuNode(item);\n\nexport const isWithSubmenuNode = (item: unknown): item is DSMenuButtonT.WithSubmenuMenuNodes =>\n  isWithSubmenuOnlyNode(item) ||\n  isSingleSelectNodeWithSubmenu(item) ||\n  isMultipleSelectWithSubmenuNode(item) ||\n  isActivableWithSubmenuNode(item);\n\nexport const getWithSubmenuNodes = (tree: DSMenuButtonT.MenuNode): DSMenuButtonT.PseudoFocusableMenuNodes[] => {\n  const flattenNodes = tree.flatten();\n  return flattenNodes.filter(isWithSubmenuNode);\n};\n\nexport const isFocusableNode = (item: unknown): item is DSMenuButtonT.PseudoFocusableMenuNodes => {\n  const node = item as { plainItem?: { type?: unknown } };\n  return (\n    typeof item === 'object' &&\n    item !== null &&\n    typeof node.plainItem === 'object' &&\n    typeof node.plainItem.type === 'string' &&\n    (node.plainItem?.type === MENU_ITEMS_TYPES.WITH_SUBMENU_ITEM ||\n      node.plainItem?.type === MENU_ITEMS_TYPES.MULTIPLE_SELECT_ITEM ||\n      node.plainItem?.type === MENU_ITEMS_TYPES.MULTIPLE_SELECT_WITH_SUBMENU_ITEM ||\n      node.plainItem?.type === MENU_ITEMS_TYPES.SINGLE_SELECT_ITEM ||\n      node.plainItem?.type === MENU_ITEMS_TYPES.SINGLE_SELECT_WITH_SUBMENU_ITEM ||\n      node.plainItem?.type === MENU_ITEMS_TYPES.ACTIVABLE_ITEM ||\n      node.plainItem?.type === MENU_ITEMS_TYPES.ACTIVABLE_WITH_SUBMENU_ITEM ||\n      node.plainItem?.type === MENU_ITEMS_TYPES.SKELETON_ITEM)\n  );\n};\n\nexport const getFocusableNodes = (tree: DSMenuButtonT.MenuNode): DSMenuButtonT.PseudoFocusableMenuNodes[] => {\n  const flattenNodes = tree.flatten();\n  return flattenNodes.filter(isFocusableNode);\n};\n\n// =============================================================================\n// Non focusable nodes\n// =============================================================================\nexport const isSeparatorNode = (item: unknown): item is DSMenuButtonT.MenuNodeSeparatorItem => {\n  const node = item as { plainItem?: { type?: unknown } };\n  return (\n    typeof item === 'object' &&\n    item !== null &&\n    typeof node.plainItem === 'object' &&\n    node.plainItem?.type === MENU_ITEMS_TYPES.SEPARATOR\n  );\n};\n\nexport const isGroup = (item: unknown): item is DSMenuButtonT.MenuNodeGroupItem => {\n  const node = item as { plainItem?: { type?: unknown } };\n  return (\n    typeof item === 'object' &&\n    item !== null &&\n    typeof node.plainItem === 'object' &&\n    node.plainItem?.type === MENU_ITEMS_TYPES.GROUP\n  );\n};\nexport const isRootNode = (item: unknown): item is DSMenuButtonT.MenuNodeRootItem => {\n  const node = item as { plainItem?: { type?: unknown } };\n  return (\n    typeof item === 'object' &&\n    item !== null &&\n    typeof node.plainItem === 'object' &&\n    // hardcoded string because the root item is not a renderable item and must always be treated with special care\n    node.plainItem?.type === 'ROOT_ITEM'\n  );\n};\n// =============================================================================\n// Nodes allowed/expected to have subItems/children\n//  (the node not necessarily needs to be focusable or a submenu)\n// =============================================================================\nexport const isMenuNodeAllowedToHaveChildren = (item: unknown): item is DSMenuButtonT.MenuNodesAllowedToHaveChildren =>\n  isRootNode(item) ||\n  isWithSubmenuNode(item) ||\n  isGroup(item) ||\n  isSingleSelectNodeWithSubmenu(item) ||\n  isMultipleSelectWithSubmenuNode(item) ||\n  isActivableWithSubmenuNode(item);\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,uBAAiC;AAI1B,MAAM,kBAAkB,CAAC,SAA+D;AAC7F,QAAM,OAAO;AACb,SACE,OAAO,SAAS,YAChB,SAAS,QACT,OAAO,KAAK,cAAc,YAC1B,KAAK,WAAW,SAAS,kCAAiB;AAE9C;AACO,MAAM,6BAA6B,CAAC,SAA0E;AACnH,QAAM,OAAO;AACb,SACE,OAAO,SAAS,YAChB,SAAS,QACT,OAAO,KAAK,cAAc,YAC1B,KAAK,WAAW,SAAS,kCAAiB;AAE9C;AACO,MAAM,iBAAiB,CAAC,SAA8D;AAC3F,QAAM,OAAO;AACb,SACE,OAAO,SAAS,YAChB,SAAS,QACT,OAAO,KAAK,cAAc,YAC1B,KAAK,WAAW,SAAS,kCAAiB;AAE9C;AAIO,MAAM,2BAA2B,CAAC,SAAoE;AAC3G,QAAM,OAAO;AACb,SACE,OAAO,SAAS,YAChB,SAAS,QACT,OAAO,KAAK,cAAc,YAC1B,KAAK,WAAW,SAAS,kCAAiB;AAE9C;AAEO,MAAM,kCAAkC,CAC7C,SACgE;AAChE,QAAM,OAAO;AACb,SACE,OAAO,SAAS,YAChB,SAAS,QACT,OAAO,KAAK,cAAc,YAC1B,KAAK,WAAW,SAAS,kCAAiB;AAE9C;AACO,MAAM,uBAAuB,CAAC,SACnC,yBAAyB,IAAI,KAAK,gCAAgC,IAAI;AAEjE,MAAM,yBAAyB,CAAC,SAAkE;AACvG,QAAM,OAAO;AACb,SACE,OAAO,SAAS,YAChB,SAAS,QACT,OAAO,KAAK,cAAc,YAC1B,KAAK,WAAW,SAAS,kCAAiB;AAE9C;AAEO,MAAM,gCAAgC,CAC3C,SAC8D;AAC9D,QAAM,OAAO;AACb,SACE,OAAO,SAAS,YAChB,SAAS,QACT,OAAO,KAAK,cAAc,YAC1B,KAAK,WAAW,SAAS,kCAAiB;AAE9C;AAEO,MAAM,qBAAqB,CAAC,SACjC,uBAAuB,IAAI,KAAK,8BAA8B,IAAI;AAE7D,MAAM,sBAAsB,CAAC,SAClC,qBAAqB,IAAI,KAAK,mBAAmB,IAAI;AAEhD,MAAM,wBAAwB,CAAC,SAAyE;AAC7G,QAAM,eAAe,KAAK,QAAQ;AAClC,SAAO,aAAa,OAAO,mBAAmB;AAChD;AAKO,MAAM,wBAAwB,CAAC,SAAiE;AACrG,QAAM,OAAO;AACb,SACE,OAAO,SAAS,YAChB,SAAS,QACT,OAAO,KAAK,cAAc,YAC1B,KAAK,WAAW,SAAS,kCAAiB;AAE9C;AAEO,MAAM,iCAAiC,CAC5C,SAEA,8BAA8B,IAAI,KAAK,gCAAgC,IAAI;AAEtE,MAAM,oBAAoB,CAAC,SAChC,sBAAsB,IAAI,KAC1B,8BAA8B,IAAI,KAClC,gCAAgC,IAAI,KACpC,2BAA2B,IAAI;AAE1B,MAAM,sBAAsB,CAAC,SAA2E;AAC7G,QAAM,eAAe,KAAK,QAAQ;AAClC,SAAO,aAAa,OAAO,iBAAiB;AAC9C;AAEO,MAAM,kBAAkB,CAAC,SAAkE;AAChG,QAAM,OAAO;AACb,SACE,OAAO,SAAS,YAChB,SAAS,QACT,OAAO,KAAK,cAAc,YAC1B,OAAO,KAAK,UAAU,SAAS,aAC9B,KAAK,WAAW,SAAS,kCAAiB,qBACzC,KAAK,WAAW,SAAS,kCAAiB,wBAC1C,KAAK,WAAW,SAAS,kCAAiB,qCAC1C,KAAK,WAAW,SAAS,kCAAiB,sBAC1C,KAAK,WAAW,SAAS,kCAAiB,mCAC1C,KAAK,WAAW,SAAS,kCAAiB,kBAC1C,KAAK,WAAW,SAAS,kCAAiB,+BAC1C,KAAK,WAAW,SAAS,kCAAiB;AAEhD;AAEO,MAAM,oBAAoB,CAAC,SAA2E;AAC3G,QAAM,eAAe,KAAK,QAAQ;AAClC,SAAO,aAAa,OAAO,eAAe;AAC5C;AAKO,MAAM,kBAAkB,CAAC,SAA+D;AAC7F,QAAM,OAAO;AACb,SACE,OAAO,SAAS,YAChB,SAAS,QACT,OAAO,KAAK,cAAc,YAC1B,KAAK,WAAW,SAAS,kCAAiB;AAE9C;AAEO,MAAM,UAAU,CAAC,SAA2D;AACjF,QAAM,OAAO;AACb,SACE,OAAO,SAAS,YAChB,SAAS,QACT,OAAO,KAAK,cAAc,YAC1B,KAAK,WAAW,SAAS,kCAAiB;AAE9C;AACO,MAAM,aAAa,CAAC,SAA0D;AACnF,QAAM,OAAO;AACb,SACE,OAAO,SAAS,YAChB,SAAS,QACT,OAAO,KAAK,cAAc;AAAA,EAE1B,KAAK,WAAW,SAAS;AAE7B;AAKO,MAAM,kCAAkC,CAAC,SAC9C,WAAW,IAAI,KACf,kBAAkB,IAAI,KACtB,QAAQ,IAAI,KACZ,8BAA8B,IAAI,KAClC,gCAAgC,IAAI,KACpC,2BAA2B,IAAI;",
+  "names": []
+}

package/dist/cjs/utils/useOptionsArrayToDsTree.js

@@ -0,0 +1,55 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var useOptionsArrayToDsTree_exports = {};
+__export(useOptionsArrayToDsTree_exports, {
+  useOptionsArrayToDsTree: () => useOptionsArrayToDsTree
+});
+module.exports = __toCommonJS(useOptionsArrayToDsTree_exports);
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_ds_tree_model = require("@elliemae/ds-tree-model");
+const useDsTreeOpts = {
+  getUniqueId: (item) => item.dsId
+};
+const useOptionsArrayToDsTree = ({ options, instanceUid }) => {
+  const rootNode = import_react.default.useMemo(
+    () => ({
+      dsId: `root-${instanceUid}`,
+      type: "ROOT_ITEM",
+      subitems: options
+      // as unknown as RootNodeType is because currently
+      //  the DS tree model doesn't support the type of the root node being different from the subitems
+      //  in practice, this is fine because the root node is never rendered & the subitems are the only thing that matters
+      //  will be addresssed via PUI-XXXX
+    }),
+    [instanceUid, options]
+  );
+  return (0, import_ds_tree_model.useDSTree)(rootNode, useDsTreeOpts);
+};
+//# sourceMappingURL=useOptionsArrayToDsTree.js.map

package/dist/cjs/utils/useOptionsArrayToDsTree.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/utils/useOptionsArrayToDsTree.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React from 'react';\nimport { useDSTree } from '@elliemae/ds-tree-model';\nimport type { UseDSTreeT } from '@elliemae/ds-tree-model';\nimport { type DSMenuButtonT } from '../react-desc-prop-types.js';\n\nconst useDsTreeOpts: UseDSTreeT.SecondParameter<DSMenuButtonT.MenuItemInterface> = {\n  getUniqueId: (item) => item.dsId,\n};\n\ntype UseOptionsArrayToDsTreeRootNodeConfig = {\n  options: DSMenuButtonT.MenuItemInterface[];\n  instanceUid: string;\n};\n\ntype RootNodeType = UseDSTreeT.Item<DSMenuButtonT.MenuItemInterface>;\n\nexport const useOptionsArrayToDsTree = ({ options, instanceUid }: UseOptionsArrayToDsTreeRootNodeConfig) => {\n  // we need to create the root node that the app dev doesn't need to worry about\n  const rootNode = React.useMemo<RootNodeType>(\n    () =>\n      ({\n        dsId: `root-${instanceUid}`,\n        type: 'ROOT_ITEM',\n        subitems: options,\n        // as unknown as RootNodeType is because currently\n        //  the DS tree model doesn't support the type of the root node being different from the subitems\n        //  in practice, this is fine because the root node is never rendered & the subitems are the only thing that matters\n        //  will be addresssed via PUI-XXXX\n      }) as unknown as RootNodeType,\n    [instanceUid, options],\n  );\n  return useDSTree<DSMenuButtonT.MenuItemInterface>(rootNode, useDsTreeOpts);\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,2BAA0B;AAI1B,MAAM,gBAA6E;AAAA,EACjF,aAAa,CAAC,SAAS,KAAK;AAC9B;AASO,MAAM,0BAA0B,CAAC,EAAE,SAAS,YAAY,MAA6C;AAE1G,QAAM,WAAW,aAAAA,QAAM;AAAA,IACrB,OACG;AAAA,MACC,MAAM,QAAQ,WAAW;AAAA,MACzB,MAAM;AAAA,MACN,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,IAKZ;AAAA,IACF,CAAC,aAAa,OAAO;AAAA,EACvB;AACA,aAAO,gCAA2C,UAAU,aAAa;AAC3E;",
+  "names": ["React"]
+}

package/dist/esm/DSMenuButton.js

@@ -1,18 +1,29 @@
 import * as React from "react";
 import { jsx } from "react/jsx-runtime";
+import { styled } from "@elliemae/ds-system";
+import { Grid } from "@elliemae/ds-grid";
 import { describe } from "@elliemae/ds-props-helpers";
-import { DSDMenuButtonPropTypesSchema } from "./react-desc-prop-types.js";
-import { useDSMenuButton } from "./config/useMenuButton.js";
-import { DSMenuButtonName } from "./constants/index.js";
-import { MenuButtonContext } from "./DSMenuButtonCTX.js";
-import { MenuButtonContent } from "./parts/MenuButtonContent.js";
+import { DSMenuButtonPropTypesSchema } from "./react-desc-prop-types.js";
+import { useMenuButton } from "./config/useMenuButton.js";
+import { DSOpinionatedButton } from "./parts/DSOpinionatedButton/index.js";
+import { DSMenuButtonName, MENU_BUTTON_SLOTS, MENU_BUTTON_DATA_TESTID } from "./constants/index.js";
+import { DSMenuBehaviouralContextProvider } from "./parts/DSMenuBehaviouralContextProvider/DSMenuBehaviouralContextProvider.js";
+const StyledWrapper = styled(Grid, { name: DSMenuButtonName, slot: MENU_BUTTON_SLOTS.ROOT })``;
 const DSMenuButton = (props) => {
-  const ctx = useDSMenuButton(props);
-  return /* @__PURE__ */ jsx(MenuButtonContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx(MenuButtonContent, {}) });
+  const { propsWithDefault, opinionatedButtonProps, menuBehaviouralLayerProps } = useMenuButton(props);
+  return /* @__PURE__ */ jsx(
+    StyledWrapper,
+    {
+      "data-testid": MENU_BUTTON_DATA_TESTID.ROOT,
+      getOwnerProps: () => propsWithDefault,
+      getOwnerPropsArguments: () => ({}),
+      children: /* @__PURE__ */ jsx(DSMenuBehaviouralContextProvider, { ...menuBehaviouralLayerProps, children: /* @__PURE__ */ jsx(DSOpinionatedButton, { ...opinionatedButtonProps, children: opinionatedButtonProps.children }) })
+    }
+  );
 };
 DSMenuButton.displayName = DSMenuButtonName;
 const DSMenuButtonWithSchema = describe(DSMenuButton);
-DSMenuButtonWithSchema.propTypes = DSDMenuButtonPropTypesSchema;
+DSMenuButtonWithSchema.propTypes = DSMenuButtonPropTypesSchema;
 export {
   DSMenuButton,
   DSMenuButtonWithSchema

package/dist/esm/DSMenuButton.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/DSMenuButton.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { type MenuButtonT, DSDMenuButtonPropTypesSchema } from './react-desc-prop-types.js';\nimport { useDSMenuButton } from './config/useMenuButton.js';\nimport { DSMenuButtonName } from './constants/index.js';\nimport { MenuButtonContext } from './DSMenuButtonCTX.js';\nimport { MenuButtonContent } from './parts/MenuButtonContent.js';\n\nconst DSMenuButton = <T extends object = object>(props: MenuButtonT.Props<T>) => {\n  const ctx = useDSMenuButton(props);\n\n  return (\n    <MenuButtonContext.Provider value={ctx}>\n      <MenuButtonContent />\n    </MenuButtonContext.Provider>\n  );\n};\n\nDSMenuButton.displayName = DSMenuButtonName;\nconst DSMenuButtonWithSchema = describe(DSMenuButton);\nDSMenuButtonWithSchema.propTypes = DSDMenuButtonPropTypesSchema;\n\nexport { DSMenuButton, DSMenuButtonWithSchema };\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACajB;AAZN,SAAS,gBAAgB;AACzB,SAA2B,oCAAoC;AAC/D,SAAS,uBAAuB;AAChC,SAAS,wBAAwB;AACjC,SAAS,yBAAyB;AAClC,SAAS,yBAAyB;AAElC,MAAM,eAAe,CAA4B,UAAgC;AAC/E,QAAM,MAAM,gBAAgB,KAAK;AAEjC,SACE,oBAAC,kBAAkB,UAAlB,EAA2B,OAAO,KACjC,8BAAC,qBAAkB,GACrB;AAEJ;AAEA,aAAa,cAAc;AAC3B,MAAM,yBAAyB,SAAS,YAAY;AACpD,uBAAuB,YAAY;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { type DSMenuButtonT, DSMenuButtonPropTypesSchema } from './react-desc-prop-types.js';\nimport { useMenuButton } from './config/useMenuButton.js';\nimport { DSOpinionatedButton } from './parts/DSOpinionatedButton/index.js';\nimport { DSMenuButtonName, MENU_BUTTON_SLOTS, MENU_BUTTON_DATA_TESTID } from './constants/index.js';\nimport { DSMenuBehaviouralContextProvider } from './parts/DSMenuBehaviouralContextProvider/DSMenuBehaviouralContextProvider.js';\n\nconst StyledWrapper = styled(Grid, { name: DSMenuButtonName, slot: MENU_BUTTON_SLOTS.ROOT })``;\n\n// what are the responsability of this widget?\n// 1 - receive an API \"A\" and correctly split it into\n//    what goes to the \"menu\"\n//    what goes to the \"button\"\n//    what goes to the \"behavioural layer\"\n// 2 - ensure the behavioural layer is parent of the button & menu\n// 3 - parse any API \"A\" into the correct data structures / high-level concerns\n//     E.G. Accept array of options\n//          -> convert to DSTree\n//     receive an innerRef  that goes to the button\n//          -> make it so we still have a ref to the button in the behavioural layer\nconst DSMenuButton: React.ComponentType<DSMenuButtonT.Props> = (props) => {\n  const { propsWithDefault, opinionatedButtonProps, menuBehaviouralLayerProps } = useMenuButton(props);\n  return (\n    <StyledWrapper\n      data-testid={MENU_BUTTON_DATA_TESTID.ROOT}\n      getOwnerProps={() => propsWithDefault}\n      getOwnerPropsArguments={() => ({})}\n    >\n      <DSMenuBehaviouralContextProvider {...menuBehaviouralLayerProps}>\n        <DSOpinionatedButton {...opinionatedButtonProps}>{opinionatedButtonProps.children}</DSOpinionatedButton>\n      </DSMenuBehaviouralContextProvider>\n    </StyledWrapper>\n  );\n};\n\nDSMenuButton.displayName = DSMenuButtonName;\nconst DSMenuButtonWithSchema = describe(DSMenuButton);\nDSMenuButtonWithSchema.propTypes = DSMenuButtonPropTypesSchema;\n\nexport { DSMenuButton, DSMenuButtonWithSchema };\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACgCf;AA/BR,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,gBAAgB;AACzB,SAA6B,mCAAmC;AAChE,SAAS,qBAAqB;AAC9B,SAAS,2BAA2B;AACpC,SAAS,kBAAkB,mBAAmB,+BAA+B;AAC7E,SAAS,wCAAwC;AAEjD,MAAM,gBAAgB,OAAO,MAAM,EAAE,MAAM,kBAAkB,MAAM,kBAAkB,KAAK,CAAC;AAa3F,MAAM,eAAyD,CAAC,UAAU;AACxE,QAAM,EAAE,kBAAkB,wBAAwB,0BAA0B,IAAI,cAAc,KAAK;AACnG,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,wBAAwB;AAAA,MACrC,eAAe,MAAM;AAAA,MACrB,wBAAwB,OAAO,CAAC;AAAA,MAEhC,8BAAC,oCAAkC,GAAG,2BACpC,8BAAC,uBAAqB,GAAG,wBAAyB,iCAAuB,UAAS,GACpF;AAAA;AAAA,EACF;AAEJ;AAEA,aAAa,cAAc;AAC3B,MAAM,yBAAyB,SAAS,YAAY;AACpD,uBAAuB,YAAY;",
   "names": []
 }

package/dist/esm/config/useMenuButton.js

@@ -1,31 +1,62 @@
 import * as React from "react";
-import { useMemo, useState } from "react";
-import { useMemoMergePropsWithDefault } from "@elliemae/ds-props-helpers";
-import { DSDMenuButtonPropTypes, defaultProps } from "../react-desc-prop-types.js";
+import React2 from "react";
+import { useGetXstyledProps, useMemoMergePropsWithDefault } from "@elliemae/ds-props-helpers";
+import { uid } from "uid";
+import { DSMenuButtonPropTypes, defaultProps } from "../react-desc-prop-types.js";
 import { useValidateProps } from "./useValidateProps.js";
-const useDSMenuButton = (propsFromUser) => {
+import { useSplitInherithedProps } from "./useSplitInherithedProps.js";
+import { useOptionsArrayToDsTree } from "../utils/useOptionsArrayToDsTree.js";
+import { getFocusableNodes } from "../utils/nodesTypeguardsAndGetters.js";
+const useMenuButton = (propsFromUser) => {
   const propsWithDefault = useMemoMergePropsWithDefault(propsFromUser, defaultProps);
-  useValidateProps(propsWithDefault, DSDMenuButtonPropTypes);
-  const { selectedKeys, onSelectionChange } = propsWithDefault;
-  const [focusedOption, setFocusedOption] = useState(null);
-  const [triggerElementRef, setTriggerElementRef] = useState(null);
-  const [isOpen, setIsOpen] = useState(false);
-  return useMemo(
+  useValidateProps(propsWithDefault, DSMenuButtonPropTypes);
+  const xstyledProps = useGetXstyledProps(propsWithDefault);
+  const instanceUid = React2.useMemo(() => `menu-button${uid(5)}`, []);
+  const [buttonDOMNode, setButtonDOMNode] = React2.useState(null);
+  const { options: appOptions } = propsWithDefault;
+  const optionsArray = Array.isArray(appOptions) ? appOptions : [];
+  const treeRootNodeFromOptionsArrayIfArray = useOptionsArrayToDsTree({
+    options: optionsArray,
+    instanceUid
+    // this typecast is a safe type reconciliation, typescript checks they are compatible
+    // this typecast let us avoid to have to do the ` | OtherCompatibleType` dance
+  }).getRoot();
+  const treeRootNode = React2.useMemo(
+    () => Array.isArray(appOptions) ? treeRootNodeFromOptionsArrayIfArray : appOptions,
+    [appOptions, treeRootNodeFromOptionsArrayIfArray]
+  );
+  const focusableNodes = React2.useMemo(() => getFocusableNodes(treeRootNode), [treeRootNode]);
+  const splitInherithedProps = useSplitInherithedProps({
+    propsWithDefault,
+    setButtonDOMNode,
+    buttonDOMNode,
+    focusableNodes,
+    treeRootNode
+  });
+  const allNodes = treeRootNode.flatten();
+  const nodesWithRepeatedDsId = allNodes.filter(
+    (node, index, self) => self.findIndex((n) => n.dsId === node.dsId) !== index
+  );
+  if (nodesWithRepeatedDsId.length > 0) {
+    throw new Error(
+      `DSMenuButton:
+The following dsId are repeated:
+${nodesWithRepeatedDsId.map((n) => n.dsId).join("\n ")}
+
+The dsId must be unique.`
+    );
+  }
+  return React2.useMemo(
     () => ({
       propsWithDefault,
-      focusedOption,
-      setFocusedOption,
-      selectedKeys,
-      onSelectionChange,
-      triggerElementRef,
-      setTriggerElementRef,
-      isOpen,
-      setIsOpen
+      xstyledProps,
+      instanceUid,
+      ...splitInherithedProps
     }),
-    [propsWithDefault, focusedOption, selectedKeys, onSelectionChange, triggerElementRef, isOpen]
+    [propsWithDefault, xstyledProps, instanceUid, splitInherithedProps]
   );
 };
 export {
-  useDSMenuButton
+  useMenuButton
 };
 //# sourceMappingURL=useMenuButton.js.map