@oicl/openbridge-webcomponents 2.0.0-next.110 → 2.0.0-next.112

package/dist/automation/indicator-generator/indicator-generator.d.ts

@@ -0,0 +1,57 @@
+import { LitElement } from 'lit';
+export declare enum IndicatorGeneratorVariant {
+    button = "button",
+    bar = "bar",
+    doubleBar = "double-bar"
+}
+export declare enum IndicatorGeneratorValue {
+    off = "off",
+    regular = "regular",
+    filled = "filled",
+    enhanced = "enhanced",
+    categorical = "categorical"
+}
+/**
+ * Compact generator status indicator (48×48; 56×56 as double-bar).
+ *
+ * ## Features / Variants
+ * - `variant`: `button` (plain disc), `bar` (disc with a circular progress
+ *   ring) or `double-bar` (disc with two concentric progress rings)
+ * - `value`: visual scheme — `off`, `regular`, `filled`, `enhanced` or
+ *   `categorical`; `off` hides the progress rings
+ * - `level`: 0–100 (%), sweep of the (outer) progress ring, clockwise from
+ *   12 o'clock
+ * - `secondaryLevel`: 0–100 (%), sweep of the inner ring (double-bar only)
+ *
+ * ## Usage Guidelines
+ * Use as an at-a-glance generator load indicator in dashboards and lists.
+ * For schematic (P&ID) placement with button behavior, use the electric
+ * generator automation devices instead.
+ *
+ * ## Slots
+ * | Slot   | Condition | Purpose                                          |
+ * | ------ | --------- | ------------------------------------------------ |
+ * | `icon` | always    | Center icon, defaults to the generator G~ glyph  |
+ *
+ * @slot icon - Center icon, defaults to the generator G~ glyph
+ */
+export declare class ObcIndicatorGenerator extends LitElement {
+    variant: IndicatorGeneratorVariant;
+    value: IndicatorGeneratorValue;
+    /** Outer progress ring sweep, 0-100 (%) */
+    level: number;
+    /** Inner progress ring sweep, 0-100 (%), double-bar only */
+    secondaryLevel: number;
+    private get center();
+    private get discRadius();
+    private get showOutline();
+    private renderRing;
+    render(): import('lit-html').TemplateResult<1>;
+    static styles: import('lit').CSSResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'obc-indicator-generator': ObcIndicatorGenerator;
+    }
+}
+//# sourceMappingURL=indicator-generator.d.ts.map

package/dist/automation/indicator-generator/indicator-generator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"indicator-generator.d.ts","sourceRoot":"","sources":["../../../src/automation/indicator-generator/indicator-generator.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAgC,MAAM,KAAK,CAAC;AAuB9D,oBAAY,yBAAyB;IACnC,MAAM,WAAW;IACjB,GAAG,QAAQ;IACX,SAAS,eAAe;CACzB;AAED,oBAAY,uBAAuB;IACjC,GAAG,QAAQ;IACX,OAAO,YAAY;IACnB,MAAM,WAAW;IACjB,QAAQ,aAAa;IACrB,WAAW,gBAAgB;CAC5B;AAQD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,qBACa,qBAAsB,SAAQ,UAAU;IACV,OAAO,EAAE,yBAAyB,CACxC;IACM,KAAK,EAAE,uBAAuB,CACzC;IAC9B,2CAA2C;IACjB,KAAK,SAAK;IACpC,4DAA4D;IAClC,cAAc,SAAK;IAE7C,OAAO,KAAK,MAAM,GAEjB;IAED,OAAO,KAAK,UAAU,GAYrB;IAED,OAAO,KAAK,WAAW,GAYtB;IAED,OAAO,CAAC,UAAU;IAeT,MAAM;IAmDf,OAAgB,MAAM,0BAA6B;CACpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,yBAAyB,EAAE,qBAAqB,CAAC;KAClD;CACF"}

package/dist/automation/indicator-generator/indicator-generator.js

