@entur/dropdown 5.0.11 → 5.0.12

package/dist/dropdown.cjs.development.js

@@ -1681,9 +1681,9 @@ var SearchableDropdown = function SearchableDropdown(_ref) {
     _ref$variant = _ref.variant,
     variant = _ref$variant === void 0 ? 'info' : _ref$variant,
     rest = _objectWithoutPropertiesLoose(_ref, _excluded$3);
-  var _useState = React.useState(false),
-    hideSelectedItem = _useState[0],
-    setHideSelectedItem = _useState[1];
+  var _useState = React.useState(value !== null),
+    showSelectedItem = _useState[0],
+    setShowSelectedItem = _useState[1];
   var _React$useState = React.useState(0),
     lastHighlightedIndex = _React$useState[0],
     setLastHighlightedIndex = _React$useState[1];
@@ -1834,15 +1834,19 @@ var SearchableDropdown = function SearchableDropdown(_ref) {
     prepend: prepend,
     readOnly: readOnly,
     variant: variant
-  }, rest), !hideSelectedItem && selectedItem !== null && inputValue === '' && React.createElement("span", {
-    className: "eds-dropdown--searchable__selected-item",
+  }, rest), React.createElement("span", {
+    className: classNames('eds-dropdown--searchable__selected-item', {
+      'eds-dropdown--searchable__selected-item--hidden': !showSelectedItem
+    }),
     "aria-hidden": "true",
     onClick: function onClick() {
       var _inputRef$current2;
       return (_inputRef$current2 = inputRef.current) == null ? void 0 : _inputRef$current2.focus();
     }
-  }, selectedItem.label), React.createElement("input", _extends({
-    className: "eds-dropdown__input eds-form-control",
+  }, selectedItem == null ? void 0 : selectedItem.label), React.createElement("input", _extends({
+    className: classNames('eds-dropdown__input eds-form-control', {
+      'eds-dropdown__input--hidden': showSelectedItem
+    }),
     disabled: readOnly || disabled,
     placeholder: (_selectedItem$label = selectedItem == null ? void 0 : selectedItem.label) != null ? _selectedItem$label : placeholder
   }, getInputProps({
@@ -1850,10 +1854,10 @@ var SearchableDropdown = function SearchableDropdown(_ref) {
       if (!isOpen && isVoiceOverClick(e)) openMenu();
     },
     onBlur: function onBlur() {
-      setHideSelectedItem(false);
+      if (selectedItem !== null) setShowSelectedItem(true);
     },
     onFocus: function onFocus() {
-      setHideSelectedItem(true);
+      setShowSelectedItem(false);
     },
     onKeyDown: function onKeyDown(e) {
       if (selectOnTab && e.key === 'Tab') onChange(listItems[highlightedIndex]);