morya-ui 0.3.1 → 0.3.2

package/dist/accordion/style.css

@@ -50,6 +50,10 @@
     --m-font-size-sm: 0.8125rem;
     --m-font-size-md: 0.875rem;
     --m-font-size-lg: 1.125rem;
+    /* Display scale (page titles, KPI figures) */
+    --m-font-size-xl: 1.25rem;
+    --m-font-size-2xl: 1.5rem;
+    --m-font-size-3xl: 1.75rem;
     --m-opacity-disabled: 0.55;
     /* Layering: override --m-z-base via ConfigProvider / createMoryaUI */
     --m-z-base: 1000;
@@ -192,20 +196,10 @@
 
 /*
  * Global motion policy (complements per-component rules):
- * - `reduced` / OS prefers-reduced-motion: keep short paint transitions; stop loops
+ * - `reduced`: keep short paint transitions; stop loops
  *   and layout/transform size animation.
  * - `none`: zero all transition/animation durations.
  */
-@media (prefers-reduced-motion: reduce) {
-    html:not([data-m-ignore-reduced-motion]) *,
-    html:not([data-m-ignore-reduced-motion]) *::before,
-    html:not([data-m-ignore-reduced-motion]) *::after {
-        animation-duration: 0.01ms !important;
-        animation-iteration-count: 1 !important;
-        transition-property: background-color, border-color, color, opacity, box-shadow,
-            outline, fill, stroke, stroke-dashoffset !important;
-    }
-}
 
 [data-m-motion="reduced"] *,
 [data-m-motion="reduced"] *::before,
@@ -615,7 +609,7 @@
 .m-zoom-enter-from,
 .m-zoom-leave-to {
     opacity: 0;
-    transform: scale(0.9);
+    transform: scale(0.95);
 }
 
 .m-slide-up-enter-active,
@@ -660,44 +654,6 @@
     transform: translateX(calc(var(--m-motion-distance) * -1));
 }
 
-@media (prefers-reduced-motion: reduce) {
-    html:not([data-m-ignore-reduced-motion]) .m-fade-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-fade-leave-active,
-    html:not([data-m-ignore-reduced-motion]) .m-scale-fade-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-scale-fade-leave-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-fade-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-fade-leave-active,
-    html:not([data-m-ignore-reduced-motion]) .m-zoom-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-zoom-leave-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-up-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-up-leave-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-down-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-down-leave-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-left-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-left-leave-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-right-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-right-leave-active {
-        transition: none;
-    }
-
-    html:not([data-m-ignore-reduced-motion]) .m-scale-fade-enter-from,
-    html:not([data-m-ignore-reduced-motion]) .m-scale-fade-leave-to,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-fade-enter-from,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-fade-leave-to,
-    html:not([data-m-ignore-reduced-motion]) .m-zoom-enter-from,
-    html:not([data-m-ignore-reduced-motion]) .m-zoom-leave-to,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-up-enter-from,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-up-leave-to,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-down-enter-from,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-down-leave-to,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-left-enter-from,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-left-leave-to,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-right-enter-from,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-right-leave-to {
-        transform: none;
-    }
-}
-
 [data-m-motion="reduced"] .m-fade-enter-active,
 [data-m-motion="reduced"] .m-fade-leave-active,
 [data-m-motion="reduced"] .m-scale-fade-enter-active,
@@ -1192,17 +1148,6 @@
     animation: none !important;
 }
 
-@media (prefers-reduced-motion: reduce) {
-    html:not([data-m-ignore-reduced-motion]) *,
-    html:not([data-m-ignore-reduced-motion]) *::before,
-    html:not([data-m-ignore-reduced-motion]) *::after {
-        animation-duration: 0.01ms !important;
-        animation-iteration-count: 1 !important;
-        scroll-behavior: auto !important;
-        transition-duration: 0.01ms !important;
-    }
-}
-
 .m-accordion {
     border: var(--m-border-width) solid var(--m-color-border);
     border-radius: var(--m-radius-md);
@@ -1264,13 +1209,20 @@
     min-height: 0;
 }
 
