@hubstr/kit 0.1.4 → 0.1.6

package/ui/es/base-ui/Select/hooks.mjs

@@ -0,0 +1,293 @@
+"use client";
+import { useAppElement } from "../../ThemeProvider/AppElementContext.mjs";
+import { countVirtualItems, getOptionSearchText, isGroupOption, isValueEmpty, normalizeValueFor, splitBySeparators } from "./helpers.mjs";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/base-ui/Select/hooks.tsx
+function useSelectValue({ defaultValue, extraOptions, isMultiple, onChange, onSelect, options, setExtraOptions, value }) {
+	const [uncontrolledValue, setUncontrolledValue] = useState(() => {
+		if (defaultValue !== void 0) return defaultValue;
+		return isMultiple ? [] : null;
+	});
+	const normalizeValue = useMemo(() => normalizeValueFor(isMultiple), [isMultiple]);
+	const mergedValue = value !== void 0 ? value : uncontrolledValue;
+	const normalizedValue = useMemo(() => normalizeValue(mergedValue), [mergedValue, normalizeValue]);
+	const valueArray = useMemo(() => {
+		if (isMultiple) return normalizedValue;
+		return isValueEmpty(normalizedValue) ? [] : [normalizedValue];
+	}, [isMultiple, normalizedValue]);
+	const { optionMap, resolvedOptions } = useMemo(() => {
+		const baseOptions = options ?? [];
+		const optionValueMap = /* @__PURE__ */ new Map();
+		const addOption = (item) => {
+			if (!optionValueMap.has(item.value)) optionValueMap.set(item.value, item);
+		};
+		baseOptions.forEach((item) => {
+			if (isGroupOption(item)) item.options.forEach(addOption);
+			else addOption(item);
+		});
+		const filteredExtraOptions = extraOptions.filter((item) => !optionValueMap.has(item.value));
+		filteredExtraOptions.forEach(addOption);
+		const mergedOptions = [...baseOptions, ...filteredExtraOptions];
+		const missingValueOptions = valueArray.filter((val) => !optionValueMap.has(val)).map((val) => ({
+			label: String(val),
+			value: val
+		}));
+		missingValueOptions.forEach(addOption);
+		return {
+			optionMap: optionValueMap,
+			resolvedOptions: missingValueOptions.length ? [...mergedOptions, ...missingValueOptions] : mergedOptions
+		};
+	}, [
+		extraOptions,
+		options,
+		valueArray
+	]);
+	const getOption = useCallback((optionValue) => {
+		const matched = optionMap.get(optionValue);
+		if (matched) return matched;
+		if (optionValue && typeof optionValue === "object" && "label" in optionValue) return {
+			label: optionValue.label,
+			value: optionValue
+		};
+		return {
+			label: String(optionValue),
+			value: optionValue
+		};
+	}, [optionMap]);
+	const previousValueRef = useRef(normalizedValue);
+	useEffect(() => {
+		previousValueRef.current = normalizedValue;
+	}, [normalizedValue]);
+	const handleValueChange = useCallback((nextValue) => {
+		const normalizedNextValue = normalizeValue(nextValue);
+		const previousValue = previousValueRef.current;
+		if (isMultiple) {
+			const prevValues = Array.isArray(previousValue) ? previousValue : [];
+			const nextValues = Array.isArray(normalizedNextValue) ? normalizedNextValue : [];
+			nextValues.filter((val) => !prevValues.some((prev) => Object.is(prev, val))).forEach((val) => onSelect?.(val, getOption(val)));
+			if (value === void 0) setUncontrolledValue(nextValues);
+			onChange?.(nextValues, nextValues.map((val) => getOption(val)));
+		} else {
+			if (!isValueEmpty(normalizedNextValue) && !Object.is(previousValue, normalizedNextValue)) onSelect?.(normalizedNextValue, getOption(normalizedNextValue));
+			if (value === void 0) setUncontrolledValue(normalizedNextValue);
+			onChange?.(normalizedNextValue, isValueEmpty(normalizedNextValue) ? void 0 : getOption(normalizedNextValue));
+		}
+		previousValueRef.current = normalizedNextValue;
+	}, [
+		getOption,
+		isMultiple,
+		normalizeValue,
+		onChange,
+		onSelect,
+		value
+	]);
+	return {
+		appendTagValues: useCallback((rawValues) => {
+			const valuesToAdd = rawValues.map((val) => val.trim()).filter(Boolean);
+			if (!valuesToAdd.length) return;
+			const nextValues = [...valueArray];
+			const newOptionValues = valuesToAdd.filter((val) => !optionMap.has(val));
+			if (newOptionValues.length > 0) setExtraOptions((prev) => {
+				const existingValues = new Set(prev.map((item) => item.value));
+				const merged = [...prev];
+				newOptionValues.forEach((val) => {
+					if (!existingValues.has(val)) merged.push({
+						label: val,
+						value: val
+					});
+				});
+				return merged;
+			});
+			valuesToAdd.forEach((val) => {
+				if (!nextValues.some((item) => Object.is(item, val))) nextValues.push(val);
+			});
+			if (nextValues.length !== valueArray.length) handleValueChange(nextValues);
+		}, [
+			handleValueChange,
+			optionMap,
+			setExtraOptions,
+			valueArray
+		]),
+		getOption,
+		handleValueChange,
+		normalizedValue,
+		normalizeValue,
+		optionMap,
+		resolvedOptions,
+		valueArray
+	};
+}
+function useSelectOpen({ defaultOpen, onOpenChange, open }) {
+	const [uncontrolledOpen, setUncontrolledOpen] = useState(Boolean(defaultOpen));
+	useEffect(() => {
+		if (open !== void 0) setUncontrolledOpen(open);
+	}, [open]);
+	const mergedOpen = open ?? uncontrolledOpen;
+	return {
+		handleOpenChange: useCallback((nextOpen, eventDetails) => {
+			onOpenChange?.(nextOpen, eventDetails);
+			if (open === void 0) setUncontrolledOpen(nextOpen);
+		}, [onOpenChange, open]),
+		mergedOpen
+	};
+}
+function useSelectSearch({ appendTagValues, handleOpenChange, mergedOpen, mode, resolvedOptions, showSearch, tokenSeparators }) {
+	const [searchValue, setSearchValue] = useState("");
+	const shouldShowSearch = Boolean(showSearch || mode === "tags");
+	useEffect(() => {
+		if (!mergedOpen) setSearchValue("");
+	}, [mergedOpen]);
+	const handleSearchChange = useCallback((event) => {
+		const nextValue = event.target.value;
+		if (mode === "tags") {
+			const parts = splitBySeparators(nextValue, tokenSeparators);
+			if (parts.length > 1) {
+				const pending = parts.pop() ?? "";
+				appendTagValues(parts.filter(Boolean));
+				setSearchValue(pending);
+				return;
+			}
+		}
+		setSearchValue(nextValue);
+	}, [
+		appendTagValues,
+		mode,
+		tokenSeparators
+	]);
+	const handleSearchKeyDown = useCallback((event) => {
+		event.stopPropagation();
+		if (event.key === "Escape") {
+			handleOpenChange(false);
+			return;
+		}
+		if (mode !== "tags") return;
+		const isSeparator = tokenSeparators?.includes(event.key);
+		if (event.key === "Enter" || isSeparator) {
+			event.preventDefault();
+			event.stopPropagation();
+			appendTagValues([searchValue]);
+			setSearchValue("");
+		}
+	}, [
+		appendTagValues,
+		handleOpenChange,
+		mode,
+		searchValue,
+		tokenSeparators
+	]);
+	const stopSearchPropagation = useCallback((event) => {
+		event.stopPropagation();
+	}, []);
+	return {
+		filteredOptions: useMemo(() => {
+			if (!shouldShowSearch || !searchValue.trim()) return resolvedOptions;
+			const query = searchValue.trim().toLowerCase();
+			return resolvedOptions.map((item) => {
+				if (isGroupOption(item)) {
+					const groupItems = item.options.filter((option) => getOptionSearchText(option).toLowerCase().includes(query));
+					if (!groupItems.length) return null;
+					return {
+						...item,
+						options: groupItems
+					};
+				}
+				return getOptionSearchText(item).toLowerCase().includes(query) ? item : null;
+			}).filter(Boolean);
+		}, [
+			resolvedOptions,
+			searchValue,
+			shouldShowSearch
+		]),
+		handleSearchChange,
+		handleSearchKeyDown,
+		searchValue,
+		shouldShowSearch,
+		stopSearchPropagation
+	};
+}
+function useSelectVirtual({ filteredOptions, listItemHeight, size, valueArray, virtual }) {
+	const listRef = useRef(null);
+	const pointerScrollRef = useRef(false);
+	const pointerScrollTimeoutRef = useRef(null);
+	const renderVirtualItem = useCallback((props) => {
+		const { ref, ...rest } = props;
+		return /* @__PURE__ */ jsx("div", {
+			...rest,
+			ref: (node) => {
+				if (node) node.scrollIntoView = (...args) => {
+					if (!pointerScrollRef.current) HTMLElement.prototype.scrollIntoView.call(node, ...args);
+				};
+				if (typeof ref === "function") ref(node);
+				else if (ref && "current" in ref) ref.current = node;
+			}
+		});
+	}, []);
+	const markPointerScroll = useCallback(() => {
+		pointerScrollRef.current = true;
+		if (pointerScrollTimeoutRef.current) clearTimeout(pointerScrollTimeoutRef.current);
+		pointerScrollTimeoutRef.current = setTimeout(() => {
+			pointerScrollRef.current = false;
+		}, 120);
+	}, []);
+	const handleListScroll = useCallback(() => {
+		if (!virtual || !pointerScrollRef.current) return;
+		const listElement = listRef.current;
+		const activeElement = document.activeElement;
+		if (listElement && activeElement && listElement.contains(activeElement)) listElement.focus({ preventScroll: true });
+	}, [virtual]);
+	useEffect(() => {
+		return () => {
+			if (pointerScrollTimeoutRef.current) clearTimeout(pointerScrollTimeoutRef.current);
+		};
+	}, []);
+	const virtualListStyle = useMemo(() => {
+		if (!virtual) return void 0;
+		const rowCount = countVirtualItems(filteredOptions);
+		return { height: `min(${Math.min(Math.max(rowCount, 1), 6) * (listItemHeight ?? (size === "large" ? 40 : size === "small" ? 28 : 32)) + 8}px, var(--hubstr-select-available-height, var(--available-height)))` };
+	}, [
+		filteredOptions,
+		listItemHeight,
+		size,
+		virtual
+	]);
+	return {
+		handleListScroll,
+		keepMountedIndices: useMemo(() => {
+			if (!virtual || valueArray.length === 0) return void 0;
+			const selectedSet = new Set(valueArray);
+			const indices = [];
+			let index = 0;
+			filteredOptions.forEach((item) => {
+				if (isGroupOption(item)) {
+					if (item.options.some((option) => selectedSet.has(option.value))) indices.push(index);
+					index += 1;
+					return;
+				}
+				if (selectedSet.has(item.value)) indices.push(index);
+				index += 1;
+			});
+			return indices.length ? indices : void 0;
+		}, [
+			filteredOptions,
+			valueArray,
+			virtual
+		]),
+		listRef,
+		markPointerScroll,
+		renderVirtualItem,
+		virtualListStyle
+	};
+}
+function usePortalContainer() {
+	const appElement = useAppElement();
+	return useMemo(() => {
+		if (typeof window === "undefined") return appElement;
+		if (!(appElement instanceof HTMLElement)) return void 0;
+		return window.getComputedStyle(appElement).display === "contents" ? document.body : appElement;
+	}, [appElement]);
+}
+//#endregion
+export { usePortalContainer, useSelectOpen, useSelectSearch, useSelectValue, useSelectVirtual };
+
+//# sourceMappingURL=hooks.mjs.map

