@elliemae/ds-form 2.1.0-rc.7 → 2.2.0-alpha.1

package/esm/ComboBox/v3/parts/multi-selected-values-container/useGroupPills.js

@@ -0,0 +1,67 @@
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
+import { useContext, useState, useEffect, useLayoutEffect } from 'react';
+import { useOnElementResize } from '../../utils/hooks/useOnElementResize.js';
+import { ComboBoxContext } from '../../ComboBoxCTX.js';
+
+const getGroupedPillWidth = remainingPills => {
+  if (remainingPills === 0) return 0;
+  const digits = remainingPills.toString().length;
+  return 8 * (digits - 1) + 31;
+};
+
+const useGroupPills = () => {
+  const {
+    props: {
+      selectedValues
+    },
+    selectedOptionsRef,
+    controlsWrapperRef,
+    pillGroupRef
+  } = useContext(ComboBoxContext);
+  const multiSelectedValues = selectedValues;
+  const [pillsToShow, setPillsToShow] = useState(multiSelectedValues.length);
+  const {
+    width
+  } = useOnElementResize(controlsWrapperRef);
+  useEffect(() => {
+    if (multiSelectedValues.length !== pillsToShow) {
+      setPillsToShow(multiSelectedValues.length);
+    } // eslint-disable-next-line react-hooks/exhaustive-deps
+
+  }, [multiSelectedValues.length, width]);
+  useLayoutEffect(() => {
+    if (selectedOptionsRef.current) {
+      pillGroupRef.current.style.width = 'max-content';
+      let lastPillFit = -1;
+      let currentWidth = 0;
+      const referenceWidth = selectedOptionsRef.current.offsetWidth;
+      const pills = [...selectedOptionsRef.current.querySelectorAll('.ds-pill-wrapper-value')];
+      const pillsWidth = pills.map(pill => pill === null || pill === void 0 ? void 0 : pill.offsetWidth);
+      pillsWidth.forEach((pillWidth, idx) => {
+        currentWidth += pillWidth;
+
+        if (currentWidth + getGroupedPillWidth(multiSelectedValues.length - idx - 1) <= referenceWidth) {
+          lastPillFit = idx;
+        }
+      });
+
+      if (!(multiSelectedValues.length > 0 && pillsToShow !== multiSelectedValues.length)) {
+        const nextPillsToShow = lastPillFit + 1;
+
+        if (nextPillsToShow !== pillsToShow) {
+          setPillsToShow(nextPillsToShow);
+        }
+      }
+
+      pillGroupRef.current.style.width = 'fit-content';
+    }
+  }, [selectedOptionsRef, multiSelectedValues, pillsToShow, pillGroupRef, width]);
+  return pillsToShow;
+};
+
+export { useGroupPills };

package/esm/ComboBox/v3/parts/single-selected-value-container/SingleSelectedValueContainer.js

