@elliemae/ds-menu 2.2.1 → 2.3.0-alpha.4

package/cjs/DSMenu.js

@@ -0,0 +1,127 @@
+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 __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var DSMenu_exports = {};
+__export(DSMenu_exports, {
+  DSMenuWithSchema: () => DSMenuWithSchema,
+  Menu: () => Menu
+});
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_react_desc = require("react-desc");
+var import_lodash = require("lodash");
+var import_ds_classnames = require("@elliemae/ds-classnames");
+var import_web = require("react-spring/web");
+var import_hooks = require("@elliemae/ds-utilities/hooks");
+var import_system = require("@elliemae/ds-utilities/system");
+var import_FocusGroup = require("@elliemae/ds-shared/FocusGroup");
+var import_ds_hidden = require("@elliemae/ds-hidden");
+var import_MenuContext = require("./MenuContext");
+const RESPONSIVE_HEIHGT_MARGIN = 120;
+const blockName = "menu";
+const noop = () => {
+};
+const MenuComponent = (0, import_ds_classnames.aggregatedClasses)("div")(blockName, "", ({ menuComboBox, type }) => ({
+  "menu-combo-box": menuComboBox,
+  [`type-${type}`]: type
+}));
+const isChildOfType = (child, type) => child.type.name === type;
+const DSMenu = ({
+  containerProps = {},
+  innerRef,
+  as: MenuTag = import_web.animated.ul,
+  children = void 0,
+  onClickOutside = noop,
+  visible = void 0,
+  focusOnOpen = false,
+  maxOption = 0,
+  style = {},
+  minWidth = void 0,
+  maxWidth = void 0,
+  closeMenu,
+  responsiveHeight = false,
+  ...otherProps
+}) => {
+  const menuRef = (0, import_react.useRef)(null);
+  const { focusFirst } = (0, import_react.useContext)(import_FocusGroup.FocusGroupContext);
+  const { destroyed, ...hiddenProps } = (0, import_ds_hidden.useHiddenTransition)({ visible, style });
+  const nextChildren = (0, import_react.useMemo)(() => {
+    const forceLeftAddon = import_react.default.Children.toArray(children).some((child) => isChildOfType(child, "SelectionGroup") || isChildOfType(child, "MenuItemCheckbox") || isChildOfType(child, "MenuItemRadio") || child.props.leftAddon);
+    return import_react.default.Children.map(children, (child) => child && import_react.default.cloneElement(child, {
+      ...child.props,
+      noAddon: !forceLeftAddon ? true : void 0,
+      maxOption,
+      closeMenu
+    }));
+  }, [children]);
+  (0, import_hooks.useOnClickOutside)(menuRef, onClickOutside);
+  (0, import_react.useEffect)(() => {
+    if (focusOnOpen && visible) {
+      setTimeout(() => {
+        focusFirst();
+      }, 0);
+    }
+  }, [visible, focusOnOpen]);
+  return !hiddenProps.destroyed ? /* @__PURE__ */ import_react.default.createElement(import_MenuContext.MenuContext.Provider, {
+    value: { visible, closeMenu }
+  }, /* @__PURE__ */ import_react.default.createElement(MenuComponent, {
+    "data-testid": containerProps?.["data-testid"] ? containerProps["data-testid"] : "em-ds-menu",
+    ...containerProps,
+    as: MenuTag,
+    classProps: { ...otherProps.classProps || {}, type: otherProps.type },
+    innerRef: (0, import_system.mergeRefs)(innerRef, menuRef),
+    role: "menu",
+    ...(0, import_lodash.omit)(otherProps, ["scheduleUpdate"]),
+    ...hiddenProps
+  }, /* @__PURE__ */ import_react.default.createElement("div", {
+    className: "menu-component-internal-wrapper",
+    style: {
+      ...style,
+      minWidth,
+      maxWidth,
+      ...responsiveHeight ? {
+        overflowY: "scroll",
+        maxHeight: responsiveHeight ? `${window.innerHeight - RESPONSIVE_HEIHGT_MARGIN}px` : void 0
+      } : {}
+    }
+  }, nextChildren))) : null;
+};
+const Menu = (0, import_FocusGroup.focusGroupManagerHoc)(DSMenu, { loop: true });
+const props = {
+  containerProps: import_react_desc.PropTypes.object.description("Injected props to wrapper element of component"),
+  as: import_react_desc.PropTypes.element.description("Renders the menu with a specific html element"),
+  onClickOutside: import_react_desc.PropTypes.func.description("Handler when a user clicks outside the menu"),
+  visible: import_react_desc.PropTypes.bool.description("Whether the menu is visible or not"),
+  focusOnOpen: import_react_desc.PropTypes.bool.description("When set to true, it's going to focus the first item"),
+  minWidth: import_react_desc.PropTypes.number.description("Customize menu minWidth. Can be undefined or 'number'"),
+  maxWidth: import_react_desc.PropTypes.number.description("Customize menu maxWidth. Can be undefined or 'number'")
+};
+DSMenu.propTypes = props;
+const DSMenuWithSchema = (0, import_react_desc.describe)(DSMenu);
+DSMenuWithSchema.propTypes = props;
+module.exports = __toCommonJS(DSMenu_exports);
+//# sourceMappingURL=DSMenu.js.map

