@elliemae/ds-mobile 1.55.0-next.7 → 2.0.0-alpha.10

package/cjs/MobileContextMenu/MobileContextMenu.js

@@ -3,8 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var _toConsumableArray = require('@babel/runtime/helpers/toConsumableArray');
-var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var _jsx = require('@babel/runtime/helpers/jsx');
 var React = require('react');
 var lodash = require('lodash');
 var reactDesc = require('react-desc');
@@ -13,170 +12,140 @@ var Grid = require('@elliemae/ds-basic/Grid');
 var dsBasic = require('@elliemae/ds-basic');
 var dsSystem = require('@elliemae/ds-system');
 var Group = require('@elliemae/ds-shared/GroupContext/Group');
-var MobileContextMenu_MobileContextMenuGroup = require('./MobileContextMenuGroup.js');
+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 _toConsumableArray__default = /*#__PURE__*/_interopDefaultLegacy(_toConsumableArray);
-var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
+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); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-var StyledContainer = /*#__PURE__*/styled__default['default'](Grid.Grid).withConfig({
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+const StyledContainer = /*#__PURE__*/styled__default["default"](Grid.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);"], function (props) {
-  return props.theme.colors.neutral['000'];
-}, function (props) {
-  return props.zIndex;
-}, function (props) {
-  return "calc(100% - ".concat(props.theme.space.xs, ")");
-}, function (props) {
-  return props.theme.space.xxs;
-});
-var StyledTitle = /*#__PURE__*/styled__default['default'](Grid.Grid).withConfig({
+})(["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% - ${props.theme.space.xs})`, props => props.theme.space.xxs);
+const StyledTitle = /*#__PURE__*/styled__default["default"](Grid.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:", ";}"], function (props) {
-  return props.theme.fontWeights.semibold;
-}, function (props) {
-  return props.theme.colors.neutral['000'];
-}, dsSystem.truncate(), function (props) {
-  return props.theme.colors.neutral['000'];
-});
-var HeaderContainer = /*#__PURE__*/styled__default['default'](Grid.Grid).withConfig({
+})(["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"](Grid.Grid).withConfig({
   componentId: "sc-15ys5tq-2"
-})(["border-top-left-radius:5px;border-top-right-radius:5px;background:", ";"], function (props) {
-  return props.theme.colors.brand['600'];
-});
-
-var isArr = function isArr(prop) {
-  return Array.isArray(prop);
-};
-
-var DSMobileContextMenu = dsSystem.withTheme(function (_ref) {
-  var _ref$open = _ref.open,
-      open = _ref$open === void 0 ? false : _ref$open,
-      _ref$title = _ref.title,
-      title = _ref$title === void 0 ? '' : _ref$title,
-      _ref$multiple = _ref.multiple,
-      multiple = _ref$multiple === void 0 ? false : _ref$multiple,
-      _ref$singleSelect = _ref.singleSelect,
-      singleSelect = _ref$singleSelect === void 0 ? false : _ref$singleSelect,
-      _ref$onChange = _ref.onChange,
-      onChange = _ref$onChange === void 0 ? lodash.noop : _ref$onChange,
-      _ref$onClickOutside = _ref.onClickOutside,
-      onClickOutside = _ref$onClickOutside === void 0 ? lodash.noop : _ref$onClickOutside,
-      children = _ref.children,
-      theme = _ref.theme,
-      backdropZIndex = _ref.backdropZIndex,
-      _ref$zIndex = _ref.zIndex,
-      zIndex = _ref$zIndex === void 0 ? 1 : _ref$zIndex,
-      _ref$dataTestid = _ref.dataTestid,
-      dataTestid = _ref$dataTestid === void 0 ? 'mobile-context-menu' : _ref$dataTestid,
-      _ref$buttonFooter = _ref.buttonFooter,
-      buttonFooter = _ref$buttonFooter === void 0 ? null : _ref$buttonFooter,
-      _ref$onApply = _ref.onApply,
-      onApply = _ref$onApply === void 0 ? lodash.noop : _ref$onApply,
-      initSelecteds = _ref.selecteds;
-
-  var _useState = React.useState([]),
-      _useState2 = _slicedToArray__default['default'](_useState, 2),
-      selectedItems = _useState2[0],
-      setSelectedItems = _useState2[1];
-
-  var trueSelected = React.useMemo(function () {
-    return initSelecteds !== undefined ? initSelecteds : _toConsumableArray__default['default'](selectedItems);
-  }, [initSelecteds, selectedItems]);
-  var containerRef = React.useRef(null);
-
-  var handleChange = function handleChange(value, childProps, event) {
+})(["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(({
+  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
+}) => {
+  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 === undefined) {
-      if (multiple) setSelectedItems(_toConsumableArray__default['default'](value));else if (singleSelect) setSelectedItems(value);
+      if (multiple) setSelectedItems([...value]);else if (singleSelect) setSelectedItems(value);
     }
   };
 
-  var handleApply = function handleApply(e) {
+  const handleApply = function (e) {
     if (this.onClick) this.onClick(e);
     onApply(e, selectedItems);
   };
 
-  var rows = [theme.space.s, 1];
+  const rows = [theme.space.s, 1];
   if (buttonFooter) rows.push('56px');
   if (!open) return null;
-  return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(dsBasic.DSBackdrop, {
-    type: "cover",
-    zIndex: backdropZIndex,
-    onClick: function onClick(e) {
-      // PUI-4481 prevent click on elements below backdrop
-      e.stopPropagation();
-      onClickOutside(e);
-    }
-  }), /*#__PURE__*/React__default['default'].createElement(StyledContainer, {
-    zIndex: zIndex,
-    rows: rows,
-    ref: containerRef,
-    "data-testid": "ds-mobile-context-menu"
-  }, /*#__PURE__*/React__default['default'].createElement(HeaderContainer, {
-    justifyContent: "center",
-    alignItems: "center",
-    pl: "xs",
-    pr: "xs"
-  }, /*#__PURE__*/React__default['default'].createElement(StyledTitle, {
-    alignItems: "center",
-    gutter: "xxs",
-    cols: Array(isArr(title) ? title.length : 1).fill('auto')
-  }, title)), /*#__PURE__*/React__default['default'].createElement(Grid.Grid, {
-    style: {
-      overflow: 'hidden'
-    }
-  }, /*#__PURE__*/React__default['default'].createElement(Grid.Grid, {
-    style: {
-      overflow: 'auto'
-    }
-  }, /*#__PURE__*/React__default['default'].createElement(Group__default['default'], {
-    activeValue: trueSelected,
-    multiple: multiple,
-    onChange: handleChange
-  }, React__default['default'].Children.map(children, function (child, ii) {
-    var _child$type;
-
-    var isGroup = child.type === React__default['default'].createElement(MobileContextMenu_MobileContextMenuGroup.DSMobileContextMenuGroup, null).type || ((_child$type = child.type) === null || _child$type === void 0 ? void 0 : _child$type.name) === MobileContextMenu_MobileContextMenuGroup.DSMobileContextMenuGroup.componentType || child.type === MobileContextMenu_MobileContextMenuGroup.DSMobileContextMenuGroup.type;
-    var _child$props$onClick = child.props.onClick,
-        onClick = _child$props$onClick === void 0 ? lodash.noop : _child$props$onClick;
-    var value = ii;
-    var isSelected;
-    if (singleSelect) isSelected = trueSelected === value;else if (multiple) isSelected = trueSelected.includes(value);
-    return /*#__PURE__*/React__default['default'].cloneElement(child, {
-      value: value,
-      key: "cm.".concat(ii),
-      isMulti: multiple,
-      singleSelect: singleSelect,
-      isSelected: isSelected,
-      onClick: !isGroup ? function (e) {
-        return onClick(e, child.props);
-      } : null,
-      selectedItems: isGroup ? trueSelected : null
-    });
-  })))), buttonFooter && /*#__PURE__*/React__default['default'].createElement(Grid.Grid, {
-    pl: "xs",
-    pr: "xs",
-    alignItems: "center"
-  }, /*#__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)
-  })))));
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/_jsx__default["default"](dsBasic.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"](Grid.Grid, {
+        style: {
+          overflow: 'hidden'
+        }
+      }, void 0, /*#__PURE__*/_jsx__default["default"](Grid.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.${ii}`,
+          isMulti: multiple,
+          singleSelect,
+          isSelected,
+          onClick: !isGroup ? e => onClick(e, child.props) : null,
+          selectedItems: isGroup ? trueSelected : null
+        });
+      })))), buttonFooter && /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
+        pl: "xs",
+        pr: "xs",
+        alignItems: "center"
+      }, void 0, /*#__PURE__*/React__default["default"].cloneElement(buttonFooter, _objectSpread(_objectSpread({}, buttonFooter.props), {}, {
+        containerProps: {
+          'data-testid': `${dataTestid}--btn`
+        },
+        buttonType: 'primary',
+        size: 'l',
+        onClick: handleApply.bind(buttonFooter.props)
+      })))]
+    })]
+  });
 });
-var props = {
+const props = {
   /** toggle open the menu */
   open: reactDesc.PropTypes.bool.description('toggle open the menu'),
 
@@ -213,10 +182,8 @@ var props = {
   /** 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;
-var DSMobileContextMenuWithSchema = reactDesc.describe(DSMobileContextMenu);
+const DSMobileContextMenuWithSchema = reactDesc.describe(DSMobileContextMenu);
 DSMobileContextMenuWithSchema.propTypes = props;
 
 exports.DSMobileContextMenu = DSMobileContextMenu;
 exports.DSMobileContextMenuWithSchema = DSMobileContextMenuWithSchema;
-//# sourceMappingURL=MobileContextMenu.js.map

package/cjs/MobileContextMenu/MobileContextMenuGroup.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _jsx = require('@babel/runtime/helpers/jsx');
 var React = require('react');
 var styled = require('styled-components');
 var dsBasic = require('@elliemae/ds-basic');
@@ -12,57 +13,45 @@ var reactDesc = require('react-desc');
 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);
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-var Title = /*#__PURE__*/styled__default['default'].div.withConfig({
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+const Title = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-atfpfh-0"
-})(["height:24px;line-height:24px;font-size:12px;border-top:1px solid ", ";background:", ";padding:0 ", ";color:", ";font-weight:", ";"], function (props) {
-  return props.theme.colors.brand['300'];
-}, function (props) {
-  return props.theme.colors.brand['200'];
-}, function (props) {
-  return props.theme.space.xs;
-}, function (props) {
-  return props.theme.colors.neutral['700'];
-}, function (props) {
-  return props.theme.fontWeights.semibold;
-});
+})(["height:24px;line-height:24px;font-size:12px;border-top:1px solid ", ";background:", ";padding:0 ", ";color:", ";font-weight:", ";"], props => props.theme.colors.brand['300'], props => props.theme.colors.brand['200'], props => props.theme.space.xs, props => props.theme.colors.neutral['700'], props => props.theme.fontWeights.semibold);
 
-var DSMobileContextMenuGroup = function DSMobileContextMenuGroup(_ref) {
-  var title = _ref.title,
-      isMulti = _ref.isMulti,
-      singleSelect = _ref.singleSelect,
-      children = _ref.children,
-      groupValue = _ref.value,
-      selectedItems = _ref.selectedItems;
-  return /*#__PURE__*/React__default['default'].createElement(dsBasic.Grid, null, /*#__PURE__*/React__default['default'].createElement(dsBasic.Grid, null, /*#__PURE__*/React__default['default'].createElement(Title, null, title)), /*#__PURE__*/React__default['default'].createElement(dsBasic.Grid, null, React__default['default'].Children.map(children, function (child, index) {
-    var _child$props$onClick = child.props.onClick,
-        _onClick = _child$props$onClick === void 0 ? lodash.noop : _child$props$onClick;
+const DSMobileContextMenuGroup = ({
+  title,
+  isMulti,
+  singleSelect,
+  children,
+  value: groupValue,
+  selectedItems
+}) => /*#__PURE__*/_jsx__default["default"](dsBasic.Grid, {}, void 0, /*#__PURE__*/_jsx__default["default"](dsBasic.Grid, {}, void 0, /*#__PURE__*/_jsx__default["default"](Title, {}, void 0, title)), /*#__PURE__*/_jsx__default["default"](dsBasic.Grid, {}, void 0, React__default["default"].Children.map(children, (child, index) => {
+  const {
+    onClick = lodash.noop
+  } = child.props;
+  const value = `${groupValue}:${index}`;
+  let isSelected;
+  if (singleSelect) isSelected = selectedItems === value;else if (isMulti) isSelected = selectedItems.includes(value);
+  return /*#__PURE__*/React__default["default"].cloneElement(child, {
+    value,
+    key: 'group.'.concat(index),
+    isGroup: true,
+    isMulti,
+    singleSelect,
+    isSelected,
+    onClick: e => onClick(e, _objectSpread({
+      value
+    }, child.props))
+  });
+})));
 
-    var value = "".concat(groupValue, ":").concat(index);
-    var isSelected;
-    if (singleSelect) isSelected = selectedItems === value;else if (isMulti) isSelected = selectedItems.includes(value);
-    return /*#__PURE__*/React__default['default'].cloneElement(child, {
-      value: value,
-      key: 'group.'.concat(index),
-      isGroup: true,
-      isMulti: isMulti,
-      singleSelect: singleSelect,
-      isSelected: isSelected,
-      onClick: function onClick(e) {
-        return _onClick(e, _objectSpread({
-          value: value
-        }, child.props));
-      }
-    });
-  })));
-};
-
-var props = {
+const props = {
   /**
    * Group title
    */
@@ -85,11 +74,9 @@ var props = {
   /** selected items, array for multi, string for single */
   selectedItems: reactDesc.PropTypes.oneOfType([reactDesc.PropTypes.array, reactDesc.PropTypes.string]).description('selected items, array for multi, string for single')
 };
-DSMobileContextMenuGroup.propTypes = props;
 DSMobileContextMenuGroup.componentType = 'DSMobileContextMenuGroup';
-var DSMobileContextMenuGroupWithSchema = reactDesc.describe(DSMobileContextMenuGroup);
+const DSMobileContextMenuGroupWithSchema = reactDesc.describe(DSMobileContextMenuGroup);
 DSMobileContextMenuGroupWithSchema.propTypes = props;
 
 exports.DSMobileContextMenuGroup = DSMobileContextMenuGroup;
 exports.DSMobileContextMenuGroupWithSchema = DSMobileContextMenuGroupWithSchema;
-//# sourceMappingURL=MobileContextMenuGroup.js.map

package/cjs/MobileContextMenu/MobileContextMenuItem.js

@@ -2,125 +2,131 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var React = require('react');
+var _jsx = require('@babel/runtime/helpers/jsx');
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+require('react');
 var reactDesc = require('react-desc');
 var Grid = require('@elliemae/ds-basic/Grid');
 var styled = require('styled-components');
 var dsSystem = require('@elliemae/ds-system');
 var GroupItem = require('@elliemae/ds-shared/GroupContext/GroupItem');
 var DSCheckbox = require('@elliemae/ds-basic/form/Checkbox');
-var Checkmark = require('@elliemae/ds-icons/Checkmark');
-var MobileTouchable_MobileTouchable = require('../MobileTouchable/MobileTouchable.js');
-require('@babel/runtime/helpers/extends');
-require('@babel/runtime/helpers/slicedToArray');
-require('@babel/runtime/helpers/objectWithoutProperties');
-require('lodash');
-require('prop-types');
+var DSCheckmark = require('@elliemae/ds-icons/Checkmark');
+var MobileTouchable = require('../MobileTouchable/MobileTouchable.js');
+var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 var GroupItem__default = /*#__PURE__*/_interopDefaultLegacy(GroupItem);
 var DSCheckbox__default = /*#__PURE__*/_interopDefaultLegacy(DSCheckbox);
-var Checkmark__default = /*#__PURE__*/_interopDefaultLegacy(Checkmark);
+var DSCheckmark__default = /*#__PURE__*/_interopDefaultLegacy(DSCheckmark);
 
-/* eslint-disable max-lines */
-var Wrap = /*#__PURE__*/styled__default['default'](function (props) {
-  return /*#__PURE__*/React__default['default'].createElement(MobileTouchable_MobileTouchable.DSMobileTouchable, props);
-}).withConfig({
+var _CheckMark;
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+const Wrap = /*#__PURE__*/styled__default["default"](props => /*#__PURE__*/jsxRuntime.jsx(MobileTouchable.DSMobileTouchable, _objectSpread({}, props))).withConfig({
   componentId: "sc-20od94-0"
 })(["border-bottom:none;"]);
-var PropWrap = /*#__PURE__*/styled__default['default'](function (props) {
-  return /*#__PURE__*/React__default['default'].createElement(Grid.Grid, props);
-}).withConfig({
+const PropWrap = /*#__PURE__*/styled__default["default"](props => /*#__PURE__*/jsxRuntime.jsx(Grid.Grid, _objectSpread({}, props))).withConfig({
   componentId: "sc-20od94-1"
-})(["", ""], function (props) {
+})(["", ""], props => {
   if (!props.isMulti) {
-    return "\n      & > span {\n        height: 18px;\n        width: 18px;\n      }\n\n      & > span > svg {\n        height: 18px;\n        width: 18px;\n      }\n      ";
+    return `
+      & > span {
+        height: 18px;
+        width: 18px;
+      }
+
+      & > span > svg {
+        height: 18px;
+        width: 18px;
+      }
+      `;
   }
 
   return '';
 });
-var Title = /*#__PURE__*/styled__default['default'].span.withConfig({
+const Title = /*#__PURE__*/styled__default["default"].span.withConfig({
   componentId: "sc-20od94-2"
-})(["font-size:16px;color:", ";", ""], function (props) {
-  return props.theme.colors.brand['600'];
-}, dsSystem.truncate());
-var Label = /*#__PURE__*/styled__default['default'].span.withConfig({
+})(["font-size:16px;color:", ";", ""], props => props.theme.colors.brand['600'], dsSystem.truncate());
+const Label = /*#__PURE__*/styled__default["default"].span.withConfig({
   componentId: "sc-20od94-3"
-})(["font-size:13px;color:", ";"], function (props) {
-  return props.theme.colors.neutral['600'];
-});
-var CheckMark = /*#__PURE__*/styled__default['default'](Checkmark__default['default']).withConfig({
+})(["font-size:13px;color:", ";"], props => props.theme.colors.neutral['600']);
+const CheckMark = /*#__PURE__*/styled__default["default"](DSCheckmark__default["default"]).withConfig({
   componentId: "sc-20od94-4"
-})(["fill:", ";"], function (props) {
-  return props.theme.colors.brand['600'];
-});
-
-var DSMobileContextMenuItem = function DSMobileContextMenuItem(_ref) {
-  var label = _ref.label,
-      title = _ref.title,
-      leftProp = _ref.leftProp,
-      isGroup = _ref.isGroup,
-      isMulti = _ref.isMulti,
-      singleSelect = _ref.singleSelect,
-      isSelected = _ref.isSelected,
-      _ref$onClick = _ref.onClick,
-      _onClick = _ref$onClick === void 0 ? function () {} : _ref$onClick,
-      value = _ref.value;
-
-  return /*#__PURE__*/React__default['default'].createElement(GroupItem__default['default'], {
-    render: function render(context) {
-      var activeValue = context.activeValue;
-      var someItemSelected = activeValue >= 0 && !Array.isArray(activeValue);
+})(["fill:", ";"], props => props.theme.colors.brand['600']);
+
+const DSMobileContextMenuItem = ({
+  label,
+  title,
+  leftProp,
+  isGroup,
+  isMulti,
+  singleSelect,
+  isSelected,
+  // eslint-disable-next-line @typescript-eslint/no-empty-function
+  onClick = () => {},
+  value
+}) => {
+  var _Checkbox, _Grid, _Title;
+
+  return /*#__PURE__*/_jsx__default["default"](GroupItem__default["default"], {
+    render: context => {
+      const {
+        activeValue
+      } = context;
+      let someItemSelected = activeValue >= 0 && !Array.isArray(activeValue);
       if (isGroup) someItemSelected = typeof activeValue === 'string';
-      var showLeftAddon = isSelected;
+      let showLeftAddon = isSelected;
       if (isMulti || !singleSelect) showLeftAddon = true;
-      var leftAddon = leftProp || null;
-      if (isMulti) leftAddon = /*#__PURE__*/React__default['default'].createElement(DSCheckbox__default['default'], {
+      let leftAddon = leftProp || null;
+      if (isMulti) leftAddon = _Checkbox || (_Checkbox = /*#__PURE__*/_jsx__default["default"](DSCheckbox__default["default"], {
         checked: isSelected,
         "data-testid": "leftAddon-checkbox"
-      });
-      if (singleSelect) leftAddon = /*#__PURE__*/React__default['default'].createElement(CheckMark, {
+      }));
+      if (singleSelect) leftAddon = _CheckMark || (_CheckMark = /*#__PURE__*/_jsx__default["default"](CheckMark, {
         "data-testid": "leftAddon-checkmark"
-      });
-      return /*#__PURE__*/React__default['default'].createElement(Wrap, {
+      }));
+      return /*#__PURE__*/_jsx__default["default"](Wrap, {
         "data-testid": "ds-contextmenu-item",
-        onClick: function onClick(e) {
+        onClick: e => {
           if (singleSelect || isMulti) context.onChange(value, e, {
-            value: value,
-            label: label,
-            title: title
+            value,
+            label,
+            title
           });
-
-          _onClick(e);
+          onClick(e);
         },
         cols: singleSelect && someItemSelected || leftAddon && !singleSelect || isMulti ? ['40px', 'auto'] : ['auto']
-      }, (singleSelect && someItemSelected || isMulti || leftAddon) && /*#__PURE__*/React__default['default'].createElement(PropWrap, {
+      }, void 0, (singleSelect && someItemSelected || isMulti || leftAddon) && /*#__PURE__*/_jsx__default["default"](PropWrap, {
         "data-testid": "left-addon",
         isMulti: isMulti,
         alignItems: "center",
         justifyContent: "center",
         pl: "16px"
-      }, showLeftAddon && leftAddon), /*#__PURE__*/React__default['default'].createElement(Grid.Grid, {
+      }, void 0, showLeftAddon && leftAddon), /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
         height: "44px",
         pr: "xs",
         pl: !leftAddon && isGroup ? '24px' : 'xs'
-      }, label && /*#__PURE__*/React__default['default'].createElement(Grid.Grid, {
+      }, void 0, label && (_Grid || (_Grid = /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
         alignItems: "center"
-      }, /*#__PURE__*/React__default['default'].createElement(Label, {
+      }, void 0, /*#__PURE__*/_jsx__default["default"](Label, {
         "data-testid": "contextMenuItem-label"
-      }, label)), /*#__PURE__*/React__default['default'].createElement(Grid.Grid, {
+      }, void 0, label)))), /*#__PURE__*/_jsx__default["default"](Grid.Grid, {
         alignItems: !label ? 'center' : undefined
-      }, /*#__PURE__*/React__default['default'].createElement(Title, {
+      }, void 0, _Title || (_Title = /*#__PURE__*/_jsx__default["default"](Title, {
         "data-testid": "contextMenuItem-title"
-      }, title))));
+      }, void 0, title)))));
     }
   });
 };
 
-var props = {
+const props = {
   /** label */
   label: reactDesc.PropTypes.string.description('label'),
 
@@ -148,10 +154,8 @@ var props = {
   /** selected value */
   isSelected: reactDesc.PropTypes.bool.description('selected value')
 };
-DSMobileContextMenuItem.propTypes = props;
-var DSMobileContextMenuItemWithSchema = reactDesc.describe(DSMobileContextMenuItem);
+const DSMobileContextMenuItemWithSchema = reactDesc.describe(DSMobileContextMenuItem);
 DSMobileContextMenuItemWithSchema.propTypes = props;
 
 exports.DSMobileContextMenuItem = DSMobileContextMenuItem;
 exports.DSMobileContextMenuItemWithSchema = DSMobileContextMenuItemWithSchema;
-//# sourceMappingURL=MobileContextMenuItem.js.map