@economic/taco 0.0.25-alpha.0 → 0.0.26-alpha.0

package/dist/taco.cjs.development.js

@@ -3941,6 +3941,9 @@ var defaultLocalisationTexts = {
       today: 'Today'
     }
   },
+  combobox: {
+    tooltip: 'Search in list'
+  },
   datepicker: {
     calendar: 'Calendar',
     clear: 'Clear',
@@ -4875,6 +4878,7 @@ var useCombobox = function useCombobox(_ref, ref) {
       props = _objectWithoutPropertiesLoose(_ref, _excluded$g);
 
   var inputRef = useProxiedRef(ref);
+  var buttonRef = React.useRef(null);
   var listRef = React.useRef(null);
 
   var _React$useState = React.useState(false),
@@ -5036,8 +5040,18 @@ var useCombobox = function useCombobox(_ref, ref) {
           return;
         }
 
-      case keycode('up'):
       case keycode('down'):
+        if (open) {
+          event.preventDefault();
+        } else {
+          if (!inline && buttonRef.current) {
+            buttonRef.current.click();
+          }
+        }
+
+        break;
+
+      case keycode('up'):
       case keycode('home'):
       case keycode('end'):
         {
@@ -5102,7 +5116,7 @@ var useCombobox = function useCombobox(_ref, ref) {
     readOnly: readOnly,
     ref: inputRef,
     type: 'text',
-    value: inputValue || ''
+    value: inputValue !== null && inputValue !== void 0 ? inputValue : ''
   });
 
   var list = {
@@ -5117,10 +5131,14 @@ var useCombobox = function useCombobox(_ref, ref) {
     tabIndex: -1,
     value: currentIndex
   };
+  var button = {
+    ref: buttonRef
+  };
   return {
     combobox: combobox,
     input: input,
     list: list,
+    button: button,
     popover: {
       open: open,
       onOpenChange: setOpen
@@ -5173,19 +5191,25 @@ var useBoundingClientRectListener = function useBoundingClientRectListener(ref)
   return dimensions;
 };
 
-var _excluded$h = ["className", "style"];
+var _excluded$h = ["className", "dialog", "style"];
 var Combobox = /*#__PURE__*/React.forwardRef(function Combobox(props, ref) {
   var externalClassName = props.className,
+      dialog = props.dialog,
       style = props.style,
       otherProps = _objectWithoutPropertiesLoose(props, _excluded$h);
 
   var _useCombobox = useCombobox(otherProps, ref),
       combobox = _useCombobox.combobox,
+      button = _useCombobox.button,
       input = _useCombobox.input,
       popover = _useCombobox.popover,
       list = _useCombobox.list;
 
   var internalRef = React.useRef(null);
+
+  var _useLocalization = useLocalization(),
+      texts = _useLocalization.texts;
+
   var selectDimensions = useBoundingClientRectListener(internalRef);
   var className = cn('inline-flex relative', {
     'yt-combobox--inline': props.inline
@@ -5210,7 +5234,19 @@ var Combobox = /*#__PURE__*/React.forwardRef(function Combobox(props, ref) {
         return popover.onOpenChange(true);
       },
       tabIndex: -1
-    }) : props.button
+    }) : dialog ? React.createElement(IconButton, {
+      icon: "list-search",
+      disabled: props.readOnly || props.disabled,
+      dialog: dialog,
+      onFocus: function onFocus() {
+        var _input$ref$current;
+
+        (_input$ref$current = input.ref.current) === null || _input$ref$current === void 0 ? void 0 : _input$ref$current.focus();
+      },
+      ref: button.ref,
+      tabIndex: -1,
+      tooltip: texts.combobox.tooltip
+    }) : undefined
   })))), React.createElement(PopoverPrimitive.Content, {
     align: "start",
     onOpenAutoFocus: function onOpenAutoFocus(event) {
@@ -7615,6 +7651,7 @@ var Select = /*#__PURE__*/React.forwardRef(function Select(props, ref) {
 
   if (editable) {
     return React.createElement(Combobox, Object.assign({}, otherProps, {
+      dialog: undefined,
       inline: true,
       ref: ref
     }));