@herca/r-kit 0.0.75 → 0.0.76

package/dist/clients.d.cts

@@ -980,7 +980,7 @@ type SelectPropsWithDefaultBehavior<Extra extends object = EmptyObject> = {
 };
 type SelectProps<Extra extends object = object> = BaseSelectProps<Extra> & (SelectPropsWithCustomRender<Extra> | SelectPropsWithDefaultBehavior<Extra>);
 
-declare function Select<Extra extends object = object>({ options, value, onChange, isMulti, multiple, placeholder, isSearchable, isClearable, isDisabled, disabled, renderOption, renderValue, className, label, description, hint, tooltip, errorMessages, isLoadingMore, onLoadMore, treshold, trigger, triggerClassName, renderOptions, onSearchOptions, onOptionsChange, required, isSelectOpen, onOpenChange, searchOptions, searchPlaceholder, icon, }: SelectProps<Extra>): react_jsx_runtime.JSX.Element;
+declare function Select<Extra extends object = object>({ options, value, onChange, isMulti, placeholder, isSearchable, isClearable, isDisabled, renderOption, renderValue, className, label, description, hint, errorMessages, isLoadingMore, onLoadMore, treshold, trigger, triggerClassName, renderOptions, onSearchOptions, onOptionsChange, required, isSelectOpen, onOpenChange, searchOptions, searchPlaceholder, }: SelectProps<Extra>): react_jsx_runtime.JSX.Element;
 
 interface TabsProps {
     defaultValue?: string;

package/dist/clients.d.ts

@@ -980,7 +980,7 @@ type SelectPropsWithDefaultBehavior<Extra extends object = EmptyObject> = {
 };
 type SelectProps<Extra extends object = object> = BaseSelectProps<Extra> & (SelectPropsWithCustomRender<Extra> | SelectPropsWithDefaultBehavior<Extra>);
 
-declare function Select<Extra extends object = object>({ options, value, onChange, isMulti, multiple, placeholder, isSearchable, isClearable, isDisabled, disabled, renderOption, renderValue, className, label, description, hint, tooltip, errorMessages, isLoadingMore, onLoadMore, treshold, trigger, triggerClassName, renderOptions, onSearchOptions, onOptionsChange, required, isSelectOpen, onOpenChange, searchOptions, searchPlaceholder, icon, }: SelectProps<Extra>): react_jsx_runtime.JSX.Element;
+declare function Select<Extra extends object = object>({ options, value, onChange, isMulti, placeholder, isSearchable, isClearable, isDisabled, renderOption, renderValue, className, label, description, hint, errorMessages, isLoadingMore, onLoadMore, treshold, trigger, triggerClassName, renderOptions, onSearchOptions, onOptionsChange, required, isSelectOpen, onOpenChange, searchOptions, searchPlaceholder, }: SelectProps<Extra>): react_jsx_runtime.JSX.Element;
 
 interface TabsProps {
     defaultValue?: string;

package/dist/clients.js

@@ -11349,7 +11349,7 @@ function useUrlSearchParams() {
       const next = updater(readParams());
       const query = next.toString();
       const url = `${window.location.pathname}${query ? `?${query}` : ""}${window.location.hash}`;
-      if (options?.replace) {
+      if (options?.replace == true) {
         window.history.replaceState(window.history.state, "", url);
       } else {
         window.history.pushState(window.history.state, "", url);
@@ -16901,26 +16901,21 @@ function RoundedSpinner({
 // src/components/select/select.tsx
 import clsx14 from "clsx";
 import { Fragment as Fragment10, jsx as jsx435, jsxs as jsxs94 } from "react/jsx-runtime";
-var isGroup = (item) => item != null && Array.isArray(item.options);
-var getSearchText = (option) => typeof option.label === "string" ? option.label : String(option.value ?? "");
 function Select({
   options = [],
   value = null,
   onChange,
   isMulti = false,
-  multiple = false,
   placeholder = "Select...",
   isSearchable = true,
   isClearable = true,
   isDisabled = false,
-  disabled = false,
   renderOption = null,
   renderValue = null,
   className,
   label,
   description,
   hint,
-  tooltip,
   errorMessages,
   isLoadingMore,
   onLoadMore,
@@ -16934,8 +16929,7 @@ function Select({
   isSelectOpen,
   onOpenChange,
   searchOptions,
-  searchPlaceholder = "Search...",
-  icon
+  searchPlaceholder = "Search..."
 }) {
   const [isOpen, setIsOpen] = useState15(false);
   const [searchTerm, setSearchTerm] = useState15("");
@@ -16944,12 +16938,6 @@ function Select({
   const searchInputRef = useRef8(null);
   const optionRefs = useRef8([]);
   const listContainerRef = useRef8(null);
-  const onOptionsChangeRef = useRef8(onOptionsChange);
-  const onOpenChangeRef = useRef8(onOpenChange);
-  useEffect13(() => {
-    onOptionsChangeRef.current = onOptionsChange;
-    onOpenChangeRef.current = onOpenChange;
-  });
   const handleScroll = () => {
     const el = listContainerRef.current;
     if (!el || Boolean(isLoadingMore)) return;
@@ -16958,39 +16946,20 @@ function Select({
       onLoadMore?.();
     }
   };
-  const { filteredOptions, renderEntries } = React404.useMemo(() => {
-    const flat = [];
-    const entries = [];
-    const term = searchTerm.toLowerCase();
-    const matches2 = (o) => getSearchText(o).toLowerCase().includes(term);
-    for (const item of options) {
-      if (isGroup(item)) {
-        const matched = item.options.filter(matches2);
-        if (matched.length === 0) continue;
-        const items = matched.map((option) => {
-          const index = flat.length;
-          flat.push(option);
-          return { option, index };
-        });
-        entries.push({ kind: "group", label: item.label, items });
-      } else {
-        if (!matches2(item)) continue;
-        const index = flat.length;
-        flat.push(item);
-        entries.push({ kind: "option", option: item, index });
-      }
-    }
-    return { filteredOptions: flat, renderEntries: entries };
+  const filteredOptions = React404.useMemo(() => {
+    return options.filter(
+      (option) => option.label.toLowerCase().includes(searchTerm.toLowerCase()) === true
+    );
   }, [options, searchTerm]);
   const asArray = (val) => Array.isArray(val) ? val : val ? [val] : [];
   const isSelected = (option) => {
-    if (isMulti || multiple) {
+    if (isMulti) {
       return asArray(value).some((v3) => v3.value === option.value);
     }
     return value?.value === option.value;
   };
   const handleSelect = (option) => {
-    if (isMulti || multiple) {
+    if (isMulti) {
       const arr = asArray(value);
       const exists = arr.some((v3) => v3.value === option.value);
       const newValue = exists ? arr.filter((v3) => v3.value !== option.value) : [...arr, option];
@@ -17006,7 +16975,7 @@ function Select({
   };
   const handleRemove = (option, e) => {
     e.stopPropagation();
-    if (isMulti || multiple) {
+    if (isMulti) {
       const arr = asArray(value);
       onChange?.(arr.filter((v3) => v3.value !== option.value));
     } else {
@@ -17015,7 +16984,7 @@ function Select({
   };
   const handleClear = (e) => {
     e.stopPropagation();
-    onChange?.(isMulti || multiple ? [] : null);
+    onChange?.(isMulti ? [] : null);
   };
   const handleKeyDown2 = (e) => {
     if (!isOpen) {
@@ -17042,7 +17011,7 @@ function Select({
         e.preventDefault();
         try {
           const opt = filteredOptions[highlightedIndex];
-          if (opt != void 0) handleSelect(opt);
+          if (opt) handleSelect(opt);
         } catch (error) {
           console.error(error);
         }
@@ -17058,9 +17027,6 @@ function Select({
   useEffect13(() => {
     setHighlightedIndex(0);
   }, [searchTerm]);
-  useEffect13(() => {
-    optionRefs.current.length = filteredOptions.length;
-  }, [filteredOptions]);
   useEffect13(() => {
     const el = optionRefs.current[highlightedIndex];
     if (el) {
@@ -17087,7 +17053,7 @@ function Select({
     }
   }, [isOpen, isSearchable]);
   useEffect13(() => {
-    onOptionsChangeRef.current?.(filteredOptions);
+    onOptionsChange?.(filteredOptions);
   }, [filteredOptions]);
   useEffect13(() => {
     if (isSelectOpen !== void 0) {
@@ -17095,7 +17061,7 @@ function Select({
     }
   }, [isSelectOpen]);
   useEffect13(() => {
-    onOpenChangeRef.current?.(isOpen);
+    onOpenChange?.(isOpen);
   }, [isOpen]);
   useEffect13(() => {
     if (searchOptions !== void 0) {
@@ -17103,11 +17069,11 @@ function Select({
     }
   }, [searchOptions]);
   const getDisplayValue = () => {
-    const isEmpty = value == null || (isMulti || multiple) && asArray(value).length === 0;
+    const isEmpty = value == null || isMulti && asArray(value).length === 0;
     if (isEmpty) {
       return /* @__PURE__ */ jsx435("span", { className: "text-gray-500", children: placeholder });
     }
-    if (isMulti || multiple) {
+    if (isMulti) {
       return /* @__PURE__ */ jsx435("div", { className: "flex flex-wrap gap-1", children: asArray(value).map((item) => /* @__PURE__ */ jsxs94(
         "div",
         {
@@ -17129,33 +17095,8 @@ function Select({
     }
     return renderValue !== void 0 && renderValue !== null ? renderValue?.(value) : value.label;
   };
-  const showClearButton = isClearable && ((isMulti || multiple) && asArray(value).length > 0 || (!isMulti || !multiple) && value !== null);
+  const showClearButton = isClearable && (isMulti && asArray(value).length > 0 || !isMulti && value !== null);
   const hasError = fieldHasError(errorMessages);
-  const renderOptionItem = (option, index) => {
-    const selected = isSelected(option);
-    const highlighted = index === highlightedIndex;
-    return /* @__PURE__ */ jsx435(
-      "div",
-      {
-        ref: (el) => {
-          optionRefs.current[index] = el;
-        },
-        onMouseEnter: () => setHighlightedIndex(index),
-        onClick: () => handleSelect(option),
-        children: /* @__PURE__ */ jsx435(Chip, { className: "text-left", block: true, selected: highlighted, children: /* @__PURE__ */ jsx435("div", { className: "flex-1", children: renderOption !== void 0 && renderOption !== null ? renderOption?.(option, { selected }) : /* @__PURE__ */ jsxs94("div", { className: "flex items-center gap-2", children: [
-          option?.icon != void 0 && /* @__PURE__ */ jsx435(Icon_default, { name: "user", size: 12 }),
-          /* @__PURE__ */ jsx435(Text, { variant: "t2", weight: "medium", className: "text-gray-900", children: option.label })
-        ] }) }) })
-      },
-      option.value
-    );
-  };
-  const hanldeOnClickInput = () => {
-    if (disabled || isDisabled) {
-      return false;
-    }
-    setIsOpen(!isOpen);
-  };
   return /* @__PURE__ */ jsx435(
     FormField,
     {
@@ -17164,7 +17105,6 @@ function Select({
       description,
       hint,
       required,
-      tooltip,
       children: /* @__PURE__ */ jsxs94(
         "div",
         {
@@ -17177,8 +17117,8 @@ function Select({
               "div",
               {
                 "aria-selected": isOpen,
-                onClick: hanldeOnClickInput,
-                tabIndex: isDisabled || disabled ? -1 : 0,
+                onClick: () => !isDisabled && setIsOpen(!isOpen),
+                tabIndex: isDisabled ? -1 : 0,
                 className: triggerClassName,
                 children: trigger
               }
@@ -17188,36 +17128,33 @@ function Select({
               {
                 "aria-selected": isOpen,
                 className: cn(
-                  "focus:ring-primary-300 flex min-h-10 cursor-pointer rounded-lg border bg-white text-gray-900 transition-all focus-within:outline-none focus:ring",
-                  (isDisabled || disabled) && "cursor-not-allowed bg-gray-100",
+                  "focus:ring-primary-300 flex min-h-10 cursor-pointer items-center justify-between rounded-lg border bg-white px-3 py-2 text-gray-900 transition-all focus-within:outline-none focus:ring",
+                  isDisabled && "cursor-not-allowed bg-gray-100",
                   isOpen ? "border-primary-300 ring-0" : "border-gray-200",
                   hasError && "border-danger-500"
                 ),
-                onClick: hanldeOnClickInput,
-                tabIndex: isDisabled && disabled ? -1 : 0,
+                onClick: () => !isDisabled && setIsOpen(!isOpen),
+                tabIndex: isDisabled ? -1 : 0,
                 children: [
-                  icon && /* @__PURE__ */ jsx435("div", { className: "flex items-center border-r border-gray-200 px-3 py-2", children: /* @__PURE__ */ jsx435(Icon_default, { name: icon, size: 22, className: "text-gray-600" }) }),
-                  /* @__PURE__ */ jsxs94("div", { className: "flex w-full flex-1 items-center justify-between px-3 py-2", children: [
-                    /* @__PURE__ */ jsx435("div", { className: "min-w-0 flex-1 text-xs font-medium text-gray-900", children: getDisplayValue() }),
-                    /* @__PURE__ */ jsxs94("div", { className: "ml-2 flex shrink-0 items-start gap-1 self-start pt-0.5", children: [
-                      showClearButton && /* @__PURE__ */ jsx435(
-                        "button",
-                        {
-                          type: "button",
-                          onClick: handleClear,
-                          className: "cursor-pointer rounded text-center text-gray-700",
-                          children: /* @__PURE__ */ jsx435(Icon_default, { name: "times-circle", size: 20 })
-                        }
-                      ),
-                      /* @__PURE__ */ jsx435(
-                        Icon_default,
-                        {
-                          className: "text-gray-700",
-                          name: isOpen ? "angle-up-small" : "angle-down-small",
-                          size: 20
-                        }
-                      )
-                    ] })
+                  /* @__PURE__ */ jsx435("div", { className: "flex-1 overflow-hidden text-xs font-medium text-gray-900", children: getDisplayValue() }),
+                  /* @__PURE__ */ jsxs94("div", { className: "ml-2 flex items-center gap-1", children: [
+                    showClearButton && /* @__PURE__ */ jsx435(
+                      "button",
+                      {
+                        type: "button",
+                        onClick: handleClear,
+                        className: "cursor-pointer rounded text-center text-gray-700",
+                        children: /* @__PURE__ */ jsx435(Icon_default, { name: "times-circle", size: 20 })
+                      }
+                    ),
+                    /* @__PURE__ */ jsx435(
+                      Icon_default,
+                      {
+                        className: "text-gray-700",
+                        name: isOpen ? "angle-up-small" : "angle-down-small",
+                        size: 20
+                      }
+                    )
                   ] })
                 ]
               }
@@ -17256,22 +17193,27 @@ function Select({
                       onScroll: onLoadMore !== void 0 ? handleScroll : void 0,
                       children: [
                         renderOptions === void 0 && /* @__PURE__ */ jsxs94(Fragment10, { children: [
-                          filteredOptions.length === 0 ? /* @__PURE__ */ jsx435("div", { className: "px-3 py-8 text-center text-sm text-gray-500", children: "No options found" }) : renderEntries.map(
-                            (entry, i) => entry.kind === "group" ? /* @__PURE__ */ jsxs94("div", { className: "space-y-2", children: [
-                              /* @__PURE__ */ jsx435(
-                                Text,
-                                {
-                                  variant: "t2",
-                                  weight: "semibold",
-                                  className: "text-gray-900",
-                                  children: entry.label
-                                }
-                              ),
-                              entry.items.map(
-                                ({ option, index }) => renderOptionItem(option, index)
-                              )
-                            ] }, `grp-${i}`) : renderOptionItem(entry.option, entry.index)
-                          ),
+                          filteredOptions.length === 0 ? /* @__PURE__ */ jsx435("div", { className: "px-3 py-8 text-center text-sm text-gray-500", children: "No options found" }) : filteredOptions.map((option, index) => {
+                            const selected = isSelected(option);
+                            const highlighted = index === highlightedIndex;
+                            return /* @__PURE__ */ jsx435(
+                              "div",
+                              {
+                                ref: (el) => {
+                                  optionRefs.current[index] = el;
+                                },
+                                onMouseEnter: () => setHighlightedIndex(index),
+                                onClick: () => handleSelect(option),
+                                className: cn(
+                                  "flex cursor-pointer items-center justify-between rounded-lg px-3 py-2 text-sm font-medium text-gray-900 transition-colors focus:outline-none",
+                                  highlighted && "bg-primary-100",
+                                  selected ? "bg-primary-50 border-primary-300" : "hover:bg-gray-50"
+                                ),
+                                children: /* @__PURE__ */ jsx435("div", { className: "flex-1", children: renderOption !== void 0 && renderOption !== null ? renderOption?.(option, { selected }) : /* @__PURE__ */ jsx435("div", { className: cn(selected && "font-medium"), children: option.label }) })
+                              },
+                              option.value
+                            );
+                          }),
                           onLoadMore !== void 0 && /* @__PURE__ */ jsx435(
                             "div",
                             {