@oicl/openbridge-webcomponents 2.0.0-next.63 → 2.0.0-next.65
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundle/openbridge-webcomponents.bundle.js +392 -381
- package/bundle/openbridge-webcomponents.bundle.js.map +1 -1
- package/custom-elements.json +57 -199
- package/dist/alert-severity.d.ts.map +1 -1
- package/dist/alert-severity.js +37 -35
- package/dist/alert-severity.js.map +1 -1
- package/dist/ar/building-blocks/poi-header/poi-header.css.js +15 -15
- package/dist/ar/building-blocks/poi-header/poi-header.d.ts +6 -6
- package/dist/ar/building-blocks/poi-header/poi-header.d.ts.map +1 -1
- package/dist/ar/building-blocks/poi-header/poi-header.js +5 -5
- package/dist/ar/building-blocks/poi-header/poi-header.js.map +1 -1
- package/dist/ar/poi-button/poi-button.css.js +31 -30
- package/dist/ar/poi-button/poi-button.css.js.map +1 -1
- package/dist/ar/poi-button/poi-button.d.ts +6 -6
- package/dist/ar/poi-button/poi-button.d.ts.map +1 -1
- package/dist/ar/poi-button/poi-button.js +15 -15
- package/dist/ar/poi-button/poi-button.js.map +1 -1
- package/dist/ar/types.d.ts +5 -5
- package/dist/ar/types.d.ts.map +1 -1
- package/dist/ar/types.js +5 -5
- package/dist/ar/types.js.map +1 -1
- package/dist/automation/automation-badge/automation-badge.d.ts +7 -7
- package/dist/automation/automation-badge/automation-badge.d.ts.map +1 -1
- package/dist/automation/automation-badge/automation-badge.js +29 -29
- package/dist/automation/automation-badge/automation-badge.js.map +1 -1
- package/dist/automation/automation-button/abstract-automation-button.d.ts +5 -5
- package/dist/automation/automation-button/abstract-automation-button.d.ts.map +1 -1
- package/dist/automation/automation-button/abstract-automation-button.js +15 -15
- package/dist/automation/automation-button/abstract-automation-button.js.map +1 -1
- package/dist/automation/automation-tank/automation-tank.js +10 -10
- package/dist/automation/automation-tank/automation-tank.js.map +1 -1
- package/dist/components/accordion-card/accordion-card.css.js +5 -5
- package/dist/components/alert-button/alert-button.css.js +128 -128
- package/dist/components/alert-frame/alert-frame.css.js +6 -6
- package/dist/components/alert-frame/alert-frame.d.ts +4 -4
- package/dist/components/alert-frame/alert-frame.js.map +1 -1
- package/dist/components/alert-icon/alert-icon.js +4 -4
- package/dist/components/alert-icon/alert-icon.js.map +1 -1
- package/dist/components/badge/badge.css.js +10 -10
- package/dist/components/badge/badge.d.ts +13 -13
- package/dist/components/badge/badge.d.ts.map +1 -1
- package/dist/components/badge/badge.js +10 -10
- package/dist/components/badge/badge.js.map +1 -1
- package/dist/components/navigation-item/navigation-item.d.ts +7 -7
- package/dist/components/navigation-item/navigation-item.d.ts.map +1 -1
- package/dist/components/navigation-item/navigation-item.js +3 -15
- package/dist/components/navigation-item/navigation-item.js.map +1 -1
- package/dist/components/navigation-item-group/navigation-item-group.d.ts +8 -7
- package/dist/components/navigation-item-group/navigation-item-group.d.ts.map +1 -1
- package/dist/components/navigation-item-group/navigation-item-group.js +3 -15
- package/dist/components/navigation-item-group/navigation-item-group.js.map +1 -1
- package/dist/components/navigation-menu/navigation-menu.d.ts +2 -2
- package/dist/components/navigation-menu/navigation-menu.js.map +1 -1
- package/dist/components/tree-navigation-group/tree-navigation-group.d.ts +10 -10
- package/dist/components/tree-navigation-group/tree-navigation-group.d.ts.map +1 -1
- package/dist/components/tree-navigation-group/tree-navigation-group.js +3 -15
- package/dist/components/tree-navigation-group/tree-navigation-group.js.map +1 -1
- package/dist/components/tree-navigation-item/tree-navigation-item.css.js +13 -0
- package/dist/components/tree-navigation-item/tree-navigation-item.css.js.map +1 -1
- package/dist/components/tree-navigation-item/tree-navigation-item.d.ts +59 -8
- package/dist/components/tree-navigation-item/tree-navigation-item.d.ts.map +1 -1
- package/dist/components/tree-navigation-item/tree-navigation-item.js +46 -17
- package/dist/components/tree-navigation-item/tree-navigation-item.js.map +1 -1
- package/dist/manual-icon/icon-alerts-critical-twotone.d.ts +1 -1
- package/dist/manual-icon/icon-alerts-critical-twotone.js.map +1 -1
- package/dist/manual-icon/icon-alerts-diagnostic-twotone.d.ts +1 -1
- package/dist/manual-icon/icon-alerts-diagnostic-twotone.js.map +1 -1
- package/dist/types.d.ts +5 -5
- package/dist/types.d.ts.map +1 -1
- package/dist/types.js +11 -11
- package/dist/types.js.map +1 -1
- package/package.json +1 -1
|
@@ -33,6 +33,38 @@ export declare enum TreeTerminalType {
|
|
|
33
33
|
aggregatedHeader = "aggregated-header",
|
|
34
34
|
groupHeader = "group-header"
|
|
35
35
|
}
|
|
36
|
+
/**
|
|
37
|
+
* Per-severity alert counts for a tree row's trailing badge(s). Each `count*`
|
|
38
|
+
* is the number of active alerts of that severity at or beneath the row — the
|
|
39
|
+
* level severities `level-critical`, `level-high`, `level-medium`, `level-low`,
|
|
40
|
+
* and `level-diagnostic`, plus the IEC severities `alarm`, `warning`, and
|
|
41
|
+
* `caution`. Badges are ordered and aggregated by the shared
|
|
42
|
+
* `ALERT_SEVERITY_PRIORITY` ranking, most to least severe.
|
|
43
|
+
*
|
|
44
|
+
* Set `aggregate` to collapse the counts into a single badge showing the total,
|
|
45
|
+
* styled as the highest category present; otherwise one badge is rendered per
|
|
46
|
+
* non-zero count.
|
|
47
|
+
*/
|
|
48
|
+
export interface TreeNavigationItemAlerts {
|
|
49
|
+
/** Collapse all counts into one badge: total count, highest-severity style. */
|
|
50
|
+
aggregate?: boolean;
|
|
51
|
+
/** Number of level-critical alerts. */
|
|
52
|
+
countLevelCritical?: number;
|
|
53
|
+
/** Number of alarm alerts. */
|
|
54
|
+
countAlarm?: number;
|
|
55
|
+
/** Number of level-high alerts. */
|
|
56
|
+
countLevelHigh?: number;
|
|
57
|
+
/** Number of warning alerts. */
|
|
58
|
+
countWarning?: number;
|
|
59
|
+
/** Number of level-medium alerts. */
|
|
60
|
+
countLevelMedium?: number;
|
|
61
|
+
/** Number of caution alerts. */
|
|
62
|
+
countCaution?: number;
|
|
63
|
+
/** Number of level-low alerts. */
|
|
64
|
+
countLevelLow?: number;
|
|
65
|
+
/** Number of level-diagnostic alerts. */
|
|
66
|
+
countLevelDiagnostic?: number;
|
|
67
|
+
}
|
|
36
68
|
/**
|
|
37
69
|
* `<obc-tree-navigation-item>` – A single row in a tree- or file-explorer-style
|
|
38
70
|
* navigation list, with indentation guide lines, an optional expand/collapse
|
|
@@ -57,8 +89,12 @@ export declare enum TreeTerminalType {
|
|
|
57
89
|
* aggregated or grouped alerts.
|
|
58
90
|
* - **Leading icon:** Provide an icon via the `icon` slot (shown when
|
|
59
91
|
* `hasLeadingIcon`).
|
|
60
|
-
* - **Alert
|
|
61
|
-
*
|
|
92
|
+
* - **Alert badges:** Trailing counter badges driven by the `alerts` object — a
|
|
93
|
+
* per-severity count map with one field per level severity (critical, high,
|
|
94
|
+
* medium, low, diagnostic). By default each non-zero count renders its own
|
|
95
|
+
* badge, ordered most to least severe by `ALERT_SEVERITY_PRIORITY`; set
|
|
96
|
+
* `alerts.aggregate` to instead show a single badge with the combined total,
|
|
97
|
+
* styled as the highest category present.
|
|
62
98
|
* - **Checked state:** `checked` highlights the current selection using the
|
|
63
99
|
* amplified elevation style. A checked row is the current item and is not
|
|
64
100
|
* re-selectable — it shows no hover/pressed feedback and fires no `click` or
|
|
@@ -123,12 +159,17 @@ export declare class ObcTreeNavigationItem extends LitElement {
|
|
|
123
159
|
* One of `regular` (default), `aggregated-header`, or `group-header`.
|
|
124
160
|
*/
|
|
125
161
|
terminalType: string;
|
|
126
|
-
/**
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
162
|
+
/**
|
|
163
|
+
* Per-severity alert counts for the row's trailing badge(s). Omit (or leave
|
|
164
|
+
* every count at 0) for a row with no alerts. See {@link TreeNavigationItemAlerts}.
|
|
165
|
+
*
|
|
166
|
+
* - When `aggregate` is true, a single badge is shown: its number is the sum
|
|
167
|
+
* of all counts and its severity is the highest category present
|
|
168
|
+
* (critical → alarm → warning → caution).
|
|
169
|
+
* - Otherwise one badge is shown per count greater than 0, ordered most to
|
|
170
|
+
* least severe and spaced by the alert-counter spacing token.
|
|
171
|
+
*/
|
|
172
|
+
alerts?: TreeNavigationItemAlerts;
|
|
132
173
|
/**
|
|
133
174
|
* The URL to navigate to when the row is activated. If set, the row renders as
|
|
134
175
|
* a link; otherwise it acts as a button.
|
|
@@ -137,6 +178,16 @@ export declare class ObcTreeNavigationItem extends LitElement {
|
|
|
137
178
|
private wrapperElement?;
|
|
138
179
|
/** Focuses the row's interactive wrapper (the host itself is not focusable). */
|
|
139
180
|
focus(options?: FocusOptions): void;
|
|
181
|
+
/**
|
|
182
|
+
* The badge(s) to render from `alerts`, as `{type, count}` pairs already in
|
|
183
|
+
* severity order, ranked by `ALERT_SEVERITY_PRIORITY`.
|
|
184
|
+
*
|
|
185
|
+
* - No `alerts`, or every count 0 → no badges.
|
|
186
|
+
* - `aggregate` → a single pair: the summed count typed as the highest
|
|
187
|
+
* category that has any alerts.
|
|
188
|
+
* - Otherwise → one pair per count greater than 0.
|
|
189
|
+
*/
|
|
190
|
+
private get alertBadges();
|
|
140
191
|
/** A root-level row has no ancestor columns, so it draws no connector lines. */
|
|
141
192
|
private get isRoot();
|
|
142
193
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tree-navigation-item.d.ts","sourceRoot":"","sources":["../../../src/components/tree-navigation-item/tree-navigation-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAA2B,MAAM,KAAK,CAAC;AAMzD,OAAO,0CAA0C,CAAC;AAClD,OAAO,iDAAiD,CAAC;AACzD,OAAO,4CAA4C,CAAC;AACpD,OAAO,mBAAmB,CAAC;AAG3B;;;;;;;;GAQG;AACH,oBAAY,cAAc;IACxB,QAAQ,aAAa;IACrB,YAAY,iBAAiB;IAC7B,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB;AAED;;;;;;;;;GASG;AACH,oBAAY,gBAAgB;IAC1B,OAAO,YAAY;IACnB,gBAAgB,sBAAsB;IACtC,WAAW,iBAAiB;CAC7B;AAED
|
|
1
|
+
{"version":3,"file":"tree-navigation-item.d.ts","sourceRoot":"","sources":["../../../src/components/tree-navigation-item/tree-navigation-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAA2B,MAAM,KAAK,CAAC;AAMzD,OAAO,0CAA0C,CAAC;AAClD,OAAO,iDAAiD,CAAC;AACzD,OAAO,4CAA4C,CAAC;AACpD,OAAO,mBAAmB,CAAC;AAG3B;;;;;;;;GAQG;AACH,oBAAY,cAAc;IACxB,QAAQ,aAAa;IACrB,YAAY,iBAAiB;IAC7B,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB;AAED;;;;;;;;;GASG;AACH,oBAAY,gBAAgB;IAC1B,OAAO,YAAY;IACnB,gBAAgB,sBAAsB;IACtC,WAAW,iBAAiB;CAC7B;AAED;;;;;;;;;;;GAWG;AACH,MAAM,WAAW,wBAAwB;IACvC,+EAA+E;IAC/E,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,uCAAuC;IACvC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,8BAA8B;IAC9B,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,mCAAmC;IACnC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gCAAgC;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,qCAAqC;IACrC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gCAAgC;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,kCAAkC;IAClC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,yCAAyC;IACzC,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0DG;AACH,qBACa,qBAAsB,SAAQ,UAAU;IACnD,4CAA4C;IAClB,KAAK,SAAe;IAE9C;;;OAGG;IACsB,QAAQ,EAAE,cAAc,EAAE,CAAM;IAEzD,oFAAoF;IACzD,UAAU,UAAS;IAE9C,kFAAkF;IACxC,QAAQ,UAAS;IAE3D;;;;;OAKG;IACuC,OAAO,UAAS;IAE1D,mFAAmF;IACzC,QAAQ,UAAS;IAE3D;;;OAGG;IAC0C,SAAS,UAAQ;IAE9D;;OAEG;IAC0C,cAAc,UAAQ;IAEnE;;;OAGG;IACuB,YAAY,EAAE,MAAM,CAA4B;IAE1E;;;;;;;;;OASG;IACuB,MAAM,CAAC,EAAE,wBAAwB,CAAC;IAE5D;;;OAGG;IACuB,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAEhC,OAAO,CAAC,cAAc,CAAC,CAAc;IAExD,gFAAgF;IAChE,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY,GAAG,IAAI;IAInD;;;;;;;;OAQG;IACH,OAAO,KAAK,WAAW,GAyBtB;IAED,gFAAgF;IAChF,OAAO,KAAK,MAAM,GAEjB;IAED;;;OAGG;IACH,OAAO,KAAK,eAAe,GAK1B;IAED,OAAO,CAAC,QAAQ;IAiBhB,OAAO,CAAC,aAAa;IAOrB,OAAO,CAAC,YAAY;IAkBpB,OAAO,CAAC,oBAAoB;IAcnB,MAAM;IAgEf,OAAgB,MAAM,0BAA6B;CACpD;AAED,MAAM,MAAM,sCAAsC,GAAG,WAAW,CAAC,OAAO,CAAC,CAAC;AAE1E,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,0BAA0B,EAAE,qBAAqB,CAAC;KACnD;CACF"}
|
|
@@ -7,7 +7,8 @@ import { customElement } from "../../decorator.js";
|
|
|
7
7
|
import "../../icons/icon-chevron-right-google.js";
|
|
8
8
|
import "../../icons/icon-alert-header-aggregated-iec.js";
|
|
9
9
|
import "../../icons/icon-alert-header-group-iec.js";
|
|
10
|
-
import
|
|
10
|
+
import "../badge/badge.js";
|
|
11
|
+
import { AlertType, ALERT_SEVERITY_PRIORITY } from "../../types.js";
|
|
11
12
|
var __defProp = Object.defineProperty;
|
|
12
13
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
13
14
|
var __decorateClass = (decorators, target, key, kind) => {
|
|
@@ -43,14 +44,44 @@ let ObcTreeNavigationItem = class extends LitElement {
|
|
|
43
44
|
this.focusable = true;
|
|
44
45
|
this.hasLeadingIcon = true;
|
|
45
46
|
this.terminalType = "regular";
|
|
46
|
-
this.hasAlertBadge = false;
|
|
47
|
-
this.alertCount = 0;
|
|
48
|
-
this.alertType = BadgeType.alarm;
|
|
49
47
|
}
|
|
50
48
|
/** Focuses the row's interactive wrapper (the host itself is not focusable). */
|
|
51
49
|
focus(options) {
|
|
52
50
|
this.wrapperElement?.focus(options);
|
|
53
51
|
}
|
|
52
|
+
/**
|
|
53
|
+
* The badge(s) to render from `alerts`, as `{type, count}` pairs already in
|
|
54
|
+
* severity order, ranked by `ALERT_SEVERITY_PRIORITY`.
|
|
55
|
+
*
|
|
56
|
+
* - No `alerts`, or every count 0 → no badges.
|
|
57
|
+
* - `aggregate` → a single pair: the summed count typed as the highest
|
|
58
|
+
* category that has any alerts.
|
|
59
|
+
* - Otherwise → one pair per count greater than 0.
|
|
60
|
+
*/
|
|
61
|
+
get alertBadges() {
|
|
62
|
+
const alerts = this.alerts;
|
|
63
|
+
if (!alerts) return [];
|
|
64
|
+
const countByType = {
|
|
65
|
+
[AlertType.LevelCritical]: alerts.countLevelCritical ?? 0,
|
|
66
|
+
[AlertType.Alarm]: alerts.countAlarm ?? 0,
|
|
67
|
+
[AlertType.LevelHigh]: alerts.countLevelHigh ?? 0,
|
|
68
|
+
[AlertType.Warning]: alerts.countWarning ?? 0,
|
|
69
|
+
[AlertType.LevelMedium]: alerts.countLevelMedium ?? 0,
|
|
70
|
+
[AlertType.Caution]: alerts.countCaution ?? 0,
|
|
71
|
+
[AlertType.LevelLow]: alerts.countLevelLow ?? 0,
|
|
72
|
+
[AlertType.LevelDiagnostic]: alerts.countLevelDiagnostic ?? 0
|
|
73
|
+
};
|
|
74
|
+
const ranked = ALERT_SEVERITY_PRIORITY.filter(
|
|
75
|
+
(type) => type in countByType
|
|
76
|
+
).map((type) => ({ type, count: countByType[type] ?? 0 }));
|
|
77
|
+
if (alerts.aggregate) {
|
|
78
|
+
const total = ranked.reduce((sum, b) => sum + b.count, 0);
|
|
79
|
+
const highest = ranked.find((b) => b.count > 0);
|
|
80
|
+
if (!highest) return [];
|
|
81
|
+
return [{ type: highest.type, count: total }];
|
|
82
|
+
}
|
|
83
|
+
return ranked.filter((b) => b.count > 0);
|
|
84
|
+
}
|
|
54
85
|
/** A root-level row has no ancestor columns, so it draws no connector lines. */
|
|
55
86
|
get isRoot() {
|
|
56
87
|
return this.branches.length === 0;
|
|
@@ -144,11 +175,15 @@ let ObcTreeNavigationItem = class extends LitElement {
|
|
|
144
175
|
</div>` : nothing}
|
|
145
176
|
<span part="label" class="label">${this.label}</span>
|
|
146
177
|
</div>
|
|
147
|
-
${this.
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
178
|
+
${this.alertBadges.length > 0 ? html`<div class="alert-badges">
|
|
179
|
+
${this.alertBadges.map(
|
|
180
|
+
(badge) => html`<obc-badge
|
|
181
|
+
class="alert-badge"
|
|
182
|
+
.type=${badge.type}
|
|
183
|
+
.number=${badge.count}
|
|
184
|
+
></obc-badge>`
|
|
185
|
+
)}
|
|
186
|
+
</div>` : nothing}
|
|
152
187
|
</div>
|
|
153
188
|
</div>
|
|
154
189
|
`;
|
|
@@ -183,14 +218,8 @@ __decorateClass([
|
|
|
183
218
|
property({ type: String })
|
|
184
219
|
], ObcTreeNavigationItem.prototype, "terminalType", 2);
|
|
185
220
|
__decorateClass([
|
|
186
|
-
property({ type:
|
|
187
|
-
], ObcTreeNavigationItem.prototype, "
|
|
188
|
-
__decorateClass([
|
|
189
|
-
property({ type: Number })
|
|
190
|
-
], ObcTreeNavigationItem.prototype, "alertCount", 2);
|
|
191
|
-
__decorateClass([
|
|
192
|
-
property({ type: String })
|
|
193
|
-
], ObcTreeNavigationItem.prototype, "alertType", 2);
|
|
221
|
+
property({ type: Object })
|
|
222
|
+
], ObcTreeNavigationItem.prototype, "alerts", 2);
|
|
194
223
|
__decorateClass([
|
|
195
224
|
property({ type: String })
|
|
196
225
|
], ObcTreeNavigationItem.prototype, "href", 2);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tree-navigation-item.js","sources":["../../../src/components/tree-navigation-item/tree-navigation-item.ts"],"sourcesContent":["import {LitElement, html, nothing, unsafeCSS} from 'lit';\nimport {property, query} from 'lit/decorators.js';\nimport componentStyle from './tree-navigation-item.css?inline';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {ifDefined} from 'lit/directives/if-defined.js';\nimport {customElement} from '../../decorator.js';\nimport '../../icons/icon-chevron-right-google.js';\nimport '../../icons/icon-alert-header-aggregated-iec.js';\nimport '../../icons/icon-alert-header-group-iec.js';\nimport '../badge/badge.js';\nimport {BadgeType} from '../badge/badge.js';\n\n/**\n * Guide line drawn for one indentation column. Normally computed by\n * `obc-tree-navigation`; rarely set by hand.\n *\n * - `straight`: vertical pass-through (`│`)\n * - `intersection`: vertical + stub for a non-last child (`├`)\n * - `corner`: half vertical + stub for the last child (`└`)\n * - `blank`: empty spacer\n */\nexport enum TreeBranchType {\n straight = 'straight',\n intersection = 'intersection',\n corner = 'corner',\n blank = 'blank',\n}\n\n/**\n * Terminal type for a tree item, controlling the alert-header marker shown in\n * the terminal (top-right, by the chevron).\n *\n * - `regular`: No marker — a plain expand/collapse terminal.\n * - `aggregatedHeader`: Shows the aggregated alert-header marker, indicating the\n * node aggregates alerts from its descendants.\n * - `groupHeader`: Shows the group alert-header marker, indicating a grouped set\n * of alerts beneath the node.\n */\nexport enum TreeTerminalType {\n regular = 'regular',\n aggregatedHeader = 'aggregated-header',\n groupHeader = 'group-header',\n}\n\n/**\n * `<obc-tree-navigation-item>` – A single row in a tree- or file-explorer-style\n * navigation list, with indentation guide lines, an optional expand/collapse\n * chevron, a leading icon, a label, and an optional alert badge.\n *\n * Each row represents one node in a hierarchy. Depth is expressed through the\n * `branches` array: one entry per ancestor level, each describing the guide line\n * to draw for that level. The expand chevron lets a node disclose its children,\n * emitting `expand-toggle` so a parent can manage the open/closed state.\n *\n * ## Features\n * - **Indentation guides:** Render one 32px guide column per `branches` entry —\n * pass-through vertical lines for ancestors that continue, and an elbow\n * (`intersection`) connecting the row to its parent.\n * - **Expand/collapse:** Set `expandable` to show a chevron that rotates when\n * `expanded`. The chevron is a visual indicator only — activating the row\n * fires `expand-toggle` with the next state; manage `expanded` in response.\n * When `expanded`, a vertical guide descends from the chevron to connect to\n * the revealed child rows below.\n * - **Terminal type:** `terminalType` adds an alert-header marker in the terminal\n * (`aggregatedHeader` or `groupHeader`), indicating the node heads a set of\n * aggregated or grouped alerts.\n * - **Leading icon:** Provide an icon via the `icon` slot (shown when\n * `hasLeadingIcon`).\n * - **Alert badge:** A trailing counter badge (e.g. an alarm count), toggled with\n * `hasAlertBadge` and configured via `alertCount` and `alertType`.\n * - **Checked state:** `checked` highlights the current selection using the\n * amplified elevation style. A checked row is the current item and is not\n * re-selectable — it shows no hover/pressed feedback and fires no `click` or\n * navigation. An expandable checked row still toggles (fires `expand-toggle`),\n * so a group that is the current selection can be opened and closed. It stays\n * keyboard-focusable.\n * - **Link or button:** Set `href` to render the row as a link; otherwise it acts\n * as a button.\n *\n * ## Usage Guidelines\n * - Use for hierarchical navigation such as file trees, layer panels, or nested\n * menus. For flat navigation lists, use `obc-navigation-item` instead.\n * - Build `branches` from the row's ancestry: `intersection` for the level that\n * owns this row, `straight` for ancestors with siblings still to come, and\n * `blank` for ancestors whose subtrees have ended. When placed inside\n * `obc-tree-navigation`, the container computes `branches` automatically.\n * - Keep one row `checked` at a time within a tree to mark the current location.\n * - Leaf nodes should leave `expandable` as `false` so no chevron is shown.\n *\n * ## Slots\n *\n * | Slot Name | Renders When... | Purpose |\n * |----------------|---------------------------------|-------------------------------------------------------------------------|\n * | icon | `hasLeadingIcon` is true | Leading icon for the row, e.g. `<obi-placeholder slot=\"icon\">`. |\n *\n * @slot icon - Leading icon slot (shown when `hasLeadingIcon` is true).\n * @fires expand-toggle {CustomEvent<boolean>} Fired when an expandable row is activated; detail is the next `expanded` value.\n * @fires click {CustomEvent<void>} Fired when the row is activated.\n */\n@customElement('obc-tree-navigation-item')\nexport class ObcTreeNavigationItem extends LitElement {\n /** The text label displayed for the row. */\n @property({type: String}) label = 'List item';\n\n /**\n * Guide line for each ancestor level, outermost first; one 32px column per\n * entry. Computed by `obc-tree-navigation` — rarely set by hand.\n */\n @property({type: Array}) branches: TreeBranchType[] = [];\n\n /** Whether the row shows an expand/collapse chevron. Leave false for leaf nodes. */\n @property({type: Boolean}) expandable = false;\n\n /** Whether the node is expanded. Rotates the chevron and sets `aria-expanded`. */\n @property({type: Boolean, reflect: true}) expanded = false;\n\n /**\n * Whether the row is the current selection. Applies the amplified style and\n * makes the row inert to re-selection (no hover/pressed feedback, no `click`\n * or navigation); it remains keyboard-focusable. An expandable checked row\n * still fires `expand-toggle` so a selected group can open and close.\n */\n @property({type: Boolean, reflect: true}) checked = false;\n\n /** Disables the row, removing it from the tab order and dimming its appearance. */\n @property({type: Boolean, reflect: true}) disabled = false;\n\n /**\n * Whether the row is in the tab order. A tree container manages this as a\n * roving tabindex (one row focusable at a time); standalone rows stay tabbable.\n */\n @property({type: Boolean, attribute: false}) focusable = true;\n\n /**\n * Whether the row shows a leading icon (provided via the `icon` slot).\n */\n @property({type: Boolean, attribute: false}) hasLeadingIcon = true;\n\n /**\n * Terminal type, controlling the alert-header marker shown in the terminal.\n * One of `regular` (default), `aggregated-header`, or `group-header`.\n */\n @property({type: String}) terminalType: string = TreeTerminalType.regular;\n\n /** Whether a trailing alert counter badge is shown. */\n @property({type: Boolean}) hasAlertBadge = false;\n\n /** The number shown in the alert badge when `hasAlertBadge` is true. */\n @property({type: Number}) alertCount = 0;\n\n /** The severity/type of the alert badge. One of the `obc-badge` types (default `alarm`). */\n @property({type: String}) alertType: string = BadgeType.alarm;\n\n /**\n * The URL to navigate to when the row is activated. If set, the row renders as\n * a link; otherwise it acts as a button.\n */\n @property({type: String}) href: string | undefined;\n\n @query('.wrapper') private wrapperElement?: HTMLElement;\n\n /** Focuses the row's interactive wrapper (the host itself is not focusable). */\n public override focus(options?: FocusOptions): void {\n this.wrapperElement?.focus(options);\n }\n\n /** A root-level row has no ancestor columns, so it draws no connector lines. */\n private get isRoot(): boolean {\n return this.branches.length === 0;\n }\n\n /**\n * All ancestor columns are blank spacers — the row is indented but draws no\n * guide lines, so the terminal connector and dropdown are suppressed too.\n */\n private get isBlankAncestry(): boolean {\n return (\n this.branches.length > 0 &&\n this.branches.every((b) => b === TreeBranchType.blank)\n );\n }\n\n private activate() {\n if (this.disabled) return;\n // An expandable row always toggles, even when checked — a group that is the\n // current selection must still open and close. A checked leaf, however, is\n // the current selection and is inert (no re-selection click or navigation).\n if (this.expandable) {\n this.dispatchEvent(\n new CustomEvent<boolean>('expand-toggle', {detail: !this.expanded})\n );\n }\n if (this.checked) return;\n this.dispatchEvent(new CustomEvent('click'));\n if (this.href !== undefined) {\n window.location.href = this.href;\n }\n }\n\n private handleKeydown(event: KeyboardEvent) {\n if (this.disabled) return;\n if (event.key !== 'Enter' && event.key !== ' ') return;\n event.preventDefault();\n this.activate();\n }\n\n private renderBranch(type: TreeBranchType) {\n const hasVertical =\n type === TreeBranchType.straight ||\n type === TreeBranchType.intersection ||\n type === TreeBranchType.corner;\n const hasHorizontal =\n type === TreeBranchType.intersection || type === TreeBranchType.corner;\n return html`<div\n class=${classMap({branch: true, ['branch-' + type]: true})}\n >\n ${hasVertical ? html`<div class=\"branch-vertical\"></div>` : nothing}\n ${hasHorizontal ? html`<div class=\"branch-horizontal\"></div>` : nothing}\n ${type === TreeBranchType.corner\n ? html`<div class=\"branch-elbow\"></div>`\n : nothing}\n </div>`;\n }\n\n private renderTerminalHeader() {\n if (this.terminalType === TreeTerminalType.aggregatedHeader) {\n return html`<div class=\"terminal-header\" aria-hidden=\"true\">\n <obi-alert-header-aggregated-iec></obi-alert-header-aggregated-iec>\n </div>`;\n }\n if (this.terminalType === TreeTerminalType.groupHeader) {\n return html`<div class=\"terminal-header\" aria-hidden=\"true\">\n <obi-alert-header-group-iec></obi-alert-header-group-iec>\n </div>`;\n }\n return nothing;\n }\n\n override render() {\n return html`\n <div\n class=${classMap({\n wrapper: true,\n checked: this.checked,\n disabled: this.disabled,\n 'has-icon': this.hasLeadingIcon,\n })}\n role=\"treeitem\"\n aria-expanded=${ifDefined(this.expandable ? this.expanded : undefined)}\n aria-current=${ifDefined(this.checked ? 'page' : undefined)}\n aria-selected=${ifDefined(this.checked ? 'true' : undefined)}\n aria-disabled=${ifDefined(this.disabled ? 'true' : undefined)}\n tabindex=${this.disabled ? -1 : this.focusable ? 0 : -1}\n @click=${this.activate}\n @keydown=${this.handleKeydown}\n >\n <div class=\"visible-wrapper\">\n <div class=\"tree-node-row\">\n ${this.branches.map((branch) => this.renderBranch(branch))}\n <div class=\"terminal\">\n ${this.isRoot || this.isBlankAncestry\n ? nothing\n : html`<div class=\"terminal-connector\"></div>`}\n ${!this.isRoot &&\n !this.isBlankAncestry &&\n this.expandable &&\n this.expanded\n ? html`<div class=\"terminal-dropdown\"></div>`\n : nothing}\n ${this.expandable\n ? html`<div class=\"chevron\" aria-hidden=\"true\">\n <obi-chevron-right-google></obi-chevron-right-google>\n </div>`\n : nothing}\n ${this.renderTerminalHeader()}\n </div>\n </div>\n <div class=\"label-container\">\n ${this.hasLeadingIcon\n ? html`<div class=\"leading-icon\">\n <slot name=\"icon\"></slot>\n </div>`\n : nothing}\n <span part=\"label\" class=\"label\">${this.label}</span>\n </div>\n ${this.hasAlertBadge\n ? html`<obc-badge\n class=\"alert-badge\"\n .type=${this.alertType}\n .number=${this.alertCount}\n ></obc-badge>`\n : nothing}\n </div>\n </div>\n `;\n }\n\n static override styles = unsafeCSS(componentStyle);\n}\n\nexport type ObcTreeNavigationItemExpandToggleEvent = CustomEvent<boolean>;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-tree-navigation-item': ObcTreeNavigationItem;\n }\n}\n"],"names":["TreeBranchType","TreeTerminalType"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"tree-navigation-item.js","sources":["../../../src/components/tree-navigation-item/tree-navigation-item.ts"],"sourcesContent":["import {LitElement, html, nothing, unsafeCSS} from 'lit';\nimport {property, query} from 'lit/decorators.js';\nimport componentStyle from './tree-navigation-item.css?inline';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {ifDefined} from 'lit/directives/if-defined.js';\nimport {customElement} from '../../decorator.js';\nimport '../../icons/icon-chevron-right-google.js';\nimport '../../icons/icon-alert-header-aggregated-iec.js';\nimport '../../icons/icon-alert-header-group-iec.js';\nimport '../badge/badge.js';\nimport {AlertType, ALERT_SEVERITY_PRIORITY} from '../../types.js';\n\n/**\n * Guide line drawn for one indentation column. Normally computed by\n * `obc-tree-navigation`; rarely set by hand.\n *\n * - `straight`: vertical pass-through (`│`)\n * - `intersection`: vertical + stub for a non-last child (`├`)\n * - `corner`: half vertical + stub for the last child (`└`)\n * - `blank`: empty spacer\n */\nexport enum TreeBranchType {\n straight = 'straight',\n intersection = 'intersection',\n corner = 'corner',\n blank = 'blank',\n}\n\n/**\n * Terminal type for a tree item, controlling the alert-header marker shown in\n * the terminal (top-right, by the chevron).\n *\n * - `regular`: No marker — a plain expand/collapse terminal.\n * - `aggregatedHeader`: Shows the aggregated alert-header marker, indicating the\n * node aggregates alerts from its descendants.\n * - `groupHeader`: Shows the group alert-header marker, indicating a grouped set\n * of alerts beneath the node.\n */\nexport enum TreeTerminalType {\n regular = 'regular',\n aggregatedHeader = 'aggregated-header',\n groupHeader = 'group-header',\n}\n\n/**\n * Per-severity alert counts for a tree row's trailing badge(s). Each `count*`\n * is the number of active alerts of that severity at or beneath the row — the\n * level severities `level-critical`, `level-high`, `level-medium`, `level-low`,\n * and `level-diagnostic`, plus the IEC severities `alarm`, `warning`, and\n * `caution`. Badges are ordered and aggregated by the shared\n * `ALERT_SEVERITY_PRIORITY` ranking, most to least severe.\n *\n * Set `aggregate` to collapse the counts into a single badge showing the total,\n * styled as the highest category present; otherwise one badge is rendered per\n * non-zero count.\n */\nexport interface TreeNavigationItemAlerts {\n /** Collapse all counts into one badge: total count, highest-severity style. */\n aggregate?: boolean;\n /** Number of level-critical alerts. */\n countLevelCritical?: number;\n /** Number of alarm alerts. */\n countAlarm?: number;\n /** Number of level-high alerts. */\n countLevelHigh?: number;\n /** Number of warning alerts. */\n countWarning?: number;\n /** Number of level-medium alerts. */\n countLevelMedium?: number;\n /** Number of caution alerts. */\n countCaution?: number;\n /** Number of level-low alerts. */\n countLevelLow?: number;\n /** Number of level-diagnostic alerts. */\n countLevelDiagnostic?: number;\n}\n\n/**\n * `<obc-tree-navigation-item>` – A single row in a tree- or file-explorer-style\n * navigation list, with indentation guide lines, an optional expand/collapse\n * chevron, a leading icon, a label, and an optional alert badge.\n *\n * Each row represents one node in a hierarchy. Depth is expressed through the\n * `branches` array: one entry per ancestor level, each describing the guide line\n * to draw for that level. The expand chevron lets a node disclose its children,\n * emitting `expand-toggle` so a parent can manage the open/closed state.\n *\n * ## Features\n * - **Indentation guides:** Render one 32px guide column per `branches` entry —\n * pass-through vertical lines for ancestors that continue, and an elbow\n * (`intersection`) connecting the row to its parent.\n * - **Expand/collapse:** Set `expandable` to show a chevron that rotates when\n * `expanded`. The chevron is a visual indicator only — activating the row\n * fires `expand-toggle` with the next state; manage `expanded` in response.\n * When `expanded`, a vertical guide descends from the chevron to connect to\n * the revealed child rows below.\n * - **Terminal type:** `terminalType` adds an alert-header marker in the terminal\n * (`aggregatedHeader` or `groupHeader`), indicating the node heads a set of\n * aggregated or grouped alerts.\n * - **Leading icon:** Provide an icon via the `icon` slot (shown when\n * `hasLeadingIcon`).\n * - **Alert badges:** Trailing counter badges driven by the `alerts` object — a\n * per-severity count map with one field per level severity (critical, high,\n * medium, low, diagnostic). By default each non-zero count renders its own\n * badge, ordered most to least severe by `ALERT_SEVERITY_PRIORITY`; set\n * `alerts.aggregate` to instead show a single badge with the combined total,\n * styled as the highest category present.\n * - **Checked state:** `checked` highlights the current selection using the\n * amplified elevation style. A checked row is the current item and is not\n * re-selectable — it shows no hover/pressed feedback and fires no `click` or\n * navigation. An expandable checked row still toggles (fires `expand-toggle`),\n * so a group that is the current selection can be opened and closed. It stays\n * keyboard-focusable.\n * - **Link or button:** Set `href` to render the row as a link; otherwise it acts\n * as a button.\n *\n * ## Usage Guidelines\n * - Use for hierarchical navigation such as file trees, layer panels, or nested\n * menus. For flat navigation lists, use `obc-navigation-item` instead.\n * - Build `branches` from the row's ancestry: `intersection` for the level that\n * owns this row, `straight` for ancestors with siblings still to come, and\n * `blank` for ancestors whose subtrees have ended. When placed inside\n * `obc-tree-navigation`, the container computes `branches` automatically.\n * - Keep one row `checked` at a time within a tree to mark the current location.\n * - Leaf nodes should leave `expandable` as `false` so no chevron is shown.\n *\n * ## Slots\n *\n * | Slot Name | Renders When... | Purpose |\n * |----------------|---------------------------------|-------------------------------------------------------------------------|\n * | icon | `hasLeadingIcon` is true | Leading icon for the row, e.g. `<obi-placeholder slot=\"icon\">`. |\n *\n * @slot icon - Leading icon slot (shown when `hasLeadingIcon` is true).\n * @fires expand-toggle {CustomEvent<boolean>} Fired when an expandable row is activated; detail is the next `expanded` value.\n * @fires click {CustomEvent<void>} Fired when the row is activated.\n */\n@customElement('obc-tree-navigation-item')\nexport class ObcTreeNavigationItem extends LitElement {\n /** The text label displayed for the row. */\n @property({type: String}) label = 'List item';\n\n /**\n * Guide line for each ancestor level, outermost first; one 32px column per\n * entry. Computed by `obc-tree-navigation` — rarely set by hand.\n */\n @property({type: Array}) branches: TreeBranchType[] = [];\n\n /** Whether the row shows an expand/collapse chevron. Leave false for leaf nodes. */\n @property({type: Boolean}) expandable = false;\n\n /** Whether the node is expanded. Rotates the chevron and sets `aria-expanded`. */\n @property({type: Boolean, reflect: true}) expanded = false;\n\n /**\n * Whether the row is the current selection. Applies the amplified style and\n * makes the row inert to re-selection (no hover/pressed feedback, no `click`\n * or navigation); it remains keyboard-focusable. An expandable checked row\n * still fires `expand-toggle` so a selected group can open and close.\n */\n @property({type: Boolean, reflect: true}) checked = false;\n\n /** Disables the row, removing it from the tab order and dimming its appearance. */\n @property({type: Boolean, reflect: true}) disabled = false;\n\n /**\n * Whether the row is in the tab order. A tree container manages this as a\n * roving tabindex (one row focusable at a time); standalone rows stay tabbable.\n */\n @property({type: Boolean, attribute: false}) focusable = true;\n\n /**\n * Whether the row shows a leading icon (provided via the `icon` slot).\n */\n @property({type: Boolean, attribute: false}) hasLeadingIcon = true;\n\n /**\n * Terminal type, controlling the alert-header marker shown in the terminal.\n * One of `regular` (default), `aggregated-header`, or `group-header`.\n */\n @property({type: String}) terminalType: string = TreeTerminalType.regular;\n\n /**\n * Per-severity alert counts for the row's trailing badge(s). Omit (or leave\n * every count at 0) for a row with no alerts. See {@link TreeNavigationItemAlerts}.\n *\n * - When `aggregate` is true, a single badge is shown: its number is the sum\n * of all counts and its severity is the highest category present\n * (critical → alarm → warning → caution).\n * - Otherwise one badge is shown per count greater than 0, ordered most to\n * least severe and spaced by the alert-counter spacing token.\n */\n @property({type: Object}) alerts?: TreeNavigationItemAlerts;\n\n /**\n * The URL to navigate to when the row is activated. If set, the row renders as\n * a link; otherwise it acts as a button.\n */\n @property({type: String}) href: string | undefined;\n\n @query('.wrapper') private wrapperElement?: HTMLElement;\n\n /** Focuses the row's interactive wrapper (the host itself is not focusable). */\n public override focus(options?: FocusOptions): void {\n this.wrapperElement?.focus(options);\n }\n\n /**\n * The badge(s) to render from `alerts`, as `{type, count}` pairs already in\n * severity order, ranked by `ALERT_SEVERITY_PRIORITY`.\n *\n * - No `alerts`, or every count 0 → no badges.\n * - `aggregate` → a single pair: the summed count typed as the highest\n * category that has any alerts.\n * - Otherwise → one pair per count greater than 0.\n */\n private get alertBadges(): {type: AlertType; count: number}[] {\n const alerts = this.alerts;\n if (!alerts) return [];\n const countByType: Partial<Record<AlertType, number>> = {\n [AlertType.LevelCritical]: alerts.countLevelCritical ?? 0,\n [AlertType.Alarm]: alerts.countAlarm ?? 0,\n [AlertType.LevelHigh]: alerts.countLevelHigh ?? 0,\n [AlertType.Warning]: alerts.countWarning ?? 0,\n [AlertType.LevelMedium]: alerts.countLevelMedium ?? 0,\n [AlertType.Caution]: alerts.countCaution ?? 0,\n [AlertType.LevelLow]: alerts.countLevelLow ?? 0,\n [AlertType.LevelDiagnostic]: alerts.countLevelDiagnostic ?? 0,\n };\n // Order (and, when aggregating, rank) by the shared severity priority,\n // keeping only the severities this component exposes.\n const ranked = ALERT_SEVERITY_PRIORITY.filter(\n (type) => type in countByType\n ).map((type) => ({type, count: countByType[type] ?? 0}));\n if (alerts.aggregate) {\n const total = ranked.reduce((sum, b) => sum + b.count, 0);\n const highest = ranked.find((b) => b.count > 0);\n if (!highest) return [];\n return [{type: highest.type, count: total}];\n }\n return ranked.filter((b) => b.count > 0);\n }\n\n /** A root-level row has no ancestor columns, so it draws no connector lines. */\n private get isRoot(): boolean {\n return this.branches.length === 0;\n }\n\n /**\n * All ancestor columns are blank spacers — the row is indented but draws no\n * guide lines, so the terminal connector and dropdown are suppressed too.\n */\n private get isBlankAncestry(): boolean {\n return (\n this.branches.length > 0 &&\n this.branches.every((b) => b === TreeBranchType.blank)\n );\n }\n\n private activate() {\n if (this.disabled) return;\n // An expandable row always toggles, even when checked — a group that is the\n // current selection must still open and close. A checked leaf, however, is\n // the current selection and is inert (no re-selection click or navigation).\n if (this.expandable) {\n this.dispatchEvent(\n new CustomEvent<boolean>('expand-toggle', {detail: !this.expanded})\n );\n }\n if (this.checked) return;\n this.dispatchEvent(new CustomEvent('click'));\n if (this.href !== undefined) {\n window.location.href = this.href;\n }\n }\n\n private handleKeydown(event: KeyboardEvent) {\n if (this.disabled) return;\n if (event.key !== 'Enter' && event.key !== ' ') return;\n event.preventDefault();\n this.activate();\n }\n\n private renderBranch(type: TreeBranchType) {\n const hasVertical =\n type === TreeBranchType.straight ||\n type === TreeBranchType.intersection ||\n type === TreeBranchType.corner;\n const hasHorizontal =\n type === TreeBranchType.intersection || type === TreeBranchType.corner;\n return html`<div\n class=${classMap({branch: true, ['branch-' + type]: true})}\n >\n ${hasVertical ? html`<div class=\"branch-vertical\"></div>` : nothing}\n ${hasHorizontal ? html`<div class=\"branch-horizontal\"></div>` : nothing}\n ${type === TreeBranchType.corner\n ? html`<div class=\"branch-elbow\"></div>`\n : nothing}\n </div>`;\n }\n\n private renderTerminalHeader() {\n if (this.terminalType === TreeTerminalType.aggregatedHeader) {\n return html`<div class=\"terminal-header\" aria-hidden=\"true\">\n <obi-alert-header-aggregated-iec></obi-alert-header-aggregated-iec>\n </div>`;\n }\n if (this.terminalType === TreeTerminalType.groupHeader) {\n return html`<div class=\"terminal-header\" aria-hidden=\"true\">\n <obi-alert-header-group-iec></obi-alert-header-group-iec>\n </div>`;\n }\n return nothing;\n }\n\n override render() {\n return html`\n <div\n class=${classMap({\n wrapper: true,\n checked: this.checked,\n disabled: this.disabled,\n 'has-icon': this.hasLeadingIcon,\n })}\n role=\"treeitem\"\n aria-expanded=${ifDefined(this.expandable ? this.expanded : undefined)}\n aria-current=${ifDefined(this.checked ? 'page' : undefined)}\n aria-selected=${ifDefined(this.checked ? 'true' : undefined)}\n aria-disabled=${ifDefined(this.disabled ? 'true' : undefined)}\n tabindex=${this.disabled ? -1 : this.focusable ? 0 : -1}\n @click=${this.activate}\n @keydown=${this.handleKeydown}\n >\n <div class=\"visible-wrapper\">\n <div class=\"tree-node-row\">\n ${this.branches.map((branch) => this.renderBranch(branch))}\n <div class=\"terminal\">\n ${this.isRoot || this.isBlankAncestry\n ? nothing\n : html`<div class=\"terminal-connector\"></div>`}\n ${!this.isRoot &&\n !this.isBlankAncestry &&\n this.expandable &&\n this.expanded\n ? html`<div class=\"terminal-dropdown\"></div>`\n : nothing}\n ${this.expandable\n ? html`<div class=\"chevron\" aria-hidden=\"true\">\n <obi-chevron-right-google></obi-chevron-right-google>\n </div>`\n : nothing}\n ${this.renderTerminalHeader()}\n </div>\n </div>\n <div class=\"label-container\">\n ${this.hasLeadingIcon\n ? html`<div class=\"leading-icon\">\n <slot name=\"icon\"></slot>\n </div>`\n : nothing}\n <span part=\"label\" class=\"label\">${this.label}</span>\n </div>\n ${this.alertBadges.length > 0\n ? html`<div class=\"alert-badges\">\n ${this.alertBadges.map(\n (badge) =>\n html`<obc-badge\n class=\"alert-badge\"\n .type=${badge.type}\n .number=${badge.count}\n ></obc-badge>`\n )}\n </div>`\n : nothing}\n </div>\n </div>\n `;\n }\n\n static override styles = unsafeCSS(componentStyle);\n}\n\nexport type ObcTreeNavigationItemExpandToggleEvent = CustomEvent<boolean>;\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-tree-navigation-item': ObcTreeNavigationItem;\n }\n}\n"],"names":["TreeBranchType","TreeTerminalType"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
2
|
/**
|
|
3
|
-
* `<obi-alerts-critical-twotone>` – Two-tone bell icon for the
|
|
3
|
+
* `<obi-alerts-critical-twotone>` – Two-tone bell icon for the level "critical" alert severity.
|
|
4
4
|
*
|
|
5
5
|
* Renders the alert (bell) glyph as a layered two-tone shape so the silhouette and
|
|
6
6
|
* fill can be tinted independently. Used wherever a critical-severity alert needs an
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-alerts-critical-twotone.js","sources":["../../src/manual-icon/icon-alerts-critical-twotone.ts"],"sourcesContent":["import {LitElement, html, css, svg} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {customElement} from '../decorator.js';\n\n/**\n * `<obi-alerts-critical-twotone>` – Two-tone bell icon for the
|
|
1
|
+
{"version":3,"file":"icon-alerts-critical-twotone.js","sources":["../../src/manual-icon/icon-alerts-critical-twotone.ts"],"sourcesContent":["import {LitElement, html, css, svg} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {customElement} from '../decorator.js';\n\n/**\n * `<obi-alerts-critical-twotone>` – Two-tone bell icon for the level \"critical\" alert severity.\n *\n * Renders the alert (bell) glyph as a layered two-tone shape so the silhouette and\n * fill can be tinted independently. Used wherever a critical-severity alert needs an\n * icon representation (badges, frames, lists).\n *\n * ### Features\n * - **Color modes:** Set `useCssColor` to render with the critical design tokens\n * (`--alert-critical-color` / `--alert-critical-outline-color`); leave it `false`\n * (default) to render with `currentColor` so the icon inherits its parent's color.\n *\n * ### Properties and Attributes\n * - `useCssColor` (boolean): When true, fills the two tones with the critical color\n * tokens instead of `currentColor`. Defaults to `false`.\n */\n@customElement('obi-alerts-critical-twotone')\nexport class ObiAlertsCriticalTwotone extends LitElement {\n @property({type: Boolean}) useCssColor = false;\n\n private icon = svg`<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M4 19V17H6V10C6 8.61667 6.41667 7.3875 7.25 6.3125C8.08333 5.2375 9.16667 4.53333 10.5 4.2V3.5C10.5 3.08333 10.6458 2.72917 10.9375 2.4375C11.2292 2.14583 11.5833 2 12 2C12.4167 2 12.7708 2.14583 13.0625 2.4375C13.3542 2.72917 13.5 3.08333 13.5 3.5V4.2C14.8333 4.53333 15.9167 5.2375 16.75 6.3125C17.5833 7.3875 18 8.61667 18 10V17H20V19H4ZM12 22C11.45 22 10.9792 21.8042 10.5875 21.4125C10.1958 21.0208 10 20.55 10 20H14C14 20.55 13.8042 21.0208 13.4125 21.4125C13.0208 21.8042 12.55 22 12 22Z\" fill=\"currentColor\"/>\n<path d=\"M4 19V17H6V10C6 8.61667 6.41667 7.3875 7.25 6.3125C8.08333 5.2375 9.16667 4.53333 10.5 4.2V3.5C10.5 3.08333 10.6458 2.72917 10.9375 2.4375C11.2292 2.14583 11.5833 2 12 2C12.4167 2 12.7708 2.14583 13.0625 2.4375C13.3542 2.72917 13.5 3.08333 13.5 3.5V4.2C14.8333 4.53333 15.9167 5.2375 16.75 6.3125C17.5833 7.3875 18 8.61667 18 10V17H20V19H4ZM12 22C11.45 22 10.9792 21.8042 10.5875 21.4125C10.1958 21.0208 10 20.55 10 20H14C14 20.55 13.8042 21.0208 13.4125 21.4125C13.0208 21.8042 12.55 22 12 22ZM8 17H16V10C16 8.9 15.6083 7.95833 14.825 7.175C14.0417 6.39167 13.1 6 12 6C10.9 6 9.95833 6.39167 9.175 7.175C8.39167 7.95833 8 8.9 8 10V17Z\" fill=\"currentColor\"/>\n</svg>\n`;\n\n private iconCss = svg`<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M4 19V17H6V10C6 8.61667 6.41667 7.3875 7.25 6.3125C8.08333 5.2375 9.16667 4.53333 10.5 4.2V3.5C10.5 3.08333 10.6458 2.72917 10.9375 2.4375C11.2292 2.14583 11.5833 2 12 2C12.4167 2 12.7708 2.14583 13.0625 2.4375C13.3542 2.72917 13.5 3.08333 13.5 3.5V4.2C14.8333 4.53333 15.9167 5.2375 16.75 6.3125C17.5833 7.3875 18 8.61667 18 10V17H20V19H4ZM12 22C11.45 22 10.9792 21.8042 10.5875 21.4125C10.1958 21.0208 10 20.55 10 20H14C14 20.55 13.8042 21.0208 13.4125 21.4125C13.0208 21.8042 12.55 22 12 22Z\" style=\"fill: var(--alert-critical-color)\"/>\n<path d=\"M4 19V17H6V10C6 8.61667 6.41667 7.3875 7.25 6.3125C8.08333 5.2375 9.16667 4.53333 10.5 4.2V3.5C10.5 3.08333 10.6458 2.72917 10.9375 2.4375C11.2292 2.14583 11.5833 2 12 2C12.4167 2 12.7708 2.14583 13.0625 2.4375C13.3542 2.72917 13.5 3.08333 13.5 3.5V4.2C14.8333 4.53333 15.9167 5.2375 16.75 6.3125C17.5833 7.3875 18 8.61667 18 10V17H20V19H4ZM12 22C11.45 22 10.9792 21.8042 10.5875 21.4125C10.1958 21.0208 10 20.55 10 20H14C14 20.55 13.8042 21.0208 13.4125 21.4125C13.0208 21.8042 12.55 22 12 22ZM8 17H16V10C16 8.9 15.6083 7.95833 14.825 7.175C14.0417 6.39167 13.1 6 12 6C10.9 6 9.95833 6.39167 9.175 7.175C8.39167 7.95833 8 8.9 8 10V17Z\" style=\"fill: var(--alert-critical-outline-color)\"/>\n</svg>\n`;\n\n override render() {\n return html`\n <div class=\"wrapper\">${this.useCssColor ? this.iconCss : this.icon}</div>\n `;\n }\n\n static override styles = css`\n .wrapper {\n height: 100%;\n width: 100%;\n line-height: 0;\n }\n .wrapper > * {\n height: 100%;\n width: 100%;\n }\n `;\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obi-alerts-critical-twotone': ObiAlertsCriticalTwotone;\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;AAqBO,IAAM,2BAAN,cAAuC,WAAW;AAAA,EAAlD,cAAA;AAAA,UAAA,GAAA,SAAA;AACsB,SAAA,cAAc;AAEzC,SAAQ,OAAO;AAAA;AAAA;AAAA;AAAA;AAMf,SAAQ,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,EAAA;AAAA,EAMT,SAAS;AAChB,WAAO;AAAA,6BACkB,KAAK,cAAc,KAAK,UAAU,KAAK,IAAI;AAAA;AAAA,EAEtE;AAaF;AAhCa,yBAqBK,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AApBE,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GADd,yBACgB,WAAA,eAAA,CAAA;AADhB,2BAAN,gBAAA;AAAA,EADN,cAAc,6BAA6B;AAAA,GAC/B,wBAAA;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { LitElement } from 'lit';
|
|
2
2
|
/**
|
|
3
|
-
* `<obi-alerts-diagnostic-twotone>` – Two-tone bell icon for the
|
|
3
|
+
* `<obi-alerts-diagnostic-twotone>` – Two-tone bell icon for the level "diagnostic" alert severity.
|
|
4
4
|
*
|
|
5
5
|
* Renders the alert (bell) glyph as a layered two-tone shape so the silhouette and
|
|
6
6
|
* fill can be tinted independently. Used wherever a diagnostic-severity alert needs an
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"icon-alerts-diagnostic-twotone.js","sources":["../../src/manual-icon/icon-alerts-diagnostic-twotone.ts"],"sourcesContent":["import {LitElement, html, css, svg} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {customElement} from '../decorator.js';\n\n/**\n * `<obi-alerts-diagnostic-twotone>` – Two-tone bell icon for the
|
|
1
|
+
{"version":3,"file":"icon-alerts-diagnostic-twotone.js","sources":["../../src/manual-icon/icon-alerts-diagnostic-twotone.ts"],"sourcesContent":["import {LitElement, html, css, svg} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {customElement} from '../decorator.js';\n\n/**\n * `<obi-alerts-diagnostic-twotone>` – Two-tone bell icon for the level \"diagnostic\" alert severity.\n *\n * Renders the alert (bell) glyph as a layered two-tone shape so the silhouette and\n * fill can be tinted independently. Used wherever a diagnostic-severity alert needs an\n * icon representation (badges, frames, lists).\n *\n * ### Features\n * - **Color modes:** Set `useCssColor` to render with the diagnostic design tokens\n * (`--alert-diagnostic-color` / `--alert-diagnostic-outline-color`); leave it `false`\n * (default) to render with `currentColor` so the icon inherits its parent's color.\n *\n * ### Properties and Attributes\n * - `useCssColor` (boolean): When true, fills the two tones with the diagnostic color\n * tokens instead of `currentColor`. Defaults to `false`.\n */\n@customElement('obi-alerts-diagnostic-twotone')\nexport class ObiAlertsDiagnosticTwotone extends LitElement {\n @property({type: Boolean}) useCssColor = false;\n\n private icon = svg`<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M4 19V17H6V10C6 8.61667 6.41667 7.3875 7.25 6.3125C8.08333 5.2375 9.16667 4.53333 10.5 4.2V3.5C10.5 3.08333 10.6458 2.72917 10.9375 2.4375C11.2292 2.14583 11.5833 2 12 2C12.4167 2 12.7708 2.14583 13.0625 2.4375C13.3542 2.72917 13.5 3.08333 13.5 3.5V4.2C14.8333 4.53333 15.9167 5.2375 16.75 6.3125C17.5833 7.3875 18 8.61667 18 10V17H20V19H4ZM12 22C11.45 22 10.9792 21.8042 10.5875 21.4125C10.1958 21.0208 10 20.55 10 20H14C14 20.55 13.8042 21.0208 13.4125 21.4125C13.0208 21.8042 12.55 22 12 22Z\" fill=\"currentColor\"/>\n<path d=\"M4 19V17H6V10C6 8.61667 6.41667 7.3875 7.25 6.3125C8.08333 5.2375 9.16667 4.53333 10.5 4.2V3.5C10.5 3.08333 10.6458 2.72917 10.9375 2.4375C11.2292 2.14583 11.5833 2 12 2C12.4167 2 12.7708 2.14583 13.0625 2.4375C13.3542 2.72917 13.5 3.08333 13.5 3.5V4.2C14.8333 4.53333 15.9167 5.2375 16.75 6.3125C17.5833 7.3875 18 8.61667 18 10V17H20V19H4ZM12 22C11.45 22 10.9792 21.8042 10.5875 21.4125C10.1958 21.0208 10 20.55 10 20H14C14 20.55 13.8042 21.0208 13.4125 21.4125C13.0208 21.8042 12.55 22 12 22ZM8 17H16V10C16 8.9 15.6083 7.95833 14.825 7.175C14.0417 6.39167 13.1 6 12 6C10.9 6 9.95833 6.39167 9.175 7.175C8.39167 7.95833 8 8.9 8 10V17Z\" fill=\"currentColor\"/>\n</svg>\n`;\n\n private iconCss = svg`<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"M4 19V17H6V10C6 8.61667 6.41667 7.3875 7.25 6.3125C8.08333 5.2375 9.16667 4.53333 10.5 4.2V3.5C10.5 3.08333 10.6458 2.72917 10.9375 2.4375C11.2292 2.14583 11.5833 2 12 2C12.4167 2 12.7708 2.14583 13.0625 2.4375C13.3542 2.72917 13.5 3.08333 13.5 3.5V4.2C14.8333 4.53333 15.9167 5.2375 16.75 6.3125C17.5833 7.3875 18 8.61667 18 10V17H20V19H4ZM12 22C11.45 22 10.9792 21.8042 10.5875 21.4125C10.1958 21.0208 10 20.55 10 20H14C14 20.55 13.8042 21.0208 13.4125 21.4125C13.0208 21.8042 12.55 22 12 22Z\" style=\"fill: var(--alert-diagnostic-color)\"/>\n<path d=\"M4 19V17H6V10C6 8.61667 6.41667 7.3875 7.25 6.3125C8.08333 5.2375 9.16667 4.53333 10.5 4.2V3.5C10.5 3.08333 10.6458 2.72917 10.9375 2.4375C11.2292 2.14583 11.5833 2 12 2C12.4167 2 12.7708 2.14583 13.0625 2.4375C13.3542 2.72917 13.5 3.08333 13.5 3.5V4.2C14.8333 4.53333 15.9167 5.2375 16.75 6.3125C17.5833 7.3875 18 8.61667 18 10V17H20V19H4ZM12 22C11.45 22 10.9792 21.8042 10.5875 21.4125C10.1958 21.0208 10 20.55 10 20H14C14 20.55 13.8042 21.0208 13.4125 21.4125C13.0208 21.8042 12.55 22 12 22ZM8 17H16V10C16 8.9 15.6083 7.95833 14.825 7.175C14.0417 6.39167 13.1 6 12 6C10.9 6 9.95833 6.39167 9.175 7.175C8.39167 7.95833 8 8.9 8 10V17Z\" style=\"fill: var(--alert-diagnostic-outline-color)\"/>\n</svg>\n`;\n\n override render() {\n return html`\n <div class=\"wrapper\">${this.useCssColor ? this.iconCss : this.icon}</div>\n `;\n }\n\n static override styles = css`\n .wrapper {\n height: 100%;\n width: 100%;\n line-height: 0;\n }\n .wrapper > * {\n height: 100%;\n width: 100%;\n }\n `;\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obi-alerts-diagnostic-twotone': ObiAlertsDiagnosticTwotone;\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;AAqBO,IAAM,6BAAN,cAAyC,WAAW;AAAA,EAApD,cAAA;AAAA,UAAA,GAAA,SAAA;AACsB,SAAA,cAAc;AAEzC,SAAQ,OAAO;AAAA;AAAA;AAAA;AAAA;AAMf,SAAQ,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,EAAA;AAAA,EAMT,SAAS;AAChB,WAAO;AAAA,6BACkB,KAAK,cAAc,KAAK,UAAU,KAAK,IAAI;AAAA;AAAA,EAEtE;AAaF;AAhCa,2BAqBK,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AApBE,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GADd,2BACgB,WAAA,eAAA,CAAA;AADhB,6BAAN,gBAAA;AAAA,EADN,cAAc,+BAA+B;AAAA,GACjC,0BAAA;"}
|
package/dist/types.d.ts
CHANGED
|
@@ -8,11 +8,11 @@ export declare enum AlertType {
|
|
|
8
8
|
Alarm = "alarm",
|
|
9
9
|
Warning = "warning",
|
|
10
10
|
Caution = "caution",
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
11
|
+
LevelCritical = "level-critical",
|
|
12
|
+
LevelHigh = "level-high",
|
|
13
|
+
LevelMedium = "level-medium",
|
|
14
|
+
LevelLow = "level-low",
|
|
15
|
+
LevelDiagnostic = "level-diagnostic"
|
|
16
16
|
}
|
|
17
17
|
export declare const ALERT_SEVERITY_PRIORITY: AlertType[];
|
|
18
18
|
export declare enum AlertCategory {
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,oBAAY,SAAS;IACnB,EAAE,OAAO;IACT,IAAI,SAAS;IACb,IAAI,SAAS;IACb,KAAK,UAAU;CAChB;AAED,oBAAY,SAAS;IACnB,KAAK,UAAU;IACf,OAAO,YAAY;IACnB,OAAO,YAAY;IACnB,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"AAAA,oBAAY,SAAS;IACnB,EAAE,OAAO;IACT,IAAI,SAAS;IACb,IAAI,SAAS;IACb,KAAK,UAAU;CAChB;AAED,oBAAY,SAAS;IACnB,KAAK,UAAU;IACf,OAAO,YAAY;IACnB,OAAO,YAAY;IACnB,aAAa,mBAAmB;IAChC,SAAS,eAAe;IACxB,WAAW,iBAAiB;IAC5B,QAAQ,cAAc;IACtB,eAAe,qBAAqB;CACrC;AAED,eAAO,MAAM,uBAAuB,aASnC,CAAC;AAEF,oBAAY,aAAa;IACvB,CAAC,MAAM;IACP,CAAC,MAAM;IACP,CAAC,MAAM;CACR;AAED,MAAM,WAAW,KAAK;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,EACR,KAAK,GACL;QACE,cAAc,EAAE,MAAM,CAAC;QACvB,cAAc,EAAE,IAAI,CAAC;KACtB,CAAC;IACN,MAAM,EACF,IAAI,GACJ;QACE,aAAa,EAAE,IAAI,CAAC;KACrB,CAAC;IACN,IAAI,EAAE,SAAS,CAAC;IAChB,IAAI,EAAE,IAAI,CAAC;IACX,YAAY,CAAC,EAAE,IAAI,CAAC;IACpB,OAAO,CAAC,EACJ,KAAK,GACL;QACE,gBAAgB,EAAE,IAAI,CAAC;QACvB,cAAc,CAAC,EAAE,IAAI,CAAC;QACtB,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IACN,OAAO,CAAC,EACJ,KAAK,GACL;QACE,gBAAgB,EAAE,IAAI,CAAC;QACvB,cAAc,CAAC,EAAE,IAAI,CAAC;QACtB,SAAS,CAAC,EAAE,MAAM,CAAC;KACpB,CAAC;IACN,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,QAAQ,CAAC,EAAE,aAAa,CAAC;CAC1B;AAED,wBAAgB,QAAQ,CAAC,KAAK,EAAE,KAAK,WAEpC;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,KAAK,WAE1C;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,KAAK,WAErC;AAED,wBAAgB,SAAS,CAAC,KAAK,EAAE,KAAK,WAErC;AAED,wBAAgB,qBAAqB,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,UAgBvD;AAED,MAAM,MAAM,WAAW,GAAG,CAAC,IAAI,EAAE,IAAI,KAAK,MAAM,CAAC;AAEjD,wBAAgB,eAAe,CAAC,IAAI,EAAE,IAAI,UA0BzC"}
|
package/dist/types.js
CHANGED
|
@@ -9,23 +9,23 @@ var AlertType = /* @__PURE__ */ ((AlertType2) => {
|
|
|
9
9
|
AlertType2["Alarm"] = "alarm";
|
|
10
10
|
AlertType2["Warning"] = "warning";
|
|
11
11
|
AlertType2["Caution"] = "caution";
|
|
12
|
-
AlertType2["
|
|
13
|
-
AlertType2["
|
|
14
|
-
AlertType2["
|
|
15
|
-
AlertType2["
|
|
16
|
-
AlertType2["
|
|
12
|
+
AlertType2["LevelCritical"] = "level-critical";
|
|
13
|
+
AlertType2["LevelHigh"] = "level-high";
|
|
14
|
+
AlertType2["LevelMedium"] = "level-medium";
|
|
15
|
+
AlertType2["LevelLow"] = "level-low";
|
|
16
|
+
AlertType2["LevelDiagnostic"] = "level-diagnostic";
|
|
17
17
|
return AlertType2;
|
|
18
18
|
})(AlertType || {});
|
|
19
19
|
const ALERT_SEVERITY_PRIORITY = [
|
|
20
|
-
"
|
|
20
|
+
"level-critical",
|
|
21
21
|
"alarm",
|
|
22
|
-
"
|
|
22
|
+
"level-high",
|
|
23
23
|
"warning",
|
|
24
|
-
"
|
|
24
|
+
"level-medium",
|
|
25
25
|
"caution",
|
|
26
|
-
"
|
|
27
|
-
"
|
|
28
|
-
/*
|
|
26
|
+
"level-low",
|
|
27
|
+
"level-diagnostic"
|
|
28
|
+
/* LevelDiagnostic */
|
|
29
29
|
];
|
|
30
30
|
var AlertCategory = /* @__PURE__ */ ((AlertCategory2) => {
|
|
31
31
|
AlertCategory2["a"] = "a";
|
package/dist/types.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","sources":["../src/types.ts"],"sourcesContent":["export enum Direction {\n Up = 'up',\n Down = 'down',\n Left = 'left',\n Right = 'right',\n}\n\nexport enum AlertType {\n Alarm = 'alarm',\n Warning = 'warning',\n Caution = 'caution',\n
|
|
1
|
+
{"version":3,"file":"types.js","sources":["../src/types.ts"],"sourcesContent":["export enum Direction {\n Up = 'up',\n Down = 'down',\n Left = 'left',\n Right = 'right',\n}\n\nexport enum AlertType {\n Alarm = 'alarm',\n Warning = 'warning',\n Caution = 'caution',\n LevelCritical = 'level-critical',\n LevelHigh = 'level-high',\n LevelMedium = 'level-medium',\n LevelLow = 'level-low',\n LevelDiagnostic = 'level-diagnostic',\n}\n\nexport const ALERT_SEVERITY_PRIORITY = [\n AlertType.LevelCritical,\n AlertType.Alarm,\n AlertType.LevelHigh,\n AlertType.Warning,\n AlertType.LevelMedium,\n AlertType.Caution,\n AlertType.LevelLow,\n AlertType.LevelDiagnostic,\n];\n\nexport enum AlertCategory {\n a = 'a',\n b = 'b',\n c = 'c',\n}\n\nexport interface Alert {\n id: string; // The id of the alert\n tagId: string; // The tag ID visible to the user\n source: string;\n text: string;\n note?: string; // The note of the alert, typically by the operator\n acknowledged:\n | false\n | {\n acknowledgedBy: string;\n acknowledgedAt: Date;\n };\n active:\n | true\n | {\n rectifiedTime: Date;\n };\n type: AlertType;\n time: Date;\n lastModified?: Date;\n shelved?:\n | false\n | {\n shelvedStartTime: Date;\n shelvedEndTime?: Date;\n shelvedBy?: string;\n };\n blocked?:\n | false\n | {\n blockedStartTime: Date;\n blockedEndTime?: Date;\n blockedBy?: string;\n };\n noAck?: boolean; // If true, the alarm has no ack button\n category?: AlertCategory;\n}\n\nexport function isActive(alert: Alert) {\n return alert.active === true;\n}\n\nexport function isAcknowledged(alert: Alert) {\n return alert.acknowledged !== false && alert.acknowledged !== undefined;\n}\n\nexport function isShelved(alert: Alert) {\n return alert.shelved !== false && alert.shelved !== undefined;\n}\n\nexport function isBlocked(alert: Alert) {\n return alert.blocked !== false && alert.blocked !== undefined;\n}\n\nexport function comparePriorityAlerts(a: Alert, b: Alert) {\n if (a.type !== b.type) {\n return (\n ALERT_SEVERITY_PRIORITY.indexOf(b.type) -\n ALERT_SEVERITY_PRIORITY.indexOf(a.type)\n );\n }\n\n if (isActive(a) !== isActive(b)) {\n return isActive(a) ? 1 : -1;\n }\n\n if (isAcknowledged(a) !== isAcknowledged(b)) {\n return isAcknowledged(a) ? -1 : 1;\n }\n return a.time.getTime() - b.time.getTime();\n}\n\nexport type TimeSinceFn = (time: Date) => string;\n\nexport function formatTimeSince(time: Date) {\n const now = new Date();\n const diff = now.getTime() - time.getTime();\n const diffInSeconds = diff / 1000;\n if (diffInSeconds < 60) {\n return Math.round(diffInSeconds) + 's';\n }\n const diffInMinutes = diffInSeconds / 60;\n if (diffInMinutes < 60) {\n return (\n Math.round(diffInMinutes) + 'm ' + Math.round(diffInSeconds % 60) + 's'\n );\n }\n const diffInHours = diffInMinutes / 60;\n if (diffInHours < 24) {\n return (\n Math.round(diffInHours) + 'h ' + Math.round(diffInMinutes % 60) + 'm'\n );\n }\n const diffInDays = diffInHours / 24;\n if (diffInDays < 365) {\n return Math.round(diffInDays) + 'd ' + Math.round(diffInHours % 24) + 'h';\n }\n return (\n Math.round(diffInDays / 365) + 'y ' + Math.round(diffInDays % 365) + 'd'\n );\n}\n"],"names":["Direction","AlertType","AlertCategory"],"mappings":"AAAO,IAAK,8BAAAA,eAAL;AACLA,aAAA,IAAA,IAAK;AACLA,aAAA,MAAA,IAAO;AACPA,aAAA,MAAA,IAAO;AACPA,aAAA,OAAA,IAAQ;AAJE,SAAAA;AAAA,GAAA,aAAA,CAAA,CAAA;AAOL,IAAK,8BAAAC,eAAL;AACLA,aAAA,OAAA,IAAQ;AACRA,aAAA,SAAA,IAAU;AACVA,aAAA,SAAA,IAAU;AACVA,aAAA,eAAA,IAAgB;AAChBA,aAAA,WAAA,IAAY;AACZA,aAAA,aAAA,IAAc;AACdA,aAAA,UAAA,IAAW;AACXA,aAAA,iBAAA,IAAkB;AARR,SAAAA;AAAA,GAAA,aAAA,CAAA,CAAA;AAWL,MAAM,0BAA0B;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AACF;AAEO,IAAK,kCAAAC,mBAAL;AACLA,iBAAA,GAAA,IAAI;AACJA,iBAAA,GAAA,IAAI;AACJA,iBAAA,GAAA,IAAI;AAHM,SAAAA;AAAA,GAAA,iBAAA,CAAA,CAAA;AA4CL,SAAS,SAAS,OAAc;AACrC,SAAO,MAAM,WAAW;AAC1B;AAEO,SAAS,eAAe,OAAc;AAC3C,SAAO,MAAM,iBAAiB,SAAS,MAAM,iBAAiB;AAChE;AAEO,SAAS,UAAU,OAAc;AACtC,SAAO,MAAM,YAAY,SAAS,MAAM,YAAY;AACtD;AAEO,SAAS,UAAU,OAAc;AACtC,SAAO,MAAM,YAAY,SAAS,MAAM,YAAY;AACtD;AAEO,SAAS,sBAAsB,GAAU,GAAU;AACxD,MAAI,EAAE,SAAS,EAAE,MAAM;AACrB,WACE,wBAAwB,QAAQ,EAAE,IAAI,IACtC,wBAAwB,QAAQ,EAAE,IAAI;AAAA,EAE1C;AAEA,MAAI,SAAS,CAAC,MAAM,SAAS,CAAC,GAAG;AAC/B,WAAO,SAAS,CAAC,IAAI,IAAI;AAAA,EAC3B;AAEA,MAAI,eAAe,CAAC,MAAM,eAAe,CAAC,GAAG;AAC3C,WAAO,eAAe,CAAC,IAAI,KAAK;AAAA,EAClC;AACA,SAAO,EAAE,KAAK,QAAA,IAAY,EAAE,KAAK,QAAA;AACnC;AAIO,SAAS,gBAAgB,MAAY;AAC1C,QAAM,0BAAU,KAAA;AAChB,QAAM,OAAO,IAAI,QAAA,IAAY,KAAK,QAAA;AAClC,QAAM,gBAAgB,OAAO;AAC7B,MAAI,gBAAgB,IAAI;AACtB,WAAO,KAAK,MAAM,aAAa,IAAI;AAAA,EACrC;AACA,QAAM,gBAAgB,gBAAgB;AACtC,MAAI,gBAAgB,IAAI;AACtB,WACE,KAAK,MAAM,aAAa,IAAI,OAAO,KAAK,MAAM,gBAAgB,EAAE,IAAI;AAAA,EAExE;AACA,QAAM,cAAc,gBAAgB;AACpC,MAAI,cAAc,IAAI;AACpB,WACE,KAAK,MAAM,WAAW,IAAI,OAAO,KAAK,MAAM,gBAAgB,EAAE,IAAI;AAAA,EAEtE;AACA,QAAM,aAAa,cAAc;AACjC,MAAI,aAAa,KAAK;AACpB,WAAO,KAAK,MAAM,UAAU,IAAI,OAAO,KAAK,MAAM,cAAc,EAAE,IAAI;AAAA,EACxE;AACA,SACE,KAAK,MAAM,aAAa,GAAG,IAAI,OAAO,KAAK,MAAM,aAAa,GAAG,IAAI;AAEzE;"}
|