package/ui/es/base-ui/Select/hooks.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.mjs","names":[],"sources":["../../../src/base-ui/Select/hooks.tsx"],"sourcesContent":["'use client';\r\n\r\nimport {\r\n  type ChangeEvent,\r\n  type HTMLAttributes,\r\n  type KeyboardEvent,\r\n  type MutableRefObject,\r\n  type Ref,\r\n  useCallback,\r\n  useEffect,\r\n  useMemo,\r\n  useRef,\r\n  useState,\r\n} from 'react';\r\n\r\nimport { useAppElement } from '../../ThemeProvider';\r\n\r\nimport {\r\n  countVirtualItems,\r\n  getOptionSearchText,\r\n  isGroupOption,\r\n  isValueEmpty,\r\n  normalizeValueFor,\r\n  splitBySeparators,\r\n} from './helpers';\r\nimport {\r\n  type SelectOption,\r\n  type SelectOptions,\r\n  type SelectProps,\r\n  type SelectRootChangeEventDetails,\r\n  type SelectSize,\r\n} from './type';\r\n\r\ninterface UseSelectValueParams {\r\n  defaultValue: SelectProps['defaultValue'];\r\n  extraOptions: SelectOption<any>[];\r\n  isMultiple: boolean;\r\n  onChange: SelectProps['onChange'];\r\n  onSelect: SelectProps['onSelect'];\r\n  options: SelectOptions<any> | undefined;\r\n  setExtraOptions: React.Dispatch<React.SetStateAction<SelectOption<any>[]>>;\r\n  value: SelectProps['value'];\r\n}\r\n\r\nexport function useSelectValue({\r\n  defaultValue,\r\n  extraOptions,\r\n  isMultiple,\r\n  onChange,\r\n  onSelect,\r\n  options,\r\n  setExtraOptions,\r\n  value,\r\n}: UseSelectValueParams) {\r\n  const [uncontrolledValue, setUncontrolledValue] = useState<any>(() => {\r\n    if (defaultValue !== undefined) return defaultValue;\r\n    return isMultiple ? [] : null;\r\n  });\r\n\r\n  const normalizeValue = useMemo(() => normalizeValueFor(isMultiple), [isMultiple]);\r\n\r\n  const mergedValue = value !== undefined ? value : uncontrolledValue;\r\n  const normalizedValue = useMemo(() => normalizeValue(mergedValue), [mergedValue, normalizeValue]);\r\n\r\n  const valueArray = useMemo(() => {\r\n    if (isMultiple) return normalizedValue as any[];\r\n    return isValueEmpty(normalizedValue) ? [] : [normalizedValue];\r\n  }, [isMultiple, normalizedValue]);\r\n\r\n  const { optionMap, resolvedOptions } = useMemo(() => {\r\n    const baseOptions = options ?? [];\r\n    const optionValueMap = new Map<any, SelectOption<any>>();\r\n\r\n    const addOption = (item: SelectOption<any>) => {\r\n      if (!optionValueMap.has(item.value)) {\r\n        optionValueMap.set(item.value, item);\r\n      }\r\n    };\r\n\r\n    baseOptions.forEach((item) => {\r\n      if (isGroupOption(item)) {\r\n        item.options.forEach(addOption);\r\n      } else {\r\n        addOption(item);\r\n      }\r\n    });\r\n\r\n    const filteredExtraOptions = extraOptions.filter((item) => !optionValueMap.has(item.value));\r\n    filteredExtraOptions.forEach(addOption);\r\n    const mergedOptions: SelectOptions<any> = [...baseOptions, ...filteredExtraOptions];\r\n\r\n    const missingValueOptions: SelectOption<any>[] = valueArray\r\n      .filter((val) => !optionValueMap.has(val))\r\n      .map((val) => ({ label: String(val), value: val }));\r\n    missingValueOptions.forEach(addOption);\r\n\r\n    return {\r\n      optionMap: optionValueMap,\r\n      resolvedOptions: missingValueOptions.length\r\n        ? [...mergedOptions, ...missingValueOptions]\r\n        : mergedOptions,\r\n    };\r\n  }, [extraOptions, options, valueArray]);\r\n\r\n  const getOption = useCallback(\r\n    (optionValue: any): SelectOption<any> => {\r\n      const matched = optionMap.get(optionValue);\r\n      if (matched) return matched;\r\n      if (optionValue && typeof optionValue === 'object' && 'label' in optionValue) {\r\n        return { label: (optionValue as any).label, value: optionValue };\r\n      }\r\n      return { label: String(optionValue), value: optionValue };\r\n    },\r\n    [optionMap],\r\n  );\r\n\r\n  const previousValueRef = useRef<any>(normalizedValue);\r\n  useEffect(() => {\r\n    previousValueRef.current = normalizedValue;\r\n  }, [normalizedValue]);\r\n\r\n  const handleValueChange = useCallback(\r\n    (nextValue: any) => {\r\n      const normalizedNextValue = normalizeValue(nextValue);\r\n      const previousValue = previousValueRef.current;\r\n\r\n      if (isMultiple) {\r\n        const prevValues = Array.isArray(previousValue) ? previousValue : [];\r\n        const nextValues = Array.isArray(normalizedNextValue) ? normalizedNextValue : [];\r\n        const addedValues = nextValues.filter(\r\n          (val) => !prevValues.some((prev) => Object.is(prev, val)),\r\n        );\r\n        addedValues.forEach((val) => onSelect?.(val, getOption(val)));\r\n\r\n        if (value === undefined) setUncontrolledValue(nextValues);\r\n        onChange?.(\r\n          nextValues,\r\n          nextValues.map((val) => getOption(val)),\r\n        );\r\n      } else {\r\n        if (!isValueEmpty(normalizedNextValue) && !Object.is(previousValue, normalizedNextValue)) {\r\n          onSelect?.(normalizedNextValue, getOption(normalizedNextValue));\r\n        }\r\n        if (value === undefined) setUncontrolledValue(normalizedNextValue);\r\n        onChange?.(\r\n          normalizedNextValue,\r\n          isValueEmpty(normalizedNextValue) ? undefined : getOption(normalizedNextValue),\r\n        );\r\n      }\r\n\r\n      previousValueRef.current = normalizedNextValue;\r\n    },\r\n    [getOption, isMultiple, normalizeValue, onChange, onSelect, value],\r\n  );\r\n\r\n  const appendTagValues = useCallback(\r\n    (rawValues: string[]) => {\r\n      const valuesToAdd = rawValues.map((val) => val.trim()).filter(Boolean);\r\n      if (!valuesToAdd.length) return;\r\n\r\n      const nextValues = [...valueArray];\r\n      const newOptionValues = valuesToAdd.filter((val) => !optionMap.has(val));\r\n\r\n      if (newOptionValues.length > 0) {\r\n        setExtraOptions((prev) => {\r\n          const existingValues = new Set(prev.map((item) => item.value));\r\n          const merged = [...prev];\r\n          newOptionValues.forEach((val) => {\r\n            if (!existingValues.has(val)) {\r\n              merged.push({ label: val, value: val });\r\n            }\r\n          });\r\n          return merged;\r\n        });\r\n      }\r\n\r\n      valuesToAdd.forEach((val) => {\r\n        if (!nextValues.some((item) => Object.is(item, val))) {\r\n          nextValues.push(val);\r\n        }\r\n      });\r\n\r\n      if (nextValues.length !== valueArray.length) {\r\n        handleValueChange(nextValues);\r\n      }\r\n    },\r\n    [handleValueChange, optionMap, setExtraOptions, valueArray],\r\n  );\r\n\r\n  return {\r\n    appendTagValues,\r\n    getOption,\r\n    handleValueChange,\r\n    normalizedValue,\r\n    normalizeValue,\r\n    optionMap,\r\n    resolvedOptions,\r\n    valueArray,\r\n  };\r\n}\r\n\r\ninterface UseSelectOpenParams {\r\n  defaultOpen: boolean | undefined;\r\n  onOpenChange: SelectProps['onOpenChange'];\r\n  open: boolean | undefined;\r\n}\r\n\r\nexport function useSelectOpen({ defaultOpen, onOpenChange, open }: UseSelectOpenParams) {\r\n  const [uncontrolledOpen, setUncontrolledOpen] = useState(Boolean(defaultOpen));\r\n\r\n  useEffect(() => {\r\n    if (open !== undefined) setUncontrolledOpen(open);\r\n  }, [open]);\r\n\r\n  const mergedOpen = open ?? uncontrolledOpen;\r\n\r\n  const handleOpenChange = useCallback(\r\n    (nextOpen: boolean, eventDetails?: SelectRootChangeEventDetails) => {\r\n      onOpenChange?.(nextOpen, eventDetails);\r\n      if (open === undefined) setUncontrolledOpen(nextOpen);\r\n    },\r\n    [onOpenChange, open],\r\n  );\r\n\r\n  return { handleOpenChange, mergedOpen };\r\n}\r\n\r\ninterface UseSelectSearchParams {\r\n  appendTagValues: (values: string[]) => void;\r\n  handleOpenChange: (nextOpen: boolean) => void;\r\n  mergedOpen: boolean;\r\n  mode: SelectProps['mode'];\r\n  resolvedOptions: SelectOptions;\r\n  showSearch: boolean | undefined;\r\n  tokenSeparators: string[] | undefined;\r\n}\r\n\r\nexport function useSelectSearch({\r\n  appendTagValues,\r\n  handleOpenChange,\r\n  mergedOpen,\r\n  mode,\r\n  resolvedOptions,\r\n  showSearch,\r\n  tokenSeparators,\r\n}: UseSelectSearchParams) {\r\n  const [searchValue, setSearchValue] = useState('');\r\n  const shouldShowSearch = Boolean(showSearch || mode === 'tags');\r\n\r\n  useEffect(() => {\r\n    if (!mergedOpen) setSearchValue('');\r\n  }, [mergedOpen]);\r\n\r\n  const handleSearchChange = useCallback(\r\n    (event: ChangeEvent<HTMLInputElement>) => {\r\n      const nextValue = event.target.value;\r\n      if (mode === 'tags') {\r\n        const parts = splitBySeparators(nextValue, tokenSeparators);\r\n        if (parts.length > 1) {\r\n          const pending = parts.pop() ?? '';\r\n          appendTagValues(parts.filter(Boolean));\r\n          setSearchValue(pending);\r\n          return;\r\n        }\r\n      }\r\n      setSearchValue(nextValue);\r\n    },\r\n    [appendTagValues, mode, tokenSeparators],\r\n  );\r\n\r\n  const handleSearchKeyDown = useCallback(\r\n    (event: KeyboardEvent<HTMLInputElement>) => {\r\n      event.stopPropagation();\r\n\r\n      if (event.key === 'Escape') {\r\n        handleOpenChange(false);\r\n        return;\r\n      }\r\n      if (mode !== 'tags') return;\r\n\r\n      const isSeparator = tokenSeparators?.includes(event.key);\r\n      if (event.key === 'Enter' || isSeparator) {\r\n        event.preventDefault();\r\n        event.stopPropagation();\r\n        appendTagValues([searchValue]);\r\n        setSearchValue('');\r\n      }\r\n    },\r\n    [appendTagValues, handleOpenChange, mode, searchValue, tokenSeparators],\r\n  );\r\n\r\n  // Stop propagation in capture phase + on keyup to block base-ui Popup-level\r\n  // `useTypeahead` (and any ancestor typeahead) from hijacking the search\r\n  // input's first-letter focus behavior. Do not remove.\r\n  const stopSearchPropagation = useCallback((event: KeyboardEvent<HTMLInputElement>) => {\r\n    event.stopPropagation();\r\n  }, []);\r\n\r\n  const filteredOptions = useMemo(() => {\r\n    if (!shouldShowSearch || !searchValue.trim()) return resolvedOptions;\r\n    const query = searchValue.trim().toLowerCase();\r\n\r\n    return resolvedOptions\r\n      .map((item) => {\r\n        if (isGroupOption(item)) {\r\n          const groupItems = item.options.filter((option) =>\r\n            getOptionSearchText(option).toLowerCase().includes(query),\r\n          );\r\n          if (!groupItems.length) return null;\r\n          return { ...item, options: groupItems };\r\n        }\r\n        return getOptionSearchText(item).toLowerCase().includes(query) ? item : null;\r\n      })\r\n      .filter(Boolean) as SelectOptions;\r\n  }, [resolvedOptions, searchValue, shouldShowSearch]);\r\n\r\n  return {\r\n    filteredOptions,\r\n    handleSearchChange,\r\n    handleSearchKeyDown,\r\n    searchValue,\r\n    shouldShowSearch,\r\n    stopSearchPropagation,\r\n  };\r\n}\r\n\r\ninterface UseSelectVirtualParams {\r\n  filteredOptions: SelectOptions;\r\n  listItemHeight: number | undefined;\r\n  size: SelectSize;\r\n  valueArray: any[];\r\n  virtual: boolean | undefined;\r\n}\r\n\r\nexport function useSelectVirtual({\r\n  filteredOptions,\r\n  listItemHeight,\r\n  size,\r\n  valueArray,\r\n  virtual,\r\n}: UseSelectVirtualParams) {\r\n  const listRef = useRef<HTMLDivElement | null>(null);\r\n  const pointerScrollRef = useRef(false);\r\n  const pointerScrollTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\r\n\r\n  const renderVirtualItem = useCallback((props: HTMLAttributes<HTMLDivElement>) => {\r\n    const { ref, ...rest } = props as HTMLAttributes<HTMLDivElement> & {\r\n      ref?: Ref<HTMLDivElement>;\r\n    };\r\n\r\n    return (\r\n      <div\r\n        {...rest}\r\n        ref={(node) => {\r\n          if (node) {\r\n            node.scrollIntoView = (...args) => {\r\n              if (!pointerScrollRef.current) {\r\n                HTMLElement.prototype.scrollIntoView.call(node, ...args);\r\n              }\r\n            };\r\n          }\r\n          if (typeof ref === 'function') {\r\n            ref(node);\r\n          } else if (ref && 'current' in ref) {\r\n            (ref as MutableRefObject<HTMLDivElement | null>).current = node;\r\n          }\r\n        }}\r\n      />\r\n    );\r\n  }, []);\r\n\r\n  const markPointerScroll = useCallback(() => {\r\n    pointerScrollRef.current = true;\r\n    if (pointerScrollTimeoutRef.current) {\r\n      clearTimeout(pointerScrollTimeoutRef.current);\r\n    }\r\n    pointerScrollTimeoutRef.current = setTimeout(() => {\r\n      pointerScrollRef.current = false;\r\n    }, 120);\r\n  }, []);\r\n\r\n  const handleListScroll = useCallback(() => {\r\n    if (!virtual || !pointerScrollRef.current) return;\r\n    const listElement = listRef.current;\r\n    const activeElement = document.activeElement;\r\n    if (listElement && activeElement && listElement.contains(activeElement)) {\r\n      listElement.focus({ preventScroll: true });\r\n    }\r\n  }, [virtual]);\r\n\r\n  useEffect(() => {\r\n    return () => {\r\n      if (pointerScrollTimeoutRef.current) {\r\n        clearTimeout(pointerScrollTimeoutRef.current);\r\n      }\r\n    };\r\n  }, []);\r\n\r\n  const virtualListStyle = useMemo(() => {\r\n    if (!virtual) return undefined;\r\n    const rowCount = countVirtualItems(filteredOptions);\r\n    const maxVisibleRows = 6;\r\n    const estimatedRowHeight =\r\n      listItemHeight ?? (size === 'large' ? 40 : size === 'small' ? 28 : 32);\r\n    const visibleRows = Math.min(Math.max(rowCount, 1), maxVisibleRows);\r\n    const estimatedHeight = visibleRows * estimatedRowHeight + 8;\r\n\r\n    return {\r\n      height: `min(${estimatedHeight}px, var(--hubstr-select-available-height, var(--available-height)))`,\r\n    };\r\n  }, [filteredOptions, listItemHeight, size, virtual]);\r\n\r\n  const keepMountedIndices = useMemo(() => {\r\n    if (!virtual || valueArray.length === 0) return undefined;\r\n    const selectedSet = new Set(valueArray);\r\n    const indices: number[] = [];\r\n    let index = 0;\r\n\r\n    filteredOptions.forEach((item) => {\r\n      if (isGroupOption(item)) {\r\n        if (item.options.some((option) => selectedSet.has(option.value))) {\r\n          indices.push(index);\r\n        }\r\n        index += 1;\r\n        return;\r\n      }\r\n      if (selectedSet.has(item.value)) indices.push(index);\r\n      index += 1;\r\n    });\r\n\r\n    return indices.length ? indices : undefined;\r\n  }, [filteredOptions, valueArray, virtual]);\r\n\r\n  return {\r\n    handleListScroll,\r\n    keepMountedIndices,\r\n    listRef,\r\n    markPointerScroll,\r\n    renderVirtualItem,\r\n    virtualListStyle,\r\n  };\r\n}\r\n\r\nexport function usePortalContainer() {\r\n  const appElement = useAppElement();\r\n  // `appElement` is the ThemeProvider wrapper div, which uses `display: contents`\r\n  // so it has no layout box. `@base-ui/react/select` fails to mount its Popup\r\n  // into a `display: contents` container in certain hosts (editor/chat inputs\r\n  // with focus traps). Fall back to `document.body` in that case; keep the\r\n  // original behavior when the wrapper has a real layout (older themes, SSR\r\n  // snapshot, etc.).\r\n  return useMemo(() => {\r\n    if (typeof window === 'undefined') return appElement;\r\n    if (!(appElement instanceof HTMLElement)) return undefined;\r\n    const display = window.getComputedStyle(appElement).display;\r\n    return display === 'contents' ? document.body : appElement;\r\n  }, [appElement]);\r\n}\r\n"],"mappings":"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"}

package/ui/es/base-ui/Select/index.d.mts

@@ -0,0 +1,3 @@
+import { SelectBehaviorVariant, SelectClassNames, SelectIndicatorVariant, SelectOption, SelectOptionGroup, SelectOptions, SelectProps, SelectRootChangeEventDetails, SelectSize, SelectVariant } from "./type.mjs";
+import { SelectArrow, SelectArrowProps, SelectBackdrop, SelectGroup, SelectGroupLabel, SelectGroupLabelProps, SelectGroupProps, SelectIcon, SelectIconProps, SelectItem, SelectItemIndicator, SelectItemIndicatorProps, SelectItemProps, SelectItemText, SelectItemTextProps, SelectList, SelectListProps, SelectPopup, SelectPopupProps, SelectPortal, SelectPortalProps, SelectPositioner, SelectPositionerProps, SelectRoot, SelectScrollDownArrow, SelectScrollDownArrowProps, SelectScrollUpArrow, SelectScrollUpArrowProps, SelectSeparator, SelectTrigger, SelectTriggerProps, SelectValue, SelectValueProps } from "./atoms.mjs";
+import { Select } from "./Select.mjs";

package/ui/es/base-ui/Select/parts.mjs

@@ -0,0 +1,136 @@
+"use client";
+import Icon from "../../Icon/Icon.mjs";
+import { styles } from "../DropdownMenu/sharedStyle.mjs";
+import { styles as styles$1 } from "./style.mjs";
+import { isValueEmpty } from "./helpers.mjs";
+import { isValidElement } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "antd-style";
+import { ChevronDown, Loader2, X } from "lucide-react";
+import { Select } from "@base-ui/react/select";
+import { Virtualizer } from "virtua";
+//#region src/base-ui/Select/parts.tsx
+function resolveIconNode(node) {
+	if (node === void 0 || node === null) return null;
+	if (isValidElement(node) || typeof node === "string" || typeof node === "number") return node;
+	return /* @__PURE__ */ jsx(Icon, {
+		icon: node,
+		size: "small"
+	});
+}
+function resolveSuffixIcon(suffixIcon, suffixIconProps, loading) {
+	if (loading) return /* @__PURE__ */ jsx(Icon, {
+		spin: true,
+		icon: Loader2,
+		size: "small"
+	});
+	if (suffixIcon === null) return null;
+	if (isValidElement(suffixIcon) || typeof suffixIcon === "string" || typeof suffixIcon === "number") return suffixIcon;
+	return /* @__PURE__ */ jsx(Icon, {
+		icon: suffixIcon || ChevronDown,
+		size: "small",
+		...suffixIconProps,
+		style: {
+			pointerEvents: "none",
+			...suffixIconProps?.style
+		}
+	});
+}
+function createTriggerValueRenderer({ getOption, isMultiple, labelRender, normalizeValue, placeholder }) {
+	return function renderValue(currentValue) {
+		const resolved = normalizeValue(currentValue);
+		const placeholderNode = placeholder === void 0 ? null : /* @__PURE__ */ jsx("span", {
+			className: styles$1.valueText,
+			children: placeholder
+		});
+		if (isMultiple) {
+			const values = Array.isArray(resolved) ? resolved : [];
+			if (values.length === 0) return placeholderNode;
+			return /* @__PURE__ */ jsx("span", {
+				className: styles$1.tags,
+				children: values.map((val, index) => {
+					const option = getOption(val);
+					const content = labelRender ? labelRender(option) : option.label ?? String(val);
+					return /* @__PURE__ */ jsx("span", {
+						className: styles$1.tag,
+						children: content
+					}, `${String(val)}-${index}`);
+				})
+			});
+		}
+		if (isValueEmpty(resolved)) return placeholderNode;
+		const option = getOption(resolved);
+		const content = labelRender ? labelRender(option) : option.label ?? String(resolved);
+		return /* @__PURE__ */ jsx("span", {
+			className: styles$1.valueText,
+			children: content
+		});
+	};
+}
+function SelectListSection({ classNames, isEmpty, listContent, listItemHeight, virtual, virtualState }) {
+	const listClassName = cx(styles$1.list, classNames?.list);
+	if (!virtual || isEmpty) return /* @__PURE__ */ jsx(Select.List, {
+		className: listClassName,
+		"data-virtual": virtual || void 0,
+		children: listContent
+	});
+	const { handleListScroll, keepMountedIndices, listRef, markPointerScroll, virtualListStyle } = virtualState;
+	return /* @__PURE__ */ jsx(Select.List, {
+		"data-virtual": true,
+		className: listClassName,
+		ref: listRef,
+		style: virtualListStyle,
+		tabIndex: -1,
+		onPointerDown: markPointerScroll,
+		onScroll: handleListScroll,
+		onTouchMove: markPointerScroll,
+		onWheel: markPointerScroll,
+		children: /* @__PURE__ */ jsx(Virtualizer, {
+			itemSize: listItemHeight,
+			keepMounted: keepMountedIndices,
+			children: listContent
+		})
+	});
+}
+function EmptyContent({ classNames }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: cx(styles.item, styles.empty, styles$1.empty, classNames?.empty),
+		children: "No data"
+	});
+}
+function SelectSearchInput({ classNames, onChange, onKeyDown, placeholder, stopPropagation, value }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: cx(styles$1.search, classNames?.search),
+		children: /* @__PURE__ */ jsx("input", {
+			className: styles$1.searchInput,
+			placeholder: typeof placeholder === "string" ? placeholder : void 0,
+			value,
+			onChange,
+			onKeyDown,
+			onKeyDownCapture: stopPropagation,
+			onKeyUp: stopPropagation,
+			onKeyUpCapture: stopPropagation
+		})
+	});
+}
+function SelectTriggerSuffix({ classNames, onClear, showClear, suffixIconNode }) {
+	return /* @__PURE__ */ jsxs("span", {
+		className: cx(styles$1.suffix, classNames?.suffix),
+		children: [showClear && /* @__PURE__ */ jsx("span", {
+			className: cx(styles$1.clear, classNames?.clear),
+			"data-role": "hubstr-select-clear",
+			onClick: onClear,
+			children: /* @__PURE__ */ jsx(Icon, {
+				icon: X,
+				size: "small"
+			})
+		}), suffixIconNode !== null && suffixIconNode !== void 0 && /* @__PURE__ */ jsx(Select.Icon, {
+			className: cx(styles$1.icon, classNames?.icon),
+			children: suffixIconNode
+		})]
+	});
+}
+//#endregion
+export { EmptyContent, SelectListSection, SelectSearchInput, SelectTriggerSuffix, createTriggerValueRenderer, resolveIconNode, resolveSuffixIcon };
+
+//# sourceMappingURL=parts.mjs.map

