lit-toaster 0.2.0 → 0.2.2

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 CHANGED
@@ -62,7 +62,9 @@ export class MyElement extends LitElement {
62
62
  type="button"
63
63
  @click=${(): void =>
64
64
  toast.show("Here's your toast - peace and much love.")}
65
- ></button>
65
+ >
66
+ Create toast
67
+ </button>
66
68
  </div>`;
67
69
  }
68
70
 
@@ -82,9 +84,9 @@ declare global {
82
84
 
83
85
  ## Toaster element properties
84
86
 
85
- | Name | Attribute |
86
- | ------------ | --------- |
87
- | `queueLimit` | false |
87
+ | Name | Attribute |
88
+ | ------------- | --------- |
89
+ | `toastsLimit` | false |
88
90
 
89
91
  ## Documentation
90
92
 
package/dist/index.d.ts CHANGED
@@ -13,34 +13,34 @@ type Toast = {
13
13
  state: ToastState;
14
14
  };
15
15
  declare enum ToastEmitterEvent {
16
- QUEUE_LIMIT_CHANGE = "queue-limit-change",
16
+ TOASTS_LIMIT_CHANGE = "toasts-limit-change",
17
17
  TOASTS_CHANGE = "toasts-change"
18
18
  }
19
19
 
20
20
  declare class ToastEmitter extends EventTarget {
21
- private _queueLimit;
21
+ private _toastsLimit;
22
22
  private _toasts;
23
23
  get toasts(): Toast[];
24
- set queueLimit(value: string | number);
24
+ set toastsLimit(value: string | number);
25
25
  show(message: string, duration?: number, type?: ToastKind, position?: ToastPosition): void;
26
26
  remove(toast: Toast): void;
27
- private emitQueueLimitChange;
27
+ private emitToastsLimitChange;
28
28
  private emitToastsChange;
29
29
  }
30
30
  declare const toast: ToastEmitter;
31
31
 
32
32
  declare class ToasterElement extends LitElement {
33
- set queueLimit(value: number | undefined);
34
- get queueLimit(): number | undefined;
33
+ set toastsLimit(value: number | undefined);
34
+ get toastsLimit(): number | undefined;
35
35
  private _toastsList;
36
- private _queueLimit?;
36
+ private _toastsLimit?;
37
37
  connectedCallback(): void;
38
38
  disconnectedCallback(): void;
39
39
  private get groupedToasts();
40
40
  render(): TemplateResult;
41
41
  private getToastIcon;
42
42
  private dismiss;
43
- private onQueueLimitChange;
43
+ private onToastsLimitChange;
44
44
  private onToastsChange;
45
45
  static styles: lit.CSSResult;
46
46
  }
@@ -1,4 +1,4 @@
1
- /*! lit-toaster v0.2.0 Copyright (c) 2025 Bryson Ward and contributors MIT License*/
1
+ /*! lit-toaster v0.2.2 Copyright (c) 2025 Bryson Ward and contributors MIT License*/
2
2
  import { css, LitElement, html } from 'lit';
3
3
  import { property, state, customElement } from 'lit/decorators.js';
4
4
 
@@ -15,7 +15,7 @@ typeof SuppressedError === "function" ? SuppressedError : function (error, suppr
15
15
 
16
16
  var ToastEmitterEvent;
17
17
  (function (ToastEmitterEvent) {
18
- ToastEmitterEvent["QUEUE_LIMIT_CHANGE"] = "queue-limit-change";
18
+ ToastEmitterEvent["TOASTS_LIMIT_CHANGE"] = "toasts-limit-change";
19
19
  ToastEmitterEvent["TOASTS_CHANGE"] = "toasts-change";
20
20
  })(ToastEmitterEvent || (ToastEmitterEvent = {}));
21
21
 
@@ -38,28 +38,28 @@ const GUID = (() => {
38
38
  class ToastEmitter extends EventTarget {
39
39
  constructor() {
40
40
  super(...arguments);
41
- this._queueLimit = DEFAULT_TOASTS_LIMIT;
41
+ this._toastsLimit = DEFAULT_TOASTS_LIMIT;
42
42
  this._toasts = [];
43
43
  }
44
44
  get toasts() {
45
45
  return this._toasts;
46
46
  }
47
- set queueLimit(value) {
48
- let updatedQueueLimit = this._queueLimit;
47
+ set toastsLimit(value) {
48
+ let updatedToastsLimit = this._toastsLimit;
49
49
  if (typeof value === 'number') {
50
- updatedQueueLimit = value;
50
+ updatedToastsLimit = value;
51
51
  }
52
52
  if (typeof value === 'string') {
53
53
  const valueToNum = Number(value);
54
54
  if (!isNaN(valueToNum)) {
55
- updatedQueueLimit = valueToNum;
55
+ updatedToastsLimit = valueToNum;
56
56
  }
57
57
  }
58
- this._queueLimit = Math.max(0, updatedQueueLimit);
59
- this.emitQueueLimitChange();
58
+ this._toastsLimit = Math.max(0, updatedToastsLimit);
59
+ this.emitToastsLimitChange();
60
60
  }
61
61
  show(message, duration = 7000, type = 'success', position = 'top-center') {
62
- if (this._queueLimit > 0 && this._toasts.length + 1 >= this._queueLimit) {
62
+ if (this._toastsLimit > 0 && this._toasts.length + 1 >= this._toastsLimit) {
63
63
  const existingWarningToast = this._toasts.find((t) => t.type === 'warning' &&
64
64
  t.message.toLowerCase().includes('too many notifications'));
65
65
  if (!existingWarningToast) {
@@ -71,7 +71,7 @@ class ToastEmitter extends EventTarget {
71
71
  position: 'bottom-center',
72
72
  state: 'enter',
73
73
  };
74
- this._toasts = [...this._toasts, warningToast];
74
+ this._toasts = [warningToast, ...this._toasts];
75
75
  this.emitToastsChange();
76
76
  setTimeout(() => this.remove(warningToast), duration);
77
77
  }
@@ -104,9 +104,9 @@ class ToastEmitter extends EventTarget {
104
104
  this.emitToastsChange();
105
105
  }, TOAST_ANIMATION_DURATION);
106
106
  }
107
- emitQueueLimitChange() {
108
- this.dispatchEvent(new CustomEvent(ToastEmitterEvent.QUEUE_LIMIT_CHANGE, {
109
- detail: this._queueLimit,
107
+ emitToastsLimitChange() {
108
+ this.dispatchEvent(new CustomEvent(ToastEmitterEvent.TOASTS_LIMIT_CHANGE, {
109
+ detail: this._toastsLimit,
110
110
  }));
111
111
  }
112
112
  emitToastsChange() {
@@ -121,10 +121,10 @@ let ToasterElement = class ToasterElement extends LitElement {
121
121
  constructor() {
122
122
  super(...arguments);
123
123
  this._toastsList = [];
124
- this.onQueueLimitChange = (event) => {
124
+ this.onToastsLimitChange = (event) => {
125
125
  if (event instanceof CustomEvent) {
126
- if (event.detail !== undefined && this._queueLimit !== event.detail) {
127
- this._queueLimit = event.detail;
126
+ if (event.detail !== undefined && this._toastsLimit !== event.detail) {
127
+ this._toastsLimit = event.detail;
128
128
  this.requestUpdate();
129
129
  }
130
130
  }
@@ -136,23 +136,23 @@ let ToasterElement = class ToasterElement extends LitElement {
136
136
  }
137
137
  };
138
138
  }
139
- set queueLimit(value) {
140
- this._queueLimit = value;
139
+ set toastsLimit(value) {
140
+ this._toastsLimit = value;
141
141
  if (value !== undefined) {
142
- toast.queueLimit = value;
142
+ toast.toastsLimit = value;
143
143
  }
144
144
  }
145
- get queueLimit() {
146
- return this._queueLimit;
145
+ get toastsLimit() {
146
+ return this._toastsLimit;
147
147
  }
148
148
  connectedCallback() {
149
149
  super.connectedCallback();
150
- toast.addEventListener(ToastEmitterEvent.QUEUE_LIMIT_CHANGE, this.onQueueLimitChange);
150
+ toast.addEventListener(ToastEmitterEvent.TOASTS_LIMIT_CHANGE, this.onToastsLimitChange);
151
151
  toast.addEventListener(ToastEmitterEvent.TOASTS_CHANGE, this.onToastsChange);
152
152
  }
153
153
  disconnectedCallback() {
154
154
  super.disconnectedCallback();
155
- toast.removeEventListener(ToastEmitterEvent.QUEUE_LIMIT_CHANGE, this.onQueueLimitChange);
155
+ toast.removeEventListener(ToastEmitterEvent.TOASTS_LIMIT_CHANGE, this.onToastsLimitChange);
156
156
  toast.removeEventListener(ToastEmitterEvent.TOASTS_CHANGE, this.onToastsChange);
157
157
  }
158
158
  get groupedToasts() {
@@ -398,13 +398,13 @@ ToasterElement.styles = css `
398
398
  `;
399
399
  __decorate([
400
400
  property({ type: Number, attribute: false })
401
- ], ToasterElement.prototype, "queueLimit", null);
401
+ ], ToasterElement.prototype, "toastsLimit", null);
402
402
  __decorate([
403
403
  state()
404
404
  ], ToasterElement.prototype, "_toastsList", void 0);
405
405
  __decorate([
406
406
  state()
407
- ], ToasterElement.prototype, "_queueLimit", void 0);
407
+ ], ToasterElement.prototype, "_toastsLimit", void 0);
408
408
  ToasterElement = __decorate([
409
409
  customElement('app-toaster')
410
410
  ], ToasterElement);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "lit-toaster",
3
- "version": "0.2.0",
3
+ "version": "0.2.2",
4
4
  "engines": {
5
5
  "node": ">=20",
6
6
  "npm": ">=9.6.3",
@@ -72,18 +72,18 @@
72
72
  "eslint-plugin-lit": "^2.1.1",
73
73
  "eslint-plugin-prettier": "^5.5.4",
74
74
  "eslint-plugin-security": "^3.0.1",
75
- "jsdom": "^26.1.0",
75
+ "jsdom": "^27.0.0",
76
76
  "prettier": "^3.6.2",
77
77
  "release-it": "^19.0.4",
78
- "rollup": "^4.50.1",
78
+ "rollup": "^4.50.2",
79
79
  "rollup-plugin-cleanup": "^3.2.1",
80
80
  "rollup-plugin-delete": "^3.0.1",
81
81
  "rollup-plugin-dts": "^6.2.3",
82
82
  "size-limit": "^11.2.0",
83
- "typedoc": "^0.28.12",
83
+ "typedoc": "^0.28.13",
84
84
  "typedoc-plugin-markdown": "^4.8.1",
85
85
  "typescript": "^5.9.2",
86
- "typescript-eslint": "^8.43.0",
86
+ "typescript-eslint": "^8.44.0",
87
87
  "vitest": "^3.2.4"
88
88
  },
89
89
  "release-it": {