@justeattakeaway/pie-notification 0.5.2 → 0.5.3

package/dist/index.d.ts

@@ -230,7 +230,7 @@ export declare class PieNotification extends LitElement implements NotificationP
      * @private
      */
     private renderActionButton;
-    render(): typeof nothing | TemplateResult;
+    render(): TemplateResult | typeof nothing;
 }
 
 export declare const variants: readonly ["neutral", "neutral-alternative", "info", "success", "warning", "error"];

package/dist/index.js

@@ -2,13 +2,13 @@ import { unsafeCSS as _, LitElement as N, nothing as a } from "lit";
 import { html as l, unsafeStatic as O } from "lit/static-html.js";
 import { validPropertyValues as m, defineCustomElement as x, dispatchCustomEvent as u } from "@justeattakeaway/pie-webc-core";
 import { property as s, queryAssignedElements as E, state as g } from "lit/decorators.js";
-import "@justeattakeaway/pie-icon-button";
-import "@justeattakeaway/pie-icons-webc/IconClose";
-import "@justeattakeaway/pie-icons-webc/IconInfoCircle";
-import "@justeattakeaway/pie-icons-webc/IconAlertCircle";
-import "@justeattakeaway/pie-icons-webc/IconAlertTriangle";
-import "@justeattakeaway/pie-icons-webc/IconCheckCircle";
 import "@justeattakeaway/pie-button";