@@ -0,0 +1,20 @@
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import { useContext } from 'react';
+import { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';
+import { ComboBoxContext } from '../../ComboBoxCTX.js';
+import { StyledSingleSelectedValue } from './styled.js';
+
+const SingleSelectedValueContainer = () => {
+  const {
+    props: {
+      selectedValues
+    },
+    showSelectedValue
+  } = useContext(ComboBoxContext);
+  const singleSelectedValue = selectedValues;
+  return /*#__PURE__*/_jsx(StyledSingleSelectedValue, {}, void 0, showSelectedValue ? /*#__PURE__*/_jsx(SimpleTruncatedTooltipText, {
+    value: singleSelectedValue === null || singleSelectedValue === void 0 ? void 0 : singleSelectedValue.label
+  }) : null);
+};
+
+export { SingleSelectedValueContainer };

package/esm/ComboBox/v3/parts/single-selected-value-container/index.js

@@ -0,0 +1 @@
+export { SingleSelectedValueContainer } from './SingleSelectedValueContainer.js';

package/esm/ComboBox/v3/parts/single-selected-value-container/styled.js

@@ -0,0 +1,7 @@
+import styled from 'styled-components';
+
+const StyledSingleSelectedValue = /*#__PURE__*/styled.div.withConfig({
+  componentId: "sc-ui9n59-0"
+})(["width:100%;display:flex;align-items:center;"]);
+
+export { StyledSingleSelectedValue };

package/esm/ComboBox/v3/propTypes.js

@@ -0,0 +1,21 @@
+import { PropTypes } from 'react-desc';
+
+const propTypes = {
+  placeholder: PropTypes.string.description('input s placeholder value').defaultValue(''),
+  options: PropTypes.oneOfType([PropTypes.array, PropTypes.object]).description('List of options').defaultValue([]),
+  selectedValues: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.object), PropTypes.object]).description('Array of option or single option selected'),
+  autoFocus: PropTypes.bool.description('Whether the combo box uses auto focus or not').defaultValue('false'),
+  hasError: PropTypes.bool.description('Whether the combo box has error or not').defaultValue('false'),
+  onChange: PropTypes.func.description('function triggered when an option is selected it will send the options selected').defaultValue(''),
+  onSelectAll: PropTypes.func.description('function triggered when ALL button is selected from the header menu list').defaultValue(''),
+  onFilter: PropTypes.func.description('function triggered when user type in the combobox input').defaultValue(''),
+  onCreate: PropTypes.func.description('function triggered when user select "create" a new item whenever is not a match in the all option list').defaultValue(''),
+  onClearAll: PropTypes.func.description('function triggered when user select CLEAR button from the header menu list').defaultValue(''),
+  onMenuOpen: PropTypes.func.description('function triggered when user open the menu list').defaultValue(''),
+  inputMinWidth: PropTypes.any.description('Minimum width for the combo box input controller').defaultValue(undefined),
+  menuMinWidth: PropTypes.any.description('Minimum width for the dropdown menu').defaultValue(undefined),
+  menuMaxHeight: PropTypes.any.description('Maximum height for the dropdown menu').defaultValue(undefined),
+  withToggle: PropTypes.bool.description('POC purpose this prop will not remain').defaultValue('false')
+};
+
+export { propTypes };

package/esm/ComboBox/v3/utils/hooks/useKeyboardNavigation.js

