@marianmeres/stuic 1.39.0 → 1.41.0
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/components/AlertConfirmPrompt/AlertConfirmPrompt.svelte +61 -63
- package/dist/components/AlertConfirmPrompt/alert-confirm-prompt.d.ts +17 -14
- package/dist/components/AlertConfirmPrompt/alert-confirm-prompt.js +11 -11
- package/dist/components/Notifications/Notifications.svelte +69 -131
- package/dist/components/Notifications/notifications.d.ts +13 -24
- package/dist/components/Notifications/notifications.js +21 -17
- package/dist/index.d.ts +1 -1
- package/package.json +1 -1
|
@@ -200,79 +200,77 @@ onMount(() => {
|
|
|
200
200
|
return () => document.removeEventListener("keydown", onKeyDown, true);
|
|
201
201
|
});
|
|
202
202
|
$:
|
|
203
|
-
_dialogClass = twMerge(
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
203
|
+
_dialogClass = twMerge(
|
|
204
|
+
AlertConfirmPromptConfig.preset.dialog,
|
|
205
|
+
AlertConfirmPromptConfig.class.dialog,
|
|
206
|
+
dialog?.class?.dialog || "",
|
|
207
|
+
AlertConfirmPromptConfig.variant?.[dialog?.variant]?.dialog || ""
|
|
208
|
+
);
|
|
209
209
|
$:
|
|
210
|
-
_iconClass = twMerge(
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
210
|
+
_iconClass = twMerge(
|
|
211
|
+
AlertConfirmPromptConfig.preset.icon,
|
|
212
|
+
AlertConfirmPromptConfig.class.icon,
|
|
213
|
+
dialog?.class?.icon || "",
|
|
214
|
+
AlertConfirmPromptConfig.variant?.[dialog?.variant]?.icon || ""
|
|
215
|
+
);
|
|
216
216
|
$:
|
|
217
|
-
_contentBlockClass = twMerge(
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
217
|
+
_contentBlockClass = twMerge(
|
|
218
|
+
AlertConfirmPromptConfig.preset.contentBlock,
|
|
219
|
+
AlertConfirmPromptConfig.class.contentBlock,
|
|
220
|
+
dialog?.class?.contentBlock || "",
|
|
221
|
+
AlertConfirmPromptConfig.variant?.[dialog?.variant]?.contentBlock || ""
|
|
222
|
+
);
|
|
223
223
|
$:
|
|
224
|
-
_titleClass = twMerge(
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
224
|
+
_titleClass = twMerge(
|
|
225
|
+
AlertConfirmPromptConfig.preset.title,
|
|
226
|
+
AlertConfirmPromptConfig.class.title,
|
|
227
|
+
dialog?.class?.title || "",
|
|
228
|
+
AlertConfirmPromptConfig.variant?.[dialog?.variant]?.title || ""
|
|
229
|
+
);
|
|
230
230
|
$:
|
|
231
|
-
_contentClass = twMerge(
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
231
|
+
_contentClass = twMerge(
|
|
232
|
+
AlertConfirmPromptConfig.preset.content,
|
|
233
|
+
AlertConfirmPromptConfig.class.content,
|
|
234
|
+
dialog?.class?.content || "",
|
|
235
|
+
AlertConfirmPromptConfig.variant?.[dialog?.variant]?.content || ""
|
|
236
|
+
);
|
|
237
237
|
$:
|
|
238
|
-
_inputBoxClass = twMerge(
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
238
|
+
_inputBoxClass = twMerge(
|
|
239
|
+
AlertConfirmPromptConfig.preset.inputBox,
|
|
240
|
+
AlertConfirmPromptConfig.class.inputBox,
|
|
241
|
+
dialog?.class?.inputBox || "",
|
|
242
|
+
AlertConfirmPromptConfig.variant?.[dialog?.variant]?.inputBox || ""
|
|
243
|
+
);
|
|
244
244
|
$:
|
|
245
|
-
_inputFieldClass = twMerge(
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
245
|
+
_inputFieldClass = twMerge(
|
|
246
|
+
AlertConfirmPromptConfig.preset.inputField,
|
|
247
|
+
AlertConfirmPromptConfig.class.inputField,
|
|
248
|
+
dialog?.class?.inputField || "",
|
|
249
|
+
AlertConfirmPromptConfig.variant?.[dialog?.variant]?.inputField || ""
|
|
250
|
+
);
|
|
251
251
|
$:
|
|
252
|
-
_menuClass = twMerge(
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
252
|
+
_menuClass = twMerge(
|
|
253
|
+
AlertConfirmPromptConfig.preset.menu,
|
|
254
|
+
AlertConfirmPromptConfig.class.menu,
|
|
255
|
+
dialog?.class?.menu || "",
|
|
256
|
+
AlertConfirmPromptConfig.variant?.[dialog?.variant]?.menu || ""
|
|
257
|
+
);
|
|
258
258
|
$:
|
|
259
|
-
_menuLiClass = twMerge(
|
|
260
|
-
${AlertConfirmPromptConfig.preset.menuLi}
|
|
261
|
-
`);
|
|
259
|
+
_menuLiClass = twMerge(AlertConfirmPromptConfig.preset.menuLi);
|
|
262
260
|
$:
|
|
263
|
-
_buttonClass = twMerge(
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
261
|
+
_buttonClass = twMerge(
|
|
262
|
+
AlertConfirmPromptConfig.preset.button,
|
|
263
|
+
AlertConfirmPromptConfig.class.button,
|
|
264
|
+
dialog?.class?.button || "",
|
|
265
|
+
AlertConfirmPromptConfig.variant?.[dialog?.variant]?.button || ""
|
|
266
|
+
);
|
|
269
267
|
$:
|
|
270
|
-
_spinnerBoxClass = twMerge(
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
268
|
+
_spinnerBoxClass = twMerge(
|
|
269
|
+
AlertConfirmPromptConfig.preset.spinnerBox,
|
|
270
|
+
AlertConfirmPromptConfig.class.spinnerBox,
|
|
271
|
+
dialog?.class?.spinnerBox || "",
|
|
272
|
+
AlertConfirmPromptConfig.variant?.[dialog?.variant]?.spinnerBox || ""
|
|
273
|
+
);
|
|
276
274
|
let iconFn = false;
|
|
277
275
|
$:
|
|
278
276
|
if (dialog?.iconFn === true) {
|
|
@@ -9,6 +9,18 @@ type FnOnOK = (value: any) => any;
|
|
|
9
9
|
type FnOnCancel = (value: false) => any;
|
|
10
10
|
type FnOnEscape = () => undefined;
|
|
11
11
|
type FnOnCustom = (value: any) => any;
|
|
12
|
+
interface KnownClasses {
|
|
13
|
+
dialog: string;
|
|
14
|
+
icon: string;
|
|
15
|
+
contentBlock: string;
|
|
16
|
+
title: string;
|
|
17
|
+
content: string;
|
|
18
|
+
inputBox: string;
|
|
19
|
+
inputField: string;
|
|
20
|
+
menu: string;
|
|
21
|
+
button: string;
|
|
22
|
+
spinnerBox: string;
|
|
23
|
+
}
|
|
12
24
|
export interface AlertConfirmPromptOptions extends Record<string, any> {
|
|
13
25
|
type: AlertConfirmPromptType.ALERT | AlertConfirmPromptType.CONFIRM | AlertConfirmPromptType.PROMPT;
|
|
14
26
|
title: THC;
|
|
@@ -24,22 +36,13 @@ export interface AlertConfirmPromptOptions extends Record<string, any> {
|
|
|
24
36
|
promptFieldProps?: any;
|
|
25
37
|
variant: AlertConfirmPromptVariant;
|
|
26
38
|
iconFn: (() => string) | boolean;
|
|
27
|
-
class?: Partial<
|
|
28
|
-
dialog: string;
|
|
29
|
-
icon: string;
|
|
30
|
-
contentBlock: string;
|
|
31
|
-
title: string;
|
|
32
|
-
content: string;
|
|
33
|
-
inputBox: string;
|
|
34
|
-
inputField: string;
|
|
35
|
-
menu: string;
|
|
36
|
-
menuLi: string;
|
|
37
|
-
button: string;
|
|
38
|
-
spinnerBox: string;
|
|
39
|
-
}>;
|
|
39
|
+
class?: Partial<KnownClasses>;
|
|
40
40
|
forceAsHtml?: boolean;
|
|
41
41
|
}
|
|
42
|
-
export
|
|
42
|
+
export interface AlertConfirmPromptFactoryStoreOptions extends Partial<AlertConfirmPromptOptions> {
|
|
43
|
+
classByVariant: Partial<Record<AlertConfirmPromptVariant, Partial<KnownClasses>>>;
|
|
44
|
+
}
|
|
45
|
+
export declare const createAlertConfirmPromptStore: (defaults?: Partial<AlertConfirmPromptFactoryStoreOptions>) => {
|
|
43
46
|
subscribe: (cb: import("@marianmeres/store").Subscribe<AlertConfirmPromptOptions[]>) => import("@marianmeres/store").Unsubscribe;
|
|
44
47
|
get: () => AlertConfirmPromptOptions[];
|
|
45
48
|
push: (o: Partial<AlertConfirmPromptOptions>) => void;
|
|
@@ -1,12 +1,7 @@
|
|
|
1
|
-
import { createStore } from '@marianmeres/store';
|
|
2
1
|
import { createClog } from '@marianmeres/clog';
|
|
3
|
-
import {
|
|
2
|
+
import { createStore } from '@marianmeres/store';
|
|
3
|
+
import { twMerge } from 'tailwind-merge';
|
|
4
4
|
const clog = createClog('alert-confirm-prompt');
|
|
5
|
-
// export class AlertConfirmPromptType {
|
|
6
|
-
// static readonly ALERT: 'alert';
|
|
7
|
-
// static readonly CONFIRM: 'confirm';
|
|
8
|
-
// static readonly PROMPT: 'prompt';
|
|
9
|
-
// }
|
|
10
5
|
export var AlertConfirmPromptType;
|
|
11
6
|
(function (AlertConfirmPromptType) {
|
|
12
7
|
AlertConfirmPromptType["ALERT"] = "alert";
|
|
@@ -47,10 +42,15 @@ export const createAlertConfirmPromptStore = (defaults) => {
|
|
|
47
42
|
if (!['info', 'success', 'warn', 'error'].includes(o?.variant)) {
|
|
48
43
|
o.variant = 'info';
|
|
49
44
|
}
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
45
|
+
o.class ??= {};
|
|
46
|
+
// prettier-ignore
|
|
47
|
+
const clsKeys = [
|
|
48
|
+
'dialog', 'icon', 'contentBlock', 'title', 'content', 'inputBox',
|
|
49
|
+
'inputField', 'menu', 'button', 'spinnerBox'
|
|
50
|
+
];
|
|
51
|
+
clsKeys.forEach((k) => {
|
|
52
|
+
o.class[k] = twMerge(defaults?.class?.[k] || '', defaults?.classByVariant?.[o.variant]?.[k] || '', o?.class?.[k] || '');
|
|
53
|
+
});
|
|
54
54
|
//
|
|
55
55
|
_stack.update((old) => [...old, o]);
|
|
56
56
|
};
|
|
@@ -65,88 +65,24 @@ export class NotificationsConfig {
|
|
|
65
65
|
`
|
|
66
66
|
}
|
|
67
67
|
};
|
|
68
|
+
// prettier-ignore
|
|
68
69
|
static presetByType = {
|
|
69
|
-
info: {
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
content: ``,
|
|
74
|
-
button: ``,
|
|
75
|
-
x: ``
|
|
76
|
-
},
|
|
77
|
-
success: {
|
|
78
|
-
box: ``,
|
|
79
|
-
// e.g. bg-green-800
|
|
80
|
-
count: ``,
|
|
81
|
-
icon: ``,
|
|
82
|
-
content: ``,
|
|
83
|
-
button: ``,
|
|
84
|
-
x: ``
|
|
85
|
-
},
|
|
86
|
-
warn: {
|
|
87
|
-
box: ``,
|
|
88
|
-
// e.g. bg-yellow-800
|
|
89
|
-
count: ``,
|
|
90
|
-
icon: ``,
|
|
91
|
-
content: ``,
|
|
92
|
-
button: ``,
|
|
93
|
-
x: ``
|
|
94
|
-
},
|
|
95
|
-
error: {
|
|
96
|
-
box: `bg-red-700`,
|
|
97
|
-
// e.g. bg-red-800
|
|
98
|
-
count: ``,
|
|
99
|
-
icon: ``,
|
|
100
|
-
content: ``,
|
|
101
|
-
button: ``,
|
|
102
|
-
x: ``
|
|
103
|
-
}
|
|
70
|
+
info: { box: ``, count: ``, icon: ``, content: ``, button: ``, x: `` },
|
|
71
|
+
success: { box: ``, count: ``, icon: ``, content: ``, button: ``, x: `` },
|
|
72
|
+
warn: { box: ``, count: ``, icon: ``, content: ``, button: ``, x: `` },
|
|
73
|
+
error: { box: `bg-red-700`, count: ``, icon: ``, content: ``, button: ``, x: `` }
|
|
104
74
|
};
|
|
105
75
|
static class = {
|
|
106
76
|
wrap: "",
|
|
107
77
|
wrapInner: "",
|
|
108
|
-
notification: {
|
|
109
|
-
box: ``,
|
|
110
|
-
count: ``,
|
|
111
|
-
icon: ``,
|
|
112
|
-
content: ``,
|
|
113
|
-
button: ``,
|
|
114
|
-
x: ``
|
|
115
|
-
}
|
|
78
|
+
notification: { box: ``, count: ``, icon: ``, content: ``, button: ``, x: `` }
|
|
116
79
|
};
|
|
80
|
+
// prettier-ignore
|
|
117
81
|
static classByType = {
|
|
118
|
-
info: {
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
content: ``,
|
|
123
|
-
button: ``,
|
|
124
|
-
x: ``
|
|
125
|
-
},
|
|
126
|
-
success: {
|
|
127
|
-
box: ``,
|
|
128
|
-
count: ``,
|
|
129
|
-
icon: ``,
|
|
130
|
-
content: ``,
|
|
131
|
-
button: ``,
|
|
132
|
-
x: ``
|
|
133
|
-
},
|
|
134
|
-
warn: {
|
|
135
|
-
box: ``,
|
|
136
|
-
count: ``,
|
|
137
|
-
icon: ``,
|
|
138
|
-
content: ``,
|
|
139
|
-
button: ``,
|
|
140
|
-
x: ``
|
|
141
|
-
},
|
|
142
|
-
error: {
|
|
143
|
-
box: ``,
|
|
144
|
-
count: ``,
|
|
145
|
-
icon: ``,
|
|
146
|
-
content: ``,
|
|
147
|
-
button: ``,
|
|
148
|
-
x: ``
|
|
149
|
-
}
|
|
82
|
+
info: { box: ``, count: ``, icon: ``, content: ``, button: ``, x: `` },
|
|
83
|
+
success: { box: ``, count: ``, icon: ``, content: ``, button: ``, x: `` },
|
|
84
|
+
warn: { box: ``, count: ``, icon: ``, content: ``, button: ``, x: `` },
|
|
85
|
+
error: { box: ``, count: ``, icon: ``, content: ``, button: ``, x: `` }
|
|
150
86
|
};
|
|
151
87
|
static iconFn = {
|
|
152
88
|
info: void 0,
|
|
@@ -178,63 +114,65 @@ $:
|
|
|
178
114
|
$:
|
|
179
115
|
yMobile = Y_POSITIONS.includes(posYMobile) ? posYMobile : DEFAULT.posYMobile;
|
|
180
116
|
$:
|
|
181
|
-
_wrapClass = twMerge(
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
pointer-events-none bg-transparent
|
|
186
|
-
|
|
187
|
-
|
|
117
|
+
_wrapClass = twMerge(
|
|
118
|
+
NotificationsConfig.preset.wrap,
|
|
119
|
+
NotificationsConfig.class.wrap,
|
|
120
|
+
`flex flex-row inset-0
|
|
121
|
+
pointer-events-none bg-transparent`,
|
|
122
|
+
YMAP_M[yMobile],
|
|
123
|
+
YMAP[y]
|
|
124
|
+
);
|
|
188
125
|
$:
|
|
189
|
-
_wrapInnerClass = twMerge(
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
pointer-events-none bg-transparent
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
126
|
+
_wrapInnerClass = twMerge(
|
|
127
|
+
NotificationsConfig.preset.wrapInner,
|
|
128
|
+
NotificationsConfig.class.wrapInner,
|
|
129
|
+
`flex flex-col w-full
|
|
130
|
+
pointer-events-none bg-transparent`,
|
|
131
|
+
XMAP_M[xMobile],
|
|
132
|
+
XMAP[x]
|
|
133
|
+
);
|
|
134
|
+
const _boxClass = (n) => twMerge(
|
|
135
|
+
NotificationsConfig?.preset?.notification?.box || "",
|
|
136
|
+
NotificationsConfig?.class?.notification?.box || "",
|
|
137
|
+
NotificationsConfig?.presetByType?.[n.type]?.box || "",
|
|
138
|
+
NotificationsConfig?.classByType?.[n.type]?.box || "",
|
|
139
|
+
n.class?.box || ""
|
|
140
|
+
);
|
|
141
|
+
const _countClass = (n) => twMerge(
|
|
142
|
+
NotificationsConfig?.preset?.notification?.count || "",
|
|
143
|
+
NotificationsConfig?.class?.notification?.count || "",
|
|
144
|
+
NotificationsConfig?.presetByType?.[n.type]?.count || "",
|
|
145
|
+
NotificationsConfig?.classByType?.[n.type]?.count || "",
|
|
146
|
+
n.class?.count || ""
|
|
147
|
+
);
|
|
148
|
+
const _iconClass = (n) => twMerge(
|
|
149
|
+
NotificationsConfig?.preset?.notification?.icon || "",
|
|
150
|
+
NotificationsConfig?.class?.notification?.icon || "",
|
|
151
|
+
NotificationsConfig?.presetByType?.[n.type]?.icon || "",
|
|
152
|
+
NotificationsConfig?.classByType?.[n.type]?.icon || "",
|
|
153
|
+
n.class?.icon || ""
|
|
154
|
+
);
|
|
155
|
+
const _contentClass = (n) => twMerge(
|
|
156
|
+
NotificationsConfig?.preset?.notification?.content || "",
|
|
157
|
+
NotificationsConfig?.class?.notification?.content || "",
|
|
158
|
+
NotificationsConfig?.presetByType?.[n.type]?.content || "",
|
|
159
|
+
NotificationsConfig?.classByType?.[n.type]?.content || "",
|
|
160
|
+
n.class?.content || ""
|
|
161
|
+
);
|
|
162
|
+
const _buttonClass = (n) => twMerge(
|
|
163
|
+
NotificationsConfig?.preset?.notification?.button || "",
|
|
164
|
+
NotificationsConfig?.class?.notification?.button || "",
|
|
165
|
+
NotificationsConfig?.presetByType?.[n.type]?.button || "",
|
|
166
|
+
NotificationsConfig?.classByType?.[n.type]?.button || "",
|
|
167
|
+
n.class?.button || ""
|
|
168
|
+
);
|
|
169
|
+
const _xClass = (n) => twMerge(
|
|
170
|
+
NotificationsConfig?.preset?.notification?.x || "",
|
|
171
|
+
NotificationsConfig?.class?.notification?.x || "",
|
|
172
|
+
NotificationsConfig?.presetByType?.[n.type]?.x || "",
|
|
173
|
+
NotificationsConfig?.classByType?.[n.type]?.x || "",
|
|
174
|
+
n.class?.x || ""
|
|
175
|
+
);
|
|
238
176
|
const _iconFn = (n) => {
|
|
239
177
|
let iconFn = false;
|
|
240
178
|
if (n?.iconFn === true) {
|
|
@@ -6,6 +6,14 @@ interface ComponentWrap {
|
|
|
6
6
|
component: Function;
|
|
7
7
|
props?: any;
|
|
8
8
|
}
|
|
9
|
+
interface KnownClasses {
|
|
10
|
+
box: string;
|
|
11
|
+
count: string;
|
|
12
|
+
icon: string;
|
|
13
|
+
content: string;
|
|
14
|
+
button: string;
|
|
15
|
+
x: string;
|
|
16
|
+
}
|
|
9
17
|
export interface NotificationInput extends Record<string, any> {
|
|
10
18
|
id: any;
|
|
11
19
|
type: NotificationType;
|
|
@@ -16,14 +24,7 @@ export interface NotificationInput extends Record<string, any> {
|
|
|
16
24
|
count: number;
|
|
17
25
|
component?: Function | ComponentWrap;
|
|
18
26
|
iconFn: (() => string) | boolean;
|
|
19
|
-
class?: Partial<
|
|
20
|
-
box: string;
|
|
21
|
-
count: string;
|
|
22
|
-
icon: string;
|
|
23
|
-
content: string;
|
|
24
|
-
button: string;
|
|
25
|
-
x: string;
|
|
26
|
-
}>;
|
|
27
|
+
class?: Partial<KnownClasses>;
|
|
27
28
|
forceAsHtml: boolean | undefined;
|
|
28
29
|
}
|
|
29
30
|
export interface Notification extends NotificationInput {
|
|
@@ -37,14 +38,8 @@ export interface NotiticationsCreateStoreOptions {
|
|
|
37
38
|
sortOrder?: NotificationsSortOrder;
|
|
38
39
|
defaultIcons?: Record<NotificationType, () => string> | boolean;
|
|
39
40
|
forceAsHtml?: boolean | undefined;
|
|
40
|
-
class?: Partial<
|
|
41
|
-
|
|
42
|
-
count: string;
|
|
43
|
-
icon: string;
|
|
44
|
-
content: string;
|
|
45
|
-
button: string;
|
|
46
|
-
x: string;
|
|
47
|
-
}>;
|
|
41
|
+
class?: Partial<KnownClasses>;
|
|
42
|
+
classByType?: Partial<Record<NotificationType, Partial<KnownClasses>>>;
|
|
48
43
|
logger: (...v: any) => void;
|
|
49
44
|
}
|
|
50
45
|
export declare const NOTIFICATION_EVENT: {
|
|
@@ -69,14 +64,8 @@ export declare const createNotificationsStore: (initial?: NotificationCreatePara
|
|
|
69
64
|
sortOrder?: NotificationsSortOrder | undefined;
|
|
70
65
|
defaultIcons?: boolean | Record<string, () => string> | undefined;
|
|
71
66
|
forceAsHtml?: boolean | undefined;
|
|
72
|
-
class?: Partial<
|
|
73
|
-
|
|
74
|
-
count: string;
|
|
75
|
-
icon: string;
|
|
76
|
-
content: string;
|
|
77
|
-
button: string;
|
|
78
|
-
x: string;
|
|
79
|
-
}> | undefined;
|
|
67
|
+
class?: Partial<KnownClasses> | undefined;
|
|
68
|
+
classByType?: Partial<Record<string, Partial<KnownClasses>>> | undefined;
|
|
80
69
|
logger?: ((...v: any) => void) | undefined;
|
|
81
70
|
};
|
|
82
71
|
EVENT: {
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { createClog } from '@marianmeres/clog';
|
|
2
2
|
import { createStore } from '@marianmeres/store';
|
|
3
3
|
import { createTicker } from '@marianmeres/ticker';
|
|
4
|
+
import { twMerge } from 'tailwind-merge';
|
|
4
5
|
const isFn = (v) => typeof v === 'function';
|
|
5
6
|
const DEFAULT_OPTIONS = {
|
|
6
7
|
maxCapacity: 5,
|
|
@@ -57,34 +58,37 @@ export const createNotificationsStore = (initial = [], opts = {}) => {
|
|
|
57
58
|
// sanitize options
|
|
58
59
|
['maxCapacity', 'defaultTtl'].forEach((k) => _setOption(k, opts[k]));
|
|
59
60
|
const _factory = (notification) => {
|
|
60
|
-
let
|
|
61
|
+
let o = typeof notification === 'string' ? { id: 0, content: notification } : notification;
|
|
61
62
|
// ignore invalid (empty) notifs
|
|
62
|
-
if (!
|
|
63
|
+
if (!o.content) {
|
|
63
64
|
_log(`WARN: ignoring empty notification`);
|
|
64
65
|
return null;
|
|
65
66
|
}
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
67
|
+
o.type ||= opts.defaultType; //
|
|
68
|
+
o.id ||= _id(o.type, [o.content].join());
|
|
69
|
+
o.created = new Date(o.created || Date.now());
|
|
70
|
+
o.count ??= 1;
|
|
71
|
+
o.forceAsHtml ??= opts.forceAsHtml;
|
|
72
|
+
// classes merge dance
|
|
73
|
+
o.class ??= {};
|
|
74
|
+
// prettier-ignore
|
|
75
|
+
const clsKeys = ['box', 'count', 'icon', 'content', 'button', 'x'];
|
|
76
|
+
clsKeys.forEach((k) => {
|
|
77
|
+
o.class[k] = twMerge(opts?.class?.[k] || '', opts?.classByType?.[o.type]?.[k] || '', o?.class?.[k] || '');
|
|
78
|
+
});
|
|
75
79
|
//
|
|
76
|
-
if (
|
|
77
|
-
|
|
80
|
+
if (o.ttl === undefined)
|
|
81
|
+
o.ttl = opts.defaultTtl;
|
|
78
82
|
//
|
|
79
|
-
if (
|
|
83
|
+
if (o.iconFn === undefined) {
|
|
80
84
|
if (typeof opts.defaultIcons === 'boolean') {
|
|
81
|
-
|
|
85
|
+
o.iconFn = opts.defaultIcons;
|
|
82
86
|
}
|
|
83
87
|
else {
|
|
84
|
-
|
|
88
|
+
o.iconFn = opts.defaultIcons?.[o.type];
|
|
85
89
|
}
|
|
86
90
|
}
|
|
87
|
-
return
|
|
91
|
+
return o;
|
|
88
92
|
};
|
|
89
93
|
const _findIndexById = (notifs, id) => notifs.findIndex((n) => n.id === id);
|
|
90
94
|
const _removeByIdx = (notifs, idx) => {
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export { default as AlertConfirmPrompt, AlertConfirmPromptConfig, } from './components/AlertConfirmPrompt/AlertConfirmPrompt.svelte';
|
|
2
|
-
export { createAlertConfirmPromptStore, createAlert, createConfirm, createPrompt, AlertConfirmPromptType, type AlertConfirmPromptVariant, type AlertConfirmPromptOptions, } from './components/AlertConfirmPrompt/alert-confirm-prompt.js';
|
|
2
|
+
export { createAlertConfirmPromptStore, createAlert, createConfirm, createPrompt, AlertConfirmPromptType, type AlertConfirmPromptVariant, type AlertConfirmPromptOptions, type AlertConfirmPromptFactoryStoreOptions, } from './components/AlertConfirmPrompt/alert-confirm-prompt.js';
|
|
3
3
|
export { default as AppShell, appShellSetHtmlBodyHeight, } from './components/AppShell/AppShell.svelte';
|
|
4
4
|
export { default as Backdrop, BackdropConfig, } from './components/Backdrop/Backdrop.svelte';
|
|
5
5
|
export { default as Button, ButtonConfig } from './components/Button/Button.svelte';
|