maz-ui 3.47.2-beta.8 → 3.48.0

package/components/MazAccordion.d.ts

@@ -4,6 +4,7 @@ export interface Props {
     contentClass?: unknown;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: Partial<Record<`title-${number}`, (_: {
         isOpen: boolean;
     }) => any>> & Partial<Record<`content-${number}`, (_: {
@@ -14,7 +15,7 @@ declare function __VLS_template(): {
         }): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: HTMLDivElement;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -25,7 +26,7 @@ declare const __VLS_component: import("vue").DefineComponent<Props, {}, {}, {},
     id: string;
     modelValue: number;
     contentClass: undefined;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/components/MazAccordion.mjs

@@ -1,4 +1,4 @@
-import { openBlock as p, createElementBlock as b, createElementVNode as c, useId as V, computed as g, defineComponent as w, ref as f, onMounted as O, onUnmounted as B, normalizeClass as $, normalizeStyle as k, renderSlot as h, withDirectives as E, vShow as z, mergeModels as A, useModel as x, mergeProps as I, useSlots as L, Fragment as j, renderList as F, createBlock as N, withCtx as M, unref as y, createVNode as S } from "vue";
+import { openBlock as p, createElementBlock as g, createElementVNode as u, computed as $, useId as V, defineComponent as w, ref as f, onMounted as O, onUnmounted as B, normalizeClass as b, normalizeStyle as k, renderSlot as h, withDirectives as E, vShow as z, mergeModels as A, useModel as x, mergeProps as I, useSlots as L, Fragment as j, renderList as F, createBlock as N, withCtx as M, unref as y, createVNode as S } from "vue";
 import './assets/MazAccordion.css';const R = {
   xmlns: "http://www.w3.org/2000/svg",
   width: "1em",
@@ -6,9 +6,9 @@ import './assets/MazAccordion.css';const R = {
   fill: "none",
   viewBox: "0 0 24 24"
 };
-function P(r, n) {
-  return p(), b("svg", R, n[0] || (n[0] = [
-    c(
+function P(r, t) {
+  return p(), g("svg", R, t[0] || (t[0] = [
+    u(
       "path",
       {
         stroke: "currentColor",
@@ -26,10 +26,9 @@ function P(r, n) {
 const T = { render: P };
 function U({
   componentName: r,
-  providedId: n
+  providedId: t
 }) {
-  const o = V();
-  return g(() => n ?? `${r}-${o}`);
+  return $(() => t ?? `${r}-${V().replace(/:/g, "")}`);
 }
 const q = { class: "inner" }, D = /* @__PURE__ */ w({
   __name: "MazCardSpotlight",
@@ -42,16 +41,16 @@ const q = { class: "inner" }, D = /* @__PURE__ */ w({
     innerOpacity: { default: 0.95 }
   },
   setup(r) {
-    const n = r, o = f(), a = f(), s = f(!1);
-    function m({ clientX: d, clientY: u }) {
-      var e, _, t;
+    const t = r, l = f(), o = f(), s = f(!1);
+    function m({ clientX: d, clientY: c }) {
+      var e, _, n;
       s.value = !0;
-      const v = (e = a.value) == null ? void 0 : e.getBoundingClientRect();
-      v && ((t = (_ = o.value) == null ? void 0 : _.animate) == null || t.call(
+      const v = (e = o.value) == null ? void 0 : e.getBoundingClientRect();
+      v && ((n = (_ = l.value) == null ? void 0 : _.animate) == null || n.call(
         _,
         [
           {
-            transform: `translate(${d - v.left - v.width / 2}px,${u - v.top - v.height / 2}px)`
+            transform: `translate(${d - v.left - v.width / 2}px,${c - v.top - v.height / 2}px)`
           }
         ],
         {
@@ -60,23 +59,23 @@ const q = { class: "inner" }, D = /* @__PURE__ */ w({
         }
       ));
     }
-    const l = g(() => `var(--maz-color-${n.color}-alpha)`), i = g(() => `var(--maz-color-${n.color}-alpha-20)`);
+    const a = $(() => `var(--maz-color-${t.color}-alpha)`), i = $(() => `var(--maz-color-${t.color}-alpha-20)`);
     return O(() => {
       window.addEventListener("mousemove", m);
     }), B(() => {
       window.removeEventListener("mousemove", m);
-    }), (d, u) => (p(), b(
+    }), (d, c) => (p(), g(
       "div",
       {
-        class: $(["m-card-spotlight", { "maz-elevation": !d.noElevation }]),
+        class: b(["m-card-spotlight m-reset-css", { "maz-elevation": !d.noElevation }]),
         style: k({ backgroundColor: i.value, "--inner-opacity": d.innerOpacity })
       },
       [
-        c("div", q, [
-          c(
+        u("div", q, [
+          u(
             "div",
             {
-              class: $(["content", [{ "maz-p-4": d.padding }, d.contentClass]])
+              class: b(["content", [{ "maz-p-4": d.padding }, d.contentClass]])
             },
             [
               h(d.$slots, "default", {}, void 0, !0)
@@ -85,13 +84,13 @@ const q = { class: "inner" }, D = /* @__PURE__ */ w({
             /* CLASS */
           )
         ]),
-        E(c(
+        E(u(
           "div",
           {
             ref_key: "blobElement",
-            ref: o,
+            ref: l,
             class: "blob",
-            style: k({ backgroundColor: l.value })
+            style: k({ backgroundColor: a.value })
           },
           null,
           4
@@ -99,11 +98,11 @@ const q = { class: "inner" }, D = /* @__PURE__ */ w({
         ), [
           [z, s.value]
         ]),
-        E(c(
+        E(u(
           "div",
           {
             ref_key: "fakeblobElement",
-            ref: a,
+            ref: o,
             class: "fakeblob"
           },
           null,
@@ -117,12 +116,12 @@ const q = { class: "inner" }, D = /* @__PURE__ */ w({
       /* CLASS, STYLE */
     ));
   }
-}), C = (r, n) => {
-  const o = r.__vccOpts || r;
-  for (const [a, s] of n)
-    o[a] = s;
-  return o;
-}, H = /* @__PURE__ */ C(D, [["__scopeId", "data-v-30c7054c"]]), W = ["aria-hidden"], G = /* @__PURE__ */ w({
+}), C = (r, t) => {
+  const l = r.__vccOpts || r;
+  for (const [o, s] of t)
+    l[o] = s;
+  return l;
+}, H = /* @__PURE__ */ C(D, [["__scopeId", "data-v-4f773edc"]]), W = ["aria-hidden"], G = /* @__PURE__ */ w({
   inheritAttrs: !1,
   __name: "MazExpandAnimation",
   props: /* @__PURE__ */ A({
@@ -134,44 +133,44 @@ const q = { class: "inner" }, D = /* @__PURE__ */ w({
   }),
   emits: ["update:modelValue"],
   setup(r) {
-    const n = x(r, "modelValue"), o = f(!n.value), a = f();
+    const t = x(r, "modelValue"), l = f(!t.value), o = f();
     function s() {
-      n.value || (o.value = !0);
+      t.value || (l.value = !0);
     }
     function m() {
-      n.value && (o.value = !1);
+      t.value && (l.value = !1);
     }
     return O(() => {
-      var l, i;
-      (l = a.value) == null || l.addEventListener("transitionstart", s, !1), (i = a.value) == null || i.addEventListener("transitionend", m, !1);
+      var a, i;
+      (a = o.value) == null || a.addEventListener("transitionstart", s, !1), (i = o.value) == null || i.addEventListener("transitionend", m, !1);
     }), B(() => {
-      var l, i;
-      (l = a.value) == null || l.removeEventListener("transitionstart", s, !1), (i = a.value) == null || i.removeEventListener("transitionend", m, !1);
-    }), (l, i) => (p(), b("div", {
+      var a, i;
+      (a = o.value) == null || a.removeEventListener("transitionstart", s, !1), (i = o.value) == null || i.removeEventListener("transitionend", m, !1);
+    }), (a, i) => (p(), g("div", {
       ref_key: "expandAnimationRef",
-      ref: a,
-      class: $(["m-expand-animation", { "m-expand-animation--expanded": n.value }]),
-      "aria-hidden": !n.value,
+      ref: o,
+      class: b(["m-expand-animation m-reset-css", { "m-expand-animation--expanded": t.value }]),
+      "aria-hidden": !t.value,
       role: "region",
-      style: k([{ "--expand-animation-duration": l.duration, "--expand-animation-timing-function": l.timingFunction }])
+      style: k([{ "--expand-animation-duration": a.duration, "--expand-animation-timing-function": a.timingFunction }])
     }, [
-      c(
+      u(
         "div",
-        I({ class: "m-expand-animation__inner" }, l.$attrs, {
+        I({ class: "m-expand-animation__inner" }, a.$attrs, {
           class: {
-            "--overflow-hidden": o.value
+            "--overflow-hidden": l.value
           }
         }),
         [
-          h(l.$slots, "default", {}, void 0, !0)
+          h(a.$slots, "default", {}, void 0, !0)
         ],
         16
         /* FULL_PROPS */
       )
     ], 14, W));
   }
-}), J = /* @__PURE__ */ C(G, [["__scopeId", "data-v-3bfdfbc1"]]), K = {
-  class: "m-accordion",
+}), J = /* @__PURE__ */ C(G, [["__scopeId", "data-v-058a2912"]]), K = {
+  class: "m-accordion m-reset-css",
   role: "presentation"
 }, Q = ["id", "aria-controls", "aria-expanded", "onClick"], X = /* @__PURE__ */ w({
   __name: "MazAccordion",
@@ -181,68 +180,68 @@ const q = { class: "inner" }, D = /* @__PURE__ */ w({
     contentClass: { default: void 0 }
   },
   emits: ["update:model-value"],
-  setup(r, { emit: n }) {
-    const o = r, a = n, s = U({
+  setup(r, { emit: t }) {
+    const l = r, o = t, s = U({
       componentName: "MazAccordion",
-      providedId: o.id
-    }), m = L(), l = g(
+      providedId: l.id
+    }), m = L(), a = $(
       () => Object.keys(m).filter((e) => e.startsWith("title-")).length
-    ), i = f(o.modelValue), d = g({
-      get: () => o.modelValue || i.value,
+    ), i = f(l.modelValue), d = $({
+      get: () => l.modelValue || i.value,
       set: (e) => {
-        i.value = e, a("update:model-value", e);
+        i.value = e, o("update:model-value", e);
       }
     });
-    function u(e) {
+    function c(e) {
       return d.value === e;
     }
     function v(e) {
-      d.value === e ? (i.value = 0, a("update:model-value", 0)) : (i.value = e, a("update:model-value", e));
+      d.value === e ? (i.value = 0, o("update:model-value", 0)) : (i.value = e, o("update:model-value", e));
     }
-    return (e, _) => (p(), b("div", K, [
-      (p(!0), b(
+    return (e, _) => (p(), g("div", K, [
+      (p(!0), g(
         j,
         null,
-        F(l.value, (t) => (p(), N(
+        F(a.value, (n) => (p(), N(
           H,
           {
-            key: t,
+            key: n,
             class: "m-accordion__spotlight",
             padding: !1
           },
           {
             default: M(() => [
-              c("button", {
-                id: `step-${t}-${y(s)}`,
+              u("button", {
+                id: `step-${n}-${y(s)}`,
                 class: "m-accordion__header",
-                "aria-controls": `step-${t}-${y(s)}`,
-                "aria-expanded": u(t),
-                onClick: (Y) => v(t)
+                "aria-controls": `step-${n}-${y(s)}`,
+                "aria-expanded": c(n),
+                onClick: (Y) => v(n)
               }, [
-                h(e.$slots, `title-${t}`, {
-                  isOpen: u(t)
+                h(e.$slots, `title-${n}`, {
+                  isOpen: c(n)
                 }, void 0, !0),
                 S(y(T), {
-                  class: $(["header-icon", { "--rotate": u(t) }])
+                  class: b(["header-icon", { "--rotate": c(n) }])
                 }, null, 8, ["class"])
               ], 8, Q),
               S(J, {
                 "animation-duration": "300ms",
-                "model-value": u(t),
-                "aria-labelledby": `step-${t}-${y(s)}`
+                "model-value": c(n),
+                "aria-labelledby": `step-${n}-${y(s)}`
               }, {
                 default: M(() => [
-                  c(
+                  u(
                     "div",
                     {
-                      class: $(["m-accordion__content", e.contentClass])
+                      class: b(["m-accordion__content", e.contentClass])
                     },
                     [
                       h(e.$slots, "content", {
-                        isOpen: u(t)
+                        isOpen: c(n)
                       }, void 0, !0),
-                      h(e.$slots, `content-${t}`, {
-                        isOpen: u(t)
+                      h(e.$slots, `content-${n}`, {
+                        isOpen: c(n)
                       }, void 0, !0)
                     ],
                     2
@@ -264,7 +263,7 @@ const q = { class: "inner" }, D = /* @__PURE__ */ w({
       ))
     ]));
   }
-}), ee = /* @__PURE__ */ C(X, [["__scopeId", "data-v-052b6500"]]);
+}), ee = /* @__PURE__ */ C(X, [["__scopeId", "data-v-6a945de6"]]);
 export {
   ee as default
 };

package/components/MazAnimatedCounter.d.ts

@@ -1,33 +1,4 @@
-declare function __VLS_template(): {
-    slots: {
-        prefix?(_: {}): any;
-        prefix?(_: {}): any;
-        suffix?(_: {}): any;
-        suffix?(_: {}): any;
-    };
-    refs: {};
-    attrs: Partial<{}>;
-};
-type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import("vue").DefineComponent<{
-    /**
-     * The number to animate
-     */
-    count: number;
-    /**
-     * Duration of the animation in milliseconds
-     * @default 1000
-     */
-    duration?: number;
-    /**
-     * Suffix to display next to the number
-     */
-    prefix?: string;
-    /**
-     * Suffix to display next to the number
-     */
-    suffix?: string;
-}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+type __VLS_Props = {
     /**
      * The number to animate
      */
@@ -45,11 +16,24 @@ declare const __VLS_component: import("vue").DefineComponent<{
      * Suffix to display next to the number
      */
     suffix?: string;
-}> & Readonly<{}>, {
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        prefix?(_: {}): any;
+        prefix?(_: {}): any;
+        suffix?(_: {}): any;
+        suffix?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLSpanElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
     duration: number;
     prefix: string;
     suffix: string;
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, HTMLSpanElement>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/components/MazAnimatedCounter.mjs

@@ -1,4 +1,4 @@
-import { defineComponent as v, useSlots as x, computed as l, ref as _, watch as h, openBlock as d, createElementBlock as p, normalizeClass as y, normalizeStyle as z, createElementVNode as C, renderSlot as i, createTextVNode as o, toDisplayString as a, createCommentVNode as S } from "vue";
+import { defineComponent as v, useSlots as x, computed as l, ref as _, watch as h, openBlock as d, createElementBlock as m, normalizeClass as y, normalizeStyle as z, createElementVNode as C, renderSlot as i, createTextVNode as o, toDisplayString as a, createCommentVNode as S } from "vue";
 import './assets/MazAnimatedCounter.css';const $ = { class: "maz-sr-only" }, k = {
   key: 0,
   class: "m-animated-counter__fix"
@@ -20,18 +20,18 @@ import './assets/MazAnimatedCounter.css';const $ = { class: "maz-sr-only" }, k =
         }, 100));
       }
     );
-    const m = l(() => `${t.duration}ms`);
-    return (e, c) => (d(), p(
+    const p = l(() => `${t.duration}ms`);
+    return (e, c) => (d(), m(
       "span",
       {
-        class: y(["m-animated-counter", {
+        class: y(["m-animated-counter m-reset-css", {
           "--animated": f.value,
           "--prefixed": r.value,
           "--suffixed": u.value
         }]),
         style: z({
           "--count": e.count,
-          "--animation-duration": m.value
+          "--animation-duration": p.value
         })
       },
       [
@@ -56,7 +56,7 @@ import './assets/MazAnimatedCounter.css';const $ = { class: "maz-sr-only" }, k =
             )
           ], !0)
         ]),
-        r.value || u.value ? (d(), p("span", k, [
+        r.value || u.value ? (d(), m("span", k, [
           i(e.$slots, "prefix", {}, () => [
             o(
               a(e.prefix),
@@ -82,7 +82,7 @@ import './assets/MazAnimatedCounter.css';const $ = { class: "maz-sr-only" }, k =
   for (const [r, u] of t)
     s[r] = u;
   return s;
-}, V = /* @__PURE__ */ M(A, [["__scopeId", "data-v-fc78b268"]]);
+}, V = /* @__PURE__ */ M(A, [["__scopeId", "data-v-c2cd744f"]]);
 export {
   V as default
 };

package/components/MazAvatar.d.ts

@@ -57,13 +57,14 @@ export interface Props {
     loading?: 'lazy' | 'eager' | 'intersecting';
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         "round-text"?(_: {}): any;
         icon?(_: {}): any;
         caption?(_: {}): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {

package/components/MazAvatar.mjs

@@ -1,4 +1,4 @@
-import { M as f } from "./chunks/MazAvatar-DFoZvWmg.mjs";
+import { M as f } from "./chunks/MazAvatar-CuOWgdVG.mjs";
 export {
   f as default
 };

package/components/MazBackdrop.d.ts

@@ -1,13 +1,29 @@
 import { type HTMLAttributes } from 'vue';
-export interface Props {
+export interface MazBackdropProps {
+    /** @model Modal's model value */
     modelValue?: boolean;
+    /** Teleport selector */
     teleportSelector?: string;
+    /** Function called before modal is close */
     beforeClose?: () => Promise<void> | void;
+    /** Persistent dialog (not closable by clicking outside and remove close button) */
     persistent?: boolean;
+    /** Prevent close on escape key */
     noCloseOnEscKey?: boolean;
+    /** Transition name */
     transitionName?: string;
+    /** Backdrop class */
     backdropClass?: HTMLAttributes['class'];
+    /** Backdrop content class */
     backdropContentClass?: HTMLAttributes['class'];
+    /** Add padding to the content */
+    contentPadding?: boolean;
+    /** Justify content */
+    justify?: 'center' | 'end' | 'start' | 'space-between' | 'space-around' | 'none';
+    /** Align content */
+    align?: 'center' | 'end' | 'start' | 'none';
+    /** Variant */
+    variant?: 'bottom-sheet' | 'dialog' | 'drawer';
 }
 declare function close(): void;
 declare function toggleModal(value: any): Promise<void>;
@@ -16,16 +32,18 @@ declare function onBackdropAnimationLeave(): void;
 declare function onBackdropClicked(): void;
 declare function onKeyPress(event: KeyboardEvent): void;
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         default?(_: {
             close: typeof close;
+            onBackdropClicked: typeof onBackdropClicked;
         }): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import("vue").DefineComponent<Props, {
+declare const __VLS_component: import("vue").DefineComponent<MazBackdropProps, {
     onBackdropAnimationEnter: typeof onBackdropAnimationEnter;
     onBackdropAnimationLeave: typeof onBackdropAnimationLeave;
     onBackdropClicked: typeof onBackdropClicked;
@@ -38,21 +56,12 @@ declare const __VLS_component: import("vue").DefineComponent<Props, {
     open: (value: void) => any;
     "update:model-value": (value: boolean) => any;
     "before-close": (value: void) => any;
-}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+}, string, import("vue").PublicProps, Readonly<MazBackdropProps> & Readonly<{
     onClose?: ((value?: void | undefined) => any) | undefined;
     onOpen?: ((value?: void | undefined) => any) | undefined;
     "onUpdate:model-value"?: ((value: boolean) => any) | undefined;
     "onBefore-close"?: ((value?: void | undefined) => any) | undefined;
-}>, {
-    modelValue: boolean;
-    teleportSelector: string;
-    beforeClose: () => Promise<void> | void;
-    persistent: boolean;
-    noCloseOnEscKey: boolean;
-    transitionName: string;
-    backdropClass: HTMLAttributes["class"];
-    backdropContentClass: HTMLAttributes["class"];
-}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {