maz-ui 3.5.0 → 3.6.2

package/components/MazStepper.d.ts

@@ -1,73 +1,71 @@
-import { type PropType } from 'vue';
-import type { Color } from './types';
-export interface Step {
-    disabled?: boolean;
-    validated?: boolean;
-}
-export type Steps = Step[];
-export type { Color } from './types';
-declare const _default: import("vue").DefineComponent<{
-    modelValue: {
-        type: NumberConstructor;
-        default: undefined;
-    };
-    steps: {
-        type: PropType<Steps>;
-        default: undefined;
-    };
-    disabledNextSteps: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    disabledPreviousSteps: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    autoValidatedSteps: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    color: {
-        type: PropType<Color>;
-        default: string;
-        validator: (value: string) => boolean;
-    };
-}, (_ctx: any, _cache: any) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:model-value"[], "update:model-value", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    modelValue: {
-        type: NumberConstructor;
-        default: undefined;
-    };
-    steps: {
-        type: PropType<Steps>;
-        default: undefined;
-    };
-    disabledNextSteps: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    disabledPreviousSteps: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    autoValidatedSteps: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    color: {
-        type: PropType<Color>;
-        default: string;
-        validator: (value: string) => boolean;
-    };
-}>> & {
-    "onUpdate:model-value"?: ((...args: any[]) => any) | undefined;
-}, {
-    modelValue: number;
-    steps: Steps;
-    disabledNextSteps: boolean;
-    disabledPreviousSteps: boolean;
-    autoValidatedSteps: boolean;
-    color: Color;
-}>;
-export default _default;
+import { type PropType } from 'vue';
+import type { Color } from './types';
+export interface Step {
+    disabled?: boolean;
+    validated?: boolean;
+}
+export type Steps = Step[];
+export type { Color } from './types';
+declare const _default: import("vue").DefineComponent<{
+    modelValue: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    steps: {
+        type: PropType<Steps>;
+        default: undefined;
+    };
+    disabledNextSteps: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabledPreviousSteps: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autoValidatedSteps: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    color: {
+        type: PropType<Color>;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:model-value"[], "update:model-value", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    modelValue: {
+        type: NumberConstructor;
+        default: undefined;
+    };
+    steps: {
+        type: PropType<Steps>;
+        default: undefined;
+    };
+    disabledNextSteps: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    disabledPreviousSteps: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    autoValidatedSteps: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    color: {
+        type: PropType<Color>;
+        default: string;
+        validator: (value: string) => boolean;
+    };
+}>> & {
+    "onUpdate:model-value"?: ((...args: any[]) => any) | undefined;
+}, {
+    color: Color;
+    modelValue: number;
+    steps: Steps;
+    disabledNextSteps: boolean;
+    disabledPreviousSteps: boolean;
+    autoValidatedSteps: boolean;
+}>;
+export default _default;

package/components/MazStepper.mjs

