@kiva/kv-components 6.4.1 → 6.4.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/dist/vue/KvCartModal.css +1 -1
- package/dist/vue/KvCartModal.js +77 -79
- package/package.json +2 -2
package/dist/vue/KvCartModal.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.screen[data-v-
|
|
1
|
+
.screen[data-v-c2a75743]{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1400;background-color:#0003}.modal[data-v-c2a75743]{width:100%;border-bottom-right-radius:.875rem;border-bottom-left-radius:.875rem;--tw-bg-opacity: 1;background-color:rgba(var(--bg-primary),var(--tw-bg-opacity, 1))}@media (min-width: 45.875rem){.modal[data-v-c2a75743]{position:absolute;right:0}}.modal[data-v-c2a75743]{max-height:90%}.container[data-v-c2a75743]{position:absolute;top:0;right:0;bottom:0;left:0}@media (min-width: 45.875rem){.modal[data-v-c2a75743]{max-width:24.5rem}}
|
package/dist/vue/KvCartModal.js
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
import { toRefs as
|
|
2
|
-
import { mdiClose as
|
|
3
|
-
import { useFocusTrap as
|
|
4
|
-
import { hideOthers as
|
|
5
|
-
import { unlockScroll as
|
|
6
|
-
import { unlockPrintSingleEl as
|
|
7
|
-
import
|
|
8
|
-
import
|
|
1
|
+
import { toRefs as T, ref as w, computed as E, watch as A, onMounted as N, onBeforeUnmount as V, resolveComponent as y, openBlock as b, createBlock as I, Transition as K, withCtx as x, withDirectives as F, createElementVNode as o, withModifiers as k, renderSlot as g, createVNode as C, createElementBlock as P, createCommentVNode as R, createTextVNode as j, toDisplayString as D, vShow as L, nextTick as O } from "vue";
|
|
2
|
+
import { mdiClose as U, mdiCheckCircle as q } from "@mdi/js";
|
|
3
|
+
import { useFocusTrap as z } from "@vueuse/integrations/useFocusTrap";
|
|
4
|
+
import { hideOthers as G } from "../vendor/aria-hidden/dist/es2015/index.js";
|
|
5
|
+
import { unlockScroll as H, lockScroll as J } from "../utils/scrollLock.js";
|
|
6
|
+
import { unlockPrintSingleEl as Q, lockPrintSingleEl as W } from "../utils/printing.js";
|
|
7
|
+
import X from "./KvButton.js";
|
|
8
|
+
import Y from "./KvMaterialIcon.js";
|
|
9
9
|
import "./KvCartModal.css";
|
|
10
|
-
import
|
|
11
|
-
const
|
|
10
|
+
import Z from "../_virtual/_plugin-vue_export-helper.js";
|
|
11
|
+
const $ = {
|
|
12
12
|
components: {
|
|
13
|
-
KvMaterialIcon:
|
|
14
|
-
KvButton:
|
|
13
|
+
KvMaterialIcon: Y,
|
|
14
|
+
KvButton: X
|
|
15
15
|
},
|
|
16
16
|
props: {
|
|
17
17
|
/**
|
|
@@ -40,72 +40,70 @@ const et = {
|
|
|
40
40
|
emits: [
|
|
41
41
|
"cart-modal-closed"
|
|
42
42
|
],
|
|
43
|
-
setup(
|
|
43
|
+
setup(c, { emit: t }) {
|
|
44
44
|
const {
|
|
45
|
-
visible:
|
|
46
|
-
preventClose:
|
|
47
|
-
} =
|
|
48
|
-
|
|
45
|
+
visible: l,
|
|
46
|
+
preventClose: e
|
|
47
|
+
} = T(c), r = w(null), a = w(null), d = w(null), u = w(), n = E(() => [
|
|
48
|
+
r.value
|
|
49
49
|
// This cart modal
|
|
50
|
-
]),
|
|
51
|
-
activate:
|
|
52
|
-
deactivate:
|
|
53
|
-
} =
|
|
50
|
+
]), {
|
|
51
|
+
activate: h,
|
|
52
|
+
deactivate: M
|
|
53
|
+
} = z(n, {
|
|
54
54
|
allowOutsideClick: !0
|
|
55
55
|
// allow clicking outside the cart modal to close it
|
|
56
56
|
});
|
|
57
|
-
let
|
|
58
|
-
const
|
|
59
|
-
|
|
57
|
+
let v = null, m = null;
|
|
58
|
+
const s = (i = "") => {
|
|
59
|
+
r.value && a.value && (M(), a.value.scrollTop = 0, Q(a.value)), H(), v && (v(), v = null), document.removeEventListener("keyup", m), t("cart-modal-closed", { type: i });
|
|
60
60
|
};
|
|
61
|
-
|
|
62
|
-
|
|
61
|
+
m = (i) => {
|
|
62
|
+
i && i.key === "Escape" && !e.value && s();
|
|
63
63
|
};
|
|
64
|
-
const
|
|
65
|
-
|
|
64
|
+
const _ = () => {
|
|
65
|
+
e.value || s("background");
|
|
66
66
|
}, f = () => {
|
|
67
|
-
|
|
68
|
-
|
|
67
|
+
l.value && (document.addEventListener("keyup", m), O(() => {
|
|
68
|
+
r.value && a.value && (h(), v = G(r.value), W(a.value)), J();
|
|
69
69
|
}));
|
|
70
|
-
},
|
|
71
|
-
|
|
70
|
+
}, B = (i) => {
|
|
71
|
+
s(i);
|
|
72
72
|
}, p = () => {
|
|
73
|
-
|
|
73
|
+
e.value || (u.value = setTimeout(() => {
|
|
74
74
|
t("cart-modal-closed", { type: "time" });
|
|
75
75
|
}, 1e4));
|
|
76
|
-
},
|
|
77
|
-
|
|
76
|
+
}, S = () => {
|
|
77
|
+
e.value || clearTimeout(u.value);
|
|
78
78
|
};
|
|
79
|
-
return
|
|
80
|
-
|
|
81
|
-
}),
|
|
82
|
-
|
|
83
|
-
}),
|
|
84
|
-
mdiClose:
|
|
85
|
-
mdiCheckCircle:
|
|
86
|
-
onKeyUp:
|
|
87
|
-
onScreenClick:
|
|
88
|
-
hide:
|
|
79
|
+
return A(l, () => {
|
|
80
|
+
l.value ? (f(), p()) : s();
|
|
81
|
+
}), N(() => {
|
|
82
|
+
l.value && (f(), p());
|
|
83
|
+
}), V(() => s()), {
|
|
84
|
+
mdiClose: U,
|
|
85
|
+
mdiCheckCircle: q,
|
|
86
|
+
onKeyUp: m,
|
|
87
|
+
onScreenClick: _,
|
|
88
|
+
hide: s,
|
|
89
89
|
show: f,
|
|
90
|
-
controlsRef:
|
|
91
|
-
handleClick:
|
|
92
|
-
clearAutomaticClose:
|
|
93
|
-
setAutomaticClose: p
|
|
94
|
-
showContentSlot: B
|
|
90
|
+
controlsRef: d,
|
|
91
|
+
handleClick: B,
|
|
92
|
+
clearAutomaticClose: S,
|
|
93
|
+
setAutomaticClose: p
|
|
95
94
|
};
|
|
96
95
|
}
|
|
97
|
-
},
|
|
98
|
-
key: 0,
|
|
96
|
+
}, tt = { class: "container" }, et = { class: "tw-flex tw-pt-2 tw-px-2.5" }, ot = { class: "tw-flex tw-flex-grow tw-gap-1 tw-items-center tw-pb-2" }, lt = {
|
|
99
97
|
id: "kvCartModalBody",
|
|
100
98
|
ref: "kvCartModalBody",
|
|
101
|
-
class: "tw-flex tw-gap-2
|
|
102
|
-
},
|
|
99
|
+
class: "tw-flex tw-gap-2"
|
|
100
|
+
}, nt = {
|
|
103
101
|
ref: "controlsRef",
|
|
104
102
|
class: "tw-flex-shrink-0 tw-flex tw-justify-end tw-gap-x-2.5 tw-px-2.5 tw-pb-2 tw-flex-col tw-gap-1"
|
|
105
103
|
};
|
|
106
|
-
function
|
|
107
|
-
const
|
|
108
|
-
return
|
|
104
|
+
function at(c, t, l, e, r, a) {
|
|
105
|
+
const d = y("kv-material-icon"), u = y("kv-button");
|
|
106
|
+
return b(), I(K, {
|
|
109
107
|
"enter-active-class": "tw-transition-opacity tw-duration-300",
|
|
110
108
|
"leave-active-class": "tw-transition-opacity tw-duration-300",
|
|
111
109
|
"enter-class": "tw-opacity-0",
|
|
@@ -113,13 +111,13 @@ function it(d, t, i, e, r, c) {
|
|
|
113
111
|
"leave-class": "tw-opacity-full",
|
|
114
112
|
"leave-to-class": "tw-opacity-0"
|
|
115
113
|
}, {
|
|
116
|
-
default:
|
|
117
|
-
|
|
114
|
+
default: x(() => [
|
|
115
|
+
F(o("div", {
|
|
118
116
|
class: "screen",
|
|
119
|
-
onClick: t[5] || (t[5] =
|
|
117
|
+
onClick: t[5] || (t[5] = k((...n) => e.onScreenClick && e.onScreenClick(...n), ["stop", "prevent"]))
|
|
120
118
|
}, [
|
|
121
119
|
o("div", null, [
|
|
122
|
-
o("div",
|
|
120
|
+
o("div", tt, [
|
|
123
121
|
o("div", {
|
|
124
122
|
ref: "kvCartModal",
|
|
125
123
|
tabindex: "-1",
|
|
@@ -127,26 +125,26 @@ function it(d, t, i, e, r, c) {
|
|
|
127
125
|
class: "modal",
|
|
128
126
|
"aria-modal": "true",
|
|
129
127
|
"aria-label": "Added to basket",
|
|
130
|
-
onClick: t[2] || (t[2] =
|
|
128
|
+
onClick: t[2] || (t[2] = k(() => {
|
|
131
129
|
}, ["stop"])),
|
|
132
130
|
onMouseenter: t[3] || (t[3] = (n) => e.clearAutomaticClose()),
|
|
133
131
|
onMouseleave: t[4] || (t[4] = (n) => e.setAutomaticClose())
|
|
134
132
|
}, [
|
|
135
|
-
o("div",
|
|
136
|
-
o("div",
|
|
137
|
-
g(
|
|
138
|
-
|
|
133
|
+
o("div", et, [
|
|
134
|
+
o("div", ot, [
|
|
135
|
+
g(c.$slots, "header", {}, () => [
|
|
136
|
+
C(d, {
|
|
139
137
|
class: "tw-w-3.5 tw-h-3.5 tw-text-brand",
|
|
140
138
|
icon: e.mdiCheckCircle
|
|
141
139
|
}, null, 8, ["icon"]),
|
|
142
140
|
t[6] || (t[6] = o("p", { class: "tw-flex-1 tw-font-medium tw-text-center" }, " Added to basket ", -1))
|
|
143
141
|
], !0),
|
|
144
|
-
|
|
142
|
+
l.preventClose ? R("", !0) : (b(), P("button", {
|
|
145
143
|
key: 0,
|
|
146
144
|
class: "tw-grid tw-content-center tw-justify-center tw-ml-auto tw-w-6 tw-h-6 tw--m-2 hover:tw-text-action-highlight",
|
|
147
|
-
onClick: t[0] || (t[0] =
|
|
145
|
+
onClick: t[0] || (t[0] = k((n) => e.hide("x-button"), ["stop"]))
|
|
148
146
|
}, [
|
|
149
|
-
|
|
147
|
+
C(d, {
|
|
150
148
|
class: "tw-w-3.5 tw-h-3.5",
|
|
151
149
|
icon: e.mdiClose
|
|
152
150
|
}, null, 8, ["icon"]),
|
|
@@ -154,16 +152,16 @@ function it(d, t, i, e, r, c) {
|
|
|
154
152
|
]))
|
|
155
153
|
])
|
|
156
154
|
]),
|
|
157
|
-
|
|
158
|
-
g(
|
|
159
|
-
], 512)
|
|
160
|
-
o("div",
|
|
161
|
-
|
|
155
|
+
o("div", lt, [
|
|
156
|
+
g(c.$slots, "content", {}, void 0, !0)
|
|
157
|
+
], 512),
|
|
158
|
+
o("div", nt, [
|
|
159
|
+
C(u, {
|
|
162
160
|
class: "tw-w-full",
|
|
163
161
|
onClick: t[1] || (t[1] = (n) => e.handleClick("view-basket"))
|
|
164
162
|
}, {
|
|
165
|
-
default:
|
|
166
|
-
|
|
163
|
+
default: x(() => [
|
|
164
|
+
j(" View basket (" + D(l.basketCount) + ") ", 1)
|
|
167
165
|
]),
|
|
168
166
|
_: 1
|
|
169
167
|
})
|
|
@@ -172,13 +170,13 @@ function it(d, t, i, e, r, c) {
|
|
|
172
170
|
])
|
|
173
171
|
])
|
|
174
172
|
], 512), [
|
|
175
|
-
[
|
|
173
|
+
[L, l.visible]
|
|
176
174
|
])
|
|
177
175
|
]),
|
|
178
176
|
_: 3
|
|
179
177
|
});
|
|
180
178
|
}
|
|
181
|
-
const
|
|
179
|
+
const pt = /* @__PURE__ */ Z($, [["render", at], ["__scopeId", "data-v-c2a75743"]]);
|
|
182
180
|
export {
|
|
183
|
-
|
|
181
|
+
pt as default
|
|
184
182
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kiva/kv-components",
|
|
3
|
-
"version": "6.4.
|
|
3
|
+
"version": "6.4.2",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -107,5 +107,5 @@
|
|
|
107
107
|
"embla-carousel-fade",
|
|
108
108
|
"popper.js"
|
|
109
109
|
],
|
|
110
|
-
"gitHead": "
|
|
110
|
+
"gitHead": "ad451289b0e7c6a607efce658156f9240576a5ea"
|
|
111
111
|
}
|