lkt-toast 1.1.0 → 1.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/build.d.ts CHANGED
@@ -1,7 +1,7 @@
1
- declare function $(t: any): void;
2
- declare namespace ee {
3
- function install(t: any): void;
1
+ declare function $(e: any): void;
2
+ declare namespace ne {
3
+ function install(e: any): void;
4
4
  }
5
- declare function Z(t: any): void;
6
- declare function te(t: any): void;
7
- export { $ as closeToast, ee as default, Z as openToast, te as setToastCanvas };
5
+ declare function te(e: any): void;
6
+ declare function se(e: any): void;
7
+ export { $ as closeToast, ne as default, te as openToast, se as setToastCanvas };
package/dist/build.js CHANGED
@@ -1,38 +1,38 @@
1
- import { defineComponent as D, mergeDefaults as B, ref as m, computed as c, onMounted as N, resolveComponent as b, createElementBlock as p, openBlock as l, normalizeClass as I, createElementVNode as r, createVNode as w, createBlock as C, createCommentVNode as U, unref as E, getCurrentInstance as j, Fragment as M, renderList as R, mergeProps as V } from "vue";
2
- import { extractI18nValue as P, getDefaultValues as A, Toast as F } from "lkt-vue-kernel";
3
- const T = class T {
1
+ import { defineComponent as D, mergeDefaults as N, ref as m, computed as c, onMounted as w, resolveComponent as E, createElementBlock as p, openBlock as l, normalizeClass as k, createElementVNode as r, createVNode as U, createBlock as C, createCommentVNode as j, unref as M, getCurrentInstance as A, Fragment as R, renderList as V, mergeProps as X } from "vue";
2
+ import { extractI18nValue as P, LktSettings as F, getDefaultValues as S, Toast as q } from "lkt-vue-kernel";
3
+ const z = class z {
4
4
  };
5
- T.canvas = void 0, T.defaultCloseIcon = "";
6
- let f = T;
7
- const o = class o {
5
+ z.canvas = void 0, z.defaultCloseIcon = "";
6
+ let v = z;
7
+ const a = class a {
8
8
  static open(n) {
9
- o.components.push({ ...n, zIndex: o.zIndex }), ++o.zIndex;
9
+ a.components.push({ ...n, zIndex: a.zIndex }), ++a.zIndex;
10
10
  }
11
11
  static close(n) {
12
- const s = o.components.findIndex((i) => i.zIndex === n);
13
- s >= 0 && (o.components.splice(s, 1), o.components.length === 0 && (o.zIndex = 1e3));
12
+ const s = a.components.findIndex((u) => u.zIndex === n);
13
+ s >= 0 && (a.components.splice(s, 1), a.components.length === 0 && (a.zIndex = 1e3));
14
14
  }
15
15
  };
16
- o.components = [], o.zIndex = 1e3;
17
- let v = o;
18
- const Z = (t) => {
19
- if (!f.canvas) {
16
+ a.components = [], a.zIndex = 1e3;
17
+ let f = a;
18
+ const te = (e) => {
19
+ if (!v.canvas) {
20
20
  console.warn("ToastCanvas not defined");
21
21
  return;
22
22
  }
23
- v.open(t), f.canvas.refresh();
24
- }, $ = (t) => {
25
- if (!f.canvas) {
23
+ f.open(e), v.canvas.refresh();
24
+ }, $ = (e) => {
25
+ if (!v.canvas) {
26
26
  console.warn("ToastCanvas not defined");
27
27
  return;
28
28
  }
29
- v.close(t), f.canvas.refresh();
30
- }, q = {
29
+ f.close(e), v.canvas.refresh();
30
+ }, G = {
31
31
  class: "lkt-toast-inner",
32
32
  ref: "inner"
33
- }, G = { class: "lkt-toast-header" }, J = { class: "lkt-toast-header-text" }, K = ["innerHTML"], O = ["innerHTML"], z = /* @__PURE__ */ D({
33
+ }, J = { class: "lkt-toast-header" }, K = { class: "lkt-toast-header-text" }, O = ["innerHTML"], Q = ["innerHTML"], T = /* @__PURE__ */ D({
34
34
  __name: "LktToast",
35
- props: /* @__PURE__ */ B({
35
+ props: /* @__PURE__ */ N({
36
36
  type: {},
37
37
  text: {},
38
38
  details: {},
@@ -41,59 +41,61 @@ const Z = (t) => {
41
41
  duration: {},
42
42
  buttonConfig: {},
43
43
  zIndex: {}
44
- }, A(F)),
45
- setup(t) {
46
- const n = t, s = m(100), i = n.duration ?? 1e4, u = m(null), k = m(!1), h = c(() => {
47
- let e = [];
48
- return k.value && e.push("is-visible"), n.positionX && e.push(`animation-${n.positionX}`), e.join(" ");
49
- }), x = c(() => P(n.text)), g = c(() => P(n.details)), y = () => {
44
+ }, S(q)),
45
+ setup(e) {
46
+ const n = e, s = m(100), u = n.duration ?? 1e4, d = m(null), h = m(!1), g = c(() => {
47
+ let i = [];
48
+ return h.value && i.push("is-visible"), n.positionX && i.push(`animation-${n.positionX}`), i.join(" ");
49
+ }), x = c(() => P(n.text)), _ = c(() => P(n.details)), L = F.defaultCloseToastIcon, y = () => {
50
50
  $(n.zIndex);
51
- }, _ = () => {
52
- u.value.pause();
53
- }, L = () => {
54
- u.value.start();
51
+ }, I = () => {
52
+ d.value.pause();
53
+ }, o = () => {
54
+ d.value.start();
55
55
  };
56
- return N(() => {
56
+ return w(() => {
57
57
  setTimeout(() => {
58
- k.value = !0;
58
+ h.value = !0;
59
59
  }, 100);
60
- }), (e, d) => {
61
- const a = b("lkt-icon"), H = b("lkt-progress");
60
+ }), (i, t) => {
61
+ const H = E("lkt-icon"), B = E("lkt-progress");
62
62
  return l(), p("section", {
63
- class: I(["lkt-toast", h.value]),
64
- onMouseenter: _,
65
- onMousemove: _,
66
- onMouseleave: L
63
+ class: k(["lkt-toast", g.value]),
64
+ onMouseenter: I,
65
+ onMousemove: I,
66
+ onMouseleave: o
67
67
  }, [
68
- r("div", q, [
69
- r("div", G, [
70
- r("div", J, [
71
- e.icon ? (l(), C(a, {
68
+ r("div", G, [
69
+ r("div", J, [
70
+ r("div", K, [
71
+ i.icon ? (l(), C(H, {
72
72
  key: 0,
73
- icon: e.icon
74
- }, null, 8, ["icon"])) : U("", !0),
73
+ icon: i.icon
74
+ }, null, 8, ["icon"])) : j("", !0),
75
75
  r("div", {
76
76
  class: "lkt-toast-text",
77
77
  innerHTML: x.value
78
- }, null, 8, K)
78
+ }, null, 8, O)
79
79
  ]),
80
80
  r("div", {
81
81
  class: "lkt-toast-close",
82
- onClick: d[0] || (d[0] = (X) => E($)(e.zIndex))
83
- }, d[2] || (d[2] = [
84
- r("i", { class: "lkt-icon-close" }, null, -1)
85
- ]))
82
+ onClick: t[0] || (t[0] = (b) => M($)(i.zIndex))
83
+ }, [
84
+ r("i", {
85
+ class: k(M(L))
86
+ }, null, 2)
87
+ ])
86
88
  ]),
87
89
  r("div", {
88
90
  class: "lkt-toast-details",
89
- innerHTML: g.value
90
- }, null, 8, O),
91
- w(H, {
91
+ innerHTML: _.value
92
+ }, null, 8, Q),
93
+ U(B, {
92
94
  ref_key: "progressRef",
93
- ref: u,
95
+ ref: d,
94
96
  modelValue: s.value,
95
- "onUpdate:modelValue": d[1] || (d[1] = (X) => s.value = X),
96
- duration: E(i),
97
+ "onUpdate:modelValue": t[1] || (t[1] = (b) => s.value = b),
98
+ duration: M(u),
97
99
  type: "decremental",
98
100
  "value-format": "hidden",
99
101
  "pause-on-hover": "",
@@ -103,60 +105,60 @@ const Z = (t) => {
103
105
  ], 34);
104
106
  };
105
107
  }
106
- }), Q = { class: "lkt-toast-canvas" }, S = /* @__PURE__ */ D({
108
+ }), W = { class: "lkt-toast-canvas" }, Y = /* @__PURE__ */ D({
107
109
  __name: "LktToastCanvas",
108
- setup(t, { expose: n }) {
109
- const s = m(0), i = j(), u = m([]), k = () => {
110
+ setup(e, { expose: n }) {
111
+ const s = m(0), u = A(), d = m([]), h = () => {
110
112
  s.value = s.value + 1, setTimeout(() => {
111
- var e;
112
- (e = i == null ? void 0 : i.proxy) == null || e.$forceUpdate();
113
+ var o;
114
+ (o = u == null ? void 0 : u.proxy) == null || o.$forceUpdate();
113
115
  }, 1);
114
- }, h = c(() => (s.value, v.components.filter((e) => e.positionX === "left"))), x = c(() => (s.value, v.components.filter((e) => e.positionX === "center"))), g = c(() => (s.value, v.components.filter((e) => e.positionX === "right"))), y = c(() => h.value.length === 0 ? "" : "is-visible"), _ = c(() => x.value.length === 0 ? "" : "is-visible"), L = c(() => g.value.length === 0 ? "" : "is-visible");
116
+ }, g = c(() => (s.value, f.components.filter((o) => o.positionX === "left"))), x = c(() => (s.value, f.components.filter((o) => o.positionX === "center"))), _ = c(() => (s.value, f.components.filter((o) => o.positionX === "right"))), L = c(() => g.value.length === 0 ? "" : "is-visible"), y = c(() => x.value.length === 0 ? "" : "is-visible"), I = c(() => _.value.length === 0 ? "" : "is-visible");
115
117
  return n({
116
- refresh: k
117
- }), (e, d) => (l(), p("section", Q, [
118
+ refresh: h
119
+ }), (o, i) => (l(), p("section", W, [
118
120
  r("div", {
119
- class: I(["lkt-toast-stack left-stack", y.value])
121
+ class: k(["lkt-toast-stack left-stack", L.value])
120
122
  }, [
121
- (l(!0), p(M, null, R(h.value, (a) => (l(), C(z, V({
123
+ (l(!0), p(R, null, V(g.value, (t) => (l(), C(T, X({
122
124
  ref_for: !0,
123
125
  ref_key: "instanceReferences",
124
- ref: u,
125
- key: a.zIndex
126
- }, a), null, 16))), 128))
126
+ ref: d,
127
+ key: t.zIndex
128
+ }, t), null, 16))), 128))
127
129
  ], 2),
128
130
  r("div", {
129
- class: I(["lkt-toast-stack center-stack", _.value])
131
+ class: k(["lkt-toast-stack center-stack", y.value])
130
132
  }, [
131
- (l(!0), p(M, null, R(x.value, (a) => (l(), C(z, V({
133
+ (l(!0), p(R, null, V(x.value, (t) => (l(), C(T, X({
132
134
  ref_for: !0,
133
135
  ref_key: "instanceReferences",
134
- ref: u,
135
- key: a.zIndex
136
- }, a), null, 16))), 128))
136
+ ref: d,
137
+ key: t.zIndex
138
+ }, t), null, 16))), 128))
137
139
  ], 2),
138
140
  r("div", {
139
- class: I(["lkt-toast-stack right-stack", L.value])
141
+ class: k(["lkt-toast-stack right-stack", I.value])
140
142
  }, [
141
- (l(!0), p(M, null, R(g.value, (a) => (l(), C(z, V({
143
+ (l(!0), p(R, null, V(_.value, (t) => (l(), C(T, X({
142
144
  ref_for: !0,
143
145
  ref_key: "instanceReferences",
144
- ref: u,
145
- key: a.zIndex
146
- }, a), null, 16))), 128))
146
+ ref: d,
147
+ key: t.zIndex
148
+ }, t), null, 16))), 128))
147
149
  ], 2)
148
150
  ]));
149
151
  }
150
- }), ee = {
151
- install: (t) => {
152
- t.component("lkt-toast-canvas") === void 0 && t.component("lkt-toast-canvas", S), t.component("lkt-toast") === void 0 && t.component("lkt-toast", z);
152
+ }), ne = {
153
+ install: (e) => {
154
+ e.component("lkt-toast-canvas") === void 0 && e.component("lkt-toast-canvas", Y), e.component("lkt-toast") === void 0 && e.component("lkt-toast", T);
153
155
  }
154
- }, te = (t) => {
155
- f.canvas = t;
156
+ }, se = (e) => {
157
+ v.canvas = e;
156
158
  };
157
159
  export {
158
160
  $ as closeToast,
159
- ee as default,
160
- Z as openToast,
161
- te as setToastCanvas
161
+ ne as default,
162
+ te as openToast,
163
+ se as setToastCanvas
162
164
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "lkt-toast",
3
- "version": "1.1.0",
3
+ "version": "1.1.1",
4
4
  "description": "",
5
5
  "type": "module",
6
6
  "module": "./dist/build.js",
@@ -42,8 +42,8 @@
42
42
  "dependencies": {
43
43
  },
44
44
  "peerDependencies": {
45
- "lkt-loader": "^1.0.1",
46
- "lkt-vue-kernel": "^1.0.26",
45
+ "lkt-loader": "^1.2.0",
46
+ "lkt-vue-kernel": "^1.0.31",
47
47
  "vue": "^3.3.0"
48
48
  }
49
49
  }
@@ -1,6 +1,6 @@
1
1
  <script lang="ts" setup>
2
2
  import {computed, onMounted, ref} from 'vue';
3
- import {extractI18nValue, getDefaultValues, Toast, ToastConfig} from "lkt-vue-kernel";
3
+ import {extractI18nValue, getDefaultValues, LktSettings, Toast, ToastConfig} from "lkt-vue-kernel";
4
4
  import {closeToast} from "../functions/functions";
5
5
 
6
6
  const props = withDefaults(defineProps<ToastConfig>(), getDefaultValues(Toast));
@@ -20,13 +20,17 @@ const classes = computed(() => {
20
20
  computedDetails = computed(() => extractI18nValue(props.details))
21
21
  ;
22
22
 
23
+ const calculatedCloseIcon = LktSettings.defaultCloseToastIcon
24
+
23
25
  const onProgressEnd = () => {
24
26
  closeToast(props.zIndex);
25
27
  },
26
28
  onProgressMouseEnter = () => {
29
+ //@ts-ignore
27
30
  progressRef.value.pause();
28
31
  },
29
32
  onProgressMouseLeave = () => {
33
+ //@ts-ignore
30
34
  progressRef.value.start();
31
35
  };
32
36
 
@@ -48,13 +52,13 @@ onMounted(() => {
48
52
  <div class="lkt-toast-header">
49
53
  <div class="lkt-toast-header-text">
50
54
  <lkt-icon v-if="icon" :icon="icon"/>
51
- <div class="lkt-toast-text" v-html="computedText"></div>
55
+ <div class="lkt-toast-text" v-html="computedText"/>
52
56
  </div>
53
57
  <div class="lkt-toast-close" @click="closeToast(zIndex)">
54
- <i class="lkt-icon-close"/>
58
+ <i :class="calculatedCloseIcon"/>
55
59
  </div>
56
60
  </div>
57
- <div class="lkt-toast-details" v-html="computedDetails"></div>
61
+ <div class="lkt-toast-details" v-html="computedDetails"/>
58
62
  <lkt-progress
59
63
  ref="progressRef"
60
64
  v-model="progressPercentage"