package/ui/es/base-ui/Select/parts.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"parts.mjs","names":["styles","BaseSelect","menuStyles"],"sources":["../../../src/base-ui/Select/parts.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { Select as BaseSelect } from '@base-ui/react/select';\r\nimport { cx } from 'antd-style';\r\nimport { ChevronDown, Loader2, X } from 'lucide-react';\r\nimport {\r\n  type ChangeEvent,\r\n  isValidElement,\r\n  type KeyboardEvent,\r\n  type MouseEvent,\r\n  type ReactNode,\r\n} from 'react';\r\nimport { Virtualizer } from 'virtua';\r\n\r\nimport { styles as menuStyles } from '../DropdownMenu/sharedStyle';\r\nimport Icon, { type IconProps } from '../../Icon';\r\n\r\nimport { isValueEmpty } from './helpers';\r\nimport { type useSelectVirtual } from './hooks';\r\nimport { styles } from './style';\r\nimport { type SelectClassNames, type SelectOption, type SelectProps } from './type';\r\n\r\nexport function resolveIconNode(node: ReactNode | IconProps['icon'] | undefined | null) {\r\n  if (node === undefined || node === null) return null;\r\n  if (isValidElement(node) || typeof node === 'string' || typeof node === 'number') {\r\n    return node;\r\n  }\r\n  return <Icon icon={node as any} size={'small'} />;\r\n}\r\n\r\nexport function resolveSuffixIcon(\r\n  suffixIcon: SelectProps['suffixIcon'],\r\n  suffixIconProps: SelectProps['suffixIconProps'],\r\n  loading: boolean | undefined,\r\n) {\r\n  if (loading) return <Icon spin icon={Loader2} size={'small'} />;\r\n  if (suffixIcon === null) return null;\r\n  if (\r\n    isValidElement(suffixIcon) ||\r\n    typeof suffixIcon === 'string' ||\r\n    typeof suffixIcon === 'number'\r\n  ) {\r\n    return suffixIcon;\r\n  }\r\n  return (\r\n    <Icon\r\n      icon={(suffixIcon as any) || ChevronDown}\r\n      size={'small'}\r\n      {...suffixIconProps}\r\n      style={{\r\n        pointerEvents: 'none',\r\n        ...suffixIconProps?.style,\r\n      }}\r\n    />\r\n  );\r\n}\r\n\r\ninterface TriggerValueRendererParams {\r\n  getOption: (value: any) => SelectOption<any>;\r\n  isMultiple: boolean;\r\n  labelRender: SelectProps['labelRender'];\r\n  normalizeValue: (value: any) => any;\r\n  placeholder: ReactNode;\r\n}\r\n\r\nexport function createTriggerValueRenderer({\r\n  getOption,\r\n  isMultiple,\r\n  labelRender,\r\n  normalizeValue,\r\n  placeholder,\r\n}: TriggerValueRendererParams) {\r\n  return function renderValue(currentValue: any): ReactNode {\r\n    const resolved = normalizeValue(currentValue);\r\n    const placeholderNode =\r\n      placeholder === undefined ? null : <span className={styles.valueText}>{placeholder}</span>;\r\n\r\n    if (isMultiple) {\r\n      const values = Array.isArray(resolved) ? resolved : [];\r\n      if (values.length === 0) return placeholderNode;\r\n      return (\r\n        <span className={styles.tags}>\r\n          {values.map((val, index) => {\r\n            const option = getOption(val);\r\n            const content = labelRender ? labelRender(option) : (option.label ?? String(val));\r\n            return (\r\n              <span className={styles.tag} key={`${String(val)}-${index}`}>\r\n                {content}\r\n              </span>\r\n            );\r\n          })}\r\n        </span>\r\n      );\r\n    }\r\n\r\n    if (isValueEmpty(resolved)) return placeholderNode;\r\n    const option = getOption(resolved);\r\n    const content = labelRender ? labelRender(option) : (option.label ?? String(resolved));\r\n    return <span className={styles.valueText}>{content}</span>;\r\n  };\r\n}\r\n\r\ntype SelectVirtualReturn = ReturnType<typeof useSelectVirtual>;\r\n\r\ninterface SelectListSectionProps {\r\n  classNames: SelectClassNames | undefined;\r\n  isEmpty: boolean;\r\n  listContent: ReactNode;\r\n  listItemHeight: number | undefined;\r\n  virtual: boolean | undefined;\r\n  virtualState: SelectVirtualReturn;\r\n}\r\n\r\nexport function SelectListSection({\r\n  classNames,\r\n  isEmpty,\r\n  listContent,\r\n  listItemHeight,\r\n  virtual,\r\n  virtualState,\r\n}: SelectListSectionProps) {\r\n  const listClassName = cx(styles.list, classNames?.list);\r\n\r\n  if (!virtual || isEmpty) {\r\n    return (\r\n      <BaseSelect.List className={listClassName} data-virtual={virtual || undefined}>\r\n        {listContent}\r\n      </BaseSelect.List>\r\n    );\r\n  }\r\n\r\n  const { handleListScroll, keepMountedIndices, listRef, markPointerScroll, virtualListStyle } =\r\n    virtualState;\r\n\r\n  return (\r\n    <BaseSelect.List\r\n      data-virtual\r\n      className={listClassName}\r\n      ref={listRef}\r\n      style={virtualListStyle}\r\n      tabIndex={-1}\r\n      onPointerDown={markPointerScroll}\r\n      onScroll={handleListScroll}\r\n      onTouchMove={markPointerScroll}\r\n      onWheel={markPointerScroll}\r\n    >\r\n      <Virtualizer itemSize={listItemHeight} keepMounted={keepMountedIndices}>\r\n        {listContent}\r\n      </Virtualizer>\r\n    </BaseSelect.List>\r\n  );\r\n}\r\n\r\ninterface EmptyContentProps {\r\n  classNames: SelectClassNames | undefined;\r\n}\r\n\r\nexport function EmptyContent({ classNames }: EmptyContentProps) {\r\n  return (\r\n    <div className={cx(menuStyles.item, menuStyles.empty, styles.empty, classNames?.empty)}>\r\n      No data\r\n    </div>\r\n  );\r\n}\r\n\r\ninterface SelectSearchInputProps {\r\n  classNames: SelectClassNames | undefined;\r\n  onChange: (event: ChangeEvent<HTMLInputElement>) => void;\r\n  onKeyDown: (event: KeyboardEvent<HTMLInputElement>) => void;\r\n  placeholder: ReactNode;\r\n  stopPropagation: (event: KeyboardEvent<HTMLInputElement>) => void;\r\n  value: string;\r\n}\r\n\r\nexport function SelectSearchInput({\r\n  classNames,\r\n  onChange,\r\n  onKeyDown,\r\n  placeholder,\r\n  stopPropagation,\r\n  value,\r\n}: SelectSearchInputProps) {\r\n  return (\r\n    <div className={cx(styles.search, classNames?.search)}>\r\n      <input\r\n        className={styles.searchInput}\r\n        placeholder={typeof placeholder === 'string' ? placeholder : undefined}\r\n        value={value}\r\n        onChange={onChange}\r\n        onKeyDown={onKeyDown}\r\n        onKeyDownCapture={stopPropagation}\r\n        onKeyUp={stopPropagation}\r\n        onKeyUpCapture={stopPropagation}\r\n      />\r\n    </div>\r\n  );\r\n}\r\n\r\ninterface SelectTriggerSuffixProps {\r\n  classNames: SelectClassNames | undefined;\r\n  onClear: (event: MouseEvent) => void;\r\n  showClear: boolean;\r\n  suffixIconNode: ReactNode;\r\n}\r\n\r\nexport function SelectTriggerSuffix({\r\n  classNames,\r\n  onClear,\r\n  showClear,\r\n  suffixIconNode,\r\n}: SelectTriggerSuffixProps) {\r\n  return (\r\n    <span className={cx(styles.suffix, classNames?.suffix)}>\r\n      {showClear && (\r\n        <span\r\n          className={cx(styles.clear, classNames?.clear)}\r\n          data-role=\"hubstr-select-clear\"\r\n          onClick={onClear}\r\n        >\r\n          <Icon icon={X} size={'small'} />\r\n        </span>\r\n      )}\r\n      {suffixIconNode !== null && suffixIconNode !== undefined && (\r\n        <BaseSelect.Icon className={cx(styles.icon, classNames?.icon)}>\r\n          {suffixIconNode}\r\n        </BaseSelect.Icon>\r\n      )}\r\n    </span>\r\n  );\r\n}\r\n"],"mappings":"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"}