package/cjs/DSMenu.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/DSMenu.tsx", "../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React, { useContext, useEffect, useMemo, useRef } from 'react';\nimport { PropTypes, describe } from 'react-desc';\nimport { omit } from 'lodash';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport { animated } from 'react-spring/web';\nimport { useOnClickOutside } from '@elliemae/ds-utilities/hooks';\nimport { mergeRefs } from '@elliemae/ds-utilities/system';\nimport { focusGroupManagerHoc, FocusGroupContext } from '@elliemae/ds-shared/FocusGroup';\nimport { useHiddenTransition } from '@elliemae/ds-hidden';\nimport { MenuContext } from './MenuContext';\n\nconst RESPONSIVE_HEIHGT_MARGIN = 120;\n\nconst blockName = 'menu';\n\nconst noop = () => {};\n\nconst MenuComponent = aggregatedClasses('div')(blockName, '', ({ menuComboBox, type }) => ({\n  'menu-combo-box': menuComboBox,\n  [`type-${type}`]: type,\n}));\n\n/**\n * todo: -- IDEA -- each menu could have an overlay based on an overlay stack context so we can\n * capture the context of the clicks on very nested components\n */\n\nconst isChildOfType = (child, type) => child.type.name === type;\n\nconst DSMenu = ({\n  containerProps = {},\n  innerRef,\n  as: MenuTag = animated.ul,\n  children = undefined,\n  onClickOutside = noop,\n  // handlers from hidden\n  visible = undefined,\n  focusOnOpen = false,\n  maxOption = 0,\n  style = {},\n  minWidth = undefined,\n  maxWidth = undefined,\n  closeMenu,\n  responsiveHeight = false,\n  ...otherProps\n}) => {\n  const menuRef = useRef(null);\n  const { focusFirst } = useContext(FocusGroupContext);\n  const { destroyed, ...hiddenProps } = useHiddenTransition({ visible, style });\n\n  // force no addon to the children if the menu doesn't have any item with leftAddon like SelectionGroup\n  const nextChildren = useMemo(() => {\n    const forceLeftAddon = React.Children.toArray(children).some(\n      (child) =>\n        isChildOfType(child, 'SelectionGroup') ||\n        isChildOfType(child, 'MenuItemCheckbox') ||\n        isChildOfType(child, 'MenuItemRadio') ||\n        child.props.leftAddon,\n    );\n\n    return React.Children.map(\n      children,\n      (child) =>\n        child &&\n        React.cloneElement(child, {\n          ...child.props,\n          noAddon: !forceLeftAddon ? true : undefined,\n          maxOption,\n          closeMenu,\n        }),\n    );\n  }, [children]);\n\n  useOnClickOutside(menuRef, onClickOutside);\n\n  useEffect(() => {\n    if (focusOnOpen && visible) {\n      setTimeout(() => {\n        focusFirst();\n      }, 0);\n    }\n  }, [visible, focusOnOpen]);\n  // todo: find out a better approach to this\n  return !hiddenProps.destroyed ? (\n    <MenuContext.Provider value={{ visible, closeMenu }}>\n      <MenuComponent\n        data-testid={containerProps?.['data-testid'] ? containerProps['data-testid'] : 'em-ds-menu'}\n        {...containerProps}\n        as={MenuTag}\n        classProps={{ ...(otherProps.classProps || {}), type: otherProps.type }}\n        innerRef={mergeRefs(innerRef, menuRef)}\n        role=\"menu\"\n        {...omit(otherProps, ['scheduleUpdate'])}\n        {...hiddenProps}\n      >\n        {/* eslint-disable indent */}\n        <div\n          className=\"menu-component-internal-wrapper\"\n          style={{\n            ...style,\n            minWidth,\n            maxWidth,\n            ...(responsiveHeight\n              ? {\n                  overflowY: 'scroll',\n                  maxHeight: responsiveHeight ? `${window.innerHeight - RESPONSIVE_HEIHGT_MARGIN}px` : undefined,\n                }\n              : {}),\n          }}\n        >\n          {/* eslint-enable indent */}\n          {nextChildren}\n        </div>\n      </MenuComponent>\n    </MenuContext.Provider>\n  ) : null;\n};\n\nconst Menu = focusGroupManagerHoc(DSMenu, { loop: true });\n\nconst props = {\n  /** Injected props to wrapper element of component */\n  containerProps: PropTypes.object.description('Injected props to wrapper element of component'),\n  /** Renders the menu with a specific html element */\n  as: PropTypes.element.description('Renders the menu with a specific html element'),\n  /** Handler when a user clicks outside the menu */\n  onClickOutside: PropTypes.func.description('Handler when a user clicks outside the menu'),\n  /** Whether the menu is visible or not */\n  visible: PropTypes.bool.description('Whether the menu is visible or not'),\n  /** When set to true, it's going to focus the first item */\n  focusOnOpen: PropTypes.bool.description(\"When set to true, it's going to focus the first item\"),\n  /** Customize menu minWidth. Can be undefined or 'number' */\n  minWidth: PropTypes.number.description(\"Customize menu minWidth. Can be undefined or 'number'\"),\n  /** Customize menu maxWidth. Can be undefined or 'number' */\n  maxWidth: PropTypes.number.description(\"Customize menu maxWidth. Can be undefined or 'number'\"),\n};\n\nDSMenu.propTypes = props;\n\nconst DSMenuWithSchema = describe(DSMenu);\n\nDSMenuWithSchema.propTypes = props;\n\nexport { DSMenuWithSchema, Menu };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAA8D;AAC9D,wBAAoC;AACpC,oBAAqB;AACrB,2BAAkC;AAClC,iBAAyB;AACzB,mBAAkC;AAClC,oBAA0B;AAC1B,wBAAwD;AACxD,uBAAoC;AACpC,yBAA4B;AAE5B,MAAM,2BAA2B;AAEjC,MAAM,YAAY;AAElB,MAAM,OAAO,MAAM;AAAA;AAEnB,MAAM,gBAAgB,4CAAkB,OAAO,WAAW,IAAI,CAAC,EAAE,cAAc,WAAY;AAAA,EACzF,kBAAkB;AAAA,GACjB,QAAQ,SAAS;AAAA;AAQpB,MAAM,gBAAgB,CAAC,OAAO,SAAS,MAAM,KAAK,SAAS;AAE3D,MAAM,SAAS,CAAC;AAAA,EACd,iBAAiB;AAAA,EACjB;AAAA,EACA,IAAI,UAAU,oBAAS;AAAA,EACvB,WAAW;AAAA,EACX,iBAAiB;AAAA,EAEjB,UAAU;AAAA,EACV,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,WAAW;AAAA,EACX;AAAA,EACA,mBAAmB;AAAA,KAChB;AAAA,MACC;AACJ,QAAM,UAAU,yBAAO;AACvB,QAAM,EAAE,eAAe,6BAAW;AAClC,QAAM,EAAE,cAAc,gBAAgB,0CAAoB,EAAE,SAAS;AAGrE,QAAM,eAAe,0BAAQ,MAAM;AACjC,UAAM,iBAAiB,qBAAM,SAAS,QAAQ,UAAU,KACtD,CAAC,UACC,cAAc,OAAO,qBACrB,cAAc,OAAO,uBACrB,cAAc,OAAO,oBACrB,MAAM,MAAM;AAGhB,WAAO,qBAAM,SAAS,IACpB,UACA,CAAC,UACC,SACA,qBAAM,aAAa,OAAO;AAAA,SACrB,MAAM;AAAA,MACT,SAAS,CAAC,iBAAiB,OAAO;AAAA,MAClC;AAAA,MACA;AAAA;AAAA,KAGL,CAAC;AAEJ,sCAAkB,SAAS;AAE3B,8BAAU,MAAM;AACd,QAAI,eAAe,SAAS;AAC1B,iBAAW,MAAM;AACf;AAAA,SACC;AAAA;AAAA,KAEJ,CAAC,SAAS;AAEb,SAAO,CAAC,YAAY,YAClB,mDAAC,+BAAY,UAAb;AAAA,IAAsB,OAAO,EAAE,SAAS;AAAA,KACtC,mDAAC,eAAD;AAAA,IACE,eAAa,iBAAiB,iBAAiB,eAAe,iBAAiB;AAAA,OAC3E;AAAA,IACJ,IAAI;AAAA,IACJ,YAAY,KAAM,WAAW,cAAc,IAAK,MAAM,WAAW;AAAA,IACjE,UAAU,6BAAU,UAAU;AAAA,IAC9B,MAAK;AAAA,OACD,wBAAK,YAAY,CAAC;AAAA,OAClB;AAAA,KAGJ,mDAAC,OAAD;AAAA,IACE,WAAU;AAAA,IACV,OAAO;AAAA,SACF;AAAA,MACH;AAAA,MACA;AAAA,SACI,mBACA;AAAA,QACE,WAAW;AAAA,QACX,WAAW,mBAAmB,GAAG,OAAO,cAAc,+BAA+B;AAAA,UAEvF;AAAA;AAAA,KAIL,kBAIL;AAAA;AAGN,MAAM,OAAO,4CAAqB,QAAQ,EAAE,MAAM;AAElD,MAAM,QAAQ;AAAA,EAEZ,gBAAgB,4BAAU,OAAO,YAAY;AAAA,EAE7C,IAAI,4BAAU,QAAQ,YAAY;AAAA,EAElC,gBAAgB,4BAAU,KAAK,YAAY;AAAA,EAE3C,SAAS,4BAAU,KAAK,YAAY;AAAA,EAEpC,aAAa,4BAAU,KAAK,YAAY;AAAA,EAExC,UAAU,4BAAU,OAAO,YAAY;AAAA,EAEvC,UAAU,4BAAU,OAAO,YAAY;AAAA;AAGzC,OAAO,YAAY;AAEnB,MAAM,mBAAmB,gCAAS;AAElC,iBAAiB,YAAY;",
+  "names": []
+}

package/cjs/Menu.js

@@ -1,195 +1,60 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _jsx = require('@babel/runtime/helpers/jsx');
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
-require('core-js/modules/esnext.async-iterator.some.js');
-require('core-js/modules/esnext.iterator.constructor.js');
-require('core-js/modules/esnext.iterator.some.js');
-require('core-js/modules/esnext.async-iterator.constructor.js');
-require('core-js/modules/esnext.async-iterator.to-array.js');
-require('core-js/modules/esnext.iterator.to-array.js');
-require('core-js/modules/esnext.async-iterator.map.js');
-require('core-js/modules/esnext.iterator.map.js');
-require('core-js/modules/esnext.async-iterator.filter.js');
-require('core-js/modules/esnext.iterator.filter.js');
-require('core-js/modules/esnext.async-iterator.for-each.js');
-require('core-js/modules/esnext.iterator.for-each.js');
-var React = require('react');
-var reactDesc = require('react-desc');
-var lodash = require('lodash');
-var dsClassnames = require('@elliemae/ds-classnames');
-var web = require('react-spring/web');
-var hooks = require('@elliemae/ds-utilities/hooks');
-var system = require('@elliemae/ds-utilities/system');
-var FocusGroup = require('@elliemae/ds-shared/FocusGroup');
-var dsHidden = require('@elliemae/ds-hidden');
-var MenuItemRadio = require('./MenuItems/MenuItemRadio.js');
-var MenuItemCheckbox = require('./MenuItems/MenuItemCheckbox.js');
-var CheckboxGroup = require('./MenuItems/CheckboxGroup.js');
-var RadioGroup = require('./MenuItems/RadioGroup.js');
-var Separator = require('./MenuItems/Separator.js');
-var MenuItem = require('./MenuItems/MenuItem.js');
-var SubMenu = require('./MenuItems/SubMenu.js');
-var SearchableGroup = require('./MenuItems/SearchableGroup.js');
-var SelectionGroup = require('./MenuItems/SelectionGroup.js');
-var menuItemFactory = require('./MenuItems/menuItemFactory.js');
-var MenuContext = require('./MenuContext.js');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
-var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
-var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
-const _excluded = ["containerProps", "innerRef", "as", "children", "onClickOutside", "visible", "focusOnOpen", "maxOption", "style", "minWidth", "maxWidth", "closeMenu", "responsiveHeight"],
-      _excluded2 = ["destroyed"];
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-const RESPONSIVE_HEIHGT_MARGIN = 120;
-const blockName = 'menu';
-
-const noop = () => {};
-
-const MenuComponent = dsClassnames.aggregatedClasses('div')(blockName, '', _ref => {
-  let {
-    menuComboBox,
-    type
-  } = _ref;
-  return {
-    'menu-combo-box': menuComboBox,
-    ["type-".concat(type)]: type
+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 __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
   };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var Menu_exports = {};
+__export(Menu_exports, {
+  DSMenuWithSchema: () => import_DSMenu.DSMenuWithSchema,
+  Menu: () => import_DSMenu.Menu,
+  default: () => Menu_default,
+  menuItemFactory: () => import_menuItemFactory.menuItemFactory,
+  renderMenuItems: () => import_renderMenuItems.renderMenuItems
 });
-/**
- * todo: -- IDEA -- each menu could have an overlay based on an overlay stack context so we can
- * capture the context of the clicks on very nested components
- */
-
-const isChildOfType = (child, type) => child.type.name === type;
-
-function DSMenu(_ref2) {
-  let {
-    containerProps = {},
-    innerRef,
-    as: MenuTag = web.animated.ul,
-    children = undefined,
-    onClickOutside = noop,
-    // handlers from hidden
-    visible = undefined,
-    focusOnOpen = false,
-    maxOption = 0,
-    style = {},
-    minWidth = undefined,
-    maxWidth = undefined,
-    closeMenu,
-    responsiveHeight = false
-  } = _ref2,
-      otherProps = _objectWithoutProperties__default["default"](_ref2, _excluded);
-
-  const menuRef = React.useRef(null);
-  const {
-    focusFirst
-  } = React.useContext(FocusGroup.FocusGroupContext);
-
-  const _useHiddenTransition = dsHidden.useHiddenTransition({
-    visible,
-    style
-  }),
-        hiddenProps = _objectWithoutProperties__default["default"](_useHiddenTransition, _excluded2); // force no addon to the children if the menu doesn't have any item with leftAddon like SelectionGroup
-
-
-  const nextChildren = React.useMemo(() => {
-    const forceLeftAddon = React__default["default"].Children.toArray(children).some(child => isChildOfType(child, 'SelectionGroup') || isChildOfType(child, 'MenuItemCheckbox') || isChildOfType(child, 'MenuItemRadio') || child.props.leftAddon);
-    return React__default["default"].Children.map(children, child => child && /*#__PURE__*/React__default["default"].cloneElement(child, _objectSpread(_objectSpread({}, child.props), {}, {
-      noAddon: !forceLeftAddon ? true : undefined,
-      maxOption,
-      closeMenu
-    })));
-  }, [children]);
-  hooks.useOnClickOutside(menuRef, onClickOutside);
-  React.useEffect(() => {
-    if (focusOnOpen && visible) {
-      setTimeout(() => {
-        focusFirst();
-      }, 0);
-    }
-  }, [visible, focusOnOpen]); // todo: find out a better approach to this
-
-  return !hiddenProps.destroyed ? /*#__PURE__*/_jsx__default["default"](MenuContext.Provider, {
-    value: {
-      visible,
-      closeMenu
-    }
-  }, void 0, /*#__PURE__*/jsxRuntime.jsx(MenuComponent, _objectSpread(_objectSpread(_objectSpread(_objectSpread({
-    "data-testid": containerProps !== null && containerProps !== void 0 && containerProps['data-testid'] ? containerProps['data-testid'] : "em-ds-menu"
-  }, containerProps), {}, {
-    as: MenuTag,
-    classProps: _objectSpread(_objectSpread({}, otherProps.classProps || {}), {}, {
-      type: otherProps.type
-    }),
-    innerRef: system.mergeRefs(innerRef, menuRef),
-    role: "menu"
-  }, lodash.omit(otherProps, ['scheduleUpdate'])), hiddenProps), {}, {
-    children: /*#__PURE__*/_jsx__default["default"]("div", {
-      className: "menu-component-internal-wrapper",
-      style: _objectSpread(_objectSpread({}, style), {}, {
-        minWidth,
-        maxWidth
-      }, responsiveHeight ? {
-        overflowY: 'scroll',
-        maxHeight: responsiveHeight ? "".concat(window.innerHeight - RESPONSIVE_HEIHGT_MARGIN, "px") : undefined
-      } : {})
-    }, void 0, nextChildren)
-  }))) : null;
-}
-
-const Menu = FocusGroup.focusGroupManagerHoc(DSMenu, {
-  loop: true
-});
-const props = {
-  /** Injected props to wrapper element of component */
-  containerProps: reactDesc.PropTypes.object.description('Injected props to wrapper element of component'),
-
-  /** Renders the menu with a specific html element */
-  as: reactDesc.PropTypes.element.description('Renders the menu with a specific html element'),
-
-  /** Handler when a user clicks outside the menu */
-  onClickOutside: reactDesc.PropTypes.func.description('Handler when a user clicks outside the menu'),
-
-  /** Whether the menu is visible or not */
-  visible: reactDesc.PropTypes.bool.description('Whether the menu is visible or not'),
-
-  /** When set to true, it's going to focus the first item */
-  focusOnOpen: reactDesc.PropTypes.bool.description("When set to true, it's going to focus the first item"),
-
-  /** Customize menu minWidth. Can be undefined or 'number' */
-  minWidth: reactDesc.PropTypes.number.description("Customize menu minWidth. Can be undefined or 'number'"),
-
-  /** Customize menu maxWidth. Can be undefined or 'number' */
-  maxWidth: reactDesc.PropTypes.number.description("Customize menu maxWidth. Can be undefined or 'number'")
-};
-const DSMenuWithSchema = reactDesc.describe(DSMenu);
-DSMenuWithSchema.propTypes = props; // todo: add a handler to get this kind of exports for documentation
-
-Menu.Item = MenuItem["default"];
-Menu.ItemCheckbox = MenuItemCheckbox;
-Menu.ItemRadio = MenuItemRadio["default"];
-Menu.SubMenu = SubMenu["default"];
-Menu.Separator = Separator["default"];
-Menu.CheckboxGroup = CheckboxGroup["default"];
-Menu.RadioGroup = RadioGroup["default"];
-Menu.SearchableGroup = SearchableGroup["default"];
-Menu.SelectionGroup = SelectionGroup["default"];
-
-exports.menuItemFactory = menuItemFactory.menuItemFactory;
-exports.renderMenuItems = menuItemFactory.renderMenuItems;
-exports.DSMenuWithSchema = DSMenuWithSchema;
-exports.Menu = Menu;
-exports["default"] = Menu;
+var React = __toESM(require("react"));
+var import_MenuItemRadio = require("./MenuItems/MenuItemRadio");
+var import_MenuItemCheckbox = require("./MenuItems/MenuItemCheckbox");
+var import_CheckboxGroup = require("./MenuItems/CheckboxGroup");
+var import_RadioGroup = require("./MenuItems/RadioGroup");
+var import_Separator = require("./MenuItems/Separator");
+var import_MenuItem = require("./MenuItems/MenuItem");
+var import_SubMenu = require("./MenuItems/SubMenu");
+var import_SearchableGroup = require("./MenuItems/SearchableGroup");
+var import_SelectionGroup = require("./MenuItems/SelectionGroup");
+var import_menuItemFactory = require("./MenuItems/menuItemFactory");
+var import_renderMenuItems = require("./MenuItems/renderMenuItems");
+var import_DSMenu = require("./DSMenu");
+import_DSMenu.Menu.Item = import_MenuItem.MenuItem;
+import_DSMenu.Menu.ItemCheckbox = import_MenuItemCheckbox.MenuItemCheckbox;
+import_DSMenu.Menu.ItemRadio = import_MenuItemRadio.MenuItemRadio;
+import_DSMenu.Menu.SubMenu = import_SubMenu.SubMenu;
+import_DSMenu.Menu.Separator = import_Separator.MenuSeparator;
+import_DSMenu.Menu.CheckboxGroup = import_CheckboxGroup.CheckboxGroup;
+import_DSMenu.Menu.RadioGroup = import_RadioGroup.RadioGroup;
+import_DSMenu.Menu.SearchableGroup = import_SearchableGroup.SearchableGroup;
+import_DSMenu.Menu.SelectionGroup = import_SelectionGroup.SelectionGroup;
+var Menu_default = import_DSMenu.Menu;
+module.exports = __toCommonJS(Menu_exports);
+//# sourceMappingURL=Menu.js.map

package/cjs/Menu.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/Menu.tsx", "../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React from 'react';\nimport { MenuItemRadio } from './MenuItems/MenuItemRadio';\nimport { MenuItemCheckbox } from './MenuItems/MenuItemCheckbox';\nimport { CheckboxGroup } from './MenuItems/CheckboxGroup';\nimport { RadioGroup } from './MenuItems/RadioGroup';\nimport { MenuSeparator } from './MenuItems/Separator';\nimport { MenuItem } from './MenuItems/MenuItem';\nimport { SubMenu } from './MenuItems/SubMenu';\nimport { SearchableGroup } from './MenuItems/SearchableGroup';\nimport { SelectionGroup } from './MenuItems/SelectionGroup';\nimport { menuItemFactory } from './MenuItems/menuItemFactory';\nimport { renderMenuItems } from './MenuItems/renderMenuItems';\nimport { DSMenuWithSchema, Menu } from './DSMenu';\n\n\nMenu.Item = MenuItem;\nMenu.ItemCheckbox = MenuItemCheckbox;\nMenu.ItemRadio = MenuItemRadio;\nMenu.SubMenu = SubMenu;\nMenu.Separator = MenuSeparator;\nMenu.CheckboxGroup = CheckboxGroup;\nMenu.RadioGroup = RadioGroup;\nMenu.SearchableGroup = SearchableGroup;\nMenu.SelectionGroup = SelectionGroup;\n\nexport { menuItemFactory, renderMenuItems, DSMenuWithSchema, Menu };\nexport default Menu;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,2BAA8B;AAC9B,8BAAiC;AACjC,2BAA8B;AAC9B,wBAA2B;AAC3B,uBAA8B;AAC9B,sBAAyB;AACzB,qBAAwB;AACxB,6BAAgC;AAChC,4BAA+B;AAC/B,6BAAgC;AAChC,6BAAgC;AAChC,oBAAuC;AAGvC,mBAAK,OAAO;AACZ,mBAAK,eAAe;AACpB,mBAAK,YAAY;AACjB,mBAAK,UAAU;AACf,mBAAK,YAAY;AACjB,mBAAK,gBAAgB;AACrB,mBAAK,aAAa;AAClB,mBAAK,kBAAkB;AACvB,mBAAK,iBAAiB;AAGtB,IAAO,eAAQ;",
+  "names": []
+}

package/cjs/MenuCombobox.js

@@ -1,56 +1,70 @@
-'use strict';
-
-require('core-js/modules/esnext.async-iterator.filter.js');
-require('core-js/modules/esnext.iterator.constructor.js');
-require('core-js/modules/esnext.iterator.filter.js');
-require('core-js/modules/esnext.async-iterator.for-each.js');
-require('core-js/modules/esnext.iterator.for-each.js');
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var _jsx = require('@babel/runtime/helpers/jsx');
-var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
-require('react');
-var SearchableList = require('./MenuItems/SearchableList.js');
-var Menu = require('./Menu.js');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
-var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
-var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
-
-const _excluded = ["dropdownFilterOptions", "options", "onSelectMenuItem", "innerRef", "maxOptions", "loading"];
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-function MenuCombobox(_ref) {
-  let {
-    dropdownFilterOptions = {},
-    options = [],
-    onSelectMenuItem = () => null,
+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 __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var MenuCombobox_exports = {};
+__export(MenuCombobox_exports, {
+  default: () => MenuCombobox_default
+});
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_prop_types = __toESM(require("prop-types"));
+var import_SearchableList = require("./MenuItems/SearchableList");
+var import_DSMenu = require("./DSMenu");
+function MenuCombobox({
+  dropdownFilterOptions = {},
+  options = [],
+  onSelectMenuItem = () => null,
+  innerRef,
+  maxOptions = 10,
+  loading = false,
+  ...rest
+}) {
+  return /* @__PURE__ */ import_react.default.createElement(import_DSMenu.Menu, {
+    ...rest,
+    classProps: { menuComboBox: true },
     innerRef,
-    maxOptions = 10,
-    loading = false
-  } = _ref,
-      rest = _objectWithoutProperties__default["default"](_ref, _excluded);
-
-  return /*#__PURE__*/jsxRuntime.jsx(Menu.Menu, _objectSpread(_objectSpread({}, rest), {}, {
-    classProps: {
-      menuComboBox: true
-    },
-    innerRef: innerRef,
-    visible: true,
-    children: /*#__PURE__*/_jsx__default["default"](SearchableList["default"], {
-      appendTermInList: true,
-      extraListProps: dropdownFilterOptions,
-      items: options,
-      onSelectMenuItem: onSelectMenuItem,
-      maxOptions: maxOptions,
-      loading: loading
-    })
+    visible: true
+  }, /* @__PURE__ */ import_react.default.createElement(import_SearchableList.SearchableList, {
+    appendTermInList: true,
+    extraListProps: dropdownFilterOptions,
+    items: options,
+    onSelectMenuItem,
+    maxOptions,
+    loading
   }));
 }
-
-module.exports = MenuCombobox;
+MenuCombobox.propTypes = {
+  dropdownFilterOptions: import_prop_types.default.shape({}),
+  options: import_prop_types.default.arrayOf(import_prop_types.default.object),
+  onSelectMenuItem: import_prop_types.default.func,
+  innerRef: import_prop_types.default.oneOfType([import_prop_types.default.func, import_prop_types.default.object]),
+  maxOptions: import_prop_types.default.number,
+  loading: import_prop_types.default.bool
+};
+var MenuCombobox_default = MenuCombobox;
+module.exports = __toCommonJS(MenuCombobox_exports);
+//# sourceMappingURL=MenuCombobox.js.map

package/cjs/MenuCombobox.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/MenuCombobox.tsx", "../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { SearchableList } from './MenuItems/SearchableList';\nimport { Menu } from './DSMenu';\n\nfunction MenuCombobox({\n  dropdownFilterOptions = {},\n  options = [],\n  onSelectMenuItem = () => null,\n  innerRef,\n  maxOptions = 10,\n  loading = false,\n  ...rest\n}) {\n  return (\n    <Menu\n      {...rest}\n      classProps={{ menuComboBox: true }}\n      innerRef={innerRef}\n      visible\n    >\n      <SearchableList\n        appendTermInList\n        extraListProps={dropdownFilterOptions}\n        items={options}\n        onSelectMenuItem={onSelectMenuItem}\n        maxOptions={maxOptions}\n        loading={loading}\n      />\n    </Menu>\n  );\n}\n\nMenuCombobox.propTypes = {\n  /** Options */\n  dropdownFilterOptions: PropTypes.shape({}),\n  /** The option or menu items to render */\n  options: PropTypes.arrayOf(PropTypes.object),\n  /** Handler when a menu item is selected */\n  onSelectMenuItem: PropTypes.func,\n  /** Internal ref */\n  innerRef: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),\n  /** Max options to display in the list */\n  maxOptions: PropTypes.number,\n  /** Is loading */\n  loading: PropTypes.bool,\n};\n\nexport default MenuCombobox;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,wBAAsB;AACtB,4BAA+B;AAC/B,oBAAqB;AAErB,sBAAsB;AAAA,EACpB,wBAAwB;AAAA,EACxB,UAAU;AAAA,EACV,mBAAmB,MAAM;AAAA,EACzB;AAAA,EACA,aAAa;AAAA,EACb,UAAU;AAAA,KACP;AAAA,GACF;AACD,SACE,mDAAC,oBAAD;AAAA,OACM;AAAA,IACJ,YAAY,EAAE,cAAc;AAAA,IAC5B;AAAA,IACA,SAAO;AAAA,KAEP,mDAAC,sCAAD;AAAA,IACE,kBAAgB;AAAA,IAChB,gBAAgB;AAAA,IAChB,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA;AAAA;AAMR,aAAa,YAAY;AAAA,EAEvB,uBAAuB,0BAAU,MAAM;AAAA,EAEvC,SAAS,0BAAU,QAAQ,0BAAU;AAAA,EAErC,kBAAkB,0BAAU;AAAA,EAE5B,UAAU,0BAAU,UAAU,CAAC,0BAAU,MAAM,0BAAU;AAAA,EAEzD,YAAY,0BAAU;AAAA,EAEtB,SAAS,0BAAU;AAAA;AAGrB,IAAO,uBAAQ;",
+  "names": []
+}

package/cjs/MenuContext.js

@@ -1,11 +1,38 @@
-'use strict';
-
-var React = require('react');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
-
-var MenuContext = /*#__PURE__*/React__default["default"].createContext();
-
-module.exports = MenuContext;
+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 __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var MenuContext_exports = {};
+__export(MenuContext_exports, {
+  MenuContext: () => MenuContext,
+  default: () => MenuContext_default
+});
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+const MenuContext = import_react.default.createContext();
+var MenuContext_default = MenuContext;
+module.exports = __toCommonJS(MenuContext_exports);
+//# sourceMappingURL=MenuContext.js.map

package/cjs/MenuContext.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/MenuContext.tsx", "../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React from 'react';\n\nconst MenuContext = React.createContext();\nexport { MenuContext };\nexport default MenuContext;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAElB,MAAM,cAAc,qBAAM;AAE1B,IAAO,sBAAQ;",
+  "names": []
+}