@elliemae/ds-form 2.3.0-alpha.9 → 2.3.0-next.3

package/cjs/ComboBox/v1/DSComboBox.js

@@ -0,0 +1,350 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _jsx = require('@babel/runtime/helpers/jsx');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+require('core-js/modules/web.dom-collections.iterator.js');
+require('core-js/modules/esnext.async-iterator.find.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.find.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 lodash = require('lodash');
+var Select = require('react-select');
+var reactPopper = require('react-popper');
+var reactMeasure = require('react-measure');
+var dsUtilities = require('@elliemae/ds-utilities');
+var withSelectStringValueConverter = require('./withSelectStringValueConverter.js');
+var propTypes = require('@elliemae/ds-shared/prop-types');
+var Control = require('./components/Control.js');
+var DropdownIndicator = require('./components/DropdownIndicator.js');
+var SelectMenu = require('./components/SelectMenu.js');
+var ClearIndicator = require('./components/ClearIndicator.js');
+var MenuList = require('./components/MenuList.js');
+var MultiValueLabel = require('./components/MultiValueLabel.js');
+var MultiValueRemove = require('./components/MultiValueRemove.js');
+var SingleValueLabel = require('./components/SingleValueLabel.js');
+var calculateWidth = require('./components/calculateWidth.js');
+var ValueContainer = require('./components/ValueContainer.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);
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var Select__default = /*#__PURE__*/_interopDefaultLegacy(Select);
+
+var _span;
+
+const _excluded = ["hideSelectedOptions", "autoFocus", "className", "hasError", "onFocus", "onBlur", "onChange", "filterOption", "onClickDropdownIndicator", "onInputKeyDown", "onInputChange", "isRtl", "isFocused", "isMulti", "showAllOption", "value", "options", "clearable", "searchable", "disabled", "placeholder", "valueProperty", "labelProperty", "menuIsOpen", "inlineMenu", "noOptionsMessage", "components", "measureRef", "contentRect", "readOnly", "expandMenuToContainer", "expandMenuOutsideContainer", "customMenuItemOptions", "returnValue", "variant", "containerProps", "zIndex"];
+
+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 ThemeConstants = {
+  prefix: 'em-ds'
+};
+const blockName = 'selectbox';
+const allOption = {
+  value: 'SELECT_ALL_COMBOBOX',
+  label: 'All'
+};
+
+const getValues = (option, isMulti, valueProperty) => {
+  if (!option) return null;
+  return isMulti ? option.map(mOption => mOption[valueProperty]) : option[valueProperty];
+};
+
+class DSComboBox extends React__default["default"].Component {
+  constructor(props) {
+    super(props);
+    this.forceFocus = false;
+    this.isHover = undefined;
+    this.handleHover = lodash.debounce(value => {
+      if (this.state.isHover === this.isHover) return;
+      if (!this.unmount) this.setState({
+        isHover: value
+      });
+    }, 0);
+    this.state = {
+      focus: null,
+      isHover: undefined
+    };
+
+    this.handleOutsideScroll = () => {
+      if (this.isHover !== true && !this.unmount) {
+        this.isHover = false;
+        this.handleHover(false);
+      }
+    };
+
+    this.handleHoverRef = value => {
+      this.isHover = value;
+      this.handleHover(value);
+    };
+
+    this.onKeyDownClear = e => {
+      // if (e.key === 'ArrowRight') {
+      //   this.arrow.focus()
+      // } else if (e.key === 'ArrowLeft') {
+      //   this.select.focus()
+      // }
+      if (e.keyCode === 32 || e.keyCode === 13) {
+        this.select.focus();
+      }
+    };
+
+    this.handleKeyDown = e => {
+      // if (e.key === 'ArrowRight') e.preventDefault()
+      // if (e.target.type === 'text' && e.key === 'ArrowRight') {
+      //   if (this.clear && this.clear.focus) {
+      //     this.clear.focus()
+      //   } else {
+      //     this.arrow.focus()
+      //   }
+      // }
+      if (e.target.type === 'text' && e.key === 'Backspace') {
+        this.select.focus();
+      }
+
+      return () => {
+        const {
+          value
+        } = e.target;
+        if (!value && e.key === ' ') e.preventDefault();
+        this.props.onKeyDown(e);
+      };
+    };
+
+    this.clear = /*#__PURE__*/React__default["default"].createRef();
+    this.arrow = /*#__PURE__*/React__default["default"].createRef();
+    this.select = /*#__PURE__*/React__default["default"].createRef();
+  }
+
+  componentDidMount() {
+    const {
+      handleHoverRef
+    } = this.props;
+    if (handleHoverRef) handleHoverRef(this.handleHoverRef);
+    window.addEventListener('scroll', lodash.throttle(this.handleOutsideScroll, 300), true);
+  }
+
+  componentWillUnmount() {
+    this.unmount = true;
+    window.removeEventListener('scroll', lodash.throttle(this.handleOutsideScroll, 300), true);
+  }
+
+  render() {
+    const _this$props = this.props,
+          {
+      hideSelectedOptions = false,
+      autoFocus = false,
+      className = '',
+      hasError = false,
+      onFocus = () => null,
+      onBlur = () => null,
+      onChange = () => null,
+      // onKeyDown = () => null,
+      filterOption = undefined,
+      onClickDropdownIndicator = () => null,
+      onInputKeyDown = () => null,
+      onInputChange = undefined,
+      isRtl = false,
+      isFocused = undefined,
+      isMulti = false,
+      showAllOption = false,
+      value = null,
+      options = [],
+      clearable = false,
+      searchable = true,
+      disabled = false,
+      placeholder = '',
+      valueProperty = 'value',
+      labelProperty = 'label',
+      menuIsOpen = undefined,
+      inlineMenu = false,
+      noOptionsMessage = () => _span || (_span = /*#__PURE__*/_jsx__default["default"]("span", {}, void 0, "No options")),
+      components: customComponents = {},
+      measureRef,
+      contentRect,
+      readOnly = false,
+      expandMenuToContainer = true,
+      expandMenuOutsideContainer = false,
+      customMenuItemOptions = {
+        useTruncatedText: false,
+        itemSize: 35
+      },
+      returnValue = true,
+      variant = propTypes.COMBOBOX_VARIANT.DEFAULT,
+      containerProps = {},
+      zIndex = 11
+    } = _this$props,
+          restPropsToCustomizeSelect = _objectWithoutProperties__default["default"](_this$props, _excluded);
+
+    const {
+      focus
+    } = this.state;
+    let internalOptions = options;
+    let internalValue = value;
+
+    if (showAllOption && isMulti) {
+      internalOptions = [allOption, ...options];
+    }
+
+    if (this.allSelected && isMulti) {
+      internalValue = [allOption, ...value];
+    }
+
+    return /*#__PURE__*/_jsx__default["default"](reactPopper.Manager, {}, void 0, /*#__PURE__*/jsxRuntime.jsx("div", _objectSpread(_objectSpread({
+      ref: measureRef,
+      className: dsUtilities.cx("".concat(ThemeConstants.prefix, "-").concat(blockName, "-wrapper"), className, hasError && "".concat(ThemeConstants.prefix, "-").concat(blockName, "--").concat(propTypes.COMBOBOX_VARIANT.ERROR), "".concat(ThemeConstants.prefix, "-").concat(blockName, "--").concat(variant), "focus-".concat(focus), isMulti && 'combo-multi', expandMenuOutsideContainer && 'expanded-outside-container')
+    }, containerProps), {}, {
+      onMouseEnter: () => {
+        this.handleHoverRef(undefined);
+      },
+      children: /*#__PURE__*/jsxRuntime.jsx(Select__default["default"], _objectSpread({
+        ref: ref => {
+          this.select = ref;
+        },
+        autoFocus: autoFocus,
+        classNamePrefix: "".concat(ThemeConstants.prefix, "-").concat(blockName),
+        components: _objectSpread({
+          Control,
+          Menu: !options || options.length === 0 ? SelectMenu : props => /*#__PURE__*/_jsx__default["default"]("div", {
+            className: "select-menu-combo ".concat(isMulti && 'select-menu-combo-multi'),
+            onMouseLeave: () => {
+              this.isHover = undefined;
+              this.handleHover(undefined);
+            },
+            onMouseOverCapture: () => {
+              this.isHover = true;
+              this.handleHover(true);
+            }
+          }, void 0, /*#__PURE__*/jsxRuntime.jsx(SelectMenu, _objectSpread({}, props))),
+          // Menu: SelectMenu,
+          DropdownIndicator: () => /*#__PURE__*/_jsx__default["default"](DropdownIndicator, {
+            innerRef: ref => {
+              this.arrow = ref;
+            },
+            onClick: onClickDropdownIndicator,
+            onKeyDown: this.onKeyDownIndicator
+          }),
+          ClearIndicator: props => /*#__PURE__*/jsxRuntime.jsx(ClearIndicator, _objectSpread(_objectSpread({}, props), {}, {
+            innerRef: ref => {
+              this.clear = ref;
+            },
+            onKeyDown: this.onKeyDownClear
+          })),
+          MultiValueLabel,
+          MultiValueRemove,
+          SingleValue: SingleValueLabel,
+          MenuList,
+          ValueContainer: ValueContainer.ValueContainer
+        }, customComponents),
+        customMenuItemOptions: customMenuItemOptions,
+        expandMenuOutsideContainer: expandMenuOutsideContainer,
+        expandMenuToContainer: expandMenuToContainer,
+        filterOption: filterOption,
+        getOptionLabel: option => option[labelProperty],
+        getOptionValue: option => option[valueProperty],
+        hideSelectedOptions: hideSelectedOptions,
+        inlineMenu: inlineMenu,
+        isClearable: clearable,
+        isDisabled: disabled || readOnly,
+        isFocused: isFocused,
+        isMulti: isMulti,
+        isRtl: isRtl,
+        isSearchable: readOnly ? false : searchable,
+        menuIsOpen: menuIsOpen === undefined ? this.isHover : menuIsOpen,
+        noOptionsMessage: function () {
+          noOptionsMessage(...arguments);
+        },
+        onBlur: onBlur,
+        onChange: returnValue ? (option, action) => {
+          this.allSelected = false;
+          this.isHover = undefined;
+          this.setState({
+            isHover: undefined
+          });
+
+          if (showAllOption && isMulti && option.find(op => op.value === 'SELECT_ALL_COMBOBOX')) {
+            this.allSelected = true;
+            return onChange(getValues(options, isMulti, valueProperty), action);
+          }
+
+          return onChange(getValues(option, isMulti, valueProperty), action);
+        } : (option, action) => {
+          this.allSelected = false;
+          this.isHover = undefined;
+          this.setState({
+            isHover: undefined
+          });
+
+          if (showAllOption && isMulti && option.find(op => op.value === 'SELECT_ALL_COMBOBOX')) {
+            this.allSelected = true;
+            return onChange(options, action);
+          }
+
+          return onChange(option, action);
+        },
+        onFocus: onFocus,
+        onInputChange: onInputChange,
+        onInputKeyDown: onInputKeyDown,
+        onKeyDown: this.handleKeyDown,
+        options: internalOptions,
+        placeholder: placeholder,
+        selectMeasure: contentRect,
+        styles: {
+          control: () => null,
+          menu: () => {
+            if (expandMenuOutsideContainer) {
+              const width = calculateWidth.calculateWidth(options);
+              if (!width) return null;
+              return {
+                width: "".concat(width, "px")
+              };
+            }
+
+            return null;
+          },
+          option: () => null,
+          dropdownIndicator: () => null,
+          clearIndicator: () => null,
+          placeholder: () => null,
+          indicatorSeparator: () => null,
+          multiValue: base => _objectSpread(_objectSpread({}, base), {}, {
+            background: 'none',
+            minWidth: '3rem'
+          })
+        },
+        value: internalValue,
+        zIndex: zIndex
+      }, restPropsToCustomizeSelect))
+    })));
+  }
+
+}
+
+DSComboBox.defaultProps = {
+  showAllOption: false
+};
+var DSComboBox$1 = withSelectStringValueConverter(reactMeasure.withContentRect('bounds')(DSComboBox));
+
+Object.defineProperty(exports, 'components', {
+  enumerable: true,
+  get: function () { return Select.components; }
+});
+Object.defineProperty(exports, 'COMBOBOX_VARIANT', {
+  enumerable: true,
+  get: function () { return propTypes.COMBOBOX_VARIANT; }
+});
+exports["default"] = DSComboBox$1;

package/cjs/ComboBox/v1/components/AllOption.js

@@ -0,0 +1,37 @@
+'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 _jsx = require('@babel/runtime/helpers/jsx');
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+require('react');
+var DSCheckbox = require('../../../Checkbox/DSCheckbox.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);
+
+const _excluded = ["children"];
+
+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 MultiSelectHeader = _ref => {
+  let rest = _objectWithoutProperties__default["default"](_ref, _excluded);
+
+  return /*#__PURE__*/_jsx__default["default"]("div", {
+    className: "combobox-multi-select-all"
+  }, void 0, /*#__PURE__*/jsxRuntime.jsx(DSCheckbox.DSCheckbox, _objectSpread({
+    labelText: "All"
+  }, rest)));
+};
+
+module.exports = MultiSelectHeader;

package/cjs/ComboBox/v1/components/ClearIndicator.js

@@ -0,0 +1,48 @@
+'use strict';
+
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('react');
+var dsIcons = require('@elliemae/ds-icons');
+var DSButton = require('@elliemae/ds-button');
+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 DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
+
+var _CloseCircle;
+
+const ClearIndicator = props => {
+  const {
+    getStyles,
+    innerProps: {
+      ref
+    },
+    innerRef
+  } = props;
+  return /*#__PURE__*/jsxRuntime.jsx("div", {
+    ref: ref,
+    "aria-hidden": "false",
+    style: getStyles('clearIndicator', props),
+    children: /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
+      "aria-label": "clear-indicator",
+      buttonType: "text",
+      className: "clear-indicator",
+      icon: _CloseCircle || (_CloseCircle = /*#__PURE__*/_jsx__default["default"](dsIcons.CloseCircle, {
+        size: "m"
+      })),
+      innerRef: innerRef,
+      onKeyDown: e => {
+        if (e.keyCode === 32 || e.keyCode === 13) {
+          e.preventDefault();
+          props.clearValue();
+        }
+
+        props.onKeyDown(e);
+      }
+    })
+  });
+};
+
+module.exports = ClearIndicator;

package/cjs/ComboBox/v1/components/Control.js

@@ -0,0 +1,34 @@
+'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 _jsx = require('@babel/runtime/helpers/jsx');
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+require('react');
+var Select = require('react-select');
+var reactPopper = require('react-popper');
+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);
+
+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 Control = props => /*#__PURE__*/_jsx__default["default"](reactPopper.Reference, {}, void 0, _ref => {
+  let {
+    ref
+  } = _ref;
+  return /*#__PURE__*/jsxRuntime.jsx("div", {
+    ref: ref,
+    children: /*#__PURE__*/jsxRuntime.jsx(Select.components.Control, _objectSpread({}, props))
+  });
+});
+
+module.exports = Control;

