@mkbabb/glass-ui 7.0.0 → 8.0.0

package/dist/tabs.js

@@ -1,311 +1,2 @@
-import { t as e } from "./class-names-Cpy5eaBk.js";
-import { n as t, r as n } from "./writeVelocityWeight-DoGOCW3e.js";
-import { t as r } from "./useMotionAxis-D-rtIhca.js";
-import { a as i, c as a, o, r as s, s as c } from "./select-BcBAyLXA.js";
-import { i as l, n as u, r as d, t as f } from "./tooltip-Drx5qnw_.js";
-import { t as p } from "./useDragMorph-BogSV_nv.js";
-import { a as m, r as h, t as g } from "./useTabRovingFocus-YnWh-Ytr.js";
-import { Fragment as _, computed as v, createBlock as y, createCommentVNode as ee, createElementBlock as b, createElementVNode as x, createTextVNode as S, createVNode as C, defineComponent as w, mergeModels as T, mergeProps as E, nextTick as D, normalizeClass as O, normalizeStyle as k, onBeforeUnmount as A, onBeforeUpdate as j, onMounted as M, openBlock as N, ref as P, renderList as F, renderSlot as I, toDisplayString as L, unref as R, useModel as z, watch as B, withCtx as V } from "vue";
-//#region src/components/tabs/composables/useTabDragMorph.ts
-function H(e) {
-	let { indicatorRef: r, isVertical: i, isUnderline: a, draggable: o, stripOptions: s, buttonRefs: c, model: l } = e, u = v(() => o() && !a.value);
-	function d() {
-		let e = r.value;
-		if (!e) return h;
-		let n = getComputedStyle(e).getPropertyValue("--tab-indicator-max-stretch").trim();
-		return t(e, Number(n) || 1.11);
-	}
-	function f() {
-		return s.value.map((e, t) => {
-			let n = c.value[t]?.getBoundingClientRect(), r = n ? i.value ? n.top + n.height / 2 : n.left + n.width / 2 : 0;
-			return {
-				value: e.value,
-				center: r
-			};
-		});
-	}
-	let m = p({
-		handle: r,
-		axis: () => i.value ? "y" : "x",
-		snapTargets: f,
-		maxStretch: d,
-		onSnap: (e) => {
-			l.value !== e && (l.value = e);
-		}
-	});
-	return B(() => [m.dragging.value, m.stretch.value], ([e, t]) => {
-		let i = r.value;
-		if (!(!i || !u.value)) if (e) {
-			i.style.setProperty("--stretch", String(t));
-			let e = d();
-			n(i, e > 1 ? (t - 1) / (e - 1) : 0);
-		} else i.style.removeProperty("--stretch"), n(i, 0);
-	}), B(() => [
-		r.value,
-		s.value.length,
-		i.value,
-		u.value
-	], () => {
-		u.value && r.value && D(() => m.refresh());
-	}, { immediate: !0 }), {
-		dragEnabled: u,
-		drag: m
-	};
-}
-//#endregion
-//#region src/components/tabs/composables/useTabResponsive.ts
-function U(e) {
-	let { responsive: t, options: n, model: r } = e, i = v(() => {
-		let e = t();
-		return e === !1 ? null : e === !0 ? {} : e;
-	}), a = v(() => i.value?.breakpoint ?? "640px"), o = v(() => i.value?.desktopOptions ?? n.value), s = P(!0), c = null;
-	function l(e) {
-		"currentTarget" in e && e.currentTarget && e.currentTarget !== c || (s.value = e.matches);
-	}
-	let u = v(() => {
-		if (!i.value) return r.value;
-		let e = o.value;
-		return e.some((e) => e.value === r.value) ? r.value : e.find((e) => !e.disabled)?.value;
-	}), d = v(() => i.value ? o.value : n.value), f = v(() => i.value?.ariaLabel ?? n.value.find((e) => e.value === r.value)?.label ?? "Select"), p = v(() => !!i.value && !s.value), m = !1;
-	function h() {
-		if (c?.removeEventListener("change", l), c = null, !m || !i.value || typeof window > "u" || !window.matchMedia) {
-			s.value = !0;
-			return;
-		}
-		c = window.matchMedia(`(min-width: ${a.value})`), s.value = c.matches, c.addEventListener("change", l);
-	}
-	return B([i, a], h), M(() => {
-		m = !0, h();
-	}), A(() => {
-		m = !1, c?.removeEventListener("change", l), c = null;
-	}), {
-		responsiveCfg: i,
-		breakpoint: a,
-		desktopOptions: o,
-		isDesktop: s,
-		stripValue: u,
-		stripOptions: d,
-		mobileAriaLabel: f,
-		showMobileSelect: p
-	};
-}
-//#endregion
-//#region src/components/tabs/SegmentedTabs.vue?vue&type=script&setup=true&lang.ts
-var te = [
-	"role",
-	"aria-label",
-	"aria-orientation",
-	"data-motion"
-], ne = [
-	"role",
-	"tabindex",
-	"disabled",
-	"onClick"
-], re = [
-	"role",
-	"tabindex",
-	"disabled",
-	"onClick"
-], W = /* @__PURE__ */ w({
-	__name: "SegmentedTabs",
-	props: /*@__PURE__*/ T({
-		options: {},
-		ariaLabel: {},
-		variant: { default: "pill" },
-		semantics: {},
-		activation: { default: "automatic" },
-		orientation: { default: "horizontal" },
-		responsive: {
-			type: [Boolean, Object],
-			default: !1
-		},
-		motion: {},
-		class: { type: [
-			Boolean,
-			null,
-			String,
-			Object,
-			Array
-		] }
-	}, {
-		modelValue: { required: !0 },
-		modelModifiers: {}
-	}),
-	emits: ["update:modelValue"],
-	setup(t) {
-		function n(e, t) {
-			return typeof document > "u" ? t : getComputedStyle(document.documentElement).getPropertyValue(e).trim() || t;
-		}
-		let p = t, h = r(() => p.motion), w = z(t, "modelValue"), T = P(null), D = P(null), A = P([]), M = v(() => p.variant === "underline"), B = v(() => p.orientation === "vertical"), W = v(() => p.semantics === "tabs" || !p.semantics && M.value);
-		function G(e) {
-			return !M.value && !Y(e.value) && !e.disabled && "glass-capsule-hover";
-		}
-		let { responsiveCfg: ie, stripValue: K, stripOptions: q, mobileAriaLabel: ae, showMobileSelect: oe } = U({
-			responsive: () => p.responsive,
-			options: v(() => p.options),
-			model: w
-		}), J = v(() => K.value == null ? [] : [K.value]), Y = (e) => J.value.includes(e);
-		j(() => {
-			A.value = [];
-		});
-		let { singleSliderStyle: se, squishOnTravel: ce } = m({
-			containerRef: T,
-			indicatorRef: D,
-			buttonRefs: A,
-			options: q,
-			model: v(() => K.value),
-			activeValues: J,
-			vertical: B
-		}), { dragEnabled: X, drag: le } = H({
-			indicatorRef: D,
-			isVertical: B,
-			isUnderline: M,
-			draggable: () => h.armed.value,
-			stripOptions: q,
-			buttonRefs: A,
-			model: w
-		});
-		function ue(e) {
-			if (typeof window < "u" && window.matchMedia("(prefers-reduced-motion: reduce)").matches) return;
-			e.getAnimations().forEach((e) => e.cancel());
-			let t = n("--spring-snappy", "ease"), r = n("--scale-press-btn", "0.97");
-			e.animate([
-				{ transform: "scale(1)" },
-				{
-					transform: `scale(${r})`,
-					offset: .4
-				},
-				{ transform: "scale(1)" }
-			], {
-				duration: 220,
-				easing: t
-			});
-		}
-		function Z(e, t) {
-			if (q.value[t]?.disabled) return;
-			let n = A.value[t];
-			n && ue(n), ce(t), w.value = e;
-		}
-		function de(e) {
-			typeof e == "string" && (w.value = e);
-		}
-		let { rovingTabindex: Q, onStripKeydown: $ } = g({
-			stripOptions: q,
-			stripValue: K,
-			isVertical: B,
-			activation: v(() => p.activation),
-			buttonRefs: A,
-			select: Z
-		});
-		return (n, r) => R(oe) ? (N(), b("div", {
-			key: 0,
-			class: O(R(e)("segmented-tabs__mobile w-fit", p.class))
-		}, [C(R(a), {
-			"model-value": w.value,
-			"onUpdate:modelValue": de
-		}, {
-			default: V(() => [C(R(o), {
-				"aria-label": p.ariaLabel ?? R(ae),
-				"data-control-target": "",
-				class: O(R(e)("segmented-tabs__trigger text-small w-auto min-w-input-sm", R(ie)?.triggerClass))
-			}, {
-				default: V(() => [C(R(c))]),
-				_: 1
-			}, 8, ["aria-label", "class"]), C(R(i), null, {
-				default: V(() => [(N(!0), b(_, null, F(t.options, (e) => (N(), y(R(s), {
-					key: e.value,
-					value: e.value,
-					disabled: e.disabled
-				}, {
-					default: V(() => [S(L(e.label), 1)]),
-					_: 2
-				}, 1032, ["value", "disabled"]))), 128))]),
-				_: 1
-			})]),
-			_: 1
-		}, 8, ["model-value"])], 2)) : (N(), b("div", {
-			key: 1,
-			ref_key: "containerRef",
-			ref: T,
-			role: W.value ? "tablist" : "group",
-			"aria-label": p.ariaLabel,
-			"aria-orientation": W.value ? B.value ? "vertical" : "horizontal" : void 0,
-			"data-motion": R(h).dataMotion.value,
-			style: k(R(h).hostStyle.value),
-			class: O(R(e)("segmented-tabs", `segmented-tabs--${t.variant}`, B.value && "segmented-tabs--vertical", !M.value && "glass-capsule-track", p.class)),
-			onKeydown: r[0] ||= (...e) => R($) && R($)(...e)
-		}, [M.value ? ee("", !0) : (N(), b("div", {
-			key: 0,
-			ref_key: "indicatorRef",
-			ref: D,
-			class: O([
-				"segmented-indicator",
-				"segmented-indicator--js",
-				"glass-capsule",
-				"glass-lens",
-				R(X) && "glass-drag-grabbable",
-				R(X) && R(le).dragging.value && "glass-drag-lift"
-			]),
-			style: k(R(se))
-		}, null, 6)), (N(!0), b(_, null, F(R(q), (e, t) => (N(), b(_, { key: e.value }, [e.tooltip ? (N(), y(R(f), {
-			key: 0,
-			"delay-duration": 200
-		}, {
-			default: V(() => [C(R(l), null, {
-				default: V(() => [C(R(u), { "as-child": "" }, {
-					default: V(() => [x("button", E({
-						type: "button",
-						ref_for: !0,
-						ref: (e) => {
-							e && (A.value[t] = e);
-						},
-						class: "segmented-tab",
-						role: W.value ? "tab" : void 0,
-						tabindex: R(Q)(t)
-					}, { ref_for: !0 }, W.value ? {
-						"aria-selected": Y(e.value) ? "true" : "false",
-						"aria-controls": e.controls || void 0
-					} : { "aria-pressed": Y(e.value) ? "true" : "false" }, {
-						disabled: e.disabled,
-						class: [e.disabled && "is-disabled", G(e)],
-						onClick: (n) => Z(e.value, t)
-					}), [I(n.$slots, "option", {
-						option: e,
-						active: Y(e.value)
-					}, () => [S(L(e.label), 1)])], 16, ne)]),
-					_: 2
-				}, 1024), C(R(d), {
-					side: "bottom",
-					"side-offset": 8
-				}, {
-					default: V(() => [S(L(e.tooltip), 1)]),
-					_: 2
-				}, 1024)]),
-				_: 2
-			}, 1024)]),
-			_: 2
-		}, 1024)) : (N(), b("button", E({
-			key: 1,
-			type: "button",
-			ref_for: !0,
-			ref: (e) => {
-				e && (A.value[t] = e);
-			},
-			class: "segmented-tab",
-			role: W.value ? "tab" : void 0,
-			tabindex: R(Q)(t)
-		}, { ref_for: !0 }, W.value ? {
-			"aria-selected": Y(e.value) ? "true" : "false",
-			"aria-controls": e.controls || void 0
-		} : { "aria-pressed": Y(e.value) ? "true" : "false" }, {
-			disabled: e.disabled,
-			class: [e.disabled && "is-disabled", G(e)],
-			onClick: (n) => Z(e.value, t)
-		}), [I(n.$slots, "option", {
-			option: e,
-			active: Y(e.value)
-		}, () => [S(L(e.label), 1)])], 16, re))], 64))), 128))], 46, te));
-	}
-});
-//#endregion
-export { W as SegmentedTabs };
+import { t as e } from "./tabs-CYscnq5H.js";
+export { e as SegmentedTabs };

