maz-ui 3.46.1-beta.1 → 3.46.1-beta.2
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.
- package/components/MazSwitch.mjs +46 -49
- package/components/assets/MazSwitch.css +1 -1
- package/nuxt/index.json +1 -1
- package/package.json +1 -1
package/components/MazSwitch.mjs
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import { computed as
|
|
2
|
-
import './assets/MazSwitch.css';function
|
|
3
|
-
componentName:
|
|
4
|
-
providedId:
|
|
1
|
+
import { computed as b, getCurrentInstance as k, defineComponent as V, useCssVars as B, ref as C, openBlock as i, createElementBlock as d, unref as f, normalizeClass as m, normalizeStyle as E, createElementVNode as p, mergeProps as S, createCommentVNode as r, renderSlot as $, createTextVNode as z, toDisplayString as h } from "vue";
|
|
2
|
+
import './assets/MazSwitch.css';function I({
|
|
3
|
+
componentName: o,
|
|
4
|
+
providedId: s
|
|
5
5
|
}) {
|
|
6
|
-
return
|
|
6
|
+
return b(() => {
|
|
7
7
|
var a;
|
|
8
|
-
return
|
|
8
|
+
return s ?? `${o}-${(a = k()) == null ? void 0 : a.uid}`;
|
|
9
9
|
});
|
|
10
10
|
}
|
|
11
|
-
const
|
|
11
|
+
const N = ["for", "aria-checked"], T = ["id", "name", "checked", "aria-label", "disabled"], D = {
|
|
12
12
|
key: 0,
|
|
13
13
|
class: "m-switch__text"
|
|
14
|
-
},
|
|
14
|
+
}, R = /* @__PURE__ */ V({
|
|
15
15
|
inheritAttrs: !1,
|
|
16
16
|
__name: "MazSwitch",
|
|
17
17
|
props: {
|
|
@@ -29,46 +29,43 @@ const T = ["for", "aria-checked"], D = ["id", "name", "checked", "aria-label", "
|
|
|
29
29
|
hint: {}
|
|
30
30
|
},
|
|
31
31
|
emits: ["update:model-value", "change", "blur", "focus"],
|
|
32
|
-
setup(
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
"40e17e82": y.value
|
|
32
|
+
setup(o, { emit: s }) {
|
|
33
|
+
B((e) => ({
|
|
34
|
+
"1d7b852e": v.value
|
|
36
35
|
}));
|
|
37
|
-
const a =
|
|
36
|
+
const a = o, n = s, u = I({
|
|
38
37
|
componentName: "MazSwitch",
|
|
39
38
|
providedId: a.id
|
|
40
|
-
}), v =
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
function m() {
|
|
44
|
-
o("update:model-value", !a.modelValue), o("change", !a.modelValue);
|
|
39
|
+
}), v = b(() => `var(--maz-color-${a.color}-alpha)`);
|
|
40
|
+
function c() {
|
|
41
|
+
n("update:model-value", !a.modelValue), n("change", !a.modelValue);
|
|
45
42
|
}
|
|
46
|
-
const
|
|
47
|
-
function
|
|
48
|
-
["Space"].includes(e.code) && (e.preventDefault(),
|
|
43
|
+
const t = C();
|
|
44
|
+
function y(e) {
|
|
45
|
+
["Space"].includes(e.code) && (e.preventDefault(), c());
|
|
49
46
|
}
|
|
50
|
-
function
|
|
47
|
+
function w(e) {
|
|
51
48
|
var l;
|
|
52
|
-
(l =
|
|
49
|
+
(l = t.value) == null || l.dispatchEvent(new Event("blur")), n("blur", e);
|
|
53
50
|
}
|
|
54
|
-
function
|
|
51
|
+
function g(e) {
|
|
55
52
|
var l;
|
|
56
|
-
(l =
|
|
53
|
+
(l = t.value) == null || l.dispatchEvent(new Event("focus")), n("focus", e);
|
|
57
54
|
}
|
|
58
|
-
return (e, l) => (i(),
|
|
59
|
-
for: f(
|
|
60
|
-
class:
|
|
55
|
+
return (e, l) => (i(), d("label", {
|
|
56
|
+
for: f(u),
|
|
57
|
+
class: m(["m-switch", [{ "--is-disabled": e.disabled }, a.class]]),
|
|
61
58
|
role: "switch",
|
|
62
|
-
style:
|
|
59
|
+
style: E(e.style),
|
|
63
60
|
"aria-checked": e.modelValue,
|
|
64
61
|
tabindex: "0",
|
|
65
|
-
onBlur:
|
|
66
|
-
onFocus:
|
|
67
|
-
onKeydown:
|
|
62
|
+
onBlur: w,
|
|
63
|
+
onFocus: g,
|
|
64
|
+
onKeydown: y
|
|
68
65
|
}, [
|
|
69
|
-
|
|
66
|
+
p("input", S({ id: f(u) }, e.$attrs, {
|
|
70
67
|
ref_key: "inputRef",
|
|
71
|
-
ref:
|
|
68
|
+
ref: t,
|
|
72
69
|
type: "checkbox",
|
|
73
70
|
name: e.name,
|
|
74
71
|
tabindex: "-1",
|
|
@@ -76,45 +73,45 @@ const T = ["for", "aria-checked"], D = ["id", "name", "checked", "aria-label", "
|
|
|
76
73
|
"aria-label": e.label,
|
|
77
74
|
disabled: e.disabled,
|
|
78
75
|
class: "m-switch__input",
|
|
79
|
-
onChange:
|
|
80
|
-
}), null, 16,
|
|
81
|
-
l[0] || (l[0] =
|
|
76
|
+
onChange: c
|
|
77
|
+
}), null, 16, T),
|
|
78
|
+
l[0] || (l[0] = p(
|
|
82
79
|
"span",
|
|
83
80
|
{ class: "m-switch__toggle" },
|
|
84
81
|
null,
|
|
85
82
|
-1
|
|
86
83
|
/* HOISTED */
|
|
87
84
|
)),
|
|
88
|
-
e.$slots.default || e.label || e.hint ? (i(),
|
|
89
|
-
|
|
85
|
+
e.$slots.default || e.label || e.hint ? (i(), d("span", D, [
|
|
86
|
+
r(`
|
|
90
87
|
@slot The label of the switch
|
|
91
88
|
@binding {Boolean} value - The value of the switch
|
|
92
89
|
`),
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
90
|
+
$(e.$slots, "default", { value: e.modelValue }, () => [
|
|
91
|
+
z(
|
|
92
|
+
h(e.label),
|
|
96
93
|
1
|
|
97
94
|
/* TEXT */
|
|
98
95
|
)
|
|
99
96
|
]),
|
|
100
|
-
e.hint ? (i(),
|
|
97
|
+
e.hint ? (i(), d(
|
|
101
98
|
"span",
|
|
102
99
|
{
|
|
103
100
|
key: 0,
|
|
104
|
-
class:
|
|
101
|
+
class: m(["m-switch__hint", {
|
|
105
102
|
"--error": e.error,
|
|
106
103
|
"--success": e.success,
|
|
107
104
|
"--warning": e.warning
|
|
108
105
|
}])
|
|
109
106
|
},
|
|
110
|
-
|
|
107
|
+
h(e.hint),
|
|
111
108
|
3
|
|
112
109
|
/* TEXT, CLASS */
|
|
113
|
-
)) :
|
|
114
|
-
])) :
|
|
115
|
-
], 46,
|
|
110
|
+
)) : r("v-if", !0)
|
|
111
|
+
])) : r("v-if", !0)
|
|
112
|
+
], 46, N));
|
|
116
113
|
}
|
|
117
114
|
});
|
|
118
115
|
export {
|
|
119
|
-
|
|
116
|
+
R as default
|
|
120
117
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.m-switch{position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;cursor:pointer;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.5rem;vertical-align:top}.m-switch.--is-disabled{cursor:not-allowed}.m-switch__input{position:absolute;left:-9999px}.m-switch__toggle{position:relative;height:1.5rem;width:3rem}.m-switch__toggle:before{content:"";-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out;position:relative;left
|
|
1
|
+
.m-switch{position:relative;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;cursor:pointer;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.5rem;vertical-align:top}.m-switch.--is-disabled{cursor:not-allowed}.m-switch__input{position:absolute;left:-9999px}.m-switch__toggle{position:relative;height:1.5rem;width:3rem}.m-switch__toggle:before{content:"";-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out;position:relative;left:0;top:.125rem;display:block;height:1.25rem;width:3rem;border-radius:9999px;background-color:var(--maz-color-bg-light)}.m-switch__toggle:is([class~=dark] *):before{background-color:var(--maz-color-bg-lighter)}.m-switch__toggle:after{content:"";position:absolute;left:0;top:0;display:block;height:1.5rem;width:1.5rem;border-radius:9999px;background-color:#fff;-webkit-box-shadow:0 0 4px 0 hsl(0deg 0% 0% / 20%);box-shadow:0 0 4px #0003;-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out}.m-switch__input:checked+.m-switch__toggle:after{--tw-translate-x: 1.5rem;-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-switch__input:checked+.m-switch__toggle:before{background-color:var(--1d7b852e)}.m-switch__input:disabled+.m-switch__toggle:before{background-color:var(--maz-color-bg-lighter)}.m-switch__input:disabled+.m-switch__toggle:is([class~=dark] *):before{background-color:var(--maz-color-bg-light)}.m-switch__input:disabled+.m-switch__toggle:after{background-color:var(--maz-color-bg-light)}.m-switch__input:disabled+.m-switch__toggle:is([class~=dark] *):after{background-color:var(--maz-color-bg-lighter)}.m-switch__input:disabled+.m-switch__toggle:after{-webkit-box-shadow:none;box-shadow:none}.m-switch__text{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;gap:0px}.m-switch__hint{font-size:.875rem;line-height:1.25rem;color:var(--maz-color-muted)}.m-switch__hint.--error{color:var(--maz-color-danger-600)}.m-switch__hint.--success{color:var(--maz-color-success-600)}.m-switch__hint.--warning{color:var(--maz-color-warning-600)}
|
package/nuxt/index.json
CHANGED
package/package.json
CHANGED