bako-ui 0.5.5 → 0.5.7

package/dist/index.d.mts

@@ -145,6 +145,7 @@ type RhfComboboxProps<TFieldValues extends FieldValues, TName extends FieldPath<
         label?: FieldLabelProps;
         input?: Omit<InputProps, 'value' | 'onChange' | 'disabled' | 'type'>;
     };
+    onlyLowercase?: boolean;
 };
 
 /**
@@ -164,7 +165,7 @@ type RhfComboboxProps<TFieldValues extends FieldValues, TName extends FieldPath<
  *   ]}
  * />
  */
-declare function RhfCombobox<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>({ control, name, defaultValue, label, placeholder, error, options, disabled, helperText, isLoadingOptions, noOptionsText, openOnFocus, slotProps, variant, clearTriggerIcon, showTrigger, allowCustomValue, onInputValueChange, }: RhfComboboxProps<TFieldValues, TName>): react_jsx_runtime.JSX.Element;
+declare function RhfCombobox<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>({ control, name, defaultValue, label, placeholder, error, options, disabled, helperText, isLoadingOptions, noOptionsText, openOnFocus, slotProps, variant, clearTriggerIcon, showTrigger, allowCustomValue, onlyLowercase, onInputValueChange, }: RhfComboboxProps<TFieldValues, TName>): react_jsx_runtime.JSX.Element;
 
 type RhfInputProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = UseControllerProps<TFieldValues, TName> & {
     label?: React.ReactNode;

package/dist/index.d.ts

@@ -145,6 +145,7 @@ type RhfComboboxProps<TFieldValues extends FieldValues, TName extends FieldPath<
         label?: FieldLabelProps;
         input?: Omit<InputProps, 'value' | 'onChange' | 'disabled' | 'type'>;
     };
+    onlyLowercase?: boolean;
 };
 
 /**
@@ -164,7 +165,7 @@ type RhfComboboxProps<TFieldValues extends FieldValues, TName extends FieldPath<
  *   ]}
  * />
  */
-declare function RhfCombobox<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>({ control, name, defaultValue, label, placeholder, error, options, disabled, helperText, isLoadingOptions, noOptionsText, openOnFocus, slotProps, variant, clearTriggerIcon, showTrigger, allowCustomValue, onInputValueChange, }: RhfComboboxProps<TFieldValues, TName>): react_jsx_runtime.JSX.Element;
+declare function RhfCombobox<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>({ control, name, defaultValue, label, placeholder, error, options, disabled, helperText, isLoadingOptions, noOptionsText, openOnFocus, slotProps, variant, clearTriggerIcon, showTrigger, allowCustomValue, onlyLowercase, onInputValueChange, }: RhfComboboxProps<TFieldValues, TName>): react_jsx_runtime.JSX.Element;
 
 type RhfInputProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = UseControllerProps<TFieldValues, TName> & {
     label?: React.ReactNode;

package/dist/index.js

@@ -247,6 +247,7 @@ function RhfCombobox({
   clearTriggerIcon,
   showTrigger = false,
   allowCustomValue = true,
+  onlyLowercase = false,
   onInputValueChange
 }) {
   const {
@@ -257,38 +258,48 @@ function RhfCombobox({
     initialItems: options,
     filter: contains
   });
-  const [inputValue, setInputValue] = React.useState(value || "");
+  const normalizeValue = React.useCallback(
+    (val) => {
+      if (!val) return val;
+      return onlyLowercase ? val.toLowerCase() : val;
+    },
+    [onlyLowercase]
+  );
+  const [inputValue, setInputValue] = React.useState(normalizeValue(value || ""));
   const [isTyping, setIsTyping] = React.useState(false);
   React.useEffect(() => {
     if (isTyping) return;
-    if (value !== inputValue) {
-      setInputValue(value || "");
+    const normalizedValue = normalizeValue(value || "");
+    if (normalizedValue !== inputValue) {
+      setInputValue(normalizedValue || "");
     }
-  }, [value, inputValue, isTyping]);
+  }, [value, inputValue, isTyping, normalizeValue]);
   const handleValueChange = React.useCallback(
     (details) => {
       const newValue = details.value[0] || "";
+      const normalizedValue = normalizeValue(newValue);
       setIsTyping(false);
-      onChange(newValue);
-      setInputValue(newValue);
-      onInputValueChange == null ? void 0 : onInputValueChange(newValue);
+      onChange(normalizedValue);
+      setInputValue(normalizedValue);
+      onInputValueChange == null ? void 0 : onInputValueChange(normalizedValue);
     },
-    [onChange, onInputValueChange]
+    [onChange, onInputValueChange, normalizeValue]
   );
   const handleInputValueChange = React.useCallback(
     (details) => {
       setIsTyping(true);
-      setInputValue(details.inputValue);
+      const normalizedInputValue = normalizeValue(details.inputValue);
+      setInputValue(normalizedInputValue);
       reactDom.flushSync(() => {
-        filter(details.inputValue);
+        filter(normalizedInputValue);
       });
-      onInputValueChange == null ? void 0 : onInputValueChange(details.inputValue);
+      onInputValueChange == null ? void 0 : onInputValueChange(normalizedInputValue);
       if (allowCustomValue) {
-        onChange(details.inputValue);
+        onChange(normalizedInputValue);
       }
       setTimeout(() => setIsTyping(false), 100);
     },
-    [filter, allowCustomValue, onChange, onInputValueChange]
+    [filter, allowCustomValue, onChange, onInputValueChange, normalizeValue]
   );
   const handleOpenChange = React.useCallback(
     (details) => {
@@ -340,7 +351,7 @@ function RhfCombobox({
         width: "full",
         variant,
         inputValue,
-        value: value ? [value] : [],
+        value: value ? [normalizeValue(value)] : [],
         borderRadius: "lg",
         onValueChange: handleValueChange,
         onOpenChange: handleOpenChange,
@@ -351,7 +362,7 @@ function RhfCombobox({
         invalid: !!error,
         allowCustomValue,
         selectionBehavior: "preserve",
-        defaultValue: [defaultValue || ""],
+        defaultValue: [normalizeValue(defaultValue || "")],
         placeholder,
         ...slotProps == null ? void 0 : slotProps.root,
         children: [
@@ -370,9 +381,15 @@ function RhfCombobox({
               showTrigger && /* @__PURE__ */ jsxRuntime.jsx(react.Combobox.Trigger, {})
             ] })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(ComboboxHiddenInput, { name: rest.name, value: value != null ? value : "" }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ComboboxHiddenInput,
+            {
+              name: rest.name,
+              value: normalizeValue(value != null ? value : "")
+            }
+          ),
           helperText && /* @__PURE__ */ jsxRuntime.jsx(react.Field.HelperText, { children: helperText }),
-          error && /* @__PURE__ */ jsxRuntime.jsx(react.Field.ErrorText, { children: error.message }),
+          (error == null ? void 0 : error.message) && /* @__PURE__ */ jsxRuntime.jsx(react.Field.ErrorText, { children: error.message }),
           /* @__PURE__ */ jsxRuntime.jsx(react.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(react.Combobox.Positioner, { children: (showOptions || !allowCustomValue) && /* @__PURE__ */ jsxRuntime.jsxs(react.Combobox.Content, { children: [
             isLoadingOptions && /* @__PURE__ */ jsxRuntime.jsxs(react.HStack, { p: "2", children: [
               /* @__PURE__ */ jsxRuntime.jsx(react.Spinner, { size: "xs", borderWidth: "1px" }),