adminforth 2.4.0-next.145 → 2.4.0-next.147

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.
@@ -97,13 +97,24 @@ class FrontendAPI implements FrontendAPIInterface {
97
97
  })
98
98
  }
99
99
 
100
- alert(params: AlertParams): void {
101
- this.toastStore.addToast({
100
+ alert(params: AlertParams): void | Promise<string> | string {
101
+ const toats = {
102
102
  message: params.message,
103
103
  messageHtml: params.messageHtml,
104
104
  variant: params.variant,
105
- timeout: params.timeout
106
- })
105
+ timeout: params.timeout,
106
+ buttons: params.buttons,
107
+ }
108
+ if (params.buttons && params.buttons.length > 0) {
109
+ return new Promise<string>((resolve) => {
110
+ this.toastStore.addToast({
111
+ ...toats,
112
+ onResolve: (value?: any) => resolve(String(value ?? '')),
113
+ })
114
+ })
115
+ } else {
116
+ this.toastStore.addToast({...toats})
117
+ }
107
118
  }
108
119
 
109
120
  listFilterValidation(filter: FilterParams): boolean {
@@ -30,7 +30,18 @@
30
30
  </div>
31
31
 
32
32
  <div class="ms-3 text-sm font-normal max-w-xs pr-2" v-if="toast.messageHtml" v-html="toast.messageHtml"></div>
33
- <div class="ms-3 text-sm font-normal max-w-xs pr-2" v-else>{{toast.message}}</div>
33
+ <div class="ms-3 text-sm font-normal max-w-xs pr-2" v-else>
34
+ <div class="flex flex-col items-center justify-center">
35
+ {{toast.message}}
36
+ <div class="flex justify-center mt-2 gap-2">
37
+ <div v-for="button in toast.buttons" class="rounded-md bg-lightButtonsBackground hover:bg-lightButtonsHover text-lightButtonsText dark:bg-darkPrimary dark:hover:bg-darkButtonsBackground dark:text-darkButtonsText">
38
+ <button @click="onButtonClick(button.value)" class="px-2 py-1 rounded hover:bg-black/5 dark:hover:bg-white/10">
39
+ {{ button.label }}
40
+ </button>
41
+ </div>
42
+ </div>
43
+ </div>
44
+ </div>
34
45
  <button @click="closeToast" type="button" class="ms-auto -mx-1.5 -my-1.5 bg-lightToastCloseIconBackground text-lightToastCloseIcon hover:text-lightToastCloseIconHover rounded-lg focus:ring-2 focus:ring-lightToastCloseIconFocusRing p-1.5 hover:bg-lightToastCloseIconBackgroundHover inline-flex items-center justify-center h-8 w-8 dark:text-darkToastCloseIcon dark:hover:text-darkToastCloseIconHover dark:bg-darkToastCloseIconBackground dark:hover:bg-darkToastCloseIconBackgroundHover dark:focus:ring-darkToastCloseIconFocusRing" >
35
46
  <svg class="w-3 h-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 14 14">
36
47
  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6"/>
@@ -53,16 +64,28 @@ const props = defineProps<{
53
64
  variant: string;
54
65
  id: string;
55
66
  timeout?: number|'unlimited';
67
+ buttons?: { value: any; label: string }[];
56
68
  }
57
69
  }>();
58
70
  function closeToast() {
71
+ // resolve with undefined on close (X button)
72
+ toastStore.resolveToast(props.toast.id);
73
+ emit('close');
74
+ }
75
+
76
+ function onButtonClick(value: any) {
77
+ toastStore.resolveToast(props.toast.id, value);
59
78
  emit('close');
60
79
  }
61
80
 
62
81
  onMounted(() => {
63
82
  if (props.toast.timeout === 'unlimited') return;
64
83
  else {
65
- setTimeout(() => {emit('close');}, (props.toast.timeout || 10) * 1e3 );
84
+ setTimeout(() => {
85
+ // resolve with undefined on auto-timeout
86
+ toastStore.resolveToast(props.toast.id);
87
+ emit('close');
88
+ }, (props.toast.timeout || 10) * 1e3 );
66
89
  }
67
90
  });
68
91
 
@@ -12,19 +12,38 @@ export const useToastStore = defineStore('toast', () => {
12
12
  watch(route, () => {
13
13
  // on route change clear all toasts older then 5 seconds
14
14
  const now = +new Date();
15
- toasts.value = toasts.value.filter((t) => now - t.createdAt < 5000);
15
+ toasts.value = toasts.value.filter((t) => t?.timeout === 'unlimited' || now - t.createdAt < 5000);
16
16
  });
17
17
 
18
- const addToast = (toast: { message: string; variant: string }) => {
18
+ const addToast = (toast: {
19
+ message?: string;
20
+ messageHtml?: string;
21
+ variant: string;
22
+ timeout?: number | 'unlimited';
23
+ buttons?: { value: any; label: string }[];
24
+ onResolve?: (value?: any) => void;
25
+ }): string => {
19
26
  const toastId = uuid();
20
27
  toasts.value.push({
21
28
  ...toast,
22
29
  id: toastId,
23
30
  createdAt: +new Date(),
24
31
  });
32
+ return toastId;
25
33
  };
26
34
  const removeToast = (toast: { id: string }) => {
27
35
  toasts.value = toasts.value.filter((t) => t.id !== toast.id);
28
36
  };
29
- return { toasts, addToast, removeToast };
37
+
38
+ const resolveToast = (toastId: string, value?: any) => {
39
+ const t = toasts.value.find((x) => x.id === toastId);
40
+ try {
41
+ t?.onResolve?.(value);
42
+ } catch {
43
+ // no-op
44
+ }
45
+ toasts.value = toasts.value.filter((x) => x.id !== toastId);
46
+ };
47
+
48
+ return { toasts, addToast, removeToast, resolveToast };
30
49
  });
@@ -55,7 +55,7 @@ export interface FrontendAPIInterface {
55
55
  *
56
56
  * @param params - The parameters of the alert
57
57
  */
58
- alert(params:AlertParams): void;
58
+ alert(params:AlertParams): void | Promise<string> | string;
59
59
 
60
60
 
61
61
  list: {
@@ -179,7 +179,12 @@ export type AlertParams = {
179
179
  * Default is 10 seconds;
180
180
  */
181
181
  timeout?: number | 'unlimited';
182
-
182
+
183
+ /**
184
+ * Optional buttons to display in the alert
185
+ */
186
+ buttons?: {value: any, label: string}[];
187
+
183
188
  }
184
189
 
185
190
 
@@ -49,7 +49,7 @@ export interface FrontendAPIInterface {
49
49
  *
50
50
  * @param params - The parameters of the alert
51
51
  */
52
- alert(params: AlertParams): void;
52
+ alert(params: AlertParams): void | Promise<string> | string;
53
53
  list: {
54
54
  /**
55
55
  * Full refresh the list. Loader will be shown during fetching data. Will fully reload table data from the server. If new data available, it will be shown in the list.
@@ -160,6 +160,13 @@ export type AlertParams = {
160
160
  * Default is 10 seconds;
161
161
  */
162
162
  timeout?: number | 'unlimited';
163
+ /**
164
+ * Optional buttons to display in the alert
165
+ */
166
+ buttons?: {
167
+ value: any;
168
+ label: string;
169
+ }[];
163
170
  };
164
171
  export declare enum AlertVariant {
165
172
  danger = "danger",
@@ -1 +1 @@
1
- {"version":3,"file":"FrontendAPI.d.ts","sourceRoot":"","sources":["../../types/FrontendAPI.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAI7D,MAAM,MAAM,YAAY,GAAG;IACvB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,EAAE,yBAAyB,CAAC;IACpC;;OAEG;IACH,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAE;CACrC,CAAA;AAED,MAAM,WAAW,oBAAoB;IAEjC;;;;;;;;;;;;;;;;;;OAkBG;IACH,OAAO,CAAC,MAAM,EAAE,aAAa,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;IAEjD;;;;;;;;;;;;;;OAcG;IACH,KAAK,CAAC,MAAM,EAAC,WAAW,GAAG,IAAI,CAAC;IAGhC,IAAI,EAAE;QAEF;;WAEG;QACH,OAAO,IAAI,OAAO,CAAC;YAAE,KAAK,CAAC,EAAG,MAAM,CAAA;SAAE,CAAC,CAAC;QAExC;;;;WAIG;QACH,aAAa,IAAI,OAAO,CAAC;YAAE,KAAK,CAAC,EAAG,MAAM,CAAA;SAAE,CAAC,CAAC;QAE9C;;WAEG;QACH,gBAAgB,CAAE,EAAE,EAAE,GAAG,GAAG,OAAO,CAAC;YAAE,KAAK,CAAC,EAAG,MAAM,CAAA;SAAE,CAAC,CAAC;QAEzD;;WAEG;QACH,sBAAsB,IAAI,IAAI,CAAC;QAG/B;;;;;;;;;;;;;;WAcG;QACH,SAAS,CAAC,MAAM,EAAE,YAAY,GAAG,IAAI,CAAC;QAEtC;;;;;;;;;;;;WAYG;QACH,YAAY,CAAC,MAAM,EAAE,YAAY,GAAG,IAAI,CAAC;QAEzC;;WAEG;QACH,YAAY,IAAI,IAAI,CAAC;KACxB,CAAA;IAED,IAAI,EAAE;QACF;;;WAGG;QACH,OAAO,IAAI,IAAI,CAAC;KACnB,CAAA;IAED,IAAI,EAAE;QACF;;WAEG;QACH,iBAAiB,IAAI,IAAI,CAAC;KAC7B,CAAA;IAED;;OAEG;IACH,qBAAqB,IAAI,IAAI,CAAC;CACjC;AAED,MAAM,MAAM,aAAa,GAAG;IACxB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;CAEf,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACtB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,GAAG,MAAM,OAAO,YAAY,CAAC;IAEnD;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC;CAElC,CAAA;AAID,oBAAY,YAAY;IACpB,MAAM,WAAW;IACjB,OAAO,YAAY;IACnB,OAAO,YAAY;IACnB,IAAI,SAAS;CACd"}
1
+ {"version":3,"file":"FrontendAPI.d.ts","sourceRoot":"","sources":["../../types/FrontendAPI.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,aAAa,CAAC;AAI7D,MAAM,MAAM,YAAY,GAAG;IACvB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,EAAE,yBAAyB,CAAC;IACpC;;OAEG;IACH,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAE;CACrC,CAAA;AAED,MAAM,WAAW,oBAAoB;IAEjC;;;;;;;;;;;;;;;;;;OAkBG;IACH,OAAO,CAAC,MAAM,EAAE,aAAa,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;IAEjD;;;;;;;;;;;;;;OAcG;IACH,KAAK,CAAC,MAAM,EAAC,WAAW,GAAG,IAAI,GAAG,OAAO,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC;IAG3D,IAAI,EAAE;QAEF;;WAEG;QACH,OAAO,IAAI,OAAO,CAAC;YAAE,KAAK,CAAC,EAAG,MAAM,CAAA;SAAE,CAAC,CAAC;QAExC;;;;WAIG;QACH,aAAa,IAAI,OAAO,CAAC;YAAE,KAAK,CAAC,EAAG,MAAM,CAAA;SAAE,CAAC,CAAC;QAE9C;;WAEG;QACH,gBAAgB,CAAE,EAAE,EAAE,GAAG,GAAG,OAAO,CAAC;YAAE,KAAK,CAAC,EAAG,MAAM,CAAA;SAAE,CAAC,CAAC;QAEzD;;WAEG;QACH,sBAAsB,IAAI,IAAI,CAAC;QAG/B;;;;;;;;;;;;;;WAcG;QACH,SAAS,CAAC,MAAM,EAAE,YAAY,GAAG,IAAI,CAAC;QAEtC;;;;;;;;;;;;WAYG;QACH,YAAY,CAAC,MAAM,EAAE,YAAY,GAAG,IAAI,CAAC;QAEzC;;WAEG;QACH,YAAY,IAAI,IAAI,CAAC;KACxB,CAAA;IAED,IAAI,EAAE;QACF;;;WAGG;QACH,OAAO,IAAI,IAAI,CAAC;KACnB,CAAA;IAED,IAAI,EAAE;QACF;;WAEG;QACH,iBAAiB,IAAI,IAAI,CAAC;KAC7B,CAAA;IAED;;OAEG;IACH,qBAAqB,IAAI,IAAI,CAAC;CACjC;AAED,MAAM,MAAM,aAAa,GAAG;IACxB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;CAEf,CAAA;AAED,MAAM,MAAM,WAAW,GAAG;IACtB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,OAAO,CAAC,EAAE,YAAY,GAAG,MAAM,OAAO,YAAY,CAAC;IAEnD;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC;IAE/B;;OAEG;IACH,OAAO,CAAC,EAAE;QAAC,KAAK,EAAE,GAAG,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,EAAE,CAAC;CAE3C,CAAA;AAID,oBAAY,YAAY;IACpB,MAAM,WAAW;IACjB,OAAO,YAAY;IACnB,OAAO,YAAY;IACnB,IAAI,SAAS;CACd"}
@@ -1 +1 @@
1
- {"version":3,"file":"FrontendAPI.js","sourceRoot":"","sources":["../../types/FrontendAPI.ts"],"names":[],"mappings":"AA0LA,MAAM,CAAN,IAAY,YAKT;AALH,WAAY,YAAY;IACpB,iCAAiB,CAAA;IACjB,mCAAmB,CAAA;IACnB,mCAAmB,CAAA;IACnB,6BAAa,CAAA;AACf,CAAC,EALS,YAAY,KAAZ,YAAY,QAKrB"}
1
+ {"version":3,"file":"FrontendAPI.js","sourceRoot":"","sources":["../../types/FrontendAPI.ts"],"names":[],"mappings":"AA+LA,MAAM,CAAN,IAAY,YAKT;AALH,WAAY,YAAY;IACpB,iCAAiB,CAAA;IACjB,mCAAmB,CAAA;IACnB,mCAAmB,CAAA;IACnB,6BAAa,CAAA;AACf,CAAC,EALS,YAAY,KAAZ,YAAY,QAKrB"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "adminforth",
3
- "version": "2.4.0-next.145",
3
+ "version": "2.4.0-next.147",
4
4
  "description": "OpenSource Vue3 powered forth-generation admin panel",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",