-.m-accordion-collapse-enter-active,
+.m-accordion-collapse-enter-active {
+    display: grid;
+    overflow: hidden;
+    transition:
+        grid-template-rows var(--m-motion-enter) var(--m-motion-ease),
+        opacity var(--m-motion-enter) var(--m-motion-ease);
+}
+
 .m-accordion-collapse-leave-active {
     display: grid;
     overflow: hidden;
     transition:
-        grid-template-rows var(--m-motion-normal) var(--m-motion-ease),
-        opacity var(--m-motion-normal) var(--m-motion-ease);
+        grid-template-rows var(--m-motion-exit) var(--m-motion-ease),
+        opacity var(--m-motion-exit) var(--m-motion-ease);
 }
 
 .m-accordion-collapse-enter-active,
@@ -1284,13 +1236,6 @@
     opacity: 0;
 }
 
-@media (prefers-reduced-motion: reduce) {
-    html:not([data-m-ignore-reduced-motion]) .m-accordion-collapse-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-accordion-collapse-leave-active {
-        transition: none;
-    }
-}
-
 [data-m-motion="reduced"] .m-accordion-collapse-enter-active,
 [data-m-motion="reduced"] .m-accordion-collapse-leave-active,
 [data-m-motion="none"] .m-accordion-collapse-enter-active,

package/dist/auto-complete/index.js

@@ -4,14 +4,15 @@ import { t as n } from "../useMotionTransition-Bxnnb_9u.js";
 import { n as ee, t as te } from "../overlay-oR-5MDuE.js";
 import { t as ne } from "../overlayPlacement-Cd20JTD_.js";
 import { t as re } from "../useFloatingViewportSync-DZdJ7W8n.js";
-import { t as ie } from "../useMId-BXFYayPP.js";
-import { t as ae } from "../Scrollbar-DTeJ8P5b.js";
-import { t as r } from "../useFieldFeedback-C5qIqYMK.js";
-import { t as i } from "../VirtualScroller-CHoFCmpP.js";
+import { t as r } from "../useMId-BXFYayPP.js";
+import { t as i } from "../Scrollbar-DTeJ8P5b.js";
+import { n as a } from "../filterByQuery-Bczaxzih.js";
+import { t as ie } from "../VirtualScroller-CHoFCmpP.js";
+import { t as ae } from "../useFieldFeedback-C5qIqYMK.js";
 import { c as oe, o as se } from "../config-CapALqt3.js";
 import { n as ce } from "../locale-Bzm2nbEp.js";
 import "./style.js";