@@ -0,0 +1,148 @@
+import 'core-js/modules/esnext.async-iterator.find.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.find.js';
+import { useContext, useCallback } from 'react';
+import { ComboBoxContext } from '../../ComboBoxCTX.js';
+import { getOptions, findInCircularList } from '../listHelper.js';
+
+const isOptionFocuseable = opt => !['section', 'separator'].includes(opt.type);
+
+const useKeyboardNavigation = () => {
+  const {
+    props: {
+      inline,
+      onSelectAll,
+      onKeyDown,
+      onChange,
+      onCreate,
+      options,
+      selectedValues,
+      onFilter
+    },
+    setShowPopover,
+    showPopover,
+    setShowSelectedValue,
+    focusOptionIdx,
+    inputRef,
+    setCurrentOption,
+    scrollOptionIntoView
+  } = useContext(ComboBoxContext);
+  const multiple = Array.isArray(selectedValues);
+  const selectableOptions = getOptions(options);
+  const currentItemIndex = options.findIndex(opt => opt.dsId === focusOptionIdx);
+  const currentItem = options.find(item => item.dsId === focusOptionIdx);
+  const selectOption = useCallback(() => {
+    if (multiple) {
+      if (inputRef.current) onFilter(inputRef.current.value);
+    } else {
+      onFilter('');
+      if (inputRef.current) inputRef.current.value = '';
+      setShowSelectedValue(true);
+    }
+
+    onChange(options.find(item => item.dsId === focusOptionIdx));
+    setShowPopover(multiple ? true : !showPopover);
+  }, [multiple, options, focusOptionIdx, setShowPopover, showPopover, onFilter, inputRef, setShowSelectedValue, onChange]);
+  const onInputKeyDown = useCallback(e => {
+    const targetElement = e.target; // =============================================================================
+    // CUSTOM KEYS
+    // =============================================================================
+
+    onKeyDown(e, currentItem); // =============================================================================
+    // ENTER KEY TO CREATE ELEMENTS
+    // ======================================================      =================
+
+    if (e.key === 'Enter' && onCreate && !selectableOptions.length) {
+      onCreate(targetElement.value);
+      onFilter('');
+      if (inputRef.current) inputRef.current.value = '';
+      return;
+    } // =============================================================================
+    // ENTER AND SPACE KEY SELECT OPTIONS AND OPEN CLOSE THE POPOVER
+    // =============================================================================
+
+
+    if (e.keyCode === 32 && targetElement.value === '' || e.key === 'Enter') {
+      e.preventDefault();
+
+      if (!showPopover && !inline) {
+        setShowPopover(true);
+      } else {
+        selectOption();
+      }
+    } // =============================================================================
+    // CTRL + ENTER + MULTIPLE: SELECT AND CLOSE MENU
+    // =============================================================================
+
+
+    if (e.key === 'Enter' && e.ctrlKey && multiple) {
+      setShowPopover(false);
+    }
+
+    if (e.key === 'a' && e.ctrlKey && multiple) {
+      onSelectAll();
+    } // =============================================================================
+    // ARROWS UP AND DOWN
+    // =============================================================================
+
+
+    if (e.key === 'ArrowDown') {
+      e.preventDefault();
+
+      if (showPopover || inline) {
+        const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable);
+        setCurrentOption(options[nextItemIndex].dsId);
+        scrollOptionIntoView(options[nextItemIndex].dsId);
+      } else {
+        setShowPopover(true);
+      }
+    }
+
+    if (e.key === 'ArrowUp') {
+      e.preventDefault();
+
+      if (showPopover || inline) {
+        const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable, -1);
+        setCurrentOption(options[nextItemIndex].dsId);
+        scrollOptionIntoView(options[nextItemIndex].dsId);
+      } else {
+        setShowPopover(true);
+        setTimeout(() => {
+          const nextItemIndex = findInCircularList(options, 0, isOptionFocuseable, -1);
+          setCurrentOption(options[nextItemIndex].dsId);
+          scrollOptionIntoView(options[nextItemIndex].dsId);
+        });
+      }
+    } // =============================================================================
+    // ESCAPE
+    // =============================================================================
+
+
+    if (e.key === 'Escape' && !inline) {
+      setShowPopover(false); // TODO confirm funcionality
+      // onFilter('');
+      // inputRef.current.value = '';
+    } // =============================================================================
+    // BACKSPACE
+    // =============================================================================
+
+
+    if (e.key === 'Backspace' && targetElement.value.length <= 0 && !inline) {
+      if (multiple && !targetElement.value) {
+        if (selectedValues.length > 0) onChange(selectedValues[selectedValues.length - 1]);
+      } else {
+        onChange(null);
+      }
+
+      onFilter('');
+      setShowSelectedValue(true);
+    }
+
+    if (e.key === 'Tab' && inline) ;
+  }, [scrollOptionIntoView, currentItemIndex, options, currentItem, selectableOptions, inputRef, multiple, showPopover, selectedValues, inline, onKeyDown, onSelectAll, onChange, onCreate, onFilter, setCurrentOption, setShowPopover, setShowSelectedValue, selectOption]);
+  return {
+    onInputKeyDown
+  };
+};
+
+export { useKeyboardNavigation };

package/esm/ComboBox/v3/utils/hooks/useOnElementResize.js

