tiny-essentials 1.10.2 → 1.11.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.
Files changed (56) hide show
  1. package/README.md +1 -1
  2. package/dist/{TinyEssentials.js → v1/TinyEssentials.js} +804 -0
  3. package/dist/v1/TinyEssentials.min.js +2 -0
  4. package/dist/v1/TinyNotifyCenter.js +461 -0
  5. package/dist/v1/TinyNotifyCenter.min.js +1 -0
  6. package/dist/v1/TinyToastNotify.js +417 -0
  7. package/dist/v1/TinyToastNotify.min.js +1 -0
  8. package/dist/v1/build/TinyNotifyCenter.cjs +7 -0
  9. package/dist/v1/build/TinyNotifyCenter.d.mts +3 -0
  10. package/dist/v1/build/TinyNotifyCenter.mjs +2 -0
  11. package/dist/v1/build/TinyToastNotify.cjs +7 -0
  12. package/dist/v1/build/TinyToastNotify.d.mts +3 -0
  13. package/dist/v1/build/TinyToastNotify.mjs +2 -0
  14. package/dist/v1/css/TinyNotify.css +350 -0
  15. package/dist/v1/css/TinyNotify.min.css +1 -0
  16. package/dist/v1/index.cjs +4 -0
  17. package/dist/v1/index.d.mts +3 -1
  18. package/dist/v1/index.mjs +3 -1
  19. package/dist/v1/libs/TinyNotifyCenter.cjs +422 -0
  20. package/dist/v1/libs/TinyNotifyCenter.d.mts +166 -0
  21. package/dist/v1/libs/TinyNotifyCenter.mjs +385 -0
  22. package/dist/v1/libs/TinyToastNotify.cjs +378 -0
  23. package/dist/v1/libs/TinyToastNotify.d.mts +157 -0
  24. package/dist/v1/libs/TinyToastNotify.mjs +332 -0
  25. package/docs/{README.md → v1/README.md} +2 -0
  26. package/docs/{basics → v1/basics}/text.md +2 -2
  27. package/docs/v1/libs/TinyNotifyCenter.md +291 -0
  28. package/docs/v1/libs/TinyToastNotify.md +290 -0
  29. package/package.json +4 -2
  30. package/dist/TinyEssentials.min.js +0 -2
  31. package/dist/v1/libs/TinyRateLimit.cjs +0 -196
  32. package/dist/v1/libs/TinyRateLimit.d.mts +0 -86
  33. package/dist/v1/libs/TinyRateLimit.mjs +0 -171
  34. /package/dist/{ColorSafeStringify.js → v1/ColorSafeStringify.js} +0 -0
  35. /package/dist/{ColorSafeStringify.min.js → v1/ColorSafeStringify.min.js} +0 -0
  36. /package/dist/{TinyBasicsEs.js → v1/TinyBasicsEs.js} +0 -0
  37. /package/dist/{TinyBasicsEs.min.js → v1/TinyBasicsEs.min.js} +0 -0
  38. /package/dist/{TinyBasicsEs.min.js.LICENSE.txt → v1/TinyBasicsEs.min.js.LICENSE.txt} +0 -0
  39. /package/dist/{TinyEssentials.min.js.LICENSE.txt → v1/TinyEssentials.min.js.LICENSE.txt} +0 -0
  40. /package/dist/{TinyLevelUp.js → v1/TinyLevelUp.js} +0 -0
  41. /package/dist/{TinyLevelUp.min.js → v1/TinyLevelUp.min.js} +0 -0
  42. /package/dist/{TinyPromiseQueue.js → v1/TinyPromiseQueue.js} +0 -0
  43. /package/dist/{TinyPromiseQueue.min.js → v1/TinyPromiseQueue.min.js} +0 -0
  44. /package/dist/{TinyRateLimiter.js → v1/TinyRateLimiter.js} +0 -0
  45. /package/dist/{TinyRateLimiter.min.js → v1/TinyRateLimiter.min.js} +0 -0
  46. /package/dist/{aiMarker.css → v1/css/aiMarker.css} +0 -0
  47. /package/dist/{aiMarker.min.css → v1/css/aiMarker.min.css} +0 -0
  48. /package/docs/{basics → v1/basics}/array.md +0 -0
  49. /package/docs/{basics → v1/basics}/asyncReplace.md +0 -0
  50. /package/docs/{basics → v1/basics}/clock.md +0 -0
  51. /package/docs/{basics → v1/basics}/objFilter.md +0 -0
  52. /package/docs/{basics → v1/basics}/simpleMath.md +0 -0
  53. /package/docs/{libs → v1/libs}/ColorSafeStringify.md +0 -0
  54. /package/docs/{libs → v1/libs}/TinyLevelUp.md +0 -0
  55. /package/docs/{libs → v1/libs}/TinyPromiseQueue.md +0 -0
  56. /package/docs/{libs → v1/libs}/TinyRateLimiter.md +0 -0
