@bigbinary/neeto-atoms 1.0.103 → 1.0.105

package/dist/cjs/{Select-Bs5Fp3wj.js → Select-VQCROyX1.js}

@@ -2,10 +2,10 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
-var hyphenize = require('./hyphenize-B8IGPzjp.js');
-var SelectFieldWrapper = require('./SelectFieldWrapper-BLVvwUcK.js');
+var fieldIds = require('./fieldIds-DiVU6GVS.js');
+var SelectFieldWrapper = require('./SelectFieldWrapper-CIh_atln.js');
 var utils = require('./utils-BhM0B89p.js');
-var primitives_Combobox = require('./Combobox-BE8LT4yq.js');
+var primitives_Combobox = require('./Combobox-PAGcNUr6.js');
 var primitives_Spinner = require('./primitives/Spinner.js');
 var x = require('./x-Brw3FJst.js');
 var chevronDown = require('./chevron-down-CPsWSS51.js');
@@ -14,13 +14,6 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
 var React__default = /*#__PURE__*/_interopDefault(React);
 
-function buildAriaDescribedBy(error, errorId, helpText, helpTextId) {
-  return [error ? errorId : null, helpText ? helpTextId : null].filter(Boolean).join(" ") || void 0;
-}
-function buildTestIdPrefix(dataTestId, label) {
-  return dataTestId ?? (label ? hyphenize.hyphenize(label) : void 0);
-}
-
 function useAsyncOptions({
   loadOptions,
   defaultOptions = false,
@@ -117,6 +110,28 @@ function useLazyLoadSentinel({
   return sentinelRef;
 }
 
+const INPUT_CHANGE_REASON = "input-change";
+const SIZE_CONFIG = {
+  small: {
+    chips: "min-h-8 md:min-h-7 text-base md:text-xs gap-0.5 px-1 py-0.5",
+    input: "text-base md:text-xs",
+    chip: "h-4.5 text-[0.6875rem] px-1",
+    icon: "size-3.5"
+  },
+  medium: {
+    chips: "min-h-8 text-base md:text-sm gap-1 px-2.5 py-1",
+    input: "text-base md:text-sm",
+    chip: "h-5.25 text-xs px-1.5",
+    icon: "size-4"
+  },
+  large: {
+    chips: "min-h-10 text-base md:text-sm gap-1 px-2.5 py-1.5",
+    input: "text-base md:text-sm",
+    chip: "h-6 text-xs px-2",
+    icon: "size-5"
+  }
+};
+
 const CREATE_PREFIX = "__create__:";
 const isCreateValue = (val) => typeof val === "string" && val.startsWith(CREATE_PREFIX);
 function useCreatableItems({
@@ -132,9 +147,11 @@ function useCreatableItems({
 }) {
   const [inputValue, setInputValue] = React.useState("");
   const handleInputValueChange = React.useCallback(
-    (value) => {
-      setInputValue(value);
-      onAsyncInputChange?.(value);
+    (value, details) => {
+      const isTyping = details?.reason === INPUT_CHANGE_REASON;
+      const nextValue = isTyping ? value : "";
+      setInputValue(nextValue);
+      if (isTyping) onAsyncInputChange?.(nextValue);
     },
     [onAsyncInputChange]
   );
@@ -193,6 +210,13 @@ function isOptionGroup(opt) {
   return "options" in opt && Array.isArray(opt.options);
 }
 
+function assignRef(ref, element) {
+  if (typeof ref === "function") {
+    ref(element);
+  } else if (ref) {
+    ref.current = element;
+  }
+}
 function normalizeOption(option, getValue, getLabel) {
   if (!getValue && !getLabel) return option;
   return {
@@ -228,6 +252,16 @@ function toBaseUiItems(options) {
   }
   return options.map((o) => o.value);
 }
+function resolveIsSearchable({
+  isSearchable,
+  searchThreshold,
+  optionCount,
+  isCountKnown
+}) {
+  if (!isSearchable) return false;
+  if (searchThreshold === void 0 || !isCountKnown) return true;
+  return optionCount >= searchThreshold;
+}
 function computeEffectiveItems(children, baseUiItems, showCreateOption, isGrouped, trimmedInput) {
   if (children) return void 0;
   const createValue = showCreateOption ? `${CREATE_PREFIX}${trimmedInput}` : null;
@@ -275,27 +309,6 @@ function useMultiSelectOptions(props) {
   };
 }
 
-const SIZE_CONFIG = {
-  small: {
-    chips: "min-h-8 md:min-h-7 text-base md:text-xs gap-0.5 px-1 py-0.5",
-    input: "text-base md:text-xs",
-    chip: "h-4.5 text-[0.6875rem] px-1",
-    icon: "size-3.5"
-  },
-  medium: {
-    chips: "min-h-8 text-base md:text-sm gap-1 px-2.5 py-1",
-    input: "text-base md:text-sm",
-    chip: "h-5.25 text-xs px-1.5",
-    icon: "size-4"
-  },
-  large: {
-    chips: "min-h-10 text-base md:text-sm gap-1 px-2.5 py-1.5",
-    input: "text-base md:text-sm",
-    chip: "h-6 text-xs px-2",
-    icon: "size-5"
-  }
-};
-
 const defaultFormatCreateLabel$1 = (v) => `Create "${v}"`;
 function useSelectState(props) {
   const {
@@ -316,7 +329,11 @@ function useSelectState(props) {
     isClearable = false,
     isDisabled = false,
     required = false,
-    isSearchable = true,
+    isSearchable: isSearchableProp = true,
+    searchPosition = "trigger",
+    searchPlaceholder = "Search...",
+    searchThreshold,
+    isAsyncLoadOptionEnabled = false,
     autoHighlight = true,
     onOpenChange,
     children
@@ -326,6 +343,7 @@ function useSelectState(props) {
   const id = idProp ?? generatedId;
   const errorId = `error_${id}`;
   const helpTextId = `helpText_${id}`;
+  const labelId = `label_${id}`;
   const sizeConfig = SIZE_CONFIG[size];
   const isControlled = valueProp !== void 0;
   const [internalValue, setInternalValue] = React.useState(
@@ -355,9 +373,11 @@ function useSelectState(props) {
   const [inputValue, setInputValueState] = React.useState("");
   const trimmedInput = inputValue.trim();
   const combinedHandleInputValueChange = React.useCallback(
-    (value) => {
-      setInputValueState(value);
-      if (opt.isAsync) opt.handleAsyncInputChange(value);
+    (value, details) => {
+      const isTyping = details?.reason === INPUT_CHANGE_REASON;
+      const nextValue = isTyping ? value : "";
+      setInputValueState(nextValue);
+      if (isTyping && opt.isAsync) opt.handleAsyncInputChange(nextValue);
     },
     [opt.isAsync, opt.handleAsyncInputChange]
   );
@@ -399,14 +419,20 @@ function useSelectState(props) {
     },
     []
   );
-  const ariaDescribedBy = buildAriaDescribedBy(
+  const ariaDescribedBy = fieldIds.buildAriaDescribedBy(
     error,
     errorId,
     helpText,
     helpTextId
   );
-  const testIdPrefix = buildTestIdPrefix(dataTestId, label);
+  const testIdPrefix = fieldIds.buildTestIdPrefix(dataTestId, label);
   const showClearButton = isClearable && !!currentValue && !isDisabled;
+  const isSearchable = resolveIsSearchable({
+    isSearchable: isSearchableProp,
+    searchThreshold,
+    optionCount: opt.flatOptions.length,
+    isCountKnown: !opt.isAsync && !isCreatable && !isAsyncLoadOptionEnabled
+  });
   const flatOptionsMap = React.useMemo(
     () => new Map(opt.flatOptions.map((o) => [o.value, o])),
     [opt.flatOptions]
@@ -445,6 +471,7 @@ function useSelectState(props) {
     id,
     errorId,
     helpTextId,
+    labelId,
     sizeConfig,
     isControlled,
     currentValue,
@@ -467,6 +494,9 @@ function useSelectState(props) {
     isDisabled,
     required,
     isSearchable,
+    searchPosition,
+    searchPlaceholder,
+    inputValue,
     autoHighlight,
     onOpenChange,
     isClearable
@@ -489,6 +519,11 @@ function useMultiSelectState(props) {
     onCreateOption,
     formatCreateLabel = defaultFormatCreateLabel,
     formatOptionLabel,
+    isSearchable: isSearchableProp = true,
+    searchPosition = "trigger",
+    searchPlaceholder = "Search...",
+    searchThreshold,
+    isAsyncLoadOptionEnabled = false,
     children
   } = props;
   const opt = useMultiSelectOptions(props);
@@ -496,7 +531,14 @@ function useMultiSelectState(props) {
   const id = idProp ?? generatedId;
   const errorId = `error_${id}`;
   const helpTextId = `helpText_${id}`;
+  const labelId = `label_${id}`;
   const sizeConfig = SIZE_CONFIG[size];
+  const isSearchable = resolveIsSearchable({
+    isSearchable: isSearchableProp,
+    searchThreshold,
+    optionCount: opt.flatOptions.length,
+    isCountKnown: !opt.isAsync && !isCreatable && !isAsyncLoadOptionEnabled
+  });
   const isControlled = valueProp !== void 0;
   const [internalValue, setInternalValue] = React.useState(
     defaultValue ?? []
@@ -526,13 +568,13 @@ function useMultiSelectState(props) {
     onAsyncInputChange: opt.isAsync ? opt.handleAsyncInputChange : void 0,
     children
   });
-  const ariaDescribedBy = buildAriaDescribedBy(
+  const ariaDescribedBy = fieldIds.buildAriaDescribedBy(
     error,
     errorId,
     helpText,
     helpTextId
   );
-  const testIdPrefix = buildTestIdPrefix(dataTestId, label);
+  const testIdPrefix = fieldIds.buildTestIdPrefix(dataTestId, label);
   const flatOptionsMap = React.useMemo(
     () => new Map(opt.flatOptions.map((o) => [o.value, o])),
     [opt.flatOptions]
@@ -561,9 +603,13 @@ function useMultiSelectState(props) {
     id,
     errorId,
     helpTextId,
+    labelId,
     sizeConfig,
     isControlled,
     selectedValues,
+    isSearchable,
+    searchPosition,
+    searchPlaceholder,
     effectiveItems,
     creatableFilter,
     handleInputValueChange,
@@ -655,7 +701,7 @@ function MultiSelectDropdown({
           {
             ref: loaderCallbackRef,
             className: "flex w-full items-center justify-center py-3",
-            "data-testid": testIdPrefix ? `${testIdPrefix}-lazy-loader` : "lazy-loader",
+            "data-testid": `${testIdPrefix}-lazy-loader`,
             children: /* @__PURE__ */ jsxRuntime.jsx(primitives_Spinner.Spinner, {})
           }
         )
@@ -664,9 +710,12 @@ function MultiSelectDropdown({
   );
 }
 
+const omitUndefined = (props) => Object.fromEntries(
+  Object.entries(props).filter(([, value]) => value !== void 0)
+);
 const SelectAnchor = React.forwardRef(
-  ({ isSearchable, className, dataTestId, children }, ref) => {
-    if (isSearchable) {
+  ({ renderAsTrigger, className, dataTestId, triggerFieldProps, children }, ref) => {
+    if (!renderAsTrigger) {
       return /* @__PURE__ */ jsxRuntime.jsx(
         "div",
         {
@@ -677,15 +726,21 @@ const SelectAnchor = React.forwardRef(
         }
       );
     }
+    const { id, ...ariaProps } = triggerFieldProps ?? {};
     return /* @__PURE__ */ jsxRuntime.jsx(
       primitives_Combobox.ComboboxTrigger$1,
       {
         nativeButton: false,
-        render: (props) => /* @__PURE__ */ jsxRuntime.jsx(
+        ...id ? { id } : {},
+        render: ({ ref: baseUiRef, ...props }) => /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
             ...props,
-            ref,
+            ...omitUndefined(ariaProps),
+            ref: (element) => {
+              assignRef(baseUiRef, element);
+              assignRef(ref, element);
+            },
             className,
             ...dataTestId ? { "data-testid": dataTestId } : {}
           }
@@ -701,11 +756,15 @@ const SelectCombobox = React.forwardRef(
   ({
     name,
     id,
+    labelId,
     effectiveItems,
     labelForValue,
     renderOption,
     renderTrigger,
     isSearchable,
+    searchPosition,
+    searchPlaceholder,
+    inputValue,
     isAsync,
     isCreatable,
     creatableFilter,
@@ -729,6 +788,20 @@ const SelectCombobox = React.forwardRef(
     children
   }, ref) => {
     const [anchorEl, setAnchorEl] = React.useState(null);
+    const isContentSearch = isSearchable && searchPosition === "content";
+    const renderTriggerInput = searchPosition !== "content";
+    const isTriggerSearch = isSearchable && renderTriggerInput;
+    const useTriggerAnchor = !isTriggerSearch;
+    const showValue = !!currentValue && (!isTriggerSearch || inputValue === "");
+    const showPlaceholder = !currentValue && !isTriggerSearch;
+    const setTriggerEl = React.useCallback(
+      (element) => {
+        setAnchorEl(element);
+        if (renderTriggerInput) return;
+        assignRef(ref, element);
+      },
+      [ref, renderTriggerInput]
+    );
     const handleClearClick = React.useCallback(
       (event) => {
         event.stopPropagation();
@@ -750,7 +823,8 @@ const SelectCombobox = React.forwardRef(
           } : {},
           value: currentValue,
           onValueChange: handleValueChange,
-          ...isCreatable || isAsync ? { onInputValueChange: handleInputValueChange } : {},
+          inputValue,
+          onInputValueChange: handleInputValueChange,
           onOpenChange,
           disabled: isDisabled,
           autoHighlight,
@@ -758,10 +832,17 @@ const SelectCombobox = React.forwardRef(
             /* @__PURE__ */ jsxRuntime.jsx(
               SelectAnchor,
               {
-                ref: setAnchorEl,
-                isSearchable,
+                ref: setTriggerEl,
                 dataTestId: testIdPrefix,
-                className: !isSearchable ? "cursor-pointer" : void 0,
+                renderAsTrigger: useTriggerAnchor,
+                className: useTriggerAnchor ? "cursor-pointer" : void 0,
+                triggerFieldProps: renderTriggerInput ? void 0 : {
+                  id,
+                  "aria-labelledby": labelId,
+                  "aria-describedby": ariaDescribedBy,
+                  "aria-required": required || void 0,
+                  "aria-invalid": !!error || void 0
+                },
                 children: /* @__PURE__ */ jsxRuntime.jsxs(
                   primitives_Combobox.ComboboxChips,
                   {
@@ -772,24 +853,28 @@ const SelectCombobox = React.forwardRef(
                     ),
                     ...testIdPrefix ? { "data-testid": `${testIdPrefix}-select-container` } : {},
                     children: [
-                      !isSearchable && (currentValue ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 truncate", children: renderTrigger(currentValue) }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 truncate text-muted-foreground", children: placeholder })),
-                      /* @__PURE__ */ jsxRuntime.jsx(
-                        primitives_Combobox.ComboboxChipsInput,
-                        {
-                          ref,
-                          id,
-                          placeholder: isSearchable && !currentValue ? placeholder : void 0,
-                          "aria-invalid": !!error || void 0,
-                          "aria-describedby": ariaDescribedBy,
-                          "aria-required": required || void 0,
-                          className: utils.cn(
-                            sizeConfig.input,
-                            !isSearchable && "w-0 min-w-0 overflow-hidden p-0 opacity-0"
-                          ),
-                          disabled: isDisabled,
-                          ...testIdPrefix ? { "data-testid": `${testIdPrefix}-select-input` } : {}
-                        }
-                      ),
+                      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid min-w-0 flex-1 items-center [&>*]:col-start-1 [&>*]:row-start-1", children: [
+                        showValue && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 truncate", children: renderTrigger(currentValue) }),
+                        showPlaceholder && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 truncate text-muted-foreground", children: placeholder }),
+                        renderTriggerInput && /* @__PURE__ */ jsxRuntime.jsx(
+                          primitives_Combobox.ComboboxChipsInput,
+                          {
+                            ref,
+                            id,
+                            placeholder: isTriggerSearch && !currentValue ? placeholder : void 0,
+                            "aria-invalid": !!error || void 0,
+                            "aria-describedby": ariaDescribedBy,
+                            "aria-required": required || void 0,
+                            className: utils.cn(
+                              sizeConfig.input,
+                              "w-full min-w-0",
+                              !isSearchable && "w-0 overflow-hidden p-0 opacity-0"
+                            ),
+                            disabled: isDisabled,
+                            ...testIdPrefix ? { "data-testid": `${testIdPrefix}-select-input` } : {}
+                          }
+                        )
+                      ] }),
                       showClearButton && /* @__PURE__ */ jsxRuntime.jsx(
                         "button",
                         {
@@ -801,7 +886,7 @@ const SelectCombobox = React.forwardRef(
                           children: /* @__PURE__ */ jsxRuntime.jsx(x.X, { className: sizeConfig.icon })
                         }
                       ),
-                      isSearchable ? /* @__PURE__ */ jsxRuntime.jsx(
+                      isTriggerSearch ? /* @__PURE__ */ jsxRuntime.jsx(
                         primitives_Combobox.ComboboxTrigger,
                         {
                           className: utils.cn(
@@ -824,15 +909,26 @@ const SelectCombobox = React.forwardRef(
                 )
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx(primitives_Combobox.ComboboxContent, { anchor: anchorEl, ...contentProps, children: /* @__PURE__ */ jsxRuntime.jsx(
-              MultiSelectDropdown,
-              {
-                ...dropdownProps,
-                renderOption,
-                testIdPrefix,
-                children
-              }
-            ) })
+            /* @__PURE__ */ jsxRuntime.jsxs(primitives_Combobox.ComboboxContent, { anchor: anchorEl, ...contentProps, children: [
+              isContentSearch && /* @__PURE__ */ jsxRuntime.jsx(
+                primitives_Combobox.ComboboxInput,
+                {
+                  showTrigger: false,
+                  placeholder: searchPlaceholder,
+                  ...labelId ? { "aria-labelledby": labelId } : { "aria-label": searchPlaceholder },
+                  ...testIdPrefix ? { "data-testid": `${testIdPrefix}-select-input` } : {}
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                MultiSelectDropdown,
+                {
+                  ...dropdownProps,
+                  renderOption,
+                  testIdPrefix,
+                  children
+                }
+              )
+            ] })
           ]
         }
       )
@@ -845,10 +941,13 @@ const MultiSelectCombobox = React.forwardRef(
   ({
     name,
     id,
+    labelId,
     effectiveItems,
     labelForValue,
     renderOption,
     isSearchable,
+    searchPosition,
+    searchPlaceholder,
     isAsync,
     isCreatable,
     creatableFilter,
@@ -875,6 +974,18 @@ const MultiSelectCombobox = React.forwardRef(
     children
   }, ref) => {
     const [anchorEl, setAnchorEl] = React.useState(null);
+    const isContentSearch = isSearchable && searchPosition === "content";
+    const renderTriggerInput = searchPosition !== "content";
+    const isTriggerSearch = isSearchable && renderTriggerInput;
+    const useTriggerAnchor = !isTriggerSearch;
+    const setTriggerEl = React.useCallback(
+      (element) => {
+        setAnchorEl(element);
+        if (renderTriggerInput) return;
+        assignRef(ref, element);
+      },
+      [ref, renderTriggerInput]
+    );
     return (
       // @ts-expect-error — conditional spread creates a union that TS cannot narrow to the Combobox discriminated-union props
       /* @__PURE__ */ jsxRuntime.jsxs(
@@ -897,9 +1008,16 @@ const MultiSelectCombobox = React.forwardRef(
             /* @__PURE__ */ jsxRuntime.jsx(
               SelectAnchor,
               {
-                ref: setAnchorEl,
-                isSearchable,
-                className: !isSearchable ? "cursor-pointer" : void 0,
+                ref: setTriggerEl,
+                renderAsTrigger: useTriggerAnchor,
+                className: useTriggerAnchor ? "cursor-pointer" : void 0,
+                triggerFieldProps: renderTriggerInput ? void 0 : {
+                  id,
+                  "aria-labelledby": labelId,
+                  "aria-describedby": ariaDescribedBy,
+                  "aria-required": required || void 0,
+                  "aria-invalid": !!error || void 0
+                },
                 children: /* @__PURE__ */ jsxRuntime.jsxs(
                   primitives_Combobox.ComboboxChips,
                   {
@@ -911,22 +1029,23 @@ const MultiSelectCombobox = React.forwardRef(
                     ),
                     ...testIdPrefix ? { "data-testid": `${testIdPrefix}-select-container` } : {},
                     children: [
-                      selectedValues.map((val) => /* @__PURE__ */ jsxRuntime.jsx(
+                      selectedValues.map((val, index) => /* @__PURE__ */ jsxRuntime.jsx(
                         primitives_Combobox.ComboboxChip,
                         {
                           className: sizeConfig.chip,
                           showRemove: !hideChipRemove,
+                          ...renderTriggerInput || isDisabled ? {} : { tabIndex: index === 0 ? 0 : -1 },
                           ...testIdPrefix ? { "data-testid": `${testIdPrefix}-chip` } : {},
                           children: renderOption(val)
                         },
                         val
                       )),
-                      /* @__PURE__ */ jsxRuntime.jsx(
+                      renderTriggerInput ? /* @__PURE__ */ jsxRuntime.jsx(
                         primitives_Combobox.ComboboxChipsInput,
                         {
                           ref,
                           id,
-                          placeholder: isSearchable && selectedValues.length === 0 ? placeholder : void 0,
+                          placeholder: isTriggerSearch && selectedValues.length === 0 ? placeholder : void 0,
                           "aria-invalid": !!error || void 0,
                           "aria-describedby": ariaDescribedBy,
                           "aria-required": required || void 0,
@@ -937,21 +1056,44 @@ const MultiSelectCombobox = React.forwardRef(
                           disabled: isDisabled,
                           ...testIdPrefix ? { "data-testid": `${testIdPrefix}-select-input` } : {}
                         }
-                      )
+                      ) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                        selectedValues.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 flex-1 truncate text-muted-foreground", children: placeholder }),
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          chevronDown.ChevronDown,
+                          {
+                            "aria-hidden": true,
+                            className: utils.cn(
+                              "pointer-events-none ms-auto shrink-0 text-muted-foreground",
+                              sizeConfig.icon
+                            )
+                          }
+                        )
+                      ] })
                     ]
                   }
                 )
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx(primitives_Combobox.ComboboxContent, { anchor: anchorEl, ...contentProps, children: /* @__PURE__ */ jsxRuntime.jsx(
-              MultiSelectDropdown,
-              {
-                ...dropdownProps,
-                renderOption,
-                testIdPrefix,
-                children
-              }
-            ) })
+            /* @__PURE__ */ jsxRuntime.jsxs(primitives_Combobox.ComboboxContent, { anchor: anchorEl, ...contentProps, children: [
+              isContentSearch && /* @__PURE__ */ jsxRuntime.jsx(
+                primitives_Combobox.ComboboxInput,
+                {
+                  showTrigger: false,
+                  placeholder: searchPlaceholder,
+                  ...labelId ? { "aria-labelledby": labelId } : { "aria-label": searchPlaceholder },
+                  ...testIdPrefix ? { "data-testid": `${testIdPrefix}-select-input` } : {}
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                MultiSelectDropdown,
+                {
+                  ...dropdownProps,
+                  renderOption,
+                  testIdPrefix,
+                  children
+                }
+              )
+            ] })
           ]
         }
       )
@@ -969,6 +1111,7 @@ const SingleSelectInner = React.forwardRef(
       helpText,
       errorId,
       helpTextId,
+      labelId,
       isDisabled,
       required,
       testIdPrefix,
@@ -977,6 +1120,9 @@ const SingleSelectInner = React.forwardRef(
       renderOption,
       renderTrigger,
       isSearchable,
+      searchPosition,
+      searchPlaceholder,
+      inputValue,
       isAsync,
       creatableFilter,
       isControlled,
@@ -1010,17 +1156,23 @@ const SingleSelectInner = React.forwardRef(
         testIdPrefix,
         labelProps: props.labelProps,
         className: props.className,
+        labelId,
+        focusTargetOnLabelClick: searchPosition === "content",
         children: /* @__PURE__ */ jsxRuntime.jsx(
           SelectCombobox,
           {
             ref,
             name: props.name,
             id,
+            labelId: label ? labelId : void 0,
             effectiveItems,
             labelForValue,
             renderOption,
             renderTrigger,
             isSearchable,
+            searchPosition,
+            searchPlaceholder,
+            inputValue,
             isAsync,
             isCreatable: props.isCreatable ?? false,
             creatableFilter,
@@ -1072,10 +1224,14 @@ const MultiSelectInner = React.forwardRef(
       helpText,
       errorId,
       helpTextId,
+      labelId,
       testIdPrefix,
       effectiveItems,
       labelForValue,
       renderOption,
+      isSearchable,
+      searchPosition,
+      searchPlaceholder,
       isAsync,
       creatableFilter,
       isControlled,
@@ -1107,16 +1263,21 @@ const MultiSelectInner = React.forwardRef(
         testIdPrefix,
         labelProps: props.labelProps,
         className: props.className,
+        labelId,
+        focusTargetOnLabelClick: searchPosition === "content",
         children: /* @__PURE__ */ jsxRuntime.jsx(
           MultiSelectCombobox,
           {
             ref,
             name: props.name,
             id,
+            labelId: label ? labelId : void 0,
             effectiveItems,
             labelForValue,
             renderOption,
-            isSearchable: props.isSearchable ?? true,
+            isSearchable,
+            searchPosition,
+            searchPlaceholder,
             isAsync,
             isCreatable: props.isCreatable ?? false,
             creatableFilter,
@@ -1203,4 +1364,4 @@ const Select = React.forwardRef((props, ref) => {
 Select.displayName = "Select";
 
 exports.Select = Select;
-//# sourceMappingURL=Select-Bs5Fp3wj.js.map
+//# sourceMappingURL=Select-VQCROyX1.js.map