@moubing/bing-ui 0.11.2 → 0.12.1

package/dist/components/BingTooltip/BingTooltip.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,572 @@
+import { useConfigZIndex as e } from "../../utils/config.js";
+import { useReducedMotion as t } from "../../motion/reducedMotion.js";
+import { useClickFeedback as n } from "../../motion/useClickFeedback.js";
+import r from "../BingScrollbar/BingScrollbar.js";
+import { useOverlay as i } from "../../utils/overlay.js";
+import { useClientReady as a } from "../../utils/useClientReady.js";
+import { createGlassCssVariables as ee, defaultGlassEffect as o } from "../../utils/glass.js";
+import { computeFloatingPosition as te, snapToDevicePixel as s, useFloatingAutoUpdate as ne } from "../../utils/floating.js";
+import { createTooltipOwnerId as re, registerTooltipOwner as ie, sharedTooltipActiveOwner as c, sharedTooltipHostId as ae, sharedTooltipPanelElement as l, sharedTooltipShouldRender as u, sharedTooltipSuppressRootClickOwnerId as d, unregisterTooltipOwner as oe } from "./BingTooltip.shared.js";
+import { Teleport as se, computed as f, createBlock as ce, createCommentVNode as le, createElementBlock as ue, createElementVNode as p, createVNode as de, defineComponent as fe, getCurrentInstance as pe, nextTick as me, normalizeClass as he, normalizeStyle as ge, onBeforeUnmount as _e, openBlock as m, ref as h, renderSlot as ve, resolveDynamicComponent as ye, shallowRef as be, unref as xe, useSlots as Se, watch as g, withCtx as Ce, withModifiers as we } from "vue";
+import { gsap as _ } from "gsap";
+//#region src/components/BingTooltip/BingTooltip.vue?vue&type=script&setup=true&lang.ts
+var Te = [
+	"aria-describedby",
+	"aria-controls",
+	"aria-expanded"
+], Ee = { class: "bing-tooltip__anchor" }, De = [
+	"id",
+	"aria-label",
+	"aria-hidden"
+], Oe = { class: "bing-tooltip__body-content" }, ke = /* @__PURE__ */ fe({
+	__name: "BingTooltip",
+	props: {
+		modelValue: { type: Boolean },
+		content: { default: void 0 },
+		trigger: { default: "hover" },
+		placement: { default: "top" },
+		align: { default: "center" },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		interactive: {
+			type: Boolean,
+			default: !0
+		},
+		openDelay: { default: 180 },
+		closeDelay: { default: 90 },
+		offset: { default: 10 },
+		viewportPadding: { default: 12 },
+		maxWidth: { default: 280 },
+		zIndex: {},
+		closeOnOutside: {
+			type: Boolean,
+			default: !0
+		},
+		closeOnEsc: {
+			type: Boolean,
+			default: !0
+		},
+		id: { default: void 0 },
+		ariaLabel: { default: void 0 },
+		glass: {
+			type: Boolean,
+			default: o.glass
+		},
+		glassBlur: { default: void 0 },
+		glassOpacity: { default: void 0 },
+		glassSaturation: { default: void 0 }
+	},
+	emits: [
+		"update:modelValue",
+		"open",
+		"close"
+	],
+	setup(o, { expose: ke, emit: Ae }) {
+		let v = t(), { playClickFeedback: je } = n(), y = o, Me = Ae, Ne = e("tooltip", () => y.zIndex), Pe = a(), Fe = Se(), b = pe(), x = re(), Ie = `bing-tooltip-${x}`, S = h(null), C = h(null), w = h(null), T = be(void 0), Le = h(!1), E = h({
+			left: 0,
+			originX: 0,
+			originY: 0,
+			placement: y.placement,
+			top: 0
+		}), D, O, k, A = !1, j = !1, Re = !1, M = "manual", N = f(() => y.id ?? Ie), ze = !!(b?.vnode.props && (Object.prototype.hasOwnProperty.call(b.vnode.props, "modelValue") || Object.prototype.hasOwnProperty.call(b.vnode.props, "model-value"))), P = f(() => !y.disabled && (ze ? !!y.modelValue : Le.value)), F = ne(() => U(c.value), { enabled: () => !!c.value }), Be = i({
+			open: () => u.value && c.value?.id === x,
+			elements: () => [S.value, l.value],
+			zIndex: () => Ne.value,
+			closeOnEscape: () => y.closeOnEsc,
+			onEscape: () => X("escape")
+		}), I = f(() => {
+			let e = Array.isArray(y.trigger) ? y.trigger : [y.trigger], t = e.length > 0 ? e : ["manual"];
+			return [...new Set(t)];
+		}), L = f(() => I.value.includes("hover")), R = f(() => I.value.includes("click")), Ve = f(() => I.value.includes("manual")), He = f(() => Math.max(0, y.openDelay)), Ue = f(() => Math.max(0, y.closeDelay)), We = f(() => Math.max(0, y.offset)), Ge = f(() => Math.max(0, y.viewportPadding)), Ke = f(() => typeof y.maxWidth == "number" ? `${Math.max(1, y.maxWidth)}px` : y.maxWidth), qe = f(() => ee("bing-tooltip", {
+			glass: y.glass,
+			glassBlur: y.glassBlur,
+			glassOpacity: y.glassOpacity,
+			glassSaturation: y.glassSaturation
+		})), Je = f(() => !!(Fe.content || y.content)), z = f(() => ae.value === x), B = f(() => P.value && c.value?.id === x), V = f(() => c.value ?? T.value), Ye = f(() => V.value?.contentComponent), Xe = f(() => V.value?.getTooltipId() ?? N.value), Ze = f(() => ["bing-tooltip", {
+			"is-open": B.value,
+			"is-disabled": y.disabled
+		}]), Qe = f(() => {
+			let e = V.value;
+			return [
+				"bing-tooltip__content",
+				`is-placement-${E.value.placement}`,
+				`is-align-${e?.getAlign() ?? y.align}`,
+				{
+					"is-interactive": e?.getInteractive() ?? y.interactive,
+					"has-content": e?.getHasContent() ?? Je.value
+				}
+			];
+		}), $e = f(() => {
+			let e = V.value, t = e?.getMaxWidth() ?? Ke.value, n = e?.getViewportPadding() ?? Ge.value;
+			return {
+				...e?.getGlassStyle() ?? qe.value,
+				left: `${E.value.left}px`,
+				maxWidth: `min(${t}, calc(100vw - ${n * 2}px))`,
+				position: "fixed",
+				top: `${E.value.top}px`,
+				zIndex: e?.getZIndex() ?? Ne.value,
+				"--bing-tooltip-max-width": t,
+				"--bing-tooltip-origin-x": `${E.value.originX}px`,
+				"--bing-tooltip-origin-y": `${E.value.originY}px`,
+				"--bing-tooltip-viewport-padding": `${n}px`
+			};
+		}), et = fe({
+			name: "BingTooltipContentRenderer",
+			setup() {
+				return () => Fe.content?.() ?? y.content ?? "";
+			}
+		});
+		function H() {
+			return typeof window < "u" && typeof document < "u";
+		}
+		function tt(e, t, n) {
+			return n < t ? t : Math.min(n, Math.max(t, e));
+		}
+		function nt(e, t) {
+			let n = t.getViewportPadding(), r = e.getBoundingClientRect(), i = Math.max(1, window.innerWidth - n * 2), a = Math.max(1, window.innerHeight - n * 2);
+			return {
+				height: Math.min(Math.max(r.height || e.offsetHeight || 42, 1), a),
+				width: Math.min(Math.max(r.width || e.offsetWidth || 220, 1), i)
+			};
+		}
+		function rt(e) {
+			let t = e.getBoundingClientRect();
+			return {
+				height: t.height || e.offsetHeight || 1,
+				left: t.left,
+				top: t.top,
+				width: t.width || e.offsetWidth || 1
+			};
+		}
+		function it() {
+			let e = C.value;
+			e && (Z(), _.killTweensOf(Q([e, w.value])), _.set(e, { clearProps: "transform,width,height,overflow" }), w.value && _.set(w.value, { clearProps: "transform,opacity,visibility" }));
+		}
+		function at(e, t, n, r) {
+			return e === "top" ? {
+				originX: n,
+				originY: t.height
+			} : e === "bottom" ? {
+				originX: n,
+				originY: 0
+			} : e === "left" ? {
+				originX: t.width,
+				originY: r
+			} : {
+				originX: 0,
+				originY: r
+			};
+		}
+		function U(e = V.value) {
+			if (!H() || !e || !e.rootRef.value || !C.value) return;
+			let t = e.getViewportPadding(), n = e.rootRef.value.getBoundingClientRect(), r = nt(C.value, e), i = te({
+				anchor: n,
+				floating: r,
+				side: e.getPlacement(),
+				flip: "best",
+				align: e.getAlign(),
+				gap: e.getOffset(),
+				padding: t
+			}), a = i.side, ee = s(i.left), o = s(i.top), ne = n.left + n.width / 2, re = n.top + n.height / 2, ie = Math.min(14, r.width / 2), c = Math.min(14, r.height / 2), ae = at(a, r, s(tt(ne - ee, ie, r.width - ie)), s(tt(re - o, c, r.height - c)));
+			return E.value = {
+				left: ee,
+				originX: s(ae.originX),
+				originY: s(ae.originY),
+				placement: a,
+				top: o
+			}, r;
+		}
+		function W(e, t) {
+			return typeof Node > "u" || !(t instanceof Node) ? !1 : !!e?.contains(t);
+		}
+		function ot(e, t = c.value) {
+			return !!(W(t?.rootRef.value, e) || W(l.value, e));
+		}
+		function st(e) {
+			if (W(l.value, e.target)) return;
+			let t = c.value;
+			t && (W(t.rootRef.value, e.target) && (d.value = t.id), t.hide("outside"));
+		}
+		function ct(e) {
+			e.key === "Escape" && !e.defaultPrevented && c.value?.isTopLayer(e) && (e.preventDefault(), c.value?.hide("escape"));
+		}
+		function lt(e) {
+			!H() || A || !e?.getCloseOnOutside() || (window.addEventListener("pointerdown", st, !0), A = !0);
+		}
+		function G() {
+			!H() || !A || (window.removeEventListener("pointerdown", st, !0), A = !1);
+		}
+		function ut(e) {
+			!H() || j || !e?.getCloseOnEsc() || (window.addEventListener("keydown", ct), j = !0);
+		}
+		function K() {
+			!H() || !j || (window.removeEventListener("keydown", ct), j = !1);
+		}
+		function dt(e = c.value) {
+			if (!e) {
+				G(), K();
+				return;
+			}
+			e.getCloseOnOutside() ? lt(e) : G(), e.getCloseOnEsc() ? ut(e) : K();
+		}
+		function q() {
+			!H() || O === void 0 || (window.clearTimeout(O), O = void 0);
+		}
+		function J() {
+			!H() || k === void 0 || (window.clearTimeout(k), k = void 0);
+		}
+		function ft() {
+			q(), J();
+		}
+		function pt() {
+			y.disabled || (c.value = $);
+		}
+		function mt() {
+			c.value?.id === x && (c.value = void 0);
+		}
+		function ht(e, t) {
+			e && y.disabled || P.value !== e && (M = t, ze || (Le.value = e), Me("update:modelValue", e));
+		}
+		function Y(e = "manual") {
+			if (J(), P.value) {
+				M = e, pt();
+				return;
+			}
+			ht(!0, e);
+		}
+		function X(e = "manual") {
+			if (q(), !P.value) {
+				mt();
+				return;
+			}
+			ht(!1, e);
+		}
+		function gt(e = "manual") {
+			if (B.value) {
+				X(e);
+				return;
+			}
+			Y(e);
+		}
+		function _t(e) {
+			if (!y.disabled) {
+				if (J(), He.value === 0 || c.value) {
+					Y(e);
+					return;
+				}
+				q(), O = window.setTimeout(() => {
+					O = void 0, Y(e);
+				}, He.value);
+			}
+		}
+		function vt(e) {
+			if (q(), Ue.value === 0) {
+				X(e);
+				return;
+			}
+			J(), k = window.setTimeout(() => {
+				k = void 0, X(e);
+			}, Ue.value);
+		}
+		function Z() {
+			D?.kill(), D = void 0;
+		}
+		function Q(e) {
+			return e.filter((e) => e !== null);
+		}
+		function yt(e, t) {
+			return e === "top" ? {
+				x: 0,
+				y: t
+			} : e === "bottom" ? {
+				x: 0,
+				y: -t
+			} : e === "left" ? {
+				x: t,
+				y: 0
+			} : {
+				x: -t,
+				y: 0
+			};
+		}
+		function bt(e) {
+			let t = C.value;
+			if (!t) return;
+			let n = w.value, r = Q([t, n]), i = yt(E.value.placement, 7);
+			if (Z(), _.killTweensOf(r), v()) {
+				_.set(r, {
+					autoAlpha: 1,
+					clearProps: "transform",
+					scale: 1,
+					x: 0,
+					y: 0
+				});
+				return;
+			}
+			D = _.timeline({
+				defaults: {
+					duration: .2,
+					ease: "power3.out",
+					overwrite: !0
+				},
+				onComplete: () => {
+					D = void 0, _.set(t, { willChange: "auto" });
+				}
+			}), D.fromTo(t, {
+				autoAlpha: 0,
+				scale: .96,
+				transformOrigin: `${E.value.originX}px ${E.value.originY}px`,
+				x: i.x,
+				y: i.y,
+				willChange: "opacity, transform"
+			}, {
+				autoAlpha: 1,
+				scale: 1,
+				x: 0,
+				y: 0,
+				duration: .22
+			}, 0).fromTo(n, {
+				autoAlpha: .68,
+				y: e.getPlacement() === "top" ? -2 : 2
+			}, {
+				autoAlpha: 1,
+				y: 0,
+				duration: .18
+			}, .04);
+		}
+		function xt(e) {
+			let t = C.value;
+			if (!t) return;
+			let n = w.value, r = Q([t, n]), i = s(e.left - E.value.left), a = s(e.top - E.value.top);
+			if (Z(), _.killTweensOf(r), v()) {
+				_.set(r, {
+					autoAlpha: 1,
+					clearProps: "transform,width,height,overflow",
+					scale: 1,
+					x: 0,
+					y: 0
+				});
+				return;
+			}
+			_.set(t, {
+				autoAlpha: 1,
+				scale: .985,
+				transformOrigin: `${E.value.originX}px ${E.value.originY}px`,
+				x: i,
+				y: a,
+				willChange: "opacity, transform"
+			}), n && _.set(n, {
+				autoAlpha: .72,
+				y: 2
+			}), D = _.timeline({
+				defaults: {
+					duration: .28,
+					ease: "power3.out",
+					overwrite: !0
+				},
+				onComplete: () => {
+					D = void 0, _.set(t, {
+						clearProps: "transform,width,height,overflow",
+						willChange: "auto"
+					});
+				}
+			}), D.to(t, {
+				autoAlpha: 1,
+				scale: 1,
+				x: 0,
+				y: 0,
+				duration: .22
+			}, 0), n && D.to(n, {
+				autoAlpha: 1,
+				y: 0,
+				duration: .18
+			}, .04);
+		}
+		function St() {
+			u.value = !1, T.value = void 0;
+		}
+		function Ct() {
+			let e = C.value;
+			if (!e) {
+				St();
+				return;
+			}
+			let t = w.value, n = Q([e, t]), r = yt(E.value.placement, 5);
+			if (Z(), _.killTweensOf(n), v()) {
+				St();
+				return;
+			}
+			D = _.timeline({
+				defaults: {
+					duration: .14,
+					ease: "power2.in",
+					overwrite: !0
+				},
+				onComplete: () => {
+					D = void 0, St();
+				}
+			}), D.to(e, {
+				autoAlpha: 0,
+				scale: .97,
+				x: r.x,
+				y: r.y
+			}, 0);
+		}
+		async function wt(e) {
+			if (e) {
+				let t = u.value && C.value ? rt(C.value) : void 0;
+				if (t && it(), T.value = e, u.value = !0, F.start(), dt(e), await me(), c.value?.id !== e.id) return;
+				let n = U(e);
+				t && n ? xt(t) : bt(e);
+				return;
+			}
+			F.stop(), G(), K(), F.cancel(), Ct();
+		}
+		function Tt() {
+			L.value && _t("hover");
+		}
+		function Et() {
+			L.value && vt("hover");
+		}
+		function Dt() {
+			L.value && _t("focus");
+		}
+		function Ot(e) {
+			!L.value || ot(e.relatedTarget, $) || vt("focus");
+		}
+		function kt(e) {
+			let t = d.value === x;
+			d.value &&= void 0, !t && R.value && !y.disabled && !e.defaultPrevented && (je(e), gt("click"));
+		}
+		function At() {
+			let e = c.value;
+			e?.getInteractive() && e.getHasHoverTrigger() && e.clearCloseTimer();
+		}
+		function jt() {
+			let e = c.value;
+			e?.getInteractive() && e.getHasHoverTrigger() && e.scheduleClose("hover");
+		}
+		function Mt() {
+			let e = c.value;
+			e?.getInteractive() && e.getHasHoverTrigger() && e.clearCloseTimer();
+		}
+		function Nt(e) {
+			let t = c.value;
+			!t?.getInteractive() || !t.getHasHoverTrigger() || ot(e.relatedTarget, t) || t.scheduleClose("focus");
+		}
+		let $ = {
+			id: x,
+			rootRef: S,
+			contentComponent: et,
+			clearCloseTimer: J,
+			getAlign: () => y.align,
+			getAriaLabel: () => y.ariaLabel,
+			getCloseOnEsc: () => y.closeOnEsc,
+			getCloseOnOutside: () => y.closeOnOutside,
+			getHasContent: () => Je.value,
+			getHasHoverTrigger: () => L.value,
+			getInteractive: () => y.interactive,
+			getGlassStyle: () => qe.value,
+			getMaxWidth: () => Ke.value,
+			getOffset: () => We.value,
+			getPlacement: () => y.placement,
+			getTooltipId: () => N.value,
+			getViewportPadding: () => Ge.value,
+			getZIndex: () => Be.zIndex.value,
+			isTopLayer: (e) => Be.isTop(e),
+			hide: X,
+			scheduleClose: vt
+		};
+		return ie($), g(P, (e) => {
+			let t = M;
+			e ? pt() : mt(), Re && Me(e ? "open" : "close", t), M = "manual", Re = !0;
+		}, { immediate: !0 }), g(c, (e) => {
+			z.value && wt(e);
+		}), g(C, (e) => {
+			z.value && (l.value = e);
+		}), g(z, (e) => {
+			if (e) {
+				l.value = C.value, c.value && wt(c.value);
+				return;
+			}
+			l.value === C.value && (l.value = null);
+		}, { immediate: !0 }), g(() => y.disabled, (e) => {
+			e && X("disabled");
+		}), g(() => [
+			y.align,
+			y.closeOnEsc,
+			y.closeOnOutside,
+			y.maxWidth,
+			y.offset,
+			y.placement,
+			y.viewportPadding
+		], () => {
+			B.value && (dt($), me(() => {
+				F.schedule();
+			}));
+		}), ke({
+			hide: X,
+			show: Y,
+			toggle: gt,
+			updatePosition: () => {
+				B.value && U($);
+			}
+		}), _e(() => {
+			ft(), z.value && (F.dispose(), G(), K(), Z(), _.killTweensOf(Q([C.value, w.value]))), l.value === C.value && (l.value = null), oe($);
+		}), (e, t) => (m(), ue("span", {
+			ref_key: "rootRef",
+			ref: S,
+			class: he(Ze.value),
+			"aria-describedby": B.value ? N.value : void 0,
+			"aria-controls": R.value || Ve.value ? N.value : void 0,
+			"aria-expanded": R.value || Ve.value ? B.value : void 0,
+			onPointerenter: Tt,
+			onPointerleave: Et,
+			onFocusin: Dt,
+			onFocusout: Ot,
+			onClick: kt
+		}, [p("span", Ee, [ve(e.$slots, "default", {
+			open: B.value,
+			show: Y,
+			hide: X,
+			toggle: gt
+		}, void 0, !0)]), xe(Pe) && z.value ? (m(), ce(se, {
+			key: 0,
+			to: "body"
+		}, [xe(u) && V.value ? (m(), ue("div", {
+			key: 0,
+			id: Xe.value,
+			ref_key: "panelRef",
+			ref: C,
+			class: he(Qe.value),
+			style: ge($e.value),
+			role: "tooltip",
+			"aria-label": V.value.getAriaLabel(),
+			"aria-hidden": !xe(c),
+			onPointerenter: At,
+			onPointerleave: jt,
+			onFocusin: Mt,
+			onFocusout: Nt,
+			onPointerdown: t[0] ||= we(() => {}, ["stop"]),
+			onClick: t[1] ||= we(() => {}, ["stop"])
+		}, [t[2] ||= p("span", {
+			class: "bing-tooltip__arrow",
+			"aria-hidden": "true"
+		}, null, -1), p("div", {
+			ref_key: "bodyRef",
+			ref: w,
+			class: "bing-tooltip__body"
+		}, [de(r, {
+			class: "bing-tooltip__scroll",
+			focusable: !1,
+			horizontal: ""
+		}, {
+			default: Ce(() => [p("div", Oe, [(m(), ce(ye(Ye.value), { key: V.value.id }))])]),
+			_: 1
+		})], 512)], 46, De)) : le("", !0)])) : le("", !0)], 42, Te));
+	}
+});
+//#endregion
+export { ke as default };

