morya-ui 0.4.5 → 0.5.1

package/CHANGELOG.md

@@ -1,5 +1,44 @@
 # morya-ui
 
+## 0.5.1
+
+### 破坏性变更
+
+- unify clearable prop name across form controls
+
+### 新功能
+
+- support custom component icons across menu components
+- enhance popup behavior and styling
+
+### 修复
+
+- remove explicit width setting for popup menu
+- lock floating popup width to the trigger width
+- don't highlight first item on mouse open
+- don't highlight first item on open
+
+### 变更
+
+- sync clearable usage and regenerate MCP catalog
+
+## 0.5.0
+
+### 新功能
+
+- update component import map and styles
+- add gradient support with draggable stops
+- remove InputColor component (replaced by ColorPicker)
+
+### 文档
+
+- add Methods section (open/close/toggle)
+- remove external library references and InputColor mentions
+
+### 变更
+
+- enhance button styling and layout for right-stacked configuration
+
 ## 0.4.5
 
 ### 新功能
@@ -7,7 +46,7 @@
 - add disabled, v-model:selection, top/bottom buttons, drag preview, drop indicator, flip animation
 - scale size across panel, center cells, stretch fluid calendar, add time column headers
 - add moveTop, moveBottom, hour, minute, second, today messages
-- align control size tokens with ant design (small 8px, medium 12px, large 16px font)
+- align control size tokens with design system (small 8px, medium 12px, large 16px font)
 - add panel mode cycling, multiple selection and input mask
 - add needConfirm and shortcut active state
 - add status, today ring, footer and cell slots
@@ -765,7 +804,7 @@
 ### 组件（88 个）
 
 - **基础**：Button、ButtonGroup、Icon、Avatar、AvatarGroup、Badge、Chip、Tag、Divider、Skeleton、ProgressBar、ProgressSpinner、BlockUI、ScrollTop
-- **表单**：Input、Textarea、InputNumber、InputPassword、InputOtp、InputTags、InputColor、InputGroup、InputGroupAddon、IconField、FloatLabel、Label、Checkbox、CheckboxGroup、Radio、RadioGroup、Switch、Select、SelectButton、ToggleButton、Slider、Knob、Rating、DatePicker、AutoComplete、CascadeSelect、TreeSelect、FileUpload、Form、FormItem
+- **表单**：Input、Textarea、InputNumber、InputPassword、InputOtp、InputTags、ColorPicker、InputGroup、InputGroupAddon、IconField、FloatLabel、Label、Checkbox、CheckboxGroup、Radio、RadioGroup、Switch、Select、SelectButton、ToggleButton、Slider、Knob、Rating、DatePicker、AutoComplete、CascadeSelect、TreeSelect、FileUpload、Form、FormItem
 - **浮层与对话框**：Dialog、Drawer、Popover、Tooltip、ConfirmDialog、ConfirmPopup、ContextMenu、Dropdown、SplitButton、SpeedDial
 - **数据展示**：Table、Tree、TreeTable、TreeSelect、DataView、VirtualScroller、Timeline、MeterGroup、Terminal、Gallery、Carousel、Inplace
 - **导航与菜单**：Menu、Menubar、MegaMenu、TieredMenu、Breadcrumb、Tabs、Stepper、Pagination、CommandMenu、Dock、Sidebar

package/dist/{Input-D2bee2LU.js → Input-BErawS7K.js}

@@ -61,10 +61,6 @@ var te = ["for"], ne = {
 			type: Boolean,
 			default: void 0
 		},
