morya-ui 0.4.5 → 0.5.1

package/dist/context-menu/index.js

@@ -4,12 +4,12 @@ import { t as r } from "../useFloatingViewportSync-wLLKIGUA.js";
 import { t as i } from "../useMotionTransition-DohkfWRB.js";
 import { t as a } from "../Icon-CmHjx7W8.js";
 import { t as o } from "../Scrollbar-DTeJ8P5b.js";
-import { t as s } from "../icon-H8prbteT.js";
-import { t as c } from "../key-CaQYVkjh.js";
-import { t as l } from "../FlyoutSubmenu-C1n-fr6i.js";
-import { l as u } from "../config-Cd20zAyW.js";
+import { t as s } from "../key-CaQYVkjh.js";
+import { n as c, t as l } from "../icon-CUrSaD8r.js";
+import { t as u } from "../FlyoutSubmenu-C1n-fr6i.js";
+import { l as d } from "../config-Cd20zAyW.js";
 import "./style.js";
-import { Fragment as d, Teleport as f, Transition as p, computed as m, createBlock as h, createCommentVNode as g, createElementBlock as _, createElementVNode as v, createVNode as y, defineComponent as b, mergeModels as x, mergeProps as S, nextTick as C, normalizeClass as w, normalizeStyle as T, onBeforeUnmount as E, openBlock as D, ref as O, renderList as k, renderSlot as A, toDisplayString as j, unref as M, useAttrs as N, useModel as P, watch as F, withCtx as I, withModifiers as L } from "vue";
+import { Fragment as f, Teleport as p, Transition as m, computed as h, createBlock as g, createCommentVNode as _, createElementBlock as v, createElementVNode as y, createVNode as b, defineComponent as x, mergeModels as S, mergeProps as C, nextTick as w, normalizeClass as T, normalizeStyle as ee, onBeforeUnmount as E, openBlock as D, ref as O, renderList as k, renderSlot as A, resolveDynamicComponent as j, toDisplayString as M, unref as N, useAttrs as te, useModel as P, watch as F, withCtx as I, withModifiers as L } from "vue";
 //#region src/components/ContextMenu/ContextMenuNodes.vue?vue&type=script&setup=true&lang.ts
 var R = {
 	key: 0,
@@ -32,79 +32,86 @@ var R = {
 }, q = { class: "m-contextmenu__label" }, J = {
 	key: 1,
 	class: "m-contextmenu__shortcut"
-}, Y = /* @__PURE__ */ b({
+}, Y = /* @__PURE__ */ x({
 	__name: "ContextMenuNodes",
 	props: { items: {} },
 	emits: ["activate"],
 	setup(e, { emit: t }) {
 		let n = O(null), r = O(null), i;
-		function u() {
+		function d() {
 			i && clearTimeout(i), i = void 0;
 		}
-		function f() {
-			u(), i = setTimeout(() => {
+		function p() {
+			d(), i = setTimeout(() => {
 				n.value = null, r.value = null;
 			}, 150);
 		}
-		function p(e, t) {
-			return c(e, t, "cm");
+		function m(e, t) {
+			return s(e, t, "cm");
 		}
-		function m(e) {
-			return s(e.icon);
+		function h(e) {
+			return typeof e.icon == "string" ? l(e.icon) : void 0;
 		}
-		function h(e, t) {
-			u(), n.value = e;
+		function x(e) {
+			return c(e.icon);
+		}
+		function S(e) {
+			return !!(h(e) || x(e));
+		}
+		function C(e, t) {
+			d(), n.value = e;
 			let i = t.currentTarget;
 			r.value = i?.querySelector(".m-contextmenu__item--parent") ?? i;
 		}
-		function b() {
-			u();
+		function w() {
+			d();
 		}
-		function x() {
-			f();
+		function T() {
+			p();
 		}
-		return (t, i) => (D(!0), _(d, null, k(e.items, (e, s) => (D(), _(d, { key: p(e, s) }, [e.separator ? (D(), _("div", R)) : e.items?.length ? (D(), _("div", {
+		return (t, i) => (D(!0), v(f, null, k(e.items, (e, s) => (D(), v(f, { key: m(e, s) }, [e.separator ? (D(), v("div", R)) : e.items?.length ? (D(), v("div", {
 			key: 1,
 			class: "m-contextmenu__submenu-wrap",
-			onMouseenter: (e) => h(s, e),
-			onMouseleave: i[1] ||= (e) => f()
-		}, [v("button", {
+			onMouseenter: (e) => C(s, e),
+			onMouseleave: i[1] ||= (e) => p()
+		}, [y("button", {
 			type: "button",
 			class: "m-contextmenu__item m-contextmenu__item--parent",
 			role: "menuitem",
 			disabled: e.disabled
 		}, [
-			m(e) ? (D(), _("span", V, [y(a, {
-				name: m(e),
+			S(e) ? (D(), v("span", V, [h(e) ? (D(), g(a, {
+				key: 0,
+				name: h(e),
 				size: "sm"
-			}, null, 8, ["name"])])) : g("", !0),
-			v("span", H, j(e.label), 1),
-			e.shortcut ? (D(), _("span", U, j(e.shortcut), 1)) : g("", !0),
-			v("span", W, [y(a, {
+			}, null, 8, ["name"])) : x(e) ? (D(), g(j(x(e)), { key: 1 })) : _("", !0)])) : _("", !0),
+			y("span", H, M(e.label), 1),
+			e.shortcut ? (D(), v("span", U, M(e.shortcut), 1)) : _("", !0),
+			y("span", W, [b(a, {
 				name: "chevron-right",
 				size: "sm"
 			})])
-		], 8, B), y(l, {
+		], 8, B), b(u, {
 			open: n.value === s,
 			anchor: n.value === s ? r.value : null,
 			"panel-class": "m-contextmenu__submenu",
-			onEnter: b,
-			onLeave: x
+			onEnter: w,
+			onLeave: T
 		}, {
-			default: I(() => [y(o, {
+			default: I(() => [b(o, {
 				class: "m-contextmenu__submenu-scroll",
 				"fit-content": "",
 				"wrap-class": "m-contextmenu__submenu-wrap-inner",
 				"view-class": "m-contextmenu__submenu-view"
 			}, {
-				default: I(() => [y(Y, {
+				default: I(() => [b(Y, {
 					items: e.items,
 					onActivate: i[0] ||= (e) => t.$emit("activate", e)
 				}, null, 8, ["items"])]),
 				_: 2
 			}, 1024)]),
 			_: 2
-		}, 1032, ["open", "anchor"])], 40, z)) : (D(), _("button", {
+		}, 1032, ["open", "anchor"])], 40, z)) : (D(), v("button", {
 			key: 2,
 			type: "button",
 			class: "m-contextmenu__item",
@@ -112,18 +119,19 @@ var R = {
 			disabled: e.disabled,
 			onClick: (n) => t.$emit("activate", e)
 		}, [
-			m(e) ? (D(), _("span", K, [y(a, {
-				name: m(e),
+			S(e) ? (D(), v("span", K, [h(e) ? (D(), g(a, {
+				key: 0,
+				name: h(e),
 				size: "sm"
-			}, null, 8, ["name"])])) : g("", !0),
-			v("span", q, j(e.label), 1),
-			e.shortcut ? (D(), _("span", J, j(e.shortcut), 1)) : g("", !0)
+			}, null, 8, ["name"])) : x(e) ? (D(), g(j(x(e)), { key: 1 })) : _("", !0)])) : _("", !0),
+			y("span", q, M(e.label), 1),
+			e.shortcut ? (D(), v("span", J, M(e.shortcut), 1)) : _("", !0)
 		], 8, G))], 64))), 128));
 	}
-}), X = /* @__PURE__ */ b({
+}), X = /* @__PURE__ */ x({
 	inheritAttrs: !1,
 	__name: "ContextMenu",
-	props: /*@__PURE__*/ x({
+	props: /*@__PURE__*/ S({
 		pt: {},
 		model: {},
 		teleport: {
@@ -146,28 +154,28 @@ var R = {
 	}),
 	emits: ["update:modelValue", "update:position"],
 	setup(a, { expose: s }) {
-		let c = a, l = P(a, "modelValue"), b = P(a, "position"), x = N(), { rootAttrs: k } = e(x, () => c.pt), j = u(), { transitionName: R, transitionCss: z } = i({
+		let c = a, l = P(a, "modelValue"), u = P(a, "position"), x = te(), { rootAttrs: S } = e(x, () => c.pt), k = d(), { transitionName: j, transitionCss: M } = i({
 			role: "popup",
 			local: () => c.transition,
 			componentName: "ContextMenu",
 			fallback: "scale-fade"
-		}), B = O(null), V = O({
+		}), R = O(null), z = O({
 			x: 0,
 			y: 0
-		}), H = m(() => t(c, j.value.appendTo)), U = m(() => n(c, j.value.appendTo)), W = m(() => {
-			let e = b.value ?? V.value;
+		}), B = h(() => t(c, k.value.appendTo)), V = h(() => n(c, k.value.appendTo)), H = h(() => {
+			let e = u.value ?? z.value;
 			return {
 				left: `${e.x}px`,
 				top: `${e.y}px`
 			};
 		});
-		function G(e) {
-			c.model.length && q(e);
+		function U(e) {
+			c.model.length && G(e);
 		}
-		function K() {
+		function W() {
 			l.value = !1;
 		}
-		function q(e) {
+		function G(e) {
 			let t = "clientX" in e ? {
 				x: e.clientX,
 				y: e.clientY
@@ -175,71 +183,71 @@ var R = {
 				x: e.x,
 				y: e.y
 			};
-			"preventDefault" in e && e.preventDefault(), "stopPropagation" in e && e.stopPropagation(), V.value = t, b.value = t, l.value = !0;
+			"preventDefault" in e && e.preventDefault(), "stopPropagation" in e && e.stopPropagation(), z.value = t, u.value = t, l.value = !0;
 		}
-		function J(e) {
-			e.disabled || e.separator || (e.command?.(), K());
+		function K(e) {
+			e.disabled || e.separator || (e.command?.(), W());
 		}
-		function X(e) {
-			l.value && B.value && !B.value.contains(e.target) && K();
+		function q(e) {
+			l.value && R.value && !R.value.contains(e.target) && W();
 		}
-		function Z(e) {
-			e.key === "Escape" && K();
+		function J(e) {
+			e.key === "Escape" && W();
 		}
-		function ee(e) {
+		function X(e) {
 			if (!e || e.type !== "scroll") return !1;
 			let t = e.target;
-			return t instanceof Node ? B.value?.contains(t) ? !0 : t instanceof Element && !!t.closest(".m-contextmenu, .m-contextmenu__submenu") : !1;
+			return t instanceof Node ? R.value?.contains(t) ? !0 : t instanceof Element && !!t.closest(".m-contextmenu, .m-contextmenu__submenu") : !1;
 		}
-		function te(e) {
-			!l.value || ee(e) || K();
+		function Z(e) {
+			!l.value || X(e) || W();
 		}
 		let Q = 0;
 		function $() {
-			document.removeEventListener("click", X), document.removeEventListener("keydown", Z), document.removeEventListener("contextmenu", X);
+			document.removeEventListener("click", q), document.removeEventListener("keydown", J), document.removeEventListener("contextmenu", q);
 		}
 		return F(l, (e) => {
 			if ($(), !e) return;
-			document.addEventListener("click", X), document.addEventListener("keydown", Z);
+			document.addEventListener("click", q), document.addEventListener("keydown", J);
 			let t = ++Q;
-			C(() => {
-				t === Q && l.value && document.addEventListener("contextmenu", X);
+			w(() => {
+				t === Q && l.value && document.addEventListener("contextmenu", q);
 			});
-		}, { immediate: !0 }), r(l, te), E(() => {
+		}, { immediate: !0 }), r(l, Z), E(() => {
 			$();
 		}), s({
-			show: q,
-			hide: K
-		}), (e, t) => (D(), _(d, null, [v("div", S(M(k), {
+			show: G,
+			hide: W
+		}), (e, t) => (D(), v(f, null, [y("div", C(N(S), {
 			class: "m-contextmenu-anchor",
-			onContextmenu: G
-		}), [A(e.$slots, "default")], 16), (D(), h(f, {
-			to: H.value.to,
-			disabled: H.value.disabled
-		}, [y(p, {
-			name: M(R),
-			css: M(z)
+			onContextmenu: U
+		}), [A(e.$slots, "default")], 16), (D(), g(p, {
+			to: B.value.to,
+			disabled: B.value.disabled
+		}, [b(m, {
+			name: N(j),
+			css: N(M)
 		}, {
-			default: I(() => [l.value ? (D(), _("div", {
+			default: I(() => [l.value ? (D(), v("div", {
 				key: 0,
 				ref_key: "root",
-				ref: B,
-				class: w(["m-contextmenu", { "m-contextmenu--teleported": U.value }]),
+				ref: R,
+				class: T(["m-contextmenu", { "m-contextmenu--teleported": V.value }]),
 				role: "menu",
-				style: T(W.value),
+				style: ee(H.value),
 				onClick: t[0] ||= L(() => {}, ["stop"])
-			}, [y(o, {
+			}, [b(o, {
 				class: "m-contextmenu__scroll",
 				"fit-content": "",
 				"wrap-class": "m-contextmenu__scroll-wrap",
 				"view-class": "m-contextmenu__scroll-view"
 			}, {
-				default: I(() => [y(Y, {
+				default: I(() => [b(Y, {
 					items: a.model,
-					onActivate: J
+					onActivate: K
 				}, null, 8, ["items"])]),
 				_: 1
-			})], 6)) : g("", !0)]),
+			})], 6)) : _("", !0)]),
 			_: 1
 		}, 8, ["name", "css"])], 8, ["to", "disabled"]))], 64));
 	}

package/dist/context-menu/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);
 }
@@ -1389,7 +1380,7 @@
 
 /* —— Navigation: ContextMenu —— */
 .m-contextmenu {
-    --m-contextmenu-min-width: var(--m-menu-min-width, 10rem);
+    --m-contextmenu-min-width: var(--m-overlay-menu-min-width, 10rem);
     --m-contextmenu-item-gap: var(--m-space-1);
     --m-contextmenu-max-height: min(18rem, 45vh);
     background: var(--m-color-surface);

package/dist/data-view/index.js

@@ -1,6 +1,6 @@
 import { a as e } from "../useComponentAttrs-e-5QAjdw.js";
 import { t } from "../Loading-DE9Iaiao.js";
-import { t as n } from "../Pagination-DpNOb0CS.js";
+import { t as n } from "../Pagination-B8WYoL2a.js";
 import { n as r } from "../locale-BcxMPufl.js";
 import "./style.js";
 import { Fragment as i, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createSlots as u, createVNode as d, defineComponent as f, mergeProps as p, openBlock as m, ref as h, renderList as g, renderSlot as _, toDisplayString as v, unref as y, useAttrs as b, useSlots as x, watch as S, withCtx as C } from "vue";

package/dist/data-view/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/date-picker/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/descriptions/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);
 }