package/cjs/ComboBox/v1/components/CustomOption.js

@@ -0,0 +1,61 @@
+'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 _jsx = require('@babel/runtime/helpers/jsx');
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var React = require('react');
+var lodash = require('lodash');
+var DSTruncatedTooltipText = require('@elliemae/ds-truncated-tooltip-text');
+
+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 React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var DSTruncatedTooltipText__default = /*#__PURE__*/_interopDefaultLegacy(DSTruncatedTooltipText);
+
+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 CustomOption = _ref => {
+  let {
+    index,
+    data,
+    style,
+    isScrolling
+  } = _ref;
+  const {
+    items,
+    options: {
+      useTruncatedText
+    }
+  } = data;
+  const option = items[index];
+
+  const optionProps = _objectSpread(_objectSpread({}, option.props.innerProps), {}, {
+    style,
+    onClick: e => {
+      e.stopPropagation();
+      if (option.props.innerProps.onClick) option.props.innerProps.onClick(e);
+    }
+  });
+
+  if (useTruncatedText && !isScrolling && lodash.get(option, 'props.selectProps.menuIsOpen')) {
+    return /*#__PURE__*/React__default["default"].cloneElement(option, _objectSpread(_objectSpread({}, option.props), {}, {
+      innerProps: optionProps
+    }), /*#__PURE__*/_jsx__default["default"](DSTruncatedTooltipText__default["default"], {
+      value: option.props.children
+    }));
+  }
+
+  return /*#__PURE__*/React__default["default"].cloneElement(option, _objectSpread(_objectSpread({}, option.props), {}, {
+    innerProps: optionProps
+  }));
+};
+
+module.exports = CustomOption;

