@elliemae/ds-menu-items 3.9.0-next.5

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

@@ -0,0 +1,118 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var react_desc_prop_types_exports = {};
+__export(react_desc_prop_types_exports, {
+  defaultActionProps: () => defaultActionProps,
+  defaultCommonProps: () => defaultCommonProps,
+  defaultMultiProps: () => defaultMultiProps,
+  defaultSectionProps: () => defaultSectionProps,
+  defaultSeparatorProps: () => defaultSeparatorProps,
+  defaultSingleProps: () => defaultSingleProps,
+  defaultSingleWithSubmenuProps: () => defaultSingleWithSubmenuProps,
+  defaultSubmenuProps: () => defaultSubmenuProps,
+  itemProps: () => itemProps
+});
+module.exports = __toCommonJS(react_desc_prop_types_exports);
+var React = __toESM(require("react"));
+var import_ds_utilities = require("@elliemae/ds-utilities");
+const noop = () => null;
+const defaultCommonProps = {
+  innerRef: noop,
+  wrapperStyles: {}
+};
+const defaultActionProps = {
+  ...defaultCommonProps,
+  label: "",
+  value: void 0,
+  disabled: false,
+  isActive: false,
+  onClick: noop,
+  optionsShouldHavePadding: false
+};
+const defaultMultiProps = {
+  ...defaultCommonProps,
+  label: "",
+  isActive: false,
+  disabled: false,
+  isSelected: false,
+  onClick: noop,
+  onMouseDown: noop,
+  onMouseEnter: noop,
+  onMouseLeave: noop,
+  tabIndex: 0
+};
+const defaultSingleProps = {
+  ...defaultCommonProps,
+  label: "",
+  isActive: false,
+  disabled: false,
+  isSelected: false,
+  onClick: noop,
+  onMouseDown: noop,
+  onMouseEnter: noop,
+  onMouseLeave: noop,
+  dataTestid: "",
+  tabIndex: 0
+};
+const defaultSubmenuProps = {
+  ...defaultCommonProps,
+  label: "",
+  isActive: false,
+  disabled: false,
+  isSubmenuOpened: false,
+  onSubmenuOpen: noop,
+  rightAddon: "chevron",
+  optionsShouldHavePadding: false,
+  Dropdown: noop,
+  dropdownProps: {
+    options: [],
+    onSubmenuToggle: noop,
+    openedSubmenus: {},
+    selectedOptions: {},
+    onKeyDown: noop,
+    onOptionClick: noop,
+    onClickOutside: noop,
+    minWidth: "auto",
+    maxHeight: "auto"
+  }
+};
+const defaultSectionProps = {
+  ...defaultCommonProps,
+  label: ""
+};
+const defaultSeparatorProps = {
+  ...defaultCommonProps
+};
+const defaultSingleWithSubmenuProps = {
+  ...defaultSingleProps,
+  ...defaultSubmenuProps
+};
+const itemProps = {
+  dsId: import_ds_utilities.PropTypes.string,
+  innerRef: import_ds_utilities.PropTypes.oneOfType([import_ds_utilities.PropTypes.func, import_ds_utilities.PropTypes.shape({ current: import_ds_utilities.PropTypes.any })]),
+  wrapperStyles: import_ds_utilities.PropTypes.object,
+  render: import_ds_utilities.PropTypes.func
+};
+//# sourceMappingURL=react-desc-prop-types.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/react-desc-prop-types.ts", "../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport React, { PropsWithChildren, WeakValidationMap } from 'react';\nimport { SizingProps } from '@elliemae/ds-system';\nimport { PropTypes } from '@elliemae/ds-utilities';\n\nexport namespace DSMenuItemT {\n  export interface CommonProps<T = Record<string, unknown>> {\n    dsId: string;\n    innerRef?: React.RefObject<HTMLLIElement> | ((_ref: HTMLLIElement) => void);\n    wrapperStyles?: Record<string, unknown>;\n    render?: React.ComponentType<T>;\n  }\n\n  export interface ActionProps extends CommonProps<ActionProps> {\n    label?: string;\n    value?: unknown;\n    disabled?: boolean;\n    isActive?: boolean;\n    onClick?: React.MouseEventHandler;\n    optionsShouldHavePadding?: boolean;\n  }\n\n  export interface MultiProps extends CommonProps<MultiProps> {\n    label?: string;\n    isActive?: boolean;\n    disabled?: boolean;\n    isSelected?: boolean;\n    onClick?: React.MouseEventHandler;\n    onMouseDown?: React.MouseEventHandler;\n    onMouseEnter?: React.MouseEventHandler;\n    onMouseLeave?: React.MouseEventHandler;\n    tabIndex?: number;\n  }\n\n  export interface SingleProps extends CommonProps<SingleProps> {\n    label?: string;\n    isActive?: boolean;\n    disabled?: boolean;\n    isSelected?: boolean;\n    onClick?: React.MouseEventHandler;\n    onMouseDown?: React.MouseEventHandler;\n    onMouseEnter?: React.MouseEventHandler;\n    onMouseLeave?: React.MouseEventHandler;\n    dataTestid?: string;\n    tabIndex?: number;\n  }\n\n  export interface SubmenuProps extends CommonProps<SubmenuProps> {\n    label?: string;\n    isActive?: boolean;\n    disabled?: boolean;\n    isSubmenuOpened?: boolean;\n    onSubmenuOpen?: React.MouseEventHandler;\n    onSubmenuClose?: React.MouseEventHandler;\n    rightAddon?: 'ellipsis' | 'chevron';\n    optionsShouldHavePadding?: boolean;\n    onMouseEnter?: React.MouseEventHandler;\n    onMouseLeave?: React.MouseEventHandler;\n    Dropdown: React.ComponentType<PropsWithChildren<SubmenuProps['dropdownProps']>>;\n    dropdownProps?: {\n      options: any[];\n      onSubmenuToggle?: (\n        nextOpenedSubmenus: Record<string, boolean>,\n        submenu: any,\n        e: React.MouseEvent | React.KeyboardEvent,\n      ) => void;\n      openedSubmenus?: Record<string, boolean>;\n      selectedOptions?: Record<string, boolean>;\n      onKeyDown?: React.KeyboardEventHandler;\n      onOptionClick?: (\n        nextSelectedOptions: Record<string, boolean>,\n        clickedOption: any,\n        e: React.MouseEvent | React.KeyboardEvent,\n      ) => void;\n      onClickOutside?: (e: React.MouseEvent | React.KeyboardEvent | React.TouchEvent) => void;\n      minWidth?: SizingProps['minWidth'];\n      maxHeight?: SizingProps['maxHeight'];\n      [key: string]: unknown;\n    };\n  }\n\n  export interface SectionProps extends CommonProps<SectionProps> {\n    label?: string;\n  }\n\n  export type SeparatorProps = CommonProps<SeparatorProps>;\n\n  export interface SingleWithSubmenuProps extends Omit<SingleProps, 'render'>, Omit<SubmenuProps, 'render'> {\n    render?: React.ComponentType<SingleWithSubmenuProps>;\n  }\n}\n\nconst noop = () => null;\n\nexport const defaultCommonProps: Partial<Omit<DSMenuItemT.CommonProps, 'render'>> = {\n  innerRef: noop,\n  wrapperStyles: {},\n};\n\nexport const defaultActionProps: Partial<DSMenuItemT.ActionProps> = {\n  ...defaultCommonProps,\n  label: '',\n  value: undefined,\n  disabled: false,\n  isActive: false,\n  onClick: noop,\n  optionsShouldHavePadding: false,\n};\n\nexport const defaultMultiProps: Partial<DSMenuItemT.MultiProps> = {\n  ...defaultCommonProps,\n  label: '',\n  isActive: false,\n  disabled: false,\n  isSelected: false,\n  onClick: noop,\n  onMouseDown: noop,\n  onMouseEnter: noop,\n  onMouseLeave: noop,\n  tabIndex: 0,\n};\n\nexport const defaultSingleProps: Partial<DSMenuItemT.SingleProps> = {\n  ...defaultCommonProps,\n  label: '',\n  isActive: false,\n  disabled: false,\n  isSelected: false,\n  onClick: noop,\n  onMouseDown: noop,\n  onMouseEnter: noop,\n  onMouseLeave: noop,\n  dataTestid: '',\n  tabIndex: 0,\n};\n\nexport const defaultSubmenuProps: Partial<DSMenuItemT.SubmenuProps> = {\n  ...defaultCommonProps,\n  label: '',\n  isActive: false,\n  disabled: false,\n  isSubmenuOpened: false,\n  onSubmenuOpen: noop,\n  rightAddon: 'chevron',\n  optionsShouldHavePadding: false,\n  Dropdown: noop,\n  dropdownProps: {\n    options: [],\n    onSubmenuToggle: noop,\n    openedSubmenus: {},\n    selectedOptions: {},\n    onKeyDown: noop,\n    onOptionClick: noop,\n    onClickOutside: noop,\n    minWidth: 'auto',\n    maxHeight: 'auto',\n  },\n};\n\nexport const defaultSectionProps: Partial<DSMenuItemT.SectionProps> = {\n  ...defaultCommonProps,\n  label: '',\n};\n\nexport const defaultSeparatorProps: Partial<DSMenuItemT.SeparatorProps> = {\n  ...defaultCommonProps,\n};\n\nexport const defaultSingleWithSubmenuProps: Partial<Omit<DSMenuItemT.SingleWithSubmenuProps, 'render'>> = {\n  ...defaultSingleProps,\n  ...defaultSubmenuProps,\n};\n\nexport const itemProps = {\n  dsId: PropTypes.string,\n  innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({ current: PropTypes.any })]),\n  wrapperStyles: PropTypes.object,\n  render: PropTypes.func,\n} as WeakValidationMap<unknown>;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADGvB,0BAA0B;AAyF1B,MAAM,OAAO,MAAM;AAEZ,MAAM,qBAAuE;AAAA,EAClF,UAAU;AAAA,EACV,eAAe,CAAC;AAClB;AAEO,MAAM,qBAAuD;AAAA,EAClE,GAAG;AAAA,EACH,OAAO;AAAA,EACP,OAAO;AAAA,EACP,UAAU;AAAA,EACV,UAAU;AAAA,EACV,SAAS;AAAA,EACT,0BAA0B;AAC5B;AAEO,MAAM,oBAAqD;AAAA,EAChE,GAAG;AAAA,EACH,OAAO;AAAA,EACP,UAAU;AAAA,EACV,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,aAAa;AAAA,EACb,cAAc;AAAA,EACd,cAAc;AAAA,EACd,UAAU;AACZ;AAEO,MAAM,qBAAuD;AAAA,EAClE,GAAG;AAAA,EACH,OAAO;AAAA,EACP,UAAU;AAAA,EACV,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,aAAa;AAAA,EACb,cAAc;AAAA,EACd,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,UAAU;AACZ;AAEO,MAAM,sBAAyD;AAAA,EACpE,GAAG;AAAA,EACH,OAAO;AAAA,EACP,UAAU;AAAA,EACV,UAAU;AAAA,EACV,iBAAiB;AAAA,EACjB,eAAe;AAAA,EACf,YAAY;AAAA,EACZ,0BAA0B;AAAA,EAC1B,UAAU;AAAA,EACV,eAAe;AAAA,IACb,SAAS,CAAC;AAAA,IACV,iBAAiB;AAAA,IACjB,gBAAgB,CAAC;AAAA,IACjB,iBAAiB,CAAC;AAAA,IAClB,WAAW;AAAA,IACX,eAAe;AAAA,IACf,gBAAgB;AAAA,IAChB,UAAU;AAAA,IACV,WAAW;AAAA,EACb;AACF;AAEO,MAAM,sBAAyD;AAAA,EACpE,GAAG;AAAA,EACH,OAAO;AACT;AAEO,MAAM,wBAA6D;AAAA,EACxE,GAAG;AACL;AAEO,MAAM,gCAA6F;AAAA,EACxG,GAAG;AAAA,EACH,GAAG;AACL;AAEO,MAAM,YAAY;AAAA,EACvB,MAAM,8BAAU;AAAA,EAChB,UAAU,8BAAU,UAAU,CAAC,8BAAU,MAAM,8BAAU,MAAM,EAAE,SAAS,8BAAU,IAAI,CAAC,CAAC,CAAC;AAAA,EAC3F,eAAe,8BAAU;AAAA,EACzB,QAAQ,8BAAU;AACpB;",
+  "names": []
+}

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

