@chekinapp/ui 0.0.119 → 0.0.120

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({
@@ -15203,6 +15212,7 @@ function SelectCheckboxesInternal(props, ref) {
   const {
     options: rawOptions = [],
     value,
+    defaultValue,
     onChange,
     trigger,
     components: userComponents,
@@ -15220,7 +15230,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 +15269,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 +15279,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 +15313,8 @@ function SelectCheckboxesInternal(props, ref) {
   );
   const baseSharedProps = {
     ...paginationAndRest,
-    value,
-    onChange,
+    value: currentValue,
+    onChange: handleChange,
     filterOption: passthroughFilter2,
     components,
     closeMenuOnSelect,
@@ -19025,7 +19047,7 @@ function useDesktopSelect({
   const handleSelect = React76.useCallback(
     (option) => {
       if (option.isDisabled || disabled) return;
-      onChange(option);
+      onChange?.(option);
     },
     [disabled, onChange]
   );
@@ -19103,7 +19125,7 @@ function useDesktopSelect({
         event.preventDefault();
         const option = options[highlightedIndex];
         if (option && !option.isDisabled) {
-          onChange(option);
+          onChange?.(option);
           onClose();
           focusTrigger();
         }
@@ -19432,7 +19454,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 +19474,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();