@@ -0,0 +1,136 @@
+import { unsafeCSS, LitElement, nothing, svg, html } from "lit";
+import { property } from "lit/decorators.js";
+import componentStyle from "./indicator-generator.css.js";
+import { customElement } from "../../decorator.js";
+import { FILLED_DISC_RADIUS, DISC_RADIUS, arcPath, BUTTON_SILHOUETTE_RADIUS, BAR_SILHOUETTE_RADIUS, BAR_SILHOUETTE_STROKE_WIDTH, DOUBLE_BAR_OUTLINE_RADIUS, BAR_OUTLINE_RADIUS, OUTLINE_STROKE_WIDTH, BAR_TRACK_RADIUS, BAR_TRACK_STROKE_WIDTH, DOUBLE_BAR_OUTER_RADIUS, DOUBLE_BAR_OUTER_STROKE_WIDTH, DOUBLE_BAR_INNER_RADIUS, DOUBLE_BAR_INNER_STROKE_WIDTH, progressSweep } from "./indicator-generator-geometry.js";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+var IndicatorGeneratorVariant = /* @__PURE__ */ ((IndicatorGeneratorVariant2) => {
+  IndicatorGeneratorVariant2["button"] = "button";
+  IndicatorGeneratorVariant2["bar"] = "bar";
+  IndicatorGeneratorVariant2["doubleBar"] = "double-bar";
+  return IndicatorGeneratorVariant2;
+})(IndicatorGeneratorVariant || {});
+var IndicatorGeneratorValue = /* @__PURE__ */ ((IndicatorGeneratorValue2) => {
+  IndicatorGeneratorValue2["off"] = "off";
+  IndicatorGeneratorValue2["regular"] = "regular";
+  IndicatorGeneratorValue2["filled"] = "filled";
+  IndicatorGeneratorValue2["enhanced"] = "enhanced";
+  IndicatorGeneratorValue2["categorical"] = "categorical";
+  return IndicatorGeneratorValue2;
+})(IndicatorGeneratorValue || {});
+const ICON_G_PATH = "M6.1686 5.216H10.6326V11.088C10.0353 11.2907 9.41127 11.4507 8.7606 11.568C8.1206 11.6853 7.38993 11.744 6.5686 11.744C5.43793 11.744 4.4726 11.52 3.6726 11.072C2.88327 10.6133 2.2806 9.94667 1.8646 9.072C1.4486 8.19733 1.2406 7.12533 1.2406 5.856C1.2406 4.66133 1.46993 3.62667 1.9286 2.752C2.39793 1.87733 3.07527 1.2 3.9606 0.72C4.84593 0.24 5.9286 0 7.2086 0C7.8166 0 8.41393 0.0640001 9.0006 0.192C9.58727 0.32 10.1206 0.490667 10.6006 0.704L9.8326 2.56C9.46993 2.37867 9.05927 2.22933 8.6006 2.112C8.1526 1.99467 7.68327 1.936 7.1926 1.936C6.4566 1.936 5.82193 2.10133 5.2886 2.432C4.76593 2.752 4.35527 3.21067 4.0566 3.808C3.7686 4.39467 3.6246 5.09333 3.6246 5.904C3.6246 6.66133 3.73127 7.33867 3.9446 7.936C4.15793 8.52267 4.49393 8.98133 4.9526 9.312C5.41127 9.64267 6.01393 9.808 6.7606 9.808C7.00593 9.808 7.21927 9.80267 7.4006 9.792C7.5926 9.77067 7.76327 9.74933 7.9126 9.728C8.0726 9.696 8.22727 9.66933 8.3766 9.648V7.152H6.1686V5.216Z";
+const ICON_TILDE_PATH = "M4.20117 14.0059C5.30264 14.0679 6.22793 14.5801 7.02344 15.2207C7.64824 15.7239 8.18172 15.9676 8.7041 15.9971C9.21748 16.026 9.88939 15.8574 10.8096 15.1904L11.6191 14.6035L12.793 16.2227L11.9834 16.8096C10.8203 17.6526 9.7024 18.0567 8.5918 17.9941C7.49033 17.9321 6.56504 17.4199 5.76953 16.7793C5.14473 16.2761 4.61125 16.0324 4.08887 16.0029C3.57549 15.974 2.90358 16.1426 1.9834 16.8096L1.17383 17.3965L0 15.7773L0.80957 15.1904C1.97263 14.3473 3.09057 13.9433 4.20117 14.0059Z";
+let ObcIndicatorGenerator = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    this.variant = "button";
+    this.value = "off";
+    this.level = 0;
+    this.secondaryLevel = 0;
+  }
+  get center() {
+    return this.variant === "double-bar" ? 28 : 24;
+  }
+  get discRadius() {
+    if (this.value === "filled") {
+      return FILLED_DISC_RADIUS;
+    }
+    if (this.variant === "button" || this.value === "off" || this.value === "regular") {
+      return DISC_RADIUS;
+    }
+    return FILLED_DISC_RADIUS;
+  }
+  get showOutline() {
+    if (this.variant === "bar") {
+      return [
+        "filled",
+        "enhanced",
+        "categorical"
+        /* categorical */
+      ].includes(this.value);
+    }
+    if (this.variant === "double-bar") {
+      return this.value !== "off";
+    }
+    return false;
+  }
+  renderRing(radius, strokeWidth, level) {
+    const c = this.center;
+    const sweep = progressSweep(level);
+    return svg`
+      <circle class="ring-track" cx=${c} cy=${c} r=${radius} stroke-width=${strokeWidth} />
+      ${sweep >= 360 ? svg`<circle class="ring-progress" cx=${c} cy=${c} r=${radius} stroke-width=${strokeWidth} />` : sweep > 0 ? svg`<path class="ring-progress" d=${arcPath(c, c, radius, 0, sweep)} stroke-width=${strokeWidth} />` : nothing}
+    `;
+  }
+  render() {
+    const c = this.center;
+    const doubleBar = this.variant === "double-bar";
+    const bar = this.variant === "bar";
+    const showRings = this.value !== "off";
+    const size = doubleBar ? 56 : 48;
+    return html`
+      <svg viewBox="0 0 ${size} ${size}" aria-hidden="true">
+        ${this.variant === "button" ? svg`<circle class="silhouette" cx=${c} cy=${c} r=${BUTTON_SILHOUETTE_RADIUS} />` : nothing}
+        ${bar ? svg`<circle class="silhouette-ring" cx=${c} cy=${c} r=${BAR_SILHOUETTE_RADIUS} stroke-width=${BAR_SILHOUETTE_STROKE_WIDTH} />` : nothing}
+        <circle class="disc" cx=${c} cy=${c} r=${this.discRadius} />
+        ${this.showOutline ? svg`<circle
+              class="outline"
+              cx=${c}
+              cy=${c}
+              r=${doubleBar ? DOUBLE_BAR_OUTLINE_RADIUS : BAR_OUTLINE_RADIUS}
+              stroke-width=${OUTLINE_STROKE_WIDTH}
+            />` : nothing}
+        ${bar && showRings ? this.renderRing(
+      BAR_TRACK_RADIUS,
+      BAR_TRACK_STROKE_WIDTH,
+      this.level
+    ) : nothing}
+        ${doubleBar && showRings ? svg`
+              ${this.renderRing(DOUBLE_BAR_OUTER_RADIUS, DOUBLE_BAR_OUTER_STROKE_WIDTH, this.level)}
+              ${this.renderRing(DOUBLE_BAR_INNER_RADIUS, DOUBLE_BAR_INNER_STROKE_WIDTH, this.secondaryLevel)}
+            ` : nothing}
+      </svg>
+      <div class="icon-wrapper">
+        <slot name="icon">
+          <svg class="default-icon" viewBox="0 0 24 24">
+            <g transform="translate(5.604 3)">
+              <path d=${ICON_G_PATH} />
+              <path d=${ICON_TILDE_PATH} />
+            </g>
+          </svg>
+        </slot>
+      </div>
+    `;
+  }
+};
+ObcIndicatorGenerator.styles = unsafeCSS(componentStyle);
+__decorateClass([
+  property({ type: String, reflect: true })
+], ObcIndicatorGenerator.prototype, "variant", 2);
+__decorateClass([
+  property({ type: String, reflect: true })
+], ObcIndicatorGenerator.prototype, "value", 2);
+__decorateClass([
+  property({ type: Number })
+], ObcIndicatorGenerator.prototype, "level", 2);
+__decorateClass([
+  property({ type: Number })
+], ObcIndicatorGenerator.prototype, "secondaryLevel", 2);
+ObcIndicatorGenerator = __decorateClass([
+  customElement("obc-indicator-generator")
+], ObcIndicatorGenerator);
+export {
+  IndicatorGeneratorValue,
+  IndicatorGeneratorVariant,
+  ObcIndicatorGenerator
+};
+//# sourceMappingURL=indicator-generator.js.map

