@topvisor/ui 1.0.4 → 1.0.7

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.
Files changed (149) hide show
  1. package/.chunks/{datepicker-BJGX0c7G.amd.js → datepicker-CRfiJCmp.amd.js} +2 -2
  2. package/.chunks/{datepicker-BJGX0c7G.amd.js.map → datepicker-CRfiJCmp.amd.js.map} +1 -1
  3. package/.chunks/{datepicker-3uPurK_5.es.js → datepicker-CugKFVIH.es.js} +2 -2
  4. package/.chunks/{datepicker-3uPurK_5.es.js.map → datepicker-CugKFVIH.es.js.map} +1 -1
  5. package/.chunks/{forms-D9r2-H5Y.es.js → forms-CHiMZ8vg.es.js} +758 -743
  6. package/.chunks/forms-CHiMZ8vg.es.js.map +1 -0
  7. package/.chunks/forms-CjYoXTEQ.amd.js +3 -0
  8. package/.chunks/forms-CjYoXTEQ.amd.js.map +1 -0
  9. package/.chunks/{listItem.vue_vue_type_script_setup_true_lang-Bdv8YBAk.es.js → listItem.vue_vue_type_script_setup_true_lang-Bb7B8CTJ.es.js} +4 -4
  10. package/.chunks/{listItem.vue_vue_type_script_setup_true_lang-Bdv8YBAk.es.js.map → listItem.vue_vue_type_script_setup_true_lang-Bb7B8CTJ.es.js.map} +1 -1
  11. package/.chunks/{listItem.vue_vue_type_script_setup_true_lang-BxpjEUsq.amd.js → listItem.vue_vue_type_script_setup_true_lang-CEF3WDJ_.amd.js} +2 -2
  12. package/.chunks/{listItem.vue_vue_type_script_setup_true_lang-BxpjEUsq.amd.js.map → listItem.vue_vue_type_script_setup_true_lang-CEF3WDJ_.amd.js.map} +1 -1
  13. package/.chunks/{menu-B0Ul7Kbg.es.js → menu-CHeV29rC.es.js} +2 -2
  14. package/.chunks/{menu-B0Ul7Kbg.es.js.map → menu-CHeV29rC.es.js.map} +1 -1
  15. package/.chunks/{menu-CbhB9e4x.amd.js → menu-D1lnYuWU.amd.js} +2 -2
  16. package/.chunks/{menu-CbhB9e4x.amd.js.map → menu-D1lnYuWU.amd.js.map} +1 -1
  17. package/.chunks/{popup-pQCswyfj.amd.js → popup-C4Tne4qA.amd.js} +5 -5
  18. package/.chunks/{popup-pQCswyfj.amd.js.map → popup-C4Tne4qA.amd.js.map} +1 -1
  19. package/.chunks/{popup-Coq_61yv.es.js → popup-D-G2sXks.es.js} +2 -3
  20. package/.chunks/{popup-Coq_61yv.es.js.map → popup-D-G2sXks.es.js.map} +1 -1
  21. package/.chunks/utils-BOlUthaH.es.js +91 -0
  22. package/.chunks/utils-BOlUthaH.es.js.map +1 -0
  23. package/.chunks/utils-x88W55mf.amd.js +2 -0
  24. package/.chunks/utils-x88W55mf.amd.js.map +1 -0
  25. package/assets/forms.css +1 -1
  26. package/assets/project.css +1 -1
  27. package/assets/themes/dark.css +1 -1
  28. package/assets/themes/light.css +1 -1
  29. package/components/forms/avatar/avatar.vue.d.ts +3 -33
  30. package/components/forms/button/button.vue.d.ts +11 -31
  31. package/components/forms/checkbox/checkbox.vue.d.ts +12 -16
  32. package/components/forms/controlLabel/controlLabel.vue.d.ts +9 -13
  33. package/components/forms/hint/hint.vue.d.ts +2 -11
  34. package/components/forms/input/input.vue.d.ts +13 -31
  35. package/components/forms/inputDate/inputDate.vue.d.ts +6 -27
  36. package/components/forms/inputRange/inputRange.vue.d.ts +10 -5
  37. package/components/forms/loadbar/loadbar.vue.d.ts +2 -2
  38. package/components/forms/radio/radio.vue.d.ts +12 -16
  39. package/components/forms/select/select.vue.d.ts +8 -27
  40. package/components/forms/switcher/switcher.vue.d.ts +12 -16
  41. package/components/forms/textarea/textarea.vue.d.ts +6 -29
  42. package/components/formsExt/editArea/editArea.vue.d.ts +9 -38
  43. package/components/formsExt/editInput/editInput.vue.d.ts +5 -14
  44. package/components/formsExt/menu/menu.vue.d.ts +6 -27
  45. package/components/formsExt/radioGroup/radioGroup.vue.d.ts +8 -27
  46. package/components/formsExt/selector2/api.d.ts +2 -2
  47. package/components/formsExt/selector2/itemMulti.vue.d.ts +5 -14
  48. package/components/formsExt/selector2/selector2.vue.d.ts +107 -35
  49. package/components/popup/alert/alert.vue.d.ts +17 -21
  50. package/components/popup/confirm/confirm.vue.d.ts +19 -23
  51. package/components/popup/popup/listItem.vue.d.ts +10 -28
  52. package/components/popup/popup/opener.vue.d.ts +10 -30
  53. package/components/popup/popup/popup.vue.d.ts +21 -43
  54. package/components/popup/popup/widgetInput.vue.d.ts +11 -29
  55. package/components/popup/prompt/prompt.vue.d.ts +19 -23
  56. package/components/popup/worker.d.ts +0 -4
  57. package/components/project/project.d.ts +2 -0
  58. package/components/project/selectorCompetitors/selectorCompetitors.vue.d.ts +6 -27
  59. package/components/project/selectorRegion/composables/compare.d.ts +12 -0
  60. package/components/project/selectorRegion/composables/selectRegion.d.ts +14 -0
  61. package/components/project/selectorRegion/composables/selectSearcher.d.ts +13 -0
  62. package/components/project/selectorRegion/composables/selectorRegion.d.ts +25 -0
  63. package/components/project/selectorRegion/selectorRegion.d.ts +182 -0
  64. package/components/project/selectorRegion/selectorRegion.vue.d.ts +25 -0
  65. package/components/project/selectorRegion/stories/searchers.d.ts +3 -0
  66. package/components/project/selectorRegion/utils/consts.d.ts +20 -0
  67. package/components/project/selectorRegion/utils/utils.d.ts +23 -0
  68. package/components/project/utils.d.ts +1 -0
  69. package/components/tabs/tabs/content.vue.d.ts +9 -13
  70. package/components/tabs/tabs/tab.vue.d.ts +9 -13
  71. package/components/tabs/tabs/tabs.vue.d.ts +11 -15
  72. package/components/tabsView/tabsView/menu.vue.d.ts +17 -20
  73. package/components/tabsView/tabsView/menuDelimeter.vue.d.ts +2 -2
  74. package/components/tabsView/tabsView/menuItem.vue.d.ts +11 -29
  75. package/components/tabsView/tabsView/menuTitle.vue.d.ts +10 -14
  76. package/components/tabsView/tabsView/store.d.ts +6 -6
  77. package/components/tabsView/tabsView/tabsView.vue.d.ts +15 -31
  78. package/core/app.amd.js +1 -1
  79. package/core/app.amd.js.map +1 -1
  80. package/core/app.js +2 -2
  81. package/core/core/core.d.ts +0 -8
  82. package/core/core.amd.js +1 -1
  83. package/core/core.js +1 -1
  84. package/core/utils/date.d.ts +2 -2
  85. package/core/utils/scroll.d.ts +7 -1
  86. package/core/utils/searchers.d.ts +40 -0
  87. package/forms/forms.amd.js +1 -1
  88. package/forms/forms.js +5 -5
  89. package/formsExt/formsExt.amd.js +1 -1
  90. package/formsExt/formsExt.amd.js.map +1 -1
  91. package/formsExt/formsExt.js +64 -64
  92. package/icomoon/Topvisor icons.json +5846 -0
  93. package/icomoon/demo.html +26 -26
  94. package/icomoon/fonts/Topvisor-2.svg +12 -12
  95. package/icomoon/fonts/Topvisor-2.ttf +0 -0
  96. package/icomoon/fonts/Topvisor-2.woff +0 -0
  97. package/icomoon/selection.json +1 -1
  98. package/icomoon/style.css +16 -16
  99. package/package.json +1 -1
  100. package/popup/popup.amd.js +1 -1
  101. package/popup/popup.amd.js.map +1 -1
  102. package/popup/popup.js +14 -14
  103. package/popup/worker.amd.js +1 -1
  104. package/popup/worker.d.ts +0 -4
  105. package/popup/worker.js +3 -4
  106. package/project/project.amd.js +1 -1
  107. package/project/project.amd.js.map +1 -1
  108. package/project/project.js +366 -45
  109. package/project/project.js.map +1 -1
  110. package/project/utils.amd.js +2 -0
  111. package/project/utils.amd.js.map +1 -0
  112. package/project/utils.d.ts +2 -0
  113. package/project/utils.js +6 -0
  114. package/project/utils.js.map +1 -0
  115. package/tabs/tabs.amd.js +1 -1
  116. package/tabs/tabs.js +1 -1
  117. package/tabsView/tabsView.amd.js +1 -1
  118. package/tabsView/tabsView.amd.js.map +1 -1
  119. package/tabsView/tabsView.js +150 -143
  120. package/tabsView/tabsView.js.map +1 -1
  121. package/utils/date.amd.js +1 -1
  122. package/utils/date.js +1 -1
  123. package/utils/device.amd.js +1 -1
  124. package/utils/device.js +1 -1
  125. package/utils/lodash.amd.js +1 -1
  126. package/utils/lodash.js +4 -4
  127. package/utils/price.amd.js +1 -1
  128. package/utils/price.amd.js.map +1 -1
  129. package/utils/price.js +6 -7
  130. package/utils/price.js.map +1 -1
  131. package/utils/scroll.amd.js +1 -1
  132. package/utils/scroll.amd.js.map +1 -1
  133. package/utils/scroll.js +10 -8
  134. package/utils/scroll.js.map +1 -1
  135. package/utils/searchers.amd.js +2 -0
  136. package/utils/searchers.amd.js.map +1 -0
  137. package/utils/searchers.d.ts +2 -0
  138. package/utils/searchers.js +130 -0
  139. package/utils/searchers.js.map +1 -0
  140. package/utils/string.amd.js +1 -1
  141. package/utils/string.amd.js.map +1 -1
  142. package/utils/string.js +1 -1
  143. package/.chunks/forms-BImXJ_ZO.amd.js +0 -3
  144. package/.chunks/forms-BImXJ_ZO.amd.js.map +0 -1
  145. package/.chunks/forms-D9r2-H5Y.es.js.map +0 -1
  146. package/.chunks/i18n-C_OH9IT3.amd.js +0 -2
  147. package/.chunks/i18n-C_OH9IT3.amd.js.map +0 -1
  148. package/.chunks/i18n-DuTvft1T.es.js +0 -26
  149. package/.chunks/i18n-DuTvft1T.es.js.map +0 -1
