maz-ui 3.47.2-beta.0 → 3.47.2-beta.10

package/components/MazCircularProgressBar.d.ts

@@ -1,65 +1,6 @@
 import type { Color } from './types';
 import { type SVGAttributes } from 'vue';
-declare function __VLS_template(): {
-    slots: {
-        default?(_: {}): any;
-        prefix?(_: {}): any;
-        suffix?(_: {}): any;
-    };
-    refs: {};
-    attrs: Partial<{}>;
-};
-type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
-declare const __VLS_component: import("vue").DefineComponent<{
-    /**
-     * The percentage value of the progress bar
-     */
-    percentage: number;
-    /**
-     * The size of the progress bar
-     * @default '10em' (equal 80px for a font-size of 16px)
-     */
-    size?: string;
-    /**
-     * Duration of the animation in milliseconds
-     * @default 1000
-     */
-    duration?: number;
-    /**
-     * The color of the progress bar
-     */
-    color?: Color;
-    /**
-     * Auto color based on the count (danger, warning, success)
-     * @default false
-     */
-    autoColor?: boolean;
-    /**
-     * Suffix to display next to the number
-     */
-    prefix?: string;
-    /**
-     * Suffix to display next to the number
-     */
-    suffix?: string;
-    /**
-     * The stroke-linecap style
-     * @default 'round'
-     * @values 'butt', 'round', 'square', 'inherit'
-     */
-    strokeLinecap?: SVGAttributes["stroke-linecap"];
-    /**
-     * The stroke width
-     * @default 6
-     */
-    strokeWidth?: SVGAttributes["width"];
-    /**
-     * The stroke color
-     * Use this prop to override the gradient color
-     * You can use a color name or a color code
-     */
-    stroke?: SVGAttributes["stroke"];
-}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+type __VLS_Props = {
     /**
      * The percentage value of the progress bar
      */
@@ -96,29 +37,41 @@ declare const __VLS_component: import("vue").DefineComponent<{
      * @default 'round'
      * @values 'butt', 'round', 'square', 'inherit'
      */
-    strokeLinecap?: SVGAttributes["stroke-linecap"];
+    strokeLinecap?: SVGAttributes['stroke-linecap'];
     /**
      * The stroke width
      * @default 6
      */
-    strokeWidth?: SVGAttributes["width"];
+    strokeWidth?: SVGAttributes['width'];
     /**
      * The stroke color
      * Use this prop to override the gradient color
      * You can use a color name or a color code
      */
-    stroke?: SVGAttributes["stroke"];
-}> & Readonly<{}>, {
+    stroke?: SVGAttributes['stroke'];
+};
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+        prefix?(_: {}): any;
+        suffix?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+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<{}>, {
     size: string;
     color: Color;
-    stroke: string;
     duration: number;
     prefix: string;
     suffix: string;
+    stroke: string;
     percentage: number;
     strokeLinecap: "inherit" | "round" | "square" | "butt";
     strokeWidth: string | number;
-}, {}, {}, {}, 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/MazCircularProgressBar.mjs

@@ -1,15 +1,15 @@
-import { useId as w, computed as r, defineComponent as _, useCssVars as $, useSlots as y, ref as S, watch as B, openBlock as p, createElementBlock as v, normalizeClass as P, createElementVNode as n, renderSlot as l, createTextVNode as i, toDisplayString as u, createCommentVNode as m, normalizeStyle as A, unref as g, createBlock as M, createSlots as I, withCtx as k } from "vue";
-import './assets/MazCircularProgressBar.css';function N({
+import { useId as w, computed as r, defineComponent as g, useSlots as _, ref as S, watch as B, openBlock as p, createElementBlock as m, normalizeClass as M, normalizeStyle as y, createElementVNode as n, renderSlot as l, createTextVNode as i, toDisplayString as u, createCommentVNode as I, unref as k, createBlock as P, createSlots as N, withCtx as x } from "vue";
+import './assets/MazCircularProgressBar.css';function A({
   componentName: a,
   providedId: e
 }) {
   const s = w();
   return r(() => e ?? `${a}-${s}`);
 }
-const V = { class: "maz-sr-only" }, D = {
+const V = { class: "maz-sr-only" }, b = {
   key: 0,
   class: "m-animated-counter__fix"
-}, E = /* @__PURE__ */ _({
+}, D = /* @__PURE__ */ g({
   __name: "MazAnimatedCounter",
   props: {
     count: {},
@@ -18,28 +18,28 @@ const V = { class: "maz-sr-only" }, D = {
     suffix: { default: void 0 }
   },
   setup(a) {
-    $((t) => ({
-      "7cf84c3b": h.value,
-      a2b7049a: t.count
-    }));
-    const e = a, s = y(), f = r(() => !!e.prefix || !!s.prefix), d = r(() => !!e.suffix || !!s.suffix), c = S(!0);
+    const e = a, s = _(), f = r(() => !!e.prefix || !!s.prefix), d = r(() => !!e.suffix || !!s.suffix), c = S(!0);
     B(
       () => e.count,
-      (t, x) => {
-        t !== x && (c.value = !1, setTimeout(() => {
+      (t, h) => {
+        t !== h && (c.value = !1, setTimeout(() => {
           c.value = !0;
         }, 100));
       }
     );
-    const h = r(() => `${e.duration}ms`);
-    return (t, x) => (p(), v(
+    const v = r(() => `${e.duration}ms`);
+    return (t, h) => (p(), m(
       "span",
       {
-        class: P(["m-animated-counter", {
+        class: M(["m-animated-counter", {
           "--animated": c.value,
           "--prefixed": f.value,
           "--suffixed": d.value
-        }])
+        }]),
+        style: y({
+          "--count": t.count,
+          "--animation-duration": v.value
+        })
       },
       [
         n("span", V, [
@@ -63,8 +63,7 @@ const V = { class: "maz-sr-only" }, D = {
             )
           ], !0)
         ]),
-        f.value || d.value ? (p(), v("span", D, [
-          m(' @slot Prefix slot - Add a prefix next to the number (e.g: "$") '),
+        f.value || d.value ? (p(), m("span", b, [
           l(t.$slots, "prefix", {}, () => [
             i(
               u(t.prefix),
@@ -72,7 +71,6 @@ const V = { class: "maz-sr-only" }, D = {
               /* TEXT */
             )
           ], !0),
-          m(' @slot Suffix slot - Add a suffix next to the number (e.g: "%") '),
           l(t.$slots, "suffix", {}, () => [
             i(
               u(t.suffix),
@@ -80,23 +78,23 @@ const V = { class: "maz-sr-only" }, D = {
               /* TEXT */
             )
           ], !0)
-        ])) : m("v-if", !0)
+        ])) : I("v-if", !0)
       ],
-      2
-      /* CLASS */
+      6
+      /* CLASS, STYLE */
     ));
   }
-}), z = (a, e) => {
+}), $ = (a, e) => {
   const s = a.__vccOpts || a;
   for (const [f, d] of e)
     s[f] = d;
   return s;
-}, L = /* @__PURE__ */ z(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"], R = ["stop-color"], U = ["stroke-width", "stroke", "stroke-linecap"], F = /* @__PURE__ */ _({
+}, q = ["id"], G = ["stop-color"], O = ["stop-color"], U = ["stroke-width", "stroke", "stroke-linecap"], F = /* @__PURE__ */ g({
   __name: "MazCircularProgressBar",
   props: {
     percentage: { default: 0 },
@@ -111,47 +109,45 @@ const V = { class: "maz-sr-only" }, D = {
     stroke: { default: void 0 }
   },
   setup(a) {
-    $((o) => ({
-      "6e9e446d": C.value,
-      "31fcb5e0": b.value
-    }));
-    const e = a, s = y(), f = r(() => !!e.prefix || !!s.prefix), d = r(() => !!e.suffix || !!s.suffix), c = N({
+    const e = a, s = _(), f = r(() => !!e.prefix || !!s.prefix), d = r(() => !!e.suffix || !!s.suffix), c = A({
       componentName: "MazCircularProgressBar"
-    }), h = r(() => e.percentage > 100 ? 100 : e.percentage <= 0 ? 0.5 : e.percentage), t = r(
-      () => e.autoColor ? x(e.percentage) : e.color
+    }), v = r(() => e.percentage > 100 ? 100 : e.percentage <= 0 ? 0.5 : e.percentage), t = r(
+      () => e.autoColor ? h(v.value) : e.color
     );
-    function x(o) {
+    function h(o) {
       return o < 50 || o > 100 ? "danger" : o < 100 ? "warning" : "success";
     }
-    const C = r(() => `${e.duration}ms`), b = r(() => Math.round(290 - 290 * (h.value / 100)));
-    return (o, H) => (p(), v(
+    const z = r(() => `${e.duration}ms`), C = r(() => Math.round(290 - 290 * (v.value / 100)));
+    return (o, H) => (p(), m(
       "div",
       {
         class: "m-circular-progress-bar",
-        style: A([
+        style: y([
+          {
+            "--animation-duration": z.value,
+            "--dashoffset": C.value
+          },
           {
             fontSize: o.size
           }
         ])
       },
       [
-        n("div", T, [
-          n("div", W, [
-            g(s).default ? (p(), v("span", j, [
-              m(" @slot Default slot - Replace the percaentage value "),
+        n("div", L, [
+          n("div", T, [
+            k(s).default ? (p(), m("span", W, [
               l(o.$slots, "default", {}, void 0, !0)
-            ])) : (p(), M(L, {
+            ])) : (p(), P(E, {
               key: 1,
               count: o.percentage,
               duration: o.duration
-            }, I({
+            }, N({
               _: 2
               /* DYNAMIC */
             }, [
               f.value ? {
                 name: "prefix",
-                fn: k(() => [
-                  m(' @slot Prefix slot - Add a prefix next to the number (e.g: "$") '),
+                fn: x(() => [
                   l(o.$slots, "prefix", {}, () => [
                     i(
                       u(o.prefix),
@@ -164,8 +160,7 @@ const V = { class: "maz-sr-only" }, D = {
               } : void 0,
               d.value ? {
                 name: "suffix",
-                fn: k(() => [
-                  m(' @slot Suffix slot - Add a suffix next to the number (e.g: "%") '),
+                fn: x(() => [
                   l(o.$slots, "suffix", {}, () => [
                     i(
                       u(o.suffix),
@@ -179,10 +174,10 @@ const V = { class: "maz-sr-only" }, D = {
             ]), 1032, ["count", "duration"]))
           ])
         ]),
-        (p(), v("svg", q, [
+        (p(), m("svg", j, [
           n("defs", null, [
             n("linearGradient", {
-              id: `${g(c)}-gradient`,
+              id: `${k(c)}-gradient`,
               x1: "0",
               x2: "0",
               y1: "1",
@@ -191,12 +186,12 @@ const V = { class: "maz-sr-only" }, D = {
               n("stop", {
                 offset: "0%",
                 "stop-color": t.value ? `var(--maz-color-${t.value}-400)` : "var(--maz-color-primary)"
-              }, null, 8, O),
+              }, null, 8, G),
               n("stop", {
                 offset: "100%",
                 "stop-color": t.value ? `var(--maz-color-${t.value}-700)` : "var(--maz-color-secondary)"
-              }, null, 8, R)
-            ], 8, G)
+              }, null, 8, O)
+            ], 8, q)
           ]),
           n("circle", {
             cx: "50",
@@ -205,7 +200,7 @@ const V = { class: "maz-sr-only" }, D = {
             "stroke-width": o.strokeWidth,
             "stroke-dasharray": "290",
             "stroke-dashoffset": "290",
-            stroke: o.stroke ? o.stroke : `url(#${g(c)}-gradient)`,
+            stroke: o.stroke ? o.stroke : `url(#${k(c)}-gradient)`,
             fill: "none",
             "stroke-linecap": o.strokeLinecap
           }, null, 8, U)
@@ -215,7 +210,7 @@ const V = { class: "maz-sr-only" }, D = {
       /* STYLE */
     ));
   }
-}), K = /* @__PURE__ */ z(F, [["__scopeId", "data-v-e15b070e"]]);
+}), K = /* @__PURE__ */ $(F, [["__scopeId", "data-v-fd325305"]]);
 export {
   K as default
 };

package/components/MazDialog.d.ts

@@ -19,7 +19,9 @@ export interface InternalProps {
     persistent?: boolean;
 }
 export type Props = InternalProps & MazBackdropProps;
+type __VLS_Props = Props & MazBackdropProps;
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         header?(_: {
             close: () => void;
@@ -141,16 +143,16 @@ declare function __VLS_template(): {
             };
         }) | null;
     };
-    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;

package/components/MazDialog.mjs

@@ -1,4 +1,4 @@
-import { M as f } from "./chunks/MazDialog-CPgFpAlq.mjs";
+import { M as f } from "./chunks/MazDialog-XiX9LEiz.mjs";
 export {
   f as default
 };

package/components/MazDialogPromise.mjs

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

package/components/MazDrawer.d.ts

@@ -11,6 +11,7 @@ export interface Props {
     noClose?: boolean;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         title?(_: {
             close: () => void;
@@ -20,7 +21,7 @@ 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, {} & {

package/components/MazDrawer.mjs

@@ -128,7 +128,7 @@ import './assets/MazDrawer.css';const A = "--backdrop-present", U = /* @__PURE__
   },
   emits: ["before-close", "open", "close", "update:model-value"],
   setup(b) {
-    const i = B(() => import("./chunks/MazBtn-BRUaoP8j.mjs").then((e) => e.M)), c = B(() => import("./chunks/x-mark-CnZwVvA7.mjs"));
+    const i = B(() => import("./chunks/MazBtn-CIAdgMGr.mjs").then((e) => e.M)), c = B(() => import("./chunks/x-mark-CnZwVvA7.mjs"));
     return (e, t) => (r(), h(U, {
       "backdrop-class": ["m-drawer", `--${e.variant}`, e.backdropClass],
       style: F({

package/components/MazDropdown.d.ts

@@ -1,9 +1,9 @@
 import type { RouteLocationRaw } from 'vue-router';
 import type { Color } from './MazBtn.vue';
 import type { MazLinkProps } from './MazLink.vue';
-import type { Position } from './types';
+import type { Icon, Position, Size } from './types';
 import { type HTMLAttributes } from 'vue';
-export type { Color, Position };
+export type { Color, Position, Size };
 type ItemBase = Record<string, unknown> & {
     label: string;
     class?: unknown;
@@ -77,14 +77,34 @@ export interface MazDropdownProps {
      * If true, the button will have a full width
      */
     block?: boolean;
+    /**
+     * Custom dropdown icon
+     * You can use a string to define the icon name or a Vue component
+     * @default undefined
+     */
+    dropdownIcon?: string | Icon;
+    /**
+     * If true, the dropdown icon will rotate when the dropdown is open
+     * @default true
+     */
+    dropdownIconAnimation?: boolean;
+    /**
+     * Size of the button
+     * @default 'md'
+     */
+    size?: Size;
 }
 declare function __VLS_template(): {
+    attrs: Partial<{}>;
     slots: {
         "screen-reader-description"?(_: {}): any;
         element?(_: {
             isOpen: boolean;
         }): any;
         default?(_: {}): any;
+        "dropdown-icon"?(_: {
+            isOpen: boolean;
+        }): any;
         dropdown?(_: {
             items: MenuItem[];
         }): any;
@@ -119,7 +139,7 @@ declare function __VLS_template(): {
         }): any;
     };
     refs: {};
-    attrs: Partial<{}>;
+    rootEl: any;
 };
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import("vue").DefineComponent<MazDropdownProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -130,6 +150,7 @@ declare const __VLS_component: import("vue").DefineComponent<MazDropdownProps, {
     "onUpdate:open"?: ((value: boolean) => any) | undefined;
 }>, {
     style: string | false | import("vue").CSSProperties | import("vue").StyleValue[] | null;
+    size: Size;
     color: Color;
     class: HTMLAttributes["class"];
     id: string;
@@ -137,6 +158,7 @@ declare const __VLS_component: import("vue").DefineComponent<MazDropdownProps, {
     trigger: "click" | "hover" | "both";
     items: MenuItem[];
     screenReaderDescription: string;
+    dropdownIconAnimation: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;