@kiva/kv-components 8.13.2 → 8.14.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/dist/vue/KvDatePicker.css +1 -1
- package/dist/vue/KvDatePicker.js +20 -27
- package/dist/vue/KvDatePicker.vue.d.ts +99 -4
- package/dist/vue/KvDatePicker2.js +12 -24
- package/dist/vue/KvSimpleMap.css +1 -1
- package/dist/vue/KvSimpleMap.js +1 -1
- package/dist/vue/KvSimpleMap2.js +36 -36
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
.kv-
|
|
1
|
+
.kv-datepicker .dp__input{font-family:inherit;font-weight:inherit;height:3rem}.kv-datepicker .dp__input:focus-within,.kv-datepicker .dp__input:focus-visible{border-color:rgb(var(--bg-action));border-width:2px;outline:none}.kv-datepicker .dp__disabled{color:rgb(var(--text-tertiary))}.kv-datepicker .dp__theme_light{--dp-primary-color: rgb(var(--bg-primary-inverse));--dp-secondary-color: rgb(var(--bg-tertiary));--dp-icon-color: rgb(var(--bg-action));--dp-hover-icon-color: rgb(var(--bg-action));--dp-border-radius: .25rem;--dp-border-color-focus: rgb(var(--bg-action-highlight));--dp-font-family: inherit, "Postgrotesk", sans-serif;--dp-primary-text-color: rgb(var(--text-primary-inverse));--dp-border-color: rgb(var(--bg-tertiary));--dp-hover-color: rgb(var(--bg-tertiary));--dp-background-color: rgb(var(--bg-primary));--dp-text-color: rgb(var(--text-primary));--dp-menu-border-color: rgb(var(--bg-primary-inverse));--dp-disabled-color: rgb(var(--bg-tertiary), 25%);--dp-disabled-color-text: rgb(var(--bg-tertiary));--dp-success-color: rgb(var(--bg-action));--dp-danger-color: rgb(var(--bg-danger));--dp-highlight-color: rgb(var(--bg-action));--dp-cell-border-radius: .25rem;--dp-loader: rgb(var(--bg-action));--dp-range-between-dates-background-color: rgb(var(--bg-action));--dp-range-between-dates-text-color: rgb(var(--bg-primary));--dp-range-between-border-color: rgb(var(--bg-action))}
|
package/dist/vue/KvDatePicker.js
CHANGED
|
@@ -1,37 +1,30 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { resolveComponent as
|
|
1
|
+
import s from "./KvDatePicker2.js";
|
|
2
|
+
import { resolveComponent as o, openBlock as i, createBlock as _, withCtx as u, createElementVNode as r, normalizeClass as v, createVNode as k, mergeProps as f } from "vue";
|
|
3
3
|
import "./KvDatePicker.css";
|
|
4
|
-
import
|
|
5
|
-
const
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
function V(l, o, m, a, e, c) {
|
|
13
|
-
const d = s("kv-theme-provider");
|
|
14
|
-
return t(), n(d, { theme: a.themeStyle }, {
|
|
15
|
-
default: _(() => [
|
|
16
|
-
k("div", {
|
|
17
|
-
class: v(["kv-datepicker", m.theme])
|
|
4
|
+
import h from "../_virtual/_plugin-vue_export-helper.js";
|
|
5
|
+
const V = { class: "kv-datepicker__content" };
|
|
6
|
+
function C(a, e, l, n, t, d) {
|
|
7
|
+
const m = o("vue-date-picker"), c = o("kv-theme-provider");
|
|
8
|
+
return i(), _(c, { theme: n.themeStyle }, {
|
|
9
|
+
default: u(() => [
|
|
10
|
+
r("div", {
|
|
11
|
+
class: v(["kv-datepicker", l.theme])
|
|
18
12
|
}, [
|
|
19
|
-
|
|
20
|
-
(
|
|
21
|
-
|
|
22
|
-
modelValue: e.selectedDate
|
|
23
|
-
|
|
24
|
-
}, l.$attrs, {
|
|
13
|
+
r("div", V, [
|
|
14
|
+
k(m, f({
|
|
15
|
+
modelValue: t.selectedDate,
|
|
16
|
+
"onUpdate:modelValue": e[0] || (e[0] = (p) => t.selectedDate = p)
|
|
17
|
+
}, a.$attrs, {
|
|
25
18
|
"auto-apply": !0,
|
|
26
|
-
"onUpdate:modelValue":
|
|
27
|
-
}), null, 16, ["modelValue", "onUpdate:modelValue"])
|
|
28
|
-
])
|
|
19
|
+
"onUpdate:modelValue": d.handleDateChange
|
|
20
|
+
}), null, 16, ["modelValue", "onUpdate:modelValue"])
|
|
21
|
+
])
|
|
29
22
|
], 2)
|
|
30
23
|
]),
|
|
31
24
|
_: 1
|
|
32
25
|
}, 8, ["theme"]);
|
|
33
26
|
}
|
|
34
|
-
const
|
|
27
|
+
const y = /* @__PURE__ */ h(s, [["render", C]]);
|
|
35
28
|
export {
|
|
36
|
-
|
|
29
|
+
y as default
|
|
37
30
|
};
|
|
@@ -11,12 +11,8 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
11
11
|
}>, {
|
|
12
12
|
themeStyle: import('vue').ComputedRef<any>;
|
|
13
13
|
}, {
|
|
14
|
-
datepickerComponent: any;
|
|
15
|
-
datepickerPromise: any;
|
|
16
14
|
selectedDate: any;
|
|
17
|
-
componentKey: number;
|
|
18
15
|
}, {}, {
|
|
19
|
-
loadDatepicker(): Promise<any>;
|
|
20
16
|
handleDateChange(value: any): void;
|
|
21
17
|
}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
|
|
22
18
|
modelValue: {
|
|
@@ -54,5 +50,104 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
|
|
|
54
50
|
theme: Record<string, any>;
|
|
55
51
|
tag: string;
|
|
56
52
|
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
53
|
+
VueDatePicker: {
|
|
54
|
+
new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('vue').ExtractPropTypes<string[]> | import('vue').ExtractPropTypes<import('vue').ComponentObjectPropsOptions<import('@vuepic/vue-datepicker').VueDatePickerProps>>> & {
|
|
55
|
+
onFocus?: (...args: any[]) => any;
|
|
56
|
+
onBlur?: (...args: any[]) => any;
|
|
57
|
+
onOpen?: (...args: any[]) => any;
|
|
58
|
+
"onUpdate:model-value"?: (...args: any[]) => any;
|
|
59
|
+
"onUpdate:model-timezone-value"?: (...args: any[]) => any;
|
|
60
|
+
"onText-submit"?: (...args: any[]) => any;
|
|
61
|
+
onClosed?: (...args: any[]) => any;
|
|
62
|
+
onCleared?: (...args: any[]) => any;
|
|
63
|
+
"onInternal-model-change"?: (...args: any[]) => any;
|
|
64
|
+
"onRecalculate-position"?: (...args: any[]) => any;
|
|
65
|
+
"onFlow-step"?: (...args: any[]) => any;
|
|
66
|
+
"onUpdate-month-year"?: (...args: any[]) => any;
|
|
67
|
+
"onInvalid-select"?: (...args: any[]) => any;
|
|
68
|
+
"onTooltip-open"?: (...args: any[]) => any;
|
|
69
|
+
"onTooltip-close"?: (...args: any[]) => any;
|
|
70
|
+
"onInvalid-fixed-range"?: (...args: any[]) => any;
|
|
71
|
+
"onTime-picker-open"?: (...args: any[]) => any;
|
|
72
|
+
"onTime-picker-close"?: (...args: any[]) => any;
|
|
73
|
+
"onAm-pm-change"?: (...args: any[]) => any;
|
|
74
|
+
"onRange-start"?: (...args: any[]) => any;
|
|
75
|
+
"onRange-end"?: (...args: any[]) => any;
|
|
76
|
+
"onDate-update"?: (...args: any[]) => any;
|
|
77
|
+
"onInvalid-date"?: (...args: any[]) => any;
|
|
78
|
+
"onOverlay-toggle"?: (...args: any[]) => any;
|
|
79
|
+
"onText-input"?: (...args: any[]) => any;
|
|
80
|
+
}, {}, {}, import('vue').ComputedOptions, import('@vuepic/vue-datepicker').PublicMethods, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, import('@vuepic/vue-datepicker').EmitEvents[], import('@vuepic/vue-datepicker').VueDatePickerProps, {
|
|
81
|
+
[x: number]: string;
|
|
82
|
+
} | {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
|
|
83
|
+
P: {};
|
|
84
|
+
B: {};
|
|
85
|
+
D: {};
|
|
86
|
+
C: {};
|
|
87
|
+
M: {};
|
|
88
|
+
Defaults: {};
|
|
89
|
+
}, {} & (Readonly<import('vue').ExtractPropTypes<string[]> | import('vue').ExtractPropTypes<import('vue').ComponentObjectPropsOptions<import('@vuepic/vue-datepicker').VueDatePickerProps>>> & {
|
|
90
|
+
onFocus?: (...args: any[]) => any;
|
|
91
|
+
onBlur?: (...args: any[]) => any;
|
|
92
|
+
onOpen?: (...args: any[]) => any;
|
|
93
|
+
"onUpdate:model-value"?: (...args: any[]) => any;
|
|
94
|
+
"onUpdate:model-timezone-value"?: (...args: any[]) => any;
|
|
95
|
+
"onText-submit"?: (...args: any[]) => any;
|
|
96
|
+
onClosed?: (...args: any[]) => any;
|
|
97
|
+
onCleared?: (...args: any[]) => any;
|
|
98
|
+
"onInternal-model-change"?: (...args: any[]) => any;
|
|
99
|
+
"onRecalculate-position"?: (...args: any[]) => any;
|
|
100
|
+
"onFlow-step"?: (...args: any[]) => any;
|
|
101
|
+
"onUpdate-month-year"?: (...args: any[]) => any;
|
|
102
|
+
"onInvalid-select"?: (...args: any[]) => any;
|
|
103
|
+
"onTooltip-open"?: (...args: any[]) => any;
|
|
104
|
+
"onTooltip-close"?: (...args: any[]) => any;
|
|
105
|
+
"onInvalid-fixed-range"?: (...args: any[]) => any;
|
|
106
|
+
"onTime-picker-open"?: (...args: any[]) => any;
|
|
107
|
+
"onTime-picker-close"?: (...args: any[]) => any;
|
|
108
|
+
"onAm-pm-change"?: (...args: any[]) => any;
|
|
109
|
+
"onRange-start"?: (...args: any[]) => any;
|
|
110
|
+
"onRange-end"?: (...args: any[]) => any;
|
|
111
|
+
"onDate-update"?: (...args: any[]) => any;
|
|
112
|
+
"onInvalid-date"?: (...args: any[]) => any;
|
|
113
|
+
"onOverlay-toggle"?: (...args: any[]) => any;
|
|
114
|
+
"onText-input"?: (...args: any[]) => any;
|
|
115
|
+
}), {}, {}, import('vue').ComputedOptions, import('@vuepic/vue-datepicker').PublicMethods, {
|
|
116
|
+
[x: number]: string;
|
|
117
|
+
} | {}>;
|
|
118
|
+
__isFragment?: never;
|
|
119
|
+
__isTeleport?: never;
|
|
120
|
+
__isSuspense?: never;
|
|
121
|
+
} & import('vue').ComponentOptionsBase<Readonly<import('vue').ExtractPropTypes<string[]> | import('vue').ExtractPropTypes<import('vue').ComponentObjectPropsOptions<import('@vuepic/vue-datepicker').VueDatePickerProps>>> & {
|
|
122
|
+
onFocus?: (...args: any[]) => any;
|
|
123
|
+
onBlur?: (...args: any[]) => any;
|
|
124
|
+
onOpen?: (...args: any[]) => any;
|
|
125
|
+
"onUpdate:model-value"?: (...args: any[]) => any;
|
|
126
|
+
"onUpdate:model-timezone-value"?: (...args: any[]) => any;
|
|
127
|
+
"onText-submit"?: (...args: any[]) => any;
|
|
128
|
+
onClosed?: (...args: any[]) => any;
|
|
129
|
+
onCleared?: (...args: any[]) => any;
|
|
130
|
+
"onInternal-model-change"?: (...args: any[]) => any;
|
|
131
|
+
"onRecalculate-position"?: (...args: any[]) => any;
|
|
132
|
+
"onFlow-step"?: (...args: any[]) => any;
|
|
133
|
+
"onUpdate-month-year"?: (...args: any[]) => any;
|
|
134
|
+
"onInvalid-select"?: (...args: any[]) => any;
|
|
135
|
+
"onTooltip-open"?: (...args: any[]) => any;
|
|
136
|
+
"onTooltip-close"?: (...args: any[]) => any;
|
|
137
|
+
"onInvalid-fixed-range"?: (...args: any[]) => any;
|
|
138
|
+
"onTime-picker-open"?: (...args: any[]) => any;
|
|
139
|
+
"onTime-picker-close"?: (...args: any[]) => any;
|
|
140
|
+
"onAm-pm-change"?: (...args: any[]) => any;
|
|
141
|
+
"onRange-start"?: (...args: any[]) => any;
|
|
142
|
+
"onRange-end"?: (...args: any[]) => any;
|
|
143
|
+
"onDate-update"?: (...args: any[]) => any;
|
|
144
|
+
"onInvalid-date"?: (...args: any[]) => any;
|
|
145
|
+
"onOverlay-toggle"?: (...args: any[]) => any;
|
|
146
|
+
"onText-input"?: (...args: any[]) => any;
|
|
147
|
+
}, {}, {}, import('vue').ComputedOptions, import('@vuepic/vue-datepicker').PublicMethods, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, import('@vuepic/vue-datepicker').EmitEvents[], import('@vuepic/vue-datepicker').EmitEvents, {
|
|
148
|
+
[x: number]: string;
|
|
149
|
+
} | {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('@vuepic/vue-datepicker').VueDatePickerProps & (new () => {
|
|
150
|
+
$slots: Readonly<import('@vuepic/vue-datepicker').Slots> & import('@vuepic/vue-datepicker').Slots;
|
|
151
|
+
});
|
|
57
152
|
}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
58
153
|
export default _default;
|
|
@@ -1,10 +1,13 @@
|
|
|
1
|
-
import { computed as r
|
|
2
|
-
import
|
|
3
|
-
import
|
|
1
|
+
import { computed as r } from "vue";
|
|
2
|
+
import a from "@vuepic/vue-datepicker";
|
|
3
|
+
import "@vuepic/vue-datepicker/dist/main.css";
|
|
4
|
+
import { defaultTheme as t, stoneDarkTheme as n, stoneLightTheme as i, marigoldLightTheme as m, greenLightTheme as h, greenDarkTheme as o } from "@kiva/kv-tokens";
|
|
5
|
+
import s from "./KvThemeProvider.js";
|
|
4
6
|
const p = {
|
|
5
7
|
name: "KvDatePicker",
|
|
6
8
|
components: {
|
|
7
|
-
KvThemeProvider:
|
|
9
|
+
KvThemeProvider: s,
|
|
10
|
+
VueDatePicker: a
|
|
8
11
|
},
|
|
9
12
|
inheritAttrs: !1,
|
|
10
13
|
props: {
|
|
@@ -33,15 +36,15 @@ const p = {
|
|
|
33
36
|
case "default":
|
|
34
37
|
return t;
|
|
35
38
|
case "greenDark":
|
|
36
|
-
return s;
|
|
37
|
-
case "greenLight":
|
|
38
39
|
return o;
|
|
40
|
+
case "greenLight":
|
|
41
|
+
return h;
|
|
39
42
|
case "marigoldLight":
|
|
40
43
|
return m;
|
|
41
44
|
case "stoneLight":
|
|
42
|
-
return n;
|
|
43
|
-
case "stoneDark":
|
|
44
45
|
return i;
|
|
46
|
+
case "stoneDark":
|
|
47
|
+
return n;
|
|
45
48
|
default:
|
|
46
49
|
return t;
|
|
47
50
|
}
|
|
@@ -49,10 +52,7 @@ const p = {
|
|
|
49
52
|
},
|
|
50
53
|
data() {
|
|
51
54
|
return {
|
|
52
|
-
|
|
53
|
-
datepickerPromise: null,
|
|
54
|
-
selectedDate: null,
|
|
55
|
-
componentKey: 0
|
|
55
|
+
selectedDate: null
|
|
56
56
|
};
|
|
57
57
|
},
|
|
58
58
|
watch: {
|
|
@@ -63,19 +63,7 @@ const p = {
|
|
|
63
63
|
immediate: !0
|
|
64
64
|
}
|
|
65
65
|
},
|
|
66
|
-
mounted() {
|
|
67
|
-
this.loadDatepicker();
|
|
68
|
-
},
|
|
69
66
|
methods: {
|
|
70
|
-
async loadDatepicker() {
|
|
71
|
-
if (!this.datepickerComponent)
|
|
72
|
-
return this.datepickerPromise ? this.datepickerPromise : (this.datepickerPromise = Promise.all([
|
|
73
|
-
import("@vuepic/vue-datepicker"),
|
|
74
|
-
import("@vuepic/vue-datepicker/dist/main.css")
|
|
75
|
-
]).then(async ([e]) => {
|
|
76
|
-
this.datepickerComponent = a(e.default), await this.$nextTick();
|
|
77
|
-
}), this.datepickerPromise);
|
|
78
|
-
},
|
|
79
67
|
handleDateChange(e) {
|
|
80
68
|
this.selectedDate = e, this.$emit("update:model-value", e), this.$emit("change", e);
|
|
81
69
|
}
|
package/dist/vue/KvSimpleMap.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.kv-simple-map__pan-layer[data-v-
|
|
1
|
+
.kv-simple-map__pan-layer[data-v-0abc47d3]{transform-origin:0 0}.kv-simple-map__control-btn[data-v-0abc47d3]{display:flex;height:2rem;width:2rem;cursor:pointer;align-items:center;justify-content:center;border-radius:.25rem;border-width:.0625rem;--tw-border-opacity: 1;border-color:rgba(var(--border-tertiary),var(--tw-border-opacity, 1));--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));--tw-shadow: 0 1px 4px 0 rgb(0 0 0 / .08);--tw-shadow-colored: 0 1px 4px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.kv-simple-map__control-btn[data-v-0abc47d3]:disabled{cursor:default;opacity:.3}.kv-simple-map__control-btn[data-v-0abc47d3]:hover:not(:disabled){--tw-bg-opacity: 1;background-color:rgba(var(--bg-secondary),var(--tw-bg-opacity, 1))}.kv-simple-map__play-btn[data-v-0abc47d3]{border-radius:500rem}.kv-simple-map__default-popup[data-v-0abc47d3]{white-space:nowrap;border-radius:.5rem;--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1));padding:.5rem 1.5rem;text-align:center;--tw-shadow: 0 1px 4px 0 rgb(0 0 0 / .08);--tw-shadow-colored: 0 1px 4px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow);min-width:80px}.kv-simple-map__popup[data-v-0abc47d3]{height:0;width:0}.kv-simple-map__popup-content[data-v-0abc47d3]{position:absolute;white-space:nowrap}.kv-simple-map__popup--top>.kv-simple-map__popup-content[data-v-0abc47d3]{bottom:var(--kv-simple-map-popup-offset, 4px);left:0;transform:translate(-50%)}.kv-simple-map__popup--bottom>.kv-simple-map__popup-content[data-v-0abc47d3]{top:var(--kv-simple-map-popup-offset, 4px);left:0;transform:translate(-50%)}.kv-simple-map__popup--bottom-right>.kv-simple-map__popup-content[data-v-0abc47d3]{top:var(--kv-simple-map-popup-offset, 4px);left:var(--kv-simple-map-popup-offset, 4px)}.kv-simple-map-popup-enter-active[data-v-0abc47d3],.kv-simple-map-popup-leave-active[data-v-0abc47d3]{transition:opacity .18s ease-out}.kv-simple-map-popup-enter-from[data-v-0abc47d3],.kv-simple-map-popup-leave-to[data-v-0abc47d3]{opacity:0}.kv-simple-map-popup-enter-to[data-v-0abc47d3],.kv-simple-map-popup-leave-from[data-v-0abc47d3]{opacity:1}
|
package/dist/vue/KvSimpleMap.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import o from "./KvSimpleMap2.js";
|
|
2
2
|
import "./KvSimpleMap.css";
|
|
3
3
|
import p from "../_virtual/_plugin-vue_export-helper.js";
|
|
4
|
-
const r = /* @__PURE__ */ p(o, [["__scopeId", "data-v-
|
|
4
|
+
const r = /* @__PURE__ */ p(o, [["__scopeId", "data-v-0abc47d3"]]);
|
|
5
5
|
export {
|
|
6
6
|
r as default
|
|
7
7
|
};
|
package/dist/vue/KvSimpleMap2.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { defineComponent as Ue, useSlots as Ye, computed as a, ref as x, watch as Y, onMounted as Xe, onBeforeUnmount as Ge, openBlock as h, createElementBlock as b, normalizeStyle as $, createElementVNode as M, Fragment as qe, renderList as Ke, unref as C, createVNode as L, createCommentVNode as T, Transition as je, withCtx as Je, normalizeClass as Qe, renderSlot as et, toDisplayString as
|
|
1
|
+
import { defineComponent as Ue, useSlots as Ye, computed as a, ref as x, watch as Y, onMounted as Xe, onBeforeUnmount as Ge, openBlock as h, createElementBlock as b, normalizeStyle as $, createElementVNode as M, Fragment as qe, renderList as Ke, unref as C, createVNode as L, createCommentVNode as T, Transition as je, withCtx as Je, normalizeClass as Qe, renderSlot as et, toDisplayString as ie } from "vue";
|
|
2
2
|
import { mdiPlus as tt, mdiMinus as ot, mdiPlay as nt } from "@mdi/js";
|
|
3
3
|
import N from "@kiva/kv-tokens";
|
|
4
4
|
import lt from "../data/simpleMapPaths.js";
|
|
5
5
|
import at from "../data/simpleMapCountryPaths.js";
|
|
6
6
|
import O from "../data/simpleMapCentroids.js";
|
|
7
|
-
import { ALL_COUNTRIES_ISO_MAP as
|
|
7
|
+
import { ALL_COUNTRIES_ISO_MAP as re } from "../data/allCountriesISOMap.js";
|
|
8
8
|
import { useMapTourCycle as ut } from "../utils/useMapTourCycle.js";
|
|
9
9
|
import X from "./KvMaterialIcon.js";
|
|
10
10
|
const it = ["viewBox"], rt = ["d", "fill", "onPointerenter", "onPointerleave"], st = {
|
|
@@ -187,13 +187,13 @@ const it = ["viewBox"], rt = ["d", "fill", "onPointerenter", "onPointerleave"],
|
|
|
187
187
|
fadeDuration: { type: Number, default: 500 }
|
|
188
188
|
},
|
|
189
189
|
setup(k) {
|
|
190
|
-
const n = k,
|
|
191
|
-
function
|
|
190
|
+
const n = k, se = Ye(), G = a(() => !!se.popup), E = x(null), r = x(0), w = x(0);
|
|
191
|
+
function ce() {
|
|
192
192
|
return n.height != null ? `${n.height}px` : r.value ? `${r.value / n.aspectRatio}px` : `${100 / n.aspectRatio}%`;
|
|
193
193
|
}
|
|
194
|
-
const
|
|
194
|
+
const pe = a(() => ({
|
|
195
195
|
width: n.width != null ? `${n.width}px` : "100%",
|
|
196
|
-
height:
|
|
196
|
+
height: ce(),
|
|
197
197
|
paddingBottom: n.height != null ? void 0 : `${100 / n.aspectRatio}%`
|
|
198
198
|
}));
|
|
199
199
|
let S = null;
|
|
@@ -203,7 +203,7 @@ const it = ["viewBox"], rt = ["d", "fill", "onPointerenter", "onPointerleave"],
|
|
|
203
203
|
const t = e.getBoundingClientRect();
|
|
204
204
|
r.value = t.width, w.value = t.height;
|
|
205
205
|
}
|
|
206
|
-
const
|
|
206
|
+
const me = a(() => n.countries), fe = a(() => n.loop), A = x(!1), ve = a(() => n.autoplay && !A.value), de = a(() => ({
|
|
207
207
|
initialDelay: n.initialDelay,
|
|
208
208
|
panDuration: n.panDuration,
|
|
209
209
|
holdPerStep: n.holdPerStep,
|
|
@@ -212,11 +212,11 @@ const it = ["viewBox"], rt = ["d", "fill", "onPointerenter", "onPointerleave"],
|
|
|
212
212
|
fadeDuration: n.fadeDuration
|
|
213
213
|
})), {
|
|
214
214
|
panIdx: K,
|
|
215
|
-
highlighted:
|
|
215
|
+
highlighted: ye,
|
|
216
216
|
showPopupIdx: j,
|
|
217
217
|
isRunning: m,
|
|
218
|
-
start:
|
|
219
|
-
} = ut(
|
|
218
|
+
start: xe
|
|
219
|
+
} = ut(me, ve, fe, de.value), f = a(() => r.value ? r.value / R : 1), J = a(() => {
|
|
220
220
|
const e = f.value, t = D * e;
|
|
221
221
|
return {
|
|
222
222
|
x: 0,
|
|
@@ -224,19 +224,19 @@ const it = ["viewBox"], rt = ["d", "fill", "onPointerenter", "onPointerleave"],
|
|
|
224
224
|
scale: e
|
|
225
225
|
};
|
|
226
226
|
});
|
|
227
|
-
function
|
|
227
|
+
function he(e) {
|
|
228
228
|
return e.cx != null && e.cy != null ? { cx: e.cx, cy: e.cy } : O[e.id] ?? null;
|
|
229
229
|
}
|
|
230
|
-
const
|
|
230
|
+
const be = a(() => {
|
|
231
231
|
const l = Math.max(0, Math.min(1, (r.value - 320) / 880));
|
|
232
232
|
return n.zoomFactor * (1.4 - l * (1.4 - 1));
|
|
233
|
-
}),
|
|
233
|
+
}), we = a(() => {
|
|
234
234
|
if (K.value < 0) return null;
|
|
235
235
|
const e = n.countries[K.value];
|
|
236
236
|
if (!e) return null;
|
|
237
|
-
const t =
|
|
237
|
+
const t = he(e);
|
|
238
238
|
if (!t) return null;
|
|
239
|
-
const o = f.value *
|
|
239
|
+
const o = f.value * be.value;
|
|
240
240
|
let l = o;
|
|
241
241
|
const u = O[e.id];
|
|
242
242
|
if (u) {
|
|
@@ -252,7 +252,7 @@ const it = ["viewBox"], rt = ["d", "fill", "onPointerenter", "onPointerleave"],
|
|
|
252
252
|
y: w.value / 2 - t.cy * i,
|
|
253
253
|
scale: i
|
|
254
254
|
};
|
|
255
|
-
}), c = x({ x: 0, y: 0, scale: 1 }), B = x(!1), Q = x(!1), Z = x(!1),
|
|
255
|
+
}), c = x({ x: 0, y: 0, scale: 1 }), B = x(!1), Q = x(!1), Z = x(!1), ee = a(() => {
|
|
256
256
|
if (!n.fitToCountries || !n.countries.length || !r.value || !w.value) return null;
|
|
257
257
|
let e = 1 / 0, t = 1 / 0, o = -1 / 0, l = -1 / 0;
|
|
258
258
|
if (n.countries.forEach((p) => {
|
|
@@ -262,8 +262,8 @@ const it = ["viewBox"], rt = ["d", "fill", "onPointerenter", "onPointerleave"],
|
|
|
262
262
|
}
|
|
263
263
|
const y = O[p.id];
|
|
264
264
|
if (!y) return;
|
|
265
|
-
const
|
|
266
|
-
|
|
265
|
+
const ae = 2 * y.cx - y.xMax, ue = 2 * y.cy - y.yMax;
|
|
266
|
+
ae < e && (e = ae), ue < t && (t = ue), y.xMax > o && (o = y.xMax), y.yMax > l && (l = y.yMax);
|
|
267
267
|
}), !Number.isFinite(e)) return null;
|
|
268
268
|
const u = Math.max(0, n.fitPadding), s = Math.max(1, o - e) * (1 + u * 2), i = Math.max(1, l - t) * (1 + u * 2), d = Math.min(r.value / s, w.value / i), V = f.value * n.minZoom, I = f.value * n.maxZoom, U = Math.max(V, Math.min(I, d)), We = (e + o) / 2, Ve = (t + l) / 2;
|
|
269
269
|
return {
|
|
@@ -271,7 +271,7 @@ const it = ["viewBox"], rt = ["d", "fill", "onPointerenter", "onPointerleave"],
|
|
|
271
271
|
y: w.value / 2 - Ve * U,
|
|
272
272
|
scale: U
|
|
273
273
|
};
|
|
274
|
-
}), ge = a(() =>
|
|
274
|
+
}), ge = a(() => ee.value ?? J.value), F = a(() => m.value ? we.value ?? ee.value ?? J.value : c.value);
|
|
275
275
|
Y(ge, (e) => {
|
|
276
276
|
m.value || Z.value || (c.value = e);
|
|
277
277
|
}, { immediate: !0 }), Y(() => n.countries, () => {
|
|
@@ -294,12 +294,12 @@ const it = ["viewBox"], rt = ["d", "fill", "onPointerenter", "onPointerleave"],
|
|
|
294
294
|
return n.countries.forEach((t) => e.set(t.id, t)), e;
|
|
295
295
|
});
|
|
296
296
|
function _e(e) {
|
|
297
|
-
return H.value.has(e) || !!
|
|
297
|
+
return H.value.has(e) || !!re[e];
|
|
298
298
|
}
|
|
299
299
|
function z(e) {
|
|
300
300
|
return _e(e);
|
|
301
301
|
}
|
|
302
|
-
const P = N.colors["eco-green"], Ce = [P[1], P[2], P[3], P[4]],
|
|
302
|
+
const P = N.colors["eco-green"], Ce = [P[1], P[2], P[3], P[4]], te = a(() => n.highlightColor ?? P.DEFAULT), ke = a(() => n.baseColor ?? N.colors.gray[200]), Se = N.colors.gray[300];
|
|
303
303
|
function Pe(e) {
|
|
304
304
|
if (e == null || e < n.loanCountTiers[0]) return null;
|
|
305
305
|
for (let t = n.loanCountTiers.length - 1; t >= 0; t -= 1)
|
|
@@ -314,7 +314,7 @@ const it = ["viewBox"], rt = ["d", "fill", "onPointerenter", "onPointerleave"],
|
|
|
314
314
|
}
|
|
315
315
|
function Te(e) {
|
|
316
316
|
const t = H.value.get(e), o = t ? Pe(t.loanCount) : null, l = _.value === e && z(e);
|
|
317
|
-
return
|
|
317
|
+
return ye.value.has(e) ? te.value : l ? o ? te.value : Se : o ?? ke.value;
|
|
318
318
|
}
|
|
319
319
|
function Ne(e) {
|
|
320
320
|
m.value || z(e) && (_.value = e);
|
|
@@ -344,7 +344,7 @@ const it = ["viewBox"], rt = ["d", "fill", "onPointerenter", "onPointerleave"],
|
|
|
344
344
|
yMin: 2 * u - i
|
|
345
345
|
};
|
|
346
346
|
}
|
|
347
|
-
function
|
|
347
|
+
function oe(e) {
|
|
348
348
|
const t = De(e, !0);
|
|
349
349
|
if (!t) return null;
|
|
350
350
|
const o = F.value, l = { "--kv-simple-map-popup-offset": `${n.popupOffset}px` };
|
|
@@ -367,20 +367,20 @@ const it = ["viewBox"], rt = ["d", "fill", "onPointerenter", "onPointerleave"],
|
|
|
367
367
|
}
|
|
368
368
|
};
|
|
369
369
|
}
|
|
370
|
-
function
|
|
370
|
+
function ne(e) {
|
|
371
371
|
return !!e.name || e.loanCount != null;
|
|
372
372
|
}
|
|
373
373
|
const v = a(() => {
|
|
374
374
|
if (m.value && j.value >= 0) {
|
|
375
375
|
const e = n.countries[j.value];
|
|
376
|
-
if (!e || !G.value && !
|
|
377
|
-
const t =
|
|
376
|
+
if (!e || !G.value && !ne(e)) return null;
|
|
377
|
+
const t = oe(e);
|
|
378
378
|
return t ? { country: e, ...t } : null;
|
|
379
379
|
}
|
|
380
380
|
if (!m.value && _.value) {
|
|
381
|
-
const e = _.value, t = H.value.get(e) ?? { id: e, name:
|
|
382
|
-
if (!G.value && !
|
|
383
|
-
const o =
|
|
381
|
+
const e = _.value, t = H.value.get(e) ?? { id: e, name: re[e] };
|
|
382
|
+
if (!G.value && !ne(t)) return null;
|
|
383
|
+
const o = oe(t);
|
|
384
384
|
return o ? { country: t, ...o } : null;
|
|
385
385
|
}
|
|
386
386
|
return null;
|
|
@@ -409,10 +409,10 @@ const it = ["viewBox"], rt = ["d", "fill", "onPointerenter", "onPointerleave"],
|
|
|
409
409
|
}
|
|
410
410
|
const Ze = a(() => n.autoplay && !m.value);
|
|
411
411
|
function Ie() {
|
|
412
|
-
A.value = !1,
|
|
412
|
+
A.value = !1, xe();
|
|
413
413
|
}
|
|
414
414
|
const Le = a(() => !n.allowDragging || m.value ? "default" : B.value ? "grabbing" : "grab"), Oe = a(() => c.value.scale < f.value * n.maxZoom - 1e-3), Fe = a(() => c.value.scale > f.value * n.minZoom + 1e-3);
|
|
415
|
-
function
|
|
415
|
+
function le(e) {
|
|
416
416
|
const t = c.value, o = f.value * n.minZoom, l = f.value * n.maxZoom, u = Math.min(l, Math.max(o, t.scale + e * f.value));
|
|
417
417
|
if (Math.abs(u - t.scale) < 1e-6) return;
|
|
418
418
|
Z.value = !0;
|
|
@@ -424,10 +424,10 @@ const it = ["viewBox"], rt = ["d", "fill", "onPointerenter", "onPointerleave"],
|
|
|
424
424
|
};
|
|
425
425
|
}
|
|
426
426
|
function He() {
|
|
427
|
-
|
|
427
|
+
le(n.zoomStep);
|
|
428
428
|
}
|
|
429
429
|
function ze() {
|
|
430
|
-
|
|
430
|
+
le(-n.zoomStep);
|
|
431
431
|
}
|
|
432
432
|
return Xe(() => {
|
|
433
433
|
q(), typeof ResizeObserver < "u" && E.value && (S = new ResizeObserver(q), S.observe(E.value)), requestAnimationFrame(() => {
|
|
@@ -441,7 +441,7 @@ const it = ["viewBox"], rt = ["d", "fill", "onPointerenter", "onPointerleave"],
|
|
|
441
441
|
ref_key: "rootRef",
|
|
442
442
|
ref: E,
|
|
443
443
|
class: "kv-simple-map tw-relative tw-block tw-overflow-hidden",
|
|
444
|
-
style: $(
|
|
444
|
+
style: $(pe.value)
|
|
445
445
|
}, [
|
|
446
446
|
M("div", {
|
|
447
447
|
class: "kv-simple-map__clip tw-absolute tw-inset-0 tw-overflow-hidden",
|
|
@@ -526,8 +526,8 @@ const it = ["viewBox"], rt = ["d", "fill", "onPointerenter", "onPointerleave"],
|
|
|
526
526
|
country: v.value.country
|
|
527
527
|
}, () => [
|
|
528
528
|
M("div", vt, [
|
|
529
|
-
v.value.country.name ? (h(), b("div", dt,
|
|
530
|
-
v.value.country.loanCount != null ? (h(), b("div", yt,
|
|
529
|
+
v.value.country.name ? (h(), b("div", dt, ie(v.value.country.name), 1)) : T("", !0),
|
|
530
|
+
v.value.country.loanCount != null ? (h(), b("div", yt, ie(Ee(v.value.country.loanCount)), 1)) : T("", !0)
|
|
531
531
|
])
|
|
532
532
|
], !0)
|
|
533
533
|
])
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kiva/kv-components",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.14.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -125,5 +125,5 @@
|
|
|
125
125
|
"embla-carousel-fade",
|
|
126
126
|
"popper.js"
|
|
127
127
|
],
|
|
128
|
-
"gitHead": "
|
|
128
|
+
"gitHead": "58534a3e0cac0cb884d0be1a66d3375201135c72"
|
|
129
129
|
}
|