npm - @oicl/openbridge-webcomponents - Versions diffs - 2.0.0-next.101 → 2.0.0-next.103 - Mend

@oicl/openbridge-webcomponents 2.0.0-next.101 → 2.0.0-next.103

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.

Files changed (77) hide show

package/dist/navigation-instruments/gauge-radial/gauge-radial.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { LitElement, nothing, html, unsafeCSS } from "lit";
 import { classMap } from "lit/directives/class-map.js";
 import componentStyle from "./gauge-radial.css.js";
 import { customElement } from "../../decorator.js";
-import { property } from "lit/decorators.js";
+import { property, query } from "lit/decorators.js";
 import { InstrumentState, Priority } from "../types.js";
 import { SetpointMixin } from "../../svghelpers/setpoint-mixin.js";
 import "../../building-blocks/instrument-radial/instrument-radial.js";
@@ -44,6 +44,9 @@ var GaugeRadialVerticalAlignment = /* @__PURE__ */ ((GaugeRadialVerticalAlignmen
   GaugeRadialVerticalAlignment2["bottom"] = "bottom";
   return GaugeRadialVerticalAlignment2;
 })(GaugeRadialVerticalAlignment || {});
+const READOUT_META_Y = 98.56;
+const READOUT_META_Y_NEEDLE = 58.24;
+const READOUT_META_Y_180 = -73.472;
 let ObcGaugeRadial = class extends SetpointMixin(LitElement) {
   constructor() {
     super(...arguments);
@@ -67,6 +70,28 @@ let ObcGaugeRadial = class extends SetpointMixin(LitElement) {
     this.label = "";
     this.unit = "";
     this.fractionDigits = 0;
+    this._onFrameChanged = (e) => {
+      const frame = e.detail;
+      const root = this._rootEl;
+      if (!root || !(frame.height > 0)) {
+        return;
+      }
+      const pct = (anchorY) => `${((anchorY - frame.y) / frame.height * 100).toFixed(4)}%`;
+      root.style.setProperty("--readout-meta-top", pct(READOUT_META_Y));
+      root.style.setProperty(
+        "--readout-meta-top-needle",
+        pct(READOUT_META_Y_NEEDLE)
+      );
+      root.style.setProperty("--readout-meta-top-180", pct(READOUT_META_Y_180));
+      if (frame.clipsAdjusted) {
+        root.style.setProperty(
+          "--gauge-radial-aspect",
+          `${frame.width} / ${frame.height}`
+        );
+      } else {
+        root.style.removeProperty("--gauge-radial-aspect");
+      }
+    };
     this.getAngle = (v) => {
       const { sweep, start } = this.sectorAngles;
       const span = this.maxValue - this.minValue;
@@ -172,6 +197,7 @@ let ObcGaugeRadial = class extends SetpointMixin(LitElement) {
       <div
         class=${classMap({
       "gauge-radial-root": true,
+      "face-pinned": this.faceDiameter !== void 0,
       "type-needle": this.type === "needle",
       "sector-180": this.sector === "180",
       "sector-90-left": this.sector === "90-left",
@@ -209,6 +235,8 @@ let ObcGaugeRadial = class extends SetpointMixin(LitElement) {
           .clipLeft=${clips.left}
           .clipRight=${clips.right}
           .endLabelsMaxMin=${this.sector === "180"}
+          .faceDiameter=${this.faceDiameter}
+          @frame-changed=${this._onFrameChanged}
         >
         </obc-instrument-radial>
         ${this.renderReadouts()}
@@ -277,6 +305,12 @@ __decorateClass([
 __decorateClass([
   property({ type: Number })
 ], ObcGaugeRadial.prototype, "fractionDigits", 2);
+__decorateClass([
+  property({ type: Number, attribute: "face-diameter", reflect: true })
+], ObcGaugeRadial.prototype, "faceDiameter", 2);
+__decorateClass([
+  query(".gauge-radial-root")
+], ObcGaugeRadial.prototype, "_rootEl", 2);
 ObcGaugeRadial = __decorateClass([
   customElement("obc-gauge-radial")
 ], ObcGaugeRadial);

package/dist/navigation-instruments/gauge-radial/gauge-radial.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"gauge-radial.js","sources":["../../../src/navigation-instruments/gauge-radial/gauge-radial.ts"],"sourcesContent":["import {LitElement, html, nothing, unsafeCSS, type TemplateResult} from 'lit';\nimport {classMap} from 'lit/directives/class-map.js';\nimport componentStyle from './gauge-radial.css?inline';\nimport {customElement} from '../../decorator.js';\nimport {property} from 'lit/decorators.js';\nimport {AdviceType} from '../watch/advice.js';\nimport {InstrumentState, Priority} from '../types.js';\nimport {SetpointMixin} from '../../svghelpers/setpoint-mixin.js';\nimport '../../building-blocks/instrument-radial/instrument-radial.js';\nimport {TickmarkStyle} from '../watch/tickmark.js';\nimport {renderInstrumentReadout} from '../readout/instrument-readout.js';\nimport {ReadoutAlignment, ReadoutStacking} from '../readout/readout.js';\n\nexport enum ObcGaugeRadialType {\n filled = 'filled',\n bar = 'bar',\n needle = 'needle',\n}\n\nexport enum GaugeRadialSector {\n deg270 = '270',\n deg180 = '180',\n deg90Left = '90-left',\n deg90Right = '90-right',\n}\n\nexport enum GaugeRadialHorizontalAlignment {\n left = 'left',\n center = 'center',\n right = 'right',\n}\n\nexport enum GaugeRadialVerticalAlignment {\n top = 'top',\n center = 'center',\n bottom = 'bottom',\n}\n\nexport interface GaugeRadialAdvice {\n minValue: number;\n maxValue: number;\n type: AdviceType;\n hinted: boolean;\n}\n\n/*\n `<obc-gauge-radial>` — Configurable radial gauge for generic numeric values.\n \n `ObcGaugeRadial` is a thin wrapper around `<obc-instrument-radial>` that adds\n * domain-independent value-to-angle mapping with automatic range handling for\n * both positive-only and bipolar (negative-to-positive) scales. It inherits a\n * full setpoint property bundle from {@link SetpointMixin}, including\n * auto at-setpoint detection, dual-marker adjustment preview, and deadband\n * tuning — no manual wiring required.\n \n ## Features\n \n - Three display types: `filled` (solid arc), `bar` (thinner arc), and\n * `needle` (pointer indicator) via the `type` property.\n * - Sector sweep: `sector` selects the arc span (`270`, `180`, `90-left`, or `90-right`).\n * The configured `minValue..maxValue` always spans the full sector. For the\n * centered sectors (`270`, `180`) a symmetric range places `0` at 12 o'clock;\n * for `90-left`/`90-right` the range midpoint sits at the middle of the quadrant.\n * - Setpoint via mixin: `setpoint`, `newSetpoint`, `touching`,\n * `autoAtSetpointDeadband`, `setpointOverride`, and all other setpoint\n * properties are provided by `SetpointMixin` and forwarded to the inner\n * `<obc-instrument-radial>`.\n * - Advice zones: Pass an array of {@link GaugeRadialAdvice} objects to\n * render caution/alert arcs on the gauge. Not shown on the `90-left` /\n * `90-right` sectors.\n * - Alignment: The host always fills its container and the dial shrinks to\n * fit the smaller of the available width/height, so a short, wide (or tall,\n * narrow) container leaves slack on one axis. `horizontalAlignment`\n * (`left` \| `center` \| `right`) and `verticalAlignment`\n * (`top` \| `center` \| `bottom`) position the dial within that slack; both\n * default to `center`.\n \n ## Usage Guidelines\n \n - Set `minValue` / `maxValue` to define the scale range.\n * - Use `priority` to switch between regular and enhanced color palettes.\n * - Provide `primaryTickmarkInterval` and `secondaryTickmarkInterval` to\n * control tickmark density.\n * - Enable `showLabels` to show numeric labels at primary tickmarks.\n * - Enable `hasReadout` with optional `label` and `unit`. Layout depends on `sector`\n * and `type`: 270 filled/bar — value at center + a label-only `meta` row in\n * the bottom gap (two separate readouts); 180 filled/bar — a single centered\n * stack (value + label/unit) at the bottom; 270 needle — bottom stack;\n * 180 needle — no readout; 90-left / 90-right filled/bar — corner\n * readout in a square host; 90 needle — no readout.\n \n ## Best Practices\n \n - Prefer `SetpointMixin` properties (`setpoint`, `touching`, etc.) over\n * any legacy aliases — the mixin is the single source of truth.\n * - Keep domain-specific logic (units, formatting) in the parent view; this\n * component is intentionally unit-agnostic.\n \n ## Example\n \n ```html\n * <obc-gauge-radial\n * value=\"42\"\n * minValue=\"0\"\n * maxValue=\"100\"\n * type=\"filled\"\n * priority=\"enhanced\"\n * showLabels\n * primaryTickmarkInterval=\"25\"\n * secondaryTickmarkInterval=\"5\"\n * setpoint=\"60\"\n * ></obc-gauge-radial>\n * ```\n \n @element obc-gauge-radial\n * @typedef {import('./gauge-radial.js').GaugeRadialAdvice} GaugeRadialAdvice\n * @stable\n /\n@customElement('obc-gauge-radial')\nexport class ObcGaugeRadial extends SetpointMixin(LitElement) {\n @property({type: Number}) value = 0;\n @property({type: Number}) maxValue = 100;\n @property({type: Number}) minValue = 0;\n @property({type: Boolean}) showLabels: boolean = false;\n @property({type: Number}) primaryTickmarkInterval = 50;\n @property({type: Number}) secondaryTickmarkInterval = 10;\n /\n Interval for tertiary tickmarks in value units.\n * When undefined or <= 0, no tertiary tickmarks are shown.\n /\n @property({type: Number}) tertiaryTickmarkInterval: number \| undefined =\n undefined;\n @property({type: String}) state: InstrumentState = InstrumentState.active;\n @property({type: String}) priority: Priority = Priority.regular;\n @property({type: String}) type: ObcGaugeRadialType =\n ObcGaugeRadialType.filled;\n @property({type: Boolean}) tickmarksInside: boolean = false;\n @property({type: String}) tickmarkStyle: TickmarkStyle =\n TickmarkStyle.regular;\n /* Caution/alert arcs. Ignored on `sector: 90-left` / `90-right`. /\n @property({type: Array, attribute: false}) advices: GaugeRadialAdvice[] = [];\n @property({type: String, reflect: true}) sector: GaugeRadialSector =\n GaugeRadialSector.deg270;\n /\n Horizontal placement of the dial when the host is wider than the dial\n * (e.g. a short, wide container shrinks the dial to fit the height, leaving\n * horizontal slack). Default `center`.\n /\n @property({type: String})\n horizontalAlignment: GaugeRadialHorizontalAlignment =\n GaugeRadialHorizontalAlignment.center;\n /\n Vertical placement of the dial when the host is taller than the dial\n * (e.g. a tall, narrow container shrinks the dial to fit the width, leaving\n * vertical slack). Default `center`.\n /\n @property({type: String}) verticalAlignment: GaugeRadialVerticalAlignment =\n GaugeRadialVerticalAlignment.center;\n /\n When `true`, shows the centre `<obc-readout>`(s) with the current value\n * (and optional `label`/`unit`). Layout depends on `sector` and `type`.\n * Default `false`.\n /\n @property({type: Boolean}) hasReadout = false;\n @property({type: String}) label = '';\n @property({type: String}) unit = '';\n @property({type: Number}) fractionDigits = 0;\n\n private get sectorAngles(): {sweep: number; start: number} {\n switch (this.sector) {\n case GaugeRadialSector.deg180:\n return {sweep: 180, start: -90};\n case GaugeRadialSector.deg90Left:\n return {sweep: 90, start: -90};\n case GaugeRadialSector.deg90Right:\n return {sweep: 90, start: 0};\n case GaugeRadialSector.deg270:\n default:\n return {sweep: 270, start: -135};\n }\n }\n\n /\n Per-edge crop (%) of the shared, origin-centered 448 SVG box each sector\n * shows. All sectors render at the same natural scale, so the dial stays the\n * same size; the sector only windows a different part (270 whole, 180 wide,\n * 90 a quadrant).\n /\n private get sectorClips(): {\n top: number;\n bottom: number;\n left: number;\n right: number;\n } {\n switch (this.sector) {\n case GaugeRadialSector.deg180:\n return {top: 0, bottom: 44, left: 0, right: 0};\n case GaugeRadialSector.deg90Left:\n return {top: 0, bottom: 45, left: 0, right: 45};\n case GaugeRadialSector.deg90Right:\n return {top: 0, bottom: 45, left: 45, right: 0};\n case GaugeRadialSector.deg270:\n default:\n return {top: 0, bottom: 0, left: 0, right: 0};\n }\n }\n\n private get isSector90(): boolean {\n return (\n this.sector === GaugeRadialSector.deg90Left \|\|\n this.sector === GaugeRadialSector.deg90Right\n );\n }\n\n // Arrow form so `this` binds when passed as `.getAngle=${this.getAngle}`\n // to <obc-instrument-radial>. Do not convert to a method.\n getAngle = (v: number): number => {\n const {sweep, start} = this.sectorAngles;\n const span = this.maxValue - this.minValue;\n if (!Number.isFinite(span) \|\| span <= 0) {\n return start;\n }\n\n return ((v - this.minValue) / span) sweep + start;\n };\n\n /** Renders one gauge readout; `withMeta`/`withValue` pick parts. */\n private renderReadout({\n className,\n stacking,\n alignment = ReadoutAlignment.vertical,\n withMeta = true,\n withValue = true,\n }: {\n className: string;\n stacking?: ReadoutStacking;\n alignment?: ReadoutAlignment;\n withMeta?: boolean;\n withValue?: boolean;\n }): TemplateResult {\n return renderInstrumentReadout({\n className,\n stacking,\n alignment,\n hasValue: withValue,\n value: withValue ? this.value : undefined,\n priority: withValue ? this.priority : undefined,\n fractionDigits: this.fractionDigits,\n label: withMeta ? this.label : '',\n unit: withMeta ? this.unit : '',\n });\n }\n\n private renderReadouts() {\n if (!this.hasReadout) {\n return nothing;\n }\n\n const isNeedle = this.type === ObcGaugeRadialType.needle;\n const is90 = this.isSector90;\n const is180 = this.sector === GaugeRadialSector.deg180;\n\n if (isNeedle && (is180 \|\| is90)) {\n return nothing;\n }\n\n // 90 filled/bar: enhanced corner readout (bold value + label/unit).\n if (is90) {\n return this.renderReadout({\n className: 'gauge-readout-meta',\n });\n }\n\n // 270 needle and 180 filled/bar: centered stack (value weight follows `priority`).\n if (isNeedle \|\| is180) {\n return this.renderReadout({\n className: 'gauge-readout-meta',\n stacking: ReadoutStacking.stacked,\n alignment: ReadoutAlignment.center,\n });\n }\n\n // 270 filled/bar: the value sits at the circle center and the label/unit row\n // lower in the bottom gap, so they are two separately-positioned readouts.\n return html`\n ${this.renderReadout({\n className: 'gauge-readout-value',\n withMeta: false,\n })}\n ${this.label \|\| this.unit\n ? this.renderReadout({\n className: 'gauge-readout-meta',\n stacking: ReadoutStacking.stacked,\n alignment: ReadoutAlignment.center,\n withValue: false,\n })\n : nothing}\n `;\n }\n\n override render() {\n const clips = this.sectorClips;\n return html`\n <div\n class=${classMap({\n 'gauge-radial-root': true,\n 'type-needle': this.type === ObcGaugeRadialType.needle,\n 'sector-180': this.sector === GaugeRadialSector.deg180,\n 'sector-90-left': this.sector === GaugeRadialSector.deg90Left,\n 'sector-90-right': this.sector === GaugeRadialSector.deg90Right,\n [`halign-${this.horizontalAlignment}`]: true,\n [`valign-${this.verticalAlignment}`]: true,\n })}\n >\n <obc-instrument-radial\n .value=${this.value}\n .state=${this.state}\n .priority=${this.priority}\n .setpoint=${this.setpoint}\n .newSetpoint=${this.newSetpoint}\n .setpointAtZeroDeadband=${this.setpointAtZeroDeadband}\n .setpointOverride=${this.setpointOverride}\n .touching=${this.touching}\n .autoAtSetpoint=${this.autoAtSetpoint}\n .autoAtSetpointDeadband=${this.autoAtSetpointDeadband}\n .animateSetpoint=${this.animateSetpoint}\n .maxValue=${this.maxValue}\n .minValue=${this.minValue}\n .getAngle=${this.getAngle}\n .showLabels=${this.showLabels}\n .primaryTickmarkInterval=${this.primaryTickmarkInterval}\n .secondaryTickmarkInterval=${this.secondaryTickmarkInterval}\n .tertiaryTickmarkInterval=${this.tertiaryTickmarkInterval}\n .type=${this.type}\n .needleType=${this.type}\n .tickmarksInside=${this.tickmarksInside}\n .tickmarkStyle=${this.tickmarkStyle}\n .advices=${this.isSector90 ? [] : this.advices}\n .clipTop=${clips.top}\n .clipBottom=${clips.bottom}\n .clipLeft=${clips.left}\n .clipRight=${clips.right}\n .endLabelsMaxMin=${this.sector === GaugeRadialSector.deg180}\n >\n </obc-instrument-radial>\n ${this.renderReadouts()}\n </div>\n `;\n }\n\n static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-gauge-radial': ObcGaugeRadial;\n }\n}\n"],"names":["ObcGaugeRadialType","GaugeRadialSector","GaugeRadialHorizontalAlignment","GaugeRadialVerticalAlignment"],"mappings":"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"}
1	+ {"version":3,"file":"gauge-radial.js","sources":["../../../src/navigation-instruments/gauge-radial/gauge-radial.ts"],"sourcesContent":["import {LitElement, html, nothing, unsafeCSS, type TemplateResult} from 'lit';\nimport {classMap} from 'lit/directives/class-map.js';\nimport componentStyle from './gauge-radial.css?inline';\nimport {customElement} from '../../decorator.js';\nimport {property, query} from 'lit/decorators.js';\nimport type {RadialFrame} from '../../svghelpers/radial-frame.js';\nimport {AdviceType} from '../watch/advice.js';\nimport {InstrumentState, Priority} from '../types.js';\nimport {SetpointMixin} from '../../svghelpers/setpoint-mixin.js';\nimport '../../building-blocks/instrument-radial/instrument-radial.js';\nimport {TickmarkStyle} from '../watch/tickmark.js';\nimport {renderInstrumentReadout} from '../readout/instrument-readout.js';\nimport {ReadoutAlignment, ReadoutStacking} from '../readout/readout.js';\n\nexport enum ObcGaugeRadialType {\n filled = 'filled',\n bar = 'bar',\n needle = 'needle',\n}\n\nexport enum GaugeRadialSector {\n deg270 = '270',\n deg180 = '180',\n deg90Left = '90-left',\n deg90Right = '90-right',\n}\n\nexport enum GaugeRadialHorizontalAlignment {\n left = 'left',\n center = 'center',\n right = 'right',\n}\n\nexport enum GaugeRadialVerticalAlignment {\n top = 'top',\n center = 'center',\n bottom = 'bottom',\n}\n\nexport interface GaugeRadialAdvice {\n minValue: number;\n maxValue: number;\n type: AdviceType;\n hinted: boolean;\n}\n\n/*\n Readout meta-row anchors in SVG units, derived from the legacy CSS\n * percentages against the default 448 box (72% → 98.56, 63% → 58.24; the 180°\n * sector's 60% of its 250.88-high crop → −73.472). Converted back to\n * percentages against the actual frame so readouts stay put when the box\n * grows for the label reserve (issue #1021).\n /\nconst READOUT_META_Y = 98.56;\nconst READOUT_META_Y_NEEDLE = 58.24;\nconst READOUT_META_Y_180 = -73.472;\n\n/\n `<obc-gauge-radial>` — Configurable radial gauge for generic numeric values.\n \n `ObcGaugeRadial` is a thin wrapper around `<obc-instrument-radial>` that adds\n * domain-independent value-to-angle mapping with automatic range handling for\n * both positive-only and bipolar (negative-to-positive) scales. It inherits a\n * full setpoint property bundle from {@link SetpointMixin}, including\n * auto at-setpoint detection, dual-marker adjustment preview, and deadband\n * tuning — no manual wiring required.\n \n ## Features\n \n - Three display types: `filled` (solid arc), `bar` (thinner arc), and\n * `needle` (pointer indicator) via the `type` property.\n * - Sector sweep: `sector` selects the arc span (`270`, `180`, `90-left`, or `90-right`).\n * The configured `minValue..maxValue` always spans the full sector. For the\n * centered sectors (`270`, `180`) a symmetric range places `0` at 12 o'clock;\n * for `90-left`/`90-right` the range midpoint sits at the middle of the quadrant.\n * - Setpoint via mixin: `setpoint`, `newSetpoint`, `touching`,\n * `autoAtSetpointDeadband`, `setpointOverride`, and all other setpoint\n * properties are provided by `SetpointMixin` and forwarded to the inner\n * `<obc-instrument-radial>`.\n * - Advice zones: Pass an array of {@link GaugeRadialAdvice} objects to\n * render caution/alert arcs on the gauge. Not shown on the `90-left` /\n * `90-right` sectors.\n * - Alignment: The host always fills its container and the dial shrinks to\n * fit the smaller of the available width/height, so a short, wide (or tall,\n * narrow) container leaves slack on one axis. `horizontalAlignment`\n * (`left` \| `center` \| `right`) and `verticalAlignment`\n * (`top` \| `center` \| `bottom`) position the dial within that slack; both\n * default to `center`.\n \n ## Usage Guidelines\n \n - Set `minValue` / `maxValue` to define the scale range.\n * - Use `priority` to switch between regular and enhanced color palettes.\n * - Provide `primaryTickmarkInterval` and `secondaryTickmarkInterval` to\n * control tickmark density.\n * - Enable `showLabels` to show numeric labels at primary tickmarks.\n * - Enable `hasReadout` with optional `label` and `unit`. Layout depends on `sector`\n * and `type`: 270 filled/bar — value at center + a label-only `meta` row in\n * the bottom gap (two separate readouts); 180 filled/bar — a single centered\n * stack (value + label/unit) at the bottom; 270 needle — bottom stack;\n * 180 needle — no readout; 90-left / 90-right filled/bar — corner\n * readout in a square host; 90 needle — no readout.\n \n ## Best Practices\n \n - Prefer `SetpointMixin` properties (`setpoint`, `touching`, etc.) over\n * any legacy aliases — the mixin is the single source of truth.\n * - Keep domain-specific logic (units, formatting) in the parent view; this\n * component is intentionally unit-agnostic.\n \n ## Example\n \n ```html\n * <obc-gauge-radial\n * value=\"42\"\n * minValue=\"0\"\n * maxValue=\"100\"\n * type=\"filled\"\n * priority=\"enhanced\"\n * showLabels\n * primaryTickmarkInterval=\"25\"\n * secondaryTickmarkInterval=\"5\"\n * setpoint=\"60\"\n * ></obc-gauge-radial>\n * ```\n \n @element obc-gauge-radial\n * @typedef {import('./gauge-radial.js').GaugeRadialAdvice} GaugeRadialAdvice\n * @stable\n /\n@customElement('obc-gauge-radial')\nexport class ObcGaugeRadial extends SetpointMixin(LitElement) {\n @property({type: Number}) value = 0;\n @property({type: Number}) maxValue = 100;\n @property({type: Number}) minValue = 0;\n @property({type: Boolean}) showLabels: boolean = false;\n @property({type: Number}) primaryTickmarkInterval = 50;\n @property({type: Number}) secondaryTickmarkInterval = 10;\n /\n Interval for tertiary tickmarks in value units.\n * When undefined or <= 0, no tertiary tickmarks are shown.\n /\n @property({type: Number}) tertiaryTickmarkInterval: number \| undefined =\n undefined;\n @property({type: String}) state: InstrumentState = InstrumentState.active;\n @property({type: String}) priority: Priority = Priority.regular;\n @property({type: String}) type: ObcGaugeRadialType =\n ObcGaugeRadialType.filled;\n @property({type: Boolean}) tickmarksInside: boolean = false;\n @property({type: String}) tickmarkStyle: TickmarkStyle =\n TickmarkStyle.regular;\n /* Caution/alert arcs. Ignored on `sector: 90-left` / `90-right`. /\n @property({type: Array, attribute: false}) advices: GaugeRadialAdvice[] = [];\n @property({type: String, reflect: true}) sector: GaugeRadialSector =\n GaugeRadialSector.deg270;\n /\n Horizontal placement of the dial when the host is wider than the dial\n * (e.g. a short, wide container shrinks the dial to fit the height, leaving\n * horizontal slack). Default `center`.\n /\n @property({type: String})\n horizontalAlignment: GaugeRadialHorizontalAlignment =\n GaugeRadialHorizontalAlignment.center;\n /\n Vertical placement of the dial when the host is taller than the dial\n * (e.g. a tall, narrow container shrinks the dial to fit the width, leaving\n * vertical slack). Default `center`.\n /\n @property({type: String}) verticalAlignment: GaugeRadialVerticalAlignment =\n GaugeRadialVerticalAlignment.center;\n /\n When `true`, shows the centre `<obc-readout>`(s) with the current value\n * (and optional `label`/`unit`). Layout depends on `sector` and `type`.\n * Default `false`.\n /\n @property({type: Boolean}) hasReadout = false;\n @property({type: String}) label = '';\n @property({type: String}) unit = '';\n @property({type: Number}) fractionDigits = 0;\n /\n Outer-ring diameter in CSS pixels. When set, the instrument renders at a\n * fixed intrinsic size derived from the ring, arc shape and label reserve —\n * so instruments sharing the same value have identical ring circumference\n * regardless of label width or arc extent (like obc-donut-chart's\n * fixedHeight). When unset (default), the instrument fills its container.\n /\n @property({type: Number, attribute: 'face-diameter', reflect: true})\n faceDiameter: number \| undefined;\n\n private get sectorAngles(): {sweep: number; start: number} {\n switch (this.sector) {\n case GaugeRadialSector.deg180:\n return {sweep: 180, start: -90};\n case GaugeRadialSector.deg90Left:\n return {sweep: 90, start: -90};\n case GaugeRadialSector.deg90Right:\n return {sweep: 90, start: 0};\n case GaugeRadialSector.deg270:\n default:\n return {sweep: 270, start: -135};\n }\n }\n\n /\n Per-edge crop (%) of the shared, origin-centered 448 SVG box each sector\n * shows. All sectors render at the same natural scale, so the dial stays the\n * same size; the sector only windows a different part (270 whole, 180 wide,\n * 90 a quadrant).\n /\n private get sectorClips(): {\n top: number;\n bottom: number;\n left: number;\n right: number;\n } {\n switch (this.sector) {\n case GaugeRadialSector.deg180:\n return {top: 0, bottom: 44, left: 0, right: 0};\n case GaugeRadialSector.deg90Left:\n return {top: 0, bottom: 45, left: 0, right: 45};\n case GaugeRadialSector.deg90Right:\n return {top: 0, bottom: 45, left: 45, right: 0};\n case GaugeRadialSector.deg270:\n default:\n return {top: 0, bottom: 0, left: 0, right: 0};\n }\n }\n\n private get isSector90(): boolean {\n return (\n this.sector === GaugeRadialSector.deg90Left \|\|\n this.sector === GaugeRadialSector.deg90Right\n );\n }\n\n /* @internal /\n @query('.gauge-radial-root') private _rootEl?: HTMLElement;\n\n /\n Re-anchor the %-positioned readouts against the frame the inner\n * instrument actually rendered (the box grows when labels need room).\n /\n private _onFrameChanged = (e: Event): void => {\n const frame = (e as CustomEvent<RadialFrame>).detail;\n const root = this._rootEl;\n if (!root \|\| !(frame.height > 0)) {\n return;\n }\n const pct = (anchorY: number) =>\n `${(((anchorY - frame.y) / frame.height) 100).toFixed(4)}%`;\n root.style.setProperty('--readout-meta-top', pct(READOUT_META_Y));\n root.style.setProperty(\n '--readout-meta-top-needle',\n pct(READOUT_META_Y_NEEDLE)\n );\n root.style.setProperty('--readout-meta-top-180', pct(READOUT_META_Y_180));\n // When the frame lowered a crop for the label drop, the sector's static\n // aspect-ratio no longer matches the viewBox — follow the frame so the\n // dial keeps hugging the root box (contain behavior, issue #992).\n if (frame.clipsAdjusted) {\n root.style.setProperty(\n '--gauge-radial-aspect',\n `${frame.width} / ${frame.height}`\n );\n } else {\n root.style.removeProperty('--gauge-radial-aspect');\n }\n };\n\n // Arrow form so `this` binds when passed as `.getAngle=${this.getAngle}`\n // to <obc-instrument-radial>. Do not convert to a method.\n getAngle = (v: number): number => {\n const {sweep, start} = this.sectorAngles;\n const span = this.maxValue - this.minValue;\n if (!Number.isFinite(span) \|\| span <= 0) {\n return start;\n }\n\n return ((v - this.minValue) / span) * sweep + start;\n };\n\n /** Renders one gauge readout; `withMeta`/`withValue` pick parts. */\n private renderReadout({\n className,\n stacking,\n alignment = ReadoutAlignment.vertical,\n withMeta = true,\n withValue = true,\n }: {\n className: string;\n stacking?: ReadoutStacking;\n alignment?: ReadoutAlignment;\n withMeta?: boolean;\n withValue?: boolean;\n }): TemplateResult {\n return renderInstrumentReadout({\n className,\n stacking,\n alignment,\n hasValue: withValue,\n value: withValue ? this.value : undefined,\n priority: withValue ? this.priority : undefined,\n fractionDigits: this.fractionDigits,\n label: withMeta ? this.label : '',\n unit: withMeta ? this.unit : '',\n });\n }\n\n private renderReadouts() {\n if (!this.hasReadout) {\n return nothing;\n }\n\n const isNeedle = this.type === ObcGaugeRadialType.needle;\n const is90 = this.isSector90;\n const is180 = this.sector === GaugeRadialSector.deg180;\n\n if (isNeedle && (is180 \|\| is90)) {\n return nothing;\n }\n\n // 90 filled/bar: enhanced corner readout (bold value + label/unit).\n if (is90) {\n return this.renderReadout({\n className: 'gauge-readout-meta',\n });\n }\n\n // 270 needle and 180 filled/bar: centered stack (value weight follows `priority`).\n if (isNeedle \|\| is180) {\n return this.renderReadout({\n className: 'gauge-readout-meta',\n stacking: ReadoutStacking.stacked,\n alignment: ReadoutAlignment.center,\n });\n }\n\n // 270 filled/bar: the value sits at the circle center and the label/unit row\n // lower in the bottom gap, so they are two separately-positioned readouts.\n return html`\n ${this.renderReadout({\n className: 'gauge-readout-value',\n withMeta: false,\n })}\n ${this.label \|\| this.unit\n ? this.renderReadout({\n className: 'gauge-readout-meta',\n stacking: ReadoutStacking.stacked,\n alignment: ReadoutAlignment.center,\n withValue: false,\n })\n : nothing}\n `;\n }\n\n override render() {\n const clips = this.sectorClips;\n return html`\n <div\n class=${classMap({\n 'gauge-radial-root': true,\n 'face-pinned': this.faceDiameter !== undefined,\n 'type-needle': this.type === ObcGaugeRadialType.needle,\n 'sector-180': this.sector === GaugeRadialSector.deg180,\n 'sector-90-left': this.sector === GaugeRadialSector.deg90Left,\n 'sector-90-right': this.sector === GaugeRadialSector.deg90Right,\n [`halign-${this.horizontalAlignment}`]: true,\n [`valign-${this.verticalAlignment}`]: true,\n })}\n >\n <obc-instrument-radial\n .value=${this.value}\n .state=${this.state}\n .priority=${this.priority}\n .setpoint=${this.setpoint}\n .newSetpoint=${this.newSetpoint}\n .setpointAtZeroDeadband=${this.setpointAtZeroDeadband}\n .setpointOverride=${this.setpointOverride}\n .touching=${this.touching}\n .autoAtSetpoint=${this.autoAtSetpoint}\n .autoAtSetpointDeadband=${this.autoAtSetpointDeadband}\n .animateSetpoint=${this.animateSetpoint}\n .maxValue=${this.maxValue}\n .minValue=${this.minValue}\n .getAngle=${this.getAngle}\n .showLabels=${this.showLabels}\n .primaryTickmarkInterval=${this.primaryTickmarkInterval}\n .secondaryTickmarkInterval=${this.secondaryTickmarkInterval}\n .tertiaryTickmarkInterval=${this.tertiaryTickmarkInterval}\n .type=${this.type}\n .needleType=${this.type}\n .tickmarksInside=${this.tickmarksInside}\n .tickmarkStyle=${this.tickmarkStyle}\n .advices=${this.isSector90 ? [] : this.advices}\n .clipTop=${clips.top}\n .clipBottom=${clips.bottom}\n .clipLeft=${clips.left}\n .clipRight=${clips.right}\n .endLabelsMaxMin=${this.sector === GaugeRadialSector.deg180}\n .faceDiameter=${this.faceDiameter}\n @frame-changed=${this._onFrameChanged}\n >\n </obc-instrument-radial>\n ${this.renderReadouts()}\n </div>\n `;\n }\n\n static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-gauge-radial': ObcGaugeRadial;\n }\n}\n"],"names":["ObcGaugeRadialType","GaugeRadialSector","GaugeRadialHorizontalAlignment","GaugeRadialVerticalAlignment"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAcO,IAAK,uCAAAA,wBAAL;AACLA,sBAAA,QAAA,IAAS;AACTA,sBAAA,KAAA,IAAM;AACNA,sBAAA,QAAA,IAAS;AAHC,SAAAA;AAAA,GAAA,sBAAA,CAAA,CAAA;AAML,IAAK,sCAAAC,uBAAL;AACLA,qBAAA,QAAA,IAAS;AACTA,qBAAA,QAAA,IAAS;AACTA,qBAAA,WAAA,IAAY;AACZA,qBAAA,YAAA,IAAa;AAJH,SAAAA;AAAA,GAAA,qBAAA,CAAA,CAAA;AAOL,IAAK,mDAAAC,oCAAL;AACLA,kCAAA,MAAA,IAAO;AACPA,kCAAA,QAAA,IAAS;AACTA,kCAAA,OAAA,IAAQ;AAHE,SAAAA;AAAA,GAAA,kCAAA,CAAA,CAAA;AAML,IAAK,iDAAAC,kCAAL;AACLA,gCAAA,KAAA,IAAM;AACNA,gCAAA,QAAA,IAAS;AACTA,gCAAA,QAAA,IAAS;AAHC,SAAAA;AAAA,GAAA,gCAAA,CAAA,CAAA;AAoBZ,MAAM,iBAAiB;AACvB,MAAM,wBAAwB;AAC9B,MAAM,qBAAqB;AA4EpB,IAAM,iBAAN,cAA6B,cAAc,UAAU,EAAE;AAAA,EAAvD,cAAA;AAAA,UAAA,GAAA,SAAA;AACqB,SAAA,QAAQ;AACR,SAAA,WAAW;AACX,SAAA,WAAW;AACV,SAAA,aAAsB;AACvB,SAAA,0BAA0B;AAC1B,SAAA,4BAA4B;AAK5B,SAAA,2BACxB;AACwB,SAAA,QAAyB,gBAAgB;AACzC,SAAA,WAAqB,SAAS;AAC9B,SAAA,OACxB;AACyB,SAAA,kBAA2B;AAC5B,SAAA,gBACxB,cAAc;AAE2B,SAAA,UAA+B,CAAA;AACjC,SAAA,SACvC;AAOF,SAAA,sBACE;AAMwB,SAAA,oBACxB;AAMyB,SAAA,aAAa;AACd,SAAA,QAAQ;AACR,SAAA,OAAO;AACP,SAAA,iBAAiB;AAgE3C,SAAQ,kBAAkB,CAAC,MAAmB;AAC5C,YAAM,QAAS,EAA+B;AAC9C,YAAM,OAAO,KAAK;AAClB,UAAI,CAAC,QAAQ,EAAE,MAAM,SAAS,IAAI;AAChC;AAAA,MACF;AACA,YAAM,MAAM,CAAC,YACX,KAAM,UAAU,MAAM,KAAK,MAAM,SAAU,KAAK,QAAQ,CAAC,CAAC;AAC5D,WAAK,MAAM,YAAY,sBAAsB,IAAI,cAAc,CAAC;AAChE,WAAK,MAAM;AAAA,QACT;AAAA,QACA,IAAI,qBAAqB;AAAA,MAAA;AAE3B,WAAK,MAAM,YAAY,0BAA0B,IAAI,kBAAkB,CAAC;AAIxE,UAAI,MAAM,eAAe;AACvB,aAAK,MAAM;AAAA,UACT;AAAA,UACA,GAAG,MAAM,KAAK,MAAM,MAAM,MAAM;AAAA,QAAA;AAAA,MAEpC,OAAO;AACL,aAAK,MAAM,eAAe,uBAAuB;AAAA,MACnD;AAAA,IACF;AAIA,SAAA,WAAW,CAAC,MAAsB;AAChC,YAAM,EAAC,OAAO,MAAA,IAAS,KAAK;AAC5B,YAAM,OAAO,KAAK,WAAW,KAAK;AAClC,UAAI,CAAC,OAAO,SAAS,IAAI,KAAK,QAAQ,GAAG;AACvC,eAAO;AAAA,MACT;AAEA,cAAS,IAAI,KAAK,YAAY,OAAQ,QAAQ;AAAA,IAChD;AAAA,EAAA;AAAA,EA1FA,IAAY,eAA+C;AACzD,YAAQ,KAAK,QAAA;AAAA,MACX,KAAK;AACH,eAAO,EAAC,OAAO,KAAK,OAAO,IAAA;AAAA,MAC7B,KAAK;AACH,eAAO,EAAC,OAAO,IAAI,OAAO,IAAA;AAAA,MAC5B,KAAK;AACH,eAAO,EAAC,OAAO,IAAI,OAAO,EAAA;AAAA,MAC5B,KAAK;AAAA,MACL;AACE,eAAO,EAAC,OAAO,KAAK,OAAO,KAAA;AAAA,IAAI;AAAA,EAErC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQA,IAAY,cAKV;AACA,YAAQ,KAAK,QAAA;AAAA,MACX,KAAK;AACH,eAAO,EAAC,KAAK,GAAG,QAAQ,IAAI,MAAM,GAAG,OAAO,EAAA;AAAA,MAC9C,KAAK;AACH,eAAO,EAAC,KAAK,GAAG,QAAQ,IAAI,MAAM,GAAG,OAAO,GAAA;AAAA,MAC9C,KAAK;AACH,eAAO,EAAC,KAAK,GAAG,QAAQ,IAAI,MAAM,IAAI,OAAO,EAAA;AAAA,MAC/C,KAAK;AAAA,MACL;AACE,eAAO,EAAC,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,EAAA;AAAA,IAAC;AAAA,EAElD;AAAA,EAEA,IAAY,aAAsB;AAChC,WACE,KAAK,WAAW,aAChB,KAAK,WAAW;AAAA,EAEpB;AAAA;AAAA,EAiDQ,cAAc;AAAA,IACpB;AAAA,IACA;AAAA,IACA,YAAY,iBAAiB;AAAA,IAC7B,WAAW;AAAA,IACX,YAAY;AAAA,EAAA,GAOK;AACjB,WAAO,wBAAwB;AAAA,MAC7B;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV,OAAO,YAAY,KAAK,QAAQ;AAAA,MAChC,UAAU,YAAY,KAAK,WAAW;AAAA,MACtC,gBAAgB,KAAK;AAAA,MACrB,OAAO,WAAW,KAAK,QAAQ;AAAA,MAC/B,MAAM,WAAW,KAAK,OAAO;AAAA,IAAA,CAC9B;AAAA,EACH;AAAA,EAEQ,iBAAiB;AACvB,QAAI,CAAC,KAAK,YAAY;AACpB,aAAO;AAAA,IACT;AAEA,UAAM,WAAW,KAAK,SAAS;AAC/B,UAAM,OAAO,KAAK;AAClB,UAAM,QAAQ,KAAK,WAAW;AAE9B,QAAI,aAAa,SAAS,OAAO;AAC/B,aAAO;AAAA,IACT;AAGA,QAAI,MAAM;AACR,aAAO,KAAK,cAAc;AAAA,QACxB,WAAW;AAAA,MAAA,CACZ;AAAA,IACH;AAGA,QAAI,YAAY,OAAO;AACrB,aAAO,KAAK,cAAc;AAAA,QACxB,WAAW;AAAA,QACX,UAAU,gBAAgB;AAAA,QAC1B,WAAW,iBAAiB;AAAA,MAAA,CAC7B;AAAA,IACH;AAIA,WAAO;AAAA,QACH,KAAK,cAAc;AAAA,MACnB,WAAW;AAAA,MACX,UAAU;AAAA,IAAA,CACX,CAAC;AAAA,QACA,KAAK,SAAS,KAAK,OACjB,KAAK,cAAc;AAAA,MACjB,WAAW;AAAA,MACX,UAAU,gBAAgB;AAAA,MAC1B,WAAW,iBAAiB;AAAA,MAC5B,WAAW;AAAA,IAAA,CACZ,IACD,OAAO;AAAA;AAAA,EAEf;AAAA,EAES,SAAS;AAChB,UAAM,QAAQ,KAAK;AACnB,WAAO;AAAA;AAAA,gBAEK,SAAS;AAAA,MACf,qBAAqB;AAAA,MACrB,eAAe,KAAK,iBAAiB;AAAA,MACrC,eAAe,KAAK,SAAS;AAAA,MAC7B,cAAc,KAAK,WAAW;AAAA,MAC9B,kBAAkB,KAAK,WAAW;AAAA,MAClC,mBAAmB,KAAK,WAAW;AAAA,MACnC,CAAC,UAAU,KAAK,mBAAmB,EAAE,GAAG;AAAA,MACxC,CAAC,UAAU,KAAK,iBAAiB,EAAE,GAAG;AAAA,IAAA,CACvC,CAAC;AAAA;AAAA;AAAA,mBAGS,KAAK,KAAK;AAAA,mBACV,KAAK,KAAK;AAAA,sBACP,KAAK,QAAQ;AAAA,sBACb,KAAK,QAAQ;AAAA,yBACV,KAAK,WAAW;AAAA,oCACL,KAAK,sBAAsB;AAAA,8BACjC,KAAK,gBAAgB;AAAA,sBAC7B,KAAK,QAAQ;AAAA,4BACP,KAAK,cAAc;AAAA,oCACX,KAAK,sBAAsB;AAAA,6BAClC,KAAK,eAAe;AAAA,sBAC3B,KAAK,QAAQ;AAAA,sBACb,KAAK,QAAQ;AAAA,sBACb,KAAK,QAAQ;AAAA,wBACX,KAAK,UAAU;AAAA,qCACF,KAAK,uBAAuB;AAAA,uCAC1B,KAAK,yBAAyB;AAAA,sCAC/B,KAAK,wBAAwB;AAAA,kBACjD,KAAK,IAAI;AAAA,wBACH,KAAK,IAAI;AAAA,6BACJ,KAAK,eAAe;AAAA,2BACtB,KAAK,aAAa;AAAA,qBACxB,KAAK,aAAa,CAAA,IAAK,KAAK,OAAO;AAAA,qBACnC,MAAM,GAAG;AAAA,wBACN,MAAM,MAAM;AAAA,sBACd,MAAM,IAAI;AAAA,uBACT,MAAM,KAAK;AAAA,6BACL,KAAK,WAAW,KAAA;AAAA,0BACnB,KAAK,YAAY;AAAA,2BAChB,KAAK,eAAe;AAAA;AAAA;AAAA,UAGrC,KAAK,gBAAgB;AAAA;AAAA;AAAA,EAG7B;AAGF;AAtRa,eAqRK,SAAS,UAAU,cAAc;AApRvB,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GADb,eACe,WAAA,SAAA,CAAA;AACA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GAFb,eAEe,WAAA,YAAA,CAAA;AACA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GAHb,eAGe,WAAA,YAAA,CAAA;AACC,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAJd,eAIgB,WAAA,cAAA,CAAA;AACD,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GALb,eAKe,WAAA,2BAAA,CAAA;AACA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GANb,eAMe,WAAA,6BAAA,CAAA;AAKA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GAXb,eAWe,WAAA,4BAAA,CAAA;AAEA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GAbb,eAae,WAAA,SAAA,CAAA;AACA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GAdb,eAce,WAAA,YAAA,CAAA;AACA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GAfb,eAee,WAAA,QAAA,CAAA;AAEC,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAjBd,eAiBgB,WAAA,mBAAA,CAAA;AACD,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GAlBb,eAkBe,WAAA,iBAAA,CAAA;AAGiB,gBAAA;AAAA,EAA1C,SAAS,EAAC,MAAM,OAAO,WAAW,OAAM;AAAA,GArB9B,eAqBgC,WAAA,WAAA,CAAA;AACF,gBAAA;AAAA,EAAxC,SAAS,EAAC,MAAM,QAAQ,SAAS,MAAK;AAAA,GAtB5B,eAsB8B,WAAA,UAAA,CAAA;AAQzC,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GA7Bb,eA8BX,WAAA,uBAAA,CAAA;AAO0B,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GArCb,eAqCe,WAAA,qBAAA,CAAA;AAOC,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GA5Cd,eA4CgB,WAAA,cAAA,CAAA;AACD,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GA7Cb,eA6Ce,WAAA,SAAA,CAAA;AACA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GA9Cb,eA8Ce,WAAA,QAAA,CAAA;AACA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GA/Cb,eA+Ce,WAAA,kBAAA,CAAA;AAS1B,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,QAAQ,WAAW,iBAAiB,SAAS,MAAK;AAAA,GAvDxD,eAwDX,WAAA,gBAAA,CAAA;AAiDqC,gBAAA;AAAA,EAApC,MAAM,oBAAoB;AAAA,GAzGhB,eAyG0B,WAAA,WAAA,CAAA;AAzG1B,iBAAN,gBAAA;AAAA,EADN,cAAc,kBAAkB;AAAA,GACpB,cAAA;"}

package/dist/navigation-instruments/gauge-trend/gauge-trend.d.ts CHANGED Viewed

@@ -98,11 +98,6 @@ declare const ObcGaugeTrend_base: (new (...args: any[]) => import('../../svghelp
  * ></obc-gauge-trend>
  * ```
  *
- * @property {number} width - Chart width in pixels (defines aspect ratio)
- * @property {number} height - Chart height in pixels (defines aspect ratio)
- * @property {boolean} enhanced - Use enhanced color palette for chart and scales
- * @property {InstrumentState} state - Instrument state (automatically applied to scale)
- * @property {boolean} chartFill - Enable chart area fill (default: false for line-only)
  *
  * Setpoint properties are inherited from {@link SetpointMixin}.
  * These are forwarded to the internal `obc-bar-vertical` scale:

package/dist/navigation-instruments/gauge-trend/gauge-trend.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"gauge-trend.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/gauge-trend/gauge-trend.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,gBAAgB,EAKjB,MAAM,qDAAqD,CAAC;AAE7D,OAAO,EACL,QAAQ,EAGR,SAAS,EACV,MAAM,oDAAoD,CAAC;AAC5D,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,mDAAmD,CAAC;AAEpF,OAAO,oDAAoD,CAAC;AAG5D,OAAO,EAAC,QAAQ,EAAE,SAAS,EAAC,CAAC;;AAE7B~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0GG~~;AACH,qBACa,aAAc,SAAQ,kBAA+B;IAChE,OAAO,CAAC,mBAAmB,CAAC,CAAc;IAC1C,OAAO,CAAC,cAAc,CAAS;IAC/B,OAAO,CAAC,kBAAkB,CAAS;IACnC,OAAO,CAAC,qBAAqB,CAAC,CAAY;;IA6C3B,YAAY;IAWlB,oBAAoB;IAQ7B,OAAO,CAAC,yBAAyB;IAWjC,OAAO,CAAC,2BAA2B;IAUnC,OAAO,CAAC,4BAA4B;IAkFpC;;;;;;;OAOG;IAEH,SAAS,EAAE,SAAS,CAAqB;IAEzC;;;OAGG;IAEH,QAAQ,SAAK;IAEb;;;OAGG;IAEH,QAAQ,SAAO;IAEf;;;OAGG;IAEH,aAAa,CAAC,EAAE,MAAM,CAAa;IAEnC;;;OAGG;IAEH,aAAa,CAAC,EAAE,MAAM,CAAa;IAEnC;;;;;;;;;;OAUG;IAEH,KAAK,CAAC,EAAE,MAAM,CAAa;IAE3B;;;;;OAKG;IAEH,MAAM,UAAS;IAEf;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,SAAS,UAAS;IAElB;;;;;;;;;OASG;IAEH,QAAQ,EAAE,QAAQ,CAAiB;IAEnC;;;;;OAKG;IAEH,OAAO,SAAK;IAEZ;;;;;;;;OAQG;IAEH,OAAO,CAAC,EAAE,MAAM,CAAa;IAE7B;;;OAGG;IAEH,MAAM,EAAE,YAAY,EAAE,CAAM;IAE5B;;OAEG;IAEH,uBAAuB,CAAC,EAAE,MAAM,CAAa;IAO7C;;;OAGG;IAEH,yBAAyB,SAAO;IAEhC;;;OAGG;IAEH,wBAAwB,CAAC,EAAE,MAAM,CAAa;IAE9C;;;;OAIG;IAEH,SAAS,UAAS;IAElB;;OAEG;cACgB,eAAe,IAAI,OAAO;IAI7C;;;OAGG;cACgB,WAAW,IAAI,MAAM,GAAG,SAAS;IAIpD;;OAEG;cACgB,WAAW,IAAI,OAAO;IAIhC,UAAU,CAAC,OAAO,EAAE,GAAG,CAAC,WAAW,EAAE,OAAO,CAAC;IAuD7C,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,WAAW,EAAE,OAAO,CAAC;CAkDpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,aAAa,CAAC;KAClC;CACF"}
1	+ {"version":3,"file":"gauge-trend.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/gauge-trend/gauge-trend.ts"],"names":[],"mappings":"AAEA,OAAO,EACL,gBAAgB,EAKjB,MAAM,qDAAqD,CAAC;AAE7D,OAAO,EACL,QAAQ,EAGR,SAAS,EACV,MAAM,oDAAoD,CAAC;AAC5D,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,mDAAmD,CAAC;AAEpF,OAAO,oDAAoD,CAAC;AAG5D,OAAO,EAAC,QAAQ,EAAE,SAAS,EAAC,CAAC;;AAE7B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqGG;AACH,qBACa,aAAc,SAAQ,kBAA+B;IAChE,OAAO,CAAC,mBAAmB,CAAC,CAAc;IAC1C,OAAO,CAAC,cAAc,CAAS;IAC/B,OAAO,CAAC,kBAAkB,CAAS;IACnC,OAAO,CAAC,qBAAqB,CAAC,CAAY;;IA6C3B,YAAY;IAWlB,oBAAoB;IAQ7B,OAAO,CAAC,yBAAyB;IAWjC,OAAO,CAAC,2BAA2B;IAUnC,OAAO,CAAC,4BAA4B;IAkFpC;;;;;;;OAOG;IAEH,SAAS,EAAE,SAAS,CAAqB;IAEzC;;;OAGG;IAEH,QAAQ,SAAK;IAEb;;;OAGG;IAEH,QAAQ,SAAO;IAEf;;;OAGG;IAEH,aAAa,CAAC,EAAE,MAAM,CAAa;IAEnC;;;OAGG;IAEH,aAAa,CAAC,EAAE,MAAM,CAAa;IAEnC;;;;;;;;;;OAUG;IAEH,KAAK,CAAC,EAAE,MAAM,CAAa;IAE3B;;;;;OAKG;IAEH,MAAM,UAAS;IAEf;;OAEG;IAEH,QAAQ,UAAS;IAEjB;;OAEG;IAEH,SAAS,UAAS;IAElB;;;;;;;;;OASG;IAEH,QAAQ,EAAE,QAAQ,CAAiB;IAEnC;;;;;OAKG;IAEH,OAAO,SAAK;IAEZ;;;;;;;;OAQG;IAEH,OAAO,CAAC,EAAE,MAAM,CAAa;IAE7B;;;OAGG;IAEH,MAAM,EAAE,YAAY,EAAE,CAAM;IAE5B;;OAEG;IAEH,uBAAuB,CAAC,EAAE,MAAM,CAAa;IAO7C;;;OAGG;IAEH,yBAAyB,SAAO;IAEhC;;;OAGG;IAEH,wBAAwB,CAAC,EAAE,MAAM,CAAa;IAE9C;;;;OAIG;IAEH,SAAS,UAAS;IAElB;;OAEG;cACgB,eAAe,IAAI,OAAO;IAI7C;;;OAGG;cACgB,WAAW,IAAI,MAAM,GAAG,SAAS;IAIpD;;OAEG;cACgB,WAAW,IAAI,OAAO;IAIhC,UAAU,CAAC,OAAO,EAAE,GAAG,CAAC,WAAW,EAAE,OAAO,CAAC;IAuD7C,OAAO,CAAC,OAAO,EAAE,GAAG,CAAC,WAAW,EAAE,OAAO,CAAC;CAkDpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,aAAa,CAAC;KAClC;CACF"}

package/dist/navigation-instruments/gauge-trend/gauge-trend.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"gauge-trend.js","sources":["../../../src/navigation-instruments/gauge-trend/gauge-trend.ts"],"sourcesContent":["import {property} from 'lit/decorators.js';\nimport {customElement} from '../../decorator.js';\nimport {\n ObcChartLineBase,\n XAxisType,\n YAxisPosition,\n LineMode,\n TimeDisplay,\n} from '../../building-blocks/chart-line/chart-line-base.js';\nimport {BorderRadiusPosition} from '../types.js';\nimport {\n FillMode,\n AdvicePosition,\n BarContainerStyle,\n ScaleType,\n} from '../../building-blocks/bar-vertical/bar-vertical.js';\nimport type {LinearAdvice} from '../../building-blocks/instrument-linear/advice.js';\nimport {SetpointMixin} from '../../svghelpers/setpoint-mixin.js';\nimport '../../building-blocks/bar-vertical/bar-vertical.js';\n\n// Re-export FillMode and ScaleType for user convenience\nexport {FillMode, ScaleType};\n\n/*\n Gauge Trend - A navigation instrument combining a line/area chart with an integrated vertical scale.\n \n This is a high-level, self-contained component that combines:\n * - A line/area chart (based on `ObcChartLineBase`) with configurable fill mode\n * - An integrated vertical scale (`obc-bar-vertical`) on the right side\n \n The component is designed for displaying time-series or categorical trend data alongside a calibrated\n * vertical measurement scale, commonly used in maritime navigation instruments.\n \n ## Architecture\n \n Internally composed of:\n * - Base: `ObcChartLineBase` (line/area graph functionality)\n * - Right scale: `obc-bar-vertical` (external scale component)\n \n ## Locked Configuration (not user-configurable)\n * - Fixed aspect ratio scaling: always enabled\n * - Instrument mode: always enabled (8px border radius)\n * - X-axis type: auto-detected — 'category' for `{label, value}` data,\n * 'time' for `{x, value}` data (uneven intervals position proportionally).\n * Assigning `xAxisType` explicitly disables auto-detection.\n * - Line mode: always 'smooth'\n * - Grid, tick marks, points, legend: always hidden\n * - Scale advice position: always 'inner'\n * - Scale state: automatically inherits from `state` property\n \n ## Usage Examples\n \n ### Basic gauge trend with default area fill\n * ```html\n * <obc-gauge-trend\n * .data=${[\n * {label: 'Jan', value: 3.5},\n * {label: 'Feb', value: 4.2},\n * {label: 'Mar', value: 5.0}\n * ]}\n * .minValue=${3}\n * .maxValue=${7}\n * .value=${5}\n * .width=${480}\n * .height=${480}\n * ></obc-gauge-trend>\n * ```\n \n ### Line-only (no fill) - default\n * ```html\n * <obc-gauge-trend\n * .data=${chartData}\n * ></obc-gauge-trend>\n * ```\n \n ### With area fill\n * ```html\n * <obc-gauge-trend\n * .chartFill=${true}\n * .data=${chartData}\n * ></obc-gauge-trend>\n * ```\n \n ### With enhanced colors and setpoint\n * ```html\n * <obc-gauge-trend\n * .enhanced=${true}\n * .state=${'in-command'}\n * .setpoint=${5.5}\n * .value=${5.2}\n * .hasBar=${true}\n * .hasScale=${true}\n * ></obc-gauge-trend>\n * ```\n \n ### With advice overlays\n * ```html\n * <obc-gauge-trend\n * .hasAdvice=${true}\n * .advice=${[\n * {min: 3, max: 5, type: 'caution', hinted: true},\n * {min: 6, max: 7, type: 'advice', hinted: false}\n * ]}\n * ></obc-gauge-trend>\n * ```\n \n ### Time-based data with uneven intervals\n * ```html\n * <obc-gauge-trend\n * .data=${[\n * {x: '2026-07-06T10:00:00Z', value: 3.5},\n * {x: '2026-07-06T10:03:00Z', value: 4.2},\n * {x: '2026-07-06T10:15:00Z', value: 5.0}\n * ]}\n * ></obc-gauge-trend>\n * ```\n \n @property {number} width - Chart width in pixels (defines aspect ratio)\n * @property {number} height - Chart height in pixels (defines aspect ratio)\n * @property {boolean} enhanced - Use enhanced color palette for chart and scales\n * @property {InstrumentState} state - Instrument state (automatically applied to scale)\n * @property {boolean} chartFill - Enable chart area fill (default: false for line-only)\n \n Setpoint properties are inherited from {@link SetpointMixin}.\n * These are forwarded to the internal `obc-bar-vertical` scale:\n * `setpoint`, `newSetpoint`, `touching`, `atSetpoint`, `autoAtSetpoint`,\n * `autoAtSetpointDeadband`, `setpointAtZeroDeadband`, `setpointOverride`.\n * See {@link SetpointMixinInterface} for full documentation.\n * @stable\n /\n@customElement('obc-gauge-trend')\nexport class ObcGaugeTrend extends SetpointMixin(ObcChartLineBase) {\n private _barVerticalElement?: HTMLElement;\n private _isFirstUpdate = false;\n private _explicitXAxisType = false;\n private _autoAppliedXAxisType?: XAxisType;\n\n constructor() {\n super();\n\n // Chart display options - locked for gauge-trend\n this.legend = false;\n this.showDebugOverlay = false;\n this.showGrid = false;\n this.showTickMarks = false;\n this.showPoints = false;\n\n // Axis configuration - locked for gauge-trend\n this.xAxisType = XAxisType.category;\n this.yAxisPosition = YAxisPosition.left;\n\n // Line rendering - locked for gauge-trend\n this.lineMode = LineMode.smooth;\n\n // Tooltip/unit - locked for gauge-trend (scale shows values)\n this.unit = '';\n this.timeDisplay = TimeDisplay.date;\n\n // Scaling and sizing - locked for gauge-trend\n this.fixedAspectRatioScaling = true;\n this.instrumentMode = true;\n this.borderRadius = 8;\n\n // Border radius positions for chart + scale composition\n this.borderRadiusPosition = BorderRadiusPosition.innerFirstChild;\n this.borderRadiusPositionExternalScales = BorderRadiusPosition.middleChild;\n\n // Y-axis configuration (managed internally, single axis only)\n // Note: yAxes will be properly set in willUpdate once properties are initialized\n // Using minValue/maxValue as defaults when chartMinValue/chartMaxValue are undefined\n this.yAxes = [\n {\n id: 'y',\n position: 'left',\n min: this.chartMinValue ?? this.minValue,\n max: this.chartMaxValue ?? this.maxValue,\n },\n ];\n }\n\n override async firstUpdated() {\n // IMPORTANT: create the external scale before* base firstUpdated runs.\n // The base waits for external scale dimensions to integrate chart padding.\n this._createBarVerticalElement();\n this._updateBorderRadiusPosition();\n\n await super.firstUpdated();\n\n this._isFirstUpdate = false;\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n // Note: We intentionally don't remove _barVerticalElement here.\n // It's a light DOM child that naturally travels with the parent when\n // the component is moved in the DOM. Removing it would cause the scale\n // to be lost on reconnect since firstUpdated() only runs once.\n }\n\n private _createBarVerticalElement() {\n // Create bar-vertical element in light DOM so it can be slotted\n if (!this._barVerticalElement) {\n const barVertical = document.createElement('obc-bar-vertical');\n barVertical.setAttribute('slot', 'right-scale');\n this._barVerticalElement = barVertical;\n this.appendChild(barVertical);\n this._updateBarVerticalProperties();\n }\n }\n\n private _updateBorderRadiusPosition() {\n // When there's no bar and no scale (labels only), round all corners\n if (!this.hasBar && !this.hasScale) {\n this.borderRadiusPosition = BorderRadiusPosition.middleRoundedChild;\n } else {\n // Otherwise, use innerFirstChild (rounds left side when scale is on right)\n this.borderRadiusPosition = BorderRadiusPosition.innerFirstChild;\n }\n }\n\n private _updateBarVerticalProperties() {\n if (!this._barVerticalElement) {\n return;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const barVertical = this._barVerticalElement as any;\n\n // Use getEffectiveHeight() which returns computed height in fixedAspectRatioScaling mode\n // This ensures the bar-vertical gets the correct height that matches the chart's actual size\n const effectiveHeight = this.getEffectiveHeight();\n\n barVertical.minValue = this.minValue;\n barVertical.maxValue = this.maxValue;\n barVertical.height = effectiveHeight;\n barVertical.side = 'right';\n barVertical.hasScale = this.hasScale;\n barVertical.hasBar = this.hasBar;\n // Bar thickness: 48 for scale mode, 24 for bar-only mode (internal, not user-configurable)\n barVertical.barThickness = this.hasScale ? 48 : 24;\n barVertical.scaleType = this.scaleType;\n barVertical.fillMode = this.fillMode;\n barVertical.fillMin = this.fillMin;\n // In 'fill' mode: fillMax always tracks value (bar shows current value)\n // In 'tint' mode: fillMax uses explicit value or defaults to value\n barVertical.fillMax =\n this.fillMode === FillMode.fill\n ? this.value\n : (this.fillMax ?? this.value);\n barVertical.value = this.value;\n barVertical.setpoint = this.setpoint;\n barVertical.newSetpoint = this.newSetpoint;\n barVertical.touching = this.touching;\n barVertical.atSetpoint = this.atSetpoint;\n barVertical.autoAtSetpoint = this.autoAtSetpoint;\n barVertical.autoAtSetpointDeadband = this.autoAtSetpointDeadband;\n barVertical.setpointAtZeroDeadband = this.setpointAtZeroDeadband;\n barVertical.animateSetpoint = this.animateSetpoint;\n barVertical.setpointOverride = this.setpointOverride;\n // Advice position is always 'inner' for gauge-trend\n barVertical.advicePosition = AdvicePosition.inner;\n // obc-bar-vertical uses 'advices' (plural), not 'advice' or 'hasAdvice'\n barVertical.advices = this.hasAdvice ? this.advice : [];\n barVertical.primaryTickmarkInterval = this.primaryTickmarkInterval;\n barVertical.secondaryTickmarkInterval = this.secondaryTickmarkInterval;\n barVertical.tertiaryTickmarkInterval = this.tertiaryTickmarkInterval;\n barVertical.scaleBackground = this.hasScale;\n // When hasScale=false, use gray (secondary) background for the bar container\n barVertical.barContainerStyle = this.hasScale\n ? undefined\n : BarContainerStyle.secondary;\n // Pass fixedAspectRatio to match parent's fixedAspectRatioScaling\n barVertical.fixedAspectRatio = this.fixedAspectRatioScaling;\n // Pass scaleReferenceSize from parent (inherited from ObcChartLineBase)\n barVertical.scaleReferenceSize = this.scaleReferenceSize;\n // Derive tickmark visibility from whether intervals are defined\n barVertical.hasPrimaryTickmarks =\n this.primaryTickmarkInterval !== undefined;\n barVertical.hasTertiaryTickmarks =\n this.tertiaryTickmarkInterval !== undefined;\n barVertical.priority = this.priority;\n // Scale state inherits from parent 'state' property automatically\n barVertical.state = this.state;\n\n // Enable instrument mode: only label font size responds to .obc-component-size-* CSS classes\n // Border radius and bar thickness are controlled by explicit values, not CSS variables\n barVertical.instrumentMode = true;\n // Use fixed border radius of 8px (same as medium component size) for consistent instrument appearance\n // This matches the chart's border radius for visual consistency\n barVertical.borderRadius = 8;\n\n // Automatically adjust border radius position based on hasScale\n // When hasScale=false, the bar-vertical should have outerLastChild border radius\n // When hasScale=true, it should be middleChild (has scale background as neighbor)\n barVertical.borderRadiusPosition = this.hasScale\n ? BorderRadiusPosition.middleChild\n : BorderRadiusPosition.outerLastChild;\n\n // Auto-derive: show dot indicator when no bar is shown\n barVertical.highlightCurrentValue = !this.hasBar;\n }\n\n /*\n Scale type for the vertical scale.\n * - `'regular'`: Standard tick lengths (default)\n * - `'condensed'`: Shorter tick lengths for compact display\n \n Hidden from Storybook controls via argTypes configuration.\n * @availableWhen hasScale==true\n /\n @property({type: String})\n scaleType: ScaleType = ScaleType.regular;\n\n /\n Minimum value for the scale range.\n * Also used as chart y-axis minimum when `chartMinValue` is undefined.\n /\n @property({type: Number})\n minValue = 0;\n\n /\n Maximum value for the scale range.\n * Also used as chart y-axis maximum when `chartMaxValue` is undefined.\n /\n @property({type: Number})\n maxValue = 100;\n\n /\n Minimum value for the chart y-axis.\n * When undefined, defaults to `minValue` to keep chart and scale aligned.\n /\n @property({type: Number})\n chartMinValue?: number = undefined;\n\n /\n Maximum value for the chart y-axis.\n * When undefined, defaults to `maxValue` to keep chart and scale aligned.\n /\n @property({type: Number})\n chartMaxValue?: number = undefined;\n\n /\n Current value displayed on the vertical scale.\n \n This is the primary value property that drives:\n * - The bar fill level (when `hasBar=true`)\n * - The dot indicator position (when `hasBar=false`)\n * - The `fillMax` value (when `fillMax` is not explicitly set)\n \n In typical usage, you only need to set this property to update the gauge.\n * @availableWhen hasBar==true \|\| hasScale==true\n /\n @property({type: Number})\n value?: number = undefined;\n\n /\n Show bar on the vertical scale.\n \n When `true`, displays a filled bar indicating the current value.\n * When `false`, a dot indicator is automatically shown at the value position instead.\n /\n @property({type: Boolean})\n hasBar = false;\n\n /\n Show scale tick marks and labels.\n /\n @property({type: Boolean})\n hasScale = false;\n\n /\n Show advice overlays on the vertical scale.\n /\n @property({type: Boolean})\n hasAdvice = false;\n\n /\n Fill mode for the bar.\n * - `'fill'`: Bar fills from `fillMin` to `value` — the bar visually tracks the current value.\n * The `fillMax` property is ignored in this mode.\n * - `'tint'`: Bar fills from `fillMin` to `fillMax` — an explicit highlighted range.\n * Use this when you want to show a fixed range independent of the current value.\n \n In both modes, `fillMin` is the origin point (e.g., 0 in a -100..100 scale).\n * @availableWhen hasBar==true && value!=undefined\n /\n @property({type: String})\n fillMode: FillMode = FillMode.fill;\n\n /\n Fill origin value - the starting point for the bar fill.\n * In both fill modes, the bar fills from this value toward the current value.\n * For scales like -100..100, set this to 0 to have the bar fill up or down from zero.\n * @availableWhen hasBar==true && value!=undefined\n /\n @property({type: Number})\n fillMin = 0;\n\n /\n Maximum fill value for the bar (only used in `'tint'` mode).\n \n In `'fill'` mode, this property is ignored — the bar always fills to `value`.\n \n In `'tint'` mode, this defines the upper bound of the highlighted range.\n * When `undefined`, defaults to `value`.\n * @availableWhen hasBar==true && value!=undefined && fillMode==tint\n /\n @property({type: Number})\n fillMax?: number = undefined;\n\n /\n Advice/alert overlays for the vertical scale.\n * @availableWhen hasAdvice==true\n /\n @property({type: Array, attribute: false})\n advice: LinearAdvice[] = [];\n\n /\n Primary tick interval for the vertical scale (longest ticks with labels).\n /\n @property({type: Number})\n primaryTickmarkInterval?: number = undefined;\n\n // Setpoint properties (setpoint, newSetpoint, touching, atSetpoint,\n // autoAtSetpoint, autoAtSetpointDeadband, setpointAtZeroDeadband,\n // setpointOverride, computeAtSetpoint()) are provided by SetpointMixin.\n // See setpoint-mixin.ts for full docs.\n\n /\n Secondary tick interval for the vertical scale (medium ticks).\n * @availableWhen hasScale==true\n /\n @property({type: Number})\n secondaryTickmarkInterval = 0.5;\n\n /\n Tertiary tick interval for the vertical scale (shortest ticks).\n * @availableWhen hasScale==true\n /\n @property({type: Number})\n tertiaryTickmarkInterval?: number = undefined;\n\n /\n Enable chart area fill.\n * When true, fills the area under the line with semitransparent color.\n * When false (default), renders as line-only chart.\n /\n @property({type: Boolean})\n chartFill = false;\n\n /\n Apply fill when chartFill is true.\n /\n protected override shouldApplyFill(): boolean {\n return this.chartFill;\n }\n\n /\n Return the fill mode for area rendering.\n * Maps chartFill boolean to base class fillMode.\n /\n protected override getFillMode(): string \| undefined {\n return this.chartFill ? 'semitransparent' : undefined;\n }\n\n /\n Stacking is not used in gauge-trend (always false).\n */\n protected override shouldStack(): boolean {\n return false;\n }\n\n override willUpdate(changed: Map<PropertyKey, unknown>) {\n // Auto axis detection: {x, value} data switches to time spacing, {label,\n // value} stays category. An explicit xAxisType assignment (anything we\n // did not auto-apply) permanently disables auto-detection. The\n // constructor's 'category' default lands in the first changed-map but is\n // not treated as explicit (hasUpdated is false and it equals the default).\n if (\n changed.has('xAxisType') &&\n this.xAxisType !== this._autoAppliedXAxisType &&\n (this.hasUpdated \|\| this.xAxisType !== XAxisType.category)\n ) {\n this._explicitXAxisType = true;\n }\n if (!this._explicitXAxisType && changed.has('data')) {\n const allHaveX =\n (this.data?.length ?? 0) > 0 && this.data.every((d) => d.x != null);\n const target = allHaveX ? XAxisType.time : XAxisType.category;\n if (this.xAxisType !== target) {\n this._autoAppliedXAxisType = target;\n this.xAxisType = target;\n }\n }\n\n super.willUpdate(changed);\n\n // Update y-axis range when chart or scale min/max changes\n // Note: yAxes is managed internally - users cannot set multiple axes\n // When chartMinValue/chartMaxValue are undefined, fall back to minValue/maxValue\n if (\n changed.has('chartMinValue') \|\|\n changed.has('chartMaxValue') \|\|\n changed.has('minValue') \|\|\n changed.has('maxValue')\n ) {\n const chartMin = this.chartMinValue ?? this.minValue;\n const chartMax = this.chartMaxValue ?? this.maxValue;\n this.yAxes = [\n {\n id: 'y',\n position: 'left',\n min: chartMin,\n max: chartMax,\n },\n ];\n }\n\n // Adjust chart's border radius position for external scales based on hasScale\n // This needs to be set before render, so we do it in willUpdate\n if (changed.has('hasScale')) {\n this.borderRadiusPositionExternalScales = this.hasScale\n ? BorderRadiusPosition.middleChild\n : BorderRadiusPosition.outerLastChild;\n }\n }\n\n override updated(changed: Map<PropertyKey, unknown>) {\n // Handle chartFill changes by forcing a data refresh\n // This triggers the base class to update the chart with new fill settings\n if (changed.has('chartFill') && this.data) {\n // Create a shallow copy to trigger the base class's watched property detection\n this.data = [...this.data];\n }\n\n super.updated(changed);\n // Update border radius position when bar/scale visibility changes\n if (changed.has('hasBar') \|\| changed.has('hasScale')) {\n this._updateBorderRadiusPosition();\n }\n // Keep the internal right-scale in sync with public API changes.\n // (Mirrors the storybook “chart integration” examples, but encapsulated.)\n if (!this._barVerticalElement \|\| this._isFirstUpdate) return;\n\n const shouldUpdateScale =\n changed.has('minValue') \|\|\n changed.has('maxValue') \|\|\n changed.has('value') \|\|\n changed.has('setpoint') \|\|\n changed.has('newSetpoint') \|\|\n changed.has('touching') \|\|\n changed.has('atSetpoint') \|\|\n changed.has('autoAtSetpoint') \|\|\n changed.has('autoAtSetpointDeadband') \|\|\n changed.has('setpointAtZeroDeadband') \|\|\n changed.has('setpointOverride') \|\|\n changed.has('hasBar') \|\|\n changed.has('hasScale') \|\|\n changed.has('hasAdvice') \|\|\n changed.has('fillMode') \|\|\n changed.has('fillMin') \|\|\n changed.has('fillMax') \|\|\n changed.has('advice') \|\|\n changed.has('primaryTickmarkInterval') \|\|\n changed.has('secondaryTickmarkInterval') \|\|\n changed.has('tertiaryTickmarkInterval') \|\|\n changed.has('scaleType') \|\|\n changed.has('state') \|\| // Scale state inherits from parent 'state'\n changed.has('priority') \|\|\n changed.has('height') \|\|\n changed.has('width') \|\|\n changed.has('scaleReferenceSize') \|\|\n changed.has('chartMinValue') \|\|\n changed.has('chartMaxValue');\n\n if (shouldUpdateScale) this._updateBarVerticalProperties();\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-gauge-trend': ObcGaugeTrend;\n }\n}\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"gauge-trend.js","sources":["../../../src/navigation-instruments/gauge-trend/gauge-trend.ts"],"sourcesContent":["import {property} from 'lit/decorators.js';\nimport {customElement} from '../../decorator.js';\nimport {\n ObcChartLineBase,\n XAxisType,\n YAxisPosition,\n LineMode,\n TimeDisplay,\n} from '../../building-blocks/chart-line/chart-line-base.js';\nimport {BorderRadiusPosition} from '../types.js';\nimport {\n FillMode,\n AdvicePosition,\n BarContainerStyle,\n ScaleType,\n} from '../../building-blocks/bar-vertical/bar-vertical.js';\nimport type {LinearAdvice} from '../../building-blocks/instrument-linear/advice.js';\nimport {SetpointMixin} from '../../svghelpers/setpoint-mixin.js';\nimport '../../building-blocks/bar-vertical/bar-vertical.js';\n\n// Re-export FillMode and ScaleType for user convenience\nexport {FillMode, ScaleType};\n\n/*\n Gauge Trend - A navigation instrument combining a line/area chart with an integrated vertical scale.\n \n This is a high-level, self-contained component that combines:\n * - A line/area chart (based on `ObcChartLineBase`) with configurable fill mode\n * - An integrated vertical scale (`obc-bar-vertical`) on the right side\n \n The component is designed for displaying time-series or categorical trend data alongside a calibrated\n * vertical measurement scale, commonly used in maritime navigation instruments.\n \n ## Architecture\n \n Internally composed of:\n * - Base: `ObcChartLineBase` (line/area graph functionality)\n * - Right scale: `obc-bar-vertical` (external scale component)\n \n ## Locked Configuration (not user-configurable)\n * - Fixed aspect ratio scaling: always enabled\n * - Instrument mode: always enabled (8px border radius)\n * - X-axis type: auto-detected — 'category' for `{label, value}` data,\n * 'time' for `{x, value}` data (uneven intervals position proportionally).\n * Assigning `xAxisType` explicitly disables auto-detection.\n * - Line mode: always 'smooth'\n * - Grid, tick marks, points, legend: always hidden\n * - Scale advice position: always 'inner'\n * - Scale state: automatically inherits from `state` property\n \n ## Usage Examples\n \n ### Basic gauge trend with default area fill\n * ```html\n * <obc-gauge-trend\n * .data=${[\n * {label: 'Jan', value: 3.5},\n * {label: 'Feb', value: 4.2},\n * {label: 'Mar', value: 5.0}\n * ]}\n * .minValue=${3}\n * .maxValue=${7}\n * .value=${5}\n * .width=${480}\n * .height=${480}\n * ></obc-gauge-trend>\n * ```\n \n ### Line-only (no fill) - default\n * ```html\n * <obc-gauge-trend\n * .data=${chartData}\n * ></obc-gauge-trend>\n * ```\n \n ### With area fill\n * ```html\n * <obc-gauge-trend\n * .chartFill=${true}\n * .data=${chartData}\n * ></obc-gauge-trend>\n * ```\n \n ### With enhanced colors and setpoint\n * ```html\n * <obc-gauge-trend\n * .enhanced=${true}\n * .state=${'in-command'}\n * .setpoint=${5.5}\n * .value=${5.2}\n * .hasBar=${true}\n * .hasScale=${true}\n * ></obc-gauge-trend>\n * ```\n \n ### With advice overlays\n * ```html\n * <obc-gauge-trend\n * .hasAdvice=${true}\n * .advice=${[\n * {min: 3, max: 5, type: 'caution', hinted: true},\n * {min: 6, max: 7, type: 'advice', hinted: false}\n * ]}\n * ></obc-gauge-trend>\n * ```\n \n ### Time-based data with uneven intervals\n * ```html\n * <obc-gauge-trend\n * .data=${[\n * {x: '2026-07-06T10:00:00Z', value: 3.5},\n * {x: '2026-07-06T10:03:00Z', value: 4.2},\n * {x: '2026-07-06T10:15:00Z', value: 5.0}\n * ]}\n * ></obc-gauge-trend>\n * ```\n \n \n * Setpoint properties are inherited from {@link SetpointMixin}.\n * These are forwarded to the internal `obc-bar-vertical` scale:\n * `setpoint`, `newSetpoint`, `touching`, `atSetpoint`, `autoAtSetpoint`,\n * `autoAtSetpointDeadband`, `setpointAtZeroDeadband`, `setpointOverride`.\n * See {@link SetpointMixinInterface} for full documentation.\n * @stable\n /\n@customElement('obc-gauge-trend')\nexport class ObcGaugeTrend extends SetpointMixin(ObcChartLineBase) {\n private _barVerticalElement?: HTMLElement;\n private _isFirstUpdate = false;\n private _explicitXAxisType = false;\n private _autoAppliedXAxisType?: XAxisType;\n\n constructor() {\n super();\n\n // Chart display options - locked for gauge-trend\n this.legend = false;\n this.showDebugOverlay = false;\n this.showGrid = false;\n this.showTickMarks = false;\n this.showPoints = false;\n\n // Axis configuration - locked for gauge-trend\n this.xAxisType = XAxisType.category;\n this.yAxisPosition = YAxisPosition.left;\n\n // Line rendering - locked for gauge-trend\n this.lineMode = LineMode.smooth;\n\n // Tooltip/unit - locked for gauge-trend (scale shows values)\n this.unit = '';\n this.timeDisplay = TimeDisplay.date;\n\n // Scaling and sizing - locked for gauge-trend\n this.fixedAspectRatioScaling = true;\n this.instrumentMode = true;\n this.borderRadius = 8;\n\n // Border radius positions for chart + scale composition\n this.borderRadiusPosition = BorderRadiusPosition.innerFirstChild;\n this.borderRadiusPositionExternalScales = BorderRadiusPosition.middleChild;\n\n // Y-axis configuration (managed internally, single axis only)\n // Note: yAxes will be properly set in willUpdate once properties are initialized\n // Using minValue/maxValue as defaults when chartMinValue/chartMaxValue are undefined\n this.yAxes = [\n {\n id: 'y',\n position: 'left',\n min: this.chartMinValue ?? this.minValue,\n max: this.chartMaxValue ?? this.maxValue,\n },\n ];\n }\n\n override async firstUpdated() {\n // IMPORTANT: create the external scale before* base firstUpdated runs.\n // The base waits for external scale dimensions to integrate chart padding.\n this._createBarVerticalElement();\n this._updateBorderRadiusPosition();\n\n await super.firstUpdated();\n\n this._isFirstUpdate = false;\n }\n\n override disconnectedCallback() {\n super.disconnectedCallback();\n // Note: We intentionally don't remove _barVerticalElement here.\n // It's a light DOM child that naturally travels with the parent when\n // the component is moved in the DOM. Removing it would cause the scale\n // to be lost on reconnect since firstUpdated() only runs once.\n }\n\n private _createBarVerticalElement() {\n // Create bar-vertical element in light DOM so it can be slotted\n if (!this._barVerticalElement) {\n const barVertical = document.createElement('obc-bar-vertical');\n barVertical.setAttribute('slot', 'right-scale');\n this._barVerticalElement = barVertical;\n this.appendChild(barVertical);\n this._updateBarVerticalProperties();\n }\n }\n\n private _updateBorderRadiusPosition() {\n // When there's no bar and no scale (labels only), round all corners\n if (!this.hasBar && !this.hasScale) {\n this.borderRadiusPosition = BorderRadiusPosition.middleRoundedChild;\n } else {\n // Otherwise, use innerFirstChild (rounds left side when scale is on right)\n this.borderRadiusPosition = BorderRadiusPosition.innerFirstChild;\n }\n }\n\n private _updateBarVerticalProperties() {\n if (!this._barVerticalElement) {\n return;\n }\n\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const barVertical = this._barVerticalElement as any;\n\n // Use getEffectiveHeight() which returns computed height in fixedAspectRatioScaling mode\n // This ensures the bar-vertical gets the correct height that matches the chart's actual size\n const effectiveHeight = this.getEffectiveHeight();\n\n barVertical.minValue = this.minValue;\n barVertical.maxValue = this.maxValue;\n barVertical.height = effectiveHeight;\n barVertical.side = 'right';\n barVertical.hasScale = this.hasScale;\n barVertical.hasBar = this.hasBar;\n // Bar thickness: 48 for scale mode, 24 for bar-only mode (internal, not user-configurable)\n barVertical.barThickness = this.hasScale ? 48 : 24;\n barVertical.scaleType = this.scaleType;\n barVertical.fillMode = this.fillMode;\n barVertical.fillMin = this.fillMin;\n // In 'fill' mode: fillMax always tracks value (bar shows current value)\n // In 'tint' mode: fillMax uses explicit value or defaults to value\n barVertical.fillMax =\n this.fillMode === FillMode.fill\n ? this.value\n : (this.fillMax ?? this.value);\n barVertical.value = this.value;\n barVertical.setpoint = this.setpoint;\n barVertical.newSetpoint = this.newSetpoint;\n barVertical.touching = this.touching;\n barVertical.atSetpoint = this.atSetpoint;\n barVertical.autoAtSetpoint = this.autoAtSetpoint;\n barVertical.autoAtSetpointDeadband = this.autoAtSetpointDeadband;\n barVertical.setpointAtZeroDeadband = this.setpointAtZeroDeadband;\n barVertical.animateSetpoint = this.animateSetpoint;\n barVertical.setpointOverride = this.setpointOverride;\n // Advice position is always 'inner' for gauge-trend\n barVertical.advicePosition = AdvicePosition.inner;\n // obc-bar-vertical uses 'advices' (plural), not 'advice' or 'hasAdvice'\n barVertical.advices = this.hasAdvice ? this.advice : [];\n barVertical.primaryTickmarkInterval = this.primaryTickmarkInterval;\n barVertical.secondaryTickmarkInterval = this.secondaryTickmarkInterval;\n barVertical.tertiaryTickmarkInterval = this.tertiaryTickmarkInterval;\n barVertical.scaleBackground = this.hasScale;\n // When hasScale=false, use gray (secondary) background for the bar container\n barVertical.barContainerStyle = this.hasScale\n ? undefined\n : BarContainerStyle.secondary;\n // Pass fixedAspectRatio to match parent's fixedAspectRatioScaling\n barVertical.fixedAspectRatio = this.fixedAspectRatioScaling;\n // Pass scaleReferenceSize from parent (inherited from ObcChartLineBase)\n barVertical.scaleReferenceSize = this.scaleReferenceSize;\n // Derive tickmark visibility from whether intervals are defined\n barVertical.hasPrimaryTickmarks =\n this.primaryTickmarkInterval !== undefined;\n barVertical.hasTertiaryTickmarks =\n this.tertiaryTickmarkInterval !== undefined;\n barVertical.priority = this.priority;\n // Scale state inherits from parent 'state' property automatically\n barVertical.state = this.state;\n\n // Enable instrument mode: only label font size responds to .obc-component-size-* CSS classes\n // Border radius and bar thickness are controlled by explicit values, not CSS variables\n barVertical.instrumentMode = true;\n // Use fixed border radius of 8px (same as medium component size) for consistent instrument appearance\n // This matches the chart's border radius for visual consistency\n barVertical.borderRadius = 8;\n\n // Automatically adjust border radius position based on hasScale\n // When hasScale=false, the bar-vertical should have outerLastChild border radius\n // When hasScale=true, it should be middleChild (has scale background as neighbor)\n barVertical.borderRadiusPosition = this.hasScale\n ? BorderRadiusPosition.middleChild\n : BorderRadiusPosition.outerLastChild;\n\n // Auto-derive: show dot indicator when no bar is shown\n barVertical.highlightCurrentValue = !this.hasBar;\n }\n\n /*\n Scale type for the vertical scale.\n * - `'regular'`: Standard tick lengths (default)\n * - `'condensed'`: Shorter tick lengths for compact display\n \n Hidden from Storybook controls via argTypes configuration.\n * @availableWhen hasScale==true\n /\n @property({type: String})\n scaleType: ScaleType = ScaleType.regular;\n\n /\n Minimum value for the scale range.\n * Also used as chart y-axis minimum when `chartMinValue` is undefined.\n /\n @property({type: Number})\n minValue = 0;\n\n /\n Maximum value for the scale range.\n * Also used as chart y-axis maximum when `chartMaxValue` is undefined.\n /\n @property({type: Number})\n maxValue = 100;\n\n /\n Minimum value for the chart y-axis.\n * When undefined, defaults to `minValue` to keep chart and scale aligned.\n /\n @property({type: Number})\n chartMinValue?: number = undefined;\n\n /\n Maximum value for the chart y-axis.\n * When undefined, defaults to `maxValue` to keep chart and scale aligned.\n /\n @property({type: Number})\n chartMaxValue?: number = undefined;\n\n /\n Current value displayed on the vertical scale.\n \n This is the primary value property that drives:\n * - The bar fill level (when `hasBar=true`)\n * - The dot indicator position (when `hasBar=false`)\n * - The `fillMax` value (when `fillMax` is not explicitly set)\n \n In typical usage, you only need to set this property to update the gauge.\n * @availableWhen hasBar==true \|\| hasScale==true\n /\n @property({type: Number})\n value?: number = undefined;\n\n /\n Show bar on the vertical scale.\n \n When `true`, displays a filled bar indicating the current value.\n * When `false`, a dot indicator is automatically shown at the value position instead.\n /\n @property({type: Boolean})\n hasBar = false;\n\n /\n Show scale tick marks and labels.\n /\n @property({type: Boolean})\n hasScale = false;\n\n /\n Show advice overlays on the vertical scale.\n /\n @property({type: Boolean})\n hasAdvice = false;\n\n /\n Fill mode for the bar.\n * - `'fill'`: Bar fills from `fillMin` to `value` — the bar visually tracks the current value.\n * The `fillMax` property is ignored in this mode.\n * - `'tint'`: Bar fills from `fillMin` to `fillMax` — an explicit highlighted range.\n * Use this when you want to show a fixed range independent of the current value.\n \n In both modes, `fillMin` is the origin point (e.g., 0 in a -100..100 scale).\n * @availableWhen hasBar==true && value!=undefined\n /\n @property({type: String})\n fillMode: FillMode = FillMode.fill;\n\n /\n Fill origin value - the starting point for the bar fill.\n * In both fill modes, the bar fills from this value toward the current value.\n * For scales like -100..100, set this to 0 to have the bar fill up or down from zero.\n * @availableWhen hasBar==true && value!=undefined\n /\n @property({type: Number})\n fillMin = 0;\n\n /\n Maximum fill value for the bar (only used in `'tint'` mode).\n \n In `'fill'` mode, this property is ignored — the bar always fills to `value`.\n \n In `'tint'` mode, this defines the upper bound of the highlighted range.\n * When `undefined`, defaults to `value`.\n * @availableWhen hasBar==true && value!=undefined && fillMode==tint\n /\n @property({type: Number})\n fillMax?: number = undefined;\n\n /\n Advice/alert overlays for the vertical scale.\n * @availableWhen hasAdvice==true\n /\n @property({type: Array, attribute: false})\n advice: LinearAdvice[] = [];\n\n /\n Primary tick interval for the vertical scale (longest ticks with labels).\n /\n @property({type: Number})\n primaryTickmarkInterval?: number = undefined;\n\n // Setpoint properties (setpoint, newSetpoint, touching, atSetpoint,\n // autoAtSetpoint, autoAtSetpointDeadband, setpointAtZeroDeadband,\n // setpointOverride, computeAtSetpoint()) are provided by SetpointMixin.\n // See setpoint-mixin.ts for full docs.\n\n /\n Secondary tick interval for the vertical scale (medium ticks).\n * @availableWhen hasScale==true\n /\n @property({type: Number})\n secondaryTickmarkInterval = 0.5;\n\n /\n Tertiary tick interval for the vertical scale (shortest ticks).\n * @availableWhen hasScale==true\n /\n @property({type: Number})\n tertiaryTickmarkInterval?: number = undefined;\n\n /\n Enable chart area fill.\n * When true, fills the area under the line with semitransparent color.\n * When false (default), renders as line-only chart.\n /\n @property({type: Boolean})\n chartFill = false;\n\n /\n Apply fill when chartFill is true.\n /\n protected override shouldApplyFill(): boolean {\n return this.chartFill;\n }\n\n /\n Return the fill mode for area rendering.\n * Maps chartFill boolean to base class fillMode.\n /\n protected override getFillMode(): string \| undefined {\n return this.chartFill ? 'semitransparent' : undefined;\n }\n\n /\n Stacking is not used in gauge-trend (always false).\n */\n protected override shouldStack(): boolean {\n return false;\n }\n\n override willUpdate(changed: Map<PropertyKey, unknown>) {\n // Auto axis detection: {x, value} data switches to time spacing, {label,\n // value} stays category. An explicit xAxisType assignment (anything we\n // did not auto-apply) permanently disables auto-detection. The\n // constructor's 'category' default lands in the first changed-map but is\n // not treated as explicit (hasUpdated is false and it equals the default).\n if (\n changed.has('xAxisType') &&\n this.xAxisType !== this._autoAppliedXAxisType &&\n (this.hasUpdated \|\| this.xAxisType !== XAxisType.category)\n ) {\n this._explicitXAxisType = true;\n }\n if (!this._explicitXAxisType && changed.has('data')) {\n const allHaveX =\n (this.data?.length ?? 0) > 0 && this.data.every((d) => d.x != null);\n const target = allHaveX ? XAxisType.time : XAxisType.category;\n if (this.xAxisType !== target) {\n this._autoAppliedXAxisType = target;\n this.xAxisType = target;\n }\n }\n\n super.willUpdate(changed);\n\n // Update y-axis range when chart or scale min/max changes\n // Note: yAxes is managed internally - users cannot set multiple axes\n // When chartMinValue/chartMaxValue are undefined, fall back to minValue/maxValue\n if (\n changed.has('chartMinValue') \|\|\n changed.has('chartMaxValue') \|\|\n changed.has('minValue') \|\|\n changed.has('maxValue')\n ) {\n const chartMin = this.chartMinValue ?? this.minValue;\n const chartMax = this.chartMaxValue ?? this.maxValue;\n this.yAxes = [\n {\n id: 'y',\n position: 'left',\n min: chartMin,\n max: chartMax,\n },\n ];\n }\n\n // Adjust chart's border radius position for external scales based on hasScale\n // This needs to be set before render, so we do it in willUpdate\n if (changed.has('hasScale')) {\n this.borderRadiusPositionExternalScales = this.hasScale\n ? BorderRadiusPosition.middleChild\n : BorderRadiusPosition.outerLastChild;\n }\n }\n\n override updated(changed: Map<PropertyKey, unknown>) {\n // Handle chartFill changes by forcing a data refresh\n // This triggers the base class to update the chart with new fill settings\n if (changed.has('chartFill') && this.data) {\n // Create a shallow copy to trigger the base class's watched property detection\n this.data = [...this.data];\n }\n\n super.updated(changed);\n // Update border radius position when bar/scale visibility changes\n if (changed.has('hasBar') \|\| changed.has('hasScale')) {\n this._updateBorderRadiusPosition();\n }\n // Keep the internal right-scale in sync with public API changes.\n // (Mirrors the storybook “chart integration” examples, but encapsulated.)\n if (!this._barVerticalElement \|\| this._isFirstUpdate) return;\n\n const shouldUpdateScale =\n changed.has('minValue') \|\|\n changed.has('maxValue') \|\|\n changed.has('value') \|\|\n changed.has('setpoint') \|\|\n changed.has('newSetpoint') \|\|\n changed.has('touching') \|\|\n changed.has('atSetpoint') \|\|\n changed.has('autoAtSetpoint') \|\|\n changed.has('autoAtSetpointDeadband') \|\|\n changed.has('setpointAtZeroDeadband') \|\|\n changed.has('setpointOverride') \|\|\n changed.has('hasBar') \|\|\n changed.has('hasScale') \|\|\n changed.has('hasAdvice') \|\|\n changed.has('fillMode') \|\|\n changed.has('fillMin') \|\|\n changed.has('fillMax') \|\|\n changed.has('advice') \|\|\n changed.has('primaryTickmarkInterval') \|\|\n changed.has('secondaryTickmarkInterval') \|\|\n changed.has('tertiaryTickmarkInterval') \|\|\n changed.has('scaleType') \|\|\n changed.has('state') \|\| // Scale state inherits from parent 'state'\n changed.has('priority') \|\|\n changed.has('height') \|\|\n changed.has('width') \|\|\n changed.has('scaleReferenceSize') \|\|\n changed.has('chartMinValue') \|\|\n changed.has('chartMaxValue');\n\n if (shouldUpdateScale) this._updateBarVerticalProperties();\n }\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-gauge-trend': ObcGaugeTrend;\n }\n}\n"],"names":[],"mappings":"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"}

package/dist/navigation-instruments/graph-mini/graph-mini.d.ts CHANGED Viewed

@@ -3,10 +3,10 @@ import { LitElement, PropertyValues } from 'lit';
  * @element obc-graph-mini
  * @description A mini graph component
  *
- * @property {Array} data - The data to display in the graph, first array is the x values, second array is the y values
  * @beta
  */
 export declare class ObcGraphMini extends LitElement {
+    /** The data to display in the graph, first array is the x values, second array is the y values */
     data: [number[], number[]];
     minY: number | undefined;
     maxY: number | undefined;

package/dist/navigation-instruments/graph-mini/graph-mini.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"graph-mini.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/graph-mini/graph-mini.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAE,cAAc,EAAkB,MAAM,KAAK,CAAC;AAMhE~~;;;;;;GAMG~~;AACH,qBACa,YAAa,SAAQ,UAAU;~~IAE1C~~,IAAI,EAAE,CAAC,MAAM,EAAE,EAAE,MAAM,EAAE,CAAC,CAAY;IAGtC,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAGzB,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAGzB,KAAK,EAAG,cAAc,CAAC;IAGvB,OAAO,CAAC,CAAC,CAAc;IAEvB,OAAO,CAAC,KAAK,CAAsB;IAEnC,OAAO,CAAC,WAAW;IAKV,YAAY;IA2CrB,aAAa;IASb,OAAO,CAAC,OAAO;IAUN,OAAO,CAAC,iBAAiB,EAAE,cAAc;IAQzC,MAAM;IAUf,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,YAAY,CAAC;KAChC;CACF"}
1	+ {"version":3,"file":"graph-mini.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/graph-mini/graph-mini.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAE,cAAc,EAAkB,MAAM,KAAK,CAAC;AAMhE;;;;;GAKG;AACH,qBACa,YAAa,SAAQ,UAAU;IAC1C,kGAAkG;IAElG,IAAI,EAAE,CAAC,MAAM,EAAE,EAAE,MAAM,EAAE,CAAC,CAAY;IAGtC,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAGzB,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAGzB,KAAK,EAAG,cAAc,CAAC;IAGvB,OAAO,CAAC,CAAC,CAAc;IAEvB,OAAO,CAAC,KAAK,CAAsB;IAEnC,OAAO,CAAC,WAAW;IAKV,YAAY;IA2CrB,aAAa;IASb,OAAO,CAAC,OAAO;IAUN,OAAO,CAAC,iBAAiB,EAAE,cAAc;IAQzC,MAAM;IAUf,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,YAAY,CAAC;KAChC;CACF"}

package/dist/navigation-instruments/graph-mini/graph-mini.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"graph-mini.js","sources":["../../../src/navigation-instruments/graph-mini/graph-mini.ts"],"sourcesContent":["import {LitElement, PropertyValues, html, unsafeCSS} from 'lit';\nimport {property, query, state} from 'lit/decorators.js';\nimport compentStyle from './graph-mini.css?inline';\nimport uPlot from 'uplot';\nimport {customElement} from '../../decorator.js';\n\n/*\n @element obc-graph-mini\n * @description A mini graph component\n \n @~~property~~ ~~{Array}~~ ~~data~~ - The data to display in the graph, first array is the x values, second array is the y values\n * @beta\n /\n~~@customElement('obc-graph-mini')\nexport class ObcGraphMini extends LitElement {\n~~ @property({type: Array})\n data: [number[], number[]] = [[], []];\n\n @property({type: Number})\n minY: number \| undefined;\n\n @property({type: Number})\n maxY: number \| undefined;\n\n @query('#chart')\n chart!: HTMLDivElement;\n\n @state()\n private y: number = 24;\n\n private uplot: uPlot \| null = null;\n\n private getCssColor(name: string) {\n const color = getComputedStyle(this).getPropertyValue(name).trim();\n return color;\n }\n\n override firstUpdated() {\n const opts = {\n width: 32,\n height: 32,\n scales: {\n x: {time: false, show: false},\n y: {\n auto: true,\n show: false,\n range: (\n _self: uPlot,\n initMin: number,\n initMax: number,\n _scaleKey: string\n ) => {\n const range = this.maxY ?? initMax - (this.minY ?? initMin);\n return [\n this.minY ?? initMin - range 0.1,\n this.maxY ?? initMax + range * 0.1,\n ] as [number, number];\n },\n },\n },\n series: [\n {},\n {\n stroke: this.getCssColor('--element-neutral-color'),\n width: 1,\n points: {show: false},\n },\n ],\n axes: [\n {show: false},\n {ticks: {show: false}, show: false, grid: {show: false}},\n ],\n legend: {show: false},\n cursor: {show: false},\n };\n\n this.uplot = new uPlot(opts, this.data, this.chart);\n requestAnimationFrame(() => this.updateY());\n }\n\n updatePalette() {\n if (!this.uplot) {\n return;\n }\n const stroke = this.getCssColor('--element-neutral-color');\n // @ts-expect-error - stroke is not a property of the Series interface\n this.uplot.setSeries(1, {stroke: stroke, width: 1, points: {show: false}});\n }\n\n private updateY() {\n if (!this.uplot) {\n return;\n }\n const lastY = this.data[1][this.data[1].length - 1];\n // @ts-expect-error - valToPct is not a property of the Scale interface\n const yRatio = this.uplot.scales.y.valToPct(lastY);\n this.y = yRatio * 32 - 3;\n }\n\n override updated(changedProperties: PropertyValues) {\n if (changedProperties.has('data')) {\n this.updatePalette();\n this.uplot?.setData(this.data);\n requestAnimationFrame(() => this.updateY());\n }\n }\n\n override render() {\n return html`\n <div class=\"chart-container\">\n <div id=\"chart\">\n <div id=\"dot\" style=\"transform: translateY(${-this.y}px);\"></div>\n </div>\n </div>\n `;\n }\n\n static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-graph-mini': ObcGraphMini;\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;~~AAcO~~,IAAM,eAAN,cAA2B,WAAW;AAAA,EAAtC,cAAA;AAAA,UAAA,GAAA,SAAA;~~AAEL~~,SAAA,OAA6B,CAAC,CAAA,GAAI,EAAE;AAYpC,SAAQ,IAAY;AAEpB,SAAQ,QAAsB;AAAA,EAAA;AAAA,EAEtB,YAAY,MAAc;AAChC,UAAM,QAAQ,iBAAiB,IAAI,EAAE,iBAAiB,IAAI,EAAE,KAAA;AAC5D,WAAO;AAAA,EACT;AAAA,EAES,eAAe;AACtB,UAAM,OAAO;AAAA,MACX,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,QAAQ;AAAA,QACN,GAAG,EAAC,MAAM,OAAO,MAAM,MAAA;AAAA,QACvB,GAAG;AAAA,UACD,MAAM;AAAA,UACN,MAAM;AAAA,UACN,OAAO,CACL,OACA,SACA,SACA,cACG;AACH,kBAAM,QAAQ,KAAK,QAAQ,WAAW,KAAK,QAAQ;AACnD,mBAAO;AAAA,cACL,KAAK,QAAQ,UAAU,QAAQ;AAAA,cAC/B,KAAK,QAAQ,UAAU,QAAQ;AAAA,YAAA;AAAA,UAEnC;AAAA,QAAA;AAAA,MACF;AAAA,MAEF,QAAQ;AAAA,QACN,CAAA;AAAA,QACA;AAAA,UACE,QAAQ,KAAK,YAAY,yBAAyB;AAAA,UAClD,OAAO;AAAA,UACP,QAAQ,EAAC,MAAM,MAAA;AAAA,QAAK;AAAA,MACtB;AAAA,MAEF,MAAM;AAAA,QACJ,EAAC,MAAM,MAAA;AAAA,QACP,EAAC,OAAO,EAAC,MAAM,MAAA,GAAQ,MAAM,OAAO,MAAM,EAAC,MAAM,MAAA,EAAK;AAAA,MAAC;AAAA,MAEzD,QAAQ,EAAC,MAAM,MAAA;AAAA,MACf,QAAQ,EAAC,MAAM,MAAA;AAAA,IAAK;AAGtB,SAAK,QAAQ,IAAI,MAAM,MAAM,KAAK,MAAM,KAAK,KAAK;AAClD,0BAAsB,MAAM,KAAK,SAAS;AAAA,EAC5C;AAAA,EAEA,gBAAgB;AACd,QAAI,CAAC,KAAK,OAAO;AACf;AAAA,IACF;AACA,UAAM,SAAS,KAAK,YAAY,yBAAyB;AAEzD,SAAK,MAAM,UAAU,GAAG,EAAC,QAAgB,OAAO,GAAG,QAAQ,EAAC,MAAM,MAAA,EAAK,CAAE;AAAA,EAC3E;AAAA,EAEQ,UAAU;AAChB,QAAI,CAAC,KAAK,OAAO;AACf;AAAA,IACF;AACA,UAAM,QAAQ,KAAK,KAAK,CAAC,EAAE,KAAK,KAAK,CAAC,EAAE,SAAS,CAAC;AAElD,UAAM,SAAS,KAAK,MAAM,OAAO,EAAE,SAAS,KAAK;AACjD,SAAK,IAAI,SAAS,KAAK;AAAA,EACzB;AAAA,EAES,QAAQ,mBAAmC;AAClD,QAAI,kBAAkB,IAAI,MAAM,GAAG;AACjC,WAAK,cAAA;AACL,WAAK,OAAO,QAAQ,KAAK,IAAI;AAC7B,4BAAsB,MAAM,KAAK,SAAS;AAAA,IAC5C;AAAA,EACF;AAAA,EAES,SAAS;AAChB,WAAO;AAAA;AAAA;AAAA,uDAG4C,CAAC,KAAK,CAAC;AAAA;AAAA;AAAA;AAAA,EAI5D;AAGF;~~AAxGa~~,~~aAuGK~~,SAAS,UAAU,YAAY;AArG/C,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,MAAA,CAAM;AAAA,~~GADZ~~,~~aAEX~~,WAAA,QAAA,CAAA;AAGA,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,~~GAJb~~,~~aAKX~~,WAAA,QAAA,CAAA;AAGA,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,~~GAPb~~,~~aAQX~~,WAAA,QAAA,CAAA;AAGA,gBAAA;AAAA,EADC,MAAM,QAAQ;AAAA,~~GAVJ~~,~~aAWX~~,WAAA,SAAA,CAAA;AAGQ,gBAAA;AAAA,EADP,MAAA;AAAM,~~GAbI~~,~~aAcH~~,WAAA,KAAA,CAAA;~~AAdG~~,eAAN,gBAAA;AAAA,EADN,cAAc,gBAAgB;AAAA,GAClB,YAAA;"}
1	+ {"version":3,"file":"graph-mini.js","sources":["../../../src/navigation-instruments/graph-mini/graph-mini.ts"],"sourcesContent":["import {LitElement, PropertyValues, html, unsafeCSS} from 'lit';\nimport {property, query, state} from 'lit/decorators.js';\nimport compentStyle from './graph-mini.css?inline';\nimport uPlot from 'uplot';\nimport {customElement} from '../../decorator.js';\n\n/*\n @element obc-graph-mini\n * @description A mini graph component\n \n @beta\n /\n@customElement('obc-graph-mini')\nexport class ObcGraphMini extends LitElement {\n /* The data to display in the graph, first array is the x values, second array is the y values /\n @property({type: Array})\n data: [number[], number[]] = [[], []];\n\n @property({type: Number})\n minY: number \| undefined;\n\n @property({type: Number})\n maxY: number \| undefined;\n\n @query('#chart')\n chart!: HTMLDivElement;\n\n @state()\n private y: number = 24;\n\n private uplot: uPlot \| null = null;\n\n private getCssColor(name: string) {\n const color = getComputedStyle(this).getPropertyValue(name).trim();\n return color;\n }\n\n override firstUpdated() {\n const opts = {\n width: 32,\n height: 32,\n scales: {\n x: {time: false, show: false},\n y: {\n auto: true,\n show: false,\n range: (\n _self: uPlot,\n initMin: number,\n initMax: number,\n _scaleKey: string\n ) => {\n const range = this.maxY ?? initMax - (this.minY ?? initMin);\n return [\n this.minY ?? initMin - range 0.1,\n this.maxY ?? initMax + range * 0.1,\n ] as [number, number];\n },\n },\n },\n series: [\n {},\n {\n stroke: this.getCssColor('--element-neutral-color'),\n width: 1,\n points: {show: false},\n },\n ],\n axes: [\n {show: false},\n {ticks: {show: false}, show: false, grid: {show: false}},\n ],\n legend: {show: false},\n cursor: {show: false},\n };\n\n this.uplot = new uPlot(opts, this.data, this.chart);\n requestAnimationFrame(() => this.updateY());\n }\n\n updatePalette() {\n if (!this.uplot) {\n return;\n }\n const stroke = this.getCssColor('--element-neutral-color');\n // @ts-expect-error - stroke is not a property of the Series interface\n this.uplot.setSeries(1, {stroke: stroke, width: 1, points: {show: false}});\n }\n\n private updateY() {\n if (!this.uplot) {\n return;\n }\n const lastY = this.data[1][this.data[1].length - 1];\n // @ts-expect-error - valToPct is not a property of the Scale interface\n const yRatio = this.uplot.scales.y.valToPct(lastY);\n this.y = yRatio * 32 - 3;\n }\n\n override updated(changedProperties: PropertyValues) {\n if (changedProperties.has('data')) {\n this.updatePalette();\n this.uplot?.setData(this.data);\n requestAnimationFrame(() => this.updateY());\n }\n }\n\n override render() {\n return html`\n <div class=\"chart-container\">\n <div id=\"chart\">\n <div id=\"dot\" style=\"transform: translateY(${-this.y}px);\"></div>\n </div>\n </div>\n `;\n }\n\n static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-graph-mini': ObcGraphMini;\n }\n}\n"],"names":[],"mappings":"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"}

package/dist/navigation-instruments/heading/heading.d.ts CHANGED Viewed

@@ -43,11 +43,29 @@ export declare class ObcHeading extends LitElement {
     showLabels: boolean;
     /** When true, labels and north arrow are placed inside the outer ring. */
     tickmarksInside: boolean;
+    /**
+     * Outer-ring diameter in CSS pixels. When set, the instrument renders at a
+     * fixed intrinsic size derived from the ring, arc shape and label reserve —
+     * so instruments sharing the same value have identical ring circumference
+     * regardless of label width or arc extent (like obc-donut-chart's
+     * fixedHeight). When unset (default), the instrument fills its container.
+     */
+    faceDiameter: number | undefined;
     private _headingSp;
     willUpdate(changed: PropertyValues): void;
     disconnectedCallback(): void;
     private _resizeController;
-    private getPadding;
+    /**
+     * Pixel cost of the outside decor: the always-rendered north-arrow glyph
+     * plus, only while shown, the NSWE labels (both keep a constant on-screen
+     * size via `1/scale` terms). Feeds the frame's width-aware reserve,
+     * replacing the former empirical `72 + delta(clientSize)` padding.
+     */
+    private getOutsideDecorPx;
+    /** Whether the host size styles were set by applyPinnedHostSize. */
+    private _hostSizePinned;
+    private _frame;
+    updated(changed: PropertyValues): void;
     private get angleAdviceRaw();
     private priorityFor;
     private getRotation;

package/dist/navigation-instruments/heading/heading.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"heading.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/heading/heading.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAE,cAAc,EAAY,MAAM,KAAK,CAAC;AAE1D,OAAO,mBAAmB,CAAC;AAG3B,OAAO,EAAc,WAAW,EAAiB,MAAM,oBAAoB,CAAC;~~AAI5E~~,OAAO,EAAC,QAAQ,EAAC,MAAM,aAAa,CAAC;AAGrC,oBAAY,gBAAgB;IAC1B,OAAO,YAAY;IACnB,SAAS,cAAc;IACvB,QAAQ,aAAa;CACtB;AAED,oBAAY,sBAAsB;IAChC,GAAG,QAAQ;IACX,GAAG,QAAQ;CACZ;AAED;;GAEG;AACH,qBACa,UAAW,SAAQ,UAAU;IACd,OAAO,SAAK;IACZ,gBAAgB,SAAK;IAErB,eAAe,EAAE,MAAM,GAAG,IAAI,CAAQ;IAChE,2CAA2C;IACjB,kBAAkB,EAAE,MAAM,GAAG,SAAS,CAAC;IACjE,2EAA2E;IAChD,iBAAiB,EAAE,OAAO,CAAS;IAC9D,2CAA2C;IACjB,6BAA6B,EAAE,MAAM,CAAO;IACtE,2CAA2C;IAChB,uBAAuB,EAAE,OAAO,CAAS;IACpE,2CAA2C;IACE,qBAAqB,EAAE,OAAO,CACpE;IACP,0EAA0E;IAChD,6BAA6B,EAAE,MAAM,CAAK;IACpE,2CAA2C;IAChB,eAAe,EAAE,OAAO,CAAS;IAC5D,2CAA2C;IAChB,QAAQ,EAAE,OAAO,CAAS;IACV,cAAc,EAAE,WAAW,EAAE,CAAM;IACpD,SAAS,EAAE,gBAAgB,CAC1B;IACD,QAAQ,EAAE,QAAQ,CAAoB;IAChE,wCAAwC;IAExC,gBAAgB,EAAE,sBAAsB,EAAE,CAAgC;IAC1E,gCAAgC;IACL,UAAU,EAAE,OAAO,CAAS;IACvD,0EAA0E;IAC/C,eAAe,EAAE,OAAO,CAAS;~~IAE5D~~,OAAO,CAAC,UAAU,CAGf;IAEM,UAAU,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI;IAezC,oBAAoB,IAAI,IAAI;IAOrC,OAAO,CAAC,iBAAiB,CAAkC;IAE3D,OAAO,CAAC,~~UAAU~~;~~IAclB~~,OAAO,KAAK,cAAc,GAUzB;IAED,OAAO,CAAC,WAAW;IAOnB,OAAO,CAAC,WAAW;IAWV,MAAM;~~IAkDf~~,OAAgB,MAAM,0BAwBpB;CACH;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}
1	+ {"version":3,"file":"heading.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/heading/heading.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAE,cAAc,EAAY,MAAM,KAAK,CAAC;AAE1D,OAAO,mBAAmB,CAAC;AAG3B,OAAO,EAAc,WAAW,EAAiB,MAAM,oBAAoB,CAAC;AAY5E,OAAO,EAAC,QAAQ,EAAC,MAAM,aAAa,CAAC;AAGrC,oBAAY,gBAAgB;IAC1B,OAAO,YAAY;IACnB,SAAS,cAAc;IACvB,QAAQ,aAAa;CACtB;AAED,oBAAY,sBAAsB;IAChC,GAAG,QAAQ;IACX,GAAG,QAAQ;CACZ;AAED;;GAEG;AACH,qBACa,UAAW,SAAQ,UAAU;IACd,OAAO,SAAK;IACZ,gBAAgB,SAAK;IAErB,eAAe,EAAE,MAAM,GAAG,IAAI,CAAQ;IAChE,2CAA2C;IACjB,kBAAkB,EAAE,MAAM,GAAG,SAAS,CAAC;IACjE,2EAA2E;IAChD,iBAAiB,EAAE,OAAO,CAAS;IAC9D,2CAA2C;IACjB,6BAA6B,EAAE,MAAM,CAAO;IACtE,2CAA2C;IAChB,uBAAuB,EAAE,OAAO,CAAS;IACpE,2CAA2C;IACE,qBAAqB,EAAE,OAAO,CACpE;IACP,0EAA0E;IAChD,6BAA6B,EAAE,MAAM,CAAK;IACpE,2CAA2C;IAChB,eAAe,EAAE,OAAO,CAAS;IAC5D,2CAA2C;IAChB,QAAQ,EAAE,OAAO,CAAS;IACV,cAAc,EAAE,WAAW,EAAE,CAAM;IACpD,SAAS,EAAE,gBAAgB,CAC1B;IACD,QAAQ,EAAE,QAAQ,CAAoB;IAChE,wCAAwC;IAExC,gBAAgB,EAAE,sBAAsB,EAAE,CAAgC;IAC1E,gCAAgC;IACL,UAAU,EAAE,OAAO,CAAS;IACvD,0EAA0E;IAC/C,eAAe,EAAE,OAAO,CAAS;IAC5D;;;;;;OAMG;IAEH,YAAY,EAAE,MAAM,GAAG,SAAS,CAAC;IAEjC,OAAO,CAAC,UAAU,CAGf;IAEM,UAAU,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI;IAezC,oBAAoB,IAAI,IAAI;IAOrC,OAAO,CAAC,iBAAiB,CAAkC;IAE3D;;;;;OAKG;IACH,OAAO,CAAC,iBAAiB;IAOzB,oEAAoE;IACpE,OAAO,CAAC,eAAe,CAAS;IAChC,OAAO,CAAC,MAAM,CAA0B;IAE/B,OAAO,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI;IAS/C,OAAO,KAAK,cAAc,GAUzB;IAED,OAAO,CAAC,WAAW;IAOnB,OAAO,CAAC,WAAW;IAWV,MAAM;IAuDf,OAAgB,MAAM,0BAwBpB;CACH;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,UAAU,CAAC;KAC3B;CACF"}

package/dist/navigation-instruments/heading/heading.js CHANGED Viewed

@@ -5,6 +5,7 @@ import { TickmarkType } from "../watch/tickmark.js";
 import { arrow, ArrowStyle } from "./arrow.js";
 import { AdviceState } from "../watch/advice.js";
 import { ResizeController } from "@lit-labs/observers/resize-controller.js";
+import { NORTH_ARROW_WIDTH_PX, NSWE_LABEL_WIDTH_PX, applyPinnedHostSize, computeRadialFrame, measureContainerPx } from "../../svghelpers/radial-frame.js";
 import { SetpointBundle } from "../../svghelpers/setpoint-bundle.js";
 import { Priority } from "../types.js";
 import { customElement } from "../../decorator.js";
@@ -56,6 +57,7 @@ let ObcHeading = class extends LitElement {
       onAnimationEnd: () => this.requestUpdate()
     });
     this._resizeController = new ResizeController(this, {});
+    this._hostSizePinned = false;
   }
   willUpdate(changed) {
     super.willUpdate(changed);
@@ -75,17 +77,25 @@ let ObcHeading = class extends LitElement {
     super.disconnectedCallback();
     this._headingSp.dispose();
   }
-  getPadding() {
-    const size = Math.min(this.clientHeight, this.clientWidth);
-    const deltaWidth = 512 - size;
-    const steps = deltaWidth / 128;
-    let deltaPadding;
-    if (deltaWidth > 0) {
-      deltaPadding = steps * 48;
-    } else {
-      deltaPadding = steps * 6;
+  /**
+   * Pixel cost of the outside decor: the always-rendered north-arrow glyph
+   * plus, only while shown, the NSWE labels (both keep a constant on-screen
+   * size via `1/scale` terms). Feeds the frame's width-aware reserve,
+   * replacing the former empirical `72 + delta(clientSize)` padding.
+   */
+  getOutsideDecorPx() {
+    if (this.tickmarksInside) {
+      return 0;
     }
-    return 72 + deltaPadding;
+    return NORTH_ARROW_WIDTH_PX + (this.showLabels ? NSWE_LABEL_WIDTH_PX : 0);
+  }
+  updated(changed) {
+    super.updated(changed);
+    this._hostSizePinned = applyPinnedHostSize(
+      this,
+      this._frame,
+      this._hostSizePinned
+    );
   }
   get angleAdviceRaw() {
     return this.headingAdvices.map(({ minAngle, maxAngle, hinted, type }) => {
@@ -114,21 +124,26 @@ let ObcHeading = class extends LitElement {
       { angle: 180, type: TickmarkType.main },
       { angle: 270, type: TickmarkType.main }
     ];
-    const padding = this.getPadding();
-    const width = (176 + padding) * 2;
-    const viewBox = `-${width / 2} -${width / 2} ${width} ${width}`;
+    const frame = computeRadialFrame({
+      basePadding: 72,
+      labelWidthPx: this.getOutsideDecorPx(),
+      containerPx: measureContainerPx(this),
+      faceDiameter: this.faceDiameter
+    });
+    this._frame = frame;
+    const viewBox = frame.viewBox;
     return html`
       <div class="container">
         <obc-watch
           .touching=${this.touching}
-          .padding=${padding}
+          .arcFrame=${frame}
           .advices=${this.angleAdviceRaw}
           .tickmarks=${tickmarks}
           .watchCircleType=${WatchCircleType.single}
-          .showLabels=${this.showLabels}
+          .showLabels=${this.showLabels && !frame.labelsHidden}
           .tickmarksInside=${this.tickmarksInside}
           .crosshairEnabled=${true}
-          .northArrow=${true}
+          .northArrow=${!frame.labelsHidden}
           .angleSetpoint=${this.headingSetpoint ?? void 0}
           .newAngleSetpoint=${this.newHeadingSetpoint}
           .atAngleSetpoint=${this._headingSp.computeAtSetpoint(this.heading)}
@@ -237,6 +252,9 @@ __decorateClass([
 __decorateClass([
   property({ type: Boolean })
 ], ObcHeading.prototype, "tickmarksInside", 2);
+__decorateClass([
+  property({ type: Number, attribute: "face-diameter" })
+], ObcHeading.prototype, "faceDiameter", 2);
 ObcHeading = __decorateClass([
   customElement("obc-heading")
 ], ObcHeading);

package/dist/navigation-instruments/heading/heading.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"heading.js","sources":["../../../src/navigation-instruments/heading/heading.ts"],"sourcesContent":["import {LitElement, PropertyValues, css, html} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport '../watch/watch.js';\nimport {Tickmark, TickmarkType} from '../watch/tickmark.js';\nimport {arrow, ArrowStyle} from './arrow.js';\nimport {AdviceState, AngleAdvice, AngleAdviceRaw} from '../watch/advice.js';\nimport {ResizeController} from '@lit-labs/observers/resize-controller.js';\nimport {WatchCircleType} from '../watch/watch.js';\nimport {SetpointBundle} from '../../svghelpers/setpoint-bundle.js';\nimport {Priority} from '../types.js';\nimport {customElement} from '../../decorator.js';\n\nexport enum CompassDirection {\n NorthUp = 'northUp',\n HeadingUp = 'headingUp',\n CourseUp = 'courseUp',\n}\n\nexport enum HeadingPriorityElement {\n hdg = 'hdg',\n cog = 'cog',\n}\n\n/*\n @stable\n /\n@customElement('obc-heading')\nexport class ObcHeading extends LitElement {\n @property({type: Number}) heading = 0;\n @property({type: Number}) courseOverGround = 0;\n\n @property({type: Number}) headingSetpoint: number \| null = null;\n /* @availableWhen headingSetpoint!=null /\n @property({type: Number}) newHeadingSetpoint: number \| undefined;\n /* @availableWhen headingSetpoint!=null && autoAtHeadingSetpoint==false /\n @property({type: Boolean}) atHeadingSetpoint: boolean = false;\n /* @availableWhen headingSetpoint!=null /\n @property({type: Number}) headingSetpointAtZeroDeadband: number = 0.5;\n /* @availableWhen headingSetpoint!=null /\n @property({type: Boolean}) headingSetpointOverride: boolean = false;\n /* @availableWhen headingSetpoint!=null /\n @property({type: Boolean, attribute: false}) autoAtHeadingSetpoint: boolean =\n true;\n /* @availableWhen headingSetpoint!=null && autoAtHeadingSetpoint==true /\n @property({type: Number}) autoAtHeadingSetpointDeadband: number = 2;\n /* @availableWhen headingSetpoint!=null /\n @property({type: Boolean}) animateSetpoint: boolean = false;\n /* @availableWhen headingSetpoint!=null /\n @property({type: Boolean}) touching: boolean = false;\n @property({type: Array, attribute: false}) headingAdvices: AngleAdvice[] = [];\n @property({type: String}) direction: CompassDirection =\n CompassDirection.NorthUp;\n @property({type: String}) priority: Priority = Priority.regular;\n /* @availableWhen priority==enhanced /\n @property({type: Array, attribute: false})\n priorityElements: HeadingPriorityElement[] = [HeadingPriorityElement.hdg];\n /* Show compass NSEW labels. /\n @property({type: Boolean}) showLabels: boolean = false;\n /* When true, labels and north arrow are placed inside the outer ring. /\n @property({type: Boolean}) tickmarksInside: boolean = false;\n\n private _headingSp = new SetpointBundle({\n angularWraparound: true,\n onAnimationEnd: () => this.requestUpdate(),\n });\n\n override willUpdate(changed: PropertyValues): void {\n super.willUpdate(changed);\n this._headingSp.sync({\n setpoint: this.headingSetpoint ?? undefined,\n newSetpoint: this.newHeadingSetpoint,\n atSetpoint: this.atHeadingSetpoint,\n touching: this.touching,\n autoAtSetpoint: this.autoAtHeadingSetpoint,\n autoAtSetpointDeadband: this.autoAtHeadingSetpointDeadband,\n setpointAtZeroDeadband: this.headingSetpointAtZeroDeadband,\n setpointOverride: this.headingSetpointOverride,\n animateSetpoint: this.animateSetpoint,\n });\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this._headingSp.dispose();\n }\n\n // @ts-expect-error TS6133: The controller ensures that the render\n // function is called on resize of the element\n private _resizeController = new ResizeController(this, {});\n\n private getPadding() {\n const size = Math.min(this.clientHeight, this.clientWidth);\n const deltaWidth = 512 - size;\n const steps = deltaWidth / 128;\n let deltaPadding;\n if (deltaWidth > 0) {\n deltaPadding = steps 48;\n } else {\n deltaPadding = steps * 6;\n }\n\n return 72 + deltaPadding;\n }\n\n private get angleAdviceRaw(): AngleAdviceRaw[] {\n return this.headingAdvices.map(({minAngle, maxAngle, hinted, type}) => {\n const state =\n this.heading >= minAngle && this.heading <= maxAngle\n ? AdviceState.triggered\n : hinted\n ? AdviceState.hinted\n : AdviceState.regular;\n return {minAngle, maxAngle, type, state};\n });\n }\n\n private priorityFor(element: HeadingPriorityElement): Priority {\n const selected = Array.isArray(this.priorityElements)\n ? this.priorityElements\n : [];\n return selected.includes(element) ? this.priority : Priority.regular;\n }\n\n private getRotation(): number \| undefined {\n if (this.direction === CompassDirection.NorthUp) {\n return undefined;\n } else if (this.direction === CompassDirection.HeadingUp) {\n return -this.heading;\n } else if (this.direction === CompassDirection.CourseUp) {\n return -this.courseOverGround;\n }\n return undefined;\n }\n\n override render() {\n const tickmarks: Tickmark[] = [\n {angle: 0, type: TickmarkType.main},\n {angle: 90, type: TickmarkType.main},\n {angle: 180, type: TickmarkType.main},\n {angle: 270, type: TickmarkType.main},\n ];\n\n const padding = this.getPadding();\n const width = (176 + padding) * 2;\n const viewBox = `-${width / 2} -${width / 2} ${width} ${width}`;\n\n return html`\n <div class=\"container\">\n <obc-watch\n .touching=${this.touching}\n .padding=${padding}\n .advices=${this.angleAdviceRaw}\n .tickmarks=${tickmarks}\n .watchCircleType=${WatchCircleType.single}\n .showLabels=${this.showLabels}\n .tickmarksInside=${this.tickmarksInside}\n .crosshairEnabled=${true}\n .northArrow=${true}\n .angleSetpoint=${this.headingSetpoint ?? undefined}\n .newAngleSetpoint=${this.newHeadingSetpoint}\n .atAngleSetpoint=${this._headingSp.computeAtSetpoint(this.heading)}\n .angleSetpointAtZeroDeadband=${this.headingSetpointAtZeroDeadband}\n .setpointOverride=${this.headingSetpointOverride}\n .priority=${this.priority}\n .animateSetpoint=${this.animateSetpoint}\n .rotation=${this.getRotation()}\n >\n </obc-watch>\n <svg viewBox=\"${viewBox}\">\n ${arrow(\n ArrowStyle.HDG,\n this.heading + (this.getRotation() ?? 0),\n this.priorityFor(HeadingPriorityElement.hdg)\n )}\n ${arrow(\n ArrowStyle.COG,\n this.courseOverGround + (this.getRotation() ?? 0),\n this.priorityFor(HeadingPriorityElement.cog)\n )}\n </svg>\n </div>\n `;\n }\n\n static override styles = css`\n * {\n box-sizing: border-box;\n }\n\n .container {\n position: relative;\n width: 100%;\n height: 100%;\n }\n\n .container > * {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n :host {\n display: block;\n width: 100%;\n height: 100%;\n }\n `;\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-heading': ObcHeading;\n }\n}\n"],"names":["CompassDirection","HeadingPriorityElement"],"mappings":"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"}
1	+ {"version":3,"file":"heading.js","sources":["../../../src/navigation-instruments/heading/heading.ts"],"sourcesContent":["import {LitElement, PropertyValues, css, html} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport '../watch/watch.js';\nimport {Tickmark, TickmarkType} from '../watch/tickmark.js';\nimport {arrow, ArrowStyle} from './arrow.js';\nimport {AdviceState, AngleAdvice, AngleAdviceRaw} from '../watch/advice.js';\nimport {ResizeController} from '@lit-labs/observers/resize-controller.js';\nimport {\n applyPinnedHostSize,\n computeRadialFrame,\n measureContainerPx,\n NORTH_ARROW_WIDTH_PX,\n NSWE_LABEL_WIDTH_PX,\n type RadialFrame,\n} from '../../svghelpers/radial-frame.js';\nimport {WatchCircleType} from '../watch/watch.js';\nimport {SetpointBundle} from '../../svghelpers/setpoint-bundle.js';\nimport {Priority} from '../types.js';\nimport {customElement} from '../../decorator.js';\n\nexport enum CompassDirection {\n NorthUp = 'northUp',\n HeadingUp = 'headingUp',\n CourseUp = 'courseUp',\n}\n\nexport enum HeadingPriorityElement {\n hdg = 'hdg',\n cog = 'cog',\n}\n\n/*\n @stable\n /\n@customElement('obc-heading')\nexport class ObcHeading extends LitElement {\n @property({type: Number}) heading = 0;\n @property({type: Number}) courseOverGround = 0;\n\n @property({type: Number}) headingSetpoint: number \| null = null;\n /* @availableWhen headingSetpoint!=null /\n @property({type: Number}) newHeadingSetpoint: number \| undefined;\n /* @availableWhen headingSetpoint!=null && autoAtHeadingSetpoint==false /\n @property({type: Boolean}) atHeadingSetpoint: boolean = false;\n /* @availableWhen headingSetpoint!=null /\n @property({type: Number}) headingSetpointAtZeroDeadband: number = 0.5;\n /* @availableWhen headingSetpoint!=null /\n @property({type: Boolean}) headingSetpointOverride: boolean = false;\n /* @availableWhen headingSetpoint!=null /\n @property({type: Boolean, attribute: false}) autoAtHeadingSetpoint: boolean =\n true;\n /* @availableWhen headingSetpoint!=null && autoAtHeadingSetpoint==true /\n @property({type: Number}) autoAtHeadingSetpointDeadband: number = 2;\n /* @availableWhen headingSetpoint!=null /\n @property({type: Boolean}) animateSetpoint: boolean = false;\n /* @availableWhen headingSetpoint!=null /\n @property({type: Boolean}) touching: boolean = false;\n @property({type: Array, attribute: false}) headingAdvices: AngleAdvice[] = [];\n @property({type: String}) direction: CompassDirection =\n CompassDirection.NorthUp;\n @property({type: String}) priority: Priority = Priority.regular;\n /* @availableWhen priority==enhanced /\n @property({type: Array, attribute: false})\n priorityElements: HeadingPriorityElement[] = [HeadingPriorityElement.hdg];\n /* Show compass NSEW labels. /\n @property({type: Boolean}) showLabels: boolean = false;\n /* When true, labels and north arrow are placed inside the outer ring. /\n @property({type: Boolean}) tickmarksInside: boolean = false;\n /\n Outer-ring diameter in CSS pixels. When set, the instrument renders at a\n * fixed intrinsic size derived from the ring, arc shape and label reserve —\n * so instruments sharing the same value have identical ring circumference\n * regardless of label width or arc extent (like obc-donut-chart's\n * fixedHeight). When unset (default), the instrument fills its container.\n /\n @property({type: Number, attribute: 'face-diameter'})\n faceDiameter: number \| undefined;\n\n private _headingSp = new SetpointBundle({\n angularWraparound: true,\n onAnimationEnd: () => this.requestUpdate(),\n });\n\n override willUpdate(changed: PropertyValues): void {\n super.willUpdate(changed);\n this._headingSp.sync({\n setpoint: this.headingSetpoint ?? undefined,\n newSetpoint: this.newHeadingSetpoint,\n atSetpoint: this.atHeadingSetpoint,\n touching: this.touching,\n autoAtSetpoint: this.autoAtHeadingSetpoint,\n autoAtSetpointDeadband: this.autoAtHeadingSetpointDeadband,\n setpointAtZeroDeadband: this.headingSetpointAtZeroDeadband,\n setpointOverride: this.headingSetpointOverride,\n animateSetpoint: this.animateSetpoint,\n });\n }\n\n override disconnectedCallback(): void {\n super.disconnectedCallback();\n this._headingSp.dispose();\n }\n\n // @ts-expect-error TS6133: The controller ensures that the render\n // function is called on resize of the element\n private _resizeController = new ResizeController(this, {});\n\n /\n Pixel cost of the outside decor: the always-rendered north-arrow glyph\n * plus, only while shown, the NSWE labels (both keep a constant on-screen\n * size via `1/scale` terms). Feeds the frame's width-aware reserve,\n * replacing the former empirical `72 + delta(clientSize)` padding.\n /\n private getOutsideDecorPx(): number {\n if (this.tickmarksInside) {\n return 0;\n }\n return NORTH_ARROW_WIDTH_PX + (this.showLabels ? NSWE_LABEL_WIDTH_PX : 0);\n }\n\n /* Whether the host size styles were set by applyPinnedHostSize. /\n private _hostSizePinned = false;\n private _frame: RadialFrame \| undefined;\n\n override updated(changed: PropertyValues): void {\n super.updated(changed);\n this._hostSizePinned = applyPinnedHostSize(\n this,\n this._frame,\n this._hostSizePinned\n );\n }\n\n private get angleAdviceRaw(): AngleAdviceRaw[] {\n return this.headingAdvices.map(({minAngle, maxAngle, hinted, type}) => {\n const state =\n this.heading >= minAngle && this.heading <= maxAngle\n ? AdviceState.triggered\n : hinted\n ? AdviceState.hinted\n : AdviceState.regular;\n return {minAngle, maxAngle, type, state};\n });\n }\n\n private priorityFor(element: HeadingPriorityElement): Priority {\n const selected = Array.isArray(this.priorityElements)\n ? this.priorityElements\n : [];\n return selected.includes(element) ? this.priority : Priority.regular;\n }\n\n private getRotation(): number \| undefined {\n if (this.direction === CompassDirection.NorthUp) {\n return undefined;\n } else if (this.direction === CompassDirection.HeadingUp) {\n return -this.heading;\n } else if (this.direction === CompassDirection.CourseUp) {\n return -this.courseOverGround;\n }\n return undefined;\n }\n\n override render() {\n const tickmarks: Tickmark[] = [\n {angle: 0, type: TickmarkType.main},\n {angle: 90, type: TickmarkType.main},\n {angle: 180, type: TickmarkType.main},\n {angle: 270, type: TickmarkType.main},\n ];\n\n const frame = computeRadialFrame({\n basePadding: 72,\n labelWidthPx: this.getOutsideDecorPx(),\n containerPx: measureContainerPx(this),\n faceDiameter: this.faceDiameter,\n });\n this._frame = frame;\n const viewBox = frame.viewBox;\n\n return html`\n <div class=\"container\">\n <obc-watch\n .touching=${this.touching}\n .arcFrame=${frame}\n .advices=${this.angleAdviceRaw}\n .tickmarks=${tickmarks}\n .watchCircleType=${WatchCircleType.single}\n .showLabels=${this.showLabels && !frame.labelsHidden}\n .tickmarksInside=${this.tickmarksInside}\n .crosshairEnabled=${true}\n .northArrow=${!frame.labelsHidden}\n .angleSetpoint=${this.headingSetpoint ?? undefined}\n .newAngleSetpoint=${this.newHeadingSetpoint}\n .atAngleSetpoint=${this._headingSp.computeAtSetpoint(this.heading)}\n .angleSetpointAtZeroDeadband=${this.headingSetpointAtZeroDeadband}\n .setpointOverride=${this.headingSetpointOverride}\n .priority=${this.priority}\n .animateSetpoint=${this.animateSetpoint}\n .rotation=${this.getRotation()}\n >\n </obc-watch>\n <svg viewBox=\"${viewBox}\">\n ${arrow(\n ArrowStyle.HDG,\n this.heading + (this.getRotation() ?? 0),\n this.priorityFor(HeadingPriorityElement.hdg)\n )}\n ${arrow(\n ArrowStyle.COG,\n this.courseOverGround + (this.getRotation() ?? 0),\n this.priorityFor(HeadingPriorityElement.cog)\n )}\n </svg>\n </div>\n `;\n }\n\n static override styles = css`\n {\n box-sizing: border-box;\n }\n\n .container {\n position: relative;\n width: 100%;\n height: 100%;\n }\n\n .container > * {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n :host {\n display: block;\n width: 100%;\n height: 100%;\n }\n `;\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-heading': ObcHeading;\n }\n}\n"],"names":["CompassDirection","HeadingPriorityElement"],"mappings":"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"}

package/dist/navigation-instruments/indicator-graph/indicator-graph.d.ts CHANGED Viewed

@@ -21,10 +21,10 @@ export interface ObcIndicatorGraphLayout {
  * @element obc-indicator-graph
  * @description A mini graph component
  *
- * @property {Array} data - The data to display in the graph, first array is the x values, second array is the y values
  * @beta
  */
 export declare class ObcIndicatorGraph extends LitElement {
+    /** The data to display in the graph, first array is the x values, second array is the y values */
     data: [number[], number[]];
     layout: ObcIndicatorGraphLayout;
     private chart;