package/ui/es/base-ui/Select/renderOptions.mjs

@@ -0,0 +1,52 @@
+"use client";
+import Icon from "../../Icon/Icon.mjs";
+import { styles } from "../DropdownMenu/sharedStyle.mjs";
+import { styles as styles$1 } from "./style.mjs";
+import { getOptionSearchText, isGroupOption } from "./helpers.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "antd-style";
+import { Check } from "lucide-react";
+import { Select } from "@base-ui/react/select";
+//#region src/base-ui/Select/renderOptions.tsx
+function renderItem(option, index, params) {
+	const { classNames, isBoldIndicator, itemTextClassName, listItemHeight, optionRender, renderVirtualItem, virtual } = params;
+	return /* @__PURE__ */ jsxs(Select.Item, {
+		disabled: option.disabled,
+		label: getOptionSearchText(option),
+		render: virtual ? renderVirtualItem : void 0,
+		value: option.value,
+		className: cx(styles.item, styles$1.item, isBoldIndicator && styles$1.itemBoldSelected, classNames?.item, classNames?.option, option.className),
+		style: {
+			minHeight: listItemHeight,
+			...option.style
+		},
+		children: [/* @__PURE__ */ jsx(Select.ItemText, {
+			className: itemTextClassName,
+			children: optionRender ? optionRender(option, { index }) : option.label
+		}), !isBoldIndicator && /* @__PURE__ */ jsx(Select.ItemIndicator, {
+			className: cx(styles$1.itemIndicator, classNames?.itemIndicator),
+			children: /* @__PURE__ */ jsx(Icon, {
+				icon: Check,
+				size: "small"
+			})
+		})]
+	}, `${String(option.value)}-${index}`);
+}
+function renderOptions(params) {
+	const { classNames, items } = params;
+	let optionIndex = 0;
+	return items.map((item, index) => {
+		if (isGroupOption(item)) return /* @__PURE__ */ jsxs(Select.Group, {
+			className: cx(styles$1.group, classNames?.group),
+			children: [/* @__PURE__ */ jsx(Select.GroupLabel, {
+				className: cx(styles.groupLabel, styles$1.groupLabel, classNames?.groupLabel),
+				children: item.label
+			}), item.options.map((option) => renderItem(option, optionIndex++, params))]
+		}, `group-${index}`);
+		return renderItem(item, optionIndex++, params);
+	});
+}
+//#endregion
+export { renderOptions };
+
+//# sourceMappingURL=renderOptions.mjs.map

