morya-ui 0.2.6 → 0.2.7

package/dist/speed-dial/index.js

@@ -5,8 +5,8 @@ import { t as i } from "../overlayPlacement-Cd20JTD_.js";
 import { t as a } from "../useMenuKeyboard-BedmYE4W.js";
 import { t as o } from "../useMId-BXFYayPP.js";
 import { t as s } from "../icon-xUOyawgJ.js";
-import { c } from "../config-Dln2-u_v.js";
-import { n as l } from "../locale-DNYpTg5K.js";
+import { c } from "../config-BdK5ccNT.js";
+import { n as l } from "../locale-B36KH7c3.js";
 import "./style.js";
 import { Fragment as u, Teleport as d, Transition as f, computed as p, createBlock as m, createCommentVNode as h, createElementBlock as g, createElementVNode as _, createVNode as v, defineComponent as y, mergeProps as ee, nextTick as te, normalizeClass as ne, normalizeStyle as re, onBeforeUnmount as ie, openBlock as b, ref as x, renderList as S, renderSlot as C, toDisplayString as w, unref as T, useAttrs as E, watch as D, withCtx as ae } from "vue";
 //#region src/components/SpeedDial/SpeedDial.vue?vue&type=script&setup=true&lang.ts

package/dist/split-button/index.js

@@ -5,8 +5,8 @@ import { n as te, t as ne } from "../overlay-oR-5MDuE.js";
 import { t as re } from "../overlayPlacement-Cd20JTD_.js";
 import { t as r } from "../useMenuKeyboard-BedmYE4W.js";
 import { t as i } from "../useMId-BXFYayPP.js";
-import { c as a, o } from "../config-Dln2-u_v.js";
-import { n as s } from "../locale-DNYpTg5K.js";
+import { c as a, o } from "../config-BdK5ccNT.js";
+import { n as s } from "../locale-B36KH7c3.js";
 import "./style.js";
 import { Fragment as c, Teleport as ie, Transition as ae, computed as l, createBlock as u, createCommentVNode as d, createElementBlock as f, createElementVNode as p, createTextVNode as m, createVNode as h, defineComponent as g, mergeProps as _, nextTick as v, normalizeClass as y, normalizeStyle as oe, onBeforeUnmount as se, openBlock as b, ref as x, renderList as ce, renderSlot as le, toDisplayString as S, unref as C, useAttrs as ue, watch as w, withCtx as de } from "vue";
 //#region src/components/SplitButton/SplitButton.vue?vue&type=script&setup=true&lang.ts

package/dist/splitter/index.js

@@ -1,5 +1,5 @@
 import { r as e } from "../useComponentAttrs-BTYEe61P.js";
-import { n as t } from "../locale-DNYpTg5K.js";
+import { n as t } from "../locale-B36KH7c3.js";
 import "./style.js";
 import { Comment as n, Fragment as r, Text as i, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, defineComponent as u, mergeProps as d, normalizeClass as f, normalizeStyle as p, onBeforeUnmount as m, openBlock as h, ref as g, renderSlot as _, resolveDynamicComponent as v, unref as y, useAttrs as ee, useSlots as te, watch as b } from "vue";
 //#region src/components/Splitter/size.ts

package/dist/status/index.js

@@ -1,9 +1,18 @@
 import { t as e } from "../types-DGuu4Eg4.js";
-import { o as t } from "../config-Dln2-u_v.js";
+import { t } from "../Icon-DfpIfo2L.js";
+import { o as n } from "../config-BdK5ccNT.js";
 import "./style.js";
-import { computed as n, createElementBlock as r, createElementVNode as i, createTextVNode as a, defineComponent as o, normalizeClass as s, normalizeStyle as c, openBlock as l, renderSlot as u, toDisplayString as d } from "vue";
+import { computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, defineComponent as l, normalizeClass as u, normalizeStyle as d, openBlock as f, renderSlot as p, toDisplayString as m, useSlots as h } from "vue";
 //#region src/components/Status/Status.vue?vue&type=script&setup=true&lang.ts
