@elliemae/ds-menu-button 3.46.0-rc.1 → 3.46.0-rc.11
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/cjs/config/useMenuButton.js +10 -19
- package/dist/cjs/config/useMenuButton.js.map +2 -2
- package/dist/cjs/config/useSplitInherithedProps.js +33 -15
- package/dist/cjs/config/useSplitInherithedProps.js.map +2 -2
- package/dist/cjs/index.js +2 -0
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/parts/DSFlyoutMenu/DSFlyoutMenu.js +36 -12
- package/dist/cjs/parts/DSFlyoutMenu/DSFlyoutMenu.js.map +3 -3
- package/dist/cjs/parts/DSFlyoutMenu/react-desc-prop-types.js +1 -1
- package/dist/cjs/parts/DSFlyoutMenu/react-desc-prop-types.js.map +3 -3
- package/dist/cjs/parts/DSMenuBehaviouralContextProvider/config/useAdvancedValidation.js +86 -0
- package/dist/cjs/parts/DSMenuBehaviouralContextProvider/config/useAdvancedValidation.js.map +7 -0
- package/dist/cjs/parts/DSMenuBehaviouralContextProvider/config/useFocusTracker.js +40 -30
- package/dist/cjs/parts/DSMenuBehaviouralContextProvider/config/useFocusTracker.js.map +2 -2
- package/dist/cjs/parts/DSMenuBehaviouralContextProvider/config/useMenuBehaviouralContextProvider.js +2 -0
- package/dist/cjs/parts/DSMenuBehaviouralContextProvider/config/useMenuBehaviouralContextProvider.js.map +2 -2
- package/dist/cjs/parts/DSMenuBehaviouralContextProvider/config/useMenuItemEventsHandlers.js +77 -33
- package/dist/cjs/parts/DSMenuBehaviouralContextProvider/config/useMenuItemEventsHandlers.js.map +2 -2
- package/dist/cjs/parts/DSMenuBehaviouralContextProvider/react-desc-prop-types.js +3 -0
- package/dist/cjs/parts/DSMenuBehaviouralContextProvider/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/parts/DSMenuBehaviouralContextProvider/utils/multipleSelectionHelpers.js +14 -14
- package/dist/cjs/parts/DSMenuBehaviouralContextProvider/utils/multipleSelectionHelpers.js.map +1 -1
- package/dist/cjs/parts/DSMenuBehaviouralContextProvider/utils/singleSelectionHelpers.js +2 -2
- package/dist/cjs/parts/DSMenuBehaviouralContextProvider/utils/singleSelectionHelpers.js.map +1 -1
- package/dist/cjs/parts/DSMenuItemRendererFactory/ActivableMenuItem.js +13 -9
- package/dist/cjs/parts/DSMenuItemRendererFactory/ActivableMenuItem.js.map +2 -2
- package/dist/cjs/parts/DSMenuItemRendererFactory/ActivableWithSubmenuMenuItem.js +13 -9
- package/dist/cjs/parts/DSMenuItemRendererFactory/ActivableWithSubmenuMenuItem.js.map +2 -2
- package/dist/cjs/parts/DSMenuItemRendererFactory/DSMenuItemRendererFactory.js +10 -9
- package/dist/cjs/parts/DSMenuItemRendererFactory/DSMenuItemRendererFactory.js.map +2 -2
- package/dist/cjs/parts/DSMenuItemRendererFactory/MultipleSelectMenuItem.js +15 -11
- package/dist/cjs/parts/DSMenuItemRendererFactory/MultipleSelectMenuItem.js.map +2 -2
- package/dist/cjs/parts/DSMenuItemRendererFactory/MultipleSelectWithSubmenuMenuItem.js +18 -12
- package/dist/cjs/parts/DSMenuItemRendererFactory/MultipleSelectWithSubmenuMenuItem.js.map +2 -2
- package/dist/cjs/parts/DSMenuItemRendererFactory/SingleSelectMenuItem.js +15 -11
- package/dist/cjs/parts/DSMenuItemRendererFactory/SingleSelectMenuItem.js.map +2 -2
- package/dist/cjs/parts/DSMenuItemRendererFactory/SingleSelectWithSubmenuMenuItem.js +15 -11
- package/dist/cjs/parts/DSMenuItemRendererFactory/SingleSelectWithSubmenuMenuItem.js.map +2 -2
- package/dist/cjs/parts/DSMenuItemRendererFactory/SkeletonMenuItem.js +112 -0
- package/dist/cjs/parts/DSMenuItemRendererFactory/SkeletonMenuItem.js.map +7 -0
- package/dist/cjs/parts/DSMenuItemRendererFactory/WithSubmenuMenuItem.js +13 -9
- package/dist/cjs/parts/DSMenuItemRendererFactory/WithSubmenuMenuItem.js.map +2 -2
- package/dist/cjs/parts/DSMenuItemRendererFactory/config/useMenuItemRendererFactory.js +1 -1
- package/dist/cjs/parts/DSMenuItemRendererFactory/config/useMenuItemRendererFactory.js.map +2 -2
- package/dist/cjs/parts/DSMenuItemRendererFactory/focusNodeRacingConditionSolved.js +43 -0
- package/dist/cjs/parts/DSMenuItemRendererFactory/focusNodeRacingConditionSolved.js.map +7 -0
- 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 +16 -15
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/utils/nodesTypeguardsAndGetters.js +18 -56
- package/dist/cjs/utils/nodesTypeguardsAndGetters.js.map +2 -2
- package/dist/cjs/utils/useOptionsArrayToDsTree.js +10 -3
- package/dist/cjs/utils/useOptionsArrayToDsTree.js.map +2 -2
- package/dist/esm/config/useMenuButton.js +11 -20
- package/dist/esm/config/useMenuButton.js.map +2 -2
- package/dist/esm/config/useSplitInherithedProps.js +33 -15
- package/dist/esm/config/useSplitInherithedProps.js.map +2 -2
- package/dist/esm/index.js +2 -0
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/parts/DSFlyoutMenu/DSFlyoutMenu.js +34 -10
- package/dist/esm/parts/DSFlyoutMenu/DSFlyoutMenu.js.map +2 -2
- package/dist/esm/parts/DSFlyoutMenu/react-desc-prop-types.js +1 -4
- package/dist/esm/parts/DSFlyoutMenu/react-desc-prop-types.js.map +2 -2
- package/dist/esm/parts/DSMenuBehaviouralContextProvider/config/useAdvancedValidation.js +56 -0
- package/dist/esm/parts/DSMenuBehaviouralContextProvider/config/useAdvancedValidation.js.map +7 -0
- package/dist/esm/parts/DSMenuBehaviouralContextProvider/config/useFocusTracker.js +40 -30
- package/dist/esm/parts/DSMenuBehaviouralContextProvider/config/useFocusTracker.js.map +2 -2
- package/dist/esm/parts/DSMenuBehaviouralContextProvider/config/useMenuBehaviouralContextProvider.js +2 -0
- package/dist/esm/parts/DSMenuBehaviouralContextProvider/config/useMenuBehaviouralContextProvider.js.map +2 -2
- package/dist/esm/parts/DSMenuBehaviouralContextProvider/config/useMenuItemEventsHandlers.js +77 -33
- package/dist/esm/parts/DSMenuBehaviouralContextProvider/config/useMenuItemEventsHandlers.js.map +2 -2
- package/dist/esm/parts/DSMenuBehaviouralContextProvider/react-desc-prop-types.js +3 -0
- package/dist/esm/parts/DSMenuBehaviouralContextProvider/react-desc-prop-types.js.map +2 -2
- package/dist/esm/parts/DSMenuBehaviouralContextProvider/utils/multipleSelectionHelpers.js +14 -14
- package/dist/esm/parts/DSMenuBehaviouralContextProvider/utils/multipleSelectionHelpers.js.map +1 -1
- package/dist/esm/parts/DSMenuBehaviouralContextProvider/utils/singleSelectionHelpers.js +2 -2
- package/dist/esm/parts/DSMenuBehaviouralContextProvider/utils/singleSelectionHelpers.js.map +1 -1
- package/dist/esm/parts/DSMenuItemRendererFactory/ActivableMenuItem.js +13 -9
- package/dist/esm/parts/DSMenuItemRendererFactory/ActivableMenuItem.js.map +2 -2
- package/dist/esm/parts/DSMenuItemRendererFactory/ActivableWithSubmenuMenuItem.js +13 -9
- package/dist/esm/parts/DSMenuItemRendererFactory/ActivableWithSubmenuMenuItem.js.map +2 -2
- package/dist/esm/parts/DSMenuItemRendererFactory/DSMenuItemRendererFactory.js +19 -18
- package/dist/esm/parts/DSMenuItemRendererFactory/DSMenuItemRendererFactory.js.map +2 -2
- package/dist/esm/parts/DSMenuItemRendererFactory/MultipleSelectMenuItem.js +15 -11
- package/dist/esm/parts/DSMenuItemRendererFactory/MultipleSelectMenuItem.js.map +2 -2
- package/dist/esm/parts/DSMenuItemRendererFactory/MultipleSelectWithSubmenuMenuItem.js +18 -12
- package/dist/esm/parts/DSMenuItemRendererFactory/MultipleSelectWithSubmenuMenuItem.js.map +2 -2
- package/dist/esm/parts/DSMenuItemRendererFactory/SingleSelectMenuItem.js +15 -11
- package/dist/esm/parts/DSMenuItemRendererFactory/SingleSelectMenuItem.js.map +2 -2
- package/dist/esm/parts/DSMenuItemRendererFactory/SingleSelectWithSubmenuMenuItem.js +15 -11
- package/dist/esm/parts/DSMenuItemRendererFactory/SingleSelectWithSubmenuMenuItem.js.map +2 -2
- package/dist/esm/parts/DSMenuItemRendererFactory/SkeletonMenuItem.js +82 -0
- package/dist/esm/parts/DSMenuItemRendererFactory/SkeletonMenuItem.js.map +7 -0
- package/dist/esm/parts/DSMenuItemRendererFactory/WithSubmenuMenuItem.js +13 -9
- package/dist/esm/parts/DSMenuItemRendererFactory/WithSubmenuMenuItem.js.map +2 -2
- package/dist/esm/parts/DSMenuItemRendererFactory/config/useMenuItemRendererFactory.js +1 -1
- package/dist/esm/parts/DSMenuItemRendererFactory/config/useMenuItemRendererFactory.js.map +2 -2
- package/dist/esm/parts/DSMenuItemRendererFactory/focusNodeRacingConditionSolved.js +13 -0
- package/dist/esm/parts/DSMenuItemRendererFactory/focusNodeRacingConditionSolved.js.map +7 -0
- package/dist/esm/parts/DSMenuItemRendererFactory/react-desc-prop-types.js.map +2 -2
- package/dist/esm/parts/DSOpinionatedButton/react-desc-prop-types.js +1 -1
- package/dist/esm/parts/DSOpinionatedButton/react-desc-prop-types.js.map +2 -2
- package/dist/esm/react-desc-prop-types.js +16 -15
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/dist/esm/utils/nodesTypeguardsAndGetters.js +18 -56
- package/dist/esm/utils/nodesTypeguardsAndGetters.js.map +2 -2
- package/dist/esm/utils/useOptionsArrayToDsTree.js +10 -3
- package/dist/esm/utils/useOptionsArrayToDsTree.js.map +2 -2
- package/dist/types/config/useSplitInherithedProps.d.ts +8 -9
- package/dist/types/index.d.ts +1 -1
- package/dist/types/parts/DSFlyoutMenu/react-desc-prop-types.d.ts +1 -1
- package/dist/types/parts/DSMenuBehaviouralContextProvider/config/useAdvancedValidation.d.ts +6 -0
- package/dist/types/parts/DSMenuBehaviouralContextProvider/config/useFocusTracker.d.ts +6 -6
- package/dist/types/parts/DSMenuBehaviouralContextProvider/config/useMenuItemEventsHandlers.d.ts +2 -1
- package/dist/types/parts/DSMenuBehaviouralContextProvider/react-desc-prop-types.d.ts +1 -0
- package/dist/types/parts/DSMenuBehaviouralContextProvider/utils/multipleSelectionHelpers.d.ts +3 -3
- package/dist/types/parts/DSMenuBehaviouralContextProvider/utils/singleSelectionHelpers.d.ts +2 -2
- package/dist/types/parts/DSMenuItemRendererFactory/SkeletonMenuItem.d.ts +5 -0
- package/dist/types/parts/DSMenuItemRendererFactory/focusNodeRacingConditionSolved.d.ts +2 -0
- package/dist/types/parts/DSMenuItemRendererFactory/react-desc-prop-types.d.ts +2 -2
- package/dist/types/parts/DSOpinionatedButton/config/useOpinionatedButton.d.ts +1 -1
- package/dist/types/parts/DSOpinionatedButton/react-desc-prop-types.d.ts +1 -1
- package/dist/types/react-desc-prop-types.d.ts +23 -17
- package/dist/types/utils/nodesTypeguardsAndGetters.d.ts +113 -1
- package/dist/types/utils/useOptionsArrayToDsTree.d.ts +2 -1
- package/package.json +12 -13
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"version": 3,
|
3
3
|
"sources": ["../../../../src/parts/DSMenuItemRendererFactory/WithSubmenuMenuItem.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
4
|
-
"sourcesContent": ["import { ChevronSmallRight } from '@elliemae/ds-icons';\nimport {\n StyleMenuItemLabel,\n StyleMenuItemSecondaryLabel,\n StyledContentWrapper,\n StyledGlobalMenuItemWrapper,\n} from '@elliemae/ds-menu-items-commons';\nimport { useFloatingContext, type DSHookFloatingContextT } from '@elliemae/ds-floating-context';\nimport React from 'react';\nimport type { DSMenuButtonT } from '../../react-desc-prop-types.js';\nimport { MenuBehaviouralContextProviderContext } from '../DSMenuBehaviouralContextProvider/MenuBehaviouralContextProviderCTX.js';\nimport { MENU_FOCUS_REGIONS } from '../DSMenuBehaviouralContextProvider/constants/index.js';\nimport { type DSMenuItemRendererFactoryT } from './react-desc-prop-types.js';\n\nconst placementOrderPreference: Required<DSHookFloatingContextT.Props>['placementOrderPreference'] = [\n 'right-start',\n 'right-start',\n 'right',\n 'left-start',\n 'left-end',\n 'left',\n];\nexport const WithSubmenuMenuItem: React.ComponentType<{\n itemNode: DSMenuButtonT.MenuNodeWithSubmenuItem;\n FlyoutMenuCircularDepInject: DSMenuItemRendererFactoryT.RequiredProps['FlyoutMenuCircularDepInject'];\n}> = ({ itemNode, FlyoutMenuCircularDepInject }) => {\n const { dsId, plainItem } = itemNode;\n const { label, secondaryLabel, leftDecoration: LeftDecComponent, minWidth, disabled } = plainItem;\n const floatingContext = useFloatingContext({\n placement: placementOrderPreference[0],\n placementOrderPreference,\n animationDuration: 100,\n customOffset: [0, 0],\n });\n const {\n refs: { setReference },\n } = floatingContext;\n\n const {\n focusRegion,\n openedSubItems,\n menuItemEventsHandlers: {\n handleFocusableMenuItemKeyDown,\n handleFocusableMenuItemClick,\n handleFocusableMenuItemOnMouseEnter,\n },\n } = React.useContext(MenuBehaviouralContextProviderContext);\n\n const gridLayout = React.useMemo(() => {\n const cols = LeftDecComponent ? ['min-content', 'auto'] : ['auto'];\n if (secondaryLabel) cols.push('auto');\n cols.push('min-content');\n return cols;\n }, [LeftDecComponent, secondaryLabel]);\n\n const focusedRegionPerformanceHelper = React.useRef(focusRegion);\n focusedRegionPerformanceHelper.current = focusRegion;\n\n const isFocused = focusRegion === MENU_FOCUS_REGIONS.ITEM_BY_DSID(dsId);\n const isExpanded = openedSubItems.some((itemWithOpenSubmenu) => itemWithOpenSubmenu.dsId === dsId);\n\n const handleFocusOnRender = React.useCallback(\n (node: HTMLDivElement) => {\n setReference(node);\n
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
4
|
+
"sourcesContent": ["import { ChevronSmallRight } from '@elliemae/ds-icons';\nimport {\n StyleMenuItemLabel,\n StyleMenuItemSecondaryLabel,\n StyledContentWrapper,\n StyledGlobalMenuItemWrapper,\n} from '@elliemae/ds-menu-items-commons';\nimport { useFloatingContext, type DSHookFloatingContextT } from '@elliemae/ds-floating-context';\nimport React from 'react';\nimport type { DSMenuButtonT } from '../../react-desc-prop-types.js';\nimport { MenuBehaviouralContextProviderContext } from '../DSMenuBehaviouralContextProvider/MenuBehaviouralContextProviderCTX.js';\nimport { MENU_FOCUS_REGIONS } from '../DSMenuBehaviouralContextProvider/constants/index.js';\nimport { type DSMenuItemRendererFactoryT } from './react-desc-prop-types.js';\nimport { focusNodeRacingConditionSolved } from './focusNodeRacingConditionSolved.js';\n\nconst placementOrderPreference: Required<DSHookFloatingContextT.Props>['placementOrderPreference'] = [\n 'right-start',\n 'right-start',\n 'right',\n 'left-start',\n 'left-end',\n 'left',\n];\nexport const WithSubmenuMenuItem: React.ComponentType<{\n itemNode: DSMenuButtonT.MenuNodeWithSubmenuItem;\n FlyoutMenuCircularDepInject: DSMenuItemRendererFactoryT.RequiredProps['FlyoutMenuCircularDepInject'];\n}> = ({ itemNode, FlyoutMenuCircularDepInject }) => {\n const { dsId, plainItem } = itemNode;\n const { label, secondaryLabel, leftDecoration: LeftDecComponent, minWidth, disabled } = plainItem;\n const floatingContext = useFloatingContext({\n placement: placementOrderPreference[0],\n placementOrderPreference,\n animationDuration: 100,\n customOffset: [0, 0],\n });\n const {\n refs: { setReference },\n } = floatingContext;\n\n const {\n focusRegion,\n openedSubItems,\n menuItemEventsHandlers: {\n handleFocusableMenuItemKeyDown,\n handleFocusableMenuItemClick,\n handleFocusableMenuItemOnMouseEnter,\n handleFocusableMenuItemNativeFocusEvent,\n },\n } = React.useContext(MenuBehaviouralContextProviderContext);\n\n const gridLayout = React.useMemo(() => {\n const cols = LeftDecComponent ? ['min-content', 'auto'] : ['auto'];\n if (secondaryLabel) cols.push('auto');\n cols.push('min-content');\n return cols;\n }, [LeftDecComponent, secondaryLabel]);\n\n const focusedRegionPerformanceHelper = React.useRef(focusRegion);\n focusedRegionPerformanceHelper.current = focusRegion;\n\n const isFocused = focusRegion === MENU_FOCUS_REGIONS.ITEM_BY_DSID(dsId);\n const isExpanded = openedSubItems.some((itemWithOpenSubmenu) => itemWithOpenSubmenu.dsId === dsId);\n\n const handleFocusOnRender = React.useCallback(\n (node: HTMLDivElement) => {\n setReference(node);\n if (node && focusRegion === MENU_FOCUS_REGIONS.ITEM_BY_DSID(dsId)) {\n focusNodeRacingConditionSolved(node);\n }\n },\n // we need to change the callback reference every time the focusRegion changes or else the focus will not be set\n [dsId, focusRegion, setReference],\n // we are using the \"as='div'\", typescript is not able to infer the correct type\n // the logic here actually receives a ref to a HTMLDivElement,\n // but the component must think this is a HTMLLIElement ref callback\n ) as unknown as React.RefCallback<HTMLLIElement>;\n\n const handleOnMouseEnter = React.useCallback<React.MouseEventHandler<HTMLDivElement>>(() => {\n handleFocusableMenuItemOnMouseEnter(itemNode);\n }, [handleFocusableMenuItemOnMouseEnter, itemNode]);\n const handleOnFocus = React.useCallback<React.FocusEventHandler<HTMLDivElement>>(\n (e) => {\n handleFocusableMenuItemNativeFocusEvent(itemNode, e);\n },\n [handleFocusableMenuItemNativeFocusEvent, itemNode],\n );\n\n const spacelessDsIdForDom = `ds-menu-item-${`${dsId}`.replace(/\\s/g, '')}`;\n return (\n <>\n <StyledGlobalMenuItemWrapper\n innerRef={handleFocusOnRender}\n onKeyDown={handleFocusableMenuItemKeyDown}\n onClick={handleFocusableMenuItemClick}\n onMouseEnter={handleOnMouseEnter}\n onFocus={handleOnFocus}\n as=\"div\"\n id={`${spacelessDsIdForDom}`}\n tabIndex={isFocused ? 0 : -1}\n role=\"menuitem\"\n aria-haspopup=\"menu\"\n aria-expanded={isExpanded}\n aria-controls={\n /* ********************************************************************************************************************\n * https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-controls\n * The aria-controls only needs to be set when the popup is visible, but it is valid and easier to program to reference an element that is not visible.\n * ********************************************************************************************************************\n * ^^^ some automated tools will mark an error if the aria-controls references an element that does (yet) exist in the DOM\n * so, while technically valid to not check if expanded, we are doing it to avoid automated tools marking an error\n * ******************************************************************************************************************** */\n isExpanded\n ? itemNode.plainChildren.map((child) => `ds-menu-item-${`${child.dsId}`.replace(/\\s/g, '')}`).join(' ')\n : undefined\n }\n aria-disabled={disabled}\n applyAriaDisabled={disabled}\n >\n <StyledContentWrapper\n cols={gridLayout}\n minHeight=\"16px\"\n gutter=\"xxs\"\n alignItems=\"center\"\n minWidth={minWidth ?? undefined}\n >\n {LeftDecComponent ? <LeftDecComponent /> : null}\n <StyleMenuItemLabel>{label}</StyleMenuItemLabel>\n {secondaryLabel !== undefined && (\n <StyleMenuItemSecondaryLabel disabled={disabled}>{secondaryLabel}</StyleMenuItemSecondaryLabel>\n )}\n <ChevronSmallRight />\n </StyledContentWrapper>\n </StyledGlobalMenuItemWrapper>\n <FlyoutMenuCircularDepInject\n isMenuOpen={isExpanded}\n floatingContext={floatingContext.context}\n floatingStyles={floatingContext.floatingStyles}\n setFloatingRef={floatingContext.refs.setFloating}\n itemNode={itemNode}\n />\n </>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADyFnB;AAzFJ,sBAAkC;AAClC,mCAKO;AACP,iCAAgE;AAChE,mBAAkB;AAElB,+CAAsD;AACtD,uBAAmC;AAEnC,4CAA+C;AAE/C,MAAM,2BAA+F;AAAA,EACnG;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AACO,MAAM,sBAGR,CAAC,EAAE,UAAU,4BAA4B,MAAM;AAClD,QAAM,EAAE,MAAM,UAAU,IAAI;AAC5B,QAAM,EAAE,OAAO,gBAAgB,gBAAgB,kBAAkB,UAAU,SAAS,IAAI;AACxF,QAAM,sBAAkB,+CAAmB;AAAA,IACzC,WAAW,yBAAyB,CAAC;AAAA,IACrC;AAAA,IACA,mBAAmB;AAAA,IACnB,cAAc,CAAC,GAAG,CAAC;AAAA,EACrB,CAAC;AACD,QAAM;AAAA,IACJ,MAAM,EAAE,aAAa;AAAA,EACvB,IAAI;AAEJ,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,wBAAwB;AAAA,MACtB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF,IAAI,aAAAA,QAAM,WAAW,8EAAqC;AAE1D,QAAM,aAAa,aAAAA,QAAM,QAAQ,MAAM;AACrC,UAAM,OAAO,mBAAmB,CAAC,eAAe,MAAM,IAAI,CAAC,MAAM;AACjE,QAAI,eAAgB,MAAK,KAAK,MAAM;AACpC,SAAK,KAAK,aAAa;AACvB,WAAO;AAAA,EACT,GAAG,CAAC,kBAAkB,cAAc,CAAC;AAErC,QAAM,iCAAiC,aAAAA,QAAM,OAAO,WAAW;AAC/D,iCAA+B,UAAU;AAEzC,QAAM,YAAY,gBAAgB,oCAAmB,aAAa,IAAI;AACtE,QAAM,aAAa,eAAe,KAAK,CAAC,wBAAwB,oBAAoB,SAAS,IAAI;AAEjG,QAAM,sBAAsB,aAAAA,QAAM;AAAA,IAChC,CAAC,SAAyB;AACxB,mBAAa,IAAI;AACjB,UAAI,QAAQ,gBAAgB,oCAAmB,aAAa,IAAI,GAAG;AACjE,kFAA+B,IAAI;AAAA,MACrC;AAAA,IACF;AAAA;AAAA,IAEA,CAAC,MAAM,aAAa,YAAY;AAAA;AAAA;AAAA;AAAA,EAIlC;AAEA,QAAM,qBAAqB,aAAAA,QAAM,YAAqD,MAAM;AAC1F,wCAAoC,QAAQ;AAAA,EAC9C,GAAG,CAAC,qCAAqC,QAAQ,CAAC;AAClD,QAAM,gBAAgB,aAAAA,QAAM;AAAA,IAC1B,CAAC,MAAM;AACL,8CAAwC,UAAU,CAAC;AAAA,IACrD;AAAA,IACA,CAAC,yCAAyC,QAAQ;AAAA,EACpD;AAEA,QAAM,sBAAsB,gBAAgB,GAAG,IAAI,GAAG,QAAQ,OAAO,EAAE,CAAC;AACxE,SACE,4EACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QACV,WAAW;AAAA,QACX,SAAS;AAAA,QACT,cAAc;AAAA,QACd,SAAS;AAAA,QACT,IAAG;AAAA,QACH,IAAI,GAAG,mBAAmB;AAAA,QAC1B,UAAU,YAAY,IAAI;AAAA,QAC1B,MAAK;AAAA,QACL,iBAAc;AAAA,QACd,iBAAe;AAAA,QACf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAQE,aACI,SAAS,cAAc,IAAI,CAAC,UAAU,gBAAgB,GAAG,MAAM,IAAI,GAAG,QAAQ,OAAO,EAAE,CAAC,EAAE,EAAE,KAAK,GAAG,IACpG;AAAA;AAAA,QAEN,iBAAe;AAAA,QACf,mBAAmB;AAAA,QAEnB;AAAA,UAAC;AAAA;AAAA,YACC,MAAM;AAAA,YACN,WAAU;AAAA,YACV,QAAO;AAAA,YACP,YAAW;AAAA,YACX,UAAU,YAAY;AAAA,YAErB;AAAA,iCAAmB,4CAAC,oBAAiB,IAAK;AAAA,cAC3C,4CAAC,mDAAoB,iBAAM;AAAA,cAC1B,mBAAmB,UAClB,4CAAC,4DAA4B,UAAqB,0BAAe;AAAA,cAEnE,4CAAC,qCAAkB;AAAA;AAAA;AAAA,QACrB;AAAA;AAAA,IACF;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,YAAY;AAAA,QACZ,iBAAiB,gBAAgB;AAAA,QACjC,gBAAgB,gBAAgB;AAAA,QAChC,gBAAgB,gBAAgB,KAAK;AAAA,QACrC;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;",
|
6
6
|
"names": ["React"]
|
7
7
|
}
|
@@ -32,8 +32,8 @@ __export(useMenuItemRendererFactory_exports, {
|
|
32
32
|
});
|
33
33
|
module.exports = __toCommonJS(useMenuItemRendererFactory_exports);
|
34
34
|
var React = __toESM(require("react"));
|
35
|
-
var import_react = __toESM(require("react"));
|
36
35
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
36
|
+
var import_react = __toESM(require("react"));
|
37
37
|
var import_uid = require("uid");
|
38
38
|
var import_react_desc_prop_types = require("../react-desc-prop-types.js");
|
39
39
|
var import_useValidateProps = require("./useValidateProps.js");
|
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"version": 3,
|
3
3
|
"sources": ["../../../../../src/parts/DSMenuItemRendererFactory/config/useMenuItemRendererFactory.ts", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
4
|
-
"sourcesContent": ["import
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,
|
4
|
+
"sourcesContent": ["import { useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport React from 'react';\nimport { uid } from 'uid';\nimport {\n DSMenuItemRendererFactoryPropTypesSchema,\n defaultProps,\n type DSMenuItemRendererFactoryT,\n} from '../react-desc-prop-types.js';\nimport { useValidateProps } from './useValidateProps.js';\n\nexport const useMenuItemRendererFactory = (propsFromUser: DSMenuItemRendererFactoryT.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 DSMenuItemRendererFactoryT.InternalProps;\n useValidateProps(propsWithDefault, DSMenuItemRendererFactoryPropTypesSchema);\n // =============================================================================\n // XSTYLED PROPS\n // =============================================================================\n const xstyledProps = useGetXstyledProps(propsWithDefault);\n // =============================================================================\n // AD HOC PER COMPONENT LOGIC\n // =============================================================================\n // custom code goes here, this is an example\n const instanceUid = React.useMemo(() => `ds-menu-item-renderer-factory-${uid(5)}`, []);\n\n return React.useMemo(\n () => ({\n propsWithDefault,\n xstyledProps,\n instanceUid,\n }),\n [propsWithDefault, xstyledProps, instanceUid],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAAmC;AACnC,mBAAkB;AAClB,iBAAoB;AACpB,mCAIO;AACP,8BAAiC;AAE1B,MAAM,6BAA6B,CAAC,kBAAoD;AAO7F,QAAM,mBAAmB,aAAAA,QAAM;AAAA,IAC7B,OAAO;AAAA,MACL,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAAA,IACA,CAAC,aAAa;AAAA,EAChB;AACA,gDAAiB,kBAAkB,qEAAwC;AAI3E,QAAM,mBAAe,4CAAmB,gBAAgB;AAKxD,QAAM,cAAc,aAAAA,QAAM,QAAQ,MAAM,qCAAiC,gBAAI,CAAC,CAAC,IAAI,CAAC,CAAC;AAErF,SAAO,aAAAA,QAAM;AAAA,IACX,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,kBAAkB,cAAc,WAAW;AAAA,EAC9C;AACF;",
|
6
6
|
"names": ["React"]
|
7
7
|
}
|
@@ -0,0 +1,43 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __create = Object.create;
|
3
|
+
var __defProp = Object.defineProperty;
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
8
|
+
var __export = (target, all) => {
|
9
|
+
for (var name in all)
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
11
|
+
};
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
14
|
+
for (let key of __getOwnPropNames(from))
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
17
|
+
}
|
18
|
+
return to;
|
19
|
+
};
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
26
|
+
mod
|
27
|
+
));
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
29
|
+
var focusNodeRacingConditionSolved_exports = {};
|
30
|
+
__export(focusNodeRacingConditionSolved_exports, {
|
31
|
+
focusNodeRacingConditionSolved: () => focusNodeRacingConditionSolved
|
32
|
+
});
|
33
|
+
module.exports = __toCommonJS(focusNodeRacingConditionSolved_exports);
|
34
|
+
var React = __toESM(require("react"));
|
35
|
+
var import_lodash = require("lodash");
|
36
|
+
const focusNodeRacingConditionSolved = (0, import_lodash.throttle)(
|
37
|
+
(node) => {
|
38
|
+
node.focus();
|
39
|
+
},
|
40
|
+
10,
|
41
|
+
{ leading: false, trailing: true }
|
42
|
+
);
|
43
|
+
//# sourceMappingURL=focusNodeRacingConditionSolved.js.map
|
@@ -0,0 +1,7 @@
|
|
1
|
+
{
|
2
|
+
"version": 3,
|
3
|
+
"sources": ["../../../../src/parts/DSMenuItemRendererFactory/focusNodeRacingConditionSolved.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
4
|
+
"sourcesContent": ["import { throttle } from 'lodash';\n\nexport const focusNodeRacingConditionSolved = throttle(\n (node: HTMLDivElement) => {\n node.focus();\n },\n 10,\n { leading: false, trailing: true },\n);\n", "import * as React from 'react';\nexport { React };\n"],
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,oBAAyB;AAElB,MAAM,qCAAiC;AAAA,EAC5C,CAAC,SAAyB;AACxB,SAAK,MAAM;AAAA,EACb;AAAA,EACA;AAAA,EACA,EAAE,SAAS,OAAO,UAAU,KAAK;AACnC;",
|
6
|
+
"names": []
|
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 {
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAKO;
|
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 /*\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\n 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 Partial<DefaultProps>,\n OptionalProps,\n Omit<GlobalAttributesT<HTMLLIElement>, keyof OptionalProps | keyof XstyledProps>,\n XstyledProps,\n RequiredProps {}\n\n export interface InternalProps\n extends 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;AAuCzE,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
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
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 /*\n * everything that is specifically added in this namespace declaration and is not part of the original component\n * is because the original component is an \"opinionated widget\" that offloads a chunk of responsibilities from dev to dimsum\n * as such, the widget generates those interfaces,\n * but the app developer is not supposed to know about them\n * untill they go atomic composition (this namespace)\n */\n export interface RequiredProps extends DSMenuButtonT.ButtonInheritedRequiredProps {\n menuSpecificProps: DSMenuButtonT.MenuSpecificProps;\n }\n\n export interface DefaultProps extends DSMenuButtonT.ButtonInheiredDefaultProps {}\n\n export interface OptionalProps\n extends TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSOpinionatedButtonName, typeof OPINIONATED_BUTTON_SLOTS>,\n DSMenuButtonT.ButtonInheritedOptionalProps {}\n\n export interface Props\n extends RequiredProps,\n Partial<DefaultProps>,\n OptionalProps,\n // this is where global/xstyled props are inherited from DSButtonV3\n DSMenuButtonT.ButtonInheritedProps {\n innerRef: React.RefCallback<HTMLButtonElement>;\n }\n\n export interface InternalProps\n extends RequiredProps,\n DefaultProps,\n OptionalProps,\n // this is where global/xstyled props are inherited from DSButtonV3\n DSMenuButtonT.ButtonInheritedInternalProps {\n innerRef: React.RefCallback<HTMLButtonElement>;\n }\n}\n\nexport const defaultProps: DSOpinionatedButtonT.DefaultProps = {\n ...DSButtonV3DefaultProps,\n};\n\nexport const DSOpinionatedButtonPropTypes: DSPropTypesSchema<DSOpinionatedButtonT.Props> = {\n ...getPropsPerSlotPropTypes(DSOpinionatedButtonName, OPINIONATED_BUTTON_SLOTS),\n ...DSButtonV3PropTypes,\n menuSpecificProps: PropTypes.shape(DSMenuSpecificPropTypes).description('Props for the main flyout menu').isRequired,\n innerRef: PropTypes.func.description(\n 'Ref callback for the button, if not provided how is the flyout menu being positioned?',\n ).isRequired,\n};\n\nexport const DSOpinionatedButtonPropTypesSchema =\n DSOpinionatedButtonPropTypes as unknown as ValidationMap<DSOpinionatedButtonT.Props>;\n", "import * as React from 'react';\nexport { React };\n"],
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,0BAA4D;AAE5D,8BAAoD;AAGpD,mCAA4D;AAC5D,uBAAkE;AAuC3D,MAAM,eAAkD;AAAA,EAC7D,GAAG;AACL;AAEO,MAAM,+BAA8E;AAAA,EACzF,OAAG,kDAAyB,0CAAyB,yCAAwB;AAAA,EAC7E,GAAG;AAAA,EACH,mBAAmB,kCAAU,MAAM,oDAAuB,EAAE,YAAY,gCAAgC,EAAE;AAAA,EAC1G,UAAU,kCAAU,KAAK;AAAA,IACvB;AAAA,EACF,EAAE;AACJ;AAEO,MAAM,qCACX;",
|
6
6
|
"names": []
|
7
7
|
}
|
@@ -32,36 +32,36 @@ __export(react_desc_prop_types_exports, {
|
|
32
32
|
DSMenuButtonPropTypesSchema: () => DSMenuButtonPropTypesSchema,
|
33
33
|
DSMenuSpecificPropTypes: () => DSMenuSpecificPropTypes,
|
34
34
|
MenuBehaviouralLayerPropTypes: () => MenuBehaviouralLayerPropTypes,
|
35
|
-
|
35
|
+
menuSpecificDefaultProps: () => menuSpecificDefaultProps
|
36
36
|
});
|
37
37
|
module.exports = __toCommonJS(react_desc_prop_types_exports);
|
38
38
|
var React = __toESM(require("react"));
|
39
39
|
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
40
40
|
var import_ds_button_v2 = require("@elliemae/ds-button-v2");
|
41
41
|
var import_constants = require("./constants/index.js");
|
42
|
-
const
|
43
|
-
selectedOptions: {},
|
42
|
+
const menuSpecificDefaultProps = {
|
44
43
|
onClickOutside: () => null,
|
45
44
|
onOptionClick: () => null,
|
46
45
|
openedSubmenus: {},
|
47
46
|
onSubmenuToggle: () => null,
|
48
47
|
isLoading: false,
|
49
|
-
isSkeleton: false
|
48
|
+
isSkeleton: false,
|
49
|
+
maxHeight: "256px"
|
50
|
+
// was available in dropdownmenu-v2, have to provide for retrocompatibility
|
50
51
|
};
|
51
52
|
const MenuBehaviouralLayerPropTypes = {
|
52
|
-
|
53
|
-
"
|
54
|
-
).
|
55
|
-
onItemSelected: import_ds_props_helpers.PropTypes.func.description("IoC function in charge of handling the selection of a menu item").signature(`((
|
53
|
+
onItemSelected: import_ds_props_helpers.PropTypes.func.description(
|
54
|
+
"IoC function in charge of handling the selection of a menu item, required if the menu has selectionable items"
|
55
|
+
).signature(`((
|
56
56
|
newSelection: DSMenuButtonT.PseudoFocusableMenuNodes[],
|
57
57
|
metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },
|
58
|
-
) => void)`)
|
58
|
+
) => void)`),
|
59
59
|
onActivateItem: import_ds_props_helpers.PropTypes.func.description(
|
60
|
-
"IoC function in charge of handling the activation (NOT INVOKED ON SELECTION) of a menu item"
|
60
|
+
"IoC function in charge of handling the activation (NOT INVOKED ON SELECTION) of a menu item, required if the menu has activable items"
|
61
61
|
).signature(`((
|
62
62
|
itemNode: DSMenuButtonT.PseudoFocusableMenuNodes,
|
63
63
|
metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },
|
64
|
-
) => void)`)
|
64
|
+
) => void)`),
|
65
65
|
onOpen: import_ds_props_helpers.PropTypes.func.description("function triggered when the widget opens the menu").signature(`(()=>void)`),
|
66
66
|
onClose: import_ds_props_helpers.PropTypes.func.description("function triggered when the widget closes the menu").signature(`(()=>void)`),
|
67
67
|
onDisplayedSubmenuChange: import_ds_props_helpers.PropTypes.func.description("function triggered when the widget's closes or opens a submenu").signature(`((
|
@@ -72,9 +72,6 @@ const MenuBehaviouralLayerPropTypes = {
|
|
72
72
|
const DSMenuSpecificPropTypes = {
|
73
73
|
ItemRenderer: import_ds_props_helpers.PropTypes.node.description("Component to be used to render the items"),
|
74
74
|
onClickOutside: import_ds_props_helpers.PropTypes.func.description("Callback executed when you click outside the dropdown menu, or press the Esc key").defaultValue(() => null),
|
75
|
-
selectedOptions: import_ds_props_helpers.PropTypes.object.description(
|
76
|
-
"Object with the ids of the options as keys, and booleans as keys. Represents the state of the current selection in the dropdown menu"
|
77
|
-
).defaultValue({}),
|
78
75
|
onOptionClick: import_ds_props_helpers.PropTypes.func.description(
|
79
76
|
"Callback triggered when an item is clicked or pressed. We provide the next selected options, the clicked option and the event, in that order"
|
80
77
|
).defaultValue(() => null),
|
@@ -85,12 +82,16 @@ const DSMenuSpecificPropTypes = {
|
|
85
82
|
"((nextOpenedSubmenus: Record<string, boolean>, submenu: Item, e: React.MouseEvent | React.KeyboardEvent) => void)"
|
86
83
|
).defaultValue(() => null),
|
87
84
|
isLoading: import_ds_props_helpers.PropTypes.bool.description("Whether the flyout menu should render the loading indicator").defaultValue(false),
|
88
|
-
isSkeleton: import_ds_props_helpers.PropTypes.bool.description("Whether the flyout menu should render the skeleton").defaultValue(false)
|
85
|
+
isSkeleton: import_ds_props_helpers.PropTypes.bool.description("Whether the flyout menu should render the skeleton").defaultValue(false),
|
86
|
+
maxHeight: import_ds_props_helpers.PropTypes.oneOfType([import_ds_props_helpers.PropTypes.string, import_ds_props_helpers.PropTypes.number]).description("The maximum height of the flyout menu").defaultValue("256px")
|
89
87
|
};
|
90
88
|
const DSMenuButtonPropTypes = {
|
91
89
|
options: import_ds_props_helpers.PropTypes.oneOfType([import_ds_props_helpers.PropTypes.array, import_ds_props_helpers.PropTypes.object]).description(
|
92
90
|
"Array of options to display in the menu or a DSTree node to build branches from"
|
93
91
|
).isRequired,
|
92
|
+
selectedItems: import_ds_props_helpers.PropTypes.arrayOf(import_ds_props_helpers.PropTypes.object).description(
|
93
|
+
"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"
|
94
|
+
),
|
94
95
|
...import_ds_button_v2.DSButtonV3PropTypes,
|
95
96
|
...MenuBehaviouralLayerPropTypes,
|
96
97
|
...DSMenuSpecificPropTypes,
|
@@ -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';\n\nimport { DSMenuButtonName, MENU_BUTTON_SLOTS, type MENU_ITEMS_TYPES } from './constants/index.js';\nexport declare namespace DSMenuButtonT {\n /* *******************************************************\n * YURI's NOTE:\n *\n * This polymorphic interface \"looks similar\" between the diffent types\n * but it's actually different upon closer inspection\n *\n * If you are smarter then me, you can probably find a way to make this more DRY\n * but I prefeer AHA (Avoid Hasty Abstractions) that gives me an easier to mantain code\n * ESPECIALLY when the types are so similar but not the same & in typescript (polymorphism is hard in TS)\n *\n * So I'm going to keep them separate and explicit\n * key difference is what's required to exist and what is required to explicitly NOT exist\n *\n * If someone's review this and make this DRY, I'm NOT going to mantain this code moving forward\n * whoever makes this TS DRY will be responsible for it and own it.\n ******************************************************* */\n export interface RootItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n type: 'ROOT_ITEM'; // HARDCODED BECAUSE THIS IS NOT A MENU ITEM, IT'S EXCLUSIVE TO THE ROOT NODE\n dsId: string;\n label?: undefined;\n secondaryLabel?: undefined;\n leftDecoration?: undefined;\n minWidth?: undefined;\n disabled?: undefined;\n onClick?: undefined;\n onKeyDown?: undefined;\n }\n export interface SeparatorItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n type: (typeof MENU_ITEMS_TYPES)['SEPARATOR'];\n dsId: string;\n label?: undefined;\n secondaryLabel?: undefined;\n leftDecoration?: undefined;\n minWidth?: undefined;\n disabled?: undefined;\n onClick?: undefined;\n onKeyDown?: undefined;\n }\n export interface ActivableItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n type: (typeof MENU_ITEMS_TYPES)['ACTIVABLE_ITEM'];\n dsId: string;\n label: string;\n secondaryLabel?: string;\n leftDecoration?: React.ComponentType;\n minWidth?: string | number;\n disabled?: boolean;\n onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n onKeyDown?: (e: React.KeyboardEvent) => null;\n }\n export interface ActionableWithSubmenuItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n type: (typeof MENU_ITEMS_TYPES)['ACTIVABLE_WITH_SUBMENU_ITEM'];\n dsId: string;\n label: string;\n secondaryLabel?: string;\n leftDecoration?: React.ComponentType;\n minWidth?: string | number;\n disabled?: boolean;\n onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n onKeyDown?: (e: React.KeyboardEvent) => null;\n }\n export interface SkeletonItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n type: (typeof MENU_ITEMS_TYPES)['SKELETON_ITEM'];\n dsId: string;\n minWidth?: string | number;\n label?: undefined;\n secondaryLabel?: undefined;\n leftDecoration?: undefined;\n disabled?: undefined;\n onClick?: undefined;\n onKeyDown?: undefined;\n }\n export interface MultipleSelectItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n type: (typeof MENU_ITEMS_TYPES)['MULTIPLE_SELECT_ITEM'];\n dsId: string;\n label: string;\n secondaryLabel?: string;\n leftDecoration?: React.ComponentType;\n minWidth?: string | number;\n disabled?: boolean;\n onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n onKeyDown?: (e: React.KeyboardEvent) => null;\n }\n\n export interface MultiSelectWithSubmenuItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n type: (typeof MENU_ITEMS_TYPES)['MULTIPLE_SELECT_WITH_SUBMENU_ITEM'];\n dsId: string;\n label: string;\n secondaryLabel?: string;\n leftDecoration?: React.ComponentType;\n minWidth?: string | number;\n disabled?: boolean;\n onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n onKeyDown?: (e: React.KeyboardEvent) => null;\n }\n export interface WithSubmenuItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n type: (typeof MENU_ITEMS_TYPES)['WITH_SUBMENU_ITEM'];\n dsId: string;\n label: string;\n secondaryLabel?: string;\n leftDecoration?: React.ComponentType;\n minWidth?: string | number;\n disabled?: boolean;\n onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n onKeyDown?: (e: React.KeyboardEvent) => null;\n }\n\n /* ***********************************************************************\n * Single select items MUST always have a \"group\" as parent\n * Failing the condition fails ADA announcements (role='group' -> role='menuitemradio')\n *********************************************************************** */\n export interface SingleSelectItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n type: (typeof MENU_ITEMS_TYPES)['SINGLE_SELECT_ITEM'];\n dsId: string;\n label: string;\n secondaryLabel?: string;\n leftDecoration?: React.ComponentType;\n minWidth?: string | number;\n disabled?: boolean;\n onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n onKeyDown?: (e: React.KeyboardEvent) => null;\n }\n export interface SingleSelectWithSubmenuItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n type: (typeof MENU_ITEMS_TYPES)['SINGLE_SELECT_WITH_SUBMENU_ITEM'];\n dsId: string;\n label: string;\n secondaryLabel?: string;\n leftDecoration?: React.ComponentType;\n minWidth?: string | number;\n disabled?: boolean;\n onClick?: (e: React.MouseEvent | React.KeyboardEvent) => void;\n onKeyDown?: (e: React.KeyboardEvent) => null;\n }\n\n export interface GroupItem extends UseDSTreeT.AnyObjectWithoutReservedKeys {\n type: (typeof MENU_ITEMS_TYPES)['GROUP'];\n dsId: string;\n label?: string; // if present, add a title to the group\n leftDecoration?: React.ComponentType; // if present, a label must also be present\n minWidth?: string | number;\n }\n\n export type MenuItemInterface =\n | SeparatorItem\n | ActivableItem\n | ActionableWithSubmenuItem\n | SkeletonItem\n | MultipleSelectItem\n | MultiSelectWithSubmenuItem\n | WithSubmenuItem\n | GroupItem;\n\n export type PseudoFocusableItemInterface =\n | ActivableItem\n | ActionableWithSubmenuItem\n | SkeletonItem\n | MultipleSelectItem\n | MultiSelectWithSubmenuItem\n | WithSubmenuItem\n | SingleSelectItem\n | SingleSelectWithSubmenuItem;\n\n // Define MenuNode types directly\n export type MenuNodeRootItem = UseDSTreeT.TreeNode<RootItem>; // MenuNodesAllowedToHaveChildren is the only expected reference to this type\n export type MenuNodeSeparatorItem = UseDSTreeT.TreeNode<SeparatorItem>;\n export type MenuNodeActivableItem = UseDSTreeT.TreeNode<ActivableItem>;\n export type MenuNodeActivableWithSubmenuItem = UseDSTreeT.TreeNode<ActionableWithSubmenuItem>;\n export type MenuNodeSkeletonItem = UseDSTreeT.TreeNode<SkeletonItem>;\n export type MenuNodeMultipleSelectItem = UseDSTreeT.TreeNode<MultipleSelectItem>;\n export type MenuNodeMultipleSelectWithSubmenuItem = UseDSTreeT.TreeNode<MultiSelectWithSubmenuItem>;\n export type MenuNodeWithSubmenuItem = UseDSTreeT.TreeNode<WithSubmenuItem>;\n export type MenuNodeSingleSelectItem = UseDSTreeT.TreeNode<SingleSelectItem>;\n export type MenuNodeSingleSelectWithSubmenuItem = UseDSTreeT.TreeNode<SingleSelectWithSubmenuItem>;\n export type MenuNodeGroupItem = UseDSTreeT.TreeNode<GroupItem>;\n\n // in the future we want to better describe the polymorphic nature of the MenuNode\n // having each type be able to have it's own \"subitems\" type that isn't necessarily the same as the parent\n // but currenctly the DS tree model typescript definitions don't support this\n // will be addresssed via PUI-XXXX\n export type MenuNode =\n // DO NOT ADD MenuNodeRootItem HERE, WILL BREAK THE SUBTREES\n | MenuNodeSeparatorItem\n | MenuNodeActivableItem\n | MenuNodeActivableWithSubmenuItem\n | MenuNodeSkeletonItem\n | MenuNodeMultipleSelectItem\n | MenuNodeMultipleSelectWithSubmenuItem\n | MenuNodeWithSubmenuItem\n | MenuNodeSingleSelectItem\n | MenuNodeSingleSelectWithSubmenuItem\n | MenuNodeGroupItem;\n\n export type PseudoFocusableMenuNodes =\n | MenuNodeActivableItem\n | MenuNodeActivableWithSubmenuItem\n | MenuNodeSkeletonItem\n | MenuNodeSingleSelectItem\n | MenuNodeMultipleSelectItem\n | MenuNodeMultipleSelectWithSubmenuItem\n | MenuNodeWithSubmenuItem\n | MenuNodeSingleSelectWithSubmenuItem;\n\n export type MenuNodesAllowedToHaveChildren =\n | MenuNodeRootItem\n | MenuNodeWithSubmenuItem\n | MenuNodeGroupItem\n | MenuNodeActivableWithSubmenuItem\n | MenuNodeMultipleSelectWithSubmenuItem\n | MenuNodeSingleSelectWithSubmenuItem;\n\n export type ItemRendererT = React.ComponentType<{ itemNode: MenuNode }>;\n\n export type SelectionableMenuNodes =\n | DSMenuButtonT.MenuNodeMultipleSelectItem\n | DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem\n | DSMenuButtonT.MenuNodeSingleSelectItem\n | DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem;\n\n export type MultipleSelectionableMenuNodes =\n | DSMenuButtonT.MenuNodeMultipleSelectItem\n | DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem;\n\n export type SingleSelectionableMenuNodes =\n | DSMenuButtonT.MenuNodeSingleSelectItem\n | DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem;\n\n export type WithSubmenuMenuNodes =\n | DSMenuButtonT.MenuNodeWithSubmenuItem\n | DSMenuButtonT.MenuNodeActivableWithSubmenuItem\n | DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem\n | DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem;\n\n export type SelectionablesWithSubmenuMenuNodes =\n | DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem\n | DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem;\n /* *******************************************************\n * From official source definition\n *\n * Menu Button Pattern\n * About This Pattern:\n * A menu button is a button\n * that opens a menu\n * (as described in the Menu and Menubar Pattern).\n *\n * Since the menu button is a button, it inherits all the props from the Button component.\n * Since the menu button MUST have a menu, it also have a set of specific props used to handle the menu.\n * Because we build with atomic composition in mind, the \"logic layer\" is separated and has a yet another set of props.\n *\n * This is effectively an OOP \"extension\" of the Button component,\n * so it has the same props,\n * BUT also a few more to handle the specific behavior of the menu.\n ******************************************************* */\n\n export interface MenuBehaviouralLayerRequiredProps {\n selectedItems: SelectionableMenuNodes[];\n onItemSelected: (\n newSelection: SelectionableMenuNodes[],\n metainfo: { itemNode: DSMenuButtonT.SelectionableMenuNodes; event?: React.SyntheticEvent },\n ) => void | TypescriptHelpersT.StateSetter<DSMenuButtonT.SelectionableMenuNodes[]>;\n onActivateItem: (\n itemNode: DSMenuButtonT.PseudoFocusableMenuNodes,\n metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },\n ) => void;\n }\n\n export interface MenuSpecificRequiredProps {}\n /* *******************************************************\n * Required Props + Inherited Required Props\n * - We inherit the required props from the button\n * - We add the required props for the menu\n *\n * - if a collision occurs, the menu specific are meant to be the most important and specific ones\n ******************************************************* */\n export interface ButtonInheritedRequiredProps\n // by using Omit, we remove the keys that are present in the MenuSpecificRequiredProps to ensure collision are handled as expected\n extends Omit<DSButtonV3T.RequiredProps, keyof MenuSpecificRequiredProps> {}\n // the final RequiredProps will be the combination of the two with proper collision handling\n export interface RequiredProps\n extends MenuSpecificRequiredProps,\n ButtonInheritedRequiredProps,\n MenuBehaviouralLayerRequiredProps {\n // it's the Menu Widget sole responsibility to receive the options and convert them to a tree\n options: MenuItemInterface[] | MenuNode;\n }\n\n /* *******************************************************\n * Since the menu button is a button, it inherits all the props from the Button component.\n * Since the menu button MUST have a menu, it also have a set of specific props used to handle the menu.\n * Because we build with atomic composition in mind, the \"logic layer\" is separated and has a yet another set of props.\n ******************************************************* */\n export interface MenuBehaviouralLayerDefaultProps {}\n export interface MenuSpecifiDefaultProps {\n onClickOutside: (e: MouseEvent | React.KeyboardEvent | TouchEvent) => void;\n onOptionClick: (\n nextSelectedOptions: Record<string, boolean>,\n clickedOption: MenuItemInterface,\n e: React.MouseEvent | React.KeyboardEvent,\n ) => void;\n openedSubmenus: Record<string, boolean>;\n onSubmenuToggle: (\n nextOpenedSubmenus: Record<string, boolean>,\n submenu: MenuItemInterface,\n e: React.MouseEvent | React.KeyboardEvent,\n ) => void;\n isLoading: boolean;\n isSkeleton: boolean;\n selectedOptions: Record<string, boolean>;\n }\n\n /* *******************************************************\n * Default Props + Inherited Default Props\n * - We inherit the default props from the button\n * - We add the default props for the menu\n *\n * - if a collision occurs, the menu specific are meant to be the most important and specific ones\n ******************************************************* */\n // by using Omit, we remove the keys that are present in the MenuSpecificDefaultProps to ensure collision are handled as expected\n export interface ButtonInheiredDefaultProps extends Omit<DSButtonV3T.DefaultProps, keyof MenuSpecifiDefaultProps> {}\n // the final DefaultProps will be the combination of the two with proper collision handling\n export interface DefaultProps\n extends MenuSpecifiDefaultProps,\n ButtonInheiredDefaultProps,\n MenuBehaviouralLayerDefaultProps {}\n\n /* *******************************************************\n * Since the menu button is a button, it inherits all the props from the Button component.\n * Since the menu button MUST have a menu, it also have a set of specific props used to handle the menu.\n * Because we build with atomic composition in mind, the \"logic layer\" is separated and has a yet another set of props.\n ******************************************************* */\n export interface MenuBehaviouralLayerOptionalProps {\n onOpen?: () => void;\n onClose?: () => void;\n onDisplayedSubmenuChange?: (\n newOpenedItems: DSMenuButtonT.WithSubmenuMenuNodes[],\n metainfo: {\n itemNode: DSMenuButtonT.PseudoFocusableMenuNodes | null;\n event?: React.SyntheticEvent | FocusEvent | TouchEvent;\n },\n ) => void | TypescriptHelpersT.StateSetter<DSMenuButtonT.WithSubmenuMenuNodes[]>;\n }\n export interface MenuSpecificOptionalProps {\n ItemRenderer?: ItemRendererT;\n }\n /* *******************************************************\n * Optional Props + Inherited Optional Props\n * - We inherit the optional props from the button\n * - We add the optional props for the menu\n *\n * - if a collision occurs, the menu specific are meant to be the most important and specific ones\n ******************************************************* */\n export interface ButtonInheritedOptionalProps\n // by using Omit, we remove the keys that are present in the MenuSpecificOptionalProps to ensure collision are handled as expected\n extends Omit<DSButtonV3T.OptionalProps, keyof MenuSpecificOptionalProps> {}\n export interface OptionalProps\n extends MenuSpecificOptionalProps,\n ButtonInheritedOptionalProps,\n MenuBehaviouralLayerOptionalProps,\n TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSMenuButtonName, typeof MENU_BUTTON_SLOTS> {}\n\n /* *******************************************************\n * Since the menu button is a button, it inherits all the props from the Button component.\n * Since the menu button MUST have a menu, it also have a set of specific props used to handle the menu.\n * Because we build with atomic composition in mind, the \"logic layer\" is separated and has a yet another set of props.\n ******************************************************* */\n export interface MenuBehaviouralLayerProps\n extends Partial<MenuBehaviouralLayerDefaultProps>,\n MenuBehaviouralLayerOptionalProps,\n MenuBehaviouralLayerRequiredProps {}\n export interface MenuSpecificProps\n extends Partial<MenuSpecifiDefaultProps>,\n MenuSpecificOptionalProps,\n MenuSpecificRequiredProps {}\n /* *******************************************************\n * Props + Inherited Props\n * - We inherit the props from the button\n * - We add the props for the menu\n *\n * - if a collision occurs, the menu specific are meant to be the most important and specific ones\n ******************************************************* */\n // by using Omit, we remove the keys that are present in the MenuSpecificProps to ensure collision are handled as expected\n // THIS IS ALSO INHERITING THE GLOBAL ATTRIBUTES & XSTYLED PROPS FROM THE BUTTON!!!\n export interface ButtonInheritedProps extends Omit<DSButtonV3T.Props, keyof MenuSpecificProps> {}\n\n export interface Props extends RequiredProps, Partial<DefaultProps>, OptionalProps {}\n\n /* *******************************************************\n * Since the menu button is a button, it inherits all the props from the Button component.\n * Since the menu button MUST have a menu, it also have a set of specific props used to handle the menu.\n * Because we build with atomic composition in mind, the \"logic layer\" is separated and has a yet another set of props.\n ******************************************************* */\n export interface MenuBehaviouralLayerInternalProps\n extends MenuBehaviouralLayerDefaultProps,\n MenuBehaviouralLayerOptionalProps,\n MenuBehaviouralLayerRequiredProps {}\n export interface MenuSpecificInternalProps\n extends MenuSpecifiDefaultProps,\n MenuSpecificOptionalProps,\n MenuSpecificRequiredProps {}\n\n /* *******************************************************\n * Internal Props\n * - We inherit the internal props from the button\n * - We add the internal props for the menu\n *\n * - if a collision occurs, the menu specific are meant to be the most important and specific ones\n ******************************************************* */\n export interface ButtonInheritedInternalProps\n // by using Omit, we remove the keys that are present in the MenuSpecificInternalProps to ensure collision are handled as expected\n // THIS IS ALSO INHERITING THE GLOBAL ATTRIBUTES & XSTYLED PROPS FROM THE BUTTON!!!\n extends Omit<DSButtonV3T.InternalProps, keyof MenuSpecificInternalProps> {}\n export interface InternalProps extends RequiredProps, DefaultProps, OptionalProps {}\n}\n\nexport const defaultProps: DSMenuButtonT.MenuSpecifiDefaultProps = {\n selectedOptions: {},\n onClickOutside: () => null,\n onOptionClick: () => null,\n openedSubmenus: {},\n onSubmenuToggle: () => null,\n isLoading: false,\n isSkeleton: false,\n};\n\nexport const MenuBehaviouralLayerPropTypes: DSPropTypesSchema<DSMenuButtonT.MenuBehaviouralLayerProps> = {\n selectedItems: PropTypes.arrayOf(PropTypes.object).description(\n 'an array of tree-nodes that have to be marked as selected in the GUI',\n ).isRequired,\n\n onItemSelected: PropTypes.func.description('IoC function in charge of handling the selection of a menu item')\n .signature(`((\n newSelection: DSMenuButtonT.PseudoFocusableMenuNodes[],\n metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },\n ) => void)`).isRequired,\n onActivateItem: PropTypes.func.description(\n 'IoC function in charge of handling the activation (NOT INVOKED ON SELECTION) of a menu item',\n ).signature(`((\n itemNode: DSMenuButtonT.PseudoFocusableMenuNodes,\n metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },\n ) => void)`).isRequired,\n onOpen: PropTypes.func.description('function triggered when the widget opens the menu').signature(`(()=>void)`),\n onClose: PropTypes.func.description('function triggered when the widget closes the menu').signature(`(()=>void)`),\n onDisplayedSubmenuChange: PropTypes.func.description(\"function triggered when the widget's closes or opens a submenu\")\n .signature(`((\n newOpenedItems: DSMenuButtonT.PseudoFocusableMenuNodes[],\n metainfo: { itemNode: DSMenuButtonT.PseudoFocusableMenuNodes; event?: React.SyntheticEvent },\n ) => void)`),\n};\n\nexport const DSMenuSpecificPropTypes: DSPropTypesSchema<DSMenuButtonT.MenuSpecificProps> = {\n ItemRenderer: PropTypes.node.description('Component to be used to render the items'),\n onClickOutside: PropTypes.func\n .description('Callback executed when you click outside the dropdown menu, or press the Esc key')\n .defaultValue(() => null),\n selectedOptions: PropTypes.object\n .description(\n 'Object with the ids of the options as keys, and booleans as keys. Represents the state of the current selection in the dropdown menu',\n )\n .defaultValue({}),\n onOptionClick: PropTypes.func\n .description(\n 'Callback triggered when an item is clicked or pressed. We provide the next selected options, the clicked option and the event, in that order',\n )\n .defaultValue(() => null),\n openedSubmenus: PropTypes.object\n .description(\n 'Object with the ids of the submenus as keys, and booleans as keys. Represents the state of the current opened submenus',\n )\n .defaultValue({}),\n onSubmenuToggle: PropTypes.func\n .description('Callback triggered when a submenu is opened or closed.')\n .signature(\n '((nextOpenedSubmenus: Record<string, boolean>, submenu: Item, e: React.MouseEvent | React.KeyboardEvent) => void)',\n )\n .defaultValue(() => null),\n isLoading: PropTypes.bool\n .description('Whether the flyout menu should render the loading indicator')\n .defaultValue(false),\n isSkeleton: PropTypes.bool.description('Whether the flyout menu should render the skeleton').defaultValue(false),\n};\n\nexport const DSMenuButtonPropTypes: DSPropTypesSchema<DSMenuButtonT.Props> = {\n options: PropTypes.oneOfType([PropTypes.array, PropTypes.object]).description(\n 'Array of options to display in the menu or a DSTree node to build branches from',\n ).isRequired,\n ...DSButtonV3PropTypes,\n ...MenuBehaviouralLayerPropTypes,\n ...DSMenuSpecificPropTypes,\n ...getPropsPerSlotPropTypes(DSMenuButtonName, MENU_BUTTON_SLOTS),\n};\n\nexport const DSMenuButtonPropTypesSchema = DSMenuButtonPropTypes as unknown as ValidationMap<DSMenuButtonT.Props>;\n", "import * as React from 'react';\nexport { React };\n"],
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAAoD;AACpD,0BAAoC;AAMpC,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';\n\nimport { DSMenuButtonName, MENU_BUTTON_SLOTS, type MENU_ITEMS_TYPES } from './constants/index.js';\nexport declare namespace DSMenuButtonT {\n /* *******************************************************\n * YURI's NOTE:\n *\n * This polymorphic interface \"looks similar\" between the diffent types\n * but it's actually different upon closer inspection\n *\n * If you are smarter then me, you can probably find a way to make this more DRY\n * but I prefeer AHA (Avoid Hasty Abstractions) that gives me an easier to mantain code\n * ESPECIALLY when the types are so similar but not the same & in typescript (polymorphism is hard in TS)\n *\n * So I'm going to keep them separate and explicit\n * key difference is what's required to exist and what is required to explicitly NOT exist\n *\n * If someone's review this and make this DRY, I'm NOT going to mantain this code moving forward\n * whoever makes this TS DRY will be responsible for it and own it.\n ******************************************************* */\n\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 }\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};\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;AAMpC,uBAA2E;AAwdpE,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;AACzB;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
|
}
|
@@ -39,6 +39,7 @@ __export(nodesTypeguardsAndGetters_exports, {
|
|
39
39
|
isMultipleSelectNode: () => isMultipleSelectNode,
|
40
40
|
isMultipleSelectOnlyNode: () => isMultipleSelectOnlyNode,
|
41
41
|
isMultipleSelectWithSubmenuNode: () => isMultipleSelectWithSubmenuNode,
|
42
|
+
isObjectAMenuNode: () => isObjectAMenuNode,
|
42
43
|
isRootNode: () => isRootNode,
|
43
44
|
isSelectionableNode: () => isSelectionableNode,
|
44
45
|
isSelectionableWithSubmenuNode: () => isSelectionableWithSubmenuNode,
|
@@ -53,71 +54,32 @@ __export(nodesTypeguardsAndGetters_exports, {
|
|
53
54
|
module.exports = __toCommonJS(nodesTypeguardsAndGetters_exports);
|
54
55
|
var React = __toESM(require("react"));
|
55
56
|
var import_constants = require("../constants/index.js");
|
56
|
-
const
|
57
|
+
const isObjectAMenuNode = (item) => {
|
57
58
|
const node = item;
|
58
|
-
return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type
|
59
|
-
};
|
60
|
-
const isActivableWithSubmenuNode = (item) => {
|
61
|
-
const node = item;
|
62
|
-
return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.ACTIVABLE_WITH_SUBMENU_ITEM;
|
63
|
-
};
|
64
|
-
const isSkeletonNode = (item) => {
|
65
|
-
const node = item;
|
66
|
-
return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SKELETON_ITEM;
|
67
|
-
};
|
68
|
-
const isMultipleSelectOnlyNode = (item) => {
|
69
|
-
const node = item;
|
70
|
-
return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.MULTIPLE_SELECT_ITEM;
|
71
|
-
};
|
72
|
-
const isMultipleSelectWithSubmenuNode = (item) => {
|
73
|
-
const node = item;
|
74
|
-
return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.MULTIPLE_SELECT_WITH_SUBMENU_ITEM;
|
59
|
+
return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type !== void 0 && node.dsId !== void 0;
|
75
60
|
};
|
61
|
+
const isActivableNode = (item) => isObjectAMenuNode(item) && item.plainItem?.type === import_constants.MENU_ITEMS_TYPES.ACTIVABLE_ITEM;
|
62
|
+
const isSkeletonNode = (item) => isObjectAMenuNode(item) && item.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SKELETON_ITEM;
|
63
|
+
const isMultipleSelectOnlyNode = (item) => isObjectAMenuNode(item) && item.plainItem?.type === import_constants.MENU_ITEMS_TYPES.MULTIPLE_SELECT_ITEM;
|
64
|
+
const isMultipleSelectWithSubmenuNode = (item) => isObjectAMenuNode(item) && item.plainItem?.type === import_constants.MENU_ITEMS_TYPES.MULTIPLE_SELECT_WITH_SUBMENU_ITEM;
|
76
65
|
const isMultipleSelectNode = (item) => isMultipleSelectOnlyNode(item) || isMultipleSelectWithSubmenuNode(item);
|
77
|
-
const isSingleSelectOnlyNode = (item) =>
|
78
|
-
|
79
|
-
return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SINGLE_SELECT_ITEM;
|
80
|
-
};
|
81
|
-
const isSingleSelectNodeWithSubmenu = (item) => {
|
82
|
-
const node = item;
|
83
|
-
return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SINGLE_SELECT_WITH_SUBMENU_ITEM;
|
84
|
-
};
|
66
|
+
const isSingleSelectOnlyNode = (item) => isObjectAMenuNode(item) && item.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SINGLE_SELECT_ITEM;
|
67
|
+
const isSingleSelectNodeWithSubmenu = (item) => isObjectAMenuNode(item) && item.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SINGLE_SELECT_WITH_SUBMENU_ITEM;
|
85
68
|
const isSingleSelectNode = (item) => isSingleSelectOnlyNode(item) || isSingleSelectNodeWithSubmenu(item);
|
86
69
|
const isSelectionableNode = (item) => isMultipleSelectNode(item) || isSingleSelectNode(item);
|
87
|
-
const getSelectionableNodes = (tree) =>
|
88
|
-
|
89
|
-
return flattenNodes.filter(isSelectionableNode);
|
90
|
-
};
|
91
|
-
const isWithSubmenuOnlyNode = (item) => {
|
92
|
-
const node = item;
|
93
|
-
return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.WITH_SUBMENU_ITEM;
|
94
|
-
};
|
70
|
+
const getSelectionableNodes = (tree) => tree.flatten().filter(isSelectionableNode);
|
71
|
+
const isWithSubmenuOnlyNode = (item) => isObjectAMenuNode(item) && item.plainItem?.type === import_constants.MENU_ITEMS_TYPES.WITH_SUBMENU_ITEM;
|
95
72
|
const isSelectionableWithSubmenuNode = (item) => isSingleSelectNodeWithSubmenu(item) || isMultipleSelectWithSubmenuNode(item);
|
96
|
-
const
|
97
|
-
const
|
98
|
-
|
99
|
-
|
100
|
-
};
|
101
|
-
const isFocusableNode = (item) => {
|
102
|
-
const node = item;
|
103
|
-
return typeof item === "object" && item !== null && typeof node.plainItem === "object" && typeof node.plainItem.type === "string" && (node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.WITH_SUBMENU_ITEM || node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.MULTIPLE_SELECT_ITEM || node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.MULTIPLE_SELECT_WITH_SUBMENU_ITEM || node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SINGLE_SELECT_ITEM || node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SINGLE_SELECT_WITH_SUBMENU_ITEM || node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.ACTIVABLE_ITEM || node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.ACTIVABLE_WITH_SUBMENU_ITEM || node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SKELETON_ITEM);
|
104
|
-
};
|
73
|
+
const isActivableWithSubmenuNode = (item) => isObjectAMenuNode(item) && item.plainItem?.type === import_constants.MENU_ITEMS_TYPES.ACTIVABLE_WITH_SUBMENU_ITEM;
|
74
|
+
const isWithSubmenuNode = (item) => isWithSubmenuOnlyNode(item) || isSelectionableWithSubmenuNode(item) || isActivableWithSubmenuNode(item);
|
75
|
+
const getWithSubmenuNodes = (tree) => tree.flatten().filter(isWithSubmenuNode);
|
76
|
+
const isFocusableNode = (item) => isSelectionableNode(item) || isActivableNode(item) || isWithSubmenuNode(item) || isSkeletonNode(item);
|
105
77
|
const getFocusableNodes = (tree) => {
|
106
78
|
const flattenNodes = tree.flatten();
|
107
79
|
return flattenNodes.filter(isFocusableNode);
|
108
80
|
};
|
109
|
-
const isSeparatorNode = (item) =>
|
110
|
-
|
111
|
-
|
112
|
-
};
|
113
|
-
const isGroup = (item) => {
|
114
|
-
const node = item;
|
115
|
-
return typeof item === "object" && item !== null && typeof node.plainItem === "object" && node.plainItem?.type === import_constants.MENU_ITEMS_TYPES.GROUP;
|
116
|
-
};
|
117
|
-
const isRootNode = (item) => {
|
118
|
-
const node = item;
|
119
|
-
return typeof item === "object" && item !== null && typeof node.plainItem === "object" && // hardcoded string because the root item is not a renderable item and must always be treated with special care
|
120
|
-
node.plainItem?.type === "ROOT_ITEM";
|
121
|
-
};
|
81
|
+
const isSeparatorNode = (item) => isObjectAMenuNode(item) && item.plainItem?.type === import_constants.MENU_ITEMS_TYPES.SEPARATOR;
|
82
|
+
const isGroup = (item) => isObjectAMenuNode(item) && item.plainItem?.type === import_constants.MENU_ITEMS_TYPES.GROUP;
|
83
|
+
const isRootNode = (item) => isObjectAMenuNode(item) && item.plainItem?.type === "ROOT_ITEM";
|
122
84
|
const isMenuNodeAllowedToHaveChildren = (item) => isRootNode(item) || isWithSubmenuNode(item) || isGroup(item) || isSingleSelectNodeWithSubmenu(item) || isMultipleSelectWithSubmenuNode(item) || isActivableWithSubmenuNode(item);
|
123
85
|
//# sourceMappingURL=nodesTypeguardsAndGetters.js.map
|
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"version": 3,
|
3
3
|
"sources": ["../../../src/utils/nodesTypeguardsAndGetters.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
|
4
|
-
"sourcesContent": ["/* eslint-disable complexity */\nimport { type DSMenuButtonT } from '../react-desc-prop-types.js';\n\nimport { MENU_ITEMS_TYPES } from '../constants/index.js';\n// =============================================================================\n// Focusable nodes\n// =============================================================================\nexport const isActivableNode = (item: unknown): item is DSMenuButtonT.MenuNodeActivableItem => {\n const node = item as { plainItem?: { type?: unknown } };\n return (\n typeof item === 'object' &&\n item !== null &&\n typeof node.plainItem === 'object' &&\n node.plainItem?.type === MENU_ITEMS_TYPES.ACTIVABLE_ITEM\n );\n};\nexport const isActivableWithSubmenuNode = (item: unknown): item is DSMenuButtonT.MenuNodeActivableWithSubmenuItem => {\n const node = item as { plainItem?: { type?: unknown } };\n return (\n typeof item === 'object' &&\n item !== null &&\n typeof node.plainItem === 'object' &&\n node.plainItem?.type === MENU_ITEMS_TYPES.ACTIVABLE_WITH_SUBMENU_ITEM\n );\n};\nexport const isSkeletonNode = (item: unknown): item is DSMenuButtonT.MenuNodeSkeletonItem => {\n const node = item as { plainItem?: { type?: unknown } };\n return (\n typeof item === 'object' &&\n item !== null &&\n typeof node.plainItem === 'object' &&\n node.plainItem?.type === MENU_ITEMS_TYPES.SKELETON_ITEM\n );\n};\n// =============================================================================\n// Focusable but more specifically specifically selectable nodes\n// =============================================================================\nexport const isMultipleSelectOnlyNode = (item: unknown): item is DSMenuButtonT.MenuNodeMultipleSelectItem => {\n const node = item as { plainItem?: { type?: unknown } };\n return (\n typeof item === 'object' &&\n item !== null &&\n typeof node.plainItem === 'object' &&\n node.plainItem?.type === MENU_ITEMS_TYPES.MULTIPLE_SELECT_ITEM\n );\n};\n\nexport const isMultipleSelectWithSubmenuNode = (\n item: unknown,\n): item is DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem => {\n const node = item as { plainItem?: { type?: unknown } };\n return (\n typeof item === 'object' &&\n item !== null &&\n typeof node.plainItem === 'object' &&\n node.plainItem?.type === MENU_ITEMS_TYPES.MULTIPLE_SELECT_WITH_SUBMENU_ITEM\n );\n};\nexport const isMultipleSelectNode = (item: unknown): item is DSMenuButtonT.MultipleSelectionableMenuNodes =>\n isMultipleSelectOnlyNode(item) || isMultipleSelectWithSubmenuNode(item);\n\nexport const isSingleSelectOnlyNode = (item: unknown): item is DSMenuButtonT.MenuNodeSingleSelectItem => {\n const node = item as { plainItem?: { type?: unknown } };\n return (\n typeof item === 'object' &&\n item !== null &&\n typeof node.plainItem === 'object' &&\n node.plainItem?.type === MENU_ITEMS_TYPES.SINGLE_SELECT_ITEM\n );\n};\n\nexport const isSingleSelectNodeWithSubmenu = (\n item: unknown,\n): item is DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem => {\n const node = item as { plainItem?: { type?: unknown } };\n return (\n typeof item === 'object' &&\n item !== null &&\n typeof node.plainItem === 'object' &&\n node.plainItem?.type === MENU_ITEMS_TYPES.SINGLE_SELECT_WITH_SUBMENU_ITEM\n );\n};\n\nexport const isSingleSelectNode = (item: unknown): item is DSMenuButtonT.SingleSelectionableMenuNodes =>\n isSingleSelectOnlyNode(item) || isSingleSelectNodeWithSubmenu(item);\n\nexport const isSelectionableNode = (item: unknown): item is DSMenuButtonT.SelectionableMenuNodes =>\n isMultipleSelectNode(item) || isSingleSelectNode(item);\n\nexport const getSelectionableNodes = (tree: DSMenuButtonT.MenuNode): DSMenuButtonT.SelectionableMenuNodes[] => {\n const flattenNodes = tree.flatten();\n return flattenNodes.filter(isSelectionableNode);\n};\n\n// =============================================================================\n// Focusable but more specifically with submenu nodes\n// =============================================================================\nexport const isWithSubmenuOnlyNode = (item: unknown): item is DSMenuButtonT.MenuNodeWithSubmenuItem => {\n const node = item as { plainItem?: { type?: unknown } };\n return (\n typeof item === 'object' &&\n item !== null &&\n typeof node.plainItem === 'object' &&\n node.plainItem?.type === MENU_ITEMS_TYPES.WITH_SUBMENU_ITEM\n );\n};\n\nexport const isSelectionableWithSubmenuNode = (\n item: unknown,\n): item is DSMenuButtonT.SelectionablesWithSubmenuMenuNodes =>\n isSingleSelectNodeWithSubmenu(item) || isMultipleSelectWithSubmenuNode(item);\n\nexport const isWithSubmenuNode = (item: unknown): item is DSMenuButtonT.WithSubmenuMenuNodes =>\n isWithSubmenuOnlyNode(item) ||\n isSingleSelectNodeWithSubmenu(item) ||\n isMultipleSelectWithSubmenuNode(item) ||\n isActivableWithSubmenuNode(item);\n\nexport const getWithSubmenuNodes = (tree: DSMenuButtonT.MenuNode): DSMenuButtonT.PseudoFocusableMenuNodes[] => {\n const flattenNodes = tree.flatten();\n return flattenNodes.filter(isWithSubmenuNode);\n};\n\nexport const isFocusableNode = (item: unknown): item is DSMenuButtonT.PseudoFocusableMenuNodes => {\n const node = item as { plainItem?: { type?: unknown } };\n return (\n typeof item === 'object' &&\n item !== null &&\n typeof node.plainItem === 'object' &&\n typeof node.plainItem.type === 'string' &&\n (node.plainItem?.type === MENU_ITEMS_TYPES.WITH_SUBMENU_ITEM ||\n node.plainItem?.type === MENU_ITEMS_TYPES.MULTIPLE_SELECT_ITEM ||\n node.plainItem?.type === MENU_ITEMS_TYPES.MULTIPLE_SELECT_WITH_SUBMENU_ITEM ||\n node.plainItem?.type === MENU_ITEMS_TYPES.SINGLE_SELECT_ITEM ||\n node.plainItem?.type === MENU_ITEMS_TYPES.SINGLE_SELECT_WITH_SUBMENU_ITEM ||\n node.plainItem?.type === MENU_ITEMS_TYPES.ACTIVABLE_ITEM ||\n node.plainItem?.type === MENU_ITEMS_TYPES.ACTIVABLE_WITH_SUBMENU_ITEM ||\n node.plainItem?.type === MENU_ITEMS_TYPES.SKELETON_ITEM)\n );\n};\n\nexport const getFocusableNodes = (tree: DSMenuButtonT.MenuNode): DSMenuButtonT.PseudoFocusableMenuNodes[] => {\n const flattenNodes = tree.flatten();\n return flattenNodes.filter(isFocusableNode);\n};\n\n// =============================================================================\n// Non focusable nodes\n// =============================================================================\nexport const isSeparatorNode = (item: unknown): item is DSMenuButtonT.MenuNodeSeparatorItem => {\n const node = item as { plainItem?: { type?: unknown } };\n return (\n typeof item === 'object' &&\n item !== null &&\n typeof node.plainItem === 'object' &&\n node.plainItem?.type === MENU_ITEMS_TYPES.SEPARATOR\n );\n};\n\nexport const isGroup = (item: unknown): item is DSMenuButtonT.MenuNodeGroupItem => {\n const node = item as { plainItem?: { type?: unknown } };\n return (\n typeof item === 'object' &&\n item !== null &&\n typeof node.plainItem === 'object' &&\n node.plainItem?.type === MENU_ITEMS_TYPES.GROUP\n );\n};\nexport const isRootNode = (item: unknown): item is DSMenuButtonT.MenuNodeRootItem => {\n const node = item as { plainItem?: { type?: unknown } };\n return (\n typeof item === 'object' &&\n item !== null &&\n typeof node.plainItem === 'object' &&\n // hardcoded string because the root item is not a renderable item and must always be treated with special care\n node.plainItem?.type === 'ROOT_ITEM'\n );\n};\n// =============================================================================\n// Nodes allowed/expected to have subItems/children\n// (the node not necessarily needs to be focusable or a submenu)\n// =============================================================================\nexport const isMenuNodeAllowedToHaveChildren = (item: unknown): item is DSMenuButtonT.MenuNodesAllowedToHaveChildren =>\n isRootNode(item) ||\n isWithSubmenuNode(item) ||\n isGroup(item) ||\n isSingleSelectNodeWithSubmenu(item) ||\n isMultipleSelectWithSubmenuNode(item) ||\n isActivableWithSubmenuNode(item);\n", "import * as React from 'react';\nexport { React };\n"],
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,uBAAiC;
|
4
|
+
"sourcesContent": ["/* eslint-disable complexity */\nimport { type DSMenuButtonT } from '../react-desc-prop-types.js';\n\nimport { MENU_ITEMS_TYPES } from '../constants/index.js';\n\n/**\n * Heuristic to determine if the selected item is an item or a node.\n * Not perfect because JavaScript is not typed.\n * If app devs provide an object that matches all of those conditions, it's an edge case the app devs should handle.\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is (heuristically) a menu node, false otherwise.\n */\nexport const isObjectAMenuNode = (item: unknown): item is DSMenuButtonT.MenuNode => {\n const node = item as { plainItem?: { type?: unknown }; dsId?: unknown };\n return (\n typeof item === 'object' &&\n item !== null &&\n typeof node.plainItem === 'object' &&\n node.plainItem?.type !== undefined &&\n node.dsId !== undefined\n );\n};\n\n// =============================================================================\n// Focusable nodes\n// =============================================================================\n/**\n * Checks if the item is an activable node.\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is an activable node, false otherwise.\n */\nexport const isActivableNode = (item: unknown): item is DSMenuButtonT.MenuNodeActivableItem =>\n isObjectAMenuNode(item) && item.plainItem?.type === MENU_ITEMS_TYPES.ACTIVABLE_ITEM;\n\n/**\n * Checks if the item is a skeleton node.\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is a skeleton node, false otherwise.\n */\nexport const isSkeletonNode = (item: unknown): item is DSMenuButtonT.MenuNodeSkeletonItem =>\n isObjectAMenuNode(item) && item.plainItem?.type === MENU_ITEMS_TYPES.SKELETON_ITEM;\n\n// =============================================================================\n// Focusable but more specifically selectable nodes\n// =============================================================================\n\n/**\n * Checks if the item is a multiple select only node.\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is a multiple select only node, false otherwise.\n */\nexport const isMultipleSelectOnlyNode = (item: unknown): item is DSMenuButtonT.MenuNodeMultipleSelectItem =>\n isObjectAMenuNode(item) && item.plainItem?.type === MENU_ITEMS_TYPES.MULTIPLE_SELECT_ITEM;\n\n/**\n * Checks if the item is a multiple select node with a submenu.\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is a multiple select node with a submenu, false otherwise.\n */\nexport const isMultipleSelectWithSubmenuNode = (\n item: unknown,\n): item is DSMenuButtonT.MenuNodeMultipleSelectWithSubmenuItem =>\n isObjectAMenuNode(item) && item.plainItem?.type === MENU_ITEMS_TYPES.MULTIPLE_SELECT_WITH_SUBMENU_ITEM;\n\n/**\n * Checks if the item is a multiple select node.\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is a multiple select node, false otherwise.\n */\nexport const isMultipleSelectNode = (item: unknown): item is DSMenuButtonT.MultipleSelectionableMenuNodes =>\n isMultipleSelectOnlyNode(item) || isMultipleSelectWithSubmenuNode(item);\n\n/**\n * Checks if the item is a single select only node.\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is a single select only node, false otherwise.\n */\nexport const isSingleSelectOnlyNode = (item: unknown): item is DSMenuButtonT.MenuNodeSingleSelectItem =>\n isObjectAMenuNode(item) && item.plainItem?.type === MENU_ITEMS_TYPES.SINGLE_SELECT_ITEM;\n\n/**\n * Checks if the item is a single select node with a submenu.\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is a single select node with a submenu, false otherwise.\n */\nexport const isSingleSelectNodeWithSubmenu = (\n item: unknown,\n): item is DSMenuButtonT.MenuNodeSingleSelectWithSubmenuItem =>\n isObjectAMenuNode(item) && item.plainItem?.type === MENU_ITEMS_TYPES.SINGLE_SELECT_WITH_SUBMENU_ITEM;\n\n/**\n * Checks if the item is a single select node.\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is a single select node, false otherwise.\n */\nexport const isSingleSelectNode = (item: unknown): item is DSMenuButtonT.SingleSelectionableMenuNodes =>\n isSingleSelectOnlyNode(item) || isSingleSelectNodeWithSubmenu(item);\n\n/**\n * Checks if the item is a selectionable node.\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is a selectionable node, false otherwise.\n */\nexport const isSelectionableNode = (item: unknown): item is DSMenuButtonT.SelectionableMenuNodes =>\n isMultipleSelectNode(item) || isSingleSelectNode(item);\n\n/**\n * Gets all selectionable nodes from the tree.\n * @param {DSMenuButtonT.MenuNode} tree - The tree to search.\n * @returns {DSMenuButtonT.SelectionableMenuNodes[]} - An array of selectionable nodes.\n */\nexport const getSelectionableNodes = (tree: DSMenuButtonT.MenuNode): DSMenuButtonT.SelectionableMenuNodes[] =>\n tree.flatten().filter(isSelectionableNode);\n// =============================================================================\n// Focusable but more specifically with submenu nodes\n// =============================================================================\n/**\n * Checks if the item is a node with a submenu (and nothing else).\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is a node with a submenu, false otherwise.\n */\nexport const isWithSubmenuOnlyNode = (item: unknown): item is DSMenuButtonT.MenuNodeWithSubmenuItem =>\n isObjectAMenuNode(item) && item.plainItem?.type === MENU_ITEMS_TYPES.WITH_SUBMENU_ITEM;\n\n/**\n * Checks if the item is a selectionable node with a submenu.\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is a selectionable node with a submenu, false otherwise.\n */\nexport const isSelectionableWithSubmenuNode = (\n item: unknown,\n): item is DSMenuButtonT.SelectionablesWithSubmenuMenuNodes =>\n isSingleSelectNodeWithSubmenu(item) || isMultipleSelectWithSubmenuNode(item);\n/**\n * Checks if the item is an activable node with a submenu.\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is an activable node with a submenu, false otherwise.\n */\nexport const isActivableWithSubmenuNode = (item: unknown): item is DSMenuButtonT.MenuNodeActivableWithSubmenuItem =>\n isObjectAMenuNode(item) && item.plainItem?.type === MENU_ITEMS_TYPES.ACTIVABLE_WITH_SUBMENU_ITEM;\n\n/**\n * Checks if the item is a node with a submenu.\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is a node with a submenu, false otherwise.\n */\nexport const isWithSubmenuNode = (item: unknown): item is DSMenuButtonT.WithSubmenuMenuNodes =>\n isWithSubmenuOnlyNode(item) || isSelectionableWithSubmenuNode(item) || isActivableWithSubmenuNode(item);\n\n/**\n * Gets all nodes with a submenu from the tree.\n * @param {DSMenuButtonT.MenuNode} tree - The tree to search.\n * @returns {DSMenuButtonT.PseudoFocusableMenuNodes[]} - An array of nodes with a submenu.\n */\nexport const getWithSubmenuNodes = (tree: DSMenuButtonT.MenuNode): DSMenuButtonT.PseudoFocusableMenuNodes[] =>\n tree.flatten().filter(isWithSubmenuNode);\n/**\n * Checks if the item is a node that can be focused.\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is a node that can be focused, false otherwise.\n */\nexport const isFocusableNode = (item: unknown): item is DSMenuButtonT.PseudoFocusableMenuNodes =>\n isSelectionableNode(item) || isActivableNode(item) || isWithSubmenuNode(item) || isSkeletonNode(item);\n\n/**\n * Gets all nodes that can be focused from the tree.\n * @param {DSMenuButtonT.MenuNode} tree - The tree to search.\n * @returns {DSMenuButtonT.PseudoFocusableMenuNodes[]} - An array of nodes that can be focused.\n */\nexport const getFocusableNodes = (tree: DSMenuButtonT.MenuNode): DSMenuButtonT.PseudoFocusableMenuNodes[] => {\n const flattenNodes = tree.flatten();\n return flattenNodes.filter(isFocusableNode);\n};\n\n// =============================================================================\n// Non focusable nodes\n// =============================================================================\n/**\n * Checks if the item is a separator node.\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is a separator node, false otherwise.\n */\nexport const isSeparatorNode = (item: unknown): item is DSMenuButtonT.MenuNodeSeparatorItem =>\n isObjectAMenuNode(item) && item.plainItem?.type === MENU_ITEMS_TYPES.SEPARATOR;\n/**\n * Checks if the item is a group node.\n * @param {unknown} item - The item to check.\n * @returns {boolean} - True if the item is a group node, false otherwise.\n */\nexport const isGroup = (item: unknown): item is DSMenuButtonT.MenuNodeGroupItem =>\n isObjectAMenuNode(item) && item.plainItem?.type === MENU_ITEMS_TYPES.GROUP;\n\n/**\n * Checks if the given item is a root node of the menu.\n * @param {DSMenuButtonT.MenuNode} tree - The tree to search.\n * @returns {DSMenuButtonT.PseudoFocusableMenuNodes[]} - An array of nodes that can be focused.\n * @remarks\n * The root item is not a renderable item and must always be treated with special care.\n *\n * This function uses a hardcoded string to identify the root item.\n */\nexport const isRootNode = (item: unknown): item is DSMenuButtonT.MenuNodeRootItem =>\n isObjectAMenuNode(item) && (item.plainItem?.type as string) === 'ROOT_ITEM';\n\n// =============================================================================\n// Nodes allowed/expected to have subItems/children\n// (the node not necessarily needs to be focusable or a submenu, E.G. a group)\n// =============================================================================\nexport const isMenuNodeAllowedToHaveChildren = (item: unknown): item is DSMenuButtonT.MenuNodesAllowedToHaveChildren =>\n isRootNode(item) ||\n isWithSubmenuNode(item) ||\n isGroup(item) ||\n isSingleSelectNodeWithSubmenu(item) ||\n isMultipleSelectWithSubmenuNode(item) ||\n isActivableWithSubmenuNode(item);\n", "import * as React from 'react';\nexport { React };\n"],
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,uBAAiC;AAS1B,MAAM,oBAAoB,CAAC,SAAkD;AAClF,QAAM,OAAO;AACb,SACE,OAAO,SAAS,YAChB,SAAS,QACT,OAAO,KAAK,cAAc,YAC1B,KAAK,WAAW,SAAS,UACzB,KAAK,SAAS;AAElB;AAUO,MAAM,kBAAkB,CAAC,SAC9B,kBAAkB,IAAI,KAAK,KAAK,WAAW,SAAS,kCAAiB;AAOhE,MAAM,iBAAiB,CAAC,SAC7B,kBAAkB,IAAI,KAAK,KAAK,WAAW,SAAS,kCAAiB;AAWhE,MAAM,2BAA2B,CAAC,SACvC,kBAAkB,IAAI,KAAK,KAAK,WAAW,SAAS,kCAAiB;AAOhE,MAAM,kCAAkC,CAC7C,SAEA,kBAAkB,IAAI,KAAK,KAAK,WAAW,SAAS,kCAAiB;AAOhE,MAAM,uBAAuB,CAAC,SACnC,yBAAyB,IAAI,KAAK,gCAAgC,IAAI;AAOjE,MAAM,yBAAyB,CAAC,SACrC,kBAAkB,IAAI,KAAK,KAAK,WAAW,SAAS,kCAAiB;AAOhE,MAAM,gCAAgC,CAC3C,SAEA,kBAAkB,IAAI,KAAK,KAAK,WAAW,SAAS,kCAAiB;AAOhE,MAAM,qBAAqB,CAAC,SACjC,uBAAuB,IAAI,KAAK,8BAA8B,IAAI;AAO7D,MAAM,sBAAsB,CAAC,SAClC,qBAAqB,IAAI,KAAK,mBAAmB,IAAI;AAOhD,MAAM,wBAAwB,CAAC,SACpC,KAAK,QAAQ,EAAE,OAAO,mBAAmB;AASpC,MAAM,wBAAwB,CAAC,SACpC,kBAAkB,IAAI,KAAK,KAAK,WAAW,SAAS,kCAAiB;AAOhE,MAAM,iCAAiC,CAC5C,SAEA,8BAA8B,IAAI,KAAK,gCAAgC,IAAI;AAMtE,MAAM,6BAA6B,CAAC,SACzC,kBAAkB,IAAI,KAAK,KAAK,WAAW,SAAS,kCAAiB;AAOhE,MAAM,oBAAoB,CAAC,SAChC,sBAAsB,IAAI,KAAK,+BAA+B,IAAI,KAAK,2BAA2B,IAAI;AAOjG,MAAM,sBAAsB,CAAC,SAClC,KAAK,QAAQ,EAAE,OAAO,iBAAiB;AAMlC,MAAM,kBAAkB,CAAC,SAC9B,oBAAoB,IAAI,KAAK,gBAAgB,IAAI,KAAK,kBAAkB,IAAI,KAAK,eAAe,IAAI;AAO/F,MAAM,oBAAoB,CAAC,SAA2E;AAC3G,QAAM,eAAe,KAAK,QAAQ;AAClC,SAAO,aAAa,OAAO,eAAe;AAC5C;AAUO,MAAM,kBAAkB,CAAC,SAC9B,kBAAkB,IAAI,KAAK,KAAK,WAAW,SAAS,kCAAiB;AAMhE,MAAM,UAAU,CAAC,SACtB,kBAAkB,IAAI,KAAK,KAAK,WAAW,SAAS,kCAAiB;AAWhE,MAAM,aAAa,CAAC,SACzB,kBAAkB,IAAI,KAAM,KAAK,WAAW,SAAoB;AAM3D,MAAM,kCAAkC,CAAC,SAC9C,WAAW,IAAI,KACf,kBAAkB,IAAI,KACtB,QAAQ,IAAI,KACZ,8BAA8B,IAAI,KAClC,gCAAgC,IAAI,KACpC,2BAA2B,IAAI;",
|
6
6
|
"names": []
|
7
7
|
}
|