@topvisor/ui 1.3.4-0 → 1.3.4
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/.chunks/{core-PgN-H_aP.es.js → core-BB__WDxl.es.js} +5 -5
- package/.chunks/{core-PgN-H_aP.es.js.map → core-BB__WDxl.es.js.map} +1 -1
- package/.chunks/{core-BU_5Yi6z.amd.js → core-D4Sv-IKP.amd.js} +2 -2
- package/.chunks/{core-BU_5Yi6z.amd.js.map → core-D4Sv-IKP.amd.js.map} +1 -1
- package/.chunks/{datepicker-BgLipRW7.amd.js → datepicker-CBzdb_fg.amd.js} +2 -2
- package/.chunks/{datepicker-BgLipRW7.amd.js.map → datepicker-CBzdb_fg.amd.js.map} +1 -1
- package/.chunks/{datepicker-lHzfJ7vE.es.js → datepicker-DNaE4Nvd.es.js} +2 -2
- package/.chunks/{datepicker-lHzfJ7vE.es.js.map → datepicker-DNaE4Nvd.es.js.map} +1 -1
- package/.chunks/{dialog_selectorRegions-6J3xu9IY.amd.js → dialog_selectorRegions-BISzXsyD.amd.js} +2 -2
- package/.chunks/{dialog_selectorRegions-6J3xu9IY.amd.js.map → dialog_selectorRegions-BISzXsyD.amd.js.map} +1 -1
- package/.chunks/{dialog_selectorRegions-Ccsrpo2C.es.js → dialog_selectorRegions-BYuC3Yqz.es.js} +4 -4
- package/.chunks/{dialog_selectorRegions-Ccsrpo2C.es.js.map → dialog_selectorRegions-BYuC3Yqz.es.js.map} +1 -1
- package/.chunks/{dialogs.vue_vue_type_script_setup_true_lang-Bei7eCOi.es.js → dialogs.vue_vue_type_script_setup_true_lang-B9iya2uP.es.js} +2 -2
- package/.chunks/{dialogs.vue_vue_type_script_setup_true_lang-Bei7eCOi.es.js.map → dialogs.vue_vue_type_script_setup_true_lang-B9iya2uP.es.js.map} +1 -1
- package/.chunks/{dialogs.vue_vue_type_script_setup_true_lang-CTzGS920.amd.js → dialogs.vue_vue_type_script_setup_true_lang-YGicBjlC.amd.js} +2 -2
- package/.chunks/{dialogs.vue_vue_type_script_setup_true_lang-CTzGS920.amd.js.map → dialogs.vue_vue_type_script_setup_true_lang-YGicBjlC.amd.js.map} +1 -1
- package/.chunks/{forms-BfDSGwrU.amd.js → forms-DHThMe8-.amd.js} +3 -3
- package/.chunks/{forms-BfDSGwrU.amd.js.map → forms-DHThMe8-.amd.js.map} +1 -1
- package/.chunks/{forms-CuEEAPvm.es.js → forms-EIQ_3SBd.es.js} +5 -5
- package/.chunks/{forms-CuEEAPvm.es.js.map → forms-EIQ_3SBd.es.js.map} +1 -1
- package/.chunks/{listItem.vue_vue_type_script_setup_true_lang-_3WmLmPV.es.js → listItem.vue_vue_type_script_setup_true_lang-CmBz0A7l.es.js} +51 -54
- package/.chunks/{listItem.vue_vue_type_script_setup_true_lang-_3WmLmPV.es.js.map → listItem.vue_vue_type_script_setup_true_lang-CmBz0A7l.es.js.map} +1 -1
- package/.chunks/{listItem.vue_vue_type_script_setup_true_lang-R7J0Cawj.amd.js → listItem.vue_vue_type_script_setup_true_lang-DFQ66WTg.amd.js} +2 -2
- package/.chunks/{listItem.vue_vue_type_script_setup_true_lang-R7J0Cawj.amd.js.map → listItem.vue_vue_type_script_setup_true_lang-DFQ66WTg.amd.js.map} +1 -1
- package/.chunks/{menu.vue_vue_type_style_index_0_lang-Ct0tivnh.es.js → menu.vue_vue_type_style_index_0_lang-Crg7yUFK.es.js} +2 -2
- package/.chunks/{menu.vue_vue_type_style_index_0_lang-Ct0tivnh.es.js.map → menu.vue_vue_type_style_index_0_lang-Crg7yUFK.es.js.map} +1 -1
- package/.chunks/{menu.vue_vue_type_style_index_0_lang-JZ-QwyLO.amd.js → menu.vue_vue_type_style_index_0_lang-pAW8vFcF.amd.js} +2 -2
- package/.chunks/{menu.vue_vue_type_style_index_0_lang-JZ-QwyLO.amd.js.map → menu.vue_vue_type_style_index_0_lang-pAW8vFcF.amd.js.map} +1 -1
- package/.chunks/{notice-DAcU_6aT.amd.js → notice-Bj_A6EZr.amd.js} +2 -2
- package/.chunks/{notice-DAcU_6aT.amd.js.map → notice-Bj_A6EZr.amd.js.map} +1 -1
- package/.chunks/{notice-Aw2dLsyE.es.js → notice-Ci-iQODq.es.js} +2 -2
- package/.chunks/{notice-Aw2dLsyE.es.js.map → notice-Ci-iQODq.es.js.map} +1 -1
- package/.chunks/{page.vue_vue_type_script_setup_true_lang-B4eRUWew.amd.js → page.vue_vue_type_script_setup_true_lang-Bs3U8NAO.amd.js} +2 -2
- package/.chunks/{page.vue_vue_type_script_setup_true_lang-B4eRUWew.amd.js.map → page.vue_vue_type_script_setup_true_lang-Bs3U8NAO.amd.js.map} +1 -1
- package/.chunks/{page.vue_vue_type_script_setup_true_lang-x02Y0eiE.es.js → page.vue_vue_type_script_setup_true_lang-Bz40v24a.es.js} +4 -4
- package/.chunks/{page.vue_vue_type_script_setup_true_lang-x02Y0eiE.es.js.map → page.vue_vue_type_script_setup_true_lang-Bz40v24a.es.js.map} +1 -1
- package/.chunks/popup-Babcz_K9.amd.js +2 -0
- package/.chunks/{popup-JuvnpqC-.amd.js.map → popup-Babcz_K9.amd.js.map} +1 -1
- package/.chunks/{popup-axQQEyIk.es.js → popup-ClYTPlLm.es.js} +10 -10
- package/.chunks/{popup-axQQEyIk.es.js.map → popup-ClYTPlLm.es.js.map} +1 -1
- package/.chunks/{utils-DxMSoFhe.amd.js → utils-BjaB2GZ1.amd.js} +2 -2
- package/.chunks/{utils-DxMSoFhe.amd.js.map → utils-BjaB2GZ1.amd.js.map} +1 -1
- package/.chunks/{utils-BHW-ownM.es.js → utils-CLxr2Yzo.es.js} +2 -2
- package/.chunks/{utils-BHW-ownM.es.js.map → utils-CLxr2Yzo.es.js.map} +1 -1
- package/.chunks/{utils-D1fvioEG.es.js → utils-DY3nA9fg.es.js} +3 -3
- package/.chunks/{utils-D1fvioEG.es.js.map → utils-DY3nA9fg.es.js.map} +1 -1
- package/.chunks/{utils-C9dKr-gR.amd.js → utils-Du1E6K8L.amd.js} +2 -2
- package/.chunks/{utils-C9dKr-gR.amd.js.map → utils-Du1E6K8L.amd.js.map} +1 -1
- package/.chunks/{widgetInput.vue_vue_type_script_setup_true_lang-IWJIVl4_.es.js → widgetInput.vue_vue_type_script_setup_true_lang-5UjYRU5U.es.js} +2 -2
- package/.chunks/widgetInput.vue_vue_type_script_setup_true_lang-5UjYRU5U.es.js.map +1 -0
- package/.chunks/{widgetInput.vue_vue_type_script_setup_true_lang-DVHWVUQM.amd.js → widgetInput.vue_vue_type_script_setup_true_lang-Depb8q1d.amd.js} +2 -2
- package/.chunks/widgetInput.vue_vue_type_script_setup_true_lang-Depb8q1d.amd.js.map +1 -0
- package/assets/core.css +1 -1
- package/charts/charts.amd.js +1 -1
- package/charts/charts.js +1 -1
- package/core/app.amd.js +1 -1
- package/core/app.js +5 -5
- package/dialog/dialog.amd.js +1 -1
- package/dialog/dialog.js +2 -2
- package/forms/forms.amd.js +1 -1
- package/forms/forms.js +1 -1
- package/formsExt/formsExt.amd.js +1 -1
- package/formsExt/formsExt.js +4 -4
- package/layout/layout.amd.js +1 -1
- package/layout/layout.js +1 -1
- package/package.json +1 -1
- package/popup/popup.amd.js +1 -1
- package/popup/popup.amd.js.map +1 -1
- package/popup/popup.js +4 -4
- package/popup/popup.js.map +1 -1
- package/popup/worker.amd.js +1 -1
- package/popup/worker.js +2 -2
- package/project/project.amd.js +1 -1
- package/project/project.js +5 -5
- package/src/components/popup/popup/listItem.vue.d.ts +1 -1
- package/src/components/popup/popup/types.d.ts +2 -1
- package/src/components/popup/popup/{widgetInput.vue.d.ts → widgetInput/widgetInput.vue.d.ts} +1 -1
- package/src/components/popup/popup.d.ts +1 -1
- package/tabsView/tabsView.amd.js +1 -1
- package/tabsView/tabsView.js +2 -2
- package/utils/clipboard.amd.js +1 -1
- package/utils/clipboard.js +1 -1
- package/utils/date.amd.js +1 -1
- package/utils/date.js +1 -1
- package/utils/device.amd.js +1 -1
- package/utils/device.js +1 -1
- package/utils/lodash.amd.js +1 -1
- package/utils/lodash.js +1 -1
- package/utils/price.amd.js +1 -1
- package/utils/price.js +1 -1
- package/utils/searchers.amd.js +1 -1
- package/utils/searchers.js +3 -3
- package/utils/string.amd.js +1 -1
- package/utils/string.js +1 -1
- package/.chunks/popup-JuvnpqC-.amd.js +0 -2
- package/.chunks/widgetInput.vue_vue_type_script_setup_true_lang-DVHWVUQM.amd.js.map +0 -1
- package/.chunks/widgetInput.vue_vue_type_script_setup_true_lang-IWJIVl4_.es.js.map +0 -1
|
@@ -3,10 +3,10 @@
|
|
|
3
3
|
const fileNames = ['../assets/listItem.css'].map(fileName => import.meta.resolve(fileName));
|
|
4
4
|
_autoloadCSSCore.insertCSSLinkToPage(fileNames, true);
|
|
5
5
|
|
|
6
|
-
import { defineComponent as
|
|
7
|
-
import { f as z } from "./forms-
|
|
6
|
+
import { defineComponent as B, onUpdated as D, createElementBlock as n, openBlock as s, Fragment as L, createElementVNode as H, renderSlot as l, ref as P, toRef as k, watch as T, onUnmounted as M, resolveDirective as w, createBlock as $, createCommentVNode as r, unref as N, withCtx as g, Teleport as R, withDirectives as C, toDisplayString as O, createVNode as E, normalizeClass as U, resolveDynamicComponent as A, mergeProps as W } from "vue";
|
|
7
|
+
import { f as z } from "./forms-EIQ_3SBd.es.js";
|
|
8
8
|
import { TopPopupWorker as b } from "../popup/worker.js";
|
|
9
|
-
const F = /* @__PURE__ */
|
|
9
|
+
const F = /* @__PURE__ */ B({
|
|
10
10
|
__name: "opener",
|
|
11
11
|
props: {
|
|
12
12
|
id: {},
|
|
@@ -17,22 +17,22 @@ const F = /* @__PURE__ */ $({
|
|
|
17
17
|
data: {}
|
|
18
18
|
},
|
|
19
19
|
setup(c) {
|
|
20
|
-
const
|
|
20
|
+
const t = c, a = t.id || Math.random() + "";
|
|
21
21
|
let p;
|
|
22
|
-
function
|
|
22
|
+
function y(o) {
|
|
23
23
|
setTimeout(() => {
|
|
24
|
-
p =
|
|
24
|
+
p = o.nextElementSibling, p && i(p);
|
|
25
25
|
});
|
|
26
26
|
}
|
|
27
27
|
D(() => {
|
|
28
28
|
p && i(p);
|
|
29
29
|
});
|
|
30
|
-
function i(
|
|
31
|
-
|
|
30
|
+
function i(o) {
|
|
31
|
+
o.dataset.topPopup = "#" + a, o.dataset.topPopupId = a, o.dataset.topPopupPos = t.pos, o.dataset.topPopupPosBy = t.posBy, o.dataset.topPopupNotch = t.notch ? "true" : "", o.dataset.topPopupOpenByHover = t.openByHover ? "true" : "", o.__TopPopupOpenerProps = t;
|
|
32
32
|
}
|
|
33
|
-
return (
|
|
34
|
-
H("template", { ref:
|
|
35
|
-
|
|
33
|
+
return (o, f) => (s(), n(L, null, [
|
|
34
|
+
H("template", { ref: y }),
|
|
35
|
+
l(o.$slots, "default")
|
|
36
36
|
], 64));
|
|
37
37
|
}
|
|
38
38
|
}), j = {
|
|
@@ -50,7 +50,7 @@ const F = /* @__PURE__ */ $({
|
|
|
50
50
|
}, K = {
|
|
51
51
|
key: 4,
|
|
52
52
|
class: "top-popup_footer"
|
|
53
|
-
}, Q = ["href"], ee = /* @__PURE__ */
|
|
53
|
+
}, Q = ["href"], ee = /* @__PURE__ */ B({
|
|
54
54
|
__name: "popup",
|
|
55
55
|
props: {
|
|
56
56
|
id: { default: "" },
|
|
@@ -64,18 +64,18 @@ const F = /* @__PURE__ */ $({
|
|
|
64
64
|
data: {}
|
|
65
65
|
},
|
|
66
66
|
emits: ["open", "close", "scrollContentList"],
|
|
67
|
-
setup(c, { expose:
|
|
68
|
-
const p = c,
|
|
67
|
+
setup(c, { expose: t, emit: a }) {
|
|
68
|
+
const p = c, y = a, i = p.id || "top-popup-id-" + Math.random(), o = {
|
|
69
69
|
id: i,
|
|
70
70
|
popup: void 0
|
|
71
71
|
};
|
|
72
|
-
o
|
|
72
|
+
t(o);
|
|
73
73
|
const f = P(null), h = P(null), u = P(), m = {
|
|
74
74
|
onOpen: async (e) => {
|
|
75
|
-
e.elPopup && (f.value = e.elPopup), e.elPopupInner && (e.elPopupInner.innerText = "", h.value = e.elPopupInner), m.opened = !0, m.popup = e,
|
|
75
|
+
e.elPopup && (f.value = e.elPopup), e.elPopupInner && (e.elPopupInner.innerText = "", h.value = e.elPopupInner), m.opened = !0, m.popup = e, o.popup = e, u.value = e.el.__TopPopupOpenerProps.data, y("open", { elPopup: e.elPopup, elPopupOpener: e.el, data: u.value });
|
|
76
76
|
},
|
|
77
77
|
onClose: (e) => {
|
|
78
|
-
h.value = null, m.opened = !1, m.popup = void 0, u.value = void 0,
|
|
78
|
+
h.value = null, m.opened = !1, m.popup = void 0, u.value = void 0, y("close", { elPopup: e.elPopup, elPopupOpener: e.el, data: e.el.__TopPopupOpenerProps.data });
|
|
79
79
|
},
|
|
80
80
|
classRef: k(p, "class"),
|
|
81
81
|
opened: !1,
|
|
@@ -84,14 +84,14 @@ const F = /* @__PURE__ */ $({
|
|
|
84
84
|
};
|
|
85
85
|
return T(() => p.class, (e, d) => {
|
|
86
86
|
if (!f.value) return;
|
|
87
|
-
const
|
|
88
|
-
f.value.classList.remove(...
|
|
87
|
+
const v = (e == null ? void 0 : e.split(" ")) ?? [], S = ((d == null ? void 0 : d.split(" ")) ?? []).filter((I) => !v.includes(I));
|
|
88
|
+
f.value.classList.remove(...S), f.value.classList.add(...v);
|
|
89
89
|
}), b.regVueComponent(i, m), M(() => {
|
|
90
90
|
b.unregVueComponent(i);
|
|
91
91
|
}), (e, d) => {
|
|
92
|
-
const
|
|
92
|
+
const v = w("top-scroll-shadow");
|
|
93
93
|
return s(), n(L, null, [
|
|
94
|
-
e.$slots.opener ? (s(),
|
|
94
|
+
e.$slots.opener ? (s(), $(F, {
|
|
95
95
|
key: 0,
|
|
96
96
|
id: N(i),
|
|
97
97
|
pos: e.pos,
|
|
@@ -100,35 +100,35 @@ const F = /* @__PURE__ */ $({
|
|
|
100
100
|
openByHover: e.$core.state.isMobile || e.$core.state.isMobileUA ? !1 : e.openByHover
|
|
101
101
|
}, {
|
|
102
102
|
default: g(() => [
|
|
103
|
-
|
|
103
|
+
l(e.$slots, "opener")
|
|
104
104
|
]),
|
|
105
105
|
_: 3
|
|
106
|
-
}, 8, ["id", "pos", "posBy", "notch", "openByHover"])) :
|
|
107
|
-
h.value ? (s(),
|
|
106
|
+
}, 8, ["id", "pos", "posBy", "notch", "openByHover"])) : r("", !0),
|
|
107
|
+
h.value ? (s(), $(R, {
|
|
108
108
|
key: 1,
|
|
109
109
|
to: h.value
|
|
110
110
|
}, [
|
|
111
111
|
e.$slots.header || e.$core.state.isMobile ? (s(), n("div", j, [
|
|
112
|
-
e.$core.state.isMobile ? (s(), n("span", q, O(e.$i18n.Common.Close), 1)) :
|
|
113
|
-
|
|
114
|
-
])) :
|
|
112
|
+
e.$core.state.isMobile ? (s(), n("span", q, O(e.$i18n.Common.Close), 1)) : r("", !0),
|
|
113
|
+
l(e.$slots, "header", { data: u.value })
|
|
114
|
+
])) : r("", !0),
|
|
115
115
|
e.$slots.widget ? (s(), n("div", G, [
|
|
116
|
-
|
|
117
|
-
])) :
|
|
116
|
+
l(e.$slots, "widget")
|
|
117
|
+
])) : r("", !0),
|
|
118
118
|
e.$slots.content ? C((s(), n("div", J, [
|
|
119
|
-
|
|
119
|
+
l(e.$slots, "content", { data: u.value })
|
|
120
120
|
])), [
|
|
121
|
-
[
|
|
122
|
-
]) :
|
|
121
|
+
[v]
|
|
122
|
+
]) : r("", !0),
|
|
123
123
|
e.$slots.contentList ? C((s(), n("ul", {
|
|
124
124
|
key: 3,
|
|
125
125
|
class: "top-popup_content",
|
|
126
|
-
onScroll: d[0] || (d[0] = (
|
|
126
|
+
onScroll: d[0] || (d[0] = (_) => e.$emit("scrollContentList", _))
|
|
127
127
|
}, [
|
|
128
|
-
|
|
128
|
+
l(e.$slots, "contentList", { data: u.value })
|
|
129
129
|
], 32)), [
|
|
130
|
-
[
|
|
131
|
-
]) :
|
|
130
|
+
[v]
|
|
131
|
+
]) : r("", !0),
|
|
132
132
|
e.$slots.footer || e.footerSupportLink ? (s(), n("div", K, [
|
|
133
133
|
e.footerSupportLink ? (s(), n("a", {
|
|
134
134
|
key: 0,
|
|
@@ -137,14 +137,14 @@ const F = /* @__PURE__ */ $({
|
|
|
137
137
|
target: "_blank"
|
|
138
138
|
}, [
|
|
139
139
|
E(z, { hint: "" })
|
|
140
|
-
], 8, Q)) :
|
|
141
|
-
|
|
142
|
-
])) :
|
|
143
|
-
], 8, ["to"])) :
|
|
140
|
+
], 8, Q)) : r("", !0),
|
|
141
|
+
l(e.$slots, "footer", { data: u.value })
|
|
142
|
+
])) : r("", !0)
|
|
143
|
+
], 8, ["to"])) : r("", !0)
|
|
144
144
|
], 64);
|
|
145
145
|
};
|
|
146
146
|
}
|
|
147
|
-
}), oe = /* @__PURE__ */
|
|
147
|
+
}), oe = /* @__PURE__ */ B({
|
|
148
148
|
inheritAttrs: !1,
|
|
149
149
|
__name: "listItem",
|
|
150
150
|
props: {
|
|
@@ -152,26 +152,23 @@ const F = /* @__PURE__ */ $({
|
|
|
152
152
|
closeByClick: { type: Boolean, default: !0 }
|
|
153
153
|
},
|
|
154
154
|
setup(c) {
|
|
155
|
-
const
|
|
156
|
-
return (
|
|
155
|
+
const t = c;
|
|
156
|
+
return (a, p) => (s(), n("li", {
|
|
157
157
|
class: U({
|
|
158
|
-
"top-popup_liNoSelectable":
|
|
158
|
+
"top-popup_liNoSelectable": t.type !== "button"
|
|
159
159
|
})
|
|
160
160
|
}, [
|
|
161
|
-
(s(),
|
|
161
|
+
(s(), $(A(a.$attrs.href ? "a" : "div"), W({
|
|
162
162
|
class: {
|
|
163
163
|
"top-popup_listItem": !0,
|
|
164
|
-
"top-popup_listItem-
|
|
165
|
-
|
|
166
|
-
a:
|
|
164
|
+
["top-popup_listItem-" + t.type]: !!t.type,
|
|
165
|
+
"top-popup-noCloser": !a.closeByClick,
|
|
166
|
+
a: t.type === "button"
|
|
167
167
|
// оформления кнопки, deprecated
|
|
168
|
-
"top-popup_listItem-title": o.type === "title",
|
|
169
|
-
"top-popup_listItem-delimiter": o.type === "delimiter",
|
|
170
|
-
"top-popup-noCloser": !l.closeByClick
|
|
171
168
|
}
|
|
172
|
-
},
|
|
169
|
+
}, a.$attrs), {
|
|
173
170
|
default: g(() => [
|
|
174
|
-
|
|
171
|
+
l(a.$slots, "default")
|
|
175
172
|
]),
|
|
176
173
|
_: 3
|
|
177
174
|
}, 16, ["class"]))
|
|
@@ -183,4 +180,4 @@ export {
|
|
|
183
180
|
F as a,
|
|
184
181
|
oe as b
|
|
185
182
|
};
|
|
186
|
-
//# sourceMappingURL=listItem.vue_vue_type_script_setup_true_lang-
|
|
183
|
+
//# sourceMappingURL=listItem.vue_vue_type_script_setup_true_lang-CmBz0A7l.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"listItem.vue_vue_type_script_setup_true_lang-_3WmLmPV.es.js","sources":["../../src/components/popup/popup/opener.vue","../../src/components/popup/popup/popup.vue","../../src/components/popup/popup/listItem.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T extends Record<string, any> | undefined = undefined\">\nimport { onUpdated } from 'vue';\nimport type { OpenerProps } from './types';\n\nconst props = withDefaults(defineProps<OpenerProps<T>>(), {\n\tpos: '3',\n\tnotch: true,\n\tposBy: 'fixed',\n});\n\nconst id = props.id || Math.random() + '';\n\nlet elOpener: Element;\n\n/**\n * Необычная функция для проброски props внутрь элемента слота\n *\n * @param el - вспомогательный элемент для доступа к элементам слота\n */\nfunction render(el: any) {\n\tsetTimeout(() => {\n\t\telOpener = el.nextElementSibling;\n\n\t\tif (elOpener) {\n\t\t\trenderOpener(elOpener);\n\t\t}\n\t});\n}\n\nonUpdated(() => {\n\tif (elOpener) {\n\t\trenderOpener(elOpener);\n\t}\n});\n\nfunction renderOpener(elOpener: any) {\n\t/**\n\t * topPopup - необходимый атрибут для всез Popup\n\t *\n\t * Для Vue вместо него используется атрибут topPopupId\n\t */\n\telOpener.dataset.topPopup = '#' + id;\n\n\telOpener.dataset.topPopupId = id;\n\telOpener.dataset.topPopupPos = props.pos;\n\telOpener.dataset.topPopupPosBy = props.posBy;\n\telOpener.dataset.topPopupNotch = props.notch ? 'true' : '';\n\telOpener.dataset.topPopupOpenByHover = props.openByHover ? 'true' : '';\n\telOpener.__TopPopupOpenerProps = props;\n}\n</script>\n\n<template>\n\t<template :ref=\"render\"></template>\n\n\t<!-- @slot элемент для открытия Popup -->\n\t<slot></slot>\n</template>\n\n<!-- Использует общий deprecated класс .btn -->\n<style>\nh3[data-top-popup],\ndiv[data-top-popup],\ni[data-top-popup]:not(.btn),\nb[data-top-popup]:not(.btn) {\n\tcursor: pointer;\n\tuser-select: none;\n\tfont-style: normal;\n\ttext-decoration: none;\n\tdisplay: inline-flex;\n\talign-items: center;\n}\n\n[data-top-popup][data-top-popup-disabled] {\n\tpointer-events: none;\n\tcursor: auto !important;\n}\n\ni[contenteditable] {\n\tcursor: text !important;\n}\n</style>\n","<script setup lang=\"ts\" generic=\"T extends Record<string, any> | undefined = undefined\">\nimport { onUnmounted, ref, toRef, watch } from 'vue';\nimport TopHint from '@/components/forms/hint/hint.vue';\nimport type { TopLibPopup } from '@/components/popup/lib/popup';\nimport type { Emits, Props } from './types';\nimport Opener from './opener.vue';\nimport Worker from '@/components/popup/lib/worker';\n\nconst props = withDefaults(defineProps<Props<T>>(), {\n\tid: '',\n\tpos: '3',\n\tnotch: true,\n\tposBy: 'fixed',\n});\n\nconst emit = defineEmits<Emits<T>>();\n\nconst id = props.id || 'top-popup-id-' + Math.random() + '';\n\nconst expose = {\n\tid,\n\tpopup: undefined as TopLibPopup<T> | undefined,\n};\n\ndefineExpose(expose);\n\nconst elPopupRef = ref<HTMLElement | null>(null);\nconst elPopupInnerRef = ref<HTMLElement | null>(null);\n\nconst data = ref<T>();\n\n// см. lib/popup\nconst onOpen = async (popup: TopLibPopup<T>) => {\n\tif (popup.elPopup) elPopupRef.value = popup.elPopup;\n\n\tif (popup.elPopupInner) {\n\t\tpopup.elPopupInner.innerText = '';\n\n\t\telPopupInnerRef.value = popup.elPopupInner;\n\t}\n\n\tvueConnector.opened = true;\n\tvueConnector.popup = popup;\n\n\texpose.popup = popup;\n\n\tdata.value = popup.el.__TopPopupOpenerProps.data;\n\n\temit('open', { elPopup: popup.elPopup!, elPopupOpener: popup.el, data: data.value });\n};\n\n// см. lib/popup\nconst onClose = (popup: TopLibPopup<T>) => {\n\telPopupInnerRef.value = null;\n\n\tvueConnector.opened = false;\n\tvueConnector.popup = undefined;\n\n\tdata.value = undefined;\n\n\temit('close', { elPopup: popup.elPopup!, elPopupOpener: popup.el, data: popup.el.__TopPopupOpenerProps.data });\n};\n\nconst vueConnector = {\n\tonOpen,\n\tonClose,\n\tclassRef: toRef(props, 'class'),\n\topened: false,\n\tpopup: undefined as TopLibPopup<T> | undefined,\n\ttransitionDurationRef: toRef(props, 'transitionDuration'),\n};\n\nwatch(() => props.class, (newValue, oldValue) => {\n\tif (!elPopupRef.value) return;\n\n\tconst newClasses = newValue?.split(' ') ?? [];\n\tconst oldClasses = oldValue?.split(' ') ?? [];\n\n\tconst delClasses = oldClasses.filter((oldClass) => !newClasses.includes(oldClass));\n\n\telPopupRef.value.classList.remove(...delClasses);\n\telPopupRef.value.classList.add(...newClasses);\n});\n\nWorker.regVueComponent(id, vueConnector);\n\nonUnmounted(() => {\n\tWorker.unregVueComponent(id);\n});\n</script>\n\n<template>\n\t<Opener\n\t\tv-if=\"$slots.opener\"\n\t\t:id=\"id\"\n\t\t:pos=\"pos\"\n\t\t:posBy=\"posBy\"\n\t\t:notch=\"notch\"\n\t\t:openByHover=\"($core.state.isMobile || $core.state.isMobileUA) ? false : openByHover\"\n\t>\n\t\t<!-- @slot элемент для открытия Popup -->\n\t\t<slot name=\"opener\"></slot>\n\t</Opener>\n\n\t<!-- Это шаблон для компонента Popup, сам Popup генерируется в js и может находиться где угодно -->\n\t<!-- elPopupInnerRef будет установлен только после открытия и будет сброшен сразу после закрытия Popup -->\n\t<teleport\n\t\tv-if=\"elPopupInnerRef\"\n\t\t:to=\"elPopupInnerRef\"\n\t>\n\t\t<div\n\t\t\tv-if=\"$slots.header || $core.state.isMobile\"\n\t\t\tclass=\"top-popup_header\"\n\t\t>\n\t\t\t<span\n\t\t\t\tv-if=\"$core.state.isMobile\"\n\t\t\t\tclass=\"top-as-a closer\"\n\t\t\t>\n\t\t\t\t{{ $i18n.Common.Close }}\n\t\t\t</span>\n\n\t\t\t<!-- @slot Шапка -->\n\t\t\t<slot name=\"header\" :data=\"data\"></slot>\n\t\t</div>\n\n\t\t<div\n\t\t\tv-if=\"$slots.widget\"\n\t\t\tclass=\"top-popup_widget\"\n\t\t>\n\t\t\t<!-- @slot Виджет -->\n\t\t\t<slot name=\"widget\"></slot>\n\t\t</div>\n\n\t\t<div\n\t\t\tv-if=\"$slots.content\"\n\t\t\tclass=\"top-popup_content\"\n\t\t\tv-top-scroll-shadow\n\t\t>\n\t\t\t<!-- @slot Контент в свободной форме -->\n\t\t\t<slot name=\"content\" :data=\"data\"></slot>\n\t\t</div>\n\n\t\t<ul\n\t\t\tv-if=\"$slots.contentList\"\n\t\t\tclass=\"top-popup_content\"\n\t\t\t@scroll=\"$emit('scrollContentList', $event)\"\n\t\t\tv-top-scroll-shadow\n\t\t>\n\t\t\t<!-- @slot Контент в виде списка, для вставки элементов списка используйте компонент popup/listItem -->\n\t\t\t<slot name=\"contentList\" :data=\"data\"></slot>\n\t\t</ul>\n\n\t\t<div\n\t\t\tv-if=\"$slots.footer || footerSupportLink\"\n\t\t\tclass=\"top-popup_footer\"\n\t\t>\n\t\t\t<a\n\t\t\t\tv-if=\"footerSupportLink\"\n\t\t\t\tclass=\"top-popup_footerSupportLink\"\n\t\t\t\t:href=\"footerSupportLink\"\n\t\t\t\ttarget=\"_blank\"\n\t\t\t>\n\t\t\t\t<TopHint hint=\"\"/>\n\t\t\t</a>\n\n\t\t\t<!-- @slot Футер -->\n\t\t\t<slot name=\"footer\" :data=\"data\"></slot>\n\t\t</div>\n\t</teleport>\n</template>\n\n<style>\n.top-popup_footerSupportLink {\n\tmargin-right: auto;\n}\n</style>\n","<script setup lang=\"ts\">\nimport type { ListItemProps } from './types';\n\ndefineOptions({\n\tinheritAttrs: false,\n});\n\nconst props = withDefaults(defineProps<ListItemProps>(), {\n\ttype: 'button',\n\tcloseByClick: true,\n});\n</script>\n\n<template>\n\t<li\n\t\t:class=\"{\n\t\t'top-popup_liNoSelectable': props.type !== 'button'\n\t}\"\n\t>\n\t\t<component\n\t\t\t:is=\"$attrs.href ? 'a' : 'div'\"\n\t\t\t:class=\"{\n\t\t\t\t'top-popup_listItem': true,\n\t\t\t\t'top-popup_listItem-button': props.type === 'button', // оформления кнопки\n\t\t\t\t'a': props.type === 'button', // оформления кнопки, deprecated\n\t\t\t\t'top-popup_listItem-title': props.type === 'title',\n\t\t\t\t'top-popup_listItem-delimiter': props.type === 'delimiter',\n\t\t\t\t'top-popup-noCloser': !closeByClick\n\t\t\t}\"\n\t\t\t:=$attrs\n\t\t>\n\t\t\t<slot></slot>\n\t\t</component>\n\t</li>\n</template>\n"],"names":["props","__props","id","elOpener","render","el","renderOpener","onUpdated","_createElementVNode","_renderSlot","_ctx","emit","__emit","expose","__expose","elPopupRef","ref","elPopupInnerRef","data","vueConnector","popup","toRef","watch","newValue","oldValue","newClasses","delClasses","oldClass","Worker","onUnmounted","$slots","_createBlock","Opener","_unref","pos","posBy","notch","$core","openByHover","_Teleport","_openBlock","_createElementBlock","_hoisted_1","_hoisted_2","_toDisplayString","$i18n","_hoisted_3","_withDirectives","_hoisted_4","_cache","$event","$emit","footerSupportLink","_hoisted_5","_createVNode","TopHint","_normalizeClass","_resolveDynamicComponent","$attrs","_mergeProps","closeByClick"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"listItem.vue_vue_type_script_setup_true_lang-CmBz0A7l.es.js","sources":["../../src/components/popup/popup/opener.vue","../../src/components/popup/popup/popup.vue","../../src/components/popup/popup/listItem.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T extends Record<string, any> | undefined = undefined\">\nimport { onUpdated } from 'vue';\nimport type { OpenerProps } from './types';\n\nconst props = withDefaults(defineProps<OpenerProps<T>>(), {\n\tpos: '3',\n\tnotch: true,\n\tposBy: 'fixed',\n});\n\nconst id = props.id || Math.random() + '';\n\nlet elOpener: Element;\n\n/**\n * Необычная функция для проброски props внутрь элемента слота\n *\n * @param el - вспомогательный элемент для доступа к элементам слота\n */\nfunction render(el: any) {\n\tsetTimeout(() => {\n\t\telOpener = el.nextElementSibling;\n\n\t\tif (elOpener) {\n\t\t\trenderOpener(elOpener);\n\t\t}\n\t});\n}\n\nonUpdated(() => {\n\tif (elOpener) {\n\t\trenderOpener(elOpener);\n\t}\n});\n\nfunction renderOpener(elOpener: any) {\n\t/**\n\t * topPopup - необходимый атрибут для всез Popup\n\t *\n\t * Для Vue вместо него используется атрибут topPopupId\n\t */\n\telOpener.dataset.topPopup = '#' + id;\n\n\telOpener.dataset.topPopupId = id;\n\telOpener.dataset.topPopupPos = props.pos;\n\telOpener.dataset.topPopupPosBy = props.posBy;\n\telOpener.dataset.topPopupNotch = props.notch ? 'true' : '';\n\telOpener.dataset.topPopupOpenByHover = props.openByHover ? 'true' : '';\n\telOpener.__TopPopupOpenerProps = props;\n}\n</script>\n\n<template>\n\t<template :ref=\"render\"></template>\n\n\t<!-- @slot элемент для открытия Popup -->\n\t<slot></slot>\n</template>\n\n<!-- Использует общий deprecated класс .btn -->\n<style>\nh3[data-top-popup],\ndiv[data-top-popup],\ni[data-top-popup]:not(.btn),\nb[data-top-popup]:not(.btn) {\n\tcursor: pointer;\n\tuser-select: none;\n\tfont-style: normal;\n\ttext-decoration: none;\n\tdisplay: inline-flex;\n\talign-items: center;\n}\n\n[data-top-popup][data-top-popup-disabled] {\n\tpointer-events: none;\n\tcursor: auto !important;\n}\n\ni[contenteditable] {\n\tcursor: text !important;\n}\n</style>\n","<script setup lang=\"ts\" generic=\"T extends Record<string, any> | undefined = undefined\">\nimport { onUnmounted, ref, toRef, watch } from 'vue';\nimport TopHint from '@/components/forms/hint/hint.vue';\nimport type { TopLibPopup } from '@/components/popup/lib/popup';\nimport type { Emits, Props } from './types';\nimport Opener from './opener.vue';\nimport Worker from '@/components/popup/lib/worker';\n\nconst props = withDefaults(defineProps<Props<T>>(), {\n\tid: '',\n\tpos: '3',\n\tnotch: true,\n\tposBy: 'fixed',\n});\n\nconst emit = defineEmits<Emits<T>>();\n\nconst id = props.id || 'top-popup-id-' + Math.random() + '';\n\nconst expose = {\n\tid,\n\tpopup: undefined as TopLibPopup<T> | undefined,\n};\n\ndefineExpose(expose);\n\nconst elPopupRef = ref<HTMLElement | null>(null);\nconst elPopupInnerRef = ref<HTMLElement | null>(null);\n\nconst data = ref<T>();\n\n// см. lib/popup\nconst onOpen = async (popup: TopLibPopup<T>) => {\n\tif (popup.elPopup) elPopupRef.value = popup.elPopup;\n\n\tif (popup.elPopupInner) {\n\t\tpopup.elPopupInner.innerText = '';\n\n\t\telPopupInnerRef.value = popup.elPopupInner;\n\t}\n\n\tvueConnector.opened = true;\n\tvueConnector.popup = popup;\n\n\texpose.popup = popup;\n\n\tdata.value = popup.el.__TopPopupOpenerProps.data;\n\n\temit('open', { elPopup: popup.elPopup!, elPopupOpener: popup.el, data: data.value });\n};\n\n// см. lib/popup\nconst onClose = (popup: TopLibPopup<T>) => {\n\telPopupInnerRef.value = null;\n\n\tvueConnector.opened = false;\n\tvueConnector.popup = undefined;\n\n\tdata.value = undefined;\n\n\temit('close', { elPopup: popup.elPopup!, elPopupOpener: popup.el, data: popup.el.__TopPopupOpenerProps.data });\n};\n\nconst vueConnector = {\n\tonOpen,\n\tonClose,\n\tclassRef: toRef(props, 'class'),\n\topened: false,\n\tpopup: undefined as TopLibPopup<T> | undefined,\n\ttransitionDurationRef: toRef(props, 'transitionDuration'),\n};\n\nwatch(() => props.class, (newValue, oldValue) => {\n\tif (!elPopupRef.value) return;\n\n\tconst newClasses = newValue?.split(' ') ?? [];\n\tconst oldClasses = oldValue?.split(' ') ?? [];\n\n\tconst delClasses = oldClasses.filter((oldClass) => !newClasses.includes(oldClass));\n\n\telPopupRef.value.classList.remove(...delClasses);\n\telPopupRef.value.classList.add(...newClasses);\n});\n\nWorker.regVueComponent(id, vueConnector);\n\nonUnmounted(() => {\n\tWorker.unregVueComponent(id);\n});\n</script>\n\n<template>\n\t<Opener\n\t\tv-if=\"$slots.opener\"\n\t\t:id=\"id\"\n\t\t:pos=\"pos\"\n\t\t:posBy=\"posBy\"\n\t\t:notch=\"notch\"\n\t\t:openByHover=\"($core.state.isMobile || $core.state.isMobileUA) ? false : openByHover\"\n\t>\n\t\t<!-- @slot элемент для открытия Popup -->\n\t\t<slot name=\"opener\"></slot>\n\t</Opener>\n\n\t<!-- Это шаблон для компонента Popup, сам Popup генерируется в js и может находиться где угодно -->\n\t<!-- elPopupInnerRef будет установлен только после открытия и будет сброшен сразу после закрытия Popup -->\n\t<teleport\n\t\tv-if=\"elPopupInnerRef\"\n\t\t:to=\"elPopupInnerRef\"\n\t>\n\t\t<div\n\t\t\tv-if=\"$slots.header || $core.state.isMobile\"\n\t\t\tclass=\"top-popup_header\"\n\t\t>\n\t\t\t<span\n\t\t\t\tv-if=\"$core.state.isMobile\"\n\t\t\t\tclass=\"top-as-a closer\"\n\t\t\t>\n\t\t\t\t{{ $i18n.Common.Close }}\n\t\t\t</span>\n\n\t\t\t<!-- @slot Шапка -->\n\t\t\t<slot name=\"header\" :data=\"data\"></slot>\n\t\t</div>\n\n\t\t<div\n\t\t\tv-if=\"$slots.widget\"\n\t\t\tclass=\"top-popup_widget\"\n\t\t>\n\t\t\t<!-- @slot Виджет -->\n\t\t\t<slot name=\"widget\"></slot>\n\t\t</div>\n\n\t\t<div\n\t\t\tv-if=\"$slots.content\"\n\t\t\tclass=\"top-popup_content\"\n\t\t\tv-top-scroll-shadow\n\t\t>\n\t\t\t<!-- @slot Контент в свободной форме -->\n\t\t\t<slot name=\"content\" :data=\"data\"></slot>\n\t\t</div>\n\n\t\t<ul\n\t\t\tv-if=\"$slots.contentList\"\n\t\t\tclass=\"top-popup_content\"\n\t\t\t@scroll=\"$emit('scrollContentList', $event)\"\n\t\t\tv-top-scroll-shadow\n\t\t>\n\t\t\t<!-- @slot Контент в виде списка, для вставки элементов списка используйте компонент popup/listItem -->\n\t\t\t<slot name=\"contentList\" :data=\"data\"></slot>\n\t\t</ul>\n\n\t\t<div\n\t\t\tv-if=\"$slots.footer || footerSupportLink\"\n\t\t\tclass=\"top-popup_footer\"\n\t\t>\n\t\t\t<a\n\t\t\t\tv-if=\"footerSupportLink\"\n\t\t\t\tclass=\"top-popup_footerSupportLink\"\n\t\t\t\t:href=\"footerSupportLink\"\n\t\t\t\ttarget=\"_blank\"\n\t\t\t>\n\t\t\t\t<TopHint hint=\"\"/>\n\t\t\t</a>\n\n\t\t\t<!-- @slot Футер -->\n\t\t\t<slot name=\"footer\" :data=\"data\"></slot>\n\t\t</div>\n\t</teleport>\n</template>\n\n<style>\n.top-popup_footerSupportLink {\n\tmargin-right: auto;\n}\n</style>\n","<script setup lang=\"ts\">\nimport type { ListItemProps } from './types';\n\ndefineOptions({\n\tinheritAttrs: false,\n});\n\nconst props = withDefaults(defineProps<ListItemProps>(), {\n\ttype: 'button',\n\tcloseByClick: true,\n});\n</script>\n\n<template>\n\t<li\n\t\t:class=\"{\n\t\t'top-popup_liNoSelectable': props.type !== 'button'\n\t}\"\n\t>\n\t\t<component\n\t\t\t:is=\"$attrs.href ? 'a' : 'div'\"\n\t\t\t:class=\"{\n\t\t\t\t'top-popup_listItem': true,\n\t\t\t\t['top-popup_listItem-' + props.type]: !!props.type,\n\t\t\t\t'top-popup-noCloser': !closeByClick,\n\n\t\t\t\t'a': props.type === 'button', // оформления кнопки, deprecated\n\t\t\t}\"\n\t\t\t:=$attrs\n\t\t>\n\t\t\t<slot></slot>\n\t\t</component>\n\t</li>\n</template>\n"],"names":["props","__props","id","elOpener","render","el","renderOpener","onUpdated","_createElementVNode","_renderSlot","_ctx","emit","__emit","expose","__expose","elPopupRef","ref","elPopupInnerRef","data","vueConnector","popup","toRef","watch","newValue","oldValue","newClasses","delClasses","oldClass","Worker","onUnmounted","$slots","_createBlock","Opener","_unref","pos","posBy","notch","$core","openByHover","_Teleport","_openBlock","_createElementBlock","_hoisted_1","_hoisted_2","_toDisplayString","$i18n","_hoisted_3","_withDirectives","_hoisted_4","_cache","$event","$emit","footerSupportLink","_hoisted_5","_createVNode","TopHint","_normalizeClass","_resolveDynamicComponent","$attrs","_mergeProps","closeByClick"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
define(["require","exports","vue","./forms-
|
|
2
|
-
//# sourceMappingURL=listItem.vue_vue_type_script_setup_true_lang-
|
|
1
|
+
define(["require","exports","vue","./forms-DHThMe8-.amd","../popup/worker.amd","../require/css.amd!../assets/listItem.css"],(function(w,B,e,C,k){"use strict";if(typeof e>"u")var e=window.Vue;const v=e.defineComponent({__name:"opener",props:{id:{},pos:{default:"3"},notch:{type:Boolean,default:!0},openByHover:{type:Boolean},posBy:{default:"fixed"},data:{}},setup(i){const n=i,p=n.id||Math.random()+"";let s;function m(t){setTimeout(()=>{s=t.nextElementSibling,s&&l(s)})}e.onUpdated(()=>{s&&l(s)});function l(t){t.dataset.topPopup="#"+p,t.dataset.topPopupId=p,t.dataset.topPopupPos=n.pos,t.dataset.topPopupPosBy=n.posBy,t.dataset.topPopupNotch=n.notch?"true":"",t.dataset.topPopupOpenByHover=n.openByHover?"true":"",t.__TopPopupOpenerProps=n}return(t,c)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("template",{ref:m}),e.renderSlot(t.$slots,"default")],64))}}),h={key:0,class:"top-popup_header"},P={key:0,class:"top-as-a closer"},_={key:1,class:"top-popup_widget"},$={key:2,class:"top-popup_content"},S={key:4,class:"top-popup_footer"},N=["href"],E=e.defineComponent({__name:"popup",props:{id:{default:""},class:{},transitionDuration:{},footerSupportLink:{},pos:{default:"3"},notch:{type:Boolean,default:!0},openByHover:{type:Boolean},posBy:{default:"fixed"},data:{}},emits:["open","close","scrollContentList"],setup(i,{expose:n,emit:p}){const s=i,m=p,l=s.id||"top-popup-id-"+Math.random(),t={id:l,popup:void 0};n(t);const c=e.ref(null),f=e.ref(null),r=e.ref(),u={onOpen:async o=>{o.elPopup&&(c.value=o.elPopup),o.elPopupInner&&(o.elPopupInner.innerText="",f.value=o.elPopupInner),u.opened=!0,u.popup=o,t.popup=o,r.value=o.el.__TopPopupOpenerProps.data,m("open",{elPopup:o.elPopup,elPopupOpener:o.el,data:r.value})},onClose:o=>{f.value=null,u.opened=!1,u.popup=void 0,r.value=void 0,m("close",{elPopup:o.elPopup,elPopupOpener:o.el,data:o.el.__TopPopupOpenerProps.data})},classRef:e.toRef(s,"class"),opened:!1,popup:void 0,transitionDurationRef:e.toRef(s,"transitionDuration")};return e.watch(()=>s.class,(o,a)=>{if(!c.value)return;const d=(o==null?void 0:o.split(" "))??[],L=((a==null?void 0:a.split(" "))??[]).filter(b=>!d.includes(b));c.value.classList.remove(...L),c.value.classList.add(...d)}),k.TopPopupWorker.regVueComponent(l,u),e.onUnmounted(()=>{k.TopPopupWorker.unregVueComponent(l)}),(o,a)=>{const d=e.resolveDirective("top-scroll-shadow");return e.openBlock(),e.createElementBlock(e.Fragment,null,[o.$slots.opener?(e.openBlock(),e.createBlock(v,{key:0,id:e.unref(l),pos:o.pos,posBy:o.posBy,notch:o.notch,openByHover:o.$core.state.isMobile||o.$core.state.isMobileUA?!1:o.openByHover},{default:e.withCtx(()=>[e.renderSlot(o.$slots,"opener")]),_:3},8,["id","pos","posBy","notch","openByHover"])):e.createCommentVNode("",!0),f.value?(e.openBlock(),e.createBlock(e.Teleport,{key:1,to:f.value},[o.$slots.header||o.$core.state.isMobile?(e.openBlock(),e.createElementBlock("div",h,[o.$core.state.isMobile?(e.openBlock(),e.createElementBlock("span",P,e.toDisplayString(o.$i18n.Common.Close),1)):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"header",{data:r.value})])):e.createCommentVNode("",!0),o.$slots.widget?(e.openBlock(),e.createElementBlock("div",_,[e.renderSlot(o.$slots,"widget")])):e.createCommentVNode("",!0),o.$slots.content?e.withDirectives((e.openBlock(),e.createElementBlock("div",$,[e.renderSlot(o.$slots,"content",{data:r.value})])),[[d]]):e.createCommentVNode("",!0),o.$slots.contentList?e.withDirectives((e.openBlock(),e.createElementBlock("ul",{key:3,class:"top-popup_content",onScroll:a[0]||(a[0]=y=>o.$emit("scrollContentList",y))},[e.renderSlot(o.$slots,"contentList",{data:r.value})],32)),[[d]]):e.createCommentVNode("",!0),o.$slots.footer||o.footerSupportLink?(e.openBlock(),e.createElementBlock("div",S,[o.footerSupportLink?(e.openBlock(),e.createElementBlock("a",{key:0,class:"top-popup_footerSupportLink",href:o.footerSupportLink,target:"_blank"},[e.createVNode(C._sfc_main$2,{hint:""})],8,N)):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"footer",{data:r.value})])):e.createCommentVNode("",!0)],8,["to"])):e.createCommentVNode("",!0)],64)}}}),g=e.defineComponent({inheritAttrs:!1,__name:"listItem",props:{type:{default:"button"},closeByClick:{type:Boolean,default:!0}},setup(i){const n=i;return(p,s)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass({"top-popup_liNoSelectable":n.type!=="button"})},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(p.$attrs.href?"a":"div"),e.mergeProps({class:{"top-popup_listItem":!0,["top-popup_listItem-"+n.type]:!!n.type,"top-popup-noCloser":!p.closeByClick,a:n.type==="button"}},p.$attrs),{default:e.withCtx(()=>[e.renderSlot(p.$slots,"default")]),_:3},16,["class"]))],2))}});B._sfc_main=E,B._sfc_main$1=v,B._sfc_main$2=g}));
|
|
2
|
+
//# sourceMappingURL=listItem.vue_vue_type_script_setup_true_lang-DFQ66WTg.amd.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"listItem.vue_vue_type_script_setup_true_lang-
|
|
1
|
+
{"version":3,"file":"listItem.vue_vue_type_script_setup_true_lang-DFQ66WTg.amd.js","sources":["../../src/components/popup/popup/opener.vue","../../src/components/popup/popup/popup.vue","../../src/components/popup/popup/listItem.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T extends Record<string, any> | undefined = undefined\">\nimport { onUpdated } from 'vue';\nimport type { OpenerProps } from './types';\n\nconst props = withDefaults(defineProps<OpenerProps<T>>(), {\n\tpos: '3',\n\tnotch: true,\n\tposBy: 'fixed',\n});\n\nconst id = props.id || Math.random() + '';\n\nlet elOpener: Element;\n\n/**\n * Необычная функция для проброски props внутрь элемента слота\n *\n * @param el - вспомогательный элемент для доступа к элементам слота\n */\nfunction render(el: any) {\n\tsetTimeout(() => {\n\t\telOpener = el.nextElementSibling;\n\n\t\tif (elOpener) {\n\t\t\trenderOpener(elOpener);\n\t\t}\n\t});\n}\n\nonUpdated(() => {\n\tif (elOpener) {\n\t\trenderOpener(elOpener);\n\t}\n});\n\nfunction renderOpener(elOpener: any) {\n\t/**\n\t * topPopup - необходимый атрибут для всез Popup\n\t *\n\t * Для Vue вместо него используется атрибут topPopupId\n\t */\n\telOpener.dataset.topPopup = '#' + id;\n\n\telOpener.dataset.topPopupId = id;\n\telOpener.dataset.topPopupPos = props.pos;\n\telOpener.dataset.topPopupPosBy = props.posBy;\n\telOpener.dataset.topPopupNotch = props.notch ? 'true' : '';\n\telOpener.dataset.topPopupOpenByHover = props.openByHover ? 'true' : '';\n\telOpener.__TopPopupOpenerProps = props;\n}\n</script>\n\n<template>\n\t<template :ref=\"render\"></template>\n\n\t<!-- @slot элемент для открытия Popup -->\n\t<slot></slot>\n</template>\n\n<!-- Использует общий deprecated класс .btn -->\n<style>\nh3[data-top-popup],\ndiv[data-top-popup],\ni[data-top-popup]:not(.btn),\nb[data-top-popup]:not(.btn) {\n\tcursor: pointer;\n\tuser-select: none;\n\tfont-style: normal;\n\ttext-decoration: none;\n\tdisplay: inline-flex;\n\talign-items: center;\n}\n\n[data-top-popup][data-top-popup-disabled] {\n\tpointer-events: none;\n\tcursor: auto !important;\n}\n\ni[contenteditable] {\n\tcursor: text !important;\n}\n</style>\n","<script setup lang=\"ts\" generic=\"T extends Record<string, any> | undefined = undefined\">\nimport { onUnmounted, ref, toRef, watch } from 'vue';\nimport TopHint from '@/components/forms/hint/hint.vue';\nimport type { TopLibPopup } from '@/components/popup/lib/popup';\nimport type { Emits, Props } from './types';\nimport Opener from './opener.vue';\nimport Worker from '@/components/popup/lib/worker';\n\nconst props = withDefaults(defineProps<Props<T>>(), {\n\tid: '',\n\tpos: '3',\n\tnotch: true,\n\tposBy: 'fixed',\n});\n\nconst emit = defineEmits<Emits<T>>();\n\nconst id = props.id || 'top-popup-id-' + Math.random() + '';\n\nconst expose = {\n\tid,\n\tpopup: undefined as TopLibPopup<T> | undefined,\n};\n\ndefineExpose(expose);\n\nconst elPopupRef = ref<HTMLElement | null>(null);\nconst elPopupInnerRef = ref<HTMLElement | null>(null);\n\nconst data = ref<T>();\n\n// см. lib/popup\nconst onOpen = async (popup: TopLibPopup<T>) => {\n\tif (popup.elPopup) elPopupRef.value = popup.elPopup;\n\n\tif (popup.elPopupInner) {\n\t\tpopup.elPopupInner.innerText = '';\n\n\t\telPopupInnerRef.value = popup.elPopupInner;\n\t}\n\n\tvueConnector.opened = true;\n\tvueConnector.popup = popup;\n\n\texpose.popup = popup;\n\n\tdata.value = popup.el.__TopPopupOpenerProps.data;\n\n\temit('open', { elPopup: popup.elPopup!, elPopupOpener: popup.el, data: data.value });\n};\n\n// см. lib/popup\nconst onClose = (popup: TopLibPopup<T>) => {\n\telPopupInnerRef.value = null;\n\n\tvueConnector.opened = false;\n\tvueConnector.popup = undefined;\n\n\tdata.value = undefined;\n\n\temit('close', { elPopup: popup.elPopup!, elPopupOpener: popup.el, data: popup.el.__TopPopupOpenerProps.data });\n};\n\nconst vueConnector = {\n\tonOpen,\n\tonClose,\n\tclassRef: toRef(props, 'class'),\n\topened: false,\n\tpopup: undefined as TopLibPopup<T> | undefined,\n\ttransitionDurationRef: toRef(props, 'transitionDuration'),\n};\n\nwatch(() => props.class, (newValue, oldValue) => {\n\tif (!elPopupRef.value) return;\n\n\tconst newClasses = newValue?.split(' ') ?? [];\n\tconst oldClasses = oldValue?.split(' ') ?? [];\n\n\tconst delClasses = oldClasses.filter((oldClass) => !newClasses.includes(oldClass));\n\n\telPopupRef.value.classList.remove(...delClasses);\n\telPopupRef.value.classList.add(...newClasses);\n});\n\nWorker.regVueComponent(id, vueConnector);\n\nonUnmounted(() => {\n\tWorker.unregVueComponent(id);\n});\n</script>\n\n<template>\n\t<Opener\n\t\tv-if=\"$slots.opener\"\n\t\t:id=\"id\"\n\t\t:pos=\"pos\"\n\t\t:posBy=\"posBy\"\n\t\t:notch=\"notch\"\n\t\t:openByHover=\"($core.state.isMobile || $core.state.isMobileUA) ? false : openByHover\"\n\t>\n\t\t<!-- @slot элемент для открытия Popup -->\n\t\t<slot name=\"opener\"></slot>\n\t</Opener>\n\n\t<!-- Это шаблон для компонента Popup, сам Popup генерируется в js и может находиться где угодно -->\n\t<!-- elPopupInnerRef будет установлен только после открытия и будет сброшен сразу после закрытия Popup -->\n\t<teleport\n\t\tv-if=\"elPopupInnerRef\"\n\t\t:to=\"elPopupInnerRef\"\n\t>\n\t\t<div\n\t\t\tv-if=\"$slots.header || $core.state.isMobile\"\n\t\t\tclass=\"top-popup_header\"\n\t\t>\n\t\t\t<span\n\t\t\t\tv-if=\"$core.state.isMobile\"\n\t\t\t\tclass=\"top-as-a closer\"\n\t\t\t>\n\t\t\t\t{{ $i18n.Common.Close }}\n\t\t\t</span>\n\n\t\t\t<!-- @slot Шапка -->\n\t\t\t<slot name=\"header\" :data=\"data\"></slot>\n\t\t</div>\n\n\t\t<div\n\t\t\tv-if=\"$slots.widget\"\n\t\t\tclass=\"top-popup_widget\"\n\t\t>\n\t\t\t<!-- @slot Виджет -->\n\t\t\t<slot name=\"widget\"></slot>\n\t\t</div>\n\n\t\t<div\n\t\t\tv-if=\"$slots.content\"\n\t\t\tclass=\"top-popup_content\"\n\t\t\tv-top-scroll-shadow\n\t\t>\n\t\t\t<!-- @slot Контент в свободной форме -->\n\t\t\t<slot name=\"content\" :data=\"data\"></slot>\n\t\t</div>\n\n\t\t<ul\n\t\t\tv-if=\"$slots.contentList\"\n\t\t\tclass=\"top-popup_content\"\n\t\t\t@scroll=\"$emit('scrollContentList', $event)\"\n\t\t\tv-top-scroll-shadow\n\t\t>\n\t\t\t<!-- @slot Контент в виде списка, для вставки элементов списка используйте компонент popup/listItem -->\n\t\t\t<slot name=\"contentList\" :data=\"data\"></slot>\n\t\t</ul>\n\n\t\t<div\n\t\t\tv-if=\"$slots.footer || footerSupportLink\"\n\t\t\tclass=\"top-popup_footer\"\n\t\t>\n\t\t\t<a\n\t\t\t\tv-if=\"footerSupportLink\"\n\t\t\t\tclass=\"top-popup_footerSupportLink\"\n\t\t\t\t:href=\"footerSupportLink\"\n\t\t\t\ttarget=\"_blank\"\n\t\t\t>\n\t\t\t\t<TopHint hint=\"\"/>\n\t\t\t</a>\n\n\t\t\t<!-- @slot Футер -->\n\t\t\t<slot name=\"footer\" :data=\"data\"></slot>\n\t\t</div>\n\t</teleport>\n</template>\n\n<style>\n.top-popup_footerSupportLink {\n\tmargin-right: auto;\n}\n</style>\n","<script setup lang=\"ts\">\nimport type { ListItemProps } from './types';\n\ndefineOptions({\n\tinheritAttrs: false,\n});\n\nconst props = withDefaults(defineProps<ListItemProps>(), {\n\ttype: 'button',\n\tcloseByClick: true,\n});\n</script>\n\n<template>\n\t<li\n\t\t:class=\"{\n\t\t'top-popup_liNoSelectable': props.type !== 'button'\n\t}\"\n\t>\n\t\t<component\n\t\t\t:is=\"$attrs.href ? 'a' : 'div'\"\n\t\t\t:class=\"{\n\t\t\t\t'top-popup_listItem': true,\n\t\t\t\t['top-popup_listItem-' + props.type]: !!props.type,\n\t\t\t\t'top-popup-noCloser': !closeByClick,\n\n\t\t\t\t'a': props.type === 'button', // оформления кнопки, deprecated\n\t\t\t}\"\n\t\t\t:=$attrs\n\t\t>\n\t\t\t<slot></slot>\n\t\t</component>\n\t</li>\n</template>\n"],"names":["id","props","elOpener","render","el","renderOpener","elOpener2","vue","_ctx","elPopupRef","elPopupInnerRef","data","popup","vueConnector","expose","delClasses","oldClass","newClasses","popup_worker","pos","posBy","openByHover","_hoisted_2","footerSupportLink","closeByClick"],"mappings":"wXAUAA,EAAAC,EAAA,IAAA,KAAA,OAAA,EAAA,GAEA,IAAAC,EAOA,SAAAC,EAAAC,EAAA,iBAEEF,EAAAE,EAAA,0BAIA,CAAA,0BAOD,CAAA,EAGD,SAAAC,EAAAC,EAAA,0BAQCA,EAAA,QAAA,WAAAN,8DAGAM,EAAA,QAAA,cAAAL,EAAA,MAAA,OAAA,GACAK,EAAA,QAAA,oBAAAL,EAAA,YAAA,OAAA,GACAK,EAAA,sBAAAL,6GAKsBM,EAAA,WAAAC,EAAA,OAAA,SAAA,sfCpCvBR,EAAAC,EAAA,IAAA,gBAAA,KAAA,OAAA,KAEe,GAAAD,EACd,MAAA,aAMD,MAAAS,EAAAF,EAAA,IAAA,IAAA,EACAG,EAAAH,EAAA,IAAA,IAAA,EAEAI,EAAAJ,EAAA,IAAA,KAkCqB,OA/BrB,MAAAK,GAAA,gCAGCA,EAAA,eACCA,EAAA,aAAA,UAAA,GAEAF,EAAA,MAAAE,EAAA,cAGDC,EAAA,OAAA,GACAA,EAAA,MAAAD,EAEAE,EAAA,MAAAF,uGAImF,EAgBnF,QAZDA,GAAA,CACCF,EAAA,MAAA,KAEAG,EAAA,OAAA,GACAA,EAAA,MAAA,OAEAF,EAAA,MAAA,6FAE6G,EAK7G,SAAAJ,EAAA,MAAAN,EAAA,OAAA,yBAGO,sBAAAM,EAAA,MAAAN,EAAA,oBAAA,sCAKP,GAAA,CAAAQ,EAAA,MAAA,iDAKAM,sCAAA,OAAAC,GAAA,CAAAC,EAAA,SAAAD,CAAA,CAAA,4DAG4C,CAAA,EAG7CE,EAAA,eAAA,gBAAAlB,EAAAa,CAAA,qBAGCK,EAAA,eAAA,kBAAAlB,CAAA,CAA2B,CAAA,yLAOrB,IAAAQ,EAAA,IACCW,MAAAA,EAAAA,MACEC,MAAAA,EAAAA,mFAEiEC,EAAAA,wBAG9Cd,EAAA,WAAAC,EAAA,OAAA,QAAA,CAAA,CAAA,mJAOtB,EAAA,sFAeCA,EAAA,MAAA,MAAA,UAAAD,EAAA,UAAA,EAAAA,EAAA,mBAAA,OAAAe,EAAAf,EAAA,gBAAAC,EAAA,MAAA,OAAA,KAAA,EAAA,CAAA,GAAAD,EAAA,mBAAA,GAAA,EAAA,gDAD0B,CAAA,GAAAA,EAAA,mBAAA,GAAA,EAAA,+DAS1BA,EAAA,WAAAC,EAAA,OAAA,QAAA,CADsB,CAAA,GAAAD,EAAA,mBAAA,GAAA,EAAA,iFAUtBA,EAAA,WAAAC,EAAA,OAAA,UAAA,CAAA,KAAAG,EAAA,KAAA,CAAA,CAD2B,CAAA,GAAA,0MAMU,EAAA,uRAanC,KAAAH,EAAA,kBACCe,OAAAA,QACA,EAAA,yHAMuB,CAAA,GAAAhB,EAAA,mBAAA,GAAA,EAAA,mRCvJ1B,2BAAAN,EAAA,OAAA,2GAgBM,MAAA,iEAViF,qBAAA,CAAAO,EAAA,aAAiCgB,EAAAA,EAAAA,OAAAA,QAAkC,cAOvJ,QAAAjB,EAAA,QAAA,IAAA,CAEKA,EAAA,WAAAC,EAAA,OAAA,SAAA,CAAA,CAAA"}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
_autoloadCSSCore.insertCSSLinkToPage(fileNames, true);
|
|
5
5
|
|
|
6
6
|
import { defineComponent as W, mergeModels as w, useModel as b, ref as N, onMounted as S, onUpdated as T, createElementBlock as c, openBlock as u, normalizeClass as K, createCommentVNode as P, Fragment as q, renderList as D, createBlock as Y, mergeProps as h, createSlots as A, withCtx as g, createTextVNode as M, toDisplayString as k, createVNode as $ } from "vue";
|
|
7
|
-
import { c as L, b as x, C as z } from "./forms-
|
|
7
|
+
import { c as L, b as x, C as z } from "./forms-EIQ_3SBd.es.js";
|
|
8
8
|
const F = {
|
|
9
9
|
key: 0,
|
|
10
10
|
class: "top-menu_selectAll"
|
|
@@ -109,4 +109,4 @@ const F = {
|
|
|
109
109
|
export {
|
|
110
110
|
j as _
|
|
111
111
|
};
|
|
112
|
-
//# sourceMappingURL=menu.vue_vue_type_style_index_0_lang-
|
|
112
|
+
//# sourceMappingURL=menu.vue_vue_type_style_index_0_lang-Crg7yUFK.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu.vue_vue_type_style_index_0_lang-Ct0tivnh.es.js","sources":["../../src/components/formsExt/menu/menu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onMounted, onUpdated, ref } from 'vue';\nimport type { Item, Props } from './types';\nimport Core from '@/core/core/core';\nimport { isSafari } from '@/core/utils/device';\nimport TopButton from '@/components/forms/button/button.vue';\n\nconst props = withDefaults(defineProps<Props>(), {\n\tstyling: 'default',\n});\n\nconst model = defineModel({\n\trequired: true,\n});\n\nconst el = ref();\n\n// валидация типа modelValue без возможности выбора нескольких значений (ожидается строка или число)\nif (!props.isMultiple && typeof (model.value) !== 'string' && typeof (model.value) !== 'number') {\n\tconsole.warn('Type check failed for prop \"modelValue\". Expected String: ' + typeof (model.value));\n}\n\n// валидация типа modelValue с возможностью выбора нескольких значений (ожидается массив)\nif (props.isMultiple && !Array.isArray(model.value)) {\n\tconsole.warn('Type check failed for prop \"modelValue\". Expected Array: ' + typeof (model.value));\n}\n\n/**\n * Для множественного выбора без пустого множества\n *\n * Если ничего не выбрано, присваиваем 1-ое значение\n */\nif (props.isMultiple && !props.canBeEmptyMultiple && Array.isArray(model.value) && !model.value.length && props.items[0]) {\n\tmodel.value = [props.items[0]?.href ?? props.items[0]?.value];\n}\n\nconst itemIsActive = (item: Item) => {\n\tif (!Array.isArray(model.value)) {\n\t\treturn item.value === model.value;\n\t}\n\n\treturn model.value.includes(item.value);\n};\n\n/**\n * Выбрать элемент\n * @param item\n * @param toggle - добавить или исключить элемент, для isMultiple\n */\nconst select = (item: Item, toggle = false) => {\n\tif (Array.isArray(model.value)) {\n\t\tlet modelNew = model.value.slice();\n\n\t\tif (toggle) {\n\t\t\tif (!modelNew.length) modelNew = props.items.map(item => item.value);\n\n\t\t\tconst index = modelNew.indexOf(item.value);\n\t\t\tif (index === -1) {\n\t\t\t\tmodelNew.push(item.value);\n\t\t\t} else {\n\t\t\t\tmodelNew.splice(index, 1);\n\t\t\t}\n\t\t} else {\n\t\t\tif (modelNew.length === 1 && modelNew[0] === item.value) {\n\t\t\t\tmodelNew = [];\n\t\t\t} else {\n\t\t\t\tmodelNew = [item.value];\n\t\t\t}\n\t\t}\n\n\t\tif (!props.canBeEmptyMultiple && !modelNew.length) modelNew = [item.value];\n\n\t\tmodel.value = modelNew;\n\n\t\treturn;\n\t}\n\n\tmodel.value = item.value;\n};\n\n// вертикальный скролл в горизонтальный скролл\nconst onWheel = (event: WheelEvent) => {\n\tif (el.value.scrollWidth <= el.value.offsetWidth) return;\n\tif (event.shiftKey) return;\n\tif (Math.abs(event.deltaY) < 50) return; // устройство с высокой точностью, например тачпад\n\n\tevent.preventDefault();\n\n\tconst delta = event.deltaY > 0 ? 30 : -30;\n\tel.value.scrollLeft = el.value.scrollLeft + delta;\n};\n\n/**\n * Замена стандартному scrollIntoView, который меняет скролл документа\n *\n * Выравнивание по ближнему краю элемента\n *\n * Выравнивается таким образом, чтобы был виден соседний элемент\n */\nconst scrollIntoView = (isSmooth = true) => {\n\tconst elBtn = el.value.querySelector('.top-active');\n\tif (!elBtn) return;\n\n\tconst gap = 24;\n\n\t// левая и правая координаты элемента\n\tconst leftMargin = elBtn.offsetLeft - el.value.offsetLeft - gap;\n\tconst rightMargin = elBtn.offsetLeft - el.value.offsetLeft + elBtn.clientWidth + gap;\n\n\t// левая и правая границы видимой части меню\n\tconst leftMarginParent = el.value.scrollLeft;\n\tconst rightMarginParent = el.value.clientWidth + el.value.scrollLeft;\n\n\tlet scrollLeft: number | undefined = undefined;\n\n\t// левую границу элемента к левой границе меню\n\tif (leftMargin < leftMarginParent) scrollLeft = leftMargin;\n\n\t// правую границу элемента к правой границе меню\n\tif (rightMargin > rightMarginParent) scrollLeft = rightMargin - el.value.clientWidth;\n\n\tif (scrollLeft !== undefined) {\n\t\tif (isSafari()) {\n\t\t\tCore.$?.(el.value).animate({ scrollLeft: scrollLeft }, isSmooth ? 200 : 0);\n\t\t} else {\n\t\t\tel.value.scrollTo({ left: scrollLeft, behavior: isSmooth ? 'smooth' : 'auto' });\n\t\t}\n\t}\n};\n\n/**\n * Выбрать все элементы в меню\n */\nconst selectAll = () => {\n\tif (!Array.isArray(model.value)) return;\n\n\tif (model.value.length === props.items.length) {\n\t\tmodel.value = [props.items[0].href ?? props.items[0].value];\n\t\treturn;\n\t}\n\n\tmodel.value = props.items.map(item => item.href ?? item.value);\n};\n\nonMounted(() => scrollIntoView(false));\nonUpdated(() => scrollIntoView(true));\n\n</script>\n\n<template>\n\t<div\n\t\tref=\"el\"\n\t\t:class=\"{\n\t\t\t'top-menu': true,\n\t\t\t['top-style_' + styling]: true,\n\t\t\t// ['top-unwrap-x']: styling === 'default',\n\t\t}\"\n\t\t@wheel=\"onWheel\"\n\t>\n\t\t<TopButton\n\t\t\tv-for=\"item in items\"\n\t\t\t:=\"item\"\n\t\t\tclass=\"top-menu_item\"\n\t\t\tcolor=\"theme\"\n\t\t\t@click=\"select(item, $event.ctrlKey || $event.metaKey)\"\n\t\t\t:isActive=\"itemIsActive(item)\"\n\t\t>\n\t\t\t<template #default v-if=\"item.content\">\n\t\t\t\t{{ item.content }}\n\t\t\t</template>\n\t\t</TopButton>\n\n\t\t<div\n\t\t\tv-if=\"Array.isArray(model) && selectAllItem\"\n\t\t\tclass=\"top-menu_selectAll\"\n\t\t>\n\t\t\t<TopButton\n\t\t\t\t:=\"selectAllItem\"\n\t\t\t\tclass=\"top-menu_item\"\n\t\t\t\tcolor=\"theme\"\n\t\t\t\tstyling=\"\"\n\t\t\t\t@click=\"selectAll()\"\n\t\t\t\t:isActive=\"model.length === items.length\"\n\t\t\t>\n\t\t\t\t<template #default v-if=\"selectAllItem.content\">\n\t\t\t\t\t{{ selectAllItem.content }}\n\t\t\t\t</template>\n\t\t\t</TopButton>\n\t\t</div>\n\t</div>\n</template>\n\n<style>\n.top-menu {\n\t--scroll-thumb-color: var(--color-line-1);\n\t--scroll-thumb-color-hover: var(--color-line-2);\n\t--scroll-thumb-color-active: var(--color-line-3);\n\n\tmax-width: 100%;\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: var(--top-gap-2);\n\toverflow-x: auto;\n\tscrollbar-width: none; /* firefox */\n\n\t/* предотвратить натинвые события браузера (назад / вперед) */\n\toverscroll-behavior-x: contain;\n}\n\n.top-menu::-webkit-scrollbar { display: none; }\n\n.top-menu .top-menu_item {\n\t--top-button-color: var(--color-text-2);\n\n\toutline-offset: -2px !important;\n\tmin-width: 0;\n\tmax-width: 200px;\n\tmargin: 0;\n\tflex-shrink: 0;\n}\n\n.top-menu .top-menu_item[data-top-icon] {\n\t--top-icon-color: var(--color-text-2);\n}\n\n.top-menu_selectAll {\n\tposition: sticky;\n\tright: 0;\n\tbackground: var(--color-layout-front-1);\n\tborder-left: 1px solid var(--color-line-1);\n\tpadding-left: var(--top-padding-1);\n\tbox-shadow: var(--color-layout-front-1) var(--top-padding-2) 0px;\n}\n\n/* style default */\n.top-menu.top-style_default .top-menu_item {\n\t--top-forms-radius: 0;\n\t--top-forms-border-color: transparent;\n\t--top-forms-border-width: 2px;\n\n\tfilter: none;\n\tbox-shadow: none;\n\tborder: none;\n\tborder-bottom: var(--top-forms-border-width) solid var(--top-forms-border-color);\n\tbackground: none;\n}\n\n.top-style_default > .top-menu_item > [data-top-badge] {\n\tmargin-top: 0;\n}\n\n.top-menu.top-style_default .top-menu_item:hover {\n\t--top-icon-color: var(--color-text-1);\n\t--top-button-color: var(--color-text-1);\n\t--top-forms-border-color: var(--color-line-2);\n}\n\n.top-menu.top-style_default .top-menu_item:active,\n.top-menu.top-style_default .top-menu_item.top-active {\n\t--top-icon-color: var(--color-text-primary);\n\t--top-button-color: var(--color-text-1);\n\t--top-forms-border-color: var(--color-line-primary-1);\n}\n\n.top-menu.top-style_default .top-menu_selectAll {\n\tpadding-left: var(--top-padding-2);\n}\n\n/* style bar */\n.top-menu.top-style_bar {\n\tborder-radius: var(--top-radius-3);\n\tborder: 1px solid var(--color-line-2);\n\tpadding: var(--top-padding-1);\n\tgap: 3px;\n}\n.top-menu.top-style_bar .top-menu_item {\n\t--top-button-background-color-hover: var(--color-layer-1);\n\t--top-button-background-color-active: var(--color-layer-2);\n\t--top-button-background-color-selected: var(--color-layer-primary-1);\n\n\tposition: relative;\n}\n\n.top-menu.top-style_bar .top-menu_item:hover {\n\t--top-icon-color: var(--color-text-1);\n\t--top-button-color: var(--color-text-1);\n}\n\n.top-menu.top-style_bar .top-menu_item.top-active {\n\t--top-icon-color: var(--color-text-primary);\n\t--top-button-color: var(--color-text-primary);\n}\n\n/* разделители кнопок в баре */\n.top-menu.top-style_bar .top-menu_item:not(:first-child):not(.top-active):not(:hover):after {\n\tcontent: \"\";\n\tbackground: var(--color-line-1-opacity);\n\twidth: 1px;\n\theight: 60%;\n\tdisplay: block;\n\tposition: absolute;\n\tleft: -2px;\n}\n.top-menu.top-style_bar .top-menu_item.top-active + .top-menu_item:after,\n.top-menu.top-style_bar .top-menu_item:hover + .top-menu_item:after {\n\tcontent: none !important;\n}\n\n/*\n.top-style_bar > .top-menu_item > [data-top-badge] {\n\tmargin-top: -3px;\n}\n*/\n\n/** TODO: .top-unwrap-x надо вынести глобально в UI или добавить в стили для storybook */\n/*\n.top-menu.top-unwrap-x {\n\tpadding-right: var(--top-unwrap-x);\n\tpadding-left: var(--top-unwrap-x);\n\tmargin-right: calc(0px - var(--top-unwrap-x));\n\tmargin-left: calc(0px - var(--top-unwrap-x));\n}\n*/\n</style>\n"],"names":["props","__props","model","_useModel","el","ref","_a","_b","itemIsActive","item","select","toggle","modelNew","index","onWheel","event","delta","scrollIntoView","isSmooth","elBtn","gap","leftMargin","rightMargin","leftMarginParent","rightMarginParent","scrollLeft","isSafari","Core","selectAll","onMounted","onUpdated","_createElementBlock","_normalizeClass","styling","_Fragment","_renderList","items","_createBlock","TopButton","_mergeProps","$event","_createTextVNode","_toDisplayString","selectAllItem","_openBlock","_hoisted_1","_createVNode","_ctx"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"menu.vue_vue_type_style_index_0_lang-Crg7yUFK.es.js","sources":["../../src/components/formsExt/menu/menu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onMounted, onUpdated, ref } from 'vue';\nimport type { Item, Props } from './types';\nimport Core from '@/core/core/core';\nimport { isSafari } from '@/core/utils/device';\nimport TopButton from '@/components/forms/button/button.vue';\n\nconst props = withDefaults(defineProps<Props>(), {\n\tstyling: 'default',\n});\n\nconst model = defineModel({\n\trequired: true,\n});\n\nconst el = ref();\n\n// валидация типа modelValue без возможности выбора нескольких значений (ожидается строка или число)\nif (!props.isMultiple && typeof (model.value) !== 'string' && typeof (model.value) !== 'number') {\n\tconsole.warn('Type check failed for prop \"modelValue\". Expected String: ' + typeof (model.value));\n}\n\n// валидация типа modelValue с возможностью выбора нескольких значений (ожидается массив)\nif (props.isMultiple && !Array.isArray(model.value)) {\n\tconsole.warn('Type check failed for prop \"modelValue\". Expected Array: ' + typeof (model.value));\n}\n\n/**\n * Для множественного выбора без пустого множества\n *\n * Если ничего не выбрано, присваиваем 1-ое значение\n */\nif (props.isMultiple && !props.canBeEmptyMultiple && Array.isArray(model.value) && !model.value.length && props.items[0]) {\n\tmodel.value = [props.items[0]?.href ?? props.items[0]?.value];\n}\n\nconst itemIsActive = (item: Item) => {\n\tif (!Array.isArray(model.value)) {\n\t\treturn item.value === model.value;\n\t}\n\n\treturn model.value.includes(item.value);\n};\n\n/**\n * Выбрать элемент\n * @param item\n * @param toggle - добавить или исключить элемент, для isMultiple\n */\nconst select = (item: Item, toggle = false) => {\n\tif (Array.isArray(model.value)) {\n\t\tlet modelNew = model.value.slice();\n\n\t\tif (toggle) {\n\t\t\tif (!modelNew.length) modelNew = props.items.map(item => item.value);\n\n\t\t\tconst index = modelNew.indexOf(item.value);\n\t\t\tif (index === -1) {\n\t\t\t\tmodelNew.push(item.value);\n\t\t\t} else {\n\t\t\t\tmodelNew.splice(index, 1);\n\t\t\t}\n\t\t} else {\n\t\t\tif (modelNew.length === 1 && modelNew[0] === item.value) {\n\t\t\t\tmodelNew = [];\n\t\t\t} else {\n\t\t\t\tmodelNew = [item.value];\n\t\t\t}\n\t\t}\n\n\t\tif (!props.canBeEmptyMultiple && !modelNew.length) modelNew = [item.value];\n\n\t\tmodel.value = modelNew;\n\n\t\treturn;\n\t}\n\n\tmodel.value = item.value;\n};\n\n// вертикальный скролл в горизонтальный скролл\nconst onWheel = (event: WheelEvent) => {\n\tif (el.value.scrollWidth <= el.value.offsetWidth) return;\n\tif (event.shiftKey) return;\n\tif (Math.abs(event.deltaY) < 50) return; // устройство с высокой точностью, например тачпад\n\n\tevent.preventDefault();\n\n\tconst delta = event.deltaY > 0 ? 30 : -30;\n\tel.value.scrollLeft = el.value.scrollLeft + delta;\n};\n\n/**\n * Замена стандартному scrollIntoView, который меняет скролл документа\n *\n * Выравнивание по ближнему краю элемента\n *\n * Выравнивается таким образом, чтобы был виден соседний элемент\n */\nconst scrollIntoView = (isSmooth = true) => {\n\tconst elBtn = el.value.querySelector('.top-active');\n\tif (!elBtn) return;\n\n\tconst gap = 24;\n\n\t// левая и правая координаты элемента\n\tconst leftMargin = elBtn.offsetLeft - el.value.offsetLeft - gap;\n\tconst rightMargin = elBtn.offsetLeft - el.value.offsetLeft + elBtn.clientWidth + gap;\n\n\t// левая и правая границы видимой части меню\n\tconst leftMarginParent = el.value.scrollLeft;\n\tconst rightMarginParent = el.value.clientWidth + el.value.scrollLeft;\n\n\tlet scrollLeft: number | undefined = undefined;\n\n\t// левую границу элемента к левой границе меню\n\tif (leftMargin < leftMarginParent) scrollLeft = leftMargin;\n\n\t// правую границу элемента к правой границе меню\n\tif (rightMargin > rightMarginParent) scrollLeft = rightMargin - el.value.clientWidth;\n\n\tif (scrollLeft !== undefined) {\n\t\tif (isSafari()) {\n\t\t\tCore.$?.(el.value).animate({ scrollLeft: scrollLeft }, isSmooth ? 200 : 0);\n\t\t} else {\n\t\t\tel.value.scrollTo({ left: scrollLeft, behavior: isSmooth ? 'smooth' : 'auto' });\n\t\t}\n\t}\n};\n\n/**\n * Выбрать все элементы в меню\n */\nconst selectAll = () => {\n\tif (!Array.isArray(model.value)) return;\n\n\tif (model.value.length === props.items.length) {\n\t\tmodel.value = [props.items[0].href ?? props.items[0].value];\n\t\treturn;\n\t}\n\n\tmodel.value = props.items.map(item => item.href ?? item.value);\n};\n\nonMounted(() => scrollIntoView(false));\nonUpdated(() => scrollIntoView(true));\n\n</script>\n\n<template>\n\t<div\n\t\tref=\"el\"\n\t\t:class=\"{\n\t\t\t'top-menu': true,\n\t\t\t['top-style_' + styling]: true,\n\t\t\t// ['top-unwrap-x']: styling === 'default',\n\t\t}\"\n\t\t@wheel=\"onWheel\"\n\t>\n\t\t<TopButton\n\t\t\tv-for=\"item in items\"\n\t\t\t:=\"item\"\n\t\t\tclass=\"top-menu_item\"\n\t\t\tcolor=\"theme\"\n\t\t\t@click=\"select(item, $event.ctrlKey || $event.metaKey)\"\n\t\t\t:isActive=\"itemIsActive(item)\"\n\t\t>\n\t\t\t<template #default v-if=\"item.content\">\n\t\t\t\t{{ item.content }}\n\t\t\t</template>\n\t\t</TopButton>\n\n\t\t<div\n\t\t\tv-if=\"Array.isArray(model) && selectAllItem\"\n\t\t\tclass=\"top-menu_selectAll\"\n\t\t>\n\t\t\t<TopButton\n\t\t\t\t:=\"selectAllItem\"\n\t\t\t\tclass=\"top-menu_item\"\n\t\t\t\tcolor=\"theme\"\n\t\t\t\tstyling=\"\"\n\t\t\t\t@click=\"selectAll()\"\n\t\t\t\t:isActive=\"model.length === items.length\"\n\t\t\t>\n\t\t\t\t<template #default v-if=\"selectAllItem.content\">\n\t\t\t\t\t{{ selectAllItem.content }}\n\t\t\t\t</template>\n\t\t\t</TopButton>\n\t\t</div>\n\t</div>\n</template>\n\n<style>\n.top-menu {\n\t--scroll-thumb-color: var(--color-line-1);\n\t--scroll-thumb-color-hover: var(--color-line-2);\n\t--scroll-thumb-color-active: var(--color-line-3);\n\n\tmax-width: 100%;\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: var(--top-gap-2);\n\toverflow-x: auto;\n\tscrollbar-width: none; /* firefox */\n\n\t/* предотвратить натинвые события браузера (назад / вперед) */\n\toverscroll-behavior-x: contain;\n}\n\n.top-menu::-webkit-scrollbar { display: none; }\n\n.top-menu .top-menu_item {\n\t--top-button-color: var(--color-text-2);\n\n\toutline-offset: -2px !important;\n\tmin-width: 0;\n\tmax-width: 200px;\n\tmargin: 0;\n\tflex-shrink: 0;\n}\n\n.top-menu .top-menu_item[data-top-icon] {\n\t--top-icon-color: var(--color-text-2);\n}\n\n.top-menu_selectAll {\n\tposition: sticky;\n\tright: 0;\n\tbackground: var(--color-layout-front-1);\n\tborder-left: 1px solid var(--color-line-1);\n\tpadding-left: var(--top-padding-1);\n\tbox-shadow: var(--color-layout-front-1) var(--top-padding-2) 0px;\n}\n\n/* style default */\n.top-menu.top-style_default .top-menu_item {\n\t--top-forms-radius: 0;\n\t--top-forms-border-color: transparent;\n\t--top-forms-border-width: 2px;\n\n\tfilter: none;\n\tbox-shadow: none;\n\tborder: none;\n\tborder-bottom: var(--top-forms-border-width) solid var(--top-forms-border-color);\n\tbackground: none;\n}\n\n.top-style_default > .top-menu_item > [data-top-badge] {\n\tmargin-top: 0;\n}\n\n.top-menu.top-style_default .top-menu_item:hover {\n\t--top-icon-color: var(--color-text-1);\n\t--top-button-color: var(--color-text-1);\n\t--top-forms-border-color: var(--color-line-2);\n}\n\n.top-menu.top-style_default .top-menu_item:active,\n.top-menu.top-style_default .top-menu_item.top-active {\n\t--top-icon-color: var(--color-text-primary);\n\t--top-button-color: var(--color-text-1);\n\t--top-forms-border-color: var(--color-line-primary-1);\n}\n\n.top-menu.top-style_default .top-menu_selectAll {\n\tpadding-left: var(--top-padding-2);\n}\n\n/* style bar */\n.top-menu.top-style_bar {\n\tborder-radius: var(--top-radius-3);\n\tborder: 1px solid var(--color-line-2);\n\tpadding: var(--top-padding-1);\n\tgap: 3px;\n}\n.top-menu.top-style_bar .top-menu_item {\n\t--top-button-background-color-hover: var(--color-layer-1);\n\t--top-button-background-color-active: var(--color-layer-2);\n\t--top-button-background-color-selected: var(--color-layer-primary-1);\n\n\tposition: relative;\n}\n\n.top-menu.top-style_bar .top-menu_item:hover {\n\t--top-icon-color: var(--color-text-1);\n\t--top-button-color: var(--color-text-1);\n}\n\n.top-menu.top-style_bar .top-menu_item.top-active {\n\t--top-icon-color: var(--color-text-primary);\n\t--top-button-color: var(--color-text-primary);\n}\n\n/* разделители кнопок в баре */\n.top-menu.top-style_bar .top-menu_item:not(:first-child):not(.top-active):not(:hover):after {\n\tcontent: \"\";\n\tbackground: var(--color-line-1-opacity);\n\twidth: 1px;\n\theight: 60%;\n\tdisplay: block;\n\tposition: absolute;\n\tleft: -2px;\n}\n.top-menu.top-style_bar .top-menu_item.top-active + .top-menu_item:after,\n.top-menu.top-style_bar .top-menu_item:hover + .top-menu_item:after {\n\tcontent: none !important;\n}\n\n/*\n.top-style_bar > .top-menu_item > [data-top-badge] {\n\tmargin-top: -3px;\n}\n*/\n\n/** TODO: .top-unwrap-x надо вынести глобально в UI или добавить в стили для storybook */\n/*\n.top-menu.top-unwrap-x {\n\tpadding-right: var(--top-unwrap-x);\n\tpadding-left: var(--top-unwrap-x);\n\tmargin-right: calc(0px - var(--top-unwrap-x));\n\tmargin-left: calc(0px - var(--top-unwrap-x));\n}\n*/\n</style>\n"],"names":["props","__props","model","_useModel","el","ref","_a","_b","itemIsActive","item","select","toggle","modelNew","index","onWheel","event","delta","scrollIntoView","isSmooth","elBtn","gap","leftMargin","rightMargin","leftMarginParent","rightMarginParent","scrollLeft","isSafari","Core","selectAll","onMounted","onUpdated","_createElementBlock","_normalizeClass","styling","_Fragment","_renderList","items","_createBlock","TopButton","_mergeProps","$event","_createTextVNode","_toDisplayString","selectAllItem","_openBlock","_hoisted_1","_createVNode","_ctx"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
define(["require","exports","vue","./forms-
|
|
2
|
-
//# sourceMappingURL=menu.vue_vue_type_style_index_0_lang-
|
|
1
|
+
define(["require","exports","vue","./forms-DHThMe8-.amd","../require/css.amd!../assets/menu.css"],(function(C,h,e,u){"use strict";if(typeof e>"u")var e=window.Vue;const g={key:0,class:"top-menu_selectAll"},A=e.defineComponent({__name:"menu",props:e.mergeModels({modelValue:{},items:{},isMultiple:{type:Boolean},canBeEmptyMultiple:{type:Boolean},styling:{default:"default"},selectAllItem:{}},{modelValue:{required:!0},modelModifiers:{}}),emits:["update:modelValue"],setup(f){var d,m;const o=f,a=e.useModel(f,"modelValue"),r=e.ref();!o.isMultiple&&typeof a.value!="string"&&typeof a.value!="number"&&console.warn('Type check failed for prop "modelValue". Expected String: '+typeof a.value),o.isMultiple&&!Array.isArray(a.value)&&console.warn('Type check failed for prop "modelValue". Expected Array: '+typeof a.value),o.isMultiple&&!o.canBeEmptyMultiple&&Array.isArray(a.value)&&!a.value.length&&o.items[0]&&(a.value=[((d=o.items[0])==null?void 0:d.href)??((m=o.items[0])==null?void 0:m.value)]);const k=l=>Array.isArray(a.value)?a.value.includes(l.value):l.value===a.value,M=(l,s=!1)=>{if(Array.isArray(a.value)){let t=a.value.slice();if(s){t.length||(t=o.items.map(c=>c.value));const n=t.indexOf(l.value);n===-1?t.push(l.value):t.splice(n,1)}else t.length===1&&t[0]===l.value?t=[]:t=[l.value];!o.canBeEmptyMultiple&&!t.length&&(t=[l.value]),a.value=t;return}a.value=l.value},B=l=>{if(r.value.scrollWidth<=r.value.offsetWidth||l.shiftKey||Math.abs(l.deltaY)<50)return;l.preventDefault();const s=l.deltaY>0?30:-30;r.value.scrollLeft=r.value.scrollLeft+s},v=(l=!0)=>{var p,y;const s=r.value.querySelector(".top-active");if(!s)return;const t=24,n=s.offsetLeft-r.value.offsetLeft-t,c=s.offsetLeft-r.value.offsetLeft+s.clientWidth+t,_=r.value.scrollLeft,L=r.value.clientWidth+r.value.scrollLeft;let i;n<_&&(i=n),c>L&&(i=c-r.value.clientWidth),i!==void 0&&(u.isSafari()?(y=(p=u.Core).$)==null||y.call(p,r.value).animate({scrollLeft:i},l?200:0):r.value.scrollTo({left:i,behavior:l?"smooth":"auto"}))},V=()=>{if(Array.isArray(a.value)){if(a.value.length===o.items.length){a.value=[o.items[0].href??o.items[0].value];return}a.value=o.items.map(l=>l.href??l.value)}};return e.onMounted(()=>v(!1)),e.onUpdated(()=>v(!0)),(l,s)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"el",ref:r,class:e.normalizeClass({"top-menu":!0,["top-style_"+l.styling]:!0}),onWheel:B},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(l.items,t=>(e.openBlock(),e.createBlock(u._sfc_main$1,e.mergeProps({ref_for:!0},t,{class:"top-menu_item",color:"theme",onClick:n=>M(t,n.ctrlKey||n.metaKey),isActive:k(t)}),e.createSlots({_:2},[t.content?{name:"default",fn:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(t.content),1)]),key:"0"}:void 0]),1040,["onClick","isActive"]))),256)),Array.isArray(a.value)&&l.selectAllItem?(e.openBlock(),e.createElementBlock("div",g,[e.createVNode(u._sfc_main$1,e.mergeProps(l.selectAllItem,{class:"top-menu_item",color:"theme",styling:"",onClick:s[0]||(s[0]=t=>V()),isActive:a.value.length===l.items.length}),e.createSlots({_:2},[l.selectAllItem.content?{name:"default",fn:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(l.selectAllItem.content),1)]),key:"0"}:void 0]),1040,["isActive"])])):e.createCommentVNode("",!0)],34))}});h._sfc_main=A}));
|
|
2
|
+
//# sourceMappingURL=menu.vue_vue_type_style_index_0_lang-pAW8vFcF.amd.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu.vue_vue_type_style_index_0_lang-JZ-QwyLO.amd.js","sources":["../../src/components/formsExt/menu/menu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onMounted, onUpdated, ref } from 'vue';\nimport type { Item, Props } from './types';\nimport Core from '@/core/core/core';\nimport { isSafari } from '@/core/utils/device';\nimport TopButton from '@/components/forms/button/button.vue';\n\nconst props = withDefaults(defineProps<Props>(), {\n\tstyling: 'default',\n});\n\nconst model = defineModel({\n\trequired: true,\n});\n\nconst el = ref();\n\n// валидация типа modelValue без возможности выбора нескольких значений (ожидается строка или число)\nif (!props.isMultiple && typeof (model.value) !== 'string' && typeof (model.value) !== 'number') {\n\tconsole.warn('Type check failed for prop \"modelValue\". Expected String: ' + typeof (model.value));\n}\n\n// валидация типа modelValue с возможностью выбора нескольких значений (ожидается массив)\nif (props.isMultiple && !Array.isArray(model.value)) {\n\tconsole.warn('Type check failed for prop \"modelValue\". Expected Array: ' + typeof (model.value));\n}\n\n/**\n * Для множественного выбора без пустого множества\n *\n * Если ничего не выбрано, присваиваем 1-ое значение\n */\nif (props.isMultiple && !props.canBeEmptyMultiple && Array.isArray(model.value) && !model.value.length && props.items[0]) {\n\tmodel.value = [props.items[0]?.href ?? props.items[0]?.value];\n}\n\nconst itemIsActive = (item: Item) => {\n\tif (!Array.isArray(model.value)) {\n\t\treturn item.value === model.value;\n\t}\n\n\treturn model.value.includes(item.value);\n};\n\n/**\n * Выбрать элемент\n * @param item\n * @param toggle - добавить или исключить элемент, для isMultiple\n */\nconst select = (item: Item, toggle = false) => {\n\tif (Array.isArray(model.value)) {\n\t\tlet modelNew = model.value.slice();\n\n\t\tif (toggle) {\n\t\t\tif (!modelNew.length) modelNew = props.items.map(item => item.value);\n\n\t\t\tconst index = modelNew.indexOf(item.value);\n\t\t\tif (index === -1) {\n\t\t\t\tmodelNew.push(item.value);\n\t\t\t} else {\n\t\t\t\tmodelNew.splice(index, 1);\n\t\t\t}\n\t\t} else {\n\t\t\tif (modelNew.length === 1 && modelNew[0] === item.value) {\n\t\t\t\tmodelNew = [];\n\t\t\t} else {\n\t\t\t\tmodelNew = [item.value];\n\t\t\t}\n\t\t}\n\n\t\tif (!props.canBeEmptyMultiple && !modelNew.length) modelNew = [item.value];\n\n\t\tmodel.value = modelNew;\n\n\t\treturn;\n\t}\n\n\tmodel.value = item.value;\n};\n\n// вертикальный скролл в горизонтальный скролл\nconst onWheel = (event: WheelEvent) => {\n\tif (el.value.scrollWidth <= el.value.offsetWidth) return;\n\tif (event.shiftKey) return;\n\tif (Math.abs(event.deltaY) < 50) return; // устройство с высокой точностью, например тачпад\n\n\tevent.preventDefault();\n\n\tconst delta = event.deltaY > 0 ? 30 : -30;\n\tel.value.scrollLeft = el.value.scrollLeft + delta;\n};\n\n/**\n * Замена стандартному scrollIntoView, который меняет скролл документа\n *\n * Выравнивание по ближнему краю элемента\n *\n * Выравнивается таким образом, чтобы был виден соседний элемент\n */\nconst scrollIntoView = (isSmooth = true) => {\n\tconst elBtn = el.value.querySelector('.top-active');\n\tif (!elBtn) return;\n\n\tconst gap = 24;\n\n\t// левая и правая координаты элемента\n\tconst leftMargin = elBtn.offsetLeft - el.value.offsetLeft - gap;\n\tconst rightMargin = elBtn.offsetLeft - el.value.offsetLeft + elBtn.clientWidth + gap;\n\n\t// левая и правая границы видимой части меню\n\tconst leftMarginParent = el.value.scrollLeft;\n\tconst rightMarginParent = el.value.clientWidth + el.value.scrollLeft;\n\n\tlet scrollLeft: number | undefined = undefined;\n\n\t// левую границу элемента к левой границе меню\n\tif (leftMargin < leftMarginParent) scrollLeft = leftMargin;\n\n\t// правую границу элемента к правой границе меню\n\tif (rightMargin > rightMarginParent) scrollLeft = rightMargin - el.value.clientWidth;\n\n\tif (scrollLeft !== undefined) {\n\t\tif (isSafari()) {\n\t\t\tCore.$?.(el.value).animate({ scrollLeft: scrollLeft }, isSmooth ? 200 : 0);\n\t\t} else {\n\t\t\tel.value.scrollTo({ left: scrollLeft, behavior: isSmooth ? 'smooth' : 'auto' });\n\t\t}\n\t}\n};\n\n/**\n * Выбрать все элементы в меню\n */\nconst selectAll = () => {\n\tif (!Array.isArray(model.value)) return;\n\n\tif (model.value.length === props.items.length) {\n\t\tmodel.value = [props.items[0].href ?? props.items[0].value];\n\t\treturn;\n\t}\n\n\tmodel.value = props.items.map(item => item.href ?? item.value);\n};\n\nonMounted(() => scrollIntoView(false));\nonUpdated(() => scrollIntoView(true));\n\n</script>\n\n<template>\n\t<div\n\t\tref=\"el\"\n\t\t:class=\"{\n\t\t\t'top-menu': true,\n\t\t\t['top-style_' + styling]: true,\n\t\t\t// ['top-unwrap-x']: styling === 'default',\n\t\t}\"\n\t\t@wheel=\"onWheel\"\n\t>\n\t\t<TopButton\n\t\t\tv-for=\"item in items\"\n\t\t\t:=\"item\"\n\t\t\tclass=\"top-menu_item\"\n\t\t\tcolor=\"theme\"\n\t\t\t@click=\"select(item, $event.ctrlKey || $event.metaKey)\"\n\t\t\t:isActive=\"itemIsActive(item)\"\n\t\t>\n\t\t\t<template #default v-if=\"item.content\">\n\t\t\t\t{{ item.content }}\n\t\t\t</template>\n\t\t</TopButton>\n\n\t\t<div\n\t\t\tv-if=\"Array.isArray(model) && selectAllItem\"\n\t\t\tclass=\"top-menu_selectAll\"\n\t\t>\n\t\t\t<TopButton\n\t\t\t\t:=\"selectAllItem\"\n\t\t\t\tclass=\"top-menu_item\"\n\t\t\t\tcolor=\"theme\"\n\t\t\t\tstyling=\"\"\n\t\t\t\t@click=\"selectAll()\"\n\t\t\t\t:isActive=\"model.length === items.length\"\n\t\t\t>\n\t\t\t\t<template #default v-if=\"selectAllItem.content\">\n\t\t\t\t\t{{ selectAllItem.content }}\n\t\t\t\t</template>\n\t\t\t</TopButton>\n\t\t</div>\n\t</div>\n</template>\n\n<style>\n.top-menu {\n\t--scroll-thumb-color: var(--color-line-1);\n\t--scroll-thumb-color-hover: var(--color-line-2);\n\t--scroll-thumb-color-active: var(--color-line-3);\n\n\tmax-width: 100%;\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: var(--top-gap-2);\n\toverflow-x: auto;\n\tscrollbar-width: none; /* firefox */\n\n\t/* предотвратить натинвые события браузера (назад / вперед) */\n\toverscroll-behavior-x: contain;\n}\n\n.top-menu::-webkit-scrollbar { display: none; }\n\n.top-menu .top-menu_item {\n\t--top-button-color: var(--color-text-2);\n\n\toutline-offset: -2px !important;\n\tmin-width: 0;\n\tmax-width: 200px;\n\tmargin: 0;\n\tflex-shrink: 0;\n}\n\n.top-menu .top-menu_item[data-top-icon] {\n\t--top-icon-color: var(--color-text-2);\n}\n\n.top-menu_selectAll {\n\tposition: sticky;\n\tright: 0;\n\tbackground: var(--color-layout-front-1);\n\tborder-left: 1px solid var(--color-line-1);\n\tpadding-left: var(--top-padding-1);\n\tbox-shadow: var(--color-layout-front-1) var(--top-padding-2) 0px;\n}\n\n/* style default */\n.top-menu.top-style_default .top-menu_item {\n\t--top-forms-radius: 0;\n\t--top-forms-border-color: transparent;\n\t--top-forms-border-width: 2px;\n\n\tfilter: none;\n\tbox-shadow: none;\n\tborder: none;\n\tborder-bottom: var(--top-forms-border-width) solid var(--top-forms-border-color);\n\tbackground: none;\n}\n\n.top-style_default > .top-menu_item > [data-top-badge] {\n\tmargin-top: 0;\n}\n\n.top-menu.top-style_default .top-menu_item:hover {\n\t--top-icon-color: var(--color-text-1);\n\t--top-button-color: var(--color-text-1);\n\t--top-forms-border-color: var(--color-line-2);\n}\n\n.top-menu.top-style_default .top-menu_item:active,\n.top-menu.top-style_default .top-menu_item.top-active {\n\t--top-icon-color: var(--color-text-primary);\n\t--top-button-color: var(--color-text-1);\n\t--top-forms-border-color: var(--color-line-primary-1);\n}\n\n.top-menu.top-style_default .top-menu_selectAll {\n\tpadding-left: var(--top-padding-2);\n}\n\n/* style bar */\n.top-menu.top-style_bar {\n\tborder-radius: var(--top-radius-3);\n\tborder: 1px solid var(--color-line-2);\n\tpadding: var(--top-padding-1);\n\tgap: 3px;\n}\n.top-menu.top-style_bar .top-menu_item {\n\t--top-button-background-color-hover: var(--color-layer-1);\n\t--top-button-background-color-active: var(--color-layer-2);\n\t--top-button-background-color-selected: var(--color-layer-primary-1);\n\n\tposition: relative;\n}\n\n.top-menu.top-style_bar .top-menu_item:hover {\n\t--top-icon-color: var(--color-text-1);\n\t--top-button-color: var(--color-text-1);\n}\n\n.top-menu.top-style_bar .top-menu_item.top-active {\n\t--top-icon-color: var(--color-text-primary);\n\t--top-button-color: var(--color-text-primary);\n}\n\n/* разделители кнопок в баре */\n.top-menu.top-style_bar .top-menu_item:not(:first-child):not(.top-active):not(:hover):after {\n\tcontent: \"\";\n\tbackground: var(--color-line-1-opacity);\n\twidth: 1px;\n\theight: 60%;\n\tdisplay: block;\n\tposition: absolute;\n\tleft: -2px;\n}\n.top-menu.top-style_bar .top-menu_item.top-active + .top-menu_item:after,\n.top-menu.top-style_bar .top-menu_item:hover + .top-menu_item:after {\n\tcontent: none !important;\n}\n\n/*\n.top-style_bar > .top-menu_item > [data-top-badge] {\n\tmargin-top: -3px;\n}\n*/\n\n/** TODO: .top-unwrap-x надо вынести глобально в UI или добавить в стили для storybook */\n/*\n.top-menu.top-unwrap-x {\n\tpadding-right: var(--top-unwrap-x);\n\tpadding-left: var(--top-unwrap-x);\n\tmargin-right: calc(0px - var(--top-unwrap-x));\n\tmargin-left: calc(0px - var(--top-unwrap-x));\n}\n*/\n</style>\n"],"names":["el","vue","props","model","itemIsActive","item","index","modelNew","onWheel","event","delta","scrollIntoView","isSmooth","leftMargin","elBtn","gap","rightMargin","leftMarginParent","rightMarginParent","scrollLeft","$event","select","_cache","selectAll"],"mappings":"ygBAeAA,EAAAC,EAAA,IAAA,EAGA,CAAAC,EAAA,YAAA,OAAAC,EAAA,OAAA,UAAA,OAAAA,EAAA,OAAA,oGAKAD,EAAA,YAAA,CAAA,MAAA,QAAAC,EAAA,KAAA,4FASAD,EAAA,YAAA,CAAAA,EAAA,oBAAA,MAAA,QAAAC,EAAA,KAAA,GAAA,CAAAA,EAAA,MAAA,QAAAD,EAAA,MAAA,CAAA,2FAIA,MAAAE,EAAAC,oDAEEA,EAAA,QAAAF,EAAA,2IAmBCG,IAAA,GACCC,EAAA,KAAAF,EAAA,KAAA,EAEAE,EAAA,OAAAD,EAAA,CAAA,CACD,MAEAC,EAAA,SAAA,GAAAA,EAAA,CAAA,IAAAF,EAAA,WAGCE,EAAA,CAAAF,EAAA,KAAA,EAIF,CAAAH,EAAA,oBAAA,CAAAK,EAAA,SAAAA,EAAA,CAAAF,EAAA,KAAA,GAEAF,EAAA,MAAAI,SAKDJ,EAAA,MAAAE,EAAA,KAAmB,EAIpBG,EAAAC,GAAA,IACCT,EAAA,MAAA,aAAAA,EAAA,MAAA,aACAS,EAAA,oFAMAT,EAAA,MAAA,WAAAA,EAAA,MAAA,WAAAU,CAA4C,EAU7CC,EAAA,CAAAC,EAAA,KAAA,8EAOCC,EAAAC,EAAA,WAAAd,EAAA,MAAA,WAAAe,EACAC,EAAAF,EAAA,WAAAd,EAAA,MAAA,WAAAc,EAAA,YAAAC,EAGAE,EAAAjB,EAAA,MAAA,WACAkB,EAAAlB,EAAA,MAAA,YAAAA,EAAA,MAAA,iBAKAa,EAAAI,IAAAE,EAAAN,GAGAG,EAAAE,IAAAC,EAAAH,EAAAhB,EAAA,MAAA,aAEAmB,IAAA,gGAIEnB,EAAA,MAAA,SAAA,CAAA,KAAAmB,EAAA,SAAAP,EAAA,SAAA,MAAA,CAAA,EAEF,mCASA,IAAAT,EAAA,MAAA,SAAAD,EAAA,MAAA,OAAA,4FAK6D,EAG9D,OAAAD,EAAA,UAAA,IAAAU,EAAA,EAAA,CAAA,EACAV,EAAA,UAAA,IAAAU,EAAA,EAAA,CAAA,wIAO2D,CAAA,WAKxD,EAAA,2LAMM,QAAAS,GAAAC,EAAAhB,EAAAe,EAAA,SAAAA,EAAA,OAAA,EAC+C,SAAAhB,EAAAC,CAAA,mDAG1C,GAAAJ,EAAA,QAAA,IAAA,kDACK,CAAA,uPAYP,QAAAqB,EAAA,CAAA,IAAAA,EAAA,CAAA,EAAAF,GAAAG,EAAA,2GAIG,GAAAtB,EAAA,QAAA,IAAA,gEACc,CAAA"}
|
|
1
|
+
{"version":3,"file":"menu.vue_vue_type_style_index_0_lang-pAW8vFcF.amd.js","sources":["../../src/components/formsExt/menu/menu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onMounted, onUpdated, ref } from 'vue';\nimport type { Item, Props } from './types';\nimport Core from '@/core/core/core';\nimport { isSafari } from '@/core/utils/device';\nimport TopButton from '@/components/forms/button/button.vue';\n\nconst props = withDefaults(defineProps<Props>(), {\n\tstyling: 'default',\n});\n\nconst model = defineModel({\n\trequired: true,\n});\n\nconst el = ref();\n\n// валидация типа modelValue без возможности выбора нескольких значений (ожидается строка или число)\nif (!props.isMultiple && typeof (model.value) !== 'string' && typeof (model.value) !== 'number') {\n\tconsole.warn('Type check failed for prop \"modelValue\". Expected String: ' + typeof (model.value));\n}\n\n// валидация типа modelValue с возможностью выбора нескольких значений (ожидается массив)\nif (props.isMultiple && !Array.isArray(model.value)) {\n\tconsole.warn('Type check failed for prop \"modelValue\". Expected Array: ' + typeof (model.value));\n}\n\n/**\n * Для множественного выбора без пустого множества\n *\n * Если ничего не выбрано, присваиваем 1-ое значение\n */\nif (props.isMultiple && !props.canBeEmptyMultiple && Array.isArray(model.value) && !model.value.length && props.items[0]) {\n\tmodel.value = [props.items[0]?.href ?? props.items[0]?.value];\n}\n\nconst itemIsActive = (item: Item) => {\n\tif (!Array.isArray(model.value)) {\n\t\treturn item.value === model.value;\n\t}\n\n\treturn model.value.includes(item.value);\n};\n\n/**\n * Выбрать элемент\n * @param item\n * @param toggle - добавить или исключить элемент, для isMultiple\n */\nconst select = (item: Item, toggle = false) => {\n\tif (Array.isArray(model.value)) {\n\t\tlet modelNew = model.value.slice();\n\n\t\tif (toggle) {\n\t\t\tif (!modelNew.length) modelNew = props.items.map(item => item.value);\n\n\t\t\tconst index = modelNew.indexOf(item.value);\n\t\t\tif (index === -1) {\n\t\t\t\tmodelNew.push(item.value);\n\t\t\t} else {\n\t\t\t\tmodelNew.splice(index, 1);\n\t\t\t}\n\t\t} else {\n\t\t\tif (modelNew.length === 1 && modelNew[0] === item.value) {\n\t\t\t\tmodelNew = [];\n\t\t\t} else {\n\t\t\t\tmodelNew = [item.value];\n\t\t\t}\n\t\t}\n\n\t\tif (!props.canBeEmptyMultiple && !modelNew.length) modelNew = [item.value];\n\n\t\tmodel.value = modelNew;\n\n\t\treturn;\n\t}\n\n\tmodel.value = item.value;\n};\n\n// вертикальный скролл в горизонтальный скролл\nconst onWheel = (event: WheelEvent) => {\n\tif (el.value.scrollWidth <= el.value.offsetWidth) return;\n\tif (event.shiftKey) return;\n\tif (Math.abs(event.deltaY) < 50) return; // устройство с высокой точностью, например тачпад\n\n\tevent.preventDefault();\n\n\tconst delta = event.deltaY > 0 ? 30 : -30;\n\tel.value.scrollLeft = el.value.scrollLeft + delta;\n};\n\n/**\n * Замена стандартному scrollIntoView, который меняет скролл документа\n *\n * Выравнивание по ближнему краю элемента\n *\n * Выравнивается таким образом, чтобы был виден соседний элемент\n */\nconst scrollIntoView = (isSmooth = true) => {\n\tconst elBtn = el.value.querySelector('.top-active');\n\tif (!elBtn) return;\n\n\tconst gap = 24;\n\n\t// левая и правая координаты элемента\n\tconst leftMargin = elBtn.offsetLeft - el.value.offsetLeft - gap;\n\tconst rightMargin = elBtn.offsetLeft - el.value.offsetLeft + elBtn.clientWidth + gap;\n\n\t// левая и правая границы видимой части меню\n\tconst leftMarginParent = el.value.scrollLeft;\n\tconst rightMarginParent = el.value.clientWidth + el.value.scrollLeft;\n\n\tlet scrollLeft: number | undefined = undefined;\n\n\t// левую границу элемента к левой границе меню\n\tif (leftMargin < leftMarginParent) scrollLeft = leftMargin;\n\n\t// правую границу элемента к правой границе меню\n\tif (rightMargin > rightMarginParent) scrollLeft = rightMargin - el.value.clientWidth;\n\n\tif (scrollLeft !== undefined) {\n\t\tif (isSafari()) {\n\t\t\tCore.$?.(el.value).animate({ scrollLeft: scrollLeft }, isSmooth ? 200 : 0);\n\t\t} else {\n\t\t\tel.value.scrollTo({ left: scrollLeft, behavior: isSmooth ? 'smooth' : 'auto' });\n\t\t}\n\t}\n};\n\n/**\n * Выбрать все элементы в меню\n */\nconst selectAll = () => {\n\tif (!Array.isArray(model.value)) return;\n\n\tif (model.value.length === props.items.length) {\n\t\tmodel.value = [props.items[0].href ?? props.items[0].value];\n\t\treturn;\n\t}\n\n\tmodel.value = props.items.map(item => item.href ?? item.value);\n};\n\nonMounted(() => scrollIntoView(false));\nonUpdated(() => scrollIntoView(true));\n\n</script>\n\n<template>\n\t<div\n\t\tref=\"el\"\n\t\t:class=\"{\n\t\t\t'top-menu': true,\n\t\t\t['top-style_' + styling]: true,\n\t\t\t// ['top-unwrap-x']: styling === 'default',\n\t\t}\"\n\t\t@wheel=\"onWheel\"\n\t>\n\t\t<TopButton\n\t\t\tv-for=\"item in items\"\n\t\t\t:=\"item\"\n\t\t\tclass=\"top-menu_item\"\n\t\t\tcolor=\"theme\"\n\t\t\t@click=\"select(item, $event.ctrlKey || $event.metaKey)\"\n\t\t\t:isActive=\"itemIsActive(item)\"\n\t\t>\n\t\t\t<template #default v-if=\"item.content\">\n\t\t\t\t{{ item.content }}\n\t\t\t</template>\n\t\t</TopButton>\n\n\t\t<div\n\t\t\tv-if=\"Array.isArray(model) && selectAllItem\"\n\t\t\tclass=\"top-menu_selectAll\"\n\t\t>\n\t\t\t<TopButton\n\t\t\t\t:=\"selectAllItem\"\n\t\t\t\tclass=\"top-menu_item\"\n\t\t\t\tcolor=\"theme\"\n\t\t\t\tstyling=\"\"\n\t\t\t\t@click=\"selectAll()\"\n\t\t\t\t:isActive=\"model.length === items.length\"\n\t\t\t>\n\t\t\t\t<template #default v-if=\"selectAllItem.content\">\n\t\t\t\t\t{{ selectAllItem.content }}\n\t\t\t\t</template>\n\t\t\t</TopButton>\n\t\t</div>\n\t</div>\n</template>\n\n<style>\n.top-menu {\n\t--scroll-thumb-color: var(--color-line-1);\n\t--scroll-thumb-color-hover: var(--color-line-2);\n\t--scroll-thumb-color-active: var(--color-line-3);\n\n\tmax-width: 100%;\n\tdisplay: flex;\n\talign-items: flex-start;\n\tgap: var(--top-gap-2);\n\toverflow-x: auto;\n\tscrollbar-width: none; /* firefox */\n\n\t/* предотвратить натинвые события браузера (назад / вперед) */\n\toverscroll-behavior-x: contain;\n}\n\n.top-menu::-webkit-scrollbar { display: none; }\n\n.top-menu .top-menu_item {\n\t--top-button-color: var(--color-text-2);\n\n\toutline-offset: -2px !important;\n\tmin-width: 0;\n\tmax-width: 200px;\n\tmargin: 0;\n\tflex-shrink: 0;\n}\n\n.top-menu .top-menu_item[data-top-icon] {\n\t--top-icon-color: var(--color-text-2);\n}\n\n.top-menu_selectAll {\n\tposition: sticky;\n\tright: 0;\n\tbackground: var(--color-layout-front-1);\n\tborder-left: 1px solid var(--color-line-1);\n\tpadding-left: var(--top-padding-1);\n\tbox-shadow: var(--color-layout-front-1) var(--top-padding-2) 0px;\n}\n\n/* style default */\n.top-menu.top-style_default .top-menu_item {\n\t--top-forms-radius: 0;\n\t--top-forms-border-color: transparent;\n\t--top-forms-border-width: 2px;\n\n\tfilter: none;\n\tbox-shadow: none;\n\tborder: none;\n\tborder-bottom: var(--top-forms-border-width) solid var(--top-forms-border-color);\n\tbackground: none;\n}\n\n.top-style_default > .top-menu_item > [data-top-badge] {\n\tmargin-top: 0;\n}\n\n.top-menu.top-style_default .top-menu_item:hover {\n\t--top-icon-color: var(--color-text-1);\n\t--top-button-color: var(--color-text-1);\n\t--top-forms-border-color: var(--color-line-2);\n}\n\n.top-menu.top-style_default .top-menu_item:active,\n.top-menu.top-style_default .top-menu_item.top-active {\n\t--top-icon-color: var(--color-text-primary);\n\t--top-button-color: var(--color-text-1);\n\t--top-forms-border-color: var(--color-line-primary-1);\n}\n\n.top-menu.top-style_default .top-menu_selectAll {\n\tpadding-left: var(--top-padding-2);\n}\n\n/* style bar */\n.top-menu.top-style_bar {\n\tborder-radius: var(--top-radius-3);\n\tborder: 1px solid var(--color-line-2);\n\tpadding: var(--top-padding-1);\n\tgap: 3px;\n}\n.top-menu.top-style_bar .top-menu_item {\n\t--top-button-background-color-hover: var(--color-layer-1);\n\t--top-button-background-color-active: var(--color-layer-2);\n\t--top-button-background-color-selected: var(--color-layer-primary-1);\n\n\tposition: relative;\n}\n\n.top-menu.top-style_bar .top-menu_item:hover {\n\t--top-icon-color: var(--color-text-1);\n\t--top-button-color: var(--color-text-1);\n}\n\n.top-menu.top-style_bar .top-menu_item.top-active {\n\t--top-icon-color: var(--color-text-primary);\n\t--top-button-color: var(--color-text-primary);\n}\n\n/* разделители кнопок в баре */\n.top-menu.top-style_bar .top-menu_item:not(:first-child):not(.top-active):not(:hover):after {\n\tcontent: \"\";\n\tbackground: var(--color-line-1-opacity);\n\twidth: 1px;\n\theight: 60%;\n\tdisplay: block;\n\tposition: absolute;\n\tleft: -2px;\n}\n.top-menu.top-style_bar .top-menu_item.top-active + .top-menu_item:after,\n.top-menu.top-style_bar .top-menu_item:hover + .top-menu_item:after {\n\tcontent: none !important;\n}\n\n/*\n.top-style_bar > .top-menu_item > [data-top-badge] {\n\tmargin-top: -3px;\n}\n*/\n\n/** TODO: .top-unwrap-x надо вынести глобально в UI или добавить в стили для storybook */\n/*\n.top-menu.top-unwrap-x {\n\tpadding-right: var(--top-unwrap-x);\n\tpadding-left: var(--top-unwrap-x);\n\tmargin-right: calc(0px - var(--top-unwrap-x));\n\tmargin-left: calc(0px - var(--top-unwrap-x));\n}\n*/\n</style>\n"],"names":["el","vue","props","model","itemIsActive","item","index","modelNew","onWheel","event","delta","scrollIntoView","isSmooth","leftMargin","elBtn","gap","rightMargin","leftMarginParent","rightMarginParent","scrollLeft","$event","select","_cache","selectAll"],"mappings":"ygBAeAA,EAAAC,EAAA,IAAA,EAGA,CAAAC,EAAA,YAAA,OAAAC,EAAA,OAAA,UAAA,OAAAA,EAAA,OAAA,oGAKAD,EAAA,YAAA,CAAA,MAAA,QAAAC,EAAA,KAAA,4FASAD,EAAA,YAAA,CAAAA,EAAA,oBAAA,MAAA,QAAAC,EAAA,KAAA,GAAA,CAAAA,EAAA,MAAA,QAAAD,EAAA,MAAA,CAAA,2FAIA,MAAAE,EAAAC,oDAEEA,EAAA,QAAAF,EAAA,2IAmBCG,IAAA,GACCC,EAAA,KAAAF,EAAA,KAAA,EAEAE,EAAA,OAAAD,EAAA,CAAA,CACD,MAEAC,EAAA,SAAA,GAAAA,EAAA,CAAA,IAAAF,EAAA,WAGCE,EAAA,CAAAF,EAAA,KAAA,EAIF,CAAAH,EAAA,oBAAA,CAAAK,EAAA,SAAAA,EAAA,CAAAF,EAAA,KAAA,GAEAF,EAAA,MAAAI,SAKDJ,EAAA,MAAAE,EAAA,KAAmB,EAIpBG,EAAAC,GAAA,IACCT,EAAA,MAAA,aAAAA,EAAA,MAAA,aACAS,EAAA,oFAMAT,EAAA,MAAA,WAAAA,EAAA,MAAA,WAAAU,CAA4C,EAU7CC,EAAA,CAAAC,EAAA,KAAA,8EAOCC,EAAAC,EAAA,WAAAd,EAAA,MAAA,WAAAe,EACAC,EAAAF,EAAA,WAAAd,EAAA,MAAA,WAAAc,EAAA,YAAAC,EAGAE,EAAAjB,EAAA,MAAA,WACAkB,EAAAlB,EAAA,MAAA,YAAAA,EAAA,MAAA,iBAKAa,EAAAI,IAAAE,EAAAN,GAGAG,EAAAE,IAAAC,EAAAH,EAAAhB,EAAA,MAAA,aAEAmB,IAAA,gGAIEnB,EAAA,MAAA,SAAA,CAAA,KAAAmB,EAAA,SAAAP,EAAA,SAAA,MAAA,CAAA,EAEF,mCASA,IAAAT,EAAA,MAAA,SAAAD,EAAA,MAAA,OAAA,4FAK6D,EAG9D,OAAAD,EAAA,UAAA,IAAAU,EAAA,EAAA,CAAA,EACAV,EAAA,UAAA,IAAAU,EAAA,EAAA,CAAA,wIAO2D,CAAA,WAKxD,EAAA,2LAMM,QAAAS,GAAAC,EAAAhB,EAAAe,EAAA,SAAAA,EAAA,OAAA,EAC+C,SAAAhB,EAAAC,CAAA,mDAG1C,GAAAJ,EAAA,QAAA,IAAA,kDACK,CAAA,uPAYP,QAAAqB,EAAA,CAAA,IAAAA,EAAA,CAAA,EAAAF,GAAAG,EAAA,2GAIG,GAAAtB,EAAA,QAAA,IAAA,gEACc,CAAA"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
define(["require","exports","vue","./forms-
|
|
1
|
+
define(["require","exports","vue","./forms-DHThMe8-.amd","../utils/string.amd","../require/css.amd!../assets/notice.css"],(function(q,h,e,p,v){"use strict";if(typeof e>"u")var e=window.Vue;const C=300,c=e.reactive(new Map),b=(o,r,t)=>"top-notice_"+v.genIntHash(o+r+JSON.stringify(t)),M=(o,r="info",t)=>{let i="";o=String(o);const f=b(o,r,t);if(t!=null&&t.title)i=t.title;else{const u=o.split(`
|
|
2
2
|
`);u.length&&(i=String(u.shift()),o=u.join(`
|
|
3
3
|
`))}const l=c.get(f);if(l){y(l);return}const a={id:f,title:i,text:o,style:r,buttonProps:t==null?void 0:t.buttonProps,buttonsProps:t==null?void 0:t.buttonsProps,metaText:t==null?void 0:t.metaText,isSafeHTML:t==null?void 0:t.isSafeHTML,selectToClose:t==null?void 0:t.selectToClose,onClose:t==null?void 0:t.onClose};if(c.set(a.id,a),c.size>5){const[u,g]=[...c].at(0)||[];g&&B(g)}p.Core.state.isMobile&&$("input").one("click",()=>B(a))},y=o=>{o.hightlight=!0,setTimeout(()=>o.hightlight=!1,C)},B=o=>{o.forceClosed=!0,setTimeout(()=>{var r;(r=o.onClose)==null||r.call(o),c.delete(o.id)},C)},_=o=>{const r="hacking was detected";return o=o.replace(/<script/g,r),o=o.replace(/<img/g,r),o=o.replace(/<iframe/g,r),o=o.replace(/javascript:/g,r),o=o.replace(/<[^>]+ (@|on)\w+=[^>]+>?/g,r),o},L={class:"top-notice_itemTextWrapper"},H=["innerHTML"],P=["innerHTML"],S={key:1,class:"top-notice_itemButtons"},N=["innerHTML"],w=["title"],E=e.defineComponent({__name:"item",props:{id:{},title:{},text:{},style:{},metaText:{},buttonProps:{},buttonsProps:{},isSafeHTML:{type:Boolean},hightlight:{type:Boolean},selectToClose:{type:Boolean,default:!0},forceClosed:{type:Boolean}},emits:["close"],setup(o,{emit:r}){const t=o,i=r,f=e.ref(!1);setTimeout(()=>f.value=!0,10);const l=e.ref(!1),a=e.ref("right"),u=e.computed(()=>{let n=t.title.replace(/ {2}/g," ");return t.isSafeHTML||(n=_(n)),n}),g=e.computed(()=>{let n=v.nl2br(t.text);return n=n.replace(/ {2}/g," "),t.isSafeHTML||(n=_(n)),n}),m=n=>{l.value=!0,n&&(a.value=n),setTimeout(()=>i("close"),C)},z=n=>{if(!t.selectToClose)return;const{tagName:s}=n.target;s==="A"&&m(),s==="BUTTON"&&m()},j={mounted:n=>{if(!p.Core.state.isMobile||!p.Core.$||!p.Core.$.ui.draggable)return;let s="right";p.Core.$(n).draggable({revert:!1,axis:"x",drag:(T,d)=>{s=d.position.left>0?"right":"left"},stop:(T,d)=>{m(s)}})}};return(n,s)=>{var T;const k=e.resolveComponent("TopButton");return e.withDirectives((e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["top-notice_item",{["top-notice_item-"+n.style]:!0,"top-notice_item-hightlight":n.hightlight,"top-notice_item-showed":f.value,"top-notice_item-closed":l.value||n.forceClosed,["top-notice_item-closed_"+a.value]:l.value}]),onClick:z},[e.createElementVNode("div",L,[u.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"top-notice_itemTitle",innerHTML:u.value},null,8,H)):e.createCommentVNode("",!0),g.value?(e.openBlock(),e.createElementBlock("div",{key:1,class:"top-notice_itemText",innerHTML:g.value},null,8,P)):e.createCommentVNode("",!0)]),n.buttonProps?(e.openBlock(),e.createBlock(k,e.mergeProps({key:0,class:"top-notice_itemButton",size:"s"},n.buttonProps,{title:n.buttonProps.title,innerHTML:n.buttonProps.default,onClick:s[0]||(s[0]=d=>m())}),null,16,["title","innerHTML"])):e.createCommentVNode("",!0),(T=n.buttonsProps)!=null&&T.length?(e.openBlock(),e.createElementBlock("div",S,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.buttonsProps,d=>(e.openBlock(),e.createBlock(k,e.mergeProps({class:"top-notice_itemButton",size:"s"},{ref_for:!0},d,{title:d.title,innerHTML:d.default,onClick:s[1]||(s[1]=D=>m())}),null,16,["title","innerHTML"]))),256))])):e.createCommentVNode("",!0),n.metaText?(e.openBlock(),e.createElementBlock("div",{key:2,class:"top-notice_itemMetaText",innerHTML:n.metaText},null,8,N)):e.createCommentVNode("",!0),e.createElementVNode("div",{class:"top-notice_itemClose","data-top-icon":"",title:n.$i18n.Common.Close,onClick:s[2]||(s[2]=()=>m())},null,8,w)],2)),[[j]])}}}),V={class:"top-notice"},I=e.defineComponent({__name:"notice",setup(o){const r=t=>{var i;(i=t.onClose)==null||i.call(t),c.delete(t.id)};return(t,i)=>(e.openBlock(),e.createBlock(e.Teleport,{to:"body"},[e.createElementVNode("div",V,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(c),([f,l])=>(e.openBlock(),e.createBlock(E,{key:l.id,id:l.id,title:l.title,text:l.text,style:e.normalizeStyle(l.style),buttonProps:l.buttonProps,buttonsProps:l.buttonsProps,metaText:l.metaText,isSafeHTML:l.isSafeHTML,forceClosed:l.forceClosed,hightlight:l.hightlight,onClose:a=>r(l)},null,8,["id","title","text","style","buttonProps","buttonsProps","metaText","isSafeHTML","forceClosed","hightlight","onClose"]))),128))])]))}});h.default=I,h.show=M,Object.defineProperty(h,Symbol.toStringTag,{value:"Module"})}));
|
|
4
|
-
//# sourceMappingURL=notice-
|
|
4
|
+
//# sourceMappingURL=notice-Bj_A6EZr.amd.js.map
|