@elliemae/ds-menu-button 3.70.0-next.53 → 3.70.0-next.54
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/parts/DSFlyoutMenu/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/parts/DSMenuBehaviouralContextProvider/config/useMenuBehaviouralContextProvider.js.map +2 -2
- package/dist/cjs/parts/DSMenuBehaviouralContextProvider/utils/nodeGettersByCriterias.js.map +2 -2
- package/dist/cjs/parts/DSMenuItemRendererFactory/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/parts/DSOpinionatedButton/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/esm/parts/DSFlyoutMenu/react-desc-prop-types.js.map +2 -2
- package/dist/esm/parts/DSMenuBehaviouralContextProvider/config/useMenuBehaviouralContextProvider.js.map +2 -2
- package/dist/esm/parts/DSMenuBehaviouralContextProvider/utils/nodeGettersByCriterias.js.map +2 -2
- package/dist/esm/parts/DSMenuItemRendererFactory/react-desc-prop-types.js.map +2 -2
- package/dist/esm/parts/DSOpinionatedButton/react-desc-prop-types.js.map +2 -2
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/dist/types/parts/DSOpinionatedButton/config/useOpinionatedButton.d.ts +6 -6
- package/package.json +12 -12
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/DSFlyoutMenu/react-desc-prop-types.ts", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-empty-interface */\nimport { type useFloatingContext } from '@elliemae/ds-floating-context';\nimport type { DSPropTypesSchema, ValidationMap } from '@elliemae/ds-props-helpers';\nimport {\n PropTypes,\n getPropsPerSlotPropTypes,\n globalAttributesPropTypes,\n xstyledPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { DSMenuSpecificPropTypes, menuSpecificDefaultProps, type DSMenuButtonT } from '../../react-desc-prop-types.js';\nimport { DSFlyoutMenuName, FLYOUT_MENU_SLOTS } from './constants/index.js';\n\nexport declare namespace DSFlyoutMenuT {\n /* Slot function-form prop arguments \u2014 one entry per slot in FLYOUT_MENU_SLOTS. */\n export type SlotFunctionArguments = {\n dsFlyoutmenuFloatingWrapper: () => object;\n dsFlyoutmenuRoot: () => object;\n dsFlyoutmenuListWrapper: () => object;\n };\n\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.MenuSpecificRequiredProps {\n isMenuOpen: boolean;\n itemNode:\n | DSMenuButtonT.MenuNodeWithSubmenuItem\n | DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem\n | DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem\n | DSMenuButtonT.MenuNodeActivableWithSubmenuItem\n | DSMenuButtonT.MenuNodeRootItem;\n setFloatingRef: ReturnType<typeof useFloatingContext>['refs']['setFloating'];\n floatingStyles: ReturnType<typeof useFloatingContext>['floatingStyles'];\n floatingContext: ReturnType<typeof useFloatingContext>['context'];\n }\n\n export interface DefaultProps extends DSMenuButtonT.MenuSpecifiDefaultProps {}\n\n export interface OptionalProps\n extends
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,8BAKO;AAEP,mCAAsF;AACtF,uBAAoD;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-empty-interface */\nimport { type useFloatingContext } from '@elliemae/ds-floating-context';\nimport type { DSPropTypesSchema, ValidationMap } from '@elliemae/ds-props-helpers';\nimport {\n PropTypes,\n getPropsPerSlotPropTypes,\n globalAttributesPropTypes,\n xstyledPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { DSMenuSpecificPropTypes, menuSpecificDefaultProps, type DSMenuButtonT } from '../../react-desc-prop-types.js';\nimport { DSFlyoutMenuName, FLYOUT_MENU_SLOTS } from './constants/index.js';\n\nexport declare namespace DSFlyoutMenuT {\n /* Slot function-form prop arguments \u2014 one entry per slot in FLYOUT_MENU_SLOTS. */\n export type SlotFunctionArguments = {\n dsFlyoutmenuFloatingWrapper: () => object;\n dsFlyoutmenuRoot: () => object;\n dsFlyoutmenuListWrapper: () => object;\n };\n\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.MenuSpecificRequiredProps {\n isMenuOpen: boolean;\n itemNode:\n | DSMenuButtonT.MenuNodeWithSubmenuItem\n | DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem\n | DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem\n | DSMenuButtonT.MenuNodeActivableWithSubmenuItem\n | DSMenuButtonT.MenuNodeRootItem;\n setFloatingRef: ReturnType<typeof useFloatingContext>['refs']['setFloating'];\n floatingStyles: ReturnType<typeof useFloatingContext>['floatingStyles'];\n floatingContext: ReturnType<typeof useFloatingContext>['context'];\n }\n\n export interface DefaultProps extends DSMenuButtonT.MenuSpecifiDefaultProps {}\n\n export interface OptionalProps\n extends\n TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSFlyoutMenuName, typeof FLYOUT_MENU_SLOTS>,\n DSMenuButtonT.MenuSpecificOptionalProps {}\n\n export interface Props extends RequiredProps, Partial<DefaultProps>, OptionalProps {}\n\n export interface InternalProps extends RequiredProps, DefaultProps, OptionalProps {}\n}\n\nexport const defaultProps: DSFlyoutMenuT.DefaultProps = { ...menuSpecificDefaultProps };\n\nexport const DSFlyoutMenuPropTypes: DSPropTypesSchema<DSFlyoutMenuT.Props> = {\n itemNode: PropTypes.object.description('The parent menu node to render the menu from').isRequired,\n setFloatingRef: PropTypes.func.description(\n 'The function to set the ref of the floating element (from useFloatingContext.refs.setFloating)',\n ).isRequired,\n floatingStyles: PropTypes.object.description(\n 'The styles to apply to the floating element to correctly position it (from useFloatingContext.floatingStyles)',\n ).isRequired,\n floatingContext: PropTypes.object.description(\n 'The context object from useFloatingContext, used to allow FloatingWrapper correct functionality',\n ).isRequired,\n // anchorNode: PropTypes.instanceOf(HTMLElement).isRequired,\n isMenuOpen: PropTypes.bool.description('Wheter or not this particular instance of the flyout menu is open')\n .isRequired,\n ...getPropsPerSlotPropTypes(DSFlyoutMenuName, FLYOUT_MENU_SLOTS),\n ...globalAttributesPropTypes,\n // this component is meant to be used from a ds-menu-button compliant API,\n // for this reason we want to inherit the DSMenuButton props interface that relates to the menu and not the button...\n ...DSMenuSpecificPropTypes,\n ...xstyledPropTypes,\n};\n\nexport const DSFlyoutMenuPropTypesSchema = DSFlyoutMenuPropTypes as unknown as ValidationMap<DSFlyoutMenuT.Props>;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,8BAKO;AAEP,mCAAsF;AACtF,uBAAoD;AA0C7C,MAAM,eAA2C,EAAE,GAAG,sDAAyB;AAE/E,MAAM,wBAAgE;AAAA,EAC3E,UAAU,kCAAU,OAAO,YAAY,8CAA8C,EAAE;AAAA,EACvF,gBAAgB,kCAAU,KAAK;AAAA,IAC7B;AAAA,EACF,EAAE;AAAA,EACF,gBAAgB,kCAAU,OAAO;AAAA,IAC/B;AAAA,EACF,EAAE;AAAA,EACF,iBAAiB,kCAAU,OAAO;AAAA,IAChC;AAAA,EACF,EAAE;AAAA;AAAA,EAEF,YAAY,kCAAU,KAAK,YAAY,mEAAmE,EACvG;AAAA,EACH,OAAG,kDAAyB,mCAAkB,kCAAiB;AAAA,EAC/D,GAAG;AAAA;AAAA;AAAA,EAGH,GAAG;AAAA,EACH,GAAG;AACL;AAEO,MAAM,8BAA8B;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/parts/DSMenuBehaviouralContextProvider/config/useMenuBehaviouralContextProvider.ts", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { uid } from 'uid';\nimport type { DSMenuButtonT } from '../../../react-desc-prop-types.js';\nimport {\n DSMenuBehaviouralContextProviderPropTypesSchema,\n defaultProps,\n type DSMenuBehaviouralContextProviderT,\n} from '../react-desc-prop-types.js';\nimport { useAdvancedValidation } from './useAdvancedValidation.js';\nimport { useFocusTracker } from './useFocusTracker.js';\nimport { useGlobalEvents } from './useGlobalEvents.js';\nimport { useMenuItemEventsHandlers } from './useMenuItemEventsHandlers.js';\nimport { useMenuOpenStatus } from './useMenuOpenStatus.js';\nimport { useValidateProps } from './useValidateProps.js';\n\nexport interface MenuBehaviouralContextProviderCTX\n extends ReturnType<typeof useFocusTracker
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,iBAAoB;AAEpB,mCAIO;AACP,mCAAsC;AACtC,6BAAgC;AAChC,6BAAgC;AAChC,uCAA0C;AAC1C,+BAAkC;AAClC,8BAAiC;
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { uid } from 'uid';\nimport type { DSMenuButtonT } from '../../../react-desc-prop-types.js';\nimport {\n DSMenuBehaviouralContextProviderPropTypesSchema,\n defaultProps,\n type DSMenuBehaviouralContextProviderT,\n} from '../react-desc-prop-types.js';\nimport { useAdvancedValidation } from './useAdvancedValidation.js';\nimport { useFocusTracker } from './useFocusTracker.js';\nimport { useGlobalEvents } from './useGlobalEvents.js';\nimport { useMenuItemEventsHandlers } from './useMenuItemEventsHandlers.js';\nimport { useMenuOpenStatus } from './useMenuOpenStatus.js';\nimport { useValidateProps } from './useValidateProps.js';\n\nexport interface MenuBehaviouralContextProviderCTX\n extends ReturnType<typeof useFocusTracker>, ReturnType<typeof useMenuOpenStatus> {\n propsWithDefault: DSMenuBehaviouralContextProviderT.InternalProps;\n instanceUid: string;\n menuItemEventsHandlers: ReturnType<typeof useMenuItemEventsHandlers>;\n openedSubItems: DSMenuButtonT.WithSubmenuMenuNodes[];\n handleChangeOpenedSubItems: Required<DSMenuButtonT.MenuBehaviouralLayerOptionalProps>['onDisplayedSubmenuChange'];\n globalEventsHelpers: ReturnType<typeof useGlobalEvents>;\n}\n\nexport const useMenuBehaviouralContextProvider = (propsFromUser: DSMenuBehaviouralContextProviderT.Props) => {\n // =============================================================================\n // MERGE WITH DEFAULT AND VALIDATE PROPS\n // =============================================================================\n // the component deals with HTML DOM elements,\n // Deep compare of HTML DOM elements is pointless and extremely costly\n // for this specific case, we are better of not using `useMemoMergePropsWithDefault`\n const propsWithDefault = React.useMemo(\n () => ({\n ...defaultProps,\n ...propsFromUser,\n }),\n [propsFromUser],\n ) as DSMenuBehaviouralContextProviderT.InternalProps;\n useValidateProps(propsWithDefault, DSMenuBehaviouralContextProviderPropTypesSchema);\n\n // =============================================================================\n // SPECIAL VALIDATIONS\n // =============================================================================\n useAdvancedValidation({ propsWithDefault });\n\n // =============================================================================\n // XSTYLED PROPS\n // =============================================================================\n // NO XSTYLED PROPS\n // this is 100% a pure logic context provider, it's not a visual component\n\n // =============================================================================\n // AD HOC PER COMPONENT LOGIC\n // =============================================================================\n // custom code goes here, this is an example\n const { onDisplayedSubmenuChange } = propsWithDefault;\n const instanceUid = React.useMemo(() => `ds-menu-behavioural-context-provider-${uid(5)}`, []);\n const [openedSubItems, setOpenedSubItems] = React.useState<DSMenuButtonT.WithSubmenuMenuNodes[]>([]);\n\n const handleChangeOpenedSubItems = React.useCallback<\n Required<DSMenuButtonT.MenuBehaviouralLayerOptionalProps>['onDisplayedSubmenuChange']\n >(\n (newOpenedItems, metainfo) => {\n setOpenedSubItems(newOpenedItems);\n onDisplayedSubmenuChange?.(newOpenedItems, metainfo);\n },\n [onDisplayedSubmenuChange],\n );\n\n // =============================================================================\n // HELPERS HOOKS CONFIGS\n // =============================================================================\n const focusTrackers = useFocusTracker();\n const menuOpenStatus = useMenuOpenStatus({ propsWithDefault, focusTrackers });\n\n // why item events handlers declared in the menu behaviour context provider and not in the menu item itself?\n // 1 - each menu item depending on it's own type (single select, multiple select, with submenu) will have different behaviours\n // having each menu item to declare it's own events handlers would make the single event handler way easier to create per se\n // BUT we would lose the big picture of how the menu items are interacting with each other\n // 2 - having each item to declare it's own event handler repeatdly is a waste of resources (even if it's a useless micro-optimization, it hurts me)\n const menuItemEventsHandlers = useMenuItemEventsHandlers({\n propsWithDefault,\n focusTrackers,\n menuOpenStatus,\n handleChangeOpenedSubItems,\n });\n\n // handle \"onClickOutside\" + on window blur...\n // the helpers contain a way to register the submenu refs/mainmenu refs, used in checking \"if click is outside\"\n const globalEventsHelpers = useGlobalEvents({ menuOpenStatus, handleChangeOpenedSubItems, propsWithDefault });\n\n return React.useMemo<MenuBehaviouralContextProviderCTX>(\n () => ({\n propsWithDefault,\n instanceUid,\n ...focusTrackers,\n ...menuOpenStatus,\n menuItemEventsHandlers,\n openedSubItems,\n handleChangeOpenedSubItems,\n globalEventsHelpers,\n }),\n [\n propsWithDefault,\n instanceUid,\n focusTrackers,\n menuOpenStatus,\n menuItemEventsHandlers,\n openedSubItems,\n handleChangeOpenedSubItems,\n globalEventsHelpers,\n ],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,iBAAoB;AAEpB,mCAIO;AACP,mCAAsC;AACtC,6BAAgC;AAChC,6BAAgC;AAChC,uCAA0C;AAC1C,+BAAkC;AAClC,8BAAiC;AAY1B,MAAM,oCAAoC,CAAC,kBAA2D;AAO3G,QAAM,mBAAmB,aAAAA,QAAM;AAAA,IAC7B,OAAO;AAAA,MACL,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAAA,IACA,CAAC,aAAa;AAAA,EAChB;AACA,gDAAiB,kBAAkB,4EAA+C;AAKlF,0DAAsB,EAAE,iBAAiB,CAAC;AAY1C,QAAM,EAAE,yBAAyB,IAAI;AACrC,QAAM,cAAc,aAAAA,QAAM,QAAQ,MAAM,4CAAwC,gBAAI,CAAC,CAAC,IAAI,CAAC,CAAC;AAC5F,QAAM,CAAC,gBAAgB,iBAAiB,IAAI,aAAAA,QAAM,SAA+C,CAAC,CAAC;AAEnG,QAAM,6BAA6B,aAAAA,QAAM;AAAA,IAGvC,CAAC,gBAAgB,aAAa;AAC5B,wBAAkB,cAAc;AAChC,iCAA2B,gBAAgB,QAAQ;AAAA,IACrD;AAAA,IACA,CAAC,wBAAwB;AAAA,EAC3B;AAKA,QAAM,oBAAgB,wCAAgB;AACtC,QAAM,qBAAiB,4CAAkB,EAAE,kBAAkB,cAAc,CAAC;AAO5E,QAAM,6BAAyB,4DAA0B;AAAA,IACvD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAID,QAAM,0BAAsB,wCAAgB,EAAE,gBAAgB,4BAA4B,iBAAiB,CAAC;AAE5G,SAAO,aAAAA,QAAM;AAAA,IACX,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA,GAAG;AAAA,MACH,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/parts/DSMenuBehaviouralContextProvider/utils/nodeGettersByCriterias.ts", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable no-console */\n/* eslint-disable max-lines */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport type { DSMenuButtonT } from '../../../react-desc-prop-types.js';\nimport {\n isFocusableNode,\n isGroup,\n isMenuNodeAllowedToHaveChildren,\n isMultipleSelectNode,\n isSelectionableNode,\n isSelectionableWithSubmenuNode,\n isSingleSelectNode,\n isWithSubmenuNode,\n} from '../../../utils/nodesTypeguardsAndGetters.js';\nimport { TREE_STRUCTURE_ERRORS, UNEXPECTED_INTERNAL_ERRORS } from '../constants/Errors.js';\n\nexport const getSubMenusPath = (itemNode: DSMenuButtonT.MenuNode) => {\n const subMenuNodesPath: DSMenuButtonT.WithSubmenuMenuNodes[] = [];\n itemNode.walkParents((node) => {\n // discards itself, we want the parents only\n if (node.dsId === itemNode.dsId) return true;\n if (isWithSubmenuNode(node)) {\n subMenuNodesPath.push(node);\n }\n return true;\n });\n return subMenuNodesPath.reverse();\n};\n\nexport const getFocusableSiblingsList = (itemNode: DSMenuButtonT.MenuNode) => {\n const { parent: parentNode } = itemNode;\n if (!parentNode) {\n console.log('getFocusableSiblingsList > itemNode', itemNode);\n throw UNEXPECTED_INTERNAL_ERRORS.NODE_WITHOUT_PARENT;\n }\n if (!isMenuNodeAllowedToHaveChildren(parentNode)) {\n // this should be impossible to reach, if this is reached, there is a bug in the code/validation checks\n console.log('parentNode', parentNode);\n console.log('itemNode', itemNode);\n throw TREE_STRUCTURE_ERRORS.NODE_CANNOT_HAVE_CHILDREN;\n }\n // each tree depth may be composed of a mix of focusable and non-focusable nodes\n // in particular, the parent node may be a group node which is not focusable but it's children are (and are visually siblings)\n // we need to do our calculations only on top of focusable nodes, and we also need to consider the scenario of a group node\n const focusableSiblingsNodes: DSMenuButtonT.PseudoFocusableMenuNodes[] = [];\n\n let parseableParentNode = parentNode;\n // nesting a group node inside another group node is not allowed\n // I could not find a supporting explicit statement in the WCAG standard,\n // but given how everything else is defined and graphically represented,\n // it's the only logical conclusion.\n // Nesting would result in nodes being visually siblings\n // but logically non-exclusively selectable,\n // which would be a contradiction of the visuals\n // so violating the WCAG standard for other reasons\n if (isGroup(parentNode)) {\n if (!parentNode.parent) {\n throw TREE_STRUCTURE_ERRORS.GROUP_WITHOUT_PARENT;\n }\n parseableParentNode = parentNode.parent;\n }\n\n parseableParentNode.children.forEach((node) => {\n if (isFocusableNode(node)) {\n focusableSiblingsNodes.push(node);\n }\n // if we encounter a group node we need to add it's children too\n // (which here is guaranteed because we checked it in the if statement above)\n if (isGroup(node)) {\n node.children.forEach((groupChild) => {\n if (isFocusableNode(groupChild)) {\n focusableSiblingsNodes.push(groupChild);\n }\n });\n }\n });\n\n return focusableSiblingsNodes;\n};\n\n/**\n * This functions walks the tree downwards starting from the oldest shared parent and returns all the single-selectable items ids\n * @param oldestParent - the oldest parent to start the walk from\n * @returns string | number[] - the list of all the single-selectable items ids starting from the oldest shared group\n */\nexport const getAllSingleSelectIdsFromParent = (oldestParent: DSMenuButtonT.MenuNodesAllowedToHaveChildren) => {\n const singleSelectionableItemsIds: (string | number)[] = [];\n oldestParent.walk((node) => {\n // DSTree typescript doesn't understand ethereogeneous subitems, so we need to typecast manually\n const typeCastedNode = node as unknown as\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADKvB,uCASO;AACP,oBAAkE;AAE3D,MAAM,kBAAkB,CAAC,aAAqC;AACnE,QAAM,mBAAyD,CAAC;AAChE,WAAS,YAAY,CAAC,SAAS;AAE7B,QAAI,KAAK,SAAS,SAAS,KAAM,QAAO;AACxC,YAAI,oDAAkB,IAAI,GAAG;AAC3B,uBAAiB,KAAK,IAAI;AAAA,IAC5B;AACA,WAAO;AAAA,EACT,CAAC;AACD,SAAO,iBAAiB,QAAQ;AAClC;AAEO,MAAM,2BAA2B,CAAC,aAAqC;AAC5E,QAAM,EAAE,QAAQ,WAAW,IAAI;AAC/B,MAAI,CAAC,YAAY;AACf,YAAQ,IAAI,uCAAuC,QAAQ;AAC3D,UAAM,yCAA2B;AAAA,EACnC;AACA,MAAI,KAAC,kEAAgC,UAAU,GAAG;AAEhD,YAAQ,IAAI,cAAc,UAAU;AACpC,YAAQ,IAAI,YAAY,QAAQ;AAChC,UAAM,oCAAsB;AAAA,EAC9B;AAIA,QAAM,yBAAmE,CAAC;AAE1E,MAAI,sBAAsB;AAS1B,UAAI,0CAAQ,UAAU,GAAG;AACvB,QAAI,CAAC,WAAW,QAAQ;AACtB,YAAM,oCAAsB;AAAA,IAC9B;AACA,0BAAsB,WAAW;AAAA,EACnC;AAEA,sBAAoB,SAAS,QAAQ,CAAC,SAAS;AAC7C,YAAI,kDAAgB,IAAI,GAAG;AACzB,6BAAuB,KAAK,IAAI;AAAA,IAClC;AAGA,YAAI,0CAAQ,IAAI,GAAG;AACjB,WAAK,SAAS,QAAQ,CAAC,eAAe;AACpC,gBAAI,kDAAgB,UAAU,GAAG;AAC/B,iCAAuB,KAAK,UAAU;AAAA,QACxC;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF,CAAC;AAED,SAAO;AACT;AAOO,MAAM,kCAAkC,CAAC,iBAA+D;AAC7G,QAAM,8BAAmD,CAAC;AAC1D,eAAa,KAAK,CAAC,SAAS;AAE1B,UAAM,iBAAiB;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable no-console */\n/* eslint-disable max-lines */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport type { DSMenuButtonT } from '../../../react-desc-prop-types.js';\nimport {\n isFocusableNode,\n isGroup,\n isMenuNodeAllowedToHaveChildren,\n isMultipleSelectNode,\n isSelectionableNode,\n isSelectionableWithSubmenuNode,\n isSingleSelectNode,\n isWithSubmenuNode,\n} from '../../../utils/nodesTypeguardsAndGetters.js';\nimport { TREE_STRUCTURE_ERRORS, UNEXPECTED_INTERNAL_ERRORS } from '../constants/Errors.js';\n\nexport const getSubMenusPath = (itemNode: DSMenuButtonT.MenuNode) => {\n const subMenuNodesPath: DSMenuButtonT.WithSubmenuMenuNodes[] = [];\n itemNode.walkParents((node) => {\n // discards itself, we want the parents only\n if (node.dsId === itemNode.dsId) return true;\n if (isWithSubmenuNode(node)) {\n subMenuNodesPath.push(node);\n }\n return true;\n });\n return subMenuNodesPath.reverse();\n};\n\nexport const getFocusableSiblingsList = (itemNode: DSMenuButtonT.MenuNode) => {\n const { parent: parentNode } = itemNode;\n if (!parentNode) {\n console.log('getFocusableSiblingsList > itemNode', itemNode);\n throw UNEXPECTED_INTERNAL_ERRORS.NODE_WITHOUT_PARENT;\n }\n if (!isMenuNodeAllowedToHaveChildren(parentNode)) {\n // this should be impossible to reach, if this is reached, there is a bug in the code/validation checks\n console.log('parentNode', parentNode);\n console.log('itemNode', itemNode);\n throw TREE_STRUCTURE_ERRORS.NODE_CANNOT_HAVE_CHILDREN;\n }\n // each tree depth may be composed of a mix of focusable and non-focusable nodes\n // in particular, the parent node may be a group node which is not focusable but it's children are (and are visually siblings)\n // we need to do our calculations only on top of focusable nodes, and we also need to consider the scenario of a group node\n const focusableSiblingsNodes: DSMenuButtonT.PseudoFocusableMenuNodes[] = [];\n\n let parseableParentNode = parentNode;\n // nesting a group node inside another group node is not allowed\n // I could not find a supporting explicit statement in the WCAG standard,\n // but given how everything else is defined and graphically represented,\n // it's the only logical conclusion.\n // Nesting would result in nodes being visually siblings\n // but logically non-exclusively selectable,\n // which would be a contradiction of the visuals\n // so violating the WCAG standard for other reasons\n if (isGroup(parentNode)) {\n if (!parentNode.parent) {\n throw TREE_STRUCTURE_ERRORS.GROUP_WITHOUT_PARENT;\n }\n parseableParentNode = parentNode.parent;\n }\n\n parseableParentNode.children.forEach((node) => {\n if (isFocusableNode(node)) {\n focusableSiblingsNodes.push(node);\n }\n // if we encounter a group node we need to add it's children too\n // (which here is guaranteed because we checked it in the if statement above)\n if (isGroup(node)) {\n node.children.forEach((groupChild) => {\n if (isFocusableNode(groupChild)) {\n focusableSiblingsNodes.push(groupChild);\n }\n });\n }\n });\n\n return focusableSiblingsNodes;\n};\n\n/**\n * This functions walks the tree downwards starting from the oldest shared parent and returns all the single-selectable items ids\n * @param oldestParent - the oldest parent to start the walk from\n * @returns string | number[] - the list of all the single-selectable items ids starting from the oldest shared group\n */\nexport const getAllSingleSelectIdsFromParent = (oldestParent: DSMenuButtonT.MenuNodesAllowedToHaveChildren) => {\n const singleSelectionableItemsIds: (string | number)[] = [];\n oldestParent.walk((node) => {\n // DSTree typescript doesn't understand ethereogeneous subitems, so we need to typecast manually\n const typeCastedNode = node as unknown as\n DSMenuButtonT.SingleSelectionableMenuNodes | DSMenuButtonT.MenuNodeSeparatorItem;\n // is the node is a single-selectable item, we add it to the list\n if (isSingleSelectNode(typeCastedNode)) {\n singleSelectionableItemsIds.push(node.dsId);\n }\n // we walk all the tree (from the shared group), we never shortcircuit\n return true;\n });\n return singleSelectionableItemsIds;\n};\n\n/**\n * walk all parents from a given node and gives back multiple supporting datastructures by different criterias\n *\n * @param menuNode\n * @returns {object} - an object holding different datastructures and information about the parents\n * @property {Object} oldestGroup - the oldest shared group\n * @property {Object[]} selectionableParentsWithSubmenu - the single/multiple selection parents with submenu\n * @property {Object[]} groupParents - all the 'groups' encountered while traversing the tree upwards\n */\nexport const getParentsByCriterias = (menuNode: DSMenuButtonT.MenuNode) => {\n // group\n let oldestGroupFoundSoFar: DSMenuButtonT.MenuNodeGroupItem;\n const selectionableParentsWithSubmenu: DSMenuButtonT.SelectionablesWithSubmenuMenuNodes[] = [];\n const groupParents: DSMenuButtonT.MenuNodeGroupItem[] = [];\n\n menuNode.walkParents((node) => {\n // discards itself, we want the parents only\n if (node.dsId === menuNode.dsId) return true;\n // DSTree is not able to understand ethereogeneous subitems, so we need to typecast manually\n const typeCastedNode = node as unknown as DSMenuButtonT.MenuNode;\n\n if (isGroup(typeCastedNode)) {\n oldestGroupFoundSoFar = typeCastedNode;\n groupParents.push(oldestGroupFoundSoFar);\n // nothing else to do in this walking step, returing true to continue the walk\n return true;\n }\n // we continue checking shared parents untill we see the pattern\n // group -> single-select-with-submenu -> group -> ...\n // the moment the parent of a group is not a single-select-with-submenu we can stop,\n // we have found the oldest shared group\n if (isSelectionableWithSubmenuNode(typeCastedNode)) {\n selectionableParentsWithSubmenu.push(typeCastedNode);\n return true;\n }\n // the node is not a single-select-with-submenu, we can stop the walk\n return true;\n });\n // if we found no group parent starting from menuNode, the tree is malformed\n // @ts-expect-error - typescript doesn't understand that \"walkParents\" actually executes the function synchronously\n // so it thinks that oldestGroupFoundSoFar was never assigned, it's a false positive\n if (!oldestGroupFoundSoFar) {\n console.log('node:', menuNode);\n console.log('parent:', menuNode.parent);\n throw TREE_STRUCTURE_ERRORS.PARENT_NOT_GROUP;\n }\n return {\n oldestGroup: oldestGroupFoundSoFar,\n selectionableParentsWithSubmenu,\n groupParents,\n };\n};\n\n/**\n * walk all childrens from a given node and gives back multiple supporting datastructures by different criterias\n *\n * @param menuNode\n * @returns {object} - an object holding different datastructures and information about the children\n * @property {Object[]} selectionableChilrens - the single/multiple selection children (regardless of the presence of a submenu)\n * @property {Object[]} multiSelectionableChilrens - the multiple selection children (regardless of the presence of a submenu)\n */\nexport const getChildrenByCriterias = (menuNode: DSMenuButtonT.MenuNode) => {\n const selectionableChilrens: DSMenuButtonT.SelectionableMenuNodes[] = [];\n const multiSelectionableChilrens: DSMenuButtonT.MultipleSelectionableMenuNodes[] = [];\n menuNode.walk((node) => {\n // discards itself, we want the children only\n if (node.dsId === menuNode.dsId) return true;\n // DSTree is not able to understand ethereogeneous subitems, so we need to typecast manually\n const typeCastedNode = node as unknown as DSMenuButtonT.MenuNode;\n if (isSelectionableNode(typeCastedNode)) {\n selectionableChilrens.push(typeCastedNode);\n if (isMultipleSelectNode(typeCastedNode)) {\n multiSelectionableChilrens.push(typeCastedNode);\n }\n }\n // we walk all the tree (from the shared group), we never shortcircuit\n return true;\n });\n return {\n selectionableChilrens,\n multiSelectionableChilrens,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADKvB,uCASO;AACP,oBAAkE;AAE3D,MAAM,kBAAkB,CAAC,aAAqC;AACnE,QAAM,mBAAyD,CAAC;AAChE,WAAS,YAAY,CAAC,SAAS;AAE7B,QAAI,KAAK,SAAS,SAAS,KAAM,QAAO;AACxC,YAAI,oDAAkB,IAAI,GAAG;AAC3B,uBAAiB,KAAK,IAAI;AAAA,IAC5B;AACA,WAAO;AAAA,EACT,CAAC;AACD,SAAO,iBAAiB,QAAQ;AAClC;AAEO,MAAM,2BAA2B,CAAC,aAAqC;AAC5E,QAAM,EAAE,QAAQ,WAAW,IAAI;AAC/B,MAAI,CAAC,YAAY;AACf,YAAQ,IAAI,uCAAuC,QAAQ;AAC3D,UAAM,yCAA2B;AAAA,EACnC;AACA,MAAI,KAAC,kEAAgC,UAAU,GAAG;AAEhD,YAAQ,IAAI,cAAc,UAAU;AACpC,YAAQ,IAAI,YAAY,QAAQ;AAChC,UAAM,oCAAsB;AAAA,EAC9B;AAIA,QAAM,yBAAmE,CAAC;AAE1E,MAAI,sBAAsB;AAS1B,UAAI,0CAAQ,UAAU,GAAG;AACvB,QAAI,CAAC,WAAW,QAAQ;AACtB,YAAM,oCAAsB;AAAA,IAC9B;AACA,0BAAsB,WAAW;AAAA,EACnC;AAEA,sBAAoB,SAAS,QAAQ,CAAC,SAAS;AAC7C,YAAI,kDAAgB,IAAI,GAAG;AACzB,6BAAuB,KAAK,IAAI;AAAA,IAClC;AAGA,YAAI,0CAAQ,IAAI,GAAG;AACjB,WAAK,SAAS,QAAQ,CAAC,eAAe;AACpC,gBAAI,kDAAgB,UAAU,GAAG;AAC/B,iCAAuB,KAAK,UAAU;AAAA,QACxC;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF,CAAC;AAED,SAAO;AACT;AAOO,MAAM,kCAAkC,CAAC,iBAA+D;AAC7G,QAAM,8BAAmD,CAAC;AAC1D,eAAa,KAAK,CAAC,SAAS;AAE1B,UAAM,iBAAiB;AAGvB,YAAI,qDAAmB,cAAc,GAAG;AACtC,kCAA4B,KAAK,KAAK,IAAI;AAAA,IAC5C;AAEA,WAAO;AAAA,EACT,CAAC;AACD,SAAO;AACT;AAWO,MAAM,wBAAwB,CAAC,aAAqC;AAEzE,MAAI;AACJ,QAAM,kCAAsF,CAAC;AAC7F,QAAM,eAAkD,CAAC;AAEzD,WAAS,YAAY,CAAC,SAAS;AAE7B,QAAI,KAAK,SAAS,SAAS,KAAM,QAAO;AAExC,UAAM,iBAAiB;AAEvB,YAAI,0CAAQ,cAAc,GAAG;AAC3B,8BAAwB;AACxB,mBAAa,KAAK,qBAAqB;AAEvC,aAAO;AAAA,IACT;AAKA,YAAI,iEAA+B,cAAc,GAAG;AAClD,sCAAgC,KAAK,cAAc;AACnD,aAAO;AAAA,IACT;AAEA,WAAO;AAAA,EACT,CAAC;AAID,MAAI,CAAC,uBAAuB;AAC1B,YAAQ,IAAI,SAAS,QAAQ;AAC7B,YAAQ,IAAI,WAAW,SAAS,MAAM;AACtC,UAAM,oCAAsB;AAAA,EAC9B;AACA,SAAO;AAAA,IACL,aAAa;AAAA,IACb;AAAA,IACA;AAAA,EACF;AACF;AAUO,MAAM,yBAAyB,CAAC,aAAqC;AAC1E,QAAM,wBAAgE,CAAC;AACvE,QAAM,6BAA6E,CAAC;AACpF,WAAS,KAAK,CAAC,SAAS;AAEtB,QAAI,KAAK,SAAS,SAAS,KAAM,QAAO;AAExC,UAAM,iBAAiB;AACvB,YAAI,sDAAoB,cAAc,GAAG;AACvC,4BAAsB,KAAK,cAAc;AACzC,cAAI,uDAAqB,cAAc,GAAG;AACxC,mCAA2B,KAAK,cAAc;AAAA,MAChD;AAAA,IACF;AAEA,WAAO;AAAA,EACT,CAAC;AACD,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/DSMenuItemRendererFactory/react-desc-prop-types.ts", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-empty-interface */\nimport type { DSPropTypesSchema, GlobalAttributesT, ValidationMap, XstyledProps } from '@elliemae/ds-props-helpers';\nimport {\n PropTypes,\n getPropsPerSlotPropTypes,\n globalAttributesPropTypes,\n xstyledPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type { DSMenuButtonT } from '../../react-desc-prop-types.js';\nimport type { DSFlyoutMenuT } from '../DSFlyoutMenu/react-desc-prop-types.js';\nimport { DSMenuItemRendererFactoryName, MENU_ITEM_RENDERER_FACTORY_SLOTS } from './constants/index.js';\n\nexport declare namespace DSMenuItemRendererFactoryT {\n /* Slot function-form prop arguments \u2014 one entry per slot in\n * MENU_ITEM_RENDERER_FACTORY_SLOTS. */\n export type SlotFunctionArguments = {\n dsMenuitemrendererfactoryRoot: () => object;\n dsMenuitemrendererfactoryGroupLabelWrapper: () => object;\n dsMenuitemrendererfactoryLabelWithLeftDecWrapper: () => object;\n dsMenuitemrendererfactoryRadioDotIndicator: () => object;\n };\n\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 {\n itemNode: DSMenuButtonT.MenuNode;\n FlyoutMenuCircularDepInject: React.ComponentType<DSFlyoutMenuT.Props>;\n }\n\n export interface DefaultProps {}\n\n export interface OptionalProps
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAKO;AAIP,uBAAgF;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-empty-interface */\nimport type { DSPropTypesSchema, GlobalAttributesT, ValidationMap, XstyledProps } from '@elliemae/ds-props-helpers';\nimport {\n PropTypes,\n getPropsPerSlotPropTypes,\n globalAttributesPropTypes,\n xstyledPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type { DSMenuButtonT } from '../../react-desc-prop-types.js';\nimport type { DSFlyoutMenuT } from '../DSFlyoutMenu/react-desc-prop-types.js';\nimport { DSMenuItemRendererFactoryName, MENU_ITEM_RENDERER_FACTORY_SLOTS } from './constants/index.js';\n\nexport declare namespace DSMenuItemRendererFactoryT {\n /* Slot function-form prop arguments \u2014 one entry per slot in\n * MENU_ITEM_RENDERER_FACTORY_SLOTS. */\n export type SlotFunctionArguments = {\n dsMenuitemrendererfactoryRoot: () => object;\n dsMenuitemrendererfactoryGroupLabelWrapper: () => object;\n dsMenuitemrendererfactoryLabelWithLeftDecWrapper: () => object;\n dsMenuitemrendererfactoryRadioDotIndicator: () => object;\n };\n\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 {\n itemNode: DSMenuButtonT.MenuNode;\n FlyoutMenuCircularDepInject: React.ComponentType<DSFlyoutMenuT.Props>;\n }\n\n export interface DefaultProps {}\n\n export interface OptionalProps extends TypescriptHelpersT.PropsForGlobalOnSlots<\n typeof DSMenuItemRendererFactoryName,\n typeof MENU_ITEM_RENDERER_FACTORY_SLOTS\n > {\n ItemRenderer?: DSMenuButtonT.ItemRendererT;\n }\n export interface Props\n extends\n Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLLIElement>, keyof OptionalProps | keyof XstyledProps>,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends\n DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLLIElement>, keyof OptionalProps | keyof XstyledProps>,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const defaultProps: DSMenuItemRendererFactoryT.DefaultProps = {};\n\nexport const DSMenuItemRendererFactoryPropTypes: DSPropTypesSchema<DSMenuItemRendererFactoryT.Props> = {\n ...getPropsPerSlotPropTypes(DSMenuItemRendererFactoryName, MENU_ITEM_RENDERER_FACTORY_SLOTS),\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n itemNode: PropTypes.object.description('The polymorphic item to render').isRequired,\n ItemRenderer: PropTypes.func.description('The custom item renderer'),\n FlyoutMenuCircularDepInject: PropTypes.func.description(\n 'Flyout menu component, passed to the factory to avoid circular dependency',\n ),\n};\n\nexport const DSMenuItemRendererFactoryPropTypesSchema =\n DSMenuItemRendererFactoryPropTypes as unknown as ValidationMap<DSMenuItemRendererFactoryT.Props>;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAKO;AAIP,uBAAgF;AAiDzE,MAAM,eAAwD,CAAC;AAE/D,MAAM,qCAA0F;AAAA,EACrG,OAAG,kDAAyB,gDAA+B,iDAAgC;AAAA,EAC3F,GAAG;AAAA,EACH,GAAG;AAAA,EACH,UAAU,kCAAU,OAAO,YAAY,gCAAgC,EAAE;AAAA,EACzE,cAAc,kCAAU,KAAK,YAAY,0BAA0B;AAAA,EACnE,6BAA6B,kCAAU,KAAK;AAAA,IAC1C;AAAA,EACF;AACF;AAEO,MAAM,2CACX;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/DSOpinionatedButton/react-desc-prop-types.ts", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-empty-interface */\nimport { DSButtonV3DefaultProps, DSButtonV3PropTypes } from '@elliemae/ds-button-v2';\nimport type { DSPropTypesSchema, ValidationMap } from '@elliemae/ds-props-helpers';\nimport { PropTypes, getPropsPerSlotPropTypes } from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type React from 'react';\nimport { DSMenuSpecificPropTypes, type DSMenuButtonT } from '../../react-desc-prop-types.js';\nimport { DSOpinionatedButtonName, OPINIONATED_BUTTON_SLOTS } from './constants/index.js';\n\nexport declare namespace DSOpinionatedButtonT {\n /* Slot function-form prop arguments \u2014 one entry per slot in OPINIONATED_BUTTON_SLOTS. */\n export type SlotFunctionArguments = {\n dsOpinionatedbuttonRoot: () => object;\n };\n\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
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,0BAA4D;AAE5D,8BAAoD;AAGpD,mCAA4D;AAC5D,uBAAkE;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-empty-interface */\nimport { DSButtonV3DefaultProps, DSButtonV3PropTypes } from '@elliemae/ds-button-v2';\nimport type { DSPropTypesSchema, ValidationMap } from '@elliemae/ds-props-helpers';\nimport { PropTypes, getPropsPerSlotPropTypes } from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type React from 'react';\nimport { DSMenuSpecificPropTypes, type DSMenuButtonT } from '../../react-desc-prop-types.js';\nimport { DSOpinionatedButtonName, OPINIONATED_BUTTON_SLOTS } from './constants/index.js';\n\nexport declare namespace DSOpinionatedButtonT {\n /* Slot function-form prop arguments \u2014 one entry per slot in OPINIONATED_BUTTON_SLOTS. */\n export type SlotFunctionArguments = {\n dsOpinionatedbuttonRoot: () => object;\n };\n\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\n TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSOpinionatedButtonName, typeof OPINIONATED_BUTTON_SLOTS>,\n DSMenuButtonT.ButtonInheritedOptionalProps {}\n\n export interface Props\n extends\n 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\n 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"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,0BAA4D;AAE5D,8BAAoD;AAGpD,mCAA4D;AAC5D,uBAAkE;AA+C3D,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;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/react-desc-prop-types.ts", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"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';\nimport type { DSHookFloatingContextT } from '@elliemae/ds-floating-context';\n\nimport { DSMenuButtonName, MENU_BUTTON_SLOTS, type MENU_ITEMS_TYPES } from './constants/index.js';\nexport declare namespace DSMenuButtonT {\n /* *******************************************************\n * Slot function-form prop arguments \u2014 one entry per slot in MENU_BUTTON_SLOTS.\n * Backs the typescript-testing/slot-props.ts exhaustiveness check.\n ******************************************************* */\n export type SlotFunctionArguments = {\n dsMenubuttonRoot: () => object;\n };\n\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\n /* **************************************************************************************************************\n *********************************** POLYMORPHIC INTERFACES FOR MENU ITEMS *************************************\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 maxHeight?: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 maxHeight?: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 maxHeight?: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 maxHeight?: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\n disabled?: boolean;\n onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n onKeyDown?: (e: React.KeyboardEvent) => null;\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 maxHeight: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 | SingleSelectItem\n | SingleSelectWithSubmenuItem;\n\n export type PseudoFocusableItemInterface =\n | ActivableItem\n | ActionableWithSubmenuItem\n | SkeletonItem\n | MultipleSelectItem\n | MultiSelectWithSubmenuItem\n | WithSubmenuItem\n | SingleSelectItem\n | SingleSelectWithSubmenuItem;\n\n export type SelectionableMenuItemInterface =\n | MultipleSelectItem\n | MultiSelectWithSubmenuItem\n | SingleSelectItem\n | SingleSelectWithSubmenuItem;\n\n /* **************************************************************************************************************\n *************************** POLYMORPHIC INTERFACES FOR ITEMS USING DSTREE *************************************\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 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 /* **************************************************************************************************************\n ********************************** PROPS/INTERNAL PROPS DEFINITIONS *******************************************\n ************************************************************************************************************** */\n\n export type ItemRendererT = React.ComponentType<{ itemNode: MenuNode }>;\n\n /* **************************************************************************************************************\n ******************************************* \"REQUIRED\" PROPS **************************************************\n ************************************************************************************************************** */\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 export interface MenuBehaviouralLayerRequiredProps {}\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 ******************************************** \"DEFAULT\" PROPS **************************************************\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 maxHeight: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 ******************************************* \"OPTIONAL\" PROPS **************************************************\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 // **********************************************************************************************\n // IoC Pattern\n // - in scenarios where not \"selectionable\" items are present,\n // - the \"selectedItems\" prop is not required\n // - the \"onItemSelected\" prop is not required\n // - in scenarios where no \"activation\" items are present,\n // - the \"onActivateItem\" prop is not required\n // AFAIK Typescipt doesn't support this kind of \"conditional\" required props\n // so we will rely on javascript error throwing to handle this + documentation\n // **********************************************************************************************\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 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 floatingConfig?: Partial<Omit<DSHookFloatingContextT.Props, 'externallyControlledIsOpen' | 'onOpen' | 'onClose'>>;\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 // we convert the (selected) options to a Nodes as part of the widget's logic\n MenuBehaviouralLayerOptionalProps,\n TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSMenuButtonName, typeof MENU_BUTTON_SLOTS> {\n // we convert the (selected) options to a Nodes as part of the widget's logic\n selectedItems?: SelectionableMenuNodes[] | SelectionableMenuItemInterface[];\n }\n\n /* **************************************************************************************************************\n ************************************************ PROPS *******************************************************\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\n extends RequiredProps,\n Partial<DefaultProps>,\n OptionalProps,\n // the global and xstyled props are only part of \"props\"/\"internalProps\" in our namespaces\n // to properly inherith button's global & xstyled props, we need to also include the following\n Omit<DSButtonV3T.Props, keyof RequiredProps | keyof DefaultProps | keyof OptionalProps> {}\n\n /* **************************************************************************************************************\n ******************************************** INTERNAL PROPS ***************************************************\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\n extends RequiredProps,\n DefaultProps,\n OptionalProps,\n // the global and xstyled props are only part of \"props\"/\"internalProps\" in our namespaces\n // to properly inherith button's global & xstyled props, we need to also include the following\n Omit<DSButtonV3T.Props, keyof RequiredProps | keyof DefaultProps | keyof OptionalProps> {}\n}\n\nexport const menuSpecificDefaultProps: DSMenuButtonT.MenuSpecifiDefaultProps = {\n onClickOutside: () => null,\n onOptionClick: () => null,\n openedSubmenus: {},\n onSubmenuToggle: () => null,\n isLoading: false,\n isSkeleton: false,\n maxHeight: '256px', // was available in dropdownmenu-v2, have to provide for retrocompatibility\n};\n/* *******************************************************\n * We are building a widget composed of 3 ATOMIC composition components\n * - Button\n * - Menu\n * - Behavioural Layer\n * The final API facing the users is a sum of all 3 interfaces\n * THOSE INTERFACES ARE NOT EQUAL TO THE FINAL \"PARTS\" INTERFACES\n * The widget embeds \"assumptions\" (as all widgets do) that are AGNOSTIC to the \"parts\" interfaces\n * The \"Parts\" interfaces \"mostly\" inherit the following interfaces, but with meaningful meant and planned differences\n * (E.G. the widget accepts an array of options, but the Menu part accepts a DSTree only)\n ******************************************************* */\nexport const MenuBehaviouralLayerPropTypes: DSPropTypesSchema<DSMenuButtonT.MenuBehaviouralLayerProps> = {\n onItemSelected: PropTypes.func.description(\n 'IoC function in charge of handling the selection of a menu item, required if the menu has selectionable items',\n ).signature(`((\n newSelection: DSMenuButtonT.PseudoFocusableMenuNodes[],\n metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },\n ) => void)`),\n\n onActivateItem: PropTypes.func.description(\n 'IoC function in charge of handling the activation (NOT INVOKED ON SELECTION) of a menu item, required if the menu has activable items',\n ).signature(`((\n itemNode: DSMenuButtonT.PseudoFocusableMenuNodes,\n metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },\n ) => void)`),\n\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 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 maxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number])\n .description('The maximum height of the flyout menu')\n .defaultValue('256px'),\n floatingConfig: PropTypes.object.description(\n 'Configuration object for the floating context (placement, placementOrderPreference, customOffset, animationDuration, withoutPortal, withoutAnimation, portalDOMContainer)',\n ),\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 selectedItems: PropTypes.arrayOf(PropTypes.object).description(\n 'an array of tree-nodes or tree-items that have to be marked as selected in the GUI, required if the menu has selectionable items',\n ),\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"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAAoD;AACpD,0BAAoC;AAOpC,uBAA2E;
|
|
4
|
+
"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';\nimport type { DSHookFloatingContextT } from '@elliemae/ds-floating-context';\n\nimport { DSMenuButtonName, MENU_BUTTON_SLOTS, type MENU_ITEMS_TYPES } from './constants/index.js';\nexport declare namespace DSMenuButtonT {\n /* *******************************************************\n * Slot function-form prop arguments \u2014 one entry per slot in MENU_BUTTON_SLOTS.\n * Backs the typescript-testing/slot-props.ts exhaustiveness check.\n ******************************************************* */\n export type SlotFunctionArguments = {\n dsMenubuttonRoot: () => object;\n };\n\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\n /* **************************************************************************************************************\n *********************************** POLYMORPHIC INTERFACES FOR MENU ITEMS *************************************\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 maxHeight?: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 maxHeight?: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 maxHeight?: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 maxHeight?: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\n disabled?: boolean;\n onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n onKeyDown?: (e: React.KeyboardEvent) => null;\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 maxHeight: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 | SingleSelectItem\n | SingleSelectWithSubmenuItem;\n\n export type PseudoFocusableItemInterface =\n | ActivableItem\n | ActionableWithSubmenuItem\n | SkeletonItem\n | MultipleSelectItem\n | MultiSelectWithSubmenuItem\n | WithSubmenuItem\n | SingleSelectItem\n | SingleSelectWithSubmenuItem;\n\n export type SelectionableMenuItemInterface =\n MultipleSelectItem | MultiSelectWithSubmenuItem | SingleSelectItem | SingleSelectWithSubmenuItem;\n\n /* **************************************************************************************************************\n *************************** POLYMORPHIC INTERFACES FOR ITEMS USING DSTREE *************************************\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 SelectionableMenuNodes =\n | DSMenuButtonT.MenuNodeMultipleSelectItem\n | DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem\n | DSMenuButtonT.MenuNodeSingleSelectItem\n | DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem;\n\n export type MultipleSelectionableMenuNodes =\n DSMenuButtonT.MenuNodeMultipleSelectItem | DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem;\n\n export type SingleSelectionableMenuNodes =\n DSMenuButtonT.MenuNodeSingleSelectItem | 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 | DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem;\n\n /* **************************************************************************************************************\n ********************************** PROPS/INTERNAL PROPS DEFINITIONS *******************************************\n ************************************************************************************************************** */\n\n export type ItemRendererT = React.ComponentType<{ itemNode: MenuNode }>;\n\n /* **************************************************************************************************************\n ******************************************* \"REQUIRED\" PROPS **************************************************\n ************************************************************************************************************** */\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 export interface MenuBehaviouralLayerRequiredProps {}\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, ButtonInheritedRequiredProps, 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 ******************************************** \"DEFAULT\" PROPS **************************************************\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 maxHeight: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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, ButtonInheiredDefaultProps, MenuBehaviouralLayerDefaultProps {}\n\n /* **************************************************************************************************************\n ******************************************* \"OPTIONAL\" PROPS **************************************************\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 // **********************************************************************************************\n // IoC Pattern\n // - in scenarios where not \"selectionable\" items are present,\n // - the \"selectedItems\" prop is not required\n // - the \"onItemSelected\" prop is not required\n // - in scenarios where no \"activation\" items are present,\n // - the \"onActivateItem\" prop is not required\n // AFAIK Typescipt doesn't support this kind of \"conditional\" required props\n // so we will rely on javascript error throwing to handle this + documentation\n // **********************************************************************************************\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 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 floatingConfig?: Partial<Omit<DSHookFloatingContextT.Props, 'externallyControlledIsOpen' | 'onOpen' | 'onClose'>>;\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\n MenuSpecificOptionalProps,\n ButtonInheritedOptionalProps,\n // we convert the (selected) options to a Nodes as part of the widget's logic\n MenuBehaviouralLayerOptionalProps,\n TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSMenuButtonName, typeof MENU_BUTTON_SLOTS> {\n // we convert the (selected) options to a Nodes as part of the widget's logic\n selectedItems?: SelectionableMenuNodes[] | SelectionableMenuItemInterface[];\n }\n\n /* **************************************************************************************************************\n ************************************************ PROPS *******************************************************\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\n Partial<MenuBehaviouralLayerDefaultProps>,\n MenuBehaviouralLayerOptionalProps,\n MenuBehaviouralLayerRequiredProps {}\n export interface MenuSpecificProps\n extends Partial<MenuSpecifiDefaultProps>, MenuSpecificOptionalProps, 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\n extends\n RequiredProps,\n Partial<DefaultProps>,\n OptionalProps,\n // the global and xstyled props are only part of \"props\"/\"internalProps\" in our namespaces\n // to properly inherith button's global & xstyled props, we need to also include the following\n Omit<DSButtonV3T.Props, keyof RequiredProps | keyof DefaultProps | keyof OptionalProps> {}\n\n /* **************************************************************************************************************\n ******************************************** INTERNAL PROPS ***************************************************\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, MenuBehaviouralLayerOptionalProps, MenuBehaviouralLayerRequiredProps {}\n export interface MenuSpecificInternalProps\n extends MenuSpecifiDefaultProps, MenuSpecificOptionalProps, 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\n extends\n RequiredProps,\n DefaultProps,\n OptionalProps,\n // the global and xstyled props are only part of \"props\"/\"internalProps\" in our namespaces\n // to properly inherith button's global & xstyled props, we need to also include the following\n Omit<DSButtonV3T.Props, keyof RequiredProps | keyof DefaultProps | keyof OptionalProps> {}\n}\n\nexport const menuSpecificDefaultProps: DSMenuButtonT.MenuSpecifiDefaultProps = {\n onClickOutside: () => null,\n onOptionClick: () => null,\n openedSubmenus: {},\n onSubmenuToggle: () => null,\n isLoading: false,\n isSkeleton: false,\n maxHeight: '256px', // was available in dropdownmenu-v2, have to provide for retrocompatibility\n};\n/* *******************************************************\n * We are building a widget composed of 3 ATOMIC composition components\n * - Button\n * - Menu\n * - Behavioural Layer\n * The final API facing the users is a sum of all 3 interfaces\n * THOSE INTERFACES ARE NOT EQUAL TO THE FINAL \"PARTS\" INTERFACES\n * The widget embeds \"assumptions\" (as all widgets do) that are AGNOSTIC to the \"parts\" interfaces\n * The \"Parts\" interfaces \"mostly\" inherit the following interfaces, but with meaningful meant and planned differences\n * (E.G. the widget accepts an array of options, but the Menu part accepts a DSTree only)\n ******************************************************* */\nexport const MenuBehaviouralLayerPropTypes: DSPropTypesSchema<DSMenuButtonT.MenuBehaviouralLayerProps> = {\n onItemSelected: PropTypes.func.description(\n 'IoC function in charge of handling the selection of a menu item, required if the menu has selectionable items',\n ).signature(`((\n newSelection: DSMenuButtonT.PseudoFocusableMenuNodes[],\n metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },\n ) => void)`),\n\n onActivateItem: PropTypes.func.description(\n 'IoC function in charge of handling the activation (NOT INVOKED ON SELECTION) of a menu item, required if the menu has activable items',\n ).signature(`((\n itemNode: DSMenuButtonT.PseudoFocusableMenuNodes,\n metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },\n ) => void)`),\n\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 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 maxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number])\n .description('The maximum height of the flyout menu')\n .defaultValue('256px'),\n floatingConfig: PropTypes.object.description(\n 'Configuration object for the floating context (placement, placementOrderPreference, customOffset, animationDuration, withoutPortal, withoutAnimation, portalDOMContainer)',\n ),\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 selectedItems: PropTypes.arrayOf(PropTypes.object).description(\n 'an array of tree-nodes or tree-items that have to be marked as selected in the GUI, required if the menu has selectionable items',\n ),\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"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAAoD;AACpD,0BAAoC;AAOpC,uBAA2E;AAqdpE,MAAM,2BAAkE;AAAA,EAC7E,gBAAgB,MAAM;AAAA,EACtB,eAAe,MAAM;AAAA,EACrB,gBAAgB,CAAC;AAAA,EACjB,iBAAiB,MAAM;AAAA,EACvB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,WAAW;AAAA;AACb;AAYO,MAAM,gCAA4F;AAAA,EACvG,gBAAgB,kCAAU,KAAK;AAAA,IAC7B;AAAA,EACF,EAAE,UAAU;AAAA;AAAA;AAAA,eAGC;AAAA,EAEb,gBAAgB,kCAAU,KAAK;AAAA,IAC7B;AAAA,EACF,EAAE,UAAU;AAAA;AAAA;AAAA,eAGC;AAAA,EAEb,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,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;AAAA,EAC/G,WAAW,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,MAAM,CAAC,EAChE,YAAY,uCAAuC,EACnD,aAAa,OAAO;AAAA,EACvB,gBAAgB,kCAAU,OAAO;AAAA,IAC/B;AAAA,EACF;AACF;AAEO,MAAM,wBAAgE;AAAA,EAC3E,SAAS,kCAAU,UAAU,CAAC,kCAAU,OAAO,kCAAU,MAAM,CAAC,EAAE;AAAA,IAChE;AAAA,EACF,EAAE;AAAA,EACF,eAAe,kCAAU,QAAQ,kCAAU,MAAM,EAAE;AAAA,IACjD;AAAA,EACF;AAAA,EACA,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,OAAG,kDAAyB,mCAAkB,kCAAiB;AACjE;AAEO,MAAM,8BAA8B;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/DSFlyoutMenu/react-desc-prop-types.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-empty-interface */\nimport { type useFloatingContext } from '@elliemae/ds-floating-context';\nimport type { DSPropTypesSchema, ValidationMap } from '@elliemae/ds-props-helpers';\nimport {\n PropTypes,\n getPropsPerSlotPropTypes,\n globalAttributesPropTypes,\n xstyledPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { DSMenuSpecificPropTypes, menuSpecificDefaultProps, type DSMenuButtonT } from '../../react-desc-prop-types.js';\nimport { DSFlyoutMenuName, FLYOUT_MENU_SLOTS } from './constants/index.js';\n\nexport declare namespace DSFlyoutMenuT {\n /* Slot function-form prop arguments \u2014 one entry per slot in FLYOUT_MENU_SLOTS. */\n export type SlotFunctionArguments = {\n dsFlyoutmenuFloatingWrapper: () => object;\n dsFlyoutmenuRoot: () => object;\n dsFlyoutmenuListWrapper: () => object;\n };\n\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.MenuSpecificRequiredProps {\n isMenuOpen: boolean;\n itemNode:\n | DSMenuButtonT.MenuNodeWithSubmenuItem\n | DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem\n | DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem\n | DSMenuButtonT.MenuNodeActivableWithSubmenuItem\n | DSMenuButtonT.MenuNodeRootItem;\n setFloatingRef: ReturnType<typeof useFloatingContext>['refs']['setFloating'];\n floatingStyles: ReturnType<typeof useFloatingContext>['floatingStyles'];\n floatingContext: ReturnType<typeof useFloatingContext>['context'];\n }\n\n export interface DefaultProps extends DSMenuButtonT.MenuSpecifiDefaultProps {}\n\n export interface OptionalProps\n extends
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACGvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,yBAAyB,gCAAoD;AACtF,SAAS,kBAAkB,yBAAyB;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-empty-interface */\nimport { type useFloatingContext } from '@elliemae/ds-floating-context';\nimport type { DSPropTypesSchema, ValidationMap } from '@elliemae/ds-props-helpers';\nimport {\n PropTypes,\n getPropsPerSlotPropTypes,\n globalAttributesPropTypes,\n xstyledPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { DSMenuSpecificPropTypes, menuSpecificDefaultProps, type DSMenuButtonT } from '../../react-desc-prop-types.js';\nimport { DSFlyoutMenuName, FLYOUT_MENU_SLOTS } from './constants/index.js';\n\nexport declare namespace DSFlyoutMenuT {\n /* Slot function-form prop arguments \u2014 one entry per slot in FLYOUT_MENU_SLOTS. */\n export type SlotFunctionArguments = {\n dsFlyoutmenuFloatingWrapper: () => object;\n dsFlyoutmenuRoot: () => object;\n dsFlyoutmenuListWrapper: () => object;\n };\n\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.MenuSpecificRequiredProps {\n isMenuOpen: boolean;\n itemNode:\n | DSMenuButtonT.MenuNodeWithSubmenuItem\n | DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem\n | DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem\n | DSMenuButtonT.MenuNodeActivableWithSubmenuItem\n | DSMenuButtonT.MenuNodeRootItem;\n setFloatingRef: ReturnType<typeof useFloatingContext>['refs']['setFloating'];\n floatingStyles: ReturnType<typeof useFloatingContext>['floatingStyles'];\n floatingContext: ReturnType<typeof useFloatingContext>['context'];\n }\n\n export interface DefaultProps extends DSMenuButtonT.MenuSpecifiDefaultProps {}\n\n export interface OptionalProps\n extends\n TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSFlyoutMenuName, typeof FLYOUT_MENU_SLOTS>,\n DSMenuButtonT.MenuSpecificOptionalProps {}\n\n export interface Props extends RequiredProps, Partial<DefaultProps>, OptionalProps {}\n\n export interface InternalProps extends RequiredProps, DefaultProps, OptionalProps {}\n}\n\nexport const defaultProps: DSFlyoutMenuT.DefaultProps = { ...menuSpecificDefaultProps };\n\nexport const DSFlyoutMenuPropTypes: DSPropTypesSchema<DSFlyoutMenuT.Props> = {\n itemNode: PropTypes.object.description('The parent menu node to render the menu from').isRequired,\n setFloatingRef: PropTypes.func.description(\n 'The function to set the ref of the floating element (from useFloatingContext.refs.setFloating)',\n ).isRequired,\n floatingStyles: PropTypes.object.description(\n 'The styles to apply to the floating element to correctly position it (from useFloatingContext.floatingStyles)',\n ).isRequired,\n floatingContext: PropTypes.object.description(\n 'The context object from useFloatingContext, used to allow FloatingWrapper correct functionality',\n ).isRequired,\n // anchorNode: PropTypes.instanceOf(HTMLElement).isRequired,\n isMenuOpen: PropTypes.bool.description('Wheter or not this particular instance of the flyout menu is open')\n .isRequired,\n ...getPropsPerSlotPropTypes(DSFlyoutMenuName, FLYOUT_MENU_SLOTS),\n ...globalAttributesPropTypes,\n // this component is meant to be used from a ds-menu-button compliant API,\n // for this reason we want to inherit the DSMenuButton props interface that relates to the menu and not the button...\n ...DSMenuSpecificPropTypes,\n ...xstyledPropTypes,\n};\n\nexport const DSFlyoutMenuPropTypesSchema = DSFlyoutMenuPropTypes as unknown as ValidationMap<DSFlyoutMenuT.Props>;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACGvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,yBAAyB,gCAAoD;AACtF,SAAS,kBAAkB,yBAAyB;AA0C7C,MAAM,eAA2C,EAAE,GAAG,yBAAyB;AAE/E,MAAM,wBAAgE;AAAA,EAC3E,UAAU,UAAU,OAAO,YAAY,8CAA8C,EAAE;AAAA,EACvF,gBAAgB,UAAU,KAAK;AAAA,IAC7B;AAAA,EACF,EAAE;AAAA,EACF,gBAAgB,UAAU,OAAO;AAAA,IAC/B;AAAA,EACF,EAAE;AAAA,EACF,iBAAiB,UAAU,OAAO;AAAA,IAChC;AAAA,EACF,EAAE;AAAA;AAAA,EAEF,YAAY,UAAU,KAAK,YAAY,mEAAmE,EACvG;AAAA,EACH,GAAG,yBAAyB,kBAAkB,iBAAiB;AAAA,EAC/D,GAAG;AAAA;AAAA;AAAA,EAGH,GAAG;AAAA,EACH,GAAG;AACL;AAEO,MAAM,8BAA8B;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/DSMenuBehaviouralContextProvider/config/useMenuBehaviouralContextProvider.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { uid } from 'uid';\nimport type { DSMenuButtonT } from '../../../react-desc-prop-types.js';\nimport {\n DSMenuBehaviouralContextProviderPropTypesSchema,\n defaultProps,\n type DSMenuBehaviouralContextProviderT,\n} from '../react-desc-prop-types.js';\nimport { useAdvancedValidation } from './useAdvancedValidation.js';\nimport { useFocusTracker } from './useFocusTracker.js';\nimport { useGlobalEvents } from './useGlobalEvents.js';\nimport { useMenuItemEventsHandlers } from './useMenuItemEventsHandlers.js';\nimport { useMenuOpenStatus } from './useMenuOpenStatus.js';\nimport { useValidateProps } from './useValidateProps.js';\n\nexport interface MenuBehaviouralContextProviderCTX\n extends ReturnType<typeof useFocusTracker
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB,SAAS,WAAW;AAEpB;AAAA,EACE;AAAA,EACA;AAAA,OAEK;AACP,SAAS,6BAA6B;AACtC,SAAS,uBAAuB;AAChC,SAAS,uBAAuB;AAChC,SAAS,iCAAiC;AAC1C,SAAS,yBAAyB;AAClC,SAAS,wBAAwB;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { uid } from 'uid';\nimport type { DSMenuButtonT } from '../../../react-desc-prop-types.js';\nimport {\n DSMenuBehaviouralContextProviderPropTypesSchema,\n defaultProps,\n type DSMenuBehaviouralContextProviderT,\n} from '../react-desc-prop-types.js';\nimport { useAdvancedValidation } from './useAdvancedValidation.js';\nimport { useFocusTracker } from './useFocusTracker.js';\nimport { useGlobalEvents } from './useGlobalEvents.js';\nimport { useMenuItemEventsHandlers } from './useMenuItemEventsHandlers.js';\nimport { useMenuOpenStatus } from './useMenuOpenStatus.js';\nimport { useValidateProps } from './useValidateProps.js';\n\nexport interface MenuBehaviouralContextProviderCTX\n extends ReturnType<typeof useFocusTracker>, ReturnType<typeof useMenuOpenStatus> {\n propsWithDefault: DSMenuBehaviouralContextProviderT.InternalProps;\n instanceUid: string;\n menuItemEventsHandlers: ReturnType<typeof useMenuItemEventsHandlers>;\n openedSubItems: DSMenuButtonT.WithSubmenuMenuNodes[];\n handleChangeOpenedSubItems: Required<DSMenuButtonT.MenuBehaviouralLayerOptionalProps>['onDisplayedSubmenuChange'];\n globalEventsHelpers: ReturnType<typeof useGlobalEvents>;\n}\n\nexport const useMenuBehaviouralContextProvider = (propsFromUser: DSMenuBehaviouralContextProviderT.Props) => {\n // =============================================================================\n // MERGE WITH DEFAULT AND VALIDATE PROPS\n // =============================================================================\n // the component deals with HTML DOM elements,\n // Deep compare of HTML DOM elements is pointless and extremely costly\n // for this specific case, we are better of not using `useMemoMergePropsWithDefault`\n const propsWithDefault = React.useMemo(\n () => ({\n ...defaultProps,\n ...propsFromUser,\n }),\n [propsFromUser],\n ) as DSMenuBehaviouralContextProviderT.InternalProps;\n useValidateProps(propsWithDefault, DSMenuBehaviouralContextProviderPropTypesSchema);\n\n // =============================================================================\n // SPECIAL VALIDATIONS\n // =============================================================================\n useAdvancedValidation({ propsWithDefault });\n\n // =============================================================================\n // XSTYLED PROPS\n // =============================================================================\n // NO XSTYLED PROPS\n // this is 100% a pure logic context provider, it's not a visual component\n\n // =============================================================================\n // AD HOC PER COMPONENT LOGIC\n // =============================================================================\n // custom code goes here, this is an example\n const { onDisplayedSubmenuChange } = propsWithDefault;\n const instanceUid = React.useMemo(() => `ds-menu-behavioural-context-provider-${uid(5)}`, []);\n const [openedSubItems, setOpenedSubItems] = React.useState<DSMenuButtonT.WithSubmenuMenuNodes[]>([]);\n\n const handleChangeOpenedSubItems = React.useCallback<\n Required<DSMenuButtonT.MenuBehaviouralLayerOptionalProps>['onDisplayedSubmenuChange']\n >(\n (newOpenedItems, metainfo) => {\n setOpenedSubItems(newOpenedItems);\n onDisplayedSubmenuChange?.(newOpenedItems, metainfo);\n },\n [onDisplayedSubmenuChange],\n );\n\n // =============================================================================\n // HELPERS HOOKS CONFIGS\n // =============================================================================\n const focusTrackers = useFocusTracker();\n const menuOpenStatus = useMenuOpenStatus({ propsWithDefault, focusTrackers });\n\n // why item events handlers declared in the menu behaviour context provider and not in the menu item itself?\n // 1 - each menu item depending on it's own type (single select, multiple select, with submenu) will have different behaviours\n // having each menu item to declare it's own events handlers would make the single event handler way easier to create per se\n // BUT we would lose the big picture of how the menu items are interacting with each other\n // 2 - having each item to declare it's own event handler repeatdly is a waste of resources (even if it's a useless micro-optimization, it hurts me)\n const menuItemEventsHandlers = useMenuItemEventsHandlers({\n propsWithDefault,\n focusTrackers,\n menuOpenStatus,\n handleChangeOpenedSubItems,\n });\n\n // handle \"onClickOutside\" + on window blur...\n // the helpers contain a way to register the submenu refs/mainmenu refs, used in checking \"if click is outside\"\n const globalEventsHelpers = useGlobalEvents({ menuOpenStatus, handleChangeOpenedSubItems, propsWithDefault });\n\n return React.useMemo<MenuBehaviouralContextProviderCTX>(\n () => ({\n propsWithDefault,\n instanceUid,\n ...focusTrackers,\n ...menuOpenStatus,\n menuItemEventsHandlers,\n openedSubItems,\n handleChangeOpenedSubItems,\n globalEventsHelpers,\n }),\n [\n propsWithDefault,\n instanceUid,\n focusTrackers,\n menuOpenStatus,\n menuItemEventsHandlers,\n openedSubItems,\n handleChangeOpenedSubItems,\n globalEventsHelpers,\n ],\n );\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB,SAAS,WAAW;AAEpB;AAAA,EACE;AAAA,EACA;AAAA,OAEK;AACP,SAAS,6BAA6B;AACtC,SAAS,uBAAuB;AAChC,SAAS,uBAAuB;AAChC,SAAS,iCAAiC;AAC1C,SAAS,yBAAyB;AAClC,SAAS,wBAAwB;AAY1B,MAAM,oCAAoC,CAAC,kBAA2D;AAO3G,QAAM,mBAAmBA,OAAM;AAAA,IAC7B,OAAO;AAAA,MACL,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAAA,IACA,CAAC,aAAa;AAAA,EAChB;AACA,mBAAiB,kBAAkB,+CAA+C;AAKlF,wBAAsB,EAAE,iBAAiB,CAAC;AAY1C,QAAM,EAAE,yBAAyB,IAAI;AACrC,QAAM,cAAcA,OAAM,QAAQ,MAAM,wCAAwC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC;AAC5F,QAAM,CAAC,gBAAgB,iBAAiB,IAAIA,OAAM,SAA+C,CAAC,CAAC;AAEnG,QAAM,6BAA6BA,OAAM;AAAA,IAGvC,CAAC,gBAAgB,aAAa;AAC5B,wBAAkB,cAAc;AAChC,iCAA2B,gBAAgB,QAAQ;AAAA,IACrD;AAAA,IACA,CAAC,wBAAwB;AAAA,EAC3B;AAKA,QAAM,gBAAgB,gBAAgB;AACtC,QAAM,iBAAiB,kBAAkB,EAAE,kBAAkB,cAAc,CAAC;AAO5E,QAAM,yBAAyB,0BAA0B;AAAA,IACvD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAID,QAAM,sBAAsB,gBAAgB,EAAE,gBAAgB,4BAA4B,iBAAiB,CAAC;AAE5G,SAAOA,OAAM;AAAA,IACX,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA,GAAG;AAAA,MACH,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/DSMenuBehaviouralContextProvider/utils/nodeGettersByCriterias.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-console */\n/* eslint-disable max-lines */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport type { DSMenuButtonT } from '../../../react-desc-prop-types.js';\nimport {\n isFocusableNode,\n isGroup,\n isMenuNodeAllowedToHaveChildren,\n isMultipleSelectNode,\n isSelectionableNode,\n isSelectionableWithSubmenuNode,\n isSingleSelectNode,\n isWithSubmenuNode,\n} from '../../../utils/nodesTypeguardsAndGetters.js';\nimport { TREE_STRUCTURE_ERRORS, UNEXPECTED_INTERNAL_ERRORS } from '../constants/Errors.js';\n\nexport const getSubMenusPath = (itemNode: DSMenuButtonT.MenuNode) => {\n const subMenuNodesPath: DSMenuButtonT.WithSubmenuMenuNodes[] = [];\n itemNode.walkParents((node) => {\n // discards itself, we want the parents only\n if (node.dsId === itemNode.dsId) return true;\n if (isWithSubmenuNode(node)) {\n subMenuNodesPath.push(node);\n }\n return true;\n });\n return subMenuNodesPath.reverse();\n};\n\nexport const getFocusableSiblingsList = (itemNode: DSMenuButtonT.MenuNode) => {\n const { parent: parentNode } = itemNode;\n if (!parentNode) {\n console.log('getFocusableSiblingsList > itemNode', itemNode);\n throw UNEXPECTED_INTERNAL_ERRORS.NODE_WITHOUT_PARENT;\n }\n if (!isMenuNodeAllowedToHaveChildren(parentNode)) {\n // this should be impossible to reach, if this is reached, there is a bug in the code/validation checks\n console.log('parentNode', parentNode);\n console.log('itemNode', itemNode);\n throw TREE_STRUCTURE_ERRORS.NODE_CANNOT_HAVE_CHILDREN;\n }\n // each tree depth may be composed of a mix of focusable and non-focusable nodes\n // in particular, the parent node may be a group node which is not focusable but it's children are (and are visually siblings)\n // we need to do our calculations only on top of focusable nodes, and we also need to consider the scenario of a group node\n const focusableSiblingsNodes: DSMenuButtonT.PseudoFocusableMenuNodes[] = [];\n\n let parseableParentNode = parentNode;\n // nesting a group node inside another group node is not allowed\n // I could not find a supporting explicit statement in the WCAG standard,\n // but given how everything else is defined and graphically represented,\n // it's the only logical conclusion.\n // Nesting would result in nodes being visually siblings\n // but logically non-exclusively selectable,\n // which would be a contradiction of the visuals\n // so violating the WCAG standard for other reasons\n if (isGroup(parentNode)) {\n if (!parentNode.parent) {\n throw TREE_STRUCTURE_ERRORS.GROUP_WITHOUT_PARENT;\n }\n parseableParentNode = parentNode.parent;\n }\n\n parseableParentNode.children.forEach((node) => {\n if (isFocusableNode(node)) {\n focusableSiblingsNodes.push(node);\n }\n // if we encounter a group node we need to add it's children too\n // (which here is guaranteed because we checked it in the if statement above)\n if (isGroup(node)) {\n node.children.forEach((groupChild) => {\n if (isFocusableNode(groupChild)) {\n focusableSiblingsNodes.push(groupChild);\n }\n });\n }\n });\n\n return focusableSiblingsNodes;\n};\n\n/**\n * This functions walks the tree downwards starting from the oldest shared parent and returns all the single-selectable items ids\n * @param oldestParent - the oldest parent to start the walk from\n * @returns string | number[] - the list of all the single-selectable items ids starting from the oldest shared group\n */\nexport const getAllSingleSelectIdsFromParent = (oldestParent: DSMenuButtonT.MenuNodesAllowedToHaveChildren) => {\n const singleSelectionableItemsIds: (string | number)[] = [];\n oldestParent.walk((node) => {\n // DSTree typescript doesn't understand ethereogeneous subitems, so we need to typecast manually\n const typeCastedNode = node as unknown as\n
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACKvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,uBAAuB,kCAAkC;AAE3D,MAAM,kBAAkB,CAAC,aAAqC;AACnE,QAAM,mBAAyD,CAAC;AAChE,WAAS,YAAY,CAAC,SAAS;AAE7B,QAAI,KAAK,SAAS,SAAS,KAAM,QAAO;AACxC,QAAI,kBAAkB,IAAI,GAAG;AAC3B,uBAAiB,KAAK,IAAI;AAAA,IAC5B;AACA,WAAO;AAAA,EACT,CAAC;AACD,SAAO,iBAAiB,QAAQ;AAClC;AAEO,MAAM,2BAA2B,CAAC,aAAqC;AAC5E,QAAM,EAAE,QAAQ,WAAW,IAAI;AAC/B,MAAI,CAAC,YAAY;AACf,YAAQ,IAAI,uCAAuC,QAAQ;AAC3D,UAAM,2BAA2B;AAAA,EACnC;AACA,MAAI,CAAC,gCAAgC,UAAU,GAAG;AAEhD,YAAQ,IAAI,cAAc,UAAU;AACpC,YAAQ,IAAI,YAAY,QAAQ;AAChC,UAAM,sBAAsB;AAAA,EAC9B;AAIA,QAAM,yBAAmE,CAAC;AAE1E,MAAI,sBAAsB;AAS1B,MAAI,QAAQ,UAAU,GAAG;AACvB,QAAI,CAAC,WAAW,QAAQ;AACtB,YAAM,sBAAsB;AAAA,IAC9B;AACA,0BAAsB,WAAW;AAAA,EACnC;AAEA,sBAAoB,SAAS,QAAQ,CAAC,SAAS;AAC7C,QAAI,gBAAgB,IAAI,GAAG;AACzB,6BAAuB,KAAK,IAAI;AAAA,IAClC;AAGA,QAAI,QAAQ,IAAI,GAAG;AACjB,WAAK,SAAS,QAAQ,CAAC,eAAe;AACpC,YAAI,gBAAgB,UAAU,GAAG;AAC/B,iCAAuB,KAAK,UAAU;AAAA,QACxC;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF,CAAC;AAED,SAAO;AACT;AAOO,MAAM,kCAAkC,CAAC,iBAA+D;AAC7G,QAAM,8BAAmD,CAAC;AAC1D,eAAa,KAAK,CAAC,SAAS;AAE1B,UAAM,iBAAiB;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-console */\n/* eslint-disable max-lines */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport type { DSMenuButtonT } from '../../../react-desc-prop-types.js';\nimport {\n isFocusableNode,\n isGroup,\n isMenuNodeAllowedToHaveChildren,\n isMultipleSelectNode,\n isSelectionableNode,\n isSelectionableWithSubmenuNode,\n isSingleSelectNode,\n isWithSubmenuNode,\n} from '../../../utils/nodesTypeguardsAndGetters.js';\nimport { TREE_STRUCTURE_ERRORS, UNEXPECTED_INTERNAL_ERRORS } from '../constants/Errors.js';\n\nexport const getSubMenusPath = (itemNode: DSMenuButtonT.MenuNode) => {\n const subMenuNodesPath: DSMenuButtonT.WithSubmenuMenuNodes[] = [];\n itemNode.walkParents((node) => {\n // discards itself, we want the parents only\n if (node.dsId === itemNode.dsId) return true;\n if (isWithSubmenuNode(node)) {\n subMenuNodesPath.push(node);\n }\n return true;\n });\n return subMenuNodesPath.reverse();\n};\n\nexport const getFocusableSiblingsList = (itemNode: DSMenuButtonT.MenuNode) => {\n const { parent: parentNode } = itemNode;\n if (!parentNode) {\n console.log('getFocusableSiblingsList > itemNode', itemNode);\n throw UNEXPECTED_INTERNAL_ERRORS.NODE_WITHOUT_PARENT;\n }\n if (!isMenuNodeAllowedToHaveChildren(parentNode)) {\n // this should be impossible to reach, if this is reached, there is a bug in the code/validation checks\n console.log('parentNode', parentNode);\n console.log('itemNode', itemNode);\n throw TREE_STRUCTURE_ERRORS.NODE_CANNOT_HAVE_CHILDREN;\n }\n // each tree depth may be composed of a mix of focusable and non-focusable nodes\n // in particular, the parent node may be a group node which is not focusable but it's children are (and are visually siblings)\n // we need to do our calculations only on top of focusable nodes, and we also need to consider the scenario of a group node\n const focusableSiblingsNodes: DSMenuButtonT.PseudoFocusableMenuNodes[] = [];\n\n let parseableParentNode = parentNode;\n // nesting a group node inside another group node is not allowed\n // I could not find a supporting explicit statement in the WCAG standard,\n // but given how everything else is defined and graphically represented,\n // it's the only logical conclusion.\n // Nesting would result in nodes being visually siblings\n // but logically non-exclusively selectable,\n // which would be a contradiction of the visuals\n // so violating the WCAG standard for other reasons\n if (isGroup(parentNode)) {\n if (!parentNode.parent) {\n throw TREE_STRUCTURE_ERRORS.GROUP_WITHOUT_PARENT;\n }\n parseableParentNode = parentNode.parent;\n }\n\n parseableParentNode.children.forEach((node) => {\n if (isFocusableNode(node)) {\n focusableSiblingsNodes.push(node);\n }\n // if we encounter a group node we need to add it's children too\n // (which here is guaranteed because we checked it in the if statement above)\n if (isGroup(node)) {\n node.children.forEach((groupChild) => {\n if (isFocusableNode(groupChild)) {\n focusableSiblingsNodes.push(groupChild);\n }\n });\n }\n });\n\n return focusableSiblingsNodes;\n};\n\n/**\n * This functions walks the tree downwards starting from the oldest shared parent and returns all the single-selectable items ids\n * @param oldestParent - the oldest parent to start the walk from\n * @returns string | number[] - the list of all the single-selectable items ids starting from the oldest shared group\n */\nexport const getAllSingleSelectIdsFromParent = (oldestParent: DSMenuButtonT.MenuNodesAllowedToHaveChildren) => {\n const singleSelectionableItemsIds: (string | number)[] = [];\n oldestParent.walk((node) => {\n // DSTree typescript doesn't understand ethereogeneous subitems, so we need to typecast manually\n const typeCastedNode = node as unknown as\n DSMenuButtonT.SingleSelectionableMenuNodes | DSMenuButtonT.MenuNodeSeparatorItem;\n // is the node is a single-selectable item, we add it to the list\n if (isSingleSelectNode(typeCastedNode)) {\n singleSelectionableItemsIds.push(node.dsId);\n }\n // we walk all the tree (from the shared group), we never shortcircuit\n return true;\n });\n return singleSelectionableItemsIds;\n};\n\n/**\n * walk all parents from a given node and gives back multiple supporting datastructures by different criterias\n *\n * @param menuNode\n * @returns {object} - an object holding different datastructures and information about the parents\n * @property {Object} oldestGroup - the oldest shared group\n * @property {Object[]} selectionableParentsWithSubmenu - the single/multiple selection parents with submenu\n * @property {Object[]} groupParents - all the 'groups' encountered while traversing the tree upwards\n */\nexport const getParentsByCriterias = (menuNode: DSMenuButtonT.MenuNode) => {\n // group\n let oldestGroupFoundSoFar: DSMenuButtonT.MenuNodeGroupItem;\n const selectionableParentsWithSubmenu: DSMenuButtonT.SelectionablesWithSubmenuMenuNodes[] = [];\n const groupParents: DSMenuButtonT.MenuNodeGroupItem[] = [];\n\n menuNode.walkParents((node) => {\n // discards itself, we want the parents only\n if (node.dsId === menuNode.dsId) return true;\n // DSTree is not able to understand ethereogeneous subitems, so we need to typecast manually\n const typeCastedNode = node as unknown as DSMenuButtonT.MenuNode;\n\n if (isGroup(typeCastedNode)) {\n oldestGroupFoundSoFar = typeCastedNode;\n groupParents.push(oldestGroupFoundSoFar);\n // nothing else to do in this walking step, returing true to continue the walk\n return true;\n }\n // we continue checking shared parents untill we see the pattern\n // group -> single-select-with-submenu -> group -> ...\n // the moment the parent of a group is not a single-select-with-submenu we can stop,\n // we have found the oldest shared group\n if (isSelectionableWithSubmenuNode(typeCastedNode)) {\n selectionableParentsWithSubmenu.push(typeCastedNode);\n return true;\n }\n // the node is not a single-select-with-submenu, we can stop the walk\n return true;\n });\n // if we found no group parent starting from menuNode, the tree is malformed\n // @ts-expect-error - typescript doesn't understand that \"walkParents\" actually executes the function synchronously\n // so it thinks that oldestGroupFoundSoFar was never assigned, it's a false positive\n if (!oldestGroupFoundSoFar) {\n console.log('node:', menuNode);\n console.log('parent:', menuNode.parent);\n throw TREE_STRUCTURE_ERRORS.PARENT_NOT_GROUP;\n }\n return {\n oldestGroup: oldestGroupFoundSoFar,\n selectionableParentsWithSubmenu,\n groupParents,\n };\n};\n\n/**\n * walk all childrens from a given node and gives back multiple supporting datastructures by different criterias\n *\n * @param menuNode\n * @returns {object} - an object holding different datastructures and information about the children\n * @property {Object[]} selectionableChilrens - the single/multiple selection children (regardless of the presence of a submenu)\n * @property {Object[]} multiSelectionableChilrens - the multiple selection children (regardless of the presence of a submenu)\n */\nexport const getChildrenByCriterias = (menuNode: DSMenuButtonT.MenuNode) => {\n const selectionableChilrens: DSMenuButtonT.SelectionableMenuNodes[] = [];\n const multiSelectionableChilrens: DSMenuButtonT.MultipleSelectionableMenuNodes[] = [];\n menuNode.walk((node) => {\n // discards itself, we want the children only\n if (node.dsId === menuNode.dsId) return true;\n // DSTree is not able to understand ethereogeneous subitems, so we need to typecast manually\n const typeCastedNode = node as unknown as DSMenuButtonT.MenuNode;\n if (isSelectionableNode(typeCastedNode)) {\n selectionableChilrens.push(typeCastedNode);\n if (isMultipleSelectNode(typeCastedNode)) {\n multiSelectionableChilrens.push(typeCastedNode);\n }\n }\n // we walk all the tree (from the shared group), we never shortcircuit\n return true;\n });\n return {\n selectionableChilrens,\n multiSelectionableChilrens,\n };\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACKvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,uBAAuB,kCAAkC;AAE3D,MAAM,kBAAkB,CAAC,aAAqC;AACnE,QAAM,mBAAyD,CAAC;AAChE,WAAS,YAAY,CAAC,SAAS;AAE7B,QAAI,KAAK,SAAS,SAAS,KAAM,QAAO;AACxC,QAAI,kBAAkB,IAAI,GAAG;AAC3B,uBAAiB,KAAK,IAAI;AAAA,IAC5B;AACA,WAAO;AAAA,EACT,CAAC;AACD,SAAO,iBAAiB,QAAQ;AAClC;AAEO,MAAM,2BAA2B,CAAC,aAAqC;AAC5E,QAAM,EAAE,QAAQ,WAAW,IAAI;AAC/B,MAAI,CAAC,YAAY;AACf,YAAQ,IAAI,uCAAuC,QAAQ;AAC3D,UAAM,2BAA2B;AAAA,EACnC;AACA,MAAI,CAAC,gCAAgC,UAAU,GAAG;AAEhD,YAAQ,IAAI,cAAc,UAAU;AACpC,YAAQ,IAAI,YAAY,QAAQ;AAChC,UAAM,sBAAsB;AAAA,EAC9B;AAIA,QAAM,yBAAmE,CAAC;AAE1E,MAAI,sBAAsB;AAS1B,MAAI,QAAQ,UAAU,GAAG;AACvB,QAAI,CAAC,WAAW,QAAQ;AACtB,YAAM,sBAAsB;AAAA,IAC9B;AACA,0BAAsB,WAAW;AAAA,EACnC;AAEA,sBAAoB,SAAS,QAAQ,CAAC,SAAS;AAC7C,QAAI,gBAAgB,IAAI,GAAG;AACzB,6BAAuB,KAAK,IAAI;AAAA,IAClC;AAGA,QAAI,QAAQ,IAAI,GAAG;AACjB,WAAK,SAAS,QAAQ,CAAC,eAAe;AACpC,YAAI,gBAAgB,UAAU,GAAG;AAC/B,iCAAuB,KAAK,UAAU;AAAA,QACxC;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF,CAAC;AAED,SAAO;AACT;AAOO,MAAM,kCAAkC,CAAC,iBAA+D;AAC7G,QAAM,8BAAmD,CAAC;AAC1D,eAAa,KAAK,CAAC,SAAS;AAE1B,UAAM,iBAAiB;AAGvB,QAAI,mBAAmB,cAAc,GAAG;AACtC,kCAA4B,KAAK,KAAK,IAAI;AAAA,IAC5C;AAEA,WAAO;AAAA,EACT,CAAC;AACD,SAAO;AACT;AAWO,MAAM,wBAAwB,CAAC,aAAqC;AAEzE,MAAI;AACJ,QAAM,kCAAsF,CAAC;AAC7F,QAAM,eAAkD,CAAC;AAEzD,WAAS,YAAY,CAAC,SAAS;AAE7B,QAAI,KAAK,SAAS,SAAS,KAAM,QAAO;AAExC,UAAM,iBAAiB;AAEvB,QAAI,QAAQ,cAAc,GAAG;AAC3B,8BAAwB;AACxB,mBAAa,KAAK,qBAAqB;AAEvC,aAAO;AAAA,IACT;AAKA,QAAI,+BAA+B,cAAc,GAAG;AAClD,sCAAgC,KAAK,cAAc;AACnD,aAAO;AAAA,IACT;AAEA,WAAO;AAAA,EACT,CAAC;AAID,MAAI,CAAC,uBAAuB;AAC1B,YAAQ,IAAI,SAAS,QAAQ;AAC7B,YAAQ,IAAI,WAAW,SAAS,MAAM;AACtC,UAAM,sBAAsB;AAAA,EAC9B;AACA,SAAO;AAAA,IACL,aAAa;AAAA,IACb;AAAA,IACA;AAAA,EACF;AACF;AAUO,MAAM,yBAAyB,CAAC,aAAqC;AAC1E,QAAM,wBAAgE,CAAC;AACvE,QAAM,6BAA6E,CAAC;AACpF,WAAS,KAAK,CAAC,SAAS;AAEtB,QAAI,KAAK,SAAS,SAAS,KAAM,QAAO;AAExC,UAAM,iBAAiB;AACvB,QAAI,oBAAoB,cAAc,GAAG;AACvC,4BAAsB,KAAK,cAAc;AACzC,UAAI,qBAAqB,cAAc,GAAG;AACxC,mCAA2B,KAAK,cAAc;AAAA,MAChD;AAAA,IACF;AAEA,WAAO;AAAA,EACT,CAAC;AACD,SAAO;AAAA,IACL;AAAA,IACA;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/DSMenuItemRendererFactory/react-desc-prop-types.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-empty-interface */\nimport type { DSPropTypesSchema, GlobalAttributesT, ValidationMap, XstyledProps } from '@elliemae/ds-props-helpers';\nimport {\n PropTypes,\n getPropsPerSlotPropTypes,\n globalAttributesPropTypes,\n xstyledPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type { DSMenuButtonT } from '../../react-desc-prop-types.js';\nimport type { DSFlyoutMenuT } from '../DSFlyoutMenu/react-desc-prop-types.js';\nimport { DSMenuItemRendererFactoryName, MENU_ITEM_RENDERER_FACTORY_SLOTS } from './constants/index.js';\n\nexport declare namespace DSMenuItemRendererFactoryT {\n /* Slot function-form prop arguments \u2014 one entry per slot in\n * MENU_ITEM_RENDERER_FACTORY_SLOTS. */\n export type SlotFunctionArguments = {\n dsMenuitemrendererfactoryRoot: () => object;\n dsMenuitemrendererfactoryGroupLabelWrapper: () => object;\n dsMenuitemrendererfactoryLabelWithLeftDecWrapper: () => object;\n dsMenuitemrendererfactoryRadioDotIndicator: () => object;\n };\n\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 {\n itemNode: DSMenuButtonT.MenuNode;\n FlyoutMenuCircularDepInject: React.ComponentType<DSFlyoutMenuT.Props>;\n }\n\n export interface DefaultProps {}\n\n export interface OptionalProps
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACEvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAIP,SAAS,+BAA+B,wCAAwC;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-empty-interface */\nimport type { DSPropTypesSchema, GlobalAttributesT, ValidationMap, XstyledProps } from '@elliemae/ds-props-helpers';\nimport {\n PropTypes,\n getPropsPerSlotPropTypes,\n globalAttributesPropTypes,\n xstyledPropTypes,\n} from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type { DSMenuButtonT } from '../../react-desc-prop-types.js';\nimport type { DSFlyoutMenuT } from '../DSFlyoutMenu/react-desc-prop-types.js';\nimport { DSMenuItemRendererFactoryName, MENU_ITEM_RENDERER_FACTORY_SLOTS } from './constants/index.js';\n\nexport declare namespace DSMenuItemRendererFactoryT {\n /* Slot function-form prop arguments \u2014 one entry per slot in\n * MENU_ITEM_RENDERER_FACTORY_SLOTS. */\n export type SlotFunctionArguments = {\n dsMenuitemrendererfactoryRoot: () => object;\n dsMenuitemrendererfactoryGroupLabelWrapper: () => object;\n dsMenuitemrendererfactoryLabelWithLeftDecWrapper: () => object;\n dsMenuitemrendererfactoryRadioDotIndicator: () => object;\n };\n\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 {\n itemNode: DSMenuButtonT.MenuNode;\n FlyoutMenuCircularDepInject: React.ComponentType<DSFlyoutMenuT.Props>;\n }\n\n export interface DefaultProps {}\n\n export interface OptionalProps extends TypescriptHelpersT.PropsForGlobalOnSlots<\n typeof DSMenuItemRendererFactoryName,\n typeof MENU_ITEM_RENDERER_FACTORY_SLOTS\n > {\n ItemRenderer?: DSMenuButtonT.ItemRendererT;\n }\n export interface Props\n extends\n Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLLIElement>, keyof OptionalProps | keyof XstyledProps>,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends\n DefaultProps,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLLIElement>, keyof OptionalProps | keyof XstyledProps>,\n XstyledProps,\n RequiredProps {}\n}\n\nexport const defaultProps: DSMenuItemRendererFactoryT.DefaultProps = {};\n\nexport const DSMenuItemRendererFactoryPropTypes: DSPropTypesSchema<DSMenuItemRendererFactoryT.Props> = {\n ...getPropsPerSlotPropTypes(DSMenuItemRendererFactoryName, MENU_ITEM_RENDERER_FACTORY_SLOTS),\n ...globalAttributesPropTypes,\n ...xstyledPropTypes,\n itemNode: PropTypes.object.description('The polymorphic item to render').isRequired,\n ItemRenderer: PropTypes.func.description('The custom item renderer'),\n FlyoutMenuCircularDepInject: PropTypes.func.description(\n 'Flyout menu component, passed to the factory to avoid circular dependency',\n ),\n};\n\nexport const DSMenuItemRendererFactoryPropTypesSchema =\n DSMenuItemRendererFactoryPropTypes as unknown as ValidationMap<DSMenuItemRendererFactoryT.Props>;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACEvB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAIP,SAAS,+BAA+B,wCAAwC;AAiDzE,MAAM,eAAwD,CAAC;AAE/D,MAAM,qCAA0F;AAAA,EACrG,GAAG,yBAAyB,+BAA+B,gCAAgC;AAAA,EAC3F,GAAG;AAAA,EACH,GAAG;AAAA,EACH,UAAU,UAAU,OAAO,YAAY,gCAAgC,EAAE;AAAA,EACzE,cAAc,UAAU,KAAK,YAAY,0BAA0B;AAAA,EACnE,6BAA6B,UAAU,KAAK;AAAA,IAC1C;AAAA,EACF;AACF;AAEO,MAAM,2CACX;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/DSOpinionatedButton/react-desc-prop-types.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-empty-interface */\nimport { DSButtonV3DefaultProps, DSButtonV3PropTypes } from '@elliemae/ds-button-v2';\nimport type { DSPropTypesSchema, ValidationMap } from '@elliemae/ds-props-helpers';\nimport { PropTypes, getPropsPerSlotPropTypes } from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type React from 'react';\nimport { DSMenuSpecificPropTypes, type DSMenuButtonT } from '../../react-desc-prop-types.js';\nimport { DSOpinionatedButtonName, OPINIONATED_BUTTON_SLOTS } from './constants/index.js';\n\nexport declare namespace DSOpinionatedButtonT {\n /* Slot function-form prop arguments \u2014 one entry per slot in OPINIONATED_BUTTON_SLOTS. */\n export type SlotFunctionArguments = {\n dsOpinionatedbuttonRoot: () => object;\n };\n\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
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,wBAAwB,2BAA2B;AAE5D,SAAS,WAAW,gCAAgC;AAGpD,SAAS,+BAAmD;AAC5D,SAAS,yBAAyB,gCAAgC;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-empty-interface */\nimport { DSButtonV3DefaultProps, DSButtonV3PropTypes } from '@elliemae/ds-button-v2';\nimport type { DSPropTypesSchema, ValidationMap } from '@elliemae/ds-props-helpers';\nimport { PropTypes, getPropsPerSlotPropTypes } from '@elliemae/ds-props-helpers';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type React from 'react';\nimport { DSMenuSpecificPropTypes, type DSMenuButtonT } from '../../react-desc-prop-types.js';\nimport { DSOpinionatedButtonName, OPINIONATED_BUTTON_SLOTS } from './constants/index.js';\n\nexport declare namespace DSOpinionatedButtonT {\n /* Slot function-form prop arguments \u2014 one entry per slot in OPINIONATED_BUTTON_SLOTS. */\n export type SlotFunctionArguments = {\n dsOpinionatedbuttonRoot: () => object;\n };\n\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\n TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSOpinionatedButtonName, typeof OPINIONATED_BUTTON_SLOTS>,\n DSMenuButtonT.ButtonInheritedOptionalProps {}\n\n export interface Props\n extends\n 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\n 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"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,wBAAwB,2BAA2B;AAE5D,SAAS,WAAW,gCAAgC;AAGpD,SAAS,+BAAmD;AAC5D,SAAS,yBAAyB,gCAAgC;AA+C3D,MAAM,eAAkD;AAAA,EAC7D,GAAG;AACL;AAEO,MAAM,+BAA8E;AAAA,EACzF,GAAG,yBAAyB,yBAAyB,wBAAwB;AAAA,EAC7E,GAAG;AAAA,EACH,mBAAmB,UAAU,MAAM,uBAAuB,EAAE,YAAY,gCAAgC,EAAE;AAAA,EAC1G,UAAU,UAAU,KAAK;AAAA,IACvB;AAAA,EACF,EAAE;AACJ;AAEO,MAAM,qCACX;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* 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';\nimport type { DSHookFloatingContextT } from '@elliemae/ds-floating-context';\n\nimport { DSMenuButtonName, MENU_BUTTON_SLOTS, type MENU_ITEMS_TYPES } from './constants/index.js';\nexport declare namespace DSMenuButtonT {\n /* *******************************************************\n * Slot function-form prop arguments \u2014 one entry per slot in MENU_BUTTON_SLOTS.\n * Backs the typescript-testing/slot-props.ts exhaustiveness check.\n ******************************************************* */\n export type SlotFunctionArguments = {\n dsMenubuttonRoot: () => object;\n };\n\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\n /* **************************************************************************************************************\n *********************************** POLYMORPHIC INTERFACES FOR MENU ITEMS *************************************\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 maxHeight?: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 maxHeight?: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 maxHeight?: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 maxHeight?: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\n disabled?: boolean;\n onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n onKeyDown?: (e: React.KeyboardEvent) => null;\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 maxHeight: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 | SingleSelectItem\n | SingleSelectWithSubmenuItem;\n\n export type PseudoFocusableItemInterface =\n | ActivableItem\n | ActionableWithSubmenuItem\n | SkeletonItem\n | MultipleSelectItem\n | MultiSelectWithSubmenuItem\n | WithSubmenuItem\n | SingleSelectItem\n | SingleSelectWithSubmenuItem;\n\n export type SelectionableMenuItemInterface =\n | MultipleSelectItem\n | MultiSelectWithSubmenuItem\n | SingleSelectItem\n | SingleSelectWithSubmenuItem;\n\n /* **************************************************************************************************************\n *************************** POLYMORPHIC INTERFACES FOR ITEMS USING DSTREE *************************************\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 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 /* **************************************************************************************************************\n ********************************** PROPS/INTERNAL PROPS DEFINITIONS *******************************************\n ************************************************************************************************************** */\n\n export type ItemRendererT = React.ComponentType<{ itemNode: MenuNode }>;\n\n /* **************************************************************************************************************\n ******************************************* \"REQUIRED\" PROPS **************************************************\n ************************************************************************************************************** */\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 export interface MenuBehaviouralLayerRequiredProps {}\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 ******************************************** \"DEFAULT\" PROPS **************************************************\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 maxHeight: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 ******************************************* \"OPTIONAL\" PROPS **************************************************\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 // **********************************************************************************************\n // IoC Pattern\n // - in scenarios where not \"selectionable\" items are present,\n // - the \"selectedItems\" prop is not required\n // - the \"onItemSelected\" prop is not required\n // - in scenarios where no \"activation\" items are present,\n // - the \"onActivateItem\" prop is not required\n // AFAIK Typescipt doesn't support this kind of \"conditional\" required props\n // so we will rely on javascript error throwing to handle this + documentation\n // **********************************************************************************************\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 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 floatingConfig?: Partial<Omit<DSHookFloatingContextT.Props, 'externallyControlledIsOpen' | 'onOpen' | 'onClose'>>;\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 // we convert the (selected) options to a Nodes as part of the widget's logic\n MenuBehaviouralLayerOptionalProps,\n TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSMenuButtonName, typeof MENU_BUTTON_SLOTS> {\n // we convert the (selected) options to a Nodes as part of the widget's logic\n selectedItems?: SelectionableMenuNodes[] | SelectionableMenuItemInterface[];\n }\n\n /* **************************************************************************************************************\n ************************************************ PROPS *******************************************************\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\n extends RequiredProps,\n Partial<DefaultProps>,\n OptionalProps,\n // the global and xstyled props are only part of \"props\"/\"internalProps\" in our namespaces\n // to properly inherith button's global & xstyled props, we need to also include the following\n Omit<DSButtonV3T.Props, keyof RequiredProps | keyof DefaultProps | keyof OptionalProps> {}\n\n /* **************************************************************************************************************\n ******************************************** INTERNAL PROPS ***************************************************\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\n extends RequiredProps,\n DefaultProps,\n OptionalProps,\n // the global and xstyled props are only part of \"props\"/\"internalProps\" in our namespaces\n // to properly inherith button's global & xstyled props, we need to also include the following\n Omit<DSButtonV3T.Props, keyof RequiredProps | keyof DefaultProps | keyof OptionalProps> {}\n}\n\nexport const menuSpecificDefaultProps: DSMenuButtonT.MenuSpecifiDefaultProps = {\n onClickOutside: () => null,\n onOptionClick: () => null,\n openedSubmenus: {},\n onSubmenuToggle: () => null,\n isLoading: false,\n isSkeleton: false,\n maxHeight: '256px', // was available in dropdownmenu-v2, have to provide for retrocompatibility\n};\n/* *******************************************************\n * We are building a widget composed of 3 ATOMIC composition components\n * - Button\n * - Menu\n * - Behavioural Layer\n * The final API facing the users is a sum of all 3 interfaces\n * THOSE INTERFACES ARE NOT EQUAL TO THE FINAL \"PARTS\" INTERFACES\n * The widget embeds \"assumptions\" (as all widgets do) that are AGNOSTIC to the \"parts\" interfaces\n * The \"Parts\" interfaces \"mostly\" inherit the following interfaces, but with meaningful meant and planned differences\n * (E.G. the widget accepts an array of options, but the Menu part accepts a DSTree only)\n ******************************************************* */\nexport const MenuBehaviouralLayerPropTypes: DSPropTypesSchema<DSMenuButtonT.MenuBehaviouralLayerProps> = {\n onItemSelected: PropTypes.func.description(\n 'IoC function in charge of handling the selection of a menu item, required if the menu has selectionable items',\n ).signature(`((\n newSelection: DSMenuButtonT.PseudoFocusableMenuNodes[],\n metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },\n ) => void)`),\n\n onActivateItem: PropTypes.func.description(\n 'IoC function in charge of handling the activation (NOT INVOKED ON SELECTION) of a menu item, required if the menu has activable items',\n ).signature(`((\n itemNode: DSMenuButtonT.PseudoFocusableMenuNodes,\n metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },\n ) => void)`),\n\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 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 maxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number])\n .description('The maximum height of the flyout menu')\n .defaultValue('256px'),\n floatingConfig: PropTypes.object.description(\n 'Configuration object for the floating context (placement, placementOrderPreference, customOffset, animationDuration, withoutPortal, withoutAnimation, portalDOMContainer)',\n ),\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 selectedItems: PropTypes.arrayOf(PropTypes.object).description(\n 'an array of tree-nodes or tree-items that have to be marked as selected in the GUI, required if the menu has selectionable items',\n ),\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"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,WAAW,gCAAgC;AACpD,SAAS,2BAA2B;AAOpC,SAAS,kBAAkB,yBAAgD;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* 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';\nimport type { DSHookFloatingContextT } from '@elliemae/ds-floating-context';\n\nimport { DSMenuButtonName, MENU_BUTTON_SLOTS, type MENU_ITEMS_TYPES } from './constants/index.js';\nexport declare namespace DSMenuButtonT {\n /* *******************************************************\n * Slot function-form prop arguments \u2014 one entry per slot in MENU_BUTTON_SLOTS.\n * Backs the typescript-testing/slot-props.ts exhaustiveness check.\n ******************************************************* */\n export type SlotFunctionArguments = {\n dsMenubuttonRoot: () => object;\n };\n\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\n /* **************************************************************************************************************\n *********************************** POLYMORPHIC INTERFACES FOR MENU ITEMS *************************************\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 maxHeight?: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 maxHeight?: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 maxHeight?: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 maxHeight?: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\n disabled?: boolean;\n onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n onKeyDown?: (e: React.KeyboardEvent) => null;\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 maxHeight: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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 | SingleSelectItem\n | SingleSelectWithSubmenuItem;\n\n export type PseudoFocusableItemInterface =\n | ActivableItem\n | ActionableWithSubmenuItem\n | SkeletonItem\n | MultipleSelectItem\n | MultiSelectWithSubmenuItem\n | WithSubmenuItem\n | SingleSelectItem\n | SingleSelectWithSubmenuItem;\n\n export type SelectionableMenuItemInterface =\n MultipleSelectItem | MultiSelectWithSubmenuItem | SingleSelectItem | SingleSelectWithSubmenuItem;\n\n /* **************************************************************************************************************\n *************************** POLYMORPHIC INTERFACES FOR ITEMS USING DSTREE *************************************\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 SelectionableMenuNodes =\n | DSMenuButtonT.MenuNodeMultipleSelectItem\n | DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem\n | DSMenuButtonT.MenuNodeSingleSelectItem\n | DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem;\n\n export type MultipleSelectionableMenuNodes =\n DSMenuButtonT.MenuNodeMultipleSelectItem | DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem;\n\n export type SingleSelectionableMenuNodes =\n DSMenuButtonT.MenuNodeSingleSelectItem | 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 | DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem;\n\n /* **************************************************************************************************************\n ********************************** PROPS/INTERNAL PROPS DEFINITIONS *******************************************\n ************************************************************************************************************** */\n\n export type ItemRendererT = React.ComponentType<{ itemNode: MenuNode }>;\n\n /* **************************************************************************************************************\n ******************************************* \"REQUIRED\" PROPS **************************************************\n ************************************************************************************************************** */\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 export interface MenuBehaviouralLayerRequiredProps {}\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, ButtonInheritedRequiredProps, 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 ******************************************** \"DEFAULT\" PROPS **************************************************\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 maxHeight: string | number; // was available in dropdownmenu-v2, have to provide for retrocompatibility\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, ButtonInheiredDefaultProps, MenuBehaviouralLayerDefaultProps {}\n\n /* **************************************************************************************************************\n ******************************************* \"OPTIONAL\" PROPS **************************************************\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 // **********************************************************************************************\n // IoC Pattern\n // - in scenarios where not \"selectionable\" items are present,\n // - the \"selectedItems\" prop is not required\n // - the \"onItemSelected\" prop is not required\n // - in scenarios where no \"activation\" items are present,\n // - the \"onActivateItem\" prop is not required\n // AFAIK Typescipt doesn't support this kind of \"conditional\" required props\n // so we will rely on javascript error throwing to handle this + documentation\n // **********************************************************************************************\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 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 floatingConfig?: Partial<Omit<DSHookFloatingContextT.Props, 'externallyControlledIsOpen' | 'onOpen' | 'onClose'>>;\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\n MenuSpecificOptionalProps,\n ButtonInheritedOptionalProps,\n // we convert the (selected) options to a Nodes as part of the widget's logic\n MenuBehaviouralLayerOptionalProps,\n TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSMenuButtonName, typeof MENU_BUTTON_SLOTS> {\n // we convert the (selected) options to a Nodes as part of the widget's logic\n selectedItems?: SelectionableMenuNodes[] | SelectionableMenuItemInterface[];\n }\n\n /* **************************************************************************************************************\n ************************************************ PROPS *******************************************************\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\n Partial<MenuBehaviouralLayerDefaultProps>,\n MenuBehaviouralLayerOptionalProps,\n MenuBehaviouralLayerRequiredProps {}\n export interface MenuSpecificProps\n extends Partial<MenuSpecifiDefaultProps>, MenuSpecificOptionalProps, 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\n extends\n RequiredProps,\n Partial<DefaultProps>,\n OptionalProps,\n // the global and xstyled props are only part of \"props\"/\"internalProps\" in our namespaces\n // to properly inherith button's global & xstyled props, we need to also include the following\n Omit<DSButtonV3T.Props, keyof RequiredProps | keyof DefaultProps | keyof OptionalProps> {}\n\n /* **************************************************************************************************************\n ******************************************** INTERNAL PROPS ***************************************************\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, MenuBehaviouralLayerOptionalProps, MenuBehaviouralLayerRequiredProps {}\n export interface MenuSpecificInternalProps\n extends MenuSpecifiDefaultProps, MenuSpecificOptionalProps, 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\n extends\n RequiredProps,\n DefaultProps,\n OptionalProps,\n // the global and xstyled props are only part of \"props\"/\"internalProps\" in our namespaces\n // to properly inherith button's global & xstyled props, we need to also include the following\n Omit<DSButtonV3T.Props, keyof RequiredProps | keyof DefaultProps | keyof OptionalProps> {}\n}\n\nexport const menuSpecificDefaultProps: DSMenuButtonT.MenuSpecifiDefaultProps = {\n onClickOutside: () => null,\n onOptionClick: () => null,\n openedSubmenus: {},\n onSubmenuToggle: () => null,\n isLoading: false,\n isSkeleton: false,\n maxHeight: '256px', // was available in dropdownmenu-v2, have to provide for retrocompatibility\n};\n/* *******************************************************\n * We are building a widget composed of 3 ATOMIC composition components\n * - Button\n * - Menu\n * - Behavioural Layer\n * The final API facing the users is a sum of all 3 interfaces\n * THOSE INTERFACES ARE NOT EQUAL TO THE FINAL \"PARTS\" INTERFACES\n * The widget embeds \"assumptions\" (as all widgets do) that are AGNOSTIC to the \"parts\" interfaces\n * The \"Parts\" interfaces \"mostly\" inherit the following interfaces, but with meaningful meant and planned differences\n * (E.G. the widget accepts an array of options, but the Menu part accepts a DSTree only)\n ******************************************************* */\nexport const MenuBehaviouralLayerPropTypes: DSPropTypesSchema<DSMenuButtonT.MenuBehaviouralLayerProps> = {\n onItemSelected: PropTypes.func.description(\n 'IoC function in charge of handling the selection of a menu item, required if the menu has selectionable items',\n ).signature(`((\n newSelection: DSMenuButtonT.PseudoFocusableMenuNodes[],\n metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },\n ) => void)`),\n\n onActivateItem: PropTypes.func.description(\n 'IoC function in charge of handling the activation (NOT INVOKED ON SELECTION) of a menu item, required if the menu has activable items',\n ).signature(`((\n itemNode: DSMenuButtonT.PseudoFocusableMenuNodes,\n metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },\n ) => void)`),\n\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 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 maxHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number])\n .description('The maximum height of the flyout menu')\n .defaultValue('256px'),\n floatingConfig: PropTypes.object.description(\n 'Configuration object for the floating context (placement, placementOrderPreference, customOffset, animationDuration, withoutPortal, withoutAnimation, portalDOMContainer)',\n ),\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 selectedItems: PropTypes.arrayOf(PropTypes.object).description(\n 'an array of tree-nodes or tree-items that have to be marked as selected in the GUI, required if the menu has selectionable items',\n ),\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"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,WAAW,gCAAgC;AACpD,SAAS,2BAA2B;AAOpC,SAAS,kBAAkB,yBAAgD;AAqdpE,MAAM,2BAAkE;AAAA,EAC7E,gBAAgB,MAAM;AAAA,EACtB,eAAe,MAAM;AAAA,EACrB,gBAAgB,CAAC;AAAA,EACjB,iBAAiB,MAAM;AAAA,EACvB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,WAAW;AAAA;AACb;AAYO,MAAM,gCAA4F;AAAA,EACvG,gBAAgB,UAAU,KAAK;AAAA,IAC7B;AAAA,EACF,EAAE,UAAU;AAAA;AAAA;AAAA,eAGC;AAAA,EAEb,gBAAgB,UAAU,KAAK;AAAA,IAC7B;AAAA,EACF,EAAE,UAAU;AAAA;AAAA;AAAA,eAGC;AAAA,EAEb,QAAQ,UAAU,KAAK,YAAY,mDAAmD,EAAE,UAAU,YAAY;AAAA,EAC9G,SAAS,UAAU,KAAK,YAAY,oDAAoD,EAAE,UAAU,YAAY;AAAA,EAChH,0BAA0B,UAAU,KAAK,YAAY,gEAAgE,EAClH,UAAU;AAAA;AAAA;AAAA,eAGA;AACf;AAEO,MAAM,0BAA8E;AAAA,EACzF,cAAc,UAAU,KAAK,YAAY,0CAA0C;AAAA,EACnF,gBAAgB,UAAU,KACvB,YAAY,kFAAkF,EAC9F,aAAa,MAAM,IAAI;AAAA,EAC1B,eAAe,UAAU,KACtB;AAAA,IACC;AAAA,EACF,EACC,aAAa,MAAM,IAAI;AAAA,EAC1B,gBAAgB,UAAU,OACvB;AAAA,IACC;AAAA,EACF,EACC,aAAa,CAAC,CAAC;AAAA,EAClB,iBAAiB,UAAU,KACxB,YAAY,wDAAwD,EACpE;AAAA,IACC;AAAA,EACF,EACC,aAAa,MAAM,IAAI;AAAA,EAC1B,WAAW,UAAU,KAClB,YAAY,6DAA6D,EACzE,aAAa,KAAK;AAAA,EACrB,YAAY,UAAU,KAAK,YAAY,oDAAoD,EAAE,aAAa,KAAK;AAAA,EAC/G,WAAW,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,MAAM,CAAC,EAChE,YAAY,uCAAuC,EACnD,aAAa,OAAO;AAAA,EACvB,gBAAgB,UAAU,OAAO;AAAA,IAC/B;AAAA,EACF;AACF;AAEO,MAAM,wBAAgE;AAAA,EAC3E,SAAS,UAAU,UAAU,CAAC,UAAU,OAAO,UAAU,MAAM,CAAC,EAAE;AAAA,IAChE;AAAA,EACF,EAAE;AAAA,EACF,eAAe,UAAU,QAAQ,UAAU,MAAM,EAAE;AAAA,IACjD;AAAA,EACF;AAAA,EACA,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG,yBAAyB,kBAAkB,iBAAiB;AACjE;AAEO,MAAM,8BAA8B;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -19,15 +19,15 @@ export declare const useOpinionatedButton: (propsFromUser: DSOpinionatedButtonT.
|
|
|
19
19
|
};
|
|
20
20
|
floatingStyles: React.CSSProperties;
|
|
21
21
|
handlers: {
|
|
22
|
-
onMouseEnter:
|
|
23
|
-
onMouseLeave:
|
|
24
|
-
onFocus:
|
|
25
|
-
onBlur:
|
|
22
|
+
onMouseEnter: React.MouseEventHandler<Element>;
|
|
23
|
+
onMouseLeave: React.MouseEventHandler<Element>;
|
|
24
|
+
onFocus: React.FocusEventHandler<Element>;
|
|
25
|
+
onBlur: React.FocusEventHandler<Element>;
|
|
26
26
|
};
|
|
27
27
|
isOpen: boolean;
|
|
28
28
|
arrowStyles: import("@elliemae/ds-floating-context/dist/types/parts/PopoverArrow.js").PopoverArrowT;
|
|
29
|
-
hideTooltip: () => void;
|
|
30
|
-
showTooltip: () => void;
|
|
29
|
+
hideTooltip: (event?: React.FocusEvent | React.MouseEvent | KeyboardEvent) => void;
|
|
30
|
+
showTooltip: (event?: React.FocusEvent | React.MouseEvent | React.KeyboardEvent) => void;
|
|
31
31
|
context: {
|
|
32
32
|
withoutPortal: boolean;
|
|
33
33
|
withoutAnimation: boolean;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-menu-button",
|
|
3
|
-
"version": "3.70.0-next.
|
|
3
|
+
"version": "3.70.0-next.54",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Menu Button",
|
|
6
6
|
"files": [
|
|
@@ -36,22 +36,22 @@
|
|
|
36
36
|
"indent": 4
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
|
-
"@elliemae/ds-button-v2": "3.70.0-next.
|
|
40
|
-
"@elliemae/ds-
|
|
41
|
-
"@elliemae/ds-
|
|
42
|
-
"@elliemae/ds-
|
|
43
|
-
"@elliemae/ds-
|
|
44
|
-
"@elliemae/ds-
|
|
45
|
-
"@elliemae/ds-
|
|
46
|
-
"@elliemae/ds-
|
|
47
|
-
"@elliemae/ds-tree-model": "3.70.0-next.
|
|
39
|
+
"@elliemae/ds-button-v2": "3.70.0-next.54",
|
|
40
|
+
"@elliemae/ds-grid": "3.70.0-next.54",
|
|
41
|
+
"@elliemae/ds-floating-context": "3.70.0-next.54",
|
|
42
|
+
"@elliemae/ds-hooks-on-blur-out": "3.70.0-next.54",
|
|
43
|
+
"@elliemae/ds-props-helpers": "3.70.0-next.54",
|
|
44
|
+
"@elliemae/ds-icons": "3.70.0-next.54",
|
|
45
|
+
"@elliemae/ds-menu-items-commons": "3.70.0-next.54",
|
|
46
|
+
"@elliemae/ds-system": "3.70.0-next.54",
|
|
47
|
+
"@elliemae/ds-tree-model": "3.70.0-next.54"
|
|
48
48
|
},
|
|
49
49
|
"devDependencies": {
|
|
50
50
|
"@elliemae/pui-theme": "~2.13.0",
|
|
51
51
|
"jest": "^30.0.0",
|
|
52
52
|
"styled-components": "~5.3.9",
|
|
53
|
-
"@elliemae/ds-monorepo-devops": "3.70.0-next.
|
|
54
|
-
"@elliemae/ds-typescript-helpers": "3.70.0-next.
|
|
53
|
+
"@elliemae/ds-monorepo-devops": "3.70.0-next.54",
|
|
54
|
+
"@elliemae/ds-typescript-helpers": "3.70.0-next.54"
|
|
55
55
|
},
|
|
56
56
|
"peerDependencies": {
|
|
57
57
|
"@testing-library/jest-dom": "^6.6.3",
|