@elliemae/ds-controlled-form 2.3.0-next.8 → 2.3.0-rc.3

package/esm/controlled-combobox/parts/container/Container.js

@@ -27,45 +27,31 @@ const Container = () => {
   const {
     props,
     showPopover,
-    innerRef,
     setReferenceElement,
-    setShowPopover,
     referenceElement
   } = useContext(ComboBoxContext);
   const {
     inline,
-    disabled,
     startPlacementPreference,
     placementOrderPreference,
     withoutPortal,
     zIndex
   } = props;
-  const handleCloseMenu = useCallback(() => {
-    setShowPopover(false);
-    if (innerRef.current) innerRef.current.blur();
-  }, [innerRef, setShowPopover]);
   const handleMouseDown = useCallback(e => {
     e.preventDefault();
   }, []);
-  const handleOnClickContainer = useCallback(() => {
-    if (!disabled) setShowPopover(!showPopover);
-  }, [setShowPopover, disabled, showPopover]);
   const StyledContainer = inline ? StyledContainerInline : StyledContainerWithPopper;
-  const globalAttributes = useGetGlobalAttributes(props, {
-    onClick: handleOnClickContainer
-  }); // Removing possible collisionable props
+  const globalAttributes = useGetGlobalAttributes(props); // Removing possible collisionable props
 
   const rest = _objectWithoutProperties(globalAttributes, _excluded);
 
   return /*#__PURE__*/jsxs(Fragment, {
     children: [/*#__PURE__*/jsxs(StyledContainer, _objectSpread(_objectSpread({
-      ref: setReferenceElement,
-      onClick: handleOnClickContainer
+      ref: setReferenceElement
     }, rest), {}, {
       children: [_Controls || (_Controls = /*#__PURE__*/_jsx(Controls, {})), inline ? _MenuList || (_MenuList = /*#__PURE__*/_jsx(MenuList, {})) : null]
     })), !inline ? /*#__PURE__*/_jsx(DSPopperJS, {
       customOffset: [0, 5],
-      closeContextMenu: handleCloseMenu,
       referenceElement: referenceElement,
       showPopover: showPopover,
       startPlacementPreference: startPlacementPreference,

package/esm/controlled-combobox/parts/controls/Controls.js

@@ -41,6 +41,7 @@ const Controls = () => {
       var _innerRef$current2;
 
       (_innerRef$current2 = innerRef.current) === null || _innerRef$current2 === void 0 ? void 0 : _innerRef$current2.focus();
+      setShowPopover(true);
     }
   }, [hasFocus, setShowPopover, showPopover, innerRef, inline]);
 

package/esm/controlled-combobox/parts/controls-input/ControlsInput.js

@@ -15,7 +15,8 @@ const ControlsInput = () => {
       disabled,
       innerRef
     },
-    focusOptionIdx
+    focusOptionIdx,
+    showPopover
   } = useContext(ComboBoxContext);
   const {
     onInputKeyDown
@@ -38,10 +39,11 @@ const ControlsInput = () => {
     "data-testid": ComboboxDataTestid.INPUT,
     autoFocus: autoFocus,
     id: "combo-input",
-    "aria-owns": "combo-listbox",
+    "aria-controls": "combo-listbox",
     "aria-activedescendant": focusOptionIdx,
-    "aria-expanded": "false",
+    "aria-expanded": showPopover,
     "aria-haspopup": "true",
+    "aria-describedby": "combobox-selected-items",
     role: "combobox",
     disabled: disabled,
     style: {

package/esm/controlled-combobox/parts/controls-input/useControlsInput.js

@@ -17,6 +17,7 @@ const useControlsInput = () => {
     },
     setShowPopover,
     setCurrentOption,
+    showSelectedOptions,
     wrapperListRef,
     setHasFocus,
     setShowSelectedOptions
@@ -48,12 +49,13 @@ const useControlsInput = () => {
 
       if (!(wrapperListRef !== null && wrapperListRef !== void 0 && (_wrapperListRef$curre = wrapperListRef.current) !== null && _wrapperListRef$curre !== void 0 && _wrapperListRef$curre.contains(document.activeElement))) {
         setShowPopover(false);
+        if (showSelectedOptions) setShowSelectedOptions(false);
       }
 
       setCurrentOption('');
       onFilter('');
     });
-  }, [setHasFocus, setCurrentOption, wrapperListRef, onFilter, innerRef, setShowPopover]);
+  }, [setHasFocus, showSelectedOptions, setShowSelectedOptions, setCurrentOption, wrapperListRef, onFilter, innerRef, setShowPopover]);
   const handleOnFocus = useCallback(() => {
     setHasFocus(true);
   }, [setHasFocus]);

package/esm/controlled-combobox/parts/header-list/HeaderList.js

@@ -29,6 +29,7 @@ const HeaderList = () => {
   const {
     handleKeyDown,
     handleOnMouseDown,
+    handleFilterSelectionBtnOnBlur,
     handleToggle,
     checkboxStatus,
     handleSelectAllCheckboxChange
@@ -38,9 +39,9 @@ const HeaderList = () => {
     onMouseDown: handleOnMouseDown
   }, void 0, /*#__PURE__*/_jsx(StyledSelectAllCheckbox, {}, void 0, isSelectAllSupplied && isClearAllSupplied && /*#__PURE__*/_jsx(DSControlledCheckbox, {
     checked: checkboxStatus,
-    ariaControls: checkboxStatus === 'mixed' ? multiSelectedValues.map(item => item.dsId).join(' ') : '',
+    "aria-controls": checkboxStatus === 'mixed' ? multiSelectedValues.map(item => item.dsId).join(' ') : '',
     name: "select-all-checkbox",
-    ariaLabel: "Select/Unselect All Items",
+    "aria-label": "Select/Unselect All Items",
     id: "select-all-checkbox",
     onChange: handleSelectAllCheckboxChange,
     "data-testid": ComboboxDataTestid.SELECT_ALL_CHECKBOX,
@@ -55,13 +56,7 @@ const HeaderList = () => {
     },
     innerRef: selectAllCheckboxRef
   })), /*#__PURE__*/_jsx(StyledSelectedItems, {}, void 0, multiSelectedValues.length > 0 ? /*#__PURE__*/_jsx(StyledButtonSelection, {
-    onBlur: () => {
-      setTimeout(() => {
-        var _innerRef$current2;
-
-        return (_innerRef$current2 = innerRef.current) === null || _innerRef$current2 === void 0 ? void 0 : _innerRef$current2.focus();
-      });
-    },
+    onBlur: handleFilterSelectionBtnOnBlur,
     buttonType: "text",
     onClick: handleToggle,
     labelText: !showSelectedOptions ? "SHOW SELECTED [".concat(multiSelectedValues.length, "]") : 'SHOW ALL',

package/esm/controlled-combobox/parts/header-list/useHeaderListHandlers.js

@@ -49,6 +49,12 @@ const useHeaderListHandlers = () => {
       setShowPopover(false);
     }
   }, [setShowPopover]);
+  const handleFilterSelectionBtnOnBlur = useCallback(() => {
+    var _innerRef$current;
+
+    if (showSelectedOptions) setShowSelectedOptions(false);
+    (_innerRef$current = innerRef.current) === null || _innerRef$current === void 0 ? void 0 : _innerRef$current.focus();
+  }, [setShowSelectedOptions, showSelectedOptions, innerRef]);
   useEffect(() => {
     if (multiSelectedValues.length === 0) {
       setShowSelectedOptions(false);
@@ -57,10 +63,11 @@ const useHeaderListHandlers = () => {
   return useMemo(() => ({
     handleKeyDown,
     handleToggle,
+    handleFilterSelectionBtnOnBlur,
     handleOnMouseDown,
     handleSelectAllCheckboxChange,
     checkboxStatus
-  }), [handleKeyDown, handleToggle, handleOnMouseDown, checkboxStatus, handleSelectAllCheckboxChange]);
+  }), [handleKeyDown, handleFilterSelectionBtnOnBlur, handleToggle, handleOnMouseDown, checkboxStatus, handleSelectAllCheckboxChange]);
 };
 
 export { useHeaderListHandlers };

package/esm/controlled-combobox/parts/menu-list/MenuList.js

@@ -1,17 +1,16 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import { useContext, useMemo } from 'react';
 import { noop } from 'lodash';
-import { StyledListWrapper, StyledVirtualListWrapper, StyledList } from './styled.js';
+import { StyledListWrapper, StyledVirtualListWrapper, StyledList, StyledNoResultsWrapper } from './styled.js';
 import { ComboboxDataTestid } from '../../ComboboxDataTestids.js';
 import { ComboBoxContext } from '../../ComboBoxCTX.js';
 import { HeaderList } from '../header-list/HeaderList.js';
 import { useOnElementResize } from '../../utils/hooks/useOnElementResize.js';
-import { EmptyState } from '../empty-state/index.js';
 import { useItemRenderer } from './useItemRenderer.js';
 import { useMenuList } from './useMenuList.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 
-var _HeaderList, _EmptyState;
+var _HeaderList, _StyledNoResultsWrapp;
 
 const MenuList = () => {
   var _innerRef$current;
@@ -32,9 +31,6 @@ const MenuList = () => {
     controlsWrapperRef,
     virtualListHelpers
   } = useContext(ComboBoxContext);
-  const {
-    totalSize
-  } = virtualListHelpers;
   const isOnCreatedSupplied = onCreate !== noop;
   const multiple = Array.isArray(selectedValues);
   const withHeader = !inline && multiple && options.length > 0 && ((_innerRef$current = innerRef.current) === null || _innerRef$current === void 0 ? void 0 : _innerRef$current.value) === '';
@@ -44,12 +40,8 @@ const MenuList = () => {
     width
   } = useOnElementResize(controlsWrapperRef);
   const listWidth = useMemo(() => menuMinWidth || "".concat(referenceElement === null || referenceElement === void 0 ? void 0 : referenceElement.offsetWidth), // eslint-disable-next-line react-hooks/exhaustive-deps
-  [menuMinWidth, referenceElement, width]); // validate funcionality with ux
-  // const handleOnFocus = useCallback(() => {
-  //   // innerRef.current?.focus();
-  // }, [innerRef]);
-
-  return /*#__PURE__*/jsxs(StyledListWrapper, {
+  [menuMinWidth, referenceElement, width]);
+  const list = useMemo(() => /*#__PURE__*/jsxs(StyledListWrapper, {
     ref: wrapperListRef,
     inline: inline,
     onMouseDown: e => e.preventDefault(),
@@ -64,11 +56,16 @@ const MenuList = () => {
         role: "listbox",
         "data-testid": ComboboxDataTestid.LIST,
         style: {
-          height: totalSize,
+          height: virtualListHelpers === null || virtualListHelpers === void 0 ? void 0 : virtualListHelpers.totalSize,
           margin: inline ? '0px' : '8px 0px'
         }
       }, void 0, ItemRenderer)
-    }) : _EmptyState || (_EmptyState = /*#__PURE__*/_jsx(EmptyState, {}))]
+    }) : _StyledNoResultsWrapp || (_StyledNoResultsWrapp = /*#__PURE__*/_jsx(StyledNoResultsWrapper, {
+      id: "id-no-results"
+    }, void 0, "No matches found"))]
+  }), [ItemRenderer, inline, isOnCreatedSupplied, listRef, listWidth, menuMaxHeight, options.length, virtualListHelpers === null || virtualListHelpers === void 0 ? void 0 : virtualListHelpers.totalSize, withHeader, wrapperListRef]);
+  return /*#__PURE__*/jsx(Fragment, {
+    children: list
   });
 };
 

