@elliemae/ds-menu-items 3.20.0-next.5 → 3.20.0-next.7

package/dist/cjs/components/Separator/index.js

@@ -42,7 +42,7 @@ const Separator = (props) => {
   const propsWithDefault = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(props, import_react_desc_prop_types.defaultSeparatorProps);
   (0, import_ds_props_helpers.useValidateTypescriptPropTypes)(propsWithDefault, import_react_desc_prop_types.itemProps, `${import_exported_related.DSMenuItemName}Separator`);
   const { wrapperStyles, innerRef, render: Render } = propsWithDefault;
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledSeparatorWrapper, { style: wrapperStyles, ref: innerRef, role: "separator", children: Render ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Render, { ...props }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledSeparator, {}) });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledSeparatorWrapper, { style: wrapperStyles, ref: innerRef, role: "presentation", children: Render ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Render, { ...props }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledSeparator, { role: "presentation" }) });
 };
 Separator.propTypes = import_react_desc_prop_types.itemProps;
 Separator.displayName = `${import_exported_related.DSMenuItemName}Separator`;

package/dist/cjs/components/Separator/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/Separator/index.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport type { DSMenuItemT } from '../../react-desc-prop-types.js';\nimport { itemProps, defaultSeparatorProps } from '../../react-desc-prop-types.js';\nimport { StyledSeparatorWrapper, StyledSeparator } from '../styled.js';\nimport { DSMenuItemName } from '../../exported-related/index.js';\n\nconst Separator: React.ComponentType<DSMenuItemT.SeparatorProps> = (props) => {\n  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultSeparatorProps);\n\n  useValidateTypescriptPropTypes(propsWithDefault, itemProps, `${DSMenuItemName}Separator`);\n  const { wrapperStyles, innerRef, render: Render } = propsWithDefault;\n  return (\n    <StyledSeparatorWrapper style={wrapperStyles} ref={innerRef} role=\"separator\">\n      {Render ? <Render {...props} /> : <StyledSeparator />}\n    </StyledSeparatorWrapper>\n  );\n};\n\nSeparator.propTypes = itemProps;\nSeparator.displayName = `${DSMenuItemName}Separator`;\nconst SeparatorWithSchema = describe(Separator);\nSeparatorWithSchema.propTypes = itemProps;\n\nexport { Separator, SeparatorWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADcP;AAbhB,8BAAuF;AAEvF,mCAAiD;AACjD,oBAAwD;AACxD,8BAA+B;AAE/B,MAAM,YAA6D,CAAC,UAAU;AAC5E,QAAM,uBAAmB,sDAA6B,OAAO,kDAAqB;AAElF,8DAA+B,kBAAkB,wCAAW,GAAG,iDAAyB;AACxF,QAAM,EAAE,eAAe,UAAU,QAAQ,OAAO,IAAI;AACpD,SACE,4CAAC,wCAAuB,OAAO,eAAe,KAAK,UAAU,MAAK,aAC/D,mBAAS,4CAAC,UAAQ,GAAG,OAAO,IAAK,4CAAC,iCAAgB,GACrD;AAEJ;AAEA,UAAU,YAAY;AACtB,UAAU,cAAc,GAAG;AAC3B,MAAM,0BAAsB,kCAAS,SAAS;AAC9C,oBAAoB,YAAY;",
+  "sourcesContent": ["import React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport type { DSMenuItemT } from '../../react-desc-prop-types.js';\nimport { itemProps, defaultSeparatorProps } from '../../react-desc-prop-types.js';\nimport { StyledSeparatorWrapper, StyledSeparator } from '../styled.js';\nimport { DSMenuItemName } from '../../exported-related/index.js';\n\nconst Separator: React.ComponentType<DSMenuItemT.SeparatorProps> = (props) => {\n  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultSeparatorProps);\n\n  useValidateTypescriptPropTypes(propsWithDefault, itemProps, `${DSMenuItemName}Separator`);\n  const { wrapperStyles, innerRef, render: Render } = propsWithDefault;\n  return (\n    <StyledSeparatorWrapper style={wrapperStyles} ref={innerRef} role=\"presentation\">\n      {Render ? <Render {...props} /> : <StyledSeparator role=\"presentation\" />}\n    </StyledSeparatorWrapper>\n  );\n};\n\nSeparator.propTypes = itemProps;\nSeparator.displayName = `${DSMenuItemName}Separator`;\nconst SeparatorWithSchema = describe(Separator);\nSeparatorWithSchema.propTypes = itemProps;\n\nexport { Separator, SeparatorWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADcP;AAbhB,8BAAuF;AAEvF,mCAAiD;AACjD,oBAAwD;AACxD,8BAA+B;AAE/B,MAAM,YAA6D,CAAC,UAAU;AAC5E,QAAM,uBAAmB,sDAA6B,OAAO,kDAAqB;AAElF,8DAA+B,kBAAkB,wCAAW,GAAG,iDAAyB;AACxF,QAAM,EAAE,eAAe,UAAU,QAAQ,OAAO,IAAI;AACpD,SACE,4CAAC,wCAAuB,OAAO,eAAe,KAAK,UAAU,MAAK,gBAC/D,mBAAS,4CAAC,UAAQ,GAAG,OAAO,IAAK,4CAAC,iCAAgB,MAAK,gBAAe,GACzE;AAEJ;AAEA,UAAU,YAAY;AACtB,UAAU,cAAc,GAAG;AAC3B,MAAM,0BAAsB,kCAAS,SAAS;AAC9C,oBAAoB,YAAY;",
   "names": []
 }

package/dist/cjs/components/SubmenuItem/getChevronHandlers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/SubmenuItem/getChevronHandlers.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import type { DSMenuItemT } from '../../react-desc-prop-types.js';\n\n// what we are trying to do:\n//   onMouseEnter -> open submenu\n//   onMouseLeave -> close submenu\n//   onEllipsisClick -> we should not even invoke this handler, as the \"ellipsis\" should not even exist?\n\n// what are the \"challenges\" of the task:\n//  - the submenu close has an animation and we ideally want to be sure state changes after the animation is done\n//      (we do it via an hardcoded 300ms delay, this is know to cause issues in some cases)\n//  - \"what is open and what is closed\" state lives under ds-dropdownmenu,\n//      we manipulate it via \"onSubmenuOpen\" and \"onSubmenuClose\" callbacks\n//  - we have created the API in such a way that we implement a \"bridge\" and \"inversion of control\" pattern\n//      this requires extra care when handling the logic and designing the solution\n\n// important and relevant info:\n//  when this comment has been written,\n//    onSubmenuOpen coming from SingleWithSubmenuProps is forcing only one submenu to be open at a time internally\n//      the logic for this is implemented in ds-dropdownmenu,\n//         we had a bug in which we were invoking a stale callback,\n//            we monkeypatching it by ensuring the callback never changes\n//            in the future we should create code with \"hydraters\" to avoid this as per shuttle-v2\n\nexport const getChevronHandlers = ({\n  isSubmenuOpened,\n  onMouseEnter,\n  onSubmenuOpen,\n  onSubmenuClose,\n  onMouseLeave,\n}: Required<DSMenuItemT.SingleWithSubmenuProps>) => {\n  const timeoutRef: { current: NodeJS.Timeout | null } = { current: null };\n\n  const onMouseEnterHandler = (e: React.MouseEvent) => {\n    if (timeoutRef.current !== null) clearTimeout(timeoutRef.current);\n    else if (!isSubmenuOpened) onSubmenuOpen?.(e);\n    timeoutRef.current = null;\n    onMouseEnter?.(e);\n  };\n\n  const onMouseLeaveHandler = (e: React.MouseEvent) => {\n    if (timeoutRef.current === null) {\n      timeoutRef.current = setTimeout(() => {\n        timeoutRef.current = null;\n        onSubmenuClose?.(e);\n      }, 300);\n    }\n    onMouseLeave?.(e);\n  };\n  const onEllipsisClick = () => {\n    throw new Error('Invoking onEllipsisClick from chevron handlers... this should never happen');\n  };\n\n  return { onMouseEnterHandler, onMouseLeaveHandler, onEllipsisClick };\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuBhB,MAAM,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAoD;AAClD,QAAM,aAAiD,EAAE,SAAS,KAAK;AAEvE,QAAM,sBAAsB,CAAC,MAAwB;AACnD,QAAI,WAAW,YAAY;AAAM,mBAAa,WAAW,OAAO;AAAA,aACvD,CAAC;AAAiB,sBAAgB,CAAC;AAC5C,eAAW,UAAU;AACrB,mBAAe,CAAC;AAAA,EAClB;AAEA,QAAM,sBAAsB,CAAC,MAAwB;AACnD,QAAI,WAAW,YAAY,MAAM;AAC/B,iBAAW,UAAU,WAAW,MAAM;AACpC,mBAAW,UAAU;AACrB,yBAAiB,CAAC;AAAA,MACpB,GAAG,GAAG;AAAA,IACR;AACA,mBAAe,CAAC;AAAA,EAClB;AACA,QAAM,kBAAkB,MAAM;AAC5B,UAAM,IAAI,MAAM,4EAA4E;AAAA,EAC9F;AAEA,SAAO,EAAE,qBAAqB,qBAAqB,gBAAgB;AACrE;",
+  "sourcesContent": ["import type { DSMenuItemT } from '../../react-desc-prop-types.js';\n\n// what we are trying to do:\n//   onMouseEnter -> open submenu\n//   onMouseLeave -> close submenu\n//   onEllipsisClick -> we should not even invoke this handler, as the \"ellipsis\" should not even exist?\n\n// what are the \"challenges\" of the task:\n//  - the submenu close has an animation and we ideally want to be sure state changes after the animation is done\n//      (we do it via an hardcoded 300ms delay, this is know to cause issues in some cases)\n//  - \"what is open and what is closed\" state lives under ds-dropdownmenu,\n//      we manipulate it via \"onSubmenuOpen\" and \"onSubmenuClose\" callbacks\n//  - we have created the API in such a way that we implement a \"bridge\" and \"inversion of control\" pattern\n//      this requires extra care when handling the logic and designing the solution\n\n// important and relevant info:\n//  when this comment has been written,\n//    onSubmenuOpen coming from SingleWithSubmenuProps is forcing only one submenu to be open at a time internally\n//      the logic for this is implemented in ds-dropdownmenu,\n//         we had a bug in which we were invoking a stale callback,\n//            we monkeypatching it by ensuring the callback never changes\n//            in the future we should create code with \"hydraters\" to avoid this as per shuttle-v2\n\nexport const getChevronHandlers = ({\n  isSubmenuOpened,\n  onMouseEnter,\n  onSubmenuOpen,\n  onSubmenuClose,\n  onMouseLeave,\n}: Required<DSMenuItemT.SubmenuProps>) => {\n  const timeoutRef: { current: NodeJS.Timeout | null } = { current: null };\n\n  const onMouseEnterHandler = (e: React.MouseEvent) => {\n    if (timeoutRef.current !== null) clearTimeout(timeoutRef.current);\n    else if (!isSubmenuOpened) onSubmenuOpen?.(e);\n    timeoutRef.current = null;\n    onMouseEnter?.(e);\n  };\n\n  const onMouseLeaveHandler = (e: React.MouseEvent) => {\n    if (timeoutRef.current === null) {\n      timeoutRef.current = setTimeout(() => {\n        timeoutRef.current = null;\n        onSubmenuClose?.(e);\n      }, 300);\n    }\n    onMouseLeave?.(e);\n  };\n  const onEllipsisClick = () => {\n    throw new Error('Invoking onEllipsisClick from chevron handlers... this should never happen');\n  };\n\n  return { onMouseEnterHandler, onMouseLeaveHandler, onEllipsisClick };\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuBhB,MAAM,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA0C;AACxC,QAAM,aAAiD,EAAE,SAAS,KAAK;AAEvE,QAAM,sBAAsB,CAAC,MAAwB;AACnD,QAAI,WAAW,YAAY;AAAM,mBAAa,WAAW,OAAO;AAAA,aACvD,CAAC;AAAiB,sBAAgB,CAAC;AAC5C,eAAW,UAAU;AACrB,mBAAe,CAAC;AAAA,EAClB;AAEA,QAAM,sBAAsB,CAAC,MAAwB;AACnD,QAAI,WAAW,YAAY,MAAM;AAC/B,iBAAW,UAAU,WAAW,MAAM;AACpC,mBAAW,UAAU;AACrB,yBAAiB,CAAC;AAAA,MACpB,GAAG,GAAG;AAAA,IACR;AACA,mBAAe,CAAC;AAAA,EAClB;AACA,QAAM,kBAAkB,MAAM;AAC5B,UAAM,IAAI,MAAM,4EAA4E;AAAA,EAC9F;AAEA,SAAO,EAAE,qBAAqB,qBAAqB,gBAAgB;AACrE;",
   "names": []
 }

package/dist/cjs/components/SubmenuItem/getEllipsisHandlers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/SubmenuItem/getEllipsisHandlers.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import type { DSMenuItemT } from '../../react-desc-prop-types.js';\n\n// what we are trying to do:\n//   onMouseEnter -> be transparently \"doing nothing\" as hover does nothing by design for \"ellipsis\"\n//   onMouseLeave -> be transparently \"doing nothing\" as hover does nothing by design for \"ellipsis\"\n//   onEllipsisClick -> toggle the submenu open/close as per design\n\n// what are the \"challenges\" of the task:\n//  - we have created the API in such a way that we implement a \"bridge\" and \"inversion of control\" pattern\n//      this requires extra care when handling the logic and designing the solution\n\nexport const getEllipsisHandlers = ({\n  disabled,\n  isSubmenuOpened,\n  onMouseEnter,\n  onSubmenuOpen,\n  onSubmenuClose,\n  onMouseLeave,\n}: Required<DSMenuItemT.SingleWithSubmenuProps>) => {\n  // why not just onMouseEnterHandler = onMouseEnter?\n  //  we expect onMouseEnterHandler/onMouseLeaveHandler\n  //    to always exist even if onMouseEnter/onMouseLeave are undefined\n  //  also, if in the future we need custom logic for these handlers, we can add it here\n  const onMouseEnterHandler: React.MouseEventHandler = (e) => onMouseEnter?.(e);\n  const onMouseLeaveHandler: React.MouseEventHandler = (e) => onMouseLeave?.(e);\n\n  const onEllipsisClick: React.MouseEventHandler = (e) => {\n    if (disabled) return;\n    e.stopPropagation();\n    if (isSubmenuOpened) onSubmenuClose(e);\n    else onSubmenuOpen(e);\n  };\n\n  return { onMouseEnterHandler, onMouseLeaveHandler, onEllipsisClick };\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADWhB,MAAM,sBAAsB,CAAC;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAoD;AAKlD,QAAM,sBAA+C,CAAC,MAAM,eAAe,CAAC;AAC5E,QAAM,sBAA+C,CAAC,MAAM,eAAe,CAAC;AAE5E,QAAM,kBAA2C,CAAC,MAAM;AACtD,QAAI;AAAU;AACd,MAAE,gBAAgB;AAClB,QAAI;AAAiB,qBAAe,CAAC;AAAA;AAChC,oBAAc,CAAC;AAAA,EACtB;AAEA,SAAO,EAAE,qBAAqB,qBAAqB,gBAAgB;AACrE;",
+  "sourcesContent": ["import type { DSMenuItemT } from '../../react-desc-prop-types.js';\n\n// what we are trying to do:\n//   onMouseEnter -> be transparently \"doing nothing\" as hover does nothing by design for \"ellipsis\"\n//   onMouseLeave -> be transparently \"doing nothing\" as hover does nothing by design for \"ellipsis\"\n//   onEllipsisClick -> toggle the submenu open/close as per design\n\n// what are the \"challenges\" of the task:\n//  - we have created the API in such a way that we implement a \"bridge\" and \"inversion of control\" pattern\n//      this requires extra care when handling the logic and designing the solution\n\nexport const getEllipsisHandlers = ({\n  disabled,\n  isSubmenuOpened,\n  onMouseEnter,\n  onSubmenuOpen,\n  onSubmenuClose,\n  onMouseLeave,\n}: Required<DSMenuItemT.SubmenuProps>) => {\n  // why not just onMouseEnterHandler = onMouseEnter?\n  //  we expect onMouseEnterHandler/onMouseLeaveHandler\n  //    to always exist even if onMouseEnter/onMouseLeave are undefined\n  //  also, if in the future we need custom logic for these handlers, we can add it here\n  const onMouseEnterHandler: React.MouseEventHandler = (e) => onMouseEnter?.(e);\n  const onMouseLeaveHandler: React.MouseEventHandler = (e) => onMouseLeave?.(e);\n\n  const onEllipsisClick: React.MouseEventHandler = (e) => {\n    if (disabled) return;\n    e.stopPropagation();\n    if (isSubmenuOpened) onSubmenuClose(e);\n    else onSubmenuOpen(e);\n  };\n\n  return { onMouseEnterHandler, onMouseLeaveHandler, onEllipsisClick };\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADWhB,MAAM,sBAAsB,CAAC;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA0C;AAKxC,QAAM,sBAA+C,CAAC,MAAM,eAAe,CAAC;AAC5E,QAAM,sBAA+C,CAAC,MAAM,eAAe,CAAC;AAE5E,QAAM,kBAA2C,CAAC,MAAM;AACtD,QAAI;AAAU;AACd,MAAE,gBAAgB;AAClB,QAAI;AAAiB,qBAAe,CAAC;AAAA;AAChC,oBAAc,CAAC;AAAA,EACtB;AAEA,SAAO,EAAE,qBAAqB,qBAAqB,gBAAgB;AACrE;",
   "names": []
 }

package/dist/cjs/components/SubmenuItem/useGetSubmenuHandlers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/components/SubmenuItem/useGetSubmenuHandlers.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { useMemo } from 'react';\nimport type { DSMenuItemT } from '../../react-desc-prop-types.js';\nimport { getEllipsisHandlers } from './getEllipsisHandlers.js';\nimport { getChevronHandlers } from './getChevronHandlers.js';\n\n// what we are trying to do:\n//   Ellipsis case:\n//     onMouseEnter -> open submenu\n//     onMouseLeave -> close submenu\n//     onEllipsisClick -> we should not even invoke this handler, as the \"ellipsis\" should not even exist?\n//   Chevron case:\n//     onMouseEnter -> be transparently \"doing nothing\" as hover does nothing by design for \"ellipsis\"\n//     onMouseLeave -> be transparently \"doing nothing\" as hover does nothing by design for \"ellipsis\"\n//     onEllipsisClick -> toggle the submenu open/close as per design\n\n// what are the \"challenges\" of the task:\n//  - we have chosen to abstract multiple possible logical \"flows\" into the same layer for some reason\n//      specifically speaking this is trying to solve the\n//         \"rightAddons\" is \"ellipsis\" case\n//            at the same time as the\n//         \"rightAddons\" is \"chevron\" case\n//    they have more differences than similarities, so this is messy\n\n// @yuri since I'm both lazy and stupid, I want my code to be as stupid simple as me\n//   I am removing one layer of abstraction,\n//       ellipsis gets it's own logical flow\n//       as does chevron\n//   if you are a DRY advocate, you will probably hate me for this, I'm all for AHA (Avoid Hasty Abstractions).\nexport const useGetSubmenuHandlers = (submenuProps: Required<DSMenuItemT.SingleWithSubmenuProps>) => {\n  const { rightAddon } = submenuProps;\n  return useMemo(() => {\n    if (rightAddon === 'ellipsis') return getEllipsisHandlers(submenuProps);\n    return getChevronHandlers(submenuProps);\n  }, [submenuProps, rightAddon]);\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwB;AAExB,iCAAoC;AACpC,gCAAmC;AAyB5B,MAAM,wBAAwB,CAAC,iBAA+D;AACnG,QAAM,EAAE,WAAW,IAAI;AACvB,aAAO,sBAAQ,MAAM;AACnB,QAAI,eAAe;AAAY,iBAAO,gDAAoB,YAAY;AACtE,eAAO,8CAAmB,YAAY;AAAA,EACxC,GAAG,CAAC,cAAc,UAAU,CAAC;AAC/B;",
+  "sourcesContent": ["import { useMemo } from 'react';\nimport type { DSMenuItemT } from '../../react-desc-prop-types.js';\nimport { getEllipsisHandlers } from './getEllipsisHandlers.js';\nimport { getChevronHandlers } from './getChevronHandlers.js';\n\n// what we are trying to do:\n//   Ellipsis case:\n//     onMouseEnter -> open submenu\n//     onMouseLeave -> close submenu\n//     onEllipsisClick -> we should not even invoke this handler, as the \"ellipsis\" should not even exist?\n//   Chevron case:\n//     onMouseEnter -> be transparently \"doing nothing\" as hover does nothing by design for \"ellipsis\"\n//     onMouseLeave -> be transparently \"doing nothing\" as hover does nothing by design for \"ellipsis\"\n//     onEllipsisClick -> toggle the submenu open/close as per design\n\n// what are the \"challenges\" of the task:\n//  - we have chosen to abstract multiple possible logical \"flows\" into the same layer for some reason\n//      specifically speaking this is trying to solve the\n//         \"rightAddons\" is \"ellipsis\" case\n//            at the same time as the\n//         \"rightAddons\" is \"chevron\" case\n//    they have more differences than similarities, so this is messy\n\n// @yuri since I'm both lazy and stupid, I want my code to be as stupid simple as me\n//   I am removing one layer of abstraction,\n//       ellipsis gets it's own logical flow\n//       as does chevron\n//   if you are a DRY advocate, you will probably hate me for this, I'm all for AHA (Avoid Hasty Abstractions).\nexport const useGetSubmenuHandlers = (submenuProps: Required<DSMenuItemT.SubmenuProps>) => {\n  const { rightAddon } = submenuProps;\n  return useMemo(() => {\n    if (rightAddon === 'ellipsis') return getEllipsisHandlers(submenuProps);\n    return getChevronHandlers(submenuProps);\n  }, [submenuProps, rightAddon]);\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwB;AAExB,iCAAoC;AACpC,gCAAmC;AAyB5B,MAAM,wBAAwB,CAAC,iBAAqD;AACzF,QAAM,EAAE,WAAW,IAAI;AACvB,aAAO,sBAAQ,MAAM;AACnB,QAAI,eAAe;AAAY,iBAAO,gDAAoB,YAAY;AACtE,eAAO,8CAAmB,YAAY;AAAA,EACxC,GAAG,CAAC,cAAc,UAAU,CAAC;AAC/B;",
   "names": []
 }

package/dist/esm/components/Separator/index.js

@@ -8,7 +8,7 @@ const Separator = (props) => {
   const propsWithDefault = useMemoMergePropsWithDefault(props, defaultSeparatorProps);
   useValidateTypescriptPropTypes(propsWithDefault, itemProps, `${DSMenuItemName}Separator`);
   const { wrapperStyles, innerRef, render: Render } = propsWithDefault;
-  return /* @__PURE__ */ jsx(StyledSeparatorWrapper, { style: wrapperStyles, ref: innerRef, role: "separator", children: Render ? /* @__PURE__ */ jsx(Render, { ...props }) : /* @__PURE__ */ jsx(StyledSeparator, {}) });
+  return /* @__PURE__ */ jsx(StyledSeparatorWrapper, { style: wrapperStyles, ref: innerRef, role: "presentation", children: Render ? /* @__PURE__ */ jsx(Render, { ...props }) : /* @__PURE__ */ jsx(StyledSeparator, { role: "presentation" }) });
 };
 Separator.propTypes = itemProps;
 Separator.displayName = `${DSMenuItemName}Separator`;

package/dist/esm/components/Separator/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/Separator/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport type { DSMenuItemT } from '../../react-desc-prop-types.js';\nimport { itemProps, defaultSeparatorProps } from '../../react-desc-prop-types.js';\nimport { StyledSeparatorWrapper, StyledSeparator } from '../styled.js';\nimport { DSMenuItemName } from '../../exported-related/index.js';\n\nconst Separator: React.ComponentType<DSMenuItemT.SeparatorProps> = (props) => {\n  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultSeparatorProps);\n\n  useValidateTypescriptPropTypes(propsWithDefault, itemProps, `${DSMenuItemName}Separator`);\n  const { wrapperStyles, innerRef, render: Render } = propsWithDefault;\n  return (\n    <StyledSeparatorWrapper style={wrapperStyles} ref={innerRef} role=\"separator\">\n      {Render ? <Render {...props} /> : <StyledSeparator />}\n    </StyledSeparatorWrapper>\n  );\n};\n\nSeparator.propTypes = itemProps;\nSeparator.displayName = `${DSMenuItemName}Separator`;\nconst SeparatorWithSchema = describe(Separator);\nSeparatorWithSchema.propTypes = itemProps;\n\nexport { Separator, SeparatorWithSchema };\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACcP;AAbhB,SAAS,UAAU,8BAA8B,sCAAsC;AAEvF,SAAS,WAAW,6BAA6B;AACjD,SAAS,wBAAwB,uBAAuB;AACxD,SAAS,sBAAsB;AAE/B,MAAM,YAA6D,CAAC,UAAU;AAC5E,QAAM,mBAAmB,6BAA6B,OAAO,qBAAqB;AAElF,iCAA+B,kBAAkB,WAAW,GAAG,yBAAyB;AACxF,QAAM,EAAE,eAAe,UAAU,QAAQ,OAAO,IAAI;AACpD,SACE,oBAAC,0BAAuB,OAAO,eAAe,KAAK,UAAU,MAAK,aAC/D,mBAAS,oBAAC,UAAQ,GAAG,OAAO,IAAK,oBAAC,mBAAgB,GACrD;AAEJ;AAEA,UAAU,YAAY;AACtB,UAAU,cAAc,GAAG;AAC3B,MAAM,sBAAsB,SAAS,SAAS;AAC9C,oBAAoB,YAAY;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-props-helpers';\nimport type { DSMenuItemT } from '../../react-desc-prop-types.js';\nimport { itemProps, defaultSeparatorProps } from '../../react-desc-prop-types.js';\nimport { StyledSeparatorWrapper, StyledSeparator } from '../styled.js';\nimport { DSMenuItemName } from '../../exported-related/index.js';\n\nconst Separator: React.ComponentType<DSMenuItemT.SeparatorProps> = (props) => {\n  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultSeparatorProps);\n\n  useValidateTypescriptPropTypes(propsWithDefault, itemProps, `${DSMenuItemName}Separator`);\n  const { wrapperStyles, innerRef, render: Render } = propsWithDefault;\n  return (\n    <StyledSeparatorWrapper style={wrapperStyles} ref={innerRef} role=\"presentation\">\n      {Render ? <Render {...props} /> : <StyledSeparator role=\"presentation\" />}\n    </StyledSeparatorWrapper>\n  );\n};\n\nSeparator.propTypes = itemProps;\nSeparator.displayName = `${DSMenuItemName}Separator`;\nconst SeparatorWithSchema = describe(Separator);\nSeparatorWithSchema.propTypes = itemProps;\n\nexport { Separator, SeparatorWithSchema };\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACcP;AAbhB,SAAS,UAAU,8BAA8B,sCAAsC;AAEvF,SAAS,WAAW,6BAA6B;AACjD,SAAS,wBAAwB,uBAAuB;AACxD,SAAS,sBAAsB;AAE/B,MAAM,YAA6D,CAAC,UAAU;AAC5E,QAAM,mBAAmB,6BAA6B,OAAO,qBAAqB;AAElF,iCAA+B,kBAAkB,WAAW,GAAG,yBAAyB;AACxF,QAAM,EAAE,eAAe,UAAU,QAAQ,OAAO,IAAI;AACpD,SACE,oBAAC,0BAAuB,OAAO,eAAe,KAAK,UAAU,MAAK,gBAC/D,mBAAS,oBAAC,UAAQ,GAAG,OAAO,IAAK,oBAAC,mBAAgB,MAAK,gBAAe,GACzE;AAEJ;AAEA,UAAU,YAAY;AACtB,UAAU,cAAc,GAAG;AAC3B,MAAM,sBAAsB,SAAS,SAAS;AAC9C,oBAAoB,YAAY;",
   "names": []
 }

package/dist/esm/components/SubmenuItem/getChevronHandlers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/SubmenuItem/getChevronHandlers.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { DSMenuItemT } from '../../react-desc-prop-types.js';\n\n// what we are trying to do:\n//   onMouseEnter -> open submenu\n//   onMouseLeave -> close submenu\n//   onEllipsisClick -> we should not even invoke this handler, as the \"ellipsis\" should not even exist?\n\n// what are the \"challenges\" of the task:\n//  - the submenu close has an animation and we ideally want to be sure state changes after the animation is done\n//      (we do it via an hardcoded 300ms delay, this is know to cause issues in some cases)\n//  - \"what is open and what is closed\" state lives under ds-dropdownmenu,\n//      we manipulate it via \"onSubmenuOpen\" and \"onSubmenuClose\" callbacks\n//  - we have created the API in such a way that we implement a \"bridge\" and \"inversion of control\" pattern\n//      this requires extra care when handling the logic and designing the solution\n\n// important and relevant info:\n//  when this comment has been written,\n//    onSubmenuOpen coming from SingleWithSubmenuProps is forcing only one submenu to be open at a time internally\n//      the logic for this is implemented in ds-dropdownmenu,\n//         we had a bug in which we were invoking a stale callback,\n//            we monkeypatching it by ensuring the callback never changes\n//            in the future we should create code with \"hydraters\" to avoid this as per shuttle-v2\n\nexport const getChevronHandlers = ({\n  isSubmenuOpened,\n  onMouseEnter,\n  onSubmenuOpen,\n  onSubmenuClose,\n  onMouseLeave,\n}: Required<DSMenuItemT.SingleWithSubmenuProps>) => {\n  const timeoutRef: { current: NodeJS.Timeout | null } = { current: null };\n\n  const onMouseEnterHandler = (e: React.MouseEvent) => {\n    if (timeoutRef.current !== null) clearTimeout(timeoutRef.current);\n    else if (!isSubmenuOpened) onSubmenuOpen?.(e);\n    timeoutRef.current = null;\n    onMouseEnter?.(e);\n  };\n\n  const onMouseLeaveHandler = (e: React.MouseEvent) => {\n    if (timeoutRef.current === null) {\n      timeoutRef.current = setTimeout(() => {\n        timeoutRef.current = null;\n        onSubmenuClose?.(e);\n      }, 300);\n    }\n    onMouseLeave?.(e);\n  };\n  const onEllipsisClick = () => {\n    throw new Error('Invoking onEllipsisClick from chevron handlers... this should never happen');\n  };\n\n  return { onMouseEnterHandler, onMouseLeaveHandler, onEllipsisClick };\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACuBhB,MAAM,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAoD;AAClD,QAAM,aAAiD,EAAE,SAAS,KAAK;AAEvE,QAAM,sBAAsB,CAAC,MAAwB;AACnD,QAAI,WAAW,YAAY;AAAM,mBAAa,WAAW,OAAO;AAAA,aACvD,CAAC;AAAiB,sBAAgB,CAAC;AAC5C,eAAW,UAAU;AACrB,mBAAe,CAAC;AAAA,EAClB;AAEA,QAAM,sBAAsB,CAAC,MAAwB;AACnD,QAAI,WAAW,YAAY,MAAM;AAC/B,iBAAW,UAAU,WAAW,MAAM;AACpC,mBAAW,UAAU;AACrB,yBAAiB,CAAC;AAAA,MACpB,GAAG,GAAG;AAAA,IACR;AACA,mBAAe,CAAC;AAAA,EAClB;AACA,QAAM,kBAAkB,MAAM;AAC5B,UAAM,IAAI,MAAM,4EAA4E;AAAA,EAC9F;AAEA,SAAO,EAAE,qBAAqB,qBAAqB,gBAAgB;AACrE;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { DSMenuItemT } from '../../react-desc-prop-types.js';\n\n// what we are trying to do:\n//   onMouseEnter -> open submenu\n//   onMouseLeave -> close submenu\n//   onEllipsisClick -> we should not even invoke this handler, as the \"ellipsis\" should not even exist?\n\n// what are the \"challenges\" of the task:\n//  - the submenu close has an animation and we ideally want to be sure state changes after the animation is done\n//      (we do it via an hardcoded 300ms delay, this is know to cause issues in some cases)\n//  - \"what is open and what is closed\" state lives under ds-dropdownmenu,\n//      we manipulate it via \"onSubmenuOpen\" and \"onSubmenuClose\" callbacks\n//  - we have created the API in such a way that we implement a \"bridge\" and \"inversion of control\" pattern\n//      this requires extra care when handling the logic and designing the solution\n\n// important and relevant info:\n//  when this comment has been written,\n//    onSubmenuOpen coming from SingleWithSubmenuProps is forcing only one submenu to be open at a time internally\n//      the logic for this is implemented in ds-dropdownmenu,\n//         we had a bug in which we were invoking a stale callback,\n//            we monkeypatching it by ensuring the callback never changes\n//            in the future we should create code with \"hydraters\" to avoid this as per shuttle-v2\n\nexport const getChevronHandlers = ({\n  isSubmenuOpened,\n  onMouseEnter,\n  onSubmenuOpen,\n  onSubmenuClose,\n  onMouseLeave,\n}: Required<DSMenuItemT.SubmenuProps>) => {\n  const timeoutRef: { current: NodeJS.Timeout | null } = { current: null };\n\n  const onMouseEnterHandler = (e: React.MouseEvent) => {\n    if (timeoutRef.current !== null) clearTimeout(timeoutRef.current);\n    else if (!isSubmenuOpened) onSubmenuOpen?.(e);\n    timeoutRef.current = null;\n    onMouseEnter?.(e);\n  };\n\n  const onMouseLeaveHandler = (e: React.MouseEvent) => {\n    if (timeoutRef.current === null) {\n      timeoutRef.current = setTimeout(() => {\n        timeoutRef.current = null;\n        onSubmenuClose?.(e);\n      }, 300);\n    }\n    onMouseLeave?.(e);\n  };\n  const onEllipsisClick = () => {\n    throw new Error('Invoking onEllipsisClick from chevron handlers... this should never happen');\n  };\n\n  return { onMouseEnterHandler, onMouseLeaveHandler, onEllipsisClick };\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACuBhB,MAAM,qBAAqB,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA0C;AACxC,QAAM,aAAiD,EAAE,SAAS,KAAK;AAEvE,QAAM,sBAAsB,CAAC,MAAwB;AACnD,QAAI,WAAW,YAAY;AAAM,mBAAa,WAAW,OAAO;AAAA,aACvD,CAAC;AAAiB,sBAAgB,CAAC;AAC5C,eAAW,UAAU;AACrB,mBAAe,CAAC;AAAA,EAClB;AAEA,QAAM,sBAAsB,CAAC,MAAwB;AACnD,QAAI,WAAW,YAAY,MAAM;AAC/B,iBAAW,UAAU,WAAW,MAAM;AACpC,mBAAW,UAAU;AACrB,yBAAiB,CAAC;AAAA,MACpB,GAAG,GAAG;AAAA,IACR;AACA,mBAAe,CAAC;AAAA,EAClB;AACA,QAAM,kBAAkB,MAAM;AAC5B,UAAM,IAAI,MAAM,4EAA4E;AAAA,EAC9F;AAEA,SAAO,EAAE,qBAAqB,qBAAqB,gBAAgB;AACrE;",
   "names": []
 }

