@elliemae/ds-mobile 2.2.0-alpha.3 → 3.0.0-next.0

package/cjs/MobileCard/props.js

@@ -1,50 +1,62 @@
-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 props_exports = {};
-__export(props_exports, {
-  cardPropsTypes: () => cardPropsTypes
-});
-var React = __toESM(require("react"));
-var import_react_desc = __toESM(require("react-desc"));
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var reactDesc = require('react-desc');
+
 const cardPropsTypes = {
-  height: import_react_desc.PropTypes.oneOf(["s", "m"]).description("card height"),
-  children: import_react_desc.PropTypes.string.description("Defines mobile card title").isRequired,
-  expandable: import_react_desc.PropTypes.bool.description("Wheter if the card is expandable or not"),
-  expandedContent: import_react_desc.PropTypes.element.description("content to display in expand card section"),
-  leftAddOn: import_react_desc.PropTypes.element.description("Icon to the left of the card. Size is adjusted automatically."),
-  leftProp: import_react_desc.PropTypes.element.description("Pass an element to render left. For example a Button with an icon"),
-  rightProp: import_react_desc.PropTypes.arrayOf(import_react_desc.PropTypes.element).description("Pass an array of 1 or 2 elements to render right. For example a Button with an icon"),
-  subText: import_react_desc.PropTypes.arrayOf(import_react_desc.PropTypes.string).description("Pass an array of 1 or 2 strings"),
-  subIcons: import_react_desc.PropTypes.element.description("SubIcons component"),
-  details: import_react_desc.PropTypes.arrayOf(import_react_desc.PropTypes.string).description("Pass an array of 1, 2 or 3 strings"),
-  theme: import_react_desc.PropTypes.object.description("").isRequired,
-  value: import_react_desc.PropTypes.number.description(""),
-  cardContent: import_react_desc.PropTypes.node.description("JSX content for the card")
+  /**
+   * card height
+   */
+  height: reactDesc.PropTypes.oneOf(['s', 'm']).description('card height'),
+
+  /**
+   * Defines mobile card title
+   */
+  children: reactDesc.PropTypes.string.description('Defines mobile card title').isRequired,
+
+  /**
+   * Wheter if the card is expandable or not
+   */
+  expandable: reactDesc.PropTypes.bool.description('Wheter if the card is expandable or not'),
+
+  /**
+   * content to display in expand card section
+   */
+  expandedContent: reactDesc.PropTypes.element.description('content to display in expand card section'),
+
+  /**
+   * Icon to the left of the card. Size is adjusted automatically.
+   */
+  leftAddOn: reactDesc.PropTypes.element.description('Icon to the left of the card. Size is adjusted automatically.'),
+
+  /**
+   * Pass an element to render left. For example a Button with an icon
+   */
+  leftProp: reactDesc.PropTypes.element.description('Pass an element to render left. For example a Button with an icon'),
+
+  /**
+   * Pass an array of 1 or 2 elements to render right. For example a Button with an icon
+   */
+  rightProp: reactDesc.PropTypes.arrayOf(reactDesc.PropTypes.element).description('Pass an array of 1 or 2 elements to render right. For example a Button with an icon'),
+
+  /**
+   * Pass an array of 1 or 2 strings
+   */
+  subText: reactDesc.PropTypes.arrayOf(reactDesc.PropTypes.string).description('Pass an array of 1 or 2 strings'),
+
+  /**
+   * SubIcons component
+   */
+  subIcons: reactDesc.PropTypes.element.description('SubIcons component'),
+
+  /**
+   * Pass an array of 1, 2 or 3 strings
+   */
+  details: reactDesc.PropTypes.arrayOf(reactDesc.PropTypes.string).description('Pass an array of 1, 2 or 3 strings'),
+  theme: reactDesc.PropTypes.object.description('').isRequired,
+  value: reactDesc.PropTypes.number.description(''),
+  cardContent: reactDesc.PropTypes.node.description('JSX content for the card')
 };
-module.exports = __toCommonJS(props_exports);
-//# sourceMappingURL=props.js.map
+
+exports.cardPropsTypes = cardPropsTypes;

package/cjs/MobileCard/useHeight.js

