maz-ui 3.6.4 → 3.6.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -27,6 +27,14 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
27
27
|
type: BooleanConstructor;
|
|
28
28
|
default: boolean;
|
|
29
29
|
};
|
|
30
|
+
allStepsOpened: {
|
|
31
|
+
type: BooleanConstructor;
|
|
32
|
+
default: boolean;
|
|
33
|
+
};
|
|
34
|
+
allStepsValidated: {
|
|
35
|
+
type: BooleanConstructor;
|
|
36
|
+
default: boolean;
|
|
37
|
+
};
|
|
30
38
|
color: {
|
|
31
39
|
type: PropType<Color>;
|
|
32
40
|
default: string;
|
|
@@ -53,6 +61,14 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
53
61
|
type: BooleanConstructor;
|
|
54
62
|
default: boolean;
|
|
55
63
|
};
|
|
64
|
+
allStepsOpened: {
|
|
65
|
+
type: BooleanConstructor;
|
|
66
|
+
default: boolean;
|
|
67
|
+
};
|
|
68
|
+
allStepsValidated: {
|
|
69
|
+
type: BooleanConstructor;
|
|
70
|
+
default: boolean;
|
|
71
|
+
};
|
|
56
72
|
color: {
|
|
57
73
|
type: PropType<Color>;
|
|
58
74
|
default: string;
|
|
@@ -67,5 +83,7 @@ declare const _default: import("vue").DefineComponent<{
|
|
|
67
83
|
disabledNextSteps: boolean;
|
|
68
84
|
disabledPreviousSteps: boolean;
|
|
69
85
|
autoValidatedSteps: boolean;
|
|
86
|
+
allStepsOpened: boolean;
|
|
87
|
+
allStepsValidated: boolean;
|
|
70
88
|
}>;
|
|
71
89
|
export default _default;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
(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-
|
|
2
|
-
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";
|
|
1
|
+
(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-50f3f54e]{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;cursor:pointer;-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.m-stepper__header[data-v-50f3f54e]>: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-50f3f54e]{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-50f3f54e]{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-50f3f54e]:not(:disabled):hover{background-color:var(--maz-color-bg-lighter)}.m-stepper__header[data-v-50f3f54e]:not(:disabled):focus{background-color:var(--maz-color-bg-lighter)}.m-stepper__header[data-v-50f3f54e]:disabled{cursor:not-allowed}.m-stepper__header.--is-current-step[data-v-50f3f54e]{cursor:default}.m-stepper__header__wrapper[data-v-50f3f54e]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.m-stepper__header__wrapper[data-v-50f3f54e]>: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__title[data-v-50f3f54e]{color:var(--maz-color-text)}.m-stepper__subtitle[data-v-50f3f54e]{font-size:.75rem;line-height:1rem;color:var(--maz-color-muted)}.m-stepper__right[data-v-50f3f54e]{text-align:right;font-size:.875rem;line-height:1.25rem;color:var(--maz-color-primary)}.m-stepper__count[data-v-50f3f54e]{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(--1bc20522);color:var(--6b59278c)}.m-stepper__count__circle[data-v-50f3f54e]{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-50f3f54e]{color:var(--6b59278c)}.m-stepper__count.--validated .m-stepper__count__circle[data-v-50f3f54e]{--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-50f3f54e]{color:var(--maz-color-success-contrast)}.m-stepper__content[data-v-50f3f54e]{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-50f3f54e]{padding-top:.5rem;padding-bottom:.5rem}.m-stepper__content[data-v-50f3f54e]: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)}})();
|
|
2
|
+
import { defineComponent, openBlock, createBlock, TransitionGroup, withCtx, renderSlot, nextTick, useCssVars, unref, computed, useSlots, ref, createElementBlock, Fragment, renderList, normalizeClass, createElementVNode, createTextVNode, toDisplayString, createCommentVNode, createVNode, withDirectives, vShow, pushScopeId, popScopeId } from "vue";
|
|
3
3
|
const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
4
4
|
__name: "MazTransitionExpand",
|
|
5
5
|
setup(__props) {
|
|
@@ -57,10 +57,11 @@ const _export_sfc = (sfc, props) => {
|
|
|
57
57
|
return target;
|
|
58
58
|
};
|
|
59
59
|
const MazTransitionExpand = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-b5d3ee9f"]]);
|
|
60
|
-
const _withScopeId = (n) => (pushScopeId("data-v-
|
|
60
|
+
const _withScopeId = (n) => (pushScopeId("data-v-50f3f54e"), n = n(), popScopeId(), n);
|
|
61
61
|
const _hoisted_1 = { class: "m-stepper" };
|
|
62
62
|
const _hoisted_2 = ["disabled", "onClick"];
|
|
63
|
-
const _hoisted_3 =
|
|
63
|
+
const _hoisted_3 = { class: "m-stepper__header__wrapper" };
|
|
64
|
+
const _hoisted_4 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode("div", { class: "m-stepper__count__circle" }, [
|
|
64
65
|
/* @__PURE__ */ createElementVNode("svg", {
|
|
65
66
|
xmlns: "http://www.w3.org/2000/svg",
|
|
66
67
|
fill: "none",
|
|
@@ -78,14 +79,17 @@ const _hoisted_3 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElem
|
|
|
78
79
|
})
|
|
79
80
|
])
|
|
80
81
|
], -1));
|
|
81
|
-
const
|
|
82
|
-
const
|
|
83
|
-
const
|
|
82
|
+
const _hoisted_5 = { class: "m-stepper__header__content" };
|
|
83
|
+
const _hoisted_6 = { class: "m-stepper__title" };
|
|
84
|
+
const _hoisted_7 = {
|
|
84
85
|
key: 0,
|
|
85
86
|
class: "m-stepper__subtitle"
|
|
86
87
|
};
|
|
87
|
-
const
|
|
88
|
-
|
|
88
|
+
const _hoisted_8 = {
|
|
89
|
+
key: 0,
|
|
90
|
+
class: "m-stepper__right"
|
|
91
|
+
};
|
|
92
|
+
const _hoisted_9 = { class: "m-stepper__content__wrapper" };
|
|
89
93
|
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
90
94
|
__name: "MazStepper",
|
|
91
95
|
props: {
|
|
@@ -94,6 +98,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
94
98
|
disabledNextSteps: { type: Boolean, default: false },
|
|
95
99
|
disabledPreviousSteps: { type: Boolean, default: false },
|
|
96
100
|
autoValidatedSteps: { type: Boolean, default: false },
|
|
101
|
+
allStepsOpened: { type: Boolean, default: false },
|
|
102
|
+
allStepsValidated: { type: Boolean, default: false },
|
|
97
103
|
color: {
|
|
98
104
|
type: String,
|
|
99
105
|
default: "primary",
|
|
@@ -116,8 +122,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
116
122
|
setup(__props, { emit: emits }) {
|
|
117
123
|
const props = __props;
|
|
118
124
|
useCssVars((_ctx) => ({
|
|
119
|
-
"
|
|
120
|
-
"
|
|
125
|
+
"1bc20522": unref(roundStepBgColor),
|
|
126
|
+
"6b59278c": unref(roundStepTextColor)
|
|
121
127
|
}));
|
|
122
128
|
const roundStepBgColor = computed(() => `var(--maz-color-${props.color})`);
|
|
123
129
|
const roundStepTextColor = computed(
|
|
@@ -150,19 +156,22 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
150
156
|
const hasSubtitleForStep = (step) => {
|
|
151
157
|
return Object.keys(slots).filter((slot) => slot.startsWith("subtitle-")).includes(`subtitle-${step}`);
|
|
152
158
|
};
|
|
159
|
+
const hasTitleRightForStep = (step) => {
|
|
160
|
+
return Object.keys(slots).filter((slot) => slot.startsWith("title-info-")).includes(`title-info-${step}`);
|
|
161
|
+
};
|
|
153
162
|
const isStepValidated = (step) => {
|
|
154
163
|
var _a, _b;
|
|
155
|
-
const isValidated =
|
|
164
|
+
const isValidated = (_b = (_a = props.steps) == null ? void 0 : _a[step - 1]) == null ? void 0 : _b.validated;
|
|
156
165
|
const isAutoValidated = props.autoValidatedSteps && step < currentStep.value;
|
|
157
|
-
return isValidated ||
|
|
166
|
+
return isValidated ?? (isAutoValidated || props.allStepsValidated);
|
|
158
167
|
};
|
|
159
168
|
const isStepDisabled = (step) => {
|
|
160
169
|
var _a, _b;
|
|
161
|
-
const isDisabled =
|
|
170
|
+
const isDisabled = (_b = (_a = props.steps) == null ? void 0 : _a[step - 1]) == null ? void 0 : _b.disabled;
|
|
162
171
|
const isCurrentStep = currentStep.value === step;
|
|
163
172
|
const isAutoDisabledNext = props.disabledNextSteps && step > currentStep.value;
|
|
164
173
|
const isAutoDisabledPrevious = props.disabledPreviousSteps && step < currentStep.value;
|
|
165
|
-
return isDisabled
|
|
174
|
+
return isDisabled ?? (isCurrentStep || isAutoDisabledNext || isAutoDisabledPrevious || props.allStepsOpened);
|
|
166
175
|
};
|
|
167
176
|
const isLastStep = (step) => {
|
|
168
177
|
return step === stepCount.value;
|
|
@@ -175,25 +184,30 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
175
184
|
key: 0,
|
|
176
185
|
type: "button",
|
|
177
186
|
disabled: isStepDisabled(step),
|
|
178
|
-
class: normalizeClass(["m-stepper__header", { "--is-current-step": step === unref(currentStep) }]),
|
|
187
|
+
class: normalizeClass(["m-stepper__header", { "--is-current-step": step === unref(currentStep) || __props.allStepsOpened }]),
|
|
179
188
|
onClick: ($event) => selectStep(step)
|
|
180
189
|
}, [
|
|
181
|
-
createElementVNode("
|
|
182
|
-
|
|
183
|
-
"--
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
createElementVNode("
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
190
|
+
createElementVNode("div", _hoisted_3, [
|
|
191
|
+
createElementVNode("span", {
|
|
192
|
+
class: normalizeClass(["m-stepper__count --primary", {
|
|
193
|
+
"--validated": isStepValidated(step)
|
|
194
|
+
}])
|
|
195
|
+
}, [
|
|
196
|
+
_hoisted_4,
|
|
197
|
+
createTextVNode(" " + toDisplayString(step), 1)
|
|
198
|
+
], 2),
|
|
199
|
+
createElementVNode("div", _hoisted_5, [
|
|
200
|
+
createElementVNode("span", _hoisted_6, [
|
|
201
|
+
renderSlot(_ctx.$slots, `title-${step}`, {}, void 0, true)
|
|
202
|
+
]),
|
|
203
|
+
hasSubtitleForStep(step) ? (openBlock(), createElementBlock("span", _hoisted_7, [
|
|
204
|
+
renderSlot(_ctx.$slots, `subtitle-${step}`, {}, void 0, true)
|
|
205
|
+
])) : createCommentVNode("", true)
|
|
206
|
+
])
|
|
207
|
+
]),
|
|
208
|
+
hasTitleRightForStep(step) ? (openBlock(), createElementBlock("span", _hoisted_8, [
|
|
209
|
+
renderSlot(_ctx.$slots, `title-info-${step}`, {}, void 0, true)
|
|
210
|
+
])) : createCommentVNode("", true)
|
|
197
211
|
], 10, _hoisted_2)) : createCommentVNode("", true),
|
|
198
212
|
createElementVNode("div", {
|
|
199
213
|
class: normalizeClass(["m-stepper__content", {
|
|
@@ -202,14 +216,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
202
216
|
}, [
|
|
203
217
|
createVNode(MazTransitionExpand, null, {
|
|
204
218
|
default: withCtx(() => [
|
|
205
|
-
|
|
206
|
-
createElementVNode("div",
|
|
219
|
+
withDirectives(createElementVNode("div", null, [
|
|
220
|
+
createElementVNode("div", _hoisted_9, [
|
|
207
221
|
renderSlot(_ctx.$slots, `content-${step}`, {
|
|
222
|
+
validated: isStepValidated(step),
|
|
208
223
|
nextStep: () => selectStep(step + 1),
|
|
209
224
|
previousStep: () => selectStep(step - 1)
|
|
210
225
|
}, void 0, true)
|
|
211
226
|
])
|
|
212
|
-
])
|
|
227
|
+
], 512), [
|
|
228
|
+
[vShow, __props.allStepsOpened || unref(currentStep) === step]
|
|
229
|
+
])
|
|
213
230
|
]),
|
|
214
231
|
_: 2
|
|
215
232
|
}, 1024)
|
|
@@ -220,8 +237,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
|
220
237
|
};
|
|
221
238
|
}
|
|
222
239
|
});
|
|
223
|
-
const
|
|
224
|
-
const MazStepper = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-
|
|
240
|
+
const MazStepper_vue_vue_type_style_index_0_scoped_50f3f54e_lang = "";
|
|
241
|
+
const MazStepper = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-50f3f54e"]]);
|
|
225
242
|
export {
|
|
226
243
|
MazStepper as default
|
|
227
244
|
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
(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-
|
|
2
|
-
!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
|
|
1
|
+
(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-50f3f54e]{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;cursor:pointer;-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between}.m-stepper__header[data-v-50f3f54e]>: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-50f3f54e]{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-50f3f54e]{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-50f3f54e]:not(:disabled):hover{background-color:var(--maz-color-bg-lighter)}.m-stepper__header[data-v-50f3f54e]:not(:disabled):focus{background-color:var(--maz-color-bg-lighter)}.m-stepper__header[data-v-50f3f54e]:disabled{cursor:not-allowed}.m-stepper__header.--is-current-step[data-v-50f3f54e]{cursor:default}.m-stepper__header__wrapper[data-v-50f3f54e]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.m-stepper__header__wrapper[data-v-50f3f54e]>: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__title[data-v-50f3f54e]{color:var(--maz-color-text)}.m-stepper__subtitle[data-v-50f3f54e]{font-size:.75rem;line-height:1rem;color:var(--maz-color-muted)}.m-stepper__right[data-v-50f3f54e]{text-align:right;font-size:.875rem;line-height:1.25rem;color:var(--maz-color-primary)}.m-stepper__count[data-v-50f3f54e]{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(--1bc20522);color:var(--6b59278c)}.m-stepper__count__circle[data-v-50f3f54e]{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-50f3f54e]{color:var(--6b59278c)}.m-stepper__count.--validated .m-stepper__count__circle[data-v-50f3f54e]{--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-50f3f54e]{color:var(--maz-color-success-contrast)}.m-stepper__content[data-v-50f3f54e]{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-50f3f54e]{padding-top:.5rem;padding-bottom:.5rem}.m-stepper__content[data-v-50f3f54e]: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)}})();
|
|
2
|
+
!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 l=e.__vccOpts||e;for(const[o,s]of t)l[o]=s;return l},l=t(e.defineComponent({__name:"MazTransitionExpand",setup:t=>(t,l)=>(e.openBlock(),e.createBlock(e.TransitionGroup,{class:"m-transition-expand",name:"maz-expand",tag:"div",onEnter:l[0]||(l[0]=t=>(t=>{const l=getComputedStyle(t).width;t.style.width=l,t.style.position="absolute",t.style.visibility="hidden",t.style.height="auto",t.style.top="bottom";const o=getComputedStyle(t).height;t.style.width="",t.style.position="",t.style.visibility="",t.style.height="0px",getComputedStyle(t).height,e.nextTick((()=>{t.style.height=o}))})(t)),onAfterEnter:l[1]||(l[1]=e=>{e.style.height="auto"}),onLeave:l[2]||(l[2]=t=>(t=>{const l=getComputedStyle(t).height;t.style.height=l,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"]]),o={class:"m-stepper"},s=["disabled","onClick"],a={class:"m-stepper__header__wrapper"},n=(t=>(e.pushScopeId("data-v-50f3f54e"),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))),r={class:"m-stepper__header__content"},i={class:"m-stepper__title"},d={key:0,class:"m-stepper__subtitle"},p={key:0,class:"m-stepper__right"},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},allStepsOpened:{type:Boolean,default:!1},allStepsValidated:{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:u}){const m=t;e.useCssVars((t=>({"1bc20522":e.unref(v),"6b59278c":e.unref(f)})));const v=e.computed((()=>`var(--maz-color-${m.color})`)),f=e.computed((()=>`var(--maz-color-${m.color}-contrast)`)),h=e.useSlots(),y=e.computed((()=>Object.keys(h).filter((e=>e.startsWith("content-"))).length)),_=e.ref(1),g=e.computed({get:()=>m.modelValue??_.value,set:e=>{_.value=e,u("update:model-value",e)}}),S=e=>{e<1?g.value=1:e>y.value?g.value=y.value:g.value=e},k=e=>Object.keys(h).filter((e=>e.startsWith("title-"))).includes(`title-${e}`),b=e=>Object.keys(h).filter((e=>e.startsWith("subtitle-"))).includes(`subtitle-${e}`),V=e=>Object.keys(h).filter((e=>e.startsWith("title-info-"))).includes(`title-info-${e}`),B=e=>{var t,l;const o=null==(l=null==(t=m.steps)?void 0:t[e-1])?void 0:l.validated,s=m.autoValidatedSteps&&e<g.value;return o??(s||m.allStepsValidated)},C=e=>{var t,l;const o=null==(l=null==(t=m.steps)?void 0:t[e-1])?void 0:l.disabled,s=g.value===e,a=m.disabledNextSteps&&e>g.value,n=m.disabledPreviousSteps&&e<g.value;return o??(s||a||n||m.allStepsOpened)},E=e=>e===y.value;return(u,m)=>(e.openBlock(),e.createElementBlock("div",o,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(y),(o=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:o},[k(o)?(e.openBlock(),e.createElementBlock("button",{key:0,type:"button",disabled:C(o),class:e.normalizeClass(["m-stepper__header",{"--is-current-step":o===e.unref(g)||t.allStepsOpened}]),onClick:e=>S(o)},[e.createElementVNode("div",a,[e.createElementVNode("span",{class:e.normalizeClass(["m-stepper__count --primary",{"--validated":B(o)}])},[n,e.createTextVNode(" "+e.toDisplayString(o),1)],2),e.createElementVNode("div",r,[e.createElementVNode("span",i,[e.renderSlot(u.$slots,`title-${o}`,{},void 0,!0)]),b(o)?(e.openBlock(),e.createElementBlock("span",d,[e.renderSlot(u.$slots,`subtitle-${o}`,{},void 0,!0)])):e.createCommentVNode("",!0)])]),V(o)?(e.openBlock(),e.createElementBlock("span",p,[e.renderSlot(u.$slots,`title-info-${o}`,{},void 0,!0)])):e.createCommentVNode("",!0)],10,s)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["m-stepper__content",{"--no-border":E(o)}])},[e.createVNode(l,null,{default:e.withCtx((()=>[e.withDirectives(e.createElementVNode("div",null,[e.createElementVNode("div",c,[e.renderSlot(u.$slots,`content-${o}`,{validated:B(o),nextStep:()=>S(o+1),previousStep:()=>S(o-1)},void 0,!0)])],512),[[e.vShow,t.allStepsOpened||e.unref(g)===o]])])),_:2},1024)],2)],64)))),128))]))}}),[["__scopeId","data-v-50f3f54e"]])}));
|