package/dist/automation/indicator-generator/indicator-generator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"indicator-generator.js","sources":["../../../src/automation/indicator-generator/indicator-generator.ts"],"sourcesContent":["import {LitElement, html, svg, unsafeCSS, nothing} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport componentStyle from './indicator-generator.css?inline';\nimport {customElement} from '../../decorator.js';\nimport {\n  BUTTON_SILHOUETTE_RADIUS,\n  DISC_RADIUS,\n  FILLED_DISC_RADIUS,\n  BAR_SILHOUETTE_RADIUS,\n  BAR_SILHOUETTE_STROKE_WIDTH,\n  BAR_OUTLINE_RADIUS,\n  DOUBLE_BAR_OUTLINE_RADIUS,\n  OUTLINE_STROKE_WIDTH,\n  BAR_TRACK_RADIUS,\n  BAR_TRACK_STROKE_WIDTH,\n  DOUBLE_BAR_OUTER_RADIUS,\n  DOUBLE_BAR_OUTER_STROKE_WIDTH,\n  DOUBLE_BAR_INNER_RADIUS,\n  DOUBLE_BAR_INNER_STROKE_WIDTH,\n  arcPath,\n  progressSweep,\n} from './indicator-generator-geometry.js';\n\nexport enum IndicatorGeneratorVariant {\n  button = 'button',\n  bar = 'bar',\n  doubleBar = 'double-bar',\n}\n\nexport enum IndicatorGeneratorValue {\n  off = 'off',\n  regular = 'regular',\n  filled = 'filled',\n  enhanced = 'enhanced',\n  categorical = 'categorical',\n}\n\nconst ICON_G_PATH =\n  'M6.1686 5.216H10.6326V11.088C10.0353 11.2907 9.41127 11.4507 8.7606 11.568C8.1206 11.6853 7.38993 11.744 6.5686 11.744C5.43793 11.744 4.4726 11.52 3.6726 11.072C2.88327 10.6133 2.2806 9.94667 1.8646 9.072C1.4486 8.19733 1.2406 7.12533 1.2406 5.856C1.2406 4.66133 1.46993 3.62667 1.9286 2.752C2.39793 1.87733 3.07527 1.2 3.9606 0.72C4.84593 0.24 5.9286 0 7.2086 0C7.8166 0 8.41393 0.0640001 9.0006 0.192C9.58727 0.32 10.1206 0.490667 10.6006 0.704L9.8326 2.56C9.46993 2.37867 9.05927 2.22933 8.6006 2.112C8.1526 1.99467 7.68327 1.936 7.1926 1.936C6.4566 1.936 5.82193 2.10133 5.2886 2.432C4.76593 2.752 4.35527 3.21067 4.0566 3.808C3.7686 4.39467 3.6246 5.09333 3.6246 5.904C3.6246 6.66133 3.73127 7.33867 3.9446 7.936C4.15793 8.52267 4.49393 8.98133 4.9526 9.312C5.41127 9.64267 6.01393 9.808 6.7606 9.808C7.00593 9.808 7.21927 9.80267 7.4006 9.792C7.5926 9.77067 7.76327 9.74933 7.9126 9.728C8.0726 9.696 8.22727 9.66933 8.3766 9.648V7.152H6.1686V5.216Z';\n\nconst ICON_TILDE_PATH =\n  'M4.20117 14.0059C5.30264 14.0679 6.22793 14.5801 7.02344 15.2207C7.64824 15.7239 8.18172 15.9676 8.7041 15.9971C9.21748 16.026 9.88939 15.8574 10.8096 15.1904L11.6191 14.6035L12.793 16.2227L11.9834 16.8096C10.8203 17.6526 9.7024 18.0567 8.5918 17.9941C7.49033 17.9321 6.56504 17.4199 5.76953 16.7793C5.14473 16.2761 4.61125 16.0324 4.08887 16.0029C3.57549 15.974 2.90358 16.1426 1.9834 16.8096L1.17383 17.3965L0 15.7773L0.80957 15.1904C1.97263 14.3473 3.09057 13.9433 4.20117 14.0059Z';\n\n/**\n * Compact generator status indicator (48×48; 56×56 as double-bar).\n *\n * ## Features / Variants\n * - `variant`: `button` (plain disc), `bar` (disc with a circular progress\n *   ring) or `double-bar` (disc with two concentric progress rings)\n * - `value`: visual scheme — `off`, `regular`, `filled`, `enhanced` or\n *   `categorical`; `off` hides the progress rings\n * - `level`: 0–100 (%), sweep of the (outer) progress ring, clockwise from\n *   12 o'clock\n * - `secondaryLevel`: 0–100 (%), sweep of the inner ring (double-bar only)\n *\n * ## Usage Guidelines\n * Use as an at-a-glance generator load indicator in dashboards and lists.\n * For schematic (P&ID) placement with button behavior, use the electric\n * generator automation devices instead.\n *\n * ## Slots\n * | Slot   | Condition | Purpose                                          |\n * | ------ | --------- | ------------------------------------------------ |\n * | `icon` | always    | Center icon, defaults to the generator G~ glyph  |\n *\n * @slot icon - Center icon, defaults to the generator G~ glyph\n */\n@customElement('obc-indicator-generator')\nexport class ObcIndicatorGenerator extends LitElement {\n  @property({type: String, reflect: true}) variant: IndicatorGeneratorVariant =\n    IndicatorGeneratorVariant.button;\n  @property({type: String, reflect: true}) value: IndicatorGeneratorValue =\n    IndicatorGeneratorValue.off;\n  /** Outer progress ring sweep, 0-100 (%) */\n  @property({type: Number}) level = 0;\n  /** Inner progress ring sweep, 0-100 (%), double-bar only */\n  @property({type: Number}) secondaryLevel = 0;\n\n  private get center(): number {\n    return this.variant === IndicatorGeneratorVariant.doubleBar ? 28 : 24;\n  }\n\n  private get discRadius(): number {\n    if (this.value === IndicatorGeneratorValue.filled) {\n      return FILLED_DISC_RADIUS;\n    }\n    if (\n      this.variant === IndicatorGeneratorVariant.button ||\n      this.value === IndicatorGeneratorValue.off ||\n      this.value === IndicatorGeneratorValue.regular\n    ) {\n      return DISC_RADIUS;\n    }\n    return FILLED_DISC_RADIUS;\n  }\n\n  private get showOutline(): boolean {\n    if (this.variant === IndicatorGeneratorVariant.bar) {\n      return [\n        IndicatorGeneratorValue.filled,\n        IndicatorGeneratorValue.enhanced,\n        IndicatorGeneratorValue.categorical,\n      ].includes(this.value);\n    }\n    if (this.variant === IndicatorGeneratorVariant.doubleBar) {\n      return this.value !== IndicatorGeneratorValue.off;\n    }\n    return false;\n  }\n\n  private renderRing(radius: number, strokeWidth: number, level: number) {\n    const c = this.center;\n    const sweep = progressSweep(level);\n    return svg`\n      <circle class=\"ring-track\" cx=${c} cy=${c} r=${radius} stroke-width=${strokeWidth} />\n      ${\n        sweep >= 360\n          ? svg`<circle class=\"ring-progress\" cx=${c} cy=${c} r=${radius} stroke-width=${strokeWidth} />`\n          : sweep > 0\n            ? svg`<path class=\"ring-progress\" d=${arcPath(c, c, radius, 0, sweep)} stroke-width=${strokeWidth} />`\n            : nothing\n      }\n    `;\n  }\n\n  override render() {\n    const c = this.center;\n    const doubleBar = this.variant === IndicatorGeneratorVariant.doubleBar;\n    const bar = this.variant === IndicatorGeneratorVariant.bar;\n    const showRings = this.value !== IndicatorGeneratorValue.off;\n    const size = doubleBar ? 56 : 48;\n    return html`\n      <svg viewBox=\"0 0 ${size} ${size}\" aria-hidden=\"true\">\n        ${this.variant === IndicatorGeneratorVariant.button\n          ? svg`<circle class=\"silhouette\" cx=${c} cy=${c} r=${BUTTON_SILHOUETTE_RADIUS} />`\n          : nothing}\n        ${bar\n          ? svg`<circle class=\"silhouette-ring\" cx=${c} cy=${c} r=${BAR_SILHOUETTE_RADIUS} stroke-width=${BAR_SILHOUETTE_STROKE_WIDTH} />`\n          : nothing}\n        <circle class=\"disc\" cx=${c} cy=${c} r=${this.discRadius} />\n        ${this.showOutline\n          ? svg`<circle\n              class=\"outline\"\n              cx=${c}\n              cy=${c}\n              r=${doubleBar ? DOUBLE_BAR_OUTLINE_RADIUS : BAR_OUTLINE_RADIUS}\n              stroke-width=${OUTLINE_STROKE_WIDTH}\n            />`\n          : nothing}\n        ${bar && showRings\n          ? this.renderRing(\n              BAR_TRACK_RADIUS,\n              BAR_TRACK_STROKE_WIDTH,\n              this.level\n            )\n          : nothing}\n        ${doubleBar && showRings\n          ? svg`\n              ${this.renderRing(DOUBLE_BAR_OUTER_RADIUS, DOUBLE_BAR_OUTER_STROKE_WIDTH, this.level)}\n              ${this.renderRing(DOUBLE_BAR_INNER_RADIUS, DOUBLE_BAR_INNER_STROKE_WIDTH, this.secondaryLevel)}\n            `\n          : nothing}\n      </svg>\n      <div class=\"icon-wrapper\">\n        <slot name=\"icon\">\n          <svg class=\"default-icon\" viewBox=\"0 0 24 24\">\n            <g transform=\"translate(5.604 3)\">\n              <path d=${ICON_G_PATH} />\n              <path d=${ICON_TILDE_PATH} />\n            </g>\n          </svg>\n        </slot>\n      </div>\n    `;\n  }\n\n  static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-indicator-generator': ObcIndicatorGenerator;\n  }\n}\n"],"names":["IndicatorGeneratorVariant","IndicatorGeneratorValue"],"mappings":"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"}

