veload 0.0.0-stage → 0.1.0

package/dist/index.js

@@ -0,0 +1,851 @@
+import { Fragment as e, computed as t, createBlock as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, createVNode as o, defineComponent as s, getCurrentScope as c, guardReactiveProps as l, h as u, mergeProps as d, normalizeClass as f, normalizeProps as p, normalizeStyle as m, onScopeDispose as h, openBlock as g, readonly as _, ref as v, renderList as y, renderSlot as b, toDisplayString as x } from "vue";
+//#region src/components/VSpinner/index.vue?vue&type=script&setup=true&lang.ts
+var S = /*@__PURE__*/ s({
+	__name: "index",
+	props: {
+		size: { default: 24 },
+		color: { default: "currentColor" },
+		label: { default: "Loading" },
+		decorative: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	setup(e) {
+		let n = e, r = t(() => Number.isFinite(n.size) ? Math.max(0, n.size) : 24), o = t(() => {
+			let e = typeof n.color == "string" ? n.color.trim() : "";
+			return e.length > 0 ? e : "currentColor";
+		}), s = t(() => typeof n.label == "string" ? n.label.trim() : ""), c = t(() => n.decorative || s.value.length === 0), l = t(() => c.value ? { "aria-hidden": "true" } : {
+			role: "status",
+			"aria-label": s.value
+		});
+		return (e, t) => (g(), i("span", d({ class: "v-spinner" }, l.value), [a("span", {
+			class: "v-spinner__indicator",
+			"aria-hidden": "true",
+			style: m({
+				width: `${r.value}px`,
+				height: `${r.value}px`,
+				borderTopColor: o.value
+			})
+		}, null, 4)], 16));
+	}
+}), C = (e, t) => {
+	let n = e.__vccOpts || e;
+	for (let [e, r] of t) n[e] = r;
+	return n;
+}, w = /*#__PURE__*/ C(S, [["__scopeId", "data-v-fc2fa43e"]]);
+//#endregion
+//#region src/utils/css.ts
+function T(e, t) {
+	if (typeof e == "number") return Number.isFinite(e) ? `${Math.max(0, e)}px` : t;
+	if (typeof e == "string") {
+		let n = e.trim();
+		return n.length > 0 ? n : t;
+	}
+	return t;
+}
+//#endregion
+//#region src/components/VSkeleton/index.vue
+var E = /*#__PURE__*/ C(/* @__PURE__ */ s({
+	__name: "index",
+	props: {
+		variant: { default: "text" },
+		width: {},
+		height: {},
+		borderRadius: {},
+		animated: {
+			type: Boolean,
+			default: !0
+		},
+		label: {}
+	},
+	setup(e) {
+		let n = e, r = t(() => {
+			let e = n.variant;
+			return e === "rect" || e === "circle" ? e : "text";
+		}), a = t(() => T(n.width, r.value === "circle" ? "40px" : "100%")), o = t(() => {
+			if (n.height !== void 0) return T(n.height, r.value === "text" ? "1em" : "6rem");
+			if (r.value !== "circle") return r.value === "text" ? "1em" : "6rem";
+		}), s = t(() => {
+			if (n.borderRadius === void 0) return;
+			if (typeof n.borderRadius == "number") return Number.isFinite(n.borderRadius) ? `${Math.max(0, n.borderRadius)}px` : void 0;
+			let e = n.borderRadius.trim();
+			return e.length > 0 ? e : void 0;
+		}), c = t(() => ({
+			width: a.value,
+			height: o.value,
+			borderRadius: s.value,
+			aspectRatio: r.value === "circle" && n.height === void 0 ? "1 / 1" : void 0
+		})), l = t(() => typeof n.label == "string" ? n.label.trim() : ""), u = t(() => l.value.length > 0 ? {
+			role: "status",
+			"aria-label": l.value,
+			"aria-busy": "true"
+		} : { "aria-hidden": "true" });
+		return (t, n) => (g(), i("span", d({
+			class: ["v-skeleton", [`v-skeleton--${r.value}`, { "v-skeleton--animated": e.animated }]],
+			style: c.value
+		}, u.value), null, 16));
+	}
+}), [["__scopeId", "data-v-0ae45ca2"]]), D = [
+	"aria-label",
+	"aria-valuemin",
+	"aria-valuemax",
+	"aria-valuenow",
+	"aria-valuetext"
+], O = /*#__PURE__*/ C(/* @__PURE__ */ s({
+	__name: "index",
+	props: {
+		value: { default: null },
+		min: { default: 0 },
+		max: { default: 100 },
+		label: { default: "Progress" },
+		valueText: {},
+		height: { default: 8 },
+		color: {},
+		trackColor: {}
+	},
+	setup(e) {
+		let n = e;
+		function r(e) {
+			if (typeof e != "string") return;
+			let t = e.trim();
+			return t.length > 0 ? t : void 0;
+		}
+		let o = t(() => Number.isFinite(n.min) && Number.isFinite(n.max) && n.max > n.min), s = t(() => o.value ? n.min : 0), c = t(() => o.value ? n.max : 100), l = t(() => typeof n.value == "number" && Number.isFinite(n.value) && o.value), u = t(() => !l.value || typeof n.value != "number" ? s.value : Math.min(c.value, Math.max(s.value, n.value))), d = t(() => {
+			if (!l.value) return 0;
+			let e = c.value - s.value;
+			return (u.value - s.value) / e * 100;
+		}), p = t(() => typeof n.label == "string" ? n.label.trim() : ""), h = t(() => {
+			if (!l.value) return;
+			let e = typeof n.valueText == "string" ? n.valueText.trim() : "";
+			return e.length > 0 ? e : void 0;
+		}), _ = t(() => ({
+			height: T(n.height, "8px"),
+			backgroundColor: r(n.trackColor)
+		})), v = t(() => ({
+			width: l.value ? `${d.value}%` : void 0,
+			backgroundColor: r(n.color)
+		}));
+		return (e, t) => (g(), i("div", {
+			class: f(["v-progress", {
+				"v-progress--indeterminate": !l.value,
+				"v-progress--determinate": l.value
+			}]),
+			role: "progressbar",
+			"aria-label": p.value.length > 0 ? p.value : void 0,
+			"aria-valuemin": l.value ? s.value : void 0,
+			"aria-valuemax": l.value ? c.value : void 0,
+			"aria-valuenow": l.value ? u.value : void 0,
+			"aria-valuetext": h.value,
+			style: m(_.value)
+		}, [a("div", {
+			class: "v-progress__bar",
+			"aria-hidden": "true",
+			style: m(v.value)
+		}, null, 4)], 14, D));
+	}
+}), [["__scopeId", "data-v-86aeb0f3"]]), ee = ["aria-busy"], te = ["inert"], ne = {
+	key: 0,
+	class: "v-loading__label"
+}, re = /*#__PURE__*/ C(/* @__PURE__ */ s({
+	__name: "index",
+	props: {
+		loading: {
+			type: Boolean,
+			default: !1
+		},
+		label: { default: "Loading" },
+		inertContent: {
+			type: Boolean,
+			default: !0
+		},
+		indicatorSize: { default: 28 }
+	},
+	setup(e) {
+		let n = e, s = t(() => typeof n.label == "string" ? n.label.trim() : ""), c = t(() => Number.isFinite(n.indicatorSize) ? Math.max(0, n.indicatorSize) : 28), l = t(() => n.loading && n.inertContent), u = t(() => s.value.length > 0 ? { role: "status" } : { "aria-hidden": "true" });
+		return (t, n) => (g(), i("div", {
+			class: f(["v-loading", {
+				"v-loading--active": e.loading,
+				"v-loading--blocking": l.value
+			}]),
+			"aria-busy": e.loading ? "true" : void 0
+		}, [a("div", {
+			class: "v-loading__content",
+			inert: l.value || void 0
+		}, [b(t.$slots, "default", {}, void 0, !0)], 8, te), e.loading ? (g(), i("div", d({
+			key: 0,
+			class: "v-loading__overlay"
+		}, u.value), [b(t.$slots, "indicator", {}, () => [o(w, {
+			size: c.value,
+			decorative: ""
+		}, null, 8, ["size"])], !0), s.value.length > 0 ? (g(), i("span", ne, x(s.value), 1)) : r("", !0)], 16)) : r("", !0)], 10, ee));
+	}
+}), [["__scopeId", "data-v-ac332306"]]), ie = [
+	"type",
+	"disabled",
+	"aria-busy"
+], ae = {
+	key: 0,
+	class: "v-loading-button__indicator",
+	"aria-hidden": "true"
+}, k = /*#__PURE__*/ C(/* @__PURE__ */ s({
+	__name: "index",
+	props: {
+		loading: {
+			type: Boolean,
+			default: !1
+		},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		type: { default: "button" },
+		indicatorSize: { default: 16 }
+	},
+	setup(e) {
+		let n = e, s = t(() => n.disabled || n.loading), c = t(() => {
+			let e = n.type;
+			return e === "submit" || e === "reset" ? e : "button";
+		}), l = t(() => Number.isFinite(n.indicatorSize) ? Math.max(0, n.indicatorSize) : 16);
+		return (t, n) => (g(), i("button", {
+			class: f(["v-loading-button", { "v-loading-button--loading": e.loading }]),
+			type: c.value,
+			disabled: s.value,
+			"aria-busy": e.loading ? "true" : void 0
+		}, [a("span", { class: f(["v-loading-button__content", { "v-loading-button__content--hidden": e.loading }]) }, [b(t.$slots, "default", {}, void 0, !0)], 2), e.loading ? (g(), i("span", ae, [b(t.$slots, "indicator", {}, () => [o(w, {
+			size: l.value,
+			decorative: ""
+		}, null, 8, ["size"])], !0)])) : r("", !0)], 10, ie));
+	}
+}), [["__scopeId", "data-v-323480f1"]]), A = /* @__PURE__ */ "bars.blob.bounce.breathing.card-flip.dot-sweep.dots.dual-arc.element.equalizer.fallback.flow.gradient-ring.grid.hashtag.heatmap.liquid.logo-spin.morph.orbit-dots.orbit.plane.progress-ring.pulse.ring.ripple.rotate.signal.sliding-bars.snake.spin-dots.spin.squares.stair.typing.wave".split("."), j = {
+	class: "v-loader__visual",
+	"aria-hidden": "true"
+}, M = {
+	key: 0,
+	class: "v-loader__value"
+}, N = /*#__PURE__*/ C(/* @__PURE__ */ s({
+	__name: "index",
+	props: {
+		variant: { default: "spin" },
+		color: { default: "currentColor" },
+		size: { default: 40 },
+		duration: { default: 1e3 },
+		label: { default: "Loading" },
+		decorative: {
+			type: Boolean,
+			default: !1
+		},
+		count: {},
+		value: { default: null }
+	},
+	setup(n) {
+		let o = n, s = {
+			breathing: 2,
+			"dual-arc": 2
+		}, c = {
+			grid: 4,
+			heatmap: 9,
+			squares: 9
+		};
+		function l(e, t = "") {
+			return typeof e == "string" && e.trim().length > 0 ? e.trim() : t;
+		}
+		function u(e, t, n, r) {
+			if (typeof e != "number" || !Number.isFinite(e)) return t;
+			let i = Math.max(n, e);
+			return r === void 0 ? i : Math.min(r, i);
+		}
+		let f = t(() => {
+			let e = typeof o.variant == "string" ? o.variant : "";
+			return A.find((t) => t === e) ?? "spin";
+		}), p = t(() => u(o.size, 40, 12)), h = t(() => u(o.duration, 1e3, 100)), _ = t(() => s[f.value] ?? Math.round(u(o.count, c[f.value] ?? 4, 1, 12))), v = t(() => l(o.color, "currentColor")), b = t(() => l(o.label)), S = t(() => !!o.decorative || b.value.length === 0), C = t(() => typeof o.value == "number" && Number.isFinite(o.value) ? Math.min(100, Math.max(0, o.value)) : null), w = t(() => S.value ? { "aria-hidden": "true" } : {
+			role: "status",
+			"aria-label": b.value
+		}), T = t(() => ({
+			"--vl-size": `${p.value}px`,
+			"--vl-color": v.value,
+			"--vl-duration": `${h.value}ms`,
+			"--vl-value": `${C.value ?? 72}%`,
+			"--vl-total": String(_.value)
+		})), E = t(() => Array.from({ length: _.value }));
+		return (t, n) => (g(), i("span", d({
+			class: ["v-loader", `v-loader--${f.value}`],
+			style: T.value
+		}, w.value), [a("span", j, [(g(!0), i(e, null, y(E.value, (e, t) => (g(), i("span", {
+			key: t,
+			class: "v-loader__mark",
+			style: m({ "--vl-index": t })
+		}, null, 4))), 128)), f.value === "progress-ring" && C.value !== null ? (g(), i("span", M, x(Math.round(C.value)) + "%", 1)) : r("", !0)])], 16));
+	}
+}), [["__scopeId", "data-v-f38f76f8"]]);
+//#endregion
+//#region src/components/VLoader/loaders.ts
+function P(e, t) {
+	return s({
+		name: e,
+		inheritAttrs: !1,
+		setup(e, { attrs: n, slots: r }) {
+			return () => u(N, {
+				...n,
+				variant: t
+			}, r);
+		}
+	});
+}
+var F = /*#__PURE__*/ P("VBarsLoader", "bars"), I = /*#__PURE__*/ P("VBlobLoader", "blob"), L = /*#__PURE__*/ P("VBounceLoader", "bounce"), R = /*#__PURE__*/ P("VBreathingLoader", "breathing"), z = /*#__PURE__*/ P("VCardFlipLoader", "card-flip"), B = /*#__PURE__*/ P("VDotSweepLoader", "dot-sweep"), V = /*#__PURE__*/ P("VDotsLoader", "dots"), H = /*#__PURE__*/ P("VDualArcLoader", "dual-arc"), U = /*#__PURE__*/ P("VElementLoader", "element"), W = /*#__PURE__*/ P("VEqualizerLoader", "equalizer"), G = /*#__PURE__*/ P("VFallbackLoader", "fallback"), K = /*#__PURE__*/ P("VFlowLoader", "flow"), q = /*#__PURE__*/ P("VGradientRingLoader", "gradient-ring"), J = /*#__PURE__*/ P("VGridLoader", "grid"), oe = /*#__PURE__*/ P("VHashtagLoader", "hashtag"), se = /*#__PURE__*/ P("VHeatmapLoader", "heatmap"), ce = /*#__PURE__*/ P("VLiquidLoader", "liquid"), le = /*#__PURE__*/ P("VLogoSpinLoader", "logo-spin"), ue = /*#__PURE__*/ P("VMorphLoader", "morph"), de = /*#__PURE__*/ P("VOrbitDotsLoader", "orbit-dots"), fe = /*#__PURE__*/ P("VOrbitLoader", "orbit"), pe = /*#__PURE__*/ P("VPlaneLoader", "plane"), me = /*#__PURE__*/ P("VProgressRingLoader", "progress-ring"), he = /*#__PURE__*/ P("VPulseLoader", "pulse"), ge = /*#__PURE__*/ P("VRingLoader", "ring"), _e = /*#__PURE__*/ P("VRippleLoader", "ripple"), ve = /*#__PURE__*/ P("VRotateLoader", "rotate"), ye = /*#__PURE__*/ P("VSignalLoader", "signal"), be = /*#__PURE__*/ P("VSlidingBarsLoader", "sliding-bars"), xe = /*#__PURE__*/ P("VSnakeLoader", "snake"), Se = /*#__PURE__*/ P("VSpinDotsLoader", "spin-dots"), Ce = /*#__PURE__*/ P("VSpinLoader", "spin"), we = /*#__PURE__*/ P("VSquaresLoader", "squares"), Te = /*#__PURE__*/ P("VStairLoader", "stair"), Ee = /*#__PURE__*/ P("VTypingLoader", "typing"), De = /*#__PURE__*/ P("VWaveLoader", "wave"), Oe = { class: "v-pattern-skeleton__body" }, ke = {
+	key: 1,
+	class: "v-pattern-skeleton__stats"
+}, Ae = { class: "v-pattern-skeleton__body" }, je = { class: "v-pattern-skeleton__body" }, Me = {
+	key: 1,
+	class: "v-pattern-skeleton__inline"
+}, Ne = {
+	key: 0,
+	class: "v-pattern-skeleton__stats"
+}, Pe = { class: "v-pattern-skeleton__body" }, Y = /*#__PURE__*/ C(/* @__PURE__ */ s({
+	__name: "index",
+	props: {
+		pattern: { default: "lines" },
+		rows: { default: 3 },
+		columns: { default: 3 },
+		mediaHeight: {},
+		avatarSize: {},
+		showMedia: {
+			type: Boolean,
+			default: !0
+		},
+		showAvatar: {
+			type: Boolean,
+			default: !0
+		},
+		showHeader: {
+			type: Boolean,
+			default: !0
+		},
+		showChart: {
+			type: Boolean,
+			default: !0
+		},
+		showStats: {
+			type: Boolean,
+			default: !0
+		},
+		showSubmit: {
+			type: Boolean,
+			default: !0
+		},
+		showRating: {
+			type: Boolean,
+			default: !0
+		},
+		showPrice: {
+			type: Boolean,
+			default: !0
+		},
+		showCta: {
+			type: Boolean,
+			default: !0
+		},
+		color: {},
+		highlightColor: {},
+		animated: {
+			type: Boolean,
+			default: !0
+		},
+		label: {}
+	},
+	setup(s) {
+		let c = s, l = [
+			"lines",
+			"article",
+			"card",
+			"profile",
+			"list",
+			"table",
+			"media",
+			"form",
+			"dashboard",
+			"feed",
+			"product"
+		];
+		function u(e, t, n = 12) {
+			return typeof e == "number" && Number.isFinite(e) ? Math.min(n, Math.max(1, Math.round(e))) : t;
+		}
+		function f(e) {
+			return typeof e == "string" && e.trim() ? e.trim() : void 0;
+		}
+		let p = t(() => l.includes(c.pattern) ? c.pattern : "lines"), h = t(() => u(c.rows, 3)), _ = t(() => u(c.columns, 3, 6)), v = t(() => u(c.avatarSize, 48, 160)), b = t(() => f(c.label) ?? ""), x = t(() => b.value ? {
+			role: "status",
+			"aria-label": b.value,
+			"aria-busy": "true"
+		} : { "aria-hidden": "true" }), S = t(() => ({
+			"--v-skeleton-base-color": f(c.color),
+			"--v-skeleton-highlight-color": f(c.highlightColor)
+		})), C = t(() => ({ gridTemplateColumns: `repeat(${_.value}, minmax(0, 1fr))` }));
+		return (t, c) => (g(), i("div", d({
+			class: ["v-pattern-skeleton", `v-pattern-skeleton--${p.value}`],
+			style: S.value
+		}, x.value), [p.value === "profile" ? (g(), i(e, { key: 0 }, [
+			s.showAvatar ? (g(), n(E, {
+				key: 0,
+				variant: "circle",
+				animated: s.animated,
+				width: v.value
+			}, null, 8, ["animated", "width"])) : r("", !0),
+			a("div", Oe, [
+				o(E, {
+					animated: s.animated,
+					width: "42%",
+					height: "1rem"
+				}, null, 8, ["animated"]),
+				o(E, {
+					animated: s.animated,
+					width: "64%",
+					height: ".75rem"
+				}, null, 8, ["animated"]),
+				(g(!0), i(e, null, y(h.value, (e) => (g(), n(E, {
+					key: e,
+					animated: s.animated,
+					width: e === h.value ? "62%" : "100%",
+					height: ".7rem"
+				}, null, 8, ["animated", "width"]))), 128))
+			]),
+			s.showStats ? (g(), i("div", ke, [(g(), i(e, null, y(3, (e) => o(E, {
+				key: e,
+				variant: "rect",
+				animated: s.animated,
+				height: "2.5rem"
+			}, null, 8, ["animated"])), 64))])) : r("", !0)
+		], 64)) : p.value === "feed" ? (g(!0), i(e, { key: 1 }, y(h.value, (e) => (g(), i("div", {
+			key: e,
+			class: "v-pattern-skeleton__feed-item"
+		}, [s.showAvatar ? (g(), n(E, {
+			key: 0,
+			variant: "circle",
+			animated: s.animated,
+			width: v.value
+		}, null, 8, ["animated", "width"])) : r("", !0), a("div", Ae, [
+			o(E, {
+				animated: s.animated,
+				width: "40%",
+				height: ".85rem"
+			}, null, 8, ["animated"]),
+			o(E, {
+				animated: s.animated,
+				width: "100%",
+				height: ".75rem"
+			}, null, 8, ["animated"]),
+			o(E, {
+				animated: s.animated,
+				width: "72%",
+				height: ".75rem"
+			}, null, 8, ["animated"])
+		])]))), 128)) : p.value === "media" ? (g(), i(e, { key: 2 }, [o(E, {
+			variant: "rect",
+			animated: s.animated,
+			width: s.mediaHeight ? s.mediaHeight : "7.5rem",
+			height: "5.5rem"
+		}, null, 8, ["animated", "width"]), a("div", je, [
+			o(E, {
+				animated: s.animated,
+				width: "36%",
+				height: ".7rem"
+			}, null, 8, ["animated"]),
+			o(E, {
+				animated: s.animated,
+				width: "100%",
+				height: "1rem"
+			}, null, 8, ["animated"]),
+			(g(!0), i(e, null, y(h.value, (e) => (g(), n(E, {
+				key: e,
+				animated: s.animated,
+				width: e === h.value ? "62%" : "86%",
+				height: ".7rem"
+			}, null, 8, ["animated", "width"]))), 128))
+		])], 64)) : p.value === "product" ? (g(), i(e, { key: 3 }, [
+			o(E, {
+				variant: "rect",
+				animated: s.animated,
+				width: "100%",
+				height: s.mediaHeight ?? "10rem"
+			}, null, 8, ["animated", "height"]),
+			o(E, {
+				animated: s.animated,
+				width: "74%",
+				height: "1rem"
+			}, null, 8, ["animated"]),
+			s.showRating ? (g(), n(E, {
+				key: 0,
+				variant: "rect",
+				animated: s.animated,
+				width: "4.5rem",
+				height: "1.25rem"
+			}, null, 8, ["animated"])) : r("", !0),
+			s.showPrice ? (g(), n(E, {
+				key: 1,
+				animated: s.animated,
+				width: "35%",
+				height: "1.15rem"
+			}, null, 8, ["animated"])) : r("", !0),
+			s.showCta ? (g(), n(E, {
+				key: 2,
+				variant: "rect",
+				animated: s.animated,
+				width: "46%",
+				height: "2.25rem"
+			}, null, 8, ["animated"])) : r("", !0)
+		], 64)) : p.value === "card" ? (g(), i(e, { key: 4 }, [
+			s.showMedia ? (g(), n(E, {
+				key: 0,
+				variant: "rect",
+				animated: s.animated,
+				width: "100%",
+				height: s.mediaHeight ?? "6rem"
+			}, null, 8, ["animated", "height"])) : r("", !0),
+			s.showAvatar ? (g(), i("div", Me, [o(E, {
+				variant: "circle",
+				animated: s.animated,
+				width: v.value
+			}, null, 8, ["animated", "width"]), o(E, {
+				animated: s.animated,
+				width: "45%",
+				height: ".8rem"
+			}, null, 8, ["animated"])])) : r("", !0),
+			(g(!0), i(e, null, y(h.value, (e) => (g(), n(E, {
+				key: e,
+				animated: s.animated,
+				width: e === h.value ? "72%" : "100%",
+				height: ".75rem"
+			}, null, 8, ["animated", "width"]))), 128))
+		], 64)) : p.value === "table" ? (g(), i(e, { key: 5 }, [s.showHeader ? (g(), i("div", {
+			key: 0,
+			class: "v-pattern-skeleton__table-row v-pattern-skeleton__table-header",
+			style: m(C.value)
+		}, [(g(!0), i(e, null, y(_.value, (e) => (g(), n(E, {
+			key: e,
+			animated: s.animated,
+			height: ".9rem"
+		}, null, 8, ["animated"]))), 128))], 4)) : r("", !0), (g(!0), i(e, null, y(h.value, (t) => (g(), i("div", {
+			key: t,
+			class: "v-pattern-skeleton__table-row v-pattern-skeleton__data-row",
+			style: m(C.value)
+		}, [(g(!0), i(e, null, y(_.value, (e) => (g(), n(E, {
+			key: e,
+			animated: s.animated,
+			height: ".75rem"
+		}, null, 8, ["animated"]))), 128))], 4))), 128))], 64)) : p.value === "dashboard" ? (g(), i(e, { key: 6 }, [
+			s.showStats ? (g(), i("div", Ne, [(g(!0), i(e, null, y(_.value, (e) => (g(), n(E, {
+				key: e,
+				variant: "rect",
+				animated: s.animated,
+				height: "4.5rem"
+			}, null, 8, ["animated"]))), 128))])) : r("", !0),
+			s.showChart ? (g(), n(E, {
+				key: 1,
+				variant: "rect",
+				animated: s.animated,
+				width: "100%",
+				height: s.mediaHeight ?? "9rem"
+			}, null, 8, ["animated", "height"])) : r("", !0),
+			a("div", {
+				class: "v-pattern-skeleton__table-row v-pattern-skeleton__table-header",
+				style: m(C.value)
+			}, [(g(!0), i(e, null, y(_.value, (e) => (g(), n(E, {
+				key: e,
+				animated: s.animated,
+				height: ".7rem"
+			}, null, 8, ["animated"]))), 128))], 4),
+			(g(!0), i(e, null, y(h.value, (t) => (g(), i("div", {
+				key: t,
+				class: "v-pattern-skeleton__table-row v-pattern-skeleton__data-row",
+				style: m(C.value)
+			}, [(g(!0), i(e, null, y(_.value, (e) => (g(), n(E, {
+				key: e,
+				animated: s.animated,
+				height: ".65rem"
+			}, null, 8, ["animated"]))), 128))], 4))), 128))
+		], 64)) : p.value === "form" ? (g(), i(e, { key: 7 }, [(g(!0), i(e, null, y(h.value, (e) => (g(), i("div", {
+			key: e,
+			class: "v-pattern-skeleton__field"
+		}, [o(E, {
+			animated: s.animated,
+			width: "30%",
+			height: ".7rem"
+		}, null, 8, ["animated"]), o(E, {
+			variant: "rect",
+			animated: s.animated,
+			width: "100%",
+			height: "2.5rem"
+		}, null, 8, ["animated"])]))), 128)), s.showSubmit ? (g(), n(E, {
+			key: 0,
+			variant: "rect",
+			animated: s.animated,
+			width: "8rem",
+			height: "2.5rem"
+		}, null, 8, ["animated"])) : r("", !0)], 64)) : p.value === "list" ? (g(!0), i(e, { key: 8 }, y(h.value, (e) => (g(), i("div", {
+			key: e,
+			class: "v-pattern-skeleton__feed-item"
+		}, [s.showAvatar ? (g(), n(E, {
+			key: 0,
+			variant: "circle",
+			animated: s.animated,
+			width: v.value
+		}, null, 8, ["animated", "width"])) : r("", !0), a("div", Pe, [o(E, {
+			animated: s.animated,
+			width: "76%",
+			height: ".85rem"
+		}, null, 8, ["animated"]), o(E, {
+			animated: s.animated,
+			width: "54%",
+			height: ".7rem"
+		}, null, 8, ["animated"])])]))), 128)) : (g(), i(e, { key: 9 }, [
+			p.value === "article" && s.showMedia ? (g(), n(E, {
+				key: 0,
+				variant: "rect",
+				animated: s.animated,
+				width: "100%",
+				height: s.mediaHeight ?? "10rem"
+			}, null, 8, ["animated", "height"])) : r("", !0),
+			p.value === "article" ? (g(), n(E, {
+				key: 1,
+				animated: s.animated,
+				width: "72%",
+				height: "1.35rem"
+			}, null, 8, ["animated"])) : r("", !0),
+			(g(!0), i(e, null, y(h.value, (e) => (g(), n(E, {
+				key: e,
+				animated: s.animated,
+				width: e === h.value ? "62%" : "100%",
+				height: ".8rem"
+			}, null, 8, ["animated", "width"]))), 128))
+		], 64))], 16));
+	}
+}), [["__scopeId", "data-v-e1a021e1"]]), Fe = /*#__PURE__*/ C(/* @__PURE__ */ s({
+	__name: "index",
+	props: {
+		label: {},
+		gap: { default: "0.75rem" },
+		decorative: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	setup(e) {
+		let n = e, r = t(() => typeof n.label == "string" ? n.label.trim() : ""), a = t(() => n.decorative ? { "aria-hidden": "true" } : r.value ? {
+			role: "status",
+			"aria-label": r.value,
+			"aria-busy": "true"
+		} : {});
+		return (t, n) => (g(), i("div", d({
+			class: "v-skeleton-group",
+			style: { gap: e.gap }
+		}, a.value), [b(t.$slots, "default", {}, void 0, !0)], 16));
+	}
+}), [["__scopeId", "data-v-6a86d8c9"]]), X = /* @__PURE__ */ s({
+	__name: "index",
+	props: {
+		loading: {
+			type: Boolean,
+			default: !0
+		},
+		pattern: { default: "lines" },
+		rows: { default: 3 },
+		columns: {},
+		mediaHeight: {},
+		avatarSize: {},
+		showMedia: {
+			type: Boolean,
+			default: !0
+		},
+		showAvatar: {
+			type: Boolean,
+			default: !0
+		},
+		showHeader: {
+			type: Boolean,
+			default: !0
+		},
+		showChart: {
+			type: Boolean,
+			default: !0
+		},
+		showStats: {
+			type: Boolean,
+			default: !0
+		},
+		showSubmit: {
+			type: Boolean,
+			default: !0
+		},
+		showRating: {
+			type: Boolean,
+			default: !0
+		},
+		showPrice: {
+			type: Boolean,
+			default: !0
+		},
+		showCta: {
+			type: Boolean,
+			default: !0
+		},
+		color: {},
+		highlightColor: {},
+		animated: {
+			type: Boolean,
+			default: !0
+		},
+		label: { default: "Loading content" }
+	},
+	setup(e) {
+		let n = e, r = t(() => ({
+			pattern: n.pattern,
+			rows: n.rows,
+			columns: n.columns,
+			color: n.color,
+			highlightColor: n.highlightColor,
+			animated: n.animated,
+			label: n.label,
+			mediaHeight: n.mediaHeight,
+			avatarSize: n.avatarSize,
+			showMedia: n.showMedia,
+			showAvatar: n.showAvatar,
+			showHeader: n.showHeader,
+			showChart: n.showChart,
+			showStats: n.showStats,
+			showSubmit: n.showSubmit,
+			showRating: n.showRating,
+			showPrice: n.showPrice,
+			showCta: n.showCta
+		}));
+		return (t, n) => e.loading ? b(t.$slots, "skeleton", {}, () => [o(Y, p(l(r.value)), null, 16)], void 0, 1) : b(t.$slots, "default", {}, void 0, void 0, 0);
+	}
+}), Ie = E;
+function Z(e, t) {
+	return s({
+		name: e,
+		inheritAttrs: !1,
+		setup(e, { attrs: n }) {
+			return () => u(Y, {
+				...n,
+				pattern: t
+			});
+		}
+	});
+}
+var Le = /*#__PURE__*/ Z("VArticleSkeleton", "article"), Re = /*#__PURE__*/ Z("VCardSkeleton", "card"), ze = /*#__PURE__*/ Z("VDashboardSkeleton", "dashboard"), Be = /*#__PURE__*/ Z("VFeedSkeleton", "feed"), Ve = /*#__PURE__*/ Z("VFormSkeleton", "form"), He = /*#__PURE__*/ Z("VListSkeleton", "list"), Q = /*#__PURE__*/ Z("VMediaCardSkeleton", "media"), Ue = /*#__PURE__*/ Z("VProductCardSkeleton", "product"), We = /*#__PURE__*/ Z("VProfileSkeleton", "profile"), Ge = /*#__PURE__*/ Z("VTableSkeleton", "table"), Ke = /*#__PURE__*/ s({
+	name: "VAutoSkeleton",
+	inheritAttrs: !1,
+	props: [
+		"loading",
+		"pattern",
+		"rows",
+		"columns",
+		"color",
+		"highlightColor",
+		"animated",
+		"label",
+		"mediaHeight",
+		"avatarSize",
+		"showMedia",
+		"showAvatar",
+		"showHeader",
+		"showChart",
+		"showStats",
+		"showSubmit",
+		"showRating",
+		"showPrice",
+		"showCta"
+	],
+	setup(e, { attrs: t, slots: n }) {
+		return () => u(X, {
+			...t,
+			...e
+		}, n);
+	}
+});
+//#endregion
+//#region src/composables/useLoading.ts
+function qe() {
+	let e = v(0), n = t(() => e.value > 0), r = _(e);
+	async function i(t) {
+		e.value++;
+		try {
+			return await t();
+		} finally {
+			e.value = Math.max(0, e.value - 1);
+		}
+	}
+	return {
+		isLoading: n,
+		pendingCount: r,
+		execute: i
+	};
+}
+//#endregion
+//#region src/composables/useDelayedLoading.ts
+var Je = 200;
+function $(e, t) {
+	return e === void 0 || !Number.isFinite(e) ? t : Math.max(0, e);
+}
+function Ye(e) {
+	let t = typeof e == "number" ? e : e?.delay, n = typeof e == "number" ? 0 : e?.minVisibleDuration, r = $(t, Je), i = $(n, 0), a = v(0), o = v(!1), s = _(o), l = _(a), u = null, d = null, f = null, p = !1;
+	function m() {
+		u !== null && (clearTimeout(u), u = null);
+	}
+	function g() {
+		d !== null && (clearTimeout(d), d = null);
+	}
+	function y() {
+		o.value = !0, f = Date.now();
+	}
+	function b() {
+		p || o.value || u !== null || a.value === 0 || (r <= 0 ? y() : u = setTimeout(() => {
+			u = null, !p && a.value > 0 && y();
+		}, r));
+	}
+	function x() {
+		if (m(), g(), !o.value) {
+			f = null;
+			return;
+		}
+		if (i <= 0 || f === null) {
+			o.value = !1, f = null;
+			return;
+		}
+		let e = i - (Date.now() - f);
+		e <= 0 ? (o.value = !1, f = null) : d = setTimeout(() => {
+			d = null, !p && a.value === 0 && (o.value = !1, f = null);
+		}, e);
+	}
+	c() && h(() => {
+		p = !0, m(), g(), o.value = !1, f = null;
+	});
+	async function S(e) {
+		a.value++, g(), b();
+		try {
+			return await e();
+		} finally {
+			a.value = Math.max(0, a.value - 1), a.value === 0 && x();
+		}
+	}
+	return {
+		isLoading: s,
+		pendingCount: l,
+		execute: S
+	};
+}
+//#endregion
+//#region src/composables/useLoadingGroup.ts
+function Xe(e) {
+	let n = typeof e == "function" ? e : () => e, r = t(() => {
+		let e = 0;
+		for (let t of n()) (typeof t == "function" ? t() : t.value) && e++;
+		return e;
+	});
+	return {
+		isLoading: t(() => r.value > 0),
+		activeCount: r
+	};
+}
+//#endregion
+export { Le as VArticleSkeleton, Ke as VAutoSkeleton, F as VBarsLoader, I as VBlobLoader, L as VBounceLoader, R as VBreathingLoader, z as VCardFlipLoader, Re as VCardSkeleton, ze as VDashboardSkeleton, B as VDotSweepLoader, V as VDotsLoader, H as VDualArcLoader, U as VElementLoader, W as VEqualizerLoader, G as VFallbackLoader, Be as VFeedSkeleton, K as VFlowLoader, Ve as VFormSkeleton, q as VGradientRingLoader, J as VGridLoader, oe as VHashtagLoader, se as VHeatmapLoader, ce as VLiquidLoader, He as VListSkeleton, N as VLoader, re as VLoading, k as VLoadingButton, le as VLogoSpinLoader, Q as VMediaCardSkeleton, ue as VMorphLoader, de as VOrbitDotsLoader, fe as VOrbitLoader, Y as VPatternSkeleton, pe as VPlaneLoader, Ue as VProductCardSkeleton, We as VProfileSkeleton, O as VProgress, me as VProgressRingLoader, he as VPulseLoader, ge as VRingLoader, _e as VRippleLoader, ve as VRotateLoader, ye as VSignalLoader, E as VSkeleton, Fe as VSkeletonGroup, Ie as VSkeletonLoader, X as VSkeletonSwitch, be as VSlidingBarsLoader, xe as VSnakeLoader, Se as VSpinDotsLoader, Ce as VSpinLoader, w as VSpinner, we as VSquaresLoader, Te as VStairLoader, Ge as VTableSkeleton, Ee as VTypingLoader, De as VWaveLoader, Ye as useDelayedLoading, qe as useLoading, Xe as useLoadingGroup };