@elliemae/ds-menu-button 3.60.0-next.14 → 3.60.0-next.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/cjs/index.js CHANGED
@@ -28,14 +28,20 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
28
28
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
29
  var index_exports = {};
30
30
  __export(index_exports, {
31
+ DSFlyoutMenuName: () => import_constants3.DSFlyoutMenuName,
31
32
  DSMenuButton: () => import_DSMenuButton.DSMenuButton,
32
33
  DSMenuButtonName: () => import_constants.DSMenuButtonName,
33
34
  DSMenuButtonPropTypes: () => import_react_desc_prop_types.DSMenuButtonPropTypes,
34
35
  DSMenuButtonWithSchema: () => import_DSMenuButton.DSMenuButtonWithSchema,
36
+ DSMenuItemRendererFactoryName: () => import_constants4.DSMenuItemRendererFactoryName,
37
+ DSOpinionatedButtonName: () => import_constants2.DSOpinionatedButtonName,
38
+ FLYOUT_MENU_SLOTS: () => import_constants3.FLYOUT_MENU_SLOTS,
35
39
  MENU_BUTTON_DATA_TESTID: () => import_constants.MENU_BUTTON_DATA_TESTID,
36
40
  MENU_BUTTON_SLOTS: () => import_constants.MENU_BUTTON_SLOTS,
37
41
  MENU_BUTTON_WITH_PARTS_SLOTS: () => import_constants.MENU_BUTTON_WITH_PARTS_SLOTS,
38
42
  MENU_ITEMS_TYPES: () => import_constants.MENU_ITEMS_TYPES,
43
+ MENU_ITEM_RENDERER_FACTORY_SLOTS: () => import_constants4.MENU_ITEM_RENDERER_FACTORY_SLOTS,
44
+ OPINIONATED_BUTTON_SLOTS: () => import_constants2.OPINIONATED_BUTTON_SLOTS,
39
45
  isFocusableNode: () => import_nodesTypeguardsAndGetters.isFocusableNode,
40
46
  useOptionsArrayToDsTree: () => import_useOptionsArrayToDsTree.useOptionsArrayToDsTree
41
47
  });
@@ -44,6 +50,9 @@ var React = __toESM(require("react"));
44
50
  var import_DSMenuButton = require("./DSMenuButton.js");
45
51
  var import_react_desc_prop_types = require("./react-desc-prop-types.js");
46
52
  var import_constants = require("./constants/index.js");
53
+ var import_constants2 = require("./parts/DSOpinionatedButton/constants/index.js");
54
+ var import_constants3 = require("./parts/DSFlyoutMenu/constants/index.js");
55
+ var import_constants4 = require("./parts/DSMenuItemRendererFactory/constants/index.js");
47
56
  var import_nodesTypeguardsAndGetters = require("./utils/nodesTypeguardsAndGetters.js");
48
57
  var import_useOptionsArrayToDsTree = require("./utils/useOptionsArrayToDsTree.js");
49
58
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/index.ts", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["// this is a workaround to typescript error TS2742\n// https://github.com/microsoft/TypeScript/issues/47663\nimport type {} from '@xstyled/system';\nexport { DSMenuButton, DSMenuButtonWithSchema } from './DSMenuButton.js';\nexport { type DSMenuButtonT, DSMenuButtonPropTypes } from './react-desc-prop-types.js';\nexport {\n MENU_BUTTON_SLOTS,\n DSMenuButtonName,\n MENU_BUTTON_DATA_TESTID,\n MENU_ITEMS_TYPES,\n MENU_BUTTON_WITH_PARTS_SLOTS,\n} from './constants/index.js';\nexport { isFocusableNode } from './utils/nodesTypeguardsAndGetters.js';\nexport { useOptionsArrayToDsTree } from './utils/useOptionsArrayToDsTree.js';\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;ACAA,YAAuB;ADGvB,0BAAqD;AACrD,mCAA0D;AAC1D,uBAMO;AACP,uCAAgC;AAChC,qCAAwC;",
6
- "names": []
4
+ "sourcesContent": ["// this is a workaround to typescript error TS2742\n// https://github.com/microsoft/TypeScript/issues/47663\nimport type {} from '@xstyled/system';\nexport { DSMenuButton, DSMenuButtonWithSchema } from './DSMenuButton.js';\nexport { type DSMenuButtonT, DSMenuButtonPropTypes } from './react-desc-prop-types.js';\nexport {\n MENU_BUTTON_SLOTS,\n DSMenuButtonName,\n MENU_BUTTON_DATA_TESTID,\n MENU_ITEMS_TYPES,\n MENU_BUTTON_WITH_PARTS_SLOTS,\n} from './constants/index.js';\n\nexport { DSOpinionatedButtonName, OPINIONATED_BUTTON_SLOTS } from './parts/DSOpinionatedButton/constants/index.js';\nexport { DSFlyoutMenuName, FLYOUT_MENU_SLOTS } from './parts/DSFlyoutMenu/constants/index.js';\nexport {\n DSMenuItemRendererFactoryName,\n MENU_ITEM_RENDERER_FACTORY_SLOTS,\n} from './parts/DSMenuItemRendererFactory/constants/index.js';\n\nexport { isFocusableNode } from './utils/nodesTypeguardsAndGetters.js';\nexport { useOptionsArrayToDsTree } from './utils/useOptionsArrayToDsTree.js';\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;ACAA,YAAuB;ADGvB,0BAAqD;AACrD,mCAA0D;AAC1D,uBAMO;AAEP,IAAAA,oBAAkE;AAClE,IAAAA,oBAAoD;AACpD,IAAAA,oBAGO;AAEP,uCAAgC;AAChC,qCAAwC;",
6
+ "names": ["import_constants"]
7
7
  }