package/ui/es/base-ui/Select/renderOptions.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderOptions.mjs","names":["BaseSelect","menuStyles","styles"],"sources":["../../../src/base-ui/Select/renderOptions.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { Select as BaseSelect } from '@base-ui/react/select';\r\nimport { cx } from 'antd-style';\r\nimport { Check } from 'lucide-react';\r\nimport { type ComponentProps } from 'react';\r\n\r\nimport { styles as menuStyles } from '../DropdownMenu/sharedStyle';\r\nimport Icon from '../../Icon';\r\n\r\nimport { getOptionSearchText, isGroupOption } from './helpers';\r\nimport { styles } from './style';\r\nimport {\r\n  type SelectClassNames,\r\n  type SelectOption,\r\n  type SelectOptions,\r\n  type SelectProps,\r\n} from './type';\r\n\r\ninterface RenderOptionsParams {\r\n  classNames: SelectClassNames | undefined;\r\n  isBoldIndicator: boolean;\r\n  items: SelectOptions<any>;\r\n  itemTextClassName: string;\r\n  listItemHeight: number | undefined;\r\n  optionRender: SelectProps['optionRender'];\r\n  renderVirtualItem: NonNullable<ComponentProps<typeof BaseSelect.Item>['render']>;\r\n  virtual: boolean | undefined;\r\n}\r\n\r\nfunction renderItem(\r\n  option: SelectOption<any>,\r\n  index: number,\r\n  params: Omit<RenderOptionsParams, 'items'>,\r\n) {\r\n  const {\r\n    classNames,\r\n    isBoldIndicator,\r\n    itemTextClassName,\r\n    listItemHeight,\r\n    optionRender,\r\n    renderVirtualItem,\r\n    virtual,\r\n  } = params;\r\n\r\n  return (\r\n    <BaseSelect.Item\r\n      disabled={option.disabled}\r\n      key={`${String(option.value)}-${index}`}\r\n      label={getOptionSearchText(option)}\r\n      render={virtual ? renderVirtualItem : undefined}\r\n      value={option.value}\r\n      className={cx(\r\n        menuStyles.item,\r\n        styles.item,\r\n        isBoldIndicator && styles.itemBoldSelected,\r\n        classNames?.item,\r\n        classNames?.option,\r\n        option.className,\r\n      )}\r\n      style={{\r\n        minHeight: listItemHeight,\r\n        ...option.style,\r\n      }}\r\n    >\r\n      <BaseSelect.ItemText className={itemTextClassName}>\r\n        {optionRender ? optionRender(option, { index }) : option.label}\r\n      </BaseSelect.ItemText>\r\n      {!isBoldIndicator && (\r\n        <BaseSelect.ItemIndicator className={cx(styles.itemIndicator, classNames?.itemIndicator)}>\r\n          <Icon icon={Check} size={'small'} />\r\n        </BaseSelect.ItemIndicator>\r\n      )}\r\n    </BaseSelect.Item>\r\n  );\r\n}\r\n\r\nexport function renderOptions(params: RenderOptionsParams) {\r\n  const { classNames, items } = params;\r\n  let optionIndex = 0;\r\n\r\n  return items.map((item, index) => {\r\n    if (isGroupOption(item)) {\r\n      return (\r\n        <BaseSelect.Group className={cx(styles.group, classNames?.group)} key={`group-${index}`}>\r\n          <BaseSelect.GroupLabel\r\n            className={cx(menuStyles.groupLabel, styles.groupLabel, classNames?.groupLabel)}\r\n          >\r\n            {item.label}\r\n          </BaseSelect.GroupLabel>\r\n          {item.options.map((option) => renderItem(option, optionIndex++, params))}\r\n        </BaseSelect.Group>\r\n      );\r\n    }\r\n\r\n    return renderItem(item, optionIndex++, params);\r\n  });\r\n}\r\n"],"mappings":";;;;;;;;;;AA8BA,SAAS,WACP,QACA,OACA,QACA;CACA,MAAM,EACJ,YACA,iBACA,mBACA,gBACA,cACA,mBACA,YACE;AAEJ,QACE,qBAACA,OAAW,MAAZ;EACE,UAAU,OAAO;EAEjB,OAAO,oBAAoB,OAAO;EAClC,QAAQ,UAAU,oBAAoB,KAAA;EACtC,OAAO,OAAO;EACd,WAAW,GACTC,OAAW,MACXC,SAAO,MACP,mBAAmBA,SAAO,kBAC1B,YAAY,MACZ,YAAY,QACZ,OAAO,UACR;EACD,OAAO;GACL,WAAW;GACX,GAAG,OAAO;GACX;YAjBH,CAmBE,oBAACF,OAAW,UAAZ;GAAqB,WAAW;aAC7B,eAAe,aAAa,QAAQ,EAAE,OAAO,CAAC,GAAG,OAAO;GACrC,CAAA,EACrB,CAAC,mBACA,oBAACA,OAAW,eAAZ;GAA0B,WAAW,GAAGE,SAAO,eAAe,YAAY,cAAc;aACtF,oBAAC,MAAD;IAAM,MAAM;IAAO,MAAM;IAAW,CAAA;GACX,CAAA,CAEb;IAzBX,GAAG,OAAO,OAAO,MAAM,CAAC,GAAG,QAyBhB;;AAItB,SAAgB,cAAc,QAA6B;CACzD,MAAM,EAAE,YAAY,UAAU;CAC9B,IAAI,cAAc;AAElB,QAAO,MAAM,KAAK,MAAM,UAAU;AAChC,MAAI,cAAc,KAAK,CACrB,QACE,qBAACF,OAAW,OAAZ;GAAkB,WAAW,GAAGE,SAAO,OAAO,YAAY,MAAM;aAAhE,CACE,oBAACF,OAAW,YAAZ;IACE,WAAW,GAAGC,OAAW,YAAYC,SAAO,YAAY,YAAY,WAAW;cAE9E,KAAK;IACgB,CAAA,EACvB,KAAK,QAAQ,KAAK,WAAW,WAAW,QAAQ,eAAe,OAAO,CAAC,CACvD;KAPoD,SAAS,QAO7D;AAIvB,SAAO,WAAW,MAAM,eAAe,OAAO;GAC9C"}