@@ -1,52 +1,27 @@
-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 useHeight_exports = {};
-__export(useHeight_exports, {
-  useHeight: () => useHeight
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_polished = __toESM(require("polished"));
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+require('core-js/modules/web.dom-collections.iterator.js');
+var React = require('react');
+var polished = require('polished');
+
 function getCurrentFont() {
-  return Number(window.getComputedStyle(document.querySelector(":root")).getPropertyValue("font-size").match(/\d+/)[0]);
+  return Number(window.getComputedStyle(document.querySelector(':root')).getPropertyValue('font-size').match(/\d+/)[0]);
 }
+
 function useHeight(ref) {
-  const [height, setHeight] = (0, import_react.useState)("0rem");
-  const [currentFont, setCurrentFont] = (0, import_react.useState)(13);
-  (0, import_react.useEffect)(() => {
+  const [height, setHeight] = React.useState('0rem');
+  const [currentFont, setCurrentFont] = React.useState(13);
+  React.useEffect(() => {
     setCurrentFont(getCurrentFont());
   }, []);
-  (0, import_react.useEffect)(() => {
-    if (ref.current && height !== (0, import_polished.rem)(ref.current.clientHeight, currentFont)) {
-      setHeight((0, import_polished.rem)(ref.current.clientHeight, currentFont));
+  React.useEffect(() => {
+    if (ref.current && height !== polished.rem(ref.current.clientHeight, currentFont)) {
+      setHeight(polished.rem(ref.current.clientHeight, currentFont));
     }
   }, [ref.current, currentFont]);
   return height;
 }
-module.exports = __toCommonJS(useHeight_exports);
-//# sourceMappingURL=useHeight.js.map
+
+exports.useHeight = useHeight;

package/cjs/MobileContextMenu/MobileContextMenu.js

@@ -1,202 +1,198 @@
-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 MobileContextMenu_exports = {};
-__export(MobileContextMenu_exports, {
-  DSMobileContextMenu: () => DSMobileContextMenu,
-  DSMobileContextMenuWithSchema: () => DSMobileContextMenuWithSchema
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_lodash = __toESM(require("lodash"));
-var import_react_desc = __toESM(require("react-desc"));
-var import_styled_components = __toESM(require("styled-components"));
-var import_ds_grid = __toESM(require("@elliemae/ds-grid"));
-var import_ds_backdrop = __toESM(require("@elliemae/ds-backdrop"));
-var import_ds_system = __toESM(require("@elliemae/ds-system"));
-var import_Group = __toESM(require("@elliemae/ds-shared/GroupContext/Group"));
-var import_MobileContextMenuGroup = __toESM(require("./MobileContextMenuGroup"));
-const StyledContainer = (0, import_styled_components.default)(import_ds_grid.Grid)`
-  background: ${(props2) => props2.theme.colors.neutral["000"]};
-  z-index: ${(props2) => props2.zIndex};
-  width: ${(props2) => `calc(100% - ${props2.theme.space.xs})`};
-  position: fixed;
-  bottom: 0;
-  left: ${(props2) => props2.theme.space.xxs};
-  max-height: 90vh;
-  border-top-left-radius: 5px;
-  border-top-right-radius: 5px;
-  box-shadow: 0 0px 24px 0 rgba(0, 0, 0, 0.5), 0 0px 11px 0 rgba(0, 0, 0, 0.5);
-`;
-const StyledTitle = (0, import_styled_components.default)(import_ds_grid.Grid)`
-  font-size: 16px;
-  font-weight: ${(props2) => props2.theme.fontWeights.semibold};
-  color: ${(props2) => props2.theme.colors.neutral["000"]};
-  ${(0, import_ds_system.truncate)()}
-
-  & > span {
-    height: 20px;
-    width: 20px;
-  }
-
-  & > span > svg,
-  svg:not([fill]) {
-    height: 20px;
-    width: 20px;
-    fill: ${(props2) => props2.theme.colors.neutral["000"]};
-  }
-`;
-const HeaderContainer = (0, import_styled_components.default)(import_ds_grid.Grid)`
-  border-top-left-radius: 5px;
-  border-top-right-radius: 5px;
-  background: ${(props2) => props2.theme.colors.brand["600"]};
-`;
-const isArr = (prop) => Array.isArray(prop);
-const DSMobileContextMenu = (0, import_ds_system.withTheme)(({
-  open = false,
-  title = "",
-  multiple = false,
-  singleSelect = false,
-  onChange = import_lodash.noop,
-  onClickOutside = import_lodash.noop,
-  children,
-  theme,
-  backdropZIndex,
-  zIndex = 1,
-  dataTestid = "mobile-context-menu",
-  buttonFooter = null,
-  onApply = import_lodash.noop,
-  selecteds: initSelecteds
-}) => {
-  const [selectedItems, setSelectedItems] = (0, import_react.useState)([]);
-  const trueSelected = (0, import_react.useMemo)(() => initSelecteds !== void 0 ? initSelecteds : [...selectedItems], [initSelecteds, selectedItems]);
-  const containerRef = (0, import_react.useRef)(null);
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('core-js/modules/web.dom-collections.iterator.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.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 React = require('react');
+var lodash = require('lodash');
+var reactDesc = require('react-desc');
+var styled = require('styled-components');
+var dsGrid = require('@elliemae/ds-grid');
+var Backdrop = require('@elliemae/ds-backdrop');
+var dsSystem = require('@elliemae/ds-system');
+var Group = require('@elliemae/ds-shared/GroupContext/Group');
+var MobileContextMenuGroup = require('./MobileContextMenuGroup.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 React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+var Group__default = /*#__PURE__*/_interopDefaultLegacy(Group);
+
+var _ContextMenuGroup;
+
+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 StyledContainer = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
+  componentId: "sc-15ys5tq-0"
+})(["background:", ";z-index:", ";width:", ";position:fixed;bottom:0;left:", ";max-height:90vh;border-top-left-radius:5px;border-top-right-radius:5px;box-shadow:0 0px 24px 0 rgba(0,0,0,0.5),0 0px 11px 0 rgba(0,0,0,0.5);"], props => props.theme.colors.neutral['000'], props => props.zIndex, props => "calc(100% - ".concat(props.theme.space.xs, ")"), props => props.theme.space.xxs);
+const StyledTitle = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
+  componentId: "sc-15ys5tq-1"
+})(["font-size:16px;font-weight:", ";color:", ";", " & > span{height:20px;width:20px;}& > span > svg,svg:not([fill]){height:20px;width:20px;fill:", ";}"], props => props.theme.fontWeights.semibold, props => props.theme.colors.neutral['000'], dsSystem.truncate(), props => props.theme.colors.neutral['000']);
+const HeaderContainer = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
+  componentId: "sc-15ys5tq-2"
+})(["border-top-left-radius:5px;border-top-right-radius:5px;background:", ";"], props => props.theme.colors.brand['600']);
+
+const isArr = prop => Array.isArray(prop);
+
+const DSMobileContextMenu = dsSystem.withTheme(_ref => {
+  let {
+    open = false,
+    title = '',
+    multiple = false,
+    singleSelect = false,
+    onChange = lodash.noop,
+    onClickOutside = lodash.noop,
+    children,
+    theme,
+    backdropZIndex,
+    zIndex = 1,
+    dataTestid = 'mobile-context-menu',
+    buttonFooter = null,
+    onApply = lodash.noop,
+    selecteds: initSelecteds
+  } = _ref;
+  const [selectedItems, setSelectedItems] = React.useState([]);
+  const trueSelected = React.useMemo(() => initSelecteds !== undefined ? initSelecteds : [...selectedItems], [initSelecteds, selectedItems]);
+  const containerRef = React.useRef(null);
+
   const handleChange = (value, childProps, event) => {
     onChange(value, childProps, event);
-    if (initSelecteds === void 0) {
-      if (multiple)
-        setSelectedItems([...value]);
-      else if (singleSelect)
-        setSelectedItems(value);
+
+    if (initSelecteds === undefined) {
+      if (multiple) setSelectedItems([...value]);else if (singleSelect) setSelectedItems(value);
     }
   };
-  const handleApply = function(e) {
-    if (this.onClick)
-      this.onClick(e);
+
+  const handleApply = function (e) {
+    if (this.onClick) this.onClick(e);
     onApply(e, selectedItems);
   };
+
   const rows = [theme.space.s, 1];
-  if (buttonFooter)
-    rows.push("56px");
-  if (!open)
-    return null;
-  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_ds_backdrop.DSBackdrop, {
-    type: "cover",
-    zIndex: backdropZIndex,
-    onClick: (e) => {
-      e.stopPropagation();
-      onClickOutside(e);
-    }
-  }), /* @__PURE__ */ import_react.default.createElement(StyledContainer, {
-    zIndex,
-    rows,
-    ref: containerRef,
-    "data-testid": "ds-mobile-context-menu"
-  }, /* @__PURE__ */ import_react.default.createElement(HeaderContainer, {
-    justifyContent: "center",
-    alignItems: "center",
-    pl: "xs",
-    pr: "xs"
-  }, /* @__PURE__ */ import_react.default.createElement(StyledTitle, {
-    alignItems: "center",
-    gutter: "xxs",
-    cols: Array(isArr(title) ? title.length : 1).fill("auto")
-  }, title)), /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-    style: { overflow: "hidden" }
-  }, /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-    style: { overflow: "auto" }
-  }, /* @__PURE__ */ import_react.default.createElement(import_Group.default, {
-    activeValue: trueSelected,
-    multiple,
-    onChange: handleChange
-  }, import_react.default.Children.map(children, (child, ii) => {
-    const isGroup = child.type === (/* @__PURE__ */ import_react.default.createElement(import_MobileContextMenuGroup.DSMobileContextMenuGroup, null)).type || child.type?.name === import_MobileContextMenuGroup.DSMobileContextMenuGroup.componentType || child.type === import_MobileContextMenuGroup.DSMobileContextMenuGroup.type;
-    const { onClick = import_lodash.noop } = child.props;
-    const value = ii;
-    let isSelected;
-    if (singleSelect)
-      isSelected = trueSelected === value;
-    else if (multiple)
-      isSelected = trueSelected.includes(value);
-    return import_react.default.cloneElement(child, {
-      value,
-      key: `cm.${ii}`,
-      isMulti: multiple,
-      singleSelect,
-      isSelected,
-      onClick: !isGroup ? (e) => onClick(e, child.props) : null,
-      selectedItems: isGroup ? trueSelected : null
-    });
-  })))), buttonFooter && /* @__PURE__ */ import_react.default.createElement(import_ds_grid.Grid, {
-    pl: "xs",
-    pr: "xs",
-    alignItems: "center"
-  }, import_react.default.cloneElement(buttonFooter, {
-    ...buttonFooter.props,
-    containerProps: {
-      "data-testid": `${dataTestid}--btn`
-    },
-    buttonType: "primary",
-    size: "l",
-    onClick: handleApply.bind(buttonFooter.props)
-  }))));
+  if (buttonFooter) rows.push('56px');
+  if (!open) return null;
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/_jsx__default["default"](Backdrop.DSBackdrop, {
+      type: "cover",
+      zIndex: backdropZIndex,
+      onClick: e => {
+        // PUI-4481 prevent click on elements below backdrop
+        e.stopPropagation();
+        onClickOutside(e);
+      }
+    }), /*#__PURE__*/jsxRuntime.jsxs(StyledContainer, {
+      zIndex: zIndex,
+      rows: rows,
+      ref: containerRef,
+      "data-testid": "ds-mobile-context-menu",
+      children: [/*#__PURE__*/_jsx__default["default"](HeaderContainer, {
+        justifyContent: "center",
+        alignItems: "center",
+        pl: "xs",
+        pr: "xs"
+      }, void 0, /*#__PURE__*/_jsx__default["default"](StyledTitle, {
+        alignItems: "center",
+        gutter: "xxs",
+        cols: Array(isArr(title) ? title.length : 1).fill('auto')
+      }, void 0, title)), /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
+        style: {
+          overflow: 'hidden'
+        }
+      }, void 0, /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
+        style: {
+          overflow: 'auto'
+        }
+      }, void 0, /*#__PURE__*/_jsx__default["default"](Group__default["default"], {
+        activeValue: trueSelected,
+        multiple: multiple,
+        onChange: handleChange
+      }, void 0, React__default["default"].Children.map(children, (child, ii) => {
+        var _child$type;
+
+        const isGroup = child.type === (_ContextMenuGroup || (_ContextMenuGroup = /*#__PURE__*/_jsx__default["default"](MobileContextMenuGroup.DSMobileContextMenuGroup, {}))).type || ((_child$type = child.type) === null || _child$type === void 0 ? void 0 : _child$type.name) === MobileContextMenuGroup.DSMobileContextMenuGroup.componentType || child.type === MobileContextMenuGroup.DSMobileContextMenuGroup.type;
+        const {
+          onClick = lodash.noop
+        } = child.props;
+        const value = ii;
+        let isSelected;
+        if (singleSelect) isSelected = trueSelected === value;else if (multiple) isSelected = trueSelected.includes(value);
+        return /*#__PURE__*/React__default["default"].cloneElement(child, {
+          value,
+          key: "cm.".concat(ii),
+          isMulti: multiple,
+          singleSelect,
+          isSelected,
+          onClick: !isGroup ? e => onClick(e, child.props) : null,
+          selectedItems: isGroup ? trueSelected : null
+        });
+      })))), buttonFooter && /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
+        pl: "xs",
+        pr: "xs",
+        alignItems: "center"
+      }, void 0, /*#__PURE__*/React__default["default"].cloneElement(buttonFooter, _objectSpread(_objectSpread({}, buttonFooter.props), {}, {
+        containerProps: {
+          'data-testid': "".concat(dataTestid, "--btn")
+        },
+        buttonType: 'primary',
+        size: 'l',
+        onClick: handleApply.bind(buttonFooter.props)
+      })))]
+    })]
+  });
 });
 const props = {
-  open: import_react_desc.PropTypes.bool.description("toggle open the menu"),
-  title: import_react_desc.PropTypes.oneOfType([
-    import_react_desc.PropTypes.string,
-    import_react_desc.PropTypes.arrayOf(import_react_desc.PropTypes.oneOfType([import_react_desc.PropTypes.string, import_react_desc.PropTypes.node]))
-  ]).description("context menu title"),
-  onChange: import_react_desc.PropTypes.func.description("change handler for selectable context menu"),
-  multiple: import_react_desc.PropTypes.bool.description("multi select"),
-  onClickOutside: import_react_desc.PropTypes.func.description("click outside callback handler"),
-  children: import_react_desc.PropTypes.arrayOf(import_react_desc.PropTypes.element).description("array of mobile context menu items"),
-  backdropZIndex: import_react_desc.PropTypes.number.description("z index for overlay div"),
-  zIndex: import_react_desc.PropTypes.number.description("z index for menu container"),
-  dataTestid: import_react_desc.PropTypes.string.description("for e2e tests"),
-  buttonFooter: import_react_desc.PropTypes.element.description("bottom button"),
-  onApply: import_react_desc.PropTypes.func.description("callback"),
-  selecteds: import_react_desc.PropTypes.oneOfType([
-    import_react_desc.PropTypes.arrayOf(import_react_desc.PropTypes.oneOfType([import_react_desc.PropTypes.string, import_react_desc.PropTypes.number])),
-    import_react_desc.PropTypes.number
-  ]).description("selected elements for multi and single select")
+  /** toggle open the menu */
+  open: reactDesc.PropTypes.bool.description('toggle open the menu'),
+
+  /** context menu title  */
+  title: reactDesc.PropTypes.oneOfType([reactDesc.PropTypes.string, reactDesc.PropTypes.arrayOf(reactDesc.PropTypes.oneOfType([reactDesc.PropTypes.string, reactDesc.PropTypes.node]))]).description('context menu title'),
+
+  /** change handler for selectable context menu  */
+  onChange: reactDesc.PropTypes.func.description('change handler for selectable context menu'),
+
+  /** multi select */
+  multiple: reactDesc.PropTypes.bool.description('multi select'),
+
+  /** click outside callback handler */
+  onClickOutside: reactDesc.PropTypes.func.description('click outside callback handler'),
+
+  /** array of mobile context menu items */
+  children: reactDesc.PropTypes.arrayOf(reactDesc.PropTypes.element).description('array of mobile context menu items'),
+
+  /** z index for overlay div */
+  backdropZIndex: reactDesc.PropTypes.number.description('z index for overlay div'),
+
+  /** z index for menu container */
+  zIndex: reactDesc.PropTypes.number.description('z index for menu container'),
+
+  /** for e2e tests */
+  dataTestid: reactDesc.PropTypes.string.description('for e2e tests'),
+
+  /** bottom button */
+  buttonFooter: reactDesc.PropTypes.element.description('bottom button'),
+
+  /** callback */
+  onApply: reactDesc.PropTypes.func.description('callback'),
+
+  /** selected elements for multi and single select */
+  selecteds: reactDesc.PropTypes.oneOfType([reactDesc.PropTypes.arrayOf(reactDesc.PropTypes.oneOfType([reactDesc.PropTypes.string, reactDesc.PropTypes.number])), reactDesc.PropTypes.number]).description('selected elements for multi and single select')
 };
-DSMobileContextMenu.propTypes = props;
-const DSMobileContextMenuWithSchema = (0, import_react_desc.describe)(DSMobileContextMenu);
+const DSMobileContextMenuWithSchema = reactDesc.describe(DSMobileContextMenu);
 DSMobileContextMenuWithSchema.propTypes = props;
-module.exports = __toCommonJS(MobileContextMenu_exports);
-//# sourceMappingURL=MobileContextMenu.js.map
+
+exports.DSMobileContextMenu = DSMobileContextMenu;
+exports.DSMobileContextMenuWithSchema = DSMobileContextMenuWithSchema;