@topvisor/ui 1.3.5-3 → 1.3.5-5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.chunks/{core-DF7fuQev.es.js → core-CaWxDXrZ.es.js} +4 -4
- package/.chunks/{core-DF7fuQev.es.js.map → core-CaWxDXrZ.es.js.map} +1 -1
- package/.chunks/{core-BS_ygt0h.amd.js → core-DmO1i1Ua.amd.js} +2 -2
- package/.chunks/{core-BS_ygt0h.amd.js.map → core-DmO1i1Ua.amd.js.map} +1 -1
- package/.chunks/{datepicker-BYLW8X5k.amd.js → datepicker-CPrHVH4x.amd.js} +2 -2
- package/.chunks/{datepicker-BYLW8X5k.amd.js.map → datepicker-CPrHVH4x.amd.js.map} +1 -1
- package/.chunks/{datepicker-BVIBaChw.es.js → datepicker-J8Zg9mKt.es.js} +2 -2
- package/.chunks/{datepicker-BVIBaChw.es.js.map → datepicker-J8Zg9mKt.es.js.map} +1 -1
- package/.chunks/{dialog_selectorRegions-D5DOxBQO.es.js → dialog_selectorRegions-DoEjgXtb.es.js} +4 -4
- package/.chunks/{dialog_selectorRegions-D5DOxBQO.es.js.map → dialog_selectorRegions-DoEjgXtb.es.js.map} +1 -1
- package/.chunks/{dialog_selectorRegions-CaR2-Qo2.amd.js → dialog_selectorRegions-DzufTzj9.amd.js} +2 -2
- package/.chunks/{dialog_selectorRegions-CaR2-Qo2.amd.js.map → dialog_selectorRegions-DzufTzj9.amd.js.map} +1 -1
- package/.chunks/{dialogs.vue_vue_type_script_setup_true_lang-B5rYBKgA.amd.js → dialogs.vue_vue_type_script_setup_true_lang-8KsNy0Bd.amd.js} +2 -2
- package/.chunks/{dialogs.vue_vue_type_script_setup_true_lang-B5rYBKgA.amd.js.map → dialogs.vue_vue_type_script_setup_true_lang-8KsNy0Bd.amd.js.map} +1 -1
- package/.chunks/{dialogs.vue_vue_type_script_setup_true_lang-CPByl0SB.es.js → dialogs.vue_vue_type_script_setup_true_lang-DvkvzHEY.es.js} +2 -2
- package/.chunks/{dialogs.vue_vue_type_script_setup_true_lang-CPByl0SB.es.js.map → dialogs.vue_vue_type_script_setup_true_lang-DvkvzHEY.es.js.map} +1 -1
- package/.chunks/{forms-BrdvrjiZ.es.js → forms-COXAfg9G.es.js} +53 -51
- package/.chunks/{forms-BrdvrjiZ.es.js.map → forms-COXAfg9G.es.js.map} +1 -1
- package/.chunks/{forms-CzUjrBXG.amd.js → forms-DXX5M4DO.amd.js} +3 -3
- package/.chunks/{forms-CzUjrBXG.amd.js.map → forms-DXX5M4DO.amd.js.map} +1 -1
- package/.chunks/listItem.vue_vue_type_script_setup_true_lang--W1RouXP.es.js +199 -0
- package/.chunks/listItem.vue_vue_type_script_setup_true_lang--W1RouXP.es.js.map +1 -0
- package/.chunks/listItem.vue_vue_type_script_setup_true_lang-DzV225TL.amd.js +2 -0
- package/.chunks/listItem.vue_vue_type_script_setup_true_lang-DzV225TL.amd.js.map +1 -0
- package/.chunks/{menu.vue_vue_type_style_index_0_lang-BNr8VcFM.es.js → menu.vue_vue_type_style_index_0_lang-BiyxTfdE.es.js} +2 -2
- package/.chunks/{menu.vue_vue_type_style_index_0_lang-BNr8VcFM.es.js.map → menu.vue_vue_type_style_index_0_lang-BiyxTfdE.es.js.map} +1 -1
- package/.chunks/{menu.vue_vue_type_style_index_0_lang-jnHbXDIR.amd.js → menu.vue_vue_type_style_index_0_lang-D3OAqOqX.amd.js} +2 -2
- package/.chunks/{menu.vue_vue_type_style_index_0_lang-jnHbXDIR.amd.js.map → menu.vue_vue_type_style_index_0_lang-D3OAqOqX.amd.js.map} +1 -1
- package/.chunks/{notice-CzWMWg_D.amd.js → notice-CSGn_jTM.amd.js} +2 -2
- package/.chunks/{notice-CzWMWg_D.amd.js.map → notice-CSGn_jTM.amd.js.map} +1 -1
- package/.chunks/{notice-BPgkjMG1.es.js → notice-P7CXfEuX.es.js} +2 -2
- package/.chunks/{notice-BPgkjMG1.es.js.map → notice-P7CXfEuX.es.js.map} +1 -1
- package/.chunks/opener.vue_vue_type_script_setup_true_lang-DRzrTv7Q.es.js +36 -0
- package/.chunks/opener.vue_vue_type_script_setup_true_lang-DRzrTv7Q.es.js.map +1 -0
- package/.chunks/opener.vue_vue_type_script_setup_true_lang-gNZhYkDf.amd.js +2 -0
- package/.chunks/opener.vue_vue_type_script_setup_true_lang-gNZhYkDf.amd.js.map +1 -0
- package/.chunks/{page.vue_vue_type_script_setup_true_lang-XMwkQHNU.es.js → page.vue_vue_type_script_setup_true_lang-D9m45rLs.es.js} +4 -4
- package/.chunks/{page.vue_vue_type_script_setup_true_lang-XMwkQHNU.es.js.map → page.vue_vue_type_script_setup_true_lang-D9m45rLs.es.js.map} +1 -1
- package/.chunks/{page.vue_vue_type_script_setup_true_lang-C-BJRiFc.amd.js → page.vue_vue_type_script_setup_true_lang-DHPOnLj5.amd.js} +2 -2
- package/.chunks/{page.vue_vue_type_script_setup_true_lang-C-BJRiFc.amd.js.map → page.vue_vue_type_script_setup_true_lang-DHPOnLj5.amd.js.map} +1 -1
- package/.chunks/popup-CF4k7j3U.amd.js +2 -0
- package/.chunks/popup-CF4k7j3U.amd.js.map +1 -0
- package/.chunks/{popup-do4HUI7u.es.js → popup-G7FYKscC.es.js} +116 -90
- package/.chunks/popup-G7FYKscC.es.js.map +1 -0
- package/.chunks/{utils-B6aJagiK.es.js → utils-CWm0zAtM.es.js} +3 -3
- package/.chunks/{utils-B6aJagiK.es.js.map → utils-CWm0zAtM.es.js.map} +1 -1
- package/.chunks/{utils-BgVG2kmp.amd.js → utils-D505nRsu.amd.js} +2 -2
- package/.chunks/{utils-BgVG2kmp.amd.js.map → utils-D505nRsu.amd.js.map} +1 -1
- package/.chunks/{utils-BqT8hS8L.amd.js → utils-DmxcQpWA.amd.js} +2 -2
- package/.chunks/{utils-BqT8hS8L.amd.js.map → utils-DmxcQpWA.amd.js.map} +1 -1
- package/.chunks/{utils-DyhMNhnz.es.js → utils-Rbz9mxy6.es.js} +2 -2
- package/.chunks/{utils-DyhMNhnz.es.js.map → utils-Rbz9mxy6.es.js.map} +1 -1
- package/.chunks/{widgetInput.vue_vue_type_script_setup_true_lang-CVsiIZz5.amd.js → widgetInput.vue_vue_type_script_setup_true_lang-BU-FdL6d.amd.js} +2 -2
- package/.chunks/{widgetInput.vue_vue_type_script_setup_true_lang-CVsiIZz5.amd.js.map → widgetInput.vue_vue_type_script_setup_true_lang-BU-FdL6d.amd.js.map} +1 -1
- package/.chunks/{widgetInput.vue_vue_type_script_setup_true_lang-Bo064qPK.es.js → widgetInput.vue_vue_type_script_setup_true_lang-TVpBXc9F.es.js} +2 -2
- package/.chunks/{widgetInput.vue_vue_type_script_setup_true_lang-Bo064qPK.es.js.map → widgetInput.vue_vue_type_script_setup_true_lang-TVpBXc9F.es.js.map} +1 -1
- package/assets/forms.css +1 -1
- package/assets/listItem.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.amd.js.map +1 -1
- package/formsExt/formsExt.js +387 -388
- package/formsExt/formsExt.js.map +1 -1
- 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 +39 -34
- package/popup/popup.js.map +1 -1
- package/popup/worker.amd.js +1 -1
- package/popup/worker.amd.js.map +1 -1
- package/popup/worker.js +24 -20
- package/popup/worker.js.map +1 -1
- package/project/project.amd.js +1 -1
- package/project/project.amd.js.map +1 -1
- package/project/project.js +26 -25
- package/project/project.js.map +1 -1
- package/src/api/api/types/ext.d.ts +2 -2
- package/src/components/forms/button/types.d.ts +6 -0
- package/src/components/forms/input/input.vue.d.ts +1 -1
- package/src/components/forms/input/types.d.ts +1 -1
- package/src/components/forms/inputDate/inputDate.vue.d.ts +1 -1
- package/src/components/formsExt/libs/optionGroup/types.d.ts +1 -1
- package/src/components/formsExt/selector2/composables/useAPI.d.ts +3 -2
- package/src/components/formsExt/selector2/composables/useMenu.d.ts +1 -1
- package/src/components/formsExt/selector2/selector2.vue.d.ts +2 -0
- package/src/components/formsExt/selector2/types.d.ts +18 -1
- package/src/components/formsExt/selector2/utils.d.ts +1 -0
- package/src/components/popup/lib/popup.d.ts +14 -2
- package/src/components/popup/lib/worker.d.ts +1 -1
- package/src/components/popup/popup/opener/opener.vue.d.ts +17 -0
- package/src/components/popup/popup/opener/types.d.ts +51 -0
- package/src/components/popup/popup/opener.vue.d.ts +1 -1
- package/src/components/popup/popup/types.d.ts +1 -45
- package/src/components/project/tagSelector/utils/el.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/listItem.vue_vue_type_script_setup_true_lang-DZ6ExJKC.es.js +0 -192
- package/.chunks/listItem.vue_vue_type_script_setup_true_lang-DZ6ExJKC.es.js.map +0 -1
- package/.chunks/listItem.vue_vue_type_script_setup_true_lang-_sniT1lq.amd.js +0 -2
- package/.chunks/listItem.vue_vue_type_script_setup_true_lang-_sniT1lq.amd.js.map +0 -1
- package/.chunks/popup-UOJ-t8-v.amd.js +0 -2
- package/.chunks/popup-UOJ-t8-v.amd.js.map +0 -1
- package/.chunks/popup-do4HUI7u.es.js.map +0 -1
|
@@ -0,0 +1,199 @@
|
|
|
1
|
+
|
|
2
|
+
import { Core as _autoloadCSSCore } from '../core/app.js';
|
|
3
|
+
const fileNames = ['../assets/listItem.css'].map(fileName => import.meta.resolve(fileName));
|
|
4
|
+
_autoloadCSSCore.insertCSSLinkToPage(fileNames, true);
|
|
5
|
+
|
|
6
|
+
import { defineComponent as _, onUpdated as D, createElementBlock as a, openBlock as p, Fragment as C, createElementVNode as $, renderSlot as l, ref as h, toRef as b, watch as H, onUnmounted as T, resolveDirective as w, createBlock as P, createCommentVNode as r, unref as M, withCtx as S, Teleport as A, withDirectives as I, toDisplayString as N, createVNode as R, normalizeClass as E, resolveDynamicComponent as U, mergeProps as O } from "vue";
|
|
7
|
+
import { f as W } from "./forms-COXAfg9G.es.js";
|
|
8
|
+
import { TopPopupWorker as k } from "../popup/worker.js";
|
|
9
|
+
const q = /* @__PURE__ */ _({
|
|
10
|
+
__name: "opener",
|
|
11
|
+
props: {
|
|
12
|
+
id: {},
|
|
13
|
+
pos: { default: "3" },
|
|
14
|
+
notch: { type: Boolean, default: !0 },
|
|
15
|
+
openByFocus: { type: Boolean },
|
|
16
|
+
openByHover: { type: Boolean },
|
|
17
|
+
posBy: { default: "fixed" },
|
|
18
|
+
data: {}
|
|
19
|
+
},
|
|
20
|
+
setup(f) {
|
|
21
|
+
const t = f, s = t.id || Math.random() + "";
|
|
22
|
+
let n;
|
|
23
|
+
function v(e) {
|
|
24
|
+
setTimeout(() => {
|
|
25
|
+
n = e.nextElementSibling, n && i(n);
|
|
26
|
+
});
|
|
27
|
+
}
|
|
28
|
+
D(() => {
|
|
29
|
+
n && i(n);
|
|
30
|
+
});
|
|
31
|
+
function i(e) {
|
|
32
|
+
if (e.dataset.topPopup = "#" + s, e.dataset.topPopupId = s, e.dataset.topPopupPos = t.pos, e.dataset.topPopupPosBy = t.posBy, e.dataset.topPopupNotch = t.notch ? "true" : "", e.dataset.topPopupOpenByFocus = t.openByFocus ? "true" : "", e.dataset.topPopupOpenByHover = t.openByHover ? "true" : "", e.__TopPopupOpenerProps = t, t.openByFocus && e.classList.contains("top-input")) {
|
|
33
|
+
const u = e.querySelector("input");
|
|
34
|
+
u.onfocus = () => {
|
|
35
|
+
k.openByOpener(e);
|
|
36
|
+
};
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
return (e, u) => (p(), a(C, null, [
|
|
40
|
+
$("template", { ref: v }),
|
|
41
|
+
l(e.$slots, "default")
|
|
42
|
+
], 64));
|
|
43
|
+
}
|
|
44
|
+
}), z = {
|
|
45
|
+
key: 0,
|
|
46
|
+
class: "top-popup_header"
|
|
47
|
+
}, j = {
|
|
48
|
+
key: 0,
|
|
49
|
+
class: "top-as-a closer"
|
|
50
|
+
}, G = {
|
|
51
|
+
key: 1,
|
|
52
|
+
class: "top-popup_widget"
|
|
53
|
+
}, J = {
|
|
54
|
+
key: 2,
|
|
55
|
+
class: "top-popup_content"
|
|
56
|
+
}, K = {
|
|
57
|
+
key: 4,
|
|
58
|
+
class: "top-popup_footer"
|
|
59
|
+
}, Q = ["href"], to = /* @__PURE__ */ _({
|
|
60
|
+
__name: "popup",
|
|
61
|
+
props: {
|
|
62
|
+
id: { default: "" },
|
|
63
|
+
class: {},
|
|
64
|
+
transitionDuration: {},
|
|
65
|
+
footerSupportLink: {},
|
|
66
|
+
pos: { default: "3" },
|
|
67
|
+
notch: { type: Boolean, default: !0 },
|
|
68
|
+
openByFocus: { type: Boolean },
|
|
69
|
+
openByHover: { type: Boolean },
|
|
70
|
+
posBy: { default: "fixed" },
|
|
71
|
+
data: {}
|
|
72
|
+
},
|
|
73
|
+
emits: ["open", "close", "scrollContentList"],
|
|
74
|
+
setup(f, { expose: t, emit: s }) {
|
|
75
|
+
const n = f, v = s, i = n.id || "top-popup-id-" + Math.random(), e = {
|
|
76
|
+
id: i,
|
|
77
|
+
popup: void 0
|
|
78
|
+
};
|
|
79
|
+
t(e);
|
|
80
|
+
const u = h(null), B = h(null), d = h(), y = {
|
|
81
|
+
onOpen: async (o) => {
|
|
82
|
+
o.elPopup && (u.value = o.elPopup), o.elPopupInner && (o.elPopupInner.innerText = "", B.value = o.elPopupInner), y.opened = !0, y.popup = o, e.popup = o, d.value = o.el.__TopPopupOpenerProps.data, v("open", { elPopup: o.elPopup, elPopupOpener: o.el, data: d.value });
|
|
83
|
+
},
|
|
84
|
+
onClose: (o) => {
|
|
85
|
+
B.value = null, y.opened = !1, y.popup = void 0, d.value = void 0, v("close", { elPopup: o.elPopup, elPopupOpener: o.el, data: o.el.__TopPopupOpenerProps.data });
|
|
86
|
+
},
|
|
87
|
+
classRef: b(n, "class"),
|
|
88
|
+
opened: !1,
|
|
89
|
+
popup: void 0,
|
|
90
|
+
transitionDurationRef: b(n, "transitionDuration")
|
|
91
|
+
};
|
|
92
|
+
return H(() => n.class, (o, c) => {
|
|
93
|
+
if (!u.value) return;
|
|
94
|
+
const m = (o == null ? void 0 : o.split(" ")) ?? [], g = ((c == null ? void 0 : c.split(" ")) ?? []).filter((F) => !m.includes(F));
|
|
95
|
+
u.value.classList.remove(...g), u.value.classList.add(...m);
|
|
96
|
+
}), k.regVueComponent(i, y), T(() => {
|
|
97
|
+
k.unregVueComponent(i);
|
|
98
|
+
}), (o, c) => {
|
|
99
|
+
const m = w("top-scroll-shadow");
|
|
100
|
+
return p(), a(C, null, [
|
|
101
|
+
o.$slots.opener ? (p(), P(q, {
|
|
102
|
+
key: 0,
|
|
103
|
+
id: M(i),
|
|
104
|
+
pos: o.pos,
|
|
105
|
+
posBy: o.posBy,
|
|
106
|
+
notch: o.notch,
|
|
107
|
+
openByFocus: o.openByFocus,
|
|
108
|
+
openByHover: o.$core.state.isMobile || o.$core.state.isMobileUA ? !1 : o.openByHover
|
|
109
|
+
}, {
|
|
110
|
+
default: S(() => [
|
|
111
|
+
l(o.$slots, "opener")
|
|
112
|
+
]),
|
|
113
|
+
_: 3
|
|
114
|
+
}, 8, ["id", "pos", "posBy", "notch", "openByFocus", "openByHover"])) : r("", !0),
|
|
115
|
+
B.value ? (p(), P(A, {
|
|
116
|
+
key: 1,
|
|
117
|
+
to: B.value
|
|
118
|
+
}, [
|
|
119
|
+
o.$slots.header || o.$core.state.isMobile ? (p(), a("div", z, [
|
|
120
|
+
o.$core.state.isMobile ? (p(), a("span", j, N(o.$i18n.Common.Close), 1)) : r("", !0),
|
|
121
|
+
l(o.$slots, "header", { data: d.value })
|
|
122
|
+
])) : r("", !0),
|
|
123
|
+
o.$slots.widget ? (p(), a("div", G, [
|
|
124
|
+
l(o.$slots, "widget")
|
|
125
|
+
])) : r("", !0),
|
|
126
|
+
o.$slots.content ? I((p(), a("div", J, [
|
|
127
|
+
l(o.$slots, "content", { data: d.value })
|
|
128
|
+
])), [
|
|
129
|
+
[m]
|
|
130
|
+
]) : r("", !0),
|
|
131
|
+
o.$slots.contentList ? I((p(), a("ul", {
|
|
132
|
+
key: 3,
|
|
133
|
+
class: "top-popup_content",
|
|
134
|
+
onScroll: c[0] || (c[0] = (L) => o.$emit("scrollContentList", L))
|
|
135
|
+
}, [
|
|
136
|
+
l(o.$slots, "contentList", { data: d.value })
|
|
137
|
+
], 32)), [
|
|
138
|
+
[m]
|
|
139
|
+
]) : r("", !0),
|
|
140
|
+
o.$slots.footer || o.footerSupportLink ? (p(), a("div", K, [
|
|
141
|
+
o.footerSupportLink ? (p(), a("a", {
|
|
142
|
+
key: 0,
|
|
143
|
+
class: "top-popup_footerSupportLink",
|
|
144
|
+
href: o.footerSupportLink,
|
|
145
|
+
target: "_blank"
|
|
146
|
+
}, [
|
|
147
|
+
R(W, { hint: "" })
|
|
148
|
+
], 8, Q)) : r("", !0),
|
|
149
|
+
l(o.$slots, "footer", { data: d.value })
|
|
150
|
+
])) : r("", !0)
|
|
151
|
+
], 8, ["to"])) : r("", !0)
|
|
152
|
+
], 64);
|
|
153
|
+
};
|
|
154
|
+
}
|
|
155
|
+
}), X = { class: "top-popup_listItemActionsLabel top-ellipsis1" }, Y = { class: "top-popup_listItemActions" }, so = /* @__PURE__ */ _({
|
|
156
|
+
inheritAttrs: !1,
|
|
157
|
+
__name: "listItem",
|
|
158
|
+
props: {
|
|
159
|
+
type: { default: "button" },
|
|
160
|
+
closeByClick: { type: Boolean, default: !0 }
|
|
161
|
+
},
|
|
162
|
+
setup(f) {
|
|
163
|
+
const t = f;
|
|
164
|
+
return (s, n) => (p(), a("li", {
|
|
165
|
+
class: E({
|
|
166
|
+
"top-popup_liNoSelectable": t.type !== "button"
|
|
167
|
+
})
|
|
168
|
+
}, [
|
|
169
|
+
(p(), P(U(s.$attrs.href ? "a" : "div"), O({
|
|
170
|
+
class: {
|
|
171
|
+
"top-popup_listItem": !0,
|
|
172
|
+
["top-popup_listItem-" + t.type]: !!t.type,
|
|
173
|
+
"top-popup_liastItem-withActions": s.$slots.actions,
|
|
174
|
+
"top-popup-noCloser": !s.closeByClick,
|
|
175
|
+
a: t.type === "button"
|
|
176
|
+
// оформления кнопки, deprecated
|
|
177
|
+
}
|
|
178
|
+
}, s.$attrs), {
|
|
179
|
+
default: S(() => [
|
|
180
|
+
s.$slots.actions ? (p(), a(C, { key: 0 }, [
|
|
181
|
+
$("div", X, [
|
|
182
|
+
l(s.$slots, "default")
|
|
183
|
+
]),
|
|
184
|
+
$("div", Y, [
|
|
185
|
+
l(s.$slots, "actions")
|
|
186
|
+
])
|
|
187
|
+
], 64)) : l(s.$slots, "default", { key: 1 })
|
|
188
|
+
]),
|
|
189
|
+
_: 3
|
|
190
|
+
}, 16, ["class"])),
|
|
191
|
+
l(s.$slots, "buttons")
|
|
192
|
+
], 2));
|
|
193
|
+
}
|
|
194
|
+
});
|
|
195
|
+
export {
|
|
196
|
+
to as _,
|
|
197
|
+
so as a
|
|
198
|
+
};
|
|
199
|
+
//# sourceMappingURL=listItem.vue_vue_type_script_setup_true_lang--W1RouXP.es.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"listItem.vue_vue_type_script_setup_true_lang--W1RouXP.es.js","sources":["../../src/components/popup/popup/opener/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';\nimport Worker from '../../lib/worker';\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.topPopupOpenByFocus = props.openByFocus ? 'true' : '';\n\telOpener.dataset.topPopupOpenByHover = props.openByHover ? 'true' : '';\n\telOpener.__TopPopupOpenerProps = props;\n\n\tif (props.openByFocus && elOpener.classList.contains('top-input')) {\n\t\tconst elInput = elOpener.querySelector('input');\n\n\t\telInput.onfocus = () => {\n\t\t\tWorker.openByOpener(elOpener);\n\t\t};\n\t}\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/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:openByFocus\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_liastItem-withActions': $slots.actions,\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<template v-if=\"$slots.actions\">\n\t\t\t\t<div class=\"top-popup_listItemActionsLabel top-ellipsis1\">\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</div>\n\n\t\t\t\t<div class=\"top-popup_listItemActions\">\n\t\t\t\t\t<slot name=\"actions\"></slot>\n\t\t\t\t</div>\n\t\t\t</template>\n\n\t\t\t<template v-else>\n\t\t\t\t<slot></slot>\n\t\t\t</template>\n\t\t</component>\n\n\t\t<slot name=\"buttons\"></slot>\n\t</li>\n</template>\n"],"names":["props","__props","id","elOpener","render","el","renderOpener","onUpdated","elInput","Worker","_createElementVNode","_renderSlot","_ctx","emit","__emit","expose","__expose","elPopupRef","ref","elPopupInnerRef","data","vueConnector","popup","toRef","watch","newValue","oldValue","newClasses","delClasses","oldClass","onUnmounted","$slots","_createBlock","Opener","_unref","pos","posBy","notch","openByFocus","$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","_Fragment"],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
define(["require","exports","vue","./forms-DXX5M4DO.amd","../popup/worker.amd","../require/css.amd!../assets/listItem.css"],(function(w,y,e,v,B){"use strict";if(typeof e>"u")var e=window.Vue;const h=e.defineComponent({__name:"opener",props:{id:{},pos:{default:"3"},notch:{type:Boolean,default:!0},openByFocus:{type:Boolean},openByHover:{type:Boolean},posBy:{default:"fixed"},data:{}},setup(c){const s=c,n=s.id||Math.random()+"";let p;function m(t){setTimeout(()=>{p=t.nextElementSibling,p&&l(p)})}e.onUpdated(()=>{p&&l(p)});function l(t){if(t.dataset.topPopup="#"+n,t.dataset.topPopupId=n,t.dataset.topPopupPos=s.pos,t.dataset.topPopupPosBy=s.posBy,t.dataset.topPopupNotch=s.notch?"true":"",t.dataset.topPopupOpenByFocus=s.openByFocus?"true":"",t.dataset.topPopupOpenByHover=s.openByHover?"true":"",t.__TopPopupOpenerProps=s,s.openByFocus&&t.classList.contains("top-input")){const r=t.querySelector("input");r.onfocus=()=>{B.TopPopupWorker.openByOpener(t)}}}return(t,r)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("template",{ref:m}),e.renderSlot(t.$slots,"default")],64))}}),$={key:0,class:"top-popup_header"},C={key:0,class:"top-as-a closer"},P={key:1,class:"top-popup_widget"},_={key:2,class:"top-popup_content"},S={key:4,class:"top-popup_footer"},E=["href"],N=e.defineComponent({__name:"popup",props:{id:{default:""},class:{},transitionDuration:{},footerSupportLink:{},pos:{default:"3"},notch:{type:Boolean,default:!0},openByFocus:{type:Boolean},openByHover:{type:Boolean},posBy:{default:"fixed"},data:{}},emits:["open","close","scrollContentList"],setup(c,{expose:s,emit:n}){const p=c,m=n,l=p.id||"top-popup-id-"+Math.random(),t={id:l,popup:void 0};s(t);const r=e.ref(null),f=e.ref(null),a=e.ref(),u={onOpen:async o=>{o.elPopup&&(r.value=o.elPopup),o.elPopupInner&&(o.elPopupInner.innerText="",f.value=o.elPopupInner),u.opened=!0,u.popup=o,t.popup=o,a.value=o.el.__TopPopupOpenerProps.data,m("open",{elPopup:o.elPopup,elPopupOpener:o.el,data:a.value})},onClose:o=>{f.value=null,u.opened=!1,u.popup=void 0,a.value=void 0,m("close",{elPopup:o.elPopup,elPopupOpener:o.el,data:o.el.__TopPopupOpenerProps.data})},classRef:e.toRef(p,"class"),opened:!1,popup:void 0,transitionDurationRef:e.toRef(p,"transitionDuration")};return e.watch(()=>p.class,(o,i)=>{if(!r.value)return;const d=(o==null?void 0:o.split(" "))??[],g=((i==null?void 0:i.split(" "))??[]).filter(F=>!d.includes(F));r.value.classList.remove(...g),r.value.classList.add(...d)}),B.TopPopupWorker.regVueComponent(l,u),e.onUnmounted(()=>{B.TopPopupWorker.unregVueComponent(l)}),(o,i)=>{const d=e.resolveDirective("top-scroll-shadow");return e.openBlock(),e.createElementBlock(e.Fragment,null,[o.$slots.opener?(e.openBlock(),e.createBlock(h,{key:0,id:e.unref(l),pos:o.pos,posBy:o.posBy,notch:o.notch,openByFocus:o.openByFocus,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","openByFocus","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",$,[o.$core.state.isMobile?(e.openBlock(),e.createElementBlock("span",C,e.toDisplayString(o.$i18n.Common.Close),1)):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"header",{data:a.value})])):e.createCommentVNode("",!0),o.$slots.widget?(e.openBlock(),e.createElementBlock("div",P,[e.renderSlot(o.$slots,"widget")])):e.createCommentVNode("",!0),o.$slots.content?e.withDirectives((e.openBlock(),e.createElementBlock("div",_,[e.renderSlot(o.$slots,"content",{data:a.value})])),[[d]]):e.createCommentVNode("",!0),o.$slots.contentList?e.withDirectives((e.openBlock(),e.createElementBlock("ul",{key:3,class:"top-popup_content",onScroll:i[0]||(i[0]=k=>o.$emit("scrollContentList",k))},[e.renderSlot(o.$slots,"contentList",{data:a.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(v._sfc_main$2,{hint:""})],8,E)):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"footer",{data:a.value})])):e.createCommentVNode("",!0)],8,["to"])):e.createCommentVNode("",!0)],64)}}}),I={class:"top-popup_listItemActionsLabel top-ellipsis1"},L={class:"top-popup_listItemActions"},b=e.defineComponent({inheritAttrs:!1,__name:"listItem",props:{type:{default:"button"},closeByClick:{type:Boolean,default:!0}},setup(c){const s=c;return(n,p)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass({"top-popup_liNoSelectable":s.type!=="button"})},[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(n.$attrs.href?"a":"div"),e.mergeProps({class:{"top-popup_listItem":!0,["top-popup_listItem-"+s.type]:!!s.type,"top-popup_liastItem-withActions":n.$slots.actions,"top-popup-noCloser":!n.closeByClick,a:s.type==="button"}},n.$attrs),{default:e.withCtx(()=>[n.$slots.actions?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createElementVNode("div",I,[e.renderSlot(n.$slots,"default")]),e.createElementVNode("div",L,[e.renderSlot(n.$slots,"actions")])],64)):e.renderSlot(n.$slots,"default",{key:1})]),_:3},16,["class"])),e.renderSlot(n.$slots,"buttons")],2))}});y._sfc_main=N,y._sfc_main$1=b}));
|
|
2
|
+
//# sourceMappingURL=listItem.vue_vue_type_script_setup_true_lang-DzV225TL.amd.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"listItem.vue_vue_type_script_setup_true_lang-DzV225TL.amd.js","sources":["../../src/components/popup/popup/opener/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';\nimport Worker from '../../lib/worker';\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.topPopupOpenByFocus = props.openByFocus ? 'true' : '';\n\telOpener.dataset.topPopupOpenByHover = props.openByHover ? 'true' : '';\n\telOpener.__TopPopupOpenerProps = props;\n\n\tif (props.openByFocus && elOpener.classList.contains('top-input')) {\n\t\tconst elInput = elOpener.querySelector('input');\n\n\t\telInput.onfocus = () => {\n\t\t\tWorker.openByOpener(elOpener);\n\t\t};\n\t}\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/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:openByFocus\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_liastItem-withActions': $slots.actions,\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<template v-if=\"$slots.actions\">\n\t\t\t\t<div class=\"top-popup_listItemActionsLabel top-ellipsis1\">\n\t\t\t\t\t<slot></slot>\n\t\t\t\t</div>\n\n\t\t\t\t<div class=\"top-popup_listItemActions\">\n\t\t\t\t\t<slot name=\"actions\"></slot>\n\t\t\t\t</div>\n\t\t\t</template>\n\n\t\t\t<template v-else>\n\t\t\t\t<slot></slot>\n\t\t\t</template>\n\t\t</component>\n\n\t\t<slot name=\"buttons\"></slot>\n\t</li>\n</template>\n"],"names":["id","props","elOpener","render","el","renderOpener","elOpener2","elInput","popup_worker","vue","_ctx","elPopupRef","elPopupInnerRef","data","popup","vueConnector","expose","delClasses","oldClass","newClasses","pos","posBy","notch","openByHover","_hoisted_2$1","footerSupportLink","closeByClick","_hoisted_1"],"mappings":"mZAWAA,EAAAC,EAAA,IAAA,KAAA,OAAA,EAAA,GAEA,IAAAC,EAOA,SAAAC,EAAAC,EAAA,iBAEEF,EAAAE,EAAA,0BAIA,CAAA,0BAOD,CAAA,EAGD,SAAAC,EAAAC,EAAA,CAgBC,4BARAA,EAAA,QAAA,WAAAN,8DAGAM,EAAA,QAAA,cAAAL,EAAA,MAAA,OAAA,GACAK,EAAA,QAAA,oBAAAL,EAAA,YAAA,OAAA,GACAK,EAAA,QAAA,oBAAAL,EAAA,YAAA,OAAA,GACAK,EAAA,sBAAAL,EAEAA,EAAA,aAAAK,EAAA,UAAA,SAAA,WAAA,EAAA,kCAGCC,EAAA,QAAA,IAAA,CACCC,EAAA,eAAA,aAAAF,CAAA,CAA4B,8GAORG,EAAA,WAAAC,EAAA,OAAA,SAAA,ihBC9CvBV,EAAAC,EAAA,IAAA,gBAAA,KAAA,OAAA,KAEe,GAAAD,EACd,MAAA,aAMD,MAAAW,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,MAAAR,EAAA,OAAA,yBAGO,sBAAAQ,EAAA,MAAAR,EAAA,oBAAA,sCAKP,GAAA,CAAAU,EAAA,MAAA,iDAKAM,sCAAA,OAAAC,GAAA,CAAAC,EAAA,SAAAD,CAAA,CAAA,4DAG4C,CAAA,EAG7CV,EAAA,eAAA,gBAAAR,EAAAe,CAAA,qBAGCP,EAAA,eAAA,kBAAAR,CAAA,CAA2B,CAAA,yLAOrB,IAAAU,EAAA,IACCU,MAAAA,EAAAA,MACEC,MAAAA,EAAAA,MACAC,YAAAA,EAAAA,yFAEiEC,EAAAA,wBAG9Cd,EAAA,WAAAC,EAAA,OAAA,QAAA,CAAA,CAAA,iKAOtB,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,kXCxJ1B,2BAAAR,EAAA,OAAA,2GA6BM,MAAA,iEAvBiF,kCAAAS,EAAA,OAAA,QAAoD,qBAAA,CAAAA,EAAA,aAAoCgB,EAAAA,EAAAA,OAAAA,QAAkC,cAQ9M,QAAAjB,EAAA,QAAA,IAAA,CAUGC,EAAA,OAAA,SAAAD,EAAA,UAAA,EAAAA,EAAA,mBAAAA,EAAA,SAAA,CAAA,IAAA,CAAA,EAAA,CAAAA,EAAA,mBAAA,MAAAkB,EAAA,CALJlB,EAAA,WAAAC,EAAA,OAAA,SAAA,CADQ,CAAA,gCAKRD,EAAA,WAAAC,EAAA,OAAA,SAAA,kDAIO,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-COXAfg9G.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-BiyxTfdE.es.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu.vue_vue_type_style_index_0_lang-BNr8VcFM.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-BiyxTfdE.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-DXX5M4DO.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-D3OAqOqX.amd.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu.vue_vue_type_style_index_0_lang-jnHbXDIR.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-D3OAqOqX.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-DXX5M4DO.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-CSGn_jTM.amd.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"notice-CzWMWg_D.amd.js","sources":["../../src/components/core/notice/utils.ts","../../src/components/core/notice/item/item.vue","../../src/components/core/notice/notice.vue"],"sourcesContent":["import { reactive } from 'vue';\nimport type { Props as ItemProps, Props, Style } from '@/components/core/notice/item/types';\nimport Core from '@/core/core/core';\nimport { genIntHash } from '@/core/utils/string';\n\nexport const transitionDuration = 300;\n\nexport type Item = Props & { onClose?: Function };\n\nexport const itemById = reactive(new Map<string, Item>());\n\nconst genItemId = (text: ItemProps['text'], style: ItemProps['style'], options?: Options) => {\n\treturn 'top-notice_' + genIntHash(text + style + JSON.stringify(options));\n};\n\nexport type Options = {\n\ttitle?: ItemProps['title'],\n\tmetaText?: ItemProps['metaText'],\n\tbuttonProps?: ItemProps['buttonProps'],\n\tbuttonsProps?: ItemProps['buttonsProps'],\n\tisSafeHTML?: ItemProps['isSafeHTML'],\n\tselectToClose?: ItemProps['selectToClose'],\n\tonClose?: Function\n}\n\n/**\n * Показать сообщением в стиле push уведомления\n *\n * title будет получен из первой строки text\n *\n * Если в options указан title, он будет взят оттуда\n */\nexport const show = (text: string, style: Style = 'info', options?: Options) => {\n\tlet title = '';\n\n\ttext = String(text);\n\n\tconst id = genItemId(text, style, options);\n\n\tif (options?.title) {\n\t\ttitle = options.title;\n\t} else {\n\t\tconst chunks = text.split('\\n');\n\n\t\tif (chunks.length) {\n\t\t\ttitle = String(chunks.shift());\n\t\t\ttext = chunks.join('\\n');\n\t\t}\n\t}\n\n\tconst itemExists = itemById.get(id);\n\tif (itemExists) {\n\t\thightlight(itemExists);\n\n\t\treturn;\n\t}\n\n\tconst item: Item = {\n\t\tid,\n\t\ttitle,\n\t\ttext,\n\t\tstyle,\n\t\tbuttonProps: options?.buttonProps,\n\t\tbuttonsProps: options?.buttonsProps,\n\t\tmetaText: options?.metaText,\n\t\tisSafeHTML: options?.isSafeHTML,\n\t\tselectToClose: options?.selectToClose,\n\t\tonClose: options?.onClose,\n\t};\n\n\titemById.set(item.id, item);\n\n\tif (itemById.size > 5) {\n\t\tconst [_firstId, firstItem] = [...itemById].at(0) || [];\n\t\tif (firstItem) close(firstItem);\n\t}\n\n\t/**\n\t * Автозакрытие ошибок форм\n\t *\n\t * Добавляет\n\t */\n\tif (Core.state.isMobile) {\n\t\t$('input').one('click', () => close(item));\n\t}\n};\n\nconst hightlight = (item: Item) => {\n\titem.hightlight = true;\n\n\tsetTimeout(() => item.hightlight = false, transitionDuration);\n};\n\nconst close = (item: Item) => {\n\titem.forceClosed = true;\n\n\tsetTimeout(() => {\n\t\titem.onClose?.();\n\n\t\titemById.delete(item.id);\n\t}, transitionDuration);\n};\n\n/**\n * Убрать подозрительный html код\n */\nexport const prepareText = (text: string) => {\n\tconst textNoSafety = 'hacking was detected';\n\n\ttext = text.replace(/<script/g, textNoSafety);\n\ttext = text.replace(/<img/g, textNoSafety);\n\ttext = text.replace(/<iframe/g, textNoSafety);\n\ttext = text.replace(/javascript:/g, textNoSafety);\n\ttext = text.replace(/<[^>]+ (@|on)\\w+=[^>]+>?/g, textNoSafety);\n\n\treturn text;\n};\n","<script setup lang=\"ts\">\nimport { computed, ref, withDefaults } from 'vue';\n\nimport Core from '@/core/core/core';\nimport { nl2br } from '@/core/utils/string';\n\nimport type { Emits, Props } from './types';\nimport { prepareText, transitionDuration } from '@/components/core/notice/utils';\n\nconst props = withDefaults(defineProps<Props>(), {\n\tselectToClose: true,\n});\n\nconst emit = defineEmits<Emits>();\n\n// анимация появления\nconst showed = ref(false);\nsetTimeout(() => showed.value = true, 10);\n\n// анимация закрытия\nconst closed = ref(false);\nconst closedDirection = ref<'top' | 'right' | 'bottom' | 'left'>('right');\n\nconst title = computed(() => {\n\tlet res = props.title.replace(/ {2}/g, ' ');\n\n\tif (!props.isSafeHTML) res = prepareText(res);\n\n\treturn res;\n});\n\nconst text = computed(() => {\n\tlet res = nl2br(props.text);\n\n\tres = res.replace(/ {2}/g, ' ');\n\n\tif (!props.isSafeHTML) res = prepareText(res);\n\n\treturn res;\n});\n\nconst close = (direction?: typeof closedDirection.value) => {\n\tclosed.value = true;\n\n\tif (direction) {\n\t\tclosedDirection.value = direction;\n\t}\n\n\tsetTimeout(() => emit('close'), transitionDuration);\n};\n\nconst onClick = (e: MouseEvent) => {\n\tif (!props.selectToClose) return;\n\n\tconst { tagName } = e.target as HTMLElement;\n\n\tif (tagName === 'A') close();\n\tif (tagName === 'BUTTON') close();\n};\n\nconst vSwipe = {\n\tmounted: (el: HTMLElement) => {\n\t\tif (!Core.state.isMobile) return;\n\n\t\tif (!Core.$ || !Core.$.ui['draggable']) return;\n\n\t\tlet direction: typeof closedDirection.value = 'right';\n\n\t\tlet axis = 'x';\n\t\t// if (getOS() === 'iOS') axis = 'y';\n\n\t\tCore.$(el).draggable({\n\t\t\trevert: false,\n\t\t\taxis,\n\t\t\tdrag: (_e, ui) => {\n\t\t\t\tif (axis == 'x') {\n\t\t\t\t\tdirection = ui.position.left > 0 ? 'right' : 'left';\n\t\t\t\t} else {\n\t\t\t\t\tdirection = ui.position.top > 0 ? 'bottom' : 'top';\n\t\t\t\t}\n\t\t\t},\n\t\t\tstop: (_e, _ui) => {\n\t\t\t\tclose(direction);\n\t\t\t},\n\t\t});\n\t},\n};\n\n// const vSwipe = {\n// \tmounted: (el: HTMLElement) => {\n// \t\tconst { distanceX, direction } = usePointerSwipe(el, {\n// \t\t\tdisableTextSelect: true,\n// \t\t\tonSwipe(e: PointerEvent) {\n// \t\t\t\tleft.value = -distanceX.value + 'px';\n// \t\t\t},\n// \t\t\tonSwipeEnd: (_e, direction) => {\n// \t\t\t\tclose(direction);\n// \t\t\t},\n// \t\t});\n// \t},\n// };\n</script>\n\n<template>\n\t<div\n\t\tclass=\"top-notice_item\"\n\t\t:class=\"{\n\t\t\t['top-notice_item-' + style]: true,\n\t\t\t'top-notice_item-hightlight': hightlight,\n\t\t\t'top-notice_item-showed': showed,\n\t\t\t'top-notice_item-closed': closed || forceClosed,\n\t\t\t['top-notice_item-closed_' + closedDirection]: closed,\n\t\t}\"\n\t\t@click=\"onClick\"\n\t\tv-swipe\n\t>\n\t\t<div class=\"top-notice_itemTextWrapper\">\n\t\t\t<div v-if=\"title\" class=\"top-notice_itemTitle\" v-html=\"title\"></div>\n\t\t\t<div v-if=\"text\" class=\"top-notice_itemText\" v-html=\"text\"></div>\n\t\t</div>\n\n\t\t<TopButton\n\t\t\tv-if=\"buttonProps\"\n\t\t\tclass=\"top-notice_itemButton\"\n\t\t\tsize=\"s\"\n\t\t\t:=\"buttonProps\"\n\t\t\t:title=\"buttonProps.title\"\n\t\t\tv-html=\"buttonProps.default\"\n\t\t\t@click=\"close()\"\n\t\t/>\n\n\t\t<div\n\t\t\tv-if=\"buttonsProps?.length\"\n\t\t\tclass=\"top-notice_itemButtons\"\n\t\t>\n\t\t\t<TopButton\n\t\t\t\tv-for=\"buttonProps in buttonsProps\"\n\t\t\t\tclass=\"top-notice_itemButton\"\n\t\t\t\tsize=\"s\"\n\t\t\t\t:=\"buttonProps\"\n\t\t\t\t:title=\"buttonProps.title\"\n\t\t\t\tv-html=\"buttonProps.default\"\n\t\t\t\t@click=\"close()\"\n\t\t\t/>\n\t\t</div>\n\n\t\t<div v-if=\"metaText\" class=\"top-notice_itemMetaText\" v-html=\"metaText\"></div>\n\n\t\t<div\n\t\t\tclass=\"top-notice_itemClose\"\n\t\t\tdata-top-icon=\"\"\n\t\t\t:title=\"$i18n.Common.Close\"\n\t\t\t@click=\"() => close()\"\n\t\t></div>\n\t</div>\n</template>\n\n<style>\n@import \"style.css\";\n</style>\n","<!-- performance all in one file component, для Core.notice() -->\n<script lang=\"ts\">\nexport { show } from './utils';\n</script>\n\n<script setup lang=\"ts\">\nimport type { Item } from './utils';\nimport { itemById } from './utils';\n\nimport type { Props } from './types';\nimport TopNoticeItem from './item/item.vue';\n\ndefineProps<Props>();\n\nconst onCloseItem = (item: Item) => {\n\titem.onClose?.();\n\n\titemById.delete(item.id);\n};\n</script>\n\n<template>\n\t<teleport to=\"body\">\n\t\t<div class=\"top-notice\">\n\t\t\t<TopNoticeItem\n\t\t\t\tv-for=\"[_index, item] in itemById\"\n\t\t\t\t:key=\"item.id\"\n\t\t\t\t:id=\"item.id\"\n\t\t\t\t:title=\"item.title\"\n\t\t\t\t:text=\"item.text\"\n\t\t\t\t:style=\"item.style\"\n\t\t\t\t:buttonProps=\"item.buttonProps\"\n\t\t\t\t:buttonsProps=\"item.buttonsProps\"\n\t\t\t\t:metaText=\"item.metaText\"\n\t\t\t\t:isSafeHTML=\"item.isSafeHTML\"\n\t\t\t\t:forceClosed=\"item.forceClosed\"\n\t\t\t\t:hightlight=\"item.hightlight\"\n\t\t\t\t@close=\"onCloseItem(item)\"\n\t\t\t/>\n\t\t</div>\n\t</teleport>\n</template>\n\n<style>\n:root {\n\t--top-notice-top: var(--top-padding-4);\n\t--top-notice-right: var(--top-padding-4);\n}\n\n.top-notice {\n\twidth: 400px;\n\tfont-size: 14px;\n\tposition: fixed; top: var(--top-notice-top); right: var(--top-notice-right);\n\tz-index: 1000010;\n\tdisplay: flex; flex-direction: column-reverse; gap: var(--top-gap-2);\n}\n\n.top-notice ul {\n\tpadding: 0 0 0 var(--top-padding-5);\n}\n\n@media only screen and (max-width: 600px) {\n\t:root {\n\t\t--top-notice-top: var(--top-padding-4);\n\t\t--top-notice-right: var(--top-padding-4);\n\t}\n\n\t.top-notice { width: auto; left: var(--top-notice-right); }\n}\n</style>\n"],"names":["itemById","vue","utils_string","text","style","options","show","title","chunks","id","_firstId","firstItem","close","forms","item","hightlight","prepareText","showed","closed","closedDirection","res","props","direction","onClick","e","tagName","el","_e","ui","_ui","_ctx","_hoisted_2","_hoisted_3","_cache","$event","buttonProps","metaText","_hoisted_6","onCloseItem","_hoisted_1"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"notice-CSGn_jTM.amd.js","sources":["../../src/components/core/notice/utils.ts","../../src/components/core/notice/item/item.vue","../../src/components/core/notice/notice.vue"],"sourcesContent":["import { reactive } from 'vue';\nimport type { Props as ItemProps, Props, Style } from '@/components/core/notice/item/types';\nimport Core from '@/core/core/core';\nimport { genIntHash } from '@/core/utils/string';\n\nexport const transitionDuration = 300;\n\nexport type Item = Props & { onClose?: Function };\n\nexport const itemById = reactive(new Map<string, Item>());\n\nconst genItemId = (text: ItemProps['text'], style: ItemProps['style'], options?: Options) => {\n\treturn 'top-notice_' + genIntHash(text + style + JSON.stringify(options));\n};\n\nexport type Options = {\n\ttitle?: ItemProps['title'],\n\tmetaText?: ItemProps['metaText'],\n\tbuttonProps?: ItemProps['buttonProps'],\n\tbuttonsProps?: ItemProps['buttonsProps'],\n\tisSafeHTML?: ItemProps['isSafeHTML'],\n\tselectToClose?: ItemProps['selectToClose'],\n\tonClose?: Function\n}\n\n/**\n * Показать сообщением в стиле push уведомления\n *\n * title будет получен из первой строки text\n *\n * Если в options указан title, он будет взят оттуда\n */\nexport const show = (text: string, style: Style = 'info', options?: Options) => {\n\tlet title = '';\n\n\ttext = String(text);\n\n\tconst id = genItemId(text, style, options);\n\n\tif (options?.title) {\n\t\ttitle = options.title;\n\t} else {\n\t\tconst chunks = text.split('\\n');\n\n\t\tif (chunks.length) {\n\t\t\ttitle = String(chunks.shift());\n\t\t\ttext = chunks.join('\\n');\n\t\t}\n\t}\n\n\tconst itemExists = itemById.get(id);\n\tif (itemExists) {\n\t\thightlight(itemExists);\n\n\t\treturn;\n\t}\n\n\tconst item: Item = {\n\t\tid,\n\t\ttitle,\n\t\ttext,\n\t\tstyle,\n\t\tbuttonProps: options?.buttonProps,\n\t\tbuttonsProps: options?.buttonsProps,\n\t\tmetaText: options?.metaText,\n\t\tisSafeHTML: options?.isSafeHTML,\n\t\tselectToClose: options?.selectToClose,\n\t\tonClose: options?.onClose,\n\t};\n\n\titemById.set(item.id, item);\n\n\tif (itemById.size > 5) {\n\t\tconst [_firstId, firstItem] = [...itemById].at(0) || [];\n\t\tif (firstItem) close(firstItem);\n\t}\n\n\t/**\n\t * Автозакрытие ошибок форм\n\t *\n\t * Добавляет\n\t */\n\tif (Core.state.isMobile) {\n\t\t$('input').one('click', () => close(item));\n\t}\n};\n\nconst hightlight = (item: Item) => {\n\titem.hightlight = true;\n\n\tsetTimeout(() => item.hightlight = false, transitionDuration);\n};\n\nconst close = (item: Item) => {\n\titem.forceClosed = true;\n\n\tsetTimeout(() => {\n\t\titem.onClose?.();\n\n\t\titemById.delete(item.id);\n\t}, transitionDuration);\n};\n\n/**\n * Убрать подозрительный html код\n */\nexport const prepareText = (text: string) => {\n\tconst textNoSafety = 'hacking was detected';\n\n\ttext = text.replace(/<script/g, textNoSafety);\n\ttext = text.replace(/<img/g, textNoSafety);\n\ttext = text.replace(/<iframe/g, textNoSafety);\n\ttext = text.replace(/javascript:/g, textNoSafety);\n\ttext = text.replace(/<[^>]+ (@|on)\\w+=[^>]+>?/g, textNoSafety);\n\n\treturn text;\n};\n","<script setup lang=\"ts\">\nimport { computed, ref, withDefaults } from 'vue';\n\nimport Core from '@/core/core/core';\nimport { nl2br } from '@/core/utils/string';\n\nimport type { Emits, Props } from './types';\nimport { prepareText, transitionDuration } from '@/components/core/notice/utils';\n\nconst props = withDefaults(defineProps<Props>(), {\n\tselectToClose: true,\n});\n\nconst emit = defineEmits<Emits>();\n\n// анимация появления\nconst showed = ref(false);\nsetTimeout(() => showed.value = true, 10);\n\n// анимация закрытия\nconst closed = ref(false);\nconst closedDirection = ref<'top' | 'right' | 'bottom' | 'left'>('right');\n\nconst title = computed(() => {\n\tlet res = props.title.replace(/ {2}/g, ' ');\n\n\tif (!props.isSafeHTML) res = prepareText(res);\n\n\treturn res;\n});\n\nconst text = computed(() => {\n\tlet res = nl2br(props.text);\n\n\tres = res.replace(/ {2}/g, ' ');\n\n\tif (!props.isSafeHTML) res = prepareText(res);\n\n\treturn res;\n});\n\nconst close = (direction?: typeof closedDirection.value) => {\n\tclosed.value = true;\n\n\tif (direction) {\n\t\tclosedDirection.value = direction;\n\t}\n\n\tsetTimeout(() => emit('close'), transitionDuration);\n};\n\nconst onClick = (e: MouseEvent) => {\n\tif (!props.selectToClose) return;\n\n\tconst { tagName } = e.target as HTMLElement;\n\n\tif (tagName === 'A') close();\n\tif (tagName === 'BUTTON') close();\n};\n\nconst vSwipe = {\n\tmounted: (el: HTMLElement) => {\n\t\tif (!Core.state.isMobile) return;\n\n\t\tif (!Core.$ || !Core.$.ui['draggable']) return;\n\n\t\tlet direction: typeof closedDirection.value = 'right';\n\n\t\tlet axis = 'x';\n\t\t// if (getOS() === 'iOS') axis = 'y';\n\n\t\tCore.$(el).draggable({\n\t\t\trevert: false,\n\t\t\taxis,\n\t\t\tdrag: (_e, ui) => {\n\t\t\t\tif (axis == 'x') {\n\t\t\t\t\tdirection = ui.position.left > 0 ? 'right' : 'left';\n\t\t\t\t} else {\n\t\t\t\t\tdirection = ui.position.top > 0 ? 'bottom' : 'top';\n\t\t\t\t}\n\t\t\t},\n\t\t\tstop: (_e, _ui) => {\n\t\t\t\tclose(direction);\n\t\t\t},\n\t\t});\n\t},\n};\n\n// const vSwipe = {\n// \tmounted: (el: HTMLElement) => {\n// \t\tconst { distanceX, direction } = usePointerSwipe(el, {\n// \t\t\tdisableTextSelect: true,\n// \t\t\tonSwipe(e: PointerEvent) {\n// \t\t\t\tleft.value = -distanceX.value + 'px';\n// \t\t\t},\n// \t\t\tonSwipeEnd: (_e, direction) => {\n// \t\t\t\tclose(direction);\n// \t\t\t},\n// \t\t});\n// \t},\n// };\n</script>\n\n<template>\n\t<div\n\t\tclass=\"top-notice_item\"\n\t\t:class=\"{\n\t\t\t['top-notice_item-' + style]: true,\n\t\t\t'top-notice_item-hightlight': hightlight,\n\t\t\t'top-notice_item-showed': showed,\n\t\t\t'top-notice_item-closed': closed || forceClosed,\n\t\t\t['top-notice_item-closed_' + closedDirection]: closed,\n\t\t}\"\n\t\t@click=\"onClick\"\n\t\tv-swipe\n\t>\n\t\t<div class=\"top-notice_itemTextWrapper\">\n\t\t\t<div v-if=\"title\" class=\"top-notice_itemTitle\" v-html=\"title\"></div>\n\t\t\t<div v-if=\"text\" class=\"top-notice_itemText\" v-html=\"text\"></div>\n\t\t</div>\n\n\t\t<TopButton\n\t\t\tv-if=\"buttonProps\"\n\t\t\tclass=\"top-notice_itemButton\"\n\t\t\tsize=\"s\"\n\t\t\t:=\"buttonProps\"\n\t\t\t:title=\"buttonProps.title\"\n\t\t\tv-html=\"buttonProps.default\"\n\t\t\t@click=\"close()\"\n\t\t/>\n\n\t\t<div\n\t\t\tv-if=\"buttonsProps?.length\"\n\t\t\tclass=\"top-notice_itemButtons\"\n\t\t>\n\t\t\t<TopButton\n\t\t\t\tv-for=\"buttonProps in buttonsProps\"\n\t\t\t\tclass=\"top-notice_itemButton\"\n\t\t\t\tsize=\"s\"\n\t\t\t\t:=\"buttonProps\"\n\t\t\t\t:title=\"buttonProps.title\"\n\t\t\t\tv-html=\"buttonProps.default\"\n\t\t\t\t@click=\"close()\"\n\t\t\t/>\n\t\t</div>\n\n\t\t<div v-if=\"metaText\" class=\"top-notice_itemMetaText\" v-html=\"metaText\"></div>\n\n\t\t<div\n\t\t\tclass=\"top-notice_itemClose\"\n\t\t\tdata-top-icon=\"\"\n\t\t\t:title=\"$i18n.Common.Close\"\n\t\t\t@click=\"() => close()\"\n\t\t></div>\n\t</div>\n</template>\n\n<style>\n@import \"style.css\";\n</style>\n","<!-- performance all in one file component, для Core.notice() -->\n<script lang=\"ts\">\nexport { show } from './utils';\n</script>\n\n<script setup lang=\"ts\">\nimport type { Item } from './utils';\nimport { itemById } from './utils';\n\nimport type { Props } from './types';\nimport TopNoticeItem from './item/item.vue';\n\ndefineProps<Props>();\n\nconst onCloseItem = (item: Item) => {\n\titem.onClose?.();\n\n\titemById.delete(item.id);\n};\n</script>\n\n<template>\n\t<teleport to=\"body\">\n\t\t<div class=\"top-notice\">\n\t\t\t<TopNoticeItem\n\t\t\t\tv-for=\"[_index, item] in itemById\"\n\t\t\t\t:key=\"item.id\"\n\t\t\t\t:id=\"item.id\"\n\t\t\t\t:title=\"item.title\"\n\t\t\t\t:text=\"item.text\"\n\t\t\t\t:style=\"item.style\"\n\t\t\t\t:buttonProps=\"item.buttonProps\"\n\t\t\t\t:buttonsProps=\"item.buttonsProps\"\n\t\t\t\t:metaText=\"item.metaText\"\n\t\t\t\t:isSafeHTML=\"item.isSafeHTML\"\n\t\t\t\t:forceClosed=\"item.forceClosed\"\n\t\t\t\t:hightlight=\"item.hightlight\"\n\t\t\t\t@close=\"onCloseItem(item)\"\n\t\t\t/>\n\t\t</div>\n\t</teleport>\n</template>\n\n<style>\n:root {\n\t--top-notice-top: var(--top-padding-4);\n\t--top-notice-right: var(--top-padding-4);\n}\n\n.top-notice {\n\twidth: 400px;\n\tfont-size: 14px;\n\tposition: fixed; top: var(--top-notice-top); right: var(--top-notice-right);\n\tz-index: 1000010;\n\tdisplay: flex; flex-direction: column-reverse; gap: var(--top-gap-2);\n}\n\n.top-notice ul {\n\tpadding: 0 0 0 var(--top-padding-5);\n}\n\n@media only screen and (max-width: 600px) {\n\t:root {\n\t\t--top-notice-top: var(--top-padding-4);\n\t\t--top-notice-right: var(--top-padding-4);\n\t}\n\n\t.top-notice { width: auto; left: var(--top-notice-right); }\n}\n</style>\n"],"names":["itemById","vue","utils_string","text","style","options","show","title","chunks","id","_firstId","firstItem","close","forms","item","hightlight","prepareText","showed","closed","closedDirection","res","props","direction","onClick","e","tagName","el","_e","ui","_ui","_ctx","_hoisted_2","_hoisted_3","_cache","$event","buttonProps","metaText","_hoisted_6","onCloseItem","_hoisted_1"],"mappings":"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"}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
_autoloadCSSCore.insertCSSLinkToPage(fileNames, true);
|
|
5
5
|
|
|
6
6
|
import { reactive as z, defineComponent as B, ref as b, computed as H, resolveComponent as D, withDirectives as E, createElementBlock as d, openBlock as r, normalizeClass as j, createElementVNode as M, createBlock as C, createCommentVNode as p, mergeProps as L, Fragment as S, renderList as w, Teleport as O, unref as V, normalizeStyle as A } from "vue";
|
|
7
|
-
import { C as m } from "./forms-
|
|
7
|
+
import { C as m } from "./forms-COXAfg9G.es.js";
|
|
8
8
|
import { genIntHash as F, nl2br as J } from "../utils/string.js";
|
|
9
9
|
const y = 300, f = z(/* @__PURE__ */ new Map()), U = (t, s, e) => "top-notice_" + F(t + s + JSON.stringify(e)), le = (t, s = "info", e) => {
|
|
10
10
|
let i = "";
|
|
@@ -191,4 +191,4 @@ export {
|
|
|
191
191
|
se as default,
|
|
192
192
|
le as show
|
|
193
193
|
};
|
|
194
|
-
//# sourceMappingURL=notice-
|
|
194
|
+
//# sourceMappingURL=notice-P7CXfEuX.es.js.map
|