package/dist/automation/indicator-shared/linear-indicator.d.ts

@@ -0,0 +1,46 @@
+import { SVGTemplateResult } from 'lit';
+/**
+ * Shared rendering core for linear automation indicators.
+ *
+ * Provides the internals used by `obc-indicator-battery` and
+ * `obc-indicator-tank-atmospheric`: a bottom-up percentage bar fill and a
+ * trend graph (history polyline with filled area plus a 4 px current-value
+ * micro-bar). The consuming component draws its own outer frame and places
+ * these templates inside its inner content rectangle.
+ *
+ * Coordinates are expressed in the component's 48×48 viewBox grid. Colors are
+ * resolved through CSS custom properties so the templates follow the active
+ * theme; the value scheme selects between the neutral, enhanced and
+ * categorical token sets.
+ */
+export declare enum IndicatorDirection {
+    vertical = "vertical",
+    horizontal = "horizontal"
+}
+export declare enum LinearIndicatorScheme {
+    regular = "regular",
+    enhanced = "enhanced",
+    categorical = "categorical"
+}
+export interface Rect {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+export declare function clampPercent(value: number): number;
+export declare function fillHeight(rect: Rect, level: number): number;
+export declare function expandRect(rect: Rect, amount: number): Rect;
+export declare function trendPolylinePoints(rect: Rect, data: number[], graphWidth: number): string;
+export declare function schemeFillToken(scheme: LinearIndicatorScheme): string;
+export declare function schemeAccentToken(scheme: LinearIndicatorScheme): string;
+export declare function schemeAreaToken(scheme: LinearIndicatorScheme): string;
+/**
+ * Rectangle path with rounded left corners and square right corners, used
+ * to clip the trend graph so it follows the fill-container's rounded left
+ * edge while butting flat against the micro-bar gap on the right.
+ */
+export declare function roundedLeftRectPath(rect: Rect, width: number, radius: number): string;
+export declare function renderLinearBar(rect: Rect, level: number, scheme: LinearIndicatorScheme, idPrefix: string): SVGTemplateResult;
+export declare function renderTrendGraph(rect: Rect, data: number[], level: number, scheme: LinearIndicatorScheme, idPrefix: string): SVGTemplateResult;
+//# sourceMappingURL=linear-indicator.d.ts.map

package/dist/automation/indicator-shared/linear-indicator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"linear-indicator.d.ts","sourceRoot":"","sources":["../../../src/automation/indicator-shared/linear-indicator.ts"],"names":[],"mappings":"AAAA,OAAO,EAAM,iBAAiB,EAAC,MAAM,KAAK,CAAC;AAE3C;;;;;;;;;;;;;GAaG;AAEH,oBAAY,kBAAkB;IAC5B,QAAQ,aAAa;IACrB,UAAU,eAAe;CAC1B;AAED,oBAAY,qBAAqB;IAC/B,OAAO,YAAY;IACnB,QAAQ,aAAa;IACrB,WAAW,gBAAgB;CAC5B;AAED,MAAM,WAAW,IAAI;IACnB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAKD,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAGlD;AAED,wBAAgB,UAAU,CAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CAE5D;AAED,wBAAgB,UAAU,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,GAAG,IAAI,CAO3D;AAMD,wBAAgB,mBAAmB,CACjC,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,MAAM,EAAE,EACd,UAAU,EAAE,MAAM,GACjB,MAAM,CASR;AAED,wBAAgB,eAAe,CAAC,MAAM,EAAE,qBAAqB,GAAG,MAAM,CASrE;AAED,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,qBAAqB,GAAG,MAAM,CASvE;AAED,wBAAgB,eAAe,CAAC,MAAM,EAAE,qBAAqB,GAAG,MAAM,CASrE;AAED;;;;GAIG;AACH,wBAAgB,mBAAmB,CACjC,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,GACb,MAAM,CAWR;AAED,wBAAgB,eAAe,CAC7B,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,qBAAqB,EAC7B,QAAQ,EAAE,MAAM,GACf,iBAAiB,CA2BnB;AAED,wBAAgB,gBAAgB,CAC9B,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,MAAM,EAAE,EACd,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,qBAAqB,EAC7B,QAAQ,EAAE,MAAM,GACf,iBAAiB,CA2DnB"}