@@ -0,0 +1,44 @@
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from "@elliemae/ds-utilities";
+import { defaultActionProps, itemProps } from "../../react-desc-prop-types";
+import { StyledGlobalMenuItemWrapper, StyledItemLabel } from "../styled";
+const ActionMenuItem = (props) => {
+  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultActionProps);
+  useValidateTypescriptPropTypes(propsWithDefault, itemProps);
+  const {
+    dsId,
+    label,
+    onClick,
+    isActive,
+    disabled,
+    innerRef,
+    wrapperStyles,
+    optionsShouldHavePadding,
+    render: Render
+  } = propsWithDefault;
+  return /* @__PURE__ */ jsx(StyledGlobalMenuItemWrapper, {
+    id: dsId,
+    role: "option",
+    isActive,
+    disabled,
+    onClick: !disabled ? onClick : void 0,
+    ref: innerRef,
+    pl: optionsShouldHavePadding ? 40 : 16,
+    style: wrapperStyles,
+    children: Render !== void 0 ? /* @__PURE__ */ jsx(Render, {
+      ...propsWithDefault
+    }) : /* @__PURE__ */ jsx(StyledItemLabel, {
+      children: label
+    })
+  });
+};
+ActionMenuItem.propTypes = itemProps;
+ActionMenuItem.displayName = "ActionMenuItem";
+const ActionMenuItemWithSchema = describe(ActionMenuItem);
+ActionMenuItemWithSchema.propTypes = itemProps;
+export {
+  ActionMenuItem,
+  ActionMenuItemWithSchema
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/ActionMenuItem/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { DSMenuItemT, defaultActionProps, itemProps } from '../../react-desc-prop-types';\nimport { StyledGlobalMenuItemWrapper, StyledItemLabel } from '../styled';\n\nconst ActionMenuItem = (props: DSMenuItemT.ActionProps): JSX.Element => {\n  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultActionProps);\n\n  useValidateTypescriptPropTypes(propsWithDefault, itemProps);\n\n  const {\n    dsId,\n    label,\n    onClick,\n    isActive,\n    disabled,\n    innerRef,\n    wrapperStyles,\n    optionsShouldHavePadding,\n    render: Render,\n  } = propsWithDefault;\n\n  return (\n    <StyledGlobalMenuItemWrapper\n      id={dsId}\n      role=\"option\"\n      isActive={isActive}\n      disabled={disabled}\n      onClick={!disabled ? onClick : undefined}\n      ref={innerRef}\n      pl={optionsShouldHavePadding ? 40 : 16}\n      style={wrapperStyles}\n    >\n      {Render !== undefined ? <Render {...propsWithDefault} /> : <StyledItemLabel>{label}</StyledItemLabel>}\n    </StyledGlobalMenuItemWrapper>\n  );\n};\n\nActionMenuItem.propTypes = itemProps;\nActionMenuItem.displayName = 'ActionMenuItem';\nconst ActionMenuItemWithSchema = describe(ActionMenuItem);\nActionMenuItemWithSchema.propTypes = itemProps;\n\nexport { ActionMenuItem, ActionMenuItemWithSchema };\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAS,UAAU,8BAA8B,sCAAsC;AACvF,SAAsB,oBAAoB,iBAAiB;AAC3D,SAAS,6BAA6B,uBAAuB;AAE7D,MAAM,iBAAiB,CAAC,UAAgD;AACtE,QAAM,mBAAmB,6BAA6B,OAAO,kBAAkB;AAE/E,iCAA+B,kBAAkB,SAAS;AAE1D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,EACV,IAAI;AAEJ,SACE,oBAAC;AAAA,IACC,IAAI;AAAA,IACJ,MAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA,SAAS,CAAC,WAAW,UAAU;AAAA,IAC/B,KAAK;AAAA,IACL,IAAI,2BAA2B,KAAK;AAAA,IACpC,OAAO;AAAA,IAEN,qBAAW,SAAY,oBAAC;AAAA,MAAQ,GAAG;AAAA,KAAkB,IAAK,oBAAC;AAAA,MAAiB;AAAA,KAAM;AAAA,GACrF;AAEJ;AAEA,eAAe,YAAY;AAC3B,eAAe,cAAc;AAC7B,MAAM,2BAA2B,SAAS,cAAc;AACxD,yBAAyB,YAAY;",
+  "names": []
+}

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

@@ -0,0 +1,66 @@
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from "@elliemae/ds-utilities";
+import { DSControlledCheckbox } from "@elliemae/ds-form-checkbox";
+import { defaultMultiProps, itemProps } from "../../react-desc-prop-types";
+import { StyledGlobalMenuItemWrapper, StyledItemContent } from "../styled";
+const noop = () => null;
+const MultiMenuItem = (props) => {
+  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultMultiProps);
+  useValidateTypescriptPropTypes(propsWithDefault, itemProps);
+  const {
+    dsId,
+    label,
+    disabled,
+    isSelected,
+    isActive,
+    onClick,
+    innerRef,
+    onMouseEnter,
+    onMouseLeave,
+    onMouseDown,
+    wrapperStyles,
+    tabIndex,
+    render: Render
+  } = propsWithDefault;
+  return /* @__PURE__ */ jsx(StyledGlobalMenuItemWrapper, {
+    id: dsId,
+    disabled,
+    isActive,
+    isSelected,
+    ref: innerRef,
+    onMouseDown,
+    onMouseEnter,
+    onMouseLeave,
+    role: "option",
+    className: isActive ? "ds-list-item-active" : "",
+    "aria-selected": isSelected,
+    style: wrapperStyles,
+    onClick,
+    "data-testid": "combobox-option",
+    children: /* @__PURE__ */ jsx(StyledItemContent, {
+      children: Render !== void 0 ? /* @__PURE__ */ jsx(Render, {
+        ...props
+      }) : /* @__PURE__ */ jsx(DSControlledCheckbox, {
+        disabled,
+        checked: isSelected,
+        onMouseDown,
+        name: label,
+        label,
+        onChange: noop,
+        tabIndex,
+        wrapLabel: true,
+        device: "desktop"
+      })
+    })
+  });
+};
+MultiMenuItem.propTypes = itemProps;
+MultiMenuItem.displayName = "MultiMenuItem";
+const MultiMenuItemWithSchema = describe(MultiMenuItem);
+MultiMenuItemWithSchema.propTypes = itemProps;
+export {
+  MultiMenuItem,
+  MultiMenuItemWithSchema
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/MultiMenuItem/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { DSControlledCheckbox } from '@elliemae/ds-form-checkbox';\nimport { DSMenuItemT, defaultMultiProps, itemProps } from '../../react-desc-prop-types';\nimport { StyledGlobalMenuItemWrapper, StyledItemContent } from '../styled';\n\nconst noop = () => null;\n\nconst MultiMenuItem: React.ComponentType<DSMenuItemT.MultiProps> = (props) => {\n  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultMultiProps);\n\n  useValidateTypescriptPropTypes(propsWithDefault, itemProps);\n\n  const {\n    dsId,\n    label,\n    disabled,\n    isSelected,\n    isActive,\n    onClick,\n    innerRef,\n    onMouseEnter,\n    onMouseLeave,\n    onMouseDown,\n    wrapperStyles,\n    tabIndex,\n    render: Render,\n  } = propsWithDefault;\n\n  return (\n    <StyledGlobalMenuItemWrapper\n      id={dsId}\n      disabled={disabled}\n      isActive={isActive}\n      isSelected={isSelected}\n      ref={innerRef}\n      onMouseDown={onMouseDown}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n      role=\"option\"\n      className={isActive ? 'ds-list-item-active' : ''}\n      aria-selected={isSelected}\n      style={wrapperStyles}\n      onClick={onClick}\n      data-testid=\"combobox-option\"\n    >\n      <StyledItemContent>\n        {Render !== undefined ? (\n          <Render {...props} />\n        ) : (\n          <DSControlledCheckbox\n            disabled={disabled}\n            checked={isSelected}\n            onMouseDown={onMouseDown}\n            name={label}\n            label={label}\n            onChange={noop}\n            tabIndex={tabIndex}\n            wrapLabel\n            device=\"desktop\"\n          />\n        )}\n      </StyledItemContent>\n    </StyledGlobalMenuItemWrapper>\n  );\n};\n\nMultiMenuItem.propTypes = itemProps;\nMultiMenuItem.displayName = 'MultiMenuItem';\nconst MultiMenuItemWithSchema = describe(MultiMenuItem);\nMultiMenuItemWithSchema.propTypes = itemProps;\n\nexport { MultiMenuItem, MultiMenuItemWithSchema };\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAS,UAAU,8BAA8B,sCAAsC;AACvF,SAAS,4BAA4B;AACrC,SAAsB,mBAAmB,iBAAiB;AAC1D,SAAS,6BAA6B,yBAAyB;AAE/D,MAAM,OAAO,MAAM;AAEnB,MAAM,gBAA6D,CAAC,UAAU;AAC5E,QAAM,mBAAmB,6BAA6B,OAAO,iBAAiB;AAE9E,iCAA+B,kBAAkB,SAAS;AAE1D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,EACV,IAAI;AAEJ,SACE,oBAAC;AAAA,IACC,IAAI;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,MAAK;AAAA,IACL,WAAW,WAAW,wBAAwB;AAAA,IAC9C,iBAAe;AAAA,IACf,OAAO;AAAA,IACP;AAAA,IACA,eAAY;AAAA,IAEZ,8BAAC;AAAA,MACE,qBAAW,SACV,oBAAC;AAAA,QAAQ,GAAG;AAAA,OAAO,IAEnB,oBAAC;AAAA,QACC;AAAA,QACA,SAAS;AAAA,QACT;AAAA,QACA,MAAM;AAAA,QACN;AAAA,QACA,UAAU;AAAA,QACV;AAAA,QACA,WAAS;AAAA,QACT,QAAO;AAAA,OACT;AAAA,KAEJ;AAAA,GACF;AAEJ;AAEA,cAAc,YAAY;AAC1B,cAAc,cAAc;AAC5B,MAAM,0BAA0B,SAAS,aAAa;AACtD,wBAAwB,YAAY;",
+  "names": []
+}

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

@@ -0,0 +1,32 @@
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import { Grid } from "@elliemae/ds-grid";
+import { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from "@elliemae/ds-utilities";
+import { defaultSectionProps, itemProps } from "../../react-desc-prop-types";
+import { StyledSectionWrapper, StyledGroupLabel } from "../styled";
+const Section = (props) => {
+  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultSectionProps);
+  useValidateTypescriptPropTypes(propsWithDefault, itemProps);
+  const { label, wrapperStyles, innerRef, render: Render } = props;
+  return /* @__PURE__ */ jsx(StyledSectionWrapper, {
+    style: wrapperStyles,
+    ref: innerRef,
+    role: "presentation",
+    children: Render !== void 0 ? /* @__PURE__ */ jsx(Render, {
+      ...props
+    }) : /* @__PURE__ */ jsx(Grid, {
+      children: /* @__PURE__ */ jsx(StyledGroupLabel, {
+        children: label
+      })
+    })
+  });
+};
+Section.propTypes = itemProps;
+Section.displayName = "Section";
+const SectionWithSchema = describe(Section);
+SectionWithSchema.propTypes = itemProps;
+export {
+  Section,
+  SectionWithSchema
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/Section/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { DSMenuItemT, defaultSectionProps, itemProps } from '../../react-desc-prop-types';\nimport { StyledSectionWrapper, StyledGroupLabel } from '../styled';\n\nconst Section: React.ComponentType<DSMenuItemT.SectionProps> = (props) => {\n  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultSectionProps);\n\n  useValidateTypescriptPropTypes(propsWithDefault, itemProps);\n\n  const { label, wrapperStyles, innerRef, render: Render } = props;\n\n  return (\n    <StyledSectionWrapper style={wrapperStyles} ref={innerRef} role=\"presentation\">\n      {Render !== undefined ? (\n        <Render {...props} />\n      ) : (\n        <Grid>\n          <StyledGroupLabel>{label}</StyledGroupLabel>\n        </Grid>\n      )}\n    </StyledSectionWrapper>\n  );\n};\n\nSection.propTypes = itemProps;\nSection.displayName = 'Section';\nconst SectionWithSchema = describe(Section);\nSectionWithSchema.propTypes = itemProps;\n\nexport { Section, SectionWithSchema };\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAS,YAAY;AACrB,SAAS,UAAU,8BAA8B,sCAAsC;AACvF,SAAsB,qBAAqB,iBAAiB;AAC5D,SAAS,sBAAsB,wBAAwB;AAEvD,MAAM,UAAyD,CAAC,UAAU;AACxE,QAAM,mBAAmB,6BAA6B,OAAO,mBAAmB;AAEhF,iCAA+B,kBAAkB,SAAS;AAE1D,QAAM,EAAE,OAAO,eAAe,UAAU,QAAQ,OAAO,IAAI;AAE3D,SACE,oBAAC;AAAA,IAAqB,OAAO;AAAA,IAAe,KAAK;AAAA,IAAU,MAAK;AAAA,IAC7D,qBAAW,SACV,oBAAC;AAAA,MAAQ,GAAG;AAAA,KAAO,IAEnB,oBAAC;AAAA,MACC,8BAAC;AAAA,QAAkB;AAAA,OAAM;AAAA,KAC3B;AAAA,GAEJ;AAEJ;AAEA,QAAQ,YAAY;AACpB,QAAQ,cAAc;AACtB,MAAM,oBAAoB,SAAS,OAAO;AAC1C,kBAAkB,YAAY;",
+  "names": []
+}

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

@@ -0,0 +1,27 @@
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from "@elliemae/ds-utilities";
+import { itemProps, defaultSeparatorProps } from "../../react-desc-prop-types";
+import { StyledSeparatorWrapper, StyledSeparator } from "../styled";
+const Separator = (props) => {
+  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultSeparatorProps);
+  useValidateTypescriptPropTypes(propsWithDefault, itemProps);
+  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, {})
+  });
+};
+Separator.propTypes = itemProps;
+Separator.displayName = "Separator";
+const SeparatorWithSchema = describe(Separator);
+SeparatorWithSchema.propTypes = itemProps;
+export {
+  Separator,
+  SeparatorWithSchema
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +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-utilities';\nimport { DSMenuItemT, itemProps, defaultSeparatorProps } from '../../react-desc-prop-types';\nimport { StyledSeparatorWrapper, StyledSeparator } from '../styled';\n\nconst Separator: React.ComponentType<DSMenuItemT.SeparatorProps> = (props) => {\n  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultSeparatorProps);\n\n  useValidateTypescriptPropTypes(propsWithDefault, itemProps);\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 = 'Separator';\nconst SeparatorWithSchema = describe(Separator);\nSeparatorWithSchema.propTypes = itemProps;\n\nexport { Separator, SeparatorWithSchema };\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAS,UAAU,8BAA8B,sCAAsC;AACvF,SAAsB,WAAW,6BAA6B;AAC9D,SAAS,wBAAwB,uBAAuB;AAExD,MAAM,YAA6D,CAAC,UAAU;AAC5E,QAAM,mBAAmB,6BAA6B,OAAO,qBAAqB;AAElF,iCAA+B,kBAAkB,SAAS;AAC1D,QAAM,EAAE,eAAe,UAAU,QAAQ,OAAO,IAAI;AACpD,SACE,oBAAC;AAAA,IAAuB,OAAO;AAAA,IAAe,KAAK;AAAA,IAAU,MAAK;AAAA,IAC/D,mBAAS,oBAAC;AAAA,MAAQ,GAAG;AAAA,KAAO,IAAK,oBAAC,mBAAgB;AAAA,GACrD;AAEJ;AAEA,UAAU,YAAY;AACtB,UAAU,cAAc;AACxB,MAAM,sBAAsB,SAAS,SAAS;AAC9C,oBAAoB,YAAY;",
+  "names": []
+}

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

