morya-ui 0.2.8 → 0.2.9

package/dist/inplace/style.css

@@ -373,6 +373,17 @@
     opacity: var(--m-opacity-disabled);
 }
 
+.m-input-field__control--prefixed .m-input:disabled,
+.m-input-field__control--suffixed .m-input:disabled,
+.m-input-field__control--clearable .m-input:disabled,
+.m-password--disabled .m-password__input,
+.m-inputnumber--disabled .m-inputnumber__input,
+.m-datepicker--disabled .m-datepicker__input,
+.m-icon-field--anchored .m-input:disabled,
+.m-icon-field--anchored .m-textarea:disabled {
+    opacity: 1;
+}
+
 .m-input::placeholder,
 .m-textarea::placeholder,
 .m-password__input::placeholder,
@@ -692,14 +703,6 @@
     opacity: var(--m-opacity-disabled);
 }
 
-.m-icon-field--left :is(.m-input, .m-password__input, .m-inputnumber__input, input) {
-    padding-left: var(--m-control-affix-padding);
-}
-
-.m-icon-field--right :is(.m-input, .m-password__input, .m-inputnumber__input, input) {
-    padding-right: var(--m-control-affix-padding);
-}
-
 .m-inputgroup > .m-input,
 .m-inputgroup > .m-input-field,
 .m-inputgroup > .m-password-field,
@@ -718,16 +721,22 @@
 
 .m-inputgroup > .m-input,
 .m-inputgroup .m-input,
-.m-inputgroup .m-password__input,
-.m-inputgroup .m-inputnumber__input {
+.m-inputgroup .m-password,
+.m-inputgroup .m-inputnumber__input-wrap,
+.m-inputgroup .m-input-field__control--prefixed,
+.m-inputgroup .m-input-field__control--suffixed,
+.m-inputgroup .m-input-field__control--clearable {
     border-radius: 0;
     width: 100%;
 }
 
 .m-inputgroup > :first-child.m-input,
 .m-inputgroup > :first-child .m-input,
-.m-inputgroup > :first-child .m-password__input,
-.m-inputgroup > :first-child .m-inputnumber__input,
+.m-inputgroup > :first-child .m-password,
+.m-inputgroup > :first-child .m-inputnumber__input-wrap,
+.m-inputgroup > :first-child .m-input-field__control--prefixed,
+.m-inputgroup > :first-child .m-input-field__control--suffixed,
+.m-inputgroup > :first-child .m-input-field__control--clearable,
 .m-inputgroup > :first-child.m-inputgroup-addon {
     border-bottom-left-radius: var(--m-radius-control);
     border-top-left-radius: var(--m-radius-control);
@@ -735,8 +744,11 @@
 
 .m-inputgroup > :last-child.m-input,
 .m-inputgroup > :last-child .m-input,
-.m-inputgroup > :last-child .m-password__input,
-.m-inputgroup > :last-child .m-inputnumber__input,
+.m-inputgroup > :last-child .m-password,
+.m-inputgroup > :last-child .m-inputnumber__input-wrap,
+.m-inputgroup > :last-child .m-input-field__control--prefixed,
+.m-inputgroup > :last-child .m-input-field__control--suffixed,
+.m-inputgroup > :last-child .m-input-field__control--clearable,
 .m-inputgroup > :last-child.m-inputgroup-addon {
     border-bottom-right-radius: var(--m-radius-control);
     border-top-right-radius: var(--m-radius-control);
@@ -887,9 +899,6 @@
 }
 
 /* Shared Naive-like hover/focus for remaining form triggers */
-.m-inputnumber__input:hover:not(:disabled):not(:focus),
-.m-password__input:hover:not(:disabled):not(:focus),
-.m-datepicker__input:hover:not(:disabled):not(:focus),
 .m-inputotp__input:hover:not(:disabled):not(:focus),
 .m-cascadeselect__trigger:hover:not(:disabled):not(:focus-visible),
 .m-treeselect__trigger:hover:not(:disabled):not(:focus-visible),
@@ -900,9 +909,6 @@
     border-color: var(--m-color-primary-hover);
 }
 
-.m-inputnumber__input:focus-visible,
-.m-password__input:focus-visible,
-.m-datepicker__input:focus-visible,
 .m-inputotp__input:focus-visible,
 .m-cascadeselect__trigger:focus-visible,
 .m-treeselect__trigger:focus-visible,
@@ -919,9 +925,6 @@
     outline: none;
 }
 
