morya-ui 0.4.5 → 0.5.1

package/dist/space/style.css

@@ -405,7 +405,7 @@
 
 :root {
     /* Shared minimum width for menu-like panels (select/orderlist/picklist) */
-    --m-menu-min-width: 12rem;
+    --m-overlay-menu-min-width: 12rem;
 }
 
 .m-button,
@@ -463,7 +463,7 @@
 .m-progress-spinner,
 .m-cascadeselect,
 .m-treeselect,
-.m-inputcolor,
+.m-colorpicker,
 .m-inputtags,
 .m-label,
 .m-speeddial,
@@ -489,8 +489,7 @@
 .m-password__input:disabled,
 .m-inputnumber__input:disabled,
 .m-inputotp__input:disabled,
-.m-inputcolor__text:disabled,
-.m-inputcolor__swatch:disabled,
+.m-colorpicker__trigger:disabled,
 .m-inputtags--disabled {
     background-color: var(--m-color-bg-disabled);
     color: var(--m-color-text-disabled);
@@ -513,8 +512,7 @@
 .m-textarea::placeholder,
 .m-password__input::placeholder,
 .m-inputnumber__input::placeholder,
-.m-inputtags__input::placeholder,
-.m-inputcolor__text::placeholder {
+.m-inputtags__input::placeholder {
     color: var(--m-color-text-muted);
     opacity: 1;
 }
@@ -858,9 +856,7 @@
     font-family: var(--m-font-sans);
     gap: var(--m-space-2);
     max-width: 100%;
-    min-width: var(--m-menu-min-width);
     position: relative;
-    width: fit-content;
 }
 
 .m-textarea-field--fluid,
@@ -1051,7 +1047,7 @@
     flex: 1;
     max-height: 16rem;
     min-height: 12rem;
-    min-width: var(--m-menu-min-width);
+    min-width: var(--m-overlay-menu-min-width);
 }
 
 .m-orderlist__list,
@@ -1119,7 +1115,6 @@
     .m-cascadeselect__trigger:hover:not(:disabled):not(:focus):not(:focus-visible),
 .m-treeselect:not(.m-treeselect--open)
     .m-treeselect__trigger:hover:not(:disabled):not(:focus):not(:focus-visible),
