@bobbykim/manguito-theme 1.3.0 → 1.4.0
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/CHANGELOG.md +12 -0
- package/README.md +17 -0
- package/dist/core.cjs +2 -2
- package/dist/core.d.ts +27 -4
- package/dist/core.js +607 -573
- package/dist/mcl-theme-v4.css +7 -1
- package/package.json +1 -1
package/dist/core.js
CHANGED
|
@@ -1,202 +1,207 @@
|
|
|
1
|
-
(function(){"use strict";try{if(typeof document<"u"){var a=document.createElement("style");a.appendChild(document.createTextNode(".slide-prev-enter-active[data-v-e9caba8a]{transition:all .5s linear}.slide-prev-leave-active[data-v-e9caba8a]{transition:all .5s}.slide-prev-enter-from[data-v-e9caba8a]{transform:translate(-100%);opacity:0}.slide-prev-leave-to[data-v-e9caba8a]{transform:translate(100%);opacity:0}.slide-next-enter-active[data-v-e9caba8a]{transition:all .5s linear}.slide-next-leave-active[data-v-e9caba8a]{transition:all .5s}.slide-next-enter-from[data-v-e9caba8a]{transform:translate(100%);opacity:0}.slide-next-leave-to[data-v-e9caba8a]{transform:translate(-100%);opacity:0}.collapse-enter-active[data-v-7c910f65],.collapse-leave-active[data-v-7c910f65]{transition-property:height,opacity;transition-duration:.5s;transition-timing-function:ease}.dropup-bottom[data-v-dd0b7b7b]{bottom:var(--button-height)}.dropdown-content-enter-active[data-v-dd0b7b7b],.dropdown-content-leave-active[data-v-dd0b7b7b]{transition:all .3s}.dropdown-content-enter-from[data-v-dd0b7b7b],.dropdown-content-leave-to[data-v-dd0b7b7b]{opacity:0;transform:translateY(-10px)}.hamburger__icon[data-v-
|
|
2
|
-
import { a as
|
|
3
|
-
import { defineComponent as
|
|
4
|
-
import { useWindowSize as
|
|
5
|
-
import { p as
|
|
6
|
-
import { g as
|
|
7
|
-
import { v as
|
|
8
|
-
import { useFocusTrap as
|
|
9
|
-
const
|
|
1
|
+
(function(){"use strict";try{if(typeof document<"u"){var a=document.createElement("style");a.appendChild(document.createTextNode(".slide-prev-enter-active[data-v-e9caba8a]{transition:all .5s linear}.slide-prev-leave-active[data-v-e9caba8a]{transition:all .5s}.slide-prev-enter-from[data-v-e9caba8a]{transform:translate(-100%);opacity:0}.slide-prev-leave-to[data-v-e9caba8a]{transform:translate(100%);opacity:0}.slide-next-enter-active[data-v-e9caba8a]{transition:all .5s linear}.slide-next-leave-active[data-v-e9caba8a]{transition:all .5s}.slide-next-enter-from[data-v-e9caba8a]{transform:translate(100%);opacity:0}.slide-next-leave-to[data-v-e9caba8a]{transform:translate(-100%);opacity:0}.collapse-enter-active[data-v-7c910f65],.collapse-leave-active[data-v-7c910f65]{transition-property:height,opacity;transition-duration:.5s;transition-timing-function:ease}.dropup-bottom[data-v-dd0b7b7b]{bottom:var(--button-height)}.dropdown-content-enter-active[data-v-dd0b7b7b],.dropdown-content-leave-active[data-v-dd0b7b7b]{transition:all .3s}.dropdown-content-enter-from[data-v-dd0b7b7b],.dropdown-content-leave-to[data-v-dd0b7b7b]{opacity:0;transform:translateY(-10px)}.hamburger__icon[data-v-5904b04a]:before,.hamburger__icon[data-v-5904b04a]:after{position:absolute;left:0;transition:all .3s linear}.hamburger__icon[data-v-5904b04a]:before{top:-.5rem}.hamburger__icon[data-v-5904b04a]:after{top:.5rem}.hamburger__button:focus .hamburger__icon[data-v-5904b04a],.hamburger__button:hover .hamburger__icon[data-v-5904b04a]{scale:1.05}.hamburger__checkbox:checked+.hamburger__icon[data-v-5904b04a]{background-color:transparent}.hamburger__checkbox:checked+.hamburger__icon[data-v-5904b04a]:before{top:0;transform:rotate(135deg)}.hamburger__checkbox:checked+.hamburger__icon[data-v-5904b04a]:after{top:0;transform:rotate(-135deg)}.collapse-enter-active[data-v-fb1e97dd]{transition:height .5s ease-in}.collapse-leave-active[data-v-fb1e97dd]{transition:height .5s ease-out}.header-desktop[data-v-a2d7d11b]{width:100%}@media screen and (min-width:1024px){.header-desktop[data-v-a2d7d11b]{width:var(--header-width)}}.slide-down-enter-active[data-v-a2d7d11b]{transition:transform .3s ease-in .2s,opacity .5s ease-in}.slide-down-leave-active[data-v-a2d7d11b]{transition:transform .5s ease-in,opacity .3s ease-in .2s}.slide-down-enter-from[data-v-a2d7d11b],.slide-down-leave-to[data-v-a2d7d11b]{opacity:0;transform:translateY(-100%)}.vertical-placement[data-v-9730e4f1]{top:var(--vertical-placement);left:50%;transform:translateY(calc(-1 * var(--vertical-placement))) translate(-50%)}.fade-enter-active[data-v-9730e4f1],.fade-leave-active[data-v-9730e4f1]{transition-property:opacity;transition-duration:.3s;transition-timing-function:linear}.fade-enter-from[data-v-9730e4f1],.fade-leave-to[data-v-9730e4f1]{opacity:0}.slide-down-enter-active[data-v-9730e4f1]{animation:slide-down-9730e4f1 .3s ease}.slide-down-leave-active[data-v-9730e4f1]{animation:slide-down-9730e4f1 reverse .3s ease}@keyframes slide-down-9730e4f1{0%{opacity:0;transform:translateY(-100%) translate(-50%)}to{opacity:1;transform:translateY(calc(-1 * var(--vertical-placement))) translate(-50%)}}.sidebar-body[data-v-658499cf]{width:100%}.sidebar-body-height[data-v-658499cf]{min-height:calc(100vh - var(--header-height) - var(--footer-height))}.fade-enter-active[data-v-658499cf],.fade-leave-active[data-v-658499cf]{transition-property:opacity;transition-duration:.3s;transition-timing-function:linear}.fade-enter-from[data-v-658499cf],.fade-leave-to[data-v-658499cf]{opacity:0}.sidebar-left-enter-active[data-v-658499cf],.sidebar-left-leave-active[data-v-658499cf],.sidebar-right-enter-active[data-v-658499cf],.sidebar-right-leave-active[data-v-658499cf]{transition-property:transform,opacity;transition-duration:.3s;transition-timing-function:linear}.sidebar-left-enter-from[data-v-658499cf],.sidebar-left-leave-to[data-v-658499cf]{transform:translate(-100%)}.sidebar-right-enter-from[data-v-658499cf],.sidebar-right-leave-to[data-v-658499cf]{transform:translate(100%)}@media screen and (min-width:768px){.sidebar-body[data-v-658499cf]{width:var(--sidebar-width)}.sidebar-left-enter-from[data-v-658499cf],.sidebar-left-leave-to[data-v-658499cf]{transform:translate(calc(-1 * var(--sidebar-width)))}.sidebar-right-enter-from[data-v-658499cf],.sidebar-right-leave-to[data-v-658499cf]{transform:translate(var(--sidebar-width))}}.container-hts[data-v-2d9322d9]{max-height:var(--container-hts, none)}.slide-prev-enter-active[data-v-2d9322d9]{transition:all .5s linear}.slide-prev-leave-active[data-v-2d9322d9]{transition:all .5s}.slide-prev-enter-from[data-v-2d9322d9]{transform:translate(-100%);opacity:0}.slide-prev-leave-to[data-v-2d9322d9]{transform:translate(100%);opacity:0}.slide-next-enter-active[data-v-2d9322d9]{transition:all .5s linear}.slide-next-leave-active[data-v-2d9322d9]{transition:all .5s}.slide-next-enter-from[data-v-2d9322d9]{transform:translate(100%);opacity:0}.slide-next-leave-to[data-v-2d9322d9]{transform:translate(-100%);opacity:0}")),document.head.appendChild(a)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
|
|
2
|
+
import { a as de, p as ue, b as fe, c as he, d as ve, e as ge, f as be, h as me, m as pe, i as ye, j as Ce, k as we, l as xe, n as ke, o as Ve, q as Be, r as Re, s as Oe, t as $e, u as Le, v as Ie, w as Te, x as De, y as Ae, z as Se, A as Ee, B as He, C as Ne, D as Ge, E as ze, F as Me, G as je, H as We, I as _e, J as Fe, K as Pe, L as Xe, M as Ye, N as Ue, O as Ke, P as qe, Q as Je, R as Qe, S as Ze, T as et, U as tt, V as ot, W as at, X as lt, Y as st, Z as rt, _ as nt, $ as it, a0 as ct, a1 as dt, a2 as ut, a3 as ft, a4 as ht, a5 as vt, g as y } from "./index-CDXrm85l.js";
|
|
3
|
+
import { defineComponent as $, openBlock as n, createElementBlock as c, renderSlot as C, ref as w, computed as R, watch as E, normalizeClass as b, createElementVNode as g, createCommentVNode as v, useSlots as M, toDisplayString as j, provide as Q, createVNode as D, Transition as A, withCtx as S, inject as Z, withDirectives as z, vShow as ee, useId as te, toRef as gt, unref as k, onMounted as F, withKeys as bt, createBlock as P, normalizeStyle as W, vModelCheckbox as mt, Teleport as pt, mergeProps as ae } from "vue";
|
|
4
|
+
import { useWindowSize as yt, useWindowScroll as Ct, useScrollLock as wt, useElementSize as xt } from "@vueuse/core";
|
|
5
|
+
import { p as kt, u as Vt, o as le, a as se } from "./useModalScrollLock-ONrBOk5v.js";
|
|
6
|
+
import { g as Bt } from "./getGlassmorphismClass-d_Ji96-u.js";
|
|
7
|
+
import { v as oe } from "./index-CzXHE-4G.js";
|
|
8
|
+
import { useFocusTrap as re } from "@vueuse/integrations/useFocusTrap";
|
|
9
|
+
const xo = (e, t) => {
|
|
10
10
|
switch (e) {
|
|
11
11
|
case "BGCOLOR":
|
|
12
|
-
return
|
|
12
|
+
return vt({ color: t });
|
|
13
13
|
case "HVBGCOLOR":
|
|
14
|
-
return
|
|
14
|
+
return ht({ color: t });
|
|
15
15
|
case "FCBGCOLOR":
|
|
16
|
-
return
|
|
16
|
+
return ft({ color: t });
|
|
17
17
|
case "BEFOREBG":
|
|
18
|
-
return
|
|
18
|
+
return ut({ color: t });
|
|
19
19
|
case "AFTERBG":
|
|
20
|
-
return
|
|
20
|
+
return dt({ color: t });
|
|
21
21
|
case "ACTIVEBG":
|
|
22
|
-
return
|
|
22
|
+
return ct({ color: t });
|
|
23
23
|
case "TEXTCOLOR":
|
|
24
|
-
return
|
|
24
|
+
return it({ color: t });
|
|
25
25
|
case "HVTEXTCOLOR":
|
|
26
|
-
return
|
|
26
|
+
return nt({ color: t });
|
|
27
27
|
case "FCTEXTCOLOR":
|
|
28
|
-
return
|
|
28
|
+
return rt({ color: t });
|
|
29
29
|
case "DISABLEDTEXTCOLOR":
|
|
30
|
-
return
|
|
30
|
+
return st({ color: t });
|
|
31
31
|
case "SVGFILL":
|
|
32
|
-
return
|
|
32
|
+
return lt({ color: t });
|
|
33
33
|
case "RINGCOLOR":
|
|
34
|
-
return
|
|
34
|
+
return at({ color: t });
|
|
35
35
|
case "FOCUSRING":
|
|
36
|
-
return
|
|
36
|
+
return ot({ color: t });
|
|
37
37
|
case "ACTIVERING":
|
|
38
|
-
return
|
|
38
|
+
return tt({ color: t });
|
|
39
39
|
case "OFFSETRING":
|
|
40
|
-
return
|
|
40
|
+
return et({ color: t });
|
|
41
41
|
case "OUTLINE":
|
|
42
|
-
return
|
|
42
|
+
return Ze({ color: t });
|
|
43
43
|
case "FOCUSOUTLINE":
|
|
44
|
-
return
|
|
44
|
+
return Qe({ color: t });
|
|
45
45
|
case "ACTIVEOUTLINE":
|
|
46
|
-
return
|
|
46
|
+
return Je({ color: t });
|
|
47
47
|
case "BTNCOLOR":
|
|
48
|
-
return
|
|
48
|
+
return qe({ color: t });
|
|
49
49
|
case "LISTCOLOR":
|
|
50
|
-
return
|
|
50
|
+
return Ke({ color: t });
|
|
51
51
|
case "BORDER":
|
|
52
|
-
return
|
|
52
|
+
return Ue({ color: t });
|
|
53
53
|
case "BORDERX":
|
|
54
|
-
return
|
|
54
|
+
return Ye({ color: t });
|
|
55
55
|
case "BORDERY":
|
|
56
|
-
return
|
|
56
|
+
return Xe({ color: t });
|
|
57
57
|
case "BORDERT":
|
|
58
|
-
return
|
|
58
|
+
return Pe({ color: t });
|
|
59
59
|
case "BORDERB":
|
|
60
|
-
return
|
|
60
|
+
return Fe({ color: t });
|
|
61
61
|
case "BORDERL":
|
|
62
|
-
return
|
|
62
|
+
return _e({ color: t });
|
|
63
63
|
case "BORDERR":
|
|
64
|
-
return
|
|
64
|
+
return We({ color: t });
|
|
65
65
|
case "H1":
|
|
66
|
-
return
|
|
66
|
+
return je({ size: t });
|
|
67
67
|
case "H2":
|
|
68
|
-
return
|
|
68
|
+
return Me({ size: t });
|
|
69
69
|
case "H3":
|
|
70
|
-
return
|
|
70
|
+
return ze({ size: t });
|
|
71
71
|
case "H4":
|
|
72
|
-
return
|
|
72
|
+
return Ge({ size: t });
|
|
73
73
|
case "BODYTEXT":
|
|
74
|
-
return
|
|
74
|
+
return Ne({ size: t });
|
|
75
75
|
case "FONTWEIGHT":
|
|
76
|
-
return
|
|
76
|
+
return He({ weight: t });
|
|
77
77
|
case "TEXTALIGN":
|
|
78
|
-
return
|
|
78
|
+
return Ee({ align: t });
|
|
79
79
|
case "BORDERW":
|
|
80
|
-
return
|
|
80
|
+
return Se({ width: t });
|
|
81
81
|
case "BORDERXW":
|
|
82
|
-
return
|
|
82
|
+
return Ae({ width: t });
|
|
83
83
|
case "BORDERYW":
|
|
84
|
-
return
|
|
84
|
+
return De({ width: t });
|
|
85
85
|
case "BORDERTW":
|
|
86
86
|
return Te({ width: t });
|
|
87
87
|
case "BORDERBW":
|
|
88
|
-
return
|
|
88
|
+
return Ie({ width: t });
|
|
89
89
|
case "BORDERLW":
|
|
90
|
-
return
|
|
90
|
+
return Le({ width: t });
|
|
91
91
|
case "BORDERRW":
|
|
92
|
-
return
|
|
92
|
+
return $e({ width: t });
|
|
93
93
|
case "OPACITY":
|
|
94
|
-
return
|
|
94
|
+
return Oe({ opacity: t });
|
|
95
95
|
case "BGOPACITY":
|
|
96
|
-
return
|
|
96
|
+
return Re({ opacity: t });
|
|
97
97
|
case "OUTLINEOPACITY":
|
|
98
|
-
return
|
|
98
|
+
return Be({ opacity: t });
|
|
99
99
|
case "MARGIN":
|
|
100
|
-
return
|
|
100
|
+
return Ve({ spacing: t });
|
|
101
101
|
case "MARGINX":
|
|
102
|
-
return
|
|
102
|
+
return ke({ spacing: t });
|
|
103
103
|
case "MARGINY":
|
|
104
|
-
return
|
|
104
|
+
return xe({ spacing: t });
|
|
105
105
|
case "MARGINT":
|
|
106
|
-
return
|
|
106
|
+
return we({ spacing: t });
|
|
107
107
|
case "MARGINB":
|
|
108
|
-
return
|
|
108
|
+
return Ce({ spacing: t });
|
|
109
109
|
case "MARGINL":
|
|
110
|
-
return
|
|
110
|
+
return ye({ spacing: t });
|
|
111
111
|
case "MARGINR":
|
|
112
|
-
return
|
|
112
|
+
return pe({ spacing: t });
|
|
113
113
|
case "PADDING":
|
|
114
|
-
return
|
|
114
|
+
return me({ spacing: t });
|
|
115
115
|
case "PADDINGX":
|
|
116
|
-
return
|
|
116
|
+
return be({ spacing: t });
|
|
117
117
|
case "PADDINGY":
|
|
118
|
-
return
|
|
118
|
+
return ge({ spacing: t });
|
|
119
119
|
case "PADDINGT":
|
|
120
|
-
return
|
|
120
|
+
return ve({ spacing: t });
|
|
121
121
|
case "PADDINGB":
|
|
122
|
-
return
|
|
122
|
+
return he({ spacing: t });
|
|
123
123
|
case "PADDINGL":
|
|
124
|
-
return
|
|
124
|
+
return fe({ spacing: t });
|
|
125
125
|
case "PADDINGR":
|
|
126
|
-
return
|
|
126
|
+
return ue({ spacing: t });
|
|
127
127
|
case "GAP":
|
|
128
|
-
return
|
|
128
|
+
return de({ spacing: t });
|
|
129
129
|
default:
|
|
130
130
|
return "";
|
|
131
131
|
}
|
|
132
|
-
},
|
|
132
|
+
}, ko = /* @__PURE__ */ $({
|
|
133
133
|
__name: "AccordionGroup",
|
|
134
134
|
setup(e) {
|
|
135
|
-
return
|
|
136
|
-
|
|
135
|
+
return kt(), (t, u) => (n(), c("div", null, [
|
|
136
|
+
C(t.$slots, "default")
|
|
137
137
|
]));
|
|
138
138
|
}
|
|
139
|
-
}),
|
|
139
|
+
}), Rt = { class: "flex w-full justify-between gap-2xs" }, Ot = { class: "w-full" }, $t = ["aria-label"], Vo = /* @__PURE__ */ $({
|
|
140
140
|
__name: "Alert",
|
|
141
141
|
props: {
|
|
142
142
|
color: { default: "danger" },
|
|
143
143
|
rounded: { type: Boolean, default: !0 },
|
|
144
144
|
shadow: { type: Boolean, default: !0 },
|
|
145
145
|
show: { type: Boolean, default: !1 },
|
|
146
|
-
dismissible: { type: Boolean, default: !1 }
|
|
146
|
+
dismissible: { type: Boolean, default: !1 },
|
|
147
|
+
dismissLabel: { default: "Dismiss" }
|
|
147
148
|
},
|
|
148
149
|
emits: ["close"],
|
|
149
150
|
setup(e, { expose: t, emit: u }) {
|
|
150
|
-
const
|
|
151
|
-
const { color: r, rounded: f, shadow: p } =
|
|
152
|
-
return f &&
|
|
153
|
-
}),
|
|
154
|
-
|
|
155
|
-
},
|
|
156
|
-
|
|
151
|
+
const s = e, o = u, d = w(s.show), l = R(() => {
|
|
152
|
+
const { color: r, rounded: f, shadow: p } = s, h = [y.bgColorVariant({ color: r })];
|
|
153
|
+
return f && h.push("rounded-md"), p && h.push("drop-shadow-md"), h.join(" ");
|
|
154
|
+
}), i = (r) => {
|
|
155
|
+
d.value = !1, o("close", r);
|
|
156
|
+
}, a = () => {
|
|
157
|
+
d.value = !1;
|
|
157
158
|
};
|
|
158
159
|
return E(
|
|
159
|
-
() =>
|
|
160
|
+
() => s.show,
|
|
160
161
|
(r) => {
|
|
161
|
-
|
|
162
|
+
d.value = r;
|
|
162
163
|
}
|
|
163
164
|
), t({
|
|
164
|
-
close:
|
|
165
|
-
}), (r, f) =>
|
|
165
|
+
close: a
|
|
166
|
+
}), (r, f) => d.value ? (n(), c("div", {
|
|
166
167
|
key: 0,
|
|
167
168
|
role: "alert",
|
|
168
169
|
"aria-live": "polite",
|
|
169
170
|
"aria-atomic": "true",
|
|
170
|
-
class:
|
|
171
|
+
class: b(["relative px-[1.25rem] py-[0.75rem]", [l.value]])
|
|
171
172
|
}, [
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
173
|
+
g("div", Rt, [
|
|
174
|
+
g("div", Ot, [
|
|
175
|
+
C(r.$slots, "default")
|
|
175
176
|
]),
|
|
176
|
-
e.dismissible ? (
|
|
177
|
+
e.dismissible ? (n(), c("button", {
|
|
177
178
|
key: 0,
|
|
178
|
-
|
|
179
|
+
type: "button",
|
|
180
|
+
"aria-label": e.dismissLabel,
|
|
181
|
+
onClick: i,
|
|
179
182
|
class: "flex items-center opacity-60 transition-opacity duration-300 ease-linear hover:opacity-40"
|
|
180
183
|
}, [...f[0] || (f[0] = [
|
|
181
|
-
|
|
184
|
+
g("svg", {
|
|
182
185
|
xmlns: "http://www.w3.org/2000/svg",
|
|
183
186
|
viewBox: "0 0 384 512",
|
|
184
187
|
fill: "currentColor",
|
|
188
|
+
"aria-hidden": "true",
|
|
189
|
+
focusable: "false",
|
|
185
190
|
class: "h-xs"
|
|
186
191
|
}, [
|
|
187
|
-
|
|
192
|
+
g("path", { d: "M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z" })
|
|
188
193
|
], -1)
|
|
189
|
-
])])) :
|
|
194
|
+
])], 8, $t)) : v("", !0)
|
|
190
195
|
])
|
|
191
|
-
], 2)) :
|
|
196
|
+
], 2)) : v("", !0);
|
|
192
197
|
}
|
|
193
|
-
}),
|
|
198
|
+
}), Lt = ["src", "alt"], It = {
|
|
194
199
|
key: 2,
|
|
195
200
|
class: "flex-1 px-xs pt-xs pb-2xs"
|
|
196
|
-
},
|
|
201
|
+
}, Tt = {
|
|
197
202
|
key: 3,
|
|
198
203
|
class: "flex-1"
|
|
199
|
-
},
|
|
204
|
+
}, Bo = /* @__PURE__ */ $({
|
|
200
205
|
__name: "Card",
|
|
201
206
|
props: {
|
|
202
207
|
variant: { default: "light-1" },
|
|
@@ -219,80 +224,80 @@ const Co = (e, t) => {
|
|
|
219
224
|
cardClass: { default: "" }
|
|
220
225
|
},
|
|
221
226
|
setup(e) {
|
|
222
|
-
const t = e, u =
|
|
227
|
+
const t = e, u = M(), s = R(() => {
|
|
223
228
|
const {
|
|
224
|
-
variant:
|
|
225
|
-
rounded:
|
|
229
|
+
variant: i,
|
|
230
|
+
rounded: a,
|
|
226
231
|
shadow: r,
|
|
227
232
|
border: f,
|
|
228
233
|
borderVariant: p,
|
|
229
|
-
glass:
|
|
230
|
-
glassBlur:
|
|
231
|
-
glassOpacity:
|
|
234
|
+
glass: h,
|
|
235
|
+
glassBlur: m,
|
|
236
|
+
glassOpacity: L
|
|
232
237
|
} = t;
|
|
233
238
|
return [
|
|
234
|
-
|
|
235
|
-
|
|
239
|
+
y.bgColorVariant({ color: i }),
|
|
240
|
+
a ? "rounded-lg" : "rounded-sm",
|
|
236
241
|
r && "drop-shadow-md",
|
|
237
242
|
f && "border",
|
|
238
|
-
f &&
|
|
239
|
-
|
|
243
|
+
f && y.borderColorVariant({ color: p }),
|
|
244
|
+
h && Bt(i, m, L)
|
|
240
245
|
].filter(Boolean).join(" ");
|
|
241
|
-
}),
|
|
242
|
-
const { titleVariant:
|
|
246
|
+
}), o = R(() => {
|
|
247
|
+
const { titleVariant: i, titleSize: a } = t;
|
|
243
248
|
return [
|
|
244
|
-
|
|
245
|
-
|
|
249
|
+
y.textColorVariant({ color: i }),
|
|
250
|
+
y.h3Variant({ size: a })
|
|
246
251
|
].join(" ");
|
|
247
|
-
}),
|
|
248
|
-
const { border:
|
|
252
|
+
}), d = R(() => {
|
|
253
|
+
const { border: i, borderVariant: a, titleVariant: r } = t;
|
|
249
254
|
return [
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
255
|
+
y.textColorVariant({ color: r }),
|
|
256
|
+
i && "border-b",
|
|
257
|
+
y.borderColorVariant({ color: a })
|
|
253
258
|
].filter(Boolean).join(" ");
|
|
254
|
-
}),
|
|
255
|
-
const { border:
|
|
259
|
+
}), l = R(() => {
|
|
260
|
+
const { border: i, borderVariant: a } = t;
|
|
256
261
|
return [
|
|
257
|
-
|
|
258
|
-
|
|
262
|
+
i && "border-t",
|
|
263
|
+
i && y.borderColorVariant({ color: a })
|
|
259
264
|
].filter(Boolean).join(" ");
|
|
260
265
|
});
|
|
261
|
-
return (
|
|
262
|
-
class:
|
|
266
|
+
return (i, a) => (n(), c("div", {
|
|
267
|
+
class: b(["flex h-full w-full flex-col overflow-hidden", [s.value, e.cardClass]])
|
|
263
268
|
}, [
|
|
264
|
-
e.header || u.header ?
|
|
265
|
-
|
|
266
|
-
class:
|
|
269
|
+
e.header || u.header ? C(i.$slots, "header", { key: 0 }, () => [
|
|
270
|
+
g("div", {
|
|
271
|
+
class: b([[d.value], "px-xs py-2xs font-bold"])
|
|
267
272
|
}, [
|
|
268
|
-
|
|
273
|
+
g("p", null, j(e.header), 1)
|
|
269
274
|
], 2)
|
|
270
|
-
]) :
|
|
271
|
-
e.imageSrc && !e.noImage ? (
|
|
275
|
+
]) : v("", !0),
|
|
276
|
+
e.imageSrc && !e.noImage ? (n(), c("img", {
|
|
272
277
|
key: 1,
|
|
273
278
|
src: e.imageSrc,
|
|
274
279
|
alt: e.imageAlt,
|
|
275
280
|
class: "aspect-video min-w-full object-cover object-top"
|
|
276
|
-
}, null, 8,
|
|
277
|
-
e.noBody ?
|
|
278
|
-
|
|
279
|
-
class:
|
|
281
|
+
}, null, 8, Lt)) : v("", !0),
|
|
282
|
+
e.noBody ? v("", !0) : (n(), c("div", It, [
|
|
283
|
+
g("h3", {
|
|
284
|
+
class: b([[o.value], "mb-xs"])
|
|
280
285
|
}, j(e.title), 3),
|
|
281
|
-
u.body ?
|
|
286
|
+
u.body ? C(i.$slots, "body", { key: 0 }) : v("", !0)
|
|
282
287
|
])),
|
|
283
|
-
e.noBody && u.default ? (
|
|
284
|
-
|
|
285
|
-
])) :
|
|
286
|
-
e.footer || u.footer ?
|
|
287
|
-
|
|
288
|
-
class:
|
|
288
|
+
e.noBody && u.default ? (n(), c("div", Tt, [
|
|
289
|
+
C(i.$slots, "default")
|
|
290
|
+
])) : v("", !0),
|
|
291
|
+
e.footer || u.footer ? C(i.$slots, "footer", { key: 4 }, () => [
|
|
292
|
+
g("div", {
|
|
293
|
+
class: b(["px-xs py-2xs", [l.value]])
|
|
289
294
|
}, [
|
|
290
|
-
|
|
295
|
+
g("p", null, j(e.footer), 1)
|
|
291
296
|
], 2)
|
|
292
|
-
]) :
|
|
297
|
+
]) : v("", !0)
|
|
293
298
|
], 2));
|
|
294
299
|
}
|
|
295
|
-
}),
|
|
300
|
+
}), ne = /* @__PURE__ */ Symbol(), Dt = /* @__PURE__ */ $({
|
|
296
301
|
__name: "CarouselContainer",
|
|
297
302
|
props: {
|
|
298
303
|
bodyClass: { default: "" },
|
|
@@ -302,82 +307,82 @@ const Co = (e, t) => {
|
|
|
302
307
|
loop: { type: Boolean, default: !1 }
|
|
303
308
|
},
|
|
304
309
|
setup(e, { expose: t }) {
|
|
305
|
-
const u = e,
|
|
306
|
-
|
|
307
|
-
}, r = (
|
|
308
|
-
|
|
310
|
+
const u = e, s = M(), o = w(0), d = w([]), l = w(0), i = w("slide-next"), a = (h) => {
|
|
311
|
+
d.value.push(h), l.value = [...new Set(d.value)].length;
|
|
312
|
+
}, r = (h) => {
|
|
313
|
+
o.value = h;
|
|
309
314
|
};
|
|
310
|
-
|
|
311
|
-
activeIdx:
|
|
312
|
-
setSlide:
|
|
315
|
+
Q(ne, {
|
|
316
|
+
activeIdx: o,
|
|
317
|
+
setSlide: a
|
|
313
318
|
});
|
|
314
319
|
const f = () => {
|
|
315
|
-
const { loop:
|
|
316
|
-
|
|
320
|
+
const { loop: h } = u;
|
|
321
|
+
h && o.value === l.value - 1 ? o.value = 0 : o.value < l.value - 1 && (o.value = o.value + 1);
|
|
317
322
|
}, p = () => {
|
|
318
|
-
const { loop:
|
|
319
|
-
|
|
323
|
+
const { loop: h } = u;
|
|
324
|
+
h && o.value === 0 ? o.value = l.value - 1 : o.value > 0 && (o.value = o.value - 1);
|
|
320
325
|
};
|
|
321
326
|
return E(
|
|
322
|
-
() =>
|
|
323
|
-
(
|
|
324
|
-
|
|
327
|
+
() => o.value,
|
|
328
|
+
(h, m) => {
|
|
329
|
+
h > m || h === 0 && m === l.value - 1 ? i.value = "slide-next" : i.value = "slide-prev";
|
|
325
330
|
}
|
|
326
331
|
), t({
|
|
327
|
-
numberOfSlides:
|
|
332
|
+
numberOfSlides: l,
|
|
328
333
|
prev: p,
|
|
329
334
|
next: f,
|
|
330
335
|
setActive: r
|
|
331
|
-
}), (
|
|
332
|
-
class:
|
|
336
|
+
}), (h, m) => (n(), c("div", {
|
|
337
|
+
class: b([e.bodyClass, "relative overflow-x-hidden"])
|
|
333
338
|
}, [
|
|
334
|
-
|
|
339
|
+
s["controller-top"] ? (n(), c("div", {
|
|
335
340
|
key: 0,
|
|
336
|
-
class:
|
|
341
|
+
class: b(e.controllerTopClass)
|
|
337
342
|
}, [
|
|
338
|
-
|
|
343
|
+
C(h.$slots, "controller-top", {
|
|
339
344
|
next: f,
|
|
340
345
|
prev: p,
|
|
341
346
|
setActive: r,
|
|
342
|
-
activeSlide:
|
|
343
|
-
numberOfSlides:
|
|
347
|
+
activeSlide: o.value,
|
|
348
|
+
numberOfSlides: l.value
|
|
344
349
|
}, void 0, !0)
|
|
345
|
-
], 2)) :
|
|
346
|
-
|
|
347
|
-
class:
|
|
350
|
+
], 2)) : v("", !0),
|
|
351
|
+
g("div", {
|
|
352
|
+
class: b(["grid grid-cols-1 grid-rows-1", e.contentContainerClass])
|
|
348
353
|
}, [
|
|
349
|
-
D(A, { name:
|
|
354
|
+
D(A, { name: i.value }, {
|
|
350
355
|
default: S(() => [
|
|
351
|
-
(
|
|
352
|
-
key:
|
|
356
|
+
(n(), c("div", {
|
|
357
|
+
key: o.value,
|
|
353
358
|
class: "col-start-1 col-end-1 row-start-1 row-end-1"
|
|
354
359
|
}, [
|
|
355
|
-
|
|
360
|
+
C(h.$slots, "content", {}, void 0, !0)
|
|
356
361
|
]))
|
|
357
362
|
]),
|
|
358
363
|
_: 3
|
|
359
364
|
}, 8, ["name"])
|
|
360
365
|
], 2),
|
|
361
|
-
|
|
366
|
+
s["controller-bottom"] ? (n(), c("div", {
|
|
362
367
|
key: 1,
|
|
363
|
-
class:
|
|
368
|
+
class: b(e.controllerBottomClass)
|
|
364
369
|
}, [
|
|
365
|
-
|
|
370
|
+
C(h.$slots, "controller-bottom", {
|
|
366
371
|
next: f,
|
|
367
372
|
prev: p,
|
|
368
373
|
setActive: r,
|
|
369
|
-
activeSlide:
|
|
370
|
-
numberOfSlides:
|
|
374
|
+
activeSlide: o.value,
|
|
375
|
+
numberOfSlides: l.value
|
|
371
376
|
}, void 0, !0)
|
|
372
|
-
], 2)) :
|
|
377
|
+
], 2)) : v("", !0)
|
|
373
378
|
], 2));
|
|
374
379
|
}
|
|
375
|
-
}),
|
|
380
|
+
}), H = (e, t) => {
|
|
376
381
|
const u = e.__vccOpts || e;
|
|
377
|
-
for (const [
|
|
378
|
-
u[
|
|
382
|
+
for (const [s, o] of t)
|
|
383
|
+
u[s] = o;
|
|
379
384
|
return u;
|
|
380
|
-
},
|
|
385
|
+
}, Ro = /* @__PURE__ */ H(Dt, [["__scopeId", "data-v-e9caba8a"]]), At = ["id"], Oo = /* @__PURE__ */ $({
|
|
381
386
|
__name: "CarouselContent",
|
|
382
387
|
props: {
|
|
383
388
|
slideNumber: {},
|
|
@@ -385,27 +390,27 @@ const Co = (e, t) => {
|
|
|
385
390
|
slideClass: { default: "" }
|
|
386
391
|
},
|
|
387
392
|
setup(e) {
|
|
388
|
-
const t = e, { activeIdx: u, setSlide:
|
|
389
|
-
|
|
393
|
+
const t = e, { activeIdx: u, setSlide: s } = Z(
|
|
394
|
+
ne
|
|
390
395
|
);
|
|
391
|
-
|
|
392
|
-
const
|
|
393
|
-
const { slideNumber:
|
|
394
|
-
return u.value ===
|
|
396
|
+
s(t.slideNumber);
|
|
397
|
+
const o = R(() => {
|
|
398
|
+
const { slideNumber: d } = t;
|
|
399
|
+
return u.value === d;
|
|
395
400
|
});
|
|
396
|
-
return (
|
|
401
|
+
return (d, l) => z((n(), c("div", {
|
|
397
402
|
ref: "slideRef",
|
|
398
403
|
id: e.id,
|
|
399
|
-
class:
|
|
404
|
+
class: b([e.slideClass, "w-full"]),
|
|
400
405
|
role: "tabpanel",
|
|
401
406
|
tabindex: "-1"
|
|
402
407
|
}, [
|
|
403
|
-
|
|
404
|
-
], 10,
|
|
405
|
-
[
|
|
408
|
+
C(d.$slots, "default")
|
|
409
|
+
], 10, At)), [
|
|
410
|
+
[ee, o.value]
|
|
406
411
|
]);
|
|
407
412
|
}
|
|
408
|
-
}),
|
|
413
|
+
}), St = ["id"], Et = /* @__PURE__ */ $({
|
|
409
414
|
__name: "Collapse",
|
|
410
415
|
props: {
|
|
411
416
|
id: {},
|
|
@@ -414,170 +419,173 @@ const Co = (e, t) => {
|
|
|
414
419
|
},
|
|
415
420
|
emits: ["open", "close"],
|
|
416
421
|
setup(e, { expose: t, emit: u }) {
|
|
417
|
-
const
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
), f = (
|
|
421
|
-
|
|
422
|
-
const
|
|
423
|
-
|
|
424
|
-
}, p = (
|
|
425
|
-
|
|
426
|
-
},
|
|
427
|
-
|
|
422
|
+
const s = e, o = u, d = s.id ?? te(), { isOpen: l, toggle: i, open: a, close: r } = Vt(
|
|
423
|
+
d,
|
|
424
|
+
gt(s, "visible")
|
|
425
|
+
), f = (m) => {
|
|
426
|
+
m.style.height = "auto", m.style.opacity = "0";
|
|
427
|
+
const L = getComputedStyle(m).height;
|
|
428
|
+
m.style.height = "0px", m.offsetHeight, m.style.height = L, m.style.opacity = "1";
|
|
429
|
+
}, p = (m) => {
|
|
430
|
+
m.style.height = "auto", m.style.opacity = "1";
|
|
431
|
+
}, h = (m) => {
|
|
432
|
+
m.style.height = getComputedStyle(m).height, m.offsetHeight, m.style.height = "0px", m.style.opacity = "0";
|
|
428
433
|
};
|
|
429
|
-
return E(
|
|
430
|
-
|
|
434
|
+
return E(l, (m) => {
|
|
435
|
+
m ? o("open", !0) : o("close", !1);
|
|
431
436
|
}), t({
|
|
432
|
-
isOpen:
|
|
433
|
-
toggle:
|
|
434
|
-
open:
|
|
437
|
+
isOpen: l,
|
|
438
|
+
toggle: i,
|
|
439
|
+
open: a,
|
|
435
440
|
close: r
|
|
436
|
-
}), (
|
|
441
|
+
}), (m, L) => (n(), c("div", { id: k(d) }, [
|
|
437
442
|
D(A, {
|
|
438
443
|
name: "collapse",
|
|
439
444
|
tag: "div",
|
|
440
445
|
onEnter: f,
|
|
441
446
|
onAfterEnter: p,
|
|
442
|
-
onLeave:
|
|
447
|
+
onLeave: h,
|
|
443
448
|
class: "overflow-y-clip"
|
|
444
449
|
}, {
|
|
445
450
|
default: S(() => [
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
class:
|
|
451
|
+
z(g("div", null, [
|
|
452
|
+
g("div", {
|
|
453
|
+
class: b(e.customClass)
|
|
449
454
|
}, [
|
|
450
|
-
|
|
455
|
+
C(m.$slots, "default", {}, void 0, !0)
|
|
451
456
|
], 2)
|
|
452
457
|
], 512), [
|
|
453
|
-
[
|
|
458
|
+
[ee, k(l)]
|
|
454
459
|
])
|
|
455
460
|
]),
|
|
456
461
|
_: 3
|
|
457
462
|
})
|
|
458
|
-
], 8,
|
|
463
|
+
], 8, St));
|
|
459
464
|
}
|
|
460
|
-
}),
|
|
465
|
+
}), $o = /* @__PURE__ */ H(Et, [["__scopeId", "data-v-7c910f65"]]), ie = /* @__PURE__ */ Symbol(), Lo = /* @__PURE__ */ $({
|
|
461
466
|
__name: "DropdownContainer",
|
|
462
467
|
emits: ["click-outside", "toggle"],
|
|
463
468
|
setup(e, { emit: t }) {
|
|
464
|
-
const u = t,
|
|
465
|
-
|
|
466
|
-
active:
|
|
467
|
-
buttonHeight:
|
|
469
|
+
const u = t, s = w(), o = w(!1), d = w(0);
|
|
470
|
+
Q(ie, {
|
|
471
|
+
active: o,
|
|
472
|
+
buttonHeight: d,
|
|
468
473
|
closeDropdown: () => {
|
|
469
|
-
|
|
474
|
+
o.value = !1;
|
|
470
475
|
}
|
|
471
476
|
});
|
|
472
|
-
const
|
|
473
|
-
|
|
474
|
-
},
|
|
475
|
-
|
|
477
|
+
const i = (f) => {
|
|
478
|
+
o.value = !o.value, u("toggle", f);
|
|
479
|
+
}, a = (f) => {
|
|
480
|
+
o.value = !1, u("click-outside", f);
|
|
476
481
|
}, r = () => {
|
|
477
|
-
|
|
482
|
+
o.value = !1;
|
|
478
483
|
};
|
|
479
484
|
return F(() => {
|
|
480
|
-
|
|
481
|
-
}), (f, p) =>
|
|
485
|
+
d.value = s.value.scrollHeight;
|
|
486
|
+
}), (f, p) => z((n(), c("div", {
|
|
482
487
|
class: "relative",
|
|
483
488
|
ref_key: "dropdownTarget",
|
|
484
|
-
ref:
|
|
485
|
-
onKeyup:
|
|
489
|
+
ref: s,
|
|
490
|
+
onKeyup: bt(r, ["esc"])
|
|
486
491
|
}, [
|
|
487
|
-
|
|
488
|
-
toggle:
|
|
489
|
-
dropdownState:
|
|
492
|
+
C(f.$slots, "toggler", {
|
|
493
|
+
toggle: i,
|
|
494
|
+
dropdownState: o.value
|
|
490
495
|
}),
|
|
491
|
-
|
|
496
|
+
C(f.$slots, "default")
|
|
492
497
|
], 32)), [
|
|
493
|
-
[k(
|
|
498
|
+
[k(oe), a]
|
|
494
499
|
]);
|
|
495
500
|
}
|
|
496
|
-
}),
|
|
501
|
+
}), Ht = /* @__PURE__ */ $({
|
|
497
502
|
__name: "DropdownContent",
|
|
498
503
|
props: {
|
|
499
504
|
customClass: { default: "" }
|
|
500
505
|
},
|
|
501
506
|
setup(e) {
|
|
502
|
-
const { height: t } =
|
|
503
|
-
|
|
504
|
-
),
|
|
505
|
-
if (!(!
|
|
507
|
+
const { height: t } = yt(), u = w(), { active: s, buttonHeight: o, closeDropdown: d } = Z(
|
|
508
|
+
ie
|
|
509
|
+
), l = R(() => ({ "--button-height": `${o}px` })), i = R(() => {
|
|
510
|
+
if (!(!s || !u.value) && t.value - u.value.getBoundingClientRect().bottom < 0)
|
|
506
511
|
return "dropup-bottom";
|
|
507
512
|
});
|
|
508
|
-
return (
|
|
513
|
+
return (a, r) => (n(), P(A, { name: "dropdown-content" }, {
|
|
509
514
|
default: S(() => [
|
|
510
|
-
k(
|
|
515
|
+
k(s) ? (n(), c("div", {
|
|
511
516
|
key: 0,
|
|
512
517
|
ref_key: "contentRef",
|
|
513
518
|
ref: u,
|
|
514
|
-
class:
|
|
515
|
-
style: W(
|
|
519
|
+
class: b(["absolute my-2xs w-max max-w-[14rem] overflow-hidden", [i.value, e.customClass]]),
|
|
520
|
+
style: W(l.value)
|
|
516
521
|
}, [
|
|
517
|
-
|
|
518
|
-
], 6)) :
|
|
522
|
+
C(a.$slots, "default", { itemClick: k(d) }, void 0, !0)
|
|
523
|
+
], 6)) : v("", !0)
|
|
519
524
|
]),
|
|
520
525
|
_: 3
|
|
521
526
|
}));
|
|
522
527
|
}
|
|
523
|
-
}),
|
|
528
|
+
}), Io = /* @__PURE__ */ H(Ht, [["__scopeId", "data-v-dd0b7b7b"]]), Nt = ["aria-label", "aria-expanded"], Gt = /* @__PURE__ */ $({
|
|
524
529
|
__name: "NavDrawer",
|
|
525
530
|
props: {
|
|
526
531
|
color: { default: "dark-2" },
|
|
527
532
|
showBorder: { type: Boolean, default: !0 },
|
|
528
533
|
toggle: { type: Boolean },
|
|
529
|
-
bgColor: {}
|
|
534
|
+
bgColor: {},
|
|
535
|
+
label: { default: "Menu" }
|
|
530
536
|
},
|
|
531
537
|
emits: ["hbg-click"],
|
|
532
538
|
setup(e, { emit: t }) {
|
|
533
|
-
const u = e,
|
|
534
|
-
|
|
535
|
-
},
|
|
539
|
+
const u = e, s = t, o = (a) => {
|
|
540
|
+
s("hbg-click", a);
|
|
541
|
+
}, d = R({
|
|
536
542
|
get() {
|
|
537
543
|
return u.toggle;
|
|
538
544
|
},
|
|
539
|
-
set(
|
|
540
|
-
return
|
|
545
|
+
set(a) {
|
|
546
|
+
return a;
|
|
541
547
|
}
|
|
542
|
-
}),
|
|
548
|
+
}), l = (a, r, f) => {
|
|
543
549
|
const p = [
|
|
544
|
-
|
|
545
|
-
|
|
550
|
+
y.ringColorVariant({ color: a }),
|
|
551
|
+
y.ringOffsetColorVariant({ color: f })
|
|
546
552
|
];
|
|
547
|
-
return r && (p.push(
|
|
548
|
-
},
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
553
|
+
return r && (p.push(y.borderColorVariant({ color: a })), p.push("border")), p.join(" ");
|
|
554
|
+
}, i = (a) => [
|
|
555
|
+
y.bgColorVariant({ color: a }),
|
|
556
|
+
y.beforeBgColorVariant({ color: a }),
|
|
557
|
+
y.afterBgColorVariant({ color: a })
|
|
552
558
|
].join(" ");
|
|
553
|
-
return (
|
|
554
|
-
class:
|
|
555
|
-
onClick:
|
|
556
|
-
"aria-label": e.
|
|
559
|
+
return (a, r) => (n(), c("button", {
|
|
560
|
+
class: b(["hamburger__button aspect-square rounded-md p-3xs ring-offset-2 transition-all duration-300 ease-linear outline-none hover:opacity-70 focus:opacity-70 focus:ring-4", l(e.color, e.showBorder, e.bgColor)]),
|
|
561
|
+
onClick: o,
|
|
562
|
+
"aria-label": e.label,
|
|
557
563
|
"aria-expanded": e.toggle
|
|
558
564
|
}, [
|
|
559
|
-
|
|
565
|
+
z(g("input", {
|
|
560
566
|
type: "checkbox",
|
|
561
|
-
"onUpdate:modelValue": r[0] || (r[0] = (f) =>
|
|
567
|
+
"onUpdate:modelValue": r[0] || (r[0] = (f) => d.value = f),
|
|
562
568
|
class: "hamburger__checkbox hidden"
|
|
563
569
|
}, null, 512), [
|
|
564
|
-
[
|
|
570
|
+
[mt, d.value]
|
|
565
571
|
]),
|
|
566
|
-
|
|
567
|
-
class:
|
|
572
|
+
g("div", {
|
|
573
|
+
class: b(["hamburger__icon relative h-[3px] w-sm transition-all duration-300 ease-linear before:h-[3px] before:w-sm after:h-[3px] after:w-sm", i(e.color)])
|
|
568
574
|
}, null, 2)
|
|
569
|
-
], 10,
|
|
575
|
+
], 10, Nt));
|
|
570
576
|
}
|
|
571
|
-
}),
|
|
577
|
+
}), J = /* @__PURE__ */ H(Gt, [["__scopeId", "data-v-5904b04a"]]), zt = ["aria-label"], Mt = { class: "min-h-[24px]" }, jt = { class: "ml-auto" }, Wt = {
|
|
572
578
|
key: 0,
|
|
573
579
|
class: "hidden lg:block"
|
|
574
|
-
},
|
|
580
|
+
}, _t = { class: "overflow-hidden lg:hidden" }, Ft = {
|
|
575
581
|
key: 0,
|
|
576
582
|
class: "overflow-hidden"
|
|
577
|
-
},
|
|
583
|
+
}, Pt = { key: 0 }, Xt = /* @__PURE__ */ $({
|
|
578
584
|
__name: "HeaderHorizontal",
|
|
579
585
|
props: {
|
|
580
586
|
bgColor: { default: "light-1" },
|
|
587
|
+
navLabel: { default: "Main" },
|
|
588
|
+
menuLabel: { default: "Menu" },
|
|
581
589
|
mobileMenuBgColor: { default: "light-2" },
|
|
582
590
|
drawerBtnColor: { default: "dark-1" },
|
|
583
591
|
showDrawerBorder: { type: Boolean, default: !0 },
|
|
@@ -587,176 +595,187 @@ const Co = (e, t) => {
|
|
|
587
595
|
},
|
|
588
596
|
emits: ["toggle-drawer"],
|
|
589
597
|
setup(e, { expose: t, emit: u }) {
|
|
590
|
-
const
|
|
591
|
-
|
|
598
|
+
const s = e, o = M(), d = w(!1), { y: l } = Ct(), i = u, a = () => {
|
|
599
|
+
d.value = !1;
|
|
592
600
|
}, r = (x) => {
|
|
593
|
-
|
|
601
|
+
d.value = !d.value, i("toggle-drawer", x, d.value);
|
|
594
602
|
}, f = (x) => {
|
|
595
603
|
x.style.height = "auto";
|
|
596
|
-
const
|
|
597
|
-
x.style.height = "0px", x.offsetHeight, x.style.height =
|
|
604
|
+
const I = getComputedStyle(x).height;
|
|
605
|
+
x.style.height = "0px", x.offsetHeight, x.style.height = I;
|
|
598
606
|
}, p = (x) => {
|
|
599
607
|
x.style.height = "auto";
|
|
600
|
-
},
|
|
608
|
+
}, h = (x) => {
|
|
601
609
|
x.style.height = getComputedStyle(x).height, x.offsetHeight, x.style.height = "0px";
|
|
602
|
-
},
|
|
603
|
-
const { bgColor: x, sticky:
|
|
604
|
-
|
|
610
|
+
}, m = R(() => {
|
|
611
|
+
const { bgColor: x, sticky: I } = s, V = [
|
|
612
|
+
y.bgColorVariant({ color: x })
|
|
605
613
|
];
|
|
606
|
-
return
|
|
607
|
-
}),
|
|
608
|
-
const { fadeInOnScroll: x, scrollDistance:
|
|
609
|
-
return x ?
|
|
614
|
+
return I === "all" ? (V.push("sticky top-0"), V.join(" ")) : I === "tablet" ? (V.push("md:sticky top-0"), V.join(" ")) : (I === "pc" && V.push("lg:sticky top-0"), V.join(" "));
|
|
615
|
+
}), L = R(() => {
|
|
616
|
+
const { fadeInOnScroll: x, scrollDistance: I } = s;
|
|
617
|
+
return x ? l.value >= I ? "lg:shadow-md bg-opacity-70" : "bg-opacity-100" : "";
|
|
610
618
|
});
|
|
611
619
|
return t({
|
|
612
|
-
headerClose:
|
|
613
|
-
}), (x,
|
|
614
|
-
class:
|
|
620
|
+
headerClose: a
|
|
621
|
+
}), (x, I) => (n(), c("header", {
|
|
622
|
+
class: b(["z-50 w-full items-center transition delay-150 duration-500 ease-in", [L.value, m.value]])
|
|
615
623
|
}, [
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
624
|
+
g("nav", {
|
|
625
|
+
"aria-label": e.navLabel,
|
|
626
|
+
class: "mx-xs flex flex-wrap items-center justify-between py-xs align-middle sm:max-w-[640px] md:mx-sm md:max-w-[768px] md:py-2xs lg:max-w-[1024px] xl:max-w-[1280px] 2xl:max-w-[1536px]"
|
|
627
|
+
}, [
|
|
628
|
+
g("div", Mt, [
|
|
629
|
+
C(x.$slots, "content", {}, void 0, !0)
|
|
619
630
|
]),
|
|
620
|
-
|
|
621
|
-
D(
|
|
631
|
+
g("div", jt, [
|
|
632
|
+
D(J, {
|
|
633
|
+
label: e.menuLabel,
|
|
622
634
|
color: e.drawerBtnColor,
|
|
623
635
|
"show-border": e.showDrawerBorder,
|
|
624
636
|
class: "block lg:hidden",
|
|
625
637
|
onHbgClick: r,
|
|
626
|
-
toggle:
|
|
638
|
+
toggle: d.value,
|
|
627
639
|
"bg-color": e.bgColor
|
|
628
|
-
}, null, 8, ["color", "show-border", "toggle", "bg-color"]),
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
])) :
|
|
640
|
+
}, null, 8, ["label", "color", "show-border", "toggle", "bg-color"]),
|
|
641
|
+
o["content-right"] ? (n(), c("div", Wt, [
|
|
642
|
+
C(x.$slots, "content-right", {}, void 0, !0)
|
|
643
|
+
])) : v("", !0)
|
|
632
644
|
])
|
|
633
|
-
]),
|
|
634
|
-
|
|
645
|
+
], 8, zt),
|
|
646
|
+
g("div", _t, [
|
|
635
647
|
D(A, {
|
|
636
648
|
name: "collapse",
|
|
637
649
|
onEnter: f,
|
|
638
650
|
onAfterEnter: p,
|
|
639
|
-
onLeave:
|
|
651
|
+
onLeave: h
|
|
640
652
|
}, {
|
|
641
653
|
default: S(() => [
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
class:
|
|
654
|
+
d.value ? (n(), c("div", Ft, [
|
|
655
|
+
g("div", {
|
|
656
|
+
class: b(["mx-xs my-2xs overflow-hidden rounded-md bg-opacity-80", k(y).bgColorVariant({ color: e.mobileMenuBgColor })])
|
|
645
657
|
}, [
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
])) :
|
|
658
|
+
o["mobile-content"] ? (n(), c("div", Pt, [
|
|
659
|
+
C(x.$slots, "mobile-content", { headerClose: a }, void 0, !0)
|
|
660
|
+
])) : v("", !0)
|
|
649
661
|
], 2)
|
|
650
|
-
])) :
|
|
662
|
+
])) : v("", !0)
|
|
651
663
|
]),
|
|
652
664
|
_: 3
|
|
653
665
|
})
|
|
654
666
|
])
|
|
655
667
|
], 2));
|
|
656
668
|
}
|
|
657
|
-
}),
|
|
669
|
+
}), To = /* @__PURE__ */ H(Xt, [["__scopeId", "data-v-fb1e97dd"]]), Yt = ["aria-label"], Ut = { class: "flex h-full flex-col justify-between" }, Kt = { key: 0 }, qt = {
|
|
658
670
|
key: 0,
|
|
659
671
|
class: "fixed top-0 right-0 z-50 mt-xs mr-xs block lg:hidden"
|
|
660
|
-
},
|
|
672
|
+
}, Jt = { class: "relative z-40 block lg:hidden" }, Qt = {
|
|
661
673
|
key: 0,
|
|
662
674
|
class: "fixed top-0 right-0 z-50 mt-xs mr-xs block lg:hidden"
|
|
663
|
-
},
|
|
675
|
+
}, Zt = ["aria-label"], eo = {
|
|
664
676
|
key: 0,
|
|
665
677
|
class: "h-full"
|
|
666
|
-
},
|
|
678
|
+
}, to = /* @__PURE__ */ $({
|
|
667
679
|
__name: "HeaderVertical",
|
|
668
680
|
props: {
|
|
669
681
|
bgColor: { default: "light-1" },
|
|
682
|
+
navLabel: { default: "Main" },
|
|
683
|
+
menuLabel: { default: "Menu" },
|
|
670
684
|
drawerBtnColor: { default: "dark-1" },
|
|
671
685
|
showDrawerBorder: { type: Boolean, default: !0 },
|
|
672
686
|
headerWidth: { default: 160 }
|
|
673
687
|
},
|
|
674
688
|
emits: ["toggle-drawer"],
|
|
675
689
|
setup(e, { expose: t, emit: u }) {
|
|
676
|
-
const
|
|
677
|
-
|
|
690
|
+
const s = e, o = M(), d = u, l = w(!1), i = w(!1), a = (p) => {
|
|
691
|
+
l.value = !l.value, d("toggle-drawer", p, l.value);
|
|
678
692
|
}, r = () => {
|
|
679
|
-
|
|
680
|
-
}, f =
|
|
693
|
+
l.value = !1;
|
|
694
|
+
}, f = R(() => ({ "--header-width": `${s.headerWidth}px` }));
|
|
681
695
|
return F(() => {
|
|
682
|
-
|
|
683
|
-
const p =
|
|
684
|
-
E(
|
|
685
|
-
p.value =
|
|
696
|
+
i.value = !0;
|
|
697
|
+
const p = wt(document);
|
|
698
|
+
E(l, (h) => {
|
|
699
|
+
p.value = h;
|
|
686
700
|
});
|
|
687
701
|
}), t({
|
|
688
702
|
headerClose: r
|
|
689
|
-
}), (p,
|
|
703
|
+
}), (p, h) => (n(), c("header", {
|
|
690
704
|
class: "relative",
|
|
691
705
|
style: W(f.value)
|
|
692
706
|
}, [
|
|
693
|
-
|
|
694
|
-
|
|
707
|
+
g("nav", {
|
|
708
|
+
"aria-label": e.navLabel,
|
|
709
|
+
class: b(["header-desktop hidden overflow-y-scroll overscroll-contain py-sm lg:sticky lg:top-0 lg:left-0 lg:block lg:h-[100vh]", [k(y).bgColorVariant({ color: e.bgColor })]])
|
|
695
710
|
}, [
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
711
|
+
g("div", Ut, [
|
|
712
|
+
g("div", null, [
|
|
713
|
+
C(p.$slots, "content", {}, void 0, !0)
|
|
699
714
|
]),
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
])) :
|
|
715
|
+
o["content-bottom"] ? (n(), c("div", Kt, [
|
|
716
|
+
C(p.$slots, "content-bottom", {}, void 0, !0)
|
|
717
|
+
])) : v("", !0)
|
|
703
718
|
])
|
|
704
|
-
],
|
|
705
|
-
|
|
706
|
-
D(
|
|
719
|
+
], 10, Yt),
|
|
720
|
+
o["mobile-content"] && !i.value ? (n(), c("div", qt, [
|
|
721
|
+
D(J, {
|
|
722
|
+
label: e.menuLabel,
|
|
707
723
|
color: e.drawerBtnColor,
|
|
708
724
|
"show-border": e.showDrawerBorder,
|
|
709
725
|
class: "relative block lg:hidden",
|
|
710
|
-
onHbgClick:
|
|
711
|
-
toggle:
|
|
726
|
+
onHbgClick: a,
|
|
727
|
+
toggle: l.value,
|
|
712
728
|
"bg-color": e.bgColor
|
|
713
|
-
}, null, 8, ["color", "show-border", "toggle", "bg-color"])
|
|
714
|
-
])) :
|
|
715
|
-
|
|
729
|
+
}, null, 8, ["label", "color", "show-border", "toggle", "bg-color"])
|
|
730
|
+
])) : v("", !0),
|
|
731
|
+
i.value ? (n(), P(pt, {
|
|
716
732
|
key: 1,
|
|
717
733
|
to: "body"
|
|
718
734
|
}, [
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
D(
|
|
735
|
+
g("div", Jt, [
|
|
736
|
+
o["mobile-content"] ? (n(), c("div", Qt, [
|
|
737
|
+
D(J, {
|
|
738
|
+
label: e.menuLabel,
|
|
722
739
|
color: e.drawerBtnColor,
|
|
723
740
|
"show-border": e.showDrawerBorder,
|
|
724
741
|
class: "relative block lg:hidden",
|
|
725
|
-
onHbgClick:
|
|
726
|
-
toggle:
|
|
742
|
+
onHbgClick: a,
|
|
743
|
+
toggle: l.value,
|
|
727
744
|
"bg-color": e.bgColor
|
|
728
|
-
}, null, 8, ["color", "show-border", "toggle", "bg-color"])
|
|
729
|
-
])) :
|
|
745
|
+
}, null, 8, ["label", "color", "show-border", "toggle", "bg-color"])
|
|
746
|
+
])) : v("", !0),
|
|
730
747
|
D(A, {
|
|
731
748
|
name: "slide-down",
|
|
732
749
|
appear: ""
|
|
733
750
|
}, {
|
|
734
751
|
default: S(() => [
|
|
735
|
-
|
|
752
|
+
l.value ? (n(), c("nav", {
|
|
736
753
|
key: 0,
|
|
737
|
-
|
|
754
|
+
"aria-label": e.navLabel,
|
|
755
|
+
class: b(["fixed inset-0 overflow-y-scroll overscroll-contain px-sm py-lg", k(y).bgColorVariant({ color: e.bgColor })])
|
|
738
756
|
}, [
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
])) :
|
|
742
|
-
],
|
|
757
|
+
o["mobile-content"] ? (n(), c("div", eo, [
|
|
758
|
+
C(p.$slots, "mobile-content", { headerClose: r }, void 0, !0)
|
|
759
|
+
])) : v("", !0)
|
|
760
|
+
], 10, Zt)) : v("", !0)
|
|
743
761
|
]),
|
|
744
762
|
_: 3
|
|
745
763
|
})
|
|
746
764
|
])
|
|
747
|
-
])) :
|
|
765
|
+
])) : v("", !0)
|
|
748
766
|
], 4));
|
|
749
767
|
}
|
|
750
|
-
}),
|
|
768
|
+
}), Do = /* @__PURE__ */ H(to, [["__scopeId", "data-v-a2d7d11b"]]), oo = ["visible"], ao = {
|
|
751
769
|
key: 0,
|
|
752
770
|
class: "sticky top-0"
|
|
753
|
-
},
|
|
771
|
+
}, lo = ["id"], so = {
|
|
754
772
|
key: 1,
|
|
755
773
|
class: "sticky bottom-0"
|
|
756
|
-
},
|
|
774
|
+
}, ro = /* @__PURE__ */ $({
|
|
757
775
|
__name: "Modal",
|
|
758
776
|
props: {
|
|
759
777
|
title: {},
|
|
778
|
+
ariaLabel: {},
|
|
760
779
|
titleColor: { default: "dark-3" },
|
|
761
780
|
customClass: { default: "" },
|
|
762
781
|
visible: { type: Boolean, default: !1 },
|
|
@@ -769,155 +788,163 @@ const Co = (e, t) => {
|
|
|
769
788
|
},
|
|
770
789
|
emits: ["open", "close"],
|
|
771
790
|
setup(e, { expose: t, emit: u }) {
|
|
772
|
-
const
|
|
773
|
-
let
|
|
774
|
-
const { activate:
|
|
775
|
-
|
|
791
|
+
const s = e, o = M(), d = u, l = w(), i = w(), a = w(s.visible), r = w(!1), f = te(), p = () => s.showHeader && (o.header ? !s.ariaLabel : !!s.title) ? { "aria-labelledby": f } : { "aria-label": s.ariaLabel };
|
|
792
|
+
let h = null;
|
|
793
|
+
const { activate: m, deactivate: L } = re(
|
|
794
|
+
i,
|
|
776
795
|
// Trap Tab focus only. Without allowOutsideClick the trap cancels every
|
|
777
796
|
// click outside the dialog, including the backdrop's own @click (#104).
|
|
778
|
-
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
797
|
+
// Escape closes the dialog; closing releases the trap and restores focus.
|
|
798
|
+
// Letting the trap handle Escape itself left the dialog open, untrapped (#110).
|
|
799
|
+
{
|
|
800
|
+
immediate: !1,
|
|
801
|
+
allowOutsideClick: !0,
|
|
802
|
+
escapeDeactivates: () => (V(), !1)
|
|
803
|
+
}
|
|
804
|
+
), x = () => {
|
|
805
|
+
a.value = !a.value;
|
|
806
|
+
}, I = () => {
|
|
807
|
+
a.value = !0;
|
|
783
808
|
}, V = () => {
|
|
784
|
-
r.value === !0 && (
|
|
809
|
+
r.value === !0 && (a.value = !1);
|
|
810
|
+
}, X = () => {
|
|
811
|
+
d("open", !0);
|
|
785
812
|
}, T = () => {
|
|
786
|
-
|
|
787
|
-
},
|
|
788
|
-
|
|
789
|
-
}, P = B(() => {
|
|
790
|
-
const R = {
|
|
813
|
+
d("close", !1);
|
|
814
|
+
}, Y = R(() => {
|
|
815
|
+
const B = {
|
|
791
816
|
top: 25,
|
|
792
817
|
center: 50,
|
|
793
818
|
bottom: 75
|
|
794
|
-
}, { placement:
|
|
795
|
-
return { "--vertical-placement": (
|
|
796
|
-
}),
|
|
797
|
-
const { width:
|
|
819
|
+
}, { placement: N } = s;
|
|
820
|
+
return { "--vertical-placement": (B[N] ?? B.center) + "%" };
|
|
821
|
+
}), U = R(() => {
|
|
822
|
+
const { width: B } = s, N = {
|
|
798
823
|
small: "max-w-[28rem]",
|
|
799
824
|
medium: "max-w-[28rem] md:max-w-[36rem]",
|
|
800
825
|
large: "max-w-[28rem] md:max-w-[56rem]"
|
|
801
826
|
};
|
|
802
|
-
return
|
|
803
|
-
}),
|
|
804
|
-
r.value = !0,
|
|
805
|
-
},
|
|
827
|
+
return N[B] ?? N.small;
|
|
828
|
+
}), _ = () => {
|
|
829
|
+
r.value = !0, i.value && m();
|
|
830
|
+
}, K = () => {
|
|
806
831
|
r.value = !1;
|
|
807
832
|
};
|
|
808
833
|
return F(() => {
|
|
809
|
-
|
|
810
|
-
}),
|
|
811
|
-
|
|
834
|
+
a.value && !r.value && _();
|
|
835
|
+
}), le(l, (B = !1) => {
|
|
836
|
+
a.value = B;
|
|
812
837
|
}), E(
|
|
813
|
-
() =>
|
|
814
|
-
(
|
|
815
|
-
|
|
838
|
+
() => s.visible,
|
|
839
|
+
(B) => {
|
|
840
|
+
a.value = B;
|
|
816
841
|
}
|
|
817
|
-
), E(
|
|
818
|
-
|
|
819
|
-
}),
|
|
820
|
-
toggle:
|
|
842
|
+
), E(a, (B) => {
|
|
843
|
+
B === !0 ? (typeof document < "u" && (h = document.activeElement), X()) : B === !1 && (L(), h?.focus(), h = null, r.value === !0 && T());
|
|
844
|
+
}), se(a), t({
|
|
845
|
+
toggle: x,
|
|
821
846
|
close: V,
|
|
822
|
-
open:
|
|
823
|
-
}), (
|
|
824
|
-
style: W(
|
|
825
|
-
visible:
|
|
847
|
+
open: I
|
|
848
|
+
}), (B, N) => (n(), c("div", {
|
|
849
|
+
style: W(Y.value),
|
|
850
|
+
visible: a.value,
|
|
826
851
|
ref_key: "modalRef",
|
|
827
|
-
ref:
|
|
852
|
+
ref: l
|
|
828
853
|
}, [
|
|
829
|
-
e.showBackdrop ? (
|
|
854
|
+
e.showBackdrop ? (n(), P(A, {
|
|
830
855
|
key: 0,
|
|
831
856
|
name: "fade",
|
|
832
857
|
appear: "",
|
|
833
858
|
tag: "div"
|
|
834
859
|
}, {
|
|
835
860
|
default: S(() => [
|
|
836
|
-
|
|
861
|
+
a.value ? (n(), c("section", {
|
|
837
862
|
key: 0,
|
|
838
863
|
onClick: V,
|
|
839
864
|
"aria-hidden": "true",
|
|
840
|
-
class:
|
|
841
|
-
}, null, 2)) :
|
|
865
|
+
class: b(["fixed inset-0 z-[100] overflow-y-auto backdrop-blur bg-opacity-70", k(y).bgColorVariant({ color: e.backdropColor })])
|
|
866
|
+
}, null, 2)) : v("", !0)
|
|
842
867
|
]),
|
|
843
868
|
_: 1
|
|
844
|
-
})) :
|
|
869
|
+
})) : v("", !0),
|
|
845
870
|
D(A, {
|
|
846
871
|
name: "slide-down",
|
|
847
872
|
tag: "div",
|
|
848
|
-
onAfterEnter:
|
|
849
|
-
onAfterLeave:
|
|
873
|
+
onAfterEnter: _,
|
|
874
|
+
onAfterLeave: K,
|
|
850
875
|
appear: ""
|
|
851
876
|
}, {
|
|
852
877
|
default: S(() => [
|
|
853
|
-
|
|
878
|
+
a.value ? (n(), c("div", {
|
|
854
879
|
key: 0,
|
|
855
|
-
class:
|
|
880
|
+
class: b(["vertical-placement fixed z-[110] w-full px-xs", U.value])
|
|
856
881
|
}, [
|
|
857
|
-
|
|
882
|
+
z((n(), c("div", ae({
|
|
858
883
|
ref_key: "dialogRef",
|
|
859
|
-
ref:
|
|
884
|
+
ref: i,
|
|
860
885
|
role: "dialog",
|
|
861
|
-
"aria-modal": "true"
|
|
862
|
-
|
|
863
|
-
class:
|
|
864
|
-
}, [
|
|
865
|
-
e.showHeader ? (
|
|
866
|
-
|
|
886
|
+
"aria-modal": "true"
|
|
887
|
+
}, p(), {
|
|
888
|
+
class: [[k(y).bgColorVariant({ color: e.color }), e.customClass], "relative max-h-[80vh] overflow-y-scroll overscroll-contain md:max-h-[60vh]"]
|
|
889
|
+
}), [
|
|
890
|
+
e.showHeader ? (n(), c("div", ao, [
|
|
891
|
+
C(B.$slots, "header", {
|
|
867
892
|
close: V,
|
|
868
|
-
status:
|
|
893
|
+
status: a.value,
|
|
894
|
+
titleId: k(f)
|
|
869
895
|
}, () => [
|
|
870
|
-
|
|
871
|
-
class:
|
|
896
|
+
g("div", {
|
|
897
|
+
class: b(["flex items-center justify-between border-b-2 border-b-light-4 p-xs", k(y).bgColorVariant({ color: e.color })])
|
|
872
898
|
}, [
|
|
873
|
-
e.title ? (
|
|
899
|
+
e.title ? (n(), c("h3", {
|
|
874
900
|
key: 0,
|
|
875
901
|
id: k(f),
|
|
876
|
-
class:
|
|
877
|
-
}, j(e.title), 11,
|
|
878
|
-
|
|
902
|
+
class: b(["h3-md", k(y).textColorVariant({ color: e.titleColor })])
|
|
903
|
+
}, j(e.title), 11, lo)) : v("", !0),
|
|
904
|
+
g("button", {
|
|
879
905
|
type: "button",
|
|
880
906
|
"aria-label": "Close",
|
|
881
907
|
onClick: V
|
|
882
908
|
}, [
|
|
883
|
-
(
|
|
909
|
+
(n(), c("svg", {
|
|
884
910
|
xmlns: "http://www.w3.org/2000/svg",
|
|
885
911
|
height: "1em",
|
|
886
912
|
viewBox: "0 0 384 512",
|
|
887
913
|
"aria-hidden": "true",
|
|
888
|
-
class:
|
|
889
|
-
k(
|
|
914
|
+
class: b(["h-sm transition-opacity duration-300 ease-in hover:opacity-75 focus:opacity-75", [
|
|
915
|
+
k(y).svgFillColorVariant({ color: e.titleColor })
|
|
890
916
|
]])
|
|
891
|
-
}, [...
|
|
892
|
-
|
|
917
|
+
}, [...N[0] || (N[0] = [
|
|
918
|
+
g("path", { d: "M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z" }, null, -1)
|
|
893
919
|
])], 2))
|
|
894
920
|
])
|
|
895
921
|
], 2)
|
|
896
922
|
], !0)
|
|
897
|
-
])) :
|
|
898
|
-
|
|
923
|
+
])) : v("", !0),
|
|
924
|
+
C(B.$slots, "body", {
|
|
899
925
|
close: V,
|
|
900
|
-
status:
|
|
926
|
+
status: a.value
|
|
901
927
|
}, void 0, !0),
|
|
902
|
-
|
|
903
|
-
|
|
928
|
+
o.footer ? (n(), c("div", so, [
|
|
929
|
+
C(B.$slots, "footer", {
|
|
904
930
|
close: V,
|
|
905
|
-
status:
|
|
931
|
+
status: a.value
|
|
906
932
|
}, void 0, !0)
|
|
907
|
-
])) :
|
|
908
|
-
],
|
|
909
|
-
[k(
|
|
933
|
+
])) : v("", !0)
|
|
934
|
+
], 16)), [
|
|
935
|
+
[k(oe), V]
|
|
910
936
|
])
|
|
911
|
-
], 2)) :
|
|
937
|
+
], 2)) : v("", !0)
|
|
912
938
|
]),
|
|
913
939
|
_: 3
|
|
914
940
|
})
|
|
915
|
-
], 12,
|
|
941
|
+
], 12, oo));
|
|
916
942
|
}
|
|
917
|
-
}),
|
|
943
|
+
}), Ao = /* @__PURE__ */ H(ro, [["__scopeId", "data-v-9730e4f1"]]), no = ["visible"], io = ["id"], co = { class: "sidebar-body-height" }, uo = /* @__PURE__ */ $({
|
|
918
944
|
__name: "Sidebar",
|
|
919
945
|
props: {
|
|
920
946
|
title: {},
|
|
947
|
+
ariaLabel: {},
|
|
921
948
|
titleColor: { default: "dark-3" },
|
|
922
949
|
customClass: { default: "" },
|
|
923
950
|
visible: { type: Boolean, default: !1 },
|
|
@@ -930,175 +957,182 @@ const Co = (e, t) => {
|
|
|
930
957
|
},
|
|
931
958
|
emits: ["open", "close"],
|
|
932
959
|
setup(e, { expose: t, emit: u }) {
|
|
933
|
-
const
|
|
934
|
-
let
|
|
935
|
-
const { activate:
|
|
960
|
+
const s = e, o = M(), d = u, l = w(s.visible), i = w(!1), a = w(), r = w(), f = w(), p = w(), h = te(), m = () => s.showHeader && (o.header ? !s.ariaLabel : !!s.title) ? { "aria-labelledby": h } : { "aria-label": s.ariaLabel };
|
|
961
|
+
let L = null;
|
|
962
|
+
const { activate: x, deactivate: I } = re(
|
|
936
963
|
r,
|
|
937
964
|
// Trap Tab focus only. Without allowOutsideClick the trap cancels every
|
|
938
965
|
// click outside the dialog, including the backdrop's own @click (#104).
|
|
939
|
-
|
|
966
|
+
// Escape closes the dialog; closing releases the trap and restores focus.
|
|
967
|
+
// Letting the trap handle Escape itself left the dialog open, untrapped (#110).
|
|
968
|
+
{
|
|
969
|
+
immediate: !1,
|
|
970
|
+
allowOutsideClick: !0,
|
|
971
|
+
escapeDeactivates: () => (T(), !1)
|
|
972
|
+
}
|
|
940
973
|
), V = () => {
|
|
941
|
-
|
|
974
|
+
l.value = !l.value;
|
|
975
|
+
}, X = () => {
|
|
976
|
+
l.value = !0;
|
|
942
977
|
}, T = () => {
|
|
943
|
-
|
|
944
|
-
}, L = () => {
|
|
945
|
-
n.value === !0 && (s.value = !1);
|
|
946
|
-
}, P = () => {
|
|
947
|
-
c("open", !0);
|
|
978
|
+
i.value === !0 && (l.value = !1);
|
|
948
979
|
}, Y = () => {
|
|
949
|
-
|
|
950
|
-
},
|
|
951
|
-
|
|
980
|
+
d("open", !0);
|
|
981
|
+
}, U = () => {
|
|
982
|
+
d("close", !1);
|
|
983
|
+
}, _ = R(() => {
|
|
984
|
+
const O = (G) => G && l.value ? `${G.scrollHeight}px` : "0px";
|
|
952
985
|
return {
|
|
953
|
-
"--sidebar-width": `${
|
|
954
|
-
"--header-height":
|
|
955
|
-
"--footer-height":
|
|
986
|
+
"--sidebar-width": `${s.width}px`,
|
|
987
|
+
"--header-height": O(f.value),
|
|
988
|
+
"--footer-height": O(p.value)
|
|
956
989
|
};
|
|
957
|
-
}),
|
|
958
|
-
|
|
959
|
-
},
|
|
960
|
-
|
|
990
|
+
}), K = R(() => s.placement === "left" ? "sidebar-left" : "sidebar-right"), q = () => {
|
|
991
|
+
i.value = !0, r.value && x();
|
|
992
|
+
}, B = () => {
|
|
993
|
+
i.value = !1;
|
|
961
994
|
};
|
|
962
995
|
return F(() => {
|
|
963
|
-
|
|
964
|
-
}),
|
|
965
|
-
|
|
996
|
+
l.value && !i.value && q();
|
|
997
|
+
}), le(a, (O = !1) => {
|
|
998
|
+
l.value = O;
|
|
966
999
|
}), E(
|
|
967
|
-
() =>
|
|
968
|
-
(
|
|
969
|
-
|
|
1000
|
+
() => s.visible,
|
|
1001
|
+
(O) => {
|
|
1002
|
+
l.value = O;
|
|
970
1003
|
}
|
|
971
|
-
), E(
|
|
972
|
-
|
|
973
|
-
}),
|
|
1004
|
+
), E(l, (O) => {
|
|
1005
|
+
O === !0 ? (typeof document < "u" && (L = document.activeElement), Y()) : O === !1 && (I(), L?.focus(), L = null, i.value === !0 && U());
|
|
1006
|
+
}), se(l), t({
|
|
974
1007
|
toggle: V,
|
|
975
|
-
open:
|
|
976
|
-
close:
|
|
977
|
-
}), (
|
|
978
|
-
style: W(
|
|
979
|
-
visible:
|
|
1008
|
+
open: X,
|
|
1009
|
+
close: T
|
|
1010
|
+
}), (O, G) => (n(), c("div", {
|
|
1011
|
+
style: W(_.value),
|
|
1012
|
+
visible: l.value,
|
|
980
1013
|
ref_key: "sidebarRef",
|
|
981
|
-
ref:
|
|
1014
|
+
ref: a
|
|
982
1015
|
}, [
|
|
983
|
-
e.showBackdrop ? (
|
|
1016
|
+
e.showBackdrop ? (n(), P(A, {
|
|
984
1017
|
key: 0,
|
|
985
1018
|
name: "fade",
|
|
986
1019
|
appear: "",
|
|
987
1020
|
tag: "div"
|
|
988
1021
|
}, {
|
|
989
1022
|
default: S(() => [
|
|
990
|
-
|
|
1023
|
+
l.value ? (n(), c("section", {
|
|
991
1024
|
key: 0,
|
|
992
|
-
onClick:
|
|
1025
|
+
onClick: T,
|
|
993
1026
|
"aria-hidden": "true",
|
|
994
|
-
class:
|
|
995
|
-
}, null, 2)) :
|
|
1027
|
+
class: b(["fixed inset-0 z-[100] overflow-y-auto backdrop-blur bg-opacity-70", k(y).bgColorVariant({ color: e.backdropColor })])
|
|
1028
|
+
}, null, 2)) : v("", !0)
|
|
996
1029
|
]),
|
|
997
1030
|
_: 1
|
|
998
|
-
})) :
|
|
1031
|
+
})) : v("", !0),
|
|
999
1032
|
D(A, {
|
|
1000
|
-
name:
|
|
1001
|
-
onAfterEnter:
|
|
1002
|
-
onAfterLeave:
|
|
1033
|
+
name: K.value,
|
|
1034
|
+
onAfterEnter: q,
|
|
1035
|
+
onAfterLeave: B,
|
|
1003
1036
|
appear: ""
|
|
1004
1037
|
}, {
|
|
1005
1038
|
default: S(() => [
|
|
1006
|
-
|
|
1039
|
+
l.value ? z((n(), c("div", ae({
|
|
1007
1040
|
key: 0,
|
|
1008
1041
|
ref_key: "dialogRef",
|
|
1009
1042
|
ref: r,
|
|
1010
1043
|
role: "dialog",
|
|
1011
|
-
"aria-modal": "true"
|
|
1012
|
-
|
|
1013
|
-
class:
|
|
1014
|
-
}, [
|
|
1015
|
-
|
|
1016
|
-
class:
|
|
1044
|
+
"aria-modal": "true"
|
|
1045
|
+
}, m(), {
|
|
1046
|
+
class: ["sidebar-body fixed inset-y-0 z-[110] h-full overflow-hidden shadow", [e.placement === "left" ? "left-0" : "right-0"]]
|
|
1047
|
+
}), [
|
|
1048
|
+
g("div", {
|
|
1049
|
+
class: b(["relative h-full overflow-y-scroll overscroll-contain", [k(y).bgColorVariant({ color: e.color }), e.customClass]])
|
|
1017
1050
|
}, [
|
|
1018
|
-
e.showHeader ? (
|
|
1051
|
+
e.showHeader ? (n(), c("div", {
|
|
1019
1052
|
key: 0,
|
|
1020
1053
|
class: "sticky top-0 z-10",
|
|
1021
1054
|
ref_key: "headerRef",
|
|
1022
1055
|
ref: f
|
|
1023
1056
|
}, [
|
|
1024
|
-
|
|
1025
|
-
close:
|
|
1026
|
-
status:
|
|
1057
|
+
C(O.$slots, "header", {
|
|
1058
|
+
close: T,
|
|
1059
|
+
status: l.value,
|
|
1060
|
+
titleId: k(h)
|
|
1027
1061
|
}, () => [
|
|
1028
|
-
|
|
1029
|
-
class:
|
|
1062
|
+
g("div", {
|
|
1063
|
+
class: b(["flex items-center justify-between p-xs", k(y).bgColorVariant({ color: e.color })])
|
|
1030
1064
|
}, [
|
|
1031
|
-
e.placement === "right" ? (
|
|
1065
|
+
e.placement === "right" ? (n(), c("button", {
|
|
1032
1066
|
key: 0,
|
|
1033
1067
|
type: "button",
|
|
1034
1068
|
"aria-label": "Close",
|
|
1035
|
-
onClick:
|
|
1069
|
+
onClick: T
|
|
1036
1070
|
}, [
|
|
1037
|
-
(
|
|
1071
|
+
(n(), c("svg", {
|
|
1038
1072
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1039
1073
|
height: "1em",
|
|
1040
1074
|
viewBox: "0 0 384 512",
|
|
1041
1075
|
"aria-hidden": "true",
|
|
1042
|
-
class:
|
|
1043
|
-
k(
|
|
1076
|
+
class: b(["h-sm transition-opacity duration-300 ease-in hover:opacity-75 focus:opacity-75", [
|
|
1077
|
+
k(y).svgFillColorVariant({ color: e.titleColor })
|
|
1044
1078
|
]])
|
|
1045
1079
|
}, [...G[0] || (G[0] = [
|
|
1046
|
-
|
|
1080
|
+
g("path", { d: "M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z" }, null, -1)
|
|
1047
1081
|
])], 2))
|
|
1048
|
-
])) :
|
|
1049
|
-
e.title ? (
|
|
1082
|
+
])) : v("", !0),
|
|
1083
|
+
e.title ? (n(), c("h3", {
|
|
1050
1084
|
key: 1,
|
|
1051
|
-
id: k(
|
|
1052
|
-
class:
|
|
1053
|
-
}, j(e.title), 11,
|
|
1054
|
-
e.placement === "left" ? (
|
|
1085
|
+
id: k(h),
|
|
1086
|
+
class: b(["h3-md", k(y).textColorVariant({ color: e.titleColor })])
|
|
1087
|
+
}, j(e.title), 11, io)) : v("", !0),
|
|
1088
|
+
e.placement === "left" ? (n(), c("button", {
|
|
1055
1089
|
key: 2,
|
|
1056
1090
|
type: "button",
|
|
1057
1091
|
"aria-label": "Close",
|
|
1058
|
-
onClick:
|
|
1092
|
+
onClick: T
|
|
1059
1093
|
}, [
|
|
1060
|
-
(
|
|
1094
|
+
(n(), c("svg", {
|
|
1061
1095
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1062
1096
|
height: "1em",
|
|
1063
1097
|
viewBox: "0 0 384 512",
|
|
1064
1098
|
"aria-hidden": "true",
|
|
1065
|
-
class:
|
|
1066
|
-
k(
|
|
1099
|
+
class: b(["h-sm transition-opacity duration-300 ease-in hover:opacity-75 focus:opacity-75", [
|
|
1100
|
+
k(y).svgFillColorVariant({ color: e.titleColor })
|
|
1067
1101
|
]])
|
|
1068
1102
|
}, [...G[1] || (G[1] = [
|
|
1069
|
-
|
|
1103
|
+
g("path", { d: "M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z" }, null, -1)
|
|
1070
1104
|
])], 2))
|
|
1071
|
-
])) :
|
|
1105
|
+
])) : v("", !0)
|
|
1072
1106
|
], 2)
|
|
1073
1107
|
], !0)
|
|
1074
|
-
], 512)) :
|
|
1075
|
-
|
|
1076
|
-
|
|
1077
|
-
close:
|
|
1078
|
-
status:
|
|
1108
|
+
], 512)) : v("", !0),
|
|
1109
|
+
g("div", co, [
|
|
1110
|
+
C(O.$slots, "body", {
|
|
1111
|
+
close: T,
|
|
1112
|
+
status: l.value
|
|
1079
1113
|
}, void 0, !0)
|
|
1080
1114
|
]),
|
|
1081
|
-
|
|
1115
|
+
o.footer ? (n(), c("div", {
|
|
1082
1116
|
key: 1,
|
|
1083
1117
|
class: "sticky bottom-0",
|
|
1084
1118
|
ref_key: "footerRef",
|
|
1085
1119
|
ref: p
|
|
1086
1120
|
}, [
|
|
1087
|
-
|
|
1088
|
-
close:
|
|
1089
|
-
status:
|
|
1121
|
+
C(O.$slots, "footer", {
|
|
1122
|
+
close: T,
|
|
1123
|
+
status: l.value
|
|
1090
1124
|
}, void 0, !0)
|
|
1091
|
-
], 512)) :
|
|
1125
|
+
], 512)) : v("", !0)
|
|
1092
1126
|
], 2)
|
|
1093
|
-
],
|
|
1094
|
-
[k(
|
|
1095
|
-
]) :
|
|
1127
|
+
], 16)), [
|
|
1128
|
+
[k(oe), T]
|
|
1129
|
+
]) : v("", !0)
|
|
1096
1130
|
]),
|
|
1097
1131
|
_: 3
|
|
1098
1132
|
}, 8, ["name"])
|
|
1099
|
-
], 12,
|
|
1133
|
+
], 12, no));
|
|
1100
1134
|
}
|
|
1101
|
-
}),
|
|
1135
|
+
}), So = /* @__PURE__ */ H(uo, [["__scopeId", "data-v-658499cf"]]), ce = /* @__PURE__ */ Symbol(), fo = { class: "container-hts grid grid-cols-1 grid-rows-1 transition-[max-height] duration-300" }, ho = /* @__PURE__ */ $({
|
|
1102
1136
|
__name: "TabContainer",
|
|
1103
1137
|
props: {
|
|
1104
1138
|
bodyClass: { default: "" },
|
|
@@ -1106,48 +1140,48 @@ const Co = (e, t) => {
|
|
|
1106
1140
|
contentContainerClass: { default: "" }
|
|
1107
1141
|
},
|
|
1108
1142
|
setup(e, { expose: t }) {
|
|
1109
|
-
const u = w(0),
|
|
1110
|
-
|
|
1143
|
+
const u = w(0), s = w(0), o = w(!1), d = w("slide-next");
|
|
1144
|
+
Q(ce, {
|
|
1111
1145
|
activeTabIdx: u,
|
|
1112
|
-
containerHeight:
|
|
1146
|
+
containerHeight: s,
|
|
1113
1147
|
updateHeight: (r) => {
|
|
1114
|
-
r > 0 && (
|
|
1148
|
+
r > 0 && (o.value = !0), s.value = r;
|
|
1115
1149
|
}
|
|
1116
1150
|
});
|
|
1117
|
-
const
|
|
1151
|
+
const i = (r) => {
|
|
1118
1152
|
u.value = r;
|
|
1119
|
-
},
|
|
1153
|
+
}, a = R(() => o.value ? { "--container-hts": `${s.value}px` } : void 0);
|
|
1120
1154
|
return t({
|
|
1121
|
-
update:
|
|
1155
|
+
update: i
|
|
1122
1156
|
}), E(
|
|
1123
1157
|
() => u.value,
|
|
1124
1158
|
(r, f) => {
|
|
1125
|
-
r > f ?
|
|
1159
|
+
r > f ? d.value = "slide-next" : d.value = "slide-prev";
|
|
1126
1160
|
}
|
|
1127
|
-
), (r, f) => (
|
|
1128
|
-
class:
|
|
1129
|
-
style: W(
|
|
1161
|
+
), (r, f) => (n(), c("div", {
|
|
1162
|
+
class: b(e.bodyClass),
|
|
1163
|
+
style: W(a.value)
|
|
1130
1164
|
}, [
|
|
1131
|
-
|
|
1132
|
-
class:
|
|
1165
|
+
g("div", {
|
|
1166
|
+
class: b(e.btnContainerClass),
|
|
1133
1167
|
role: "tablist"
|
|
1134
1168
|
}, [
|
|
1135
|
-
|
|
1136
|
-
update:
|
|
1169
|
+
C(r.$slots, "tab-button", {
|
|
1170
|
+
update: i,
|
|
1137
1171
|
activeTab: u.value
|
|
1138
1172
|
}, void 0, !0)
|
|
1139
1173
|
], 2),
|
|
1140
|
-
|
|
1141
|
-
class:
|
|
1174
|
+
g("div", {
|
|
1175
|
+
class: b(e.contentContainerClass)
|
|
1142
1176
|
}, [
|
|
1143
|
-
|
|
1144
|
-
D(A, { name:
|
|
1177
|
+
g("div", fo, [
|
|
1178
|
+
D(A, { name: d.value }, {
|
|
1145
1179
|
default: S(() => [
|
|
1146
|
-
(
|
|
1180
|
+
(n(), c("div", {
|
|
1147
1181
|
key: u.value,
|
|
1148
1182
|
class: "relative col-start-1 col-end-1 row-start-1 row-end-1"
|
|
1149
1183
|
}, [
|
|
1150
|
-
|
|
1184
|
+
C(r.$slots, "tab-content", {}, void 0, !0)
|
|
1151
1185
|
]))
|
|
1152
1186
|
]),
|
|
1153
1187
|
_: 3
|
|
@@ -1156,7 +1190,7 @@ const Co = (e, t) => {
|
|
|
1156
1190
|
], 2)
|
|
1157
1191
|
], 6));
|
|
1158
1192
|
}
|
|
1159
|
-
}),
|
|
1193
|
+
}), Eo = /* @__PURE__ */ H(ho, [["__scopeId", "data-v-2d9322d9"]]), vo = ["id"], Ho = /* @__PURE__ */ $({
|
|
1160
1194
|
__name: "TabContent",
|
|
1161
1195
|
props: {
|
|
1162
1196
|
tabNumber: {},
|
|
@@ -1164,38 +1198,38 @@ const Co = (e, t) => {
|
|
|
1164
1198
|
tabClass: { default: "" }
|
|
1165
1199
|
},
|
|
1166
1200
|
setup(e) {
|
|
1167
|
-
const t = e, { activeTabIdx: u, updateHeight:
|
|
1168
|
-
|
|
1169
|
-
),
|
|
1170
|
-
return (
|
|
1201
|
+
const t = e, { activeTabIdx: u, updateHeight: s } = Z(
|
|
1202
|
+
ce
|
|
1203
|
+
), o = w(null), { height: d } = xt(o), l = R(() => u.value === t.tabNumber ? (s(d.value), !0) : !1);
|
|
1204
|
+
return (i, a) => z((n(), c("div", {
|
|
1171
1205
|
ref_key: "slotRef",
|
|
1172
|
-
ref:
|
|
1206
|
+
ref: o,
|
|
1173
1207
|
id: e.id,
|
|
1174
|
-
class:
|
|
1208
|
+
class: b([e.tabClass, "w-full"]),
|
|
1175
1209
|
role: "tabpanel",
|
|
1176
1210
|
tabindex: "-1"
|
|
1177
1211
|
}, [
|
|
1178
|
-
|
|
1179
|
-
], 10,
|
|
1180
|
-
[
|
|
1212
|
+
C(i.$slots, "default")
|
|
1213
|
+
], 10, vo)), [
|
|
1214
|
+
[ee, l.value]
|
|
1181
1215
|
]);
|
|
1182
1216
|
}
|
|
1183
1217
|
});
|
|
1184
1218
|
export {
|
|
1185
|
-
|
|
1186
|
-
|
|
1187
|
-
|
|
1188
|
-
|
|
1189
|
-
|
|
1190
|
-
|
|
1191
|
-
|
|
1192
|
-
|
|
1193
|
-
|
|
1194
|
-
|
|
1195
|
-
|
|
1196
|
-
|
|
1197
|
-
|
|
1198
|
-
|
|
1199
|
-
|
|
1200
|
-
|
|
1219
|
+
ko as AccordionGroup,
|
|
1220
|
+
Vo as Alert,
|
|
1221
|
+
Bo as Card,
|
|
1222
|
+
Ro as CarouselContainer,
|
|
1223
|
+
Oo as CarouselContent,
|
|
1224
|
+
$o as Collapse,
|
|
1225
|
+
Lo as DropdownContainer,
|
|
1226
|
+
Io as DropdownContent,
|
|
1227
|
+
To as HeaderHorizontal,
|
|
1228
|
+
Do as HeaderVertical,
|
|
1229
|
+
Ao as Modal,
|
|
1230
|
+
So as Sidebar,
|
|
1231
|
+
Eo as TabContainer,
|
|
1232
|
+
Ho as TabContent,
|
|
1233
|
+
xo as default,
|
|
1234
|
+
y as generateClass
|
|
1201
1235
|
};
|