@carbon/web-components 2.40.1 → 2.41.0

package/es-custom/components/notification/toast-notification.d.ts

@@ -1,5 +1,5 @@
 /**
- * Copyright IBM Corp. 2019, 2023
+ * Copyright IBM Corp. 2019, 2025
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.

package/es-custom/components/notification/toast-notification.js

@@ -15,7 +15,7 @@ import CDSInlineNotification from './inline-notification.js';
 import styles from './toast-notification.scss.js';
 
 /**
- * Copyright IBM Corp. 2019, 2023
+ * Copyright IBM Corp. 2019, 2025
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -43,22 +43,20 @@ let CDSToastNotification = class CDSToastNotification extends CDSInlineNotificat
     _renderText() {
         const { caption, subtitle, title, _type: type } = this;
         return html `
-      <div class="${prefix}--${type}-notification__details">
-        <div class="${prefix}--${type}-notification__title">
-          ${title}<slot name="title"></slot>
-        </div>
-        <div class="${prefix}--${type}-notification__subtitle">
-          ${subtitle}<slot name="subtitle"></slot>
-        </div>
-        ${caption || this.querySelector('[slot="caption"]')
+      <div class="${prefix}--${type}-notification__title">
+        ${title}<slot name="title"></slot>
+      </div>
+      <div class="${prefix}--${type}-notification__subtitle">
+        ${subtitle}<slot name="subtitle"></slot>
+      </div>
+      ${caption || this.querySelector('[slot="caption"]')
             ? html `
-              <div class="${prefix}--${type}-notification__caption">
-                ${caption}<slot name="caption"></slot>
-              </div>
-            `
+            <div class="${prefix}--${type}-notification__caption">
+              ${caption}<slot name="caption"></slot>
+            </div>
+          `
             : null}
-        <slot></slot>
-      </div>
+      <slot></slot>
     `;
     }
     render() {

package/es-custom/components/notification/toast-notification.js.map

@@ -1 +1 @@
-{"version":3,"file":"toast-notification.js","sources":["../../../src/components/notification/toast-notification.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { NOTIFICATION_TYPE } from './defs';\nimport CDSInlineNotification from './inline-notification';\nimport styles from './toast-notification.scss?lit';\n\n/**\n * Toast notification.\n *\n * @element cds-custom-toast-notification\n * @slot subtitle - The subtitle.\n * @slot title - The title.\n * @fires cds-custom-notification-beingclosed\n *   The custom event fired before this notification is being closed upon a user gesture.\n *   Cancellation of this event stops the user-initiated action of closing this notification.\n * @fires cds-custom-notification-closed - The custom event fired after this notification is closed upon a user gesture.\n */\n@customElement(`${prefix}-toast-notification`)\nclass CDSToastNotification extends CDSInlineNotification {\n  protected _type = NOTIFICATION_TYPE.TOAST;\n\n  protected _renderText() {\n    const { caption, subtitle, title, _type: type } = this;\n    return html`\n      <div class=\"${prefix}--${type}-notification__details\">\n        <div class=\"${prefix}--${type}-notification__title\">\n          ${title}<slot name=\"title\"></slot>\n        </div>\n        <div class=\"${prefix}--${type}-notification__subtitle\">\n          ${subtitle}<slot name=\"subtitle\"></slot>\n        </div>\n        ${caption || this.querySelector('[slot=\"caption\"]')\n          ? html`\n              <div class=\"${prefix}--${type}-notification__caption\">\n                ${caption}<slot name=\"caption\"></slot>\n              </div>\n            `\n          : null}\n        <slot></slot>\n      </div>\n    `;\n  }\n\n  /**\n   * Specify the caption\n   */\n  @property()\n  caption = '';\n\n  render() {\n    const { _type: type } = this;\n    return html`\n      ${this._renderIcon()}\n      <div class=\"${prefix}--${type}-notification__details\">\n        ${this._renderText()}\n      </div>\n      ${this._renderButton()}\n    `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSToastNotification;\n"],"names":["customElement"],"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;AAKG;AAUH;;;;;;;;;;AAUG;AAEH,IAAM,oBAAoB,GAA1B,MAAM,oBAAqB,SAAQ,qBAAqB,CAAA;AAAxD,IAAA,WAAA,GAAA;;AACY,QAAA,IAAA,CAAA,KAAK,GAAG,iBAAiB,CAAC,KAAK;AAwBzC;;AAEG;QAEH,IAAO,CAAA,OAAA,GAAG,EAAE;;IA1BF,WAAW,GAAA;AACnB,QAAA,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,IAAI;AACtD,QAAA,OAAO,IAAI,CAAA;AACK,kBAAA,EAAA,MAAM,KAAK,IAAI,CAAA;AACb,oBAAA,EAAA,MAAM,KAAK,IAAI,CAAA;YACzB,KAAK,CAAA;;AAEK,oBAAA,EAAA,MAAM,KAAK,IAAI,CAAA;YACzB,QAAQ,CAAA;;AAEV,QAAA,EAAA,OAAO,IAAI,IAAI,CAAC,aAAa,CAAC,kBAAkB;cAC9C,IAAI,CAAA;AACY,0BAAA,EAAA,MAAM,KAAK,IAAI,CAAA;kBACzB,OAAO,CAAA;;AAEZ,YAAA;AACH,cAAE,IAAI;;;KAGX;;IASH,MAAM,GAAA;AACJ,QAAA,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,IAAI;AAC5B,QAAA,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,WAAW,EAAE;AACN,kBAAA,EAAA,MAAM,KAAK,IAAI,CAAA;UACzB,IAAI,CAAC,WAAW,EAAE;;QAEpB,IAAI,CAAC,aAAa,EAAE;KACvB;;;AAGI,oBAAM,CAAA,MAAA,GAAG,MAAH;AAbb,UAAA,CAAA;AADC,IAAA,QAAQ;AACI,CAAA,EAAA,oBAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AA7BT,oBAAoB,GAAA,UAAA,CAAA;AADzB,IAAAA,aAAa,CAAC,CAAA,EAAG,MAAM,CAAA,mBAAA,CAAqB;AACvC,CAAA,EAAA,oBAAoB,CA2CzB;AAED,6BAAe,oBAAoB;;;;"}
+{"version":3,"file":"toast-notification.js","sources":["../../../src/components/notification/toast-notification.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2025\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { NOTIFICATION_TYPE } from './defs';\nimport CDSInlineNotification from './inline-notification';\nimport styles from './toast-notification.scss?lit';\n\n/**\n * Toast notification.\n *\n * @element cds-custom-toast-notification\n * @slot subtitle - The subtitle.\n * @slot title - The title.\n * @fires cds-custom-notification-beingclosed\n *   The custom event fired before this notification is being closed upon a user gesture.\n *   Cancellation of this event stops the user-initiated action of closing this notification.\n * @fires cds-custom-notification-closed - The custom event fired after this notification is closed upon a user gesture.\n */\n@customElement(`${prefix}-toast-notification`)\nclass CDSToastNotification extends CDSInlineNotification {\n  protected _type = NOTIFICATION_TYPE.TOAST;\n\n  protected _renderText() {\n    const { caption, subtitle, title, _type: type } = this;\n    return html`\n      <div class=\"${prefix}--${type}-notification__title\">\n        ${title}<slot name=\"title\"></slot>\n      </div>\n      <div class=\"${prefix}--${type}-notification__subtitle\">\n        ${subtitle}<slot name=\"subtitle\"></slot>\n      </div>\n      ${caption || this.querySelector('[slot=\"caption\"]')\n        ? html`\n            <div class=\"${prefix}--${type}-notification__caption\">\n              ${caption}<slot name=\"caption\"></slot>\n            </div>\n          `\n        : null}\n      <slot></slot>\n    `;\n  }\n\n  /**\n   * Specify the caption\n   */\n  @property()\n  caption = '';\n\n  render() {\n    const { _type: type } = this;\n    return html`\n      ${this._renderIcon()}\n      <div class=\"${prefix}--${type}-notification__details\">\n        ${this._renderText()}\n      </div>\n      ${this._renderButton()}\n    `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSToastNotification;\n"],"names":["customElement"],"mappings":";;;;;;;;;;;;;;;;AAAA;;;;;AAKG;AAUH;;;;;;;;;;AAUG;AAEH,IAAM,oBAAoB,GAA1B,MAAM,oBAAqB,SAAQ,qBAAqB,CAAA;AAAxD,IAAA,WAAA,GAAA;;AACY,QAAA,IAAA,CAAA,KAAK,GAAG,iBAAiB,CAAC,KAAK;AAsBzC;;AAEG;QAEH,IAAO,CAAA,OAAA,GAAG,EAAE;;IAxBF,WAAW,GAAA;AACnB,QAAA,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,IAAI;AACtD,QAAA,OAAO,IAAI,CAAA;AACK,kBAAA,EAAA,MAAM,KAAK,IAAI,CAAA;UACzB,KAAK,CAAA;;AAEK,kBAAA,EAAA,MAAM,KAAK,IAAI,CAAA;UACzB,QAAQ,CAAA;;AAEV,MAAA,EAAA,OAAO,IAAI,IAAI,CAAC,aAAa,CAAC,kBAAkB;cAC9C,IAAI,CAAA;AACY,wBAAA,EAAA,MAAM,KAAK,IAAI,CAAA;gBACzB,OAAO,CAAA;;AAEZ,UAAA;AACH,cAAE,IAAI;;KAET;;IASH,MAAM,GAAA;AACJ,QAAA,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,IAAI;AAC5B,QAAA,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,WAAW,EAAE;AACN,kBAAA,EAAA,MAAM,KAAK,IAAI,CAAA;UACzB,IAAI,CAAC,WAAW,EAAE;;QAEpB,IAAI,CAAC,aAAa,EAAE;KACvB;;;AAGI,oBAAM,CAAA,MAAA,GAAG,MAAH;AAbb,UAAA,CAAA;AADC,IAAA,QAAQ;AACI,CAAA,EAAA,oBAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AA3BT,oBAAoB,GAAA,UAAA,CAAA;AADzB,IAAAA,aAAa,CAAC,CAAA,EAAG,MAAM,CAAA,mBAAA,CAAqB;AACvC,CAAA,EAAA,oBAAoB,CAyCzB;AAED,6BAAe,oBAAoB;;;;"}