@swisspost/design-system-components 1.6.3 → 1.7.0

package/dist/collection/components/post-alert/post-alert.js

@@ -4,254 +4,254 @@ import { fadeOut } from "../../animations";
 import { checkEmptyOrOneOf, checkEmptyOrPattern, checkNonEmpty, checkType } from "../../utils";
 import { ALERT_TYPES } from "./alert-types";
 export class PostAlert {
-  constructor() {
-    this.alertId = crypto.randomUUID();
-    this.classes = undefined;
-    this.hasActions = undefined;
-    this.hasHeading = undefined;
-    this.onDismissButtonClick = () => this.dismiss();
-    this.dismissible = false;
-    this.dismissLabel = undefined;
-    this.fixed = false;
-    this.icon = undefined;
-    this.type = 'primary';
-  }
-  validateDismissible(isDismissible = this.dismissible) {
-    checkType(isDismissible, 'boolean', 'The post-alert "dismissible" prop should be a boolean.');
-    setTimeout(() => this.validateDismissLabel());
-  }
-  validateDismissLabel(dismissLabel = this.dismissLabel) {
-    if (this.dismissible) {
-      checkNonEmpty(dismissLabel, 'Dismissible post-alert\'s require a "dismiss-label" prop.');
+    constructor() {
+        this.alertId = crypto.randomUUID();
+        this.classes = undefined;
+        this.hasActions = undefined;
+        this.hasHeading = undefined;
+        this.onDismissButtonClick = () => this.dismiss();
+        this.dismissible = false;
+        this.dismissLabel = undefined;
+        this.fixed = false;
+        this.icon = undefined;
+        this.type = 'primary';
     }
-  }
-  validateFixed(isFixed = this.fixed) {
-    checkType(isFixed, 'boolean', 'The post-alert "fixed" prop should be a boolean.');
-  }
-  validateIcon(icon = this.icon) {
-    checkEmptyOrPattern(icon, /\d{4}|none/, 'The post-alert "icon" prop should be a 4-digits string.');
-  }
-  validateType(type = this.type) {
-    checkEmptyOrOneOf(type, ALERT_TYPES, `The post-alert requires a type form: ${ALERT_TYPES.join(', ')}`);
-  }
-  connectedCallback() {
-    this.validateDismissible();
-    this.validateFixed();
-    this.validateIcon();
-    this.validateType();
-  }
-  componentWillRender() {
-    var _a;
-    this.hasHeading = this.host.querySelectorAll('[slot=heading]').length > 0;
-    this.hasActions = this.host.querySelectorAll('[slot=actions]').length > 0;
-    this.classes = `alert alert-${(_a = this.type) !== null && _a !== void 0 ? _a : 'primary'}`;
-    if (this.dismissible)
-      this.classes += ' alert-dismissible';
-    if (this.hasActions)
-      this.classes += ' alert-action';
-    if (this.fixed)
-      this.classes += ' alert-fixed-bottom';
-    if (this.icon === 'none')
-      this.classes += ' no-icon';
-  }
-  /**
-   * Triggers alert dismissal programmatically (same as clicking on the close button (×)).
-   */
-  async dismiss() {
-    const dismissal = fadeOut(this.host);
-    await dismissal.finished;
-    this.host.remove();
-    this.dismissed.emit();
-  }
-  render() {
-    const defaultAlertContent = [
-      this.hasHeading && (h("div", { key: `${this.alertId}-heading`, class: "alert-heading" }, h("slot", { name: "heading" }))),
-      h("slot", { key: `${this.alertId}-message` })
-    ];
-    const actionAlertContent = [
-      h("div", { key: `${this.alertId}-content`, class: "alert-content" }, defaultAlertContent),
-      h("div", { key: `${this.alertId}-buttons`, class: "alert-buttons" }, h("slot", { name: "actions" })),
-    ];
-    return (h(Host, { "data-version": version }, h("div", { role: "alert", class: this.classes }, this.dismissible && (h("button", { class: "btn-close", onClick: this.onDismissButtonClick }, h("span", { class: "visually-hidden" }, this.dismissLabel))), this.icon && this.icon !== 'none' && (h("post-icon", { key: `${this.alertId}-icon`, name: this.icon })), this.hasActions
-      ? actionAlertContent
-      : defaultAlertContent)));
-  }
-  static get is() { return "post-alert"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["post-alert.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["post-alert.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "dismissible": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "If `true`, a close button (\u00D7) is displayed and the alert can be dismissed by the user."
-        },
-        "attribute": "dismissible",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "dismissLabel": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The label to use for the close button of a dismissible alert."
-        },
-        "attribute": "dismiss-label",
-        "reflect": false
-      },
-      "fixed": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "If `true`, the alert is positioned at the bottom of the window, from edge to edge."
-        },
-        "attribute": "fixed",
-        "reflect": false,
-        "defaultValue": "false"
-      },
-      "icon": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The icon to display in the alert. By default, the icon depends on the alert type.\n\nIf `none`, no icon is displayed."
-        },
-        "attribute": "icon",
-        "reflect": false
-      },
-      "type": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "AlertType",
-          "resolved": "\"danger\" | \"gray\" | \"info\" | \"primary\" | \"success\" | \"warning\"",
-          "references": {
-            "AlertType": {
-              "location": "import",
-              "path": "./alert-types",
-              "id": "src/components/post-alert/alert-types.ts::AlertType"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The type of the alert."
-        },
-        "attribute": "type",
-        "reflect": false,
-        "defaultValue": "'primary'"
-      }
-    };
-  }
-  static get states() {
-    return {
-      "alertId": {},
-      "classes": {},
-      "hasActions": {},
-      "hasHeading": {},
-      "onDismissButtonClick": {}
-    };
-  }
-  static get events() {
-    return [{
-        "method": "dismissed",
-        "name": "dismissed",
-        "bubbles": true,
-        "cancelable": true,
-        "composed": true,
-        "docs": {
-          "tags": [],
-          "text": "An event emitted when the alert element is dismissed, after the transition.\nIt has no payload and only relevant for dismissible alerts."
-        },
-        "complexType": {
-          "original": "void",
-          "resolved": "void",
-          "references": {}
+    validateDismissible(isDismissible = this.dismissible) {
+        checkType(isDismissible, 'boolean', 'The post-alert "dismissible" prop should be a boolean.');
+        setTimeout(() => this.validateDismissLabel());
+    }
+    validateDismissLabel(dismissLabel = this.dismissLabel) {
+        if (this.dismissible) {
+            checkNonEmpty(dismissLabel, 'Dismissible post-alert\'s require a "dismiss-label" prop.');
         }
-      }];
-  }
-  static get methods() {
-    return {
-      "dismiss": {
-        "complexType": {
-          "signature": "() => Promise<void>",
-          "parameters": [],
-          "references": {
-            "Promise": {
-              "location": "global",
-              "id": "global::Promise"
+    }
+    validateFixed(isFixed = this.fixed) {
+        checkType(isFixed, 'boolean', 'The post-alert "fixed" prop should be a boolean.');
+    }
+    validateIcon(icon = this.icon) {
+        checkEmptyOrPattern(icon, /\d{4}|none/, 'The post-alert "icon" prop should be a 4-digits string.');
+    }
+    validateType(type = this.type) {
+        checkEmptyOrOneOf(type, ALERT_TYPES, `The post-alert requires a type form: ${ALERT_TYPES.join(', ')}`);
+    }
+    connectedCallback() {
+        this.validateDismissible();
+        this.validateFixed();
+        this.validateIcon();
+        this.validateType();
+    }
+    componentWillRender() {
+        var _a;
+        this.hasHeading = this.host.querySelectorAll('[slot=heading]').length > 0;
+        this.hasActions = this.host.querySelectorAll('[slot=actions]').length > 0;
+        this.classes = `alert alert-${(_a = this.type) !== null && _a !== void 0 ? _a : 'primary'}`;
+        if (this.dismissible)
+            this.classes += ' alert-dismissible';
+        if (this.hasActions)
+            this.classes += ' alert-action';
+        if (this.fixed)
+            this.classes += ' alert-fixed-bottom';
+        if (this.icon === 'none')
+            this.classes += ' no-icon';
+    }
+    /**
+     * Triggers alert dismissal programmatically (same as clicking on the close button (×)).
+     */
+    async dismiss() {
+        const dismissal = fadeOut(this.host);
+        await dismissal.finished;
+        this.host.remove();
+        this.dismissed.emit();
+    }
+    render() {
+        const defaultAlertContent = [
+            this.hasHeading && (h("div", { key: `${this.alertId}-heading`, class: "alert-heading" }, h("slot", { name: "heading" }))),
+            h("slot", { key: `${this.alertId}-message` })
+        ];
+        const actionAlertContent = [
+            h("div", { key: `${this.alertId}-content`, class: "alert-content" }, defaultAlertContent),
+            h("div", { key: `${this.alertId}-buttons`, class: "alert-buttons" }, h("slot", { name: "actions" })),
+        ];
+        return (h(Host, { "data-version": version }, h("div", { role: "alert", class: this.classes }, this.dismissible && (h("button", { class: "btn-close", onClick: this.onDismissButtonClick }, h("span", { class: "visually-hidden" }, this.dismissLabel))), this.icon && this.icon !== 'none' && (h("post-icon", { key: `${this.alertId}-icon`, name: this.icon })), this.hasActions
+            ? actionAlertContent
+            : defaultAlertContent)));
+    }
+    static get is() { return "post-alert"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["post-alert.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["post-alert.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "dismissible": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "If `true`, a close button (\u00D7) is displayed and the alert can be dismissed by the user."
+                },
+                "attribute": "dismissible",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "dismissLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The label to use for the close button of a dismissible alert."
+                },
+                "attribute": "dismiss-label",
+                "reflect": false
+            },
+            "fixed": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "If `true`, the alert is positioned at the bottom of the window, from edge to edge."
+                },
+                "attribute": "fixed",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "icon": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The icon to display in the alert. By default, the icon depends on the alert type.\n\nIf `none`, no icon is displayed."
+                },
+                "attribute": "icon",
+                "reflect": false
+            },
+            "type": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "AlertType",
+                    "resolved": "\"danger\" | \"gray\" | \"info\" | \"primary\" | \"success\" | \"warning\"",
+                    "references": {
+                        "AlertType": {
+                            "location": "import",
+                            "path": "./alert-types",
+                            "id": "src/components/post-alert/alert-types.ts::AlertType"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The type of the alert."
+                },
+                "attribute": "type",
+                "reflect": false,
+                "defaultValue": "'primary'"
             }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "Triggers alert dismissal programmatically (same as clicking on the close button (\u00D7)).",
-          "tags": []
-        }
-      }
-    };
-  }
-  static get elementRef() { return "host"; }
-  static get watchers() {
-    return [{
-        "propName": "dismissible",
-        "methodName": "validateDismissible"
-      }, {
-        "propName": "dismissLabel",
-        "methodName": "validateDismissLabel"
-      }, {
-        "propName": "fixed",
-        "methodName": "validateFixed"
-      }, {
-        "propName": "icon",
-        "methodName": "validateIcon"
-      }, {
-        "propName": "type",
-        "methodName": "validateType"
-      }];
-  }
+        };
+    }
+    static get states() {
+        return {
+            "alertId": {},
+            "classes": {},
+            "hasActions": {},
+            "hasHeading": {},
+            "onDismissButtonClick": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "dismissed",
+                "name": "dismissed",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "An event emitted when the alert element is dismissed, after the transition.\nIt has no payload and only relevant for dismissible alerts."
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }];
+    }
+    static get methods() {
+        return {
+            "dismiss": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Triggers alert dismissal programmatically (same as clicking on the close button (\u00D7)).",
+                    "tags": []
+                }
+            }
+        };
+    }
+    static get elementRef() { return "host"; }
+    static get watchers() {
+        return [{
+                "propName": "dismissible",
+                "methodName": "validateDismissible"
+            }, {
+                "propName": "dismissLabel",
+                "methodName": "validateDismissLabel"
+            }, {
+                "propName": "fixed",
+                "methodName": "validateFixed"
+            }, {
+                "propName": "icon",
+                "methodName": "validateIcon"
+            }, {
+                "propName": "type",
+                "methodName": "validateType"
+            }];
+    }
 }
 //# sourceMappingURL=post-alert.js.map