-import { Fragment as le, Teleport as ue, Transition as de, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createTextVNode as u, createVNode as d, defineComponent as f, mergeProps as p, nextTick as m, normalizeClass as h, normalizeStyle as fe, onBeforeUnmount as pe, openBlock as g, ref as _, renderList as me, renderSlot as v, toDisplayString as y, unref as b, useAttrs as he, watch as x, withCtx as S, withModifiers as C } from "vue";
+import { Fragment as le, Teleport as ue, Transition as de, computed as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createTextVNode as d, createVNode as f, defineComponent as p, mergeProps as m, nextTick as h, normalizeClass as g, normalizeStyle as fe, onBeforeUnmount as pe, openBlock as _, ref as v, renderList as me, renderSlot as y, toDisplayString as b, unref as x, useAttrs as he, watch as S, withCtx as C, withModifiers as w } from "vue";
 //#region src/components/AutoComplete/AutoComplete.vue?vue&type=script&setup=true&lang.ts
 var ge = ["for"], _e = [
 	"id",
@@ -43,7 +44,7 @@ var ge = ["for"], _e = [
 	"aria-selected",
 	"onMouseenter",
 	"onMousedown"
-], Te = ["id", "role"], Ee = 80, w = /* @__PURE__ */ f({
+], Te = ["id", "role"], T = 80, E = /* @__PURE__ */ p({
 	inheritAttrs: !1,
 	__name: "AutoComplete",
 	props: {
@@ -99,180 +100,177 @@ var ge = ["for"], _e = [
 		"complete",
 		"clear"
 	],
-	setup(f, { emit: w }) {
-		let T = f, E = w, D = he(), { rootAttrs: O, controlAttrs: De } = e(D, () => T.pt), k = oe(), { transitionName: Oe, transitionCss: ke } = n({
+	setup(p, { emit: E }) {
+		let D = p, O = E, k = he(), { rootAttrs: Ee, controlAttrs: De } = e(k, () => D.pt), A = oe(), { transitionName: Oe, transitionCss: ke } = n({
 			role: "popup",
-			local: () => T.transition,
+			local: () => D.transition,
 			componentName: "AutoComplete",
 			fallback: "scale-fade"
-		}), A = ce(), j = se("AutoComplete", () => T.size), Ae = ie("m-autocomplete"), M = a(() => T.id ?? Ae), { isInvalid: N, feedbackText: P, feedbackIsError: F } = r(T), je = a(() => T.emptyMessage ?? A.value.emptyOptions), I = _(!1), L = _(null), R = _(null), z = _(null), B = _({}), V = _(-1), H = a(() => ee(T, k.value.appendTo)), U = a(() => te(T, k.value.appendTo));
+		}), j = ce(), M = se("AutoComplete", () => D.size), Ae = r("m-autocomplete"), N = o(() => D.id ?? Ae), { isInvalid: P, feedbackText: F, feedbackIsError: I } = ae(D), je = o(() => D.emptyMessage ?? j.value.emptyOptions), L = v(!1), R = v(null), z = v(null), B = v(null), V = v({}), H = v(-1), U = o(() => ee(D, A.value.appendTo)), W = o(() => te(D, A.value.appendTo));
 		function Me(e) {
 			return typeof e == "string" ? {
 				label: e,
 				value: e
 			} : e;
 		}
-		let W = a(() => T.suggestions.map(Me)), G = a(() => {
-			let e = (T.modelValue ?? "").trim().toLowerCase();
-			return e ? W.value.filter((t) => t.label.toLowerCase().includes(e) || t.value.toLowerCase().includes(e)) : W.value;
-		}), K = a(() => T.virtual === !1 ? !1 : T.virtual === !0 || G.value.length >= Ee), q = a(() => j.value === "small" ? 28 : j.value === "large" ? 40 : 34), Ne = a(() => Math.min(240, Math.max(q.value * 4, G.value.length * q.value))), J = _(null);
+		let Ne = o(() => D.suggestions.map(Me)), G = o(() => a(Ne.value, D.modelValue ?? "")), K = o(() => D.virtual === !1 ? !1 : D.virtual === !0 || G.value.length >= T), q = o(() => M.value === "small" ? 28 : M.value === "large" ? 40 : 34), Pe = o(() => Math.min(240, Math.max(q.value * 4, G.value.length * q.value))), J = v(null);
 		function Y(e) {
 			return e;
 		}
-		let Pe = a(() => T.clearable && !!T.modelValue && !T.disabled), Fe = a(() => [
+		let Fe = o(() => D.clearable && !!D.modelValue && !D.disabled), Ie = o(() => [
 			"m-autocomplete",
-			`m-autocomplete--${j.value}`,
+			`m-autocomplete--${M.value}`,
 			{
-				"m-autocomplete--disabled": T.disabled,
-				"m-autocomplete--open": I.value,
-				"m-autocomplete--loading": T.loading,
-				"m-autocomplete--invalid": N.value
+				"m-autocomplete--disabled": D.disabled,
+				"m-autocomplete--open": L.value,
+				"m-autocomplete--loading": D.loading,
+				"m-autocomplete--invalid": P.value
 			}
 		]);
 		function X() {
-			if (!U.value || !R.value) return;
-			let e = R.value.getBoundingClientRect(), t = `${e.width}px`;
-			B.value = ne(e, "bottom-start", {
+			if (!W.value || !z.value) return;
+			let e = z.value.getBoundingClientRect(), t = `${e.width}px`;
+			V.value = ne(e, "bottom-start", {
 				minWidth: t,
 				width: t
 			});
 		}
 		function Z(e, t = !1) {
-			E("complete", e), I.value = !0, V.value = t && G.value.length ? 0 : -1, m(() => X());
+			O("complete", e), L.value = !0, H.value = t && G.value.length ? 0 : -1, h(() => X());
 		}
-		function Ie(e) {
-			if (T.disabled) return;
+		function Le(e) {
+			if (D.disabled) return;
 			let t = e.target.value;
-			E("update:modelValue", t), Z(t);
+			O("update:modelValue", t), Z(t);
 		}
 		function Q(e) {
-			T.disabled || (E("update:modelValue", e.value), I.value = !1);
-		}
-		function Le() {
-			T.disabled || (E("update:modelValue", ""), E("clear"), Z(""));
+			D.disabled || (O("update:modelValue", e.value), L.value = !1);
 		}
 		function Re() {
-			if (!T.disabled) {
-				if (I.value) {
-					I.value = !1;
+			D.disabled || (O("update:modelValue", ""), O("clear"), Z(""));
+		}
+		function ze() {
+			if (!D.disabled) {
+				if (L.value) {
+					L.value = !1;
 					return;
 				}
-				Z(T.modelValue ?? "");
+				Z(D.modelValue ?? "");
 			}
 		}
-		function ze(e) {
-			if (!I.value && (e.key === "ArrowDown" || e.key === "Enter")) {
-				Z(T.modelValue ?? "", !0);
+		function Be(e) {
+			if (!L.value && (e.key === "ArrowDown" || e.key === "Enter")) {
+				Z(D.modelValue ?? "", !0);
 				return;
 			}
-			if (I.value) {
+			if (L.value) {
 				if (e.key === "Escape") {
-					I.value = !1;
+					L.value = !1;
 					return;
 				}
 				if (e.key === "ArrowDown" || e.key === "ArrowUp") {
 					e.preventDefault();
 					let t = G.value.length;
 					if (!t) return;
-					if (V.value < 0) V.value = e.key === "ArrowDown" ? 0 : t - 1;
+					if (H.value < 0) H.value = e.key === "ArrowDown" ? 0 : t - 1;
 					else {
 						let n = e.key === "ArrowDown" ? 1 : -1;
-						V.value = (V.value + n + t) % t;
+						H.value = (H.value + n + t) % t;
 					}
 				}
-				if (e.key === "Enter" && V.value >= 0) {
+				if (e.key === "Enter" && H.value >= 0) {
 					e.preventDefault();
-					let t = G.value[V.value];
+					let t = G.value[H.value];
 					t != null && Q(t);
 				}
 			}
 		}
 		function $(e) {
 			let t = e.target;
-			L.value?.contains(t) || z.value?.contains(t) || (I.value = !1);
+			R.value?.contains(t) || B.value?.contains(t) || (L.value = !1);
 		}
-		function Be() {
-			I.value && X();
+		function Ve() {
+			L.value && X();
 		}
-		re(() => I.value && U.value, Be), x(V, (e) => {
+		re(() => L.value && W.value, Ve), S(H, (e) => {
 			!K.value || e < 0 || J.value?.scrollToIndex(e);
-		}), x(I, async (e) => {
-			e ? (document.addEventListener("click", $), await m(), X()) : document.removeEventListener("click", $);
-		}), x(G, (e) => {
-			e.length ? V.value >= e.length && (V.value = 0) : V.value = -1;
+		}), S(L, async (e) => {
+			e ? (document.addEventListener("click", $), await h(), X()) : document.removeEventListener("click", $);
+		}), S(G, (e) => {
+			e.length ? H.value >= e.length && (H.value = 0) : H.value = -1;
 		}), pe(() => {
 			document.removeEventListener("click", $);
 		});
-		let Ve = a(() => I.value);
-		return (e, n) => (g(), c("div", p({
+		let He = o(() => L.value);
+		return (e, n) => (_(), l("div", m({
 			ref_key: "root",
-			ref: L
-		}, b(O), { class: "m-select-field" }), [
-			f.label ? (g(), c("label", {
+			ref: R
+		}, x(Ee), { class: "m-select-field" }), [
+			p.label ? (_(), l("label", {
 				key: 0,
 				class: "m-select-field__label",
-				for: M.value
-			}, y(f.label), 9, ge)) : s("", !0),
-			l("div", { class: h(Fe.value) }, [l("div", {
+				for: N.value
+			}, b(p.label), 9, ge)) : c("", !0),
+			u("div", { class: g(Ie.value) }, [u("div", {
 				ref_key: "trigger",
-				ref: R,
+				ref: z,
 				class: "m-autocomplete__control"
 			}, [
-				l("input", p(b(De), {
-					id: M.value,
+				u("input", m(x(De), {
+					id: N.value,
 					class: "m-autocomplete__input",
 					type: "text",
 					role: "combobox",
-					value: f.modelValue,
-					placeholder: f.placeholder,
-					name: f.name,
-					autocomplete: f.autocomplete,
-					autofocus: f.autofocus || void 0,
-					disabled: f.disabled,
-					"aria-expanded": I.value,
-					"aria-busy": f.loading || void 0,
-					"aria-invalid": b(N) || void 0,
-					"aria-describedby": b(P) ? `${M.value}-help` : void 0,
+					value: p.modelValue,
+					placeholder: p.placeholder,
+					name: p.name,
+					autocomplete: p.autocomplete,
+					autofocus: p.autofocus || void 0,
+					disabled: p.disabled,
+					"aria-expanded": L.value,
+					"aria-busy": p.loading || void 0,
+					"aria-invalid": x(P) || void 0,
+					"aria-describedby": x(F) ? `${N.value}-help` : void 0,
 					"aria-autocomplete": "list",
-					onInput: Ie,
-					onKeydown: ze,
-					onFocus: n[0] ||= (e) => Z(f.modelValue ?? "")
+					onInput: Le,
+					onKeydown: Be,
+					onFocus: n[0] ||= (e) => Z(p.modelValue ?? "")
 				}), null, 16, _e),
-				f.loading ? (g(), c("span", ve)) : Pe.value ? (g(), c("button", {
+				p.loading ? (_(), l("span", ve)) : Fe.value ? (_(), l("button", {
 					key: 1,
 					type: "button",
 					class: "m-autocomplete__clear",
-					"aria-label": b(A).clearInput,
-					onClick: Le
-				}, [d(t, {
+					"aria-label": x(j).clearInput,
+					onClick: Re
+				}, [f(t, {
 					name: "close",
 					size: "sm"
-				})], 8, ye)) : s("", !0),
-				f.dropdown ? (g(), c("button", {
+				})], 8, ye)) : c("", !0),
+				p.dropdown ? (_(), l("button", {
 					key: 2,
 					type: "button",
 					class: "m-autocomplete__dropdown",
-					"aria-label": b(A).showSuggestions,
-					disabled: f.disabled,
-					onClick: Re
-				}, [d(t, {
+					"aria-label": x(j).showSuggestions,
+					disabled: p.disabled,
+					onClick: ze
+				}, [f(t, {
 					name: "chevron-down",
 					size: "sm"
-				})], 8, be)) : s("", !0)
-			], 512), (g(), o(ue, {
-				to: H.value.to,
-				disabled: H.value.disabled
-			}, [d(de, {
-				name: b(Oe),
-				css: b(ke)
+				})], 8, be)) : c("", !0)
+			], 512), (_(), s(ue, {
+				to: U.value.to,
+				disabled: U.value.disabled
+			}, [f(de, {
+				name: x(Oe),
+				css: x(ke)
 			}, {
-				default: S(() => [Ve.value ? (g(), c("div", {
+				default: C(() => [He.value ? (_(), l("div", {
 					key: 0,
 					ref_key: "panel",
-					ref: z,
-					class: h(["m-autocomplete__panel", { "m-autocomplete__panel--teleported": U.value }]),
-					style: fe(U.value ? B.value : void 0)
-				}, [K.value && G.value.length && !f.loading ? (g(), o(i, {
+					ref: B,
+					class: g(["m-autocomplete__panel", { "m-autocomplete__panel--teleported": W.value }]),
+					style: fe(W.value ? V.value : void 0)
+				}, [K.value && G.value.length && !p.loading ? (_(), s(ie, {
 					key: 0,
 					ref_key: "virtualList",
 					ref: J,
@@ -280,22 +278,22 @@ var ge = ["for"], _e = [
 					role: "listbox",
 					items: G.value,
 					"item-size": q.value,
-					height: Ne.value,
+					height: Pe.value,
 					buffer: 4
 				}, {
-					item: S(({ item: t, index: n }) => [l("div", {
-						class: h(["m-autocomplete__item", { "m-autocomplete__item--active": n === V.value }]),
+					item: C(({ item: t, index: n }) => [u("div", {
+						class: g(["m-autocomplete__item", { "m-autocomplete__item--active": n === H.value }]),
 						role: "option",
-						"aria-selected": n === V.value,
-						onMouseenter: (e) => V.value = n,
-						onMousedown: C((e) => Q(Y(t)), ["prevent"])
-					}, [v(e.$slots, "item", { option: Y(t) }, () => [u(y(Y(t).label), 1)])], 42, xe)]),
+						"aria-selected": n === H.value,
+						onMouseenter: (e) => H.value = n,
+						onMousedown: w((e) => Q(Y(t)), ["prevent"])
+					}, [y(e.$slots, "item", { option: Y(t) }, () => [d(b(Y(t).label), 1)])], 42, xe)]),
 					_: 3
 				}, 8, [
 					"items",
 					"item-size",
 					"height"
-				])) : (g(), o(ae, {
+				])) : (_(), s(i, {
 					key: 1,
 					tag: "ul",
 					role: "listbox",
@@ -303,26 +301,26 @@ var ge = ["for"], _e = [
 					"fit-content": "",
 					"view-class": "m-autocomplete__panel-list"
 				}, {
-					default: S(() => [f.loading && !G.value.length ? (g(), c("li", Se, y(b(A).loading), 1)) : G.value.length ? s("", !0) : (g(), c("li", Ce, [v(e.$slots, "empty", {}, () => [u(y(je.value), 1)])])), (g(!0), c(le, null, me(G.value, (t, n) => (g(), c("li", {
+					default: C(() => [p.loading && !G.value.length ? (_(), l("li", Se, b(x(j).loading), 1)) : G.value.length ? c("", !0) : (_(), l("li", Ce, [y(e.$slots, "empty", {}, () => [d(b(je.value), 1)])])), (_(!0), l(le, null, me(G.value, (t, n) => (_(), l("li", {
 						key: `${t.value}-${n}`,
-						class: h(["m-autocomplete__item", { "m-autocomplete__item--active": n === V.value }]),
+						class: g(["m-autocomplete__item", { "m-autocomplete__item--active": n === H.value }]),
 						role: "option",
-						"aria-selected": n === V.value,
-						onMouseenter: (e) => V.value = n,
-						onMousedown: C((e) => Q(t), ["prevent"])
-					}, [v(e.$slots, "item", { option: t }, () => [u(y(t.label), 1)])], 42, we))), 128))]),
+						"aria-selected": n === H.value,
+						onMouseenter: (e) => H.value = n,
+						onMousedown: w((e) => Q(t), ["prevent"])
+					}, [y(e.$slots, "item", { option: t }, () => [d(b(t.label), 1)])], 42, we))), 128))]),
 					_: 3
-				}))], 6)) : s("", !0)]),
+				}))], 6)) : c("", !0)]),
 				_: 3
 			}, 8, ["name", "css"])], 8, ["to", "disabled"]))], 2),
-			b(P) ? (g(), c("span", {
+			x(F) ? (_(), l("span", {
 				key: 1,
-				id: `${M.value}-help`,
-				class: h(["m-select-field__help", { "m-select-field__help--invalid": b(F) }]),
-				role: b(F) ? "alert" : void 0
-			}, y(b(P)), 11, Te)) : s("", !0)
+				id: `${N.value}-help`,
+				class: g(["m-select-field__help", { "m-select-field__help--invalid": x(I) }]),
+				role: x(I) ? "alert" : void 0
+			}, b(x(F)), 11, Te)) : c("", !0)
 		], 16));
 	}
 });
 //#endregion
-export { w as MAutoComplete };
+export { E as MAutoComplete };

package/dist/auto-complete/style.css

@@ -50,6 +50,10 @@
     --m-font-size-sm: 0.8125rem;
     --m-font-size-md: 0.875rem;
     --m-font-size-lg: 1.125rem;
+    /* Display scale (page titles, KPI figures) */
+    --m-font-size-xl: 1.25rem;
+    --m-font-size-2xl: 1.5rem;
+    --m-font-size-3xl: 1.75rem;
     --m-opacity-disabled: 0.55;
     /* Layering: override --m-z-base via ConfigProvider / createMoryaUI */
     --m-z-base: 1000;
@@ -192,20 +196,10 @@
 
 /*
  * Global motion policy (complements per-component rules):
- * - `reduced` / OS prefers-reduced-motion: keep short paint transitions; stop loops
+ * - `reduced`: keep short paint transitions; stop loops
  *   and layout/transform size animation.
  * - `none`: zero all transition/animation durations.
  */
-@media (prefers-reduced-motion: reduce) {
-    html:not([data-m-ignore-reduced-motion]) *,
-    html:not([data-m-ignore-reduced-motion]) *::before,
-    html:not([data-m-ignore-reduced-motion]) *::after {
-        animation-duration: 0.01ms !important;
-        animation-iteration-count: 1 !important;
-        transition-property: background-color, border-color, color, opacity, box-shadow,
-            outline, fill, stroke, stroke-dashoffset !important;
-    }
-}
 
 [data-m-motion="reduced"] *,
 [data-m-motion="reduced"] *::before,
@@ -615,7 +609,7 @@
 .m-zoom-enter-from,
 .m-zoom-leave-to {
     opacity: 0;
-    transform: scale(0.9);
+    transform: scale(0.95);
 }
 
 .m-slide-up-enter-active,
@@ -660,44 +654,6 @@
     transform: translateX(calc(var(--m-motion-distance) * -1));
 }
 
-@media (prefers-reduced-motion: reduce) {
-    html:not([data-m-ignore-reduced-motion]) .m-fade-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-fade-leave-active,
-    html:not([data-m-ignore-reduced-motion]) .m-scale-fade-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-scale-fade-leave-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-fade-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-fade-leave-active,
-    html:not([data-m-ignore-reduced-motion]) .m-zoom-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-zoom-leave-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-up-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-up-leave-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-down-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-down-leave-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-left-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-left-leave-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-right-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-right-leave-active {
-        transition: none;
-    }
-
-    html:not([data-m-ignore-reduced-motion]) .m-scale-fade-enter-from,
-    html:not([data-m-ignore-reduced-motion]) .m-scale-fade-leave-to,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-fade-enter-from,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-fade-leave-to,
-    html:not([data-m-ignore-reduced-motion]) .m-zoom-enter-from,
-    html:not([data-m-ignore-reduced-motion]) .m-zoom-leave-to,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-up-enter-from,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-up-leave-to,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-down-enter-from,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-down-leave-to,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-left-enter-from,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-left-leave-to,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-right-enter-from,
-    html:not([data-m-ignore-reduced-motion]) .m-slide-right-leave-to {
-        transform: none;
-    }
-}
-
 [data-m-motion="reduced"] .m-fade-enter-active,
 [data-m-motion="reduced"] .m-fade-leave-active,
 [data-m-motion="reduced"] .m-scale-fade-enter-active,
@@ -1192,17 +1148,6 @@
     animation: none !important;
 }
 
-@media (prefers-reduced-motion: reduce) {
-    html:not([data-m-ignore-reduced-motion]) *,
-    html:not([data-m-ignore-reduced-motion]) *::before,
-    html:not([data-m-ignore-reduced-motion]) *::after {
-        animation-duration: 0.01ms !important;
-        animation-iteration-count: 1 !important;
-        scroll-behavior: auto !important;
-        transition-duration: 0.01ms !important;
-    }
-}
-
 /* Shared floating option-list chrome for form select-likes. */
 
 .m-select__menu,
@@ -1423,12 +1368,6 @@
     }
 }
 
-@media (prefers-reduced-motion: reduce) {
-    html:not([data-m-ignore-reduced-motion]) .m-icon--spin svg {
-        animation: none;
-    }
-}
-
 :root[data-m-motion='none'] .m-icon--spin svg,
 :root[data-m-motion='reduced'] .m-icon--spin svg {
     animation: none;
@@ -1558,14 +1497,6 @@
     opacity: 0;
 }
 
-@media (prefers-reduced-motion: reduce) {
-    html:not([data-m-ignore-reduced-motion]) .m-scrollbar__thumb,
-    html:not([data-m-ignore-reduced-motion]) .m-scrollbar-fade-enter-active,
-    html:not([data-m-ignore-reduced-motion]) .m-scrollbar-fade-leave-active {
-        transition: none;
-    }
-}
-
 :root[data-m-motion='none'] .m-scrollbar__thumb,
 :root[data-m-motion='none'] .m-scrollbar-fade-enter-active,
 :root[data-m-motion='none'] .m-scrollbar-fade-leave-active,
@@ -1764,13 +1695,6 @@
     width: var(--m-autocomplete-spinner-size);
 }
 
-@media (prefers-reduced-motion: reduce) {
-    html:not([data-m-ignore-reduced-motion]) .m-autocomplete__spinner {
-        animation: none;
-        border-top-color: var(--m-color-text-muted);
-    }
-}
-
 [data-m-motion="reduced"] .m-autocomplete__spinner {
     animation: none;
     border-top-color: var(--m-color-text-muted);