package/esm/controlled-combobox/parts/menu-list/styled.js

@@ -22,5 +22,8 @@ const StyledVirtualListWrapper = /*#__PURE__*/styled.div.withConfig({
 const StyledCreatableLabel = /*#__PURE__*/styled.span.withConfig({
   componentId: "sc-g2fmft-3"
 })(["font-weight:bold;font-style:italic;"]);
+const StyledNoResultsWrapper = /*#__PURE__*/styled.div.withConfig({
+  componentId: "sc-g2fmft-4"
+})(["padding:16px;"]);
 
-export { StyledCreatableLabel, StyledList, StyledListWrapper, StyledVirtualListWrapper };
+export { StyledCreatableLabel, StyledList, StyledListWrapper, StyledNoResultsWrapper, StyledVirtualListWrapper };

package/esm/controlled-combobox/parts/menu-list/useItemRenderer.js

@@ -36,9 +36,6 @@ const useItemRenderer = () => {
     focusOptionIdx,
     virtualListHelpers
   } = useContext(ComboBoxContext);
-  const {
-    virtualItems
-  } = virtualListHelpers;
   const multiple = Array.isArray(selectedValues);
   const CBItem = multiple ? MultiMenuItem : SingleMenuItem;
   const handleClick = useCallback((option, e) => {
@@ -66,7 +63,7 @@ const useItemRenderer = () => {
   const handleOnMouseDown = useCallback(e => {
     e.preventDefault();
   }, []);
-  const ItemRenderer = useMemo(() => virtualItems.map(vItem => {
+  const ItemRenderer = useMemo(() => virtualListHelpers === null || virtualListHelpers === void 0 ? void 0 : virtualListHelpers.virtualItems.map(vItem => {
     const option = options[vItem.index];
     const generalProps = {
       wrapperStyles: {
@@ -125,7 +122,7 @@ const useItemRenderer = () => {
     }
 
     return /*#__PURE__*/jsx(Fragment, {});
-  }), [options, focusOptionIdx, selectedValues, innerRef, virtualItems]);
+  }), [options, focusOptionIdx, selectedValues, innerRef, virtualListHelpers === null || virtualListHelpers === void 0 ? void 0 : virtualListHelpers.virtualItems]);
   return ItemRenderer;
 };
 

package/esm/controlled-combobox/parts/multi-selected-values-container/MultiSelectedValuesContainer.js

@@ -1,8 +1,7 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import 'core-js/modules/esnext.async-iterator.map.js';
 import 'core-js/modules/esnext.iterator.map.js';
-import { useContext, useMemo } from 'react';
-import Grid from '@elliemae/ds-grid';
+import { useContext, useCallback, useMemo } from 'react';
 import { DSPillGroupV2, DSPillV2 } from '@elliemae/ds-pills';
 import { ComboBoxContext } from '../../ComboBoxCTX.js';
 import { useGroupPills } from './useGroupPills.js';
@@ -16,17 +15,29 @@ const MultiSelectedValuesContainer = () => {
       onChange,
       innerRef
     },
-    pillGroupRef
+    pillGroupRef,
+    showPopover,
+    setShowPopover
   } = useContext(ComboBoxContext);
   const multiSelectedValue = selectedValues;
   const correctPillsToShow = useGroupPills() || 1;
-  const pills = useMemo(() => /*#__PURE__*/_jsx(Grid, {
+  const handleClickOnPills = useCallback(e => {
+    if (!showPopover) {
+      var _innerRef$current;
+
+      setShowPopover(true);
+      (_innerRef$current = innerRef.current) === null || _innerRef$current === void 0 ? void 0 : _innerRef$current.focus();
+    }
+
+    e.stopPropagation();
+  }, [setShowPopover, innerRef, showPopover]);
+  const pills = useMemo(() => /*#__PURE__*/_jsx("div", {
     style: {
       width: 'max-content'
     },
-    onClick: e => e.stopPropagation(),
     "data-testid": ComboboxDataTestid.SELECTED_VALUES
   }, void 0, /*#__PURE__*/_jsx(DSPillGroupV2, {
+    onClick: handleClickOnPills,
     innerRef: pillGroupRef
   }, void 0, multiSelectedValue.length > 0 && multiSelectedValue.slice(0, correctPillsToShow).map(option => /*#__PURE__*/_jsx(DSPillV2, {
     size: "s",
@@ -34,17 +45,17 @@ const MultiSelectedValuesContainer = () => {
     type: "removable",
     tabIndex: -1,
     onRemove: () => {
-      var _innerRef$current;
+      var _innerRef$current2;
 
       onChange(option);
-      (_innerRef$current = innerRef.current) === null || _innerRef$current === void 0 ? void 0 : _innerRef$current.focus();
+      (_innerRef$current2 = innerRef.current) === null || _innerRef$current2 === void 0 ? void 0 : _innerRef$current2.focus();
     }
   }, option.value)), multiSelectedValue.length > 0 && correctPillsToShow !== multiSelectedValue.length && /*#__PURE__*/_jsx(DSPillV2, {
     size: "s",
     labelTruncated: false,
     label: "+".concat(multiSelectedValue.length - correctPillsToShow),
     type: "value"
-  }, "grouped"))), [pillGroupRef, innerRef, onChange, multiSelectedValue, correctPillsToShow]);
+  }, "grouped"))), [pillGroupRef, innerRef, onChange, handleClickOnPills, multiSelectedValue, correctPillsToShow]);
   return /*#__PURE__*/jsx(Fragment, {
     children: pills
   });

package/esm/controlled-combobox/react-desc-prop-types.js

@@ -11,7 +11,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 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(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 ComboboxPropTypes = _objectSpread(_objectSpread({}, globalAttributesPropTypes), {}, {
   placeholder: PropTypes.string.description('input s placeholder value').defaultValue(''),
-  options: PropTypes.oneOfType([PropTypes.array, PropTypes.object]).description('List of options').defaultValue([]),
+  options: PropTypes.oneOfType([PropTypes.array, PropTypes.object]).isRequired.description('List of options').defaultValue([]),
   selectedValues: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.object), PropTypes.object]).description('Array of option or single option selected'),
   disabled: PropTypes.bool.description('wheter or not the input is disabled').defaultValue('false'),
   autoFocus: PropTypes.bool.description('Whether the combo box uses auto focus or not').defaultValue('false'),

package/esm/controlled-combobox/utils/hooks/useKeyboardNavigation.js

@@ -24,7 +24,6 @@ const useKeyboardNavigation = () => {
     },
     setShowPopover,
     showPopover,
-    setShowSelectedValue,
     focusOptionIdx,
     setCurrentOption,
     scrollOptionIntoView,
@@ -40,13 +39,12 @@ const useKeyboardNavigation = () => {
     } else {
       onFilter('');
       if (innerRef.current) innerRef.current.value = '';
-      setShowSelectedValue(true);
     }
 
     const selectedOption = options.find(item => item.dsId === focusOptionIdx);
     onChange(selectedOption);
     if (!selectedOption.disabled && !multiple) setShowPopover(false);
-  }, [multiple, options, focusOptionIdx, setShowPopover, onFilter, innerRef, setShowSelectedValue, onChange]);
+  }, [multiple, options, focusOptionIdx, setShowPopover, onFilter, innerRef, onChange]);
   const onInputKeyDown = useCallback(e => {
     const targetElement = e.target; // =============================================================================
     // CUSTOM KEYS
@@ -146,7 +144,6 @@ const useKeyboardNavigation = () => {
       }
 
       onFilter('');
-      setShowSelectedValue(true);
     }
 
     if (e.key === 'Tab' && !inline && !withoutPortal) {
@@ -161,7 +158,7 @@ const useKeyboardNavigation = () => {
     } // if (e.key === 'Tab' && multiple) {
     // }
 
-  }, [currentItemIndex, options, currentItem, innerRef, multiple, showPopover, selectedValues, inline, scrollOptionIntoView, onKeyDown, onSelectAll, onChange, onCreate, onFilter, setCurrentOption, setShowPopover, setShowSelectedValue, selectOption, onCancel, selectAllCheckboxRef, toggleSelectionButtonRef, withoutPortal]);
+  }, [currentItemIndex, options, currentItem, innerRef, multiple, showPopover, selectedValues, inline, scrollOptionIntoView, onKeyDown, onSelectAll, onChange, onCreate, onFilter, setCurrentOption, setShowPopover, selectOption, onCancel, selectAllCheckboxRef, toggleSelectionButtonRef, withoutPortal]);
   return {
     onInputKeyDown
   };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-controlled-form",