-.m-inputnumber--invalid .m-inputnumber__input:focus-visible,
-.m-password--invalid .m-password__input:focus-visible,
-.m-datepicker--invalid .m-datepicker__input:focus-visible,
 .m-inputotp--invalid .m-inputotp__input:focus-visible,
 .m-inputtags--invalid:focus-within,
 .m-inputcolor--invalid .m-inputcolor__text:focus-visible {

package/dist/input/index.js

@@ -1,15 +1,15 @@
 import { n as e } from "../useComponentAttrs-BTYEe61P.js";
-import { t } from "../Icon-DfpIfo2L.js";
+import { t } from "../Icon-B6IBrJ5S.js";
 import { t as n } from "../useMId-BXFYayPP.js";
-import { i as r, o as i, s as a } from "../config-BdK5ccNT.js";
-import { n as o } from "../locale-B36KH7c3.js";
+import { i as r, o as i, s as ee } from "../config-BdK5ccNT.js";
+import { n as a } from "../locale-B36KH7c3.js";
 import "./style.js";
-import { computed as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createVNode as d, defineComponent as f, mergeProps as p, normalizeClass as m, openBlock as h, ref as g, renderSlot as _, toDisplayString as v, unref as y, useAttrs as b, useSlots as x } from "vue";
+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, useSlots as b } from "vue";
 //#region src/components/Input/Input.vue?vue&type=script&setup=true&lang.ts