package/dist/esm/components/SubmenuItem/getEllipsisHandlers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/SubmenuItem/getEllipsisHandlers.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { DSMenuItemT } from '../../react-desc-prop-types.js';\n\n// what we are trying to do:\n//   onMouseEnter -> be transparently \"doing nothing\" as hover does nothing by design for \"ellipsis\"\n//   onMouseLeave -> be transparently \"doing nothing\" as hover does nothing by design for \"ellipsis\"\n//   onEllipsisClick -> toggle the submenu open/close as per design\n\n// what are the \"challenges\" of the task:\n//  - we have created the API in such a way that we implement a \"bridge\" and \"inversion of control\" pattern\n//      this requires extra care when handling the logic and designing the solution\n\nexport const getEllipsisHandlers = ({\n  disabled,\n  isSubmenuOpened,\n  onMouseEnter,\n  onSubmenuOpen,\n  onSubmenuClose,\n  onMouseLeave,\n}: Required<DSMenuItemT.SingleWithSubmenuProps>) => {\n  // why not just onMouseEnterHandler = onMouseEnter?\n  //  we expect onMouseEnterHandler/onMouseLeaveHandler\n  //    to always exist even if onMouseEnter/onMouseLeave are undefined\n  //  also, if in the future we need custom logic for these handlers, we can add it here\n  const onMouseEnterHandler: React.MouseEventHandler = (e) => onMouseEnter?.(e);\n  const onMouseLeaveHandler: React.MouseEventHandler = (e) => onMouseLeave?.(e);\n\n  const onEllipsisClick: React.MouseEventHandler = (e) => {\n    if (disabled) return;\n    e.stopPropagation();\n    if (isSubmenuOpened) onSubmenuClose(e);\n    else onSubmenuOpen(e);\n  };\n\n  return { onMouseEnterHandler, onMouseLeaveHandler, onEllipsisClick };\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACWhB,MAAM,sBAAsB,CAAC;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAoD;AAKlD,QAAM,sBAA+C,CAAC,MAAM,eAAe,CAAC;AAC5E,QAAM,sBAA+C,CAAC,MAAM,eAAe,CAAC;AAE5E,QAAM,kBAA2C,CAAC,MAAM;AACtD,QAAI;AAAU;AACd,MAAE,gBAAgB;AAClB,QAAI;AAAiB,qBAAe,CAAC;AAAA;AAChC,oBAAc,CAAC;AAAA,EACtB;AAEA,SAAO,EAAE,qBAAqB,qBAAqB,gBAAgB;AACrE;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { DSMenuItemT } from '../../react-desc-prop-types.js';\n\n// what we are trying to do:\n//   onMouseEnter -> be transparently \"doing nothing\" as hover does nothing by design for \"ellipsis\"\n//   onMouseLeave -> be transparently \"doing nothing\" as hover does nothing by design for \"ellipsis\"\n//   onEllipsisClick -> toggle the submenu open/close as per design\n\n// what are the \"challenges\" of the task:\n//  - we have created the API in such a way that we implement a \"bridge\" and \"inversion of control\" pattern\n//      this requires extra care when handling the logic and designing the solution\n\nexport const getEllipsisHandlers = ({\n  disabled,\n  isSubmenuOpened,\n  onMouseEnter,\n  onSubmenuOpen,\n  onSubmenuClose,\n  onMouseLeave,\n}: Required<DSMenuItemT.SubmenuProps>) => {\n  // why not just onMouseEnterHandler = onMouseEnter?\n  //  we expect onMouseEnterHandler/onMouseLeaveHandler\n  //    to always exist even if onMouseEnter/onMouseLeave are undefined\n  //  also, if in the future we need custom logic for these handlers, we can add it here\n  const onMouseEnterHandler: React.MouseEventHandler = (e) => onMouseEnter?.(e);\n  const onMouseLeaveHandler: React.MouseEventHandler = (e) => onMouseLeave?.(e);\n\n  const onEllipsisClick: React.MouseEventHandler = (e) => {\n    if (disabled) return;\n    e.stopPropagation();\n    if (isSubmenuOpened) onSubmenuClose(e);\n    else onSubmenuOpen(e);\n  };\n\n  return { onMouseEnterHandler, onMouseLeaveHandler, onEllipsisClick };\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACWhB,MAAM,sBAAsB,CAAC;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA0C;AAKxC,QAAM,sBAA+C,CAAC,MAAM,eAAe,CAAC;AAC5E,QAAM,sBAA+C,CAAC,MAAM,eAAe,CAAC;AAE5E,QAAM,kBAA2C,CAAC,MAAM;AACtD,QAAI;AAAU;AACd,MAAE,gBAAgB;AAClB,QAAI;AAAiB,qBAAe,CAAC;AAAA;AAChC,oBAAc,CAAC;AAAA,EACtB;AAEA,SAAO,EAAE,qBAAqB,qBAAqB,gBAAgB;AACrE;",
   "names": []
 }