package/dist/collection/components/post-alert/post-alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"post-alert.js","sourceRoot":"","sources":["../../../../src/components/post-alert/post-alert.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { version } from '../../../package.json';\nimport { fadeOut } from '../../animations';\nimport { checkEmptyOrOneOf, checkEmptyOrPattern, checkNonEmpty, checkType } from '../../utils';\nimport { ALERT_TYPES, AlertType } from './alert-types';\n\n@Component({\n  tag: 'post-alert',\n  styleUrl: 'post-alert.scss',\n  shadow: true,\n})\nexport class PostAlert {\n  @Element() host: HTMLPostAlertElement;\n\n  @State() alertId = crypto.randomUUID();\n  @State() classes: string;\n  @State() hasActions: boolean;\n  @State() hasHeading: boolean;\n  @State() onDismissButtonClick = () => this.dismiss();\n\n  /**\n   * If `true`, a close button (×) is displayed and the alert can be dismissed by the user.\n   */\n  @Prop() readonly dismissible: boolean = false;\n\n  @Watch('dismissible')\n  validateDismissible(isDismissible = this.dismissible) {\n    checkType(isDismissible, 'boolean', 'The post-alert \"dismissible\" prop should be a boolean.');\n    setTimeout(() => this.validateDismissLabel());\n  }\n\n  /**\n   * The label to use for the close button of a dismissible alert.\n   */\n  @Prop() readonly dismissLabel: string;\n\n  @Watch('dismissLabel')\n  validateDismissLabel(dismissLabel = this.dismissLabel) {\n    if (this.dismissible) {\n      checkNonEmpty(dismissLabel, 'Dismissible post-alert\\'s require a \"dismiss-label\" prop.');\n    }\n  }\n\n  /**\n   * If `true`, the alert is positioned at the bottom of the window, from edge to edge.\n   */\n  @Prop() readonly fixed: boolean = false;\n\n  @Watch('fixed')\n  validateFixed(isFixed = this.fixed) {\n    checkType(isFixed, 'boolean', 'The post-alert \"fixed\" prop should be a boolean.');\n  }\n\n  /**\n   * The icon to display in the alert. By default, the icon depends on the alert type.\n   *\n   * If `none`, no icon is displayed.\n   */\n  @Prop() readonly icon: string;\n\n  @Watch('icon')\n  validateIcon(icon = this.icon) {\n    checkEmptyOrPattern(icon, /\\d{4}|none/, 'The post-alert \"icon\" prop should be a 4-digits string.');\n  }\n\n  /**\n   * The type of the alert.\n   */\n  @Prop() readonly type: AlertType = 'primary';\n\n  @Watch('type')\n  validateType(type = this.type) {\n    checkEmptyOrOneOf(type, ALERT_TYPES, `The post-alert requires a type form: ${ALERT_TYPES.join(', ')}`);\n  }\n\n  /**\n   * An event emitted when the alert element is dismissed, after the transition.\n   * It has no payload and only relevant for dismissible alerts.\n   */\n  @Event() dismissed: EventEmitter<void>;\n\n  connectedCallback() {\n    this.validateDismissible();\n    this.validateFixed();\n    this.validateIcon();\n    this.validateType();\n  }\n\n  componentWillRender() {\n    this.hasHeading = this.host.querySelectorAll('[slot=heading]').length > 0;\n    this.hasActions = this.host.querySelectorAll('[slot=actions]').length > 0;\n\n    this.classes = `alert alert-${this.type ?? 'primary'}`;\n    if (this.dismissible) this.classes += ' alert-dismissible';\n    if (this.hasActions) this.classes += ' alert-action';\n    if (this.fixed) this.classes += ' alert-fixed-bottom';\n    if (this.icon === 'none') this.classes += ' no-icon';\n  }\n\n  /**\n   * Triggers alert dismissal programmatically (same as clicking on the close button (×)).\n   */\n  @Method()\n  async dismiss() {\n    const dismissal = fadeOut(this.host);\n\n    await dismissal.finished;\n\n    this.host.remove();\n    this.dismissed.emit();\n  }\n\n  render() {\n    const defaultAlertContent = [\n      this.hasHeading && (\n        <div key={`${this.alertId}-heading`} class=\"alert-heading\">\n          <slot name=\"heading\"/>\n        </div>\n      ),\n      <slot key={`${this.alertId}-message`}/>\n    ];\n\n    const actionAlertContent = [\n      <div key={`${this.alertId}-content`} class=\"alert-content\">\n        {defaultAlertContent}\n      </div>,\n      <div key={`${this.alertId}-buttons`} class=\"alert-buttons\">\n        <slot name=\"actions\"/>\n      </div>,\n    ];\n\n    return (\n      <Host data-version={version}>\n        <div role=\"alert\" class={this.classes}>\n          {this.dismissible && (\n            <button class=\"btn-close\" onClick={this.onDismissButtonClick}>\n              <span class=\"visually-hidden\">{this.dismissLabel}</span>\n            </button>\n          )}\n\n          {this.icon && this.icon !== 'none' && (\n            <post-icon key={`${this.alertId}-icon`} name={this.icon} />\n          )}\n\n          {this.hasActions\n            ? actionAlertContent\n            : defaultAlertContent\n          }\n        </div>\n      </Host>\n    );\n  }\n\n}\n"]}
+{"version":3,"file":"post-alert.js","sourceRoot":"","sources":["../../../../src/components/post-alert/post-alert.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\nimport { version } from '../../../package.json';\nimport { fadeOut } from '../../animations';\nimport { checkEmptyOrOneOf, checkEmptyOrPattern, checkNonEmpty, checkType } from '../../utils';\nimport { ALERT_TYPES, AlertType } from './alert-types';\n\n@Component({\n  tag: 'post-alert',\n  styleUrl: 'post-alert.scss',\n  shadow: true,\n})\nexport class PostAlert {\n  @Element() host: HTMLPostAlertElement;\n\n  @State() alertId = crypto.randomUUID();\n  @State() classes: string;\n  @State() hasActions: boolean;\n  @State() hasHeading: boolean;\n  @State() onDismissButtonClick = () => this.dismiss();\n\n  /**\n   * If `true`, a close button (×) is displayed and the alert can be dismissed by the user.\n   */\n  @Prop() readonly dismissible: boolean = false;\n\n  @Watch('dismissible')\n  validateDismissible(isDismissible = this.dismissible) {\n    checkType(isDismissible, 'boolean', 'The post-alert \"dismissible\" prop should be a boolean.');\n    setTimeout(() => this.validateDismissLabel());\n  }\n\n  /**\n   * The label to use for the close button of a dismissible alert.\n   */\n  @Prop() readonly dismissLabel: string;\n\n  @Watch('dismissLabel')\n  validateDismissLabel(dismissLabel = this.dismissLabel) {\n    if (this.dismissible) {\n      checkNonEmpty(dismissLabel, 'Dismissible post-alert\\'s require a \"dismiss-label\" prop.');\n    }\n  }\n\n  /**\n   * If `true`, the alert is positioned at the bottom of the window, from edge to edge.\n   */\n  @Prop() readonly fixed: boolean = false;\n\n  @Watch('fixed')\n  validateFixed(isFixed = this.fixed) {\n    checkType(isFixed, 'boolean', 'The post-alert \"fixed\" prop should be a boolean.');\n  }\n\n  /**\n   * The icon to display in the alert. By default, the icon depends on the alert type.\n   *\n   * If `none`, no icon is displayed.\n   */\n  @Prop() readonly icon: string;\n\n  @Watch('icon')\n  validateIcon(icon = this.icon) {\n    checkEmptyOrPattern(icon, /\\d{4}|none/, 'The post-alert \"icon\" prop should be a 4-digits string.');\n  }\n\n  /**\n   * The type of the alert.\n   */\n  @Prop() readonly type: AlertType = 'primary';\n\n  @Watch('type')\n  validateType(type = this.type) {\n    checkEmptyOrOneOf(type, ALERT_TYPES, `The post-alert requires a type form: ${ALERT_TYPES.join(', ')}`);\n  }\n\n  /**\n   * An event emitted when the alert element is dismissed, after the transition.\n   * It has no payload and only relevant for dismissible alerts.\n   */\n  @Event() dismissed: EventEmitter<void>;\n\n  connectedCallback() {\n    this.validateDismissible();\n    this.validateFixed();\n    this.validateIcon();\n    this.validateType();\n  }\n\n  componentWillRender() {\n    this.hasHeading = this.host.querySelectorAll('[slot=heading]').length > 0;\n    this.hasActions = this.host.querySelectorAll('[slot=actions]').length > 0;\n\n    this.classes = `alert alert-${this.type ?? 'primary'}`;\n    if (this.dismissible) this.classes += ' alert-dismissible';\n    if (this.hasActions) this.classes += ' alert-action';\n    if (this.fixed) this.classes += ' alert-fixed-bottom';\n    if (this.icon === 'none') this.classes += ' no-icon';\n  }\n\n  /**\n   * Triggers alert dismissal programmatically (same as clicking on the close button (×)).\n   */\n  @Method()\n  async dismiss() {\n    const dismissal = fadeOut(this.host);\n\n    await dismissal.finished;\n\n    this.host.remove();\n    this.dismissed.emit();\n  }\n\n  render() {\n    const defaultAlertContent = [\n      this.hasHeading && (\n        <div key={`${this.alertId}-heading`} class=\"alert-heading\">\n          <slot name=\"heading\"/>\n        </div>\n      ),\n      <slot key={`${this.alertId}-message`}/>\n    ];\n\n    const actionAlertContent = [\n      <div key={`${this.alertId}-content`} class=\"alert-content\">\n        {defaultAlertContent}\n      </div>,\n      <div key={`${this.alertId}-buttons`} class=\"alert-buttons\">\n        <slot name=\"actions\"/>\n      </div>,\n    ];\n\n    return (\n      <Host data-version={version}>\n        <div role=\"alert\" class={this.classes}>\n          {this.dismissible && (\n            <button class=\"btn-close\" onClick={this.onDismissButtonClick}>\n              <span class=\"visually-hidden\">{this.dismissLabel}</span>\n            </button>\n          )}\n\n          {this.icon && this.icon !== 'none' && (\n            <post-icon key={`${this.alertId}-icon`} name={this.icon} />\n          )}\n\n          {this.hasActions\n            ? actionAlertContent\n            : defaultAlertContent\n          }\n        </div>\n      </Host>\n    );\n  }\n\n}\n"]}