package/dist/textarea.d.ts

@@ -0,0 +1 @@
+export * from "./components/textarea/index.js";

package/dist/textarea.js

@@ -0,0 +1,58 @@
+import { t as e } from "./class-names-q-UGOkHH.js";
+import { n as t } from "./control.css_vue_type_style_index_0_src_true_lang-BIdufaDG.js";
+import { computed as n, createElementBlock as r, defineComponent as i, mergeModels as a, mergeProps as o, openBlock as s, unref as c, useAttrs as l, useModel as u, vModelText as d, withDirectives as f } from "vue";
+//#region src/components/textarea/Textarea.vue?vue&type=script&setup=true&lang.ts
+var p = [
+	"disabled",
+	"readonly",
+	"data-size",
+	"data-state",
+	"data-resize",
+	"aria-invalid"
+], m = /* @__PURE__ */ i({
+	inheritAttrs: !1,
+	__name: "Textarea",
+	props: /*@__PURE__*/ a({
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] },
+		disabled: { type: Boolean },
+		invalid: {
+			type: Boolean,
+			default: !1
+		},
+		modelValue: {},
+		readonly: { type: Boolean },
+		resize: { default: "vertical" },
+		size: { default: "md" }
+	}, {
+		modelValue: { default: "" },
+		modelModifiers: {}
+	}),
+	emits: ["update:modelValue"],
+	setup(i) {
+		let a = i, m = u(i, "modelValue"), h = l(), { ariaInvalid: g, forwardedAttrs: _, state: v } = t(a, h), y = n(() => {
+			let e = h.rows;
+			if (!(e == null || e === "")) return { "--field-rows": String(e) };
+		});
+		return (t, n) => f((s(), r("textarea", o(c(_), {
+			"onUpdate:modelValue": n[0] ||= (e) => m.value = e,
+			disabled: a.disabled,
+			readonly: a.readonly,
+			"data-slot": "textarea",
+			"data-kind": "textarea",
+			"data-size": i.size,
+			"data-state": c(v),
+			"data-resize": i.resize,
+			"aria-invalid": c(g),
+			style: y.value,
+			class: c(e)("field-control glass-control-edge", a.class)
+		}), null, 16, p)), [[d, m.value]]);
+	}
+});
+//#endregion
+export { m as Textarea };

package/dist/timeline.d.ts

@@ -1 +1 @@
-export * from "./components/timeline";
+export * from "./components/timeline/index.js";