@@ -0,0 +1,227 @@
+(function(){"use strict";try{if(typeof document!="undefined"){var e=document.createElement("style");e.appendChild(document.createTextNode(".m-transition-expand[data-v-b5d3ee9f],.m-transition-expand *[data-v-b5d3ee9f]{will-change:height;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-perspective:1000px;perspective:1000px}.m-stepper__header[data-v-b8833346]{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;cursor:pointer;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.m-stepper__header[data-v-b8833346]>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(1rem * var(--tw-space-x-reverse));margin-left:calc(1rem * calc(1 - var(--tw-space-x-reverse)))}.m-stepper__header[data-v-b8833346]{border-radius:var(--maz-border-radius);padding:.5rem 1rem;outline:2px solid transparent;outline-offset:2px;-webkit-transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;-webkit-transition-timing-function:cubic-bezier(.4,0,.2,1);transition-timing-function:cubic-bezier(.4,0,.2,1);-webkit-transition-duration:.2s;transition-duration:.2s}.m-stepper__header__content[data-v-b8833346]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.m-stepper__header[data-v-b8833346]:not(:disabled):hover{background-color:var(--maz-color-bg-lighter)}.m-stepper__header[data-v-b8833346]:not(:disabled):focus{background-color:var(--maz-color-bg-lighter)}.m-stepper__header[data-v-b8833346]:disabled{cursor:not-allowed}.m-stepper__header.--is-current-step[data-v-b8833346]{cursor:default}.m-stepper__title[data-v-b8833346]{color:var(--maz-color-text)}.m-stepper__subtitle[data-v-b8833346]{font-size:.75rem;line-height:1rem;color:var(--maz-color-muted)}.m-stepper__count[data-v-b8833346]{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;height:2rem;width:2rem;-webkit-box-flex:0;-ms-flex:none;flex:none;overflow:hidden;border-radius:9999px;font-size:1.125rem;line-height:1.75rem;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background-color:var(--0469ada6);color:var(--4ea3b985)}.m-stepper__count__circle[data-v-b8833346]{position:absolute;top:0px;right:0px;bottom:0px;left:0px;display:-webkit-box;display:-ms-flexbox;display:flex;--tw-scale-x: 0;--tw-scale-y: 0;-webkit-transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));border-radius:9999px;background-color:var(--maz-color-success);-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:cubic-bezier(.4,0,.2,1);transition-timing-function:cubic-bezier(.4,0,.2,1);-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.m-stepper__count svg[data-v-b8833346]{color:var(--4ea3b985)}.m-stepper__count.--validated .m-stepper__count__circle[data-v-b8833346]{--tw-scale-x: 1;--tw-scale-y: 1;-webkit-transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.m-stepper__count.--validated svg[data-v-b8833346]{color:var(--maz-color-success-contrast)}.m-stepper__content[data-v-b8833346]{margin-left:2rem;border-left-width:2px;border-color:transparent;padding-top:.5rem;padding-bottom:.5rem;padding-left:2rem}.m-stepper__content__wrapper[data-v-b8833346]{padding-top:.5rem;padding-bottom:.5rem}.m-stepper__content[data-v-b8833346]:not(.--no-border){border-color:var(--maz-color-bg-lighter)}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
+import { defineComponent, openBlock, createBlock, TransitionGroup, withCtx, renderSlot, nextTick, useCssVars, unref, computed, useSlots, ref, createElementBlock, Fragment, renderList, normalizeClass, createElementVNode, createTextVNode, toDisplayString, createCommentVNode, createVNode, pushScopeId, popScopeId } from "vue";
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  __name: "MazTransitionExpand",
+  setup(__props) {
+    const enter = (element) => {
+      const width = getComputedStyle(element).width;
+      element.style.width = width;
+      element.style.position = "absolute";
+      element.style.visibility = "hidden";
+      element.style.height = "auto";
+      element.style.top = "bottom";
+      const height = getComputedStyle(element).height;
+      element.style.width = "";
+      element.style.position = "";
+      element.style.visibility = "";
+      element.style.height = "0px";
+      getComputedStyle(element).height;
+      nextTick(() => {
+        element.style.height = height;
+      });
+    };
+    const afterEnter = (element) => {
+      element.style.height = "auto";
+    };
+    const leave = (element) => {
+      const height = getComputedStyle(element).height;
+      element.style.height = height;
+      getComputedStyle(element).height;
+      nextTick(() => {
+        element.style.height = "0px";
+      });
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(TransitionGroup, {
+        class: "m-transition-expand",
+        name: "maz-expand",
+        tag: "div",
+        onEnter: _cache[0] || (_cache[0] = (el) => enter(el)),
+        onAfterEnter: _cache[1] || (_cache[1] = (el) => afterEnter(el)),
+        onLeave: _cache[2] || (_cache[2] = (el) => leave(el))
+      }, {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default", {}, void 0, true)
+        ]),
+        _: 3
+      });
+    };
+  }
+});
+const MazTransitionExpand_vue_vue_type_style_index_0_scoped_b5d3ee9f_lang = "";
+const _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+const MazTransitionExpand = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-b5d3ee9f"]]);
+const _withScopeId = (n) => (pushScopeId("data-v-b8833346"), n = n(), popScopeId(), n);
+const _hoisted_1 = { class: "m-stepper" };
+const _hoisted_2 = ["disabled", "onClick"];
+const _hoisted_3 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode("div", { class: "m-stepper__count__circle" }, [
+  /* @__PURE__ */ createElementVNode("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "none",
+    viewBox: "0 0 24 24",
+    width: "1.2rem",
+    height: "1.2rem",
+    stroke: "currentColor",
+    "aria-hidden": "true"
+  }, [
+    /* @__PURE__ */ createElementVNode("path", {
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      "stroke-width": "2",
+      d: "M5 13l4 4L19 7"
+    })
+  ])
+], -1));
+const _hoisted_4 = { class: "m-stepper__header__content" };
+const _hoisted_5 = { class: "m-stepper__title" };
+const _hoisted_6 = {
+  key: 0,
+  class: "m-stepper__subtitle"
+};
+const _hoisted_7 = { key: 0 };
+const _hoisted_8 = { class: "m-stepper__content__wrapper" };
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "MazStepper",
+  props: {
+    modelValue: { type: Number, default: void 0 },
+    steps: { type: Array, default: void 0 },
+    disabledNextSteps: { type: Boolean, default: false },
+    disabledPreviousSteps: { type: Boolean, default: false },
+    autoValidatedSteps: { type: Boolean, default: false },
+    color: {
+      type: String,
+      default: "primary",
+      validator: (value) => {
+        return [
+          "primary",
+          "secondary",
+          "warning",
+          "danger",
+          "info",
+          "success",
+          "white",
+          "gray",
+          "black"
+        ].includes(value);
+      }
+    }
+  },
+  emits: ["update:model-value"],
+  setup(__props, { emit: emits }) {
+    const props = __props;
+    useCssVars((_ctx) => ({
+      "0469ada6": unref(roundStepBgColor),
+      "4ea3b985": unref(roundStepTextColor)
+    }));
+    const roundStepBgColor = computed(() => `var(--maz-color-${props.color})`);
+    const roundStepTextColor = computed(
+      () => `var(--maz-color-${props.color}-contrast)`
+    );
+    const slots = useSlots();
+    const stepCount = computed(
+      () => Object.keys(slots).filter((slot) => slot.startsWith("content-")).length
+    );
+    const localModelValue = ref(1);
+    const currentStep = computed({
+      get: () => props.modelValue ?? localModelValue.value,
+      set: (value) => {
+        localModelValue.value = value;
+        emits("update:model-value", value);
+      }
+    });
+    const selectStep = (step) => {
+      if (step < 1) {
+        currentStep.value = 1;
+      } else if (step > stepCount.value) {
+        currentStep.value = stepCount.value;
+      } else {
+        currentStep.value = step;
+      }
+    };
+    const hasTitleForStep = (step) => {
+      return Object.keys(slots).filter((slot) => slot.startsWith("title-")).includes(`title-${step}`);
+    };
+    const hasSubtitleForStep = (step) => {
+      return Object.keys(slots).filter((slot) => slot.startsWith("subtitle-")).includes(`subtitle-${step}`);
+    };
+    const isStepValidated = (step) => {
+      var _a, _b;
+      const isValidated = !!((_b = (_a = props.steps) == null ? void 0 : _a[step - 1]) == null ? void 0 : _b.validated);
+      const isAutoValidated = props.autoValidatedSteps && step < currentStep.value;
+      return isValidated || isAutoValidated;
+    };
+    const isStepDisabled = (step) => {
+      var _a, _b;
+      const isDisabled = !!((_b = (_a = props.steps) == null ? void 0 : _a[step - 1]) == null ? void 0 : _b.disabled);
+      const isCurrentStep = currentStep.value === step;
+      const isAutoDisabledNext = props.disabledNextSteps && step > currentStep.value;
+      const isAutoDisabledPrevious = props.disabledPreviousSteps && step < currentStep.value;
+      return isDisabled || isCurrentStep || isAutoDisabledNext || isAutoDisabledPrevious;
+    };
+    const isLastStep = (step) => {
+      return step === stepCount.value;
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(stepCount), (step) => {
+          return openBlock(), createElementBlock(Fragment, { key: step }, [
+            hasTitleForStep(step) ? (openBlock(), createElementBlock("button", {
+              key: 0,
+              type: "button",
+              disabled: isStepDisabled(step),
+              class: normalizeClass(["m-stepper__header", { "--is-current-step": step === unref(currentStep) }]),
+              onClick: ($event) => selectStep(step)
+            }, [
+              createElementVNode("span", {
+                class: normalizeClass(["m-stepper__count --primary", {
+                  "--validated": isStepValidated(step)
+                }])
+              }, [
+                _hoisted_3,
+                createTextVNode(" " + toDisplayString(step), 1)
+              ], 2),
+              createElementVNode("div", _hoisted_4, [
+                createElementVNode("span", _hoisted_5, [
+                  renderSlot(_ctx.$slots, `title-${step}`, {}, void 0, true)
+                ]),
+                hasSubtitleForStep(step) ? (openBlock(), createElementBlock("span", _hoisted_6, [
+                  renderSlot(_ctx.$slots, `subtitle-${step}`, {}, void 0, true)
+                ])) : createCommentVNode("", true)
+              ])
+            ], 10, _hoisted_2)) : createCommentVNode("", true),
+            createElementVNode("div", {
+              class: normalizeClass(["m-stepper__content", {
+                "--no-border": isLastStep(step)
+              }])
+            }, [
+              createVNode(MazTransitionExpand, null, {
+                default: withCtx(() => [
+                  unref(currentStep) === step ? (openBlock(), createElementBlock("div", _hoisted_7, [
+                    createElementVNode("div", _hoisted_8, [
+                      renderSlot(_ctx.$slots, `content-${step}`, {
+                        nextStep: () => selectStep(step + 1),
+                        previousStep: () => selectStep(step - 1)
+                      }, void 0, true)
+                    ])
+                  ])) : createCommentVNode("", true)
+                ]),
+                _: 2
+              }, 1024)
+            ], 2)
+          ], 64);
+        }), 128))
+      ]);
+    };
+  }
+});
+const MazStepper_vue_vue_type_style_index_0_scoped_b8833346_lang = "";
+const MazStepper = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-b8833346"]]);
+export {
+  MazStepper as default
+};