@@ -0,0 +1,33 @@
+import 'core-js/modules/web.dom-collections.iterator.js';
+import { useState, useRef, useEffect, useMemo } from 'react';
+
+// Taken and modified from https://stackoverflow.com/a/60218754
+
+const useOnElementResize = targetRef => {
+  var _targetRef$current, _targetRef$current2;
+
+  const [width, setWidth] = useState(targetRef.current ? (_targetRef$current = targetRef.current) === null || _targetRef$current === void 0 ? void 0 : _targetRef$current.offsetWidth : 0);
+  const [height, setHeight] = useState(targetRef.current ? (_targetRef$current2 = targetRef.current) === null || _targetRef$current2 === void 0 ? void 0 : _targetRef$current2.offsetWidth : 0);
+  const observer = useRef(null);
+  useEffect(() => {
+    function outputsize() {
+      if (targetRef.current) {
+        setWidth(targetRef.current.offsetWidth);
+        setHeight(targetRef.current.offsetHeight);
+      }
+    }
+
+    observer.current = new ResizeObserver(outputsize).observe(targetRef.current);
+    return () => {
+      var _observer$current;
+
+      (_observer$current = observer.current) === null || _observer$current === void 0 ? void 0 : _observer$current.disconnect();
+    };
+  }, [targetRef]);
+  return useMemo(() => ({
+    width,
+    height
+  }), [width, height]);
+};
+
+export { useOnElementResize };

package/esm/ComboBox/v3/utils/listHelper.js

@@ -0,0 +1,30 @@
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.some.js';
+import 'core-js/modules/esnext.iterator.some.js';
+
+const getSelectableOptions = options => options ? options.filter(option => option.type === 'option' && !option.disabled) : [];
+const getOptions = options => options ? options.filter(option => option.type === 'option') : [];
+const isSelectedValueEmpty = value => Array.isArray(value) ? value.length === 0 : !value;
+const isSelectedValueMultiple = value => Array.isArray(value);
+const isSelected = (value, activeOption) => {
+  if (isSelectedValueMultiple(value)) {
+    const multiValue = value;
+    return multiValue.some(item => (item === null || item === void 0 ? void 0 : item.value) === (activeOption === null || activeOption === void 0 ? void 0 : activeOption.value));
+  }
+
+  const singleValue = value;
+  return (singleValue === null || singleValue === void 0 ? void 0 : singleValue.value) === activeOption.value;
+};
+const findInCircularList = function (list, from, criteria) {
+  let step = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1;
+
+  for (let i = (from + step + list.length) % list.length; i !== from; i = (i + step + list.length) % list.length) {
+    if (criteria(list[i])) return i;
+  }
+
+  return from; // return same item
+};
+
+export { findInCircularList, getOptions, getSelectableOptions, isSelected, isSelectedValueEmpty, isSelectedValueMultiple };

package/esm/ComboBoxFreeSolo/ComboBoxFreeSolo.js

@@ -9,6 +9,7 @@ import 'react';
 import { noop } from 'lodash';
 import '../ComboBox/v1/DSComboBox.js';
 import { DSComboBox2 } from '../ComboBox/v2/Combobox.js';
+import '../ComboBox/v3/ComboBox.js';
 import { MultiValueLabel } from './components/MultiValueLabel.js';
 import { MultiValueRemove } from './components/MultiValueRemove.js';
 import { SingleValue } from './components/SingleValue.js';

package/esm/index.js

@@ -2,6 +2,7 @@ export { CheckboxWithSchema, DSCheckbox } from './Checkbox/DSCheckbox.js';
 export { DSCheckboxGroup, DSCheckboxGroupWithSchema } from './CheckboxGroup/DSCheckboxGroup.js';
 import './ComboBox/v1/DSComboBox.js';
 export { ComboBoxWithSchema, DSComboBox2 as DSComboBox, DSComboBox2 } from './ComboBox/v2/Combobox.js';
+export { DSComboBoxWithSchema } from './ComboBox/v3/ComboBox.js';
 export { default as ComboBoxFreeSolo } from './ComboBoxFreeSolo/ComboBoxFreeSolo.js';
 export { default as DSDateInput, DSDateInputWithSchema } from './DateInput/DSDateInput.js';
 export { DateInputs as DateInputsV2Impl } from './DateInputV2/components/DateInputs.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-form",
-  "version": "2.1.0-rc.7",
+  "version": "2.2.0-alpha.1",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Form",
   "module": "./esm/index.js",