package/cjs/ComboBox/v1/components/CustomOptionMulti.js

@@ -0,0 +1,73 @@
+'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 _jsx = require('@babel/runtime/helpers/jsx');
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var React = require('react');
+var DSTruncatedTooltipText = require('@elliemae/ds-truncated-tooltip-text');
+var DSCheckbox = require('../../../Checkbox/DSCheckbox.js');
+
+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 React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var DSTruncatedTooltipText__default = /*#__PURE__*/_interopDefaultLegacy(DSTruncatedTooltipText);
+
+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 CustomOptionMulti = _ref => {
+  let {
+    index,
+    data,
+    style,
+    isScrolling
+  } = _ref;
+  const {
+    items,
+    options: {
+      useTruncatedText
+    }
+  } = data;
+  const option = items[index];
+
+  const optionProps = _objectSpread(_objectSpread({}, option.props.innerProps), {}, {
+    style,
+    onClick: e => {
+      e.stopPropagation();
+      if (option.props.innerProps.onClick) option.props.innerProps.onClick(e);
+    }
+  });
+
+  if (useTruncatedText && !isScrolling) {
+    return /*#__PURE__*/React__default["default"].cloneElement(option, _objectSpread(_objectSpread({}, option.props), {}, {
+      innerProps: optionProps
+    }), /*#__PURE__*/_jsx__default["default"](DSTruncatedTooltipText__default["default"], {
+      value: option.props.children
+    }));
+  }
+
+  let allSelected = false;
+
+  if (option.props.value === 'SELECT_ALL_COMBOBOX') {
+    if (option.props.selectProps.value.length === option.props.selectProps.options.length - 1 || option.props.selectProps.value.length === option.props.selectProps.options.length) {
+      allSelected = true;
+    }
+  }
+
+  return /*#__PURE__*/React__default["default"].cloneElement(option, _objectSpread(_objectSpread({}, option.props), {}, {
+    innerProps: optionProps,
+    children: /*#__PURE__*/_jsx__default["default"]("div", {}, void 0, /*#__PURE__*/_jsx__default["default"](DSCheckbox.DSCheckbox, {
+      checked: option.props.isSelected || allSelected,
+      labelText: option.props.children
+    }))
+  }));
+};
+
+module.exports = CustomOptionMulti;