package/dist/automation/indicator-shared/linear-indicator.js

@@ -0,0 +1,175 @@
+import { svg } from "lit";
+var IndicatorDirection = /* @__PURE__ */ ((IndicatorDirection2) => {
+  IndicatorDirection2["vertical"] = "vertical";
+  IndicatorDirection2["horizontal"] = "horizontal";
+  return IndicatorDirection2;
+})(IndicatorDirection || {});
+var LinearIndicatorScheme = /* @__PURE__ */ ((LinearIndicatorScheme2) => {
+  LinearIndicatorScheme2["regular"] = "regular";
+  LinearIndicatorScheme2["enhanced"] = "enhanced";
+  LinearIndicatorScheme2["categorical"] = "categorical";
+  return LinearIndicatorScheme2;
+})(LinearIndicatorScheme || {});
+const TREND_BAR_WIDTH = 4;
+const TREND_BAR_GAP = 1;
+function clampPercent(value) {
+  if (Number.isNaN(value)) return 0;
+  return Math.min(100, Math.max(0, value));
+}
+function fillHeight(rect, level) {
+  return rect.height * clampPercent(level) / 100;
+}
+function expandRect(rect, amount) {
+  return {
+    x: rect.x - amount,
+    y: rect.y - amount,
+    width: rect.width + 2 * amount,
+    height: rect.height + 2 * amount
+  };
+}
+function round3(value) {
+  return Math.round(value * 1e3) / 1e3;
+}
+function trendPolylinePoints(rect, data, graphWidth) {
+  if (data.length < 2) return "";
+  return data.map((value, index) => {
+    const x = rect.x + index / (data.length - 1) * graphWidth;
+    const y = rect.y + rect.height * (1 - clampPercent(value) / 100);
+    return `${round3(x)},${round3(y)}`;
+  }).join(" ");
+}
+function schemeFillToken(scheme) {
+  switch (scheme) {
+    case "enhanced":
+      return "var(--element-neutral-enhanced-color)";
+    case "categorical":
+      return "var(--base-teal-400)";
+    default:
+      return "var(--element-neutral-color)";
+  }
+}
+function schemeAccentToken(scheme) {
+  switch (scheme) {
+    case "enhanced":
+      return "var(--element-neutral-enhanced-color)";
+    case "categorical":
+      return "var(--base-teal-500)";
+    default:
+      return "var(--element-neutral-color)";
+  }
+}
+function schemeAreaToken(scheme) {
+  switch (scheme) {
+    case "enhanced":
+      return "var(--instrument-enhanced-tertiary-color)";
+    case "categorical":
+      return "var(--base-teal-100)";
+    default:
+      return "var(--instrument-regular-tertiary-color)";
+  }
+}
+function roundedLeftRectPath(rect, width, radius) {
+  const x = round3(rect.x);
+  const y = round3(rect.y);
+  const right = round3(rect.x + width);
+  const bottom = round3(rect.y + rect.height);
+  const r = round3(radius);
+  return `M ${round3(rect.x + radius)} ${y} H ${right} V ${bottom} H ${round3(rect.x + radius)} A ${r} ${r} 0 0 1 ${x} ${round3(bottom - radius)} V ${round3(rect.y + radius)} A ${r} ${r} 0 0 1 ${round3(rect.x + radius)} ${y} Z`;
+}
+function renderLinearBar(rect, level, scheme, idPrefix) {
+  const fillRect = expandRect(rect, 0.5);
+  const height = fillHeight(fillRect, level);
+  const clipId = `${idPrefix}-bar-clip`;
+  return svg`
+    <clipPath id=${clipId}>
+      <rect x=${fillRect.x} y=${fillRect.y} width=${fillRect.width} height=${fillRect.height} rx="2.5"></rect>
+    </clipPath>
+    <rect
+      class="bar-background"
+      x=${rect.x}
+      y=${rect.y}
+      width=${rect.width}
+      height=${rect.height}
+      rx="2"
+      style="fill: var(--instrument-frame-secondary-color); stroke: var(--border-outline-color)"
+    ></rect>
+    <rect
+      class="bar-fill"
+      clip-path="url(#${clipId})"
+      x=${fillRect.x}
+      y=${round3(fillRect.y + fillRect.height - height)}
+      width=${fillRect.width}
+      height=${round3(height)}
+      style="fill: ${schemeFillToken(scheme)}"
+    ></rect>
+  `;
+}
+function renderTrendGraph(rect, data, level, scheme, idPrefix) {
+  const graphWidth = rect.width - TREND_BAR_WIDTH - TREND_BAR_GAP;
+  const points = trendPolylinePoints(rect, data, graphWidth);
+  const bottom = round3(rect.y + rect.height);
+  const areaPath = points ? `M ${round3(rect.x)},${bottom} L ${points.split(" ").join(" L ")} L ${round3(rect.x + graphWidth)},${bottom} Z` : "";
+  const barX = rect.x + rect.width - TREND_BAR_WIDTH;
+  const height = fillHeight(rect, level);
+  const accent = schemeAccentToken(scheme);
+  const clipId = `${idPrefix}-trend-clip`;
+  const barClipId = `${idPrefix}-trend-bar-clip`;
+  return svg`
+    <clipPath id=${clipId}>
+      <path d=${roundedLeftRectPath(rect, graphWidth, 2)}></path>
+    </clipPath>
+    <clipPath id=${barClipId}>
+      <rect x=${barX} y=${rect.y} width=${TREND_BAR_WIDTH} height=${rect.height} rx="2"></rect>
+    </clipPath>
+    ${areaPath ? svg`
+          <path
+            class="trend-area"
+            clip-path="url(#${clipId})"
+            d=${areaPath}
+            style="fill: ${schemeAreaToken(scheme)}"
+          ></path>
+          <polyline
+            class="trend-line"
+            clip-path="url(#${clipId})"
+            points=${points}
+            fill="none"
+            style="stroke: ${accent}"
+            stroke-width="1"
+            vector-effect="non-scaling-stroke"
+          ></polyline>
+        ` : ""}
+    <rect
+      class="trend-track"
+      x=${barX}
+      y=${rect.y}
+      width=${TREND_BAR_WIDTH}
+      height=${rect.height}
+      rx="2"
+      style="fill: var(--border-divider-color)"
+    ></rect>
+    <rect
+      class="trend-bar-fill"
+      clip-path="url(#${barClipId})"
+      x=${barX}
+      y=${round3(rect.y + rect.height - height)}
+      width=${TREND_BAR_WIDTH}
+      height=${round3(height)}
+      style="fill: ${accent}"
+    ></rect>
+  `;
+}
+export {
+  IndicatorDirection,
+  LinearIndicatorScheme,
+  clampPercent,
+  expandRect,
+  fillHeight,
+  renderLinearBar,
+  renderTrendGraph,
+  roundedLeftRectPath,
+  schemeAccentToken,
+  schemeAreaToken,
+  schemeFillToken,
+  trendPolylinePoints
+};
+//# sourceMappingURL=linear-indicator.js.map

