admins-components 9.0.83 → 9.0.85

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 (28) hide show
  1. package/dist/admins-components170.js.map +1 -1
  2. package/dist/admins-components173.js +94 -130
  3. package/dist/admins-components173.js.map +1 -1
  4. package/dist/admins-components38.js +27 -24
  5. package/dist/admins-components38.js.map +1 -1
  6. package/dist/admins-components40.js.map +1 -1
  7. package/dist/admins-components51.js +76 -83
  8. package/dist/admins-components51.js.map +1 -1
  9. package/dist/admins-components52.js.map +1 -1
  10. package/dist/admins-components71.js +38 -53
  11. package/dist/admins-components71.js.map +1 -1
  12. package/dist/admins-components73.js.map +1 -1
  13. package/dist/src/vueformelements/config/ArticlePickerElementConfig.d.ts +1 -0
  14. package/dist/styles/components/data-table/data-cards.scss_vue_type_style_index_0_src_true_lang.css +1 -1
  15. package/dist/styles/components/data-table/data-list.scss_vue_type_style_index_0_src_true_lang.css +1 -1
  16. package/dist/styles/components/data-table/data-paginator.scss_vue_type_style_index_0_src_true_lang.css +1 -1
  17. package/dist/styles/components/data-table/data-table.scss_vue_type_style_index_0_src_true_lang.css +1 -1
  18. package/dist/styles/components/modal.scss_vue_type_style_index_0_src_true_lang.css +1 -1
  19. package/dist/vueformelements/ArticlePickerElement.vue_vue_type_style_index_0_scoped_56a4bfd6_lang.css +1 -0
  20. package/dist/widget/dist/hvg-search-image-style.css +1 -0
  21. package/dist/widget/dist/hvg-search-image.es.js +204437 -0
  22. package/dist/widget/dist/hvg-search-image.umd.js +506 -0
  23. package/dist/widget/dist/search-posts-widget.css +2 -1
  24. package/dist/widget/dist/search-posts-widget.es.js +9959 -11192
  25. package/dist/widget/dist/search-posts-widget.umd.js +5 -31
  26. package/dist/widget.css +1 -1
  27. package/package.json +1 -1
  28. package/dist/vueformelements/ArticlePickerElement.vue_vue_type_style_index_0_scoped_0afb93e7_lang.css +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"admins-components170.js","names":[],"sources":["../src/vueformelements/config/ArticlePickerElementConfig.ts"],"sourcesContent":["export interface ArticlePickerElementConfig {\n searchArticleApiUrl: string\n searchArticleWidgetUrl: string\n showIds?: boolean\n}\n\nexport let apeConfig: ArticlePickerElementConfig = (window as any).config?.articlePicker || {}\n\nexport function configureArticlePickerElement(apec: ArticlePickerElementConfig) {\n apeConfig = {\n ...apeConfig,\n ...apec,\n }\n return apeConfig\n}\n"],"mappings":";AAMA,IAAW,IAAyC,OAAe,QAAQ,iBAAiB,CAAC;AAE7F,SAAgB,EAA8B,GAAkC;CAK9E,OAJA,IAAY;EACV,GAAG;EACH,GAAG;CACL,GACO;AACT"}
1
+ {"version":3,"file":"admins-components170.js","names":[],"sources":["../src/vueformelements/config/ArticlePickerElementConfig.ts"],"sourcesContent":["export interface ArticlePickerElementConfig {\n searchArticleApiUrl: string\n searchArticleWidgetUrl: string\n showIds?: boolean\n // Where the search-posts-widget renders its confirm/cancel buttons\n // inside its own modal. Defaults to 'footer'.\n articleModalActionsPosition?: 'header' | 'footer' | 'both'\n}\n\nexport let apeConfig: ArticlePickerElementConfig = (window as any).config?.articlePicker || {}\n\nexport function configureArticlePickerElement(apec: ArticlePickerElementConfig) {\n apeConfig = {\n ...apeConfig,\n ...apec,\n }\n return apeConfig\n}\n"],"mappings":";AASA,IAAW,IAAyC,OAAe,QAAQ,iBAAiB,CAAC;AAE7F,SAAgB,EAA8B,GAAkC;CAK9E,OAJA,IAAY;EACV,GAAG;EACH,GAAG;CACL,GACO;AACT"}
@@ -1,4 +1,4 @@
1
- import './vueformelements/ArticlePickerElement.vue_vue_type_style_index_0_scoped_0afb93e7_lang.css';
1
+ import './vueformelements/ArticlePickerElement.vue_vue_type_style_index_0_scoped_56a4bfd6_lang.css';
2
2
  import e from "./admins-components6.js";
3
3
  import t from "./admins-components40.js";
4
4
  import { defineElement as n } from "./admins-components166.js";
@@ -6,226 +6,190 @@ import r from "./admins-components168.js";
6
6
  import { apeConfig as i } from "./admins-components170.js";
7
7
  import { ipeConfig as a } from "./admins-components171.js";
8
8
  /* empty css */
9
- import { createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createSlots as u, createTextVNode as d, createVNode as f, onMounted as p, onUnmounted as m, openBlock as h, ref as g, renderList as _, renderSlot as v, resolveComponent as y, resolveDynamicComponent as b, withCtx as x } from "vue";
9
+ import { createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createSlots as u, createVNode as d, onMounted as f, onUnmounted as p, openBlock as m, ref as h, renderList as g, renderSlot as _, resolveComponent as v, resolveDynamicComponent as y, withCtx as b } from "vue";
10
10
  //#region src/vueformelements/ArticlePickerElement.vue
