@oicl/openbridge-webcomponents 2.0.0-next.94 → 2.0.0-next.96

package/dist/components/alert-icon/alert-icon.js

@@ -1,22 +1,38 @@
-import { css, LitElement, html, nothing } from "lit";
+import { html, css, LitElement, nothing } from "lit";
 import { property } from "lit/decorators.js";
 import { classMap } from "lit/directives/class-map.js";
-import { alarmRectifiedA } from "./icons/icon-alarm-rectified.js";
-import { warningRectifiedA } from "./icons/icon-warning-rectified.js";
-import { alarmSilencedB, alarmSilencedA } from "./icons/icon-alarm-silenced.js";
-import { warningSilencedB, warningSilencedA } from "./icons/icon-warning-silenced.js";
-import { alarmUnackB, alarmUnackA } from "./icons/icon-alarm-unack.js";
-import { warningUnackB, warningUnackA } from "./icons/icon-warning-unack.js";
 import "../../icons/icon-caution-color-iec.js";
 import { customElement } from "../../decorator.js";
 import { AlertType } from "../../types.js";
-import { getBamAlertTypeForBlinking, getAlertBadgeComponent, AlertBadgeComponent, supportsBlinking, getAlertBlinkMode } from "../../alert-severity.js";
+import { getBamAlertTypeForBlinking, supportsBlinking, getAlertBlinkMode } from "../../alert-severity.js";
 import "../../icons/icon-alarm-badge-outline.js";
 import "../../icons/icon-warning-badge-outline.js";
 import "../../icons/icon-caution-badge-outline.js";
+import "../../icons/icon-alarm-acknowledged-iec.js";
+import "../../icons/icon-warning-acknowledged-iec.js";
+import "../../icons/icon-alarm-rectified-iec.js";
+import "../../icons/icon-warning-rectified-iec.js";
+import "../../icons/icon-alarm-rectified-outlined.js";
+import "../../icons/icon-warning-rectified-outlined.js";
+import "../../icons/icon-alarm-silenced-iec.js";
+import "../../icons/icon-alarm-silenced-outlined.js";
+import "../../icons/icon-warning-silenced-iec.js";
+import "../../icons/icon-warning-silenced-outlined.js";
+import "../../icons/icon-alarm-unacknowledged-iec.js";
+import "../../icons/icon-alarm-acknowledged-outlined.js";
+import "../../icons/icon-warning-unacknowledged-iec.js";
+import "../../icons/icon-warning-unacknowledged-outlined.js";
 import "../alert-frame/critical-badge.js";
 import "../alert-frame/diagnostic-badge.js";
 import { criticalB, criticalA } from "./icons/icon-critical.js";
