@mkbabb/glass-ui 4.2.0 → 5.0.0

package/dist/slider-Cxuj_W_H.js

@@ -0,0 +1,151 @@
+import { t as e } from "./class-names-5jotTFzp.js";
+import { t } from "./useMotionAxis-DCCXMC-i.js";
+import { t as n } from "./_plugin-vue_export-helper-C1je1s0u.js";
+import { t as r } from "./useTouchGate-BlegwvwL.js";
+import { t as i } from "./useDragVelocity-BWcNMCux.js";
+import { i as a } from "./dockContext-d-WpJN2Z.js";
+import { Fragment as o, computed as s, createBlock as c, createElementBlock as l, createVNode as u, defineComponent as d, mergeProps as f, onBeforeUnmount as p, onMounted as m, openBlock as h, renderList as g, unref as _, useAttrs as v, useTemplateRef as y, withCtx as b } from "vue";
+import { SliderRange as x, SliderRoot as S, SliderThumb as C, SliderTrack as w, useForwardPropsEmits as T } from "reka-ui";
+import { cva as E } from "class-variance-authority";
+//#region src/components/dock/composables/useDockHold.ts
+function D(e, t = {}) {
+	let n = a(), r = t.enabled ?? (() => !0), i = !1;
+	function o() {
+		!r() || i || !n || (n.keepOpen(), i = !0);
+	}
+	function s() {
+		!i || !n || (n.release(), i = !1);
+	}
+	function c() {
+		s(), !(typeof window > "u") && (window.removeEventListener("pointerup", c), window.removeEventListener("pointercancel", c));
+	}
+	function l() {
+		o(), !(typeof window > "u") && (window.removeEventListener("pointerup", c), window.removeEventListener("pointercancel", c), window.addEventListener("pointerup", c), window.addEventListener("pointercancel", c));
+	}
+	let u = null;
+	return m(() => {
+		u = e(), u && (u.addEventListener("pointerdown", l), u.addEventListener("touchstart", l, { passive: !0 }));
+	}), p(() => {
+		u && (u.removeEventListener("pointerdown", l), u.removeEventListener("touchstart", l)), typeof window < "u" && (window.removeEventListener("pointerup", c), window.removeEventListener("pointercancel", c)), s();
+	}), { isHeld: n?.held };
+}
+//#endregion
+//#region src/components/slider/Slider.vue
+var O = /* @__PURE__ */ n(/* @__PURE__ */ d({
+	__name: "Slider",
+	props: {
+		defaultValue: {},
+		modelValue: {},
+		disabled: { type: Boolean },
+		orientation: {},
+		dir: {},
+		inverted: { type: Boolean },
+		min: {},
+		max: {},
+		step: {},
+		minStepsBetweenThumbs: {},
+		thumbAlignment: {},
+		asChild: { type: Boolean },
+		as: {},
+		name: {},
+		required: { type: Boolean },
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] },
+		variant: {},
+		size: {},
+		keepDockOpen: {
+			type: Boolean,
+			default: !0
+		},
+		motion: {}
+	},
+	emits: ["update:modelValue", "valueCommit"],
+	setup(n, { emit: d }) {
+		let E = n, O = d, A = s(() => E.variant ?? "standard"), j = s(() => E.size ?? "md"), M = s(() => E.keepDockOpen), N = T(s(() => {
+			let { class: e, variant: t, size: n, keepDockOpen: r, motion: i, ...a } = E;
+			return a.thumbAlignment ||= "contain", a;
+		}), O), P = a(), F = y("sliderRootRef");
+		function I() {
+			let e = F.value;
+			return e ? e instanceof HTMLElement ? e : e.$el ?? null : null;
+		}
+		D(I, { enabled: () => M.value });
+		let L = t(() => E.motion);
+		i({ host: () => L.armed.value ? I() : null });
+		let R = r();
+		function z(e) {
+			let t = I(), n = e.touches[0];
+			!t || !n || R.handleTouchStart(t, n.clientY) || (e.preventDefault(), e.stopPropagation());
+		}
+		function B(e) {
+			R.handleScrollCheck(e);
+		}
+		function V() {
+			R.handleTouchEnd();
+		}
+		m(() => {
+			let e = I();
+			e && (e.addEventListener("touchstart", z, { passive: !1 }), e.addEventListener("touchmove", B, { passive: !0 }), e.addEventListener("touchend", V, { passive: !0 }));
+		}), p(() => {
+			let e = I();
+			e && (e.removeEventListener("touchstart", z), e.removeEventListener("touchmove", B), e.removeEventListener("touchend", V));
+		});
+		let H = s(() => P?.held.value === !0), U = s(() => R.isActive.value);
+		return v(), m(() => {}), (t, r) => (h(), c(_(S), f({
+			"data-slot": "slider",
+			ref_key: "sliderRootRef",
+			ref: F,
+			class: _(e)(_(k)({
+				variant: A.value,
+				size: j.value
+			}), E.class),
+			"data-variant": A.value,
+			"data-size": j.value,
+			"data-held": H.value || void 0,
+			"data-touch-active": U.value || void 0,
+			"data-motion": _(L).dataMotion.value,
+			style: _(L).hostStyle.value
+		}, _(N)), {
+			default: b(() => [u(_(w), { class: "slider-track" }, {
+				default: b(() => [u(_(x), { class: "slider-range glass-liquid-fill" })]),
+				_: 1
+			}), (h(!0), l(o, null, g(n.modelValue, (e, n) => (h(), c(_(C), {
+				key: n,
+				"aria-label": t.$attrs["aria-label"] ?? void 0,
+				class: "slider-thumb glass-specular-track touch-hit-area"
+			}, null, 8, ["aria-label"]))), 128))]),
+			_: 1
+		}, 16, [
+			"class",
+			"data-variant",
+			"data-size",
+			"data-held",
+			"data-touch-active",
+			"data-motion",
+			"style"
+		]));
+	}
+}), [["__scopeId", "data-v-9b927330"]]), k = E("glass-slider focus-ring relative flex w-full touch-none select-none items-center transition-colors", {
+	variants: {
+		variant: {
+			standard: "",
+			spectrum: ""
+		},
+		size: {
+			sm: "",
+			md: "",
+			lg: ""
+		}
+	},
+	defaultVariants: {
+		variant: "standard",
+		size: "md"
+	}
+});
+//#endregion
+export { O as n, k as t };