-var f = { class: "m-status__label" }, p = /* @__PURE__ */ o({
+var g = {
+	key: 0,
+	class: "m-status__dot",
+	"aria-hidden": "true"
+}, _ = {
+	key: 1,
+	class: "m-status__icon",
+	"aria-hidden": "true"
+}, v = { class: "m-status__label" }, y = /* @__PURE__ */ l({
 	__name: "Status",
 	props: {
 		label: {},
@@ -13,27 +22,45 @@ var f = { class: "m-status__label" }, p = /* @__PURE__ */ o({
 			default: !1
 		},
 		size: {},
-		color: {}
+		color: {},
+		variant: { default: "dot" },
+		icon: {},
+		disabled: {
+			type: Boolean,
+			default: !1
+		}
 	},
-	setup(o) {
-		let p = o, m = t("Status", () => p.size), h = n(() => e(p.severity) ?? "secondary"), g = n(() => [
+	setup(l) {
+		let y = l, b = h(), x = n("Status", () => y.size), S = r(() => e(y.severity) ?? "secondary"), C = {
+			success: "check-circle",
+			danger: "x-circle",
+			warn: "warning",
+			info: "info",
+			primary: "info",
+			help: "info"
+		}, w = r(() => {
+			if (y.variant !== "text" && !(y.icon || b.icon)) return C[S.value];
+		}), T = r(() => y.icon ?? w.value), E = r(() => !!(b.icon || T.value)), D = r(() => y.variant !== "text" && !E.value), O = r(() => [
 			"m-status",
-			`m-status--${h.value}`,
-			`m-status--${m.value}`,
+			`m-status--${S.value}`,
+			`m-status--${x.value}`,
+			`m-status--${y.variant}`,
 			{
-				"m-status--processing": p.processing,
-				"m-status--custom": !!p.color
+				"m-status--processing": y.processing && (D.value || E.value),
+				"m-status--custom": !!y.color,
+				"m-status--disabled": y.disabled,
+				"m-status--has-icon": E.value
 			}
-		]), _ = n(() => p.color ? { "--m-status-color": p.color } : void 0);
-		return (e, t) => (l(), r("span", {
-			class: s(g.value),
-			style: c(_.value),
+		]), k = r(() => y.color ? { "--m-status-color": y.color } : void 0);
+		return (e, n) => (f(), o("span", {
+			class: u(O.value),
+			style: d(k.value),
 			role: "status"
-		}, [t[0] ||= i("span", {
-			class: "m-status__dot",
-			"aria-hidden": "true"
-		}, null, -1), i("span", f, [u(e.$slots, "default", {}, () => [a(d(o.label), 1)])])], 6));
+		}, [D.value ? (f(), o("span", g)) : E.value ? (f(), o("span", _, [p(e.$slots, "icon", {}, () => [T.value ? (f(), i(t, {
+			key: 0,
+			name: T.value
+		}, null, 8, ["name"])) : a("", !0)])])) : a("", !0), s("span", v, [p(e.$slots, "default", {}, () => [c(m(l.label), 1)])])], 6));
 	}
 });
 //#endregion
-export { p as MStatus };
+export { y as MStatus };

package/dist/status/style.css

@@ -989,41 +989,123 @@
     }
 }
 
+.m-icon {
+    color: currentColor;
+    display: inline-flex;
+    flex-shrink: 0;
+    height: 1rem;
+    line-height: 0;
+    vertical-align: middle;
+    width: 1rem;
+}
+
+.m-icon svg {
+    display: block;
+    height: 100%;
+    width: 100%;
+}
+
+.m-icon--sm,
+.m-icon--small {
+    height: 0.875rem;
+    width: 0.875rem;
+}
+
+.m-icon--md,
+.m-icon--normal {
+    height: 1rem;
+    width: 1rem;
+}
+
+.m-icon--lg,
+.m-icon--large {
+    height: 1.25rem;
+    width: 1.25rem;
+}
+
+.m-icon--spin svg {
+    animation: m-icon-spin var(--m-motion-spin-fast) linear infinite;
+}
+
+@keyframes m-icon-spin {
+    to {
+        transform: rotate(360deg);
+    }
+}
+
+@media (prefers-reduced-motion: reduce) {
+    .m-icon--spin svg {
+        animation: none;
+    }
+}
+
+:root[data-m-motion='none'] .m-icon--spin svg,
+:root[data-m-motion='reduced'] .m-icon--spin svg {
+    animation: none;
+}
+
 .m-status {
     --m-status-dot-size: 0.5rem;
+    --m-status-icon-size: 0.9375rem;
+    --m-status-soft-bg: color-mix(in srgb, currentColor 12%, transparent);
     align-items: center;
-    color: var(--m-color-text);
+    color: var(--m-color-text-muted);
     display: inline-flex;
     font-family: var(--m-font-sans);
-    font-size: var(--m-font-size-sm);
+    font-size: var(--m-font-size-md);
     font-weight: 500;
-    gap: var(--m-space-2);
-    line-height: 1.25;
+    gap: 0.375rem;
+    line-height: 1;
     vertical-align: middle;
+    white-space: nowrap;
 }
 
 .m-status__dot {
     background: currentColor;
     border-radius: var(--m-radius-full);
+    box-shadow: 0 0 0 0.1875rem var(--m-status-soft-bg);
     flex-shrink: 0;
     height: var(--m-status-dot-size);
+    position: relative;
     width: var(--m-status-dot-size);
 }
 
+.m-status__icon {
+    align-items: center;
+    color: inherit;
+    display: inline-flex;
+    flex-shrink: 0;
+    height: var(--m-status-icon-size);
+    justify-content: center;
+    line-height: 0;
+    width: var(--m-status-icon-size);
+}
+
+.m-status__icon :is(.m-icon, svg) {
+    display: block;
+    flex-shrink: 0;
+    height: 100%;
+    line-height: 0;
+    width: 100%;
+}
+
 .m-status__label {
+    line-height: 1.25;
     min-width: 0;
 }
 
 .m-status--small {
     --m-status-dot-size: 0.375rem;
+    --m-status-icon-size: 0.8125rem;
     font-size: var(--m-font-size-xs);
-    gap: var(--m-space-1);
+    gap: 0.3125rem;
 }
 
 .m-status--large {
-    --m-status-dot-size: 0.625rem;
-    font-size: var(--m-font-size-md);
-    gap: var(--m-space-2);
+    --m-status-dot-size: 0.5625rem;
+    --m-status-icon-size: 1.125rem;
+    font-size: var(--m-font-size-lg);
+    gap: 0.5rem;
 }
 
 .m-status--primary {
@@ -1034,14 +1116,6 @@
     color: var(--m-color-text-muted);
 }
 
-.m-status--secondary .m-status__dot {
-    background: color-mix(
-        in srgb,
-        var(--m-color-text-muted) 70%,
-        var(--m-color-surface)
-    );
-}
-
 .m-status--success {
     color: var(--m-color-success);
 }
@@ -1071,27 +1145,98 @@
     color: var(--m-status-color);
 }
 
-.m-status--processing .m-status__dot {
-    animation: m-status-pulse var(--m-motion-pulse) ease-in-out infinite;
+.m-status--disabled {
+    color: color-mix(
+        in srgb,
+        var(--m-color-text-muted) 55%,
+        var(--m-color-surface)
+    );
+}
+
+/* Soft badge: stronger fill so status reads as a marker, not plain text */
+.m-status--tag {
+    --m-status-soft-bg: color-mix(in srgb, currentColor 16%, transparent);
+    background: var(--m-status-soft-bg);
+    border-radius: var(--m-radius-full);
+    font-size: var(--m-font-size-xs);
+    gap: 0.3125rem;
+    height: 1.5rem;
+    padding: 0 0.625rem;
+}
+
+.m-status--tag .m-status__dot {
+    --m-status-dot-size: 0.375rem;
+    box-shadow: none;
+}
+
+.m-status--tag.m-status--has-icon {
+    gap: 0.25rem;
+    padding-inline-start: 0.4375rem;
+}
+
+.m-status--tag.m-status--large {
+    height: 1.75rem;
+    padding: 0 0.8125rem;
+}
+
+.m-status--tag.m-status--large.m-status--has-icon {
+    padding-inline-start: 0.5rem;
+}
+
+.m-status--tag.m-status--small {
+    height: 1.25rem;
+    padding: 0 0.5rem;
+}
+
+.m-status--tag.m-status--small.m-status--has-icon {
+    padding-inline-start: 0.375rem;
+}
+
+.m-status--processing .m-status__dot::after,
+.m-status--processing.m-status--has-icon .m-status__icon::after {
+    animation: m-status-pulse var(--m-motion-pulse) cubic-bezier(0, 0, 0.2, 1)
+        infinite;
+    background: currentColor;
+    border-radius: var(--m-radius-full);
+    content: "";
+    inset: 0;
+    opacity: 0.45;
+    position: absolute;
+}
+
+.m-status--processing.m-status--has-icon .m-status__icon {
+    position: relative;
+}
+
+.m-status--processing.m-status--has-icon .m-status__icon::after {
+    inset: -0.125rem;
 }
 
 @keyframes m-status-pulse {
-    0%,
-    100% {
-        box-shadow: 0 0 0 0 color-mix(in srgb, currentColor 45%, transparent);
+    0% {
+        opacity: 0.55;
+        transform: scale(1);
     }
-    70% {
-        box-shadow: 0 0 0 0.4rem transparent;
+    100% {
+        opacity: 0;
+        transform: scale(2.8);
     }
 }
 
 @media (prefers-reduced-motion: reduce) {
-    .m-status--processing .m-status__dot {
+    .m-status--processing .m-status__dot::after,
+    .m-status--processing.m-status--has-icon .m-status__icon::after {
         animation: none;
     }
 }
 
-:root[data-m-motion='none'] .m-status--processing .m-status__dot,
-:root[data-m-motion='reduced'] .m-status--processing .m-status__dot {
+:root[data-m-motion="none"] .m-status--processing .m-status__dot::after,
+:root[data-m-motion="reduced"] .m-status--processing .m-status__dot::after,
+:root[data-m-motion="none"]
+    .m-status--processing.m-status--has-icon
+    .m-status__icon::after,
+:root[data-m-motion="reduced"]
+    .m-status--processing.m-status--has-icon
+    .m-status__icon::after {
     animation: none;
 }

package/dist/status/style.js

@@ -1,3 +1,4 @@
 import '../theme/styles.css'
 import '../styles/base.css'
+import '../components/Icon/styles.css'
 import '../components/Status/styles.css'