@thecb/components 6.0.0-beta.4 → 6.0.0-beta.5

package/dist/index.esm.js

@@ -19438,9 +19438,10 @@ var DropdownItemWrapper = styled.div.withConfig({
 var SearchInput = styled.input.withConfig({
   displayName: "Dropdown__SearchInput",
   componentId: "sc-pn6m0h-3"
-})(["border:none;background-color:", ";font-size:16px;height:24px;"], function (_ref8) {
-  var themeValues = _ref8.themeValues;
-  return themeValues.hoverColor && themeValues.hoverColor;
+})(["border:none;background-color:", ";font-size:16px;height:24px;min-width:75%;"], function (_ref8) {
+  var themeValues = _ref8.themeValues,
+      isOpen = _ref8.isOpen;
+  return isOpen ? themeValues.hoverColor && themeValues.hoverColor : "WHITE";
 });
 
 var Dropdown = function Dropdown(_ref9) {
@@ -19655,6 +19656,7 @@ var Dropdown = function Dropdown(_ref9) {
     borderSize: "1px",
     borderColor: isError ? ERROR_COLOR : isOpen ? themeValues.selectedColor : GREY_CHATEAU,
     borderRadius: "2px",
+    tabIndex: 0,
     dataQa: placeholder,
     extraStyles: "height: 48px;\n          ".concat(disabled && "color: #6e727e;\n          background-color: #f7f7f7;\n          pointer-events: none;", "\n          ")
   }, /*#__PURE__*/React.createElement(Stack, {
@@ -19672,7 +19674,7 @@ var Dropdown = function Dropdown(_ref9) {
     "aria-autocomplete": "list",
     "aria-controls": "".concat(ariaLabelledby, "_listbox"),
     "aria-activedescendant": "selected_option",
-    tabIndex: 0
+    isOpen: isOpen
   }), /*#__PURE__*/React.createElement(IconWrapper, {
     open: isOpen
   }, /*#__PURE__*/React.createElement(DropdownIcon, null)))), isOpen ? /*#__PURE__*/React.createElement(DropdownContentWrapper, {
@@ -19686,7 +19688,7 @@ var Dropdown = function Dropdown(_ref9) {
   }, /*#__PURE__*/React.createElement(Stack, {
     childGap: "0"
   }, filteredOptions.map(function (choice, i) {
-    if (selectedRef === undefined && choice.value === value) {
+    if (choice.value === value && selectedRef !== optionRefs.current[i]) {
       setSelectedRef(optionRefs.current[i]);
     }
 
@@ -19699,7 +19701,8 @@ var Dropdown = function Dropdown(_ref9) {
       onClick: disabledValues.includes(choice.value) ? function (evt) {
         return evt.preventDefault();
       } : function () {
-        return onSelect(choice.value);
+        setSelectedRef(optionRefs.current[i]);
+        onSelect(choice.value);
       },
       selected: choice.value === value,
       "aria-selected": choice.value === value,