@effect-app/vue-components 2.7.10 → 2.7.11

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.
@@ -8,9 +8,11 @@ type __VLS_Props = {
8
8
  declare var __VLS_6: {
9
9
  errors: OmegaError[];
10
10
  showedGeneralErrors: string[];
11
- };
11
+ }, __VLS_13: {};
12
12
  type __VLS_Slots = {} & {
13
13
  default?: (props: typeof __VLS_6) => any;
14
+ } & {
15
+ icon?: (props: typeof __VLS_13) => any;
14
16
  };
15
17
  declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
16
18
  declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
@@ -1,8 +1,8 @@
1
- (function(){"use strict";try{if(typeof document<"u"){var t=document.createElement("style");if(t.appendChild(document.createTextNode(".v-enter-from[data-v-0e82cff5],.v-leave-to[data-v-0e82cff5]{max-height:0px;grid-template-rows:0fr;opacity:0}.v-enter-active[data-v-0e82cff5],.v-leave-active[data-v-0e82cff5]{display:grid;transition:all .15s}.v-enter-to[data-v-0e82cff5],.v-leave-from[data-v-0e82cff5]{grid-template-rows:1fr;max-height:50vh;opacity:1}.error-alert[data-v-0e82cff5]{transition-behavior:allow-discrete;display:grid;overflow:hidden;min-height:0}.error-alert>*[data-v-0e82cff5]{min-height:0}.error-list[data-v-0e82cff5]{list-style-position:inside}.error-list [data-v-0e82cff5]::marker{margin:0;padding:0}.error-alert-content[data-v-0e82cff5]{background-color:var(--error-background, #fff5f5);color:var(--error-color, #c92a2a);padding:1em}.error-link[data-v-0e82cff5]{font-weight:700;color:var(--error-color, #c92a2a)}.text-h6[data-v-0e82cff5]{font-weight:700}.error-message[data-v-0e82cff5]{font-style:italic}.error-item[data-v-0e82cff5]{margin-bottom:.5em;overflow:hidden}.error-item>div[data-v-0e82cff5]{float:right;width:100%;max-width:calc(100% - 1.5em)}.container[data-v-0e82cff5]{display:flex;gap:1.5em;align-items:flex-start}.container svg[data-v-0e82cff5]{width:3em;margin-top:.5em}.container .single-error[data-v-0e82cff5]{display:inline-block}")),document.head.appendChild(t),window.customElements){const e=window.customElements.define;window.customElements.define=function(i,a){const r=a.prototype.connectedCallback;return a.prototype.connectedCallback=function(){if(r&&r.call(this),this.shadowRoot){const o=document.createElement("style");o.appendChild(document.createTextNode(".v-enter-from[data-v-0e82cff5],.v-leave-to[data-v-0e82cff5]{max-height:0px;grid-template-rows:0fr;opacity:0}.v-enter-active[data-v-0e82cff5],.v-leave-active[data-v-0e82cff5]{display:grid;transition:all .15s}.v-enter-to[data-v-0e82cff5],.v-leave-from[data-v-0e82cff5]{grid-template-rows:1fr;max-height:50vh;opacity:1}.error-alert[data-v-0e82cff5]{transition-behavior:allow-discrete;display:grid;overflow:hidden;min-height:0}.error-alert>*[data-v-0e82cff5]{min-height:0}.error-list[data-v-0e82cff5]{list-style-position:inside}.error-list [data-v-0e82cff5]::marker{margin:0;padding:0}.error-alert-content[data-v-0e82cff5]{background-color:var(--error-background, #fff5f5);color:var(--error-color, #c92a2a);padding:1em}.error-link[data-v-0e82cff5]{font-weight:700;color:var(--error-color, #c92a2a)}.text-h6[data-v-0e82cff5]{font-weight:700}.error-message[data-v-0e82cff5]{font-style:italic}.error-item[data-v-0e82cff5]{margin-bottom:.5em;overflow:hidden}.error-item>div[data-v-0e82cff5]{float:right;width:100%;max-width:calc(100% - 1.5em)}.container[data-v-0e82cff5]{display:flex;gap:1.5em;align-items:flex-start}.container svg[data-v-0e82cff5]{width:3em;margin-top:.5em}.container .single-error[data-v-0e82cff5]{display:inline-block}")),this.shadowRoot.appendChild(o)}},e.call(window.customElements,i,a)}}}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
1
+ (function(){"use strict";try{if(typeof document<"u"){var a=document.createElement("style");if(a.appendChild(document.createTextNode('.v-enter-from[data-v-6b2bf87e],.v-leave-to[data-v-6b2bf87e]{max-height:0px;grid-template-rows:0fr;opacity:0}.v-enter-active[data-v-6b2bf87e],.v-leave-active[data-v-6b2bf87e]{display:grid;transition:all .15s}.v-enter-to[data-v-6b2bf87e],.v-leave-from[data-v-6b2bf87e]{grid-template-rows:1fr;max-height:50vh;opacity:1}.error-alert[data-v-6b2bf87e]{transition-behavior:allow-discrete;display:grid;overflow:hidden;min-height:0}.error-alert>*[data-v-6b2bf87e]{min-height:0}.error-list[data-v-6b2bf87e]{list-style-position:inside}.error-list [data-v-6b2bf87e]::marker{margin:0;padding:0}.error-alert-content[data-v-6b2bf87e]{background-color:var(--error-background, #fff5f5);color:var(--error-color, #c92a2a);padding:1em}.error-link[data-v-6b2bf87e]{font-weight:700;position:relative;color:var(--error-color, #c92a2a);cursor:pointer}.error-link[data-v-6b2bf87e]:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(from var(--error-color, #c92a2a) r g b / .5)}.text-h6[data-v-6b2bf87e]{font-weight:700;font-size:1.25em}.error-message[data-v-6b2bf87e]{font-style:italic}.error-item[data-v-6b2bf87e]{margin-bottom:.5em;overflow:hidden}.error-item>div[data-v-6b2bf87e]{float:right;width:100%;max-width:calc(100% - 1.5em)}.container[data-v-6b2bf87e]{display:flex;gap:1.5em}.container svg[data-v-6b2bf87e]{width:3em}.container .single-error[data-v-6b2bf87e]{display:inline-block}')),document.head.appendChild(a),window.customElements){const e=window.customElements.define;window.customElements.define=function(i,t){const r=t.prototype.connectedCallback;return t.prototype.connectedCallback=function(){if(r&&r.call(this),this.shadowRoot){const o=document.createElement("style");o.appendChild(document.createTextNode('.v-enter-from[data-v-6b2bf87e],.v-leave-to[data-v-6b2bf87e]{max-height:0px;grid-template-rows:0fr;opacity:0}.v-enter-active[data-v-6b2bf87e],.v-leave-active[data-v-6b2bf87e]{display:grid;transition:all .15s}.v-enter-to[data-v-6b2bf87e],.v-leave-from[data-v-6b2bf87e]{grid-template-rows:1fr;max-height:50vh;opacity:1}.error-alert[data-v-6b2bf87e]{transition-behavior:allow-discrete;display:grid;overflow:hidden;min-height:0}.error-alert>*[data-v-6b2bf87e]{min-height:0}.error-list[data-v-6b2bf87e]{list-style-position:inside}.error-list [data-v-6b2bf87e]::marker{margin:0;padding:0}.error-alert-content[data-v-6b2bf87e]{background-color:var(--error-background, #fff5f5);color:var(--error-color, #c92a2a);padding:1em}.error-link[data-v-6b2bf87e]{font-weight:700;position:relative;color:var(--error-color, #c92a2a);cursor:pointer}.error-link[data-v-6b2bf87e]:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(from var(--error-color, #c92a2a) r g b / .5)}.text-h6[data-v-6b2bf87e]{font-weight:700;font-size:1.25em}.error-message[data-v-6b2bf87e]{font-style:italic}.error-item[data-v-6b2bf87e]{margin-bottom:.5em;overflow:hidden}.error-item>div[data-v-6b2bf87e]{float:right;width:100%;max-width:calc(100% - 1.5em)}.container[data-v-6b2bf87e]{display:flex;gap:1.5em}.container svg[data-v-6b2bf87e]{width:3em}.container .single-error[data-v-6b2bf87e]{display:inline-block}')),this.shadowRoot.appendChild(o)}},e.call(window.customElements,i,t)}}}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
2
2
  import r from "./vue-components.es33.js";
3
3
 
4
4
  import o from "./vue-components.es35.js";
5
- const f = /* @__PURE__ */ o(r, [["__scopeId", "data-v-0e82cff5"]]);
5
+ const m = /* @__PURE__ */ o(r, [["__scopeId", "data-v-6b2bf87e"]]);
6
6
  export {
7
- f as default
7
+ m as default
8
8
  };
@@ -1,6 +1,6 @@
1
- import { defineComponent as E, getCurrentInstance as _, computed as B, createBlock as i, openBlock as e, Transition as V, withCtx as u, createElementBlock as o, createCommentVNode as h, renderSlot as x, normalizeProps as I, guardReactiveProps as L, resolveDynamicComponent as p, unref as d, normalizeClass as g, createElementVNode as n, toDisplayString as a, Fragment as v, renderList as w, createTextVNode as y } from "vue";
2
- import { useIntl as M } from "./vue-components.es3.js";
3
- const b = {
1
+ import { defineComponent as _, getCurrentInstance as B, computed as V, createBlock as i, openBlock as e, Transition as x, withCtx as u, createElementBlock as o, createCommentVNode as p, renderSlot as g, normalizeProps as b, guardReactiveProps as I, resolveDynamicComponent as h, unref as d, normalizeClass as v, createElementVNode as n, toDisplayString as a, Fragment as w, renderList as y, createTextVNode as C } from "vue";
2
+ import { useIntl as L } from "./vue-components.es3.js";
3
+ const M = {
4
4
  key: 0,
5
5
  class: "error-alert"
6
6
  }, j = { class: "container" }, D = {
@@ -11,7 +11,7 @@ const b = {
11
11
  }, N = { class: "text-h6" }, z = {
12
12
  key: 0,
13
13
  class: "error-list"
14
- }, G = ["href"], H = { key: 1 }, T = /* @__PURE__ */ E({
14
+ }, G = ["for"], H = { key: 1 }, T = /* @__PURE__ */ _({
15
15
  __name: "OmegaErrorsInternal",
16
16
  props: {
17
17
  generalErrors: {},
@@ -19,19 +19,19 @@ const b = {
19
19
  hideErrorDetails: { type: Boolean }
20
20
  },
21
21
  setup(l) {
22
- const c = _()?.appContext.components.VAlert, k = l, { trans: C } = M(), m = B(() => k.generalErrors ? k.generalErrors.filter((s) => !!s).flatMap(
22
+ const c = B()?.appContext.components.VAlert, k = l, { trans: E } = L(), m = V(() => k.generalErrors ? k.generalErrors.filter((s) => !!s).flatMap(
23
23
  (s) => Object.values(s).filter((t) => !!t).flatMap(
24
24
  (t) => t.filter(
25
25
  (r) => !!r?.message
26
26
  ).map((r) => r.message)
27
27
  )
28
28
  ) : []);
29
- return (s, t) => (e(), i(V, null, {
29
+ return (s, t) => (e(), i(x, null, {
30
30
  default: u(() => [
31
- l.errors.length || m.value.length ? (e(), o("div", b, [
32
- x(s.$slots, "default", I(L({ errors: l.errors, showedGeneralErrors: m.value })), () => [
33
- (e(), i(p(d(c) ? "v-alert" : "div"), {
34
- class: g([d(c) ? "mb-4" : "error-alert-content", "mb-4"]),
31
+ l.errors.length || m.value.length ? (e(), o("div", M, [
32
+ g(s.$slots, "default", b(I({ errors: l.errors, showedGeneralErrors: m.value })), () => [
33
+ (e(), i(h(d(c) ? "v-alert" : "div"), {
34
+ class: v([d(c) ? "mb-4" : "error-alert-content", "mb-4"]),
35
35
  type: "error",
36
36
  variant: "tonal",
37
37
  role: "alert",
@@ -39,51 +39,53 @@ const b = {
39
39
  }, {
40
40
  default: u(() => [
41
41
  n("div", j, [
42
- d(c) ? h("", !0) : (e(), o("svg", D, [...t[0] || (t[0] = [
43
- n("path", {
44
- d: "M16 2H8L2 8V16L8 22H16L22 16V8L16 2Z",
45
- stroke: "currentColor",
46
- "stroke-width": "2",
47
- "stroke-linecap": "round",
48
- "stroke-linejoin": "round"
49
- }, null, -1),
50
- n("path", {
51
- d: "M12 8V12",
52
- stroke: "currentColor",
53
- "stroke-width": "2",
54
- "stroke-linecap": "round",
55
- "stroke-linejoin": "round"
56
- }, null, -1),
57
- n("path", {
58
- d: "M12 16.0195V16",
59
- stroke: "currentColor",
60
- "stroke-width": "2",
61
- "stroke-linecap": "round",
62
- "stroke-linejoin": "round"
63
- }, null, -1)
64
- ])])),
42
+ g(s.$slots, "icon", {}, () => [
43
+ d(c) ? p("", !0) : (e(), o("svg", D, [...t[0] || (t[0] = [
44
+ n("path", {
45
+ d: "M16 2H8L2 8V16L8 22H16L22 16V8L16 2Z",
46
+ stroke: "currentColor",
47
+ "stroke-width": "2",
48
+ "stroke-linecap": "round",
49
+ "stroke-linejoin": "round"
50
+ }, null, -1),
51
+ n("path", {
52
+ d: "M12 8V12",
53
+ stroke: "currentColor",
54
+ "stroke-width": "2",
55
+ "stroke-linecap": "round",
56
+ "stroke-linejoin": "round"
57
+ }, null, -1),
58
+ n("path", {
59
+ d: "M12 16.0195V16",
60
+ stroke: "currentColor",
61
+ "stroke-width": "2",
62
+ "stroke-linecap": "round",
63
+ "stroke-linejoin": "round"
64
+ }, null, -1)
65
+ ])]))
66
+ ], !0),
65
67
  n("div", null, [
66
- n("div", N, a(d(C)("form.includes_error")) + ": ", 1),
68
+ n("div", N, a(d(E)("form.includes_error")) + ": ", 1),
67
69
  l.errors.length ? (e(), o("ul", z, [
68
- (e(!0), o(v, null, w(l.errors, (r) => (e(), o("li", {
70
+ (e(!0), o(w, null, y(l.errors, (r) => (e(), o("li", {
69
71
  key: r.inputId,
70
72
  class: "error-item"
71
73
  }, [
72
74
  n("div", null, [
73
- n("a", {
74
- href: `#${r.inputId}`,
75
+ n("label", {
76
+ for: r.inputId,
75
77
  class: "error-link"
76
78
  }, a(r.label), 9, G),
77
- t[1] || (t[1] = y(" " + a(" ") + " ", -1)),
78
- l.hideErrorDetails ? h("", !0) : (e(), o("div", {
79
+ t[1] || (t[1] = C(" " + a(" ") + " ", -1)),
80
+ l.hideErrorDetails ? p("", !0) : (e(), o("div", {
79
81
  key: 0,
80
- class: g(["error-message", r.errors.length < 2 && "single-error"])
82
+ class: v(["error-message", r.errors.length < 2 && "single-error"])
81
83
  }, [
82
- (e(), i(p(r.errors.length > 1 ? "ul" : "div"), { class: "error-list" }, {
84
+ (e(), i(h(r.errors.length > 1 ? "ul" : "div"), { class: "error-list" }, {
83
85
  default: u(() => [
84
- (e(!0), o(v, null, w(r.errors, (f) => (e(), i(p(r.errors.length > 1 ? "li" : "span"), { key: f }, {
86
+ (e(!0), o(w, null, y(r.errors, (f) => (e(), i(h(r.errors.length > 1 ? "li" : "span"), { key: f }, {
85
87
  default: u(() => [
86
- y(a(f), 1)
88
+ C(a(f), 1)
87
89
  ]),
88
90
  _: 2
89
91
  }, 1024))), 128))
@@ -97,10 +99,10 @@ const b = {
97
99
  ])
98
100
  ])
99
101
  ]),
100
- _: 1
102
+ _: 3
101
103
  }, 8, ["class"]))
102
104
  ], !0)
103
- ])) : h("", !0)
105
+ ])) : p("", !0)
104
106
  ]),
105
107
  _: 3
106
108
  }));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@effect-app/vue-components",
3
- "version": "2.7.10",
3
+ "version": "2.7.11",
4
4
  "peerDependencies": {
5
5
  "@mdi/js": "^7.4.47",
6
6
  "effect": "^3.18.0",
@@ -53,8 +53,8 @@
53
53
  "highlight.js": "^11.11.1",
54
54
  "mitt": "^3.0.1",
55
55
  "vue3-highlightjs": "^1.0.5",
56
- "effect-app": "3.12.0",
57
- "@effect-app/vue": "2.92.2"
56
+ "@effect-app/vue": "2.92.2",
57
+ "effect-app": "3.12.0"
58
58
  },
59
59
  "scripts": {
60
60
  "build": "pnpm build:run",
@@ -15,34 +15,36 @@
15
15
  class="mb-4"
16
16
  >
17
17
  <div class="container">
18
- <svg
19
- v-if="!vuetified"
20
- viewBox="0 0 24 24"
21
- fill="none"
22
- xmlns="http://www.w3.org/2000/svg"
23
- >
24
- <path
25
- d="M16 2H8L2 8V16L8 22H16L22 16V8L16 2Z"
26
- stroke="currentColor"
27
- stroke-width="2"
28
- stroke-linecap="round"
29
- stroke-linejoin="round"
30
- />
31
- <path
32
- d="M12 8V12"
33
- stroke="currentColor"
34
- stroke-width="2"
35
- stroke-linecap="round"
36
- stroke-linejoin="round"
37
- />
38
- <path
39
- d="M12 16.0195V16"
40
- stroke="currentColor"
41
- stroke-width="2"
42
- stroke-linecap="round"
43
- stroke-linejoin="round"
44
- />
45
- </svg>
18
+ <slot name="icon">
19
+ <svg
20
+ v-if="!vuetified"
21
+ viewBox="0 0 24 24"
22
+ fill="none"
23
+ xmlns="http://www.w3.org/2000/svg"
24
+ >
25
+ <path
26
+ d="M16 2H8L2 8V16L8 22H16L22 16V8L16 2Z"
27
+ stroke="currentColor"
28
+ stroke-width="2"
29
+ stroke-linecap="round"
30
+ stroke-linejoin="round"
31
+ />
32
+ <path
33
+ d="M12 8V12"
34
+ stroke="currentColor"
35
+ stroke-width="2"
36
+ stroke-linecap="round"
37
+ stroke-linejoin="round"
38
+ />
39
+ <path
40
+ d="M12 16.0195V16"
41
+ stroke="currentColor"
42
+ stroke-width="2"
43
+ stroke-linecap="round"
44
+ stroke-linejoin="round"
45
+ />
46
+ </svg>
47
+ </slot>
46
48
  <div>
47
49
  <div class="text-h6">
48
50
  {{ trans("form.includes_error") }}:
@@ -57,10 +59,10 @@
57
59
  class="error-item"
58
60
  >
59
61
  <div>
60
- <a
61
- :href="`#${error.inputId}`"
62
+ <label
63
+ :for="error.inputId"
62
64
  class="error-link"
63
- >{{ error.label }}</a>
65
+ >{{ error.label }}</label>
64
66
  {{ " " }}
65
67
  <div
66
68
  v-if="!hideErrorDetails"
@@ -185,11 +187,23 @@ const showedGeneralErrors = computed(() => {
185
187
 
186
188
  .error-link {
187
189
  font-weight: bold;
190
+ position: relative;
188
191
  color: var(--error-color, #c92a2a);
192
+ cursor: pointer;
193
+ &::after {
194
+ content: "";
195
+ position: absolute;
196
+ left: 0;
197
+ right: 0;
198
+ bottom: 0;
199
+ height: 1px;
200
+ background: rgba(from var(--error-color, #c92a2a) r g b / 0.5);
201
+ }
189
202
  }
190
203
 
191
204
  .text-h6 {
192
205
  font-weight: bold;
206
+ font-size: 1.25em;
193
207
  }
194
208
 
195
209
  .error-message {
@@ -210,11 +224,9 @@ const showedGeneralErrors = computed(() => {
210
224
  .container {
211
225
  display: flex;
212
226
  gap: 1.5em;
213
- align-items: flex-start;
214
227
 
215
228
  svg {
216
229
  width: 3em;
217
- margin-top: 0.5em;
218
230
  }
219
231
  .single-error {
220
232
  display: inline-block;