@chekinapp/ui 0.0.119 → 0.0.121

package/dist/index.cjs

@@ -14211,19 +14211,28 @@ function SelectInternal(props, ref) {
   const clearable = !isMulti ? props.clearable ?? true : true;
   const closeMenuOnSelect = isMulti ? props.closeMenuOnSelect ?? false : void 0;
   const { t } = (0, import_react_i18next33.useTranslation)();
+  const isControlled = props.value !== void 0;
+  const [internalValue, setInternalValue] = React49.useState(() => {
+    if (isMulti) return props.defaultValue ?? [];
+    return props.defaultValue ?? null;
+  });
+  const currentValue = isControlled ? props.value : internalValue;
   const selectedOptions = React49.useMemo(() => {
-    if (isMulti) return props.value ?? [];
-    return props.value ? [props.value] : [];
-  }, [isMulti, props.value]);
+    if (isMulti) return currentValue ?? [];
+    return currentValue ? [currentValue] : [];
+  }, [isMulti, currentValue]);
   const onSelectionChange = React49.useCallback(
     (next, meta) => {
       if (isMulti) {
-        props.onChange(next, meta);
+        if (!isControlled) setInternalValue(next);
+        props.onChange?.(next, meta);
       } else {
-        props.onChange(next[0] ?? null, meta);
+        const nextValue = next[0] ?? null;
+        if (!isControlled) setInternalValue(nextValue);
+        props.onChange?.(nextValue, meta);
       }
     },
-    [isMulti, props.onChange]
+    [isMulti, isControlled, props.onChange]
   );
   const flatOptions = React49.useMemo(() => flattenGroupedOptions(options), [options]);
   const state = useSelectState({
@@ -14666,6 +14675,7 @@ function InfiniteScrollSelectInternal(props, ref) {
     filterOption: userFilterOption,
     components: userComponents,
     onInputChange: userOnInputChange,
+    isMulti = false,
     ...rest
   } = props;
   const isPaginated = canLoadMore !== void 0 || isLoadingMore !== void 0 || loadMoreItems !== void 0 || onSearchChange !== void 0 || getFullSearchOption !== void 0;
@@ -14674,8 +14684,8 @@ function InfiniteScrollSelectInternal(props, ref) {
   const filteredOptions = React52.useMemo(() => {
     const trimmed = inputValue.trim();
     const valueLabel = (() => {
-      if (props.isMulti) return "";
-      const single = props.value;
+      if (isMulti) return "";
+      const single = rest.value;
       if (!single) return "";
       return rest.getValueLabel?.(single) ?? String(single.label);
     })();
@@ -14689,7 +14699,7 @@ function InfiniteScrollSelectInternal(props, ref) {
       if (synthetic) list = [synthetic, ...list];
     }
     return list;
-  }, [rawOptions, inputValue, filterOption, getFullSearchOption, props, rest]);
+  }, [rawOptions, inputValue, filterOption, getFullSearchOption, isMulti, rest]);
   const contextValue = React52.useMemo(
     () => ({
       canLoadMore,
@@ -14724,16 +14734,27 @@ function InfiniteScrollSelectInternal(props, ref) {
     },
     [onSearchChange, userOnInputChange]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime160.jsx)(InfiniteScrollContext.Provider, { value: contextValue, children: /* @__PURE__ */ (0, import_jsx_runtime160.jsx)(
+  const selectExtras = {
+    options: filteredOptions,
+    filterOption: passthroughFilter,
+    components,
+    onInputChange: handleInputChange
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime160.jsx)(InfiniteScrollContext.Provider, { value: contextValue, children: isMulti ? /* @__PURE__ */ (0, import_jsx_runtime160.jsx)(
     Select,
     {
       ref,
       ...rest,
-      isMulti: props.isMulti,
-      options: filteredOptions,
-      filterOption: passthroughFilter,
-      components,
-      onInputChange: handleInputChange
+      ...selectExtras,
+      isMulti: true
+    }
+  ) : /* @__PURE__ */ (0, import_jsx_runtime160.jsx)(
+    Select,
+    {
+      ref,
+      ...rest,
+      ...selectExtras,
+      isMulti: false
     }
   ) });
 }
@@ -15203,6 +15224,7 @@ function SelectCheckboxesInternal(props, ref) {
   const {
     options: rawOptions = [],
     value,
+    defaultValue,
     onChange,
     trigger,
     components: userComponents,
@@ -15220,7 +15242,19 @@ function SelectCheckboxesInternal(props, ref) {
     paginationAndRest
   );
   const [inputValue, setInputValue] = React59.useState("");
-  const selected = React59.useMemo(() => value ?? [], [value]);
+  const isControlled = value !== void 0;
+  const [internalValue, setInternalValue] = React59.useState(
+    () => defaultValue ?? []
+  );
+  const currentValue = isControlled ? value : internalValue;
+  const selected = React59.useMemo(() => currentValue ?? [], [currentValue]);
+  const handleChange = React59.useCallback(
+    (next, meta) => {
+      if (!isControlled) setInternalValue(next);
+      onChange?.(next, meta);
+    },
+    [isControlled, onChange]
+  );
   const flatRawOptions = React59.useMemo(
     () => flattenGroupedOptions(rawOptions),
     [rawOptions]
@@ -15247,7 +15281,7 @@ function SelectCheckboxesInternal(props, ref) {
   const handleToggleAll = React59.useCallback(() => {
     if (allVisibleSelected) {
       const visibleValues = new Set(filteredFlat.map((option) => option.value));
-      onChange(
+      handleChange(
         selected.filter((s) => !visibleValues.has(s.value)),
         { action: "deselect" }
       );
@@ -15257,8 +15291,8 @@ function SelectCheckboxesInternal(props, ref) {
     for (const option of filteredFlat) {
       if (!merged.some((s) => s.value === option.value)) merged.push(option);
     }
-    onChange(merged, { action: "select" });
-  }, [allVisibleSelected, filteredFlat, onChange, selected]);
+    handleChange(merged, { action: "select" });
+  }, [allVisibleSelected, filteredFlat, handleChange, selected]);
   const Control = React59.useMemo(() => {
     if (trigger) return makeTriggerSlot2(trigger);
     return createCountTrigger({
@@ -15291,8 +15325,8 @@ function SelectCheckboxesInternal(props, ref) {
   );
   const baseSharedProps = {
     ...paginationAndRest,
-    value,
-    onChange,
+    value: currentValue,
+    onChange: handleChange,
     filterOption: passthroughFilter2,
     components,
     closeMenuOnSelect,
@@ -19025,7 +19059,7 @@ function useDesktopSelect({
   const handleSelect = React76.useCallback(
     (option) => {
       if (option.isDisabled || disabled) return;
-      onChange(option);
+      onChange?.(option);
     },
     [disabled, onChange]
   );
@@ -19103,7 +19137,7 @@ function useDesktopSelect({
         event.preventDefault();
         const option = options[highlightedIndex];
         if (option && !option.isDisabled) {
-          onChange(option);
+          onChange?.(option);
           onClose();
           focusTrigger();
         }
@@ -19432,7 +19466,7 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
       }
       const validOption = filteredOptions.find((option) => option.value === value.value);
       if (validOption) {
-        onChange(validOption);
+        onChange?.(validOption);
       }
     },
     [onChange, filteredOptions, value]
@@ -19452,7 +19486,7 @@ var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
     if (isBlocked) return;
     const finalOption = pendingValue;
     if (finalOption && finalOption.value !== value?.value) {
-      onChange(finalOption);
+      onChange?.(finalOption);
     }
     setIsOpen(false);
     focusTrigger();