@justeattakeaway/pie-toast-provider 0.4.2 → 0.5.1

package/custom-elements.json

@@ -16,9 +16,9 @@
           "kind": "variable",
           "name": "PRIORITY_ORDER",
           "type": {
-            "text": "{\n    'error-actionable': 1,\n    error: 2,\n    'warning-actionable': 3,\n    'success-actionable': 4,\n    'info-actionable': 5,\n    'neutral-actionable': 6,\n    warning: 7,\n    success: 8,\n    info: 9,\n    neutral: 10,\n}"
+            "text": "{\r\n    'error-actionable': 1,\r\n    error: 2,\r\n    'warning-actionable': 3,\r\n    'success-actionable': 4,\r\n    'info-actionable': 5,\r\n    'neutral-actionable': 6,\r\n    warning: 7,\r\n    success: 8,\r\n    info: 9,\r\n    neutral: 10,\r\n}"
           },
-          "default": "{\n    'error-actionable': 1,\n    error: 2,\n    'warning-actionable': 3,\n    'success-actionable': 4,\n    'info-actionable': 5,\n    'neutral-actionable': 6,\n    warning: 7,\n    success: 8,\n    info: 9,\n    neutral: 10,\n}"
+          "default": "{\r\n    'error-actionable': 1,\r\n    error: 2,\r\n    'warning-actionable': 3,\r\n    'success-actionable': 4,\r\n    'info-actionable': 5,\r\n    'neutral-actionable': 6,\r\n    warning: 7,\r\n    success: 8,\r\n    info: 9,\r\n    neutral: 10,\r\n}"
         },
         {
           "kind": "variable",
@@ -26,7 +26,7 @@
           "type": {
             "text": "DefaultProps"
           },
-          "default": "{\n    options: {},\n}"
+          "default": "{\r\n    options: {},\r\n}"
         },
         {
           "kind": "variable",
@@ -168,7 +168,7 @@
               "kind": "method",
               "name": "clearToasts",
               "privacy": "public",
-              "description": "\nClears all toasts from the queue and dismisses the currently visible toast."
+              "description": "\r\nClears all toasts from the queue and dismisses the currently visible toast."
             }
           ],
           "events": [
@@ -237,7 +237,7 @@
           "type": {
             "text": "object"
           },
-          "default": "{\n    _getToastProvider (): PieToastProvider | null {\n        const toastProviders = document.querySelectorAll('pie-toast-provider');\n\n        if (toastProviders.length === 0) {\n            console.error('The pie-toast component requires a pie-toast-provider element present in the DOM.');\n            return null;\n        }\n\n        if (toastProviders.length > 1) {\n            console.error('Multiple pie-toast-provider are found in the DOM. Only one provider is supported currently and should be registered at the root of the app.');\n            return null;\n        }\n\n        return toastProviders[0];\n    },\n    create (toast: ExtendedToastProps) {\n        const toastProvider = this._getToastProvider();\n        if (!toastProvider) return;\n\n        toastProvider.createToast(toast);\n    },\n    clearAll () {\n        const toastProvider = this._getToastProvider();\n        if (!toastProvider) return;\n\n        toastProvider.clearToasts();\n    },\n}",
+          "default": "{\r\n    _getToastProvider (): PieToastProvider | null {\r\n        const toastProviders = document.querySelectorAll('pie-toast-provider');\r\n\r\n        if (toastProviders.length === 0) {\r\n            console.error('The pie-toast component requires a pie-toast-provider element present in the DOM.');\r\n            return null;\r\n        }\r\n\r\n        if (toastProviders.length > 1) {\r\n            console.error('Multiple pie-toast-provider are found in the DOM. Only one provider is supported currently and should be registered at the root of the app.');\r\n            return null;\r\n        }\r\n\r\n        return toastProviders[0];\r\n    },\r\n    create (toast: ExtendedToastProps) {\r\n        const toastProvider = this._getToastProvider();\r\n        if (!toastProvider) return;\r\n\r\n        toastProvider.createToast(toast);\r\n    },\r\n    clearAll () {\r\n        const toastProvider = this._getToastProvider();\r\n        if (!toastProvider) return;\r\n\r\n        toastProvider.clearToasts();\r\n    },\r\n}",
           "description": "Singleton toaster interface for global access."
         }
       ],

package/dist/index.js

@@ -1,22 +1,16 @@
-import { LitElement as m, nothing as T, html as u, unsafeCSS as g } from "lit";
-import { property as f, state as v } from "lit/decorators.js";
-import { ifDefined as y } from "lit/directives/if-defined.js";
-import { RtlMixin as P, dispatchCustomEvent as x, defineCustomElement as $ } from "@justeattakeaway/pie-webc-core";
+import { LitElement as f, nothing as _, html as u, unsafeCSS as T } from "lit";
+import { state as v, property as g } from "lit/decorators.js";
+import { ifDefined as m } from "lit/directives/if-defined.js";
+import { RtlMixin as P, dispatchCustomEvent as y, safeCustomElement as b } from "@justeattakeaway/pie-webc-core";
 import { defaultProps as h } from "@justeattakeaway/pie-toast";
