morya-ui 0.4.5 → 0.5.0

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # morya-ui
 
+## 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 +24,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 +782,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/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/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);
 }

package/dist/anchor/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/auto-complete/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);
 }