@chekinapp/ui 0.0.122 → 0.0.123

package/dist/index.cjs

@@ -13577,7 +13577,10 @@ function useSelectState(params) {
     () => resolveValueLabel(singleSelected, getValueLabel),
     [singleSelected, getValueLabel]
   );
-  const [inputValue, setInputValue] = React48.useState(isMulti ? "" : valueLabel);
+  const isSearchOnlyInput = isMulti || Boolean(isSearchInDropdown);
+  const [inputValue, setInputValue] = React48.useState(
+    isSearchOnlyInput ? "" : valueLabel
+  );
   const hasValue = selectedOptions.length > 0;
   const isBlocked = Boolean(disabled) || Boolean(loading) || Boolean(readOnly);
   const hasInvalidState = Boolean(error);
@@ -13592,18 +13595,18 @@ function useSelectState(params) {
   const ids = useSelectIds({ name, hasValue, error, hideErrorMessage });
   const { listboxId, getOptionId: getOptionId2 } = ids;
   React48.useEffect(() => {
-    if (isMulti) return;
+    if (isSearchOnlyInput) return;
     if (!isFocused) setInputValue(valueLabel);
-  }, [valueLabel, isFocused, isMulti]);
+  }, [valueLabel, isFocused, isSearchOnlyInput]);
   React48.useEffect(() => {
-    if (!isMulti) return;
+    if (!isSearchOnlyInput) return;
     if (!isOpen) {
       setInputValue("");
       setHighlightedIndex(-1);
     }
-  }, [isOpen, isMulti]);
+  }, [isOpen, isSearchOnlyInput]);
   const trimmedInput = inputValue.trim();