package/dist/esm/components/SubmenuItem/useGetSubmenuHandlers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/SubmenuItem/useGetSubmenuHandlers.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo } from 'react';\nimport type { DSMenuItemT } from '../../react-desc-prop-types.js';\nimport { getEllipsisHandlers } from './getEllipsisHandlers.js';\nimport { getChevronHandlers } from './getChevronHandlers.js';\n\n// what we are trying to do:\n//   Ellipsis case:\n//     onMouseEnter -> open submenu\n//     onMouseLeave -> close submenu\n//     onEllipsisClick -> we should not even invoke this handler, as the \"ellipsis\" should not even exist?\n//   Chevron case:\n//     onMouseEnter -> be transparently \"doing nothing\" as hover does nothing by design for \"ellipsis\"\n//     onMouseLeave -> be transparently \"doing nothing\" as hover does nothing by design for \"ellipsis\"\n//     onEllipsisClick -> toggle the submenu open/close as per design\n\n// what are the \"challenges\" of the task:\n//  - we have chosen to abstract multiple possible logical \"flows\" into the same layer for some reason\n//      specifically speaking this is trying to solve the\n//         \"rightAddons\" is \"ellipsis\" case\n//            at the same time as the\n//         \"rightAddons\" is \"chevron\" case\n//    they have more differences than similarities, so this is messy\n\n// @yuri since I'm both lazy and stupid, I want my code to be as stupid simple as me\n//   I am removing one layer of abstraction,\n//       ellipsis gets it's own logical flow\n//       as does chevron\n//   if you are a DRY advocate, you will probably hate me for this, I'm all for AHA (Avoid Hasty Abstractions).\nexport const useGetSubmenuHandlers = (submenuProps: Required<DSMenuItemT.SingleWithSubmenuProps>) => {\n  const { rightAddon } = submenuProps;\n  return useMemo(() => {\n    if (rightAddon === 'ellipsis') return getEllipsisHandlers(submenuProps);\n    return getChevronHandlers(submenuProps);\n  }, [submenuProps, rightAddon]);\n};\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,eAAe;AAExB,SAAS,2BAA2B;AACpC,SAAS,0BAA0B;AAyB5B,MAAM,wBAAwB,CAAC,iBAA+D;AACnG,QAAM,EAAE,WAAW,IAAI;AACvB,SAAO,QAAQ,MAAM;AACnB,QAAI,eAAe;AAAY,aAAO,oBAAoB,YAAY;AACtE,WAAO,mBAAmB,YAAY;AAAA,EACxC,GAAG,CAAC,cAAc,UAAU,CAAC;AAC/B;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo } from 'react';\nimport type { DSMenuItemT } from '../../react-desc-prop-types.js';\nimport { getEllipsisHandlers } from './getEllipsisHandlers.js';\nimport { getChevronHandlers } from './getChevronHandlers.js';\n\n// what we are trying to do:\n//   Ellipsis case:\n//     onMouseEnter -> open submenu\n//     onMouseLeave -> close submenu\n//     onEllipsisClick -> we should not even invoke this handler, as the \"ellipsis\" should not even exist?\n//   Chevron case:\n//     onMouseEnter -> be transparently \"doing nothing\" as hover does nothing by design for \"ellipsis\"\n//     onMouseLeave -> be transparently \"doing nothing\" as hover does nothing by design for \"ellipsis\"\n//     onEllipsisClick -> toggle the submenu open/close as per design\n\n// what are the \"challenges\" of the task:\n//  - we have chosen to abstract multiple possible logical \"flows\" into the same layer for some reason\n//      specifically speaking this is trying to solve the\n//         \"rightAddons\" is \"ellipsis\" case\n//            at the same time as the\n//         \"rightAddons\" is \"chevron\" case\n//    they have more differences than similarities, so this is messy\n\n// @yuri since I'm both lazy and stupid, I want my code to be as stupid simple as me\n//   I am removing one layer of abstraction,\n//       ellipsis gets it's own logical flow\n//       as does chevron\n//   if you are a DRY advocate, you will probably hate me for this, I'm all for AHA (Avoid Hasty Abstractions).\nexport const useGetSubmenuHandlers = (submenuProps: Required<DSMenuItemT.SubmenuProps>) => {\n  const { rightAddon } = submenuProps;\n  return useMemo(() => {\n    if (rightAddon === 'ellipsis') return getEllipsisHandlers(submenuProps);\n    return getChevronHandlers(submenuProps);\n  }, [submenuProps, rightAddon]);\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,eAAe;AAExB,SAAS,2BAA2B;AACpC,SAAS,0BAA0B;AAyB5B,MAAM,wBAAwB,CAAC,iBAAqD;AACzF,QAAM,EAAE,WAAW,IAAI;AACvB,SAAO,QAAQ,MAAM;AACnB,QAAI,eAAe;AAAY,aAAO,oBAAoB,YAAY;AACtE,WAAO,mBAAmB,YAAY;AAAA,EACxC,GAAG,CAAC,cAAc,UAAU,CAAC;AAC/B;",
   "names": []
 }