package/components/MazStepper.umd.js

@@ -0,0 +1,2 @@
+(function(){"use strict";try{if(typeof document!="undefined"){var e=document.createElement("style");e.appendChild(document.createTextNode(".m-transition-expand[data-v-b5d3ee9f],.m-transition-expand *[data-v-b5d3ee9f]{will-change:height;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-perspective:1000px;perspective:1000px}.m-stepper__header[data-v-b8833346]{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;cursor:pointer;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.m-stepper__header[data-v-b8833346]>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(1rem * var(--tw-space-x-reverse));margin-left:calc(1rem * calc(1 - var(--tw-space-x-reverse)))}.m-stepper__header[data-v-b8833346]{border-radius:var(--maz-border-radius);padding:.5rem 1rem;outline:2px solid transparent;outline-offset:2px;-webkit-transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;-webkit-transition-timing-function:cubic-bezier(.4,0,.2,1);transition-timing-function:cubic-bezier(.4,0,.2,1);-webkit-transition-duration:.2s;transition-duration:.2s}.m-stepper__header__content[data-v-b8833346]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.m-stepper__header[data-v-b8833346]:not(:disabled):hover{background-color:var(--maz-color-bg-lighter)}.m-stepper__header[data-v-b8833346]:not(:disabled):focus{background-color:var(--maz-color-bg-lighter)}.m-stepper__header[data-v-b8833346]:disabled{cursor:not-allowed}.m-stepper__header.--is-current-step[data-v-b8833346]{cursor:default}.m-stepper__title[data-v-b8833346]{color:var(--maz-color-text)}.m-stepper__subtitle[data-v-b8833346]{font-size:.75rem;line-height:1rem;color:var(--maz-color-muted)}.m-stepper__count[data-v-b8833346]{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;height:2rem;width:2rem;-webkit-box-flex:0;-ms-flex:none;flex:none;overflow:hidden;border-radius:9999px;font-size:1.125rem;line-height:1.75rem;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background-color:var(--0469ada6);color:var(--4ea3b985)}.m-stepper__count__circle[data-v-b8833346]{position:absolute;top:0px;right:0px;bottom:0px;left:0px;display:-webkit-box;display:-ms-flexbox;display:flex;--tw-scale-x: 0;--tw-scale-y: 0;-webkit-transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));border-radius:9999px;background-color:var(--maz-color-success);-webkit-transition-property:all;transition-property:all;-webkit-transition-duration:.3s;transition-duration:.3s;-webkit-transition-timing-function:cubic-bezier(.4,0,.2,1);transition-timing-function:cubic-bezier(.4,0,.2,1);-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.m-stepper__count svg[data-v-b8833346]{color:var(--4ea3b985)}.m-stepper__count.--validated .m-stepper__count__circle[data-v-b8833346]{--tw-scale-x: 1;--tw-scale-y: 1;-webkit-transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.m-stepper__count.--validated svg[data-v-b8833346]{color:var(--maz-color-success-contrast)}.m-stepper__content[data-v-b8833346]{margin-left:2rem;border-left-width:2px;border-color:transparent;padding-top:.5rem;padding-bottom:.5rem;padding-left:2rem}.m-stepper__content__wrapper[data-v-b8833346]{padding-top:.5rem;padding-bottom:.5rem}.m-stepper__content[data-v-b8833346]:not(.--no-border){border-color:var(--maz-color-bg-lighter)}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("vue")):"function"==typeof define&&define.amd?define(["vue"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).MazStepper=t(e.Vue)}(this,(function(e){"use strict";const t=(e,t)=>{const o=e.__vccOpts||e;for(const[l,s]of t)o[l]=s;return o},o=t(e.defineComponent({__name:"MazTransitionExpand",setup:t=>(t,o)=>(e.openBlock(),e.createBlock(e.TransitionGroup,{class:"m-transition-expand",name:"maz-expand",tag:"div",onEnter:o[0]||(o[0]=t=>(t=>{const o=getComputedStyle(t).width;t.style.width=o,t.style.position="absolute",t.style.visibility="hidden",t.style.height="auto",t.style.top="bottom";const l=getComputedStyle(t).height;t.style.width="",t.style.position="",t.style.visibility="",t.style.height="0px",getComputedStyle(t).height,e.nextTick((()=>{t.style.height=l}))})(t)),onAfterEnter:o[1]||(o[1]=e=>{e.style.height="auto"}),onLeave:o[2]||(o[2]=t=>(t=>{const o=getComputedStyle(t).height;t.style.height=o,getComputedStyle(t).height,e.nextTick((()=>{t.style.height="0px"}))})(t))},{default:e.withCtx((()=>[e.renderSlot(t.$slots,"default",{},void 0,!0)])),_:3}))}),[["__scopeId","data-v-b5d3ee9f"]]),l={class:"m-stepper"},s=["disabled","onClick"],a=(t=>(e.pushScopeId("data-v-b8833346"),t=t(),e.popScopeId(),t))((()=>e.createElementVNode("div",{class:"m-stepper__count__circle"},[e.createElementVNode("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",width:"1.2rem",height:"1.2rem",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M5 13l4 4L19 7"})])],-1))),n={class:"m-stepper__header__content"},r={class:"m-stepper__title"},i={key:0,class:"m-stepper__subtitle"},d={key:0},c={class:"m-stepper__content__wrapper"};return t(e.defineComponent({__name:"MazStepper",props:{modelValue:{type:Number,default:void 0},steps:{type:Array,default:void 0},disabledNextSteps:{type:Boolean,default:!1},disabledPreviousSteps:{type:Boolean,default:!1},autoValidatedSteps:{type:Boolean,default:!1},color:{type:String,default:"primary",validator:e=>["primary","secondary","warning","danger","info","success","white","gray","black"].includes(e)}},emits:["update:model-value"],setup(t,{emit:p}){const u=t;e.useCssVars((t=>({"0469ada6":e.unref(m),"4ea3b985":e.unref(v)})));const m=e.computed((()=>`var(--maz-color-${u.color})`)),v=e.computed((()=>`var(--maz-color-${u.color}-contrast)`)),y=e.useSlots(),h=e.computed((()=>Object.keys(y).filter((e=>e.startsWith("content-"))).length)),f=e.ref(1),_=e.computed({get:()=>u.modelValue??f.value,set:e=>{f.value=e,p("update:model-value",e)}}),g=e=>{e<1?_.value=1:e>h.value?_.value=h.value:_.value=e},b=e=>Object.keys(y).filter((e=>e.startsWith("title-"))).includes(`title-${e}`),k=e=>Object.keys(y).filter((e=>e.startsWith("subtitle-"))).includes(`subtitle-${e}`),S=e=>{var t,o;const l=!!(null==(o=null==(t=u.steps)?void 0:t[e-1])?void 0:o.validated),s=u.autoValidatedSteps&&e<_.value;return l||s},C=e=>{var t,o;const l=!!(null==(o=null==(t=u.steps)?void 0:t[e-1])?void 0:o.disabled),s=_.value===e,a=u.disabledNextSteps&&e>_.value,n=u.disabledPreviousSteps&&e<_.value;return l||s||a||n},V=e=>e===h.value;return(t,p)=>(e.openBlock(),e.createElementBlock("div",l,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(h),(l=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:l},[b(l)?(e.openBlock(),e.createElementBlock("button",{key:0,type:"button",disabled:C(l),class:e.normalizeClass(["m-stepper__header",{"--is-current-step":l===e.unref(_)}]),onClick:e=>g(l)},[e.createElementVNode("span",{class:e.normalizeClass(["m-stepper__count --primary",{"--validated":S(l)}])},[a,e.createTextVNode(" "+e.toDisplayString(l),1)],2),e.createElementVNode("div",n,[e.createElementVNode("span",r,[e.renderSlot(t.$slots,`title-${l}`,{},void 0,!0)]),k(l)?(e.openBlock(),e.createElementBlock("span",i,[e.renderSlot(t.$slots,`subtitle-${l}`,{},void 0,!0)])):e.createCommentVNode("",!0)])],10,s)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["m-stepper__content",{"--no-border":V(l)}])},[e.createVNode(o,null,{default:e.withCtx((()=>[e.unref(_)===l?(e.openBlock(),e.createElementBlock("div",d,[e.createElementVNode("div",c,[e.renderSlot(t.$slots,`content-${l}`,{nextStep:()=>g(l+1),previousStep:()=>g(l-1)},void 0,!0)])])):e.createCommentVNode("",!0)])),_:2},1024)],2)],64)))),128))]))}}),[["__scopeId","data-v-b8833346"]])}));

