@rcarls/rc-snackbar 0.4.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/README.md ADDED
@@ -0,0 +1,15 @@
1
+ # @rcarls/rc-snackbar
2
+
3
+ Live-region host for brief status messages and optional actions.
4
+
5
+ ```html
6
+ <rc-snackbar id="snackbar"></rc-snackbar>
7
+ <script type="module">
8
+ import '@rcarls/rc-snackbar/define';
9
+
10
+ document.querySelector('#snackbar').show({
11
+ message: 'Recipe saved',
12
+ actionLabel: 'Undo',
13
+ });
14
+ </script>
15
+ ```
@@ -0,0 +1,522 @@
1
+ {
2
+ "schemaVersion": "1.0.0",
3
+ "readme": "",
4
+ "modules": [
5
+ {
6
+ "kind": "javascript-module",
7
+ "path": "src/define.ts",
8
+ "declarations": [],
9
+ "exports": [
10
+ {
11
+ "kind": "custom-element-definition",
12
+ "name": "rc-snackbar",
13
+ "declaration": {
14
+ "name": "RCSnackbar",
15
+ "module": "/src/index.js"
16
+ }
17
+ }
18
+ ]
19
+ },
20
+ {
21
+ "kind": "javascript-module",
22
+ "path": "src/index.ts",
23
+ "declarations": [],
24
+ "exports": [
25
+ {
26
+ "kind": "js",
27
+ "name": "RCSnackbar",
28
+ "declaration": {
29
+ "name": "default",
30
+ "module": "./rc-snackbar.js"
31
+ }
32
+ },
33
+ {
34
+ "kind": "js",
35
+ "name": "RCSnackbarActionDetail",
36
+ "declaration": {
37
+ "name": "RCSnackbarActionDetail",
38
+ "module": "./rc-snackbar.js"
39
+ }
40
+ },
41
+ {
42
+ "kind": "js",
43
+ "name": "RCSnackbarCloseDetail",
44
+ "declaration": {
45
+ "name": "RCSnackbarCloseDetail",
46
+ "module": "./rc-snackbar.js"
47
+ }
48
+ },
49
+ {
50
+ "kind": "js",
51
+ "name": "RCSnackbarCloseReason",
52
+ "declaration": {
53
+ "name": "RCSnackbarCloseReason",
54
+ "module": "./rc-snackbar.js"
55
+ }
56
+ },
57
+ {
58
+ "kind": "js",
59
+ "name": "RCSnackbarQueuePolicy",
60
+ "declaration": {
61
+ "name": "RCSnackbarQueuePolicy",
62
+ "module": "./rc-snackbar.js"
63
+ }
64
+ },
65
+ {
66
+ "kind": "js",
67
+ "name": "RCSnackbarShowOptions",
68
+ "declaration": {
69
+ "name": "RCSnackbarShowOptions",
70
+ "module": "./rc-snackbar.js"
71
+ }
72
+ }
73
+ ]
74
+ },
75
+ {
76
+ "kind": "javascript-module",
77
+ "path": "src/rc-snackbar.ts",
78
+ "declarations": [
79
+ {
80
+ "kind": "class",
81
+ "description": "Snackbar live-region host for brief status messages and optional actions.",
82
+ "name": "RCSnackbar",
83
+ "cssProperties": [
84
+ {
85
+ "description": "Inline-axis inset from the viewport edge.",
86
+ "name": "--rc-snackbar-inset-inline",
87
+ "default": "1rem"
88
+ },
89
+ {
90
+ "description": "Block-end inset from the viewport edge, before the safe-area inset.",
91
+ "name": "--rc-snackbar-inset-block-end",
92
+ "default": "1rem"
93
+ },
94
+ {
95
+ "description": "Stacking order.",
96
+ "name": "--rc-snackbar-z-index",
97
+ "default": "1000"
98
+ },
99
+ {
100
+ "description": "Gap between the message and action.",
101
+ "name": "--rc-snackbar-gap",
102
+ "default": "0.5rem"
103
+ },
104
+ {
105
+ "description": "Minimum surface block size.",
106
+ "name": "--rc-snackbar-min-block-size",
107
+ "default": "3rem"
108
+ },
109
+ {
110
+ "description": "Maximum surface inline size.",
111
+ "name": "--rc-snackbar-max-inline-size",
112
+ "default": "30rem"
113
+ },
114
+ {
115
+ "description": "Surface block-axis padding.",
116
+ "name": "--rc-snackbar-padding-block",
117
+ "default": "0.5rem"
118
+ },
119
+ {
120
+ "description": "Surface inline-axis padding.",
121
+ "name": "--rc-snackbar-padding-inline",
122
+ "default": "1rem"
123
+ },
124
+ {
125
+ "description": "Surface border.",
126
+ "name": "--rc-snackbar-border",
127
+ "default": "1px solid CanvasText"
128
+ },
129
+ {
130
+ "description": "Surface border radius.",
131
+ "name": "--rc-snackbar-radius",
132
+ "default": "0"
133
+ },
134
+ {
135
+ "description": "Surface background.",
136
+ "name": "--rc-snackbar-bg",
137
+ "default": "Canvas"
138
+ },
139
+ {
140
+ "description": "Surface text color.",
141
+ "name": "--rc-snackbar-color",
142
+ "default": "CanvasText"
143
+ },
144
+ {
145
+ "description": "Surface box shadow.",
146
+ "name": "--rc-snackbar-shadow",
147
+ "default": "none"
148
+ },
149
+ {
150
+ "description": "Action button border; defers to native button border when unset.",
151
+ "name": "--rc-snackbar-action-border"
152
+ },
153
+ {
154
+ "description": "Action button border radius; defers to native button radius when unset.",
155
+ "name": "--rc-snackbar-action-radius"
156
+ },
157
+ {
158
+ "description": "Action button block-axis padding; defers to native button padding when unset.",
159
+ "name": "--rc-snackbar-action-padding-block"
160
+ },
161
+ {
162
+ "description": "Action button inline-axis padding; defers to native button padding when unset.",
163
+ "name": "--rc-snackbar-action-padding-inline"
164
+ },
165
+ {
166
+ "description": "Action button background; defers to native button background when unset.",
167
+ "name": "--rc-snackbar-action-bg"
168
+ },
169
+ {
170
+ "description": "Action button text color; defers to native button color when unset.",
171
+ "name": "--rc-snackbar-action-color"
172
+ },
173
+ {
174
+ "description": "Action button font shorthand; defers to native button font when unset.",
175
+ "name": "--rc-snackbar-action-font"
176
+ },
177
+ {
178
+ "description": "Action button focus outline; defers to native focus styling when unset.",
179
+ "name": "--rc-snackbar-focus-ring"
180
+ },
181
+ {
182
+ "description": "Action button focus outline offset; defers to native focus styling when unset.",
183
+ "name": "--rc-snackbar-focus-ring-offset"
184
+ }
185
+ ],
186
+ "cssParts": [
187
+ {
188
+ "description": "Snackbar surface.",
189
+ "name": "surface"
190
+ },
191
+ {
192
+ "description": "Message text.",
193
+ "name": "message"
194
+ },
195
+ {
196
+ "description": "Optional action button.",
197
+ "name": "action"
198
+ }
199
+ ],
200
+ "members": [
201
+ {
202
+ "kind": "field",
203
+ "name": "_queue",
204
+ "type": {
205
+ "text": "RCSnackbarShowOptions[]"
206
+ },
207
+ "privacy": "private",
208
+ "default": "[]"
209
+ },
210
+ {
211
+ "kind": "field",
212
+ "name": "_timer",
213
+ "type": {
214
+ "text": "number | undefined"
215
+ },
216
+ "privacy": "private"
217
+ },
218
+ {
219
+ "kind": "field",
220
+ "name": "_lastMessage",
221
+ "type": {
222
+ "text": "string"
223
+ },
224
+ "privacy": "private",
225
+ "default": "''"
226
+ },
227
+ {
228
+ "kind": "field",
229
+ "name": "_open",
230
+ "type": {
231
+ "text": "boolean | undefined"
232
+ },
233
+ "privacy": "private"
234
+ },
235
+ {
236
+ "kind": "field",
237
+ "name": "_defaultOpen",
238
+ "type": {
239
+ "text": "boolean"
240
+ },
241
+ "privacy": "private",
242
+ "default": "false"
243
+ },
244
+ {
245
+ "kind": "field",
246
+ "name": "_openInitialized",
247
+ "type": {
248
+ "text": "boolean"
249
+ },
250
+ "privacy": "private",
251
+ "default": "false"
252
+ },
253
+ {
254
+ "kind": "field",
255
+ "name": "open",
256
+ "type": {
257
+ "text": "boolean"
258
+ },
259
+ "description": "Whether the snackbar is currently visible. Host writes are silent.",
260
+ "attribute": "open",
261
+ "reflects": true
262
+ },
263
+ {
264
+ "kind": "field",
265
+ "name": "defaultOpen",
266
+ "type": {
267
+ "text": "boolean"
268
+ },
269
+ "description": "Initial visible state for uncontrolled usage, such as an already-queued\nmessage shown on first render.",
270
+ "attribute": "default-open"
271
+ },
272
+ {
273
+ "kind": "field",
274
+ "name": "message",
275
+ "type": {
276
+ "text": "string"
277
+ },
278
+ "default": "''",
279
+ "description": "Visible message text.",
280
+ "attribute": "message",
281
+ "reflects": true
282
+ },
283
+ {
284
+ "kind": "field",
285
+ "name": "actionLabel",
286
+ "type": {
287
+ "text": "string"
288
+ },
289
+ "default": "''",
290
+ "description": "Optional action button label.",
291
+ "attribute": "action-label",
292
+ "reflects": true
293
+ },
294
+ {
295
+ "kind": "field",
296
+ "name": "duration",
297
+ "type": {
298
+ "text": "number"
299
+ },
300
+ "default": "4000",
301
+ "description": "Auto-close duration in milliseconds. Set to 0 to keep open.",
302
+ "attribute": "duration"
303
+ },
304
+ {
305
+ "kind": "field",
306
+ "name": "queuePolicy",
307
+ "type": {
308
+ "text": "RCSnackbarQueuePolicy"
309
+ },
310
+ "default": "'queue'",
311
+ "description": "Queue behavior for show calls while open.",
312
+ "attribute": "queue-policy"
313
+ },
314
+ {
315
+ "kind": "method",
316
+ "name": "show",
317
+ "return": {
318
+ "type": {
319
+ "text": "void"
320
+ }
321
+ },
322
+ "parameters": [
323
+ {
324
+ "name": "message",
325
+ "type": {
326
+ "text": "string | RCSnackbarShowOptions"
327
+ }
328
+ }
329
+ ],
330
+ "description": "Shows a message or queues it according to `queuePolicy`."
331
+ },
332
+ {
333
+ "kind": "method",
334
+ "name": "close",
335
+ "return": {
336
+ "type": {
337
+ "text": "void"
338
+ }
339
+ },
340
+ "parameters": [
341
+ {
342
+ "name": "reason",
343
+ "default": "'api'",
344
+ "type": {
345
+ "text": "RCSnackbarCloseReason"
346
+ }
347
+ }
348
+ ],
349
+ "description": "Closes the current snackbar."
350
+ },
351
+ {
352
+ "kind": "method",
353
+ "name": "clear",
354
+ "return": {
355
+ "type": {
356
+ "text": "void"
357
+ }
358
+ },
359
+ "description": "Clears the current snackbar and all queued messages."
360
+ },
361
+ {
362
+ "kind": "method",
363
+ "name": "_showNow",
364
+ "privacy": "private",
365
+ "return": {
366
+ "type": {
367
+ "text": "void"
368
+ }
369
+ },
370
+ "parameters": [
371
+ {
372
+ "name": "next",
373
+ "type": {
374
+ "text": "RCSnackbarShowOptions"
375
+ }
376
+ }
377
+ ]
378
+ },
379
+ {
380
+ "kind": "method",
381
+ "name": "_closeCurrent",
382
+ "privacy": "private",
383
+ "return": {
384
+ "type": {
385
+ "text": "void"
386
+ }
387
+ },
388
+ "parameters": [
389
+ {
390
+ "name": "reason",
391
+ "type": {
392
+ "text": "RCSnackbarCloseReason"
393
+ }
394
+ },
395
+ {
396
+ "name": "showNext",
397
+ "type": {
398
+ "text": "boolean"
399
+ }
400
+ }
401
+ ]
402
+ },
403
+ {
404
+ "kind": "method",
405
+ "name": "_handleAction",
406
+ "privacy": "private",
407
+ "return": {
408
+ "type": {
409
+ "text": "void"
410
+ }
411
+ }
412
+ },
413
+ {
414
+ "kind": "method",
415
+ "name": "_clearTimer",
416
+ "privacy": "private",
417
+ "return": {
418
+ "type": {
419
+ "text": "void"
420
+ }
421
+ }
422
+ }
423
+ ],
424
+ "events": [
425
+ {
426
+ "name": "rc-snackbar-close",
427
+ "type": {
428
+ "text": "CustomEvent"
429
+ },
430
+ "description": "Fired after a visible snackbar closes."
431
+ },
432
+ {
433
+ "name": "rc-snackbar-action",
434
+ "type": {
435
+ "text": "CustomEvent"
436
+ },
437
+ "description": "Fired when the action button is activated."
438
+ }
439
+ ],
440
+ "attributes": [
441
+ {
442
+ "description": "Whether the snackbar is currently visible. Host writes are silent.",
443
+ "name": "open",
444
+ "type": {
445
+ "text": "boolean"
446
+ },
447
+ "fieldName": "open"
448
+ },
449
+ {
450
+ "description": "Initial visible state for uncontrolled usage, such as an already-queued\nmessage shown on first render.",
451
+ "name": "default-open",
452
+ "type": {
453
+ "text": "boolean"
454
+ },
455
+ "fieldName": "defaultOpen"
456
+ },
457
+ {
458
+ "description": "Visible message text.",
459
+ "name": "message",
460
+ "type": {
461
+ "text": "string"
462
+ },
463
+ "default": "''",
464
+ "fieldName": "message"
465
+ },
466
+ {
467
+ "description": "Optional action button label.",
468
+ "name": "action-label",
469
+ "type": {
470
+ "text": "string"
471
+ },
472
+ "default": "''",
473
+ "fieldName": "actionLabel"
474
+ },
475
+ {
476
+ "description": "Auto-close duration in milliseconds. Set to 0 to keep open.",
477
+ "name": "duration",
478
+ "type": {
479
+ "text": "number"
480
+ },
481
+ "default": "4000",
482
+ "fieldName": "duration"
483
+ },
484
+ {
485
+ "description": "Queue behavior for show calls while open.",
486
+ "name": "queue-policy",
487
+ "type": {
488
+ "text": "RCSnackbarQueuePolicy"
489
+ },
490
+ "default": "'queue'",
491
+ "fieldName": "queuePolicy"
492
+ }
493
+ ],
494
+ "superclass": {
495
+ "name": "LitElement",
496
+ "package": "lit"
497
+ },
498
+ "tagName": "rc-snackbar",
499
+ "customElement": true
500
+ }
501
+ ],
502
+ "exports": [
503
+ {
504
+ "kind": "js",
505
+ "name": "RCSnackbar",
506
+ "declaration": {
507
+ "name": "RCSnackbar",
508
+ "module": "src/rc-snackbar.ts"
509
+ }
510
+ },
511
+ {
512
+ "kind": "js",
513
+ "name": "default",
514
+ "declaration": {
515
+ "name": "RCSnackbar",
516
+ "module": "src/rc-snackbar.ts"
517
+ }
518
+ }
519
+ ]
520
+ }
521
+ ]
522
+ }
@@ -0,0 +1,199 @@
1
+ import { css as u, LitElement as d, html as h } from "lit";
2
+ import { property as i } from "lit/decorators.js";
3
+ const b = u`
4
+ :host {
5
+ position: fixed;
6
+ inset-inline: var(--rc-snackbar-inset-inline, 1rem);
7
+ inset-block-end: calc(
8
+ var(--rc-snackbar-inset-block-end, 1rem) + env(safe-area-inset-bottom, 0px)
9
+ );
10
+ z-index: var(--rc-snackbar-z-index, 1000);
11
+ display: none;
12
+ justify-content: center;
13
+ pointer-events: none;
14
+ color-scheme: inherit;
15
+ }
16
+
17
+ :host([hidden]) {
18
+ display: none;
19
+ }
20
+
21
+ :host([open]) {
22
+ display: flex;
23
+ }
24
+
25
+ [part='surface'] {
26
+ pointer-events: auto;
27
+ display: flex;
28
+ align-items: center;
29
+ gap: var(--rc-snackbar-gap, 0.5rem);
30
+ box-sizing: border-box;
31
+ min-block-size: var(--rc-snackbar-min-block-size, 3rem);
32
+ inline-size: min(100%, var(--rc-snackbar-max-inline-size, 30rem));
33
+ padding-block: var(--rc-snackbar-padding-block, 0.5rem);
34
+ padding-inline: var(--rc-snackbar-padding-inline, 1rem);
35
+ border: var(--rc-snackbar-border, 1px solid CanvasText);
36
+ border-radius: var(--rc-snackbar-radius, 0);
37
+ background: var(--rc-snackbar-bg, Canvas);
38
+ color: var(--rc-snackbar-color, CanvasText);
39
+ box-shadow: var(--rc-snackbar-shadow, none);
40
+ }
41
+
42
+ [part='message'] {
43
+ flex: 1 1 auto;
44
+ }
45
+
46
+ [part='action'] {
47
+ flex: 0 0 auto;
48
+ display: none;
49
+ border: var(--rc-snackbar-action-border, revert);
50
+ border-radius: var(--rc-snackbar-action-radius, revert);
51
+ padding-block: var(--rc-snackbar-action-padding-block, revert);
52
+ padding-inline: var(--rc-snackbar-action-padding-inline, revert);
53
+ background: var(--rc-snackbar-action-bg, revert);
54
+ color: var(--rc-snackbar-action-color, revert);
55
+ font: var(--rc-snackbar-action-font, revert);
56
+ }
57
+
58
+ :host([action-label]) [part='action'] {
59
+ display: inline-flex;
60
+ }
61
+
62
+ [part='action']:focus-visible {
63
+ outline: var(--rc-snackbar-focus-ring, revert);
64
+ outline-offset: var(--rc-snackbar-focus-ring-offset, revert);
65
+ }
66
+
67
+ @media (forced-colors: active) {
68
+ [part='surface'] {
69
+ border: 1px solid CanvasText;
70
+ background: CanvasText;
71
+ color: Canvas;
72
+ }
73
+
74
+ [part='action'] {
75
+ color: Highlight;
76
+ }
77
+ }
78
+ `;
79
+ var f = Object.defineProperty, v = Object.getOwnPropertyDescriptor, n = (p, e, t, s) => {
80
+ for (var r = s > 1 ? void 0 : s ? v(e, t) : e, o = p.length - 1, c; o >= 0; o--)
81
+ (c = p[o]) && (r = (s ? c(e, t, r) : c(r)) || r);
82
+ return s && r && f(e, t, r), r;
83
+ };
84
+ const l = class l extends d {
85
+ constructor() {
86
+ super(...arguments), this._queue = [], this._lastMessage = "", this._defaultOpen = !1, this._openInitialized = !1, this.message = "", this.actionLabel = "", this.duration = 4e3, this.queuePolicy = "queue";
87
+ }
88
+ get open() {
89
+ return this._open ?? this._defaultOpen;
90
+ }
91
+ set open(e) {
92
+ const t = this.open;
93
+ this._open = e, this._openInitialized = !0, this.requestUpdate("open", t);
94
+ }
95
+ get defaultOpen() {
96
+ return this._defaultOpen;
97
+ }
98
+ set defaultOpen(e) {
99
+ const t = this._defaultOpen;
100
+ this._defaultOpen = e, !this._openInitialized && this._open === void 0 && this.requestUpdate("open", t), this.requestUpdate("defaultOpen", t);
101
+ }
102
+ disconnectedCallback() {
103
+ this._clearTimer(), super.disconnectedCallback();
104
+ }
105
+ updated(e) {
106
+ e.has("open") && !this.open && this._clearTimer();
107
+ }
108
+ render() {
109
+ return h`
110
+ <div part="surface" role="status" aria-live="polite" aria-atomic="true">
111
+ <span part="message">${this.message}</span>
112
+ <button part="action" type="button" @click=${this._handleAction}>
113
+ ${this.actionLabel}
114
+ </button>
115
+ </div>
116
+ `;
117
+ }
118
+ /**
119
+ * Shows a message or queues it according to `queuePolicy`.
120
+ *
121
+ * @example
122
+ * snackbar.show({
123
+ * message: 'Recipe saved',
124
+ * actionLabel: 'Undo',
125
+ * duration: 6000,
126
+ * });
127
+ */
128
+ show(e) {
129
+ const t = typeof e == "string" ? { message: e } : e;
130
+ if (this.open) {
131
+ this.queuePolicy === "replace" ? (this._closeCurrent("replace", !1), this._showNow(t)) : this._queue.push(t);
132
+ return;
133
+ }
134
+ this._showNow(t);
135
+ }
136
+ /** Closes the current snackbar. */
137
+ close(e = "api") {
138
+ this._closeCurrent(e, !0);
139
+ }
140
+ /** Clears the current snackbar and all queued messages. */
141
+ clear() {
142
+ this._queue = [], this._closeCurrent("clear", !1);
143
+ }
144
+ _showNow(e) {
145
+ const t = e.duration ?? this.duration;
146
+ this._clearTimer(), this.message = e.message, this.actionLabel = e.actionLabel ?? "", this._lastMessage = e.message, this.open = !0, t > 0 && (this._timer = window.setTimeout(() => this._closeCurrent("timeout", !0), t));
147
+ }
148
+ _closeCurrent(e, t) {
149
+ if (!this.open)
150
+ return;
151
+ const s = this.message;
152
+ if (this._clearTimer(), this.open = !1, this.message = "", this.actionLabel = "", this.dispatchEvent(
153
+ new CustomEvent("rc-snackbar-close", {
154
+ bubbles: !0,
155
+ composed: !0,
156
+ detail: { reason: e, message: s }
157
+ })
158
+ ), t) {
159
+ const r = this._queue.shift();
160
+ r && queueMicrotask(() => this._showNow(r));
161
+ }
162
+ }
163
+ _handleAction() {
164
+ this.open && (this.dispatchEvent(
165
+ new CustomEvent("rc-snackbar-action", {
166
+ bubbles: !0,
167
+ composed: !0,
168
+ detail: { message: this._lastMessage }
169
+ })
170
+ ), this._closeCurrent("action", !0));
171
+ }
172
+ _clearTimer() {
173
+ window.clearTimeout(this._timer), this._timer = void 0;
174
+ }
175
+ };
176
+ l.styles = b;
177
+ let a = l;
178
+ n([
179
+ i({ type: Boolean, reflect: !0 })
180
+ ], a.prototype, "open", 1);
181
+ n([
182
+ i({ type: Boolean, attribute: "default-open" })
183
+ ], a.prototype, "defaultOpen", 1);
184
+ n([
185
+ i({ type: String, reflect: !0 })
186
+ ], a.prototype, "message", 2);
187
+ n([
188
+ i({ type: String, attribute: "action-label", reflect: !0 })
189
+ ], a.prototype, "actionLabel", 2);
190
+ n([
191
+ i({ type: Number })
192
+ ], a.prototype, "duration", 2);
193
+ n([
194
+ i({ type: String, attribute: "queue-policy" })
195
+ ], a.prototype, "queuePolicy", 2);
196
+ export {
197
+ a as R
198
+ };
199
+ //# sourceMappingURL=rc-snackbar-GsVuC2lu.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"rc-snackbar-GsVuC2lu.js","sources":["../src/rc-snackbar.styles.ts","../src/rc-snackbar.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const snackbarStyles = css`\n :host {\n position: fixed;\n inset-inline: var(--rc-snackbar-inset-inline, 1rem);\n inset-block-end: calc(\n var(--rc-snackbar-inset-block-end, 1rem) + env(safe-area-inset-bottom, 0px)\n );\n z-index: var(--rc-snackbar-z-index, 1000);\n display: none;\n justify-content: center;\n pointer-events: none;\n color-scheme: inherit;\n }\n\n :host([hidden]) {\n display: none;\n }\n\n :host([open]) {\n display: flex;\n }\n\n [part='surface'] {\n pointer-events: auto;\n display: flex;\n align-items: center;\n gap: var(--rc-snackbar-gap, 0.5rem);\n box-sizing: border-box;\n min-block-size: var(--rc-snackbar-min-block-size, 3rem);\n inline-size: min(100%, var(--rc-snackbar-max-inline-size, 30rem));\n padding-block: var(--rc-snackbar-padding-block, 0.5rem);\n padding-inline: var(--rc-snackbar-padding-inline, 1rem);\n border: var(--rc-snackbar-border, 1px solid CanvasText);\n border-radius: var(--rc-snackbar-radius, 0);\n background: var(--rc-snackbar-bg, Canvas);\n color: var(--rc-snackbar-color, CanvasText);\n box-shadow: var(--rc-snackbar-shadow, none);\n }\n\n [part='message'] {\n flex: 1 1 auto;\n }\n\n [part='action'] {\n flex: 0 0 auto;\n display: none;\n border: var(--rc-snackbar-action-border, revert);\n border-radius: var(--rc-snackbar-action-radius, revert);\n padding-block: var(--rc-snackbar-action-padding-block, revert);\n padding-inline: var(--rc-snackbar-action-padding-inline, revert);\n background: var(--rc-snackbar-action-bg, revert);\n color: var(--rc-snackbar-action-color, revert);\n font: var(--rc-snackbar-action-font, revert);\n }\n\n :host([action-label]) [part='action'] {\n display: inline-flex;\n }\n\n [part='action']:focus-visible {\n outline: var(--rc-snackbar-focus-ring, revert);\n outline-offset: var(--rc-snackbar-focus-ring-offset, revert);\n }\n\n @media (forced-colors: active) {\n [part='surface'] {\n border: 1px solid CanvasText;\n background: CanvasText;\n color: Canvas;\n }\n\n [part='action'] {\n color: Highlight;\n }\n }\n`;\n\nexport default snackbarStyles;\n","import { LitElement, html } from 'lit';\nimport type { PropertyValues } from 'lit';\nimport { property } from 'lit/decorators.js';\n\nimport snackbarStyles from './rc-snackbar.styles.js';\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'rc-snackbar': RCSnackbar;\n }\n\n interface HTMLElementEventMap {\n 'rc-snackbar-action': CustomEvent<RCSnackbarActionDetail>;\n 'rc-snackbar-close': CustomEvent<RCSnackbarCloseDetail>;\n }\n}\n\n/** Snackbar queue behavior when `show()` is called while open. */\nexport type RCSnackbarQueuePolicy = 'queue' | 'replace';\n\n/** Close reasons surfaced by `rc-snackbar-close`. */\nexport type RCSnackbarCloseReason = 'action' | 'api' | 'timeout' | 'replace' | 'clear';\n\n/** Options accepted by `show()`. */\nexport interface RCSnackbarShowOptions {\n /** Message text to announce. */\n message: string;\n /** Optional action button label. */\n actionLabel?: string;\n /** Auto-close duration in milliseconds. */\n duration?: number;\n}\n\n/** Detail payload for `rc-snackbar-action`. */\nexport interface RCSnackbarActionDetail {\n /** Message that was visible when the action was activated. */\n message: string;\n}\n\n/** Detail payload for `rc-snackbar-close`. */\nexport interface RCSnackbarCloseDetail {\n /** Close reason. */\n reason: RCSnackbarCloseReason;\n /** Message that closed. */\n message: string;\n}\n\n/**\n * Snackbar live-region host for brief status messages and optional actions.\n *\n * @see {@link https://richardcarls.github.io/rc-webcomponents/components/rc-snackbar rc-snackbar docs}\n *\n * @fires rc-snackbar-action - Fired when the action button is activated.\n * @fires rc-snackbar-close - Fired after a visible snackbar closes.\n *\n * @csspart surface - Snackbar surface.\n * @csspart message - Message text.\n * @csspart action - Optional action button.\n *\n * @attr open - Whether a snackbar is currently visible. Host writes are silent.\n * @attr default-open - Initial visible state for uncontrolled usage.\n * @attr message - Visible snackbar message.\n * @attr action-label - Optional action button label.\n * @attr duration - Auto-close duration in milliseconds.\n * @attr queue-policy - `queue` appends while open; `replace` closes the current message.\n *\n * @cssprop [--rc-snackbar-inset-inline=1rem] - Inline-axis inset from the viewport edge.\n * @cssprop [--rc-snackbar-inset-block-end=1rem] - Block-end inset from the viewport edge, before\n * the safe-area inset.\n * @cssprop [--rc-snackbar-z-index=1000] - Stacking order.\n * @cssprop [--rc-snackbar-gap=0.5rem] - Gap between the message and action.\n * @cssprop [--rc-snackbar-min-block-size=3rem] - Minimum surface block size.\n * @cssprop [--rc-snackbar-max-inline-size=30rem] - Maximum surface inline size.\n * @cssprop [--rc-snackbar-padding-block=0.5rem] - Surface block-axis padding.\n * @cssprop [--rc-snackbar-padding-inline=1rem] - Surface inline-axis padding.\n * @cssprop [--rc-snackbar-border=1px solid CanvasText] - Surface border.\n * @cssprop [--rc-snackbar-radius=0] - Surface border radius.\n * @cssprop [--rc-snackbar-bg=Canvas] - Surface background.\n * @cssprop [--rc-snackbar-color=CanvasText] - Surface text color.\n * @cssprop [--rc-snackbar-shadow=none] - Surface box shadow.\n * @cssprop [--rc-snackbar-action-border] - Action button border; defers to native button\n * border when unset.\n * @cssprop [--rc-snackbar-action-radius] - Action button border radius; defers to native button\n * radius when unset.\n * @cssprop [--rc-snackbar-action-padding-block] - Action button block-axis padding; defers to\n * native button padding when unset.\n * @cssprop [--rc-snackbar-action-padding-inline] - Action button inline-axis padding; defers to\n * native button padding when unset.\n * @cssprop [--rc-snackbar-action-bg] - Action button background; defers to native button\n * background when unset.\n * @cssprop [--rc-snackbar-action-color] - Action button text color; defers to native button\n * color when unset.\n * @cssprop [--rc-snackbar-action-font] - Action button font shorthand; defers to native button\n * font when unset.\n * @cssprop [--rc-snackbar-focus-ring] - Action button focus outline; defers to native focus\n * styling when unset.\n * @cssprop [--rc-snackbar-focus-ring-offset] - Action button focus outline offset; defers to\n * native focus styling when unset.\n */\nexport class RCSnackbar extends LitElement {\n static override styles = snackbarStyles;\n\n private _queue: RCSnackbarShowOptions[] = [];\n private _timer: number | undefined;\n private _lastMessage = '';\n\n private _open: boolean | undefined;\n private _defaultOpen = false;\n private _openInitialized = false;\n\n /** Whether the snackbar is currently visible. Host writes are silent. */\n @property({ type: Boolean, reflect: true })\n get open(): boolean {\n return this._open ?? this._defaultOpen;\n }\n\n set open(value: boolean | undefined) {\n const oldValue = this.open;\n\n this._open = value;\n this._openInitialized = true;\n this.requestUpdate('open', oldValue);\n }\n\n /** Initial visible state for uncontrolled usage, such as an already-queued\n * message shown on first render. */\n @property({ type: Boolean, attribute: 'default-open' })\n get defaultOpen(): boolean {\n return this._defaultOpen;\n }\n\n set defaultOpen(value: boolean) {\n const oldValue = this._defaultOpen;\n\n this._defaultOpen = value;\n\n if (!this._openInitialized && this._open === undefined) {\n this.requestUpdate('open', oldValue);\n }\n\n this.requestUpdate('defaultOpen', oldValue);\n }\n\n /** Visible message text. */\n @property({ type: String, reflect: true })\n message = '';\n\n /** Optional action button label. */\n @property({ type: String, attribute: 'action-label', reflect: true })\n actionLabel = '';\n\n /** Auto-close duration in milliseconds. Set to 0 to keep open. */\n @property({ type: Number })\n duration = 4000;\n\n /** Queue behavior for show calls while open. */\n @property({ type: String, attribute: 'queue-policy' })\n queuePolicy: RCSnackbarQueuePolicy = 'queue';\n\n override disconnectedCallback(): void {\n this._clearTimer();\n super.disconnectedCallback();\n }\n\n protected override updated(changed: PropertyValues<this>): void {\n if (changed.has('open') && !this.open) {\n this._clearTimer();\n }\n }\n\n protected override render() {\n return html`\n <div part=\"surface\" role=\"status\" aria-live=\"polite\" aria-atomic=\"true\">\n <span part=\"message\">${this.message}</span>\n <button part=\"action\" type=\"button\" @click=${this._handleAction}>\n ${this.actionLabel}\n </button>\n </div>\n `;\n }\n\n /**\n * Shows a message or queues it according to `queuePolicy`.\n *\n * @example\n * snackbar.show({\n * message: 'Recipe saved',\n * actionLabel: 'Undo',\n * duration: 6000,\n * });\n */\n show(message: string | RCSnackbarShowOptions): void {\n const next = typeof message === 'string' ? { message } : message;\n\n if (this.open) {\n if (this.queuePolicy === 'replace') {\n this._closeCurrent('replace', false);\n this._showNow(next);\n } else {\n this._queue.push(next);\n }\n\n return;\n }\n\n this._showNow(next);\n }\n\n /** Closes the current snackbar. */\n close(reason: RCSnackbarCloseReason = 'api'): void {\n this._closeCurrent(reason, true);\n }\n\n /** Clears the current snackbar and all queued messages. */\n clear(): void {\n this._queue = [];\n this._closeCurrent('clear', false);\n }\n\n private _showNow(next: RCSnackbarShowOptions): void {\n const duration = next.duration ?? this.duration;\n\n this._clearTimer();\n this.message = next.message;\n this.actionLabel = next.actionLabel ?? '';\n this._lastMessage = next.message;\n this.open = true;\n\n if (duration > 0) {\n this._timer = window.setTimeout(() => this._closeCurrent('timeout', true), duration);\n }\n }\n\n private _closeCurrent(reason: RCSnackbarCloseReason, showNext: boolean): void {\n if (!this.open) {\n return;\n }\n\n const message = this.message;\n\n this._clearTimer();\n this.open = false;\n this.message = '';\n this.actionLabel = '';\n\n this.dispatchEvent(\n new CustomEvent<RCSnackbarCloseDetail>('rc-snackbar-close', {\n bubbles: true,\n composed: true,\n detail: { reason, message },\n }),\n );\n\n if (showNext) {\n const next = this._queue.shift();\n\n if (next) {\n queueMicrotask(() => this._showNow(next));\n }\n }\n }\n\n private _handleAction(): void {\n if (!this.open) {\n return;\n }\n\n this.dispatchEvent(\n new CustomEvent<RCSnackbarActionDetail>('rc-snackbar-action', {\n bubbles: true,\n composed: true,\n detail: { message: this._lastMessage },\n }),\n );\n\n this._closeCurrent('action', true);\n }\n\n private _clearTimer(): void {\n window.clearTimeout(this._timer);\n this._timer = undefined;\n }\n}\n\nexport default RCSnackbar;\n"],"names":["snackbarStyles","css","_RCSnackbar","LitElement","value","oldValue","changed","html","message","next","reason","duration","showNext","RCSnackbar","__decorateClass","property"],"mappings":"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"}
@@ -0,0 +1,3 @@
1
+ import { R as a } from "./rc-snackbar-GsVuC2lu.js";
2
+ customElements.get("rc-snackbar") || customElements.define("rc-snackbar", a);
3
+ //# sourceMappingURL=rc-snackbar-define.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"rc-snackbar-define.js","sources":["../src/define.ts"],"sourcesContent":["import { RCSnackbar } from './index.js';\n\ncustomElements.get('rc-snackbar') || customElements.define('rc-snackbar', RCSnackbar);\n"],"names":["RCSnackbar"],"mappings":";AAEA,eAAe,IAAI,aAAa,KAAK,eAAe,OAAO,eAAeA,CAAU;"}
@@ -0,0 +1,5 @@
1
+ import { R as o } from "./rc-snackbar-GsVuC2lu.js";
2
+ export {
3
+ o as RCSnackbar
4
+ };
5
+ //# sourceMappingURL=rc-snackbar.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"rc-snackbar.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,2 @@
1
+ export { default as RCSnackbar } from './rc-snackbar.js';
2
+ export type { RCSnackbarActionDetail, RCSnackbarCloseDetail, RCSnackbarCloseReason, RCSnackbarQueuePolicy, RCSnackbarShowOptions, } from './rc-snackbar.js';
@@ -0,0 +1,134 @@
1
+ import { LitElement, PropertyValues } from 'lit';
2
+ declare global {
3
+ interface HTMLElementTagNameMap {
4
+ 'rc-snackbar': RCSnackbar;
5
+ }
6
+ interface HTMLElementEventMap {
7
+ 'rc-snackbar-action': CustomEvent<RCSnackbarActionDetail>;
8
+ 'rc-snackbar-close': CustomEvent<RCSnackbarCloseDetail>;
9
+ }
10
+ }
11
+ /** Snackbar queue behavior when `show()` is called while open. */
12
+ export type RCSnackbarQueuePolicy = 'queue' | 'replace';
13
+ /** Close reasons surfaced by `rc-snackbar-close`. */
14
+ export type RCSnackbarCloseReason = 'action' | 'api' | 'timeout' | 'replace' | 'clear';
15
+ /** Options accepted by `show()`. */
16
+ export interface RCSnackbarShowOptions {
17
+ /** Message text to announce. */
18
+ message: string;
19
+ /** Optional action button label. */
20
+ actionLabel?: string;
21
+ /** Auto-close duration in milliseconds. */
22
+ duration?: number;
23
+ }
24
+ /** Detail payload for `rc-snackbar-action`. */
25
+ export interface RCSnackbarActionDetail {
26
+ /** Message that was visible when the action was activated. */
27
+ message: string;
28
+ }
29
+ /** Detail payload for `rc-snackbar-close`. */
30
+ export interface RCSnackbarCloseDetail {
31
+ /** Close reason. */
32
+ reason: RCSnackbarCloseReason;
33
+ /** Message that closed. */
34
+ message: string;
35
+ }
36
+ /**
37
+ * Snackbar live-region host for brief status messages and optional actions.
38
+ *
39
+ * @see {@link https://richardcarls.github.io/rc-webcomponents/components/rc-snackbar rc-snackbar docs}
40
+ *
41
+ * @fires rc-snackbar-action - Fired when the action button is activated.
42
+ * @fires rc-snackbar-close - Fired after a visible snackbar closes.
43
+ *
44
+ * @csspart surface - Snackbar surface.
45
+ * @csspart message - Message text.
46
+ * @csspart action - Optional action button.
47
+ *
48
+ * @attr open - Whether a snackbar is currently visible. Host writes are silent.
49
+ * @attr default-open - Initial visible state for uncontrolled usage.
50
+ * @attr message - Visible snackbar message.
51
+ * @attr action-label - Optional action button label.
52
+ * @attr duration - Auto-close duration in milliseconds.
53
+ * @attr queue-policy - `queue` appends while open; `replace` closes the current message.
54
+ *
55
+ * @cssprop [--rc-snackbar-inset-inline=1rem] - Inline-axis inset from the viewport edge.
56
+ * @cssprop [--rc-snackbar-inset-block-end=1rem] - Block-end inset from the viewport edge, before
57
+ * the safe-area inset.
58
+ * @cssprop [--rc-snackbar-z-index=1000] - Stacking order.
59
+ * @cssprop [--rc-snackbar-gap=0.5rem] - Gap between the message and action.
60
+ * @cssprop [--rc-snackbar-min-block-size=3rem] - Minimum surface block size.
61
+ * @cssprop [--rc-snackbar-max-inline-size=30rem] - Maximum surface inline size.
62
+ * @cssprop [--rc-snackbar-padding-block=0.5rem] - Surface block-axis padding.
63
+ * @cssprop [--rc-snackbar-padding-inline=1rem] - Surface inline-axis padding.
64
+ * @cssprop [--rc-snackbar-border=1px solid CanvasText] - Surface border.
65
+ * @cssprop [--rc-snackbar-radius=0] - Surface border radius.
66
+ * @cssprop [--rc-snackbar-bg=Canvas] - Surface background.
67
+ * @cssprop [--rc-snackbar-color=CanvasText] - Surface text color.
68
+ * @cssprop [--rc-snackbar-shadow=none] - Surface box shadow.
69
+ * @cssprop [--rc-snackbar-action-border] - Action button border; defers to native button
70
+ * border when unset.
71
+ * @cssprop [--rc-snackbar-action-radius] - Action button border radius; defers to native button
72
+ * radius when unset.
73
+ * @cssprop [--rc-snackbar-action-padding-block] - Action button block-axis padding; defers to
74
+ * native button padding when unset.
75
+ * @cssprop [--rc-snackbar-action-padding-inline] - Action button inline-axis padding; defers to
76
+ * native button padding when unset.
77
+ * @cssprop [--rc-snackbar-action-bg] - Action button background; defers to native button
78
+ * background when unset.
79
+ * @cssprop [--rc-snackbar-action-color] - Action button text color; defers to native button
80
+ * color when unset.
81
+ * @cssprop [--rc-snackbar-action-font] - Action button font shorthand; defers to native button
82
+ * font when unset.
83
+ * @cssprop [--rc-snackbar-focus-ring] - Action button focus outline; defers to native focus
84
+ * styling when unset.
85
+ * @cssprop [--rc-snackbar-focus-ring-offset] - Action button focus outline offset; defers to
86
+ * native focus styling when unset.
87
+ */
88
+ export declare class RCSnackbar extends LitElement {
89
+ static styles: import('lit').CSSResult;
90
+ private _queue;
91
+ private _timer;
92
+ private _lastMessage;
93
+ private _open;
94
+ private _defaultOpen;
95
+ private _openInitialized;
96
+ /** Whether the snackbar is currently visible. Host writes are silent. */
97
+ get open(): boolean;
98
+ set open(value: boolean | undefined);
99
+ /** Initial visible state for uncontrolled usage, such as an already-queued
100
+ * message shown on first render. */
101
+ get defaultOpen(): boolean;
102
+ set defaultOpen(value: boolean);
103
+ /** Visible message text. */
104
+ message: string;
105
+ /** Optional action button label. */
106
+ actionLabel: string;
107
+ /** Auto-close duration in milliseconds. Set to 0 to keep open. */
108
+ duration: number;
109
+ /** Queue behavior for show calls while open. */
110
+ queuePolicy: RCSnackbarQueuePolicy;
111
+ disconnectedCallback(): void;
112
+ protected updated(changed: PropertyValues<this>): void;
113
+ protected render(): import('lit').TemplateResult<1>;
114
+ /**
115
+ * Shows a message or queues it according to `queuePolicy`.
116
+ *
117
+ * @example
118
+ * snackbar.show({
119
+ * message: 'Recipe saved',
120
+ * actionLabel: 'Undo',
121
+ * duration: 6000,
122
+ * });
123
+ */
124
+ show(message: string | RCSnackbarShowOptions): void;
125
+ /** Closes the current snackbar. */
126
+ close(reason?: RCSnackbarCloseReason): void;
127
+ /** Clears the current snackbar and all queued messages. */
128
+ clear(): void;
129
+ private _showNow;
130
+ private _closeCurrent;
131
+ private _handleAction;
132
+ private _clearTimer;
133
+ }
134
+ export default RCSnackbar;
@@ -0,0 +1,2 @@
1
+ export declare const snackbarStyles: import('lit').CSSResult;
2
+ export default snackbarStyles;
package/package.json ADDED
@@ -0,0 +1,62 @@
1
+ {
2
+ "name": "@rcarls/rc-snackbar",
3
+ "publishConfig": {
4
+ "access": "public"
5
+ },
6
+ "version": "0.4.0",
7
+ "description": "Snackbar live-region host for brief status messages and optional actions.",
8
+ "repository": {
9
+ "type": "git",
10
+ "url": "git+https://github.com/richardcarls/rc-webcomponents.git",
11
+ "directory": "packages/rc-snackbar"
12
+ },
13
+ "homepage": "https://richardcarls.github.io/rc-webcomponents/components/rc-snackbar",
14
+ "license": "MIT",
15
+ "type": "module",
16
+ "files": [
17
+ "dist"
18
+ ],
19
+ "module": "./dist/rc-snackbar.js",
20
+ "exports": {
21
+ ".": {
22
+ "import": {
23
+ "types": "./dist/types/packages/rc-snackbar/src/index.d.ts",
24
+ "default": "./dist/rc-snackbar.js"
25
+ }
26
+ },
27
+ "./define": {
28
+ "import": {
29
+ "types": "./dist/types/packages/rc-snackbar/src/define.d.ts",
30
+ "default": "./dist/rc-snackbar-define.js"
31
+ }
32
+ }
33
+ },
34
+ "types": "./dist/types/packages/rc-snackbar/src/index.d.ts",
35
+ "sideEffects": [
36
+ "./dist/rc-snackbar-define.js"
37
+ ],
38
+ "customElements": "dist/custom-elements.json",
39
+ "scripts": {
40
+ "build": "tsc && vite build && cem analyze",
41
+ "cem:analyze": "cem analyze",
42
+ "preview": "vite preview",
43
+ "test:browser": "vitest --run",
44
+ "test:browser:chrome": "vitest --run --project=chromium",
45
+ "test:browser:firefox": "vitest --run --project=firefox"
46
+ },
47
+ "devDependencies": {
48
+ "@custom-elements-manifest/analyzer": "0.11.0",
49
+ "@vitest/browser-playwright": "4.1.5",
50
+ "lit": "^3.0.0",
51
+ "playwright": "^1.56.0",
52
+ "rollup": "^4.60.2",
53
+ "typescript": "~5.9.3",
54
+ "vite": "^7.1.7",
55
+ "vite-plugin-dts": "^4.5.4",
56
+ "vitest": "^4.0.6",
57
+ "vitest-browser-lit": "^1.0.1"
58
+ },
59
+ "peerDependencies": {
60
+ "lit": "^3.0.0"
61
+ }
62
+ }