package/dist/automation/indicator-shared/linear-indicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"linear-indicator.js","sources":["../../../src/automation/indicator-shared/linear-indicator.ts"],"sourcesContent":["import {svg, SVGTemplateResult} from 'lit';\n\n/**\n * Shared rendering core for linear automation indicators.\n *\n * Provides the internals used by `obc-indicator-battery` and\n * `obc-indicator-tank-atmospheric`: a bottom-up percentage bar fill and a\n * trend graph (history polyline with filled area plus a 4 px current-value\n * micro-bar). The consuming component draws its own outer frame and places\n * these templates inside its inner content rectangle.\n *\n * Coordinates are expressed in the component's 48×48 viewBox grid. Colors are\n * resolved through CSS custom properties so the templates follow the active\n * theme; the value scheme selects between the neutral, enhanced and\n * categorical token sets.\n */\n\nexport enum IndicatorDirection {\n  vertical = 'vertical',\n  horizontal = 'horizontal',\n}\n\nexport enum LinearIndicatorScheme {\n  regular = 'regular',\n  enhanced = 'enhanced',\n  categorical = 'categorical',\n}\n\nexport interface Rect {\n  x: number;\n  y: number;\n  width: number;\n  height: number;\n}\n\nconst TREND_BAR_WIDTH = 4;\nconst TREND_BAR_GAP = 1;\n\nexport function clampPercent(value: number): number {\n  if (Number.isNaN(value)) return 0;\n  return Math.min(100, Math.max(0, value));\n}\n\nexport function fillHeight(rect: Rect, level: number): number {\n  return (rect.height * clampPercent(level)) / 100;\n}\n\nexport function expandRect(rect: Rect, amount: number): Rect {\n  return {\n    x: rect.x - amount,\n    y: rect.y - amount,\n    width: rect.width + 2 * amount,\n    height: rect.height + 2 * amount,\n  };\n}\n\nfunction round3(value: number): number {\n  return Math.round(value * 1000) / 1000;\n}\n\nexport function trendPolylinePoints(\n  rect: Rect,\n  data: number[],\n  graphWidth: number\n): string {\n  if (data.length < 2) return '';\n  return data\n    .map((value, index) => {\n      const x = rect.x + (index / (data.length - 1)) * graphWidth;\n      const y = rect.y + rect.height * (1 - clampPercent(value) / 100);\n      return `${round3(x)},${round3(y)}`;\n    })\n    .join(' ');\n}\n\nexport function schemeFillToken(scheme: LinearIndicatorScheme): string {\n  switch (scheme) {\n    case LinearIndicatorScheme.enhanced:\n      return 'var(--element-neutral-enhanced-color)';\n    case LinearIndicatorScheme.categorical:\n      return 'var(--base-teal-400)';\n    default:\n      return 'var(--element-neutral-color)';\n  }\n}\n\nexport function schemeAccentToken(scheme: LinearIndicatorScheme): string {\n  switch (scheme) {\n    case LinearIndicatorScheme.enhanced:\n      return 'var(--element-neutral-enhanced-color)';\n    case LinearIndicatorScheme.categorical:\n      return 'var(--base-teal-500)';\n    default:\n      return 'var(--element-neutral-color)';\n  }\n}\n\nexport function schemeAreaToken(scheme: LinearIndicatorScheme): string {\n  switch (scheme) {\n    case LinearIndicatorScheme.enhanced:\n      return 'var(--instrument-enhanced-tertiary-color)';\n    case LinearIndicatorScheme.categorical:\n      return 'var(--base-teal-100)';\n    default:\n      return 'var(--instrument-regular-tertiary-color)';\n  }\n}\n\n/**\n * Rectangle path with rounded left corners and square right corners, used\n * to clip the trend graph so it follows the fill-container's rounded left\n * edge while butting flat against the micro-bar gap on the right.\n */\nexport function roundedLeftRectPath(\n  rect: Rect,\n  width: number,\n  radius: number\n): string {\n  const x = round3(rect.x);\n  const y = round3(rect.y);\n  const right = round3(rect.x + width);\n  const bottom = round3(rect.y + rect.height);\n  const r = round3(radius);\n  return (\n    `M ${round3(rect.x + radius)} ${y} H ${right} V ${bottom} ` +\n    `H ${round3(rect.x + radius)} A ${r} ${r} 0 0 1 ${x} ${round3(bottom - radius)} ` +\n    `V ${round3(rect.y + radius)} A ${r} ${r} 0 0 1 ${round3(rect.x + radius)} ${y} Z`\n  );\n}\n\nexport function renderLinearBar(\n  rect: Rect,\n  level: number,\n  scheme: LinearIndicatorScheme,\n  idPrefix: string\n): SVGTemplateResult {\n  const fillRect = expandRect(rect, 0.5);\n  const height = fillHeight(fillRect, level);\n  const clipId = `${idPrefix}-bar-clip`;\n  return svg`\n    <clipPath id=${clipId}>\n      <rect x=${fillRect.x} y=${fillRect.y} width=${fillRect.width} height=${fillRect.height} rx=\"2.5\"></rect>\n    </clipPath>\n    <rect\n      class=\"bar-background\"\n      x=${rect.x}\n      y=${rect.y}\n      width=${rect.width}\n      height=${rect.height}\n      rx=\"2\"\n      style=\"fill: var(--instrument-frame-secondary-color); stroke: var(--border-outline-color)\"\n    ></rect>\n    <rect\n      class=\"bar-fill\"\n      clip-path=\"url(#${clipId})\"\n      x=${fillRect.x}\n      y=${round3(fillRect.y + fillRect.height - height)}\n      width=${fillRect.width}\n      height=${round3(height)}\n      style=\"fill: ${schemeFillToken(scheme)}\"\n    ></rect>\n  `;\n}\n\nexport function renderTrendGraph(\n  rect: Rect,\n  data: number[],\n  level: number,\n  scheme: LinearIndicatorScheme,\n  idPrefix: string\n): SVGTemplateResult {\n  const graphWidth = rect.width - TREND_BAR_WIDTH - TREND_BAR_GAP;\n  const points = trendPolylinePoints(rect, data, graphWidth);\n  const bottom = round3(rect.y + rect.height);\n  const areaPath = points\n    ? `M ${round3(rect.x)},${bottom} L ${points.split(' ').join(' L ')} L ${round3(rect.x + graphWidth)},${bottom} Z`\n    : '';\n  const barX = rect.x + rect.width - TREND_BAR_WIDTH;\n  const height = fillHeight(rect, level);\n  const accent = schemeAccentToken(scheme);\n  const clipId = `${idPrefix}-trend-clip`;\n  const barClipId = `${idPrefix}-trend-bar-clip`;\n  return svg`\n    <clipPath id=${clipId}>\n      <path d=${roundedLeftRectPath(rect, graphWidth, 2)}></path>\n    </clipPath>\n    <clipPath id=${barClipId}>\n      <rect x=${barX} y=${rect.y} width=${TREND_BAR_WIDTH} height=${rect.height} rx=\"2\"></rect>\n    </clipPath>\n    ${\n      areaPath\n        ? svg`\n          <path\n            class=\"trend-area\"\n            clip-path=\"url(#${clipId})\"\n            d=${areaPath}\n            style=\"fill: ${schemeAreaToken(scheme)}\"\n          ></path>\n          <polyline\n            class=\"trend-line\"\n            clip-path=\"url(#${clipId})\"\n            points=${points}\n            fill=\"none\"\n            style=\"stroke: ${accent}\"\n            stroke-width=\"1\"\n            vector-effect=\"non-scaling-stroke\"\n          ></polyline>\n        `\n        : ''\n    }\n    <rect\n      class=\"trend-track\"\n      x=${barX}\n      y=${rect.y}\n      width=${TREND_BAR_WIDTH}\n      height=${rect.height}\n      rx=\"2\"\n      style=\"fill: var(--border-divider-color)\"\n    ></rect>\n    <rect\n      class=\"trend-bar-fill\"\n      clip-path=\"url(#${barClipId})\"\n      x=${barX}\n      y=${round3(rect.y + rect.height - height)}\n      width=${TREND_BAR_WIDTH}\n      height=${round3(height)}\n      style=\"fill: ${accent}\"\n    ></rect>\n  `;\n}\n"],"names":["IndicatorDirection","LinearIndicatorScheme"],"mappings":"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"}