package/components/MazSwitch.d.ts

@@ -1,56 +1,54 @@
-import { type PropType } from 'vue';
-import type { Color } from './types';
-export type { Color } from './types';
-declare const _default: import("vue").DefineComponent<{
-    modelValue: {
-        type: BooleanConstructor;
-        required: true;
-    };
-    id: {
-        type: StringConstructor;
-        default: undefined;
-    };
-    disabled: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    name: {
-        type: StringConstructor;
-        default: undefined;
-    };
-    color: {
-        type: PropType<Color>;
-        default: string;
-    };
-}, (_ctx: any, _cache: any) => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:model-value"[], "update:model-value", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    modelValue: {
-        type: BooleanConstructor;
-        required: true;
-    };
-    id: {
-        type: StringConstructor;
-        default: undefined;
-    };
-    disabled: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    name: {
-        type: StringConstructor;
-        default: undefined;
-    };
-    color: {
-        type: PropType<Color>;
-        default: string;
-    };
-}>> & {
-    "onUpdate:model-value"?: ((...args: any[]) => any) | undefined;
-}, {
-    id: string;
-    name: string;
-    disabled: boolean;
-    color: Color;
-}>;
-export default _default;
+import { type PropType } from 'vue';
+import type { Color } from './types';
+export type { Color } from './types';
+declare const _default: import("vue").DefineComponent<{
+    modelValue: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    id: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    name: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    color: {
+        type: PropType<Color>;
+        default: string;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:model-value"[], "update:model-value", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    modelValue: {
+        type: BooleanConstructor;
+        required: true;
+    };
+    id: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    disabled: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    name: {
+        type: StringConstructor;
+        default: undefined;
+    };
+    color: {
+        type: PropType<Color>;
+        default: string;
+    };
+}>> & {
+    "onUpdate:model-value"?: ((...args: any[]) => any) | undefined;
+}, {
+    color: Color;
+    name: string;
+    disabled: boolean;
+    id: string;
+}>;
+export default _default;