package/cjs/ComboBox/v1/components/DropdownIndicator.js

@@ -0,0 +1,61 @@
+'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 dsIcons = require('@elliemae/ds-icons');
+var DSButton = require('@elliemae/ds-button');
+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);
+var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
+
+var _ChevronSmallDown;
+
+const _excluded = ["innerRef", "onKeyDown", "clearValue", "getStyles", "getValue", "setValue", "hasStyle", "hasValue", "isMulti", "isRtl", "isDisabled", "isFocused", "selectOption", "selectProps", "innerProps"];
+
+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 DropdownIndicator = _ref => {
+  let {
+    innerRef,
+    onKeyDown,
+    clearValue,
+    getStyles,
+    getValue,
+    setValue,
+    hasStyle,
+    hasValue,
+    isMulti,
+    isRtl,
+    isDisabled,
+    isFocused,
+    selectOption,
+    selectProps,
+    innerProps
+  } = _ref,
+      rest = _objectWithoutProperties__default["default"](_ref, _excluded);
+
+  return /*#__PURE__*/jsxRuntime.jsx(DSButton__default["default"], _objectSpread({
+    "aria-label": "dropdown-indicator",
+    buttonType: "text",
+    className: "dropdown-indicator",
+    icon: _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronSmallDown, {})),
+    innerRef: innerRef,
+    onKeyDown: onKeyDown
+  }, rest));
+};
+
+module.exports = DropdownIndicator;