maz-ui 3.47.2-beta.2 → 3.47.2-beta.20

package/components/MazCircularProgressBar.mjs

@@ -1,15 +1,14 @@
-import { useId as w, computed as r, defineComponent as _, useCssVars as g, useSlots as $, ref as S, watch as B, openBlock as p, createElementBlock as m, normalizeClass as b, createElementVNode as n, renderSlot as l, createTextVNode as i, toDisplayString as u, createCommentVNode as M, normalizeStyle as I, unref as k, createBlock as P, createSlots as N, withCtx as x } from "vue";
-import './assets/MazCircularProgressBar.css';function V({
+import { computed as r, useId as C, defineComponent as x, useSlots as _, ref as P, watch as S, openBlock as p, createElementBlock as m, normalizeClass as B, normalizeStyle as y, createElementVNode as n, renderSlot as l, createTextVNode as i, toDisplayString as u, createCommentVNode as M, unref as h, createBlock as I, createSlots as N, withCtx as k } from "vue";
+import './assets/MazCircularProgressBar.css';function A({
   componentName: a,
   providedId: e
 }) {
-  const s = w();
-  return r(() => e ?? `${a}-${s}`);
+  return r(() => e ?? `${a}-${C().replace(/:/g, "")}`);
 }
-const A = { class: "maz-sr-only" }, D = {
+const V = { class: "maz-sr-only" }, b = {
   key: 0,
   class: "m-animated-counter__fix"
-}, E = /* @__PURE__ */ _({
+}, D = /* @__PURE__ */ x({
   __name: "MazAnimatedCounter",
   props: {
     count: {},
@@ -18,83 +17,83 @@ const A = { class: "maz-sr-only" }, D = {
     suffix: { default: void 0 }
   },
   setup(a) {
-    g((o) => ({
-      "7cf84c3b": h.value,
-      a2b7049a: o.count
-    }));
-    const e = a, s = $(), f = r(() => !!e.prefix || !!s.prefix), c = r(() => !!e.suffix || !!s.suffix), d = S(!0);
-    B(
+    const e = a, s = _(), f = r(() => !!e.prefix || !!s.prefix), c = r(() => !!e.suffix || !!s.suffix), d = P(!0);
+    S(
       () => e.count,
-      (o, v) => {
-        o !== v && (d.value = !1, setTimeout(() => {
+      (t, g) => {
+        t !== g && (d.value = !1, setTimeout(() => {
           d.value = !0;
         }, 100));
       }
     );
-    const h = r(() => `${e.duration}ms`);
-    return (o, v) => (p(), m(
+    const v = r(() => `${e.duration}ms`);
+    return (t, g) => (p(), m(
       "span",
       {
-        class: b(["m-animated-counter", {
+        class: B(["m-animated-counter", {
           "--animated": d.value,
           "--prefixed": f.value,
           "--suffixed": c.value
-        }])
+        }]),
+        style: y({
+          "--count": t.count,
+          "--animation-duration": v.value
+        })
       },
       [
-        n("span", A, [
-          l(o.$slots, "prefix", {}, () => [
+        n("span", V, [
+          l(t.$slots, "prefix", {}, () => [
             i(
-              u(o.prefix),
+              u(t.prefix),
               1
               /* TEXT */
             )
           ], !0),
           i(
-            " " + u(o.count) + " ",
+            " " + u(t.count) + " ",
             1
             /* TEXT */
           ),
-          l(o.$slots, "suffix", {}, () => [
+          l(t.$slots, "suffix", {}, () => [
             i(
-              u(o.suffix),
+              u(t.suffix),
               1
               /* TEXT */
             )
           ], !0)
         ]),
-        f.value || c.value ? (p(), m("span", D, [
-          l(o.$slots, "prefix", {}, () => [
+        f.value || c.value ? (p(), m("span", b, [
+          l(t.$slots, "prefix", {}, () => [
             i(
-              u(o.prefix),
+              u(t.prefix),
               1
               /* TEXT */
             )
           ], !0),
-          l(o.$slots, "suffix", {}, () => [
+          l(t.$slots, "suffix", {}, () => [
             i(
-              u(o.suffix),
+              u(t.suffix),
               1
               /* TEXT */
             )
           ], !0)
         ])) : M("v-if", !0)
       ],
-      2
-      /* CLASS */
+      6
+      /* CLASS, STYLE */
     ));
   }
-}), y = (a, e) => {
+}), $ = (a, e) => {
   const s = a.__vccOpts || a;
   for (const [f, c] of e)
     s[f] = c;
   return s;
-}, L = /* @__PURE__ */ y(E, [["__scopeId", "data-v-95ad1bb8"]]), T = { class: "outer" }, W = { class: "inner" }, j = { key: 0 }, q = {
+}, E = /* @__PURE__ */ $(D, [["__scopeId", "data-v-fc78b268"]]), L = { class: "outer" }, T = { class: "inner" }, W = { key: 0 }, j = {
   xmlns: "http://www.w3.org/2000/svg",
   height: "1em",
   width: "1em",
   viewBox: "0 0 100 100"
-}, G = ["id"], O = ["stop-color"], U = ["stop-color"], F = ["stroke-width", "stroke", "stroke-linecap"], H = /* @__PURE__ */ _({
+}, q = ["id"], G = ["stop-color"], O = ["stop-color"], U = ["stroke-width", "stroke", "stroke-linecap"], F = /* @__PURE__ */ x({
   __name: "MazCircularProgressBar",
   props: {
     percentage: { default: 0 },
@@ -106,51 +105,54 @@ const A = { class: "maz-sr-only" }, D = {
     suffix: { default: void 0 },
     strokeLinecap: { default: "round" },
     strokeWidth: { default: 6 },
-    stroke: { default: void 0 }
+    stroke: { default: void 0 },
+    successPercentage: { default: 100 },
+    warningPercentage: { default: 75 },
+    dangerPercentage: { default: 50 }
   },
   setup(a) {
-    g((t) => ({
-      "6e9e446d": z.value,
-      "31fcb5e0": C.value
-    }));
-    const e = a, s = $(), f = r(() => !!e.prefix || !!s.prefix), c = r(() => !!e.suffix || !!s.suffix), d = V({
+    const e = a, s = _(), f = r(() => !!e.prefix || !!s.prefix), c = r(() => !!e.suffix || !!s.suffix), d = A({
       componentName: "MazCircularProgressBar"
-    }), h = r(() => e.percentage > 100 ? 100 : e.percentage <= 0 ? 0.5 : e.percentage), o = r(
-      () => e.autoColor ? v(e.percentage) : e.color
+    }), v = r(() => e.percentage > 100 ? 100 : e.percentage <= 0 ? 0.5 : e.percentage), t = r(
+      () => e.autoColor ? g(v.value) : e.color
     );
-    function v(t) {
-      return t < 50 || t > 100 ? "danger" : t < 100 ? "warning" : "success";
+    function g(o) {
+      return o < e.dangerPercentage || o > 100 ? "danger" : o < e.warningPercentage ? "warning" : o >= e.successPercentage ? "success" : "primary";
     }
-    const z = r(() => `${e.duration}ms`), C = r(() => Math.round(290 - 290 * (h.value / 100)));
-    return (t, J) => (p(), m(
+    const z = r(() => `${e.duration}ms`), w = r(() => Math.round(290 - 290 * (v.value / 100)));
+    return (o, H) => (p(), m(
       "div",
       {
         class: "m-circular-progress-bar",
-        style: I([
+        style: y([
           {
-            fontSize: t.size
+            "--animation-duration": z.value,
+            "--dashoffset": w.value
+          },
+          {
+            fontSize: o.size
           }
         ])
       },
       [
-        n("div", T, [
-          n("div", W, [
-            k(s).default ? (p(), m("span", j, [
-              l(t.$slots, "default", {}, void 0, !0)
-            ])) : (p(), P(L, {
+        n("div", L, [
+          n("div", T, [
+            h(s).default ? (p(), m("span", W, [
+              l(o.$slots, "default", {}, void 0, !0)
+            ])) : (p(), I(E, {
               key: 1,
-              count: t.percentage,
-              duration: t.duration
+              count: o.percentage,
+              duration: o.duration
             }, N({
               _: 2
               /* DYNAMIC */
             }, [
               f.value ? {
                 name: "prefix",
-                fn: x(() => [
-                  l(t.$slots, "prefix", {}, () => [
+                fn: k(() => [
+                  l(o.$slots, "prefix", {}, () => [
                     i(
-                      u(t.prefix),
+                      u(o.prefix),
                       1
                       /* TEXT */
                     )
@@ -160,10 +162,10 @@ const A = { class: "maz-sr-only" }, D = {
               } : void 0,
               c.value ? {
                 name: "suffix",
-                fn: x(() => [
-                  l(t.$slots, "suffix", {}, () => [
+                fn: k(() => [
+                  l(o.$slots, "suffix", {}, () => [
                     i(
-                      u(t.suffix),
+                      u(o.suffix),
                       1
                       /* TEXT */
                     )
@@ -174,10 +176,10 @@ const A = { class: "maz-sr-only" }, D = {
             ]), 1032, ["count", "duration"]))
           ])
         ]),
-        (p(), m("svg", q, [
+        (p(), m("svg", j, [
           n("defs", null, [
             n("linearGradient", {
-              id: `${k(d)}-gradient`,
+              id: `${h(d)}-gradient`,
               x1: "0",
               x2: "0",
               y1: "1",
@@ -185,32 +187,32 @@ const A = { class: "maz-sr-only" }, D = {
             }, [
               n("stop", {
                 offset: "0%",
-                "stop-color": o.value ? `var(--maz-color-${o.value}-400)` : "var(--maz-color-primary)"
-              }, null, 8, O),
+                "stop-color": t.value ? `var(--maz-color-${t.value}-400)` : "var(--maz-color-primary)"
+              }, null, 8, G),
               n("stop", {
                 offset: "100%",
-                "stop-color": o.value ? `var(--maz-color-${o.value}-700)` : "var(--maz-color-secondary)"
-              }, null, 8, U)
-            ], 8, G)
+                "stop-color": t.value ? `var(--maz-color-${t.value}-700)` : "var(--maz-color-secondary)"
+              }, null, 8, O)
+            ], 8, q)
           ]),
           n("circle", {
             cx: "50",
             cy: "50",
             r: "46",
-            "stroke-width": t.strokeWidth,
+            "stroke-width": o.strokeWidth,
             "stroke-dasharray": "290",
             "stroke-dashoffset": "290",
-            stroke: t.stroke ? t.stroke : `url(#${k(d)}-gradient)`,
+            stroke: o.stroke ? o.stroke : `url(#${h(d)}-gradient)`,
             fill: "none",
-            "stroke-linecap": t.strokeLinecap
-          }, null, 8, F)
+            "stroke-linecap": o.strokeLinecap
+          }, null, 8, U)
         ]))
       ],
       4
       /* STYLE */
     ));
   }
-}), Q = /* @__PURE__ */ y(H, [["__scopeId", "data-v-e15b070e"]]);
+}), K = /* @__PURE__ */ $(F, [["__scopeId", "data-v-3746a281"]]);
 export {
-  Q as default
+  K as default
 };

package/components/MazDialog.d.ts

@@ -1,5 +1,6 @@
 import type { ComponentPublicInstance, HTMLAttributes } from 'vue';
-import { type Props as MazBackdropProps } from './MazBackdrop.vue';
+import { nextTick } from 'vue';
+import { type MazBackdropProps } from './MazBackdrop.vue';
 export interface InternalProps {
     /** @model Modal's model value */
     modelValue?: boolean;
@@ -7,29 +8,32 @@ export interface InternalProps {
     title?: string;
     /** Remove the close button in header */
     noClose?: boolean;
-    /** Modal's width */
-    width?: string;
     /** Modal's max-width */
     maxWidth?: string;
-    /** Modal's max-height */
-    maxHeight?: string;
+    /** Modal's min-width */
+    minWidth?: string;
     /**  Modal's content becomes scrollable - warning: a overflow is applied */
     scrollable?: boolean;
     /** Persistent dialog (not closable by clicking outside and remove close button) */
     persistent?: boolean;
 }
-export type Props = InternalProps & MazBackdropProps;
+export type MazDialogProps = InternalProps & MazBackdropProps;
+type __VLS_Props = InternalProps & MazBackdropProps;
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         header?(_: {
             close: () => void;
+            onBackdropClicked: () => void;
         }): any;
         title?(_: {}): any;
         default?(_: {
             close: () => void;
+            onBackdropClicked: () => void;
         }): any;
         footer?(_: {
             close: () => void;
+            onBackdropClicked: () => void;
         }): any;
     };
     refs: {
@@ -45,6 +49,10 @@ declare function __VLS_template(): {
                 readonly transitionName?: string | undefined;
                 readonly backdropClass?: HTMLAttributes["class"];
                 readonly backdropContentClass?: HTMLAttributes["class"];
+                readonly contentPadding?: boolean | undefined;
+                readonly justify?: ("center" | "end" | "start" | "space-between" | "space-around" | "none") | undefined;
+                readonly align?: ("center" | "end" | "start" | "none") | undefined;
+                readonly variant?: ("bottom-sheet" | "dialog" | "drawer") | undefined;
                 readonly onClose?: ((value?: void | undefined) => any) | undefined;
                 readonly onOpen?: ((value?: void | undefined) => any) | undefined;
                 readonly "onUpdate:model-value"?: ((value: boolean) => any) | undefined;
@@ -82,16 +90,7 @@ declare function __VLS_template(): {
                 open: (value: void) => any;
                 "update:model-value": (value: boolean) => any;
                 "before-close": (value: void) => any;
-            }, string, {
-                modelValue: boolean;
-                teleportSelector: string;
-                beforeClose: () => Promise<void> | void;
-                persistent: boolean;
-                noCloseOnEscKey: boolean;
-                transitionName: string;
-                backdropClass: HTMLAttributes["class"];
-                backdropContentClass: HTMLAttributes["class"];
-            }, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & {
+            }, string, {}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & {
                 beforeCreate?: (() => void) | (() => void)[];
                 created?: (() => void) | (() => void)[];
                 beforeMount?: (() => void) | (() => void)[];
@@ -109,23 +108,14 @@ declare function __VLS_template(): {
                 errorCaptured?: ((err: unknown, instance: ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: ComponentPublicInstance | null, info: string) => boolean | void)[];
             };
             $forceUpdate: () => void;
-            $nextTick: typeof import("vue").nextTick;
+            $nextTick: typeof nextTick;
             $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (...args: [R, R, import("@vue/reactivity").OnCleanup]) => any : (...args: [any, any, import("@vue/reactivity").OnCleanup]) => any, options?: import("vue").WatchOptions): import("vue").WatchStopHandle;
-        } & Readonly<{
-            modelValue: boolean;
-            teleportSelector: string;
-            beforeClose: () => Promise<void> | void;
-            persistent: boolean;
-            noCloseOnEscKey: boolean;
-            transitionName: string;
-            backdropClass: HTMLAttributes["class"];
-            backdropContentClass: HTMLAttributes["class"];
-        }> & Omit<Readonly<MazBackdropProps> & Readonly<{
+        } & Readonly<{}> & Omit<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;
-        }>, "close" | "onBackdropAnimationEnter" | "onBackdropAnimationLeave" | "onBackdropClicked" | "present" | "toggleModal" | "onKeyPress" | ("modelValue" | "teleportSelector" | "beforeClose" | "persistent" | "noCloseOnEscKey" | "transitionName" | "backdropClass" | "backdropContentClass")> & import("vue").ShallowUnwrapRef<{
+        }>, "close" | "onBackdropAnimationEnter" | "onBackdropAnimationLeave" | "onBackdropClicked" | "present" | "toggleModal" | "onKeyPress"> & import("vue").ShallowUnwrapRef<{
             onBackdropAnimationEnter: () => void;
             onBackdropAnimationLeave: () => void;
             onBackdropClicked: () => void;
@@ -137,30 +127,31 @@ declare function __VLS_template(): {
             $slots: {
                 default?(_: {
                     close: () => void;
+                    onBackdropClicked: () => void;
                 }): any;
             };
         }) | null;
+        dialogContent: HTMLDivElement;
     };
-    attrs: Partial<{}>;
+    rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import("vue").DefineComponent<InternalProps & MazBackdropProps, {
+declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {
     close: () => any;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: (value: void) => any;
     open: (value: void) => any;
     "update:model-value": (value: boolean) => any;
-}, string, import("vue").PublicProps, Readonly<InternalProps & MazBackdropProps> & Readonly<{
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onClose?: ((value?: void | undefined) => any) | undefined;
     onOpen?: ((value?: void | undefined) => any) | undefined;
     "onUpdate:model-value"?: ((value: boolean) => any) | undefined;
 }>, {
     title: string;
-    width: string;
     persistent: boolean;
     noClose: boolean;
     maxWidth: string;
-    maxHeight: string;
+    minWidth: string;
     scrollable: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;

package/components/MazDialog.mjs

@@ -1,4 +1,4 @@
-import { M as f } from "./chunks/MazDialog-khofH-7I.mjs";
+import { M as f } from "./chunks/MazDialog-Ca3jJ12T.mjs";
 export {
   f as default
 };

package/components/MazDialogPromise.d.ts

@@ -1,5 +1,5 @@
 import type { DialogCustomButton, DialogData } from './MazDialogPromise/useMazDialogPromise';
-import { type Props as MazDialogProps } from './MazDialog.vue';
+import { type MazDialogProps } from './MazDialog.vue';
 export interface MazDialogPromiseProps {
     /** Dialog Data - @type DialogData */
     data?: DialogData;
@@ -13,12 +13,12 @@ export interface MazDialogPromiseProps {
 export type Props = MazDialogPromiseProps & MazDialogProps & DialogData;
 export { useMazDialogPromise } from './MazDialogPromise/useMazDialogPromise';
 export type { ActionButton, DialogButton, DialogCustomButton, DialogData, DialogState, PromiseButton } from './MazDialogPromise/useMazDialogPromise';
-declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<MazDialogPromiseProps & import("./MazDialog.vue").InternalProps & import("./MazBackdrop.vue").Props & DialogData, {
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<MazDialogPromiseProps & import("./MazDialog.vue").InternalProps & import("./MazBackdrop.vue").MazBackdropProps & DialogData, {
     close: () => any;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: (value: void) => any;
     open: (value: void) => any;
-}, string, import("vue").PublicProps, Readonly<MazDialogPromiseProps & import("./MazDialog.vue").InternalProps & import("./MazBackdrop.vue").Props & DialogData> & Readonly<{
+}, string, import("vue").PublicProps, Readonly<MazDialogPromiseProps & import("./MazDialog.vue").InternalProps & import("./MazBackdrop.vue").MazBackdropProps & DialogData> & Readonly<{
     onClose?: ((value?: void | undefined) => any) | undefined;
     onOpen?: ((value?: void | undefined) => any) | undefined;
 }>, {

package/components/MazDialogPromise.mjs

@@ -1,4 +1,4 @@
-import { a as o, u as s } from "./chunks/MazDialogPromise-ZRA2ZrO4.mjs";
+import { a as o, u as s } from "./chunks/MazDialogPromise-DOnmLhui.mjs";
 export {
   o as default,
   s as useMazDialogPromise

package/components/MazDrawer.d.ts

@@ -1,7 +1,10 @@
-export interface Props {
+export interface MazDrawerProps {
     /** The title of the drawer */
     title?: string;
-    /** The variant of the drawer */
+    /**
+     * The variant of the drawer
+     * @values 'right', 'top', 'left', 'bottom'
+     */
     variant?: 'right' | 'top' | 'left' | 'bottom';
     /** The size of the drawer */
     size?: string;
@@ -11,6 +14,7 @@ export interface Props {
     noClose?: boolean;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         title?(_: {
             close: () => void;
@@ -20,15 +24,15 @@ declare function __VLS_template(): {
         }): 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, {} & {
+declare const __VLS_component: import("vue").DefineComponent<MazDrawerProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     close: () => any;
     open: () => any;
     "update:model-value": (value: boolean) => any;
     "before-close": () => any;
-}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+}, string, import("vue").PublicProps, Readonly<MazDrawerProps> & Readonly<{
     onClose?: (() => any) | undefined;
     onOpen?: (() => any) | undefined;
     "onUpdate:model-value"?: ((value: boolean) => any) | undefined;