@@ -105,6 +105,7 @@ const DSFlyoutMenu = (props) => {
105
105
  onAnimationEnd: handleAnimationEnd,
106
106
  getOwnerProps,
107
107
  getOwnerPropsArguments,
108
+ "data-testid": "ds-floating-wrapper-root",
108
109
  children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledWrapper, { getOwnerProps, getOwnerPropsArguments, ...xstyledProps, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
109
110
  StyledMenu,
110
111
  {
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/parts/DSFlyoutMenu/DSFlyoutMenu.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { FloatingWrapper } from '@elliemae/ds-floating-context';\nimport { Grid } from '@elliemae/ds-grid';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { styled, xStyledCommonProps } from '@elliemae/ds-system';\n\nimport React from 'react';\nimport { type DSMenuButtonT, menuSpecificDefaultProps } from '../../react-desc-prop-types.js';\nimport { MenuBehaviouralContextProviderContext } from '../DSMenuBehaviouralContextProvider/MenuBehaviouralContextProviderCTX.js';\nimport { DSMenuItemRendererFactory } from '../DSMenuItemRendererFactory/index.js';\nimport { useFlyoutMenu } from './config/useFlyoutMenu.js';\nimport { DSFlyoutMenuName, FLYOUT_MENU_SLOTS } from './constants/index.js';\nimport { DSFlyoutMenuPropTypesSchema, type DSFlyoutMenuT } from './react-desc-prop-types.js';\nimport { isRootNode } from '../../utils/nodesTypeguardsAndGetters.js';\nimport { MenuButtonContextProvider } from '../../MenuButtonContextProviderCTX.js';\nconst StyledWrapper = styled(Grid, {\n name: DSFlyoutMenuName,\n slot: FLYOUT_MENU_SLOTS.ROOT,\n})`\n min-width: 1px;\n background-color: white;\n padding: ${({ theme }) => theme.space.xxxs} 0;\n ${xStyledCommonProps}\n`;\n\nconst StyledFloatingWrapper = styled(FloatingWrapper, {\n name: DSFlyoutMenuName,\n slot: FLYOUT_MENU_SLOTS.FLOATING_WRAPPER,\n})``;\n\nconst StyledMenu = styled('div', { name: DSFlyoutMenuName, slot: FLYOUT_MENU_SLOTS.LIST_WRAPPER })<{\n $maxHeight: string | number;\n}>`\n max-height: ${({ $maxHeight }) => (typeof $maxHeight === 'number' ? `${$maxHeight}px` : $maxHeight)};\n overflow-y: auto;\n padding: 0;\n margin: 0;\n`;\n\nconst NoComponentPlaceholder = () => null;\n\nconst DSFlyoutMenu: React.ComponentType<DSFlyoutMenuT.Props> = (props) => {\n const { propsWithDefault, xstyledProps } = useFlyoutMenu(props);\n const {\n ownerProps: { getOwnerProps, getOwnerPropsArguments },\n } = React.useContext(MenuButtonContextProvider);\n const {\n instanceUid,\n globalEventsHelpers: { mainMenuRef, handleSubmenusRefChange },\n } = React.useContext(MenuBehaviouralContextProviderContext);\n const [didAnimationEnd, setDidAnimationEnd] = React.useState(false);\n\n const { setFloatingRef, floatingStyles, floatingContext, ItemRenderer, isMenuOpen, itemNode } = propsWithDefault;\n const handleRefChange = React.useCallback(\n (node: HTMLDivElement) => {\n if (isRootNode(itemNode)) {\n mainMenuRef.current = node;\n return;\n }\n handleSubmenusRefChange(node, itemNode.dsId);\n },\n [handleSubmenusRefChange, itemNode, mainMenuRef],\n );\n\n const handleAnimationStartTrigger = React.useCallback(() => {\n setDidAnimationEnd(false);\n }, []);\n const handleAnimationEnd = React.useCallback(() => {\n setDidAnimationEnd(true);\n }, []);\n\n return (\n <StyledFloatingWrapper\n innerRef={setFloatingRef}\n floatingStyles={floatingStyles}\n isOpen={isMenuOpen}\n context={floatingContext}\n onAnimationStartTriggered={handleAnimationStartTrigger}\n onAnimationEnd={handleAnimationEnd}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <StyledWrapper getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments} {...xstyledProps}>\n <StyledMenu\n role=\"menu\"\n innerRef={handleRefChange}\n $maxHeight={itemNode.plainItem.maxHeight ?? menuSpecificDefaultProps.maxHeight}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {itemNode.children.map((optionNode) => (\n <DSMenuItemRendererFactory\n key={`flyout-menu-item-${optionNode.dsId}-${instanceUid}`}\n // DSTree doesn't support children having a polymorphic type, so we need to cast it manually\n itemNode={optionNode as DSMenuButtonT.MenuNode}\n ItemRenderer={ItemRenderer}\n // we are passing the DSFlyoutMenu component as a prop to the DSMenuItemRendererFactory\n // this solves the circular-ish dependency\n // the conditional `didAnimationEnd` solves the visual artefact of nested FloatingWrapper wrongly positioned due to animation\n FlyoutMenuCircularDepInject={didAnimationEnd ? DSFlyoutMenu : NoComponentPlaceholder}\n />\n ))}\n </StyledMenu>\n </StyledWrapper>\n </StyledFloatingWrapper>\n );\n};\n\nDSFlyoutMenu.displayName = DSFlyoutMenuName;\nconst DSFlyoutMenuWithSchema = describe(DSFlyoutMenu);\nDSFlyoutMenuWithSchema.propTypes = DSFlyoutMenuPropTypesSchema;\n\nexport { DSFlyoutMenu, DSFlyoutMenuWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD0FX;AA1FZ,iCAAgC;AAChC,qBAAqB;AACrB,8BAAyB;AACzB,uBAA2C;AAE3C,mBAAkB;AAClB,mCAA6D;AAC7D,+CAAsD;AACtD,uCAA0C;AAC1C,2BAA8B;AAC9B,uBAAoD;AACpD,IAAAA,gCAAgE;AAChE,uCAA2B;AAC3B,0CAA0C;AAC1C,MAAM,oBAAgB,yBAAO,qBAAM;AAAA,EACjC,MAAM;AAAA,EACN,MAAM,mCAAkB;AAC1B,CAAC;AAAA;AAAA;AAAA,aAGY,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM,IAAI;AAAA,IACxC,mCAAkB;AAAA;AAGtB,MAAM,4BAAwB,yBAAO,4CAAiB;AAAA,EACpD,MAAM;AAAA,EACN,MAAM,mCAAkB;AAC1B,CAAC;AAED,MAAM,iBAAa,yBAAO,OAAO,EAAE,MAAM,mCAAkB,MAAM,mCAAkB,aAAa,CAAC;AAAA,gBAGjF,CAAC,EAAE,WAAW,MAAO,OAAO,eAAe,WAAW,GAAG,UAAU,OAAO,UAAW;AAAA;AAAA;AAAA;AAAA;AAMrG,MAAM,yBAAyB,MAAM;AAErC,MAAM,eAAyD,CAAC,UAAU;AACxE,QAAM,EAAE,kBAAkB,aAAa,QAAI,oCAAc,KAAK;AAC9D,QAAM;AAAA,IACJ,YAAY,EAAE,eAAe,uBAAuB;AAAA,EACtD,IAAI,aAAAC,QAAM,WAAW,6DAAyB;AAC9C,QAAM;AAAA,IACJ;AAAA,IACA,qBAAqB,EAAE,aAAa,wBAAwB;AAAA,EAC9D,IAAI,aAAAA,QAAM,WAAW,8EAAqC;AAC1D,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,aAAAA,QAAM,SAAS,KAAK;AAElE,QAAM,EAAE,gBAAgB,gBAAgB,iBAAiB,cAAc,YAAY,SAAS,IAAI;AAChG,QAAM,kBAAkB,aAAAA,QAAM;AAAA,IAC5B,CAAC,SAAyB;AACxB,cAAI,6CAAW,QAAQ,GAAG;AACxB,oBAAY,UAAU;AACtB;AAAA,MACF;AACA,8BAAwB,MAAM,SAAS,IAAI;AAAA,IAC7C;AAAA,IACA,CAAC,yBAAyB,UAAU,WAAW;AAAA,EACjD;AAEA,QAAM,8BAA8B,aAAAA,QAAM,YAAY,MAAM;AAC1D,uBAAmB,KAAK;AAAA,EAC1B,GAAG,CAAC,CAAC;AACL,QAAM,qBAAqB,aAAAA,QAAM,YAAY,MAAM;AACjD,uBAAmB,IAAI;AAAA,EACzB,GAAG,CAAC,CAAC;AAEL,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV;AAAA,MACA,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,2BAA2B;AAAA,MAC3B,gBAAgB;AAAA,MAChB;AAAA,MACA;AAAA,MAEA,sDAAC,iBAAc,eAA8B,wBAAiD,GAAG,cAC/F;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAU;AAAA,UACV,YAAY,SAAS,UAAU,aAAa,sDAAyB;AAAA,UACrE;AAAA,UACA;AAAA,UAEC,mBAAS,SAAS,IAAI,CAAC,eACtB;AAAA,YAAC;AAAA;AAAA,cAGC,UAAU;AAAA,cACV;AAAA,cAIA,6BAA6B,kBAAkB,eAAe;AAAA;AAAA,YAPzD,oBAAoB,WAAW,IAAI,IAAI,WAAW;AAAA,UAQzD,CACD;AAAA;AAAA,MACH,GACF;AAAA;AAAA,EACF;AAEJ;AAEA,aAAa,cAAc;AAC3B,MAAM,6BAAyB,kCAAS,YAAY;AACpD,uBAAuB,YAAY;",
4
+ "sourcesContent": ["import { FloatingWrapper } from '@elliemae/ds-floating-context';\nimport { Grid } from '@elliemae/ds-grid';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { styled, xStyledCommonProps } from '@elliemae/ds-system';\n\nimport React from 'react';\nimport { type DSMenuButtonT, menuSpecificDefaultProps } from '../../react-desc-prop-types.js';\nimport { MenuBehaviouralContextProviderContext } from '../DSMenuBehaviouralContextProvider/MenuBehaviouralContextProviderCTX.js';\nimport { DSMenuItemRendererFactory } from '../DSMenuItemRendererFactory/index.js';\nimport { useFlyoutMenu } from './config/useFlyoutMenu.js';\nimport { DSFlyoutMenuName, FLYOUT_MENU_SLOTS } from './constants/index.js';\nimport { DSFlyoutMenuPropTypesSchema, type DSFlyoutMenuT } from './react-desc-prop-types.js';\nimport { isRootNode } from '../../utils/nodesTypeguardsAndGetters.js';\nimport { MenuButtonContextProvider } from '../../MenuButtonContextProviderCTX.js';\nconst StyledWrapper = styled(Grid, {\n name: DSFlyoutMenuName,\n slot: FLYOUT_MENU_SLOTS.ROOT,\n})`\n min-width: 1px;\n background-color: white;\n padding: ${({ theme }) => theme.space.xxxs} 0;\n ${xStyledCommonProps}\n`;\n\nconst StyledFloatingWrapper = styled(FloatingWrapper, {\n name: DSFlyoutMenuName,\n slot: FLYOUT_MENU_SLOTS.FLOATING_WRAPPER,\n})``;\n\nconst StyledMenu = styled('div', { name: DSFlyoutMenuName, slot: FLYOUT_MENU_SLOTS.LIST_WRAPPER })<{\n $maxHeight: string | number;\n}>`\n max-height: ${({ $maxHeight }) => (typeof $maxHeight === 'number' ? `${$maxHeight}px` : $maxHeight)};\n overflow-y: auto;\n padding: 0;\n margin: 0;\n`;\n\nconst NoComponentPlaceholder = () => null;\n\nconst DSFlyoutMenu: React.ComponentType<DSFlyoutMenuT.Props> = (props) => {\n const { propsWithDefault, xstyledProps } = useFlyoutMenu(props);\n const {\n ownerProps: { getOwnerProps, getOwnerPropsArguments },\n } = React.useContext(MenuButtonContextProvider);\n const {\n instanceUid,\n globalEventsHelpers: { mainMenuRef, handleSubmenusRefChange },\n } = React.useContext(MenuBehaviouralContextProviderContext);\n const [didAnimationEnd, setDidAnimationEnd] = React.useState(false);\n\n const { setFloatingRef, floatingStyles, floatingContext, ItemRenderer, isMenuOpen, itemNode } = propsWithDefault;\n const handleRefChange = React.useCallback(\n (node: HTMLDivElement) => {\n if (isRootNode(itemNode)) {\n mainMenuRef.current = node;\n return;\n }\n handleSubmenusRefChange(node, itemNode.dsId);\n },\n [handleSubmenusRefChange, itemNode, mainMenuRef],\n );\n\n const handleAnimationStartTrigger = React.useCallback(() => {\n setDidAnimationEnd(false);\n }, []);\n const handleAnimationEnd = React.useCallback(() => {\n setDidAnimationEnd(true);\n }, []);\n\n return (\n <StyledFloatingWrapper\n innerRef={setFloatingRef}\n floatingStyles={floatingStyles}\n isOpen={isMenuOpen}\n context={floatingContext}\n onAnimationStartTriggered={handleAnimationStartTrigger}\n onAnimationEnd={handleAnimationEnd}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n // Adding a data-testid for legacy e2e tests\n data-testid=\"ds-floating-wrapper-root\"\n >\n <StyledWrapper getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments} {...xstyledProps}>\n <StyledMenu\n role=\"menu\"\n innerRef={handleRefChange}\n $maxHeight={itemNode.plainItem.maxHeight ?? menuSpecificDefaultProps.maxHeight}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {itemNode.children.map((optionNode) => (\n <DSMenuItemRendererFactory\n key={`flyout-menu-item-${optionNode.dsId}-${instanceUid}`}\n // DSTree doesn't support children having a polymorphic type, so we need to cast it manually\n itemNode={optionNode as DSMenuButtonT.MenuNode}\n ItemRenderer={ItemRenderer}\n // we are passing the DSFlyoutMenu component as a prop to the DSMenuItemRendererFactory\n // this solves the circular-ish dependency\n // the conditional `didAnimationEnd` solves the visual artefact of nested FloatingWrapper wrongly positioned due to animation\n FlyoutMenuCircularDepInject={didAnimationEnd ? DSFlyoutMenu : NoComponentPlaceholder}\n />\n ))}\n </StyledMenu>\n </StyledWrapper>\n </StyledFloatingWrapper>\n );\n};\n\nDSFlyoutMenu.displayName = DSFlyoutMenuName;\nconst DSFlyoutMenuWithSchema = describe(DSFlyoutMenu);\nDSFlyoutMenuWithSchema.propTypes = DSFlyoutMenuPropTypesSchema;\n\nexport { DSFlyoutMenu, DSFlyoutMenuWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4FX;AA5FZ,iCAAgC;AAChC,qBAAqB;AACrB,8BAAyB;AACzB,uBAA2C;AAE3C,mBAAkB;AAClB,mCAA6D;AAC7D,+CAAsD;AACtD,uCAA0C;AAC1C,2BAA8B;AAC9B,uBAAoD;AACpD,IAAAA,gCAAgE;AAChE,uCAA2B;AAC3B,0CAA0C;AAC1C,MAAM,oBAAgB,yBAAO,qBAAM;AAAA,EACjC,MAAM;AAAA,EACN,MAAM,mCAAkB;AAC1B,CAAC;AAAA;AAAA;AAAA,aAGY,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM,IAAI;AAAA,IACxC,mCAAkB;AAAA;AAGtB,MAAM,4BAAwB,yBAAO,4CAAiB;AAAA,EACpD,MAAM;AAAA,EACN,MAAM,mCAAkB;AAC1B,CAAC;AAED,MAAM,iBAAa,yBAAO,OAAO,EAAE,MAAM,mCAAkB,MAAM,mCAAkB,aAAa,CAAC;AAAA,gBAGjF,CAAC,EAAE,WAAW,MAAO,OAAO,eAAe,WAAW,GAAG,UAAU,OAAO,UAAW;AAAA;AAAA;AAAA;AAAA;AAMrG,MAAM,yBAAyB,MAAM;AAErC,MAAM,eAAyD,CAAC,UAAU;AACxE,QAAM,EAAE,kBAAkB,aAAa,QAAI,oCAAc,KAAK;AAC9D,QAAM;AAAA,IACJ,YAAY,EAAE,eAAe,uBAAuB;AAAA,EACtD,IAAI,aAAAC,QAAM,WAAW,6DAAyB;AAC9C,QAAM;AAAA,IACJ;AAAA,IACA,qBAAqB,EAAE,aAAa,wBAAwB;AAAA,EAC9D,IAAI,aAAAA,QAAM,WAAW,8EAAqC;AAC1D,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,aAAAA,QAAM,SAAS,KAAK;AAElE,QAAM,EAAE,gBAAgB,gBAAgB,iBAAiB,cAAc,YAAY,SAAS,IAAI;AAChG,QAAM,kBAAkB,aAAAA,QAAM;AAAA,IAC5B,CAAC,SAAyB;AACxB,cAAI,6CAAW,QAAQ,GAAG;AACxB,oBAAY,UAAU;AACtB;AAAA,MACF;AACA,8BAAwB,MAAM,SAAS,IAAI;AAAA,IAC7C;AAAA,IACA,CAAC,yBAAyB,UAAU,WAAW;AAAA,EACjD;AAEA,QAAM,8BAA8B,aAAAA,QAAM,YAAY,MAAM;AAC1D,uBAAmB,KAAK;AAAA,EAC1B,GAAG,CAAC,CAAC;AACL,QAAM,qBAAqB,aAAAA,QAAM,YAAY,MAAM;AACjD,uBAAmB,IAAI;AAAA,EACzB,GAAG,CAAC,CAAC;AAEL,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV;AAAA,MACA,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,2BAA2B;AAAA,MAC3B,gBAAgB;AAAA,MAChB;AAAA,MACA;AAAA,MAEA,eAAY;AAAA,MAEZ,sDAAC,iBAAc,eAA8B,wBAAiD,GAAG,cAC/F;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAU;AAAA,UACV,YAAY,SAAS,UAAU,aAAa,sDAAyB;AAAA,UACrE;AAAA,UACA;AAAA,UAEC,mBAAS,SAAS,IAAI,CAAC,eACtB;AAAA,YAAC;AAAA;AAAA,cAGC,UAAU;AAAA,cACV;AAAA,cAIA,6BAA6B,kBAAkB,eAAe;AAAA;AAAA,YAPzD,oBAAoB,WAAW,IAAI,IAAI,WAAW;AAAA,UAQzD,CACD;AAAA;AAAA,MACH,GACF;AAAA;AAAA,EACF;AAEJ;AAEA,aAAa,cAAc;AAC3B,MAAM,6BAAyB,kCAAS,YAAY;AACpD,uBAAuB,YAAY;",
6
6
  "names": ["import_react_desc_prop_types", "React"]
7
7
  }
@@ -43,5 +43,8 @@ const FLYOUT_MENU_SLOTS = {
43
43
  ROOT: "root",
44
44
  LIST_WRAPPER: "list-wrapper"
45
45
  };
46
- const FLYOUT_MENU_DATA_TESTID = (0, import_ds_system.slotObjectToDataTestIds)(DSFlyoutMenuName, FLYOUT_MENU_SLOTS);
46
+ const FLYOUT_MENU_DATA_TESTID = {
47
+ ...(0, import_ds_system.slotObjectToDataTestIds)(DSFlyoutMenuName, FLYOUT_MENU_SLOTS),
48
+ FLOATING_WRAPPER: "ds-floating-wrapper-root"
49
+ };
47
50
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/parts/DSFlyoutMenu/constants/index.ts", "../../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\nexport const DSFlyoutMenuName = 'DSFlyoutmenu';\n\nexport const EXAMPLE_CONSTANTS = {} as const;\n\n// we are naming this with the ${component_name}_slots convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const FLYOUT_MENU_SLOTS = {\n FLOATING_WRAPPER: 'floating-wrapper',\n ROOT: 'root',\n LIST_WRAPPER: 'list-wrapper',\n} as const;\n\n// we are naming this with the ${component_name}_data_testid convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const FLYOUT_MENU_DATA_TESTID = slotObjectToDataTestIds(DSFlyoutMenuName, FLYOUT_MENU_SLOTS);\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;AAEjC,MAAM,mBAAmB;AAEzB,MAAM,oBAAoB,CAAC;AAG3B,MAAM,oBAAoB;AAAA,EAC/B,kBAAkB;AAAA,EAClB,MAAM;AAAA,EACN,cAAc;AAChB;AAGO,MAAM,8BAA0B,0CAAwB,kBAAkB,iBAAiB;",
4
+ "sourcesContent": ["import { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\nexport const DSFlyoutMenuName = 'DSFlyoutmenu';\n\nexport const EXAMPLE_CONSTANTS = {} as const;\n\n// we are naming this with the ${component_name}_slots convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const FLYOUT_MENU_SLOTS = {\n FLOATING_WRAPPER: 'floating-wrapper',\n ROOT: 'root',\n LIST_WRAPPER: 'list-wrapper',\n} as const;\n\n// we are naming this with the ${component_name}_data_testid convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const FLYOUT_MENU_DATA_TESTID = {\n ...slotObjectToDataTestIds(DSFlyoutMenuName, FLYOUT_MENU_SLOTS),\n FLOATING_WRAPPER: 'ds-floating-wrapper-root',\n} as const;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;AAEjC,MAAM,mBAAmB;AAEzB,MAAM,oBAAoB,CAAC;AAG3B,MAAM,oBAAoB;AAAA,EAC/B,kBAAkB;AAAA,EAClB,MAAM;AAAA,EACN,cAAc;AAChB;AAGO,MAAM,0BAA0B;AAAA,EACrC,OAAG,0CAAwB,kBAAkB,iBAAiB;AAAA,EAC9D,kBAAkB;AACpB;",
6
6
  "names": []
7
7
  }
package/dist/esm/index.js CHANGED
@@ -8,17 +8,29 @@ import {
8
8
  MENU_ITEMS_TYPES,
9
9
  MENU_BUTTON_WITH_PARTS_SLOTS
10
10
  } from "./constants/index.js";
11
+ import { DSOpinionatedButtonName, OPINIONATED_BUTTON_SLOTS } from "./parts/DSOpinionatedButton/constants/index.js";
12
+ import { DSFlyoutMenuName, FLYOUT_MENU_SLOTS } from "./parts/DSFlyoutMenu/constants/index.js";
13
+ import {
14
+ DSMenuItemRendererFactoryName,
15
+ MENU_ITEM_RENDERER_FACTORY_SLOTS
16
+ } from "./parts/DSMenuItemRendererFactory/constants/index.js";
11
17
  import { isFocusableNode } from "./utils/nodesTypeguardsAndGetters.js";
12
18
  import { useOptionsArrayToDsTree } from "./utils/useOptionsArrayToDsTree.js";
13
19
  export {
20
+ DSFlyoutMenuName,
14
21
  DSMenuButton,
15
22
  DSMenuButtonName,
16
23
  DSMenuButtonPropTypes,
17
24
  DSMenuButtonWithSchema,
25
+ DSMenuItemRendererFactoryName,
26
+ DSOpinionatedButtonName,
27
+ FLYOUT_MENU_SLOTS,
18
28
  MENU_BUTTON_DATA_TESTID,
19
29
  MENU_BUTTON_SLOTS,
20
30
  MENU_BUTTON_WITH_PARTS_SLOTS,
21
31
  MENU_ITEMS_TYPES,
32
+ MENU_ITEM_RENDERER_FACTORY_SLOTS,
33
+ OPINIONATED_BUTTON_SLOTS,
22
34
  isFocusableNode,
23
35
  useOptionsArrayToDsTree
24
36
  };
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/index.ts"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "// this is a workaround to typescript error TS2742\n// https://github.com/microsoft/TypeScript/issues/47663\nimport type {} from '@xstyled/system';\nexport { DSMenuButton, DSMenuButtonWithSchema } from './DSMenuButton.js';\nexport { type DSMenuButtonT, DSMenuButtonPropTypes } from './react-desc-prop-types.js';\nexport {\n MENU_BUTTON_SLOTS,\n DSMenuButtonName,\n MENU_BUTTON_DATA_TESTID,\n MENU_ITEMS_TYPES,\n MENU_BUTTON_WITH_PARTS_SLOTS,\n} from './constants/index.js';\nexport { isFocusableNode } from './utils/nodesTypeguardsAndGetters.js';\nexport { useOptionsArrayToDsTree } from './utils/useOptionsArrayToDsTree.js';\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACGvB,SAAS,cAAc,8BAA8B;AACrD,SAA6B,6BAA6B;AAC1D;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,uBAAuB;AAChC,SAAS,+BAA+B;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "// this is a workaround to typescript error TS2742\n// https://github.com/microsoft/TypeScript/issues/47663\nimport type {} from '@xstyled/system';\nexport { DSMenuButton, DSMenuButtonWithSchema } from './DSMenuButton.js';\nexport { type DSMenuButtonT, DSMenuButtonPropTypes } from './react-desc-prop-types.js';\nexport {\n MENU_BUTTON_SLOTS,\n DSMenuButtonName,\n MENU_BUTTON_DATA_TESTID,\n MENU_ITEMS_TYPES,\n MENU_BUTTON_WITH_PARTS_SLOTS,\n} from './constants/index.js';\n\nexport { DSOpinionatedButtonName, OPINIONATED_BUTTON_SLOTS } from './parts/DSOpinionatedButton/constants/index.js';\nexport { DSFlyoutMenuName, FLYOUT_MENU_SLOTS } from './parts/DSFlyoutMenu/constants/index.js';\nexport {\n DSMenuItemRendererFactoryName,\n MENU_ITEM_RENDERER_FACTORY_SLOTS,\n} from './parts/DSMenuItemRendererFactory/constants/index.js';\n\nexport { isFocusableNode } from './utils/nodesTypeguardsAndGetters.js';\nexport { useOptionsArrayToDsTree } from './utils/useOptionsArrayToDsTree.js';\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACGvB,SAAS,cAAc,8BAA8B;AACrD,SAA6B,6BAA6B;AAC1D;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,yBAAyB,gCAAgC;AAClE,SAAS,kBAAkB,yBAAyB;AACpD;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAEP,SAAS,uBAAuB;AAChC,SAAS,+BAA+B;",
6
6
  "names": []
7
7
  }
@@ -71,6 +71,7 @@ const DSFlyoutMenu = (props) => {
71
71
  onAnimationEnd: handleAnimationEnd,
72
72
  getOwnerProps,
73
73
  getOwnerPropsArguments,
74
+ "data-testid": "ds-floating-wrapper-root",
74
75
  children: /* @__PURE__ */ jsx(StyledWrapper, { getOwnerProps, getOwnerPropsArguments, ...xstyledProps, children: /* @__PURE__ */ jsx(
75
76
  StyledMenu,
76
77
  {
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/DSFlyoutMenu/DSFlyoutMenu.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { FloatingWrapper } from '@elliemae/ds-floating-context';\nimport { Grid } from '@elliemae/ds-grid';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { styled, xStyledCommonProps } from '@elliemae/ds-system';\n\nimport React from 'react';\nimport { type DSMenuButtonT, menuSpecificDefaultProps } from '../../react-desc-prop-types.js';\nimport { MenuBehaviouralContextProviderContext } from '../DSMenuBehaviouralContextProvider/MenuBehaviouralContextProviderCTX.js';\nimport { DSMenuItemRendererFactory } from '../DSMenuItemRendererFactory/index.js';\nimport { useFlyoutMenu } from './config/useFlyoutMenu.js';\nimport { DSFlyoutMenuName, FLYOUT_MENU_SLOTS } from './constants/index.js';\nimport { DSFlyoutMenuPropTypesSchema, type DSFlyoutMenuT } from './react-desc-prop-types.js';\nimport { isRootNode } from '../../utils/nodesTypeguardsAndGetters.js';\nimport { MenuButtonContextProvider } from '../../MenuButtonContextProviderCTX.js';\nconst StyledWrapper = styled(Grid, {\n name: DSFlyoutMenuName,\n slot: FLYOUT_MENU_SLOTS.ROOT,\n})`\n min-width: 1px;\n background-color: white;\n padding: ${({ theme }) => theme.space.xxxs} 0;\n ${xStyledCommonProps}\n`;\n\nconst StyledFloatingWrapper = styled(FloatingWrapper, {\n name: DSFlyoutMenuName,\n slot: FLYOUT_MENU_SLOTS.FLOATING_WRAPPER,\n})``;\n\nconst StyledMenu = styled('div', { name: DSFlyoutMenuName, slot: FLYOUT_MENU_SLOTS.LIST_WRAPPER })<{\n $maxHeight: string | number;\n}>`\n max-height: ${({ $maxHeight }) => (typeof $maxHeight === 'number' ? `${$maxHeight}px` : $maxHeight)};\n overflow-y: auto;\n padding: 0;\n margin: 0;\n`;\n\nconst NoComponentPlaceholder = () => null;\n\nconst DSFlyoutMenu: React.ComponentType<DSFlyoutMenuT.Props> = (props) => {\n const { propsWithDefault, xstyledProps } = useFlyoutMenu(props);\n const {\n ownerProps: { getOwnerProps, getOwnerPropsArguments },\n } = React.useContext(MenuButtonContextProvider);\n const {\n instanceUid,\n globalEventsHelpers: { mainMenuRef, handleSubmenusRefChange },\n } = React.useContext(MenuBehaviouralContextProviderContext);\n const [didAnimationEnd, setDidAnimationEnd] = React.useState(false);\n\n const { setFloatingRef, floatingStyles, floatingContext, ItemRenderer, isMenuOpen, itemNode } = propsWithDefault;\n const handleRefChange = React.useCallback(\n (node: HTMLDivElement) => {\n if (isRootNode(itemNode)) {\n mainMenuRef.current = node;\n return;\n }\n handleSubmenusRefChange(node, itemNode.dsId);\n },\n [handleSubmenusRefChange, itemNode, mainMenuRef],\n );\n\n const handleAnimationStartTrigger = React.useCallback(() => {\n setDidAnimationEnd(false);\n }, []);\n const handleAnimationEnd = React.useCallback(() => {\n setDidAnimationEnd(true);\n }, []);\n\n return (\n <StyledFloatingWrapper\n innerRef={setFloatingRef}\n floatingStyles={floatingStyles}\n isOpen={isMenuOpen}\n context={floatingContext}\n onAnimationStartTriggered={handleAnimationStartTrigger}\n onAnimationEnd={handleAnimationEnd}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <StyledWrapper getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments} {...xstyledProps}>\n <StyledMenu\n role=\"menu\"\n innerRef={handleRefChange}\n $maxHeight={itemNode.plainItem.maxHeight ?? menuSpecificDefaultProps.maxHeight}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {itemNode.children.map((optionNode) => (\n <DSMenuItemRendererFactory\n key={`flyout-menu-item-${optionNode.dsId}-${instanceUid}`}\n // DSTree doesn't support children having a polymorphic type, so we need to cast it manually\n itemNode={optionNode as DSMenuButtonT.MenuNode}\n ItemRenderer={ItemRenderer}\n // we are passing the DSFlyoutMenu component as a prop to the DSMenuItemRendererFactory\n // this solves the circular-ish dependency\n // the conditional `didAnimationEnd` solves the visual artefact of nested FloatingWrapper wrongly positioned due to animation\n FlyoutMenuCircularDepInject={didAnimationEnd ? DSFlyoutMenu : NoComponentPlaceholder}\n />\n ))}\n </StyledMenu>\n </StyledWrapper>\n </StyledFloatingWrapper>\n );\n};\n\nDSFlyoutMenu.displayName = DSFlyoutMenuName;\nconst DSFlyoutMenuWithSchema = describe(DSFlyoutMenu);\nDSFlyoutMenuWithSchema.propTypes = DSFlyoutMenuPropTypesSchema;\n\nexport { DSFlyoutMenu, DSFlyoutMenuWithSchema };\n"],
5
- "mappings": "AAAA,YAAY,WAAW;AC0FX;AA1FZ,SAAS,uBAAuB;AAChC,SAAS,YAAY;AACrB,SAAS,gBAAgB;AACzB,SAAS,QAAQ,0BAA0B;AAE3C,OAAOA,YAAW;AAClB,SAA6B,gCAAgC;AAC7D,SAAS,6CAA6C;AACtD,SAAS,iCAAiC;AAC1C,SAAS,qBAAqB;AAC9B,SAAS,kBAAkB,yBAAyB;AACpD,SAAS,mCAAuD;AAChE,SAAS,kBAAkB;AAC3B,SAAS,iCAAiC;AAC1C,MAAM,gBAAgB,OAAO,MAAM;AAAA,EACjC,MAAM;AAAA,EACN,MAAM,kBAAkB;AAC1B,CAAC;AAAA;AAAA;AAAA,aAGY,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM,IAAI;AAAA,IACxC,kBAAkB;AAAA;AAGtB,MAAM,wBAAwB,OAAO,iBAAiB;AAAA,EACpD,MAAM;AAAA,EACN,MAAM,kBAAkB;AAC1B,CAAC;AAED,MAAM,aAAa,OAAO,OAAO,EAAE,MAAM,kBAAkB,MAAM,kBAAkB,aAAa,CAAC;AAAA,gBAGjF,CAAC,EAAE,WAAW,MAAO,OAAO,eAAe,WAAW,GAAG,UAAU,OAAO,UAAW;AAAA;AAAA;AAAA;AAAA;AAMrG,MAAM,yBAAyB,MAAM;AAErC,MAAM,eAAyD,CAAC,UAAU;AACxE,QAAM,EAAE,kBAAkB,aAAa,IAAI,cAAc,KAAK;AAC9D,QAAM;AAAA,IACJ,YAAY,EAAE,eAAe,uBAAuB;AAAA,EACtD,IAAIA,OAAM,WAAW,yBAAyB;AAC9C,QAAM;AAAA,IACJ;AAAA,IACA,qBAAqB,EAAE,aAAa,wBAAwB;AAAA,EAC9D,IAAIA,OAAM,WAAW,qCAAqC;AAC1D,QAAM,CAAC,iBAAiB,kBAAkB,IAAIA,OAAM,SAAS,KAAK;AAElE,QAAM,EAAE,gBAAgB,gBAAgB,iBAAiB,cAAc,YAAY,SAAS,IAAI;AAChG,QAAM,kBAAkBA,OAAM;AAAA,IAC5B,CAAC,SAAyB;AACxB,UAAI,WAAW,QAAQ,GAAG;AACxB,oBAAY,UAAU;AACtB;AAAA,MACF;AACA,8BAAwB,MAAM,SAAS,IAAI;AAAA,IAC7C;AAAA,IACA,CAAC,yBAAyB,UAAU,WAAW;AAAA,EACjD;AAEA,QAAM,8BAA8BA,OAAM,YAAY,MAAM;AAC1D,uBAAmB,KAAK;AAAA,EAC1B,GAAG,CAAC,CAAC;AACL,QAAM,qBAAqBA,OAAM,YAAY,MAAM;AACjD,uBAAmB,IAAI;AAAA,EACzB,GAAG,CAAC,CAAC;AAEL,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV;AAAA,MACA,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,2BAA2B;AAAA,MAC3B,gBAAgB;AAAA,MAChB;AAAA,MACA;AAAA,MAEA,8BAAC,iBAAc,eAA8B,wBAAiD,GAAG,cAC/F;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAU;AAAA,UACV,YAAY,SAAS,UAAU,aAAa,yBAAyB;AAAA,UACrE;AAAA,UACA;AAAA,UAEC,mBAAS,SAAS,IAAI,CAAC,eACtB;AAAA,YAAC;AAAA;AAAA,cAGC,UAAU;AAAA,cACV;AAAA,cAIA,6BAA6B,kBAAkB,eAAe;AAAA;AAAA,YAPzD,oBAAoB,WAAW,IAAI,IAAI,WAAW;AAAA,UAQzD,CACD;AAAA;AAAA,MACH,GACF;AAAA;AAAA,EACF;AAEJ;AAEA,aAAa,cAAc;AAC3B,MAAM,yBAAyB,SAAS,YAAY;AACpD,uBAAuB,YAAY;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { FloatingWrapper } from '@elliemae/ds-floating-context';\nimport { Grid } from '@elliemae/ds-grid';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { styled, xStyledCommonProps } from '@elliemae/ds-system';\n\nimport React from 'react';\nimport { type DSMenuButtonT, menuSpecificDefaultProps } from '../../react-desc-prop-types.js';\nimport { MenuBehaviouralContextProviderContext } from '../DSMenuBehaviouralContextProvider/MenuBehaviouralContextProviderCTX.js';\nimport { DSMenuItemRendererFactory } from '../DSMenuItemRendererFactory/index.js';\nimport { useFlyoutMenu } from './config/useFlyoutMenu.js';\nimport { DSFlyoutMenuName, FLYOUT_MENU_SLOTS } from './constants/index.js';\nimport { DSFlyoutMenuPropTypesSchema, type DSFlyoutMenuT } from './react-desc-prop-types.js';\nimport { isRootNode } from '../../utils/nodesTypeguardsAndGetters.js';\nimport { MenuButtonContextProvider } from '../../MenuButtonContextProviderCTX.js';\nconst StyledWrapper = styled(Grid, {\n name: DSFlyoutMenuName,\n slot: FLYOUT_MENU_SLOTS.ROOT,\n})`\n min-width: 1px;\n background-color: white;\n padding: ${({ theme }) => theme.space.xxxs} 0;\n ${xStyledCommonProps}\n`;\n\nconst StyledFloatingWrapper = styled(FloatingWrapper, {\n name: DSFlyoutMenuName,\n slot: FLYOUT_MENU_SLOTS.FLOATING_WRAPPER,\n})``;\n\nconst StyledMenu = styled('div', { name: DSFlyoutMenuName, slot: FLYOUT_MENU_SLOTS.LIST_WRAPPER })<{\n $maxHeight: string | number;\n}>`\n max-height: ${({ $maxHeight }) => (typeof $maxHeight === 'number' ? `${$maxHeight}px` : $maxHeight)};\n overflow-y: auto;\n padding: 0;\n margin: 0;\n`;\n\nconst NoComponentPlaceholder = () => null;\n\nconst DSFlyoutMenu: React.ComponentType<DSFlyoutMenuT.Props> = (props) => {\n const { propsWithDefault, xstyledProps } = useFlyoutMenu(props);\n const {\n ownerProps: { getOwnerProps, getOwnerPropsArguments },\n } = React.useContext(MenuButtonContextProvider);\n const {\n instanceUid,\n globalEventsHelpers: { mainMenuRef, handleSubmenusRefChange },\n } = React.useContext(MenuBehaviouralContextProviderContext);\n const [didAnimationEnd, setDidAnimationEnd] = React.useState(false);\n\n const { setFloatingRef, floatingStyles, floatingContext, ItemRenderer, isMenuOpen, itemNode } = propsWithDefault;\n const handleRefChange = React.useCallback(\n (node: HTMLDivElement) => {\n if (isRootNode(itemNode)) {\n mainMenuRef.current = node;\n return;\n }\n handleSubmenusRefChange(node, itemNode.dsId);\n },\n [handleSubmenusRefChange, itemNode, mainMenuRef],\n );\n\n const handleAnimationStartTrigger = React.useCallback(() => {\n setDidAnimationEnd(false);\n }, []);\n const handleAnimationEnd = React.useCallback(() => {\n setDidAnimationEnd(true);\n }, []);\n\n return (\n <StyledFloatingWrapper\n innerRef={setFloatingRef}\n floatingStyles={floatingStyles}\n isOpen={isMenuOpen}\n context={floatingContext}\n onAnimationStartTriggered={handleAnimationStartTrigger}\n onAnimationEnd={handleAnimationEnd}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n // Adding a data-testid for legacy e2e tests\n data-testid=\"ds-floating-wrapper-root\"\n >\n <StyledWrapper getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments} {...xstyledProps}>\n <StyledMenu\n role=\"menu\"\n innerRef={handleRefChange}\n $maxHeight={itemNode.plainItem.maxHeight ?? menuSpecificDefaultProps.maxHeight}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {itemNode.children.map((optionNode) => (\n <DSMenuItemRendererFactory\n key={`flyout-menu-item-${optionNode.dsId}-${instanceUid}`}\n // DSTree doesn't support children having a polymorphic type, so we need to cast it manually\n itemNode={optionNode as DSMenuButtonT.MenuNode}\n ItemRenderer={ItemRenderer}\n // we are passing the DSFlyoutMenu component as a prop to the DSMenuItemRendererFactory\n // this solves the circular-ish dependency\n // the conditional `didAnimationEnd` solves the visual artefact of nested FloatingWrapper wrongly positioned due to animation\n FlyoutMenuCircularDepInject={didAnimationEnd ? DSFlyoutMenu : NoComponentPlaceholder}\n />\n ))}\n </StyledMenu>\n </StyledWrapper>\n </StyledFloatingWrapper>\n );\n};\n\nDSFlyoutMenu.displayName = DSFlyoutMenuName;\nconst DSFlyoutMenuWithSchema = describe(DSFlyoutMenu);\nDSFlyoutMenuWithSchema.propTypes = DSFlyoutMenuPropTypesSchema;\n\nexport { DSFlyoutMenu, DSFlyoutMenuWithSchema };\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;AC4FX;AA5FZ,SAAS,uBAAuB;AAChC,SAAS,YAAY;AACrB,SAAS,gBAAgB;AACzB,SAAS,QAAQ,0BAA0B;AAE3C,OAAOA,YAAW;AAClB,SAA6B,gCAAgC;AAC7D,SAAS,6CAA6C;AACtD,SAAS,iCAAiC;AAC1C,SAAS,qBAAqB;AAC9B,SAAS,kBAAkB,yBAAyB;AACpD,SAAS,mCAAuD;AAChE,SAAS,kBAAkB;AAC3B,SAAS,iCAAiC;AAC1C,MAAM,gBAAgB,OAAO,MAAM;AAAA,EACjC,MAAM;AAAA,EACN,MAAM,kBAAkB;AAC1B,CAAC;AAAA;AAAA;AAAA,aAGY,CAAC,EAAE,MAAM,MAAM,MAAM,MAAM,IAAI;AAAA,IACxC,kBAAkB;AAAA;AAGtB,MAAM,wBAAwB,OAAO,iBAAiB;AAAA,EACpD,MAAM;AAAA,EACN,MAAM,kBAAkB;AAC1B,CAAC;AAED,MAAM,aAAa,OAAO,OAAO,EAAE,MAAM,kBAAkB,MAAM,kBAAkB,aAAa,CAAC;AAAA,gBAGjF,CAAC,EAAE,WAAW,MAAO,OAAO,eAAe,WAAW,GAAG,UAAU,OAAO,UAAW;AAAA;AAAA;AAAA;AAAA;AAMrG,MAAM,yBAAyB,MAAM;AAErC,MAAM,eAAyD,CAAC,UAAU;AACxE,QAAM,EAAE,kBAAkB,aAAa,IAAI,cAAc,KAAK;AAC9D,QAAM;AAAA,IACJ,YAAY,EAAE,eAAe,uBAAuB;AAAA,EACtD,IAAIA,OAAM,WAAW,yBAAyB;AAC9C,QAAM;AAAA,IACJ;AAAA,IACA,qBAAqB,EAAE,aAAa,wBAAwB;AAAA,EAC9D,IAAIA,OAAM,WAAW,qCAAqC;AAC1D,QAAM,CAAC,iBAAiB,kBAAkB,IAAIA,OAAM,SAAS,KAAK;AAElE,QAAM,EAAE,gBAAgB,gBAAgB,iBAAiB,cAAc,YAAY,SAAS,IAAI;AAChG,QAAM,kBAAkBA,OAAM;AAAA,IAC5B,CAAC,SAAyB;AACxB,UAAI,WAAW,QAAQ,GAAG;AACxB,oBAAY,UAAU;AACtB;AAAA,MACF;AACA,8BAAwB,MAAM,SAAS,IAAI;AAAA,IAC7C;AAAA,IACA,CAAC,yBAAyB,UAAU,WAAW;AAAA,EACjD;AAEA,QAAM,8BAA8BA,OAAM,YAAY,MAAM;AAC1D,uBAAmB,KAAK;AAAA,EAC1B,GAAG,CAAC,CAAC;AACL,QAAM,qBAAqBA,OAAM,YAAY,MAAM;AACjD,uBAAmB,IAAI;AAAA,EACzB,GAAG,CAAC,CAAC;AAEL,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV;AAAA,MACA,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,2BAA2B;AAAA,MAC3B,gBAAgB;AAAA,MAChB;AAAA,MACA;AAAA,MAEA,eAAY;AAAA,MAEZ,8BAAC,iBAAc,eAA8B,wBAAiD,GAAG,cAC/F;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAU;AAAA,UACV,YAAY,SAAS,UAAU,aAAa,yBAAyB;AAAA,UACrE;AAAA,UACA;AAAA,UAEC,mBAAS,SAAS,IAAI,CAAC,eACtB;AAAA,YAAC;AAAA;AAAA,cAGC,UAAU;AAAA,cACV;AAAA,cAIA,6BAA6B,kBAAkB,eAAe;AAAA;AAAA,YAPzD,oBAAoB,WAAW,IAAI,IAAI,WAAW;AAAA,UAQzD,CACD;AAAA;AAAA,MACH,GACF;AAAA;AAAA,EACF;AAEJ;AAEA,aAAa,cAAc;AAC3B,MAAM,yBAAyB,SAAS,YAAY;AACpD,uBAAuB,YAAY;",
6
6
  "names": ["React"]
7
7
  }
@@ -7,7 +7,10 @@ const FLYOUT_MENU_SLOTS = {
7
7
  ROOT: "root",
8
8
  LIST_WRAPPER: "list-wrapper"
9
9
  };
10
- const FLYOUT_MENU_DATA_TESTID = slotObjectToDataTestIds(DSFlyoutMenuName, FLYOUT_MENU_SLOTS);
10
+ const FLYOUT_MENU_DATA_TESTID = {
11
+ ...slotObjectToDataTestIds(DSFlyoutMenuName, FLYOUT_MENU_SLOTS),
12
+ FLOATING_WRAPPER: "ds-floating-wrapper-root"
13
+ };
11
14
  export {
12
15
  DSFlyoutMenuName,
13
16
  EXAMPLE_CONSTANTS,
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/DSFlyoutMenu/constants/index.ts"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\nexport const DSFlyoutMenuName = 'DSFlyoutmenu';\n\nexport const EXAMPLE_CONSTANTS = {} as const;\n\n// we are naming this with the ${component_name}_slots convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const FLYOUT_MENU_SLOTS = {\n FLOATING_WRAPPER: 'floating-wrapper',\n ROOT: 'root',\n LIST_WRAPPER: 'list-wrapper',\n} as const;\n\n// we are naming this with the ${component_name}_data_testid convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const FLYOUT_MENU_DATA_TESTID = slotObjectToDataTestIds(DSFlyoutMenuName, FLYOUT_MENU_SLOTS);\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,+BAA+B;AAEjC,MAAM,mBAAmB;AAEzB,MAAM,oBAAoB,CAAC;AAG3B,MAAM,oBAAoB;AAAA,EAC/B,kBAAkB;AAAA,EAClB,MAAM;AAAA,EACN,cAAc;AAChB;AAGO,MAAM,0BAA0B,wBAAwB,kBAAkB,iBAAiB;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\nexport const DSFlyoutMenuName = 'DSFlyoutmenu';\n\nexport const EXAMPLE_CONSTANTS = {} as const;\n\n// we are naming this with the ${component_name}_slots convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const FLYOUT_MENU_SLOTS = {\n FLOATING_WRAPPER: 'floating-wrapper',\n ROOT: 'root',\n LIST_WRAPPER: 'list-wrapper',\n} as const;\n\n// we are naming this with the ${component_name}_data_testid convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const FLYOUT_MENU_DATA_TESTID = {\n ...slotObjectToDataTestIds(DSFlyoutMenuName, FLYOUT_MENU_SLOTS),\n FLOATING_WRAPPER: 'ds-floating-wrapper-root',\n} as const;\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,+BAA+B;AAEjC,MAAM,mBAAmB;AAEzB,MAAM,oBAAoB,CAAC;AAG3B,MAAM,oBAAoB;AAAA,EAC/B,kBAAkB;AAAA,EAClB,MAAM;AAAA,EACN,cAAc;AAChB;AAGO,MAAM,0BAA0B;AAAA,EACrC,GAAG,wBAAwB,kBAAkB,iBAAiB;AAAA,EAC9D,kBAAkB;AACpB;",
6
6
  "names": []
7
7
  }
@@ -38,6 +38,7 @@ export declare const useSplitInherithedProps: ({ propsWithDefault, focusableNode
38
38
  isSkeleton: boolean;
39
39
  ItemRenderer: DSMenuButtonT.ItemRendererT | undefined;
40
40
  };
41
+ list?: string | undefined | undefined;
41
42
  type?: import("@elliemae/ds-button-v2").DSButtonT.HTMLButtonTypeProp | undefined;
42
43
  label?: string | undefined | undefined;
43
44
  minWidth?: import("@xstyled/system").SystemProp<string | number | true | symbol | {} | (string & {}), import("@xstyled/system").Theme> | undefined;
@@ -52,7 +53,6 @@ export declare const useSplitInherithedProps: ({ propsWithDefault, focusableNode
52
53
  applyAriaDisabled?: boolean | undefined;
53
54
  dsButtonRoot?: object | import("@elliemae/ds-typescript-helpers").TypescriptHelpersT.GenericFunc<unknown, object> | undefined;
54
55
  form?: string | undefined | undefined;
55
- list?: string | undefined | undefined;
56
56
  "aria-activedescendant"?: string | undefined | undefined;
57
57
  "aria-atomic"?: (boolean | "true" | "false") | undefined;
58
58
  "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
@@ -407,30 +407,30 @@ export declare const useSplitInherithedProps: ({ propsWithDefault, focusableNode
407
407
  width?: number | string | undefined | undefined;
408
408
  wmode?: string | undefined | undefined;
409
409
  wrap?: string | undefined | undefined;
410
- margin?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
411
- m?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
412
- marginTop?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
413
- mt?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
414
- marginRight?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
415
- mr?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
416
- marginBottom?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
417
- mb?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
418
- marginLeft?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
419
- ml?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
420
- mx?: (import("@xstyled/system").SystemProp<import("@xstyled/system").Space<import("@xstyled/system").Theme>, import("@xstyled/system").Theme> & (string | number | {} | import("@xstyled/system").ThemeProp<import("@xstyled/system").Space<import("@xstyled/system").Theme>, import("@xstyled/system").Theme>)) | undefined;
421
- my?: (import("@xstyled/system").SystemProp<import("@xstyled/system").Space<import("@xstyled/system").Theme>, import("@xstyled/system").Theme> & (string | number | {} | import("@xstyled/system").ThemeProp<import("@xstyled/system").Space<import("@xstyled/system").Theme>, import("@xstyled/system").Theme>)) | undefined;
422
- padding?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
423
- p?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
424
- paddingTop?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
425
- pt?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
426
- paddingRight?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
427
- pr?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
428
- paddingBottom?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
429
- pb?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
430
- paddingLeft?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
431
- pl?: ((string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>) & (string | number | {} | (string & {}) | import("@xstyled/system").ThemeProp<string | number | {} | (string & {}), import("@xstyled/system").Theme>)) | undefined;
432
- px?: (import("@xstyled/system").SystemProp<import("@xstyled/system").Space<import("@xstyled/system").Theme>, import("@xstyled/system").Theme> & (string | number | {} | import("@xstyled/system").ThemeProp<import("@xstyled/system").Space<import("@xstyled/system").Theme>, import("@xstyled/system").Theme>)) | undefined;
433
- py?: (import("@xstyled/system").SystemProp<import("@xstyled/system").Space<import("@xstyled/system").Theme>, import("@xstyled/system").Theme> & (string | number | {} | import("@xstyled/system").ThemeProp<import("@xstyled/system").Space<import("@xstyled/system").Theme>, import("@xstyled/system").Theme>)) | undefined;
410
+ margin?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>)) | undefined;
411
+ m?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>)) | undefined;
412
+ marginTop?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>)) | undefined;
413
+ mt?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>)) | undefined;
414
+ marginRight?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>)) | undefined;
415
+ mr?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>)) | undefined;
416
+ marginBottom?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>)) | undefined;
417
+ mb?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>)) | undefined;
418
+ marginLeft?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>)) | undefined;
419
+ ml?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "auto", import("@xstyled/system").Theme>)) | undefined;
420
+ mx?: (import("@xstyled/system").SystemProp<string | {} | 0 | (string & {}) | (number & {}), import("@xstyled/system").Theme> & (string | {} | 0 | (string & {}) | (number & {}) | import("@xstyled/system").ThemeProp<string | {} | 0 | (string & {}) | (number & {}), import("@xstyled/system").Theme>)) | undefined;
421
+ my?: (import("@xstyled/system").SystemProp<string | {} | 0 | (string & {}) | (number & {}), import("@xstyled/system").Theme> & (string | {} | 0 | (string & {}) | (number & {}) | import("@xstyled/system").ThemeProp<string | {} | 0 | (string & {}) | (number & {}), import("@xstyled/system").Theme>)) | undefined;
422
+ padding?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>)) | undefined;
423
+ p?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>)) | undefined;
424
+ paddingTop?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>)) | undefined;
425
+ pt?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>)) | undefined;
426
+ paddingRight?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>)) | undefined;
427
+ pr?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>)) | undefined;
428
+ paddingBottom?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>)) | undefined;
429
+ pb?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>)) | undefined;
430
+ paddingLeft?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>)) | undefined;
431
+ pl?: (({} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>) & ({} | 0 | (string & {}) | "inherit" | "m" | "xxxs" | "xxs" | "xxs2" | "xs" | "s" | "l" | "xl" | "xxl" | `${number}%` | `${number}em` | `${number}px` | `${number}rem` | `${number}vh` | `${number}vw` | `${number}vmin` | `${number}vmax` | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | import("@xstyled/system").ThemeProp<{} | 0 | (string & {}) | "inherit" | keyof import("@elliemae/pui-theme/dist/types/lib/theme-type.js").Space | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset", import("@xstyled/system").Theme>)) | undefined;
432
+ px?: (import("@xstyled/system").SystemProp<string | {} | 0 | (string & {}) | (number & {}), import("@xstyled/system").Theme> & (string | {} | 0 | (string & {}) | (number & {}) | import("@xstyled/system").ThemeProp<string | {} | 0 | (string & {}) | (number & {}), import("@xstyled/system").Theme>)) | undefined;
433
+ py?: (import("@xstyled/system").SystemProp<string | {} | 0 | (string & {}) | (number & {}), import("@xstyled/system").Theme> & (string | {} | 0 | (string & {}) | (number & {}) | import("@xstyled/system").ThemeProp<string | {} | 0 | (string & {}) | (number & {}), import("@xstyled/system").Theme>)) | undefined;
434
434
  spaceX?: import("@xstyled/system").SystemProp<import("@xstyled/system").Space<import("@xstyled/system").Theme>, import("@xstyled/system").Theme> | undefined;
435
435
  spaceY?: import("@xstyled/system").SystemProp<import("@xstyled/system").Space<import("@xstyled/system").Theme>, import("@xstyled/system").Theme> | undefined;
436
436
  spaceXReverse?: import("@xstyled/system").SystemProp<true, import("@xstyled/system").Theme> | undefined;
@@ -452,10 +452,10 @@ export declare const useSplitInherithedProps: ({ propsWithDefault, focusableNode
452
452
  overflowY?: import("@xstyled/system").SystemProp<import("csstype").Property.OverflowY, import("@xstyled/system").Theme> | undefined;
453
453
  position?: import("@xstyled/system").SystemProp<import("csstype").Property.Position, import("@xstyled/system").Theme> | undefined;
454
454
  zIndex?: import("@xstyled/system").SystemProp<string | number | true | symbol | {} | (string & {}) | (number & {}), import("@xstyled/system").Theme> | undefined;
455
- top?: import("@xstyled/system").SystemProp<string | number | true | symbol | {} | (string & {}), import("@xstyled/system").Theme> | undefined;
456
- right?: import("@xstyled/system").SystemProp<string | number | true | symbol | {} | (string & {}), import("@xstyled/system").Theme> | undefined;
457
- bottom?: import("@xstyled/system").SystemProp<string | number | true | symbol | {} | (string & {}), import("@xstyled/system").Theme> | undefined;
458
- left?: import("@xstyled/system").SystemProp<string | number | true | symbol | {} | (string & {}), import("@xstyled/system").Theme> | undefined;
455
+ top?: import("@xstyled/system").SystemProp<string | number | true | symbol | {} | (string & {}) | (number & {}), import("@xstyled/system").Theme> | undefined;
456
+ right?: import("@xstyled/system").SystemProp<string | number | true | symbol | {} | (string & {}) | (number & {}), import("@xstyled/system").Theme> | undefined;
457
+ bottom?: import("@xstyled/system").SystemProp<string | number | true | symbol | {} | (string & {}) | (number & {}), import("@xstyled/system").Theme> | undefined;
458
+ left?: import("@xstyled/system").SystemProp<string | number | true | symbol | {} | (string & {}) | (number & {}), import("@xstyled/system").Theme> | undefined;
459
459
  visibility?: import("@xstyled/system").SystemProp<import("csstype").Property.Visibility, import("@xstyled/system").Theme> | undefined;
460
460
  overscrollBehavior?: import("@xstyled/system").SystemProp<import("csstype").Property.OverscrollBehavior, import("@xstyled/system").Theme> | undefined;
461
461
  objectFit?: import("@xstyled/system").SystemProp<import("csstype").Property.ObjectFit, import("@xstyled/system").Theme> | undefined;
@@ -483,7 +483,7 @@ export declare const useSplitInherithedProps: ({ propsWithDefault, focusableNode
483
483
  borderRadius?: string | undefined;
484
484
  backgroundColor?: (keyof import("@elliemae/ds-system").DummyColorTheme | `neutral-100-${string}` | `neutral-200-${string}` | `neutral-300-${string}` | `neutral-400-${string}` | `neutral-500-${string}` | `neutral-600-${string}` | `neutral-700-${string}` | `neutral-800-${string}` | `neutral-000-${string}` | `neutral-050-${string}` | `neutral-080-${string}` | `brand-100-${string}` | `brand-200-${string}` | `brand-300-${string}` | `brand-400-${string}` | `brand-500-${string}` | `brand-600-${string}` | `brand-700-${string}` | `brand-800-${string}` | `success-300-${string}` | `success-900-${string}` | `warning-400-${string}` | `warning-600-${string}` | `warning-900-${string}` | `danger-200-${string}` | `danger-900-${string}` | `#${string}` | `rgba(${string})` | `rgb(${string})`) | undefined;
485
485
  bg?: (keyof import("@elliemae/ds-system").DummyColorTheme | `neutral-100-${string}` | `neutral-200-${string}` | `neutral-300-${string}` | `neutral-400-${string}` | `neutral-500-${string}` | `neutral-600-${string}` | `neutral-700-${string}` | `neutral-800-${string}` | `neutral-000-${string}` | `neutral-050-${string}` | `neutral-080-${string}` | `brand-100-${string}` | `brand-200-${string}` | `brand-300-${string}` | `brand-400-${string}` | `brand-500-${string}` | `brand-600-${string}` | `brand-700-${string}` | `brand-800-${string}` | `success-300-${string}` | `success-900-${string}` | `warning-400-${string}` | `warning-600-${string}` | `warning-900-${string}` | `danger-200-${string}` | `danger-900-${string}` | `#${string}` | `rgba(${string})` | `rgb(${string})`) | undefined;
486
- fontWeight?: import("@xstyled/system").SystemProp<{} | (string & {}) | "inherit" | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | (number & {}) | "bold" | "normal" | "bolder" | "lighter" | "thin" | "light" | "regular" | "semibold", import("@xstyled/system").Theme> | undefined;
486
+ fontWeight?: import("@xstyled/system").SystemProp<{} | (string & {}) | "inherit" | (number & {}) | "-moz-initial" | "initial" | "revert" | "revert-layer" | "unset" | "bold" | "normal" | "bolder" | "lighter" | "thin" | "light" | "regular" | "semibold", import("@xstyled/system").Theme> | undefined;
487
487
  textAlign?: import("@xstyled/system").SystemProp<import("csstype").Property.TextAlign, import("@xstyled/system").Theme> | undefined;
488
488
  };
489
489
  };
@@ -1,5 +1,8 @@
1
1
  export { DSMenuButton, DSMenuButtonWithSchema } from './DSMenuButton.js';
2
2
  export { type DSMenuButtonT, DSMenuButtonPropTypes } from './react-desc-prop-types.js';
3
3
  export { MENU_BUTTON_SLOTS, DSMenuButtonName, MENU_BUTTON_DATA_TESTID, MENU_ITEMS_TYPES, MENU_BUTTON_WITH_PARTS_SLOTS, } from './constants/index.js';
4
+ export { DSOpinionatedButtonName, OPINIONATED_BUTTON_SLOTS } from './parts/DSOpinionatedButton/constants/index.js';
5
+ export { DSFlyoutMenuName, FLYOUT_MENU_SLOTS } from './parts/DSFlyoutMenu/constants/index.js';
6
+ export { DSMenuItemRendererFactoryName, MENU_ITEM_RENDERER_FACTORY_SLOTS, } from './parts/DSMenuItemRendererFactory/constants/index.js';
4
7
  export { isFocusableNode } from './utils/nodesTypeguardsAndGetters.js';
5
8
  export { useOptionsArrayToDsTree } from './utils/useOptionsArrayToDsTree.js';
@@ -6,7 +6,7 @@ export declare const FLYOUT_MENU_SLOTS: {
6
6
  readonly LIST_WRAPPER: "list-wrapper";
7
7
  };
8
8
  export declare const FLYOUT_MENU_DATA_TESTID: {
9
- readonly FLOATING_WRAPPER: "ds-flyoutmenu-floating-wrapper";
9
+ readonly FLOATING_WRAPPER: "ds-floating-wrapper-root";
10
10
  readonly ROOT: "ds-flyoutmenu-root";
11
11
  readonly LIST_WRAPPER: "ds-flyoutmenu-list-wrapper";
12
12
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-menu-button",
3
- "version": "3.60.0-next.14",
3
+ "version": "3.60.0-next.16",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Menu Button",
6
6
  "files": [
@@ -36,28 +36,27 @@
36
36
  "indent": 4
37
37
  },
38
38
  "dependencies": {
39
- "@elliemae/ds-button-v2": "3.60.0-next.14",
40
- "@elliemae/ds-floating-context": "3.60.0-next.14",
41
- "@elliemae/ds-grid": "3.60.0-next.14",
42
- "@elliemae/ds-hooks-on-blur-out": "3.60.0-next.14",
43
- "@elliemae/ds-props-helpers": "3.60.0-next.14",
44
- "@elliemae/ds-icons": "3.60.0-next.14",
45
- "@elliemae/ds-menu-items-commons": "3.60.0-next.14",
46
- "@elliemae/ds-system": "3.60.0-next.14",
47
- "@elliemae/ds-tree-model": "3.60.0-next.14"
39
+ "@elliemae/ds-button-v2": "3.60.0-next.16",
40
+ "@elliemae/ds-floating-context": "3.60.0-next.16",
41
+ "@elliemae/ds-hooks-on-blur-out": "3.60.0-next.16",
42
+ "@elliemae/ds-menu-items-commons": "3.60.0-next.16",
43
+ "@elliemae/ds-props-helpers": "3.60.0-next.16",
44
+ "@elliemae/ds-grid": "3.60.0-next.16",
45
+ "@elliemae/ds-system": "3.60.0-next.16",
46
+ "@elliemae/ds-tree-model": "3.60.0-next.16",
47
+ "@elliemae/ds-icons": "3.60.0-next.16"
48
48
  },
49
49
  "devDependencies": {
50
- "@elliemae/pui-cli": "9.0.0-next.65",
51
50
  "@elliemae/pui-theme": "~2.13.0",
52
- "jest": "~29.7.0",
51
+ "jest": "^30.0.0",
53
52
  "styled-components": "~5.3.9",
54
- "@elliemae/ds-monorepo-devops": "3.60.0-next.14",
55
- "@elliemae/ds-typescript-helpers": "3.60.0-next.14"
53
+ "@elliemae/ds-monorepo-devops": "3.60.0-next.16",
54
+ "@elliemae/ds-typescript-helpers": "3.60.0-next.16"
56
55
  },
57
56
  "peerDependencies": {
58
57
  "@testing-library/jest-dom": "^6.6.3",
59
58
  "@testing-library/react": "^16.0.1",
60
- "@testing-library/user-event": "~14.5.2",
59
+ "@testing-library/user-event": "~14.6.1",
61
60
  "react": "^18.3.1",
62
61
  "react-dom": "^18.3.1",
63
62
  "styled-components": "~5.3.9"
@@ -68,7 +67,7 @@
68
67
  },
69
68
  "scripts": {
70
69
  "dev": "cross-env NODE_ENV=development node ../../../scripts/build/build.mjs --watch",
71
- "test": "pui-cli test --passWithNoTests --coverage=\"false\"",
70
+ "test": "ds-monorepo-devops test --passWithNoTests --coverage=\"false\"",
72
71
  "lint": "node ../../../scripts/lint.mjs --fix",
73
72
  "lint:strict": "node ../../../scripts/lint-strict.mjs",
74
73
  "dts": "node ../../../scripts/dts.mjs",