@@ -0,0 +1,350 @@
1
+ :root {
2
+ --notify-width: clamp(280px, 90vw, 400px);
3
+ --notify-spacing: 1rem;
4
+ --notify-z-index: 1000;
5
+ --notify-transition: opacity 0.3s ease, transform 0.3s ease;
6
+ --notify-padding: 1rem;
7
+ --notify-border-radius: 0.75rem;
8
+ --notify-font-size: 1rem;
9
+ --notify-font-family: sans-serif;
10
+ --notify-color-bg: #ffffff;
11
+ --notify-color-text: #333333;
12
+ --notify-color-shadow: rgba(0, 0, 0, 0.1);
13
+ --notify-close-size: 1.25rem;
14
+ --notify-close-color: #444;
15
+ --notify-close-color-hover: #000;
16
+ --notif-center-remove-transition: opacity 0.3s ease, transform 0.3s ease;
17
+ --notif-center-bg-transition: background 0.2s ease;
18
+ --notif-center-transform: transform 0.3s ease;
19
+ --notif-center-width: clamp(300px, 90vw, 400px);
20
+ --notif-center-height: 100vh;
21
+ --notif-center-bg: rgba(255, 255, 255, 0.85);
22
+ --notif-center-blur: 12px;
23
+ --notif-center-shadow: rgba(0, 0, 0, 0.2);
24
+ --notif-center-x-padding: 1rem;
25
+ --notif-center-y-padding: 1rem;
26
+ --notif-center-z-index: 1050;
27
+ --notif-border: #000;
28
+ --notif-unread-border: #bd0b0b;
29
+ --notif-border-unread: ;
30
+ --notif-item-close: #666;
31
+ --notif-item-close-hover: #000;
32
+ --notif-item-bg: #ffffff;
33
+ --notif-item-unread-bg: #ffffff;
34
+ --notif-item-text: #222;
35
+ --notif-item-radius: 0.75rem;
36
+ --notif-item-padding: 1rem;
37
+ --notif-item-shadow: rgba(0, 0, 0, 0.1);
38
+ --notif-close-size: 1.5rem;
39
+ --notif-close-color: #444;
40
+ --notif-close-color-hover: #000;
41
+ --notif-bell-size: 3rem;
42
+ --notif-bell-bg: #ffffff;
43
+ --notif-bell-color: #333;
44
+ --notif-bell-shadow: rgba(0, 0, 0, 0.2);
45
+ --notif-bell-z-index: 1040;
46
+ --notif-bell-radius: 50%;
47
+ --notif-bell-hover-bg: #f0f0f0;
48
+ --notif-badge-bg: #d32f2f;
49
+ --notif-badge-color: #ffffff;
50
+ --notif-badge-size: 1.25rem;
51
+ --notif-badge-font-size: 0.75rem;
52
+ --notif-badge-border: none;
53
+ }
54
+
55
+ /* Notification container */
56
+ .notify-container {
57
+ position: fixed;
58
+ display: flex;
59
+ gap: var(--notify-spacing);
60
+ width: var(--notify-width);
61
+ z-index: var(--notify-z-index);
62
+ pointer-events: none;
63
+ }
64
+ .notify-container.left {
65
+ left: var(--notify-spacing);
66
+ align-items: flex-start;
67
+ }
68
+ .notify-container.right {
69
+ right: var(--notify-spacing);
70
+ align-items: flex-end;
71
+ }
72
+ .notify-container.center {
73
+ left: 50%;
74
+ transform: translateX(-50%);
75
+ align-items: center;
76
+ }
77
+ .notify-container.top {
78
+ flex-direction: column;
79
+ top: var(--notify-spacing);
80
+ }
81
+ .notify-container.top .notify.enter {
82
+ transform: translateY(-10px);
83
+ }
84
+ .notify-container.top .notify.exit {
85
+ transform: translateY(-10px);
86
+ }
87
+ .notify-container.bottom {
88
+ flex-direction: column-reverse;
89
+ bottom: var(--notify-spacing);
90
+ }
91
+ .notify-container.bottom .notify.enter {
92
+ transform: translateY(10px);
93
+ }
94
+ .notify-container.bottom .notify.exit {
95
+ transform: translateY(10px);
96
+ }
97
+ .notify-container .notify {
98
+ position: relative;
99
+ background-color: var(--notify-color-bg);
100
+ color: var(--notify-color-text);
101
+ box-shadow: 0 4px 8px var(--notify-color-shadow);
102
+ border-radius: var(--notify-border-radius);
103
+ padding: var(--notify-padding);
104
+ font-size: var(--notify-font-size);
105
+ font-family: var(--notify-font-family);
106
+ width: 100%;
107
+ pointer-events: auto;
108
+ transition: var(--notify-transition);
109
+ opacity: 1;
110
+ }
111
+ .notify-container .notify .avatar {
112
+ width: 2rem;
113
+ height: 2rem;
114
+ border-radius: 50%;
115
+ object-fit: cover;
116
+ float: left;
117
+ margin-right: 0.5rem;
118
+ }
119
+ .notify-container .notify .close {
120
+ position: absolute;
121
+ top: 0.5rem;
122
+ right: 0.75rem;
123
+ background: transparent;
124
+ border: none;
125
+ font-size: var(--notify-close-size);
126
+ cursor: pointer;
127
+ line-height: 1;
128
+ color: var(--notify-close-color);
129
+ padding: 0;
130
+ margin: 0;
131
+ }
132
+ .notify-container .notify .close:hover {
133
+ color: var(--notify-close-color-hover);
134
+ }
135
+ .notify-container .notify.clickable {
136
+ cursor: pointer;
137
+ }
138
+ .notify-container .notify.clickable:hover {
139
+ background-color: var(--notify-color-bg-hover, rgba(0, 0, 0, 0.05));
140
+ }
141
+ .notify-container .notify.enter {
142
+ opacity: 0;
143
+ }
144
+ .notify-container .notify.show {
145
+ opacity: 1;
146
+ transform: translateY(0);
147
+ }
148
+ .notify-container .notify.exit {
149
+ opacity: 0;
150
+ }
151
+
152
+ /* Notification center */
153
+ .notify-overlay {
154
+ position: fixed;
155
+ inset: 0;
156
+ background-color: rgba(0, 0, 0, 0.35);
157
+ display: flex;
158
+ justify-content: flex-end;
159
+ align-items: flex-start;
160
+ padding: 1rem;
161
+ z-index: var(--notif-center-z-index);
162
+ transition: var(--notif-center-bg-transition);
163
+ }
164
+ .notify-overlay.hidden {
165
+ background-color: transparent;
166
+ pointer-events: none;
167
+ }
168
+ .notify-overlay .notify-center {
169
+ position: fixed;
170
+ top: 0;
171
+ right: 0;
172
+ width: var(--notif-center-width);
173
+ height: var(--notif-center-height);
174
+ background-color: var(--notif-center-bg);
175
+ backdrop-filter: blur(var(--notif-center-blur));
176
+ box-shadow: -4px 0 12px var(--notif-center-shadow);
177
+ padding-top: var(--notif-center-y-padding);
178
+ padding-bottom: var(--notif-center-y-padding);
179
+ padding-left: var(--notif-center-x-padding);
180
+ padding-right: var(--notif-center-x-padding);
181
+ display: flex;
182
+ flex-direction: column;
183
+ z-index: var(--notif-center-z-index);
184
+ transform: translateX(100%);
185
+ transition: var(--notif-center-transform);
186
+ }
187
+ .notify-overlay .notify-center.open {
188
+ transform: translateX(0%);
189
+ }
190
+ .notify-overlay .notify-center .header {
191
+ display: flex;
192
+ justify-content: space-between;
193
+ align-items: center;
194
+ }
195
+ .notify-overlay .notify-center .options {
196
+ display: flex;
197
+ }
198
+ .notify-overlay .notify-center .options > button {
199
+ background: none;
200
+ border: none;
201
+ font-size: var(--notif-close-size);
202
+ color: var(--notif-close-color);
203
+ cursor: pointer;
204
+ }
205
+ .notify-overlay .notify-center .options > button > svg {
206
+ align-items: center;
207
+ display: flex;
208
+ }
209
+ .notify-overlay .notify-center .options > button:hover {
210
+ color: var(--notif-close-color-hover);
211
+ }
212
+ .notify-overlay .notify-center .list {
213
+ flex: 1;
214
+ overflow-y: auto;
215
+ display: flex;
216
+ flex-direction: column;
217
+ gap: 1rem;
218
+ scrollbar-width: thin;
219
+ scrollbar-color: #999 transparent;
220
+ }
221
+ .notify-overlay .notify-center .list::-webkit-scrollbar {
222
+ width: 6px;
223
+ }
224
+ .notify-overlay .notify-center .list::-webkit-scrollbar-thumb {
225
+ background: #aaa;
226
+ border-radius: 3px;
227
+ }
228
+ .notify-overlay .notify-center .item {
229
+ display: flex;
230
+ justify-content: space-between;
231
+ align-items: flex-start;
232
+ background-color: var(--notif-item-bg);
233
+ color: var(--notif-item-text);
234
+ border-radius: var(--notif-item-radius);
235
+ padding: var(--notif-item-padding);
236
+ box-shadow: 0 2px 6px var(--notif-item-shadow);
237
+ font-size: 0.95rem;
238
+ transition: var(--notif-center-remove-transition);
239
+ border-left-style: solid;
240
+ border-left-color: var(--notif-border);
241
+ }
242
+ .notify-overlay .notify-center .item .avatar {
243
+ width: 40px;
244
+ height: 40px;
245
+ flex-shrink: 0;
246
+ border-radius: 50%;
247
+ background-size: cover;
248
+ background-position: center;
249
+ margin-right: 10px;
250
+ }
251
+ .notify-overlay .notify-center .item.unread {
252
+ background-color: var(--notif-item-unread-bg);
253
+ border-left-color: var(--notif-unread-border);
254
+ }
255
+ .notify-overlay .notify-center .item.removing {
256
+ opacity: 0;
257
+ transform: translateY(-10px);
258
+ pointer-events: none !important;
259
+ }
260
+ .notify-overlay .notify-center .item.clickable {
261
+ cursor: pointer;
262
+ }
263
+ .notify-overlay .notify-center .item.clickable:hover {
264
+ background-color: var(--notif-hover, rgba(0, 0, 0, 0.05));
265
+ }
266
+ .notify-overlay .notify-center .item .content {
267
+ flex-grow: 1;
268
+ display: flex;
269
+ flex-direction: column;
270
+ }
271
+ .notify-overlay .notify-center .item .title {
272
+ font-weight: bold;
273
+ margin-bottom: 0.25rem;
274
+ }
275
+ .notify-overlay .notify-center .item .message {
276
+ font-size: 0.95rem;
277
+ }
278
+ .notify-overlay .notify-center .item .notify-close {
279
+ background: none;
280
+ border: none;
281
+ font-size: 1.25rem;
282
+ line-height: 1;
283
+ color: var(--notif-item-close);
284
+ cursor: pointer;
285
+ padding: 0.25rem;
286
+ }
287
+ .notify-overlay .notify-center .item .notify-close:hover {
288
+ color: var(--notif-item-close-hover);
289
+ }
290
+
291
+ @media (max-width: 600px) {
292
+ .notify-center {
293
+ border-radius: 0;
294
+ width: 100vw;
295
+ padding: 0px !important;
296
+ }
297
+ .notify-center .header {
298
+ padding-top: var(--notif-center-y-padding);
299
+ }
300
+ .notify-center .header,
301
+ .notify-center .list {
302
+ padding-left: var(--notif-center-x-padding);
303
+ padding-right: var(--notif-center-x-padding);
304
+ }
305
+ }
306
+ /* Notification bell */
307
+ .notify-bell {
308
+ position: fixed;
309
+ bottom: 1.5rem;
310
+ right: 1.5rem;
311
+ width: var(--notif-bell-size);
312
+ height: var(--notif-bell-size);
313
+ background-color: var(--notif-bell-bg);
314
+ color: var(--notif-bell-color);
315
+ border: none;
316
+ border-radius: var(--notif-bell-radius);
317
+ box-shadow: 0 4px 8px var(--notif-bell-shadow);
318
+ display: flex;
319
+ align-items: center;
320
+ justify-content: center;
321
+ cursor: pointer;
322
+ z-index: var(--notif-bell-z-index);
323
+ font-size: 1.4rem;
324
+ transition: var(--notif-center-bg-transition);
325
+ }
326
+ .notify-bell:hover {
327
+ background-color: var(--notif-bell-hover-bg);
328
+ }
329
+ .notify-bell .badge {
330
+ position: absolute;
331
+ top: 0;
332
+ right: 0;
333
+ transform: translate(25%, -25%);
334
+ background-color: var(--notif-badge-bg);
335
+ color: var(--notif-badge-color);
336
+ border: var(--notif-badge-border);
337
+ border-radius: 999px;
338
+ min-width: var(--notif-badge-size);
339
+ height: var(--notif-badge-size);
340
+ font-size: var(--notif-badge-font-size);
341
+ font-weight: bold;
342
+ display: flex;
343
+ align-items: center;
344
+ justify-content: center;
345
+ padding: 0 0.3em;
346
+ pointer-events: none;
347
+ }
348
+ .notify-bell .badge[data-value="0"] {
349
+ display: none;
350
+ }
@@ -0,0 +1 @@
1
+ :root{--notify-width: clamp(280px, 90vw, 400px);--notify-spacing: 1rem;--notify-z-index: 1000;--notify-transition: opacity 0.3s ease, transform 0.3s ease;--notify-padding: 1rem;--notify-border-radius: 0.75rem;--notify-font-size: 1rem;--notify-font-family: sans-serif;--notify-color-bg: #ffffff;--notify-color-text: #333333;--notify-color-shadow: rgba(0, 0, 0, 0.1);--notify-close-size: 1.25rem;--notify-close-color: #444;--notify-close-color-hover: #000;--notif-center-remove-transition: opacity 0.3s ease, transform 0.3s ease;--notif-center-bg-transition: background 0.2s ease;--notif-center-transform: transform 0.3s ease;--notif-center-width: clamp(300px, 90vw, 400px);--notif-center-height: 100vh;--notif-center-bg: rgba(255, 255, 255, 0.85);--notif-center-blur: 12px;--notif-center-shadow: rgba(0, 0, 0, 0.2);--notif-center-x-padding: 1rem;--notif-center-y-padding: 1rem;--notif-center-z-index: 1050;--notif-border: #000;--notif-unread-border: #bd0b0b;--notif-border-unread: ;--notif-item-close: #666;--notif-item-close-hover: #000;--notif-item-bg: #ffffff;--notif-item-unread-bg: #ffffff;--notif-item-text: #222;--notif-item-radius: 0.75rem;--notif-item-padding: 1rem;--notif-item-shadow: rgba(0, 0, 0, 0.1);--notif-close-size: 1.5rem;--notif-close-color: #444;--notif-close-color-hover: #000;--notif-bell-size: 3rem;--notif-bell-bg: #ffffff;--notif-bell-color: #333;--notif-bell-shadow: rgba(0, 0, 0, 0.2);--notif-bell-z-index: 1040;--notif-bell-radius: 50%;--notif-bell-hover-bg: #f0f0f0;--notif-badge-bg: #d32f2f;--notif-badge-color: #ffffff;--notif-badge-size: 1.25rem;--notif-badge-font-size: 0.75rem;--notif-badge-border: none}.notify-container{position:fixed;display:flex;gap:var(--notify-spacing);width:var(--notify-width);z-index:var(--notify-z-index);pointer-events:none}.notify-container.left{left:var(--notify-spacing);align-items:flex-start}.notify-container.right{right:var(--notify-spacing);align-items:flex-end}.notify-container.center{left:50%;transform:translateX(-50%);align-items:center}.notify-container.top{flex-direction:column;top:var(--notify-spacing)}.notify-container.top .notify.enter{transform:translateY(-10px)}.notify-container.top .notify.exit{transform:translateY(-10px)}.notify-container.bottom{flex-direction:column-reverse;bottom:var(--notify-spacing)}.notify-container.bottom .notify.enter{transform:translateY(10px)}.notify-container.bottom .notify.exit{transform:translateY(10px)}.notify-container .notify{position:relative;background-color:var(--notify-color-bg);color:var(--notify-color-text);box-shadow:0 4px 8px var(--notify-color-shadow);border-radius:var(--notify-border-radius);padding:var(--notify-padding);font-size:var(--notify-font-size);font-family:var(--notify-font-family);width:100%;pointer-events:auto;transition:var(--notify-transition);opacity:1}.notify-container .notify .avatar{width:2rem;height:2rem;border-radius:50%;object-fit:cover;float:left;margin-right:.5rem}.notify-container .notify .close{position:absolute;top:.5rem;right:.75rem;background:rgba(0,0,0,0);border:none;font-size:var(--notify-close-size);cursor:pointer;line-height:1;color:var(--notify-close-color);padding:0;margin:0}.notify-container .notify .close:hover{color:var(--notify-close-color-hover)}.notify-container .notify.clickable{cursor:pointer}.notify-container .notify.clickable:hover{background-color:var(--notify-color-bg-hover, rgba(0, 0, 0, 0.05))}.notify-container .notify.enter{opacity:0}.notify-container .notify.show{opacity:1;transform:translateY(0)}.notify-container .notify.exit{opacity:0}.notify-overlay{position:fixed;inset:0;background-color:rgba(0,0,0,.35);display:flex;justify-content:flex-end;align-items:flex-start;padding:1rem;z-index:var(--notif-center-z-index);transition:var(--notif-center-bg-transition)}.notify-overlay.hidden{background-color:rgba(0,0,0,0);pointer-events:none}.notify-overlay .notify-center{position:fixed;top:0;right:0;width:var(--notif-center-width);height:var(--notif-center-height);background-color:var(--notif-center-bg);backdrop-filter:blur(var(--notif-center-blur));box-shadow:-4px 0 12px var(--notif-center-shadow);padding-top:var(--notif-center-y-padding);padding-bottom:var(--notif-center-y-padding);padding-left:var(--notif-center-x-padding);padding-right:var(--notif-center-x-padding);display:flex;flex-direction:column;z-index:var(--notif-center-z-index);transform:translateX(100%);transition:var(--notif-center-transform)}.notify-overlay .notify-center.open{transform:translateX(0%)}.notify-overlay .notify-center .header{display:flex;justify-content:space-between;align-items:center}.notify-overlay .notify-center .options{display:flex}.notify-overlay .notify-center .options>button{background:none;border:none;font-size:var(--notif-close-size);color:var(--notif-close-color);cursor:pointer}.notify-overlay .notify-center .options>button>svg{align-items:center;display:flex}.notify-overlay .notify-center .options>button:hover{color:var(--notif-close-color-hover)}.notify-overlay .notify-center .list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:1rem;scrollbar-width:thin;scrollbar-color:#999 rgba(0,0,0,0)}.notify-overlay .notify-center .list::-webkit-scrollbar{width:6px}.notify-overlay .notify-center .list::-webkit-scrollbar-thumb{background:#aaa;border-radius:3px}.notify-overlay .notify-center .item{display:flex;justify-content:space-between;align-items:flex-start;background-color:var(--notif-item-bg);color:var(--notif-item-text);border-radius:var(--notif-item-radius);padding:var(--notif-item-padding);box-shadow:0 2px 6px var(--notif-item-shadow);font-size:.95rem;transition:var(--notif-center-remove-transition);border-left-style:solid;border-left-color:var(--notif-border)}.notify-overlay .notify-center .item .avatar{width:40px;height:40px;flex-shrink:0;border-radius:50%;background-size:cover;background-position:center;margin-right:10px}.notify-overlay .notify-center .item.unread{background-color:var(--notif-item-unread-bg);border-left-color:var(--notif-unread-border)}.notify-overlay .notify-center .item.removing{opacity:0;transform:translateY(-10px);pointer-events:none !important}.notify-overlay .notify-center .item.clickable{cursor:pointer}.notify-overlay .notify-center .item.clickable:hover{background-color:var(--notif-hover, rgba(0, 0, 0, 0.05))}.notify-overlay .notify-center .item .content{flex-grow:1;display:flex;flex-direction:column}.notify-overlay .notify-center .item .title{font-weight:bold;margin-bottom:.25rem}.notify-overlay .notify-center .item .message{font-size:.95rem}.notify-overlay .notify-center .item .notify-close{background:none;border:none;font-size:1.25rem;line-height:1;color:var(--notif-item-close);cursor:pointer;padding:.25rem}.notify-overlay .notify-center .item .notify-close:hover{color:var(--notif-item-close-hover)}@media(max-width: 600px){.notify-center{border-radius:0;width:100vw;padding:0px !important}.notify-center .header{padding-top:var(--notif-center-y-padding)}.notify-center .header,.notify-center .list{padding-left:var(--notif-center-x-padding);padding-right:var(--notif-center-x-padding)}}.notify-bell{position:fixed;bottom:1.5rem;right:1.5rem;width:var(--notif-bell-size);height:var(--notif-bell-size);background-color:var(--notif-bell-bg);color:var(--notif-bell-color);border:none;border-radius:var(--notif-bell-radius);box-shadow:0 4px 8px var(--notif-bell-shadow);display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:var(--notif-bell-z-index);font-size:1.4rem;transition:var(--notif-center-bg-transition)}.notify-bell:hover{background-color:var(--notif-bell-hover-bg)}.notify-bell .badge{position:absolute;top:0;right:0;transform:translate(25%, -25%);background-color:var(--notif-badge-bg);color:var(--notif-badge-color);border:var(--notif-badge-border);border-radius:999px;min-width:var(--notif-badge-size);height:var(--notif-badge-size);font-size:var(--notif-badge-font-size);font-weight:bold;display:flex;align-items:center;justify-content:center;padding:0 .3em;pointer-events:none}.notify-bell .badge[data-value="0"]{display:none}
package/dist/v1/index.cjs CHANGED
@@ -11,6 +11,8 @@ var text = require('./basics/text.cjs');
11
11
  var ColorSafeStringify = require('./libs/ColorSafeStringify.cjs');
12
12
  var TinyPromiseQueue = require('./libs/TinyPromiseQueue.cjs');
13
13
  var TinyRateLimiter = require('./libs/TinyRateLimiter.cjs');
14
+ var TinyNotifyCenter = require('./libs/TinyNotifyCenter.cjs');
15
+ var TinyToastNotify = require('./libs/TinyToastNotify.cjs');
14
16
 
15
17
 
16
18
 
@@ -39,3 +41,5 @@ exports.toTitleCaseLowerFirst = text.toTitleCaseLowerFirst;
39
41
  exports.ColorSafeStringify = ColorSafeStringify;
40
42
  exports.TinyPromiseQueue = TinyPromiseQueue;
41
43
  exports.TinyRateLimiter = TinyRateLimiter;
44
+ exports.TinyNotifyCenter = TinyNotifyCenter;
45
+ exports.TinyToastNotify = TinyToastNotify;
@@ -1,3 +1,5 @@
1
+ import TinyToastNotify from './libs/TinyToastNotify.mjs';
2
+ import TinyNotifyCenter from './libs/TinyNotifyCenter.mjs';
1
3
  import TinyRateLimiter from './libs/TinyRateLimiter.mjs';
2
4
  import ColorSafeStringify from './libs/ColorSafeStringify.mjs';
3
5
  import TinyPromiseQueue from './libs/TinyPromiseQueue.mjs';
@@ -23,5 +25,5 @@ import { getTimeDuration } from './basics/clock.mjs';
23
25
  import { shuffleArray } from './basics/array.mjs';
24
26
  import { toTitleCase } from './basics/text.mjs';
25
27
  import { toTitleCaseLowerFirst } from './basics/text.mjs';
26
- export { TinyRateLimiter, ColorSafeStringify, TinyPromiseQueue, TinyLevelUp, isJsonObject, arraySortPositions, formatBytes, addAiMarkerShortcut, extendObjType, reorderObjTypeOrder, cloneObjTypeOrder, countObj, checkObj, objType, ruleOfThree, getSimplePerc, asyncReplace, getAge, formatCustomTimer, formatDayTimer, formatTimer, getTimeDuration, shuffleArray, toTitleCase, toTitleCaseLowerFirst };
28
+ export { TinyToastNotify, TinyNotifyCenter, TinyRateLimiter, ColorSafeStringify, TinyPromiseQueue, TinyLevelUp, isJsonObject, arraySortPositions, formatBytes, addAiMarkerShortcut, extendObjType, reorderObjTypeOrder, cloneObjTypeOrder, countObj, checkObj, objType, ruleOfThree, getSimplePerc, asyncReplace, getAge, formatCustomTimer, formatDayTimer, formatTimer, getTimeDuration, shuffleArray, toTitleCase, toTitleCaseLowerFirst };
27
29
  //# sourceMappingURL=index.d.mts.map
package/dist/v1/index.mjs CHANGED
@@ -9,4 +9,6 @@ import { addAiMarkerShortcut, toTitleCase, toTitleCaseLowerFirst } from './basic
9
9
  import ColorSafeStringify from './libs/ColorSafeStringify.mjs';
10
10
  import TinyPromiseQueue from './libs/TinyPromiseQueue.mjs';
11
11
  import TinyRateLimiter from './libs/TinyRateLimiter.mjs';
12
- export { TinyRateLimiter, ColorSafeStringify, TinyPromiseQueue, TinyLevelUp, isJsonObject, arraySortPositions, formatBytes, addAiMarkerShortcut, extendObjType, reorderObjTypeOrder, cloneObjTypeOrder, countObj, checkObj, objType, ruleOfThree, getSimplePerc, asyncReplace, getAge, formatCustomTimer, formatDayTimer, formatTimer, getTimeDuration, shuffleArray, toTitleCase, toTitleCaseLowerFirst, };
12
+ import TinyNotifyCenter from './libs/TinyNotifyCenter.mjs';
13
+ import TinyToastNotify from './libs/TinyToastNotify.mjs';
14
+ export { TinyToastNotify, TinyNotifyCenter, TinyRateLimiter, ColorSafeStringify, TinyPromiseQueue, TinyLevelUp, isJsonObject, arraySortPositions, formatBytes, addAiMarkerShortcut, extendObjType, reorderObjTypeOrder, cloneObjTypeOrder, countObj, checkObj, objType, ruleOfThree, getSimplePerc, asyncReplace, getAge, formatCustomTimer, formatDayTimer, formatTimer, getTimeDuration, shuffleArray, toTitleCase, toTitleCaseLowerFirst, };