package/dist/types/components/SubmenuItem/getChevronHandlers.d.ts

@@ -1,5 +1,5 @@
 import type { DSMenuItemT } from '../../react-desc-prop-types.js';
-export declare const getChevronHandlers: ({ isSubmenuOpened, onMouseEnter, onSubmenuOpen, onSubmenuClose, onMouseLeave, }: Required<DSMenuItemT.SingleWithSubmenuProps>) => {
+export declare const getChevronHandlers: ({ isSubmenuOpened, onMouseEnter, onSubmenuOpen, onSubmenuClose, onMouseLeave, }: Required<DSMenuItemT.SubmenuProps>) => {
     onMouseEnterHandler: (e: React.MouseEvent) => void;
     onMouseLeaveHandler: (e: React.MouseEvent) => void;
     onEllipsisClick: () => never;

package/dist/types/components/SubmenuItem/getEllipsisHandlers.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { DSMenuItemT } from '../../react-desc-prop-types.js';
-export declare const getEllipsisHandlers: ({ disabled, isSubmenuOpened, onMouseEnter, onSubmenuOpen, onSubmenuClose, onMouseLeave, }: Required<DSMenuItemT.SingleWithSubmenuProps>) => {
+export declare const getEllipsisHandlers: ({ disabled, isSubmenuOpened, onMouseEnter, onSubmenuOpen, onSubmenuClose, onMouseLeave, }: Required<DSMenuItemT.SubmenuProps>) => {
     onMouseEnterHandler: import("react").MouseEventHandler<Element>;
     onMouseLeaveHandler: import("react").MouseEventHandler<Element>;
     onEllipsisClick: import("react").MouseEventHandler<Element>;

package/dist/types/components/SubmenuItem/useGetSubmenuHandlers.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { DSMenuItemT } from '../../react-desc-prop-types.js';
-export declare const useGetSubmenuHandlers: (submenuProps: Required<DSMenuItemT.SingleWithSubmenuProps>) => {
+export declare const useGetSubmenuHandlers: (submenuProps: Required<DSMenuItemT.SubmenuProps>) => {
     onMouseEnterHandler: import("react").MouseEventHandler<Element>;
     onMouseLeaveHandler: import("react").MouseEventHandler<Element>;
     onEllipsisClick: import("react").MouseEventHandler<Element>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-menu-items",
-  "version": "3.20.0-next.5",
+  "version": "3.20.0-next.7",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Menu Items",
   "files": [
@@ -37,11 +37,11 @@
   "dependencies": {
     "@xstyled/system": "~3.7.3",
     "@xstyled/util": "3.7.0",
-    "@elliemae/ds-form-checkbox": "3.20.0-next.5",
-    "@elliemae/ds-grid": "3.20.0-next.5",
-    "@elliemae/ds-icons": "3.20.0-next.5",
-    "@elliemae/ds-props-helpers": "3.20.0-next.5",
-    "@elliemae/ds-system": "3.20.0-next.5"
+    "@elliemae/ds-form-checkbox": "3.20.0-next.7",
+    "@elliemae/ds-grid": "3.20.0-next.7",
+    "@elliemae/ds-icons": "3.20.0-next.7",
+    "@elliemae/ds-props-helpers": "3.20.0-next.7",
+    "@elliemae/ds-system": "3.20.0-next.7"
   },
   "peerDependencies": {
     "lodash": "^4.17.21",