package/dist/automation/indicator-tank-atmospheric/indicator-tank-atmospheric.css.js

@@ -0,0 +1,48 @@
+import { css } from "lit";
+const componentStyle = css`* {
+  -webkit-tap-highlight-color: transparent;
+}
+
+:host {
+  display: block;
+  position: relative;
+  width: 48px;
+  height: 48px;
+}
+
+svg {
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+
+.frame {
+  fill: var(--instrument-frame-primary-color);
+  stroke: var(--instrument-frame-tertiary-color);
+}
+
+.icon-wrapper {
+  position: absolute;
+  inset: 12px;
+  color: var(--element-neutral-color);
+}
+
+:host([value="enhanced"]) .icon-wrapper {
+  color: var(--element-neutral-enhanced-color);
+}
+
+:host([value="medium"]) .icon-wrapper {
+  color: var(--base-teal-500);
+}
+
+.icon-wrapper ::slotted(*),
+.icon-wrapper obi-tank {
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+`;
+export {
+  componentStyle as default
+};
+//# sourceMappingURL=indicator-tank-atmospheric.css.js.map

package/dist/automation/indicator-tank-atmospheric/indicator-tank-atmospheric.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"indicator-tank-atmospheric.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/automation/indicator-tank-atmospheric/indicator-tank-atmospheric.d.ts