package/dist/slider.d.ts

@@ -1 +1 @@
-export * from "./components/ui/slider";
+export * from "./components/slider";

package/dist/slider.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "./slider-CcICPe3u.js";
+import { n as e, t } from "./slider-Cxuj_W_H.js";
 export { e as Slider, t as sliderVariants };

package/dist/sortable-list.d.ts

@@ -1 +1 @@
-export * from "./components/custom/sortable-list";
+export * from "./components/sortable-list";

package/dist/sortable-list.js

@@ -1,83 +1,408 @@
-import { t as e } from "./_plugin-vue_export-helper-gLzyemvl.js";
-import { n as t } from "./createContext-Cd23P9j0.js";
-import { t as n } from "./useSortable-DQV_UNDw.js";
-import { computed as r, createBlock as i, defineComponent as a, mergeProps as o, openBlock as s, renderSlot as c, resolveDynamicComponent as l, toRef as u, unref as d, withCtx as f } from "vue";
-//#region src/components/custom/sortable-list/context.ts
-var p = t("glass-ui:sortable", "[glass-ui:sortable] <SortableItem> must be used inside <SortableList>"), m = p.KEY;
-function h(e) {
-	p.provide(e);
+import { t as e } from "./_plugin-vue_export-helper-C1je1s0u.js";
+import { n as t } from "./createContext-BQ1Gy_LB.js";
+import { Fragment as n, computed as r, createElementBlock as i, createElementVNode as a, defineComponent as o, mergeProps as s, nextTick as c, onScopeDispose as l, openBlock as u, renderSlot as d, shallowRef as f, toDisplayString as p, toRef as m, unref as h, useAttrs as g } from "vue";
+//#region src/components/sortable-list/composables/dropResolver.ts
+var _ = /* @__PURE__ */ new Set();
+function v(e, t, n, r, i) {
+	let a = i ? n : r;
+	for (let n = 0; n < t.length; n++) {
+		let r = e.get(t[n].id);
+		if (!r) continue;
+		let o = r.getBoundingClientRect();
+		if (a < (i ? o.left + o.width / 2 : o.top + o.height / 2)) return n;
+	}
+	return t.length;
+}
+function y(e, t, n) {
+	if (!e.group) return null;
+	for (let r of _) {
+		if (r === e || r.group !== e.group) continue;
+		let i = r.getContainer();
+		if (!i) continue;
+		let a = i.getBoundingClientRect();
+		if (t >= a.left && t <= a.right && n >= a.top && n <= a.bottom) return r;
+	}
+	return null;
+}
+//#endregion
+//#region src/components/sortable-list/composables/touchGate.ts
+function b(e, t) {
+	return t === null ? !0 : e instanceof Element ? e.closest(t) !== null : !1;
+}
+function x(e, t) {
+	if (e && "setPointerCapture" in e) try {
+		return e.setPointerCapture(t), !0;
+	} catch {
+		return !1;
+	}
+	return !0;
+}
+//#endregion
+//#region src/components/sortable-list/composables/transitionTiming.ts
+var S = "is-sortable-drop-above", C = "is-sortable-drop-below", w = "sortable-drag-ghost", T = "is-sortable-dragging";
+function E(e, t, n) {
+	return e < 0 ? {
+		above: !1,
+		below: !1
+	} : t === n ? {
+		above: !1,
+		below: e === n - 1
+	} : {
+		above: e === t,
+		below: !1
+	};
+}
+function D(e) {
+	let t = {
+		[S]: !1,
+		[C]: !1
+	};
+	if (e.isLocalDragging && e.localDrop !== null) {
+		let n = E(e.rowIndex, e.localDrop, e.listLength);
+		n.above && (t[S] = !0), n.below && (t[C] = !0);
+	}
+	if (e.externalDrop !== null && !e.isLocalDragging) {
+		let n = E(e.rowIndex, e.externalDrop, e.listLength);
+		n.above && (t[S] = !0), n.below && (t[C] = !0);
+	}
+	return t;
 }
-var g = p.use, _ = /* @__PURE__ */ a({
+//#endregion
+//#region src/components/sortable-list/composables/dragController.ts
+function O(e) {
+	let t = f(null), n = f(null), r = f(null), i = f(!0), a = null, o = null, s = null;
+	function c(t) {
+		return e.getItems().findIndex((n) => e.getId(n) === t);
+	}
+	function l(t) {
+		let n = e.getItems().find((n) => e.getId(n) === t);
+		return n === void 0 ? String(t) : e.getLabel(n);
+	}
+	function u(n, i) {
+		if (t.value !== null) return !1;
+		let u = c(n), d = e.elements.get(n);
+		return u < 0 || !(d instanceof HTMLElement) ? !1 : (t.value = n, a = i, o = {
+			index: u,
+			target: null
+		}, r.value = u, s = d, s.classList.add(T), e.announce(`Lifted ${l(n)}, position ${u + 1} of ${e.getItems().length}.`), !0);
+	}
+	function d(n, i, a = !1) {
+		let s = t.value;
+		if (s === null) return;
+		o?.target && o.target !== i && o.target.setExternalDropIndex(null);
+		let c = i ? i.getItems().length + 1 : e.getItems().length, u = Math.max(0, c - 1), d = Math.min(Math.max(n, 0), u);
+		o = {
+			index: d,
+			target: i
+		}, i ? (i.setExternalDropIndex(d), r.value = null) : r.value = d, a && e.announce(`${l(s)}, proposed position ${d + 1} of ${c}.`);
+	}
+	function p() {
+		o?.target?.setExternalDropIndex(null), e.ghost.destroyGhost(), s?.classList.remove(T), s = null, t.value = null, n.value = null, r.value = null, a = null, o = null, document.removeEventListener("pointermove", b), document.removeEventListener("pointerup", S), document.removeEventListener("pointercancel", C);
+	}
+	function m() {
+		let n = t.value, r = o;
+		if (n === null || r === null) return;
+		let i = e.getItems(), a = i.findIndex((t) => e.getId(t) === n);
+		if (a < 0) {
+			p();
+			return;
+		}
+		let s = i[a], c = e.getLabel(s), l = r.target, u = r.index, d = l ? l.getItems().length + 1 : i.length;
+		if (p(), l) {
+			let t = i.slice();
+			t.splice(a, 1), e.onReorder(t), l.acceptExternal(u, s), e.announce(`Moved ${c} from ${e.handle.label} to ${l.label}, position ${u + 1} of ${d}.`), l.focusItem(n);
+			return;
+		}
+		if (u !== a) {
+			let t = i.slice(), [n] = t.splice(a, 1);
+			t.splice(u, 0, n), e.onReorder(t);
+		}
+		e.announce(`Dropped ${c}, position ${u + 1} of ${i.length}.`), e.focusItem(n);
+	}
+	function h() {
+		let n = t.value;
+		if (n === null) return;
+		let r = c(n), i = l(n);
+		p(), e.announce(`Cancelled moving ${i}. Position ${r + 1} of ${e.getItems().length}.`), e.focusItem(n);
+	}
+	function g() {
+		t.value !== null && p();
+	}
+	function _(t, r) {
+		u(t, "pointer") && (n.value = {
+			x: r.clientX,
+			y: r.clientY
+		}, s && e.ghost.createGhost(s, r.clientX, r.clientY), i.value = x(r.currentTarget, r.pointerId), document.addEventListener("pointermove", b), document.addEventListener("pointerup", S), document.addEventListener("pointercancel", C));
+	}
+	function b(r) {
+		let i = t.value;
+		if (i === null || a !== "pointer") return;
+		n.value = {
+			x: r.clientX,
+			y: r.clientY
+		}, e.ghost.updateGhost(r.clientX, r.clientY);
+		let o = y(e.handle, r.clientX, r.clientY);
+		if (o) {
+			d(v(o.getElements(), o.getItems().map((e) => ({ id: o.getId(e) })), r.clientX, r.clientY, e.horizontal), o);
+			return;
+		}
+		let s = e.getItems(), l = c(i), u = v(e.elements, s.map((t) => ({ id: e.getId(t) })), r.clientX, r.clientY, e.horizontal);
+		d(u > l ? u - 1 : u, null);
+	}
+	function S() {
+		m();
+	}
+	function C() {
+		h();
+	}
+	function w(n, r) {
+		let i = r.key;
+		if (i === " " || i === "Enter") {
+			r.preventDefault(), t.value === null ? u(n, "keyboard") : t.value === n && a === "keyboard" && m();
+			return;
+		}
+		if (t.value !== n || a !== "keyboard") return;
+		if (i === "Escape") {
+			r.preventDefault(), h();
+			return;
+		}
+		let s = o?.index ?? c(n);
+		if (i === "ArrowUp" || i === "ArrowLeft") --s;
+		else if (i === "ArrowDown" || i === "ArrowRight") s += 1;
+		else if (i === "Home") s = 0;
+		else if (i === "End") s = e.getItems().length - 1;
+		else return;
+		r.preventDefault(), d(s, null, !0);
+	}
+	return {
+		dragId: t,
+		pos: n,
+		dropIndex: r,
+		pointerCaptureActive: i,
+		beginPointer: _,
+		onKeydown: w,
+		cancel: h,
+		dispose: g
+	};
+}
+//#endregion
+//#region src/components/sortable-list/composables/ghostRenderer.ts
+function k(e) {
+	return e ? e.replace(/\//g, " ").split(/\s+/).filter(Boolean).some((e) => parseFloat(e) !== 0) : !1;
+}
+function A(e) {
+	let t = getComputedStyle(e).borderRadius;
+	if (k(t)) return t;
+	for (let t of e.querySelectorAll("*")) {
+		let e = getComputedStyle(t).borderRadius;
+		if (k(e)) return e;
+	}
+	return null;
+}
+function j() {
+	let e = null, t = 0, n = 0;
+	function r(r, i, a) {
+		let o = r.getBoundingClientRect();
+		t = i - o.left, n = a - o.top;
+		let s = r.cloneNode(!0);
+		s.classList.add(w);
+		let c = A(r);
+		c && (s.style.borderRadius = c), s.style.position = "fixed", s.style.left = `${o.left}px`, s.style.top = `${o.top}px`, s.style.width = `${o.width}px`, s.style.height = `${o.height}px`, s.style.margin = "0", s.style.pointerEvents = "none", s.style.zIndex = "9999", s.id && s.removeAttribute("id");
+		for (let e of s.querySelectorAll("[id]")) e.removeAttribute("id");
+		document.body.appendChild(s), e = s;
+	}
+	function i(r, i) {
+		e && (e.style.left = `${r - t}px`, e.style.top = `${i - n}px`);
+	}
+	function a() {
+		e && e.parentNode && e.parentNode.removeChild(e), e = null;
+	}
+	return {
+		createGhost: r,
+		updateGhost: i,
+		destroyGhost: a
+	};
+}
+//#endregion
+//#region src/components/sortable-list/composables/useSortable.ts
+var M = "[data-sortable-handle]";
+function N(e) {
+	let { items: t, getId: n, getLabel: i = (e) => String(n(e)), label: a = "Sortable list", onReorder: o, onInsert: s, group: u, handleSelector: d = M, axis: p = "y" } = e, m = /* @__PURE__ */ new Map(), h = /* @__PURE__ */ new Map(), g = f(null), v = f(""), y = null;
+	function x(e) {
+		return t.value.findIndex((t) => n(t) === e);
+	}
+	function S(e) {
+		let r = t.value.find((t) => n(t) === e);
+		return r === void 0 ? String(e) : i(r);
+	}
+	function C(e) {
+		c(() => {
+			m.get(e)?.querySelector("[data-sortable-handle]")?.focus();
+		});
+	}
+	let w = {
+		group: u,
+		label: a,
+		getContainer: () => y,
+		getItems: () => t.value,
+		getId: (e) => n(e),
+		getElements: () => m,
+		setExternalDropIndex: (e) => {
+			g.value = e;
+		},
+		acceptExternal: (e, t) => s?.(e, t),
+		focusItem: C
+	}, T = O({
+		getItems: () => t.value,
+		getId: (e) => n(e),
+		getLabel: (e) => i(e),
+		elements: m,
+		handle: w,
+		onReorder: (e) => o(e),
+		horizontal: p === "x",
+		ghost: j(),
+		announce: (e) => {
+			v.value = e;
+		},
+		focusItem: C
+	});
+	function E(e, n = () => !1) {
+		let i = h.get(e);
+		if (i) return i;
+		let a = r(n), o = {
+			ref: (t) => {
+				t instanceof Element ? m.set(e, t) : m.delete(e);
+			},
+			dataAttrs: { "data-sortable-id": String(e) },
+			disabled: a,
+			class: r(() => {
+				let n = T.dragId.value === null ? -1 : x(T.dragId.value), r = T.dropIndex.value, i = r === null || n < 0 ? null : r > n ? r + 1 : r;
+				return D({
+					rowIndex: x(e),
+					listLength: t.value.length,
+					localDrop: i,
+					isLocalDragging: T.dragId.value !== null,
+					externalDrop: g.value
+				});
+			}),
+			onPointerdown: (t) => {
+				a.value || t.button !== 0 || b(t.target, d) && T.beginPointer(e, t);
+			},
+			onKeydown: (t) => {
+				a.value || T.onKeydown(e, t);
+			}
+		};
+		return h.set(e, o), o;
+	}
+	let k = {
+		ref: (e) => {
+			y = e instanceof Element ? e : null;
+		},
+		dataAttrs: { "data-sortable-container": u ?? "" }
+	};
+	return _.add(w), l(() => {
+		_.delete(w), T.dispose();
+	}), {
+		registerItem: E,
+		container: k,
+		isDragging: r(() => T.dragId.value !== null),
+		dragId: r(() => T.dragId.value),
+		dragPosition: r(() => T.pos.value),
+		dropIndex: r(() => T.dropIndex.value),
+		pointerCaptureActive: r(() => T.pointerCaptureActive.value),
+		announcement: r(() => v.value),
+		getItemLabel: S
+	};
+}
+//#endregion
+//#region src/components/sortable-list/context.ts
+var P = t("glass-ui:sortable-list", "[glass-ui] <SortableItem> must be used inside <SortableList>"), F = P.provide, I = P.use, L = t("glass-ui:sortable-item", "[glass-ui] <SortableHandle> must be used inside <SortableItem>"), R = L.provide, z = L.use, B = ["aria-label"], V = {
+	class: "sr-only",
+	"aria-live": "polite",
+	"aria-atomic": "true"
+}, H = /* @__PURE__ */ o({
+	inheritAttrs: !1,
 	__name: "SortableList",
 	props: {
 		items: {},
 		getId: {},
+		getLabel: {},
+		label: { default: "Sortable list" },
 		group: {},
 		handleSelector: { default: "[data-sortable-handle]" },
-		axis: { default: "y" },
-		as: { default: "div" }
+		axis: { default: "y" }
 	},
 	emits: ["reorder", "insert"],
 	setup(e, { expose: t, emit: r }) {
-		let a = e, p = r, m = n({
-			items: u(a, "items"),
-			getId: a.getId,
-			group: a.group,
-			handleSelector: a.handleSelector,
-			axis: a.axis,
-			onReorder: (e) => p("reorder", e),
-			onInsert: (e, t) => p("insert", e, t)
+		let o = e, c = g(), l = r, f = N({
+			items: m(o, "items"),
+			getId: o.getId,
+			getLabel: o.getLabel,
+			label: o.label,
+			group: o.group,
+			handleSelector: o.handleSelector,
+			axis: o.axis,
+			onReorder: (e) => l("reorder", e),
+			onInsert: (e, t) => l("insert", e, t)
 		});
-		return h(m), t({
-			isDragging: m.isDragging,
-			dragId: m.dragId
-		}), (t, n) => (s(), i(l(e.as), o({ ref: d(m).container.ref }, d(m).container.dataAttrs), {
-			default: f(() => [c(t.$slots, "default", {
-				isDragging: d(m).isDragging.value,
-				dragId: d(m).dragId.value
-			})]),
-			_: 3
-		}, 16));
-	}
-}), v = /* @__PURE__ */ e(/* @__PURE__ */ a({
+		return F(f), t({
+			isDragging: f.isDragging,
+			dragId: f.dragId
+		}), (t, r) => (u(), i(n, null, [a("ul", s({ ref: h(f).container.ref }, {
+			...h(c),
+			...h(f).container.dataAttrs
+		}, { "aria-label": e.label }), [d(t.$slots, "default", {
+			isDragging: h(f).isDragging.value,
+			dragId: h(f).dragId.value
+		})], 16, B), a("span", V, p(h(f).announcement.value), 1)], 64));
+	}
+}), U = ["aria-disabled", "data-disabled"], W = /* @__PURE__ */ e(/* @__PURE__ */ o({
 	__name: "SortableItem",
 	props: {
 		id: {},
-		as: { default: "div" }
+		disabled: {
+			type: Boolean,
+			default: !1
+		}
 	},
 	setup(e) {
-		let t = e, n = g(), a = r(() => n.registerItem(t.id)), u = r(() => n.dragId.value === t.id);
-		return (t, n) => (s(), i(l(e.as), o({
-			ref: a.value.ref,
+		let t = e, n = I(), a = n.registerItem(t.id, () => t.disabled), o = r(() => n.getItemLabel(t.id)), c = r(() => n.dragId.value === t.id);
+		return R({
+			id: t.id,
+			label: o,
+			binding: a
+		}), (t, n) => (u(), i("li", s({
+			ref: h(a).ref,
 			class: [
 				"sortable-item",
-				a.value.class.value,
-				{ "is-sortable-dragging": u.value }
+				h(a).class.value,
+				{ "is-sortable-dragging": c.value }
 			]
-		}, a.value.dataAttrs, { onPointerdown: a.value.onPointerdown }), {
-			default: f(() => [c(t.$slots, "default", { isBeingDragged: u.value }, void 0, !0)]),
-			_: 3
-		}, 16, ["class", "onPointerdown"]));
+		}, h(a).dataAttrs, {
+			"aria-disabled": e.disabled || void 0,
+			"data-disabled": e.disabled || void 0,
+			onPointerdown: n[0] ||= (...e) => h(a).onPointerdown && h(a).onPointerdown(...e),
+			onKeydown: n[1] ||= (...e) => h(a).onKeydown && h(a).onKeydown(...e)
+		}), [d(t.$slots, "default", { isBeingDragged: c.value }, void 0, !0)], 16, U));
 	}
-}), [["__scopeId", "data-v-ca5cd3d7"]]), y = /* @__PURE__ */ e(/* @__PURE__ */ a({
+}), [["__scopeId", "data-v-c8dee7e3"]]), G = [
+	"type",
+	"disabled",
+	"aria-label"
+], K = /* @__PURE__ */ e(/* @__PURE__ */ o({
+	inheritAttrs: !1,
 	__name: "SortableHandle",
-	props: {
-		as: { default: "span" },
-		type: {}
-	},
+	props: { type: { default: "button" } },
 	setup(e) {
-		let t = e, n = r(() => t.as === "span"), a = r(() => t.as === "button" ? { type: t.type } : {});
-		return (t, r) => (s(), i(l(e.as), o({
+		let t = g(), n = z(), a = r(() => t["aria-label"] ?? `Reorder ${n.label.value}`);
+		return (r, o) => (u(), i("button", s(h(t), {
+			type: e.type,
 			class: "sortable-handle",
-			"data-sortable-handle": ""
-		}, a.value, {
-			role: n.value ? "button" : void 0,
-			tabindex: n.value ? 0 : void 0
-		}), {
-			default: f(() => [c(t.$slots, "default", {}, void 0, !0)]),
-			_: 3
-		}, 16, ["role", "tabindex"]));
-	}
-}), [["__scopeId", "data-v-814313b7"]]);
+			"data-sortable-handle": "",
+			disabled: h(n).binding.disabled.value,
+			"aria-label": a.value
+		}), [d(r.$slots, "default", {}, void 0, !0)], 16, G));
+	}
+}), [["__scopeId", "data-v-fd52a6c0"]]);
 //#endregion
-export { m as SORTABLE_CONTEXT, y as SortableHandle, v as SortableItem, _ as SortableList, h as provideSortableContext, g as useSortableContext };
+export { K as SortableHandle, W as SortableItem, H as SortableList };

package/dist/spa-view.d.ts

@@ -1 +1 @@
-export * from "./components/custom/spa-view";
+export * from "./components/spa-view";

package/dist/spa-view.js

@@ -1,6 +1,6 @@
 import { KeepAlive as e, Transition as t, computed as n, createBlock as r, createElementBlock as i, defineComponent as a, openBlock as o, renderSlot as s, resolveDynamicComponent as c, withCtx as l } from "vue";
 //#endregion
-//#region src/components/custom/spa-view/SpaView.vue
+//#region src/components/spa-view/SpaView.vue
 var u = /* @__PURE__ */ a({
 	__name: "SpaView",
 	props: {