@@ -511,6 +511,190 @@
       "import": "./esm/ComboBoxFreeSolo/ComboBoxFreeSolo.js",
       "require": "./cjs/ComboBoxFreeSolo/ComboBoxFreeSolo.js"
     },
+    "./ComboBox/v3/utils/listHelper": {
+      "import": "./esm/ComboBox/v3/utils/listHelper.js",
+      "require": "./cjs/ComboBox/v3/utils/listHelper.js"
+    },
+    "./ComboBox/v3/utils/hooks/useOnElementResize": {
+      "import": "./esm/ComboBox/v3/utils/hooks/useOnElementResize.js",
+      "require": "./cjs/ComboBox/v3/utils/hooks/useOnElementResize.js"
+    },
+    "./ComboBox/v3/utils/hooks/useKeyboardNavigation": {
+      "import": "./esm/ComboBox/v3/utils/hooks/useKeyboardNavigation.js",
+      "require": "./cjs/ComboBox/v3/utils/hooks/useKeyboardNavigation.js"
+    },
+    "./ComboBox/v3/tests/utils": {
+      "import": "./esm/ComboBox/v3/tests/utils.js",
+      "require": "./cjs/ComboBox/v3/tests/utils.js"
+    },
+    "./ComboBox/v3/propTypes": {
+      "import": "./esm/ComboBox/v3/propTypes.js",
+      "require": "./cjs/ComboBox/v3/propTypes.js"
+    },
+    "./ComboBox/v3/parts/single-selected-value-container/styled": {
+      "import": "./esm/ComboBox/v3/parts/single-selected-value-container/styled.js",
+      "require": "./cjs/ComboBox/v3/parts/single-selected-value-container/styled.js"
+    },
+    "./ComboBox/v3/parts/single-selected-value-container/SingleSelectedValueContainer": {
+      "import": "./esm/ComboBox/v3/parts/single-selected-value-container/SingleSelectedValueContainer.js",
+      "require": "./cjs/ComboBox/v3/parts/single-selected-value-container/SingleSelectedValueContainer.js"
+    },
+    "./ComboBox/v3/parts/single-selected-value-container": {
+      "import": "./esm/ComboBox/v3/parts/single-selected-value-container/index.js",
+      "require": "./cjs/ComboBox/v3/parts/single-selected-value-container/index.js"
+    },
+    "./ComboBox/v3/parts/multi-selected-values-container/useGroupPills": {
+      "import": "./esm/ComboBox/v3/parts/multi-selected-values-container/useGroupPills.js",
+      "require": "./cjs/ComboBox/v3/parts/multi-selected-values-container/useGroupPills.js"
+    },
+    "./ComboBox/v3/parts/multi-selected-values-container/styled": {
+      "import": "./esm/ComboBox/v3/parts/multi-selected-values-container/styled.js",
+      "require": "./cjs/ComboBox/v3/parts/multi-selected-values-container/styled.js"
+    },
+    "./ComboBox/v3/parts/multi-selected-values-container/MultiSelectedValuesContainer": {
+      "import": "./esm/ComboBox/v3/parts/multi-selected-values-container/MultiSelectedValuesContainer.js",
+      "require": "./cjs/ComboBox/v3/parts/multi-selected-values-container/MultiSelectedValuesContainer.js"
+    },
+    "./ComboBox/v3/parts/multi-selected-values-container": {
+      "import": "./esm/ComboBox/v3/parts/multi-selected-values-container/index.js",
+      "require": "./cjs/ComboBox/v3/parts/multi-selected-values-container/index.js"
+    },
+    "./ComboBox/v3/parts/menu-list/useMenuList": {
+      "import": "./esm/ComboBox/v3/parts/menu-list/useMenuList.js",
+      "require": "./cjs/ComboBox/v3/parts/menu-list/useMenuList.js"
+    },
+    "./ComboBox/v3/parts/menu-list/useItemRenderer": {
+      "import": "./esm/ComboBox/v3/parts/menu-list/useItemRenderer.js",
+      "require": "./cjs/ComboBox/v3/parts/menu-list/useItemRenderer.js"
+    },
+    "./ComboBox/v3/parts/menu-list/styled": {
+      "import": "./esm/ComboBox/v3/parts/menu-list/styled.js",
+      "require": "./cjs/ComboBox/v3/parts/menu-list/styled.js"
+    },
+    "./ComboBox/v3/parts/menu-list/MenuList": {
+      "import": "./esm/ComboBox/v3/parts/menu-list/MenuList.js",
+      "require": "./cjs/ComboBox/v3/parts/menu-list/MenuList.js"
+    },
+    "./ComboBox/v3/parts/menu-list": {
+      "import": "./esm/ComboBox/v3/parts/menu-list/index.js",
+      "require": "./cjs/ComboBox/v3/parts/menu-list/index.js"
+    },
+    "./ComboBox/v3/parts/header-list/useHeaderListHandlers": {
+      "import": "./esm/ComboBox/v3/parts/header-list/useHeaderListHandlers.js",
+      "require": "./cjs/ComboBox/v3/parts/header-list/useHeaderListHandlers.js"
+    },
+    "./ComboBox/v3/parts/header-list/styled": {
+      "import": "./esm/ComboBox/v3/parts/header-list/styled.js",
+      "require": "./cjs/ComboBox/v3/parts/header-list/styled.js"
+    },
+    "./ComboBox/v3/parts/header-list": {
+      "import": "./esm/ComboBox/v3/parts/header-list/index.js",
+      "require": "./cjs/ComboBox/v3/parts/header-list/index.js"
+    },
+    "./ComboBox/v3/parts/header-list/HeaderList": {
+      "import": "./esm/ComboBox/v3/parts/header-list/HeaderList.js",
+      "require": "./cjs/ComboBox/v3/parts/header-list/HeaderList.js"
+    },
+    "./ComboBox/v3/parts/empty-state/styled": {
+      "import": "./esm/ComboBox/v3/parts/empty-state/styled.js",
+      "require": "./cjs/ComboBox/v3/parts/empty-state/styled.js"
+    },
+    "./ComboBox/v3/parts/empty-state": {
+      "import": "./esm/ComboBox/v3/parts/empty-state/index.js",
+      "require": "./cjs/ComboBox/v3/parts/empty-state/index.js"
+    },
+    "./ComboBox/v3/parts/dropdown-indicator/styled": {
+      "import": "./esm/ComboBox/v3/parts/dropdown-indicator/styled.js",
+      "require": "./cjs/ComboBox/v3/parts/dropdown-indicator/styled.js"
+    },
+    "./ComboBox/v3/parts/dropdown-indicator": {
+      "import": "./esm/ComboBox/v3/parts/dropdown-indicator/index.js",
+      "require": "./cjs/ComboBox/v3/parts/dropdown-indicator/index.js"
+    },
+    "./ComboBox/v3/parts/dropdown-indicator/DropdownIndicator": {
+      "import": "./esm/ComboBox/v3/parts/dropdown-indicator/DropdownIndicator.js",
+      "require": "./cjs/ComboBox/v3/parts/dropdown-indicator/DropdownIndicator.js"
+    },
+    "./ComboBox/v3/parts/controls/styled": {
+      "import": "./esm/ComboBox/v3/parts/controls/styled.js",
+      "require": "./cjs/ComboBox/v3/parts/controls/styled.js"
+    },
+    "./ComboBox/v3/parts/controls": {
+      "import": "./esm/ComboBox/v3/parts/controls/index.js",
+      "require": "./cjs/ComboBox/v3/parts/controls/index.js"
+    },
+    "./ComboBox/v3/parts/controls/Controls": {
+      "import": "./esm/ComboBox/v3/parts/controls/Controls.js",
+      "require": "./cjs/ComboBox/v3/parts/controls/Controls.js"
+    },
+    "./ComboBox/v3/parts/controls-input/useControlsInput": {
+      "import": "./esm/ComboBox/v3/parts/controls-input/useControlsInput.js",
+      "require": "./cjs/ComboBox/v3/parts/controls-input/useControlsInput.js"
+    },
+    "./ComboBox/v3/parts/controls-input/styled": {
+      "import": "./esm/ComboBox/v3/parts/controls-input/styled.js",
+      "require": "./cjs/ComboBox/v3/parts/controls-input/styled.js"
+    },
+    "./ComboBox/v3/parts/controls-input/ControlsInput": {
+      "import": "./esm/ComboBox/v3/parts/controls-input/ControlsInput.js",
+      "require": "./cjs/ComboBox/v3/parts/controls-input/ControlsInput.js"
+    },
+    "./ComboBox/v3/parts/container/styled": {
+      "import": "./esm/ComboBox/v3/parts/container/styled.js",
+      "require": "./cjs/ComboBox/v3/parts/container/styled.js"
+    },
+    "./ComboBox/v3/parts/container": {
+      "import": "./esm/ComboBox/v3/parts/container/index.js",
+      "require": "./cjs/ComboBox/v3/parts/container/index.js"
+    },
+    "./ComboBox/v3/parts/container/Container": {
+      "import": "./esm/ComboBox/v3/parts/container/Container.js",
+      "require": "./cjs/ComboBox/v3/parts/container/Container.js"
+    },
+    "./ComboBox/v3/parts/a11y-messages/styled": {
+      "import": "./esm/ComboBox/v3/parts/a11y-messages/styled.js",
+      "require": "./cjs/ComboBox/v3/parts/a11y-messages/styled.js"
+    },
+    "./ComboBox/v3/parts/a11y-messages/SingleAllyMessages": {
+      "import": "./esm/ComboBox/v3/parts/a11y-messages/SingleAllyMessages.js",
+      "require": "./cjs/ComboBox/v3/parts/a11y-messages/SingleAllyMessages.js"
+    },
+    "./ComboBox/v3/parts/a11y-messages/MultiAllyMessages": {
+      "import": "./esm/ComboBox/v3/parts/a11y-messages/MultiAllyMessages.js",
+      "require": "./cjs/ComboBox/v3/parts/a11y-messages/MultiAllyMessages.js"
+    },
+    "./ComboBox/v3/parts/a11y-messages": {
+      "import": "./esm/ComboBox/v3/parts/a11y-messages/index.js",
+      "require": "./cjs/ComboBox/v3/parts/a11y-messages/index.js"
+    },
+    "./ComboBox/v3": {
+      "import": "./esm/ComboBox/v3/index.js",
+      "require": "./cjs/ComboBox/v3/index.js"
+    },
+    "./ComboBox/v3/config/useGetPropsWithDefault": {
+      "import": "./esm/ComboBox/v3/config/useGetPropsWithDefault.js",
+      "require": "./cjs/ComboBox/v3/config/useGetPropsWithDefault.js"
+    },
+    "./ComboBox/v3/config/useComboBox": {
+      "import": "./esm/ComboBox/v3/config/useComboBox.js",
+      "require": "./cjs/ComboBox/v3/config/useComboBox.js"
+    },
+    "./ComboBox/v3/config/constants": {
+      "import": "./esm/ComboBox/v3/config/constants.js",
+      "require": "./cjs/ComboBox/v3/config/constants.js"
+    },
+    "./ComboBox/v3/ComboboxDataTestids": {
+      "import": "./esm/ComboBox/v3/ComboboxDataTestids.js",
+      "require": "./cjs/ComboBox/v3/ComboboxDataTestids.js"
+    },
+    "./ComboBox/v3/ComboBoxCTX": {
+      "import": "./esm/ComboBox/v3/ComboBoxCTX.js",
+      "require": "./cjs/ComboBox/v3/ComboBoxCTX.js"
+    },
+    "./ComboBox/v3/ComboBox": {
+      "import": "./esm/ComboBox/v3/ComboBox.js",
+      "require": "./cjs/ComboBox/v3/ComboBox.js"
+    },
     "./ComboBox/v2/mockOptions": {
       "import": "./esm/ComboBox/v2/mockOptions.js",
       "require": "./cjs/ComboBox/v2/mockOptions.js"
@@ -748,28 +932,28 @@
     "build": "node ../../scripts/build/build.js"
   },
   "dependencies": {
-    "@elliemae/ds-button": "2.1.0-rc.7",
-    "@elliemae/ds-circular-progress-indicator": "2.1.0-rc.7",
-    "@elliemae/ds-classnames": "2.1.0-rc.7",
-    "@elliemae/ds-controlled-form": "2.1.0-rc.7",
-    "@elliemae/ds-dropdownmenu": "2.1.0-rc.7",
-    "@elliemae/ds-form": "2.1.0-rc.7",
-    "@elliemae/ds-grid": "2.1.0-rc.7",
-    "@elliemae/ds-icon": "2.1.0-rc.7",
-    "@elliemae/ds-icons": "2.1.0-rc.7",
-    "@elliemae/ds-menu": "2.1.0-rc.7",
-    "@elliemae/ds-overlay": "2.1.0-rc.7",
-    "@elliemae/ds-pills": "2.1.0-rc.7",
-    "@elliemae/ds-popper": "2.1.0-rc.7",
-    "@elliemae/ds-popperjs": "2.1.0-rc.7",
-    "@elliemae/ds-props-helpers": "2.1.0-rc.7",
-    "@elliemae/ds-separator": "2.1.0-rc.7",
-    "@elliemae/ds-shared": "2.1.0-rc.7",
-    "@elliemae/ds-system": "2.1.0-rc.7",
-    "@elliemae/ds-text-wrapper": "2.1.0-rc.7",
-    "@elliemae/ds-tooltip": "2.1.0-rc.7",
-    "@elliemae/ds-truncated-tooltip-text": "2.1.0-rc.7",
-    "@elliemae/ds-utilities": "2.1.0-rc.7",
+    "@elliemae/ds-button": "2.2.0-alpha.1",
+    "@elliemae/ds-circular-progress-indicator": "2.2.0-alpha.1",
+    "@elliemae/ds-classnames": "2.2.0-alpha.1",
+    "@elliemae/ds-controlled-form": "2.2.0-alpha.1",
+    "@elliemae/ds-dropdownmenu": "2.2.0-alpha.1",
+    "@elliemae/ds-form": "2.2.0-alpha.1",
+    "@elliemae/ds-grid": "2.2.0-alpha.1",
+    "@elliemae/ds-icon": "2.2.0-alpha.1",
+    "@elliemae/ds-icons": "2.2.0-alpha.1",
+    "@elliemae/ds-menu": "2.2.0-alpha.1",
+    "@elliemae/ds-overlay": "2.2.0-alpha.1",
+    "@elliemae/ds-pills": "2.2.0-alpha.1",
+    "@elliemae/ds-popper": "2.2.0-alpha.1",
+    "@elliemae/ds-popperjs": "2.2.0-alpha.1",
+    "@elliemae/ds-props-helpers": "2.2.0-alpha.1",
+    "@elliemae/ds-separator": "2.2.0-alpha.1",
+    "@elliemae/ds-shared": "2.2.0-alpha.1",
+    "@elliemae/ds-system": "2.2.0-alpha.1",
+    "@elliemae/ds-text-wrapper": "2.2.0-alpha.1",
+    "@elliemae/ds-tooltip": "2.2.0-alpha.1",
+    "@elliemae/ds-truncated-tooltip-text": "2.2.0-alpha.1",
+    "@elliemae/ds-utilities": "2.2.0-alpha.1",
     "memoize-one": "~5.1.1",
     "moment": "~2.29.1",
     "prop-types": "~15.7.2",

package/types/ComboBox/index.d.ts

@@ -1,3 +1,4 @@
 export * from './v1/DSComboBox';
 export * from './v2';
 export { default } from './v2';
+export * from './v3';