package/dist/components/BingTreeSelect/BingTreeSelect.js

@@ -0,0 +1,7 @@
+import e from "../../_virtual/_plugin-vue_export-helper.js";
+import t from "./BingTreeSelect.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                               */
+//#region src/components/BingTreeSelect/BingTreeSelect.vue
+var n = /* @__PURE__ */ e(t, [["__scopeId", "data-v-a828f02d"]]);
+//#endregion
+export { n as default };

package/dist/components/BingTreeSelect/BingTreeSelect.vue.d.ts

@@ -23,22 +23,23 @@ type __VLS_Slots = {} & {
     'node-detail'?: (props: typeof __VLS_137) => any;
 };
 declare const __VLS_base: import('vue').DefineComponent<BingTreeSelectProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    clear: () => any;
-    change: (payload: BingTreeSelectChangePayload) => any;
     close: () => any;
-    "update:modelValue": (value: BingTreeSelectModelValue) => any;
     open: () => any;
+    change: (payload: BingTreeSelectChangePayload) => any;
+    clear: () => any;
+    "update:modelValue": (value: BingTreeSelectModelValue) => any;
     collapse: (payload: import('./BingTreeSelect.types').BingTreeSelectExpandPayload) => any;
     expand: (payload: import('./BingTreeSelect.types').BingTreeSelectExpandPayload) => any;
 }, string, import('vue').PublicProps, Readonly<BingTreeSelectProps> & Readonly<{
-    onClear?: (() => any) | undefined;
-    onChange?: ((payload: BingTreeSelectChangePayload) => any) | undefined;
     onClose?: (() => any) | undefined;
-    "onUpdate:modelValue"?: ((value: BingTreeSelectModelValue) => any) | undefined;
     onOpen?: (() => any) | undefined;
+    onChange?: ((payload: BingTreeSelectChangePayload) => any) | undefined;
+    onClear?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: BingTreeSelectModelValue) => any) | undefined;
     onCollapse?: ((payload: import('./BingTreeSelect.types').BingTreeSelectExpandPayload) => any) | undefined;
     onExpand?: ((payload: import('./BingTreeSelect.types').BingTreeSelectExpandPayload) => any) | undefined;
 }>, {
+    status: "default" | "error" | "success" | "warning";
     disabled: boolean;
     id: string;
     size: import('./BingTreeSelect.types').BingTreeSelectSize;
@@ -48,7 +49,6 @@ declare const __VLS_base: import('vue').DefineComponent<BingTreeSelectProps, {},
     placeholder: string;
     clearable: boolean;
     ariaDescribedby: string;
-    status: "default" | "error" | "success" | "warning";
     glass: boolean;
     glassBlur: string | number;
     glassOpacity: number;