@wikicasa-dev/components 2.4.1-alpha.1 → 2.4.1-alpha.11
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/dist/Swiper/autoplay.js +1 -1
- package/dist/Swiper/controller.js +1 -1
- package/dist/Swiper/keyboard.js +1 -1
- package/dist/Swiper/thumbs.js +1 -1
- package/dist/UIKit/BaseModal.d.ts +7 -3
- package/dist/packages/components/lib/UIKit/BaseModal.vue.js +81 -85
- package/package.json +1 -1
- /package/dist/assets/{swiper-autoplay.css → swiper-controller.css} +0 -0
package/dist/Swiper/autoplay.js
CHANGED
package/dist/Swiper/keyboard.js
CHANGED
package/dist/Swiper/thumbs.js
CHANGED
|
@@ -12,7 +12,6 @@ type __VLS_Props = {
|
|
|
12
12
|
classes?: ClassTypeProp;
|
|
13
13
|
}>;
|
|
14
14
|
withCloseIcon?: boolean;
|
|
15
|
-
showModal?: boolean;
|
|
16
15
|
headerTitle?: string;
|
|
17
16
|
autoClose?: number;
|
|
18
17
|
fullHeight?: boolean;
|
|
@@ -25,6 +24,9 @@ type __VLS_Props = {
|
|
|
25
24
|
closeIconBtnClasses?: ClassTypeProp;
|
|
26
25
|
titleClasses?: ClassTypeProp;
|
|
27
26
|
};
|
|
27
|
+
type __VLS_PublicProps = {
|
|
28
|
+
"showModal"?: boolean;
|
|
29
|
+
} & __VLS_Props;
|
|
28
30
|
declare function __VLS_template(): {
|
|
29
31
|
attrs: Partial<{}>;
|
|
30
32
|
slots: {
|
|
@@ -46,14 +48,16 @@ declare function __VLS_template(): {
|
|
|
46
48
|
rootEl: any;
|
|
47
49
|
};
|
|
48
50
|
type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
|
49
|
-
declare const __VLS_component: import('vue').DefineComponent<
|
|
51
|
+
declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
50
52
|
opened: () => any;
|
|
51
53
|
closed: () => any;
|
|
52
54
|
dialogClick: (args_0: MouseEvent) => any;
|
|
53
|
-
|
|
55
|
+
"update:showModal": (value: boolean) => any;
|
|
56
|
+
}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
54
57
|
onOpened?: (() => any) | undefined;
|
|
55
58
|
onClosed?: (() => any) | undefined;
|
|
56
59
|
onDialogClick?: ((args_0: MouseEvent) => any) | undefined;
|
|
60
|
+
"onUpdate:showModal"?: ((value: boolean) => any) | undefined;
|
|
57
61
|
}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
|
|
58
62
|
backdrop: HTMLDivElement;
|
|
59
63
|
modalDialog: HTMLDialogElement;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { CloseIcon as
|
|
3
|
-
const
|
|
1
|
+
import { defineComponent as O, mergeModels as h, useModel as A, useTemplateRef as y, shallowRef as C, onUnmounted as F, createBlock as K, openBlock as k, Teleport as N, createVNode as w, Transition as S, unref as p, withCtx as V, withDirectives as P, createElementVNode as l, normalizeClass as i, createElementBlock as x, createCommentVNode as g, renderSlot as d, withModifiers as R, vShow as U } from "vue";
|
|
2
|
+
import { CloseIcon as j } from "@wikicasa-dev/svg-icons";
|
|
3
|
+
const q = ["id", "data-cy"], G = ["innerHTML"], W = /* @__PURE__ */ O({
|
|
4
4
|
__name: "BaseModal",
|
|
5
|
-
props: {
|
|
5
|
+
props: /* @__PURE__ */ h({
|
|
6
6
|
id: { default: "base-bt-modal" },
|
|
7
7
|
size: { default: "modal-md" },
|
|
8
8
|
customBackdropClasses: {},
|
|
@@ -12,7 +12,6 @@ const P = ["id", "data-cy"], R = ["innerHTML"], q = /* @__PURE__ */ T({
|
|
|
12
12
|
customModalFooterClasses: {},
|
|
13
13
|
closeIcon: {},
|
|
14
14
|
withCloseIcon: { type: Boolean, default: !0 },
|
|
15
|
-
showModal: { type: Boolean, default: !0 },
|
|
16
15
|
headerTitle: { default: "" },
|
|
17
16
|
autoClose: {},
|
|
18
17
|
fullHeight: { type: Boolean, default: !1 },
|
|
@@ -21,39 +20,42 @@ const P = ["id", "data-cy"], R = ["innerHTML"], q = /* @__PURE__ */ T({
|
|
|
21
20
|
dataCy: {},
|
|
22
21
|
closeIconBtnClasses: {},
|
|
23
22
|
titleClasses: {}
|
|
24
|
-
},
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
23
|
+
}, {
|
|
24
|
+
showModal: { type: Boolean, default: !0 },
|
|
25
|
+
showModalModifiers: {}
|
|
26
|
+
}),
|
|
27
|
+
emits: /* @__PURE__ */ h(["closed", "opened", "dialogClick"], ["update:showModal"]),
|
|
28
|
+
setup(e, { emit: M }) {
|
|
29
|
+
const r = M, o = A(e, "showModal"), B = o.value, m = y("backdrop"), a = y("modalDialog"), u = C(!1), c = C(!1), f = ({ key: t }) => {
|
|
30
|
+
t === "Escape" && s();
|
|
31
|
+
}, E = () => {
|
|
32
|
+
document?.body.addEventListener("keydown", f);
|
|
33
|
+
}, b = () => {
|
|
34
|
+
document?.body.removeEventListener("keydown", f);
|
|
35
|
+
}, I = () => {
|
|
36
|
+
c.value || (E(), document?.body.classList.add(
|
|
35
37
|
"sm:uikit-pr-15px",
|
|
36
38
|
"sm:uikit-mr-0",
|
|
37
39
|
"uikit-overflow-hidden"
|
|
38
|
-
);
|
|
39
|
-
},
|
|
40
|
-
|
|
40
|
+
), c.value = !0);
|
|
41
|
+
}, L = () => {
|
|
42
|
+
r("opened"), e.autoClose !== void 0 && setTimeout(() => {
|
|
41
43
|
s();
|
|
42
|
-
},
|
|
43
|
-
},
|
|
44
|
-
|
|
44
|
+
}, e.autoClose);
|
|
45
|
+
}, z = () => {
|
|
46
|
+
b(), document?.body.classList.remove(
|
|
45
47
|
"sm:uikit-pr-15px",
|
|
46
48
|
"sm:uikit-mr-0",
|
|
47
49
|
"uikit-overflow-hidden"
|
|
48
|
-
), c("closed");
|
|
50
|
+
), c.value = !1, r("closed");
|
|
49
51
|
}, s = () => {
|
|
50
52
|
o.value = !1;
|
|
51
|
-
},
|
|
52
|
-
a.value && a.value.contains(
|
|
53
|
-
},
|
|
54
|
-
a.value && a.value.contains(
|
|
55
|
-
},
|
|
56
|
-
if (!(
|
|
53
|
+
}, T = (t) => {
|
|
54
|
+
a.value && a.value.contains(t.target) && (u.value = !0);
|
|
55
|
+
}, $ = (t) => {
|
|
56
|
+
a.value && a.value.contains(t.target) && (u.value = !1);
|
|
57
|
+
}, D = async (t) => {
|
|
58
|
+
if (!(t.target !== m.value && m.value?.contains(t.target)) && e.closeOnClickOut) {
|
|
57
59
|
if (u.value) {
|
|
58
60
|
u.value = !1;
|
|
59
61
|
return;
|
|
@@ -61,103 +63,97 @@ const P = ["id", "data-cy"], R = ["innerHTML"], q = /* @__PURE__ */ T({
|
|
|
61
63
|
s();
|
|
62
64
|
}
|
|
63
65
|
};
|
|
64
|
-
|
|
65
|
-
|
|
66
|
+
F(() => {
|
|
67
|
+
b(), document?.body.classList.remove(
|
|
66
68
|
"sm:uikit-pr-15px",
|
|
67
69
|
"sm:uikit-mr-0",
|
|
68
70
|
"uikit-overflow-hidden"
|
|
69
71
|
);
|
|
70
|
-
})
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
o.value = e;
|
|
74
|
-
},
|
|
75
|
-
{ immediate: !0 }
|
|
76
|
-
);
|
|
77
|
-
const z = (e) => {
|
|
78
|
-
a.value === e.target && e.stopPropagation();
|
|
72
|
+
});
|
|
73
|
+
const H = (t) => {
|
|
74
|
+
a.value === t.target && t.stopPropagation();
|
|
79
75
|
};
|
|
80
|
-
return (
|
|
81
|
-
|
|
82
|
-
appear:
|
|
76
|
+
return (t, n) => (k(), K(N, { to: "body" }, [
|
|
77
|
+
w(S, {
|
|
78
|
+
appear: p(B),
|
|
83
79
|
name: "modal-transition",
|
|
84
80
|
duration: { enter: 500, leave: 250 },
|
|
85
|
-
onBeforeEnter:
|
|
86
|
-
onAfterEnter:
|
|
87
|
-
onAfterLeave:
|
|
81
|
+
onBeforeEnter: I,
|
|
82
|
+
onAfterEnter: L,
|
|
83
|
+
onAfterLeave: z
|
|
88
84
|
}, {
|
|
89
|
-
default:
|
|
90
|
-
|
|
85
|
+
default: V(() => [
|
|
86
|
+
P(l("div", {
|
|
91
87
|
ref: "backdrop",
|
|
92
88
|
class: i(["bbt-backdrop uikit-fixed uikit-left-0 uikit-top-0 uikit-z-50 uikit-h-full uikit-w-full", [
|
|
93
|
-
|
|
89
|
+
e.customBackdropClasses,
|
|
94
90
|
{
|
|
95
91
|
"uikit-bg-w-secondary/70": o.value
|
|
96
92
|
},
|
|
97
93
|
{ "uikit-bg-transparent": !o.value },
|
|
98
|
-
{ "sm:uikit-pt-[30px]": !
|
|
94
|
+
{ "sm:uikit-pt-[30px]": !e.centered }
|
|
99
95
|
]]),
|
|
100
|
-
onClick:
|
|
101
|
-
onMousedown:
|
|
102
|
-
onMouseup:
|
|
96
|
+
onClick: D,
|
|
97
|
+
onMousedown: T,
|
|
98
|
+
onMouseup: $
|
|
103
99
|
}, [
|
|
104
100
|
l("dialog", {
|
|
105
|
-
id:
|
|
101
|
+
id: e.id,
|
|
106
102
|
ref: "modalDialog",
|
|
107
|
-
"data-cy":
|
|
103
|
+
"data-cy": e.dataCy,
|
|
108
104
|
class: i(["uikit-modal-dialog uikit-mx-auto uikit-block uikit-w-full uikit-overflow-y-auto uikit-overflow-x-hidden uikit-rounded uikit-border-none uikit-bg-transparent uikit-bg-white uikit-p-0 uikit-shadow-lg uikit-no-scrollbar uikit-safe-bottom max-sm:uikit-fixed max-sm:uikit-bottom-0 max-sm:uikit-max-h-[95%] max-sm:uikit-rounded-bl-none max-sm:uikit-rounded-br-none sm:uikit-h-auto", [
|
|
109
|
-
|
|
105
|
+
e.customModalDialogClasses,
|
|
110
106
|
{
|
|
111
|
-
"centered sm:uikit-absolute sm:uikit-top-1/2 sm:-uikit-translate-y-1/2":
|
|
107
|
+
"centered sm:uikit-absolute sm:uikit-top-1/2 sm:-uikit-translate-y-1/2": e.centered
|
|
112
108
|
},
|
|
113
|
-
{ "uikit-static": !
|
|
114
|
-
`base-${
|
|
115
|
-
|
|
109
|
+
{ "uikit-static": !e.centered },
|
|
110
|
+
`base-${e.size}`,
|
|
111
|
+
e.fullHeight ? "uikit-h-[95%]" : "uikit-h-auto"
|
|
116
112
|
]]),
|
|
117
113
|
tabindex: "-1",
|
|
118
|
-
onClick: n[1] || (n[1] = (
|
|
119
|
-
onFocusin:
|
|
114
|
+
onClick: n[1] || (n[1] = (v) => r("dialogClick", v)),
|
|
115
|
+
onFocusin: H
|
|
120
116
|
}, [
|
|
121
117
|
l("div", {
|
|
122
|
-
class: i(["default-header uikit-sticky uikit-top-0 uikit-z-10 uikit-rounded-t uikit-border-0 uikit-bg-white uikit-px-4 uikit-pb-10px uikit-pt-20px sm:uikit-px-6", [
|
|
118
|
+
class: i(["default-header uikit-sticky uikit-top-0 uikit-z-10 uikit-rounded-t uikit-border-0 uikit-bg-white uikit-px-4 uikit-pb-10px uikit-pt-20px sm:uikit-px-6", [e.customModalHeaderClasses]])
|
|
123
119
|
}, [
|
|
124
|
-
|
|
120
|
+
e.withCloseIcon ? (k(), x("button", {
|
|
125
121
|
key: 0,
|
|
126
122
|
id: "close-icon-btn",
|
|
127
123
|
"data-cy": "bbt-default-close-icon-btn",
|
|
128
|
-
class: i(["uikit-absolute uikit-right-15px uikit-top-15px uikit-z-10 uikit-bg-transparent uikit-p-5px",
|
|
124
|
+
class: i(["uikit-absolute uikit-right-15px uikit-top-15px uikit-z-10 uikit-bg-transparent uikit-p-5px", e.closeIconBtnClasses]),
|
|
129
125
|
type: "button",
|
|
130
126
|
"aria-label": "Close",
|
|
131
|
-
onClick: n[0] || (n[0] =
|
|
127
|
+
onClick: n[0] || (n[0] = R((v) => o.value = !1, ["prevent", "stop"]))
|
|
132
128
|
}, [
|
|
133
|
-
|
|
134
|
-
class: i(["bbt-close-icon uikit-box-border",
|
|
135
|
-
width:
|
|
136
|
-
height:
|
|
129
|
+
w(p(j), {
|
|
130
|
+
class: i(["bbt-close-icon uikit-box-border", e.closeIcon?.classes]),
|
|
131
|
+
width: e.closeIcon?.size || 20,
|
|
132
|
+
height: e.closeIcon?.size || 20
|
|
137
133
|
}, null, 8, ["class", "width", "height"])
|
|
138
|
-
], 2)) :
|
|
139
|
-
d(
|
|
134
|
+
], 2)) : g("", !0),
|
|
135
|
+
d(t.$slots, "header", { closeModal: s }, () => [
|
|
140
136
|
l("span", {
|
|
141
|
-
class: i(["uikit-w-auto uikit-text-18 uikit-font-semibold sm:uikit-text-22",
|
|
142
|
-
innerHTML:
|
|
143
|
-
}, null, 10,
|
|
137
|
+
class: i(["uikit-w-auto uikit-text-18 uikit-font-semibold sm:uikit-text-22", e.titleClasses]),
|
|
138
|
+
innerHTML: e.headerTitle
|
|
139
|
+
}, null, 10, G)
|
|
144
140
|
])
|
|
145
141
|
], 2),
|
|
146
142
|
l("div", {
|
|
147
|
-
class: i(["uikit-bbt-body uikit-flex-auto uikit-overflow-y-auto uikit-overflow-x-hidden uikit-px-4 uikit-pb-0 uikit-no-scrollbar sm:uikit-px-6 sm:uikit-pb-25px", [
|
|
143
|
+
class: i(["uikit-bbt-body uikit-flex-auto uikit-overflow-y-auto uikit-overflow-x-hidden uikit-px-4 uikit-pb-0 uikit-no-scrollbar sm:uikit-px-6 sm:uikit-pb-25px", [e.customModalBodyClasses]])
|
|
148
144
|
}, [
|
|
149
|
-
d(
|
|
145
|
+
d(t.$slots, "body", { closeModal: s })
|
|
150
146
|
], 2),
|
|
151
|
-
|
|
147
|
+
t.$slots.footer ? (k(), x("div", {
|
|
152
148
|
key: 0,
|
|
153
|
-
class: i(["uikit-bbt-footer uikit-sticky uikit-bottom-0 uikit-border-0 uikit-bg-white uikit-px-4 uikit-py-15px sm:uikit-px-6",
|
|
149
|
+
class: i(["uikit-bbt-footer uikit-sticky uikit-bottom-0 uikit-border-0 uikit-bg-white uikit-px-4 uikit-py-15px sm:uikit-px-6", e.customModalFooterClasses])
|
|
154
150
|
}, [
|
|
155
|
-
d(
|
|
156
|
-
], 2)) :
|
|
157
|
-
d(
|
|
158
|
-
], 42,
|
|
151
|
+
d(t.$slots, "footer", { closeModal: s })
|
|
152
|
+
], 2)) : g("", !0),
|
|
153
|
+
d(t.$slots, "fixed-bottom")
|
|
154
|
+
], 42, q)
|
|
159
155
|
], 34), [
|
|
160
|
-
[
|
|
156
|
+
[U, o.value]
|
|
161
157
|
])
|
|
162
158
|
]),
|
|
163
159
|
_: 3
|
|
@@ -166,5 +162,5 @@ const P = ["id", "data-cy"], R = ["innerHTML"], q = /* @__PURE__ */ T({
|
|
|
166
162
|
}
|
|
167
163
|
});
|
|
168
164
|
export {
|
|
169
|
-
|
|
165
|
+
W as default
|
|
170
166
|
};
|
package/package.json
CHANGED
|
File without changes
|