@moubing/bing-ui 0.11.1 → 0.12.0

package/dist/components/BingDatePicker/BingDatePickerCalendar.js

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

package/dist/components/BingDatePicker/BingDatePickerCalendar.vue.d.ts

@@ -0,0 +1,37 @@
+import { default as dayjs, Dayjs } from 'dayjs';
+import { BingDatePickerType } from './BingDatePicker.types';
+import { DatePeriodUnit } from './BingDatePicker.utils';
+type __VLS_Props = {
+    type: BingDatePickerType;
+    panel: 'date' | 'month' | 'year';
+    locale: string;
+    firstDayOfWeek: number;
+    canSwitchYear: boolean;
+    isSelected: (value: Dayjs, unit: DatePeriodUnit) => boolean;
+    isInRange: (value: Dayjs, unit: DatePeriodUnit) => boolean;
+    isDateDisabled: (value: Dayjs) => boolean;
+    isMonthDisabled: (value: Dayjs) => boolean;
+    isYearDisabled: (value: Dayjs) => boolean;
+};
+type __VLS_ModelProps = {
+    'month': Dayjs;
+    'year': number;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    hover: (value: dayjs.Dayjs) => any;
+    select: (value: dayjs.Dayjs) => any;
+    "select-year": (value: dayjs.Dayjs) => any;
+    "open-year": () => any;
+    "update:month": (value: dayjs.Dayjs) => any;
+    "update:year": (value: number) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onHover?: ((value: dayjs.Dayjs) => any) | undefined;
+    onSelect?: ((value: dayjs.Dayjs) => any) | undefined;
+    "onSelect-year"?: ((value: dayjs.Dayjs) => any) | undefined;
+    "onOpen-year"?: (() => any) | undefined;
+    "onUpdate:month"?: ((value: dayjs.Dayjs) => any) | undefined;
+    "onUpdate:year"?: ((value: number) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/BingDatePicker/BingDatePickerCalendar.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,248 @@
+import { useClickFeedback as e } from "../../motion/useClickFeedback.js";
+import t from "../BingButton/BingButton.js";
+import { ChevronLeft as n, ChevronRight as r, ChevronsLeft as ee, ChevronsRight as i } from "../../icons/icons.js";
+import a from "../BingIcon/BingIcon.js";
+import o from "../BingTooltip/BingTooltip.js";
+import { getCalendarCells as s, getMonthCells as te, getWeekdayLabels as ne, getYearBlockStart as c, getYearCells as l } from "./BingDatePicker.utils.js";
+import { Fragment as u, computed as d, createBlock as f, createCommentVNode as re, createElementBlock as p, createElementVNode as m, createTextVNode as ie, createVNode as h, defineComponent as g, mergeModels as _, normalizeClass as v, openBlock as y, renderList as b, toDisplayString as x, unref as S, useModel as C, withCtx as w, withDirectives as T } from "vue";
+import E from "dayjs";
+//#region src/components/BingDatePicker/BingDatePickerCalendar.vue?vue&type=script&setup=true&lang.ts
+var D = { class: "bing-date-picker__calendar-shell" }, O = { class: "bing-date-picker__nav" }, k = { class: "bing-date-picker__nav-group" }, A = { class: "bing-date-picker__nav-group" }, j = { class: "bing-date-picker__nav-button-slot" }, M = {
+	key: 1,
+	class: "bing-date-picker__nav-button-slot is-empty",
+	"aria-hidden": "true"
+}, N = { class: "bing-date-picker__weekdays" }, P = { class: "bing-date-picker__date-grid" }, F = [
+	"disabled",
+	"onMouseenter",
+	"onClick"
+], I = { class: "bing-date-picker__cell-surface" }, L = {
+	key: 1,
+	class: "bing-date-picker__month-grid"
+}, R = [
+	"disabled",
+	"onMouseenter",
+	"onClick"
+], z = { class: "bing-date-picker__cell-surface" }, B = {
+	key: 2,
+	class: "bing-date-picker__year-grid"
+}, V = [
+	"disabled",
+	"onMouseenter",
+	"onClick"
+], ae = { class: "bing-date-picker__cell-surface" }, H = /* @__PURE__ */ g({
+	__name: "BingDatePickerCalendar",
+	props: /* @__PURE__ */ _({
+		type: {},
+		panel: {},
+		locale: {},
+		firstDayOfWeek: {},
+		canSwitchYear: { type: Boolean },
+		isSelected: { type: Function },
+		isInRange: { type: Function },
+		isDateDisabled: { type: Function },
+		isMonthDisabled: { type: Function },
+		isYearDisabled: { type: Function }
+	}, {
+		month: { required: !0 },
+		monthModifiers: {},
+		year: { required: !0 },
+		yearModifiers: {}
+	}),
+	emits: /* @__PURE__ */ _([
+		"hover",
+		"select",
+		"select-year",
+		"open-year"
+	], ["update:month", "update:year"]),
+	setup(g, { emit: _ }) {
+		let H = g, U = _, W = C(g, "month"), G = C(g, "year"), { vClickFeedback: K } = e(), q = d(() => ne(H.locale, H.firstDayOfWeek)), J = d(() => new Intl.DateTimeFormat(H.locale, { month: "short" })), oe = d(() => s(W.value, H.firstDayOfWeek)), se = d(() => te(G.value)), Y = d(() => c(G.value)), ce = d(() => l(G.value)), le = d(() => H.panel === "year" ? `${Y.value} - ${Y.value + 11}` : H.panel === "month" ? String(G.value) : new Intl.DateTimeFormat(H.locale, {
+			year: "numeric",
+			month: "long"
+		}).format(W.value.toDate())), X = d(() => H.panel === "year" ? "前12年" : H.panel === "month" ? "上一年" : "上个月"), Z = d(() => H.panel === "year" ? "后12年" : H.panel === "month" ? "下一年" : "下个月");
+		function Q(e) {
+			let t = W.value.add(e, "month");
+			W.value = t, G.value = t.year();
+		}
+		function $() {
+			if (H.panel === "year") {
+				G.value -= 12;
+				return;
+			}
+			if (H.panel === "month") {
+				--G.value;
+				return;
+			}
+			Q(-1);
+		}
+		function ue() {
+			if (H.panel === "year") {
+				G.value += 12;
+				return;
+			}
+			if (H.panel === "month") {
+				G.value += 1;
+				return;
+			}
+			Q(1);
+		}
+		function de() {
+			if (H.panel === "year") {
+				G.value -= 12;
+				return;
+			}
+			--G.value, W.value = W.value.subtract(1, "year");
+		}
+		function fe() {
+			if (H.panel === "year") {
+				G.value += 12;
+				return;
+			}
+			G.value += 1, W.value = W.value.add(1, "year");
+		}
+		return (e, s) => (y(), p("div", D, [m("div", O, [
+			m("div", k, [m("span", { class: v(["bing-date-picker__nav-button-slot", { "is-empty": g.panel !== "date" }]) }, [g.panel === "date" ? (y(), f(o, {
+				key: 0,
+				content: "上一年",
+				placement: "top",
+				align: "center"
+			}, {
+				default: w(() => [h(t, {
+					variant: "ghost",
+					size: "xs",
+					rounded: "sm",
+					throttle: !1,
+					class: "bing-date-picker__nav-button",
+					"aria-label": "上一年",
+					onClick: de
+				}, {
+					prefix: w(() => [h(a, {
+						icon: S(ee),
+						size: "sm"
+					}, null, 8, ["icon"])]),
+					_: 1
+				})]),
+				_: 1
+			})) : re("", !0)], 2), h(o, {
+				content: X.value,
+				placement: "top",
+				align: "center"
+			}, {
+				default: w(() => [h(t, {
+					variant: "ghost",
+					size: "xs",
+					rounded: "sm",
+					throttle: !1,
+					class: "bing-date-picker__nav-button",
+					"aria-label": X.value,
+					onClick: $
+				}, {
+					prefix: w(() => [h(a, {
+						icon: S(n),
+						size: "sm"
+					}, null, 8, ["icon"])]),
+					_: 1
+				}, 8, ["aria-label"])]),
+				_: 1
+			}, 8, ["content"])]),
+			h(t, {
+				variant: "ghost",
+				size: "xs",
+				rounded: "sm",
+				throttle: !1,
+				class: v(["bing-date-picker__nav-label", { "is-clickable": g.canSwitchYear }]),
+				disabled: !g.canSwitchYear,
+				"aria-label": g.canSwitchYear ? "选择年份" : void 0,
+				onClick: s[0] ||= (e) => U("open-year")
+			}, {
+				default: w(() => [ie(x(le.value), 1)]),
+				_: 1
+			}, 8, [
+				"class",
+				"disabled",
+				"aria-label"
+			]),
+			m("div", A, [h(o, {
+				content: Z.value,
+				placement: "top",
+				align: "center"
+			}, {
+				default: w(() => [h(t, {
+					variant: "ghost",
+					size: "xs",
+					rounded: "sm",
+					throttle: !1,
+					class: "bing-date-picker__nav-button",
+					"aria-label": Z.value,
+					onClick: ue
+				}, {
+					prefix: w(() => [h(a, {
+						icon: S(r),
+						size: "sm"
+					}, null, 8, ["icon"])]),
+					_: 1
+				}, 8, ["aria-label"])]),
+				_: 1
+			}, 8, ["content"]), g.panel === "date" ? (y(), f(o, {
+				key: 0,
+				content: "下一年",
+				placement: "top",
+				align: "center"
+			}, {
+				default: w(() => [m("span", j, [h(t, {
+					variant: "ghost",
+					size: "xs",
+					rounded: "sm",
+					throttle: !1,
+					class: "bing-date-picker__nav-button",
+					"aria-label": "下一年",
+					onClick: fe
+				}, {
+					prefix: w(() => [h(a, {
+						icon: S(i),
+						size: "sm"
+					}, null, 8, ["icon"])]),
+					_: 1
+				})])]),
+				_: 1
+			})) : (y(), p("span", M))])
+		]), (y(), p("div", {
+			key: g.panel,
+			class: v(["bing-date-picker__view", `bing-date-picker__view--${g.panel}`])
+		}, [g.panel === "date" ? (y(), p(u, { key: 0 }, [m("div", N, [(y(!0), p(u, null, b(q.value, (e) => (y(), p("span", { key: e }, x(e), 1))), 128))]), m("div", P, [(y(!0), p(u, null, b(oe.value, (e) => T((y(), p("button", {
+			key: e.format("YYYY-MM-DD"),
+			class: v(["bing-date-picker__cell", {
+				"is-muted": e.month() !== W.value.month(),
+				"is-today": e.isSame(S(E)(), "day"),
+				"is-selected": g.isSelected(e, "day"),
+				"is-in-range": g.isInRange(e, "day")
+			}]),
+			type: "button",
+			disabled: g.isDateDisabled(e),
+			onMouseenter: (t) => U("hover", e),
+			onClick: (t) => U("select", e)
+		}, [m("span", I, x(e.date()), 1)], 42, F)), [[S(K)]])), 128))])], 64)) : g.panel === "month" ? (y(), p("div", L, [(y(!0), p(u, null, b(se.value, (e) => T((y(), p("button", {
+			key: e.format("YYYY-MM"),
+			class: v(["bing-date-picker__cell bing-date-picker__cell--wide", {
+				"is-selected": g.isSelected(e, "month"),
+				"is-in-range": g.isInRange(e, "month")
+			}]),
+			type: "button",
+			disabled: g.isMonthDisabled(e),
+			onMouseenter: (t) => U("hover", e),
+			onClick: (t) => U("select", e)
+		}, [m("span", z, x(J.value.format(e.toDate())), 1)], 42, R)), [[S(K)]])), 128))])) : (y(), p("div", B, [(y(!0), p(u, null, b(ce.value, (e) => T((y(), p("button", {
+			key: e.format("YYYY"),
+			class: v(["bing-date-picker__cell bing-date-picker__cell--wide", {
+				"is-selected": g.type === "year" && g.isSelected(e, "year"),
+				"is-view-active": g.type !== "year" && e.year() === G.value,
+				"is-in-range": g.type === "year" && g.isInRange(e, "year")
+			}]),
+			type: "button",
+			disabled: g.isYearDisabled(e),
+			onMouseenter: (t) => U("hover", e),
+			onClick: (t) => U("select-year", e)
+		}, [m("span", ae, x(e.format("YYYY")), 1)], 42, V)), [[S(K)]])), 128))]))], 2))]));
+	}
+});
+//#endregion
+export { H as default };

package/dist/components/BingDatePicker/BingDatePickerTimePanel.js

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

package/dist/components/BingDatePicker/BingDatePickerTimePanel.vue.d.ts

@@ -0,0 +1,26 @@
+import { Dayjs } from 'dayjs';
+import { BingScrollbarProps } from '../BingScrollbar/BingScrollbar.types';
+import { BingDatePickerTimeUnit } from './BingDatePicker.types';
+type __VLS_Props = {
+    /** 当前正在编辑的值，用来高亮各列的选中项。 */
+    value: Dayjs;
+    compact: boolean;
+    hourStep: number;
+    minuteStep: number;
+    secondStep: number;
+    smooth: BingScrollbarProps['smooth'];
+    isDisabled: (unit: BingDatePickerTimeUnit, value: number) => boolean;
+};
+declare function stop(): void;
+/** 把各列当前选中的值滚到可见范围内（已可见时不动）。 */
+declare function scrollToCurrent(): void;
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {
+    stop: typeof stop;
+    scrollToCurrent: typeof scrollToCurrent;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    select: (unit: BingDatePickerTimeUnit, value: number) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSelect?: ((unit: BingDatePickerTimeUnit, value: number) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/BingDatePicker/BingDatePickerTimePanel.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,97 @@
+import { useClickFeedback as e } from "../../motion/useClickFeedback.js";
+import t from "../BingScrollbar/BingScrollbar.js";
+import { createStepOptions as n } from "./BingDatePicker.utils.js";
+import { Fragment as r, computed as i, createElementBlock as a, createElementVNode as o, createVNode as s, defineComponent as c, normalizeClass as l, normalizeStyle as u, openBlock as d, renderList as f, toDisplayString as p, unref as m, withCtx as h, withDirectives as g } from "vue";
+//#region src/components/BingDatePicker/BingDatePickerTimePanel.vue?vue&type=script&setup=true&lang.ts
+var _ = { class: "bing-date-picker__time-label" }, v = { class: "bing-date-picker__time-options" }, y = [
+	"data-time-unit",
+	"data-time-value",
+	"disabled",
+	"onClick"
+], b = { class: "bing-date-picker__time-option-surface" }, x = /* @__PURE__ */ c({
+	__name: "BingDatePickerTimePanel",
+	props: {
+		value: {},
+		compact: { type: Boolean },
+		hourStep: {},
+		minuteStep: {},
+		secondStep: {},
+		smooth: { type: [Boolean, Object] },
+		isDisabled: { type: Function }
+	},
+	emits: ["select"],
+	setup(c, { expose: x, emit: S }) {
+		let C = c, w = S, { vClickFeedback: T } = e(), E = [
+			"hour",
+			"minute",
+			"second"
+		], D = {
+			hour: "时",
+			minute: "分",
+			second: "秒"
+		}, O = {}, k = i(() => ({
+			hour: n(24, C.hourStep),
+			minute: n(60, C.minuteStep),
+			second: n(60, C.secondStep)
+		})), A = i(() => C.compact ? 224 : 244), j = i(() => ({ "--bing-date-picker-time-list-height": `${A.value}px` }));
+		function M(e, t) {
+			if (t) {
+				O[e] = t;
+				return;
+			}
+			delete O[e];
+		}
+		function N() {
+			E.forEach((e) => O[e]?.stop());
+		}
+		function P() {
+			E.forEach((e) => {
+				let t = O[e], n = t?.viewport;
+				if (!t || !n) return;
+				let r = n.querySelector(`[data-time-unit="${e}"][data-time-value="${C.value[e]()}"]`);
+				if (!r) return;
+				let i = n.getBoundingClientRect(), a = r.getBoundingClientRect(), o = n.scrollTop;
+				if (a.top < i.top) o -= i.top - a.top;
+				else if (a.bottom > i.bottom) o += a.bottom - i.bottom;
+				else return;
+				t.scrollTo(Math.max(0, o));
+			});
+		}
+		return x({
+			stop: N,
+			scrollToCurrent: P
+		}), (e, n) => (d(), a("div", {
+			class: "bing-date-picker__time-panel",
+			style: u(j.value)
+		}, [(d(), a(r, null, f(E, (e) => o("div", {
+			key: e,
+			class: "bing-date-picker__time-column"
+		}, [o("span", _, p(D[e]), 1), s(t, {
+			ref_for: !0,
+			ref: (t) => M(e, t),
+			class: "bing-date-picker__time-list",
+			height: A.value,
+			smooth: c.smooth,
+			focusable: !1,
+			always: "",
+			"aria-label": `${D[e]}选项`
+		}, {
+			default: h(() => [o("div", v, [(d(!0), a(r, null, f(k.value[e], (t) => g((d(), a("button", {
+				key: `${e}-${t}`,
+				class: l(["bing-date-picker__time-option", { "is-selected": c.value[e]() === t }]),
+				"data-time-unit": e,
+				"data-time-value": t,
+				type: "button",
+				disabled: c.isDisabled(e, t),
+				onClick: (n) => w("select", e, t)
+			}, [o("span", b, p(String(t).padStart(2, "0")), 1)], 10, y)), [[m(T)]])), 128))])]),
+			_: 2
+		}, 1032, [
+			"height",
+			"smooth",
+			"aria-label"
+		])])), 64))], 4));
+	}
+});
+//#endregion
+export { x as default };

package/dist/components/BingDeckTransition/BingDeckTransition.js

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

package/dist/components/BingDeckTransition/BingDeckTransition.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,187 @@
+import { useReducedMotion as e } from "../../motion/reducedMotion.js";
+import t from "../BingButton/BingButton.js";
+import { Fragment as n, computed as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createTextVNode as s, createVNode as c, defineComponent as l, nextTick as u, normalizeClass as d, onBeforeUnmount as f, onBeforeUpdate as p, onMounted as m, openBlock as h, ref as g, renderList as _, renderSlot as v, toDisplayString as y, watch as b, withCtx as x } from "vue";
+import { gsap as S } from "gsap";
+//#region src/components/BingDeckTransition/BingDeckTransition.vue?vue&type=script&setup=true&lang.ts
+var C = { class: "bing-deck-transition__stage" }, w = ["aria-hidden"], T = /* @__PURE__ */ l({
+	__name: "BingDeckTransition",
+	props: {
+		modelValue: { default: void 0 },
+		items: { default: () => [] },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		respectReducedMotion: {
+			type: Boolean,
+			default: !0
+		},
+		loop: {
+			type: Boolean,
+			default: !0
+		},
+		showControls: {
+			type: Boolean,
+			default: !0
+		},
+		controlLabel: { default: "切换下一张" }
+	},
+	emits: ["update:modelValue", "change"],
+	setup(l, { emit: T }) {
+		let E = e(), D = l, O = T, k = g([]), A = g(!1), j = g(void 0), M, N, P = r(() => D.items.filter((e) => !e.disabled)), F = r(() => P.value[0]), I = r(() => D.modelValue !== void 0), L = r(() => I.value ? D.modelValue : j.value ?? F.value?.value), R = r(() => {
+			let e = D.items.findIndex((e) => Object.is(e.value, L.value));
+			return e >= 0 ? e : 0;
+		}), z = r(() => D.items[R.value]);
+		function B() {
+			return D.disabled || D.respectReducedMotion && E();
+		}
+		function V(e) {
+			let t = D.items.length;
+			return t === 0 ? 0 : D.loop ? (e + t) % t : Math.min(Math.max(e, 0), t - 1);
+		}
+		function H(e, t = R.value) {
+			return V(e - t);
+		}
+		function U(e, t = R.value) {
+			let n = H(e, t);
+			return {
+				x: 0,
+				xPercent: n * 7,
+				y: n * 36,
+				rotation: n === 0 ? 0 : n * 9 - 5,
+				scale: 1 - n * .09,
+				opacity: 1 - n * .16,
+				zIndex: 10 - n,
+				force3D: !0
+			};
+		}
+		function W(e, t) {
+			e instanceof HTMLElement && (k.value[t] = e);
+		}
+		function G(e) {
+			let t = D.items[e];
+			if (!t || D.disabled || t.disabled || Object.is(t.value, L.value)) return !1;
+			let n = L.value, r = D.items.find((e) => Object.is(e.value, n));
+			return N = t.value, I.value || (j.value = t.value), O("update:modelValue", t.value), O("change", {
+				value: t.value,
+				previousValue: n,
+				item: t,
+				previousItem: r
+			}), !0;
+		}
+		function K(e = R.value, t = !1) {
+			let n = t || B() ? 0 : .58;
+			M?.kill(), M = S.timeline({
+				defaults: {
+					duration: n,
+					ease: "power3.out",
+					overwrite: "auto"
+				},
+				onStart: () => {
+					A.value = !0;
+				},
+				onComplete: () => {
+					A.value = !1, M = void 0;
+				},
+				onInterrupt: () => {
+					A.value = !1;
+				}
+			}), k.value.forEach((t, n) => {
+				M?.to(t, U(n, e), 0);
+			});
+		}
+		function q() {
+			if (D.disabled || A.value || D.items.length === 0) return;
+			let e = R.value, t = V(R.value + 1);
+			if (!G(t)) return;
+			if (B()) {
+				K(t, !0);
+				return;
+			}
+			M?.kill(), M = S.timeline({
+				defaults: { overwrite: "auto" },
+				onStart: () => {
+					A.value = !0;
+				},
+				onComplete: () => {
+					A.value = !1, M = void 0;
+				},
+				onInterrupt: () => {
+					A.value = !1;
+				}
+			});
+			let n = k.value[e];
+			n && M.to(n, {
+				x: -260,
+				y: 82,
+				rotation: -24,
+				scale: .82,
+				opacity: .18,
+				duration: .24,
+				ease: "power2.in",
+				force3D: !0
+			}, 0), k.value.forEach((e, n) => {
+				M?.to(e, {
+					...U(n, t),
+					duration: .46,
+					ease: "power3.out"
+				}, .24);
+			});
+		}
+		function J(e) {
+			e.defaultPrevented || D.disabled || Math.abs(e.deltaX) <= Math.abs(e.deltaY) || (e.preventDefault(), Math.abs(e.deltaX) > 24 && q());
+		}
+		return p(() => {
+			k.value = [];
+		}), m(() => {
+			u().then(() => {
+				K(R.value, !0);
+			});
+		}), f(() => {
+			M?.kill(), S.killTweensOf(k.value);
+		}), b(L, (e) => {
+			if (e === void 0) return;
+			if (Object.is(e, N)) {
+				N = void 0;
+				return;
+			}
+			let t = D.items.findIndex((t) => Object.is(t.value, e));
+			t < 0 || u().then(() => {
+				K(t, !0);
+			});
+		}), (e, r) => (h(), a("section", {
+			class: d(["bing-deck-transition", { "is-disabled": l.disabled }]),
+			onWheel: J
+		}, [o("div", C, [(h(!0), a(n, null, _(l.items, (t, n) => (h(), a("article", {
+			key: String(t.value),
+			ref_for: !0,
+			ref: (e) => W(e, n),
+			class: d(["bing-deck-transition__card", { "is-active": Object.is(L.value, t.value) }]),
+			"aria-hidden": !Object.is(L.value, t.value)
+		}, [v(e.$slots, "default", {
+			item: t,
+			index: n,
+			active: Object.is(L.value, t.value),
+			isAnimating: A.value
+		}, () => [s(y(t.label), 1)], !0)], 10, w))), 128))]), l.showControls ? v(e.$slots, "controls", {
+			key: 0,
+			next: q,
+			activeItem: z.value,
+			activeIndex: R.value,
+			isAnimating: A.value
+		}, () => [c(t, {
+			class: "bing-deck-transition__button",
+			variant: "primary",
+			size: "sm",
+			"text-effect": "none",
+			disabled: l.disabled,
+			throttle: !1,
+			onClick: q
+		}, {
+			default: x(() => [s(y(l.controlLabel), 1)]),
+			_: 1
+		}, 8, ["disabled"])], !0) : i("", !0)], 34));
+	}
+});
+//#endregion
+export { T as default };

package/dist/components/BingDialog/BingDialog.js

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

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

@@ -17,21 +17,20 @@ type __VLS_Slots = {} & {
     footer?: (props: typeof __VLS_40) => any;
 };
 declare const __VLS_base: import('vue').DefineComponent<BingDialogProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    cancel: () => any;
     close: (reason: BingDialogCloseReason) => any;
-    "update:modelValue": (value: boolean) => any;
     confirm: () => any;
+    cancel: () => any;
+    "update:modelValue": (value: boolean) => any;
 }, string, import('vue').PublicProps, Readonly<BingDialogProps> & Readonly<{
-    onCancel?: (() => any) | undefined;
     onClose?: ((reason: BingDialogCloseReason) => any) | undefined;
-    "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
     onConfirm?: (() => any) | undefined;
+    onCancel?: (() => any) | undefined;
+    "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
 }>, {
     height: string | number;
     maxHeight: string | number;
     maxWidth: string | number;
     width: string | number;
-    zIndex: number;
     title: string;
     ariaLabel: string;
     modelValue: boolean;