-  "version": "2.3.0-next.8",
+  "version": "2.3.0-rc.3",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Controlled Form Controllers",
   "module": "./esm/index.js",
@@ -431,10 +431,6 @@
       "import": "./esm/controlled-combobox/parts/multi-selected-values-container/useGroupPills.js",
       "require": "./cjs/controlled-combobox/parts/multi-selected-values-container/useGroupPills.js"
     },
-    "./controlled-combobox/parts/multi-selected-values-container/styled": {
-      "import": "./esm/controlled-combobox/parts/multi-selected-values-container/styled.js",
-      "require": "./cjs/controlled-combobox/parts/multi-selected-values-container/styled.js"
-    },
     "./controlled-combobox/parts/multi-selected-values-container/MultiSelectedValuesContainer": {
       "import": "./esm/controlled-combobox/parts/multi-selected-values-container/MultiSelectedValuesContainer.js",
       "require": "./cjs/controlled-combobox/parts/multi-selected-values-container/MultiSelectedValuesContainer.js"
@@ -479,22 +475,10 @@
       "import": "./esm/controlled-combobox/parts/header-list/HeaderList.js",
       "require": "./cjs/controlled-combobox/parts/header-list/HeaderList.js"
     },
-    "./controlled-combobox/parts/empty-state/styled": {
-      "import": "./esm/controlled-combobox/parts/empty-state/styled.js",
-      "require": "./cjs/controlled-combobox/parts/empty-state/styled.js"
-    },
-    "./controlled-combobox/parts/empty-state": {
-      "import": "./esm/controlled-combobox/parts/empty-state/index.js",
-      "require": "./cjs/controlled-combobox/parts/empty-state/index.js"
-    },
     "./controlled-combobox/parts/dropdown-indicator/styled": {
       "import": "./esm/controlled-combobox/parts/dropdown-indicator/styled.js",
       "require": "./cjs/controlled-combobox/parts/dropdown-indicator/styled.js"
     },
