@glimstone/vue 4.1.0 → 4.1.1

package/dist/Select.js

@@ -1,15 +1,16 @@
-import { a as e, n as t } from "./glyphs-Cgknt-k1.js";
-import { n, r, t as i } from "./TipWrap-rNAEgvb0.js";
-import { Fragment as a, Teleport as o, computed as s, createBlock as c, createCommentVNode as l, createElementBlock as u, createElementVNode as d, createVNode as f, defineComponent as p, guardReactiveProps as m, mergeModels as h, mergeProps as g, normalizeClass as _, normalizeProps as v, onMounted as y, onScopeDispose as b, openBlock as x, renderList as S, resolveDynamicComponent as C, shallowRef as w, toDisplayString as T, unref as E, useId as D, useModel as O, watch as k, withCtx as A } from "vue";
-import { SELECT_POSITIONING as j, closeOnPageMove as M, defaultWidth as N, enableWheelStep as P, faceLabels as F, flattenRuns as I, hasSubmenu as L, homeRow as R, isSubmenu as z, pageDir as B, readPortalHue as V, selectContentClass as H, selectRootClass as U, selectTriggerClass as W, shake as G, wheelValue as K } from "@glimstone/core";
-import * as q from "@zag-js/select";
-import { normalizeProps as J, useMachine as Y } from "@zag-js/vue";
-import * as X from "@zag-js/menu";
+import { r as e } from "./fieldName-DBygJJfe.js";
+import { a as t, n } from "./glyphs-CYhs4mrY.js";
+import { n as r, r as i, t as a } from "./TipWrap-rNAEgvb0.js";
+import { Fragment as o, Teleport as s, computed as c, createBlock as l, createCommentVNode as u, createElementBlock as d, createElementVNode as f, createVNode as p, defineComponent as m, guardReactiveProps as h, mergeModels as g, mergeProps as _, normalizeClass as v, normalizeProps as y, onMounted as b, onScopeDispose as x, openBlock as S, renderList as C, resolveDynamicComponent as w, shallowRef as T, toDisplayString as E, unref as D, useId as O, useModel as k, watch as A, withCtx as j } from "vue";
+import { SELECT_POSITIONING as M, closeOnPageMove as N, defaultWidth as P, enableWheelStep as F, faceLabels as I, flattenRuns as L, hasSubmenu as R, homeRow as z, isSubmenu as B, pageDir as V, readPortalHue as H, selectRootClass as U, selectRowParts as W, selectTriggerClass as G, shake as K, wheelValue as q } from "@glimstone/core";
+import * as J from "@zag-js/select";
+import { normalizeProps as Y, useMachine as X } from "@zag-js/vue";
+import * as Z from "@zag-js/menu";
 // src/SelectFace.vue?vue&type=script&setup=true&lang.ts
 var ee = {
 	key: 0,
 	class: "glim-select-glyph"
-}, te = { class: "glim-select-value" }, ne = ["aria-hidden"], Z = /* @__PURE__ */ p({
+}, te = { class: "glim-select-value" }, ne = ["aria-hidden"], Q = /* @__PURE__ */ m({
 	__name: "SelectFace",
 	props: {
 		all: {},
@@ -19,39 +20,36 @@ var ee = {
 		glyphs: { type: Boolean }
 	},
 	setup(e) {
-		let t = e, n = s(() => F(t.all, t.value, t.placeholder, t.width)), r = s(() => t.all.find((e) => e.value === t.value)?.glyph);
-		return (t, i) => (x(), u(a, null, [e.glyphs ? (x(), u("span", ee, [r.value ? (x(), c(C(r.value), { key: 0 })) : l("", !0)])) : l("", !0), d("span", te, [(x(!0), u(a, null, S(n.value.labels, (e) => (x(), u("span", {
+		let t = e, n = c(() => I(t.all, t.value, t.placeholder, t.width)), r = c(() => t.all.find((e) => e.value === t.value)?.glyph);
+		return (t, i) => (S(), d(o, null, [e.glyphs ? (S(), d("span", ee, [r.value ? (S(), l(w(r.value), { key: 0 })) : u("", !0)])) : u("", !0), f("span", te, [(S(!0), d(o, null, C(n.value.labels, (e) => (S(), d("span", {
 			key: e,
 			"aria-hidden": e !== n.value.text || void 0,
-			class: _(e === n.value.text ? void 0 : "glim-select-ghost")
-		}, T(e), 11, ne))), 128))])], 64));
+			class: v(e === n.value.text ? void 0 : "glim-select-ghost")
+		}, E(e), 11, ne))), 128))])], 64));
 	}
 });
 // src/selectParts.ts
-function Q(e, t) {
-	let n = w(null);
-	return k(e, (e) => n.value = e && t.value ? V(t.value) : null, { flush: "sync" }), {
-		style: s(() => n.value ?? void 0),
-		className: s(() => n.value ? "glim-hue" : "")
+function $(e, t) {
+	let n = T(null);
+	return A(e, (e) => n.value = e && t.value ? H(t.value) : null, { flush: "sync" }), {
+		style: c(() => n.value ?? void 0),
+		className: c(() => n.value ? "glim-hue" : "")
 	};
 }
-function $(e, t) {
+function re(e, t) {
 	let n;
-	k(e, (e) => {
-		n?.(), n = e ? P(e, (e) => {
+	A(e, (e) => {
+		n?.(), n = e ? F(e, (e) => {
 			if (t.inert()) return;
-			let n = K(t.all(), t.value(), e);
+			let n = q(t.all(), t.value(), e);
 			n !== void 0 && t.onChange(n);
 		}) : void 0;
-	}, { immediate: !0 }), k(t.shakeCount, (t, n, r) => {
-		e.value && t > 0 && r(G(e.value));
-	}), b(() => n?.());
+	}, { immediate: !0 }), A(t.shakeCount, (t, n, r) => {
+		e.value && t > 0 && r(K(e.value));
+	}), x(() => n?.());
 }
 // src/ListSelect.vue?vue&type=script&setup=true&lang.ts
-var re = ["aria-busy", "aria-describedby"], ie = {
-	key: 0,
-	class: "glim-select-glyph"
-}, ae = /* @__PURE__ */ p({
+var ie = ["aria-busy", "aria-describedby"], ae = /* @__PURE__ */ m({
 	__name: "ListSelect",
 	props: {
 		label: {},
@@ -60,114 +58,123 @@ var re = ["aria-busy", "aria-describedby"], ie = {
 		value: {},
 		placeholder: {},
 		width: {},
+		rows: {},
 		triggerClass: {},
 		id: {},
+		triggerAttrs: {},
+		listId: {},
 		disabled: { type: Boolean },
 		busy: { type: Boolean },
 		tip: {},
 		shake: {}
 	},
 	emits: ["change"],
-	setup(p, { expose: h, emit: _ }) {
-		let y = p, b = _, O = D(), N = s(() => I(y.groups)), P = s(() => N.value.some((e) => e.glyph)), F = s(() => q.collection({
-			items: N.value,
+	setup(e, { expose: m, emit: g }) {
+		let b = e, x = g, k = O(), P = c(() => L(b.groups)), F = c(() => P.value.some((e) => e.glyph)), I = c(() => W(b.rows, F.value)), R = c(() => J.collection({
+			items: P.value,
 			itemToValue: (e) => e.value,
 			itemToString: (e) => e.label,
 			isItemDisabled: (e) => !!e.disabled
-		})), L = Y(q.machine, s(() => ({
-			id: O,
-			ids: y.id ? { trigger: y.id } : void 0,
-			dir: B(),
-			collection: F.value,
-			value: y.value === null ? [] : [y.value],
-			disabled: y.disabled,
-			readOnly: y.busy,
+		})), z = X(J.machine, c(() => ({
+			id: k,
+			ids: {
+				trigger: b.id,
+				content: b.listId
+			},
+			dir: V(),
+			collection: R.value,
+			value: b.value === null ? [] : [b.value],
+			disabled: b.disabled,
+			readOnly: b.busy,
 			onValueChange: (e) => {
 				let t = e.value[0];
-				t !== void 0 && t !== y.value && b("change", t);
+				t !== void 0 && t !== b.value && x("change", t);
 			},
-			positioning: j
-		}))), R = s(() => q.connect(L, J)), z = w(null), V = r(() => y.tip, () => !!y.disabled);
-		$(z, {
-			all: () => N.value,
-			value: () => y.value,
-			inert: () => !!(y.disabled || y.busy),
-			onChange: (e) => b("change", e),
-			shakeCount: () => y.shake ?? 0
-		}), k(() => R.value.open, (e, t, n) => {
-			e && n(M(() => R.value.setOpen(!1)));
+			positioning: M
+		}))), B = c(() => J.connect(z, Y)), H = T(null), G = i(() => b.tip, () => !!b.disabled);
+		re(H, {
+			all: () => P.value,
+			value: () => b.value,
+			inert: () => !!(b.disabled || b.busy),
+			onChange: (e) => x("change", e),
+			shakeCount: () => b.shake ?? 0
+		}), A(() => B.value.open, (e, t, n) => {
+			e && n(N(() => B.value.setOpen(!1)));
 		});
-		let W = Q(() => R.value.open, z);
-		function G(e) {
-			z.value = e, V.trigger.value = z.value;
+		let K = $(() => B.value.open, H);
+		function q(e) {
+			H.value = e, G.trigger.value = H.value;
 		}
-		return h({ trigger: z }), (r, s) => (x(), u("div", g(R.value.getRootProps(), { class: E(U)(p.width) }), [
-			d("label", g(R.value.getLabelProps(), { class: p.hideLabel ? "glim-sr-only" : "glim-field-label" }), T(p.label), 17),
-			d("div", v(m(R.value.getControlProps())), [f(E(i), {
-				on: !!p.disabled && !!p.tip,
-				show: E(V).show,
-				hide: E(V).hide
+		return m({ trigger: H }), (i, c) => (S(), d("div", _(B.value.getRootProps(), { class: D(U)(e.width) }), [
+			f("label", _(B.value.getLabelProps(), { class: e.hideLabel ? "glim-sr-only" : "glim-field-label" }), E(e.label), 17),
+			f("div", y(h(B.value.getControlProps())), [p(D(a), {
+				on: !!e.disabled && !!e.tip,
+				show: D(G).show,
+				hide: D(G).hide
 			}, {
-				default: A(() => [d("button", g(R.value.getTriggerProps(), {
-					ref: G,
-					"aria-busy": p.busy || void 0,
-					"aria-describedby": E(V).describedBy.value,
-					class: p.triggerClass,
-					onMouseenter: s[0] ||= (...e) => E(V).show && E(V).show(...e),
-					onMouseleave: s[1] ||= (...e) => E(V).hide && E(V).hide(...e),
-					onFocus: s[2] ||= (...e) => E(V).showOnFocus && E(V).showOnFocus(...e),
-					onBlur: s[3] ||= (...e) => E(V).hide && E(V).hide(...e)
-				}), [f(Z, {
-					all: N.value,
-					value: p.value,
-					placeholder: p.placeholder,
-					width: p.width,
-					glyphs: P.value
+				default: j(() => [f("button", _({
+					...e.triggerAttrs,
+					...B.value.getTriggerProps()
+				}, {
+					ref: q,
+					"aria-busy": e.busy || void 0,
+					"aria-describedby": D(G).describedBy.value,
+					class: e.triggerClass,
+					onMouseenter: c[0] ||= (...e) => D(G).show && D(G).show(...e),
+					onMouseleave: c[1] ||= (...e) => D(G).hide && D(G).hide(...e),
+					onFocus: c[2] ||= (...e) => D(G).showOnFocus && D(G).showOnFocus(...e),
+					onBlur: c[3] ||= (...e) => D(G).hide && D(G).hide(...e)
+				}), [p(Q, {
+					all: P.value,
+					value: e.value,
+					placeholder: e.placeholder,
+					width: e.width,
+					glyphs: F.value
 				}, null, 8, [
 					"all",
 					"value",
 					"placeholder",
 					"width",
 					"glyphs"
-				]), d("span", g(R.value.getIndicatorProps(), { class: "glim-select-indicator" }), [f(E(e))], 16)], 16, re)]),
+				]), f("span", _(B.value.getIndicatorProps(), { class: "glim-select-indicator" }), [p(D(t))], 16)], 16, ie)]),
 				_: 1
 			}, 8, [
 				"on",
 				"show",
 				"hide"
 			])], 16),
-			f(n, { state: E(V) }, null, 8, ["state"]),
-			(x(), c(o, { to: "body" }, [d("div", g(R.value.getPositionerProps(), {
-				style: E(W).style.value,
-				class: ["glim-select-positioner", E(W).className.value]
-			}), [d("div", g(R.value.getContentProps(), { class: E(H)(P.value) }), [(x(!0), u(a, null, S(p.groups, (e, n) => (x(), u(a, { key: n }, [e.entries.length > 0 ? (x(), u("div", g({
+			p(r, { state: D(G) }, null, 8, ["state"]),
+			(S(), l(s, { to: "body" }, [f("div", _(B.value.getPositionerProps(), {
+				style: D(K).style.value,
+				class: ["glim-select-positioner", D(K).className.value]
+			}), [f("div", _(B.value.getContentProps(), { class: I.value.content }), [(S(!0), d(o, null, C(e.groups, (e, t) => (S(), d(o, { key: t }, [e.entries.length > 0 ? (S(), d("div", _({
 				key: 0,
 				ref_for: !0
-			}, e.heading ? R.value.getItemGroupProps({ id: `${E(O)}-g${n}` }) : {}, { class: "glim-select-group" }), [e.heading ? (x(), u("div", g({
+			}, e.heading ? B.value.getItemGroupProps({ id: `${D(k)}-g${t}` }) : {}, { class: "glim-select-group" }), [e.heading ? (S(), d("div", _({
 				key: 0,
 				ref_for: !0
-			}, R.value.getItemGroupLabelProps({ htmlFor: `${E(O)}-g${n}` }), { class: "glim-select-heading" }), T(e.heading), 17)) : l("", !0), (x(!0), u(a, null, S(e.entries, (e) => (x(), u("div", g({ key: e.value }, { ref_for: !0 }, R.value.getItemProps({ item: e }), { class: "glim-select-item" }), [
-				P.value ? (x(), u("span", ie, [e.glyph ? (x(), c(C(e.glyph), { key: 0 })) : l("", !0)])) : l("", !0),
-				d("span", g({ ref_for: !0 }, R.value.getItemTextProps({ item: e }), { class: "glim-select-label" }), T(e.label), 17),
-				d("span", g({ ref_for: !0 }, R.value.getItemIndicatorProps({ item: e }), { class: "glim-select-check" }), [f(E(t))], 16)
-			], 16))), 128))], 16)) : l("", !0)], 64))), 128))], 16)], 16)])),
-			d("select", v(m(R.value.getHiddenSelectProps())), null, 16)
+			}, B.value.getItemGroupLabelProps({ htmlFor: `${D(k)}-g${t}` }), { class: I.value.heading }), E(e.heading), 17)) : u("", !0), (S(!0), d(o, null, C(e.entries, (e) => (S(), d("div", _({ key: e.value }, { ref_for: !0 }, B.value.getItemProps({ item: e }), { class: I.value.item }), [
+				I.value.glyph ? (S(), d("span", {
+					key: 0,
+					class: v(I.value.glyph)
+				}, [e.glyph ? (S(), l(w(e.glyph), { key: 0 })) : u("", !0)], 2)) : u("", !0),
+				f("span", _({ ref_for: !0 }, B.value.getItemTextProps({ item: e }), { class: I.value.label }), E(e.label), 17),
+				f("span", _({ ref_for: !0 }, B.value.getItemIndicatorProps({ item: e }), { class: I.value.check }), [p(D(n))], 16)
+			], 16))), 128))], 16)) : u("", !0)], 64))), 128))], 16)], 16)])),
+			f("select", y(h(B.value.getHiddenSelectProps())), null, 16)
 		], 16));
 	}
-}), oe = {
-	key: 0,
-	class: "glim-select-glyph"
-}, se = ["data-state"], ce = /* @__PURE__ */ p({
+}), oe = ["data-state"], se = /* @__PURE__ */ m({
 	__name: "MenuChoice",
 	props: {
 		api: {},
 		option: {},
 		value: {},
-		glyphs: { type: Boolean }
+		parts: {}
 	},
 	emits: ["change"],
-	setup(e, { emit: n }) {
-		let r = e, i = n, a = s(() => r.option.value === r.value), o = s(() => ({
+	setup(e, { emit: t }) {
+		let r = e, i = t, a = c(() => r.option.value === r.value), o = c(() => ({
 			type: "radio",
 			value: r.option.value,
 			valueText: r.option.label,
@@ -177,23 +184,20 @@ var re = ["aria-busy", "aria-describedby"], ie = {
 				a.value || i("change", r.option.value);
 			}
 		}));
-		return (n, r) => (x(), u("div", g(e.api.getOptionItemProps(o.value), { class: "glim-select-item" }), [
-			e.glyphs ? (x(), u("span", oe, [e.option.glyph ? (x(), c(C(e.option.glyph), { key: 0 })) : l("", !0)])) : l("", !0),
-			d("span", g(e.api.getItemTextProps(o.value), { class: "glim-select-label" }), T(e.option.label), 17),
-			d("span", {
+		return (t, r) => (S(), d("div", _(e.api.getOptionItemProps(o.value), { class: e.parts.item }), [
+			e.parts.glyph ? (S(), d("span", {
+				key: 0,
+				class: v(e.parts.glyph)
+			}, [e.option.glyph ? (S(), l(w(e.option.glyph), { key: 0 })) : u("", !0)], 2)) : u("", !0),
+			f("span", _(e.api.getItemTextProps(o.value), { class: e.parts.label }), E(e.option.label), 17),
+			f("span", {
 				"aria-hidden": "true",
 				"data-state": a.value ? "checked" : "unchecked",
-				class: "glim-select-check"
-			}, [f(E(t))], 8, se)
+				class: v(e.parts.check)
+			}, [p(D(n))], 10, oe)
 		], 16));
 	}
-}), le = {
-	key: 0,
-	class: "glim-select-glyph"
-}, ue = { class: "glim-select-label" }, de = {
-	"aria-hidden": "true",
-	class: "glim-select-caret"
-}, fe = /* @__PURE__ */ p({
+}), ce = /* @__PURE__ */ m({
 	__name: "MenuSubmenu",
 	props: {
 		parent: {},
@@ -201,53 +205,59 @@ var re = ["aria-busy", "aria-describedby"], ie = {
 		triggerId: {},
 		entry: {},
 		value: {},
-		glyphs: { type: Boolean },
+		parts: {},
 		hueStyle: {},
 		hueClass: {}
 	},
 	emits: ["change"],
-	setup(t, { emit: n }) {
-		let r = t, i = n, p = Y(X.machine, {
-			id: D(),
+	setup(e, { emit: n }) {
+		let r = e, i = n, a = X(Z.machine, {
+			id: O(),
 			ids: { trigger: r.triggerId },
-			dir: B(),
+			dir: V(),
 			"aria-label": r.entry.label
-		}), m = s(() => X.connect(p, J));
-		return y(() => {
-			r.parentApi.setChild(p), m.value.setParent(r.parent);
-		}), (n, r) => (x(), u(a, null, [d("div", g(t.parentApi.getTriggerItemProps(m.value), { class: "glim-select-item" }), [
-			t.glyphs ? (x(), u("span", le, [t.entry.glyph ? (x(), c(C(t.entry.glyph), { key: 0 })) : l("", !0)])) : l("", !0),
-			d("span", ue, T(t.entry.label), 1),
-			d("span", de, [f(E(e))])
-		], 16), (x(), c(o, { to: "body" }, [d("div", g(m.value.getPositionerProps(), {
-			style: t.hueStyle,
-			class: ["glim-select-positioner", t.hueClass]
-		}), [d("div", g(m.value.getContentProps(), { class: E(H)(t.glyphs) }), [(x(!0), u(a, null, S(t.entry.options, (e) => (x(), c(ce, {
-			key: e.value,
+		}), m = c(() => Z.connect(a, Y));
+		return b(() => {
+			r.parentApi.setChild(a), m.value.setParent(r.parent);
+		}), (n, r) => (S(), d(o, null, [f("div", _(e.parentApi.getTriggerItemProps(m.value), { class: e.parts.item }), [
+			e.parts.glyph ? (S(), d("span", {
+				key: 0,
+				class: v(e.parts.glyph)
+			}, [e.entry.glyph ? (S(), l(w(e.entry.glyph), { key: 0 })) : u("", !0)], 2)) : u("", !0),
+			f("span", { class: v(e.parts.label) }, E(e.entry.label), 3),
+			f("span", {
+				"aria-hidden": "true",
+				class: v(e.parts.caret)
+			}, [p(D(t))], 2)
+		], 16), (S(), l(s, { to: "body" }, [f("div", _(m.value.getPositionerProps(), {
+			style: e.hueStyle,
+			class: ["glim-select-positioner", e.hueClass]
+		}), [f("div", _(m.value.getContentProps(), { class: e.parts.content }), [(S(!0), d(o, null, C(e.entry.options, (t) => (S(), l(se, {
+			key: t.value,
 			api: m.value,
-			option: e,
-			value: t.value,
-			glyphs: t.glyphs,
+			option: t,
+			value: e.value,
+			parts: e.parts,
 			onChange: r[0] ||= (e) => i("change", e)
 		}, null, 8, [
 			"api",
 			"option",
 			"value",
-			"glyphs"
+			"parts"
 		]))), 128))], 16)], 16)]))], 64));
 	}
-}), pe = {
+}), le = {
 	key: 0,
 	"aria-hidden": "true",
 	class: "glim-field-label"
-}, me = [
+}, ue = [
 	"disabled",
 	"data-disabled",
 	"data-readonly",
 	"aria-busy",
 	"aria-label",
 	"aria-describedby"
-], he = /* @__PURE__ */ p({
+], de = /* @__PURE__ */ m({
 	__name: "MenuSelect",
 	props: {
 		label: {},
@@ -256,143 +266,150 @@ var re = ["aria-busy", "aria-describedby"], ie = {
 		value: {},
 		placeholder: {},
 		width: {},
+		rows: {},
 		triggerClass: {},
 		id: {},
+		triggerAttrs: {},
+		listId: {},
 		disabled: { type: Boolean },
 		busy: { type: Boolean },
 		tip: {},
 		shake: {}
 	},
 	emits: ["change"],
-	setup(t, { expose: p, emit: m }) {
-		let h = t, v = m, y = D(), b = Y(X.machine, s(() => ({
+	setup(e, { expose: n, emit: m }) {
+		let h = e, g = m, y = O(), b = X(Z.machine, c(() => ({
 			id: y,
-			ids: h.id ? { trigger: h.id } : void 0,
-			dir: B(),
+			ids: {
+				trigger: h.id,
+				content: h.listId
+			},
+			dir: V(),
 			"aria-label": h.label,
-			positioning: j
-		}))), C = s(() => X.connect(b, J)), O = s(() => I(h.groups)), N = s(() => O.value.some((e) => e.glyph)), P = s(() => F(O.value, h.value, h.placeholder, h.width).text), L = (e, t) => `${y}-sub-${e}-${t}`, V = w(null), W = r(() => h.tip, () => !!h.disabled);
-		$(V, {
-			all: () => O.value,
+			positioning: M
+		}))), x = c(() => Z.connect(b, Y)), w = c(() => L(h.groups)), k = c(() => w.value.some((e) => e.glyph)), P = c(() => W(h.rows, k.value)), F = c(() => I(w.value, h.value, h.placeholder, h.width).text), R = (e, t) => `${y}-sub-${e}-${t}`, H = T(null), G = i(() => h.tip, () => !!h.disabled);
+		re(H, {
+			all: () => w.value,
 			value: () => h.value,
 			inert: () => !!(h.disabled || h.busy),
-			onChange: (e) => v("change", e),
+			onChange: (e) => g("change", e),
 			shakeCount: () => h.shake ?? 0
 		});
-		let G = Q(() => C.value.open, V);
-		k(() => C.value.open, (e, t, n) => {
+		let K = $(() => x.value.open, H);
+		A(() => x.value.open, (e, t, n) => {
 			if (!e) return;
-			n(M(() => C.value.setOpen(!1)));
-			let r = R(h.groups, h.value, L);
+			n(N(() => x.value.setOpen(!1)));
+			let r = z(h.groups, h.value, R);
 			if (r === null) return;
 			let i = 0, a = requestAnimationFrame(() => {
-				i = requestAnimationFrame(() => C.value.setHighlightedValue(r));
+				i = requestAnimationFrame(() => x.value.setHighlightedValue(r));
 			});
 			n(() => {
 				cancelAnimationFrame(a), cancelAnimationFrame(i);
 			});
 		});
-		let K = s(() => {
-			let e = C.value.getTriggerProps(), t = (t) => (n) => {
+		let q = c(() => {
+			let e = x.value.getTriggerProps(), t = (t) => (n) => {
 				h.busy ? n.preventDefault() : e[t]?.(n);
 			};
 			return {
+				...h.triggerAttrs,
 				...e,
 				onPointerdown: t("onPointerdown"),
 				onClick: t("onClick"),
 				onKeydown: t("onKeydown")
 			};
 		});
-		function q(e) {
-			V.value = e, W.trigger.value = V.value;
+		function J(e) {
+			H.value = e, G.trigger.value = H.value;
 		}
-		return p({ trigger: V }), (r, s) => (x(), u("div", { class: _(E(U)(t.width)) }, [
-			t.hideLabel ? l("", !0) : (x(), u("span", pe, T(t.label), 1)),
-			d("div", null, [f(E(i), {
-				on: !!t.disabled && !!t.tip,
-				show: E(W).show,
-				hide: E(W).hide
+		return n({ trigger: H }), (n, i) => (S(), d("div", { class: v(D(U)(e.width)) }, [
+			e.hideLabel ? u("", !0) : (S(), d("span", le, E(e.label), 1)),
+			f("div", null, [p(D(a), {
+				on: !!e.disabled && !!e.tip,
+				show: D(G).show,
+				hide: D(G).hide
 			}, {
-				default: A(() => [d("button", g(K.value, {
-					ref: q,
-					disabled: t.disabled,
-					"data-disabled": t.disabled ? "" : void 0,
-					"data-readonly": t.busy ? "" : void 0,
-					"aria-busy": t.busy || void 0,
-					"aria-label": `${t.label}: ${P.value}`,
-					"aria-describedby": E(W).describedBy.value,
-					class: t.triggerClass,
-					onMouseenter: s[0] ||= (...e) => E(W).show && E(W).show(...e),
-					onMouseleave: s[1] ||= (...e) => E(W).hide && E(W).hide(...e),
-					onFocus: s[2] ||= (...e) => E(W).showOnFocus && E(W).showOnFocus(...e),
-					onBlur: s[3] ||= (...e) => E(W).hide && E(W).hide(...e)
-				}), [f(Z, {
-					all: O.value,
-					value: t.value,
-					placeholder: t.placeholder,
-					width: t.width,
-					glyphs: N.value
+				default: j(() => [f("button", _(q.value, {
+					ref: J,
+					disabled: e.disabled,
+					"data-disabled": e.disabled ? "" : void 0,
+					"data-readonly": e.busy ? "" : void 0,
+					"aria-busy": e.busy || void 0,
+					"aria-label": `${e.label}: ${F.value}`,
+					"aria-describedby": D(G).describedBy.value,
+					class: e.triggerClass,
+					onMouseenter: i[0] ||= (...e) => D(G).show && D(G).show(...e),
+					onMouseleave: i[1] ||= (...e) => D(G).hide && D(G).hide(...e),
+					onFocus: i[2] ||= (...e) => D(G).showOnFocus && D(G).showOnFocus(...e),
+					onBlur: i[3] ||= (...e) => D(G).hide && D(G).hide(...e)
+				}), [p(Q, {
+					all: w.value,
+					value: e.value,
+					placeholder: e.placeholder,
+					width: e.width,
+					glyphs: k.value
 				}, null, 8, [
 					"all",
 					"value",
 					"placeholder",
 					"width",
 					"glyphs"
-				]), d("span", g(C.value.getIndicatorProps(), { class: "glim-select-indicator" }), [f(E(e))], 16)], 16, me)]),
+				]), f("span", _(x.value.getIndicatorProps(), { class: "glim-select-indicator" }), [p(D(t))], 16)], 16, ue)]),
 				_: 1
 			}, 8, [
 				"on",
 				"show",
 				"hide"
 			])]),
-			f(n, { state: E(W) }, null, 8, ["state"]),
-			(x(), c(o, { to: "body" }, [d("div", g(C.value.getPositionerProps(), {
-				style: E(G).style.value,
-				class: ["glim-select-positioner", E(G).className.value]
-			}), [d("div", g(C.value.getContentProps(), { class: E(H)(N.value) }), [(x(!0), u(a, null, S(t.groups, (e, n) => (x(), u(a, { key: n }, [e.entries.length > 0 ? (x(), u("div", g({
+			p(r, { state: D(G) }, null, 8, ["state"]),
+			(S(), l(s, { to: "body" }, [f("div", _(x.value.getPositionerProps(), {
+				style: D(K).style.value,
+				class: ["glim-select-positioner", D(K).className.value]
+			}), [f("div", _(x.value.getContentProps(), { class: P.value.content }), [(S(!0), d(o, null, C(e.groups, (t, n) => (S(), d(o, { key: n }, [t.entries.length > 0 ? (S(), d("div", _({
 				key: 0,
 				ref_for: !0
-			}, e.heading ? C.value.getItemGroupProps({ id: `g${n}` }) : {}, { class: "glim-select-group" }), [e.heading ? (x(), u("div", g({
+			}, t.heading ? x.value.getItemGroupProps({ id: `g${n}` }) : {}, { class: "glim-select-group" }), [t.heading ? (S(), d("div", _({
 				key: 0,
 				ref_for: !0
-			}, C.value.getItemGroupLabelProps({ htmlFor: `g${n}` }), { class: "glim-select-heading" }), T(e.heading), 17)) : l("", !0), (x(!0), u(a, null, S(e.entries, (e, r) => (x(), u(a, { key: E(z)(e) ? `s${r}` : e.value }, [E(z)(e) ? (x(), c(fe, {
+			}, x.value.getItemGroupLabelProps({ htmlFor: `g${n}` }), { class: P.value.heading }), E(t.heading), 17)) : u("", !0), (S(!0), d(o, null, C(t.entries, (t, r) => (S(), d(o, { key: D(B)(t) ? `s${r}` : t.value }, [D(B)(t) ? (S(), l(ce, {
 				key: 0,
-				parent: E(b),
-				"parent-api": C.value,
-				"trigger-id": L(n, r),
-				entry: e,
-				value: t.value,
-				glyphs: N.value,
-				"hue-style": E(G).style.value,
-				"hue-class": E(G).className.value,
-				onChange: s[4] ||= (e) => v("change", e)
+				parent: D(b),
+				"parent-api": x.value,
+				"trigger-id": R(n, r),
+				entry: t,
+				value: e.value,
+				parts: P.value,
+				"hue-style": D(K).style.value,
+				"hue-class": D(K).className.value,
+				onChange: i[4] ||= (e) => g("change", e)
 			}, null, 8, [
 				"parent",
 				"parent-api",
 				"trigger-id",
 				"entry",
 				"value",
-				"glyphs",
+				"parts",
 				"hue-style",
 				"hue-class"
-			])) : (x(), c(ce, {
+			])) : (S(), l(se, {
 				key: 1,
-				api: C.value,
-				option: e,
-				value: t.value,
-				glyphs: N.value,
-				onChange: s[5] ||= (e) => v("change", e)
+				api: x.value,
+				option: t,
+				value: e.value,
+				parts: P.value,
+				onChange: i[5] ||= (e) => g("change", e)
 			}, null, 8, [
 				"api",
 				"option",
 				"value",
-				"glyphs"
-			]))], 64))), 128))], 16)) : l("", !0)], 64))), 128))], 16)], 16)]))
+				"parts"
+			]))], 64))), 128))], 16)) : u("", !0)], 64))), 128))], 16)], 16)]))
 		], 2));
 	}
-}), ge = /* @__PURE__ */ p({
+}), fe = /* @__PURE__ */ m({
 	__name: "Select",
-	props: /*@__PURE__*/ h({
+	props: /*@__PURE__*/ g({
 		label: {},
 		hideLabel: {
 			type: Boolean,
@@ -403,11 +420,14 @@ var re = ["aria-busy", "aria-describedby"], ie = {
 		placeholder: {},
 		width: {},
 		size: { default: "field" },
+		rows: { default: "list" },
 		wrap: {
 			type: Boolean,
 			default: !1
 		},
 		id: {},
+		triggerAttrs: {},
+		listId: {},
 		disabled: {
 			type: Boolean,
 			default: !1
@@ -423,22 +443,25 @@ var re = ["aria-busy", "aria-describedby"], ie = {
 		modelModifiers: {}
 	}),
 	emits: ["update:modelValue"],
-	setup(e) {
-		let t = e, n = O(e, "modelValue"), r = s(() => t.groups ?? [{ entries: t.options ?? [] }]), i = s(() => ({
-			label: t.label,
-			hideLabel: t.hideLabel,
-			groups: r.value,
-			value: n.value,
-			placeholder: t.placeholder,
-			width: t.width ?? N(t.size),
-			triggerClass: W(t.size, t.wrap),
-			id: t.id,
-			disabled: t.disabled,
-			busy: t.busy,
-			tip: t.tip,
-			shake: t.shake
+	setup(t) {
+		let n = t, r = k(t, "modelValue"), i = c(() => n.groups ?? [{ entries: n.options ?? [] }]), a = e(() => n.label), o = c(() => n.label === void 0), s = c(() => ({
+			label: a.value ?? "",
+			hideLabel: n.hideLabel || o.value,
+			groups: i.value,
+			value: r.value,
+			placeholder: n.placeholder,
+			width: n.width ?? (o.value ? "steady" : P(n.size)),
+			rows: n.rows,
+			triggerClass: G(n.size, n.wrap),
+			id: n.id,
+			triggerAttrs: n.triggerAttrs,
+			listId: n.listId,
+			disabled: n.disabled,
+			busy: n.busy,
+			tip: n.tip,
+			shake: n.shake
 		}));
-		return (e, t) => E(L)(r.value) ? (x(), c(he, g({ key: 0 }, i.value, { onChange: t[0] ||= (e) => n.value = e }), null, 16)) : (x(), c(ae, g({ key: 1 }, i.value, { onChange: t[1] ||= (e) => n.value = e }), null, 16));
+		return (e, t) => D(R)(i.value) ? (S(), l(de, _({ key: 0 }, s.value, { onChange: t[0] ||= (e) => r.value = e }), null, 16)) : (S(), l(ae, _({ key: 1 }, s.value, { onChange: t[1] ||= (e) => r.value = e }), null, 16));
 	}
 });
-export { ge as Select };
+export { fe as Select };