-.m-inputcolor__text:hover:not(:disabled):not(:focus),
 .m-inputtags:hover:not(.m-inputtags--disabled):not(:focus-within),
 .m-togglebutton:hover:not(:disabled):not(.m-togglebutton--checked):not(:focus-visible),
 .m-inplace__display:hover:not(:focus-visible) {
@@ -1134,8 +1129,6 @@
 .m-treeselect--open .m-treeselect__trigger,
 .m-treeselect__trigger:focus,
 .m-treeselect__trigger:focus-visible,
-.m-inputcolor__text:focus,
-.m-inputcolor__text:focus-visible,
 .m-inputtags:focus-within,
 .m-togglebutton:focus-visible,
 .m-selectbutton__button:focus-visible,
@@ -1150,9 +1143,7 @@
 
 .m-inputotp--invalid .m-inputotp__input:focus,
 .m-inputotp--invalid .m-inputotp__input:focus-visible,
-.m-inputtags--invalid:focus-within,
-.m-inputcolor--invalid .m-inputcolor__text:focus,
-.m-inputcolor--invalid .m-inputcolor__text:focus-visible {
+.m-inputtags--invalid:focus-within {
     border-color: var(--m-color-danger);
     box-shadow: var(--m-focus-shadow-danger);
 }

package/dist/speed-dial/index.js

@@ -1,32 +1,32 @@
 import { a as e } from "../useComponentAttrs-e-5QAjdw.js";
 import { n as t, t as n } from "../overlay-oR-5MDuE.js";
-import { t as ee } from "../overlayPlacement-qwEJPVS4.js";
-import { t as r } from "../useFloatingViewportSync-wLLKIGUA.js";
+import { t as r } from "../overlayPlacement-qwEJPVS4.js";
+import { t as ee } from "../useFloatingViewportSync-wLLKIGUA.js";
 import { t as te } from "../useMId-BXFYayPP.js";
 import { t as ne } from "../useMotionTransition-DohkfWRB.js";
 import { t as i } from "../Icon-CmHjx7W8.js";
 import { t as re } from "../useMenuKeyboard-BedmYE4W.js";
-import { t as a } from "../icon-H8prbteT.js";
-import { l as o } from "../config-Cd20zAyW.js";
-import { n as ie } from "../locale-BcxMPufl.js";
+import { n as a, t as o } from "../icon-CUrSaD8r.js";
+import { l as ie } from "../config-Cd20zAyW.js";
+import { n as ae } from "../locale-BcxMPufl.js";
 import "./style.js";
-import { Fragment as ae, Teleport as s, Transition as c, computed as l, createBlock as oe, createCommentVNode as u, createElementBlock as d, createElementVNode as f, createVNode as p, defineComponent as m, mergeProps as se, nextTick as h, normalizeClass as g, normalizeStyle as ce, onBeforeUnmount as _, openBlock as v, ref as y, renderList as b, renderSlot as x, toDisplayString as le, unref as S, useAttrs as ue, watch as C, withCtx as de } from "vue";
+import { Fragment as oe, Teleport as s, Transition as c, computed as l, createBlock as u, createCommentVNode as d, createElementBlock as f, createElementVNode as p, createVNode as m, defineComponent as h, mergeProps as se, nextTick as ce, normalizeClass as le, normalizeStyle as g, onBeforeUnmount as _, openBlock as v, ref as y, renderList as ue, renderSlot as b, resolveDynamicComponent as de, toDisplayString as fe, unref as x, useAttrs as pe, watch as S, withCtx as me } from "vue";
 //#region src/components/SpeedDial/SpeedDial.vue?vue&type=script&setup=true&lang.ts
-var fe = ["id"], w = [
+var he = ["id"], C = [
 	"title",
 	"aria-label",
 	"disabled",
 	"tabindex",
 	"onClick"
-], T = {
+], w = {
 	key: 0,
 	"aria-hidden": "true"
-}, E = { class: "m-speeddial__action-label" }, D = [
+}, T = { class: "m-speeddial__action-label" }, E = [
 	"aria-label",
 	"aria-expanded",
 	"aria-controls",
 	"disabled"
-], O = /* @__PURE__ */ m({
+], D = /* @__PURE__ */ h({
 	inheritAttrs: !1,
 	__name: "SpeedDial",
 	props: {
@@ -55,157 +55,164 @@ var fe = ["id"], w = [
 		}
 	},
 	emits: ["update:modelValue", "item-click"],
-	setup(m, { emit: O }) {
-		let k = m, A = O, j = ue(), { rootAttrs: M } = e(j, () => k.pt), N = o(), { transitionName: P, transitionCss: F } = ne({
+	setup(h, { emit: D }) {
+		let O = h, k = D, A = pe(), { rootAttrs: j } = e(A, () => O.pt), M = ie(), { transitionName: N, transitionCss: P } = ne({
 			role: "popup",
-			local: () => k.transition,
+			local: () => O.transition,
 			componentName: "SpeedDial",
 			fallback: "scale-fade"
-		}), I = ie(), L = l(() => k.ariaLabel ?? I.value.speedDial), R = y(null), z = y(null), B = y(null), V = y({}), H = te("m-speeddial-list"), U = l(() => t(k, N.value.appendTo)), W = l(() => n(k, N.value.appendTo)), pe = l(() => [
+		}), F = ae(), I = l(() => O.ariaLabel ?? F.value.speedDial), L = y(null), R = y(null), z = y(null), B = y({}), V = te("m-speeddial-list"), H = l(() => t(O, M.value.appendTo)), U = l(() => n(O, M.value.appendTo)), ge = l(() => [
 			"m-speeddial",
-			`m-speeddial--${k.direction}`,
-			`m-speeddial--${k.shape}`,
-			`m-speeddial--${k.type}`,
+			`m-speeddial--${O.direction}`,
+			`m-speeddial--${O.shape}`,
+			`m-speeddial--${O.type}`,
 			{
-				"m-speeddial--open": k.modelValue,
-				"m-speeddial--disabled": k.disabled
+				"m-speeddial--open": O.modelValue,
+				"m-speeddial--disabled": O.disabled
 			}
 		]);
-		function G() {
-			if (!W.value || !z.value) return;
-			let e = z.value.getBoundingClientRect(), t = k.direction === "up" ? "top" : k.direction === "down" ? "bottom" : k.direction === "left" ? "left" : "right";
-			V.value = ee(e, t);
+		function W() {
+			if (!U.value || !R.value) return;
+			let e = R.value.getBoundingClientRect(), t = O.direction === "up" ? "top" : O.direction === "down" ? "bottom" : O.direction === "left" ? "left" : "right";
+			B.value = r(e, t);
 		}
-		let K = re({
-			itemCount: () => k.model.length,
-			isItemDisabled: (e) => !!k.model[e]?.disabled,
-			enabled: () => k.modelValue
+		let G = re({
+			itemCount: () => O.model.length,
+			isItemDisabled: (e) => !!O.model[e]?.disabled,
+			enabled: () => O.modelValue
 		});
-		function q(e = !1) {
-			A("update:modelValue", !1), e && z.value?.focus({ preventScroll: !0 });
+		function K(e = !1) {
+			k("update:modelValue", !1), e && R.value?.focus({ preventScroll: !0 });
 		}
-		function J() {
-			let e = K.activeIndex.value;
-			e < 0 || B.value?.querySelectorAll(".m-speeddial__action")[e]?.focus({ preventScroll: !0 });
+		function q() {
+			let e = G.activeIndex.value;
+			e < 0 || z.value?.querySelectorAll(".m-speeddial__action")[e]?.focus({ preventScroll: !0 });
 		}
-		function me(e) {
-			return k.direction === "up" || k.direction === "down" ? e === "ArrowUp" ? k.direction === "up" ? 1 : -1 : e === "ArrowDown" ? k.direction === "up" ? -1 : 1 : null : e === "ArrowLeft" ? k.direction === "left" ? 1 : -1 : e === "ArrowRight" ? k.direction === "left" ? -1 : 1 : null;
+		function _e(e) {
+			return O.direction === "up" || O.direction === "down" ? e === "ArrowUp" ? O.direction === "up" ? 1 : -1 : e === "ArrowDown" ? O.direction === "up" ? -1 : 1 : null : e === "ArrowLeft" ? O.direction === "left" ? 1 : -1 : e === "ArrowRight" ? O.direction === "left" ? -1 : 1 : null;
 		}
-		function Y(e) {
-			if (!k.modelValue) return;
+		function J(e) {
+			if (!O.modelValue) return;
 			if (e.key === "Escape") {
-				e.preventDefault(), q(!0);
+				e.preventDefault(), K(!0);
 				return;
 			}
-			let t = me(e.key);
+			let t = _e(e.key);
 			if (t !== null) {
-				e.preventDefault(), K.move(t);
+				e.preventDefault(), G.move(t);
 				return;
 			}
 			if (e.key === "Home") {
-				e.preventDefault(), K.moveFirst();
+				e.preventDefault(), G.moveFirst();
 				return;
 			}
 			if (e.key === "End") {
-				e.preventDefault(), K.moveLast();
+				e.preventDefault(), G.moveLast();
 				return;
 			}
 			if (e.key === "Enter" || e.key === " ") {
-				let t = K.activeIndex.value, n = k.model[t];
-				n && !n.disabled && (e.preventDefault(), X(n));
+				let t = G.activeIndex.value, n = O.model[t];
+				n && !n.disabled && (e.preventDefault(), Y(n));
 			}
 		}
-		function he(e) {
-			if (!k.disabled) {
-				if (!k.modelValue) {
-					e.key.startsWith("Arrow") && (e.preventDefault(), A("update:modelValue", !0));
+		function ve(e) {
+			if (!O.disabled) {
+				if (!O.modelValue) {
+					e.key.startsWith("Arrow") && (e.preventDefault(), k("update:modelValue", !0));
 					return;
 				}
-				Y(e);
+				J(e);
 			}
 		}
-		function ge() {
-			k.disabled || A("update:modelValue", !k.modelValue);
+		function ye() {
+			O.disabled || k("update:modelValue", !O.modelValue);
+		}
+		function Y(e) {
+			O.disabled || e.disabled || (e.command?.(), k("item-click", e), K(!0));
 		}
 		function X(e) {
-			k.disabled || e.disabled || (e.command?.(), A("item-click", e), q(!0));
+			return typeof e.icon == "string" ? o(e.icon) : void 0;
 		}
 		function Z(e) {
 			return a(e.icon);
 		}
-		function _e() {
-			k.modelValue && G();
+		function be(e) {
+			return !!(X(e) || Z(e));
+		}
+		function xe() {
+			O.modelValue && W();
 		}
 		function Q(e) {
 			let t = e.target;
-			R.value?.contains(t) || B.value?.contains(t) || q();
+			L.value?.contains(t) || z.value?.contains(t) || K();
 		}
 		function $(e) {
 			let t = e.target;
-			R.value?.contains(t) || B.value?.contains(t) || q();
+			L.value?.contains(t) || z.value?.contains(t) || K();
 		}
-		return C(K.activeIndex, () => {
-			k.modelValue && J();
-		}), r(() => k.modelValue && W.value, _e), C(() => k.modelValue, (e) => {
-			e ? (h(() => {
-				G(), K.moveFirst(), J();
-			}), document.addEventListener("click", Q), document.addEventListener("focusin", $)) : (K.reset(), document.removeEventListener("click", Q), document.removeEventListener("focusin", $));
+		return S(G.activeIndex, () => {
+			O.modelValue && q();
+		}), ee(() => O.modelValue && U.value, xe), S(() => O.modelValue, (e) => {
+			e ? (ce(() => {
+				W(), G.moveFirst(), q();
+			}), document.addEventListener("click", Q), document.addEventListener("focusin", $)) : (G.reset(), document.removeEventListener("click", Q), document.removeEventListener("focusin", $));
 		}, { immediate: !0 }), _(() => {
 			document.removeEventListener("click", Q), document.removeEventListener("focusin", $);
-		}), (e, t) => (v(), d("div", se(S(M), {
+		}), (e, t) => (v(), f("div", se(x(j), {
 			ref_key: "root",
-			ref: R,
-			class: pe.value
-		}), [(v(), oe(s, {
-			to: U.value.to,
-			disabled: U.value.disabled
-		}, [p(c, {
-			name: S(P),
-			css: S(F)
+			ref: L,
+			class: ge.value
+		}), [(v(), u(s, {
+			to: H.value.to,
+			disabled: H.value.disabled
+		}, [m(c, {
+			name: x(N),
+			css: x(P)
 		}, {
-			default: de(() => [m.modelValue ? (v(), d("ul", {
+			default: me(() => [h.modelValue ? (v(), f("ul", {
 				key: 0,
-				id: S(H),
+				id: x(V),
 				ref_key: "list",
-				ref: B,
-				class: g(["m-speeddial__list", { "m-speeddial__list--teleported": W.value }]),
-				style: ce(W.value ? V.value : void 0),
+				ref: z,
+				class: le(["m-speeddial__list", { "m-speeddial__list--teleported": U.value }]),
+				style: g(U.value ? B.value : void 0),
 				role: "menu",
-				onKeydown: Y
-			}, [(v(!0), d(ae, null, b(m.model, (t, n) => (v(), d("li", {
+				onKeydown: J
+			}, [(v(!0), f(oe, null, ue(h.model, (t, n) => (v(), f("li", {
 				key: `${t.label}-${n}`,
 				role: "none"
-			}, [f("button", {
+			}, [p("button", {
 				type: "button",
 				class: "m-speeddial__action",
 				role: "menuitem",
 				title: t.label,
 				"aria-label": t.label,
 				disabled: t.disabled,
-				tabindex: S(K).tabindexFor(n),
-				onClick: (e) => X(t)
-			}, [x(e.$slots, "item", { item: t }, () => [Z(t) ? (v(), d("span", T, [p(i, {
-				name: Z(t),
+				tabindex: x(G).tabindexFor(n),
+				onClick: (e) => Y(t)
+			}, [b(e.$slots, "item", { item: t }, () => [be(t) ? (v(), f("span", w, [X(t) ? (v(), u(i, {
+				key: 0,
+				name: X(t),
 				size: "sm"
-			}, null, 8, ["name"])])) : u("", !0), f("span", E, le(t.label), 1)])], 8, w)]))), 128))], 46, fe)) : u("", !0)]),
+			}, null, 8, ["name"])) : Z(t) ? (v(), u(de(Z(t)), { key: 1 })) : d("", !0)])) : d("", !0), p("span", T, fe(t.label), 1)])], 8, C)]))), 128))], 46, he)) : d("", !0)]),
 			_: 3
-		}, 8, ["name", "css"])], 8, ["to", "disabled"])), x(e.$slots, "button", {}, () => [f("button", {
+		}, 8, ["name", "css"])], 8, ["to", "disabled"])), b(e.$slots, "button", {}, () => [p("button", {
 			ref_key: "button",
-			ref: z,
+			ref: R,
 			type: "button",
 			class: "m-speeddial__button",
-			"aria-label": L.value,
-			"aria-expanded": m.modelValue,
-			"aria-controls": m.modelValue ? S(H) : void 0,
+			"aria-label": I.value,
+			"aria-expanded": h.modelValue,
+			"aria-controls": h.modelValue ? x(V) : void 0,
 			"aria-haspopup": "menu",
-			disabled: m.disabled,
-			onClick: ge,
-			onKeydown: he
-		}, [x(e.$slots, "icon", {}, () => [p(i, {
+			disabled: h.disabled,
+			onClick: ye,
+			onKeydown: ve
+		}, [b(e.$slots, "icon", {}, () => [m(i, {
 			name: "plus",
 			size: "sm"
-		})])], 40, D)])], 16));
+		})])], 40, E)])], 16));
 	}
 });
 //#endregion
-export { O as MSpeedDial };
+export { D as MSpeedDial };

package/dist/speed-dial/style.css

@@ -405,7 +405,7 @@
 
 :root {
     /* Shared minimum width for menu-like panels (select/orderlist/picklist) */
-    --m-menu-min-width: 12rem;
+    --m-overlay-menu-min-width: 12rem;
 }
 
 .m-button,
@@ -463,7 +463,7 @@
 .m-progress-spinner,
 .m-cascadeselect,
 .m-treeselect,
-.m-inputcolor,
+.m-colorpicker,
 .m-inputtags,
 .m-label,
 .m-speeddial,
@@ -489,8 +489,7 @@
 .m-password__input:disabled,
 .m-inputnumber__input:disabled,
 .m-inputotp__input:disabled,
-.m-inputcolor__text:disabled,
-.m-inputcolor__swatch:disabled,
+.m-colorpicker__trigger:disabled,
 .m-inputtags--disabled {
     background-color: var(--m-color-bg-disabled);
     color: var(--m-color-text-disabled);
@@ -513,8 +512,7 @@
 .m-textarea::placeholder,
 .m-password__input::placeholder,
 .m-inputnumber__input::placeholder,
-.m-inputtags__input::placeholder,
-.m-inputcolor__text::placeholder {
+.m-inputtags__input::placeholder {
     color: var(--m-color-text-muted);
     opacity: 1;
 }
@@ -858,9 +856,7 @@
     font-family: var(--m-font-sans);
     gap: var(--m-space-2);
     max-width: 100%;
-    min-width: var(--m-menu-min-width);
     position: relative;
-    width: fit-content;
 }
 
 .m-textarea-field--fluid,
@@ -1051,7 +1047,7 @@
     flex: 1;
     max-height: 16rem;
     min-height: 12rem;
-    min-width: var(--m-menu-min-width);
+    min-width: var(--m-overlay-menu-min-width);
 }
 
 .m-orderlist__list,
@@ -1119,7 +1115,6 @@
     .m-cascadeselect__trigger:hover:not(:disabled):not(:focus):not(:focus-visible),
 .m-treeselect:not(.m-treeselect--open)
     .m-treeselect__trigger:hover:not(:disabled):not(:focus):not(:focus-visible),
-.m-inputcolor__text:hover:not(:disabled):not(:focus),
 .m-inputtags:hover:not(.m-inputtags--disabled):not(:focus-within),
 .m-togglebutton:hover:not(:disabled):not(.m-togglebutton--checked):not(:focus-visible),
 .m-inplace__display:hover:not(:focus-visible) {
@@ -1134,8 +1129,6 @@
 .m-treeselect--open .m-treeselect__trigger,
 .m-treeselect__trigger:focus,
 .m-treeselect__trigger:focus-visible,
-.m-inputcolor__text:focus,
-.m-inputcolor__text:focus-visible,
 .m-inputtags:focus-within,
 .m-togglebutton:focus-visible,
 .m-selectbutton__button:focus-visible,
@@ -1150,9 +1143,7 @@
 
 .m-inputotp--invalid .m-inputotp__input:focus,
 .m-inputotp--invalid .m-inputotp__input:focus-visible,
-.m-inputtags--invalid:focus-within,
-.m-inputcolor--invalid .m-inputcolor__text:focus,
-.m-inputcolor--invalid .m-inputcolor__text:focus-visible {
+.m-inputtags--invalid:focus-within {
     border-color: var(--m-color-danger);
     box-shadow: var(--m-focus-shadow-danger);
 }

package/dist/split-button/index.js

@@ -98,9 +98,9 @@ var _e = ["disabled"], S = {
 		function xe(e) {
 			D.disabled || O("click", e);
 		}
-		function X() {
+		function X(e = !1) {
 			F.value = !0, g(() => {
-				q(), J.moveFirst(), Y();
+				q(), e ? (J.moveFirst(), Y()) : J.reset();
 			});
 		}
 		function Se() {
@@ -115,7 +115,7 @@ var _e = ["disabled"], S = {
 		function Ce(e) {
 			if (!D.disabled) {
 				if (!F.value) {
-					(e.key === "ArrowDown" || e.key === "ArrowUp") && (e.preventDefault(), X());
+					(e.key === "ArrowDown" || e.key === "ArrowUp") && (e.preventDefault(), X(!0));
 					return;
 				}
 				J.onKeydown(e);

package/dist/split-button/style.css

@@ -405,7 +405,7 @@
 
 :root {
     /* Shared minimum width for menu-like panels (select/orderlist/picklist) */
-    --m-menu-min-width: 12rem;
+    --m-overlay-menu-min-width: 12rem;
 }
 
 .m-button,
@@ -463,7 +463,7 @@
 .m-progress-spinner,
 .m-cascadeselect,
 .m-treeselect,
-.m-inputcolor,
+.m-colorpicker,
 .m-inputtags,
 .m-label,
 .m-speeddial,
@@ -489,8 +489,7 @@
 .m-password__input:disabled,
 .m-inputnumber__input:disabled,
 .m-inputotp__input:disabled,
-.m-inputcolor__text:disabled,
-.m-inputcolor__swatch:disabled,
+.m-colorpicker__trigger:disabled,
 .m-inputtags--disabled {
     background-color: var(--m-color-bg-disabled);
     color: var(--m-color-text-disabled);
@@ -513,8 +512,7 @@
 .m-textarea::placeholder,
 .m-password__input::placeholder,
 .m-inputnumber__input::placeholder,
-.m-inputtags__input::placeholder,
-.m-inputcolor__text::placeholder {
+.m-inputtags__input::placeholder {
     color: var(--m-color-text-muted);
     opacity: 1;
 }
@@ -858,9 +856,7 @@
     font-family: var(--m-font-sans);
     gap: var(--m-space-2);
     max-width: 100%;
-    min-width: var(--m-menu-min-width);
     position: relative;
-    width: fit-content;
 }
 
 .m-textarea-field--fluid,
@@ -1051,7 +1047,7 @@
     flex: 1;
     max-height: 16rem;
     min-height: 12rem;
-    min-width: var(--m-menu-min-width);
+    min-width: var(--m-overlay-menu-min-width);
 }
 
 .m-orderlist__list,
@@ -1119,7 +1115,6 @@
     .m-cascadeselect__trigger:hover:not(:disabled):not(:focus):not(:focus-visible),
 .m-treeselect:not(.m-treeselect--open)
     .m-treeselect__trigger:hover:not(:disabled):not(:focus):not(:focus-visible),
-.m-inputcolor__text:hover:not(:disabled):not(:focus),
 .m-inputtags:hover:not(.m-inputtags--disabled):not(:focus-within),
 .m-togglebutton:hover:not(:disabled):not(.m-togglebutton--checked):not(:focus-visible),
 .m-inplace__display:hover:not(:focus-visible) {
@@ -1134,8 +1129,6 @@
 .m-treeselect--open .m-treeselect__trigger,
 .m-treeselect__trigger:focus,
 .m-treeselect__trigger:focus-visible,
-.m-inputcolor__text:focus,
-.m-inputcolor__text:focus-visible,
 .m-inputtags:focus-within,
 .m-togglebutton:focus-visible,
 .m-selectbutton__button:focus-visible,
@@ -1150,9 +1143,7 @@
 
 .m-inputotp--invalid .m-inputotp__input:focus,
 .m-inputotp--invalid .m-inputotp__input:focus-visible,
-.m-inputtags--invalid:focus-within,
-.m-inputcolor--invalid .m-inputcolor__text:focus,
-.m-inputcolor--invalid .m-inputcolor__text:focus-visible {
+.m-inputtags--invalid:focus-within {
     border-color: var(--m-color-danger);
     box-shadow: var(--m-focus-shadow-danger);
 }

package/dist/splitter/style.css

@@ -405,7 +405,7 @@
 
 :root {
     /* Shared minimum width for menu-like panels (select/orderlist/picklist) */
-    --m-menu-min-width: 12rem;
+    --m-overlay-menu-min-width: 12rem;
 }
 
 .m-button,
@@ -463,7 +463,7 @@
 .m-progress-spinner,
 .m-cascadeselect,
 .m-treeselect,
-.m-inputcolor,
+.m-colorpicker,
 .m-inputtags,
 .m-label,
 .m-speeddial,
@@ -489,8 +489,7 @@
 .m-password__input:disabled,
 .m-inputnumber__input:disabled,
 .m-inputotp__input:disabled,
-.m-inputcolor__text:disabled,
-.m-inputcolor__swatch:disabled,
+.m-colorpicker__trigger:disabled,
 .m-inputtags--disabled {
     background-color: var(--m-color-bg-disabled);
     color: var(--m-color-text-disabled);
@@ -513,8 +512,7 @@
 .m-textarea::placeholder,
 .m-password__input::placeholder,
 .m-inputnumber__input::placeholder,
-.m-inputtags__input::placeholder,
-.m-inputcolor__text::placeholder {
+.m-inputtags__input::placeholder {
     color: var(--m-color-text-muted);
     opacity: 1;
 }
@@ -858,9 +856,7 @@
     font-family: var(--m-font-sans);
     gap: var(--m-space-2);
     max-width: 100%;
-    min-width: var(--m-menu-min-width);
     position: relative;
-    width: fit-content;
 }
 
 .m-textarea-field--fluid,
@@ -1051,7 +1047,7 @@
     flex: 1;
     max-height: 16rem;
     min-height: 12rem;
-    min-width: var(--m-menu-min-width);
+    min-width: var(--m-overlay-menu-min-width);
 }
 
 .m-orderlist__list,
@@ -1119,7 +1115,6 @@
     .m-cascadeselect__trigger:hover:not(:disabled):not(:focus):not(:focus-visible),
 .m-treeselect:not(.m-treeselect--open)
     .m-treeselect__trigger:hover:not(:disabled):not(:focus):not(:focus-visible),
-.m-inputcolor__text:hover:not(:disabled):not(:focus),
 .m-inputtags:hover:not(.m-inputtags--disabled):not(:focus-within),
 .m-togglebutton:hover:not(:disabled):not(.m-togglebutton--checked):not(:focus-visible),
 .m-inplace__display:hover:not(:focus-visible) {
@@ -1134,8 +1129,6 @@
 .m-treeselect--open .m-treeselect__trigger,
 .m-treeselect__trigger:focus,
 .m-treeselect__trigger:focus-visible,
-.m-inputcolor__text:focus,
-.m-inputcolor__text:focus-visible,
 .m-inputtags:focus-within,
 .m-togglebutton:focus-visible,
 .m-selectbutton__button:focus-visible,
@@ -1150,9 +1143,7 @@
 
 .m-inputotp--invalid .m-inputotp__input:focus,
 .m-inputotp--invalid .m-inputotp__input:focus-visible,
-.m-inputtags--invalid:focus-within,
-.m-inputcolor--invalid .m-inputcolor__text:focus,
-.m-inputcolor--invalid .m-inputcolor__text:focus-visible {
+.m-inputtags--invalid:focus-within {
     border-color: var(--m-color-danger);
     box-shadow: var(--m-focus-shadow-danger);
 }