@@ -0,0 +1,69 @@
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from "@elliemae/ds-utilities";
+import { Checkmark } from "@elliemae/ds-icons";
+import Grid from "@elliemae/ds-grid";
+import { defaultSingleProps, itemProps } from "../../react-desc-prop-types";
+import { StyledGlobalMenuItemWrapper, StyleMenuItemLabel } from "../styled";
+const SingleMenuItem = (props) => {
+  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultSingleProps);
+  useValidateTypescriptPropTypes(propsWithDefault, itemProps);
+  const {
+    dsId,
+    label,
+    isSelected,
+    onClick,
+    isActive,
+    innerRef,
+    onMouseDown,
+    onMouseEnter,
+    onMouseLeave,
+    wrapperStyles,
+    render: Render,
+    dataTestid,
+    disabled
+  } = propsWithDefault;
+  return /* @__PURE__ */ jsx(StyledGlobalMenuItemWrapper, {
+    "aria-selected": isSelected,
+    id: dsId,
+    role: "option",
+    isActive,
+    isSelected,
+    onClick,
+    ref: innerRef,
+    onMouseDown,
+    onMouseEnter,
+    onMouseLeave,
+    className: isActive ? "ds-list-item-active" : "",
+    style: wrapperStyles,
+    "data-testid": dataTestid,
+    disabled,
+    children: Render !== void 0 ? /* @__PURE__ */ jsx(Render, {
+      ...props
+    }) : /* @__PURE__ */ jsxs(Grid, {
+      cols: ["16px", "auto"],
+      minHeight: "16px",
+      gutter: "xxs",
+      alignItems: "center",
+      children: [
+        /* @__PURE__ */ jsx("div", {
+          children: isSelected && /* @__PURE__ */ jsx(Checkmark, {
+            size: "s",
+            color: ["brand-primary", "600"]
+          })
+        }),
+        /* @__PURE__ */ jsx(StyleMenuItemLabel, {
+          children: label
+        })
+      ]
+    })
+  });
+};
+SingleMenuItem.propTypes = itemProps;
+SingleMenuItem.displayName = "SingleMenuItem";
+const SingleMenuItemWithSchema = describe(SingleMenuItem);
+SingleMenuItemWithSchema.propTypes = itemProps;
+export {
+  SingleMenuItem
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/SingleMenuItem/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { Checkmark } from '@elliemae/ds-icons';\nimport Grid from '@elliemae/ds-grid';\nimport { DSMenuItemT, defaultSingleProps, itemProps } from '../../react-desc-prop-types';\nimport { StyledGlobalMenuItemWrapper, StyleMenuItemLabel } from '../styled';\n\nconst SingleMenuItem: React.ComponentType<DSMenuItemT.SingleProps> = (props) => {\n  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultSingleProps);\n\n  useValidateTypescriptPropTypes(propsWithDefault, itemProps);\n  const {\n    dsId,\n    label,\n    isSelected,\n    onClick,\n    isActive,\n    innerRef,\n    onMouseDown,\n    onMouseEnter,\n    onMouseLeave,\n    wrapperStyles,\n    render: Render,\n    dataTestid,\n    disabled,\n  } = propsWithDefault;\n\n  return (\n    <StyledGlobalMenuItemWrapper\n      aria-selected={isSelected}\n      id={dsId}\n      role=\"option\"\n      isActive={isActive}\n      isSelected={isSelected}\n      onClick={onClick}\n      ref={innerRef}\n      onMouseDown={onMouseDown}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n      className={isActive ? 'ds-list-item-active' : ''}\n      style={wrapperStyles}\n      data-testid={dataTestid}\n      disabled={disabled}\n    >\n      {Render !== undefined ? (\n        <Render {...props} />\n      ) : (\n        <Grid cols={['16px', 'auto']} minHeight=\"16px\" gutter=\"xxs\" alignItems=\"center\">\n          <div>{isSelected && <Checkmark size=\"s\" color={['brand-primary', '600']} />}</div>\n          <StyleMenuItemLabel>{label}</StyleMenuItemLabel>\n        </Grid>\n      )}\n    </StyledGlobalMenuItemWrapper>\n  );\n};\n\nSingleMenuItem.propTypes = itemProps;\nSingleMenuItem.displayName = 'SingleMenuItem';\nconst SingleMenuItemWithSchema = describe(SingleMenuItem);\nSingleMenuItemWithSchema.propTypes = itemProps;\n\nexport { SingleMenuItem };\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB;AACA,SAAS,UAAU,8BAA8B,sCAAsC;AACvF,SAAS,iBAAiB;AAC1B,OAAO,UAAU;AACjB,SAAsB,oBAAoB,iBAAiB;AAC3D,SAAS,6BAA6B,0BAA0B;AAEhE,MAAM,iBAA+D,CAAC,UAAU;AAC9E,QAAM,mBAAmB,6BAA6B,OAAO,kBAAkB;AAE/E,iCAA+B,kBAAkB,SAAS;AAC1D,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,SACE,oBAAC;AAAA,IACC,iBAAe;AAAA,IACf,IAAI;AAAA,IACJ,MAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,KAAK;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW,WAAW,wBAAwB;AAAA,IAC9C,OAAO;AAAA,IACP,eAAa;AAAA,IACb;AAAA,IAEC,qBAAW,SACV,oBAAC;AAAA,MAAQ,GAAG;AAAA,KAAO,IAEnB,qBAAC;AAAA,MAAK,MAAM,CAAC,QAAQ,MAAM;AAAA,MAAG,WAAU;AAAA,MAAO,QAAO;AAAA,MAAM,YAAW;AAAA,MACrE;AAAA,4BAAC;AAAA,UAAK,wBAAc,oBAAC;AAAA,YAAU,MAAK;AAAA,YAAI,OAAO,CAAC,iBAAiB,KAAK;AAAA,WAAG;AAAA,SAAG;AAAA,QAC5E,oBAAC;AAAA,UAAoB;AAAA,SAAM;AAAA;AAAA,KAC7B;AAAA,GAEJ;AAEJ;AAEA,eAAe,YAAY;AAC3B,eAAe,cAAc;AAC7B,MAAM,2BAA2B,SAAS,cAAc;AACxD,yBAAyB,YAAY;",
+  "names": []
+}

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

@@ -0,0 +1,138 @@
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { Grid } from "@elliemae/ds-grid";
+import { MoreOptionsVert, ChevronRight, Checkmark } from "@elliemae/ds-icons";
+import { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from "@elliemae/ds-utilities";
+import { defaultSingleWithSubmenuProps, itemProps } from "../../react-desc-prop-types";
+import {
+  StyledItemLabel,
+  StyledIconContainer,
+  StyledEllipsisButton,
+  StyledGlobalMenuItemWrapper,
+  StyledVerticalSeparator
+} from "../styled";
+import { useGetSubmenuHandlers } from "./useGetSubmenuHandlers";
+const SingleWithSubmenuItem = (props) => {
+  const propsWithDefault = useMemoMergePropsWithDefault(
+    props,
+    defaultSingleWithSubmenuProps
+  );
+  useValidateTypescriptPropTypes(propsWithDefault, itemProps);
+  const {
+    dsId,
+    label,
+    isActive,
+    disabled,
+    onClick,
+    isSelected,
+    isSubmenuOpened,
+    rightAddon,
+    innerRef,
+    wrapperStyles,
+    render: Render,
+    Dropdown,
+    dropdownProps: {
+      options,
+      openedSubmenus,
+      onSubmenuToggle,
+      selectedOptions,
+      onKeyDown,
+      onOptionClick,
+      onClickOutside,
+      minWidth,
+      maxHeight
+    }
+  } = propsWithDefault;
+  const [delayedIsOpened, setDelayedIsOpened] = useState(false);
+  useEffect(() => {
+    setTimeout(() => setDelayedIsOpened(isSubmenuOpened));
+  }, [isSubmenuOpened]);
+  const { onMouseEnterHandler, onMouseLeaveHandler, onEllipsisClick } = useGetSubmenuHandlers(propsWithDefault);
+  return /* @__PURE__ */ jsx(Dropdown, {
+    isOpened: delayedIsOpened,
+    options: options ?? [],
+    onOptionClick,
+    startPlacementPreference: "right-start",
+    placementOrderPreference: ["right-start", "right-end", "left-start", "left-end"],
+    selectedOptions,
+    openedSubmenus,
+    onSubmenuToggle,
+    onKeyDown,
+    onClickOutside,
+    customOffset: [-4, 1],
+    onMouseEnter: onMouseEnterHandler,
+    onMouseLeave: onMouseLeaveHandler,
+    wrapperStyles: { ...wrapperStyles, w: "100%" },
+    minWidth,
+    maxHeight,
+    as: "li",
+    role: "option",
+    "aria-selected": isSubmenuOpened,
+    "aria-describedby": `dropdownmenu-submenu-${dsId}`,
+    id: dsId,
+    children: /* @__PURE__ */ jsxs(StyledGlobalMenuItemWrapper, {
+      pr: 0,
+      onClick: !disabled ? onClick : void 0,
+      isSelected: isSubmenuOpened,
+      disabled,
+      isActive,
+      onMouseEnter: onMouseEnterHandler,
+      onMouseLeave: onMouseLeaveHandler,
+      ref: innerRef,
+      as: "div",
+      children: [
+        Render !== void 0 ? /* @__PURE__ */ jsx(Render, {
+          ...propsWithDefault
+        }) : /* @__PURE__ */ jsxs(Grid, {
+          cols: ["16px", "auto", "min-content"],
+          gutter: "xxs",
+          alignItems: "center",
+          children: [
+            /* @__PURE__ */ jsx("div", {
+              children: isSelected && /* @__PURE__ */ jsx(Checkmark, {
+                size: "s",
+                color: disabled ? ["neutral", "500"] : ["brand-primary", "600"]
+              })
+            }),
+            /* @__PURE__ */ jsx(StyledItemLabel, {
+              children: label
+            }),
+            /* @__PURE__ */ jsxs(StyledIconContainer, {
+              children: [
+                /* @__PURE__ */ jsx(StyledVerticalSeparator, {}),
+                rightAddon === "ellipsis" ? /* @__PURE__ */ jsx(StyledEllipsisButton, {
+                  tabIndex: -1,
+                  onClick: onEllipsisClick,
+                  disabled,
+                  children: /* @__PURE__ */ jsx(MoreOptionsVert, {
+                    className: "ds-dropdown-menu-v2-more-options",
+                    color: disabled ? ["neutral", "500"] : ["brand-primary", "600"],
+                    size: "s"
+                  })
+                }) : /* @__PURE__ */ jsx(ChevronRight, {
+                  color: disabled ? ["neutral", "500"] : ["brand-primary", "600"],
+                  size: "s"
+                })
+              ]
+            })
+          ]
+        }),
+        /* @__PURE__ */ jsx("span", {
+          id: `dropdownmenu-submenu-${dsId}`,
+          style: { display: "none" },
+          children: "submenu, to open this submenu press the Right Arrow key"
+        })
+      ]
+    })
+  });
+};
+SingleWithSubmenuItem.propTypes = itemProps;
+SingleWithSubmenuItem.displayName = "SingleWithSubmenuItem";
+const SingleWithSubmenuItemWithSchema = describe(SingleWithSubmenuItem);
+SingleWithSubmenuItemWithSchema.propTypes = itemProps;
+export {
+  SingleWithSubmenuItem,
+  SingleWithSubmenuItemWithSchema
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/SingleWithSubmenuItem/index.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useEffect, useState } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { MoreOptionsVert, ChevronRight, Checkmark } from '@elliemae/ds-icons';\nimport { describe, useMemoMergePropsWithDefault, useValidateTypescriptPropTypes } from '@elliemae/ds-utilities';\nimport { DSMenuItemT, defaultSingleWithSubmenuProps, itemProps } from '../../react-desc-prop-types';\nimport {\n  StyledItemLabel,\n  StyledIconContainer,\n  StyledEllipsisButton,\n  StyledGlobalMenuItemWrapper,\n  StyledVerticalSeparator,\n} from '../styled';\nimport { useGetSubmenuHandlers } from './useGetSubmenuHandlers';\n\nconst SingleWithSubmenuItem: React.ComponentType<DSMenuItemT.SingleWithSubmenuProps> = (props) => {\n  const propsWithDefault = useMemoMergePropsWithDefault<Required<DSMenuItemT.SingleWithSubmenuProps>>(\n    props,\n    defaultSingleWithSubmenuProps,\n  );\n\n  useValidateTypescriptPropTypes(propsWithDefault, itemProps);\n\n  const {\n    dsId,\n    label,\n    isActive,\n    disabled,\n    onClick,\n    isSelected,\n    isSubmenuOpened,\n    rightAddon,\n    innerRef,\n    wrapperStyles,\n    render: Render,\n    Dropdown,\n    dropdownProps: {\n      options,\n      openedSubmenus,\n      onSubmenuToggle,\n      selectedOptions,\n      onKeyDown,\n      onOptionClick,\n      onClickOutside,\n      minWidth,\n      maxHeight,\n    },\n  } = propsWithDefault;\n\n  // If we don't delay the opening of the poppers, the position will not be placed correctly\n  // That why we delay it for the next render using the useEffect hook\n  // TODO -- @carusox move this to utilities as a hook\n  const [delayedIsOpened, setDelayedIsOpened] = useState(false);\n\n  useEffect(() => {\n    setTimeout(() => setDelayedIsOpened(isSubmenuOpened));\n  }, [isSubmenuOpened]);\n\n  const { onMouseEnterHandler, onMouseLeaveHandler, onEllipsisClick } = useGetSubmenuHandlers(propsWithDefault);\n\n  return (\n    <Dropdown\n      isOpened={delayedIsOpened}\n      options={options ?? []}\n      onOptionClick={onOptionClick}\n      startPlacementPreference=\"right-start\"\n      placementOrderPreference={['right-start', 'right-end', 'left-start', 'left-end']}\n      selectedOptions={selectedOptions}\n      openedSubmenus={openedSubmenus}\n      onSubmenuToggle={onSubmenuToggle}\n      onKeyDown={onKeyDown}\n      onClickOutside={onClickOutside}\n      customOffset={[-4, 1]}\n      onMouseEnter={onMouseEnterHandler}\n      onMouseLeave={onMouseLeaveHandler}\n      wrapperStyles={{ ...wrapperStyles, w: '100%' }}\n      minWidth={minWidth}\n      maxHeight={maxHeight}\n      as=\"li\"\n      role=\"option\"\n      aria-selected={isSubmenuOpened}\n      aria-describedby={`dropdownmenu-submenu-${dsId}`}\n      id={dsId}\n    >\n      <StyledGlobalMenuItemWrapper\n        pr={0}\n        onClick={!disabled ? onClick : undefined}\n        isSelected={isSubmenuOpened}\n        disabled={disabled}\n        isActive={isActive}\n        onMouseEnter={onMouseEnterHandler}\n        onMouseLeave={onMouseLeaveHandler}\n        ref={innerRef}\n        as=\"div\"\n      >\n        {Render !== undefined ? (\n          <Render {...propsWithDefault} />\n        ) : (\n          <Grid cols={['16px', 'auto', 'min-content']} gutter=\"xxs\" alignItems=\"center\">\n            <div>\n              {isSelected && <Checkmark size=\"s\" color={disabled ? ['neutral', '500'] : ['brand-primary', '600']} />}\n            </div>\n            <StyledItemLabel>{label}</StyledItemLabel>\n            <StyledIconContainer>\n              <StyledVerticalSeparator />\n              {rightAddon === 'ellipsis' ? (\n                <StyledEllipsisButton tabIndex={-1} onClick={onEllipsisClick} disabled={disabled}>\n                  <MoreOptionsVert\n                    className=\"ds-dropdown-menu-v2-more-options\"\n                    color={disabled ? ['neutral', '500'] : ['brand-primary', '600']}\n                    size=\"s\"\n                  />\n                </StyledEllipsisButton>\n              ) : (\n                <ChevronRight color={disabled ? ['neutral', '500'] : ['brand-primary', '600']} size=\"s\" />\n              )}\n            </StyledIconContainer>\n          </Grid>\n        )}\n        <span id={`dropdownmenu-submenu-${dsId}`} style={{ display: 'none' }}>\n          submenu, to open this submenu press the Right Arrow key\n        </span>\n      </StyledGlobalMenuItemWrapper>\n    </Dropdown>\n  );\n};\n\nSingleWithSubmenuItem.propTypes = itemProps;\nSingleWithSubmenuItem.displayName = 'SingleWithSubmenuItem';\nconst SingleWithSubmenuItemWithSchema = describe(SingleWithSubmenuItem);\nSingleWithSubmenuItemWithSchema.propTypes = itemProps;\n\nexport { SingleWithSubmenuItem, SingleWithSubmenuItemWithSchema };\n"],
+  "mappings": "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",
+  "names": []
+}