-    "./controlled-combobox/parts/dropdown-indicator": {
-      "import": "./esm/controlled-combobox/parts/dropdown-indicator/index.js",
-      "require": "./cjs/controlled-combobox/parts/dropdown-indicator/index.js"
-    },
     "./controlled-combobox/parts/dropdown-indicator/DropdownIndicator": {
       "import": "./esm/controlled-combobox/parts/dropdown-indicator/DropdownIndicator.js",
       "require": "./cjs/controlled-combobox/parts/dropdown-indicator/DropdownIndicator.js"
@@ -591,9 +575,9 @@
       "import": "./esm/controlled-checkbox/styles.js",
       "require": "./cjs/controlled-checkbox/styles.js"
     },
-    "./controlled-checkbox/propTypes": {
-      "import": "./esm/controlled-checkbox/propTypes.js",
-      "require": "./cjs/controlled-checkbox/propTypes.js"
+    "./controlled-checkbox/react-desc-prop-types": {
+      "import": "./esm/controlled-checkbox/react-desc-prop-types.js",
+      "require": "./cjs/controlled-checkbox/react-desc-prop-types.js"
     },
     "./controlled-checkbox": {
       "import": "./esm/controlled-checkbox/index.js",
@@ -736,15 +720,15 @@
     "build": "node ../../scripts/build/build.js"
   },
   "dependencies": {
-    "@elliemae/ds-button": "2.3.0-next.8",
-    "@elliemae/ds-form-layout-blocks": "2.3.0-next.8",
-    "@elliemae/ds-grid": "2.3.0-next.8",
-    "@elliemae/ds-icon": "2.3.0-next.8",
-    "@elliemae/ds-icons": "2.3.0-next.8",
-    "@elliemae/ds-props-helpers": "2.3.0-next.8",
-    "@elliemae/ds-system": "2.3.0-next.8",
-    "@elliemae/ds-tooltip": "2.3.0-next.8",
-    "@elliemae/ds-truncated-tooltip-text": "2.3.0-next.8",
+    "@elliemae/ds-button": "2.3.0-rc.3",
+    "@elliemae/ds-form-layout-blocks": "2.3.0-rc.3",
+    "@elliemae/ds-grid": "2.3.0-rc.3",
+    "@elliemae/ds-icon": "2.3.0-rc.3",
+    "@elliemae/ds-icons": "2.3.0-rc.3",
+    "@elliemae/ds-props-helpers": "2.3.0-rc.3",
+    "@elliemae/ds-system": "2.3.0-rc.3",
+    "@elliemae/ds-tooltip": "2.3.0-rc.3",
+    "@elliemae/ds-truncated-tooltip-text": "2.3.0-rc.3",
     "prop-types": "~15.7.2",
     "react-desc": "~4.1.3",
     "react-popper": "~2.2.5",

package/types/controlled-checkbox/ControlledCheckbox.d.ts

@@ -1,71 +1,5 @@
-/// <reference path="../../../../../shared/typings/react-desc.d.ts" />
-/// <reference types="react" />
-import type { DSControlledCheckboxPropsT } from './index.d';
-declare const DSControlledCheckbox: {
-    (props: DSControlledCheckboxPropsT): JSX.Element;
-    propTypes: {
-        checked: any;
-        value: {
-            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValue;
-        };
-        name: any;
-        label: {
-            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValue;
-        };
-        id: any;
-        readOnly: {
-            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValue;
-        };
-        hasError: {
-            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValue;
-        };
-        disabled: {
-            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValue;
-        };
-        ariaControls: {
-            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValue;
-        };
-        ariaLabel: {
-            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValue;
-        };
-        innerRef: {
-            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValue;
-        };
-        autoFocus: {
-            defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
-                deprecated: import("react-desc").PropTypesDescValidator;
-            };
-            isRequired: import("react-desc").PropTypesDescValue;
-        };
-    };
-};
-declare const DSControlledCheckboxWithSchema: {
-    (props?: unknown): JSX.Element;
-    propTypes: unknown;
-    toTypescript: () => import("react-desc").TypescriptSchema;
-};
+import React from 'react';
+import { DSControlledCheckboxT } from './react-desc-prop-types';
+declare const DSControlledCheckbox: React.ComponentType<DSControlledCheckboxT.Props>;
+declare const DSControlledCheckboxWithSchema: any;
 export { DSControlledCheckbox, DSControlledCheckboxWithSchema };

package/types/controlled-checkbox/config/useValidateProps.d.ts

@@ -1,2 +1,2 @@
-import { DSControlledCheckboxPropsT } from '../index.d';
-export declare const useValidateProps: (props: DSControlledCheckboxPropsT, propTypes: unknown) => void;
+import { DSControlledCheckboxT } from '../react-desc-prop-types';
+export declare const useValidateProps: (props: DSControlledCheckboxT.Props, propTypes: unknown) => void;

package/types/controlled-checkbox/react-desc-prop-types.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+import { GlobalAttributesT } from '@elliemae/ds-props-helpers';
+export declare namespace DSControlledCheckboxT {
+    interface DefaultProps {
+        checked: boolean | 'mixed';
+        tabIndex?: number;
+        hasError?: boolean;
+        'data-testid'?: string;
+    }
+    interface OptionalProps {
+        innerRef: React.RefObject<HTMLInputElement> | React.LegacyRef<HTMLInputElement>;
+    }
+    interface LegacyAriaProps {
+        ariaControls: string;
+        ariaLabel: string;
+    }
+    interface Props extends DefaultProps, OptionalProps, Omit<GlobalAttributesT, 'checked'>, LegacyAriaProps {
+    }
+    interface StyledCheckBoxT {
+        checked: boolean | 'mixed';
+        readOnly?: boolean;
+        hasError?: boolean;
+        disabled?: boolean;
+    }
+    interface StyledLabelT {
+        disabled?: boolean;
+        readOnly?: boolean;
+        checked: boolean | 'mixed';
+    }
+}
+export declare const defaultProps: Partial<DSControlledCheckboxT.Props>;
+export declare const propTypes: any;

package/types/controlled-checkbox/styles.d.ts

@@ -1,5 +1,5 @@
-import { StyledCheckBoxT, StyledLabelT } from './index.d';
+import { DSControlledCheckboxT } from './react-desc-prop-types';
 export declare const StyledContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledCheckBox: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, StyledCheckBoxT, never>;
+export declare const StyledCheckBox: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, DSControlledCheckboxT.StyledCheckBoxT, never>;
 export declare const StyledInput: import("styled-components").StyledComponent<"input", import("styled-components").DefaultTheme, {}, never>;
-export declare const StyledLabel: import("styled-components").StyledComponent<"label", import("styled-components").DefaultTheme, StyledLabelT, never>;
+export declare const StyledLabel: import("styled-components").StyledComponent<"label", import("styled-components").DefaultTheme, DSControlledCheckboxT.StyledLabelT, never>;

package/types/controlled-checkbox/utils/setMultipleRefs.d.ts

@@ -1,2 +1,2 @@
 /// <reference types="react" />
-export declare function setMultipleRefs<T = unknown>(refs: Array<React.MutableRefObject<T> | React.LegacyRef<T>>): React.RefCallback<T>;
+export declare function setMultipleRefs<T = unknown>(refs: Array<React.RefObject<T> | React.LegacyRef<T>>): React.RefCallback<T>;

package/types/controlled-checkbox/utils/styleHelpers.d.ts

@@ -1,4 +1,4 @@
 import type { Theme } from '@elliemae/pui-theme';
-export declare const handleCheckMarkColor: ({ colors }: Theme, disabled: boolean, readOnly: boolean, hasError: boolean, checked: boolean | 'mixed', isHovering: boolean) => string;
-export declare const handleCheckmark: (theme: Theme, checked: boolean | 'mixed', disabled: boolean, readOnly: boolean, hasError: boolean, isHovering?: boolean) => string;
-export declare const handleBackgroundColor: ({ colors }: Theme, disabled: boolean) => string;
+export declare const handleCheckMarkColor: ({ colors }: Theme, checked: boolean | 'mixed', isHovering: boolean, disabled?: boolean | undefined, readOnly?: boolean | undefined, hasError?: boolean | undefined) => string;
+export declare const handleCheckmark: (theme: Theme, checked: boolean | 'mixed', disabled?: boolean | undefined, readOnly?: boolean | undefined, hasError?: boolean | undefined, isHovering?: boolean) => string;
+export declare const handleBackgroundColor: ({ colors }: Theme, disabled?: boolean | undefined) => string;

package/types/controlled-combobox/config/useComboBox.d.ts

@@ -1,3 +1,3 @@
 import { DSComboboxT } from '../react-desc-prop-types';
 import { DSComboboxInternalsT } from '../sharedTypes';
-export declare const useComboBox: (props: Partial<DSComboboxT.Props>) => DSComboboxInternalsT.ComboBoxContextT;
+export declare const useComboBox: (props: DSComboboxT.Props) => DSComboboxInternalsT.ComboBoxContextT;

package/types/controlled-combobox/parts/controls/useOnPillsNavigation.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 export declare const useOnPillsNavigation: () => {
-    onKeyDownPills: import("react").KeyboardEventHandler<Element>;
+    onKeyDownPills: React.KeyboardEventHandler<HTMLInputElement>;
 };

package/types/controlled-combobox/parts/header-list/useHeaderListHandlers.d.ts

@@ -3,7 +3,8 @@ interface UseHeaderListHandlersT {
     handleKeyDown: (e: React.KeyboardEvent) => void;
     handleToggle: () => void;
     handleOnMouseDown: (e: React.MouseEvent) => void;
-    handleSelectAllCheckboxChange: () => void;
+    handleSelectAllCheckboxChange: React.ChangeEventHandler<HTMLInputElement>;
+    handleFilterSelectionBtnOnBlur: React.FocusEventHandler<HTMLButtonElement>;
     checkboxStatus: boolean | 'mixed';
 }
 declare const useHeaderListHandlers: () => UseHeaderListHandlersT;

package/types/controlled-combobox/parts/menu-list/styled.d.ts

@@ -9,3 +9,4 @@ export declare const StyledVirtualListWrapper: import("styled-components").Style
     withHeader: boolean;
 }, never>;
 export declare const StyledCreatableLabel: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledNoResultsWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;