11
- var S = n({
11
+ var x = n({
12
12
  components: {
13
13
  Button: e,
14
14
  Modal: t
15
15
  },
16
16
  name: "ArticlePickerElement",
17
17
  setup(e, t) {
18
- let n = a.environment, r = a.searchImageWidgetUrl, o = a.imageBaseUrl, s = a.imageViewId, c = i.searchArticleApiUrl, l = i.searchArticleWidgetUrl, u = i.showIds, d = g((/* @__PURE__ */ new Date()).getTime().toString() + "image"), f = g((/* @__PURE__ */ new Date()).getTime().toString() + "article"), h = g(!1), _ = g(!1), v = "00000000-0000-0000-0000-000000000000", { value: y } = t.element, b = (e) => {
19
- e.preventDefault(), h.value = !0;
20
- }, x = () => {
21
- _.value = !0;
22
- }, S = () => {
23
- h.value = !1;
18
+ let n = a.environment, r = a.articleEditorUrl, o = a.searchImageWidgetUrl, s = a.imageBaseUrl, c = a.imageViewId, l = i.searchArticleApiUrl, u = i.searchArticleWidgetUrl, d = i.showIds, m = i.articleModalActionsPosition ?? "footer", g = h((/* @__PURE__ */ new Date()).getTime().toString() + "image"), _ = h((/* @__PURE__ */ new Date()).getTime().toString() + "article"), v = h(!1), y = h(!1), b = "00000000-0000-0000-0000-000000000000", { value: x } = t.element, S = (e) => {
19
+ e.preventDefault(), v.value = !0;
24
20
  }, C = () => {
25
- _.value = !1;
26
- }, w = (e) => {
27
- e.preventDefault(), y.value.imageId = v;
28
- }, T = (e) => {
21
+ y.value = !0;
22
+ }, w = () => {
23
+ v.value = !1;
24
+ }, T = () => {
25
+ y.value = !1;
26
+ }, E = (e) => {
27
+ e.preventDefault(), x.value.imageId = b;
28
+ }, D = (e) => {
29
29
  if (!document.querySelector(`script[src="${e}"]`)) {
30
30
  let t = document.createElement("script");
31
31
  t.type = "text/javascript", t.src = e, document.head.appendChild(t);
32
32
  }
33
- }, E = () => `${o}/${s}/${y.value.imageId}.img`;
34
- T(r), T(l);
35
- let D = (e) => {
36
- e.detail.causationid == d.value && (h.value = !1, y.value.imageId = e.detail.image.id);
37
- }, O = (e) => {
38
- if (e.detail.id == f.value) {
33
+ }, O = () => `${s}/${c}/${x.value.imageId}.img`;
34
+ D(o), D(u);
35
+ let k = (e) => {
36
+ e.detail.causationid == g.value && (v.value = !1, x.value.imageId = e.detail.image.id);
37
+ }, A = (e) => {
38
+ if (e.detail.id == _.value) {
39
39
  if (e.detail.result && e.detail.posts.length > 0) {
40
- y.value.id = e.detail.posts[0].id, y.value.siteId = e.detail.posts[0].siteId, y.value.title = e.detail.posts[0].title, y.value.lead = e.detail.posts[0].lead;
40
+ x.value.id = e.detail.posts[0].id, x.value.siteId = e.detail.posts[0].siteId, x.value.title = e.detail.posts[0].title, x.value.lead = e.detail.posts[0].lead;
41
41
  let t = e.detail.posts[0].featuredImage;
42
- y.value.imageId = t || v;
42
+ x.value.imageId = t || b;
43
43
  }
44
- C();
44
+ T();
45
45
  }
46
46
  };
47
- return m(() => {
48
- window.removeEventListener("image-selected", D, !1), window.removeEventListener("search_posts_selected", O, !1);
49
- }), p(() => {
50
- window.addEventListener("image-selected", D), window.addEventListener("search_posts_selected", O);
47
+ return p(() => {
48
+ window.removeEventListener("image-selected", k, !1), window.removeEventListener("search_posts_selected", A, !1);
49
+ }), f(() => {
50
+ window.addEventListener("image-selected", k), window.addEventListener("search_posts_selected", A);
51
51
  }), {
52
- imageViewId: s,
53
- imageBaseUrl: o,
54
- imageCausationId: d,
55
- articleCausationId: f,
56
- searchImageWidgetUrl: r,
52
+ imageViewId: c,
53
+ imageBaseUrl: s,
54
+ imageCausationId: g,
55
+ articleCausationId: _,
56
+ searchImageWidgetUrl: o,
57
57
  environment: n,
58
- searchArticleApiUrl: c,
59
- selectImage: b,
60
- onArticlePicked: (e) => {
61
- console.log("picked:", e), C();
62
- },
63
- articlePickerRef: g(null),
64
- selectArticle: x,
65
- closeImageModal: S,
66
- closeArticleModal: C,
67
- isImageModalOpen: h,
68
- isArticleModalOpen: _,
69
- resetImage: w,
70
- addScript: T,
71
- value: y,
72
- getImageUrl: E,
73
- showIds: u
58
+ articleEditorUrl: r,
59
+ searchArticleApiUrl: l,
60
+ articleModalActionsPosition: m,
61
+ selectImage: S,
62
+ selectArticle: C,
63
+ closeImageModal: w,
64
+ closeArticleModal: T,
65
+ isImageModalOpen: v,
66
+ isArticleModalOpen: y,
67
+ resetImage: E,
68
+ addScript: D,
69
+ value: x,
70
+ getImageUrl: O,
71
+ showIds: d
74
72
  };
75
73
  }
76
- }), C = { class: "ac-component" }, w = { class: "article-picker-container" }, T = { class: "article-picker-section" }, E = {
74
+ }), S = { class: "ac-component" }, C = { class: "article-picker-container" }, w = { class: "article-picker-section" }, T = {
77
75
  key: 0,
78
76
  class: "article-picker-ids"
79
- }, D = { class: "article-picker-id-field" }, O = { class: "c-input-row" }, k = ["value"], A = { class: "article-picker-id-field" }, j = { class: "c-input-row" }, M = ["value"], N = { class: "article-picker-section" }, P = { class: "c-input-row" }, F = ["value"], I = { class: "article-picker-section" }, L = { class: "c-input-row" }, R = ["value"], z = { class: "article-picker-section" }, B = ["src"], V = {
77
+ }, E = { class: "article-picker-id-field" }, D = { class: "c-input-row" }, O = ["value"], k = { class: "article-picker-id-field" }, A = { class: "c-input-row" }, j = ["value"], M = { class: "article-picker-section" }, N = { class: "c-input-row" }, P = ["value"], F = { class: "article-picker-section" }, I = { class: "c-input-row" }, L = ["value"], R = { class: "article-picker-section" }, z = ["src"], B = {
80
78
  key: 1,
81
79
  class: "article-picker-no-image"
82
- }, H = { class: "article-picker-buttons" }, U = [
80
+ }, V = { class: "article-picker-buttons" }, H = [
83
81
  "causationid",
84
82
  "viewid",
85
83
  "aeurl",
86
84
  "environment"
87
- ], W = { class: "article-picker-modal-header-actions" }, G = ["id", "apiurl"];
88
- function K(e, t, n, r, i, a) {
89
- let p = y("Button"), m = y("Modal"), g = y("ElementLayout");
90
- return h(), o(g, null, u({ _: 2 }, [e.value ? {
85
+ ], U = [
86
+ "id",
87
+ "actions-position",
88
+ "apiurl"
89
+ ];
90
+ function W(e, t, n, r, i, a) {
91
+ let f = v("Button"), p = v("Modal"), h = v("ElementLayout");
92
+ return m(), o(h, null, u({ _: 2 }, [e.value ? {
91
93
  name: "element",
92
- fn: x(() => [l("div", C, [
93
- l("div", w, [
94
- l("div", T, [f(p, {
94
+ fn: b(() => [l("div", S, [
95
+ l("div", C, [
96
+ l("div", w, [d(f, {
95
97
  type: "normal",
96
98
  label: "Cikk Választás",
97
99
  onClick: e.selectArticle
98
100
  }, null, 8, ["onClick"])]),
99
- e.showIds ? (h(), c("div", E, [l("div", D, [t[7] ||= l("label", {
101
+ e.showIds ? (m(), c("div", T, [l("div", E, [t[4] ||= l("label", {
100
102
  for: "articleId",
101
103
  class: "c-label"
102
- }, "Cikk azonosító", -1), l("div", O, [l("input", {
104
+ }, "Cikk azonosító", -1), l("div", D, [l("input", {
103
105
  type: "text",
104
106
  id: "articleId",
105
107
  class: "c-input",
106
108
  placeholder: "Cikk azonosító",
107
109
  disabled: "",
108
110
  value: e.value.id
109
- }, null, 8, k)])]), l("div", A, [t[8] ||= l("label", {
111
+ }, null, 8, O)])]), l("div", k, [t[5] ||= l("label", {
110
112
  for: "articleSiteId",
111
113
  class: "c-label"
112
- }, "Site azonosító", -1), l("div", j, [l("input", {
114
+ }, "Site azonosító", -1), l("div", A, [l("input", {
113
115
  type: "text",
114
116
  id: "articleSiteId",
115
117
  class: "c-input",
116
118
  placeholder: "Site azonosító",
117
119
  disabled: "",
118
120
  value: e.value.siteId
119
- }, null, 8, M)])])])) : s("", !0),
120
- l("div", N, [t[9] ||= l("label", {
121
+ }, null, 8, j)])])])) : s("", !0),
122
+ l("div", M, [t[6] ||= l("label", {
121
123
  for: "articleTitle",
122
124
  class: "c-label"
123
- }, "Címe", -1), l("div", P, [l("textarea", {
125
+ }, "Címe", -1), l("div", N, [l("textarea", {
124
126
  id: "articleTitle",
125
127
  class: "c-input",
126
128
  placeholder: "Címe",
127
129
  value: e.value.title,
128
130
  onInput: t[0] ||= (t) => e.value.title = t.target.value
129
- }, null, 40, F)])]),
130
- l("div", I, [t[10] ||= l("label", {
131
+ }, null, 40, P)])]),
132
+ l("div", F, [t[7] ||= l("label", {
131
133
  for: "articleLead",
132
134
  class: "c-label"
133
- }, "Lead", -1), l("div", L, [l("textarea", {
135
+ }, "Lead", -1), l("div", I, [l("textarea", {
134
136
  id: "articleLead",
135
137
  class: "c-input",
136
138
  placeholder: "Lead",
137
139
  value: e.value.lead,
138
140
  onInput: t[1] ||= (t) => e.value.lead = t.target.value
139
- }, null, 40, R)])]),
140
- l("div", z, [t[11] ||= l("label", { class: "c-label" }, "Kép", -1), l("img", {
141
+ }, null, 40, L)])]),
142
+ l("div", R, [t[8] ||= l("label", { class: "c-label" }, "Kép", -1), l("img", {
141
143
  alt: "",
142
144
  src: e.getImageUrl(),
143
145
  onInput: t[2] ||= (t) => e.value.image = t.target.value,
144
146
  class: "article-picker-image"
145
- }, null, 40, B)]),
146
- e.value.imageId === "00000000-0000-0000-0000-000000000000" ? (h(), c("div", V, " Nincs kép kiválasztva! ")) : s("", !0),
147
- l("div", H, [f(p, {
147
+ }, null, 40, z)]),
148
+ e.value.imageId === "00000000-0000-0000-0000-000000000000" ? (m(), c("div", B, " Nincs kép kiválasztva! ")) : s("", !0),
149
+ l("div", V, [d(f, {
148
150
  type: "normal",
149
151
  label: "Kép Választás",
150
152
  onClick: e.selectImage
151
- }, null, 8, ["onClick"]), f(p, {
153
+ }, null, 8, ["onClick"]), d(f, {
152
154
  type: "error",
153
155
  label: "Eltávolítás",
154
156
  onClick: e.resetImage
155
157
  }, null, 8, ["onClick"])])
156
158
  ]),
157
- e.isImageModalOpen ? (h(), o(m, {
159
+ e.isImageModalOpen ? (m(), o(p, {
158
160
  key: 0,
159
161
  title: "Kép választás",
160
162
  "modal-class": "article-picker-image-modal",
161
163
  onClose: e.closeImageModal
162
164
  }, {
163
- default: x(() => [l("hvg-search-image", {
165
+ default: b(() => [l("hvg-search-image", {
164
166
  causationid: e.imageCausationId,
165
167
  viewid: e.imageViewId,
166
- aeurl: e.searchArticleApiUrl,
168
+ aeurl: e.articleEditorUrl,
167
169
  environment: e.environment,
168
170
  selectonly: "true"
169
- }, null, 8, U)]),
171
+ }, null, 8, H)]),
170
172
  _: 1
171
173
  }, 8, ["onClose"])) : s("", !0),
172
- e.isArticleModalOpen ? (h(), o(m, {
174
+ e.isArticleModalOpen ? (m(), c("search-posts-widget", {
173
175
  key: 1,
174
- title: "Cikk választás",
175
- "modal-class": "article-picker-article-modal",
176
- onClose: e.closeArticleModal
177
- }, {
178
- header: x(() => [t[14] ||= l("h3", { class: "c-modal-title" }, "Cikk választás", -1), l("div", W, [
179
- f(p, {
180
- label: "Mégsem",
181
- outline: "",
182
- onClick: e.closeArticleModal
183
- }, null, 8, ["onClick"]),
184
- f(p, {
185
- type: "success",
186
- disabled: !e.articlePickerRef?.selectedItems?.length,
187
- onClick: t[3] ||= (t) => e.articlePickerRef?.confirmSelection?.()
188
- }, {
189
- default: x(() => [...t[12] ||= [d("Kész", -1)]]),
190
- _: 1
191
- }, 8, ["disabled"]),
192
- l("button", {
193
- type: "button",
194
- class: "c-modal-close",
195
- "aria-label": "Bezárás",
196
- onClick: t[4] ||= (...t) => e.closeArticleModal && e.closeArticleModal(...t)
197
- }, [...t[13] ||= [l("i", { class: "fa-solid fa-xmark" }, null, -1)]])
198
- ])]),
199
- footer: x(() => [f(p, {
200
- label: "Mégsem",
201
- outline: "",
202
- onClick: e.closeArticleModal
203
- }, null, 8, ["onClick"]), f(p, {
204
- type: "success",
205
- disabled: !e.articlePickerRef?.selectedItems?.length,
206
- onClick: t[6] ||= (t) => e.articlePickerRef?.confirmSelection?.()
207
- }, {
208
- default: x(() => [...t[15] ||= [d("Kész", -1)]]),
209
- _: 1
210
- }, 8, ["disabled"])]),
211
- default: x(() => [l("search-posts-widget", {
212
- id: e.articleCausationId,
213
- ref: "articlePickerRef",
214
- selector: "true",
215
- apiurl: e.searchArticleApiUrl,
216
- wpurl: "",
217
- searchurl: "",
218
- onSelected: t[5] ||= (...t) => e.onArticlePicked && e.onArticlePicked(...t)
219
- }, null, 40, G)]),
220
- _: 1
221
- }, 8, ["onClose"])) : s("", !0)
176
+ id: e.articleCausationId,
177
+ selector: "",
178
+ modal: "",
179
+ "modal-title": "Cikk választása",
180
+ "actions-position": e.articleModalActionsPosition,
181
+ apiurl: e.searchArticleApiUrl,
182
+ wpurl: "",
183
+ searchurl: "",
184
+ onClose: t[3] ||= (...t) => e.closeArticleModal && e.closeArticleModal(...t)
185
+ }, null, 40, U)) : s("", !0)
222
186
  ])]),
223
187
  key: "0"
224
- } : void 0, _(e.elementSlots, (t, n) => ({
188
+ } : void 0, g(e.elementSlots, (t, n) => ({
225
189
  name: n,
226
- fn: x(() => [v(e.$slots, n, { el$: e.el$ }, () => [(h(), o(b(t), { el$: e.el$ }, null, 8, ["el$"]))], !0)])
190
+ fn: b(() => [_(e.$slots, n, { el$: e.el$ }, () => [(m(), o(y(t), { el$: e.el$ }, null, 8, ["el$"]))], !0)])
227
191
  }))]), 1024);
228
192
  }
229
- var q = /*#__PURE__*/ r(S, [["render", K], ["__scopeId", "data-v-0afb93e7"]]);
193
+ var G = /*#__PURE__*/ r(x, [["render", W], ["__scopeId", "data-v-56a4bfd6"]]);
230
194
  //#endregion
231
- export { q as default };
195
+ export { G as default };
@@ -1 +1 @@
1
- {"version":3,"file":"admins-components173.js","names":[],"sources":["../src/vueformelements/ArticlePickerElement.vue"],"sourcesContent":["<!-- eslint-disable-next-line vue/block-lang -->\n<script>\nimport { defineElement } from '@vueform/vueform'\nimport { ref, onUnmounted, onMounted } from 'vue'\nimport { apeConfig } from '@/vueformelements/config/ArticlePickerElementConfig'\nimport { ipeConfig } from '@/vueformelements/config/ImagePickerElementConfig'\nimport Button from '@/components/Button.vue'\nimport Modal from '@/components/Modal.vue'\n\nexport default defineElement({\n components: { Button, Modal },\n name: 'ArticlePickerElement',\n\n setup(props, context) {\n const environment = ipeConfig.environment\n const searchImageWidgetUrl = ipeConfig.searchImageWidgetUrl\n const imageBaseUrl = ipeConfig.imageBaseUrl\n const imageViewId = ipeConfig.imageViewId\n\n const searchArticleApiUrl = apeConfig.searchArticleApiUrl\n const searchArticleWidgetUrl = apeConfig.searchArticleWidgetUrl\n const showIds = apeConfig.showIds\n\n const imageCausationId = ref(new Date().getTime().toString() + 'image')\n const articleCausationId = ref(new Date().getTime().toString() + 'article')\n\n const isImageModalOpen = ref(false)\n const isArticleModalOpen = ref(false)\n\n const EMPTYGUID = '00000000-0000-0000-0000-000000000000'\n\n const { value } = context.element\n\n const selectImage = (event) => {\n event.preventDefault()\n isImageModalOpen.value = true\n }\n\n const selectArticle = () => {\n isArticleModalOpen.value = true\n }\n\n const closeImageModal = () => {\n isImageModalOpen.value = false\n }\n\n const closeArticleModal = () => {\n isArticleModalOpen.value = false\n }\n\n const resetImage = (event) => {\n event.preventDefault()\n value.value.imageId = EMPTYGUID\n }\n\n const addScript = (url) => {\n if (!document.querySelector(`script[src=\"${url}\"]`)) {\n const script = document.createElement('script')\n script.type = 'text/javascript'\n script.src = url\n document.head.appendChild(script)\n }\n }\n\n const getImageUrl = () => {\n return `${imageBaseUrl}/${imageViewId}/${value.value.imageId}.img`\n }\n\n addScript(searchImageWidgetUrl)\n addScript(searchArticleWidgetUrl)\n\n const imageSelectedHandler = (e) => {\n if (e.detail.causationid == imageCausationId.value) {\n isImageModalOpen.value = false\n value.value.imageId = e.detail.image.id\n }\n }\n\n const postSelectedHandler = (e) => {\n if (e.detail.id == articleCausationId.value) {\n if (e.detail.result && e.detail.posts.length > 0) {\n value.value.id = e.detail.posts[0].id\n value.value.siteId = e.detail.posts[0].siteId\n value.value.title = e.detail.posts[0].title\n value.value.lead = e.detail.posts[0].lead\n const imageId = e.detail.posts[0].featuredImage\n value.value.imageId = imageId || EMPTYGUID\n }\n\n closeArticleModal()\n }\n }\n\n onUnmounted(() => {\n window.removeEventListener('image-selected', imageSelectedHandler, false)\n window.removeEventListener('search_posts_selected', postSelectedHandler, false)\n })\n\n onMounted(() => {\n window.addEventListener('image-selected', imageSelectedHandler)\n\n window.addEventListener('search_posts_selected', postSelectedHandler)\n })\n const onArticlePicked = (payload) => {\n // payload is the PostSelectionResult from SearchPosts\n console.log('picked:', payload);\n closeArticleModal();\n }\n\n const articlePickerRef = ref(null)\n return {\n imageViewId,\n imageBaseUrl,\n imageCausationId: imageCausationId,\n articleCausationId: articleCausationId,\n searchImageWidgetUrl,\n environment,\n searchArticleApiUrl,\n selectImage,\n onArticlePicked,\n articlePickerRef,\n selectArticle,\n closeImageModal,\n closeArticleModal,\n isImageModalOpen,\n isArticleModalOpen,\n resetImage,\n addScript,\n value,\n getImageUrl,\n showIds,\n }\n }\n})\n</script>\n\n<template>\n <ElementLayout>\n <template v-if=\"value\" #element>\n <div class=\"ac-component\">\n <div class=\"article-picker-container\">\n <div class=\"article-picker-section\">\n <Button type=\"normal\" label=\"Cikk Választás\" @click=\"selectArticle\" />\n </div>\n\n <template v-if=\"showIds\">\n <div class=\"article-picker-ids\">\n <div class=\"article-picker-id-field\">\n <label for=\"articleId\" class=\"c-label\">Cikk azonosító</label>\n <div class=\"c-input-row\">\n <input\n type=\"text\"\n id=\"articleId\"\n class=\"c-input\"\n placeholder=\"Cikk azonosító\"\n disabled\n :value=\"value.id\"\n />\n </div>\n </div>\n <div class=\"article-picker-id-field\">\n <label for=\"articleSiteId\" class=\"c-label\">Site azonosító</label>\n <div class=\"c-input-row\">\n <input\n type=\"text\"\n id=\"articleSiteId\"\n class=\"c-input\"\n placeholder=\"Site azonosító\"\n disabled\n :value=\"value.siteId\"\n />\n </div>\n </div>\n </div>\n </template>\n\n <div class=\"article-picker-section\">\n <label for=\"articleTitle\" class=\"c-label\">Címe</label>\n <div class=\"c-input-row\">\n <textarea\n id=\"articleTitle\"\n class=\"c-input\"\n placeholder=\"Címe\"\n :value=\"value.title\"\n @input=\"value.title = $event.target.value\"\n ></textarea>\n </div>\n </div>\n\n <div class=\"article-picker-section\">\n <label for=\"articleLead\" class=\"c-label\">Lead</label>\n <div class=\"c-input-row\">\n <textarea\n id=\"articleLead\"\n class=\"c-input\"\n placeholder=\"Lead\"\n :value=\"value.lead\"\n @input=\"value.lead = $event.target.value\"\n ></textarea>\n </div>\n </div>\n\n <div class=\"article-picker-section\">\n <label class=\"c-label\">Kép</label>\n <img\n alt=\"\"\n :src=\"getImageUrl()\"\n @input=\"value.image = $event.target.value\"\n class=\"article-picker-image\"\n />\n </div>\n\n <div\n v-if=\"value.imageId === '00000000-0000-0000-0000-000000000000'\"\n class=\"article-picker-no-image\"\n >\n Nincs kép kiválasztva!\n </div>\n\n <div class=\"article-picker-buttons\">\n <Button type=\"normal\" label=\"Kép Választás\" @click=\"selectImage\" />\n <Button type=\"error\" label=\"Eltávolítás\" @click=\"resetImage\" />\n </div>\n </div>\n\n <Modal\n v-if=\"isImageModalOpen\"\n title=\"Kép választás\"\n modal-class=\"article-picker-image-modal\"\n @close=\"closeImageModal\"\n >\n\n <hvg-search-image\n :causationid=\"imageCausationId\"\n :viewid=\"imageViewId\"\n :aeurl=\"searchArticleApiUrl\"\n :environment=\"environment\"\n selectonly=\"true\"\n ></hvg-search-image>\n </Modal>\n <Modal\n v-if=\"isArticleModalOpen\"\n title=\"Cikk választás\"\n modal-class=\"article-picker-article-modal\"\n @close=\"closeArticleModal\"\n >\n <template #header>\n <h3 class=\"c-modal-title\">Cikk választás</h3>\n <div class=\"article-picker-modal-header-actions\">\n <Button label=\"Mégsem\" outline @click=\"closeArticleModal\" />\n <Button\n type=\"success\"\n :disabled=\"!articlePickerRef?.selectedItems?.length\"\n @click=\"articlePickerRef?.confirmSelection?.()\"\n >Kész</Button>\n <button\n type=\"button\"\n class=\"c-modal-close\"\n aria-label=\"Bezárás\"\n @click=\"closeArticleModal\"\n >\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n </template>\n\n <search-posts-widget\n :id=\"articleCausationId\"\n ref=\"articlePickerRef\"\n selector=\"true\"\n :apiurl=\"searchArticleApiUrl\"\n wpurl=\"\"\n searchurl=\"\"\n @selected=\"onArticlePicked\"\n ></search-posts-widget>\n\n <template #footer>\n <Button label=\"Mégsem\" outline @click=\"closeArticleModal\" />\n <Button\n type=\"success\"\n :disabled=\"!articlePickerRef?.selectedItems?.length\"\n @click=\"articlePickerRef?.confirmSelection?.()\"\n >Kész</Button>\n </template>\n </Modal>\n </div>\n </template>\n\n <template v-for=\"(component, slot) in elementSlots\" #[slot]>\n <!-- eslint-disable-next-line vue/valid-attribute-name -->\n <slot :name=\"slot\" :el$=\"el$\">\n <component :is=\"component\" :el$=\"el$\" />\n </slot>\n </template>\n </ElementLayout>\n</template>\n\n<style scoped>\n.article-picker-container {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n}\n\n.article-picker-section {\n display: flex;\n flex-direction: column;\n gap: 0.375rem;\n}\n\n.article-picker-ids {\n display: flex;\n gap: 0.5rem;\n width: 100%;\n}\n\n.article-picker-id-field {\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: 0.375rem;\n}\n\n.article-picker-image {\n height: 200px;\n max-width: 100%;\n border-radius: var(--ac-field-border-radius);\n object-fit: cover;\n}\n\n.article-picker-no-image {\n padding: var(--ac-input-padding);\n color: var(--neutral-500);\n font-size: var(--ac-field-font-size);\n}\n\n.article-picker-buttons {\n display: flex;\n gap: 0.5rem;\n width: 100%;\n}\n\n.article-picker-image-modal {\n width: 90vw;\n max-width: 1200px;\n height: 80vh;\n}\n\n.article-picker-image-modal :deep(.c-modal-body),\n.article-picker-article-modal :deep(.c-modal-body) {\n padding: 0;\n}\n\n.article-picker-article-modal {\n width: 95vw;\n max-width: 1600px;\n height: 90vh;\n}\n\n.article-picker-modal-header-actions {\n margin-left: auto;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n</style>\n"],"mappings":"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"}
1
+ {"version":3,"file":"admins-components173.js","names":[],"sources":["../src/vueformelements/ArticlePickerElement.vue"],"sourcesContent":["<!-- eslint-disable-next-line vue/block-lang -->\n<script>\nimport { defineElement } from '@vueform/vueform'\nimport { ref, onUnmounted, onMounted } from 'vue'\nimport { apeConfig } from '@/vueformelements/config/ArticlePickerElementConfig'\nimport { ipeConfig } from '@/vueformelements/config/ImagePickerElementConfig'\nimport Button from '@/components/Button.vue'\nimport Modal from '@/components/Modal.vue'\n\nexport default defineElement({\n components: { Button, Modal },\n name: 'ArticlePickerElement',\n\n setup(props, context) {\n const environment = ipeConfig.environment\n const articleEditorUrl = ipeConfig.articleEditorUrl\n const searchImageWidgetUrl = ipeConfig.searchImageWidgetUrl\n const imageBaseUrl = ipeConfig.imageBaseUrl\n const imageViewId = ipeConfig.imageViewId\n\n const searchArticleApiUrl = apeConfig.searchArticleApiUrl\n const searchArticleWidgetUrl = apeConfig.searchArticleWidgetUrl\n const showIds = apeConfig.showIds\n const articleModalActionsPosition = apeConfig.articleModalActionsPosition ?? 'footer'\n\n const imageCausationId = ref(new Date().getTime().toString() + 'image')\n const articleCausationId = ref(new Date().getTime().toString() + 'article')\n\n const isImageModalOpen = ref(false)\n const isArticleModalOpen = ref(false)\n\n const EMPTYGUID = '00000000-0000-0000-0000-000000000000'\n\n const { value } = context.element\n\n const selectImage = (event) => {\n event.preventDefault()\n isImageModalOpen.value = true\n }\n\n const selectArticle = () => {\n isArticleModalOpen.value = true\n }\n\n const closeImageModal = () => {\n isImageModalOpen.value = false\n }\n\n const closeArticleModal = () => {\n isArticleModalOpen.value = false\n }\n\n const resetImage = (event) => {\n event.preventDefault()\n value.value.imageId = EMPTYGUID\n }\n\n const addScript = (url) => {\n if (!document.querySelector(`script[src=\"${url}\"]`)) {\n const script = document.createElement('script')\n script.type = 'text/javascript'\n script.src = url\n document.head.appendChild(script)\n }\n }\n\n const getImageUrl = () => {\n return `${imageBaseUrl}/${imageViewId}/${value.value.imageId}.img`\n }\n\n addScript(searchImageWidgetUrl)\n addScript(searchArticleWidgetUrl)\n\n // Image picker posts `image-selected` (custom event from the\n // hvg-search-image widget). Article picker posts\n // `search_posts_selected` from its own `fireSelections`.\n const imageSelectedHandler = (e) => {\n if (e.detail.causationid == imageCausationId.value) {\n isImageModalOpen.value = false\n value.value.imageId = e.detail.image.id\n }\n }\n\n const postSelectedHandler = (e) => {\n if (e.detail.id == articleCausationId.value) {\n if (e.detail.result && e.detail.posts.length > 0) {\n value.value.id = e.detail.posts[0].id\n value.value.siteId = e.detail.posts[0].siteId\n value.value.title = e.detail.posts[0].title\n value.value.lead = e.detail.posts[0].lead\n const imageId = e.detail.posts[0].featuredImage\n value.value.imageId = imageId || EMPTYGUID\n }\n closeArticleModal()\n }\n }\n\n onUnmounted(() => {\n window.removeEventListener('image-selected', imageSelectedHandler, false)\n window.removeEventListener('search_posts_selected', postSelectedHandler, false)\n })\n\n onMounted(() => {\n window.addEventListener('image-selected', imageSelectedHandler)\n window.addEventListener('search_posts_selected', postSelectedHandler)\n })\n\n return {\n imageViewId,\n imageBaseUrl,\n imageCausationId,\n articleCausationId,\n searchImageWidgetUrl,\n environment,\n articleEditorUrl,\n searchArticleApiUrl,\n articleModalActionsPosition,\n selectImage,\n selectArticle,\n closeImageModal,\n closeArticleModal,\n isImageModalOpen,\n isArticleModalOpen,\n resetImage,\n addScript,\n value,\n getImageUrl,\n showIds,\n }\n },\n})\n</script>\n\n<template>\n <ElementLayout>\n <template v-if=\"value\" #element>\n <div class=\"ac-component\">\n <div class=\"article-picker-container\">\n <div class=\"article-picker-section\">\n <Button type=\"normal\" label=\"Cikk Választás\" @click=\"selectArticle\" />\n </div>\n\n <template v-if=\"showIds\">\n <div class=\"article-picker-ids\">\n <div class=\"article-picker-id-field\">\n <label for=\"articleId\" class=\"c-label\">Cikk azonosító</label>\n <div class=\"c-input-row\">\n <input\n type=\"text\"\n id=\"articleId\"\n class=\"c-input\"\n placeholder=\"Cikk azonosító\"\n disabled\n :value=\"value.id\"\n />\n </div>\n </div>\n <div class=\"article-picker-id-field\">\n <label for=\"articleSiteId\" class=\"c-label\">Site azonosító</label>\n <div class=\"c-input-row\">\n <input\n type=\"text\"\n id=\"articleSiteId\"\n class=\"c-input\"\n placeholder=\"Site azonosító\"\n disabled\n :value=\"value.siteId\"\n />\n </div>\n </div>\n </div>\n </template>\n\n <div class=\"article-picker-section\">\n <label for=\"articleTitle\" class=\"c-label\">Címe</label>\n <div class=\"c-input-row\">\n <textarea\n id=\"articleTitle\"\n class=\"c-input\"\n placeholder=\"Címe\"\n :value=\"value.title\"\n @input=\"value.title = $event.target.value\"\n ></textarea>\n </div>\n </div>\n\n <div class=\"article-picker-section\">\n <label for=\"articleLead\" class=\"c-label\">Lead</label>\n <div class=\"c-input-row\">\n <textarea\n id=\"articleLead\"\n class=\"c-input\"\n placeholder=\"Lead\"\n :value=\"value.lead\"\n @input=\"value.lead = $event.target.value\"\n ></textarea>\n </div>\n </div>\n\n <div class=\"article-picker-section\">\n <label class=\"c-label\">Kép</label>\n <img\n alt=\"\"\n :src=\"getImageUrl()\"\n @input=\"value.image = $event.target.value\"\n class=\"article-picker-image\"\n />\n </div>\n\n <div\n v-if=\"value.imageId === '00000000-0000-0000-0000-000000000000'\"\n class=\"article-picker-no-image\"\n >\n Nincs kép kiválasztva!\n </div>\n\n <div class=\"article-picker-buttons\">\n <Button type=\"normal\" label=\"Kép Választás\" @click=\"selectImage\" />\n <Button type=\"error\" label=\"Eltávolítás\" @click=\"resetImage\" />\n </div>\n </div>\n\n <Modal\n v-if=\"isImageModalOpen\"\n title=\"Kép választás\"\n modal-class=\"article-picker-image-modal\"\n @close=\"closeImageModal\"\n >\n <hvg-search-image\n :causationid=\"imageCausationId\"\n :viewid=\"imageViewId\"\n :aeurl=\"articleEditorUrl\"\n :environment=\"environment\"\n selectonly=\"true\"\n ></hvg-search-image>\n </Modal>\n\n <!--\n The widget owns its own modal (dialog + header/footer actions)\n when `modal` is set, so no outer Modal wrapper is needed here -\n the widget renders as an opaque custom element and can't expose\n internal refs/slots to an outer Modal component. Selecting \"Kész\"\n fires the `search_posts_selected` window event consumed by\n `postSelectedHandler` above; `close` is emitted for both confirm\n and cancel/backdrop-dismiss.\n -->\n <search-posts-widget\n v-if=\"isArticleModalOpen\"\n :id=\"articleCausationId\"\n selector\n modal\n modal-title=\"Cikk választása\"\n :actions-position=\"articleModalActionsPosition\"\n :apiurl=\"searchArticleApiUrl\"\n wpurl=\"\"\n searchurl=\"\"\n @close=\"closeArticleModal\"\n ></search-posts-widget>\n </div>\n </template>\n\n <template v-for=\"(component, slot) in elementSlots\" #[slot]>\n <!-- eslint-disable-next-line vue/valid-attribute-name -->\n <slot :name=\"slot\" :el$=\"el$\">\n <component :is=\"component\" :el$=\"el$\" />\n </slot>\n </template>\n </ElementLayout>\n</template>\n\n<style scoped>\n.article-picker-container {\n display: flex;\n flex-direction: column;\n gap: 1rem;\n}\n\n.article-picker-section {\n display: flex;\n flex-direction: column;\n gap: 0.375rem;\n}\n\n.article-picker-ids {\n display: flex;\n gap: 0.5rem;\n width: 100%;\n}\n\n.article-picker-id-field {\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: 0.375rem;\n}\n\n.article-picker-image {\n height: 200px;\n max-width: 100%;\n border-radius: var(--ac-field-border-radius);\n object-fit: cover;\n}\n\n.article-picker-no-image {\n padding: var(--ac-input-padding);\n color: var(--neutral-500);\n font-size: var(--ac-field-font-size);\n}\n\n.article-picker-buttons {\n display: flex;\n gap: 0.5rem;\n width: 100%;\n}\n\n.article-picker-image-modal {\n width: 90vw;\n max-width: 1200px;\n height: 80vh;\n}\n\n.article-picker-image-modal :deep(.c-modal-body) {\n padding: 0;\n}\n</style>\n"],"mappings":"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"}
@@ -1,49 +1,52 @@
1
- import { Teleport as e, createBlock as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, defineComponent as a, normalizeClass as o, onMounted as s, onUnmounted as c, openBlock as l, renderSlot as u, toDisplayString as d } from "vue";
1
+ import { Teleport as e, createBlock as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, defineComponent as a, normalizeClass as o, onMounted as s, onUnmounted as c, openBlock as l, ref as u, renderSlot as d, toDisplayString as f } from "vue";
2
2
  //#region src/components/Modal.vue?vue&type=script&setup=true&lang.ts
3
- var f = { class: "ac-component" }, p = ["aria-label"], m = {
3
+ var p = { class: "ac-component" }, m = ["aria-label"], h = {
4
4
  key: 0,
5
5
  class: "c-modal-header"
6
- }, h = { class: "c-modal-title" }, g = { class: "c-modal-body c-scroll" }, _ = {
6
+ }, g = { class: "c-modal-header__content" }, _ = { class: "c-modal-title" }, v = { class: "c-modal-body c-scroll" }, y = {
7
7
  key: 1,
8
8
  class: "c-modal-footer"
9
- }, v = /*@__PURE__*/ a({
9
+ }, b = /*@__PURE__*/ a({
10
10
  __name: "Modal",
11
11
  props: {
12
12
  title: {},
13
13
  modalClass: {}
14
14
  },
15
15
  emits: ["close"],
16
- setup(a, { emit: v }) {
17
- let y = v;
18
- function b(e) {
19
- e.target === e.currentTarget && y("close");
16
+ setup(a, { emit: b }) {
17
+ let x = b, S = u(null);
18
+ function C(e) {
19
+ e.target === S.value && x("close");
20
20
  }
21
- function x(e) {
22
- e.key === "Escape" && y("close");
21
+ function w(e) {
22
+ e.target instanceof Node && !S.value?.contains(e.target) && x("close");
23
+ }
24
+ function T(e) {
25
+ e.preventDefault(), x("close");
23
26
  }
24
27
  return s(() => {
25
- document.addEventListener("keydown", x);
28
+ S.value?.showModal(), document.addEventListener("mousedown", w);
26
29
  }), c(() => {
27
- document.removeEventListener("keydown", x);
28
- }), (s, c) => (l(), t(e, { to: "body" }, [i("div", f, [i("div", {
29
- class: "c-modal-backdrop",
30
- onMousedown: b
31
- }, [i("div", {
30
+ document.removeEventListener("mousedown", w);
31
+ }), (s, c) => (l(), t(e, { to: "body" }, [i("div", p, [i("dialog", {
32
+ ref_key: "dialogElement",
33
+ ref: S,
32
34
  class: o(["c-modal", a.modalClass]),
33
- role: "dialog",
34
35
  "aria-modal": "true",
35
- "aria-label": a.title
36
+ "aria-label": a.title,
37
+ onMousedown: C,
38
+ onCancel: T
36
39
  }, [
37
- s.$slots.header || a.title ? (l(), r("div", m, [u(s.$slots, "header", {}, () => [i("h3", h, d(a.title), 1)]), i("button", {
40
+ s.$slots.header || a.title ? (l(), r("header", h, [i("div", g, [d(s.$slots, "header", {}, () => [i("h3", _, f(a.title), 1)])]), i("button", {
38
41
  type: "button",
39
42
  class: "c-modal-close",
40
43
  "aria-label": "Bezárás",
41
- onClick: c[0] ||= (e) => y("close")
44
+ onClick: c[0] ||= (e) => x("close")
42
45
  }, [...c[1] ||= [i("i", { class: "fa-solid fa-xmark" }, null, -1)]])])) : n("", !0),
43
- i("div", g, [u(s.$slots, "default")]),
44
- s.$slots.footer ? (l(), r("div", _, [u(s.$slots, "footer")])) : n("", !0)
45
- ], 10, p)], 32)])]));
46
+ i("div", v, [d(s.$slots, "default")]),
47
+ s.$slots.footer ? (l(), r("footer", y, [d(s.$slots, "footer")])) : n("", !0)
48
+ ], 42, m)])]));
46
49
  }
47
50
  });
48
51
  //#endregion
49
- export { v as default };
52
+ export { b as default };
@@ -1 +1 @@
1
- {"version":3,"file":"admins-components38.js","names":["$slots"],"sources":["../src/components/Modal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ModalProps {\n title?: string\n modalClass?: string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, onUnmounted } from 'vue'\n\ndefineProps<ModalProps>()\n\nconst emit = defineEmits<{\n close: []\n}>()\n\nfunction onBackdropClick(e: MouseEvent) {\n if (e.target === e.currentTarget) {\n emit('close')\n }\n}\n\nfunction onKeydown(e: KeyboardEvent) {\n if (e.key === 'Escape') {\n emit('close')\n }\n}\n\nonMounted(() => {\n document.addEventListener('keydown', onKeydown)\n})\n\nonUnmounted(() => {\n document.removeEventListener('keydown', onKeydown)\n})\n</script>\n\n<template>\n <Teleport to=\"body\">\n <div class=\"ac-component\">\n <div class=\"c-modal-backdrop\" @mousedown=\"onBackdropClick\">\n <div\n class=\"c-modal\"\n :class=\"modalClass\"\n role=\"dialog\"\n aria-modal=\"true\"\n :aria-label=\"title\"\n >\n <div v-if=\"$slots.header || title\" class=\"c-modal-header\">\n <slot name=\"header\">\n <h3 class=\"c-modal-title\">{{ title }}</h3>\n </slot>\n <button type=\"button\" class=\"c-modal-close\" aria-label=\"Bezárás\" @click=\"emit('close')\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"c-modal-body c-scroll\">\n <slot />\n </div>\n <div v-if=\"$slots.footer\" class=\"c-modal-footer\">\n <slot name=\"footer\" />\n </div>\n </div>\n </div>\n </div>\n </Teleport>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/modal.scss\"></style>\n"],"mappings":";;;;;;;;;;;;;;;;EAYA,IAAM,IAAO;EAIb,SAAS,EAAgB,GAAe;GACtC,AAAI,EAAE,WAAW,EAAE,iBACjB,EAAK,OAAO;EAEhB;EAEA,SAAS,EAAU,GAAkB;GACnC,AAAI,EAAE,QAAQ,YACZ,EAAK,OAAO;EAEhB;SAEA,QAAgB;GACd,SAAS,iBAAiB,WAAW,CAAS;EAChD,CAAC,GAED,QAAkB;GAChB,SAAS,oBAAoB,WAAW,CAAS;EACnD,CAAC,cAIC,EAAA,GAAA,EA2BW,GAAA,EA3BD,IAAG,OAAM,GAAA,CACjB,EAyBM,OAzBN,GAyBM,CAxBJ,EAuBM,OAAA;GAvBD,OAAM;GAAoB,aAAW;EACxC,GAAA,CAAA,EAqBM,OAAA;GApBJ,OAAK,EAAA,CAAC,WACE,EAAA,UAAU,CAAA;GAClB,MAAK;GACL,cAAW;GACV,cAAY,EAAA;;GAEFA,EAAAA,OAAO,UAAU,EAAA,SAA5B,EAAA,GAAA,EAOM,OAPN,GAOM,CANJ,EAEO,EAAA,QAAA,UAAA,CAAA,SAAA,CADL,EAA0C,MAA1C,GAA0C,EAAb,EAAA,KAAK,GAAA,CAAA,CAAA,CAAA,GAEpC,EAES,UAAA;IAFD,MAAK;IAAS,OAAM;IAAgB,cAAW;IAAW,SAAK,AAAA,EAAA,QAAA,MAAE,EAAI,OAAA;GAC3E,GAAA,CAAA,GAAA,AAAA,EAAA,OAAA,CAAA,EAAiC,KAAA,EAA9B,OAAM,oBAAmB,GAAA,MAAA,EAAA,CAAA,CAAA,CAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA;GAGhC,EAEM,OAFN,GAEM,CADJ,EAAQ,EAAA,QAAA,SAAA,CAAA,CAAA;GAECA,EAAAA,OAAO,UAAlB,EAAA,GAAA,EAEM,OAFN,GAEM,CADJ,EAAsB,EAAA,QAAA,QAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA"}
1
+ {"version":3,"file":"admins-components38.js","names":["$slots"],"sources":["../src/components/Modal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ModalProps {\n title?: string\n modalClass?: string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, onUnmounted, ref } from 'vue'\n\ndefineProps<ModalProps>()\n\nconst emit = defineEmits<{\n close: []\n}>()\n\nconst dialogElement = ref<HTMLDialogElement | null>(null)\n\nfunction onBackdropClick(e: MouseEvent) {\n if (e.target === dialogElement.value) {\n emit('close')\n }\n}\n\nfunction onDocumentMousedown(e: MouseEvent) {\n if (e.target instanceof Node && !dialogElement.value?.contains(e.target)) {\n emit('close')\n }\n}\n\nfunction onCancel(e: Event) {\n e.preventDefault()\n emit('close')\n}\n\nonMounted(() => {\n dialogElement.value?.showModal()\n document.addEventListener('mousedown', onDocumentMousedown)\n})\n\nonUnmounted(() => {\n document.removeEventListener('mousedown', onDocumentMousedown)\n})\n</script>\n\n<template>\n <Teleport to=\"body\">\n <div class=\"ac-component\">\n <dialog\n ref=\"dialogElement\"\n class=\"c-modal\"\n :class=\"modalClass\"\n aria-modal=\"true\"\n :aria-label=\"title\"\n @mousedown=\"onBackdropClick\"\n @cancel=\"onCancel\"\n >\n <header v-if=\"$slots.header || title\" class=\"c-modal-header\">\n <div class=\"c-modal-header__content\">\n <slot name=\"header\">\n <h3 class=\"c-modal-title\">{{ title }}</h3>\n </slot>\n </div>\n <button type=\"button\" class=\"c-modal-close\" aria-label=\"Bezárás\" @click=\"emit('close')\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </header>\n <div class=\"c-modal-body c-scroll\">\n <slot />\n </div>\n <footer v-if=\"$slots.footer\" class=\"c-modal-footer\">\n <slot name=\"footer\" />\n </footer>\n </dialog>\n </div>\n </Teleport>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/modal.scss\"></style>\n"],"mappings":";;;;;;;;;;;;;;;;EAYA,IAAM,IAAO,GAIP,IAAgB,EAA8B,IAAI;EAExD,SAAS,EAAgB,GAAe;GACtC,AAAI,EAAE,WAAW,EAAc,SAC7B,EAAK,OAAO;EAEhB;EAEA,SAAS,EAAoB,GAAe;GAC1C,AAAI,EAAE,kBAAkB,QAAQ,CAAC,EAAc,OAAO,SAAS,EAAE,MAAM,KACrE,EAAK,OAAO;EAEhB;EAEA,SAAS,EAAS,GAAU;GAE1B,AADA,EAAE,eAAe,GACjB,EAAK,OAAO;EACd;SAEA,QAAgB;GAEd,AADA,EAAc,OAAO,UAAU,GAC/B,SAAS,iBAAiB,aAAa,CAAmB;EAC5D,CAAC,GAED,QAAkB;GAChB,SAAS,oBAAoB,aAAa,CAAmB;EAC/D,CAAC,cAIC,EAAA,GAAA,EA6BW,GAAA,EA7BD,IAAG,OAAM,GAAA,CACjB,EA2BM,OA3BN,GA2BM,CA1BJ,EAyBS,UAAA;GAxBH,SAAA;GAAJ,KAAI;GACJ,OAAK,EAAA,CAAC,WACE,EAAA,UAAU,CAAA;GAClB,cAAW;GACV,cAAY,EAAA;GACZ,aAAW;GACH;;GAEKA,EAAAA,OAAO,UAAU,EAAA,SAA/B,EAAA,GAAA,EASS,UATT,GASS,CARP,EAIM,OAJN,GAIM,CAHJ,EAEO,EAAA,QAAA,UAAA,CAAA,SAAA,CADL,EAA0C,MAA1C,GAA0C,EAAb,EAAA,KAAK,GAAA,CAAA,CAAA,CAAA,CAAA,CAAA,GAGtC,EAES,UAAA;IAFD,MAAK;IAAS,OAAM;IAAgB,cAAW;IAAW,SAAK,AAAA,EAAA,QAAA,MAAE,EAAI,OAAA;GAC3E,GAAA,CAAA,GAAA,AAAA,EAAA,OAAA,CAAA,EAAiC,KAAA,EAA9B,OAAM,oBAAmB,GAAA,MAAA,EAAA,CAAA,CAAA,CAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA;GAGhC,EAEM,OAFN,GAEM,CADJ,EAAQ,EAAA,QAAA,SAAA,CAAA,CAAA;GAEIA,EAAAA,OAAO,UAArB,EAAA,GAAA,EAES,UAFT,GAES,CADP,EAAsB,EAAA,QAAA,QAAA,CAAA,CAAA,KAAA,EAAA,IAAA,EAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"admins-components40.js","names":[],"sources":["../src/components/Modal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ModalProps {\n title?: string\n modalClass?: string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, onUnmounted } from 'vue'\n\ndefineProps<ModalProps>()\n\nconst emit = defineEmits<{\n close: []\n}>()\n\nfunction onBackdropClick(e: MouseEvent) {\n if (e.target === e.currentTarget) {\n emit('close')\n }\n}\n\nfunction onKeydown(e: KeyboardEvent) {\n if (e.key === 'Escape') {\n emit('close')\n }\n}\n\nonMounted(() => {\n document.addEventListener('keydown', onKeydown)\n})\n\nonUnmounted(() => {\n document.removeEventListener('keydown', onKeydown)\n})\n</script>\n\n<template>\n <Teleport to=\"body\">\n <div class=\"ac-component\">\n <div class=\"c-modal-backdrop\" @mousedown=\"onBackdropClick\">\n <div\n class=\"c-modal\"\n :class=\"modalClass\"\n role=\"dialog\"\n aria-modal=\"true\"\n :aria-label=\"title\"\n >\n <div v-if=\"$slots.header || title\" class=\"c-modal-header\">\n <slot name=\"header\">\n <h3 class=\"c-modal-title\">{{ title }}</h3>\n </slot>\n <button type=\"button\" class=\"c-modal-close\" aria-label=\"Bezárás\" @click=\"emit('close')\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </div>\n <div class=\"c-modal-body c-scroll\">\n <slot />\n </div>\n <div v-if=\"$slots.footer\" class=\"c-modal-footer\">\n <slot name=\"footer\" />\n </div>\n </div>\n </div>\n </div>\n </Teleport>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/modal.scss\"></style>\n"],"mappings":""}
1
+ {"version":3,"file":"admins-components40.js","names":[],"sources":["../src/components/Modal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport interface ModalProps {\n title?: string\n modalClass?: string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { onMounted, onUnmounted, ref } from 'vue'\n\ndefineProps<ModalProps>()\n\nconst emit = defineEmits<{\n close: []\n}>()\n\nconst dialogElement = ref<HTMLDialogElement | null>(null)\n\nfunction onBackdropClick(e: MouseEvent) {\n if (e.target === dialogElement.value) {\n emit('close')\n }\n}\n\nfunction onDocumentMousedown(e: MouseEvent) {\n if (e.target instanceof Node && !dialogElement.value?.contains(e.target)) {\n emit('close')\n }\n}\n\nfunction onCancel(e: Event) {\n e.preventDefault()\n emit('close')\n}\n\nonMounted(() => {\n dialogElement.value?.showModal()\n document.addEventListener('mousedown', onDocumentMousedown)\n})\n\nonUnmounted(() => {\n document.removeEventListener('mousedown', onDocumentMousedown)\n})\n</script>\n\n<template>\n <Teleport to=\"body\">\n <div class=\"ac-component\">\n <dialog\n ref=\"dialogElement\"\n class=\"c-modal\"\n :class=\"modalClass\"\n aria-modal=\"true\"\n :aria-label=\"title\"\n @mousedown=\"onBackdropClick\"\n @cancel=\"onCancel\"\n >\n <header v-if=\"$slots.header || title\" class=\"c-modal-header\">\n <div class=\"c-modal-header__content\">\n <slot name=\"header\">\n <h3 class=\"c-modal-title\">{{ title }}</h3>\n </slot>\n </div>\n <button type=\"button\" class=\"c-modal-close\" aria-label=\"Bezárás\" @click=\"emit('close')\">\n <i class=\"fa-solid fa-xmark\"></i>\n </button>\n </header>\n <div class=\"c-modal-body c-scroll\">\n <slot />\n </div>\n <footer v-if=\"$slots.footer\" class=\"c-modal-footer\">\n <slot name=\"footer\" />\n </footer>\n </dialog>\n </div>\n </Teleport>\n</template>\n\n<style lang=\"scss\" src=\"@/styles/components/modal.scss\"></style>\n"],"mappings":""}