@@ -1,61 +1,61 @@
1
- import j from "../core/core.js";
2
- import { watch as L, computed as M, ref as b, defineComponent as I, openBlock as l, createBlock as m, resolveDynamicComponent as O, normalizeClass as S, unref as n, withCtx as w, renderSlot as f, createElementBlock as d, createCommentVNode as h, mergeModels as R, useModel as D, useSlots as U, onMounted as q, onUnmounted as E, createElementVNode as y, toDisplayString as C, Fragment as G, createTextVNode as Q, markRaw as X, createVNode as Y, KeepAlive as Z } from "vue";
3
- import { C as $, _ as g, t as x } from "../.chunks/forms-D9r2-H5Y.es.js";
4
- import { getHash as A, genHash as ee, setHash as te, delHash as oe } from "../utils/route.js";
5
- import { d as se, u as ae } from "../.chunks/store-CX_6ZXhO.es.js";
6
- import { TopPopupListItem as z, TopPopup as ne } from "../popup/popup.js";
7
- import { sleepWhile as ie } from "../utils/system.js";
8
- const J = ["../assets/tabsView.css"].map((t) => import.meta.resolve(t));
9
- j.insertCSSLinkToPage(J, !0);
10
- const H = (t, o) => `top:${String(t)}:${o}`, le = (t, o) => {
1
+ import J from "../core/core.js";
2
+ import { watch as T, computed as M, ref as _, defineComponent as I, openBlock as r, createBlock as m, resolveDynamicComponent as R, normalizeClass as S, unref as i, withCtx as V, renderSlot as f, createElementBlock as d, createCommentVNode as y, mergeModels as D, useModel as E, useSlots as q, onMounted as G, onUnmounted as A, createElementVNode as v, toDisplayString as O, Fragment as Q, createTextVNode as X, markRaw as Y, createVNode as Z, KeepAlive as x } from "vue";
3
+ import { C as L, _ as g, x as ee } from "../.chunks/forms-CHiMZ8vg.es.js";
4
+ import { getHash as z, genHash as te, setHash as oe, delHash as se } from "../utils/route.js";
5
+ import { d as ae, u as ne } from "../.chunks/store-CX_6ZXhO.es.js";
6
+ import { TopPopupListItem as F, TopPopup as ie } from "../popup/popup.js";
7
+ import { sleepWhile as le } from "../utils/system.js";
8
+ const U = ["../assets/tabsView.css"].map((t) => import.meta.resolve(t));
9
+ J.insertCSSLinkToPage(U, !0);
10
+ const H = (t, o) => `top:${String(t)}:${o}`, re = (t, o) => {
11
11
  if (!o.$id) return;
12
12
  const e = H(t, o.$id);
13
13
  try {
14
- const a = JSON.parse(localStorage.getItem(e));
15
- typeof a == typeof o[t] && (o[t] = a);
14
+ const s = JSON.parse(localStorage.getItem(e));
15
+ typeof s == typeof o[t] && (o[t] = s);
16
16
  } catch {
17
17
  console.warn(new Error(`В localStorage[${e}] не корректный json`));
18
18
  }
19
- }, re = (t, o) => {
19
+ }, pe = (t, o) => {
20
20
  if (!o.$id) return;
21
21
  const e = H(t, o.$id);
22
- L(() => o[t], () => {
22
+ T(() => o[t], () => {
23
23
  localStorage.setItem(e, JSON.stringify(o[t]));
24
24
  }, { immediate: !0 });
25
- }, B = {
26
- loadLocalStorge: le,
27
- addSaverLocalStorge: re
25
+ }, C = {
26
+ loadLocalStorge: re,
27
+ addSaverLocalStorge: pe
28
28
  }, K = /* @__PURE__ */ new Set();
29
29
  addEventListener("popstate", (t) => {
30
30
  K.forEach((o) => o(t));
31
31
  });
32
- const F = Symbol(), pe = (t, o) => {
33
- const e = se(F, () => {
34
- const a = M(() => t.showMenuInPopup ?? $.state.isMobile), r = M(() => t.pageMod), c = b(!1), s = b(void 0), u = b(!0);
32
+ const W = Symbol(), ue = (t, o) => {
33
+ const e = ae(W, () => {
34
+ const s = M(() => t.showMenuInPopup ?? L.state.isMobile), p = M(() => t.pageMod), c = _(!1), n = _(void 0), l = _(!0);
35
35
  return {
36
- showMenuInPopup: a,
37
- pageMod: r,
36
+ showMenuInPopup: s,
37
+ pageMod: p,
38
38
  isShort: c,
39
39
  activeItemName: o,
40
- component: s,
41
- scrollable: u
40
+ component: n,
41
+ scrollable: l
42
42
  };
43
43
  }, t.idState);
44
44
  if (t.isShortable) {
45
- const a = "isShort";
46
- B.loadLocalStorge(a, e), B.addSaverLocalStorge(a, e);
45
+ const s = "isShort";
46
+ C.loadLocalStorge(s, e), C.addSaverLocalStorge(s, e);
47
47
  }
48
48
  if (e.$id) {
49
- const a = (r) => {
50
- o.value = A(e.$id);
49
+ const s = (p) => {
50
+ o.value = z(e.$id);
51
51
  };
52
- K.add(a);
52
+ K.add(s);
53
53
  }
54
54
  return e;
55
- }, T = () => ae(F), ue = {
55
+ }, P = () => ne(W), ce = {
56
56
  key: 1,
57
57
  class: "top-ellipsis"
58
- }, ce = /* @__PURE__ */ I({
58
+ }, de = /* @__PURE__ */ I({
59
59
  __name: "menuItem",
60
60
  props: {
61
61
  name: {},
@@ -66,49 +66,46 @@ const F = Symbol(), pe = (t, o) => {
66
66
  scrollable: { type: Boolean, default: !0 }
67
67
  },
68
68
  setup(t) {
69
- const o = t, e = T(), a = M(() => o.name && e.$id ? ee(e.$id, o.name) : o.href), r = M(() => e.showMenuInPopup ? z : a ? "a" : "button"), c = (s) => {
70
- !o.href && a.value && s.preventDefault(), o.name && (e.activeItemName = o.name);
69
+ const o = t, e = P(), s = M(() => o.name && e.$id ? te(e.$id, o.name) : o.href), p = M(() => e.showMenuInPopup ? F : s ? "a" : "button"), c = (n) => {
70
+ !o.href && s.value && n.preventDefault(), o.name && (e.activeItemName = o.name);
71
71
  };
72
- return (s, u) => (l(), m(O(r.value), {
72
+ return (n, l) => (r(), m(R(p.value), {
73
73
  target: "_self",
74
74
  class: S({
75
- "top-tabsView_menuItem": !n(e).showMenuInPopup,
76
- "top-active": s.name && n(e).activeItemName === s.name,
77
- "top-disabled": s.disabled,
75
+ "top-tabsView_menuItem": !i(e).showMenuInPopup,
76
+ "top-active": n.name && i(e).activeItemName === n.name,
77
+ "top-disabled": n.disabled,
78
78
  "top-spa-disabled": !0
79
79
  }),
80
- href: a.value,
81
- "data-top-icon": s.icon || void 0,
82
- disabled: s.disabled || void 0,
80
+ href: s.value,
81
+ "data-top-icon": n.icon || void 0,
82
+ disabled: n.disabled || void 0,
83
83
  onClick: c
84
84
  }, {
85
- default: w(() => [
86
- n(e).showMenuInPopup ? f(s.$slots, "default", { key: 0 }) : s.$slots.default && !n(e).isShort ? (l(), d("span", ue, [
87
- f(s.$slots, "default")
88
- ])) : h("", !0)
85
+ default: V(() => [
86
+ i(e).showMenuInPopup ? f(n.$slots, "default", { key: 0 }) : n.$slots.default && !i(e).isShort ? (r(), d("span", ce, [
87
+ f(n.$slots, "default")
88
+ ])) : y("", !0)
89
89
  ]),
90
90
  _: 3
91
91
  }, 8, ["class", "href", "data-top-icon", "disabled"]));
92
92
  }
93
- }), de = {
93
+ }), me = {
94
94
  "top-tabsView_menuItem": "top-tabsView_menuItem",
95
95
  "top-active": "top-active",
96
96
  "top-forms-option": "top-forms-option",
97
97
  "top-formsCaption": "top-formsCaption",
98
98
  "top-disabled": "top-disabled"
99
- }, me = {
100
- $style: de
101
- }, v = /* @__PURE__ */ g(ce, [["__cssModules", me]]), W = (t) => (t == null ? void 0 : t.name) === "AsyncComponentWrapper" && !(t != null && t.__asyncResolved), _e = async (t, o) => {
102
- (t == null ? void 0 : t.name) === "AsyncComponentWrapper" && (t != null && t.__asyncResolved || (t.__asyncLoader(), await ie(() => o() && W(t), 200)));
103
- }, be = { class: "top-tabsView_menuOpener" }, fe = ["data-top-icon"], we = { class: "top-ellipsis" }, Ve = /* @__PURE__ */ y("div", {
104
- class: "top-tabsView_menuOpenerIcon",
105
- "data-top-icon": ""
106
- }, null, -1), ve = { class: "top-tabsView_menuList" }, he = {
99
+ }, _e = {
100
+ $style: me
101
+ }, h = /* @__PURE__ */ g(de, [["__cssModules", _e]]), j = (t) => (t == null ? void 0 : t.name) === "AsyncComponentWrapper" && !(t != null && t.__asyncResolved), fe = async (t, o) => {
102
+ (t == null ? void 0 : t.name) === "AsyncComponentWrapper" && (t != null && t.__asyncResolved || (t.__asyncLoader(), await le(() => o() && j(t), 200)));
103
+ }, be = { class: "top-tabsView_menuOpener" }, we = ["data-top-icon"], Ve = { class: "top-ellipsis" }, ve = { class: "top-tabsView_menuList" }, he = {
107
104
  key: 0,
108
105
  class: "top-tabsView_menuFooter"
109
106
  }, ye = /* @__PURE__ */ I({
110
107
  __name: "menu",
111
- props: /* @__PURE__ */ R({
108
+ props: /* @__PURE__ */ D({
112
109
  isShortable: { type: Boolean },
113
110
  isLoading: { type: Boolean }
114
111
  }, {
@@ -117,100 +114,110 @@ const F = Symbol(), pe = (t, o) => {
117
114
  }),
118
115
  emits: ["update:isLoading"],
119
116
  setup(t) {
120
- const o = D(t, "isLoading"), e = T(), a = U(), r = /* @__PURE__ */ new Map(), c = () => {
121
- if (!a.default) return;
122
- const p = a.default().find((i) => i.key === "_menu");
123
- p && p.children.forEach((i) => {
124
- var k, N;
125
- if (i.type.__name !== v.__name || !i.props.name || i.props.disabled) return;
126
- const P = {
127
- title: ((N = (k = i.children).default) == null ? void 0 : N.call(k)[0].children).trim(),
128
- icon: i.props.icon,
129
- component: i.props.component ? X(i.props.component) : v.props.component.default,
130
- scrollable: i.props.scrollable ?? v.props.scrollable.default
117
+ const o = E(t, "isLoading"), e = P(), s = q(), p = /* @__PURE__ */ new Map(), c = () => {
118
+ if (!s.default) return;
119
+ const u = s.default().find((a) => a.key === "_menu");
120
+ u && n(u.children);
121
+ }, n = (u) => {
122
+ u.forEach((a) => {
123
+ var N, B;
124
+ if (a.type.__name && a.type.__name !== h.__name) return;
125
+ if (!a.type.__name && a.children) {
126
+ n(a.children);
127
+ return;
128
+ }
129
+ if (!a.props.name || a.props.disabled) return;
130
+ const k = {
131
+ title: ((B = (N = a.children).default) == null ? void 0 : B.call(N)[0].children).trim(),
132
+ icon: a.props.icon,
133
+ component: a.props.component ? Y(a.props.component) : h.props.component.default,
134
+ scrollable: a.props.scrollable ?? h.props.scrollable.default
131
135
  };
132
- r.set(i.props.name, P);
136
+ p.set(a.props.name, k);
133
137
  });
134
- }, s = b(null);
135
- let u = 0;
136
- L(
138
+ }, l = _(null);
139
+ let b = 0;
140
+ T(
137
141
  () => e.activeItemName,
138
142
  async () => {
139
- const p = ++u;
140
- if (r.size === 0 && c(), r.size === 0) {
143
+ const u = ++b;
144
+ if (p.size === 0 && c(), p.size === 0) {
141
145
  e.activeItemName = "";
142
146
  return;
143
147
  }
144
- if (s.value = r.get(e.activeItemName) ?? null, !s.value && e.$id) {
145
- const i = A(e.$id);
146
- if (s.value = r.get(i) ?? null, s.value) {
147
- e.activeItemName = i;
148
+ if (l.value = p.get(e.activeItemName) ?? null, !l.value && e.$id) {
149
+ const a = z(e.$id);
150
+ if (l.value = p.get(a) ?? null, l.value) {
151
+ e.activeItemName = a;
148
152
  return;
149
153
  }
150
154
  }
151
- if (!s.value) {
152
- e.activeItemName = r.keys().next().value;
155
+ if (!l.value) {
156
+ e.activeItemName = p.keys().next().value;
153
157
  return;
154
158
  }
155
- if (s.value.component === e.component) {
159
+ if (l.value.component === e.component) {
156
160
  o.value = !1;
157
161
  return;
158
162
  }
159
- e.$id && te(e.$id, e.activeItemName, !1), o.value = !0, await _e(s.value.component, () => p === u), p === u && (e.scrollable = s.value.scrollable, e.component = s.value.component, s.value && !e.component && console.warn(`Компонент вкладки ${e.activeItemName} не найден. Добавьте props.component для пункта меню ${e.activeItemName}.`));
163
+ e.$id && oe(e.$id, e.activeItemName, !1), o.value = !0, await fe(l.value.component, () => u === b), u === b && (e.scrollable = l.value.scrollable, e.component = l.value.component, l.value && !e.component && console.warn(`Компонент вкладки ${e.activeItemName} не найден. Добавьте props.component для пункта меню ${e.activeItemName}.`));
160
164
  },
161
165
  { immediate: !0 }
162
166
  );
163
- const _ = b();
164
- let V;
165
- return q(() => {
166
- V = new ResizeObserver(() => {
167
- _.value.parentElement.style.setProperty("--top-tabsView-contents-offset-top", _.value.offsetHeight + "px");
168
- }), V.observe(_.value);
169
- }), E(() => {
170
- V.disconnect();
171
- }), (p, i) => (l(), d("div", {
167
+ const w = _();
168
+ let $;
169
+ return G(() => {
170
+ $ = new ResizeObserver(() => {
171
+ w.value.parentElement.style.setProperty("--top-tabsView-contents-offset-top", w.value.offsetHeight + "px");
172
+ }), $.observe(w.value);
173
+ }), A(() => {
174
+ $.disconnect();
175
+ }), (u, a) => (r(), d("div", {
172
176
  ref_key: "elRef",
173
- ref: _,
177
+ ref: w,
174
178
  class: S({
175
179
  "top-tabsView_menu": !0,
176
- "top-tabsView_menu-inPopup_0": !n(e).showMenuInPopup,
177
- "top-tabsView_menu-inPopup_1": n(e).showMenuInPopup,
178
- "top-tabsView_menu-short": n(e).isShort && !n(e).showMenuInPopup
180
+ "top-tabsView_menu-inPopup_0": !i(e).showMenuInPopup,
181
+ "top-tabsView_menu-inPopup_1": i(e).showMenuInPopup,
182
+ "top-tabsView_menu-short": i(e).isShort && !i(e).showMenuInPopup
179
183
  })
180
184
  }, [
181
- n(e).showMenuInPopup ? (l(), m(n(ne), { key: 0 }, {
182
- opener: w(() => [
183
- y("div", be, [
184
- s.value ? (l(), d("div", {
185
+ i(e).showMenuInPopup ? (r(), m(i(ie), { key: 0 }, {
186
+ opener: V(() => [
187
+ v("div", be, [
188
+ l.value ? (r(), d("div", {
185
189
  key: 0,
186
190
  class: "top-tabsView_menuOpenerActiveItem",
187
- "data-top-icon": s.value.icon
191
+ "data-top-icon": l.value.icon
188
192
  }, [
189
- y("span", we, C(s.value.title), 1)
190
- ], 8, fe)) : h("", !0),
191
- Ve
193
+ v("span", Ve, O(l.value.title), 1)
194
+ ], 8, we)) : y("", !0),
195
+ a[1] || (a[1] = v("div", {
196
+ class: "top-tabsView_menuOpenerIcon",
197
+ "data-top-icon": ""
198
+ }, null, -1))
192
199
  ])
193
200
  ]),
194
- contentList: w(() => [
195
- f(p.$slots, "default")
201
+ contentList: V(() => [
202
+ f(u.$slots, "default")
196
203
  ]),
197
204
  _: 3
198
- })) : (l(), d(G, { key: 1 }, [
199
- y("div", ve, [
200
- f(p.$slots, "default")
205
+ })) : (r(), d(Q, { key: 1 }, [
206
+ v("div", ve, [
207
+ f(u.$slots, "default")
201
208
  ]),
202
- p.isShortable ? (l(), d("div", he, [
203
- p.isShortable ? (l(), m(v, {
209
+ u.isShortable ? (r(), d("div", he, [
210
+ u.isShortable ? (r(), m(h, {
204
211
  key: 0,
205
- icon: n(e).isShort ? "" : "",
206
- onClick: i[0] || (i[0] = (P) => n(e).isShort = !n(e).isShort)
212
+ icon: i(e).isShort ? "" : "",
213
+ onClick: a[0] || (a[0] = (k) => i(e).isShort = !i(e).isShort)
207
214
  }, {
208
- default: w(() => [
209
- Q(C(n(e).isShort ? "" : "Свернуть"), 1)
215
+ default: V(() => [
216
+ X(O(i(e).isShort ? "" : "Свернуть"), 1)
210
217
  ]),
211
218
  _: 1
212
- }, 8, ["icon"])) : h("", !0)
213
- ])) : h("", !0)
219
+ }, 8, ["icon"])) : y("", !0)
220
+ ])) : y("", !0)
214
221
  ], 64))
215
222
  ], 2));
216
223
  }
@@ -230,7 +237,7 @@ const F = Symbol(), pe = (t, o) => {
230
237
  $style: Se
231
238
  }, Me = /* @__PURE__ */ g(ye, [["__cssModules", ge]]), Ie = /* @__PURE__ */ I({
232
239
  __name: "tabsView",
233
- props: /* @__PURE__ */ R({
240
+ props: /* @__PURE__ */ D({
234
241
  modelValue: {},
235
242
  pageMod: { type: Boolean },
236
243
  showMenuInPopup: { type: Boolean, default: void 0 },
@@ -242,40 +249,40 @@ const F = Symbol(), pe = (t, o) => {
242
249
  }),
243
250
  emits: ["update:modelValue"],
244
251
  setup(t) {
245
- const o = t, e = D(t, "modelValue"), a = pe(o, e), r = Math.random();
246
- o.pageMod && $.state.documentClassModificators.set(r, "top-hasTabsViewPageMod"), E(() => {
247
- o.pageMod && $.state.documentClassModificators.delete(r), a.$id && oe(a.$id, a.activeItemName, !0);
252
+ const o = t, e = E(t, "modelValue"), s = ue(o, e), p = Math.random();
253
+ o.pageMod && L.state.documentClassModificators.set(p, "top-hasTabsViewPageMod"), A(() => {
254
+ o.pageMod && L.state.documentClassModificators.delete(p), s.$id && se(s.$id, s.activeItemName, !0);
248
255
  });
249
- const c = b(), s = b(!1);
250
- return L([c, () => a.component], () => {
251
- s.value = W(a.component);
252
- }, { immediate: !0 }), (u, _) => (l(), d("div", {
256
+ const c = _(), n = _(!1);
257
+ return T([c, () => s.component], () => {
258
+ n.value = j(s.component);
259
+ }, { immediate: !0 }), (l, b) => (r(), d("div", {
253
260
  class: S({
254
261
  "top-tabsView": !0,
255
262
  "top-tabsView-pageMod": o.pageMod,
256
- "top-tabsView-inPopup": n(a).showMenuInPopup
263
+ "top-tabsView-inPopup": i(s).showMenuInPopup
257
264
  })
258
265
  }, [
259
- Y(Me, {
260
- isShortable: u.isShortable,
261
- isLoading: s.value,
262
- "onUpdate:isLoading": _[0] || (_[0] = (V) => s.value = V)
266
+ Z(Me, {
267
+ isShortable: l.isShortable,
268
+ isLoading: n.value,
269
+ "onUpdate:isLoading": b[0] || (b[0] = (w) => n.value = w)
263
270
  }, {
264
- default: w(() => [
265
- f(u.$slots, "menu")
271
+ default: V(() => [
272
+ f(l.$slots, "menu")
266
273
  ]),
267
274
  _: 3
268
275
  }, 8, ["isShortable", "isLoading"]),
269
- y("div", {
276
+ v("div", {
270
277
  class: S({
271
278
  "top-tabsView_contents": !0,
272
- "top-tabsView_contents-isLoading": s.value,
273
- "top-tabsView_contents-noScrollable": !n(a).scrollable
279
+ "top-tabsView_contents-isLoading": n.value,
280
+ "top-tabsView_contents-noScrollable": !i(s).scrollable
274
281
  })
275
282
  }, [
276
- s.value ? (l(), m(x, { key: 0 })) : h("", !0),
277
- (l(), m(Z, null, [
278
- (l(), m(O(n(a).component), {
283
+ n.value ? (r(), m(ee, { key: 0 })) : y("", !0),
284
+ (r(), m(x, null, [
285
+ (r(), m(R(i(s).component), {
279
286
  ref_key: "componentRef",
280
287
  ref: c
281
288
  }, null, 512))
@@ -294,27 +301,27 @@ const F = Symbol(), pe = (t, o) => {
294
301
  }, Te = /* @__PURE__ */ g(Ie, [["__cssModules", Le]]), Pe = {
295
302
  "top-tabsView_menuDelimeter": "top-tabsView_menuDelimeter"
296
303
  }, ke = {}, Ne = { class: "top-tabsView_menuDelimeter" };
297
- function Ce(t, o) {
298
- return l(), d("div", Ne);
304
+ function Be(t, o) {
305
+ return r(), d("div", Ne);
299
306
  }
300
- const Be = {
307
+ const Oe = {
301
308
  $style: Pe
302
- }, Oe = /* @__PURE__ */ g(ke, [["render", Ce], ["__cssModules", Be]]), Re = /* @__PURE__ */ I({
309
+ }, Ce = /* @__PURE__ */ g(ke, [["render", Be], ["__cssModules", Oe]]), Re = /* @__PURE__ */ I({
303
310
  __name: "menuTitle",
304
311
  props: {
305
312
  isSubtitle: { type: Boolean }
306
313
  },
307
314
  setup(t) {
308
- const o = T();
309
- return (e, a) => n(o).showMenuInPopup ? (l(), m(n(z), {
315
+ const o = P();
316
+ return (e, s) => i(o).showMenuInPopup ? (r(), m(i(F), {
310
317
  key: 0,
311
318
  type: "title"
312
319
  }, {
313
- default: w(() => [
320
+ default: V(() => [
314
321
  f(e.$slots, "default")
315
322
  ]),
316
323
  _: 3
317
- })) : n(o).isShort ? (l(), m(Oe, { key: 1 })) : (l(), d("div", {
324
+ })) : i(o).isShort ? (r(), m(Ce, { key: 1 })) : (r(), d("div", {
318
325
  key: 2,
319
326
  class: S({
320
327
  "top-tabsView_menuTitle": !0,
@@ -329,7 +336,7 @@ const Be = {
329
336
  "top-tabsView_menuTitle-subtitle": "top-tabsView_menuTitle-subtitle"
330
337
  }, Ee = {
331
338
  $style: De
332
- }, Ae = /* @__PURE__ */ g(Re, [["__cssModules", Ee]]), Ue = Te, qe = v, Ge = Ae;
339
+ }, Ae = /* @__PURE__ */ g(Re, [["__cssModules", Ee]]), Ue = Te, qe = h, Ge = Ae;
333
340
  export {
334
341
  Ue as TopTabsView,
335
342
  qe as TopTabsViewMenuItem,
@@ -1 +1 @@
1
- {"version":3,"file":"tabsView.js","sources":["../../src/core/utils/store/localStorage.ts","../../src/components/tabsView/tabsView/store.ts","../../src/components/tabsView/tabsView/menuItem.vue","../../src/components/tabsView/tabsView/utils.ts","../../src/components/tabsView/tabsView/menu.vue","../../src/components/tabsView/tabsView/tabsView.vue","../../src/components/tabsView/tabsView/menuDelimeter.vue","../../src/components/tabsView/tabsView/menuTitle.vue","../../src/components/tabsView/tabsView.ts"],"sourcesContent":["import { watch } from 'vue';\r\nimport type { Store } from './store';\r\n\r\n/**\r\n * Сгенерировать имя для сохранения данных в localStorage\r\n * @param stateName - имя свойства состояния\r\n * @param stateKey - ключ состояния, разные компоненты могут использовать одинаковый ключ\r\n */\r\nconst genStorageKey = <T extends Store>(stateName: keyof T, stateKey: string): string => {\r\n\tconst stateNameString = String(stateName);\r\n\r\n\treturn `top:${stateNameString}:${stateKey}`;\r\n};\r\n\r\n/**\r\n * Загрузить состояние\r\n * @param stateName - имя свойства состояния\r\n * @param store\r\n */\r\nconst loadLocalStorge = <T extends Store>(stateName: keyof T, store: T) => {\r\n\t// если Store.key не знадан, значит сохранение состояния в компоненте отключено\r\n\tif (!store.$id) return;\r\n\r\n\tconst localStorageKey = genStorageKey(stateName, store.$id);\r\n\r\n\ttry {\r\n\t\tconst localStorageValue: typeof store[keyof typeof store] = JSON.parse(localStorage.getItem(localStorageKey) as string);\r\n\r\n\t\tif (typeof localStorageValue === typeof store[stateName]) {\r\n\t\t\tstore[stateName] = localStorageValue;\r\n\t\t}\r\n\t} catch (e) {\r\n\t\tconsole.warn(new Error(`В localStorage[${localStorageKey}] не корректный json`));\r\n\t}\r\n};\r\n\r\n/**\r\n * Добавить автосохранение состояние при его изменении\r\n * @param stateName - имя свойства состояния\r\n * @param store\r\n */\r\nconst addSaverLocalStorge = <T extends Store>(stateName: keyof T, store: T) => {\r\n\t// если store.$id не знадан, значит сохранение состояния в компоненте отключено\r\n\tif (!store.$id) return;\r\n\r\n\tconst localStorageKey = genStorageKey(stateName, store.$id);\r\n\r\n\twatch(() => store[stateName], () => {\r\n\t\tlocalStorage.setItem(localStorageKey, JSON.stringify(store[stateName]));\r\n\t}, { immediate: true });\r\n};\r\n\r\nexport default {\r\n\tloadLocalStorge,\r\n\taddSaverLocalStorge,\r\n};","import type { InjectionKey, ModelRef } from 'vue';\r\nimport { computed, ref } from 'vue';\r\nimport Core from '@/core/core/core';\r\nimport { defineStore, useStore } from '@/core/utils/store';\r\nimport StoreLocalStorage from '@/core/utils/store/localStorage';\r\nimport type { Props, Store } from './tabsView';\r\nimport { getHash } from '@/core/utils/route';\r\n\r\nconst popstateCallbacks = new Set<(e: PopStateEvent) => void>();\r\n\r\naddEventListener('popstate', (e) => {\r\n\tpopstateCallbacks.forEach(popstateCallback => popstateCallback(e));\r\n});\r\n\r\nexport const injectionKey = Symbol() as InjectionKey<Store>;\r\n\r\n/**\r\n * Инициировать Store компонента\r\n */\r\nexport const defineTabsStore = (props: Props, model: ModelRef<string | undefined>) => {\r\n\tconst store = defineStore(injectionKey, () => {\r\n\t\tconst showMenuInPopup = computed(() => props.showMenuInPopup ?? Core.state.isMobile);\r\n\t\tconst pageMod = computed(() => props.pageMod);\r\n\t\tconst isShort = ref(false);\r\n\r\n\t\tconst component = ref(undefined);\r\n\t\tconst scrollable = ref(true);\r\n\r\n\t\treturn {\r\n\t\t\tshowMenuInPopup,\r\n\t\t\tpageMod,\r\n\t\t\tisShort,\r\n\t\t\tactiveItemName: model,\r\n\t\t\tcomponent,\r\n\t\t\tscrollable,\r\n\t\t};\r\n\t}, props.idState);\r\n\r\n\tif (props.isShortable) {\r\n\t\tconst stateName = 'isShort';\r\n\r\n\t\tStoreLocalStorage.loadLocalStorge(stateName, store);\r\n\t\tStoreLocalStorage.addSaverLocalStorge(stateName, store);\r\n\t}\r\n\r\n\tif (store.$id) {\r\n\t\tconst popstateCallback = (e: PopStateEvent) => {\r\n\t\t\tmodel.value = getHash(store.$id!);\r\n\t\t};\r\n\r\n\t\tpopstateCallbacks.add(popstateCallback);\r\n\t}\r\n\r\n\treturn store;\r\n};\r\n\r\n/**\r\n * Получить Store компонента\r\n */\r\nexport const useTabsStore = () => useStore(injectionKey);\r\n","<script setup lang=\"ts\">\r\nimport { computed } from 'vue';\r\nimport { genHash } from '@/core/utils/route';\r\nimport { TopPopupListItem } from '@/components/popup/popup';\r\nimport { useTabsStore } from './store';\r\nimport type { PropsMenuItem } from './tabsView';\r\n\r\nconst props = withDefaults(defineProps<PropsMenuItem>(), {\r\n\tscrollable: true,\r\n\tcomponent: undefined,\r\n});\r\n\r\nconst store = useTabsStore();\r\n\r\nconst href = computed(() => {\r\n\t// это внутренняя хеш навигация, ссылка на вкладку\r\n\tif (props.name && store.$id) {\r\n\t\treturn genHash(store.$id, props.name);\r\n\t}\r\n\r\n\treturn props.href;\r\n});\r\n\r\nconst tagName = computed(() => {\r\n\tif (store.showMenuInPopup) {\r\n\t\treturn TopPopupListItem;\r\n\t}\r\n\r\n\treturn href ? 'a' : 'button';\r\n});\r\n\r\n/**\r\n * Клик по элементу меню\r\n */\r\nconst onClick = (e: MouseEvent) => {\r\n\t// это внутренняя хеш навигация, ссылка на вкладку\r\n\tif (!props.href && href.value) {\r\n\t\te.preventDefault();\r\n\t}\r\n\r\n\tif (props.name) {\r\n\t\tstore.activeItemName = props.name;\r\n\t}\r\n};\r\n</script>\r\n\r\n<template>\r\n\t<component\r\n\t\t:is=\"tagName\"\r\n\t\ttarget=\"_self\"\r\n\t\t:class=\"{\r\n\t\t\t['top-tabsView_menuItem']: !store.showMenuInPopup,\r\n\t\t\t['top-active']: name && store.activeItemName === name,\r\n\t\t\t['top-disabled']: disabled,\r\n\t\t\t['top-spa-disabled']: true,\r\n\t\t}\"\r\n\t\t:href=\"href\"\r\n\t\t:data-top-icon=\"icon || undefined\"\r\n\t\t:disabled=\"disabled || undefined\"\r\n\t\t@click=\"onClick\"\r\n\t>\r\n\t\t<slot v-if=\"store.showMenuInPopup\"></slot>\r\n\r\n\t\t<span\r\n\t\t\tv-else-if=\"$slots.default && !store.isShort\"\r\n\t\t\tclass=\"top-ellipsis\"\r\n\t\t>\r\n\t\t\t<slot></slot>\r\n\t\t</span>\r\n\t</component>\r\n</template>\r\n\r\n<style module>\r\n.top-tabsView_menuItem {\r\n\t--top-icon-color: var(--color-text-2);\r\n\t--top-icon-width: calc(var(--top-icon-size));\r\n\r\n\tcursor: pointer;\r\n\tbox-sizing: border-box;\r\n\r\n\tborder: none;\r\n\tborder-radius: var(--top-radius-2);\r\n\tpadding: var(--top-padding-2);\r\n\tbackground: transparent;\r\n\theight: 40px;\r\n\r\n\tcolor: var(--color-text-1);\r\n\ttext-decoration: none;\r\n\twhite-space: nowrap;\r\n\r\n\tdisplay: flex;\r\n\tgap: var(--top-gap-2);\r\n\talign-items: center;\r\n\tjustify-content: flex-start;\r\n\ttransition: background var(--transition);\r\n}\r\n\r\n.top-tabsView_menuItem:hover {\r\n\t--top-icon-color: var(--color-text-1);\r\n\r\n\tbackground: var(--color-bg-shading-2);\r\n\ttext-decoration: none;\r\n}\r\n\r\n.top-tabsView_menuItem.top-active {\r\n\tcursor: unset;\r\n\tbackground: var(--color-layout-front-1);\r\n}\r\n\r\n.top-tabsView_menuItem:disabled:not(option):not(optgroup):not(.top-forms-option),\r\n.top-tabsView_menuItem:disabled ~ .top-formsCaption,\r\n.top-tabsView_menuItem.top-disabled[data-top-icon]:before,\r\n.top-tabsView_menuItem.top-disabled[data-top-icon2]:after {\r\n\topacity: unset;\r\n\tfilter: unset;\r\n}\r\n\r\n.top-tabsView_menuItem.top-disabled {\r\n\t--top-icon-color: var(--color-text-4);\r\n\r\n\tcolor: var(--color-text-4);\r\n}\r\n</style>\r\n","// TODO: Эту функцию можно вынести в глобальный utils\r\n\r\nimport { sleepWhile } from '@/core/utils/system';\r\n\r\n/**\r\n * Проверка нахождения компонента в состояние загрузки\r\n * @param component\r\n */\r\nexport const checkComponentIsLoading = (component: any) => {\r\n\treturn component?.name === 'AsyncComponentWrapper' && !component?.__asyncResolved;\r\n};\r\n\r\n/**\r\n * Презагрузить компонент\r\n *\r\n * Некоторое время ожидает загрузку компонента, прежде чем завершит работу\r\n */\r\nexport const preResolveComponent = async (component: any, condition: Function) => {\r\n\tif (component?.name !== 'AsyncComponentWrapper') return;\r\n\tif (component?.__asyncResolved) return;\r\n\r\n\tcomponent.__asyncLoader();\r\n\r\n\tawait sleepWhile(() => {\r\n\t\treturn condition() && checkComponentIsLoading(component);\r\n\t}, 200);\r\n};\r\n","<script setup lang=\"ts\">\r\nimport type { Ref } from 'vue';\r\nimport { markRaw, onMounted, onUnmounted, ref, useSlots, watch } from 'vue';\r\nimport { TopPopup } from '../../popup/popup';\r\nimport { getHash, setHash } from '@/core/utils/route';\r\n\r\nimport type { MenuItem, PropsMenu, PropsMenuItem } from './tabsView';\r\nimport { useTabsStore } from './store';\r\nimport TabsViewMenuItem from './menuItem.vue';\r\nimport { preResolveComponent } from './utils';\r\n\r\ndefineProps<PropsMenu>();\r\n\r\nconst isLoading = defineModel('isLoading');\r\n\r\nconst store = useTabsStore();\r\n\r\nconst slots = useSlots();\r\n\r\n// словарь используется для оптимизации получения нужного menuItem\r\nconst menuItemByName: Map<PropsMenuItem['name'], MenuItem> = new Map();\r\n\r\n// сгенерировать словарь с menuItem, по элементам в slot\r\nconst genMenuItemByName = () => {\r\n\tif (!slots.default) return;\r\n\r\n\tconst component: any = slots.default().find(item => item.key === '_menu');\r\n\tif (!component) return;\r\n\r\n\tcomponent.children.forEach((subComponent: any) => {\r\n\t\tif (subComponent.type.__name !== TabsViewMenuItem.__name) return;\r\n\t\tif (!subComponent.props.name || subComponent.props.disabled) return;\r\n\r\n\t\tconst menuItem: MenuItem = {\r\n\t\t\ttitle: (subComponent.children.default?.()[0].children as string).trim(),\r\n\t\t\ticon: subComponent.props.icon,\r\n\t\t\tcomponent: subComponent.props.component ? markRaw(subComponent.props.component) : TabsViewMenuItem.props.component.default,\r\n\t\t\tscrollable: subComponent.props.scrollable ?? TabsViewMenuItem.props.scrollable.default,\r\n\t\t};\r\n\r\n\t\tmenuItemByName.set(subComponent.props.name, menuItem);\r\n\t});\r\n};\r\n\r\n/**\r\n * activeMenuItem нужен:\r\n * - для вывода текста активной вкладки в меню с popup\r\n * - для вывода компонента активной вкладки (store.component)\r\n * - для установки store.scrollable\r\n */\r\nconst activeMenuItem: Ref<MenuItem | null> = ref(null);\r\n\r\n/**\r\n * Кол-во изменений активной вкладки\r\n */\r\nlet countChanged = 0;\r\n\r\n/**\r\n * Смена активной вкладки\r\n *\r\n * TODO: смена slot, например смена языка, требует повторного выполнения genMenuItemByName()\r\n */\r\nwatch(\r\n\t() => store.activeItemName,\r\n\tasync () => {\r\n\t\tconst numberChanged = ++countChanged; // порядковый номер текущего изменения\r\n\r\n\t\tif (menuItemByName.size === 0) {\r\n\t\t\tgenMenuItemByName();\r\n\t\t}\r\n\r\n\t\tif (menuItemByName.size === 0) {\r\n\t\t\tstore.activeItemName = '';\r\n\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tactiveMenuItem.value = menuItemByName.get(store.activeItemName) ?? null;\r\n\r\n\t\t// элемент не найден, установить из хеша страницы\r\n\t\tif (!activeMenuItem.value && store.$id) {\r\n\t\t\tconst activeItemName = getHash(store.$id);\r\n\r\n\t\t\tactiveMenuItem.value = menuItemByName.get(activeItemName) ?? null;\r\n\r\n\t\t\tif (activeMenuItem.value) {\r\n\t\t\t\tstore.activeItemName = activeItemName;\r\n\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\t// элемент не найден, установить первый доступный\r\n\t\tif (!activeMenuItem.value) {\r\n\t\t\tstore.activeItemName = menuItemByName.keys().next().value;\r\n\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\t// запрошена смена на уже активный элемент\r\n\t\tif (activeMenuItem.value.component === store.component) {\r\n\t\t\tisLoading.value = false;\r\n\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tif (store.$id) setHash(store.$id, store.activeItemName, false);\r\n\r\n\t\t// флаг загрузки будет сброшен при инициализации компонента\r\n\t\tisLoading.value = true;\r\n\r\n\t\t/**\r\n\t\t * Презагрузить компонент\r\n\t\t *\r\n\t\t * Нужно для того, чтобы минимизировать скачки интерфейса при ожидании загрузки асинхронного компонента\r\n\t\t */\r\n\t\tawait preResolveComponent(activeMenuItem.value.component, () => numberChanged === countChanged);\r\n\r\n\t\t// влкадка была сменена еще раз во время sleepWhile\r\n\t\tif (numberChanged !== countChanged) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tstore.scrollable = activeMenuItem.value.scrollable;\r\n\t\tstore.component = activeMenuItem.value.component;\r\n\r\n\t\tif (activeMenuItem.value && !store.component) {\r\n\t\t\tconsole.warn(`Компонент вкладки ${store.activeItemName} не найден. Добавьте props.component для пункта меню ${store.activeItemName}.`);\r\n\t\t}\r\n\t},\r\n\t{ immediate: true },\r\n);\r\n\r\nconst elRef = ref();\r\nlet resizeObserver: ResizeObserver;\r\n\r\nonMounted(() => {\r\n\tresizeObserver = new ResizeObserver(() => {\r\n\t\telRef.value.parentElement.style.setProperty('--top-tabsView-contents-offset-top', elRef.value.offsetHeight + 'px');\r\n\t});\r\n\r\n\tresizeObserver.observe(elRef.value);\r\n});\r\n\r\nonUnmounted(() => {\r\n\tresizeObserver.disconnect();\r\n});\r\n</script>\r\n\r\n<template>\r\n\t<div\r\n\t\tref=\"elRef\"\r\n\t\t:class=\"{\r\n\t\t\t'top-tabsView_menu': true,\r\n\t\t\t'top-tabsView_menu-inPopup_0': !store.showMenuInPopup,\r\n\t\t\t'top-tabsView_menu-inPopup_1': store.showMenuInPopup,\r\n\t\t\t'top-tabsView_menu-short': store.isShort && !store.showMenuInPopup,\r\n\t\t}\"\r\n\t>\r\n\t\t<!-- Спрятать меню под кнопку в popup -->\r\n\t\t<TopPopup v-if=\"store.showMenuInPopup\">\r\n\t\t\t<template #opener>\r\n\t\t\t\t<div class=\"top-tabsView_menuOpener\">\r\n\t\t\t\t\t<div\r\n\t\t\t\t\t\tv-if=\"activeMenuItem\"\r\n\t\t\t\t\t\tclass=\"top-tabsView_menuOpenerActiveItem\"\r\n\t\t\t\t\t\t:data-top-icon=\"activeMenuItem.icon\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t<span class=\"top-ellipsis\">\r\n\t\t\t\t\t\t\t{{ activeMenuItem.title }}\r\n\t\t\t\t\t\t</span>\r\n\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t<div class=\"top-tabsView_menuOpenerIcon\" data-top-icon=\"\"></div>\r\n\t\t\t\t</div>\r\n\t\t\t</template>\r\n\r\n\t\t\t<template #contentList>\r\n\t\t\t\t<slot></slot>\r\n\t\t\t</template>\r\n\t\t</TopPopup>\r\n\r\n\t\t<!-- Отобразить меню на странице -->\r\n\t\t<template v-else>\r\n\t\t\t<div class=\"top-tabsView_menuList\">\r\n\t\t\t\t<slot></slot>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div\r\n\t\t\t\tv-if=\"isShortable\"\r\n\t\t\t\tclass=\"top-tabsView_menuFooter\"\r\n\t\t\t>\r\n\t\t\t\t<TabsViewMenuItem\r\n\t\t\t\t\tv-if=\"isShortable\"\r\n\t\t\t\t\t:icon=\"store.isShort ? '' : ''\"\r\n\t\t\t\t\t@click=\"store.isShort = !store.isShort\"\r\n\t\t\t\t>\r\n\t\t\t\t\t{{ store.isShort ? '' : 'Свернуть' }} <!--TODO: translate-->\r\n\t\t\t\t</TabsViewMenuItem>\r\n\t\t\t</div>\r\n\t\t</template>\r\n\t</div>\r\n</template>\r\n\r\n<style module>\r\n/* режим отображение табов в основной области документа */\r\n.top-tabsView-pageMod .top-tabsView_menu {\r\n\tbox-sizing: border-box;\r\n\tposition: sticky;\r\n\ttop: var(--top-tabsView-top);\r\n\tz-index: 10;\r\n}\r\n\r\n/* режим отображение табов в основной области документа без popup */\r\n.top-tabsView-pageMod .top-tabsView_menu-inPopup_0 {\r\n\theight: calc(var(--100vh) - var(--top-tabsView-top));\r\n}\r\n\r\n/* стантартный режим */\r\n.top-tabsView_menu-inPopup_0 {\r\n\tbox-sizing: border-box;\r\n\twidth: var(--top-tabsView-menu-width);\r\n\tdisplay: flex;\r\n\tflex-direction: column;\r\n\tjustify-content: space-between;\r\n}\r\n\r\n/* режим вывода в popup */\r\n.top-tabsView_menu-inPopup_1 {\r\n\tborder-bottom: 1px solid var(--color-line-2-opacity);\r\n}\r\n\r\n.top-tabsView_menu-short {\r\n\twidth: auto;\r\n}\r\n\r\n.top-tabsView_menu > .top-tabsView_menuOpener {\r\n\tdisplay: flex;\r\n\tjustify-content: flex-end;\r\n}\r\n\r\n.top-tabsView_menu > .top-tabsView_menuOpener:hover {\r\n\tbackground: var(--color-layer-1);\r\n}\r\n\r\n.top-tabsView_menuOpenerIcon { display: flex; }\r\n\r\n.top-tabsView_menuOpenerActiveItem {\r\n\t--top-forms-padding: 0px;\r\n\r\n\tbox-sizing: border-box;\r\n\tpadding: var(--top-padding-2);\r\n\tmax-width: calc(100% - var(--top-forms-base-height));\r\n\twhite-space: nowrap;\r\n\tflex-grow: 1;\r\n\tdisplay: flex;\r\n\talign-items: center;\r\n\tgap: var(--top-padding-2);\r\n}\r\n\r\n.top-tabsView_menuList,\r\n.top-tabsView_menuFooter {\r\n\tpadding: var(--top-padding-2);\r\n\tdisplay: flex;\r\n\tflex-direction: column;\r\n\tgap: var(--top-gap-2);\r\n}\r\n\r\n.top-tabsView_menuList {\r\n\toverflow-y: auto;\r\n}\r\n\r\n.top-tabsView_menu-short .top-tabsView_menuFooter > .top-tabsView_menuItem {\r\n\t--top-icon-width: 100%;\r\n}\r\n</style>\r\n","<script setup lang=\"ts\">\r\nimport { defineModel, onMounted, onUnmounted, ref, watch } from 'vue';\r\nimport Core from '@/core/core/core';\r\nimport { delHash } from '@/core/utils/route';\r\nimport type { Props } from './tabsView';\r\nimport { defineTabsStore } from './store';\r\nimport TabsViewMenu from './menu.vue';\r\nimport TopLoadbar from '@/components/forms/loadbar/loadbar.vue';\r\nimport { checkComponentIsLoading } from './utils';\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n\tshowMenuInPopup: undefined,\r\n\tisShortable: false,\r\n});\r\n\r\nconst model = defineModel<string>();\r\n\r\nconst store = defineTabsStore(props, model);\r\n\r\nconst uid = Math.random();\r\n\r\nif (props.pageMod) Core.state.documentClassModificators.set(uid, 'top-hasTabsViewPageMod');\r\n\r\nonUnmounted(() => {\r\n\tif (props.pageMod) Core.state.documentClassModificators.delete(uid);\r\n\r\n\tif (store.$id) delHash(store.$id, store.activeItemName, true);\r\n});\r\n\r\nconst componentRef = ref();\r\nconst isLoading = ref(false);\r\n\r\nwatch([componentRef, () => store.component], () => {\r\n\tisLoading.value = checkComponentIsLoading(store.component);\r\n}, { immediate: true });\r\n</script>\r\n\r\n<template>\r\n\t<div\r\n\t\t:class=\"{\r\n\t\t\t'top-tabsView': true,\r\n\t\t\t'top-tabsView-pageMod': props.pageMod,\r\n\t\t\t'top-tabsView-inPopup': store.showMenuInPopup,\r\n\t\t}\"\r\n\t>\r\n\t\t<TabsViewMenu\r\n\t\t\t:isShortable=\"isShortable\"\r\n\t\t\tv-model:isLoading=\"isLoading\"\r\n\t\t>\r\n\t\t\t<!-- @slot Меню, ожидает передачу компонентов TabsViewMenuItem и TabsViewMenuTitle -->\r\n\t\t\t<slot name=\"menu\"></slot>\r\n\t\t</TabsViewMenu>\r\n\r\n\t\t<div\r\n\t\t\t:class=\"{\r\n\t\t\t\t'top-tabsView_contents': true,\r\n\t\t\t\t'top-tabsView_contents-isLoading': isLoading,\r\n\t\t\t\t'top-tabsView_contents-noScrollable': !store.scrollable,\r\n\t\t\t}\"\r\n\t\t>\r\n\t\t\t<TopLoadbar v-if=\"isLoading\"/>\r\n\r\n\t\t\t<keep-alive>\r\n\t\t\t\t<component\r\n\t\t\t\t\tref=\"componentRef\"\r\n\t\t\t\t\t:is=\"store.component\"\r\n\t\t\t\t/>\r\n\t\t\t</keep-alive>\r\n\t\t</div>\r\n\t</div>\r\n</template>\r\n\r\n<style module>\r\n:root {\r\n\t--top-tabsView-top: 0px;\r\n\t--top-tabsView-menu-width: 220px;\r\n\t--top-tabsView-contents-offset-top: 0px;\r\n}\r\n\r\n.top-tabsView {\r\n\tbackground: var(--color-layout-middle);\r\n\twidth: 100%;\r\n\theight: 100%;\r\n\tdisplay: flex;\r\n\tflex-direction: row;\r\n}\r\n\r\n.top-tabsView_contents {\r\n\tborder-radius: var(--top-radius-4);\r\n\tbackground: var(--color-layout-front-1);\r\n\tpadding: var(--top-padding-4);\r\n\tflex-grow: 1;\r\n\toverflow: auto;\r\n\tposition: relative;\r\n}\r\n\r\n.top-tabsView_contents-isLoading {\r\n\tpointer-events: none;\r\n}\r\n\r\n.top-tabsView_contents-noScrollable {\r\n\twidth: calc(100% - var(--top-tabsView-menu-width));\r\n\tpadding: 0;\r\n\toverflow: visible;\r\n}\r\n\r\n/* top-tabsView-inPopup */\r\n.top-tabsView-inPopup {\r\n\tbackground: var(--color-layout-front-1);\r\n\tflex-direction: column;\r\n}\r\n\r\n.top-tabsView-inPopup > .top-tabsView_contents {\r\n\tborder-radius: 0;\r\n}\r\n\r\n.top-tabsView-inPopup > .top-tabsView_contents-noScrollable {\r\n\twidth: auto;\r\n}\r\n</style>\r\n","<script setup lang=\"ts\">\r\n\r\n</script>\r\n\r\n<template>\r\n\t<div class=\"top-tabsView_menuDelimeter\"></div>\r\n</template>\r\n\r\n<style module>\r\n.top-tabsView_menuDelimeter {\r\n\tpadding: var(--top-padding-1) 0;\r\n\tdisplay: flex;\r\n}\r\n\r\n.top-tabsView_menuDelimeter:before {\r\n\tcontent: \"\";\r\n\theight: 2px;\r\n\tbackground: var(--color-line-2);\r\n\tflex-grow: 1;\r\n}\r\n\r\n.top-tabsView_menuDelimeter:first-child,\r\n.top-tabsView_menuDelimeter + .top-tabsView_menuDelimeter {\r\n\tdisplay: none;\r\n}\r\n</style>","<script setup lang=\"ts\">\r\nimport { useTabsStore } from './store';\r\nimport type { PropsMenuTitle } from './tabsView';\r\nimport TabsViewMenuDelimeter from './menuDelimeter.vue';\r\nimport { TopPopupListItem } from '../../popup/popup';\r\n\r\ndefineProps<PropsMenuTitle>();\r\n\r\nconst store = useTabsStore();\r\n</script>\r\n\r\n<template>\r\n\t<TopPopupListItem\r\n\t\tv-if=\"store.showMenuInPopup\"\r\n\t\ttype=\"title\"\r\n\t>\r\n\t\t<slot></slot>\r\n\t</TopPopupListItem>\r\n\r\n\t<TabsViewMenuDelimeter v-else-if=\"store.isShort\"/>\r\n\r\n\t<div\r\n\t\tv-else\r\n\t\t:class=\"{\r\n\t\t\t'top-tabsView_menuTitle': true,\r\n\t\t\t'top-tabsView_menuTitle-subtitle': isSubtitle,\r\n\t\t}\"\r\n\t>\r\n\t\t<slot></slot>\r\n\t</div>\r\n</template>\r\n\r\n<style module>\r\n.top-tabsView_menuTitle {\r\n\tpadding: var(--top-padding-4) var(--top-padding-2) var(--top-padding-1);\r\n\tfont-weight: 600;\r\n\tcolor: var(--color-text-1);\r\n}\r\n\r\n.top-tabsView_menuTitle-subtitle {\r\n\tpadding-top: var(--top-padding-1);\r\n\tfont-size: 12px;\r\n\tfont-weight: 400;\r\n\tcolor: var(--color-text-2);\r\n}\r\n</style>\r\n","import type { ComponentCustomProps } from 'vue';\r\n\r\nimport TabsView from './tabsView/tabsView.vue';\r\nimport TabsViewMenuItem from './tabsView/menuItem.vue';\r\nimport TabsViewMenuTitle from './tabsView/menuTitle.vue';\r\n\r\nexport const TopTabsView = TabsView as typeof TabsView & ComponentCustomProps;\r\nexport const TopTabsViewMenuItem = TabsViewMenuItem as typeof TabsViewMenuItem & ComponentCustomProps;\r\nexport const TopTabsViewMenuTitle = TabsViewMenuTitle as typeof TabsViewMenuTitle & ComponentCustomProps;\r\n"],"names":["genStorageKey","stateName","stateKey","loadLocalStorge","store","localStorageKey","localStorageValue","addSaverLocalStorge","watch","StoreLocalStorage","popstateCallbacks","e","popstateCallback","injectionKey","defineTabsStore","props","model","defineStore","showMenuInPopup","computed","Core","pageMod","isShort","ref","component","scrollable","getHash","useTabsStore","useStore","__props","href","genHash","tagName","TopPopupListItem","onClick","checkComponentIsLoading","preResolveComponent","condition","sleepWhile","isLoading","useModel","slots","useSlots","menuItemByName","genMenuItemByName","item","subComponent","TabsViewMenuItem","menuItem","_b","_a","markRaw","activeMenuItem","countChanged","numberChanged","activeItemName","setHash","elRef","resizeObserver","onMounted","onUnmounted","uid","delHash","componentRef","_sfc_render","_ctx","_cache","TopTabsView","TabsView","TopTabsViewMenuItem","TopTabsViewMenuTitle","TabsViewMenuTitle"],"mappings":"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"}
1
+ {"version":3,"file":"tabsView.js","sources":["../../src/core/utils/store/localStorage.ts","../../src/components/tabsView/tabsView/store.ts","../../src/components/tabsView/tabsView/menuItem.vue","../../src/components/tabsView/tabsView/utils.ts","../../src/components/tabsView/tabsView/menu.vue","../../src/components/tabsView/tabsView/tabsView.vue","../../src/components/tabsView/tabsView/menuDelimeter.vue","../../src/components/tabsView/tabsView/menuTitle.vue","../../src/components/tabsView/tabsView.ts"],"sourcesContent":["import { watch } from 'vue';\r\nimport type { Store } from './store';\r\n\r\n/**\r\n * Сгенерировать имя для сохранения данных в localStorage\r\n * @param stateName - имя свойства состояния\r\n * @param stateKey - ключ состояния, разные компоненты могут использовать одинаковый ключ\r\n */\r\nconst genStorageKey = <T extends Store>(stateName: keyof T, stateKey: string): string => {\r\n\tconst stateNameString = String(stateName);\r\n\r\n\treturn `top:${stateNameString}:${stateKey}`;\r\n};\r\n\r\n/**\r\n * Загрузить состояние\r\n * @param stateName - имя свойства состояния\r\n * @param store\r\n */\r\nconst loadLocalStorge = <T extends Store>(stateName: keyof T, store: T) => {\r\n\t// если Store.key не знадан, значит сохранение состояния в компоненте отключено\r\n\tif (!store.$id) return;\r\n\r\n\tconst localStorageKey = genStorageKey(stateName, store.$id);\r\n\r\n\ttry {\r\n\t\tconst localStorageValue: typeof store[keyof typeof store] = JSON.parse(localStorage.getItem(localStorageKey) as string);\r\n\r\n\t\tif (typeof localStorageValue === typeof store[stateName]) {\r\n\t\t\tstore[stateName] = localStorageValue;\r\n\t\t}\r\n\t} catch (e) {\r\n\t\tconsole.warn(new Error(`В localStorage[${localStorageKey}] не корректный json`));\r\n\t}\r\n};\r\n\r\n/**\r\n * Добавить автосохранение состояние при его изменении\r\n * @param stateName - имя свойства состояния\r\n * @param store\r\n */\r\nconst addSaverLocalStorge = <T extends Store>(stateName: keyof T, store: T) => {\r\n\t// если store.$id не знадан, значит сохранение состояния в компоненте отключено\r\n\tif (!store.$id) return;\r\n\r\n\tconst localStorageKey = genStorageKey(stateName, store.$id);\r\n\r\n\twatch(() => store[stateName], () => {\r\n\t\tlocalStorage.setItem(localStorageKey, JSON.stringify(store[stateName]));\r\n\t}, { immediate: true });\r\n};\r\n\r\nexport default {\r\n\tloadLocalStorge,\r\n\taddSaverLocalStorge,\r\n};","import type { InjectionKey, ModelRef } from 'vue';\r\nimport { computed, ref } from 'vue';\r\nimport Core from '@/core/core/core';\r\nimport { defineStore, useStore } from '@/core/utils/store';\r\nimport StoreLocalStorage from '@/core/utils/store/localStorage';\r\nimport type { Props, Store } from './tabsView';\r\nimport { getHash } from '@/core/utils/route';\r\n\r\nconst popstateCallbacks = new Set<(e: PopStateEvent) => void>();\r\n\r\naddEventListener('popstate', (e) => {\r\n\tpopstateCallbacks.forEach(popstateCallback => popstateCallback(e));\r\n});\r\n\r\nexport const injectionKey = Symbol() as InjectionKey<Store>;\r\n\r\n/**\r\n * Инициировать Store компонента\r\n */\r\nexport const defineTabsStore = (props: Props, model: ModelRef<string | undefined>) => {\r\n\tconst store = defineStore(injectionKey, () => {\r\n\t\tconst showMenuInPopup = computed(() => props.showMenuInPopup ?? Core.state.isMobile);\r\n\t\tconst pageMod = computed(() => props.pageMod);\r\n\t\tconst isShort = ref(false);\r\n\r\n\t\tconst component = ref(undefined);\r\n\t\tconst scrollable = ref(true);\r\n\r\n\t\treturn {\r\n\t\t\tshowMenuInPopup,\r\n\t\t\tpageMod,\r\n\t\t\tisShort,\r\n\t\t\tactiveItemName: model,\r\n\t\t\tcomponent,\r\n\t\t\tscrollable,\r\n\t\t};\r\n\t}, props.idState);\r\n\r\n\tif (props.isShortable) {\r\n\t\tconst stateName = 'isShort';\r\n\r\n\t\tStoreLocalStorage.loadLocalStorge(stateName, store);\r\n\t\tStoreLocalStorage.addSaverLocalStorge(stateName, store);\r\n\t}\r\n\r\n\tif (store.$id) {\r\n\t\tconst popstateCallback = (e: PopStateEvent) => {\r\n\t\t\tmodel.value = getHash(store.$id!);\r\n\t\t};\r\n\r\n\t\tpopstateCallbacks.add(popstateCallback);\r\n\t}\r\n\r\n\treturn store;\r\n};\r\n\r\n/**\r\n * Получить Store компонента\r\n */\r\nexport const useTabsStore = () => useStore(injectionKey);\r\n","<script setup lang=\"ts\">\r\nimport { computed } from 'vue';\r\nimport { genHash } from '@/core/utils/route';\r\nimport { TopPopupListItem } from '@/components/popup/popup';\r\nimport { useTabsStore } from './store';\r\nimport type { PropsMenuItem } from './tabsView';\r\n\r\nconst props = withDefaults(defineProps<PropsMenuItem>(), {\r\n\tscrollable: true,\r\n\tcomponent: undefined,\r\n});\r\n\r\nconst store = useTabsStore();\r\n\r\nconst href = computed(() => {\r\n\t// это внутренняя хеш навигация, ссылка на вкладку\r\n\tif (props.name && store.$id) {\r\n\t\treturn genHash(store.$id, props.name);\r\n\t}\r\n\r\n\treturn props.href;\r\n});\r\n\r\nconst tagName = computed(() => {\r\n\tif (store.showMenuInPopup) {\r\n\t\treturn TopPopupListItem;\r\n\t}\r\n\r\n\treturn href ? 'a' : 'button';\r\n});\r\n\r\n/**\r\n * Клик по элементу меню\r\n */\r\nconst onClick = (e: MouseEvent) => {\r\n\t// это внутренняя хеш навигация, ссылка на вкладку\r\n\tif (!props.href && href.value) {\r\n\t\te.preventDefault();\r\n\t}\r\n\r\n\tif (props.name) {\r\n\t\tstore.activeItemName = props.name;\r\n\t}\r\n};\r\n</script>\r\n\r\n<template>\r\n\t<component\r\n\t\t:is=\"tagName\"\r\n\t\ttarget=\"_self\"\r\n\t\t:class=\"{\r\n\t\t\t['top-tabsView_menuItem']: !store.showMenuInPopup,\r\n\t\t\t['top-active']: name && store.activeItemName === name,\r\n\t\t\t['top-disabled']: disabled,\r\n\t\t\t['top-spa-disabled']: true,\r\n\t\t}\"\r\n\t\t:href=\"href\"\r\n\t\t:data-top-icon=\"icon || undefined\"\r\n\t\t:disabled=\"disabled || undefined\"\r\n\t\t@click=\"onClick\"\r\n\t>\r\n\t\t<slot v-if=\"store.showMenuInPopup\"></slot>\r\n\r\n\t\t<span\r\n\t\t\tv-else-if=\"$slots.default && !store.isShort\"\r\n\t\t\tclass=\"top-ellipsis\"\r\n\t\t>\r\n\t\t\t<slot></slot>\r\n\t\t</span>\r\n\t</component>\r\n</template>\r\n\r\n<style module>\r\n.top-tabsView_menuItem {\r\n\t--top-icon-color: var(--color-text-2);\r\n\t--top-icon-width: calc(var(--top-icon-size));\r\n\r\n\tcursor: pointer;\r\n\tbox-sizing: border-box;\r\n\r\n\tborder: none;\r\n\tborder-radius: var(--top-radius-2);\r\n\tpadding: var(--top-padding-2);\r\n\tbackground: transparent;\r\n\theight: 40px;\r\n\r\n\tcolor: var(--color-text-1);\r\n\ttext-decoration: none;\r\n\twhite-space: nowrap;\r\n\r\n\tdisplay: flex;\r\n\tgap: var(--top-gap-2);\r\n\talign-items: center;\r\n\tjustify-content: flex-start;\r\n\ttransition: background var(--transition);\r\n}\r\n\r\n.top-tabsView_menuItem:hover {\r\n\t--top-icon-color: var(--color-text-1);\r\n\r\n\tbackground: var(--color-bg-shading-2);\r\n\ttext-decoration: none;\r\n}\r\n\r\n.top-tabsView_menuItem.top-active {\r\n\tcursor: unset;\r\n\tbackground: var(--color-layout-front-1);\r\n}\r\n\r\n.top-tabsView_menuItem:disabled:not(option):not(optgroup):not(.top-forms-option),\r\n.top-tabsView_menuItem:disabled ~ .top-formsCaption,\r\n.top-tabsView_menuItem.top-disabled[data-top-icon]:before,\r\n.top-tabsView_menuItem.top-disabled[data-top-icon2]:after {\r\n\topacity: unset;\r\n\tfilter: unset;\r\n}\r\n\r\n.top-tabsView_menuItem.top-disabled {\r\n\t--top-icon-color: var(--color-text-4);\r\n\r\n\tcolor: var(--color-text-4);\r\n}\r\n</style>\r\n","// TODO: Эту функцию можно вынести в глобальный utils\r\n\r\nimport { sleepWhile } from '@/core/utils/system';\r\n\r\n/**\r\n * Проверка нахождения компонента в состояние загрузки\r\n * @param component\r\n */\r\nexport const checkComponentIsLoading = (component: any) => {\r\n\treturn component?.name === 'AsyncComponentWrapper' && !component?.__asyncResolved;\r\n};\r\n\r\n/**\r\n * Презагрузить компонент\r\n *\r\n * Некоторое время ожидает загрузку компонента, прежде чем завершит работу\r\n */\r\nexport const preResolveComponent = async (component: any, condition: Function) => {\r\n\tif (component?.name !== 'AsyncComponentWrapper') return;\r\n\tif (component?.__asyncResolved) return;\r\n\r\n\tcomponent.__asyncLoader();\r\n\r\n\tawait sleepWhile(() => {\r\n\t\treturn condition() && checkComponentIsLoading(component);\r\n\t}, 200);\r\n};\r\n","<script setup lang=\"ts\">\r\nimport type { Ref, VNode } from 'vue';\r\nimport { markRaw, onMounted, onUnmounted, ref, useSlots, watch } from 'vue';\r\nimport { TopPopup } from '../../popup/popup';\r\nimport { getHash, setHash } from '@/core/utils/route';\r\n\r\nimport type { MenuItem, PropsMenu, PropsMenuItem } from './tabsView';\r\nimport { useTabsStore } from './store';\r\nimport TabsViewMenuItem from './menuItem.vue';\r\nimport { preResolveComponent } from './utils';\r\n\r\ndefineProps<PropsMenu>();\r\n\r\nconst isLoading = defineModel('isLoading');\r\n\r\nconst store = useTabsStore();\r\n\r\nconst slots = useSlots();\r\n\r\n// словарь используется для оптимизации получения нужного menuItem\r\nconst menuItemByName: Map<PropsMenuItem['name'], MenuItem> = new Map();\r\n\r\n// заполнить словарь с menuItem, по элементам в slot default\r\nconst setMenuItemByName = () => {\r\n\tif (!slots.default) return;\r\n\r\n\tconst component: any = slots.default().find(item => item.key === '_menu');\r\n\tif (!component) return;\r\n\r\n\tsetMenuItemByNameFromItems(component.children);\r\n};\r\n\r\n// заполнить словарь с menuItem, по элементам\r\nconst setMenuItemByNameFromItems = (menuItems: VNode[]) => {\r\n\tmenuItems.forEach((subComponent: any) => {\r\n\t\t// это не компонент элемента меню\r\n\t\tif (subComponent.type.__name && subComponent.type.__name !== TabsViewMenuItem.__name) return;\r\n\r\n\t\t// это не компонент, например template\r\n\t\tif (!subComponent.type.__name && subComponent.children) {\r\n\t\t\tsetMenuItemByNameFromItems(subComponent.children);\r\n\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tif (!subComponent.props.name || subComponent.props.disabled) return;\r\n\r\n\t\tconst menuItem: MenuItem = {\r\n\t\t\ttitle: (subComponent.children.default?.()[0].children as string).trim(),\r\n\t\t\ticon: subComponent.props.icon,\r\n\t\t\tcomponent: subComponent.props.component ? markRaw(subComponent.props.component) : TabsViewMenuItem.props.component.default,\r\n\t\t\tscrollable: subComponent.props.scrollable ?? TabsViewMenuItem.props.scrollable.default,\r\n\t\t};\r\n\r\n\t\tmenuItemByName.set(subComponent.props.name, menuItem);\r\n\t});\r\n};\r\n\r\n/**\r\n * activeMenuItem нужен:\r\n * - для вывода текста активной вкладки в меню с popup\r\n * - для вывода компонента активной вкладки (store.component)\r\n * - для установки store.scrollable\r\n */\r\nconst activeMenuItem: Ref<MenuItem | null> = ref(null);\r\n\r\n/**\r\n * Кол-во изменений активной вкладки\r\n */\r\nlet countChanged = 0;\r\n\r\n/**\r\n * Смена активной вкладки\r\n *\r\n * TODO: смена slot, например смена языка, требует повторного выполнения setMenuItemByName()\r\n */\r\nwatch(\r\n\t() => store.activeItemName,\r\n\tasync () => {\r\n\t\tconst numberChanged = ++countChanged; // порядковый номер текущего изменения\r\n\r\n\t\tif (menuItemByName.size === 0) {\r\n\t\t\tsetMenuItemByName();\r\n\t\t}\r\n\r\n\t\tif (menuItemByName.size === 0) {\r\n\t\t\tstore.activeItemName = '';\r\n\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tactiveMenuItem.value = menuItemByName.get(store.activeItemName) ?? null;\r\n\r\n\t\t// элемент не найден, установить из хеша страницы\r\n\t\tif (!activeMenuItem.value && store.$id) {\r\n\t\t\tconst activeItemName = getHash(store.$id);\r\n\r\n\t\t\tactiveMenuItem.value = menuItemByName.get(activeItemName) ?? null;\r\n\r\n\t\t\tif (activeMenuItem.value) {\r\n\t\t\t\tstore.activeItemName = activeItemName;\r\n\r\n\t\t\t\treturn;\r\n\t\t\t}\r\n\t\t}\r\n\r\n\t\t// элемент не найден, установить первый доступный\r\n\t\tif (!activeMenuItem.value) {\r\n\t\t\tstore.activeItemName = menuItemByName.keys().next().value!;\r\n\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\t// запрошена смена на уже активный элемент\r\n\t\tif (activeMenuItem.value.component === store.component) {\r\n\t\t\tisLoading.value = false;\r\n\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tif (store.$id) setHash(store.$id, store.activeItemName, false);\r\n\r\n\t\t// флаг загрузки будет сброшен при инициализации компонента\r\n\t\tisLoading.value = true;\r\n\r\n\t\t/**\r\n\t\t * Презагрузить компонент\r\n\t\t *\r\n\t\t * Нужно для того, чтобы минимизировать скачки интерфейса при ожидании загрузки асинхронного компонента\r\n\t\t */\r\n\t\tawait preResolveComponent(activeMenuItem.value.component, () => numberChanged === countChanged);\r\n\r\n\t\t// влкадка была сменена еще раз во время sleepWhile\r\n\t\tif (numberChanged !== countChanged) {\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tstore.scrollable = activeMenuItem.value.scrollable;\r\n\t\tstore.component = activeMenuItem.value.component;\r\n\r\n\t\tif (activeMenuItem.value && !store.component) {\r\n\t\t\tconsole.warn(`Компонент вкладки ${store.activeItemName} не найден. Добавьте props.component для пункта меню ${store.activeItemName}.`);\r\n\t\t}\r\n\t},\r\n\t{ immediate: true },\r\n);\r\n\r\nconst elRef = ref();\r\nlet resizeObserver: ResizeObserver;\r\n\r\nonMounted(() => {\r\n\tresizeObserver = new ResizeObserver(() => {\r\n\t\telRef.value.parentElement.style.setProperty('--top-tabsView-contents-offset-top', elRef.value.offsetHeight + 'px');\r\n\t});\r\n\r\n\tresizeObserver.observe(elRef.value);\r\n});\r\n\r\nonUnmounted(() => {\r\n\tresizeObserver.disconnect();\r\n});\r\n</script>\r\n\r\n<template>\r\n\t<div\r\n\t\tref=\"elRef\"\r\n\t\t:class=\"{\r\n\t\t\t'top-tabsView_menu': true,\r\n\t\t\t'top-tabsView_menu-inPopup_0': !store.showMenuInPopup,\r\n\t\t\t'top-tabsView_menu-inPopup_1': store.showMenuInPopup,\r\n\t\t\t'top-tabsView_menu-short': store.isShort && !store.showMenuInPopup,\r\n\t\t}\"\r\n\t>\r\n\t\t<!-- Спрятать меню под кнопку в popup -->\r\n\t\t<TopPopup v-if=\"store.showMenuInPopup\">\r\n\t\t\t<template #opener>\r\n\t\t\t\t<div class=\"top-tabsView_menuOpener\">\r\n\t\t\t\t\t<div\r\n\t\t\t\t\t\tv-if=\"activeMenuItem\"\r\n\t\t\t\t\t\tclass=\"top-tabsView_menuOpenerActiveItem\"\r\n\t\t\t\t\t\t:data-top-icon=\"activeMenuItem.icon\"\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t<span class=\"top-ellipsis\">\r\n\t\t\t\t\t\t\t{{ activeMenuItem.title }}\r\n\t\t\t\t\t\t</span>\r\n\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t<div class=\"top-tabsView_menuOpenerIcon\" data-top-icon=\"\"></div>\r\n\t\t\t\t</div>\r\n\t\t\t</template>\r\n\r\n\t\t\t<template #contentList>\r\n\t\t\t\t<slot></slot>\r\n\t\t\t</template>\r\n\t\t</TopPopup>\r\n\r\n\t\t<!-- Отобразить меню на странице -->\r\n\t\t<template v-else>\r\n\t\t\t<div class=\"top-tabsView_menuList\">\r\n\t\t\t\t<slot></slot>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div\r\n\t\t\t\tv-if=\"isShortable\"\r\n\t\t\t\tclass=\"top-tabsView_menuFooter\"\r\n\t\t\t>\r\n\t\t\t\t<TabsViewMenuItem\r\n\t\t\t\t\tv-if=\"isShortable\"\r\n\t\t\t\t\t:icon=\"store.isShort ? '' : ''\"\r\n\t\t\t\t\t@click=\"store.isShort = !store.isShort\"\r\n\t\t\t\t>\r\n\t\t\t\t\t{{ store.isShort ? '' : 'Свернуть' }} <!--TODO: translate-->\r\n\t\t\t\t</TabsViewMenuItem>\r\n\t\t\t</div>\r\n\t\t</template>\r\n\t</div>\r\n</template>\r\n\r\n<style module>\r\n/* режим отображение табов в основной области документа */\r\n.top-tabsView-pageMod .top-tabsView_menu {\r\n\tbox-sizing: border-box;\r\n\tposition: sticky;\r\n\ttop: var(--top-tabsView-top);\r\n\tz-index: 10;\r\n}\r\n\r\n/* режим отображение табов в основной области документа без popup */\r\n.top-tabsView-pageMod .top-tabsView_menu-inPopup_0 {\r\n\theight: calc(var(--100vh) - var(--top-tabsView-top));\r\n}\r\n\r\n/* стантартный режим */\r\n.top-tabsView_menu-inPopup_0 {\r\n\tbox-sizing: border-box;\r\n\twidth: var(--top-tabsView-menu-width);\r\n\tdisplay: flex;\r\n\tflex-direction: column;\r\n\tjustify-content: space-between;\r\n}\r\n\r\n/* режим вывода в popup */\r\n.top-tabsView_menu-inPopup_1 {\r\n\tborder-bottom: 1px solid var(--color-line-2-opacity);\r\n}\r\n\r\n.top-tabsView_menu-short {\r\n\twidth: auto;\r\n}\r\n\r\n.top-tabsView_menu > .top-tabsView_menuOpener {\r\n\tdisplay: flex;\r\n\tjustify-content: flex-end;\r\n}\r\n\r\n.top-tabsView_menu > .top-tabsView_menuOpener:hover {\r\n\tbackground: var(--color-layer-1);\r\n}\r\n\r\n.top-tabsView_menuOpenerIcon { display: flex; }\r\n\r\n.top-tabsView_menuOpenerActiveItem {\r\n\t--top-forms-padding: 0px;\r\n\r\n\tbox-sizing: border-box;\r\n\tpadding: var(--top-padding-2);\r\n\tmax-width: calc(100% - var(--top-forms-base-height));\r\n\twhite-space: nowrap;\r\n\tflex-grow: 1;\r\n\tdisplay: flex;\r\n\talign-items: center;\r\n\tgap: var(--top-padding-2);\r\n}\r\n\r\n.top-tabsView_menuList,\r\n.top-tabsView_menuFooter {\r\n\tpadding: var(--top-padding-2);\r\n\tdisplay: flex;\r\n\tflex-direction: column;\r\n\tgap: var(--top-gap-2);\r\n}\r\n\r\n.top-tabsView_menuList {\r\n\toverflow-y: auto;\r\n}\r\n\r\n.top-tabsView_menu-short .top-tabsView_menuFooter > .top-tabsView_menuItem {\r\n\t--top-icon-width: 100%;\r\n}\r\n</style>\r\n","<script setup lang=\"ts\">\r\nimport { defineModel, onMounted, onUnmounted, ref, watch } from 'vue';\r\nimport Core from '@/core/core/core';\r\nimport { delHash } from '@/core/utils/route';\r\nimport type { Props } from './tabsView';\r\nimport { defineTabsStore } from './store';\r\nimport TabsViewMenu from './menu.vue';\r\nimport TopLoadbar from '@/components/forms/loadbar/loadbar.vue';\r\nimport { checkComponentIsLoading } from './utils';\r\n\r\nconst props = withDefaults(defineProps<Props>(), {\r\n\tshowMenuInPopup: undefined,\r\n\tisShortable: false,\r\n});\r\n\r\nconst model = defineModel<string>();\r\n\r\nconst store = defineTabsStore(props, model);\r\n\r\nconst uid = Math.random();\r\n\r\nif (props.pageMod) Core.state.documentClassModificators.set(uid, 'top-hasTabsViewPageMod');\r\n\r\nonUnmounted(() => {\r\n\tif (props.pageMod) Core.state.documentClassModificators.delete(uid);\r\n\r\n\tif (store.$id) delHash(store.$id, store.activeItemName, true);\r\n});\r\n\r\nconst componentRef = ref();\r\nconst isLoading = ref(false);\r\n\r\nwatch([componentRef, () => store.component], () => {\r\n\tisLoading.value = checkComponentIsLoading(store.component);\r\n}, { immediate: true });\r\n</script>\r\n\r\n<template>\r\n\t<div\r\n\t\t:class=\"{\r\n\t\t\t'top-tabsView': true,\r\n\t\t\t'top-tabsView-pageMod': props.pageMod,\r\n\t\t\t'top-tabsView-inPopup': store.showMenuInPopup,\r\n\t\t}\"\r\n\t>\r\n\t\t<TabsViewMenu\r\n\t\t\t:isShortable=\"isShortable\"\r\n\t\t\tv-model:isLoading=\"isLoading\"\r\n\t\t>\r\n\t\t\t<!-- @slot Меню, ожидает передачу компонентов TabsViewMenuItem и TabsViewMenuTitle -->\r\n\t\t\t<slot name=\"menu\"></slot>\r\n\t\t</TabsViewMenu>\r\n\r\n\t\t<div\r\n\t\t\t:class=\"{\r\n\t\t\t\t'top-tabsView_contents': true,\r\n\t\t\t\t'top-tabsView_contents-isLoading': isLoading,\r\n\t\t\t\t'top-tabsView_contents-noScrollable': !store.scrollable,\r\n\t\t\t}\"\r\n\t\t>\r\n\t\t\t<TopLoadbar v-if=\"isLoading\"/>\r\n\r\n\t\t\t<keep-alive>\r\n\t\t\t\t<component\r\n\t\t\t\t\tref=\"componentRef\"\r\n\t\t\t\t\t:is=\"store.component\"\r\n\t\t\t\t/>\r\n\t\t\t</keep-alive>\r\n\t\t</div>\r\n\t</div>\r\n</template>\r\n\r\n<style module>\r\n:root {\r\n\t--top-tabsView-top: 0px;\r\n\t--top-tabsView-menu-width: 220px;\r\n\t--top-tabsView-contents-offset-top: 0px;\r\n}\r\n\r\n.top-tabsView {\r\n\tbackground: var(--color-layout-middle);\r\n\twidth: 100%;\r\n\theight: 100%;\r\n\tdisplay: flex;\r\n\tflex-direction: row;\r\n}\r\n\r\n.top-tabsView_contents {\r\n\tborder-radius: var(--top-radius-4);\r\n\tbackground: var(--color-layout-front-1);\r\n\tpadding: var(--top-padding-4);\r\n\tflex-grow: 1;\r\n\toverflow: auto;\r\n\tposition: relative;\r\n}\r\n\r\n.top-tabsView_contents-isLoading {\r\n\tpointer-events: none;\r\n}\r\n\r\n.top-tabsView_contents-noScrollable {\r\n\twidth: calc(100% - var(--top-tabsView-menu-width));\r\n\tpadding: 0;\r\n\toverflow: visible;\r\n}\r\n\r\n/* top-tabsView-inPopup */\r\n.top-tabsView-inPopup {\r\n\tbackground: var(--color-layout-front-1);\r\n\tflex-direction: column;\r\n}\r\n\r\n.top-tabsView-inPopup > .top-tabsView_contents {\r\n\tborder-radius: 0;\r\n}\r\n\r\n.top-tabsView-inPopup > .top-tabsView_contents-noScrollable {\r\n\twidth: auto;\r\n}\r\n</style>\r\n","<script setup lang=\"ts\">\r\n\r\n</script>\r\n\r\n<template>\r\n\t<div class=\"top-tabsView_menuDelimeter\"></div>\r\n</template>\r\n\r\n<style module>\r\n.top-tabsView_menuDelimeter {\r\n\tpadding: var(--top-padding-1) 0;\r\n\tdisplay: flex;\r\n}\r\n\r\n.top-tabsView_menuDelimeter:before {\r\n\tcontent: \"\";\r\n\theight: 2px;\r\n\tbackground: var(--color-line-2);\r\n\tflex-grow: 1;\r\n}\r\n\r\n.top-tabsView_menuDelimeter:first-child,\r\n.top-tabsView_menuDelimeter + .top-tabsView_menuDelimeter {\r\n\tdisplay: none;\r\n}\r\n</style>","<script setup lang=\"ts\">\r\nimport { useTabsStore } from './store';\r\nimport type { PropsMenuTitle } from './tabsView';\r\nimport TabsViewMenuDelimeter from './menuDelimeter.vue';\r\nimport { TopPopupListItem } from '../../popup/popup';\r\n\r\ndefineProps<PropsMenuTitle>();\r\n\r\nconst store = useTabsStore();\r\n</script>\r\n\r\n<template>\r\n\t<TopPopupListItem\r\n\t\tv-if=\"store.showMenuInPopup\"\r\n\t\ttype=\"title\"\r\n\t>\r\n\t\t<slot></slot>\r\n\t</TopPopupListItem>\r\n\r\n\t<TabsViewMenuDelimeter v-else-if=\"store.isShort\"/>\r\n\r\n\t<div\r\n\t\tv-else\r\n\t\t:class=\"{\r\n\t\t\t'top-tabsView_menuTitle': true,\r\n\t\t\t'top-tabsView_menuTitle-subtitle': isSubtitle,\r\n\t\t}\"\r\n\t>\r\n\t\t<slot></slot>\r\n\t</div>\r\n</template>\r\n\r\n<style module>\r\n.top-tabsView_menuTitle {\r\n\tpadding: var(--top-padding-4) var(--top-padding-2) var(--top-padding-1);\r\n\tfont-weight: 600;\r\n\tcolor: var(--color-text-1);\r\n}\r\n\r\n.top-tabsView_menuTitle-subtitle {\r\n\tpadding-top: var(--top-padding-1);\r\n\tfont-size: 12px;\r\n\tfont-weight: 400;\r\n\tcolor: var(--color-text-2);\r\n}\r\n</style>\r\n","import type { ComponentCustomProps } from 'vue';\r\n\r\nimport TabsView from './tabsView/tabsView.vue';\r\nimport TabsViewMenuItem from './tabsView/menuItem.vue';\r\nimport TabsViewMenuTitle from './tabsView/menuTitle.vue';\r\n\r\nexport const TopTabsView = TabsView as typeof TabsView & ComponentCustomProps;\r\nexport const TopTabsViewMenuItem = TabsViewMenuItem as typeof TabsViewMenuItem & ComponentCustomProps;\r\nexport const TopTabsViewMenuTitle = TabsViewMenuTitle as typeof TabsViewMenuTitle & ComponentCustomProps;\r\n"],"names":["genStorageKey","stateName","stateKey","loadLocalStorge","store","localStorageKey","localStorageValue","addSaverLocalStorge","watch","StoreLocalStorage","popstateCallbacks","e","popstateCallback","injectionKey","defineTabsStore","props","model","defineStore","showMenuInPopup","computed","Core","pageMod","isShort","ref","component","scrollable","getHash","useTabsStore","useStore","__props","href","genHash","tagName","TopPopupListItem","onClick","checkComponentIsLoading","preResolveComponent","condition","sleepWhile","isLoading","useModel","slots","useSlots","menuItemByName","setMenuItemByName","item","setMenuItemByNameFromItems","menuItems","subComponent","TabsViewMenuItem","menuItem","_b","_a","markRaw","activeMenuItem","countChanged","numberChanged","activeItemName","setHash","elRef","resizeObserver","onMounted","onUnmounted","uid","delHash","componentRef","_sfc_render","_ctx","_cache","TopTabsView","TabsView","TopTabsViewMenuItem","TopTabsViewMenuTitle","TabsViewMenuTitle"],"mappings":";;;;;;;;;AAQA,MAAAA,IAAA,CAAAC,GAAAC,MAGC,OAFA,OAAAD,CAAA,CAEA,IAAAC,CAAA,IAQDC,KAAA,CAAAF,GAAAG,MAAA;AAEC,MAAA,CAAAA,EAAA,IAAA;AAEA,QAAAC,IAAAL,EAAAC,GAAAG,EAAA,GAAA;AAEA,MAAA;AACC,UAAAE,IAAA,KAAA,MAAA,aAAA,QAAAD,CAAA,CAAA;AAEA,IAAA,OAAAC,KAAA,OAAAF,EAAAH,CAAA,MACCG,EAAAH,CAAA,IAAAK;AAAA,EACD,QAAA;AAEA,YAAA,KAAA,IAAA,MAAA,kBAAAD,CAAA,sBAAA,CAAA;AAAA,EAA+E;AAEjF,GAOAE,KAAA,CAAAN,GAAAG,MAAA;AAEC,MAAA,CAAAA,EAAA,IAAA;AAEA,QAAAC,IAAAL,EAAAC,GAAAG,EAAA,GAAA;AAEA,EAAAI,EAAA,MAAAJ,EAAAH,CAAA,GAAA,MAAA;AACC,iBAAA,QAAAI,GAAA,KAAA,UAAAD,EAAAH,CAAA,CAAA,CAAA;AAAA,EAAsE,GAAA,EAAA,WAAA,GAAA,CAAA;AAExE,GAEAQ,IAAA;AAAA,EAAe,iBAAAN;AAAA,EACd,qBAAAI;AAED,GC/CAG,IAAA,oBAAA,IAAA;AAEA,iBAAA,YAAA,CAAAC,MAAA;AACC,EAAAD,EAAA,QAAA,CAAAE,MAAAA,EAAAD,CAAA,CAAA;AACD,CAAA;AAEO,MAAAE,IAAA,OAAA,GAKMC,KAAA,CAAAC,GAAAC,MAAA;AACZ,QAAAZ,IAAAa,GAAAJ,GAAA,MAAA;AACC,UAAAK,IAAAC,EAAA,MAAAJ,EAAA,mBAAAK,EAAA,MAAA,QAAA,GACAC,IAAAF,EAAA,MAAAJ,EAAA,OAAA,GACAO,IAAAC,EAAA,EAAA,GAEAC,IAAAD,EAAA,MAAA,GACAE,IAAAF,EAAA,EAAA;AAEA,WAAA;AAAA,MAAO,iBAAAL;AAAA,MACN,SAAAG;AAAA,MACA,SAAAC;AAAA,MACA,gBAAAN;AAAA,MACgB,WAAAQ;AAAA,MAChB,YAAAC;AAAA,IACA;AAAA,EACD,GAAAV,EAAA,OAAA;AAGD,MAAAA,EAAA,aAAA;AACC,UAAAd,IAAA;AAEA,IAAAQ,EAAA,gBAAAR,GAAAG,CAAA,GACAK,EAAA,oBAAAR,GAAAG,CAAA;AAAA,EAAsD;AAGvD,MAAAA,EAAA,KAAA;AACC,UAAAQ,IAAA,CAAAD,MAAA;AACC,MAAAK,EAAA,QAAAU,EAAAtB,EAAA,GAAA;AAAA,IAAgC;AAGjC,IAAAM,EAAA,IAAAE,CAAA;AAAA,EAAsC;AAGvC,SAAAR;AACD,GAKauB,IAAA,MAAAC,GAAAf,CAAA;;;;;;;;;;;;;;ACpDb,UAAAE,IAAAc,GAKAzB,IAAAuB,EAAA,GAEAG,IAAAX,EAAA,MAECJ,EAAA,QAAAX,EAAA,MACC2B,GAAA3B,EAAA,KAAAW,EAAA,IAAA,IAGDA,EAAA,IAAa,GAGdiB,IAAAb,EAAA,MACCf,EAAA,kBACC6B,IAGDH,IAAA,MAAA,QAAoB,GAMrBI,IAAA,CAAAvB,MAAA;AAEC,MAAA,CAAAI,EAAA,QAAAe,EAAA,SACCnB,EAAA,eAAA,GAGDI,EAAA,SACCX,EAAA,iBAAAW,EAAA;AAAA,IACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sDClCYoB,IAAA,CAAAX,OACZA,KAAA,gBAAAA,EAAA,UAAA,2BAAA,EAAAA,KAAA,QAAAA,EAAA,kBAQYY,KAAA,OAAAZ,GAAAa,MAAA;AACZ,GAAAb,KAAA,gBAAAA,EAAA,UAAA,4BACAA,KAAA,QAAAA,EAAA,oBAEAA,EAAA,cAAA,GAEA,MAAAc,GAAA,MACCD,EAAA,KAAAF,EAAAX,CAAA,GAAuD,GAAA;AAEzD;;;;;;;;;;;;;;ACbA,UAAAe,IAAAC,EAAAX,GAAA,WAAA,GAEAzB,IAAAuB,EAAA,GAEAc,IAAAC,EAAA,GAGAC,IAAA,oBAAA,IAAA,GAGAC,IAAA,MAAA;AACC,UAAA,CAAAH,EAAA,QAAA;AAEA,YAAAjB,IAAAiB,EAAA,QAAA,EAAA,KAAA,CAAAI,MAAAA,EAAA,QAAA,OAAA;AACA,MAAArB,KAEAsB,EAAAtB,EAAA,QAAA;AAAA,IAA6C,GAI9CsB,IAAA,CAAAC,MAAA;AACC,MAAAA,EAAA,QAAA,CAAAC,MAAA;;AAEC,YAAAA,EAAA,KAAA,UAAAA,EAAA,KAAA,WAAAC,EAAA,OAAA;AAGA,YAAA,CAAAD,EAAA,KAAA,UAAAA,EAAA,UAAA;AACC,UAAAF,EAAAE,EAAA,QAAA;AAEA;AAAA,QAAA;AAGD,YAAA,CAAAA,EAAA,MAAA,QAAAA,EAAA,MAAA,SAAA;AAEA,cAAAE,IAAA;AAAA,UAA2B,SAAAC,KAAAC,IAAAJ,EAAA,UAAA,YAAA,gBAAAG,EAAA,KAAAC,GAAA,GAAA,UAAA,KAAA;AAAA,UAC4C,MAAAJ,EAAA,MAAA;AAAA,UAC7C,WAAAA,EAAA,MAAA,YAAAK,EAAAL,EAAA,MAAA,SAAA,IAAAC,EAAA,MAAA,UAAA;AAAA,UAC0F,YAAAD,EAAA,MAAA,cAAAC,EAAA,MAAA,WAAA;AAAA,QACpC;AAGhF,QAAAN,EAAA,IAAAK,EAAA,MAAA,MAAAE,CAAA;AAAA,MAAoD,CAAA;AAAA,IACpD,GASFI,IAAA/B,EAAA,IAAA;AAKA,QAAAgC,IAAA;AAOA,IAAA/C;AAAA,MAAA,MAAAJ,EAAA;AAAA,MACa,YAAA;AAEX,cAAAoD,IAAA,EAAAD;AAMA,YAJAZ,EAAA,SAAA,KACCC,EAAA,GAGDD,EAAA,SAAA,GAAA;AACC,UAAAvC,EAAA,iBAAA;AAEA;AAAA,QAAA;AAMD,YAHAkD,EAAA,QAAAX,EAAA,IAAAvC,EAAA,cAAA,KAAA,MAGA,CAAAkD,EAAA,SAAAlD,EAAA,KAAA;AACC,gBAAAqD,IAAA/B,EAAAtB,EAAA,GAAA;AAIA,cAFAkD,EAAA,QAAAX,EAAA,IAAAc,CAAA,KAAA,MAEAH,EAAA,OAAA;AACC,YAAAlD,EAAA,iBAAAqD;AAEA;AAAA,UAAA;AAAA,QACD;AAID,YAAA,CAAAH,EAAA,OAAA;AACC,UAAAlD,EAAA,iBAAAuC,EAAA,KAAA,EAAA,KAAA,EAAA;AAEA;AAAA,QAAA;AAID,YAAAW,EAAA,MAAA,cAAAlD,EAAA,WAAA;AACC,UAAAmC,EAAA,QAAA;AAEA;AAAA,QAAA;AAgBD,QAbAnC,EAAA,OAAAsD,GAAAtD,EAAA,KAAAA,EAAA,gBAAA,EAAA,GAGAmC,EAAA,QAAA,IAOA,MAAAH,GAAAkB,EAAA,MAAA,WAAA,MAAAE,MAAAD,CAAA,GAGAC,MAAAD,MAIAnD,EAAA,aAAAkD,EAAA,MAAA,YACAlD,EAAA,YAAAkD,EAAA,MAAA,WAEAA,EAAA,SAAA,CAAAlD,EAAA,aACC,QAAA,KAAA,qBAAAA,EAAA,cAAA,wDAAAA,EAAA,cAAA,GAAA;AAAA,MACD;AAAA,MACD,EAAA,WAAA,GAAA;AAAA,IACkB;AAGnB,UAAAuD,IAAApC,EAAA;AACA,QAAAqC;AAEA,WAAAC,EAAA,MAAA;AACC,MAAAD,IAAA,IAAA,eAAA,MAAA;AACC,QAAAD,EAAA,MAAA,cAAA,MAAA,YAAA,sCAAAA,EAAA,MAAA,eAAA,IAAA;AAAA,MAAiH,CAAA,GAGlHC,EAAA,QAAAD,EAAA,KAAA;AAAA,IAAkC,CAAA,GAGnCG,EAAA,MAAA;AACC,MAAAF,EAAA,WAAA;AAAA,IAA0B,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrJ3B,UAAA7C,IAAAc,GAKAb,IAAAwB,EAAAX,GAAA,YAAA,GAEAzB,IAAAU,GAAAC,GAAAC,CAAA,GAEA+C,IAAA,KAAA,OAAA;AAEA,IAAAhD,EAAA,WAAAK,EAAA,MAAA,0BAAA,IAAA2C,GAAA,wBAAA,GAEAD,EAAA,MAAA;AACC,MAAA/C,EAAA,WAAAK,EAAA,MAAA,0BAAA,OAAA2C,CAAA,GAEA3D,EAAA,OAAA4D,GAAA5D,EAAA,KAAAA,EAAA,gBAAA,EAAA;AAAA,IAA4D,CAAA;AAG7D,UAAA6D,IAAA1C,EAAA,GACAgB,IAAAhB,EAAA,EAAA;AAEA,WAAAf,EAAA,CAAAyD,GAAA,MAAA7D,EAAA,SAAA,GAAA,MAAA;AACC,MAAAmC,EAAA,QAAAJ,EAAA/B,EAAA,SAAA;AAAA,IAAyD,GAAA,EAAA,WAAA,GAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5BzD,SAAA8D,GAAAC,GAAAC,GAAA;;;;;;;;;;;ACGD,UAAAhE,IAAAuB,EAAA;;;;;;;;;;;;;;;;;;;;;;;;uDCFO0C,KAAAC,IACAC,KAAAtB,GACAuB,KAAAC;"}
package/utils/date.amd.js CHANGED
@@ -1,2 +1,2 @@
1
- define(["require","exports","../.chunks/forms-BImXJ_ZO.amd"],function(n,e,t){"use strict";if(typeof a>"u")var a=window.Vue;e.dateFormat=t.dateFormat,e.dateToString=t.dateToString,e.dateUnformat=t.dateUnformat,e.genDate=t.genDate,e.genDateMoscow=t.genDateMoscow,e.getDayOfWeek=t.getDayOfWeek,e.stringToDate=t.stringToDate,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})});
1
+ define(["require","exports","../.chunks/forms-CjYoXTEQ.amd"],function(n,e,t){"use strict";if(typeof a>"u")var a=window.Vue;e.dateFormat=t.dateFormat,e.dateToString=t.dateToString,e.dateUnformat=t.dateUnformat,e.genDate=t.genDate,e.genDateMoscow=t.genDateMoscow,e.getDayOfWeek=t.getDayOfWeek,e.stringToDate=t.stringToDate,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})});
2
2
  //# sourceMappingURL=date.amd.js.map
package/utils/date.js CHANGED
@@ -1,4 +1,4 @@
1
- import { d as t, L as s, P as o, N as r, O as g, K as n, M as d } from "../.chunks/forms-D9r2-H5Y.es.js";
1
+ import { d as t, P as s, V as o, R as r, U as g, O as n, Q as d } from "../.chunks/forms-CHiMZ8vg.es.js";
2
2
  export {
3
3
  t as dateFormat,
4
4
  s as dateToString,
@@ -1,2 +1,2 @@
1
- define(["require","exports","../.chunks/forms-BImXJ_ZO.amd"],function(a,e,i){"use strict";if(typeof l>"u")var l=window.Vue;e.get$scroll=i.get$scroll,e.getCommandKeyLabel=i.getCommandKeyLabel,e.getElsScroll=i.getElsScroll,e.getOS=i.getOS,e.getOSAsync=i.getOSAsync,e.getScrollTop=i.getScrollTop,e.isApp=i.isApp,e.isMacOS=i.isMacOS,e.isMobile=i.isMobile,e.isRetina=i.isRetina,e.isSafari=i.isSafari,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})});
1
+ define(["require","exports","../.chunks/forms-CjYoXTEQ.amd"],function(a,e,i){"use strict";if(typeof l>"u")var l=window.Vue;e.get$scroll=i.get$scroll,e.getCommandKeyLabel=i.getCommandKeyLabel,e.getElsScroll=i.getElsScroll,e.getOS=i.getOS,e.getOSAsync=i.getOSAsync,e.getScrollTop=i.getScrollTop,e.isApp=i.isApp,e.isMacOS=i.isMacOS,e.isMobile=i.isMobile,e.isRetina=i.isRetina,e.isSafari=i.isSafari,Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})});
2
2
  //# sourceMappingURL=device.amd.js.map