@@ -0,0 +1,65 @@
+import { LitElement } from 'lit';
+import { IndicatorDirection } from '../indicator-shared/linear-indicator.js';
+import '../../icons/icon-tank.js';
+export declare enum IndicatorTankAtmosphericVariant {
+    bar = "bar",
+    trend = "trend"
+}
+export declare enum IndicatorTankAtmosphericValue {
+    regular = "regular",
+    enhanced = "enhanced",
+    medium = "medium"
+}
+/**
+ * Compact 48×48 atmospheric tank level indicator.
+ *
+ * ## Features / Variants
+ * - `variant`: `bar` (bottom-up percentage fill) or `trend` (history graph
+ *   with a current-value micro-bar)
+ * - `direction`: `vertical` or `horizontal` tank outline
+ * - `value`: color scheme — `regular`, `enhanced` or `medium`
+ * - `level`: current tank level 0–100 (%), drives the fill and micro-bar
+ * - `data`: history samples 0–100 (%) drawn as the trend graph
+ * - `hasIcon`: centered icon overlay (bar variant only)
+ *
+ * ## Usage Guidelines
+ * Use as an at-a-glance level indicator in dashboards and lists. For a
+ * full-featured tank cell with readouts, badges and setpoints, use
+ * `obc-automation-tank` instead.
+ *
+ * ## Best Practices / Constraints
+ * - `level` and `data` values are clamped to 0–100; values outside that
+ *   range are pinned to the nearest bound.
+ * - The `trend` variant needs at least two `data` samples to draw a line;
+ *   with fewer it shows only the current-value micro-bar.
+ * - The `icon` slot renders only in the `bar` variant; it is ignored in
+ *   `trend`.
+ * - Display-only: the root SVG is `aria-hidden`; convey tank level to
+ *   assistive tech through adjacent text if it is not otherwise available.
+ *
+ * ## Slots
+ * | Slot   | Condition                     | Purpose                        |
+ * | ------ | ----------------------------- | ------------------------------ |
+ * | `icon` | `hasIcon` and `variant='bar'` | Icon overlay (`obi-*` element) |
+ *
+ * @slot icon - Centered icon overlay, defaults to `obi-tank`
+ */
+export declare class ObcIndicatorTankAtmospheric extends LitElement {
+    direction: IndicatorDirection;
+    variant: IndicatorTankAtmosphericVariant;
+    value: IndicatorTankAtmosphericValue;
+    /** Current level, 0-100 (%) */
+    level: number;
+    /** History samples, 0-100 (%) each, oldest first */
+    data: number[];
+    hasIcon: boolean;
+    private get scheme();
+    render(): import('lit-html').TemplateResult<1>;
+    static styles: import('lit').CSSResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'obc-indicator-tank-atmospheric': ObcIndicatorTankAtmospheric;
+    }
+}
+//# sourceMappingURL=indicator-tank-atmospheric.d.ts.map

package/dist/automation/indicator-tank-atmospheric/indicator-tank-atmospheric.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"indicator-tank-atmospheric.d.ts","sourceRoot":"","sources":["../../../src/automation/indicator-tank-atmospheric/indicator-tank-atmospheric.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAA2B,MAAM,KAAK,CAAC;AAIzD,OAAO,0BAA0B,CAAC;AAClC,OAAO,EACL,kBAAkB,EAKnB,MAAM,yCAAyC,CAAC;AAEjD,oBAAY,+BAA+B;IACzC,GAAG,QAAQ;IACX,KAAK,UAAU;CAChB;AAED,oBAAY,6BAA6B;IACvC,OAAO,YAAY;IACnB,QAAQ,aAAa;IACrB,MAAM,WAAW;CAClB;AAUD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,qBACa,2BAA4B,SAAQ,UAAU;IAChB,SAAS,EAAE,kBAAkB,CACxC;IAE9B,OAAO,EAAE,+BAA+B,CACF;IAEtC,KAAK,EAAE,6BAA6B,CAAyC;IAC7E,+BAA+B;IACL,KAAK,SAAK;IACpC,oDAAoD;IAC3B,IAAI,EAAE,MAAM,EAAE,CAAM;IAClB,OAAO,UAAS;IAE3C,OAAO,KAAK,MAAM,GASjB;IAEQ,MAAM;IAsCf,OAAgB,MAAM,0BAA6B;CACpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gCAAgC,EAAE,2BAA2B,CAAC;KAC/D;CACF"}