+import { criticalUnacknowledgedB, criticalUnacknowledgedA } from "./icons/icon-critical-unacknowledged.js";
+import { criticalSilencedB, criticalSilencedA } from "./icons/icon-critical-silenced.js";
+import { criticalRectifiedB, criticalRectifiedA } from "./icons/icon-critical-rectified.js";
+import { criticalAcknowledged } from "./icons/icon-critical-acknowledged.js";
+import { lowUnacknowledgedB, lowUnacknowledgedA } from "./icons/icon-low-unacknowledged.js";
+import { lowSilencedB, lowSilencedA } from "./icons/icon-low-silenced.js";
+import { lowRectifiedB, lowRectifiedA } from "./icons/icon-low-rectified.js";
+import { lowAcknowledged } from "./icons/icon-low-acknowledged.js";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __decorateClass = (decorators, target, key, kind) => {
@@ -32,43 +48,61 @@ const mapping = {
     "alarm-silenced"
     /* AlarmSilenced */
   ]: {
-    a: alarmSilencedA,
-    b: alarmSilencedB
+    a: html`<obi-alarm-silenced-iec usecsscolor></obi-alarm-silenced-iec>`,
+    b: html`<obi-alarm-silenced-outlined
+      usecsscolor
+    ></obi-alarm-silenced-outlined>`
   },
   [
     "alarm-unack"
     /* AlarmUnack */
   ]: {
-    a: alarmUnackA,
-    b: alarmUnackB
+    a: html`<obi-alarm-unacknowledged-iec
+      usecsscolor
+    ></obi-alarm-unacknowledged-iec>`,
+    b: html`<obi-alarm-acknowledged-outlined
+      usecsscolor
+    ></obi-alarm-acknowledged-outlined>`
   },
   [
     "alarm-rectified"
     /* AlarmRectified */
   ]: {
-    a: alarmRectifiedA,
-    b: alarmRectifiedA
+    a: html`<obi-alarm-rectified-iec usecsscolor></obi-alarm-rectified-iec>`,
+    b: html`<obi-alarm-rectified-outlined
+      usecsscolor
+    ></obi-alarm-rectified-outlined>`
   },
   [
     "warning-unack"
     /* WarningUnack */
   ]: {
-    a: warningUnackA,
-    b: warningUnackB
+    a: html`<obi-warning-unacknowledged-iec
+      usecsscolor
+    ></obi-warning-unacknowledged-iec>`,
+    b: html`<obi-warning-unacknowledged-outlined
+      usecsscolor
+    ></obi-warning-unacknowledged-outlined>`
   },
   [
     "warning-rectified"
     /* WarningRectified */
   ]: {
-    a: warningRectifiedA,
-    b: warningRectifiedA
+    a: html`<obi-warning-rectified-iec
+      usecsscolor
+    ></obi-warning-rectified-iec>`,
+    b: html`<obi-warning-rectified-outlined
+      usecsscolor
+    ></obi-warning-rectified-outlined>`
   },
   [
     "warning-silenced"
     /* WarningSilenced */
   ]: {
-    a: warningSilencedA,
-    b: warningSilencedB
+    a: html`<obi-warning-silenced-iec usecsscolor></obi-warning-silenced-iec>`,
+    b: html`<obi-warning-silenced-outlined
+      usecsscolor
+    ></obi-warning-silenced-outlined>`
   },
   [
     "critical"
@@ -76,34 +110,142 @@ const mapping = {
   ]: {
     a: criticalA,
     b: criticalB
+  },
+  [
+    "critical-unack"
+    /* CriticalUnack */
+  ]: {
+    a: criticalUnacknowledgedA,
+    b: criticalUnacknowledgedB
+  },
+  [
+    "critical-silenced"
+    /* CriticalSilenced */
+  ]: {
+    a: criticalSilencedA,
+    b: criticalSilencedB
+  },
+  [
+    "critical-rectified"
+    /* CriticalRectified */
+  ]: {
+    a: criticalRectifiedA,
+    b: criticalRectifiedB
+  },
+  [
+    "low-unack"
+    /* LowUnack */
+  ]: {
+    a: lowUnacknowledgedA,
+    b: lowUnacknowledgedB
+  },
+  [
+    "low-silenced"
+    /* LowSilenced */
+  ]: {
+    a: lowSilencedA,
+    b: lowSilencedB
+  },
+  [
+    "low-rectified"
+    /* LowRectified */
+  ]: {
+    a: lowRectifiedA,
+    b: lowRectifiedB
   }
 };
 let ObcAlertIcon = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    this.alertType = AlertType.Alarm;
+  }
+  get _effectiveType() {
+    if (this.type) {
+      return this.type;
+    }
+    return this.alertType;
+  }
   get bamType() {
-    return getBamAlertTypeForBlinking(this.type);
+    return getBamAlertTypeForBlinking(this._effectiveType);
+  }
+  get _effectiveState() {
+    if (this.active === false) {
+      return "rectified";
+    } else if (this.acknowledged) {
+      return "acknowledged";
+    } else if (this.silenced) {
+      return "silenced";
+    } else if (this.active === true) {
+      return "unacknowledged";
+    }
+    return "unacknowledged";
   }
   get icon() {
-    if (this.type === AlertType.LevelCritical) {
-      return mapping[
-        "critical"
-        /* Critical */
-      ];
+    if (this._effectiveType === AlertType.LevelCritical) {
+      switch (this._effectiveState) {
+        case "rectified":
+          return mapping[
+            "critical-rectified"
+            /* CriticalRectified */
+          ];
+        case "silenced":
+          return mapping[
+            "critical-silenced"
+            /* CriticalSilenced */
+          ];
+        case "unacknowledged":
+          return mapping[
+            "critical-unack"
+            /* CriticalUnack */
+          ];
+        default:
+          return mapping[
+            "critical"
+            /* Critical */
+          ];
+      }
+    } else if (this._effectiveType === AlertType.LevelLow) {
+      switch (this._effectiveState) {
+        case "rectified":
+          return mapping[
+            "low-rectified"
+            /* LowRectified */
+          ];
+        case "silenced":
+          return mapping[
+            "low-silenced"
+            /* LowSilenced */
+          ];
+        case "unacknowledged":
+          return mapping[
+            "low-unack"
+            /* LowUnack */
+          ];
+        default:
+          return mapping[
+            "low-unack"
+            /* LowUnack */
+          ];
+      }
     } else if (this.bamType === AlertType.Alarm) {
-      if (this.active === false) {
-        return mapping[
-          "alarm-rectified"
-          /* AlarmRectified */
-        ];
-      } else if (this.acknowledged) {
-        return mapping[
-          "alarm-silenced"
-          /* AlarmSilenced */
-        ];
-      } else {
-        return mapping[
-          "alarm-unack"
-          /* AlarmUnack */
-        ];
+      switch (this._effectiveState) {
+        case "rectified":
+          return mapping[
+            "alarm-rectified"
+            /* AlarmRectified */
+          ];
+        case "silenced":
+          return mapping[
+            "alarm-silenced"
+            /* AlarmSilenced */
+          ];
+        case "unacknowledged":
+          return mapping[
+            "alarm-unack"
+            /* AlarmUnack */
+          ];
+        default:
+          return null;
       }
     } else if (this.bamType === AlertType.Warning) {
       if (this.active === false) {
@@ -125,46 +267,66 @@ let ObcAlertIcon = class extends LitElement {
     }
     return null;
   }
-  renderOutlineIcon() {
-    switch (getAlertBadgeComponent(this.type)) {
-      case AlertBadgeComponent.Critical:
-        return html`<obi-critical-badge></obi-critical-badge>`;
-      case AlertBadgeComponent.Warning:
-        return html`<obi-warning-badge-outline></obi-warning-badge-outline>`;
-      case AlertBadgeComponent.Caution:
-        return html`<obi-caution-badge-outline></obi-caution-badge-outline>`;
-      case AlertBadgeComponent.Diagnostic:
-        return html`<obi-diagnostic-badge
-          style="color: var(--alert-diagnostic-color);"
-        ></obi-diagnostic-badge>`;
-      default:
-        return html`<obi-alarm-badge-outline></obi-alarm-badge-outline>`;
-    }
-  }
   renderStaticIcon() {
-    if (this.type === AlertType.Caution || this.type === AlertType.LevelLow) {
+    if (this._effectiveType === AlertType.Caution) {
       return html`<obi-caution-color-iec usecsscolor></obi-caution-color-iec>`;
     }
-    if (this.type === AlertType.LevelDiagnostic) {
+    if (this._effectiveType === AlertType.LevelDiagnostic) {
       return html`<obi-diagnostic-badge
         style="color: var(--alert-diagnostic-color);"
       ></obi-diagnostic-badge>`;
     }
+    if (this._effectiveState === "acknowledged") {
+      if (this._effectiveType === AlertType.LevelCritical) {
+        return html`${criticalAcknowledged}`;
+      }
+      if (this._effectiveType === AlertType.LevelLow) {
+        return html`${lowAcknowledged}`;
+      }
+      switch (this.bamType) {
+        case AlertType.Alarm:
+          return html`<obi-alarm-acknowledged-iec
+            usecsscolor
+          ></obi-alarm-acknowledged-iec>`;
+        case AlertType.Warning:
+          return html`<obi-warning-acknowledged-iec
+            usecsscolor
+          ></obi-warning-acknowledged-iec>`;
+        default:
+          return nothing;
+      }
+    } else if (this._effectiveState === "rectified") {
+      if (this._effectiveType === AlertType.LevelCritical) {
+        return html`${criticalRectifiedB}`;
+      }
+      if (this._effectiveType === AlertType.LevelLow) {
+        return html`${lowRectifiedB}`;
+      }
+      switch (this.bamType) {
+        case AlertType.Alarm:
+          return html`<obi-alarm-rectified-outlined
+            usecsscolor
+          ></obi-alarm-rectified-outlined>`;
+        case AlertType.Warning:
+          return html`<obi-warning-rectified-outlined
+            usecsscolor
+          ></obi-warning-rectified-outlined>`;
+        default:
+          return nothing;
+      }
+    }
     return nothing;
   }
   render() {
-    if (!this.type) {
+    if (!this._effectiveType) {
       return html`<div>No alarm</div>`;
     }
-    if (this.outline) {
-      return html`<div class="wrapper">${this.renderOutlineIcon()}</div>`;
-    }
-    if (supportsBlinking(this.type) && !(this.type === AlertType.LevelLow)) {
+    if (supportsBlinking(this._effectiveType, this.acknowledged ?? false)) {
       const icons = this.icon;
       if (!icons) {
         throw new Error("No icon found");
       }
-      const blinkMode = getAlertBlinkMode(this.type);
+      const blinkMode = getAlertBlinkMode(this._effectiveType);
       return html`
         <div
           class=${classMap({
@@ -196,7 +358,9 @@ ObcAlertIcon.styles = css`
         left: 0;
       }
 
-      svg {
+      svg,
+      .a,
+      .b {
         height: 100%;
         width: 100%;
         position: absolute;
@@ -236,6 +400,9 @@ ObcAlertIcon.styles = css`
       }
     }
   `;
+__decorateClass([
+  property({ type: String })
+], ObcAlertIcon.prototype, "alertType", 2);
 __decorateClass([
   property({ type: String })
 ], ObcAlertIcon.prototype, "type", 2);
@@ -247,7 +414,7 @@ __decorateClass([
 ], ObcAlertIcon.prototype, "active", 2);
 __decorateClass([
   property({ type: Boolean })
-], ObcAlertIcon.prototype, "outline", 2);
+], ObcAlertIcon.prototype, "silenced", 2);
 ObcAlertIcon = __decorateClass([
   customElement("obc-alert-icon")
 ], ObcAlertIcon);

package/dist/components/alert-icon/alert-icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert-icon.js","sources":["../../../src/components/alert-icon/alert-icon.ts"],"sourcesContent":["import {LitElement, html, css, TemplateResult, nothing} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {alarmRectifiedA} from './icons/icon-alarm-rectified.js';\nimport {warningRectifiedA} from './icons/icon-warning-rectified.js';\nimport {alarmSilencedA, alarmSilencedB} from './icons/icon-alarm-silenced.js';\nimport {\n  warningSilencedA,\n  warningSilencedB,\n} from './icons/icon-warning-silenced.js';\nimport {alarmUnackA, alarmUnackB} from './icons/icon-alarm-unack.js';\nimport {warningUnackA, warningUnackB} from './icons/icon-warning-unack.js';\nimport '../../icons/icon-caution-color-iec.js';\nimport {customElement} from '../../decorator.js';\nimport {AlertType} from '../../types.js';\nimport {\n  getAlertBadgeComponent,\n  AlertBadgeComponent,\n  getAlertBlinkMode,\n  getBamAlertTypeForBlinking,\n  supportsBlinking,\n} from '../../alert-severity.js';\nimport '../../icons/icon-alarm-badge-outline.js';\nimport '../../icons/icon-warning-badge-outline.js';\nimport '../../icons/icon-caution-badge-outline.js';\nimport '../alert-frame/critical-badge.js';\nimport '../alert-frame/diagnostic-badge.js';\nimport {criticalA, criticalB} from './icons/icon-critical.js';\n\nenum AlertIconName {\n  AlarmSilenced = 'alarm-silenced',\n  AlarmUnack = 'alarm-unack',\n  AlarmRectified = 'alarm-rectified',\n  WarningUnack = 'warning-unack',\n  WarningRectified = 'warning-rectified',\n  WarningSilenced = 'warning-silenced',\n  Critical = 'critical',\n}\n\nconst mapping = {\n  [AlertIconName.AlarmSilenced]: {\n    a: alarmSilencedA,\n    b: alarmSilencedB,\n  },\n  [AlertIconName.AlarmUnack]: {\n    a: alarmUnackA,\n    b: alarmUnackB,\n  },\n  [AlertIconName.AlarmRectified]: {\n    a: alarmRectifiedA,\n    b: alarmRectifiedA,\n  },\n  [AlertIconName.WarningUnack]: {\n    a: warningUnackA,\n    b: warningUnackB,\n  },\n  [AlertIconName.WarningRectified]: {\n    a: warningRectifiedA,\n    b: warningRectifiedA,\n  },\n  [AlertIconName.WarningSilenced]: {\n    a: warningSilencedA,\n    b: warningSilencedB,\n  },\n  [AlertIconName.Critical]: {\n    a: criticalA,\n    b: criticalB,\n  },\n};\n/**\n * `obc-alert-icon` – Animated alert icon for signaling alarm and warning states.\n *\n * Displays a specialized icon with a blinking effect to visually indicate alert or warning conditions. The icon type is determined by the `name` property, supporting both alarm and warning variants in different states (such as silenced, unacknowledged, or rectified).\n *\n * Appears in notification areas, alert banners, or status panels to draw attention to active or historical alert conditions. The blinking animation helps highlight urgency or status changes without requiring user interaction.\n *\n * ## Features\n * - **Multiple Icon Types:** Supports all alarm and warning types.\n * - **Blinking Animation:** Uses two SVG layers with alternating opacity to create a blinking effect, visually emphasizing the alert or warning state.\n * - **Adaptive Styling:** Applies different CSS variables for alarm and warning types to allow for distinct visual cues (e.g., color, blink timing).\n * - **Scalable:** Designed to fit any container size; scales with its parent element.\n *\n * ## Usage Guidelines\n * Use `obc-alert-icon` to visually represent the status of alarms or warnings in notification panels, alert lists, or system status areas. The blinking effect is intended to draw user attention to active or recent alert conditions. Select the appropriate `name` value to match the alert state you wish to indicate.\n *\n * **TODO(designer):** Provide guidance on when to use each icon variant (e.g., when to use \"rectified\" vs. \"silenced\"), and any best practices for icon placement or blink timing.\n *\n * ## Properties\n * - `type` (AlertType): The type of alarm to display.\n * - `status` (AlarmStatus): The status of the alarm to display.\n *\n * ## Best Practices\n * - Only use the blinking alert icon for states that require immediate or prominent user attention.\n * - Ensure the icon is sized appropriately for its context (e.g., 32x32px or 64x64px for status panels).\n * - Avoid using multiple blinking icons in close proximity to prevent visual overload.\n *\n * ## Example\n * ```html\n * <obc-alert-icon .alarmType=${alarm.type} .alarmStatus=${alarm.status}></obc-alert-icon>\n * ```\n *\n * @stable\n */\n@customElement('obc-alert-icon')\nexport class ObcAlertIcon extends LitElement {\n  @property({type: String}) type!: AlertType;\n  /** @availableWhen outline==false && type in [Alarm, Warning, LevelHigh, LevelMedium] */\n  @property({type: Boolean}) acknowledged!: boolean;\n  /** @availableWhen outline==false && type in [Alarm, Warning, LevelHigh, LevelMedium] */\n  @property({type: Boolean}) active!: boolean;\n  @property({type: Boolean}) outline!: boolean;\n\n  private get bamType(): AlertType {\n    return getBamAlertTypeForBlinking(this.type);\n  }\n\n  get icon() {\n    if (this.type === AlertType.LevelCritical) {\n      return mapping[AlertIconName.Critical];\n    } else if (this.bamType === AlertType.Alarm) {\n      if (this.active === false) {\n        return mapping[AlertIconName.AlarmRectified];\n      } else if (this.acknowledged) {\n        return mapping[AlertIconName.AlarmSilenced];\n      } else {\n        return mapping[AlertIconName.AlarmUnack];\n      }\n    } else if (this.bamType === AlertType.Warning) {\n      if (this.active === false) {\n        return mapping[AlertIconName.WarningRectified];\n      } else if (this.acknowledged) {\n        return mapping[AlertIconName.WarningSilenced];\n      } else {\n        return mapping[AlertIconName.WarningUnack];\n      }\n    }\n\n    return null;\n  }\n\n  private renderOutlineIcon(): TemplateResult {\n    switch (getAlertBadgeComponent(this.type)) {\n      case AlertBadgeComponent.Critical:\n        return html`<obi-critical-badge></obi-critical-badge>`;\n      case AlertBadgeComponent.Warning:\n        return html`<obi-warning-badge-outline></obi-warning-badge-outline>`;\n      case AlertBadgeComponent.Caution:\n        return html`<obi-caution-badge-outline></obi-caution-badge-outline>`;\n      case AlertBadgeComponent.Diagnostic:\n        return html`<obi-diagnostic-badge\n          style=\"color: var(--alert-diagnostic-color);\"\n        ></obi-diagnostic-badge>`;\n      default:\n        return html`<obi-alarm-badge-outline></obi-alarm-badge-outline>`;\n    }\n  }\n\n  private renderStaticIcon(): TemplateResult | typeof nothing {\n    if (this.type === AlertType.Caution || this.type === AlertType.LevelLow) {\n      return html`<obi-caution-color-iec usecsscolor></obi-caution-color-iec>`;\n    }\n    if (this.type === AlertType.LevelDiagnostic) {\n      return html`<obi-diagnostic-badge\n        style=\"color: var(--alert-diagnostic-color);\"\n      ></obi-diagnostic-badge>`;\n    }\n    return nothing;\n  }\n\n  override render() {\n    if (!this.type) {\n      return html`<div>No alarm</div>`;\n    }\n    if (this.outline) {\n      return html`<div class=\"wrapper\">${this.renderOutlineIcon()}</div>`;\n    }\n    if (supportsBlinking(this.type) && !(this.type === AlertType.LevelLow)) {\n      const icons = this.icon;\n      if (!icons) {\n        throw new Error('No icon found');\n      }\n      const blinkMode = getAlertBlinkMode(this.type);\n      return html`\n        <div\n          class=${classMap({\n            wrapper: true,\n            [`blink-${blinkMode}`]: true,\n          })}\n        >\n          <span class=\"a\">${icons.a}</span>\n          <span class=\"b\">${icons.b}</span>\n        </div>\n      `;\n    }\n    return html`<div class=\"wrapper\">${this.renderStaticIcon()}</div>`;\n  }\n\n  static override styles = css`\n    .wrapper {\n      height: 100%;\n      width: 100%;\n      position: relative;\n\n      obi-diagnostic-badge,\n      obi-critical-badge {\n        display: block;\n        height: 100%;\n        width: 100%;\n        position: absolute;\n        top: 0;\n        left: 0;\n      }\n\n      svg {\n        height: 100%;\n        width: 100%;\n        position: absolute;\n        top: 0;\n        left: 0;\n      }\n      &.blink-alarm .a {\n        opacity: var(--alarm-blink-on);\n      }\n\n      &.blink-alarm .b {\n        opacity: var(--alarm-blink-off);\n      }\n\n      &.blink-critical .a {\n        opacity: var(--critical-blink-on);\n      }\n\n      &.blink-critical .b {\n        opacity: var(--critical-blink-off);\n      }\n\n      &.blink-warning .a {\n        opacity: var(--warning-blink-on);\n      }\n\n      &.blink-warning .b {\n        opacity: var(--warning-blink-off);\n      }\n\n      &.blink-low .a {\n        opacity: var(--low-blink-on);\n      }\n\n      &.blink-low .b {\n        opacity: var(--low-blink-off);\n      }\n    }\n  `;\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-alert-icon': ObcAlertIcon;\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"alert-icon.js","sources":["../../../src/components/alert-icon/alert-icon.ts"],"sourcesContent":["import {LitElement, html, css, TemplateResult, nothing} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport '../../icons/icon-caution-color-iec.js';\nimport {customElement} from '../../decorator.js';\nimport {AlertType} from '../../types.js';\nimport {\n  getAlertBlinkMode,\n  getBamAlertTypeForBlinking,\n  supportsBlinking,\n} from '../../alert-severity.js';\nimport '../../icons/icon-alarm-badge-outline.js';\nimport '../../icons/icon-warning-badge-outline.js';\nimport '../../icons/icon-caution-badge-outline.js';\nimport '../../icons/icon-alarm-acknowledged-iec.js';\nimport '../../icons/icon-warning-acknowledged-iec.js';\nimport '../../icons/icon-alarm-rectified-iec.js';\nimport '../../icons/icon-warning-rectified-iec.js';\nimport '../../icons/icon-alarm-rectified-outlined.js';\nimport '../../icons/icon-warning-rectified-outlined.js';\nimport '../../icons/icon-alarm-silenced-iec.js';\nimport '../../icons/icon-alarm-silenced-outlined.js';\nimport '../../icons/icon-warning-silenced-iec.js';\nimport '../../icons/icon-warning-silenced-outlined.js';\nimport '../../icons/icon-alarm-unacknowledged-iec.js';\nimport '../../icons/icon-alarm-acknowledged-outlined.js';\nimport '../../icons/icon-warning-unacknowledged-iec.js';\nimport '../../icons/icon-warning-unacknowledged-outlined.js';\n\nimport '../alert-frame/critical-badge.js';\nimport '../alert-frame/diagnostic-badge.js';\nimport {criticalA, criticalB} from './icons/icon-critical.js';\nimport {\n  criticalUnacknowledgedA,\n  criticalUnacknowledgedB,\n} from './icons/icon-critical-unacknowledged.js';\nimport {\n  criticalSilencedA,\n  criticalSilencedB,\n} from './icons/icon-critical-silenced.js';\nimport {\n  criticalRectifiedA,\n  criticalRectifiedB,\n} from './icons/icon-critical-rectified.js';\nimport {criticalAcknowledged} from './icons/icon-critical-acknowledged.js';\nimport {\n  lowUnacknowledgedA,\n  lowUnacknowledgedB,\n} from './icons/icon-low-unacknowledged.js';\nimport {lowSilencedA, lowSilencedB} from './icons/icon-low-silenced.js';\nimport {lowRectifiedA, lowRectifiedB} from './icons/icon-low-rectified.js';\nimport {lowAcknowledged} from './icons/icon-low-acknowledged.js';\n\nenum AlertIconState {\n  Silenced = 'silenced',\n  Unacknowledged = 'unacknowledged',\n  Acknowledged = 'acknowledged',\n  Rectified = 'rectified',\n}\n\nenum AlertIconName {\n  AlarmSilenced = 'alarm-silenced',\n  AlarmUnack = 'alarm-unack',\n  AlarmRectified = 'alarm-rectified',\n  WarningUnack = 'warning-unack',\n  WarningRectified = 'warning-rectified',\n  WarningSilenced = 'warning-silenced',\n  Critical = 'critical',\n  CriticalUnack = 'critical-unack',\n  CriticalSilenced = 'critical-silenced',\n  CriticalRectified = 'critical-rectified',\n  LowUnack = 'low-unack',\n  LowSilenced = 'low-silenced',\n  LowRectified = 'low-rectified',\n}\n\nconst mapping = {\n  [AlertIconName.AlarmSilenced]: {\n    a: html`<obi-alarm-silenced-iec usecsscolor></obi-alarm-silenced-iec>`,\n    b: html`<obi-alarm-silenced-outlined\n      usecsscolor\n    ></obi-alarm-silenced-outlined>`,\n  },\n  [AlertIconName.AlarmUnack]: {\n    a: html`<obi-alarm-unacknowledged-iec\n      usecsscolor\n    ></obi-alarm-unacknowledged-iec>`,\n    b: html`<obi-alarm-acknowledged-outlined\n      usecsscolor\n    ></obi-alarm-acknowledged-outlined>`,\n  },\n  [AlertIconName.AlarmRectified]: {\n    a: html`<obi-alarm-rectified-iec usecsscolor></obi-alarm-rectified-iec>`,\n    b: html`<obi-alarm-rectified-outlined\n      usecsscolor\n    ></obi-alarm-rectified-outlined>`,\n  },\n  [AlertIconName.WarningUnack]: {\n    a: html`<obi-warning-unacknowledged-iec\n      usecsscolor\n    ></obi-warning-unacknowledged-iec>`,\n    b: html`<obi-warning-unacknowledged-outlined\n      usecsscolor\n    ></obi-warning-unacknowledged-outlined>`,\n  },\n  [AlertIconName.WarningRectified]: {\n    a: html`<obi-warning-rectified-iec\n      usecsscolor\n    ></obi-warning-rectified-iec>`,\n    b: html`<obi-warning-rectified-outlined\n      usecsscolor\n    ></obi-warning-rectified-outlined>`,\n  },\n  [AlertIconName.WarningSilenced]: {\n    a: html`<obi-warning-silenced-iec usecsscolor></obi-warning-silenced-iec>`,\n    b: html`<obi-warning-silenced-outlined\n      usecsscolor\n    ></obi-warning-silenced-outlined>`,\n  },\n  [AlertIconName.Critical]: {\n    a: criticalA,\n    b: criticalB,\n  },\n  [AlertIconName.CriticalUnack]: {\n    a: criticalUnacknowledgedA,\n    b: criticalUnacknowledgedB,\n  },\n  [AlertIconName.CriticalSilenced]: {\n    a: criticalSilencedA,\n    b: criticalSilencedB,\n  },\n  [AlertIconName.CriticalRectified]: {\n    a: criticalRectifiedA,\n    b: criticalRectifiedB,\n  },\n  [AlertIconName.LowUnack]: {\n    a: lowUnacknowledgedA,\n    b: lowUnacknowledgedB,\n  },\n  [AlertIconName.LowSilenced]: {\n    a: lowSilencedA,\n    b: lowSilencedB,\n  },\n  [AlertIconName.LowRectified]: {\n    a: lowRectifiedA,\n    b: lowRectifiedB,\n  },\n};\n/**\n * `obc-alert-icon` – Animated alert icon for signaling alarm and warning states.\n *\n * Displays a specialized icon with a blinking effect to visually indicate alert or warning conditions. The icon type is determined by the `name` property, supporting both alarm and warning variants in different states (such as silenced, unacknowledged, or rectified).\n *\n * Appears in notification areas, alert banners, or status panels to draw attention to active or historical alert conditions. The blinking animation helps highlight urgency or status changes without requiring user interaction.\n *\n * ## Features\n * - **Multiple Icon Types:** Supports all alarm and warning types.\n * - **Blinking Animation:** Uses two SVG layers with alternating opacity to create a blinking effect, visually emphasizing the alert or warning state.\n * - **Adaptive Styling:** Applies different CSS variables for alarm and warning types to allow for distinct visual cues (e.g., color, blink timing).\n * - **Scalable:** Designed to fit any container size; scales with its parent element.\n *\n * ## Usage Guidelines\n * Use `obc-alert-icon` to visually represent the status of alarms or warnings in notification panels, alert lists, or system status areas. The blinking effect is intended to draw user attention to active or recent alert conditions. Select the appropriate `name` value to match the alert state you wish to indicate.\n *\n * **TODO(designer):** Provide guidance on when to use each icon variant (e.g., when to use \"rectified\" vs. \"silenced\"), and any best practices for icon placement or blink timing.\n *\n * ## Properties\n * - `type` (AlertType): The type of alarm to display.\n * - `status` (AlarmStatus): The status of the alarm to display.\n *\n * ## Best Practices\n * - Only use the blinking alert icon for states that require immediate or prominent user attention.\n * - Ensure the icon is sized appropriately for its context (e.g., 32x32px or 64x64px for status panels).\n * - Avoid using multiple blinking icons in close proximity to prevent visual overload.\n *\n * ## Example\n * ```html\n * <obc-alert-icon .alarmType=${alarm.type} .alarmStatus=${alarm.status}></obc-alert-icon>\n * ```\n *\n * @stable\n */\n@customElement('obc-alert-icon')\nexport class ObcAlertIcon extends LitElement {\n  @property({type: String}) alertType: AlertType = AlertType.Alarm;\n  /* @deprecated use `alertType` instead */\n  @property({type: String}) type?: AlertType;\n  /**\n   * @availableWhen type in [Alarm, Warning, LevelHigh, LevelMedium, LevelLow]\n   */\n  @property({type: Boolean}) acknowledged?: boolean;\n  /**\n   * @availableWhen type in [Alarm, Warning, LevelHigh, LevelMedium, LevelLow]\n   */\n  @property({type: Boolean}) active?: boolean;\n  @property({type: Boolean}) silenced?: boolean;\n\n  private get _effectiveType(): AlertType {\n    if (this.type) {\n      return this.type;\n    }\n    return this.alertType;\n  }\n\n  private get bamType(): AlertType {\n    return getBamAlertTypeForBlinking(this._effectiveType);\n  }\n\n  private get _effectiveState(): AlertIconState {\n    if (this.active === false) {\n      return AlertIconState.Rectified;\n    } else if (this.acknowledged) {\n      return AlertIconState.Acknowledged;\n    } else if (this.silenced) {\n      return AlertIconState.Silenced;\n    } else if (this.active === true) {\n      return AlertIconState.Unacknowledged;\n    }\n    return AlertIconState.Unacknowledged;\n  }\n\n  get icon() {\n    if (this._effectiveType === AlertType.LevelCritical) {\n      switch (this._effectiveState) {\n        case AlertIconState.Rectified:\n          return mapping[AlertIconName.CriticalRectified];\n        case AlertIconState.Silenced:\n          return mapping[AlertIconName.CriticalSilenced];\n        case AlertIconState.Unacknowledged:\n          return mapping[AlertIconName.CriticalUnack];\n        default:\n          return mapping[AlertIconName.Critical];\n      }\n    } else if (this._effectiveType === AlertType.LevelLow) {\n      switch (this._effectiveState) {\n        case AlertIconState.Rectified:\n          return mapping[AlertIconName.LowRectified];\n        case AlertIconState.Silenced:\n          return mapping[AlertIconName.LowSilenced];\n        case AlertIconState.Unacknowledged:\n          return mapping[AlertIconName.LowUnack];\n        default:\n          return mapping[AlertIconName.LowUnack];\n      }\n    } else if (this.bamType === AlertType.Alarm) {\n      switch (this._effectiveState) {\n        case AlertIconState.Rectified:\n          return mapping[AlertIconName.AlarmRectified];\n        case AlertIconState.Silenced:\n          return mapping[AlertIconName.AlarmSilenced];\n        case AlertIconState.Unacknowledged:\n          return mapping[AlertIconName.AlarmUnack];\n        default:\n          return null;\n      }\n    } else if (this.bamType === AlertType.Warning) {\n      if (this.active === false) {\n        return mapping[AlertIconName.WarningRectified];\n      } else if (this.acknowledged) {\n        return mapping[AlertIconName.WarningSilenced];\n      } else {\n        return mapping[AlertIconName.WarningUnack];\n      }\n    }\n\n    return null;\n  }\n\n  private renderStaticIcon(): TemplateResult | typeof nothing {\n    // Caution and diagnostic always show a fixed symbol, regardless of state.\n    if (this._effectiveType === AlertType.Caution) {\n      return html`<obi-caution-color-iec usecsscolor></obi-caution-color-iec>`;\n    }\n    if (this._effectiveType === AlertType.LevelDiagnostic) {\n      return html`<obi-diagnostic-badge\n        style=\"color: var(--alert-diagnostic-color);\"\n      ></obi-diagnostic-badge>`;\n    }\n    if (this._effectiveState === AlertIconState.Acknowledged) {\n      if (this._effectiveType === AlertType.LevelCritical) {\n        return html`${criticalAcknowledged}`;\n      }\n      if (this._effectiveType === AlertType.LevelLow) {\n        return html`${lowAcknowledged}`;\n      }\n      switch (this.bamType) {\n        case AlertType.Alarm:\n          return html`<obi-alarm-acknowledged-iec\n            usecsscolor\n          ></obi-alarm-acknowledged-iec>`;\n        case AlertType.Warning:\n          return html`<obi-warning-acknowledged-iec\n            usecsscolor\n          ></obi-warning-acknowledged-iec>`;\n        default:\n          return nothing;\n      }\n    } else if (this._effectiveState === AlertIconState.Rectified) {\n      if (this._effectiveType === AlertType.LevelCritical) {\n        return html`${criticalRectifiedB}`;\n      }\n      if (this._effectiveType === AlertType.LevelLow) {\n        return html`${lowRectifiedB}`;\n      }\n      switch (this.bamType) {\n        case AlertType.Alarm:\n          return html`<obi-alarm-rectified-outlined\n            usecsscolor\n          ></obi-alarm-rectified-outlined>`;\n        case AlertType.Warning:\n          return html`<obi-warning-rectified-outlined\n            usecsscolor\n          ></obi-warning-rectified-outlined>`;\n        default:\n          return nothing;\n      }\n    }\n    return nothing;\n  }\n\n  override render() {\n    if (!this._effectiveType) {\n      return html`<div>No alarm</div>`;\n    }\n    if (supportsBlinking(this._effectiveType, this.acknowledged ?? false)) {\n      const icons = this.icon;\n      if (!icons) {\n        throw new Error('No icon found');\n      }\n      const blinkMode = getAlertBlinkMode(this._effectiveType);\n      return html`\n        <div\n          class=${classMap({\n            wrapper: true,\n            [`blink-${blinkMode}`]: true,\n          })}\n        >\n          <span class=\"a\">${icons.a}</span>\n          <span class=\"b\">${icons.b}</span>\n        </div>\n      `;\n    }\n    return html`<div class=\"wrapper\">${this.renderStaticIcon()}</div>`;\n  }\n\n  static override styles = css`\n    .wrapper {\n      height: 100%;\n      width: 100%;\n      position: relative;\n\n      obi-diagnostic-badge,\n      obi-critical-badge {\n        display: block;\n        height: 100%;\n        width: 100%;\n        position: absolute;\n        top: 0;\n        left: 0;\n      }\n\n      svg,\n      .a,\n      .b {\n        height: 100%;\n        width: 100%;\n        position: absolute;\n        top: 0;\n        left: 0;\n      }\n      &.blink-alarm .a {\n        opacity: var(--alarm-blink-on);\n      }\n\n      &.blink-alarm .b {\n        opacity: var(--alarm-blink-off);\n      }\n\n      &.blink-critical .a {\n        opacity: var(--critical-blink-on);\n      }\n\n      &.blink-critical .b {\n        opacity: var(--critical-blink-off);\n      }\n\n      &.blink-warning .a {\n        opacity: var(--warning-blink-on);\n      }\n\n      &.blink-warning .b {\n        opacity: var(--warning-blink-off);\n      }\n\n      &.blink-low .a {\n        opacity: var(--low-blink-on);\n      }\n\n      &.blink-low .b {\n        opacity: var(--low-blink-off);\n      }\n    }\n  `;\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-alert-icon': ObcAlertIcon;\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/components/alert-icon/icons/icon-critical-acknowledged.d.ts

@@ -0,0 +1,2 @@
+export declare const criticalAcknowledged: import('lit-html').TemplateResult<2>;
+//# sourceMappingURL=icon-critical-acknowledged.d.ts.map

package/dist/components/alert-icon/icons/icon-critical-acknowledged.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-critical-acknowledged.d.ts","sourceRoot":"","sources":["../../../../src/components/alert-icon/icons/icon-critical-acknowledged.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,oBAAoB,sCAW1B,CAAC"}

package/dist/components/alert-icon/icons/icon-critical-acknowledged.js

@@ -0,0 +1,17 @@
+import { svg } from "lit";
+const criticalAcknowledged = svg`<svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+<path d="M 22,12
+           L 17,20.66
+           L 7,20.66
+           L 2,12
+           L 7,3.34
+           L 17,3.34
+           Z"
+        fill="var(--alert-critical-color)" stroke="var(--alert-critical-outline-color)" />
+<path d="M13 13V7H11V13H13Z" fill="var(--on-critical-active-color)"/>
+<path d="M13 17V15H11V17H13Z" fill="var(--on-critical-active-color)"/>
+</svg>`;
+export {
+  criticalAcknowledged
+};
+//# sourceMappingURL=icon-critical-acknowledged.js.map

package/dist/components/alert-icon/icons/icon-critical-acknowledged.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-critical-acknowledged.js","sources":["../../../../src/components/alert-icon/icons/icon-critical-acknowledged.ts"],"sourcesContent":["import {svg} from 'lit';\n\nexport const criticalAcknowledged = svg`<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M 22,12\n           L 17,20.66\n           L 7,20.66\n           L 2,12\n           L 7,3.34\n           L 17,3.34\n           Z\"\n        fill=\"var(--alert-critical-color)\" stroke=\"var(--alert-critical-outline-color)\" />\n<path d=\"M13 13V7H11V13H13Z\" fill=\"var(--on-critical-active-color)\"/>\n<path d=\"M13 17V15H11V17H13Z\" fill=\"var(--on-critical-active-color)\"/>\n</svg>`;\n"],"names":[],"mappings":";AAEO,MAAM,uBAAuB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/components/alert-icon/icons/icon-critical-rectified.d.ts

@@ -0,0 +1,3 @@
+export declare const criticalRectifiedA: import('lit-html').TemplateResult<2>;
+export declare const criticalRectifiedB: import('lit-html').TemplateResult<2>;
+//# sourceMappingURL=icon-critical-rectified.d.ts.map

package/dist/components/alert-icon/icons/icon-critical-rectified.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-critical-rectified.d.ts","sourceRoot":"","sources":["../../../../src/components/alert-icon/icons/icon-critical-rectified.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,kBAAkB,sCAUxB,CAAC;AAER,eAAO,MAAM,kBAAkB,sCAUxB,CAAC"}

package/dist/components/alert-icon/icons/icon-critical-rectified.js

@@ -0,0 +1,28 @@
+import { svg } from "lit";
+const criticalRectifiedA = svg`<svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+<path d="M 22,12
+           L 17,20.66
+           L 7,20.66
+           L 2,12
+           L 7,3.34
+           L 17,3.34
+           Z"
+        fill="var(--alert-critical-color)" stroke="var(--alert-critical-outline-color)" />
+<path fill-rule="evenodd" clip-rule="evenodd" d="M18.2071 9.20706L10.5 16.9142L5.79291 12.2071L7.20712 10.7928L10.5 14.0857L16.7929 7.79285L18.2071 9.20706Z" fill="var(--on-critical-active-color)"/>
+</svg>`;
+const criticalRectifiedB = svg`<svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+<path d="M 22,12
+           L 17,20.66
+           L 7,20.66
+           L 2,12
+           L 7,3.34
+           L 17,3.34
+           Z"
+        fill="none" stroke="var(--element-active-color)" />
+<path fill-rule="evenodd" clip-rule="evenodd" d="M18.2071 9.20706L10.5 16.9142L5.79291 12.2071L7.20712 10.7928L10.5 14.0857L16.7929 7.79285L18.2071 9.20706Z" fill="var(--element-active-color)"/>
+</svg>`;
+export {
+  criticalRectifiedA,
+  criticalRectifiedB
+};
+//# sourceMappingURL=icon-critical-rectified.js.map

package/dist/components/alert-icon/icons/icon-critical-rectified.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-critical-rectified.js","sources":["../../../../src/components/alert-icon/icons/icon-critical-rectified.ts"],"sourcesContent":["import {svg} from 'lit';\n\nexport const criticalRectifiedA = svg`<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M 22,12\n           L 17,20.66\n           L 7,20.66\n           L 2,12\n           L 7,3.34\n           L 17,3.34\n           Z\"\n        fill=\"var(--alert-critical-color)\" stroke=\"var(--alert-critical-outline-color)\" />\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M18.2071 9.20706L10.5 16.9142L5.79291 12.2071L7.20712 10.7928L10.5 14.0857L16.7929 7.79285L18.2071 9.20706Z\" fill=\"var(--on-critical-active-color)\"/>\n</svg>`;\n\nexport const criticalRectifiedB = svg`<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M 22,12\n           L 17,20.66\n           L 7,20.66\n           L 2,12\n           L 7,3.34\n           L 17,3.34\n           Z\"\n        fill=\"none\" stroke=\"var(--element-active-color)\" />\n<path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M18.2071 9.20706L10.5 16.9142L5.79291 12.2071L7.20712 10.7928L10.5 14.0857L16.7929 7.79285L18.2071 9.20706Z\" fill=\"var(--element-active-color)\"/>\n</svg>`;\n"],"names":[],"mappings":";AAEO,MAAM,qBAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAY3B,MAAM,qBAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/components/alert-icon/icons/icon-critical-silenced.d.ts

@@ -0,0 +1,3 @@
+export declare const criticalSilencedA: import('lit-html').TemplateResult<2>;
+export declare const criticalSilencedB: import('lit-html').TemplateResult<2>;
+//# sourceMappingURL=icon-critical-silenced.d.ts.map

package/dist/components/alert-icon/icons/icon-critical-silenced.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-critical-silenced.d.ts","sourceRoot":"","sources":["../../../../src/components/alert-icon/icons/icon-critical-silenced.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,iBAAiB,sCAWvB,CAAC;AAER,eAAO,MAAM,iBAAiB,sCAWvB,CAAC"}

package/dist/components/alert-icon/icons/{icon-warning-silenced.js → icon-critical-silenced.js}

@@ -1,17 +1,30 @@
 import { svg } from "lit";
-const warningSilencedA = svg`<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" style="fill: var(--alert-warning-color)"/>
-<path d="M8.876 6.68796L7.81255 5.62451L6.75189 6.68517L10.0666 9.99993H8.29999C8.01997 9.99993 7.87995 9.99993 7.773 10.0544C7.67892 10.1024 7.60243 10.1789 7.55449 10.2729C7.49999 10.3799 7.49999 10.5199 7.49999 10.7999V13.1999C7.49999 13.48 7.49999 13.62 7.55449 13.7269C7.60243 13.821 7.67892 13.8975 7.773 13.9454C7.87995 13.9999 8.01997 13.9999 8.29999 13.9999H10.6686C10.7909 13.9999 10.8521 13.9999 10.9096 14.0137C10.9606 14.026 11.0094 14.0462 11.0541 14.0736C11.1046 14.1045 11.1478 14.1478 11.2343 14.2342L13.6343 16.6342C14.0627 17.0626 14.2769 17.2768 14.4608 17.2913C14.6203 17.3038 14.7762 17.2393 14.8802 17.1175C15 16.9773 15 16.6744 15 16.0686V14.9333L17.3585 17.2918L18.4192 16.2311L18.0684 15.8803L18.067 15.8817L8.87464 6.68932L8.876 6.68796Z" style="fill: var(--on-warning-active-color)"/>
-<path d="M15 10.6933V7.9313C15 7.32548 15 7.02257 14.8802 6.88231C14.7762 6.7606 14.6203 6.69602 14.4608 6.70858C14.2769 6.72305 14.0627 6.93724 13.6343 7.36561L12.6533 8.34664L15 10.6933Z" style="fill: var(--on-warning-active-color)"/>
-</svg>
-`;
-const warningSilencedB = svg`<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path fill-rule="evenodd" clip-rule="evenodd" d="M12 21C16.9706 21 21 16.9706 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 16.9706 7.02944 21 12 21ZM12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z" style="fill: var(--element-active-color)"/>
-<path d="M8.876 6.68796L7.81255 5.62451L6.75189 6.68517L10.0666 9.99993H8.29999C8.01997 9.99993 7.87995 9.99993 7.773 10.0544C7.67892 10.1024 7.60243 10.1789 7.55449 10.2729C7.49999 10.3799 7.49999 10.5199 7.49999 10.7999V13.1999C7.49999 13.48 7.49999 13.62 7.55449 13.7269C7.60243 13.821 7.67892 13.8975 7.773 13.9454C7.87995 13.9999 8.01997 13.9999 8.29999 13.9999H10.6686C10.7909 13.9999 10.8521 13.9999 10.9096 14.0137C10.9606 14.026 11.0094 14.0462 11.0541 14.0736C11.1046 14.1045 11.1478 14.1478 11.2343 14.2342L13.6343 16.6342C14.0627 17.0626 14.2769 17.2768 14.4608 17.2913C14.6203 17.3038 14.7762 17.2393 14.8802 17.1175C15 16.9773 15 16.6744 15 16.0686V14.9333L17.3585 17.2918L18.4192 16.2311L18.0684 15.8803L18.067 15.8817L8.87464 6.68932L8.876 6.68796Z" style="fill: var(--element-active-color)"/>
-<path d="M15 10.6933V7.9313C15 7.32548 15 7.02257 14.8802 6.88231C14.7762 6.7606 14.6203 6.69602 14.4608 6.70858C14.2769 6.72305 14.0627 6.93724 13.6343 7.36561L12.6533 8.34664L15 10.6933Z" style="fill: var(--element-active-color)"/>
+const criticalSilencedA = svg`<svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+<path d="M 22,12
+           L 17,20.66
+           L 7,20.66
+           L 2,12
+           L 7,3.34
+           L 17,3.34
+           Z"
+        fill="var(--alert-critical-color)" stroke="var(--alert-critical-outline-color)" />
+<path d="M8.876 6.68796L7.81255 5.62451L6.75189 6.68517L10.0666 9.99993H8.29999C8.01997 9.99993 7.87995 9.99993 7.773 10.0544C7.67892 10.1024 7.60243 10.1789 7.55449 10.2729C7.49999 10.3799 7.49999 10.5199 7.49999 10.7999V13.1999C7.49999 13.48 7.49999 13.62 7.55449 13.7269C7.60243 13.821 7.67892 13.8975 7.773 13.9454C7.87995 13.9999 8.01997 13.9999 8.29999 13.9999H10.6686C10.7909 13.9999 10.8521 13.9999 10.9096 14.0137C10.9606 14.026 11.0094 14.0462 11.0541 14.0736C11.1046 14.1045 11.1478 14.1478 11.2343 14.2342L13.6343 16.6342C14.0627 17.0626 14.2769 17.2768 14.4608 17.2913C14.6203 17.3038 14.7762 17.2393 14.8802 17.1175C15 16.9773 15 16.6744 15 16.0686V14.9333L17.3585 17.2918L18.4192 16.2311L18.0684 15.8803L18.067 15.8817L8.87464 6.68932L8.876 6.68796Z" fill="var(--on-critical-active-color)"/>
+<path d="M15 10.6933V7.9313C15 7.32548 15 7.02257 14.8802 6.88231C14.7762 6.7606 14.6203 6.69602 14.4608 6.70858C14.2769 6.72305 14.0627 6.93724 13.6343 7.36561L12.6533 8.34664L15 10.6933Z" fill="var(--on-critical-active-color)"/>
+</svg>`;
+const criticalSilencedB = svg`<svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
+<path d="M 22,12
+           L 17,20.66
+           L 7,20.66
+           L 2,12
+           L 7,3.34
+           L 17,3.34
+           Z"
+        fill="none" stroke="var(--element-active-color)" />
+<path d="M8.876 6.68796L7.81255 5.62451L6.75189 6.68517L10.0666 9.99993H8.29999C8.01997 9.99993 7.87995 9.99993 7.773 10.0544C7.67892 10.1024 7.60243 10.1789 7.55449 10.2729C7.49999 10.3799 7.49999 10.5199 7.49999 10.7999V13.1999C7.49999 13.48 7.49999 13.62 7.55449 13.7269C7.60243 13.821 7.67892 13.8975 7.773 13.9454C7.87995 13.9999 8.01997 13.9999 8.29999 13.9999H10.6686C10.7909 13.9999 10.8521 13.9999 10.9096 14.0137C10.9606 14.026 11.0094 14.0462 11.0541 14.0736C11.1046 14.1045 11.1478 14.1478 11.2343 14.2342L13.6343 16.6342C14.0627 17.0626 14.2769 17.2768 14.4608 17.2913C14.6203 17.3038 14.7762 17.2393 14.8802 17.1175C15 16.9773 15 16.6744 15 16.0686V14.9333L17.3585 17.2918L18.4192 16.2311L18.0684 15.8803L18.067 15.8817L8.87464 6.68932L8.876 6.68796Z" fill="var(--element-active-color)"/>
+<path d="M15 10.6933V7.9313C15 7.32548 15 7.02257 14.8802 6.88231C14.7762 6.7606 14.6203 6.69602 14.4608 6.70858C14.2769 6.72305 14.0627 6.93724 13.6343 7.36561L12.6533 8.34664L15 10.6933Z" fill="var(--element-active-color)"/>
 </svg>`;
 export {
-  warningSilencedA,
-  warningSilencedB
+  criticalSilencedA,
+  criticalSilencedB
 };
-//# sourceMappingURL=icon-warning-silenced.js.map
+//# sourceMappingURL=icon-critical-silenced.js.map

package/dist/components/alert-icon/icons/icon-critical-silenced.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-critical-silenced.js","sources":["../../../../src/components/alert-icon/icons/icon-critical-silenced.ts"],"sourcesContent":["import {svg} from 'lit';\n\nexport const criticalSilencedA = svg`<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M 22,12\n           L 17,20.66\n           L 7,20.66\n           L 2,12\n           L 7,3.34\n           L 17,3.34\n           Z\"\n        fill=\"var(--alert-critical-color)\" stroke=\"var(--alert-critical-outline-color)\" />\n<path d=\"M8.876 6.68796L7.81255 5.62451L6.75189 6.68517L10.0666 9.99993H8.29999C8.01997 9.99993 7.87995 9.99993 7.773 10.0544C7.67892 10.1024 7.60243 10.1789 7.55449 10.2729C7.49999 10.3799 7.49999 10.5199 7.49999 10.7999V13.1999C7.49999 13.48 7.49999 13.62 7.55449 13.7269C7.60243 13.821 7.67892 13.8975 7.773 13.9454C7.87995 13.9999 8.01997 13.9999 8.29999 13.9999H10.6686C10.7909 13.9999 10.8521 13.9999 10.9096 14.0137C10.9606 14.026 11.0094 14.0462 11.0541 14.0736C11.1046 14.1045 11.1478 14.1478 11.2343 14.2342L13.6343 16.6342C14.0627 17.0626 14.2769 17.2768 14.4608 17.2913C14.6203 17.3038 14.7762 17.2393 14.8802 17.1175C15 16.9773 15 16.6744 15 16.0686V14.9333L17.3585 17.2918L18.4192 16.2311L18.0684 15.8803L18.067 15.8817L8.87464 6.68932L8.876 6.68796Z\" fill=\"var(--on-critical-active-color)\"/>\n<path d=\"M15 10.6933V7.9313C15 7.32548 15 7.02257 14.8802 6.88231C14.7762 6.7606 14.6203 6.69602 14.4608 6.70858C14.2769 6.72305 14.0627 6.93724 13.6343 7.36561L12.6533 8.34664L15 10.6933Z\" fill=\"var(--on-critical-active-color)\"/>\n</svg>`;\n\nexport const criticalSilencedB = svg`<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M 22,12\n           L 17,20.66\n           L 7,20.66\n           L 2,12\n           L 7,3.34\n           L 17,3.34\n           Z\"\n        fill=\"none\" stroke=\"var(--element-active-color)\" />\n<path d=\"M8.876 6.68796L7.81255 5.62451L6.75189 6.68517L10.0666 9.99993H8.29999C8.01997 9.99993 7.87995 9.99993 7.773 10.0544C7.67892 10.1024 7.60243 10.1789 7.55449 10.2729C7.49999 10.3799 7.49999 10.5199 7.49999 10.7999V13.1999C7.49999 13.48 7.49999 13.62 7.55449 13.7269C7.60243 13.821 7.67892 13.8975 7.773 13.9454C7.87995 13.9999 8.01997 13.9999 8.29999 13.9999H10.6686C10.7909 13.9999 10.8521 13.9999 10.9096 14.0137C10.9606 14.026 11.0094 14.0462 11.0541 14.0736C11.1046 14.1045 11.1478 14.1478 11.2343 14.2342L13.6343 16.6342C14.0627 17.0626 14.2769 17.2768 14.4608 17.2913C14.6203 17.3038 14.7762 17.2393 14.8802 17.1175C15 16.9773 15 16.6744 15 16.0686V14.9333L17.3585 17.2918L18.4192 16.2311L18.0684 15.8803L18.067 15.8817L8.87464 6.68932L8.876 6.68796Z\" fill=\"var(--element-active-color)\"/>\n<path d=\"M15 10.6933V7.9313C15 7.32548 15 7.02257 14.8802 6.88231C14.7762 6.7606 14.6203 6.69602 14.4608 6.70858C14.2769 6.72305 14.0627 6.93724 13.6343 7.36561L12.6533 8.34664L15 10.6933Z\" fill=\"var(--element-active-color)\"/>\n</svg>`;\n"],"names":[],"mappings":";AAEO,MAAM,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAa1B,MAAM,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/components/alert-icon/icons/icon-critical-unacknowledged.d.ts

@@ -0,0 +1,3 @@
+export declare const criticalUnacknowledgedA: import('lit-html').TemplateResult<2>;
+export declare const criticalUnacknowledgedB: import('lit-html').TemplateResult<2>;
+//# sourceMappingURL=icon-critical-unacknowledged.d.ts.map

package/dist/components/alert-icon/icons/icon-critical-unacknowledged.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"icon-critical-unacknowledged.d.ts","sourceRoot":"","sources":["../../../../src/components/alert-icon/icons/icon-critical-unacknowledged.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,uBAAuB,sCAU7B,CAAC;AAER,eAAO,MAAM,uBAAuB,sCAU7B,CAAC"}