-var b = Object.defineProperty, E = (o, t, e, r) => {
-  for (var s = void 0, i = o.length - 1, n; i >= 0; i--)
-    (n = o[i]) && (s = n(t, e, s) || s);
-  return s && b(t, e, s), s;
-};
-class _ extends m {
-  constructor() {
-    super(...arguments), this.v = "0.4.2";
+const p = class p extends f {
+  willUpdate() {
+    this.getAttribute("v") || this.setAttribute("v", p.v);
   }
-}
-E([
-  f({ type: String, reflect: !0 })
-], _.prototype, "v");
-const A = "*,*:after,*:before{box-sizing:inherit}:host{--toast-provider-z-index: var(--dt-z-index-toast)}.c-toast-provider{--toast-provider-offset: var(--dt-spacing-d);position:absolute;inset-inline-start:var(--toast-provider-offset);inset-block-end:var(--toast-provider-offset);z-index:var(--toast-provider-z-index)}@media (min-width: 769px){.c-toast-provider{--toast-offset: var(--dt-spacing-e)}}", O = {
+};
+p.v = "0.5.1";
+let c = p;
+const x = "*,*:after,*:before{box-sizing:inherit}:host{--toast-provider-z-index: var(--dt-z-index-toast)}.c-toast-provider{--toast-provider-offset: var(--dt-spacing-d);position:absolute;inset-inline-start:var(--toast-provider-offset);inset-block-end:var(--toast-provider-offset);z-index:var(--toast-provider-z-index)}@media (min-width: 769px){.c-toast-provider{--toast-offset: var(--dt-spacing-e)}}", A = {
   "error-actionable": 1,
   error: 2,
   "warning-actionable": 3,
@@ -27,38 +21,38 @@ const A = "*,*:after,*:before{box-sizing:inherit}:host{--toast-provider-z-index:
   success: 8,
   info: 9,
   neutral: 10
-}, D = {
+}, O = {
   options: {}
-}, S = "pie-toast-provider-queue-update", k = {
+}, $ = "pie-toast-provider-queue-update", U = {
   _getToastProvider() {
-    const o = document.querySelectorAll("pie-toast-provider");
-    return o.length === 0 ? (console.error("The pie-toast component requires a pie-toast-provider element present in the DOM."), null) : o.length > 1 ? (console.error("Multiple pie-toast-provider are found in the DOM. Only one provider is supported currently and should be registered at the root of the app."), null) : o[0];
+    const t = document.querySelectorAll("pie-toast-provider");
+    return t.length === 0 ? (console.error("The pie-toast component requires a pie-toast-provider element present in the DOM."), null) : t.length > 1 ? (console.error("Multiple pie-toast-provider are found in the DOM. Only one provider is supported currently and should be registered at the root of the app."), null) : t[0];
   },
-  create(o) {
-    const t = this._getToastProvider();
-    t && t.createToast(o);
+  create(t) {
+    const e = this._getToastProvider();
+    e && e.createToast(t);
   },
   clearAll() {
-    const o = this._getToastProvider();
-    o && o.clearToasts();
+    const t = this._getToastProvider();
+    t && t.clearToasts();
   }
 };
-var w = Object.defineProperty, p = (o, t, e, r) => {
-  for (var s = void 0, i = o.length - 1, n; i >= 0; i--)
-    (n = o[i]) && (s = n(t, e, s) || s);
-  return s && w(t, e, s), s;
+var w = Object.defineProperty, D = Object.getOwnPropertyDescriptor, l = (t, e, o, i) => {
+  for (var s = i > 1 ? void 0 : i ? D(e, o) : e, n = t.length - 1, r; n >= 0; n--)
+    (r = t[n]) && (s = (i ? r(e, o, s) : r(s)) || s);
+  return i && s && w(e, o, s), s;
 };
-const C = "pie-toast-provider", l = class l extends P(_) {
+let a = class extends P(c) {
   constructor() {
-    super(...arguments), this._toasts = [], this._currentToast = null, this.options = D.options;
+    super(...arguments), this._toasts = [], this._currentToast = null, this.options = O.options;
   }
   updated(t) {
     t.has("_toasts") && this._dispatchQueueUpdateEvent();
   }
   _dispatchQueueUpdateEvent() {
-    x(
+    y(
       this,
-      S,
+      $,
       this._toasts
     );
   }
@@ -69,8 +63,8 @@ const C = "pie-toast-provider", l = class l extends P(_) {
    * @returns {number} - The priority based on the variant and action.
    */
   getPriority(t = h.variant, e = !1) {
-    const r = `${t}${e ? "-actionable" : ""}`;
-    return O[r];
+    const o = `${t}${e ? "-actionable" : ""}`;
+    return A[o];
   }
   /**
    * Handles the dismissal of the current toast and displays the next one in the queue (if any).
@@ -97,10 +91,10 @@ const C = "pie-toast-provider", l = class l extends P(_) {
    */
   createToast(t) {
     const e = { ...h, ...this.options, ...t };
-    this._toasts = [...this._toasts, e].sort((r, s) => {
-      var c, d;
-      const i = this.getPriority(s.variant, !!((c = s.leadingAction) != null && c.text));
-      return this.getPriority(r.variant, !!((d = r.leadingAction) != null && d.text)) - i;
+    this._toasts = [...this._toasts, e].sort((o, i) => {
+      var r, d;
+      const s = this.getPriority(i.variant, !!((r = i.leadingAction) != null && r.text));
+      return this.getPriority(o.variant, !!((d = o.leadingAction) != null && d.text)) - s;
     }), this._currentToast || this._showNextToast();
   }
   /**
@@ -119,12 +113,12 @@ const C = "pie-toast-provider", l = class l extends P(_) {
             ${t && u`
                 <pie-toast
                     message="${t.message}"
-                    variant="${y(t.variant)}"
+                    variant="${m(t.variant)}"
                     ?isStrong="${t.isStrong}"
                     ?isDismissible="${t.isDismissible}"
                     ?isMultiline="${t.isMultiline}"
                     .leadingAction="${t.leadingAction}"
-                    .duration="${typeof t.duration > "u" ? T : t.duration}"
+                    .duration="${typeof t.duration > "u" ? _ : t.duration}"
                     @pie-toast-close="${e}"
                     @pie-toast-open="${t.onPieToastOpen}"
                     @pie-toast-leading-action-click="${t.onPieToastLeadingActionClick}">
@@ -134,22 +128,23 @@ const C = "pie-toast-provider", l = class l extends P(_) {
         `;
   }
 };
-l.styles = g(A);
-let a = l;
-p([
+a.styles = T(x);
+l([
   v()
-], a.prototype, "_toasts");
-p([
+], a.prototype, "_toasts", 2);
+l([
   v()
-], a.prototype, "_currentToast");
-p([
-  f({ type: Object })
-], a.prototype, "options");
-$(C, a);
+], a.prototype, "_currentToast", 2);
+l([
+  g({ type: Object })
+], a.prototype, "options", 2);
+a = l([
+  b("pie-toast-provider")
+], a);
 export {
-  S as ON_TOAST_PROVIDER_QUEUE_UPDATE_EVENT,
-  O as PRIORITY_ORDER,
+  $ as ON_TOAST_PROVIDER_QUEUE_UPDATE_EVENT,
+  A as PRIORITY_ORDER,
   a as PieToastProvider,
-  D as defaultProps,
-  k as toaster
+  O as defaultProps,
+  U as toaster
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@justeattakeaway/pie-toast-provider",
   "description": "PIE Design System Toast Provider built using Web Components",
-  "version": "0.4.2",
+  "version": "0.5.1",
   "repository": {
     "type": "git",
     "url": "https://github.com/justeattakeaway/pie",
@@ -45,8 +45,8 @@
     "cem-plugin-module-file-extensions": "0.0.5"
   },
   "dependencies": {
-    "@justeattakeaway/pie-toast": "0.8.4",
-    "@justeattakeaway/pie-webc-core": "0.25.1"
+    "@justeattakeaway/pie-toast": "0.9.1",
+    "@justeattakeaway/pie-webc-core": "0.26.0"
   },
   "volta": {
     "extends": "../../../package.json"

package/src/index.ts

@@ -9,8 +9,8 @@ import { state, property } from 'lit/decorators.js';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import {
     RtlMixin,
-    defineCustomElement,
     dispatchCustomEvent,
+    safeCustomElement,
 } from '@justeattakeaway/pie-webc-core';
 import { defaultProps as toastDefaultProps } from '@justeattakeaway/pie-toast';
 import styles from './toast-provider.scss?inline';
@@ -33,6 +33,7 @@ const componentSelector = 'pie-toast-provider';
  * @tagname pie-toast-provider
  * @event {CustomEvent} pie-toast-provider-queue-update - when a toast is added or removed from the queue.
  */
+@safeCustomElement('pie-toast-provider')
 export class PieToastProvider extends RtlMixin(PieElement) implements ToastProviderProps {
     @state()
     private _toasts: ExtendedToastProps[] = [];
@@ -147,8 +148,6 @@ export class PieToastProvider extends RtlMixin(PieElement) implements ToastProvi
     static styles = unsafeCSS(styles);
 }
 
-defineCustomElement(componentSelector, PieToastProvider);
-
 declare global {
     interface HTMLElementTagNameMap {
         [componentSelector]: PieToastProvider;