@questpie/admin 3.2.4 → 3.2.5

package/dist/client/components/primitives/select-single.mjs

@@ -9,9 +9,8 @@ import { useIsMobile } from "../../hooks/use-media-query.mjs";
 import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from "../ui/command.mjs";
 import { Drawer, DrawerContent, DrawerHeader, DrawerTitle, DrawerTrigger } from "../ui/drawer.mjs";
 import { FieldSelectTrigger } from "./field-select-control.mjs";
-import { c } from "react/compiler-runtime";
 import { Icon } from "@iconify/react";
-import { useDeferredValue, useId, useState } from "react";
+import { useCallback, useDeferredValue, useId, useMemo, useState } from "react";
 import { useQuery } from "@tanstack/react-query";
 import { jsx, jsxs } from "react/jsx-runtime";
 
@@ -39,532 +38,199 @@ const SEARCH_OPTION_THRESHOLD = 8;
 * />
 * ```
 */
-function SelectSingle(t0) {
-	const $ = c(146);
-	const { value, onChange, options: staticOptions, loadOptions, queryKey, prefetchOnMount: t1, clearable: t2, loading: t3, emptyMessage: t4, searchable: t5, placeholder: t6, disabled, className, id, "aria-invalid": ariaInvalid, drawerTitle: t7, selectedLabel, isLoadingValue: t8, asInputGroupControl: t9 } = t0;
-	const prefetchOnMount = t1 === void 0 ? false : t1;
-	const clearable = t2 === void 0 ? true : t2;
-	const externalLoading = t3 === void 0 ? false : t3;
-	const emptyMessage = t4 === void 0 ? "No options found" : t4;
-	const searchable = t5 === void 0 ? "auto" : t5;
-	const placeholder = t6 === void 0 ? "Select..." : t6;
-	const drawerTitle = t7 === void 0 ? "Select option" : t7;
-	const isLoadingValue = t8 === void 0 ? false : t8;
-	const asInputGroupControl = t9 === void 0 ? false : t9;
+function SelectSingle({ value, onChange, options: staticOptions, loadOptions, queryKey, prefetchOnMount = false, clearable = true, loading: externalLoading = false, emptyMessage = "No options found", searchable = "auto", placeholder = "Select...", disabled, className, id, "aria-invalid": ariaInvalid, drawerTitle = "Select option", selectedLabel, isLoadingValue = false, asInputGroupControl = false }) {
 	const resolvedStaticOptions = staticOptions ?? EMPTY_OPTIONS;
 	const resolveText = useResolveText();
 	const i18n = useSafeI18n();
-	let t10;
-	if ($[0] !== i18n) {
-		t10 = (key) => i18n?.t(key) ?? key;
-		$[0] = i18n;
-		$[1] = t10;
-	} else t10 = $[1];
-	const translate = t10;
+	const translate = useCallback((key) => i18n?.t(key) ?? key, [i18n]);
 	const locale = i18n?.locale ?? "en";
-	let t11;
-	if ($[2] !== translate) {
-		t11 = (key_0, fallback) => {
-			const message = translate(key_0);
-			return message && message !== key_0 ? message : fallback;
-		};
-		$[2] = translate;
-		$[3] = t11;
-	} else t11 = $[3];
-	const t = t11;
-	let t12;
-	if ($[4] !== placeholder || $[5] !== resolveText) {
-		t12 = resolveText(placeholder);
-		$[4] = placeholder;
-		$[5] = resolveText;
-		$[6] = t12;
-	} else t12 = $[6];
-	const resolvedPlaceholder = t12;
-	let t13;
-	if ($[7] !== emptyMessage || $[8] !== resolveText) {
-		t13 = resolveText(emptyMessage);
-		$[7] = emptyMessage;
-		$[8] = resolveText;
-		$[9] = t13;
-	} else t13 = $[9];
-	const resolvedEmptyMessage = t13;
-	let t14;
-	if ($[10] !== drawerTitle || $[11] !== resolveText) {
-		t14 = resolveText(drawerTitle);
-		$[10] = drawerTitle;
-		$[11] = resolveText;
-		$[12] = t14;
-	} else t14 = $[12];
-	const resolvedDrawerTitle = t14;
+	const t = (key, fallback) => {
+		const message = translate(key);
+		return message && message !== key ? message : fallback;
+	};
+	const resolvedPlaceholder = resolveText(placeholder);
+	const resolvedEmptyMessage = resolveText(emptyMessage);
+	const resolvedDrawerTitle = resolveText(drawerTitle);
 	const [open, setOpen] = useState(false);
 	const [search, setSearch] = useState("");
 	const instanceId = useId();
 	const deferredSearch = useDeferredValue(search);
 	const isMobile = useIsMobile();
-	let t15;
-	if ($[13] !== resolvedStaticOptions) {
-		t15 = flattenOptions(resolvedStaticOptions);
-		$[13] = resolvedStaticOptions;
-		$[14] = t15;
-	} else t15 = $[14];
-	const flatStaticOptions = t15;
-	let t16;
-	if ($[15] !== deferredSearch || $[16] !== instanceId || $[17] !== queryKey) {
-		t16 = queryKey ? queryKey(deferredSearch) : [
+	const flatStaticOptions = useMemo(() => flattenOptions(resolvedStaticOptions), [resolvedStaticOptions]);
+	const { data: dynamicOptions = [], isFetching } = useQuery({
+		queryKey: useMemo(() => queryKey ? queryKey(deferredSearch) : [
 			"select-single",
 			instanceId,
 			deferredSearch
-		];
-		$[15] = deferredSearch;
-		$[16] = instanceId;
-		$[17] = queryKey;
-		$[18] = t16;
-	} else t16 = $[18];
-	const loadOptionsKey = t16;
-	let t17;
-	if ($[19] !== deferredSearch || $[20] !== loadOptions) {
-		t17 = () => loadOptions?.(deferredSearch) ?? Promise.resolve([]);
-		$[19] = deferredSearch;
-		$[20] = loadOptions;
-		$[21] = t17;
-	} else t17 = $[21];
-	const t18 = !!loadOptions && (open || prefetchOnMount);
-	let t19;
-	if ($[22] !== loadOptionsKey || $[23] !== t17 || $[24] !== t18) {
-		t19 = {
-			queryKey: loadOptionsKey,
-			queryFn: t17,
-			enabled: t18,
-			staleTime: 3e4,
-			gcTime: 3e5
-		};
-		$[22] = loadOptionsKey;
-		$[23] = t17;
-		$[24] = t18;
-		$[25] = t19;
-	} else t19 = $[25];
-	const { data: t20, isFetching } = useQuery(t19);
-	let t21;
-	if ($[26] !== t20) {
-		t21 = t20 === void 0 ? [] : t20;
-		$[26] = t20;
-		$[27] = t21;
-	} else t21 = $[27];
-	const dynamicOptions = t21;
-	let t22;
-	bb0: {
-		if (!loadOptions) {
-			t22 = flatStaticOptions;
-			break bb0;
-		}
-		if (flatStaticOptions.length === 0) {
-			t22 = dynamicOptions;
-			break bb0;
-		}
-		let t23$1;
-		if ($[28] !== dynamicOptions || $[29] !== flatStaticOptions) {
-			const mergedMap = [...flatStaticOptions, ...dynamicOptions].reduce(_temp, /* @__PURE__ */ new Map());
-			t23$1 = Array.from(mergedMap.values());
-			$[28] = dynamicOptions;
-			$[29] = flatStaticOptions;
-			$[30] = t23$1;
-		} else t23$1 = $[30];
-		t22 = t23$1;
-	}
-	const allOptions = t22;
+		], [
+			queryKey,
+			deferredSearch,
+			instanceId
+		]),
+		queryFn: () => loadOptions?.(deferredSearch) ?? Promise.resolve([]),
+		enabled: !!loadOptions && (open || prefetchOnMount),
+		staleTime: 3e4,
+		gcTime: 5 * 6e4
+	});
+	const allOptions = useMemo(() => {
+		if (!loadOptions) return flatStaticOptions;
+		if (flatStaticOptions.length === 0) return dynamicOptions;
+		const mergedMap = [...flatStaticOptions, ...dynamicOptions].reduce((map, opt) => new Map(map).set(opt.value, opt), /* @__PURE__ */ new Map());
+		return Array.from(mergedMap.values());
+	}, [
+		loadOptions,
+		dynamicOptions,
+		flatStaticOptions
+	]);
 	const showSearchInput = searchable === "auto" ? !!loadOptions || allOptions.length > SEARCH_OPTION_THRESHOLD : searchable;
-	let t23;
-	if ($[31] !== locale || $[32] !== resolveText || $[33] !== translate) {
-		t23 = (option) => resolveOptionLabel({
-			value: option.value,
-			label: option.label,
+	const getOptionLabel = useCallback((option) => resolveOptionLabel({
+		value: option.value,
+		label: option.label,
+		resolveText,
+		t: translate,
+		locale
+	}), [
+		locale,
+		resolveText,
+		translate
+	]);
+	const filteredOptions = useMemo(() => {
+		if (!showSearchInput) return allOptions;
+		if (loadOptions) return allOptions;
+		if (!search) return allOptions;
+		return allOptions.filter((opt) => getOptionLabel(opt).toLowerCase().includes(search.toLowerCase()));
+	}, [
+		allOptions,
+		search,
+		loadOptions,
+		getOptionLabel,
+		showSearchInput
+	]);
+	const getLabel = useCallback((val) => {
+		return resolveOptionLabel({
+			value: val,
+			label: allOptions.find((opt) => opt.value === val)?.label,
 			resolveText,
 			t: translate,
-			locale
+			locale,
+			fallback: selectedLabel ?? String(val)
 		});
-		$[31] = locale;
-		$[32] = resolveText;
-		$[33] = translate;
-		$[34] = t23;
-	} else t23 = $[34];
-	const getOptionLabel = t23;
-	let t24;
-	bb1: {
-		if (!showSearchInput) {
-			t24 = allOptions;
-			break bb1;
-		}
-		if (loadOptions) {
-			t24 = allOptions;
-			break bb1;
-		}
-		if (!search) {
-			t24 = allOptions;
-			break bb1;
-		}
-		let t25$1;
-		if ($[35] !== allOptions || $[36] !== getOptionLabel || $[37] !== search) {
-			let t26$1;
-			if ($[39] !== getOptionLabel || $[40] !== search) {
-				t26$1 = (opt_0) => getOptionLabel(opt_0).toLowerCase().includes(search.toLowerCase());
-				$[39] = getOptionLabel;
-				$[40] = search;
-				$[41] = t26$1;
-			} else t26$1 = $[41];
-			t25$1 = allOptions.filter(t26$1);
-			$[35] = allOptions;
-			$[36] = getOptionLabel;
-			$[37] = search;
-			$[38] = t25$1;
-		} else t25$1 = $[38];
-		t24 = t25$1;
-	}
-	const filteredOptions = t24;
-	let t25;
-	if ($[42] !== allOptions || $[43] !== locale || $[44] !== resolveText || $[45] !== selectedLabel || $[46] !== translate) {
-		t25 = (val) => {
-			return resolveOptionLabel({
-				value: val,
-				label: allOptions.find((opt_1) => opt_1.value === val)?.label,
-				resolveText,
-				t: translate,
-				locale,
-				fallback: selectedLabel ?? String(val)
-			});
-		};
-		$[42] = allOptions;
-		$[43] = locale;
-		$[44] = resolveText;
-		$[45] = selectedLabel;
-		$[46] = translate;
-		$[47] = t25;
-	} else t25 = $[47];
-	const getLabel = t25;
-	let t26;
-	if ($[48] !== onChange) {
-		t26 = (selectedValue) => {
-			onChange(selectedValue);
-			setOpen(false);
-			setSearch("");
-		};
-		$[48] = onChange;
-		$[49] = t26;
-	} else t26 = $[49];
-	const handleSelect = t26;
-	let t27;
-	if ($[50] !== onChange) {
-		t27 = (e) => {
-			e.preventDefault();
-			e.stopPropagation();
-			onChange(null);
-		};
-		$[50] = onChange;
-		$[51] = t27;
-	} else t27 = $[51];
-	const handleClear = t27;
-	let t28;
-	if ($[52] !== clearable || $[53] !== disabled || $[54] !== handleClear || $[55] !== isLoadingValue || $[56] !== value) {
-		t28 = (event) => {
-			if (clearable && value && !disabled && !isLoadingValue && (event.key === "Backspace" || event.key === "Delete")) handleClear(event);
-		};
-		$[52] = clearable;
-		$[53] = disabled;
-		$[54] = handleClear;
-		$[55] = isLoadingValue;
-		$[56] = value;
-		$[57] = t28;
-	} else t28 = $[57];
-	const handleTriggerKeyDown = t28;
+	}, [
+		allOptions,
+		locale,
+		resolveText,
+		selectedLabel,
+		translate
+	]);
+	const handleSelect = useCallback((selectedValue) => {
+		onChange(selectedValue);
+		setOpen(false);
+		setSearch("");
+	}, [onChange]);
+	const handleClear = useCallback((e) => {
+		e.preventDefault();
+		e.stopPropagation();
+		onChange(null);
+	}, [onChange]);
+	const handleTriggerKeyDown = useCallback((event) => {
+		if (clearable && value && !disabled && !isLoadingValue && (event.key === "Backspace" || event.key === "Delete")) handleClear(event);
+	}, [
+		clearable,
+		disabled,
+		handleClear,
+		isLoadingValue,
+		value
+	]);
 	const showLoading = isFetching || externalLoading;
 	const listboxId = `${instanceId}-listbox`;
-	const t29 = !!value;
-	let t30;
-	if ($[58] !== className) {
-		t30 = cn(className);
-		$[58] = className;
-		$[59] = t30;
-	} else t30 = $[59];
-	let t31;
-	if ($[60] !== isLoadingValue || $[61] !== value) {
-		t31 = isLoadingValue && value ? /* @__PURE__ */ jsx(Icon, {
-			icon: "ph:circle-notch",
-			className: "text-muted-foreground size-3 shrink-0 animate-spin"
-		}) : null;
-		$[60] = isLoadingValue;
-		$[61] = value;
-		$[62] = t31;
-	} else t31 = $[62];
-	const t32 = isLoadingValue && value && "text-muted-foreground";
-	let t33;
-	if ($[63] !== t32) {
-		t33 = cn("truncate", t32);
-		$[63] = t32;
-		$[64] = t33;
-	} else t33 = $[64];
-	let t34;
-	if ($[65] !== getLabel || $[66] !== resolvedPlaceholder || $[67] !== value) {
-		t34 = value ? getLabel(value) : resolvedPlaceholder;
-		$[65] = getLabel;
-		$[66] = resolvedPlaceholder;
-		$[67] = value;
-		$[68] = t34;
-	} else t34 = $[68];
-	let t35;
-	if ($[69] !== t33 || $[70] !== t34) {
-		t35 = /* @__PURE__ */ jsx("span", {
-			className: t33,
-			children: t34
-		});
-		$[69] = t33;
-		$[70] = t34;
-		$[71] = t35;
-	} else t35 = $[71];
-	let t36;
-	if ($[72] !== t31 || $[73] !== t35) {
-		t36 = /* @__PURE__ */ jsxs("span", {
+	const TriggerButton = /* @__PURE__ */ jsxs(FieldSelectTrigger, {
+		id,
+		role: "combobox",
+		"aria-expanded": open,
+		"aria-controls": listboxId,
+		"aria-invalid": ariaInvalid,
+		disabled,
+		hasValue: !!value,
+		onKeyDown: handleTriggerKeyDown,
+		asInputGroupControl,
+		className: cn(className),
+		children: [/* @__PURE__ */ jsxs("span", {
 			className: "flex min-w-0 flex-1 items-center gap-1.5 truncate",
-			children: [t31, t35]
-		});
-		$[72] = t31;
-		$[73] = t35;
-		$[74] = t36;
-	} else t36 = $[74];
-	let t37;
-	if ($[75] !== clearable || $[76] !== disabled || $[77] !== handleClear || $[78] !== isLoadingValue || $[79] !== t || $[80] !== value) {
-		t37 = clearable && value && !disabled && !isLoadingValue && /* @__PURE__ */ jsx("span", {
-			"aria-hidden": "true",
-			title: t("relation.clear", "Clear selection"),
-			onPointerDown: handleClear,
-			onClick: handleClear,
-			className: "hover:bg-surface-high -mr-1 inline-flex size-6 items-center justify-center rounded-md opacity-60 transition-[background-color,opacity] hover:opacity-100",
-			children: /* @__PURE__ */ jsx(Icon, {
-				icon: "ph:x",
-				className: "size-3"
-			})
-		});
-		$[75] = clearable;
-		$[76] = disabled;
-		$[77] = handleClear;
-		$[78] = isLoadingValue;
-		$[79] = t;
-		$[80] = value;
-		$[81] = t37;
-	} else t37 = $[81];
-	let t38;
-	if ($[82] === Symbol.for("react.memo_cache_sentinel")) {
-		t38 = /* @__PURE__ */ jsx(Icon, {
-			icon: "ph:caret-up-down",
-			className: "size-3.5 opacity-50"
-		});
-		$[82] = t38;
-	} else t38 = $[82];
-	let t39;
-	if ($[83] !== t37) {
-		t39 = /* @__PURE__ */ jsxs("div", {
+			children: [isLoadingValue && value ? /* @__PURE__ */ jsx(Icon, {
+				icon: "ph:circle-notch",
+				className: "text-muted-foreground size-3 shrink-0 animate-spin"
+			}) : null, /* @__PURE__ */ jsx("span", {
+				className: cn("truncate", isLoadingValue && value && "text-muted-foreground"),
+				children: value ? getLabel(value) : resolvedPlaceholder
+			})]
+		}), /* @__PURE__ */ jsxs("div", {
 			className: "flex h-full shrink-0 items-center gap-1",
-			children: [t37, t38]
-		});
-		$[83] = t37;
-		$[84] = t39;
-	} else t39 = $[84];
-	let t40;
-	if ($[85] !== ariaInvalid || $[86] !== asInputGroupControl || $[87] !== disabled || $[88] !== handleTriggerKeyDown || $[89] !== id || $[90] !== listboxId || $[91] !== open || $[92] !== t29 || $[93] !== t30 || $[94] !== t36 || $[95] !== t39) {
-		t40 = /* @__PURE__ */ jsxs(FieldSelectTrigger, {
-			id,
-			role: "combobox",
-			"aria-expanded": open,
-			"aria-controls": listboxId,
-			"aria-invalid": ariaInvalid,
-			disabled,
-			hasValue: t29,
-			onKeyDown: handleTriggerKeyDown,
-			asInputGroupControl,
-			className: t30,
-			children: [t36, t39]
-		});
-		$[85] = ariaInvalid;
-		$[86] = asInputGroupControl;
-		$[87] = disabled;
-		$[88] = handleTriggerKeyDown;
-		$[89] = id;
-		$[90] = listboxId;
-		$[91] = open;
-		$[92] = t29;
-		$[93] = t30;
-		$[94] = t36;
-		$[95] = t39;
-		$[96] = t40;
-	} else t40 = $[96];
-	const TriggerButton = t40;
-	const t41 = showSearchInput && !loadOptions;
-	let t42;
-	if ($[97] !== search || $[98] !== showSearchInput || $[99] !== t) {
-		t42 = showSearchInput && /* @__PURE__ */ jsx(CommandInput, {
+			children: [clearable && value && !disabled && !isLoadingValue && /* @__PURE__ */ jsx("span", {
+				"aria-hidden": "true",
+				title: t("relation.clear", "Clear selection"),
+				onPointerDown: handleClear,
+				onClick: handleClear,
+				className: "hover:bg-surface-high -mr-1 inline-flex size-6 items-center justify-center rounded-md opacity-60 transition-[background-color,opacity] hover:opacity-100",
+				children: /* @__PURE__ */ jsx(Icon, {
+					icon: "ph:x",
+					className: "size-3"
+				})
+			}), /* @__PURE__ */ jsx(Icon, {
+				icon: "ph:caret-up-down",
+				className: "size-3.5 opacity-50"
+			})]
+		})]
+	});
+	const CommandContent = /* @__PURE__ */ jsxs(Command, {
+		shouldFilter: showSearchInput && !loadOptions,
+		children: [showSearchInput && /* @__PURE__ */ jsx(CommandInput, {
 			placeholder: t("ui.searchPlaceholder", "Search..."),
 			value: search,
 			onValueChange: setSearch
-		});
-		$[97] = search;
-		$[98] = showSearchInput;
-		$[99] = t;
-		$[100] = t42;
-	} else t42 = $[100];
-	let t43;
-	if ($[101] !== showLoading) {
-		t43 = showLoading && /* @__PURE__ */ jsx("div", {
-			className: "flex items-center justify-center py-6",
-			children: /* @__PURE__ */ jsx(Icon, {
-				icon: "ph:circle-notch",
-				className: "text-muted-foreground size-4 animate-spin"
-			})
-		});
-		$[101] = showLoading;
-		$[102] = t43;
-	} else t43 = $[102];
-	let t44;
-	if ($[103] !== resolvedEmptyMessage) {
-		t44 = /* @__PURE__ */ jsx(CommandEmpty, { children: resolvedEmptyMessage });
-		$[103] = resolvedEmptyMessage;
-		$[104] = t44;
-	} else t44 = $[104];
-	let t45;
-	if ($[105] !== filteredOptions || $[106] !== getOptionLabel || $[107] !== handleSelect || $[108] !== value) {
-		let t46$1;
-		if ($[110] !== getOptionLabel || $[111] !== handleSelect || $[112] !== value) {
-			t46$1 = (option_1) => /* @__PURE__ */ jsxs(CommandItem, {
-				value: String(option_1.value),
-				onSelect: handleSelect,
-				disabled: option_1.disabled,
-				"data-checked": value === option_1.value,
-				children: [option_1.icon, /* @__PURE__ */ jsx("span", {
-					className: "truncate",
-					children: getOptionLabel(option_1)
-				})]
-			}, String(option_1.value));
-			$[110] = getOptionLabel;
-			$[111] = handleSelect;
-			$[112] = value;
-			$[113] = t46$1;
-		} else t46$1 = $[113];
-		t45 = filteredOptions.map(t46$1);
-		$[105] = filteredOptions;
-		$[106] = getOptionLabel;
-		$[107] = handleSelect;
-		$[108] = value;
-		$[109] = t45;
-	} else t45 = $[109];
-	let t46;
-	if ($[114] !== t45) {
-		t46 = /* @__PURE__ */ jsx(CommandGroup, { children: t45 });
-		$[114] = t45;
-		$[115] = t46;
-	} else t46 = $[115];
-	let t47;
-	if ($[116] !== listboxId || $[117] !== t43 || $[118] !== t44 || $[119] !== t46) {
-		t47 = /* @__PURE__ */ jsxs(CommandList, {
+		}), /* @__PURE__ */ jsxs(CommandList, {
 			id: listboxId,
 			children: [
-				t43,
-				t44,
-				t46
+				showLoading && /* @__PURE__ */ jsx("div", {
+					className: "flex items-center justify-center py-6",
+					children: /* @__PURE__ */ jsx(Icon, {
+						icon: "ph:circle-notch",
+						className: "text-muted-foreground size-4 animate-spin"
+					})
+				}),
+				/* @__PURE__ */ jsx(CommandEmpty, { children: resolvedEmptyMessage }),
+				/* @__PURE__ */ jsx(CommandGroup, { children: filteredOptions.map((option) => /* @__PURE__ */ jsxs(CommandItem, {
+					value: String(option.value),
+					onSelect: handleSelect,
+					disabled: option.disabled,
+					"data-checked": value === option.value,
+					children: [option.icon, /* @__PURE__ */ jsx("span", {
+						className: "truncate",
+						children: getOptionLabel(option)
+					})]
+				}, String(option.value))) })
 			]
-		});
-		$[116] = listboxId;
-		$[117] = t43;
-		$[118] = t44;
-		$[119] = t46;
-		$[120] = t47;
-	} else t47 = $[120];
-	let t48;
-	if ($[121] !== t41 || $[122] !== t42 || $[123] !== t47) {
-		t48 = /* @__PURE__ */ jsxs(Command, {
-			shouldFilter: t41,
-			children: [t42, t47]
-		});
-		$[121] = t41;
-		$[122] = t42;
-		$[123] = t47;
-		$[124] = t48;
-	} else t48 = $[124];
-	const CommandContent = t48;
-	if (isMobile) {
-		let t49$1;
-		if ($[125] !== TriggerButton) {
-			t49$1 = /* @__PURE__ */ jsx(DrawerTrigger, {
-				asChild: true,
-				children: TriggerButton
-			});
-			$[125] = TriggerButton;
-			$[126] = t49$1;
-		} else t49$1 = $[126];
-		let t50$1;
-		if ($[127] !== resolvedDrawerTitle) {
-			t50$1 = /* @__PURE__ */ jsx(DrawerHeader, { children: /* @__PURE__ */ jsx(DrawerTitle, { children: resolvedDrawerTitle }) });
-			$[127] = resolvedDrawerTitle;
-			$[128] = t50$1;
-		} else t50$1 = $[128];
-		let t51$1;
-		if ($[129] !== CommandContent) {
-			t51$1 = /* @__PURE__ */ jsx("div", {
-				className: "px-4 pb-6",
-				children: CommandContent
-			});
-			$[129] = CommandContent;
-			$[130] = t51$1;
-		} else t51$1 = $[130];
-		let t52;
-		if ($[131] !== t50$1 || $[132] !== t51$1) {
-			t52 = /* @__PURE__ */ jsxs(DrawerContent, { children: [t50$1, t51$1] });
-			$[131] = t50$1;
-			$[132] = t51$1;
-			$[133] = t52;
-		} else t52 = $[133];
-		let t53;
-		if ($[134] !== open || $[135] !== t49$1 || $[136] !== t52) {
-			t53 = /* @__PURE__ */ jsxs(Drawer, {
-				open,
-				onOpenChange: setOpen,
-				children: [t49$1, t52]
-			});
-			$[134] = open;
-			$[135] = t49$1;
-			$[136] = t52;
-			$[137] = t53;
-		} else t53 = $[137];
-		return t53;
-	}
-	let t49;
-	if ($[138] !== TriggerButton) {
-		t49 = /* @__PURE__ */ jsx(PopoverTrigger, { render: TriggerButton });
-		$[138] = TriggerButton;
-		$[139] = t49;
-	} else t49 = $[139];
-	let t50;
-	if ($[140] !== CommandContent) {
-		t50 = /* @__PURE__ */ jsx(PopoverContent, {
+		})]
+	});
+	if (isMobile) return /* @__PURE__ */ jsxs(Drawer, {
+		open,
+		onOpenChange: setOpen,
+		children: [/* @__PURE__ */ jsx(DrawerTrigger, {
+			asChild: true,
+			children: TriggerButton
+		}), /* @__PURE__ */ jsxs(DrawerContent, { children: [/* @__PURE__ */ jsx(DrawerHeader, { children: /* @__PURE__ */ jsx(DrawerTitle, { children: resolvedDrawerTitle }) }), /* @__PURE__ */ jsx("div", {
+			className: "px-4 pb-6",
+			children: CommandContent
+		})] })]
+	});
+	return /* @__PURE__ */ jsxs(Popover, {
+		open,
+		onOpenChange: setOpen,
+		children: [/* @__PURE__ */ jsx(PopoverTrigger, { render: TriggerButton }), /* @__PURE__ */ jsx(PopoverContent, {
 			className: "w-(--anchor-width) p-0",
 			align: "start",
 			children: CommandContent
-		});
-		$[140] = CommandContent;
-		$[141] = t50;
-	} else t50 = $[141];
-	let t51;
-	if ($[142] !== open || $[143] !== t49 || $[144] !== t50) {
-		t51 = /* @__PURE__ */ jsxs(Popover, {
-			open,
-			onOpenChange: setOpen,
-			children: [t49, t50]
-		});
-		$[142] = open;
-		$[143] = t49;
-		$[144] = t50;
-		$[145] = t51;
-	} else t51 = $[145];
-	return t51;
-}
-function _temp(map, opt) {
-	return new Map(map).set(opt.value, opt);
+		})]
+	});
 }
 
 //#endregion