-		allowClear: {
-			type: Boolean,
-			default: void 0
-		},
 		maxlength: {},
 		showCount: {
 			type: Boolean,
@@ -84,7 +80,7 @@ var te = ["for"], ne = {
 		"change"
 	],
 	setup(f, { expose: T, emit: E }) {
-		let D = f, O = E, k = x(), { rootAttrs: A, controlAttrs: j } = e(k, () => D.pt), M = S(), N = i("Input"), P = p(r, null), F = o(), I = _(null), L = t("m-input"), R = s(() => D.id ?? L), z = s(() => D.invalid || D.status === "error" || !!D.errorMessage), B = s(() => D.status === "warning" && !z.value), V = ee("Input", () => D.size ?? P?.value.size), H = a("Input", () => D.variant), U = s(() => D.clearable ?? D.allowClear ?? N.value.clearable ?? N.value.allowClear ?? !1), W = s(() => D.showCount ?? N.value.showCount ?? !1), G = s(() => D.fluid ?? N.value.fluid ?? !1), K = s(() => D.modelValue.length), q = s(() => D.maxlength == null ? String(K.value) : `${K.value} / ${D.maxlength}`), J = s(() => D.errorMessage || D.helpText), Y = s(() => !!D.errorMessage || z.value && !!D.helpText), X = s(() => !!M.prefix), Z = s(() => !!M.suffix), se = s(() => {
+		let D = f, O = E, k = x(), { rootAttrs: A, controlAttrs: j } = e(k, () => D.pt), M = S(), N = i("Input"), P = p(r, null), F = o(), I = _(null), L = t("m-input"), R = s(() => D.id ?? L), z = s(() => D.invalid || D.status === "error" || !!D.errorMessage), B = s(() => D.status === "warning" && !z.value), V = ee("Input", () => D.size ?? P?.value.size), H = a("Input", () => D.variant), U = s(() => D.clearable ?? N.value.clearable ?? !1), W = s(() => D.showCount ?? N.value.showCount ?? !1), G = s(() => D.fluid ?? N.value.fluid ?? !1), K = s(() => D.modelValue.length), q = s(() => D.maxlength == null ? String(K.value) : `${K.value} / ${D.maxlength}`), J = s(() => D.errorMessage || D.helpText), Y = s(() => !!D.errorMessage || z.value && !!D.helpText), X = s(() => !!M.prefix), Z = s(() => !!M.suffix), se = s(() => {
 			let e = [];
 			return J.value && e.push(`${R.value}-help`), W.value && e.push(`${R.value}-count`), e.length ? e.join(" ") : void 0;
 		}), ce = s(() => [

package/dist/InputNumber-DjbXtTzR.js

@@ -0,0 +1,245 @@
+import { i as e } from "./useComponentAttrs-e-5QAjdw.js";
+import { t } from "./useFieldFeedback-C5qIqYMK.js";
+import { t as n } from "./useMId-BXFYayPP.js";
+import { t as r } from "./Icon-CmHjx7W8.js";
+import { o as i } from "./config-Cd20zAyW.js";
+import { n as a } from "./locale-BcxMPufl.js";
+import { computed as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createVNode as u, defineComponent as d, mergeProps as f, normalizeClass as p, openBlock as m, ref as h, renderSlot as g, toDisplayString as _, unref as v, useAttrs as y, watch as b } from "vue";
+//#region src/components/InputNumber/InputNumber.vue?vue&type=script&setup=true&lang.ts
+var x = ["for"], S = ["aria-label", "disabled"], C = { class: "m-inputnumber__input-wrap" }, w = {
+	key: 0,
+	class: "m-inputnumber__prefix"
+}, T = [
+	"id",
+	"value",
+	"placeholder",
+	"name",
+	"autofocus",
+	"disabled",
+	"readonly",
+	"aria-invalid",
+	"aria-describedby"
+], E = {
+	key: 1,
+	class: "m-inputnumber__suffix"
+}, D = ["aria-label"], O = {
+	key: 1,
+	class: "m-inputnumber__stack"
+}, ee = ["aria-label", "disabled"], te = ["aria-label", "disabled"], ne = ["aria-label", "disabled"], k = ["id", "role"], A = /* @__PURE__ */ d({
+	inheritAttrs: !1,
+	__name: "InputNumber",
+	props: {
+		modelValue: { default: null },
+		label: {},
+		min: {},
+		max: {},
+		step: { default: 1 },
+		precision: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		readonly: {
+			type: Boolean,
+			default: !1
+		},
+		invalid: {
+			type: Boolean,
+			default: !1
+		},
+		helpText: {},
+		errorMessage: {},
+		fluid: {
+			type: Boolean,
+			default: !1
+		},
+		size: {},
+		showButtons: {
+			type: Boolean,
+			default: !1
+		},
+		buttonPlacement: { default: "both" },
+		clearable: {
+			type: Boolean,
+			default: !1
+		},
+		id: {},
+		pt: {},
+		name: {},
+		autofocus: { type: Boolean },
+		placeholder: {}
+	},
+	emits: [
+		"update:modelValue",
+		"focus",
+		"blur",
+		"change"
+	],
+	setup(d, { expose: A, emit: j }) {
+		let M = d, N = j, P = y(), { rootAttrs: F, controlAttrs: I } = e(P, () => M.pt), L = a(), R = h(null), z = n("m-inputnumber"), B = o(() => M.id ?? z), V = i("InputNumber", () => M.size), { isInvalid: H, feedbackText: U, feedbackIsError: W } = t(M), G = o(() => M.clearable && M.modelValue != null && !M.disabled), K = o(() => [
+			"m-inputnumber",
+			`m-inputnumber--${V.value}`,
+			{
+				"m-inputnumber--fluid": M.fluid,
+				"m-inputnumber--invalid": H.value,
+				"m-inputnumber--disabled": M.disabled,
+				"m-inputnumber--buttons": M.showButtons,
+				"m-inputnumber--buttons-right": M.showButtons && M.buttonPlacement === "right"
+			}
+		]);
+		function q(e) {
+			if (M.precision == null) return e;
+			let t = 10 ** M.precision;
+			return Math.round(e * t) / t;
+		}
+		function J(e) {
+			let t = q(e);
+			return M.min != null && t < M.min && (t = M.min), M.max != null && t > M.max && (t = M.max), t;
+		}
+		function Y(e) {
+			let t = e.trim();
+			if (t === "" || t === "-" || t === "+" || t === ".") return null;
+			let n = Number(t);
+			return Number.isNaN(n) ? null : J(n);
+		}
+		let X = h(null), re = o(() => X.value ?? (M.modelValue == null ? "" : String(M.modelValue)));
+		b(() => M.modelValue, (e) => {
+			X.value != null && ((e == null ? X.value.trim() === "" : Number(X.value) === e) || (X.value = null));
+		});
+		function ie(e) {
+			if (M.disabled) return;
+			let t = e.target.value;
+			X.value = t;
+			let n = t.trim();
+			if (n === "") {
+				N("update:modelValue", null);
+				return;
+			}
+			let r = Number(n);
+			Number.isNaN(r) || /[.e+-]$/i.test(n) || N("update:modelValue", q(r));
+		}
+		function Z() {
+			if (M.disabled || X.value == null) return;
+			let e = Y(X.value);
+			N("update:modelValue", e), X.value = e == null ? "" : String(e);
+		}
+		function ae(e) {
+			e.key === "Enter" && Z();
+		}
+		function Q(e) {
+			if (M.disabled) return;
+			let t = M.modelValue ?? M.min ?? 0;
+			X.value = null, N("update:modelValue", J(t + e * M.step));
+		}
+		function oe() {
+			M.disabled || (X.value = null, N("update:modelValue", null));
+		}
+		function se() {
+			R.value?.focus();
+		}
+		function ce() {
+			R.value?.blur();
+		}
+		function le() {
+			R.value?.select();
+		}
+		function $(e) {
+			Z(), N("blur", e), N("change", M.modelValue);
+		}
+		return A({
+			focus: se,
+			blur: ce,
+			select: le
+		}), (e, t) => (m(), c("div", f(v(F), { class: ["m-inputnumber-field", { "m-inputnumber-field--fluid": d.fluid }] }), [
+			d.label ? (m(), c("label", {
+				key: 0,
+				class: "m-inputnumber-field__label",
+				for: B.value
+			}, _(d.label), 9, x)) : s("", !0),
+			l("div", { class: p(K.value) }, [
+				d.showButtons && d.buttonPlacement === "both" ? (m(), c("button", {
+					key: 0,
+					class: "m-inputnumber__button m-inputnumber__button--decrement",
+					type: "button",
+					"aria-label": v(L).decrease,
+					disabled: d.disabled || d.min != null && d.modelValue != null && d.modelValue <= d.min,
+					onClick: t[0] ||= (e) => Q(-1)
+				}, [u(r, {
+					name: "minus",
+					size: "sm"
+				})], 8, S)) : s("", !0),
+				l("div", C, [
+					e.$slots.prefix ? (m(), c("span", w, [g(e.$slots, "prefix")])) : s("", !0),
+					l("input", f(v(I), {
+						id: B.value,
+						ref_key: "inputElement",
+						ref: R,
+						class: "m-inputnumber__input",
+						type: "text",
+						inputmode: "decimal",
+						value: re.value,
+						placeholder: d.placeholder,
+						name: d.name,
+						autofocus: d.autofocus || void 0,
+						disabled: d.disabled,
+						readonly: d.readonly,
+						"aria-invalid": v(H) || void 0,
+						"aria-describedby": v(U) ? `${B.value}-help` : void 0,
+						onInput: ie,
+						onFocus: t[1] ||= (e) => N("focus", e),
+						onBlur: $,
+						onKeydown: ae
+					}), null, 16, T),
+					e.$slots.suffix ? (m(), c("span", E, [g(e.$slots, "suffix")])) : s("", !0),
+					G.value ? (m(), c("button", {
+						key: 2,
+						type: "button",
+						class: "m-inputnumber__clear",
+						"aria-label": v(L).clearInput,
+						onClick: oe
+					}, [u(r, {
+						name: "close",
+						size: "sm"
+					})], 8, D)) : s("", !0)
+				]),
+				d.showButtons && d.buttonPlacement === "right" ? (m(), c("div", O, [l("button", {
+					class: "m-inputnumber__button m-inputnumber__button--increment",
+					type: "button",
+					"aria-label": v(L).increase,
+					disabled: d.disabled || d.max != null && d.modelValue != null && d.modelValue >= d.max,
+					onClick: t[2] ||= (e) => Q(1)
+				}, [u(r, {
+					name: "plus",
+					size: "sm"
+				})], 8, ee), l("button", {
+					class: "m-inputnumber__button m-inputnumber__button--decrement",
+					type: "button",
+					"aria-label": v(L).decrease,
+					disabled: d.disabled || d.min != null && d.modelValue != null && d.modelValue <= d.min,
+					onClick: t[3] ||= (e) => Q(-1)
+				}, [u(r, {
+					name: "minus",
+					size: "sm"
+				})], 8, te)])) : d.showButtons ? (m(), c("button", {
+					key: 2,
+					class: "m-inputnumber__button m-inputnumber__button--increment",
+					type: "button",
+					"aria-label": v(L).increase,
+					disabled: d.disabled || d.max != null && d.modelValue != null && d.modelValue >= d.max,
+					onClick: t[4] ||= (e) => Q(1)
+				}, [u(r, {
+					name: "plus",
+					size: "sm"
+				})], 8, ne)) : s("", !0)
+			], 2),
+			v(U) ? (m(), c("span", {
+				key: 1,
+				id: `${B.value}-help`,
+				class: p(["m-inputnumber-field__help", { "m-inputnumber-field__help--invalid": v(W) }]),
+				role: v(W) ? "alert" : void 0
+			}, _(v(U)), 11, k)) : s("", !0)
+		], 16));
+	}
+});
+//#endregion
+export { A as t };

package/dist/{Pagination-DpNOb0CS.js → Pagination-B8WYoL2a.js}

@@ -1,6 +1,6 @@
 import { a as e } from "./useComponentAttrs-e-5QAjdw.js";
 import { t } from "./Icon-CmHjx7W8.js";
-import { t as n } from "./Select-q4X2ff_M.js";
+import { t as n } from "./Select-BaFKBeIh.js";
 import { n as r, t as i } from "./locale-BcxMPufl.js";
 import { Fragment as a, computed as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createVNode as u, defineComponent as d, mergeProps as f, normalizeClass as p, openBlock as m, renderList as h, toDisplayString as g, unref as _, useAttrs as v } from "vue";
 //#region src/components/Pagination/Pagination.vue?vue&type=script&setup=true&lang.ts

package/dist/{Popover-Bnz7KNZq.js → Popover-zQChu00_.js}

@@ -120,7 +120,12 @@ var ie = ["aria-expanded", "aria-controls"], ae = ["id"], w = /* @__PURE__ */ h(
 			}
 		}
 		function X() {
-			!z.value || !F.value || (L.value = r(F.value.getBoundingClientRect(), E.placement));
+			if (!z.value || !F.value) return;
+			let e = I.value?.getBoundingClientRect();
+			L.value = r(F.value.getBoundingClientRect(), E.placement, e && e.height > 0 ? {
+				estimatedHeight: e.height,
+				estimatedWidth: e.width
+			} : void 0);
 		}
 		function Z(e) {
 			let t = e.target;

package/dist/{Select-q4X2ff_M.js → Select-BaFKBeIh.js}

@@ -255,7 +255,7 @@ var Me = ["for"], Ne = [
 		},
 		maxTagCount: {},
 		maxTagPlaceholder: {},
-		allowClear: {
+		clearable: {
 			type: Boolean,
 			default: void 0
 		},
@@ -321,7 +321,7 @@ var Me = ["for"], Ne = [
 			local: () => E.transition,
 			componentName: "Select",
 			fallback: "scale-fade"
-		}), k = ae(), ft = b(null), A = b(null), pt = b(null), mt = b(null), j = b(!1), M = b(""), N = b(-1), ht = b({}), P = b([]), gt = a("m-select"), F = f(() => E.id ?? gt), _t = f(() => E.notFoundContent ?? k.value.emptyOptions), vt = f(() => E.mode ?? O.value.mode), I = f(() => vt.value === "multiple" || vt.value === "tags"), yt = f(() => vt.value === "tags"), bt = f(() => E.remote ?? O.value.remote ?? !1), L = f(() => E.loading ?? !1), xt = f(() => E.fluid ?? O.value.fluid ?? !1), St = f(() => E.allowClear ?? O.value.allowClear ?? !1), R = f(() => E.showSearch ?? O.value.showSearch ?? !1), Ct = f(() => E.suffixIcon ?? "chevron-down"), wt = f(() => ({
+		}), k = ae(), ft = b(null), A = b(null), pt = b(null), mt = b(null), j = b(!1), M = b(""), N = b(-1), ht = b({}), P = b([]), gt = a("m-select"), F = f(() => E.id ?? gt), _t = f(() => E.notFoundContent ?? k.value.emptyOptions), vt = f(() => E.mode ?? O.value.mode), I = f(() => vt.value === "multiple" || vt.value === "tags"), yt = f(() => vt.value === "tags"), bt = f(() => E.remote ?? O.value.remote ?? !1), L = f(() => E.loading ?? !1), xt = f(() => E.fluid ?? O.value.fluid ?? !1), St = f(() => E.clearable ?? O.value.clearable ?? !1), R = f(() => E.showSearch ?? O.value.showSearch ?? !1), Ct = f(() => E.suffixIcon ?? "chevron-down"), wt = f(() => ({
 			filterOption: E.filterOption,
 			optionFilterProp: E.optionFilterProp
 		})), Tt = f(() => Ce(E.options, E.fieldNames)), Et = re("Select", () => E.size ?? ct?.value.size), Dt = ie("Select", () => E.variant), Ot = f(() => t(E, lt.value.appendTo)), z = f(() => n(E, lt.value.appendTo)), B = f(() => E.invalid || E.status === "error" || !!E.errorMessage), kt = f(() => E.status === "warning" && !B.value), At = f(() => E.errorMessage || E.helpText), jt = f(() => !!E.errorMessage || B.value && !!E.helpText), V = f(() => Te(E.modelValue, I.value)), Mt = f(() => Ee(Tt.value, P.value, V.value));

package/dist/{Textarea-DsFOAtPd.js → Textarea-WCEgpzbq.js}

@@ -60,10 +60,6 @@ var S = ["for"], C = [
 			type: Boolean,
 			default: void 0
 		},
-		allowClear: {
-			type: Boolean,
-			default: void 0
-		},
 		maxlength: {},
 		showCount: {
 			type: Boolean,
@@ -83,7 +79,7 @@ var S = ["for"], C = [
 		"change"
 	],
 	setup(f, { expose: D, emit: ie }) {
-		let O = f, k = ie, ae = b(), { rootAttrs: A, controlAttrs: j } = e(ae, () => O.pt), M = i("Textarea"), N = te(r, null), P = s(), F = ne(null), I = t("m-textarea"), L = c(() => O.id ?? I), R = c(() => O.invalid || O.status === "error" || !!O.errorMessage), z = c(() => O.status === "warning" && !R.value), B = a("Textarea", () => O.size ?? N?.value.size), V = o("Textarea", () => O.variant), H = c(() => O.fluid ?? M.value.fluid ?? !1), U = c(() => O.clearable ?? O.allowClear ?? M.value.clearable ?? M.value.allowClear ?? !1), W = c(() => O.showCount ?? M.value.showCount ?? !1), G = c(() => {
+		let O = f, k = ie, ae = b(), { rootAttrs: A, controlAttrs: j } = e(ae, () => O.pt), M = i("Textarea"), N = te(r, null), P = s(), F = ne(null), I = t("m-textarea"), L = c(() => O.id ?? I), R = c(() => O.invalid || O.status === "error" || !!O.errorMessage), z = c(() => O.status === "warning" && !R.value), B = a("Textarea", () => O.size ?? N?.value.size), V = o("Textarea", () => O.variant), H = c(() => O.fluid ?? M.value.fluid ?? !1), U = c(() => O.clearable ?? M.value.clearable ?? !1), W = c(() => O.showCount ?? M.value.showCount ?? !1), G = c(() => {
 			if (O.autosize !== void 0 && O.autosize !== !1) return O.autosize;
 			let e = M.value.autosize;
 			return e !== void 0 && e !== !1 && e;

package/dist/accordion/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/affix/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/alert/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);
 }