-  const isFiltering = isMulti ? trimmedInput.length > 0 : trimmedInput.length > 0 && trimmedInput.toLowerCase() !== valueLabel.toLowerCase();
+  const isFiltering = isSearchOnlyInput ? trimmedInput.length > 0 : trimmedInput.length > 0 && trimmedInput.toLowerCase() !== valueLabel.toLowerCase();
   const filteredOptions = React48.useMemo(() => {
     if (!isFiltering) return options;
     return options.filter((option) => filterOption(option, trimmedInput));
@@ -13664,7 +13667,7 @@ function useSelectState(params) {
         return;
       }
       onSelectionChange([option], { action: "select" });
-      setInputValue(resolveValueLabel(option, getValueLabel));
+      setInputValue(isSearchInDropdown ? "" : resolveValueLabel(option, getValueLabel));
       setIsOpen(false);
       setIsFocused(false);
       inputRef.current?.blur();
@@ -13677,7 +13680,8 @@ function useSelectState(params) {
       onSelectionChange,
       closeMenuOnSelect,
       setIsOpen,
-      getValueLabel
+      getValueLabel,
+      isSearchInDropdown
     ]
   );
   const removeOption = React48.useCallback(
@@ -13712,7 +13716,7 @@ function useSelectState(params) {
       return;
     }
     onSelectionChange([newOption], { action: "create" });
-    setInputValue(resolveValueLabel(newOption, getValueLabel));
+    setInputValue(isSearchInDropdown ? "" : resolveValueLabel(newOption, getValueLabel));
     setIsOpen(false);
     setIsFocused(false);
     inputRef.current?.blur();
@@ -13725,7 +13729,8 @@ function useSelectState(params) {
     selectedOptions,
     closeMenuOnSelect,
     setIsOpen,
-    getValueLabel
+    getValueLabel,
+    isSearchInDropdown
   ]);
   const handleInputChange = React48.useCallback(
     (event) => {
@@ -13751,10 +13756,10 @@ function useSelectState(params) {
     (event) => {
       if (containerRef.current?.contains(event.relatedTarget)) return;
       setIsFocused(false);
-      if (!isMulti) setInputValue(valueLabel);
+      if (!isSearchOnlyInput) setInputValue(valueLabel);
       onBlur?.(event);
     },
-    [containerRef, isMulti, valueLabel, onBlur]
+    [containerRef, isSearchOnlyInput, valueLabel, onBlur]
   );
   const handleInputKeyDown = React48.useCallback(
     (event) => {
@@ -13808,7 +13813,7 @@ function useSelectState(params) {
       }
       if (event.key === "Escape") {
         event.preventDefault();
-        if (!isMulti) setInputValue(valueLabel);
+        if (!isSearchOnlyInput) setInputValue(valueLabel);
         setIsOpen(false);
         inputRef.current?.blur();
       }
@@ -13816,6 +13821,7 @@ function useSelectState(params) {
     [
       onKeyDown,
       isMulti,
+      isSearchOnlyInput,
       inputValue,
       selectedOptions,
       onSelectionChange,
@@ -14153,6 +14159,21 @@ function mergeComponents(overrides) {
   };
 }
 
+// src/dashboard/select/useSetCorrectOptionIfThereIsOnlyValue.ts
+var import_react89 = require("react");
+function useSetCorrectOptionIfThereIsOnlyValue({ value, options, onChange, enabled = true }) {
+  (0, import_react89.useEffect)(() => {
+    if (!enabled || !value || !onChange || !options?.length) return;
+    if (value.value === void 0 || value.value === null) return;
+    if (value.label !== "NONE" && value.label !== "") return;
+    const validOption = flattenGroupedOptions(options).find(
+      (option) => option.value === value.value
+    );
+    if (!validOption) return;
+    onChange({ ...validOption, isPrefilled: true }, { action: "select" });
+  }, [enabled, onChange, options, value]);
+}
+
 // src/dashboard/select/Select.tsx
 var import_jsx_runtime158 = require("react/jsx-runtime");
 function SelectInternal(props, ref) {
@@ -14213,6 +14234,12 @@ function SelectInternal(props, ref) {
     return props.defaultValue ?? null;
   });
   const currentValue = isControlled ? props.value : internalValue;
+  useSetCorrectOptionIfThereIsOnlyValue({
+    enabled: !isMulti,
+    value: !isMulti ? props.value : void 0,
+    options,
+    onChange: !isMulti ? props.onChange : void 0
+  });
   const selectedOptions = React49.useMemo(() => {
     if (isMulti) return currentValue ?? [];
     return currentValue ? [currentValue] : [];
@@ -17962,11 +17989,11 @@ function toastResponseError(error, options = {}) {
 }
 
 // src/legacy-fields/textarea/Textarea.tsx
-var import_react89 = require("react");
+var import_react90 = require("react");
 var import_jsx_runtime182 = require("react/jsx-runtime");
-var LegacyTextarea = (0, import_react89.forwardRef)(
+var LegacyTextarea = (0, import_react90.forwardRef)(
   ({ className, textareaClassName, label, disabled, name, invalid, ...textareaProps }, ref) => {
-    const inputId = (0, import_react89.useId)();
+    const inputId = (0, import_react90.useId)();
     return /* @__PURE__ */ (0, import_jsx_runtime182.jsxs)("div", { className: cn("relative", className), children: [
       /* @__PURE__ */ (0, import_jsx_runtime182.jsx)(
         "textarea",
@@ -19786,7 +19813,7 @@ AirbnbPhoneField.displayName = "AirbnbPhoneField";
 var React80 = __toESM(require("react"), 1);
 var import_lucide_react57 = require("lucide-react");
 var import_react_virtual3 = require("@tanstack/react-virtual");
-var import_react90 = require("react");
+var import_react91 = require("react");
 var import_jsx_runtime193 = require("react/jsx-runtime");
 var ROW_HEIGHT = 48;
 var DESKTOP_LIST_HEIGHT = 280;
@@ -19864,7 +19891,7 @@ var AirbnbSearchableSelectInternal = ({
     isDisabled: !open || isMobile3
   });
   const handleOnOpenChange = useEvent(onOpenChange);
-  const setSelectOpen = (0, import_react90.useCallback)(
+  const setSelectOpen = (0, import_react91.useCallback)(
     (nextOpen, options2) => {
       setOpen(nextOpen);
       handleOnOpenChange?.(nextOpen);