package/components/MazSwitch.mjs

@@ -0,0 +1,61 @@
+(function(){"use strict";try{if(typeof document!="undefined"){var t=document.createElement("style");t.appendChild(document.createTextNode('.m-switch__input{position:absolute;left:-9999px}.m-switch__toggle{position:relative;display:block;height:1.5rem;width:3rem;cursor:pointer;-webkit-transform:translate3d(0,0,0);transform:translateZ(0)}.m-switch__toggle:before{content:"";-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out;position:relative;top:.25rem;left:.25rem;display:block;height:1rem;width:2.5rem;border-radius:9999px;background-color:var(--m-switch-bg-bar)}.m-switch__toggle span{position:absolute;top:0px;left:0px;display:block;height:1.5rem;width:1.5rem;border-radius:9999px;-webkit-box-shadow:0 2px 8px 0 hsl(0deg 0% 0% / 20%);box-shadow:0 2px 8px #0003;-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.m-switch__input:checked+.m-switch__toggle span{-webkit-transform:translateX(1.5em);transform:translate(1.5em)}.m-switch__input:checked+.m-switch__toggle span:before{-webkit-transform:scale(1);transform:scale(1);opacity:0;-webkit-transition:all .4s ease-in-out;transition:all .4s ease-in-out}.m-switch__input:disabled+.m-switch__toggle{cursor:not-allowed}')),document.head.appendChild(t)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
+import { defineComponent, computed, getCurrentInstance, openBlock, createElementBlock, normalizeClass, createElementVNode, mergeProps, unref, normalizeStyle } from "vue";
+const _hoisted_1 = ["id", "name", "checked", "disabled"];
+const _hoisted_2 = ["for"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "MazSwitch",
+  props: {
+    modelValue: { type: Boolean, required: true },
+    id: { type: String, default: void 0 },
+    disabled: { type: Boolean, default: false },
+    name: { type: String, default: void 0 },
+    color: { type: String, default: "primary" }
+  },
+  emits: ["update:model-value"],
+  setup(__props, { emit: emits }) {
+    const props = __props;
+    const uniqueId = computed(
+      () => {
+        var _a;
+        return props.id ?? `mazSwitch-${(_a = getCurrentInstance()) == null ? void 0 : _a.uid}`;
+      }
+    );
+    const bgColorClassVar = computed(
+      () => `var(--maz-color-${props.color}-alpha)`
+    );
+    const bgColorStyle = computed(() => ({
+      backgroundColor: props.modelValue ? `var(--maz-color-${props.color})` : "var(--maz-color-white)"
+    }));
+    const emit = (e) => {
+      const target = e.target;
+      emits("update:model-value", (target == null ? void 0 : target.checked) ?? false);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["m-switch", [`--${__props.color}`]])
+      }, [
+        createElementVNode("input", mergeProps({ id: unref(uniqueId) }, _ctx.$attrs, {
+          type: "checkbox",
+          name: __props.name,
+          checked: __props.modelValue,
+          disabled: __props.disabled,
+          class: "m-switch__input",
+          onChange: emit
+        }), null, 16, _hoisted_1),
+        createElementVNode("label", {
+          for: unref(uniqueId),
+          class: "m-switch__toggle",
+          style: normalizeStyle([{ "--m-switch-bg-bar": unref(bgColorClassVar) }])
+        }, [
+          createElementVNode("span", {
+            style: normalizeStyle([unref(bgColorStyle)])
+          }, null, 4)
+        ], 12, _hoisted_2)
+      ], 2);
+    };
+  }
+});
+const MazSwitch_vue_vue_type_style_index_0_lang = "";
+export {
+  _sfc_main as default
+};