-var S = ["for"], C = {
+var x = ["for"], S = {
 	key: 0,
 	class: "m-input__prefix"
-}, w = [
+}, C = [
 	"id",
 	"type",
 	"value",
@@ -22,13 +22,13 @@ var S = ["for"], C = {
 	"autofocus",
 	"aria-invalid",
 	"aria-describedby"
-], T = {
+], w = {
 	key: 1,
 	class: "m-input__suffix"
-}, E = ["aria-label", "disabled"], D = {
+}, T = ["aria-label", "disabled"], E = {
 	key: 1,
 	class: "m-input-field__meta"
-}, O = ["id", "role"], k = ["id"], A = /* @__PURE__ */ f({
+}, D = ["id", "role"], te = ["id"], O = /* @__PURE__ */ d({
 	inheritAttrs: !1,
 	__name: "Input",
 	props: {
@@ -78,100 +78,98 @@ var S = ["for"], C = {
 		"blur",
 		"change"
 	],
-	setup(f, { expose: A, emit: j }) {
-		let M = f, N = j, P = b(), { rootAttrs: F, controlAttrs: I } = e(P, () => M.pt), L = x(), R = r("Input"), z = o(), B = g(null), V = n("m-input"), H = s(() => M.id ?? V), U = s(() => M.invalid || !!M.errorMessage), W = i("Input", () => M.size), ee = a("Input", () => M.variant), G = s(() => M.clearable ?? R.value.clearable ?? !1), K = s(() => M.showCount ?? R.value.showCount ?? !1), q = s(() => M.fluid ?? R.value.fluid ?? !1), J = s(() => M.modelValue.length), Y = s(() => M.maxlength == null ? String(J.value) : `${J.value} / ${M.maxlength}`), X = s(() => M.errorMessage || M.helpText), Z = s(() => !!M.errorMessage || U.value && !!M.helpText), Q = s(() => !!L.prefix), $ = s(() => !!L.suffix), te = s(() => {
+	setup(d, { expose: O, emit: k }) {
+		let A = d, j = k, M = y(), { rootAttrs: N, controlAttrs: P } = e(M, () => A.pt), F = b(), I = r("Input"), L = a(), R = h(null), z = n("m-input"), B = o(() => A.id ?? z), V = o(() => A.invalid || !!A.errorMessage), H = i("Input", () => A.size), U = ee("Input", () => A.variant), ne = o(() => A.clearable ?? I.value.clearable ?? !1), W = o(() => A.showCount ?? I.value.showCount ?? !1), G = o(() => A.fluid ?? I.value.fluid ?? !1), K = o(() => A.modelValue.length), q = o(() => A.maxlength == null ? String(K.value) : `${K.value} / ${A.maxlength}`), J = o(() => A.errorMessage || A.helpText), Y = o(() => !!A.errorMessage || V.value && !!A.helpText), X = o(() => !!F.prefix), Z = o(() => !!F.suffix), re = o(() => {
 			let e = [];
-			return X.value && e.push(`${H.value}-help`), K.value && e.push(`${H.value}-count`), e.length ? e.join(" ") : void 0;
-		}), ne = s(() => [
+			return J.value && e.push(`${B.value}-help`), W.value && e.push(`${B.value}-count`), e.length ? e.join(" ") : void 0;
+		}), ie = o(() => [
 			"m-input",
-			`m-input--${W.value}`,
+			`m-input--${H.value}`,
 			{
-				"m-input--filled": ee.value === "filled",
-				"m-input--fluid": q.value,
-				"m-input--invalid": U.value,
-				"m-input--has-prefix": Q.value,
-				"m-input--has-suffix": $.value
+				"m-input--filled": U.value === "filled",
+				"m-input--fluid": G.value,
+				"m-input--invalid": V.value
 			}
-		]);
-		function re(e) {
-			N("update:modelValue", e.target.value);
+		]), Q = o(() => ne.value && !!A.modelValue), ae = o(() => ({
+			"m-input-field__control--clearable": Q.value,
+			"m-input-field__control--counted": W.value,
+			"m-input-field__control--prefixed": X.value,
+			"m-input-field__control--suffixed": Z.value
+		}));
+		function oe(e) {
+			j("update:modelValue", e.target.value);
 		}
-		function ie() {
-			M.disabled || M.readonly || (N("update:modelValue", ""), N("clear"), B.value?.focus());
+		function $() {
+			A.disabled || A.readonly || (j("update:modelValue", ""), j("clear"), R.value?.focus());
 		}
-		function ae() {
-			B.value?.focus();
+		function se() {
+			R.value?.focus();
 		}
-		function oe() {
-			B.value?.blur();
+		function ce() {
+			R.value?.blur();
 		}
-		function se() {
-			B.value?.select();
+		function le() {
+			R.value?.select();
 		}
-		return A({
-			focus: ae,
-			blur: oe,
-			select: se
-		}), (e, n) => (h(), l("div", p(y(F), { class: ["m-input-field", { "m-input-field--fluid": q.value }] }), [
-			f.label ? (h(), l("label", {
+		return O({
+			focus: se,
+			blur: ce,
+			select: le
+		}), (e, n) => (m(), c("div", f(v(N), { class: ["m-input-field", { "m-input-field--fluid": G.value }] }), [
+			d.label ? (m(), c("label", {
 				key: 0,
 				class: "m-input-field__label",
-				for: H.value
-			}, v(f.label), 9, S)) : c("", !0),
-			u("div", { class: m(["m-input-field__control", {
-				"m-input-field__control--clearable": G.value && f.modelValue,
-				"m-input-field__control--counted": K.value,
-				"m-input-field__control--prefixed": Q.value,
-				"m-input-field__control--suffixed": !!e.$slots.suffix
-			}]) }, [
-				e.$slots.prefix ? (h(), l("span", C, [_(e.$slots, "prefix")])) : c("", !0),
-				u("input", p(y(I), {
-					id: H.value,
+				for: B.value
+			}, _(d.label), 9, x)) : s("", !0),
+			l("div", { class: p(["m-input-field__control", ae.value]) }, [
+				X.value ? (m(), c("span", S, [g(e.$slots, "prefix")])) : s("", !0),
+				l("input", f(v(P), {
+					id: B.value,
 					ref_key: "inputElement",
-					ref: B,
-					class: ne.value,
-					type: f.type,
-					value: f.modelValue,
-					disabled: f.disabled,
-					readonly: f.readonly,
-					maxlength: f.maxlength,
-					placeholder: f.placeholder,
-					name: f.name,
-					autocomplete: f.autocomplete,
-					autofocus: f.autofocus || void 0,
-					"aria-invalid": U.value || void 0,
-					"aria-describedby": te.value,
-					onInput: re,
-					onFocus: n[0] ||= (e) => N("focus", e),
-					onBlur: n[1] ||= (e) => N("blur", e),
-					onChange: n[2] ||= (e) => N("change", e.target.value)
-				}), null, 16, w),
-				e.$slots.suffix ? (h(), l("span", T, [_(e.$slots, "suffix")])) : c("", !0),
-				G.value && f.modelValue ? (h(), l("button", {
+					ref: R,
+					class: ie.value,
+					type: d.type,
+					value: d.modelValue,
+					disabled: d.disabled,
+					readonly: d.readonly,
+					maxlength: d.maxlength,
+					placeholder: d.placeholder,
+					name: d.name,
+					autocomplete: d.autocomplete,
+					autofocus: d.autofocus || void 0,
+					"aria-invalid": V.value || void 0,
+					"aria-describedby": re.value,
+					onInput: oe,
+					onFocus: n[0] ||= (e) => j("focus", e),
+					onBlur: n[1] ||= (e) => j("blur", e),
+					onChange: n[2] ||= (e) => j("change", e.target.value)
+				}), null, 16, C),
+				Z.value ? (m(), c("span", w, [g(e.$slots, "suffix")])) : s("", !0),
+				Q.value ? (m(), c("button", {
 					key: 2,
 					class: "m-input__clear",
 					type: "button",
-					"aria-label": y(z).clearInput,
-					disabled: f.disabled || f.readonly,
-					onClick: ie
-				}, [d(t, {
+					"aria-label": v(L).clearInput,
+					disabled: d.disabled || d.readonly,
+					onClick: $
+				}, [u(t, {
 					name: "close",
 					size: "sm"
-				})], 8, E)) : c("", !0)
+				})], 8, T)) : s("", !0)
 			], 2),
-			X.value || K.value ? (h(), l("div", D, [X.value ? (h(), l("span", {
+			J.value || W.value ? (m(), c("div", E, [J.value ? (m(), c("span", {
 				key: 0,
-				id: `${H.value}-help`,
-				class: m(["m-input-field__help", { "m-input-field__help--invalid": Z.value }]),
-				role: Z.value ? "alert" : void 0
-			}, v(X.value), 11, O)) : c("", !0), K.value ? (h(), l("span", {
+				id: `${B.value}-help`,
+				class: p(["m-input-field__help", { "m-input-field__help--invalid": Y.value }]),
+				role: Y.value ? "alert" : void 0
+			}, _(J.value), 11, D)) : s("", !0), W.value ? (m(), c("span", {
 				key: 1,
-				id: `${H.value}-count`,
+				id: `${B.value}-count`,
 				class: "m-input-field__count",
 				"aria-live": "polite"
-			}, v(Y.value), 9, k)) : c("", !0)])) : c("", !0)
+			}, _(q.value), 9, te)) : s("", !0)])) : s("", !0)
 		], 16));
 	}
 });
 //#endregion
-export { A as MInput };
+export { O as MInput };