+import "@justeattakeaway/pie-icon-button";
+import "@justeattakeaway/pie-icons-webc/dist/IconAlertCircle.js";
+import "@justeattakeaway/pie-icons-webc/dist/IconAlertTriangle.js";
+import "@justeattakeaway/pie-icons-webc/dist/IconCheckCircle.js";
+import "@justeattakeaway/pie-icons-webc/dist/IconClose.js";
+import "@justeattakeaway/pie-icons-webc/dist/IconInfoCircle.js";
 const k = ["neutral", "neutral-alternative", "info", "success", "warning", "error"], A = ["h2", "h3", "h4", "h5", "h6"], o = "pie-notification", h = "c-notification", z = `${o}-close`, S = `${o}-open`, V = `${o}-leading-action-click`, w = `${o}-supporting-action-click`, T = `*,*:after,*:before{box-sizing:inherit}.c-notification{--notification-border-radius: var(--dt-radius-rounded-c);--notification-background-color: var(--dt-color-container-subtle);--notification-direction: column;--notification-icon-size-override: 22px;--notification-heading-font-size: calc(var(--dt-font-size-20) * 1px);--notification-heading-line-height: calc(var(--dt-font-size-20-line-height) * 1px);--notification-font-size: calc(var(--dt-font-size-16) * 1px);--notification-line-height: calc(var(--dt-font-size-16-line-height) * 1px);--notification-icon-fill: var(--dt-color-content-default);padding:var(--dt-spacing-d);border-radius:var(--notification-border-radius);background-color:var(--notification-background-color);position:relative;display:flex;flex-direction:var(--notification-direction);gap:var(--dt-spacing-d);font-size:var(--notification-font-size);line-height:var(--notification-line-height)}.c-notification h1,.c-notification h2,.c-notification h3,.c-notification h4,.c-notification h5,.c-notification h6{margin:0;font-size:var(--notification-heading-font-size);line-height:var(--notification-heading-line-height)}.c-notification[isCompact]{--notification-direction: row}.c-notification[variant=neutral-alternative]{--notification-background-color: var(--dt-color-container-default)}.c-notification[variant=info]{--notification-background-color: var(--dt-color-support-info-02);--notification-icon-fill: var(--dt-color-blue)}.c-notification[variant=success]{--notification-background-color: var(--dt-color-support-positive-02)}.c-notification[variant=warning]{--notification-background-color: var(--dt-color-support-warning-02)}.c-notification[variant=error]{--notification-background-color: var(--dt-color-support-error-02);--notification-icon-fill: var(--dt-color-red)}.c-notification-content-section{display:flex;flex-direction:row}.c-notification-content-section article[hasGutter]{padding-inline-end:var(--dt-spacing-e)}.c-notification-content-section .has-icon{display:block ruby;margin-inline-end:var(--dt-spacing-c)}.c-notification-heading-icon{padding-block-start:var(--dt-spacing-a);color:var(--notification-icon-fill)}.c-notification-icon-close{position:absolute;inset-block-start:var(--dt-spacing-b);inset-inline-end:var(--dt-spacing-b)}.c-notification-footer{display:flex;flex-direction:row;justify-content:flex-end;gap:var(--dt-spacing-d)}.c-notification-footer[isCompact]{align-self:flex-end}@media (max-width: 640px){.c-notification-footer[isStacked]{flex-direction:column}}
 `;
 var B = Object.defineProperty, D = Object.getOwnPropertyDescriptor, e = (f, t, i, c) => {
@@ -230,13 +230,13 @@ class n extends N {
                 ${r && !d ? this.renderCloseButton() : a}
 
                 <section class="${h}-content-section">
-                    ${C ? a : this.renderIcon(t, p, $)}    
+                    ${C ? a : this.renderIcon(t, p, $)}
                     <article ?hasGutter="${y}">
                         ${i ? this.renderNotificationHeading(i, O(c)) : a}
                         <slot></slot>
                     </article>
                 </section>
-                
+
                 ${v ? this.renderFooter(v, I) : a}
             </div>` : a;
   }

package/dist/react.d.ts

@@ -233,7 +233,7 @@ declare class PieNotification_2 extends LitElement implements NotificationProps
      * @private
      */
     private renderActionButton;
-    render(): typeof nothing | TemplateResult;
+    render(): TemplateResult | typeof nothing;
 }
 
 declare type PieNotificationEvents = {

package/dist/react.js

@@ -6,13 +6,13 @@ import "lit";
 import "lit/static-html.js";
 import "@justeattakeaway/pie-webc-core";
 import "lit/decorators.js";
-import "@justeattakeaway/pie-icon-button";
-import "@justeattakeaway/pie-icons-webc/IconClose";
-import "@justeattakeaway/pie-icons-webc/IconInfoCircle";
-import "@justeattakeaway/pie-icons-webc/IconAlertCircle";
-import "@justeattakeaway/pie-icons-webc/IconAlertTriangle";
-import "@justeattakeaway/pie-icons-webc/IconCheckCircle";
 import "@justeattakeaway/pie-button";
+import "@justeattakeaway/pie-icon-button";
+import "@justeattakeaway/pie-icons-webc/dist/IconAlertCircle.js";
+import "@justeattakeaway/pie-icons-webc/dist/IconAlertTriangle.js";
+import "@justeattakeaway/pie-icons-webc/dist/IconCheckCircle.js";
+import "@justeattakeaway/pie-icons-webc/dist/IconClose.js";
+import "@justeattakeaway/pie-icons-webc/dist/IconInfoCircle.js";
 const n = o({
   displayName: "PieNotification",
   elementClass: t,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@justeattakeaway/pie-notification",
   "description": "PIE Design System Notification built using Web Components",
-  "version": "0.5.2",
+  "version": "0.5.3",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -36,14 +36,14 @@
   "license": "Apache-2.0",
   "devDependencies": {
     "@custom-elements-manifest/analyzer": "0.9.0",
-    "@justeattakeaway/pie-components-config": "0.15.0",
+    "@justeattakeaway/pie-components-config": "0.16.0",
     "@justeattakeaway/pie-wrapper-react": "0.14.0",
     "cem-plugin-module-file-extensions": "0.0.5"
   },
   "dependencies": {
-    "@justeattakeaway/pie-icon-button": "0.28.2",
-    "@justeattakeaway/pie-icons-webc": "0.21.0",
-    "@justeattakeaway/pie-webc-core": "0.21.0"
+    "@justeattakeaway/pie-icon-button": "0.28.3",
+    "@justeattakeaway/pie-icons-webc": "0.22.0",
+    "@justeattakeaway/pie-webc-core": "0.21.1"
   },
   "volta": {
     "extends": "../../../package.json"

package/src/index.ts

@@ -22,13 +22,13 @@ import {
 } from './defs';
 import styles from './notification.scss?inline';
 
-import '@justeattakeaway/pie-icon-button';
-import '@justeattakeaway/pie-icons-webc/IconClose';
-import '@justeattakeaway/pie-icons-webc/IconInfoCircle';
-import '@justeattakeaway/pie-icons-webc/IconAlertCircle';
-import '@justeattakeaway/pie-icons-webc/IconAlertTriangle';
-import '@justeattakeaway/pie-icons-webc/IconCheckCircle';
 import '@justeattakeaway/pie-button';
+import '@justeattakeaway/pie-icon-button';
+import '@justeattakeaway/pie-icons-webc/dist/IconAlertCircle.js';
+import '@justeattakeaway/pie-icons-webc/dist/IconAlertTriangle.js';
+import '@justeattakeaway/pie-icons-webc/dist/IconCheckCircle.js';
+import '@justeattakeaway/pie-icons-webc/dist/IconClose.js';
+import '@justeattakeaway/pie-icons-webc/dist/IconInfoCircle.js';
 
 // Valid values available to consumers
 export * from './defs';
@@ -345,13 +345,13 @@ export class PieNotification extends LitElement implements NotificationProps {
                 ${isDismissible && !isCompact ? this.renderCloseButton() : nothing}
 
                 <section class="${componentClass}-content-section">
-                    ${!hideIcon ? this.renderIcon(variant, _hasExternalIcon, _hasIconClass) : nothing}    
+                    ${!hideIcon ? this.renderIcon(variant, _hasExternalIcon, _hasIconClass) : nothing}
                     <article ?hasGutter="${_hasContentGutter}">
                         ${heading ? this.renderNotificationHeading(heading, unsafeStatic(headingLevel)) : nothing}
                         <slot></slot>
                     </article>
                 </section>
-                
+
                 ${leadingAction ? this.renderFooter(leadingAction, supportingAction) : nothing}
             </div>`;
     }