package/components/MazSwitch.umd.js

@@ -0,0 +1,2 @@
+(function(){"use strict";try{if(typeof document!="undefined"){var t=document.createElement("style");t.appendChild(document.createTextNode('.m-switch__input{position:absolute;left:-9999px}.m-switch__toggle{position:relative;display:block;height:1.5rem;width:3rem;cursor:pointer;-webkit-transform:translate3d(0,0,0);transform:translateZ(0)}.m-switch__toggle:before{content:"";-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out;position:relative;top:.25rem;left:.25rem;display:block;height:1rem;width:2.5rem;border-radius:9999px;background-color:var(--m-switch-bg-bar)}.m-switch__toggle span{position:absolute;top:0px;left:0px;display:block;height:1.5rem;width:1.5rem;border-radius:9999px;-webkit-box-shadow:0 2px 8px 0 hsl(0deg 0% 0% / 20%);box-shadow:0 2px 8px #0003;-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.m-switch__input:checked+.m-switch__toggle span{-webkit-transform:translateX(1.5em);transform:translate(1.5em)}.m-switch__input:checked+.m-switch__toggle span:before{-webkit-transform:scale(1);transform:scale(1);opacity:0;-webkit-transition:all .4s ease-in-out;transition:all .4s ease-in-out}.m-switch__input:disabled+.m-switch__toggle{cursor:not-allowed}')),document.head.appendChild(t)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("vue")):"function"==typeof define&&define.amd?define(["vue"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).MazSwitch=t(e.Vue)}(this,(function(e){"use strict";const t=["id","name","checked","disabled"],o=["for"];return e.defineComponent({__name:"MazSwitch",props:{modelValue:{type:Boolean,required:!0},id:{type:String,default:void 0},disabled:{type:Boolean,default:!1},name:{type:String,default:void 0},color:{type:String,default:"primary"}},emits:["update:model-value"],setup(l,{emit:a}){const n=l,r=e.computed((()=>{var t;return n.id??`mazSwitch-${null==(t=e.getCurrentInstance())?void 0:t.uid}`})),d=e.computed((()=>`var(--maz-color-${n.color}-alpha)`)),i=e.computed((()=>({backgroundColor:n.modelValue?`var(--maz-color-${n.color})`:"var(--maz-color-white)"}))),c=e=>{const t=e.target;a("update:model-value",(null==t?void 0:t.checked)??!1)};return(a,n)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["m-switch",[`--${l.color}`]])},[e.createElementVNode("input",e.mergeProps({id:e.unref(r)},a.$attrs,{type:"checkbox",name:l.name,checked:l.modelValue,disabled:l.disabled,class:"m-switch__input",onChange:c}),null,16,t),e.createElementVNode("label",{for:e.unref(r),class:"m-switch__toggle",style:e.normalizeStyle([{"--m-switch-bg-bar":e.unref(d)}])},[e.createElementVNode("span",{style:e.normalizeStyle([e.unref(i)])},null,4)],12,o)],2))}})}));