@moubing/bing-ui 0.11.2 → 0.12.0

package/dist/components/BingSelect/BingSelect.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,1066 @@
+import { useConfigZIndex as e } from "../../utils/config.js";
+import { useReducedMotion as t } from "../../motion/reducedMotion.js";
+import { createSelectPanelEnter as n, createSelectPanelLeave as r } from "../../motion/selectPanelMotion.js";
+import { enterLiquidHover as i, leaveLiquidHover as a } from "../../motion/liquidHover.js";
+import { useClickFeedback as ee } from "../../motion/useClickFeedback.js";
+import { isolateFormControls as te, useFormControl as ne } from "../BingForm/useFormControl.js";
+import re from "../BingButton/BingButton.js";
+import { CheckCheck as ie, ChevronDown as ae, ListX as oe, Search as se, X as ce } from "../../icons/icons.js";
+import o from "../BingIcon/BingIcon.js";
+import le from "../BingInput/BingInput.js";
+import { compactSmoothScrollOptions as ue, resolveComponentSmoothScroll as de } from "../../motion/smoothScroll.js";
+import fe from "../BingScrollbar/BingScrollbar.js";
+import { useOverlay as pe } from "../../utils/overlay.js";
+import { useClientReady as me } from "../../utils/useClientReady.js";
+import { createGlassCssVariables as he, defaultGlassEffect as s } from "../../utils/glass.js";
+import ge from "../BingCheckbox/BingCheckbox.js";
+import { computeFloatingPosition as _e, getAvailableSpace as ve, isVerticalSide as ye, resolveFloatingSide as be, useFloatingAutoUpdate as xe } from "../../utils/floating.js";
+import { getMetaEntries as Se, normalizeSearchText as Ce, searchQueryMatches as we } from "../../utils/search.js";
+import { useKeyboardScrollSync as Te } from "../../utils/useKeyboardScrollSync.js";
+import { useDeferredBlurValidation as Ee } from "../../utils/useDeferredBlurValidation.js";
+import { useOutsidePointerDown as De } from "../../utils/useOutsidePointerDown.js";
+import { useSearchShortcutFocus as Oe } from "../../utils/useSearchShortcutFocus.js";
+import { useVirtualList as ke } from "../../utils/useVirtualList.js";
+import { useOptionDetailPanel as Ae } from "../../utils/useOptionDetailPanel.js";
+import je from "../BingTag/BingTag.js";
+import Me from "../BingTooltip/BingTooltip.js";
+import { Fragment as Ne, Teleport as Pe, computed as c, createBlock as l, createCommentVNode as u, createElementBlock as d, createElementVNode as f, createTextVNode as Fe, createVNode as p, defineComponent as Ie, nextTick as m, normalizeClass as h, normalizeStyle as g, onBeforeUnmount as Le, onMounted as Re, openBlock as _, ref as v, renderList as ze, renderSlot as Be, toDisplayString as y, unref as b, useId as Ve, useSlots as He, watch as Ue, withCtx as We, withDirectives as Ge, withModifiers as Ke } from "vue";
+import { gsap as qe } from "gsap";
+//#region src/components/BingSelect/BingSelect.vue?vue&type=script&setup=true&lang.ts
+var Je = { class: "bing-select__control" }, Ye = [
+	"id",
+	"disabled",
+	"aria-label",
+	"aria-describedby",
+	"aria-invalid",
+	"aria-expanded",
+	"aria-activedescendant"
+], Xe = {
+	key: 0,
+	class: "bing-select__tags-placeholder"
+}, Ze = ["aria-multiselectable"], Qe = [
+	"id",
+	"data-option-index",
+	"disabled",
+	"aria-selected",
+	"onClick",
+	"onMouseenter",
+	"onMousemove",
+	"onMouseleave"
+], $e = { class: "bing-select__option-surface" }, et = { class: "bing-select__option-main" }, tt = { class: "bing-select__option-label" }, nt = {
+	key: 0,
+	class: "bing-select__empty"
+}, rt = { class: "bing-select__option-detail-title" }, it = {
+	key: 0,
+	class: "bing-select__option-detail-text"
+}, at = { class: "bing-select__option-detail-meta-key" }, ot = { class: "bing-select__option-detail-meta-value" }, st = 240, x = /* @__PURE__ */ Ie({
+	__name: "BingSelect",
+	props: {
+		id: { default: void 0 },
+		modelValue: { default: null },
+		options: { default: () => [] },
+		multiple: {
+			type: Boolean,
+			default: !1
+		},
+		placeholder: { default: "请选择选项" },
+		disabled: {
+			type: Boolean,
+			default: void 0
+		},
+		clearable: {
+			type: Boolean,
+			default: !0
+		},
+		showSelectAll: {
+			type: Boolean,
+			default: !0
+		},
+		selectAllText: { default: "全选" },
+		clearAllText: { default: "清空已选" },
+		emptyText: { default: "暂无选项" },
+		searchable: {
+			type: [Boolean, String],
+			default: "auto"
+		},
+		searchPlaceholder: { default: "搜索选项（/）" },
+		noSearchResultsText: { default: "未找到匹配选项" },
+		smoothScroll: {
+			type: [Boolean, Object],
+			default: !0
+		},
+		size: { default: void 0 },
+		block: {
+			type: Boolean,
+			default: !1
+		},
+		width: { default: void 0 },
+		minWidth: { default: 180 },
+		panelMinHeight: { default: 0 },
+		panelMaxHeight: { default: 320 },
+		panelPlacement: { default: "auto" },
+		panelAlign: { default: "start" },
+		panelGap: { default: 10 },
+		virtual: {
+			type: [Boolean, String],
+			default: "auto"
+		},
+		virtualThreshold: { default: 80 },
+		virtualItemHeight: { default: void 0 },
+		virtualOverscan: { default: 4 },
+		ariaLabel: { default: void 0 },
+		ariaDescribedby: { default: void 0 },
+		status: { default: void 0 },
+		glass: {
+			type: Boolean,
+			default: s.glass
+		},
+		glassBlur: { default: void 0 },
+		glassOpacity: { default: void 0 },
+		glassSaturation: { default: void 0 }
+	},
+	emits: [
+		"update:modelValue",
+		"change",
+		"clear",
+		"open",
+		"close"
+	],
+	setup(s, { emit: Ie }) {
+		let x = t(), { vClickFeedback: ct, playClickFeedback: lt } = ee(), S = s, C = Ie, ut = me(), { formItem: dt, resolvedId: ft, resolvedSize: pt, resolvedDisabled: w, resolvedStatus: mt, resolvedAriaDescribedby: ht } = ne(S);
+		te();
+		let gt = He(), _t = c(() => de(S.smoothScroll, ue, {
+			keyboard: !1,
+			smoothTouchpad: !1,
+			respectReducedMotion: !0
+		})), vt = `bing-select-${Ve()}`, yt = `${vt}-listbox`, T = v(null), E = v(null), bt = v(null), xt = v(null), St = v(null), D = v(null), Ct = v(null), O = v(null), k = v(null), A = v(null), wt = v(null), Tt = v([]), j = v(!1), Et = v(!1), M = v(-1), N = v(!1), Dt = v(""), P = v(2 ** 53 - 1), Ot = v(0), F = v({
+			align: "start",
+			left: 0,
+			minHeight: 0,
+			maxHeight: 320,
+			placement: "bottom",
+			top: 0,
+			width: 0
+		}), I, L, kt = 0, At = De(lr), jt = Oe({
+			input: bt,
+			isOpen: () => j.value,
+			isSearchable: () => en.value
+		}), Mt = Ee({
+			formItem: dt,
+			isOpen: () => j.value,
+			isInteractionTarget: or
+		}), { isSyncing: Nt, start: Pt, scheduleEnd: Ft, finish: It } = Te(N), R = Ae({
+			listPanel: D,
+			detailPanel: A,
+			detailContent: wt,
+			itemSelector: ".bing-select__option",
+			indexAttribute: "optionIndex",
+			isOpen: () => j.value,
+			isKeyboardNavigating: N,
+			getItemState: (e) => {
+				let t = S.options[e];
+				return t ? {
+					disabled: t.disabled,
+					hasDetail: Bn(t)
+				} : void 0;
+			},
+			getItemElement: Xn,
+			getItemSurface: fr,
+			getKeyboardIndex: () => M.value,
+			onPointerRestore: (e) => {
+				M.value = e;
+			}
+		}), { index: Lt, shouldRender: Rt, placement: zt } = R, Bt = c(() => typeof S.panelMaxHeight == "number" ? `${S.panelMaxHeight}px` : S.panelMaxHeight), Vt = c(() => typeof S.panelMinHeight == "number" ? `${S.panelMinHeight}px` : S.panelMinHeight), Ht = c(() => Math.max(0, Math.floor(S.virtualThreshold))), Ut = c(() => ({
+			sm: 28,
+			md: 32,
+			lg: 36
+		})[pt.value] + (gt.option ? 16 : 0)), Wt = c(() => S.virtualItemHeight !== void 0 && Number.isFinite(S.virtualItemHeight) ? Math.max(28, Math.floor(S.virtualItemHeight)) : Ut.value), Gt = c(() => Math.max(0, Math.floor(S.virtualOverscan))), z = ke({
+			count: () => V.value.length,
+			mode: () => S.virtual,
+			threshold: () => Ht.value,
+			itemHeight: () => Wt.value,
+			overscan: () => Gt.value,
+			scrollbar: k,
+			fallbackViewportHeight: Ot,
+			itemHeightVar: "--bing-select-virtual-item-height"
+		}), { enabled: B, viewportHeight: Kt, startIndex: qt, endIndex: Jt, bodyStyle: Yt, stackStyle: Xt, refresh: Zt, clampScroll: Qt } = z, $t = c(() => Ce(Dt.value)), en = c(() => S.searchable === !0 ? !0 : S.searchable === !1 ? !1 : S.options.length > 8), tn = c(() => S.searchPlaceholder.includes("/") ? S.searchPlaceholder : `${S.searchPlaceholder} (/)`), V = c(() => {
+			let e = S.options.map((e, t) => ({
+				index: t,
+				option: e
+			})), t = en.value ? $t.value : "";
+			return t ? e.filter(({ option: e }) => Fn(e, t)) : e;
+		}), nn = c(() => V.value.map((e) => e.option)), rn = c(() => en.value && $t.value.length > 0), an = c(() => {
+			let e = {
+				"--bing-select-min-width": An(S.minWidth),
+				...on.value
+			};
+			return S.width !== void 0 && (e["--bing-select-width"] = An(S.width)), e;
+		}), on = c(() => he("bing-select", {
+			glass: S.glass,
+			glassBlur: S.glassBlur,
+			glassOpacity: S.glassOpacity,
+			glassSaturation: S.glassSaturation
+		})), sn = c(() => [
+			"bing-select",
+			`bing-select--${pt.value}`,
+			`bing-select--status-${mt.value}`,
+			{
+				"is-open": j.value,
+				"is-disabled": w.value,
+				"is-invalid": mt.value === "error",
+				"is-block": S.block || !!dt,
+				"has-value": K.value,
+				"is-multiple": S.multiple
+			}
+		]), cn = c(() => [
+			"bing-select__panel",
+			`is-placement-${F.value.placement}`,
+			`is-align-${F.value.align}`,
+			{
+				"is-glass": S.glass,
+				"is-multiple": S.multiple,
+				"is-keyboard-navigating": N.value,
+				"is-keyboard-scrolling": Nt.value
+			}
+		]), ln = xe(() => {
+			Yn(), Zt(), R.updatePosition();
+		}, { enabled: () => j.value }), un = e("popover"), dn = pe({
+			open: () => Et.value,
+			elements: () => [
+				T.value,
+				D.value,
+				O.value,
+				A.value
+			],
+			zIndex: () => un.value,
+			onEscape: () => $(!0)
+		}), fn = c(() => ({
+			position: "fixed",
+			top: `${F.value.top}px`,
+			left: `${F.value.left}px`,
+			width: `${F.value.width}px`,
+			zIndex: dn.zIndex.value,
+			"--bing-select-panel-min-height": `${F.value.minHeight}px`,
+			"--bing-select-panel-max-height": `${F.value.maxHeight}px`,
+			"--bing-select-option-height": `${B.value ? Wt.value : Ut.value}px`,
+			...on.value
+		})), pn = c(() => {
+			let e = F.value.left - 32 - 8, t = F.value.left + F.value.width + 8, n = e >= 8 || !Y() ? e : Jn(t, 8, Math.max(8, window.innerWidth - 32 - 8));
+			return {
+				position: "fixed",
+				top: `${F.value.top}px`,
+				left: `${n}px`,
+				zIndex: dn.zIndex.value + 1,
+				...on.value
+			};
+		}), mn = c(() => B.value ? V.value.slice(qt.value, Jt.value) : V.value), hn = c(() => {
+			if (B.value) return { height: `${Wt.value}px` };
+		}), H = c(() => {
+			let e = S.modelValue;
+			return S.multiple ? Array.isArray(e) ? e : e === null ? [] : [e] : Array.isArray(e) ? e.length > 0 ? [e[0]] : [] : e === null ? [] : [e];
+		}), U = c(() => In(H.value)), W = c(() => S.multiple && !gt.value), gn = c(() => U.value.slice(0, P.value)), _n = c(() => Math.max(0, U.value.length - P.value)), vn = c(() => pt.value === "lg" ? "md" : "sm"), G = c(() => nn.value.filter((e) => !e.disabled)), yn = c(() => G.value.map((e) => e.value)), bn = c(() => G.value.filter((e) => X(e)).length), K = c(() => U.value.length > 0), xn = c(() => S.clearable && !w.value && K.value), Sn = c(() => S.multiple && S.showSelectAll), Cn = c(() => G.value.length > 0), q = c(() => Cn.value && G.value.every((e) => Mn(H.value, e.value))), wn = c(() => G.value.some((e) => Mn(H.value, e.value)) && !q.value), Tn = c(() => j.value && M.value >= 0 ? Ln(M.value) : void 0), J = c(() => {
+			let e = S.options[Lt.value];
+			return Bn(e) ? e : void 0;
+		}), En = c(() => J.value ? X(J.value) : !1), Dn = c(() => J.value ? Rn(J.value) : void 0), On = c(() => zn(J.value)), kn = c(() => {
+			if (!K.value) return S.placeholder;
+			let e = U.value.map((e) => e.label);
+			return S.multiple && e.length > 2 ? `${e.slice(0, 2).join(", ")} +${e.length - 2}` : e.join(S.multiple ? ", " : "");
+		});
+		function Y() {
+			return typeof window < "u" && typeof document < "u";
+		}
+		function An(e) {
+			if (typeof e == "number") return `${e}px`;
+			let t = e.trim();
+			return /^-?\d+(\.\d+)?$/.test(t) ? `${t}px` : e;
+		}
+		function jn(e, t) {
+			return e === t;
+		}
+		function Mn(e, t) {
+			return e.some((e) => jn(e, t));
+		}
+		function Nn(e) {
+			return e.filter((t, n) => e.findIndex((e) => jn(e, t)) === n);
+		}
+		function Pn(e) {
+			return Ce([
+				e.label,
+				e.value,
+				e.description,
+				e.detail,
+				...zn(e).flatMap((e) => [e.key, e.value])
+			].join(" "));
+		}
+		function Fn(e, t) {
+			return we(Pn(e), t);
+		}
+		function In(e) {
+			let t = Array.isArray(e) ? e : e === null ? [] : [e];
+			return S.options.filter((e) => Mn(t, e.value));
+		}
+		function Ln(e) {
+			return `${vt}-option-${e}`;
+		}
+		function X(e) {
+			return Mn(H.value, e.value);
+		}
+		function Rn(e) {
+			return typeof e.detail == "string" && e.detail.trim() ? e.detail : e.description;
+		}
+		function zn(e) {
+			return Se(e?.meta);
+		}
+		function Bn(e) {
+			return e ? !!(gt["option-detail"] || Rn(e) || zn(e).length > 0) : !1;
+		}
+		function Z(e, t) {
+			Mt.cancel();
+			let n = {
+				value: e,
+				option: t,
+				options: In(e)
+			};
+			C("update:modelValue", e), C("change", n), dt?.handleControlChange();
+		}
+		function Vn() {
+			return V.value.find((e) => !e.option.disabled)?.index ?? -1;
+		}
+		function Hn() {
+			let e = V.value.find((e) => !e.option.disabled && X(e.option))?.index ?? -1;
+			M.value = e >= 0 ? e : Vn();
+		}
+		function Un() {
+			!Y() || !kt || (window.cancelAnimationFrame(kt), kt = 0);
+		}
+		function Wn() {
+			let e = U.value.length;
+			if (!W.value || e === 0) {
+				P.value = e;
+				return;
+			}
+			let t = xt.value, n = St.value;
+			if (!t || !n || t.clientWidth <= 0) {
+				P.value = e;
+				return;
+			}
+			let r = Array.from(n.querySelectorAll(".bing-select__measure-tag"), (e) => e.getBoundingClientRect().width), i = new Map(Array.from(n.querySelectorAll(".bing-select__measure-overflow"), (e) => [Number(e.dataset.overflowCount), e.getBoundingClientRect().width])), a = t.clientWidth;
+			if (r.reduce((e, t) => e + t, 0) + Math.max(0, r.length - 1) * 5 <= a) {
+				P.value = e;
+				return;
+			}
+			let ee = 0, te = 0;
+			for (let t = 0; t < e - 1; t += 1) {
+				ee += (t > 0 ? 5 : 0) + (r[t] ?? 0);
+				let n = e - t - 1, ne = i.get(n) ?? 0;
+				if (ee + 5 + ne > a) break;
+				te = t + 1;
+			}
+			P.value = te;
+		}
+		function Q() {
+			Y() && (Un(), kt = window.requestAnimationFrame(() => {
+				kt = 0, Wn();
+			}));
+		}
+		function Gn() {
+			if (L?.disconnect(), L = void 0, !(!W.value || !Y())) {
+				if (typeof ResizeObserver > "u") {
+					window.addEventListener("resize", Q), Q();
+					return;
+				}
+				L = new ResizeObserver(Q), xt.value && L.observe(xt.value), Q();
+			}
+		}
+		function Kn() {
+			if (typeof S.panelMaxHeight == "number") return Math.max(0, S.panelMaxHeight);
+			let e = Number.parseFloat(S.panelMaxHeight);
+			return Number.isFinite(e) ? Math.max(0, e) : 320;
+		}
+		function qn() {
+			if (typeof S.panelMinHeight == "number") return Math.max(0, S.panelMinHeight);
+			let e = Number.parseFloat(S.panelMinHeight);
+			return Number.isFinite(e) ? Math.max(0, e) : 0;
+		}
+		function Jn(e, t, n) {
+			return Math.min(n, Math.max(t, e));
+		}
+		function Yn() {
+			if (!Y() || !T.value || !D.value) return;
+			let e = Number.isFinite(S.panelGap) ? Math.max(0, S.panelGap) : 10, t = T.value.getBoundingClientRect(), n = window.innerWidth, r = window.innerHeight, i = Kn(), a = Math.min(qn(), i), ee = D.value.querySelector(".bing-select__panel-body"), te = Ct.value?.getBoundingClientRect().height ?? 0, ne = z.getContentHeight() ?? ee?.scrollHeight ?? 0, re = B.value ? Wt.value : Ut.value, ie = Math.max(re, V.value.length * re), ae = te + (ne || ie) + 2, oe = Jn(ae, a, i), se = {
+				gap: e,
+				padding: 12,
+				viewport: {
+					width: n,
+					height: r
+				}
+			}, ce = S.panelPlacement === "auto" ? be({
+				anchor: t,
+				floating: {
+					width: 0,
+					height: oe
+				},
+				side: "bottom",
+				...se
+			}) : S.panelPlacement, o = S.panelAlign, le = ye(ce) ? ve(t, ce, se) : r - 24, ue = Math.max(0, Math.min(i, le)), de = Math.min(a, ue), fe = Jn(ae, de, ue), pe = Math.max(0, fe - te - 2), me = Math.max(0, n - 24), he = Math.min(Math.max(t.width, st), me), s = _e({
+				anchor: t,
+				floating: {
+					width: he,
+					height: fe
+				},
+				side: ce,
+				flip: "none",
+				align: o === "middle" ? "center" : o,
+				...se
+			}), ge = s.left, xe = s.top;
+			Ot.value = pe, Kt.value = pe, F.value = {
+				align: o,
+				left: ge,
+				minHeight: de,
+				maxHeight: ue,
+				placement: ce,
+				top: xe,
+				width: he
+			};
+		}
+		function Xn(e) {
+			return e < 0 || !Y() ? null : document.getElementById(Ln(e));
+		}
+		function Zn(e) {
+			let t = e.target;
+			if (t) {
+				if (z.readViewport(t), N.value) {
+					R.scheduleKeyboardShow(), Ft();
+					return;
+				}
+				R.handleListScroll();
+			}
+		}
+		function Qn(e) {
+			R.rememberPointer(e);
+		}
+		function $n() {
+			let e = D.value;
+			return e ? Array.from(e.querySelectorAll(".bing-select__option")) : [];
+		}
+		function er() {
+			let e = D.value;
+			return e ? Array.from(e.querySelectorAll(".bing-select__option-liquid")) : [];
+		}
+		function tr() {
+			return Array.from(O.value?.querySelectorAll(".bing-select__action-button") ?? []);
+		}
+		function nr() {
+			I?.kill(), I = void 0;
+		}
+		function rr() {
+			let e = D.value;
+			if (!e) return;
+			let t = $n(), r = O.value, i = tr(), a = [
+				e,
+				r,
+				...i,
+				...t
+			].filter(Boolean);
+			if (nr(), qe.killTweensOf([...a, ...er()]), x()) {
+				qe.set(a, {
+					autoAlpha: 1,
+					x: 0,
+					y: 0,
+					scale: 1,
+					scaleX: 1,
+					scaleY: 1,
+					clearProps: "transform"
+				});
+				return;
+			}
+			I = n({
+				panel: e,
+				items: t,
+				actionRail: r,
+				actionButtons: i,
+				placement: F.value.placement,
+				align: F.value.align,
+				onComplete: () => {
+					I = void 0;
+				}
+			});
+		}
+		function ir(e) {
+			Et.value = !1, M.value = -1, N.value = !1, It(), R.hide(!0), Sr(), e && E.value?.focus();
+		}
+		function ar(e = !1) {
+			let t = D.value;
+			if (!t) {
+				ir(e);
+				return;
+			}
+			let n = $n(), i = O.value, a = tr();
+			if (nr(), qe.killTweensOf([
+				t,
+				i,
+				...a,
+				...n,
+				...er()
+			].filter(Boolean)), n.forEach((e) => e.classList.remove("is-liquid-active")), x()) {
+				ir(e);
+				return;
+			}
+			I = r({
+				panel: t,
+				items: n,
+				actionRail: i,
+				actionButtons: a,
+				placement: F.value.placement,
+				align: F.value.align,
+				onComplete: () => {
+					I = void 0, ir(e);
+				}
+			});
+		}
+		function or(e) {
+			return e instanceof Node ? !!(T.value?.contains(e) || D.value?.contains(e) || O.value?.contains(e) || A.value?.contains(e)) : !1;
+		}
+		async function sr() {
+			w.value || j.value || (Et.value = !0, j.value = !0, Hn(), At.start(), jt.start(), ln.start(), C("open"), await m(), Yn(), Zt(), rr(), Dr(), await jt.focus(), N.value && R.scheduleKeyboardShow());
+		}
+		function $(e = !1) {
+			j.value && (k.value?.stop(), j.value = !1, It(), At.stop(), jt.stop(), ln.dispose(), R.hide(), C("close"), ar(e));
+		}
+		function cr() {
+			if (!w.value) {
+				if (j.value) {
+					$();
+					return;
+				}
+				sr();
+			}
+		}
+		function lr(e) {
+			let t = T.value, n = D.value, r = O.value, i = A.value;
+			!t || !(e.target instanceof Node) || dn.contains(e.target) || !t.contains(e.target) && !n?.contains(e.target) && !r?.contains(e.target) && !i?.contains(e.target) && $();
+		}
+		function ur(e) {
+			e.stopPropagation(), E.value?.focus(), cr();
+		}
+		function dr(e) {
+			return e.querySelector(".bing-select__option-liquid");
+		}
+		function fr(e) {
+			return e.querySelector(".bing-select__option-surface") ?? e;
+		}
+		function pr(e, t, n) {
+			let r = fr(e).getBoundingClientRect(), i = Jn(n.clientX - r.left, 0, r.width), a = Jn(n.clientY - r.top, 0, r.height), ee = `${i}px ${a}px`;
+			t.style.setProperty("--bing-select-liquid-x", `${i}px`), t.style.setProperty("--bing-select-liquid-y", `${a}px`), t.style.transformOrigin = ee;
+		}
+		function mr(e, t, n) {
+			R.rememberPointer(e), N.value = !1, It(), M.value = t.disabled ? M.value : n;
+			let r = e.currentTarget;
+			if (t.disabled) {
+				R.hide(!0);
+				return;
+			}
+			if (Bn(t) ? R.show(r, n) : R.hide(!0), x()) return;
+			let a = dr(r);
+			a && (r.classList.add("is-liquid-active"), pr(r, a, e), i(a));
+		}
+		function hr(e, t, n) {
+			R.rememberPointer(e), N.value = !1, It();
+			let r = e.currentTarget;
+			if (t.disabled) {
+				R.hide(!0);
+				return;
+			}
+			if (Bn(t) ? (R.cancelHide(), (Lt.value !== n || !Rt.value) && R.show(r, n)) : R.hide(!0), x()) return;
+			let a = dr(r);
+			a && (pr(r, a, e), r.classList.contains("is-liquid-active") || (r.classList.add("is-liquid-active"), i(a)));
+		}
+		function gr(e, t) {
+			if (t.disabled || x()) return;
+			let n = e.currentTarget, r = dr(n);
+			n.classList.remove("is-liquid-active"), r && a(r);
+		}
+		function _r(e) {
+			if (w.value || e.disabled) return;
+			let t = X(e);
+			if (S.multiple) {
+				Z(t ? H.value.filter((t) => !jn(t, e.value)) : Nn([...H.value, e.value]), e);
+				return;
+			}
+			Z(e.value, e), $(!0);
+		}
+		function vr() {
+			!S.multiple || w.value || !Cn.value || q.value || Z(Nn([...H.value, ...yn.value]));
+		}
+		function yr() {
+			!S.multiple || w.value || bn.value === 0 || Z(H.value.filter((e) => !Mn(yn.value, e)));
+		}
+		function br() {
+			if (q.value) {
+				yr();
+				return;
+			}
+			vr();
+		}
+		function xr() {
+			if (!xn.value) return;
+			let e = S.multiple ? [] : null;
+			C("clear"), Z(e);
+		}
+		function Sr() {
+			Dt.value = "";
+		}
+		function Cr(e) {
+			w.value || (Z(H.value.filter((t) => !jn(t, e.value)), e), m(() => E.value?.focus()));
+		}
+		function wr(e) {
+			e.stopPropagation(), xr();
+		}
+		function Tr(e) {
+			e.stopPropagation();
+		}
+		function Er(e) {
+			if (e.key === "ArrowDown") {
+				e.preventDefault(), Or(1);
+				return;
+			}
+			if (e.key === "ArrowUp") {
+				e.preventDefault(), Or(-1);
+				return;
+			}
+			if (e.key === "Home") {
+				e.preventDefault(), kr("first");
+				return;
+			}
+			if (e.key === "End") {
+				e.preventDefault(), kr("last");
+				return;
+			}
+			if (e.key === "Enter") {
+				e.preventDefault(), Ar(e);
+				return;
+			}
+			if (e.key === "Escape" && Dt.value) {
+				Sr();
+				return;
+			}
+			if (e.key === "Escape") {
+				$(!0);
+				return;
+			}
+			e.key === "Tab" && $();
+		}
+		function Dr() {
+			M.value < 0 || m(() => {
+				if (B.value) {
+					z.scrollToIndex(V.value.findIndex((e) => e.index === M.value), { beforeScroll: Pt });
+					return;
+				}
+				k.value?.stop(), Xn(M.value)?.scrollIntoView?.({ block: "nearest" });
+			});
+		}
+		function Or(e) {
+			let t = V.value;
+			if (t.length === 0) return;
+			let n = t.findIndex((e) => e.index === M.value);
+			n < 0 && (n = e > 0 ? -1 : 0);
+			for (let r = 0; r < t.length; r += 1) {
+				n = (n + e + t.length) % t.length;
+				let r = t[n];
+				if (r && !r.option.disabled) {
+					N.value = !0, M.value = r.index, Dr(), R.scheduleKeyboardShow();
+					return;
+				}
+			}
+		}
+		function kr(e) {
+			let t = (e === "first" ? V.value : [...V.value].reverse()).find((e) => !e.option.disabled);
+			t && (N.value = !0, M.value = t.index, Dr(), R.scheduleKeyboardShow());
+		}
+		function Ar(e) {
+			let t = S.options[M.value];
+			!t || w.value || t.disabled || (lt(e, document.getElementById(Ln(M.value))), _r(t));
+		}
+		function jr(e) {
+			if (!(e.key === "Escape" && (e.defaultPrevented || !dn.isTop(e))) && !w.value && !jt.handleShortcut(e)) {
+				if (e.key === "Tab") {
+					$();
+					return;
+				}
+				if (e.key === "Escape") {
+					j.value && (e.preventDefault(), $(!0));
+					return;
+				}
+				if (e.key === "ArrowDown") {
+					if (e.preventDefault(), N.value = !0, !j.value) {
+						lt(e, E.value), sr();
+						return;
+					}
+					Or(1);
+					return;
+				}
+				if (e.key === "ArrowUp") {
+					if (e.preventDefault(), N.value = !0, !j.value) {
+						lt(e, E.value), sr();
+						return;
+					}
+					Or(-1);
+					return;
+				}
+				if (e.key === "Home" && j.value) {
+					e.preventDefault(), kr("first");
+					return;
+				}
+				if (e.key === "End" && j.value) {
+					e.preventDefault(), kr("last");
+					return;
+				}
+				if (e.key === "Enter" || e.key === " ") {
+					if (e.preventDefault(), N.value = !0, !j.value) {
+						lt(e, E.value), sr();
+						return;
+					}
+					Ar(e);
+				}
+			}
+		}
+		return Ue(() => w.value, (e) => {
+			e && $();
+		}), Ue(() => $t.value, () => {
+			R.hide(!0), Hn(), z.reset(), j.value && m(() => {
+				Yn(), z.reset(), m(() => {
+					z.reset(), Zt();
+				});
+			});
+		}), Ue(() => [
+			S.options,
+			S.modelValue,
+			S.multiple
+		], () => {
+			m(Q), j.value && (k.value?.stop(), Hn(), m(() => {
+				Qt(), Yn(), Zt(), R.updatePosition();
+			}));
+		}, { deep: !0 }), Ue(() => [
+			W.value,
+			pt.value,
+			S.clearable
+		], () => {
+			m(Gn);
+		}), Ue(() => [
+			Vt.value,
+			Bt.value,
+			S.panelPlacement,
+			S.panelAlign,
+			S.panelGap,
+			B.value,
+			Wt.value,
+			Gt.value
+		], () => {
+			j.value && (k.value?.stop(), m(() => {
+				Qt(), Yn(), Zt(), R.updatePosition();
+			}));
+		}), Re(() => {
+			m(Gn);
+		}), Le(() => {
+			k.value?.stop(), ln.dispose(), Un(), nr(), L?.disconnect(), L = void 0, Y() && window.removeEventListener("resize", Q), qe.killTweensOf([
+				D.value,
+				O.value,
+				...tr(),
+				A.value,
+				wt.value,
+				...Tt.value,
+				...er()
+			].filter(Boolean));
+		}), (e, t) => (_(), d("div", {
+			ref_key: "rootRef",
+			ref: T,
+			class: h(sn.value),
+			style: g(an.value),
+			onKeydown: jr
+		}, [
+			f("div", Je, [
+				Ge((_(), d("button", {
+					ref_key: "triggerRef",
+					ref: E,
+					class: h(["bing-select__trigger", { "is-tag-trigger": W.value }]),
+					type: "button",
+					id: b(ft),
+					disabled: b(w),
+					"aria-label": s.ariaLabel || kn.value,
+					"aria-describedby": b(ht),
+					"aria-invalid": b(mt) === "error" || void 0,
+					"aria-haspopup": "listbox",
+					"aria-expanded": j.value,
+					"aria-controls": yt,
+					"aria-activedescendant": Tn.value,
+					onClick: cr,
+					onBlur: t[0] ||= (...e) => b(Mt).handleBlur && b(Mt).handleBlur(...e)
+				}, [W.value ? u("", !0) : (_(), d("span", {
+					key: 0,
+					class: h(["bing-select__value", { "is-placeholder": !K.value }])
+				}, [Be(e.$slots, "value", {
+					selectedOptions: U.value,
+					placeholder: s.placeholder
+				}, () => [Fe(y(kn.value), 1)], !0)], 2))], 42, Ye)), [[b(ct)]]),
+				W.value ? (_(), d("div", {
+					key: 0,
+					ref_key: "tagsViewportRef",
+					ref: xt,
+					class: "bing-select__tags-value"
+				}, [K.value ? (_(!0), d(Ne, { key: 1 }, ze(gn.value, (e) => (_(), l(je, {
+					key: e.value,
+					class: "bing-select__value-tag",
+					label: e.label,
+					size: vn.value,
+					closable: "",
+					disabled: b(w),
+					"close-aria-label": `移除 ${e.label}`,
+					onClose: (t) => Cr(e)
+				}, null, 8, [
+					"label",
+					"size",
+					"disabled",
+					"close-aria-label",
+					"onClose"
+				]))), 128)) : (_(), d("span", Xe, y(s.placeholder), 1)), _n.value > 0 ? (_(), l(je, {
+					key: 2,
+					class: "bing-select__overflow-tag",
+					label: `+${_n.value}`,
+					size: vn.value,
+					tone: "neutral"
+				}, null, 8, ["label", "size"])) : u("", !0)], 512)) : u("", !0),
+				xn.value ? (_(), l(re, {
+					key: 1,
+					variant: "ghost",
+					size: "xs",
+					rounded: "sm",
+					throttle: !1,
+					class: "bing-select__clear",
+					"aria-label": "清空选择",
+					onClick: wr,
+					onKeydown: t[1] ||= Ke(() => {}, ["stop"])
+				}, {
+					prefix: We(() => [p(o, {
+						icon: b(ce),
+						size: 16,
+						"stroke-width": 1.75
+					}, null, 8, ["icon"])]),
+					_: 1
+				})) : u("", !0),
+				p(re, {
+					variant: "ghost",
+					size: "xs",
+					rounded: "sm",
+					throttle: !1,
+					class: "bing-select__chevron",
+					tabindex: "-1",
+					"aria-hidden": "true",
+					disabled: b(w),
+					onClick: ur
+				}, {
+					prefix: We(() => [p(o, {
+						icon: b(ae),
+						size: 16,
+						"stroke-width": 1.75
+					}, null, 8, ["icon"])]),
+					_: 1
+				}, 8, ["disabled"])
+			]),
+			W.value && K.value ? (_(), d("div", {
+				key: 0,
+				ref_key: "tagMeasureRef",
+				ref: St,
+				class: "bing-select__tag-measure",
+				"aria-hidden": "true"
+			}, [(_(!0), d(Ne, null, ze(U.value, (e) => (_(), l(je, {
+				key: `measure-${e.value}`,
+				class: "bing-select__value-tag bing-select__measure-tag",
+				label: e.label,
+				size: vn.value,
+				closable: ""
+			}, null, 8, ["label", "size"]))), 128)), (_(!0), d(Ne, null, ze(U.value.length, (e) => (_(), l(je, {
+				key: `overflow-${e}`,
+				class: "bing-select__overflow-tag bing-select__measure-overflow",
+				"data-overflow-count": e,
+				label: `+${e}`,
+				size: vn.value,
+				tone: "neutral"
+			}, null, 8, [
+				"data-overflow-count",
+				"label",
+				"size"
+			]))), 128))], 512)) : u("", !0),
+			b(ut) ? (_(), l(Pe, {
+				key: 1,
+				to: "body"
+			}, [
+				Et.value && Sn.value ? (_(), d("div", {
+					key: 0,
+					ref_key: "actionRailRef",
+					ref: O,
+					class: "bing-select__action-rail",
+					style: g(pn.value),
+					"aria-label": "选择操作",
+					onPointerdown: t[2] ||= Ke(() => {}, ["stop"]),
+					onClick: t[3] ||= Ke(() => {}, ["stop"])
+				}, [p(Me, {
+					content: `${q.value ? s.clearAllText : s.selectAllText}: ${bn.value} / ${G.value.length}`,
+					placement: "left",
+					align: "center",
+					"open-delay": 120
+				}, {
+					default: We(() => [p(re, {
+						variant: "ghost",
+						size: "xs",
+						rounded: "sm",
+						throttle: !1,
+						class: h(["bing-select__action-button", { "is-active": q.value || wn.value }]),
+						"data-action": "toggle-select-all",
+						disabled: !Cn.value,
+						"aria-pressed": q.value,
+						"aria-label": `${q.value ? s.clearAllText : s.selectAllText}：已选 ${bn.value} 项，共 ${G.value.length} 项`,
+						onClick: br
+					}, {
+						prefix: We(() => [p(o, {
+							icon: q.value ? b(oe) : b(ie),
+							size: "sm",
+							"stroke-width": q.value ? 2.3 : 2.35
+						}, null, 8, ["icon", "stroke-width"])]),
+						_: 1
+					}, 8, [
+						"class",
+						"disabled",
+						"aria-pressed",
+						"aria-label"
+					])]),
+					_: 1
+				}, 8, ["content"])], 36)) : u("", !0),
+				Et.value ? (_(), d("div", {
+					key: 1,
+					id: yt,
+					ref_key: "panelRef",
+					ref: D,
+					class: h(cn.value),
+					style: g(fn.value),
+					role: "listbox",
+					"aria-multiselectable": s.multiple || void 0,
+					onKeydown: jr,
+					onPointermove: t[7] ||= (...e) => b(R).rememberPointer && b(R).rememberPointer(...e),
+					onWheelPassive: Qn
+				}, [en.value ? (_(), d("div", {
+					key: 0,
+					ref_key: "bulkActionsRef",
+					ref: Ct,
+					class: "bing-select__bulk-actions"
+				}, [en.value ? (_(), l(le, {
+					key: 0,
+					ref_key: "searchInputRef",
+					ref: bt,
+					modelValue: Dt.value,
+					"onUpdate:modelValue": t[4] ||= (e) => Dt.value = e,
+					class: "bing-select__search",
+					type: "search",
+					icon: b(se),
+					size: "sm",
+					block: "",
+					placeholder: tn.value,
+					autocomplete: "off",
+					spellcheck: !1,
+					"clear-aria-label": "清空搜索",
+					onClear: Sr,
+					onKeydown: Ke(Er, ["stop"])
+				}, null, 8, [
+					"modelValue",
+					"icon",
+					"placeholder"
+				])) : u("", !0)], 512)) : u("", !0), p(fe, {
+					ref_key: "panelScrollRef",
+					ref: k,
+					class: "bing-select__panel-scroll",
+					height: Ot.value,
+					smooth: _t.value,
+					focusable: !1,
+					always: "",
+					"aria-label": "选项列表",
+					onScroll: Zn
+				}, {
+					default: We(() => [f("div", {
+						class: h(["bing-select__panel-body", { "is-virtual": b(B) }]),
+						style: g(b(Yt))
+					}, [f("div", {
+						class: h(["bing-select__option-stack", { "is-virtual": b(B) }]),
+						style: g(b(Xt)),
+						onMouseenter: t[5] ||= (...e) => b(R).cancelHide && b(R).cancelHide(...e),
+						onMouseleave: t[6] ||= (e) => b(R).scheduleHide()
+					}, [(_(!0), d(Ne, null, ze(mn.value, (n) => Ge((_(), d("button", {
+						id: Ln(n.index),
+						key: n.option.value,
+						ref_for: !0,
+						ref_key: "optionRefs",
+						ref: Tt,
+						class: h(["bing-select__option", {
+							"is-selected": X(n.option),
+							"is-active": M.value === n.index,
+							"is-disabled": n.option.disabled
+						}]),
+						type: "button",
+						role: "option",
+						"data-option-index": n.index,
+						style: g(hn.value),
+						disabled: n.option.disabled,
+						"aria-selected": X(n.option),
+						onClick: (e) => _r(n.option),
+						onMouseenter: (e) => mr(e, n.option, n.index),
+						onMousemove: (e) => hr(e, n.option, n.index),
+						onMouseleave: (e) => gr(e, n.option)
+					}, [f("span", $e, [
+						t[10] ||= f("span", {
+							class: "bing-select__option-liquid",
+							"aria-hidden": "true"
+						}, null, -1),
+						p(ge, {
+							decorative: "",
+							"model-value": X(n.option),
+							size: 16,
+							shape: s.multiple ? "rounded" : "circle"
+						}, null, 8, ["model-value", "shape"]),
+						f("span", et, [Be(e.$slots, "option", {
+							option: n.option,
+							selected: X(n.option)
+						}, () => [f("span", tt, y(n.option.label), 1)], !0)])
+					])], 46, Qe)), [[b(ct)]])), 128))], 38), nn.value.length === 0 ? (_(), d("div", nt, y(rn.value ? s.noSearchResultsText : s.emptyText), 1)) : u("", !0)], 6)]),
+					_: 3
+				}, 8, ["height", "smooth"])], 46, Ze)) : u("", !0),
+				b(Rt) && J.value ? (_(), d("div", {
+					key: 2,
+					ref_key: "optionDetailPanelRef",
+					ref: A,
+					class: h(["bing-select__option-detail-panel", `is-placement-${b(zt)}`]),
+					style: g(on.value),
+					"aria-hidden": "true",
+					onPointerdown: Tr,
+					onClick: Tr,
+					onMouseenter: t[8] ||= (...e) => b(R).cancelHide && b(R).cancelHide(...e),
+					onMouseleave: t[9] ||= (e) => b(R).scheduleHide()
+				}, [f("div", {
+					ref_key: "optionDetailContentRef",
+					ref: wt,
+					class: "bing-select__option-detail-content"
+				}, [Be(e.$slots, "option-detail", {
+					option: J.value,
+					selected: En.value,
+					index: b(Lt)
+				}, () => [
+					f("span", rt, y(J.value.label), 1),
+					Dn.value ? (_(), d("span", it, y(Dn.value), 1)) : u("", !0),
+					(_(!0), d(Ne, null, ze(On.value, (e) => (_(), d("span", {
+						key: e.key,
+						class: "bing-select__option-detail-meta"
+					}, [f("span", at, y(e.key), 1), f("span", ot, y(e.value), 1)]))), 128))
+				], !0)], 512)], 38)) : u("", !0)
+			])) : u("", !0)
+		], 38));
+	}
+});
+//#endregion
+export { x as default };