@oicl/openbridge-webcomponents 2.0.0-next.45 → 2.0.0-next.46

package/dist/navigation-instruments/compass/compass.js.map

@@ -1 +1 @@
-{"version":3,"file":"compass.js","sources":["../../../src/navigation-instruments/compass/compass.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  VesselImage,\n  VesselImageSize,\n  WatchCircleType,\n  RotType,\n  RotPosition,\n} from '../watch/watch.js';\nimport {SetpointBundle} from '../../svghelpers/setpoint-bundle.js';\nimport {ROT_ZERO_DEADBAND_DEG} from '../rate-of-turn/rot-renderer.js';\nimport {customElement} from '../../decorator.js';\nimport {InstrumentState, Priority} from '../types.js';\nexport {RotType};\n\nexport enum CompassDirection {\n  NorthUp = 'northUp',\n  HeadingUp = 'headingUp',\n  CourseUp = 'courseUp',\n}\n\nexport enum CompassPriorityElement {\n  hdg = 'hdg',\n  cog = 'cog',\n  rot = 'rot',\n  wind = 'wind',\n  current = 'current',\n}\n\n/**\n * `<obc-compass>` – Full-featured compass with HDG/COG arrows, rate-of-turn indicator, and environmental overlays.\n *\n * Renders a circular compass instrument that displays heading (HDG) and\n * course-over-ground (COG) as rotating arrows over a triple-ring watch face.\n * It supports wind and current indicators, a vessel silhouette, heading\n * setpoint with auto at-setpoint detection, advice zones, and a rate-of-turn\n * (ROT) dot indicator. The compass can be oriented north-up, heading-up, or\n * course-up.\n *\n * ## Features\n *\n * - **Direction modes**: `northUp` (default), `headingUp`, or `courseUp`\n *   via the `direction` property.\n * - **HDG / COG arrows**: Two styled arrows overlay the watch face,\n *   rotating independently.\n * - **Heading setpoint**: Optional setpoint marker with auto at-setpoint\n *   detection via `headingSetpoint`, `atHeadingSetpoint`, and deadband\n *   tuning properties.\n * - **Advice zones**: Pass `headingAdvices` to render caution/alert arcs;\n *   triggered state is derived from whether the current heading falls\n *   inside the advice range.\n * - **Rate of turn**: Animated ROT indicator driven by\n *   `rateOfTurnDegreesPerMinute` (deg/min, the maritime / AIS convention).\n *   Supports spinning dots (`rotType=\"dots\"`) — the dot animation is\n *   amplified by `rotDotAnimationFactor` so small physical values still\n *   read at a glance — and a banana-shaped arc bar (`rotType=\"bar\"`)\n *   showing the HDG→COG span. Bar extent is driven by the physical value\n *   only (gain is not applied). Position on the outer scale ring or inner\n *   circle via `rotPosition`.\n * - **Environmental overlays**: Wind speed/direction and current\n *   speed/direction indicators on the watch face.\n * - **Vessel image**: Configurable vessel silhouette centered on the\n *   compass, rotating with heading.\n * - **Color priority**: Set `priority` to `Priority.enhanced` to use the\n *   blue/enhanced color palette instead of the default gray/regular palette\n *   (default: `Priority.regular`).\n *\n * ## Usage Guidelines\n *\n * - Set `heading` and `courseOverGround` to the current sensor values\n *   in degrees.\n * - Use `direction` to control the compass orientation mode.\n * - Use `headingSetpoint` to show a target heading marker.\n * - Pass `headingAdvices` as an array of `AngleAdvice` objects for\n *   caution/alert zones.\n * - Set `windSpeed` / `windFromDirection` and `currentSpeed` /\n *   `currentFromDirection` to display environmental indicators.\n *\n * ## Example\n *\n * ```html\n * <obc-compass\n *   heading=\"45\"\n *   courseOverGround=\"50\"\n *   direction=\"northUp\"\n *   headingSetpoint=\"90\"\n *   priority=\"regular\"\n *   vesselImage=\"genericTop\"\n * ></obc-compass>\n * ```\n *\n * @property {number} heading - The current heading of the vessel in degrees.\n * @property {number} courseOverGround - The current course over ground in degrees.\n * @property {number | null} headingSetpoint - The set point for the heading in degrees.\n * @property {boolean} atHeadingSetpoint - Indicates if the vessel is at the heading set point.\n * @property {boolean} autoAtHeadingSetpoint - Enables automatic at heading set point calculation.\n * @property {number} autoAtHeadingSetpointDeadband - The deadband for the heading set point in degrees.\n * @property {boolean} touching - Indicates if the compass is being touched.\n * @property {Array<AngleAdvice>} headingAdvices - An array of angle advices for the compass.\n * @property {number | null} windSpeed - The wind speed in beaufort scale number.\n * @property {number | null} windFromDirection - The direction the wind is coming from in degrees.\n * @property {number | null} currentSpeed - The current speed, number of arrows.\n * @property {number | null} currentFromDirection - The direction the current is coming from in degrees.\n * @property {VesselImage} vesselImage - The image of the vessel.\n * @property {number|undefined} rateOfTurnDegreesPerMinute - Measured rate of turn in degrees per minute (the AIS / ITU-R M.1371 convention). Sign controls direction (positive = starboard / clockwise). Drives both the bar extent and the dot animation.\n * @property {number} rotDotAnimationFactor - Visual amplification for the dot animation only. Default `18` (≈1 rpm at 20°/min).\n * @property {number} rotationsPerMinute - **Deprecated.** Use `rateOfTurnDegreesPerMinute` instead. Kept as a backward-compatible fallback when `rateOfTurnDegreesPerMinute` is `undefined`.\n * @property {RotType} rotType - ROT display mode: `'dots'` (spinning dots, default) or `'bar'` (arc bar from HDG to COG).\n * @property {RotPosition} rotPosition - ROT track position: `'innerCircle'` (default) or `'scale'` (on the outer ring).\n * @property {Priority} priority - Color priority: `Priority.enhanced` uses the blue/enhanced color palette, `Priority.regular` (default) uses the standard palette.\n *\n * @ignition-base-height: 512px\n * @ignition-base-width: 512px\n */\n@customElement('obc-compass')\nexport class ObcCompass extends LitElement {\n  @property({type: Number}) heading = 0;\n  @property({type: Number}) courseOverGround = 0;\n\n  @property({type: Number}) headingSetpoint: number | null = null;\n  @property({type: Number}) newHeadingSetpoint: number | undefined;\n  @property({type: Boolean}) atHeadingSetpoint: boolean = false;\n  @property({type: Number}) headingSetpointAtZeroDeadband: number = 0.5;\n  @property({type: Boolean}) headingSetpointOverride: boolean = false;\n  @property({type: Boolean, attribute: false}) autoAtHeadingSetpoint: boolean =\n    true;\n  @property({type: Number}) autoAtHeadingSetpointDeadband: number = 2;\n  @property({type: Boolean}) animateSetpoint: boolean = false;\n  @property({type: Boolean}) touching: boolean = false;\n  @property({type: Array, attribute: false}) headingAdvices: AngleAdvice[] = [];\n  @property({type: Number}) windSpeed: number | null = null;\n  @property({type: Number}) windFromDirection: number | null = null;\n  @property({type: Number}) currentSpeed: number | null = null;\n  @property({type: Number}) currentFromDirection: number | null = null;\n  @property({type: String}) vesselImage: VesselImage = VesselImage.genericTop;\n  /**\n   * Measured rate of turn in degrees per minute (positive = starboard).\n   * Drives both the bar extent and (after multiplication by\n   * `rotDotAnimationFactor`) the spinning dot animation.\n   * When `undefined`, falls back to the deprecated `rotationsPerMinute`.\n   */\n  @property({type: Number}) rateOfTurnDegreesPerMinute: number | undefined;\n  /**\n   * Visual amplification applied only to the spinning dot animation\n   * (not to the bar extent). Default `18` keeps the legacy visual feel\n   * (≈1 rpm at 20°/min).\n   */\n  @property({type: Number}) rotDotAnimationFactor: number = 18;\n  /**\n   * @deprecated Use `rateOfTurnDegreesPerMinute` (and optionally\n   * `rotDotAnimationFactor`) instead. Takes effect only when\n   * `rateOfTurnDegreesPerMinute` is `undefined`.\n   */\n  @property({type: Number}) rotationsPerMinute: number = 1;\n  @property({type: String}) rotType: RotType = RotType.dots;\n  @property({type: String}) rotPosition: RotPosition = RotPosition.innerCircle;\n  /**\n   * Bar-extent reference value in **degrees per minute**. The bar fills the\n   * full ±`rotArcExtent` arc when the measured ROT equals ±`rotMaxValue`.\n   * Default `60` aligns with ES-TRIN 2025/1 Art. 3.02.\n   *\n   * Note: prior to the introduction of `rateOfTurnDegreesPerMinute` this\n   * property was interpreted in rotations per minute. The unit changed when\n   * the physical ROT API was introduced.\n   */\n  @property({type: Number}) rotMaxValue: number = 60;\n  @property({type: Number}) rotArcExtent: number = 60;\n  @property({type: Boolean}) rotPortStarboard: boolean = false;\n  @property({type: Number}) rotAtZeroDeadband: number = ROT_ZERO_DEADBAND_DEG;\n  @property({type: String}) direction: CompassDirection =\n    CompassDirection.NorthUp;\n  @property({type: String}) state: InstrumentState = InstrumentState.active;\n  @property({type: String}) priority: Priority = Priority.regular;\n  @property({type: Array, attribute: false})\n  priorityElements: CompassPriorityElement[] = [CompassPriorityElement.hdg];\n  /** Show compass NSEW labels and north arrow. */\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  /**\n   * Resolved rate of turn in degrees per minute, used to compute the bar\n   * extent. Prefers the new physical API; falls back to the deprecated\n   * `rotationsPerMinute` so existing consumers keep their visuals during\n   * the deprecation window.\n   */\n  private get _effectiveRotDegPerMin(): number {\n    return this.rateOfTurnDegreesPerMinute ?? this.rotationsPerMinute;\n  }\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: CompassPriorityElement): 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 colorFor(element: CompassPriorityElement): string | undefined {\n    return this.priorityFor(element) === Priority.enhanced\n      ? 'var(--instrument-enhanced-secondary-color)'\n      : undefined;\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          .state=${this.state}\n          .watchCircleType=${WatchCircleType.triple}\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          .vessels=${[\n            {\n              size: VesselImageSize.medium,\n              vesselImage: this.vesselImage,\n              transform: `rotate(${this.heading}deg)`,\n            },\n          ]}\n          .wind=${this.windSpeed}\n          .windFromDirectionDeg=${this.windFromDirection}\n          .windColor=${this.colorFor(CompassPriorityElement.wind)}\n          .current=${this.currentSpeed}\n          .currentFromDirectionDeg=${this.currentFromDirection}\n          .currentColor=${this.colorFor(CompassPriorityElement.current)}\n          .rotation=${this.getRotation()}\n          .rotType=${this.rotType}\n          .rotPosition=${this.rotPosition}\n          .rotStartAngle=${this.heading + (this.getRotation() ?? 0)}\n          .rotEndAngle=${this.heading +\n          (this._effectiveRotDegPerMin / (this.rotMaxValue || 1)) *\n            this.rotArcExtent +\n          (this.getRotation() ?? 0)}\n          .rotPriority=${this.priorityFor(CompassPriorityElement.rot)}\n          .rotPortStarboard=${this.rotPortStarboard}\n          .rotAtZeroDeadband=${this.rotAtZeroDeadband}\n          .rateOfTurnDegreesPerMinute=${this.rateOfTurnDegreesPerMinute}\n          .rotDotAnimationFactor=${this.rotDotAnimationFactor}\n          .rotationsPerMinute=${this.rotationsPerMinute}\n        >\n        </obc-watch>\n        <svg viewBox=\"${viewBox}\">\n          ${arrow(\n            ArrowStyle.HDG,\n            this.heading + (this.getRotation() ?? 0),\n            this.priorityFor(CompassPriorityElement.hdg)\n          )}\n          ${arrow(\n            ArrowStyle.COG,\n            this.courseOverGround + (this.getRotation() ?? 0),\n            this.priorityFor(CompassPriorityElement.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-compass': ObcCompass;\n  }\n}\n"],"names":["CompassDirection","CompassPriorityElement"],"mappings":"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"}
+{"version":3,"file":"compass.js","sources":["../../../src/navigation-instruments/compass/compass.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  VesselImage,\n  VesselImageSize,\n  WatchCircleType,\n  RotType,\n  RotPosition,\n} from '../watch/watch.js';\nimport {SetpointBundle} from '../../svghelpers/setpoint-bundle.js';\nimport {ROT_ZERO_DEADBAND_DEG} from '../rate-of-turn/rot-renderer.js';\nimport {customElement} from '../../decorator.js';\nimport {InstrumentState, Priority} from '../types.js';\nexport {RotType};\n\nexport enum CompassDirection {\n  NorthUp = 'northUp',\n  HeadingUp = 'headingUp',\n  CourseUp = 'courseUp',\n}\n\nexport enum CompassPriorityElement {\n  hdg = 'hdg',\n  cog = 'cog',\n  rot = 'rot',\n  wind = 'wind',\n  current = 'current',\n}\n\n/**\n * `<obc-compass>` – Full-featured compass with HDG/COG arrows, rate-of-turn indicator, and environmental overlays.\n *\n * Renders a circular compass instrument that displays heading (HDG) and\n * course-over-ground (COG) as rotating arrows over a triple-ring watch face.\n * It supports wind and current indicators, a vessel silhouette, heading\n * setpoint with auto at-setpoint detection, advice zones, and a rate-of-turn\n * (ROT) dot indicator. The compass can be oriented north-up, heading-up, or\n * course-up.\n *\n * ## Features\n *\n * - **Direction modes**: `northUp` (default), `headingUp`, or `courseUp`\n *   via the `direction` property.\n * - **HDG / COG arrows**: Two styled arrows overlay the watch face,\n *   rotating independently.\n * - **Heading setpoint**: Optional setpoint marker with auto at-setpoint\n *   detection via `headingSetpoint`, `atHeadingSetpoint`, and deadband\n *   tuning properties.\n * - **Advice zones**: Pass `headingAdvices` to render caution/alert arcs;\n *   triggered state is derived from whether the current heading falls\n *   inside the advice range.\n * - **Rate of turn**: Animated ROT indicator driven by\n *   `rateOfTurnDegreesPerMinute` (deg/min, the maritime / AIS convention).\n *   Supports spinning dots (`rotType=\"dots\"`) — the dot animation is\n *   amplified by `rotDotAnimationFactor` so small physical values still\n *   read at a glance — and a banana-shaped arc bar (`rotType=\"bar\"`)\n *   showing the HDG→COG span. Bar extent is driven by the physical value\n *   only (gain is not applied). Position on the outer scale ring or inner\n *   circle via `rotPosition`.\n * - **Environmental overlays**: Wind speed/direction and current\n *   speed/direction indicators on the watch face.\n * - **Vessel image**: Configurable vessel silhouette centered on the\n *   compass, rotating with heading.\n * - **Color priority**: Set `priority` to `Priority.enhanced` to use the\n *   blue/enhanced color palette instead of the default gray/regular palette\n *   (default: `Priority.regular`).\n *\n * ## Usage Guidelines\n *\n * - Set `heading` and `courseOverGround` to the current sensor values\n *   in degrees.\n * - Use `direction` to control the compass orientation mode.\n * - Use `headingSetpoint` to show a target heading marker.\n * - Pass `headingAdvices` as an array of `AngleAdvice` objects for\n *   caution/alert zones.\n * - Set `currentWindSpeedKnots` / `windFromDirection` and `currentSpeed` /\n *   `currentFromDirection` to display environmental indicators.\n *\n * ## Example\n *\n * ```html\n * <obc-compass\n *   heading=\"45\"\n *   courseOverGround=\"50\"\n *   direction=\"northUp\"\n *   headingSetpoint=\"90\"\n *   priority=\"regular\"\n *   vesselImage=\"genericTop\"\n * ></obc-compass>\n * ```\n *\n * @property {number} heading - The current heading of the vessel in degrees.\n * @property {number} courseOverGround - The current course over ground in degrees.\n * @property {number | null} headingSetpoint - The set point for the heading in degrees.\n * @property {boolean} atHeadingSetpoint - Indicates if the vessel is at the heading set point.\n * @property {boolean} autoAtHeadingSetpoint - Enables automatic at heading set point calculation.\n * @property {number} autoAtHeadingSetpointDeadband - The deadband for the heading set point in degrees.\n * @property {boolean} touching - Indicates if the compass is being touched.\n * @property {Array<AngleAdvice>} headingAdvices - An array of angle advices for the compass.\n * @property {number | null} currentWindSpeedKnots - The wind speed in knots.\n * @property {number | null} windFromDirection - The direction the wind is coming from in degrees.\n * @property {number | null} currentSpeed - The current speed, number of arrows.\n * @property {number | null} currentFromDirection - The direction the current is coming from in degrees.\n * @property {VesselImage} vesselImage - The image of the vessel.\n * @property {number|undefined} rateOfTurnDegreesPerMinute - Measured rate of turn in degrees per minute (the AIS / ITU-R M.1371 convention). Sign controls direction (positive = starboard / clockwise). Drives both the bar extent and the dot animation.\n * @property {number} rotDotAnimationFactor - Visual amplification for the dot animation only. Default `18` (≈1 rpm at 20°/min).\n * @property {number} rotationsPerMinute - **Deprecated.** Use `rateOfTurnDegreesPerMinute` instead. Kept as a backward-compatible fallback when `rateOfTurnDegreesPerMinute` is `undefined`.\n * @property {RotType} rotType - ROT display mode: `'dots'` (spinning dots, default) or `'bar'` (arc bar from HDG to COG).\n * @property {RotPosition} rotPosition - ROT track position: `'innerCircle'` (default) or `'scale'` (on the outer ring).\n * @property {Priority} priority - Color priority: `Priority.enhanced` uses the blue/enhanced color palette, `Priority.regular` (default) uses the standard palette.\n *\n * @ignition-base-height: 512px\n * @ignition-base-width: 512px\n */\n@customElement('obc-compass')\nexport class ObcCompass extends LitElement {\n  @property({type: Number}) heading = 0;\n  @property({type: Number}) courseOverGround = 0;\n\n  @property({type: Number}) headingSetpoint: number | null = null;\n  @property({type: Number}) newHeadingSetpoint: number | undefined;\n  @property({type: Boolean}) atHeadingSetpoint: boolean = false;\n  @property({type: Number}) headingSetpointAtZeroDeadband: number = 0.5;\n  @property({type: Boolean}) headingSetpointOverride: boolean = false;\n  @property({type: Boolean, attribute: false}) autoAtHeadingSetpoint: boolean =\n    true;\n  @property({type: Number}) autoAtHeadingSetpointDeadband: number = 2;\n  @property({type: Boolean}) animateSetpoint: boolean = false;\n  @property({type: Boolean}) touching: boolean = false;\n  @property({type: Array, attribute: false}) headingAdvices: AngleAdvice[] = [];\n  @property({type: Number}) currentWindSpeedKnots: number | null = null;\n  @property({type: Number}) windFromDirection: number | null = null;\n  @property({type: Number}) currentSpeed: number | null = null;\n  @property({type: Number}) currentFromDirection: number | null = null;\n  @property({type: String}) vesselImage: VesselImage = VesselImage.genericTop;\n  /**\n   * Measured rate of turn in degrees per minute (positive = starboard).\n   * Drives both the bar extent and (after multiplication by\n   * `rotDotAnimationFactor`) the spinning dot animation.\n   * When `undefined`, falls back to the deprecated `rotationsPerMinute`.\n   */\n  @property({type: Number}) rateOfTurnDegreesPerMinute: number | undefined;\n  /**\n   * Visual amplification applied only to the spinning dot animation\n   * (not to the bar extent). Default `18` keeps the legacy visual feel\n   * (≈1 rpm at 20°/min).\n   */\n  @property({type: Number}) rotDotAnimationFactor: number = 18;\n  /**\n   * @deprecated Use `rateOfTurnDegreesPerMinute` (and optionally\n   * `rotDotAnimationFactor`) instead. Takes effect only when\n   * `rateOfTurnDegreesPerMinute` is `undefined`.\n   */\n  @property({type: Number}) rotationsPerMinute: number = 1;\n  @property({type: String}) rotType: RotType = RotType.dots;\n  @property({type: String}) rotPosition: RotPosition = RotPosition.innerCircle;\n  /**\n   * Bar-extent reference value in **degrees per minute**. The bar fills the\n   * full ±`rotArcExtent` arc when the measured ROT equals ±`rotMaxValue`.\n   * Default `60` aligns with ES-TRIN 2025/1 Art. 3.02.\n   *\n   * Note: prior to the introduction of `rateOfTurnDegreesPerMinute` this\n   * property was interpreted in rotations per minute. The unit changed when\n   * the physical ROT API was introduced.\n   */\n  @property({type: Number}) rotMaxValue: number = 60;\n  @property({type: Number}) rotArcExtent: number = 60;\n  @property({type: Boolean}) rotPortStarboard: boolean = false;\n  @property({type: Number}) rotAtZeroDeadband: number = ROT_ZERO_DEADBAND_DEG;\n  @property({type: String}) direction: CompassDirection =\n    CompassDirection.NorthUp;\n  @property({type: String}) state: InstrumentState = InstrumentState.active;\n  @property({type: String}) priority: Priority = Priority.regular;\n  @property({type: Array, attribute: false})\n  priorityElements: CompassPriorityElement[] = [CompassPriorityElement.hdg];\n  /** Show compass NSEW labels and north arrow. */\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  /**\n   * Resolved rate of turn in degrees per minute, used to compute the bar\n   * extent. Prefers the new physical API; falls back to the deprecated\n   * `rotationsPerMinute` so existing consumers keep their visuals during\n   * the deprecation window.\n   */\n  private get _effectiveRotDegPerMin(): number {\n    return this.rateOfTurnDegreesPerMinute ?? this.rotationsPerMinute;\n  }\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: CompassPriorityElement): 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 colorFor(element: CompassPriorityElement): string | undefined {\n    return this.priorityFor(element) === Priority.enhanced\n      ? 'var(--instrument-enhanced-secondary-color)'\n      : undefined;\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          .state=${this.state}\n          .watchCircleType=${WatchCircleType.triple}\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          .vessels=${[\n            {\n              size: VesselImageSize.medium,\n              vesselImage: this.vesselImage,\n              transform: `rotate(${this.heading}deg)`,\n            },\n          ]}\n          .windKnots=${this.currentWindSpeedKnots}\n          .windFromDirectionDeg=${this.windFromDirection}\n          .windColor=${this.colorFor(CompassPriorityElement.wind)}\n          .current=${this.currentSpeed}\n          .currentFromDirectionDeg=${this.currentFromDirection}\n          .currentColor=${this.colorFor(CompassPriorityElement.current)}\n          .rotation=${this.getRotation()}\n          .rotType=${this.rotType}\n          .rotPosition=${this.rotPosition}\n          .rotStartAngle=${this.heading + (this.getRotation() ?? 0)}\n          .rotEndAngle=${this.heading +\n          (this._effectiveRotDegPerMin / (this.rotMaxValue || 1)) *\n            this.rotArcExtent +\n          (this.getRotation() ?? 0)}\n          .rotPriority=${this.priorityFor(CompassPriorityElement.rot)}\n          .rotPortStarboard=${this.rotPortStarboard}\n          .rotAtZeroDeadband=${this.rotAtZeroDeadband}\n          .rateOfTurnDegreesPerMinute=${this.rateOfTurnDegreesPerMinute}\n          .rotDotAnimationFactor=${this.rotDotAnimationFactor}\n          .rotationsPerMinute=${this.rotationsPerMinute}\n        >\n        </obc-watch>\n        <svg viewBox=\"${viewBox}\">\n          ${arrow(\n            ArrowStyle.HDG,\n            this.heading + (this.getRotation() ?? 0),\n            this.priorityFor(CompassPriorityElement.hdg)\n          )}\n          ${arrow(\n            ArrowStyle.COG,\n            this.courseOverGround + (this.getRotation() ?? 0),\n            this.priorityFor(CompassPriorityElement.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-compass': ObcCompass;\n  }\n}\n"],"names":["CompassDirection","CompassPriorityElement"],"mappings":"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"}

package/dist/navigation-instruments/compass-indicator/compass-indicator.d.ts

@@ -20,6 +20,7 @@ export declare enum CompassIndicatorDirection {
  * - **Types**: `regular` shows the circular compass indicator; `labeled` shows a framed indicator with a single cardinal label.
  * - **Directions**: `heading`, `course`, and `north` each use their own visual symbol.
  * - **Angle-driven output**: `angle` rotates the active symbol and drives the derived label in labeled mode.
+ * - **Orientation**: `northUp` keeps the compass face fixed north-up and rotates the arrow; when `false` the face rotates and the arrow stays pointing up (heading-up / course-up).
  *
  * ## Usage Guidelines
  *
@@ -28,12 +29,23 @@ export declare enum CompassIndicatorDirection {
  * - Use `direction="north"` for the north marker / bearing-style indicator.
  * - Switch `type` to `labeled` when the indicator should also communicate the
  *   nearest cardinal direction as text.
+ * - Set `northUp` to `false` to render a heading-up / course-up presentation
+ *   where the arrow stays vertical and the compass face rotates instead.
  */
 export declare class ObcCompassIndicator extends LitElement {
     private idBase;
     angle: number;
     type: CompassIndicatorType;
     direction: CompassIndicatorDirection;
+    /**
+     * When `true` (default) the compass face stays north-up and the arrow
+     * rotates by `angle`. When `false` the arrow stays pointing up and the
+     * compass face rotates instead (heading-up / course-up presentation).
+     *
+     * Declared with `attribute: false` because the default is `true`; set it
+     * via the JavaScript property (or framework binding) to opt out.
+     */
+    northUp: boolean;
     private get normalizedAngle();
     private get cardinalLabel();
     private get cardinalLabelPrimary();

package/dist/navigation-instruments/compass-indicator/compass-indicator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"compass-indicator.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/compass-indicator/compass-indicator.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAuB,MAAM,KAAK,CAAC;AAkBrD,oBAAY,oBAAoB;IAC9B,OAAO,YAAY;IACnB,OAAO,YAAY;CACpB;AAED,oBAAY,yBAAyB;IACnC,OAAO,YAAY;IACnB,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,qBACa,mBAAoB,SAAQ,UAAU;IACjD,OAAO,CAAC,MAAM,CAAiE;IAG/E,KAAK,SAAK;IAGV,IAAI,EAAE,oBAAoB,CAAgC;IAG1D,SAAS,EAAE,yBAAyB,CAAqC;IAEzE,OAAO,KAAK,eAAe,GAE1B;IAED,OAAO,KAAK,aAAa,GAIxB;IAED,OAAO,KAAK,oBAAoB,GAI/B;IAED,OAAO,CAAC,WAAW;IA6BnB,OAAO,CAAC,iBAAiB;IAoEzB,OAAO,CAAC,oBAAoB;IAmB5B,OAAO,CAAC,wBAAwB;IA4DhC,OAAO,CAAC,sBAAsB;IAwD9B,OAAO,CAAC,oBAAoB;IA6DnB,MAAM;IAcf,OAAgB,MAAM,0BAA6B;CACpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,uBAAuB,EAAE,mBAAmB,CAAC;KAC9C;CACF"}
+{"version":3,"file":"compass-indicator.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/compass-indicator/compass-indicator.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAuB,MAAM,KAAK,CAAC;AAkBrD,oBAAY,oBAAoB;IAC9B,OAAO,YAAY;IACnB,OAAO,YAAY;CACpB;AAED,oBAAY,yBAAyB;IACnC,OAAO,YAAY;IACnB,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB;AAED;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,qBACa,mBAAoB,SAAQ,UAAU;IACjD,OAAO,CAAC,MAAM,CAAiE;IAG/E,KAAK,SAAK;IAGV,IAAI,EAAE,oBAAoB,CAAgC;IAG1D,SAAS,EAAE,yBAAyB,CAAqC;IAEzE;;;;;;;OAOG;IAEH,OAAO,EAAE,OAAO,CAAQ;IAExB,OAAO,KAAK,eAAe,GAE1B;IAED,OAAO,KAAK,aAAa,GAIxB;IAED,OAAO,KAAK,oBAAoB,GAI/B;IAED,OAAO,CAAC,WAAW;IA6BnB,OAAO,CAAC,iBAAiB;IAoEzB,OAAO,CAAC,oBAAoB;IAmB5B,OAAO,CAAC,wBAAwB;IA4DhC,OAAO,CAAC,sBAAsB;IAwD9B,OAAO,CAAC,oBAAoB;IA6DnB,MAAM;IAkBf,OAAgB,MAAM,0BAA6B;CACpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,uBAAuB,EAAE,mBAAmB,CAAC;KAC9C;CACF"}

package/dist/navigation-instruments/compass-indicator/compass-indicator.js

@@ -38,6 +38,7 @@ let ObcCompassIndicator = class extends LitElement {
     this.angle = 0;
     this.type = "regular";
     this.direction = "heading";
+    this.northUp = true;
   }
   get normalizedAngle() {
     return normalizeAngle(this.angle);
@@ -318,7 +319,11 @@ let ObcCompassIndicator = class extends LitElement {
     if (this.type === "labeled") {
       return this.renderLabeledIndicator(this.direction);
     }
-    return this.renderRoundIndicator(this.direction, 0, -this.normalizedAngle);
+    return this.renderRoundIndicator(
+      this.direction,
+      this.northUp ? this.normalizedAngle : 0,
+      this.northUp ? 0 : -this.normalizedAngle
+    );
   }
 };
 ObcCompassIndicator.styles = unsafeCSS(componentStyle);
@@ -331,6 +336,9 @@ __decorateClass([
 __decorateClass([
   property({ type: String })
 ], ObcCompassIndicator.prototype, "direction", 2);
+__decorateClass([
+  property({ type: Boolean, attribute: false })
+], ObcCompassIndicator.prototype, "northUp", 2);
 ObcCompassIndicator = __decorateClass([
   customElement("obc-compass-indicator")
 ], ObcCompassIndicator);

package/dist/navigation-instruments/compass-indicator/compass-indicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"compass-indicator.js","sources":["../../../src/navigation-instruments/compass-indicator/compass-indicator.ts"],"sourcesContent":["import {LitElement, html, svg, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport componentStyle from './compass-indicator.css?inline';\nimport {customElement} from '../../decorator.js';\n\nconst HEADING_ARROW_PATH =\n  'M23.1426 11.978C23.5519 11.2972 24.6131 11.3458 24.9297 12.1235L32.3877 30.4536L32.4336 30.5796C32.8455 31.8831 31.3809 32.9849 30.209 32.2808V32.2798L24 28.5835L17.79 32.2798L17.791 32.2808C16.5815 33.0075 15.0606 31.8106 15.6123 30.4536L23.0703 12.1235L23.1426 11.978Z';\nconst LABELED_HEADING_ARROW_PATH =\n  'M7.68919 1.5401C7.80154 1.26398 8.19911 1.26398 8.31146 1.5401L13.2832 13.7598C13.5226 14.3482 12.8616 14.8972 12.3115 14.5667L8.00033 11.9997L3.68917 14.5667C3.13908 14.8972 2.478 14.3482 2.71743 13.7598L7.68919 1.5401Z';\nconst COURSE_ARROW_PATH =\n  'M23.1426 11.978C23.5519 11.2972 24.6131 11.3458 24.9297 12.1235L32.3877 30.4536L32.4336 30.5796C32.8455 31.8831 31.3809 32.9849 30.209 32.2808V32.2798L24 28.5835L17.79 32.2798L17.791 32.2808C16.5815 33.0075 15.0606 31.8106 15.6123 30.4536L23.0703 12.1235L23.1426 11.978ZM20.0889 27.4087L23.7451 25.2388L24 25.0864L24.2549 25.2388L27.9102 27.4087L24 17.7974L20.0889 27.4087Z';\nconst CARDINAL_LABELS_8_WAY = ['N', 'NE', 'E', 'SE', 'S', 'SW', 'W', 'NW'];\nconst CARDINAL_LABELS_CARDINAL = ['N', 'E', 'S', 'W'];\n\nfunction normalizeAngle(angle: number): number {\n  return ((angle % 360) + 360) % 360;\n}\n\nexport enum CompassIndicatorType {\n  Regular = 'regular',\n  Labeled = 'labeled',\n}\n\nexport enum CompassIndicatorDirection {\n  Heading = 'heading',\n  Course = 'course',\n  North = 'north',\n}\n\n/**\n * `<obc-compass-indicator>` – A compact compass direction indicator with heading, course, and north variants.\n *\n * Renders a 48 x 48 directional indicator that can switch between a circular\n * compass face and labeled compact readouts. Use it when you need a small\n * directional cue next to a numeric readout or inside dense instrument layouts.\n *\n * ## Features\n *\n * - **Types**: `regular` shows the circular compass indicator; `labeled` shows a framed indicator with a single cardinal label.\n * - **Directions**: `heading`, `course`, and `north` each use their own visual symbol.\n * - **Angle-driven output**: `angle` rotates the active symbol and drives the derived label in labeled mode.\n *\n * ## Usage Guidelines\n *\n * - Use `direction=\"heading\"` for the filled heading arrow variant.\n * - Use `direction=\"course\"` for the outlined course arrow variant.\n * - Use `direction=\"north\"` for the north marker / bearing-style indicator.\n * - Switch `type` to `labeled` when the indicator should also communicate the\n *   nearest cardinal direction as text.\n */\n@customElement('obc-compass-indicator')\nexport class ObcCompassIndicator extends LitElement {\n  private idBase = `compass-indicator-${Math.random().toString(36).slice(2, 9)}`;\n\n  @property({type: Number})\n  angle = 0;\n\n  @property({type: String})\n  type: CompassIndicatorType = CompassIndicatorType.Regular;\n\n  @property({type: String})\n  direction: CompassIndicatorDirection = CompassIndicatorDirection.Heading;\n\n  private get normalizedAngle(): number {\n    return normalizeAngle(this.angle);\n  }\n\n  private get cardinalLabel(): string {\n    const index =\n      Math.round(this.normalizedAngle / 45) % CARDINAL_LABELS_8_WAY.length;\n    return CARDINAL_LABELS_8_WAY[index];\n  }\n\n  private get cardinalLabelPrimary(): string {\n    const index =\n      Math.round(this.normalizedAngle / 90) % CARDINAL_LABELS_CARDINAL.length;\n    return CARDINAL_LABELS_CARDINAL[index];\n  }\n\n  private renderArrow(\n    direction: string,\n    options?: {\n      rotation?: number;\n      translateY?: number;\n      scale?: number;\n    }\n  ) {\n    const {rotation = 0, translateY = 0, scale = 1} = options ?? {};\n    const d =\n      direction === CompassIndicatorDirection.Course\n        ? COURSE_ARROW_PATH\n        : HEADING_ARROW_PATH;\n\n    return svg`\n      <g transform=\"translate(0 ${translateY})\">\n        <g transform=\"rotate(${rotation}, 24, 24)\">\n          <g transform=\"translate(24 24) scale(${scale}) translate(-24 -24)\">\n            <path\n              d=\"${d}\"\n              fill=\"var(--instrument-enhanced-secondary-color)\"\n              stroke=\"var(--border-silhouette-color)\"\n            />\n          </g>\n        </g>\n      </g>\n    `;\n  }\n\n  private renderCompassFace(rotation: number, showNorthMarker = true) {\n    const ringMaskId = `${this.idBase}-ring-mask`;\n    const crosshairMaskId = `${this.idBase}-crosshair-mask`;\n\n    return svg`\n      ${\n        showNorthMarker\n          ? svg`\n            <path\n              transform=\"rotate(${rotation}, 24, 24)\"\n              d=\"M23.5929 1.56961L19.5645 7.20938C19.3281 7.54031 19.5646 8 19.9713 8L28.0281 8C28.4348 8 28.6714 7.54031 28.435 7.20938L24.4066 1.56961C24.2072 1.29044 23.7923 1.29044 23.5929 1.56961Z\"\n              fill=\"var(--instrument-tick-mark-tertiary-color)\"\n            />\n          `\n          : null\n      }\n      <circle\n        cx=\"24\"\n        cy=\"24\"\n        r=\"18\"\n        fill=\"var(--instrument-frame-primary-color)\"\n        stroke=\"var(--instrument-frame-tertiary-color)\"\n      />\n      <mask\n        id=\"${ringMaskId}\"\n        style=\"mask-type: alpha\"\n        maskUnits=\"userSpaceOnUse\"\n        x=\"0\"\n        y=\"0\"\n        width=\"48\"\n        height=\"48\"\n      >\n        <path\n          d=\"M24 8C32.8366 8 40 15.1634 40 24C40 32.8366 32.8366 40 24 40C15.1634 40 8 32.8366 8 24C8 15.1634 15.1634 8 24 8ZM24 10C16.268 10 10 16.268 10 24C10 31.732 16.268 38 24 38C31.732 38 38 31.732 38 24C38 16.268 31.732 10 24 10Z\"\n          fill=\"var(--instrument-frame-primary-color)\"\n        />\n      </mask>\n      <g mask=\"url(#${ringMaskId})\">\n        <path\n          d=\"M24 0V24M24 24L19.8324 0.364611M24 24L15.7915 1.44736M24 24L12 3.21539M24 24L8.5731 5.61493M24 24L5.61494 8.5731M24 24L3.21539 12M24 24L1.44738 15.7915M24 24L0.364617 19.8324M24 24H0M24 24L0.364611 28.1676M24 24L1.44739 32.2085M24 24L3.21539 36M24 24L5.61493 39.4269M24 24L8.5731 42.3851M24 24L12 44.7846M24 24L15.7915 46.5526M24 24L19.8324 47.6354M24 24V48M24 24L28.1676 47.6354M24 24L32.2085 46.5526M24 24L36 44.7846M24 24L39.4269 42.3851M24 24L42.3851 39.4269M24 24L44.7846 36M24 24L46.5526 32.2085M24 24L47.6354 28.1676M24 24H48M24 24L47.6354 19.8325M24 24L46.5526 15.7915M24 24L44.7846 12M24 24L42.3851 8.57313M24 24L39.4269 5.61497M24 24L36 3.21539M24 24L32.2085 1.44741M24 24L28.1676 0.364646\"\n          stroke=\"var(--instrument-frame-tertiary-color)\"\n        />\n      </g>\n      <mask\n        id=\"${crosshairMaskId}\"\n        style=\"mask-type: alpha\"\n        maskUnits=\"userSpaceOnUse\"\n        x=\"-14\"\n        y=\"-14\"\n        width=\"76\"\n        height=\"76\"\n      >\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M24 42C33.9411 42 42 33.9411 42 24C42 14.0589 33.9411 6 24 6C14.0589 6 6 14.0589 6 24C6 33.9411 14.0589 42 24 42ZM24 36C30.6274 36 36 30.6274 36 24C36 17.3726 30.6274 12 24 12C17.3726 12 12 17.3726 12 24C12 30.6274 17.3726 36 24 36Z\"\n          fill=\"var(--instrument-frame-primary-color)\"\n        />\n      </mask>\n      <g mask=\"url(#${crosshairMaskId})\">\n        <path\n          d=\"M24 0V24M24 24H0M24 24V48M24 24H48\"\n          stroke=\"var(--instrument-frame-tertiary-color)\"\n        />\n      </g>\n    `;\n  }\n\n  private renderRoundIndicator(\n    direction: string,\n    arrowRotation: number,\n    faceRotation: number\n  ) {\n    return html`\n      <svg\n        width=\"48\"\n        height=\"48\"\n        viewBox=\"0 0 48 48\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        ${this.renderCompassFace(faceRotation)}\n        ${this.renderArrow(direction, {rotation: arrowRotation})}\n      </svg>\n    `;\n  }\n\n  private renderRegularNorthNeedle() {\n    const tailClipId = `${this.idBase}-regular-north-tail-clip`;\n\n    return svg`\n      <g transform=\"rotate(${this.normalizedAngle - 315}, 24, 24)\">\n        <g transform=\"translate(-5 -5)\">\n          <svg\n            x=\"14.5\"\n            y=\"14.5\"\n            width=\"19\"\n            height=\"19\"\n            viewBox=\"0 0 19 19\"\n            overflow=\"visible\"\n          >\n            <g clip-path=\"url(#${tailClipId})\">\n              <path\n                d=\"M11.8398 17.0537L2.80041 3.49458C2.49725 3.03984 3.03904 2.49804 3.49379 2.80121L17.0529 11.8406C17.9318 12.4265 18.6859 13.1806 19.2717 14.0594L28.3112 27.6186C28.6143 28.0733 28.0726 28.6151 27.6178 28.312L14.0587 19.2725C13.1798 18.6867 12.4257 17.9326 11.8398 17.0537Z\"\n                fill=\"var(--instrument-enhanced-secondary-color)\"\n                stroke=\"var(--instrument-enhanced-secondary-color)\"\n              />\n            </g>\n            <defs>\n              <clipPath id=\"${tailClipId}\">\n                <rect\n                  width=\"8\"\n                  height=\"18\"\n                  fill=\"white\"\n                  transform=\"translate(0 5.65723) rotate(-45)\"\n                />\n              </clipPath>\n            </defs>\n          </svg>\n          <svg\n            x=\"15.5\"\n            y=\"15.5\"\n            width=\"17\"\n            height=\"17\"\n            viewBox=\"0 0 17 17\"\n            overflow=\"visible\"\n          >\n            <path\n              d=\"M9.63184 14.8448L0.592403 1.2856C0.28924 0.830852 0.831036 0.289059 1.28578 0.592223L14.8449 9.63166C15.7238 10.2175 16.4779 10.9716 17.0637 11.8505L26.1032 25.4096C26.4063 25.8644 25.8645 26.4062 25.4098 26.103L11.8506 17.0636C10.9718 16.4777 10.2177 15.7236 9.63184 14.8448Z\"\n              fill=\"none\"\n              stroke=\"var(--instrument-enhanced-secondary-color)\"\n              stroke-width=\"1.5\"\n            />\n          </svg>\n        </g>\n        <circle\n          cx=\"24\"\n          cy=\"24\"\n          r=\"3\"\n          fill=\"var(--instrument-frame-primary-color)\"\n          stroke=\"var(--instrument-enhanced-secondary-color)\"\n          stroke-width=\"2\"\n        />\n      </g>\n    `;\n  }\n\n  private renderLabeledIndicator(direction: string) {\n    const label = this.cardinalLabelPrimary;\n    const isHeading = direction === CompassIndicatorDirection.Heading;\n\n    return html`\n      <svg\n        width=\"48\"\n        height=\"48\"\n        viewBox=\"0 0 48 48\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <rect\n          x=\"8\"\n          y=\"8\"\n          width=\"32\"\n          height=\"32\"\n          rx=\"4\"\n          fill=\"var(--instrument-frame-primary-color)\"\n          stroke=\"var(--instrument-frame-tertiary-color)\"\n        />\n        <text\n          x=\"24\"\n          y=\"11\"\n          fill=\"var(--instrument-tick-mark-label-secondary-color)\"\n          font-family=\"var(--global-typography-font-family)\"\n          font-size=\"var(--global-typography-instrument-tick-mark-active-font-size)\"\n          font-style=\"normal\"\n          font-weight=\"var(--global-typography-instrument-tick-mark-active-font-weight)\"\n          line-height=\"var(--global-typography-instrument-tick-mark-active-line-height)\"\n          text-anchor=\"middle\"\n          dominant-baseline=\"text-before-edge\"\n          style=\"font-feature-settings: 'ss04' on;\"\n        >\n          ${label}\n        </text>\n        <g\n          transform=\"translate(24 32) rotate(${this\n            .normalizedAngle}) translate(-8 -8)\"\n        >\n          <path\n            d=\"${LABELED_HEADING_ARROW_PATH}\"\n            fill=\"${isHeading\n              ? 'var(--instrument-enhanced-secondary-color)'\n              : 'none'}\"\n            stroke=\"${isHeading\n              ? 'none'\n              : 'var(--instrument-enhanced-secondary-color)'}\"\n            stroke-width=\"${isHeading ? '0' : '1'}\"\n            stroke-linejoin=\"round\"\n          />\n        </g>\n      </svg>\n    `;\n  }\n\n  private renderNorthIndicator(labeled: boolean) {\n    const label = this.cardinalLabel;\n\n    if (!labeled) {\n      return html`\n        <svg\n          width=\"48\"\n          height=\"48\"\n          viewBox=\"0 0 48 48\"\n          fill=\"none\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          ${this.renderCompassFace(0, false)} ${this.renderRegularNorthNeedle()}\n        </svg>\n      `;\n    }\n\n    return html`\n      <svg\n        width=\"48\"\n        height=\"48\"\n        viewBox=\"0 0 48 48\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <circle\n          cx=\"24\"\n          cy=\"24\"\n          r=\"18\"\n          fill=\"var(--instrument-frame-primary-color)\"\n          stroke=\"var(--instrument-frame-tertiary-color)\"\n        />\n        <path d=\"M24 6.5V14\" stroke=\"var(--instrument-frame-tertiary-color)\" />\n        <path d=\"M24 34V41.5\" stroke=\"var(--instrument-frame-tertiary-color)\" />\n        <path d=\"M6.5 24H14\" stroke=\"var(--instrument-frame-tertiary-color)\" />\n        <path d=\"M34 24H41.5\" stroke=\"var(--instrument-frame-tertiary-color)\" />\n        ${this.renderRegularNorthNeedle()}\n        <circle\n          cx=\"24\"\n          cy=\"24\"\n          r=\"12\"\n          fill=\"var(--instrument-frame-primary-color)\"\n          stroke=\"var(--instrument-frame-tertiary-color)\"\n        />\n        <text\n          x=\"24\"\n          y=\"25\"\n          fill=\"var(--element-neutral-color)\"\n          font-family=\"var(--font-family-main)\"\n          font-size=\"var(--global-typography-ui-label-active-font-size)\"\n          font-weight=\"var(--global-typography-ui-label-active-font-weight)\"\n          line-height=\"var(--global-typography-ui-label-active-line-height)\"\n          text-anchor=\"middle\"\n          dominant-baseline=\"middle\"\n        >\n          ${label}\n        </text>\n      </svg>\n    `;\n  }\n\n  override render() {\n    if (this.direction === CompassIndicatorDirection.North) {\n      return this.renderNorthIndicator(\n        this.type === CompassIndicatorType.Labeled\n      );\n    }\n\n    if (this.type === CompassIndicatorType.Labeled) {\n      return this.renderLabeledIndicator(this.direction);\n    }\n\n    return this.renderRoundIndicator(this.direction, 0, -this.normalizedAngle);\n  }\n\n  static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-compass-indicator': ObcCompassIndicator;\n  }\n}\n"],"names":["CompassIndicatorType","CompassIndicatorDirection"],"mappings":"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"}
+{"version":3,"file":"compass-indicator.js","sources":["../../../src/navigation-instruments/compass-indicator/compass-indicator.ts"],"sourcesContent":["import {LitElement, html, svg, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport componentStyle from './compass-indicator.css?inline';\nimport {customElement} from '../../decorator.js';\n\nconst HEADING_ARROW_PATH =\n  'M23.1426 11.978C23.5519 11.2972 24.6131 11.3458 24.9297 12.1235L32.3877 30.4536L32.4336 30.5796C32.8455 31.8831 31.3809 32.9849 30.209 32.2808V32.2798L24 28.5835L17.79 32.2798L17.791 32.2808C16.5815 33.0075 15.0606 31.8106 15.6123 30.4536L23.0703 12.1235L23.1426 11.978Z';\nconst LABELED_HEADING_ARROW_PATH =\n  'M7.68919 1.5401C7.80154 1.26398 8.19911 1.26398 8.31146 1.5401L13.2832 13.7598C13.5226 14.3482 12.8616 14.8972 12.3115 14.5667L8.00033 11.9997L3.68917 14.5667C3.13908 14.8972 2.478 14.3482 2.71743 13.7598L7.68919 1.5401Z';\nconst COURSE_ARROW_PATH =\n  'M23.1426 11.978C23.5519 11.2972 24.6131 11.3458 24.9297 12.1235L32.3877 30.4536L32.4336 30.5796C32.8455 31.8831 31.3809 32.9849 30.209 32.2808V32.2798L24 28.5835L17.79 32.2798L17.791 32.2808C16.5815 33.0075 15.0606 31.8106 15.6123 30.4536L23.0703 12.1235L23.1426 11.978ZM20.0889 27.4087L23.7451 25.2388L24 25.0864L24.2549 25.2388L27.9102 27.4087L24 17.7974L20.0889 27.4087Z';\nconst CARDINAL_LABELS_8_WAY = ['N', 'NE', 'E', 'SE', 'S', 'SW', 'W', 'NW'];\nconst CARDINAL_LABELS_CARDINAL = ['N', 'E', 'S', 'W'];\n\nfunction normalizeAngle(angle: number): number {\n  return ((angle % 360) + 360) % 360;\n}\n\nexport enum CompassIndicatorType {\n  Regular = 'regular',\n  Labeled = 'labeled',\n}\n\nexport enum CompassIndicatorDirection {\n  Heading = 'heading',\n  Course = 'course',\n  North = 'north',\n}\n\n/**\n * `<obc-compass-indicator>` – A compact compass direction indicator with heading, course, and north variants.\n *\n * Renders a 48 x 48 directional indicator that can switch between a circular\n * compass face and labeled compact readouts. Use it when you need a small\n * directional cue next to a numeric readout or inside dense instrument layouts.\n *\n * ## Features\n *\n * - **Types**: `regular` shows the circular compass indicator; `labeled` shows a framed indicator with a single cardinal label.\n * - **Directions**: `heading`, `course`, and `north` each use their own visual symbol.\n * - **Angle-driven output**: `angle` rotates the active symbol and drives the derived label in labeled mode.\n * - **Orientation**: `northUp` keeps the compass face fixed north-up and rotates the arrow; when `false` the face rotates and the arrow stays pointing up (heading-up / course-up).\n *\n * ## Usage Guidelines\n *\n * - Use `direction=\"heading\"` for the filled heading arrow variant.\n * - Use `direction=\"course\"` for the outlined course arrow variant.\n * - Use `direction=\"north\"` for the north marker / bearing-style indicator.\n * - Switch `type` to `labeled` when the indicator should also communicate the\n *   nearest cardinal direction as text.\n * - Set `northUp` to `false` to render a heading-up / course-up presentation\n *   where the arrow stays vertical and the compass face rotates instead.\n */\n@customElement('obc-compass-indicator')\nexport class ObcCompassIndicator extends LitElement {\n  private idBase = `compass-indicator-${Math.random().toString(36).slice(2, 9)}`;\n\n  @property({type: Number})\n  angle = 0;\n\n  @property({type: String})\n  type: CompassIndicatorType = CompassIndicatorType.Regular;\n\n  @property({type: String})\n  direction: CompassIndicatorDirection = CompassIndicatorDirection.Heading;\n\n  /**\n   * When `true` (default) the compass face stays north-up and the arrow\n   * rotates by `angle`. When `false` the arrow stays pointing up and the\n   * compass face rotates instead (heading-up / course-up presentation).\n   *\n   * Declared with `attribute: false` because the default is `true`; set it\n   * via the JavaScript property (or framework binding) to opt out.\n   */\n  @property({type: Boolean, attribute: false})\n  northUp: boolean = true;\n\n  private get normalizedAngle(): number {\n    return normalizeAngle(this.angle);\n  }\n\n  private get cardinalLabel(): string {\n    const index =\n      Math.round(this.normalizedAngle / 45) % CARDINAL_LABELS_8_WAY.length;\n    return CARDINAL_LABELS_8_WAY[index];\n  }\n\n  private get cardinalLabelPrimary(): string {\n    const index =\n      Math.round(this.normalizedAngle / 90) % CARDINAL_LABELS_CARDINAL.length;\n    return CARDINAL_LABELS_CARDINAL[index];\n  }\n\n  private renderArrow(\n    direction: string,\n    options?: {\n      rotation?: number;\n      translateY?: number;\n      scale?: number;\n    }\n  ) {\n    const {rotation = 0, translateY = 0, scale = 1} = options ?? {};\n    const d =\n      direction === CompassIndicatorDirection.Course\n        ? COURSE_ARROW_PATH\n        : HEADING_ARROW_PATH;\n\n    return svg`\n      <g transform=\"translate(0 ${translateY})\">\n        <g transform=\"rotate(${rotation}, 24, 24)\">\n          <g transform=\"translate(24 24) scale(${scale}) translate(-24 -24)\">\n            <path\n              d=\"${d}\"\n              fill=\"var(--instrument-enhanced-secondary-color)\"\n              stroke=\"var(--border-silhouette-color)\"\n            />\n          </g>\n        </g>\n      </g>\n    `;\n  }\n\n  private renderCompassFace(rotation: number, showNorthMarker = true) {\n    const ringMaskId = `${this.idBase}-ring-mask`;\n    const crosshairMaskId = `${this.idBase}-crosshair-mask`;\n\n    return svg`\n      ${\n        showNorthMarker\n          ? svg`\n            <path\n              transform=\"rotate(${rotation}, 24, 24)\"\n              d=\"M23.5929 1.56961L19.5645 7.20938C19.3281 7.54031 19.5646 8 19.9713 8L28.0281 8C28.4348 8 28.6714 7.54031 28.435 7.20938L24.4066 1.56961C24.2072 1.29044 23.7923 1.29044 23.5929 1.56961Z\"\n              fill=\"var(--instrument-tick-mark-tertiary-color)\"\n            />\n          `\n          : null\n      }\n      <circle\n        cx=\"24\"\n        cy=\"24\"\n        r=\"18\"\n        fill=\"var(--instrument-frame-primary-color)\"\n        stroke=\"var(--instrument-frame-tertiary-color)\"\n      />\n      <mask\n        id=\"${ringMaskId}\"\n        style=\"mask-type: alpha\"\n        maskUnits=\"userSpaceOnUse\"\n        x=\"0\"\n        y=\"0\"\n        width=\"48\"\n        height=\"48\"\n      >\n        <path\n          d=\"M24 8C32.8366 8 40 15.1634 40 24C40 32.8366 32.8366 40 24 40C15.1634 40 8 32.8366 8 24C8 15.1634 15.1634 8 24 8ZM24 10C16.268 10 10 16.268 10 24C10 31.732 16.268 38 24 38C31.732 38 38 31.732 38 24C38 16.268 31.732 10 24 10Z\"\n          fill=\"var(--instrument-frame-primary-color)\"\n        />\n      </mask>\n      <g mask=\"url(#${ringMaskId})\">\n        <path\n          d=\"M24 0V24M24 24L19.8324 0.364611M24 24L15.7915 1.44736M24 24L12 3.21539M24 24L8.5731 5.61493M24 24L5.61494 8.5731M24 24L3.21539 12M24 24L1.44738 15.7915M24 24L0.364617 19.8324M24 24H0M24 24L0.364611 28.1676M24 24L1.44739 32.2085M24 24L3.21539 36M24 24L5.61493 39.4269M24 24L8.5731 42.3851M24 24L12 44.7846M24 24L15.7915 46.5526M24 24L19.8324 47.6354M24 24V48M24 24L28.1676 47.6354M24 24L32.2085 46.5526M24 24L36 44.7846M24 24L39.4269 42.3851M24 24L42.3851 39.4269M24 24L44.7846 36M24 24L46.5526 32.2085M24 24L47.6354 28.1676M24 24H48M24 24L47.6354 19.8325M24 24L46.5526 15.7915M24 24L44.7846 12M24 24L42.3851 8.57313M24 24L39.4269 5.61497M24 24L36 3.21539M24 24L32.2085 1.44741M24 24L28.1676 0.364646\"\n          stroke=\"var(--instrument-frame-tertiary-color)\"\n        />\n      </g>\n      <mask\n        id=\"${crosshairMaskId}\"\n        style=\"mask-type: alpha\"\n        maskUnits=\"userSpaceOnUse\"\n        x=\"-14\"\n        y=\"-14\"\n        width=\"76\"\n        height=\"76\"\n      >\n        <path\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          d=\"M24 42C33.9411 42 42 33.9411 42 24C42 14.0589 33.9411 6 24 6C14.0589 6 6 14.0589 6 24C6 33.9411 14.0589 42 24 42ZM24 36C30.6274 36 36 30.6274 36 24C36 17.3726 30.6274 12 24 12C17.3726 12 12 17.3726 12 24C12 30.6274 17.3726 36 24 36Z\"\n          fill=\"var(--instrument-frame-primary-color)\"\n        />\n      </mask>\n      <g mask=\"url(#${crosshairMaskId})\">\n        <path\n          d=\"M24 0V24M24 24H0M24 24V48M24 24H48\"\n          stroke=\"var(--instrument-frame-tertiary-color)\"\n        />\n      </g>\n    `;\n  }\n\n  private renderRoundIndicator(\n    direction: string,\n    arrowRotation: number,\n    faceRotation: number\n  ) {\n    return html`\n      <svg\n        width=\"48\"\n        height=\"48\"\n        viewBox=\"0 0 48 48\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        ${this.renderCompassFace(faceRotation)}\n        ${this.renderArrow(direction, {rotation: arrowRotation})}\n      </svg>\n    `;\n  }\n\n  private renderRegularNorthNeedle() {\n    const tailClipId = `${this.idBase}-regular-north-tail-clip`;\n\n    return svg`\n      <g transform=\"rotate(${this.normalizedAngle - 315}, 24, 24)\">\n        <g transform=\"translate(-5 -5)\">\n          <svg\n            x=\"14.5\"\n            y=\"14.5\"\n            width=\"19\"\n            height=\"19\"\n            viewBox=\"0 0 19 19\"\n            overflow=\"visible\"\n          >\n            <g clip-path=\"url(#${tailClipId})\">\n              <path\n                d=\"M11.8398 17.0537L2.80041 3.49458C2.49725 3.03984 3.03904 2.49804 3.49379 2.80121L17.0529 11.8406C17.9318 12.4265 18.6859 13.1806 19.2717 14.0594L28.3112 27.6186C28.6143 28.0733 28.0726 28.6151 27.6178 28.312L14.0587 19.2725C13.1798 18.6867 12.4257 17.9326 11.8398 17.0537Z\"\n                fill=\"var(--instrument-enhanced-secondary-color)\"\n                stroke=\"var(--instrument-enhanced-secondary-color)\"\n              />\n            </g>\n            <defs>\n              <clipPath id=\"${tailClipId}\">\n                <rect\n                  width=\"8\"\n                  height=\"18\"\n                  fill=\"white\"\n                  transform=\"translate(0 5.65723) rotate(-45)\"\n                />\n              </clipPath>\n            </defs>\n          </svg>\n          <svg\n            x=\"15.5\"\n            y=\"15.5\"\n            width=\"17\"\n            height=\"17\"\n            viewBox=\"0 0 17 17\"\n            overflow=\"visible\"\n          >\n            <path\n              d=\"M9.63184 14.8448L0.592403 1.2856C0.28924 0.830852 0.831036 0.289059 1.28578 0.592223L14.8449 9.63166C15.7238 10.2175 16.4779 10.9716 17.0637 11.8505L26.1032 25.4096C26.4063 25.8644 25.8645 26.4062 25.4098 26.103L11.8506 17.0636C10.9718 16.4777 10.2177 15.7236 9.63184 14.8448Z\"\n              fill=\"none\"\n              stroke=\"var(--instrument-enhanced-secondary-color)\"\n              stroke-width=\"1.5\"\n            />\n          </svg>\n        </g>\n        <circle\n          cx=\"24\"\n          cy=\"24\"\n          r=\"3\"\n          fill=\"var(--instrument-frame-primary-color)\"\n          stroke=\"var(--instrument-enhanced-secondary-color)\"\n          stroke-width=\"2\"\n        />\n      </g>\n    `;\n  }\n\n  private renderLabeledIndicator(direction: string) {\n    const label = this.cardinalLabelPrimary;\n    const isHeading = direction === CompassIndicatorDirection.Heading;\n\n    return html`\n      <svg\n        width=\"48\"\n        height=\"48\"\n        viewBox=\"0 0 48 48\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <rect\n          x=\"8\"\n          y=\"8\"\n          width=\"32\"\n          height=\"32\"\n          rx=\"4\"\n          fill=\"var(--instrument-frame-primary-color)\"\n          stroke=\"var(--instrument-frame-tertiary-color)\"\n        />\n        <text\n          x=\"24\"\n          y=\"11\"\n          fill=\"var(--instrument-tick-mark-label-secondary-color)\"\n          font-family=\"var(--global-typography-font-family)\"\n          font-size=\"var(--global-typography-instrument-tick-mark-active-font-size)\"\n          font-style=\"normal\"\n          font-weight=\"var(--global-typography-instrument-tick-mark-active-font-weight)\"\n          line-height=\"var(--global-typography-instrument-tick-mark-active-line-height)\"\n          text-anchor=\"middle\"\n          dominant-baseline=\"text-before-edge\"\n          style=\"font-feature-settings: 'ss04' on;\"\n        >\n          ${label}\n        </text>\n        <g\n          transform=\"translate(24 32) rotate(${this\n            .normalizedAngle}) translate(-8 -8)\"\n        >\n          <path\n            d=\"${LABELED_HEADING_ARROW_PATH}\"\n            fill=\"${isHeading\n              ? 'var(--instrument-enhanced-secondary-color)'\n              : 'none'}\"\n            stroke=\"${isHeading\n              ? 'none'\n              : 'var(--instrument-enhanced-secondary-color)'}\"\n            stroke-width=\"${isHeading ? '0' : '1'}\"\n            stroke-linejoin=\"round\"\n          />\n        </g>\n      </svg>\n    `;\n  }\n\n  private renderNorthIndicator(labeled: boolean) {\n    const label = this.cardinalLabel;\n\n    if (!labeled) {\n      return html`\n        <svg\n          width=\"48\"\n          height=\"48\"\n          viewBox=\"0 0 48 48\"\n          fill=\"none\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n        >\n          ${this.renderCompassFace(0, false)} ${this.renderRegularNorthNeedle()}\n        </svg>\n      `;\n    }\n\n    return html`\n      <svg\n        width=\"48\"\n        height=\"48\"\n        viewBox=\"0 0 48 48\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <circle\n          cx=\"24\"\n          cy=\"24\"\n          r=\"18\"\n          fill=\"var(--instrument-frame-primary-color)\"\n          stroke=\"var(--instrument-frame-tertiary-color)\"\n        />\n        <path d=\"M24 6.5V14\" stroke=\"var(--instrument-frame-tertiary-color)\" />\n        <path d=\"M24 34V41.5\" stroke=\"var(--instrument-frame-tertiary-color)\" />\n        <path d=\"M6.5 24H14\" stroke=\"var(--instrument-frame-tertiary-color)\" />\n        <path d=\"M34 24H41.5\" stroke=\"var(--instrument-frame-tertiary-color)\" />\n        ${this.renderRegularNorthNeedle()}\n        <circle\n          cx=\"24\"\n          cy=\"24\"\n          r=\"12\"\n          fill=\"var(--instrument-frame-primary-color)\"\n          stroke=\"var(--instrument-frame-tertiary-color)\"\n        />\n        <text\n          x=\"24\"\n          y=\"25\"\n          fill=\"var(--element-neutral-color)\"\n          font-family=\"var(--font-family-main)\"\n          font-size=\"var(--global-typography-ui-label-active-font-size)\"\n          font-weight=\"var(--global-typography-ui-label-active-font-weight)\"\n          line-height=\"var(--global-typography-ui-label-active-line-height)\"\n          text-anchor=\"middle\"\n          dominant-baseline=\"middle\"\n        >\n          ${label}\n        </text>\n      </svg>\n    `;\n  }\n\n  override render() {\n    if (this.direction === CompassIndicatorDirection.North) {\n      return this.renderNorthIndicator(\n        this.type === CompassIndicatorType.Labeled\n      );\n    }\n\n    if (this.type === CompassIndicatorType.Labeled) {\n      return this.renderLabeledIndicator(this.direction);\n    }\n\n    return this.renderRoundIndicator(\n      this.direction,\n      this.northUp ? this.normalizedAngle : 0,\n      this.northUp ? 0 : -this.normalizedAngle\n    );\n  }\n\n  static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-compass-indicator': ObcCompassIndicator;\n  }\n}\n"],"names":["CompassIndicatorType","CompassIndicatorDirection"],"mappings":"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"}

package/dist/navigation-instruments/velocity-projection-plot/velocity-projection-plot.d.ts

@@ -9,10 +9,10 @@ export interface VelocityProjectionDatapoint {
 }
 export declare class ObcVelocityProjectionPlot extends LitElement {
     dataPoints: VelocityProjectionDatapoint[];
-    instantWindDirectionDeg: number | null;
-    instantWindSpeedNumber: number | null;
-    instantCurrentDirectionDeg: number | null;
-    instantCurrentSpeedNumber: number | null;
+    currentWindFromDirection: number | null;
+    currentWindSpeedKnots: number | null;
+    currentFromDirection: number | null;
+    currentSpeedKnots: number | null;
     vesselImage: VesselImage;
     render(): import('lit-html').TemplateResult<1>;
     private isSelected;

package/dist/navigation-instruments/velocity-projection-plot/velocity-projection-plot.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"velocity-projection-plot.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/velocity-projection-plot/velocity-projection-plot.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EAMX,MAAM,KAAK,CAAC;AAGb,OAAO,mBAAmB,CAAC;AAC3B,OAAO,EAAC,WAAW,EAAkB,MAAM,mBAAmB,CAAC;AAG/D,MAAM,WAAW,2BAA2B;IAC1C,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,4BAA4B,EAAE,MAAM,CAAC;IACrC,gBAAgB,EAAE,MAAM,CAAC;CAC1B;AAED,qBACa,yBAA0B,SAAQ,UAAU;IAEvD,UAAU,EAAE,2BAA2B,EAAE,CAAM;IAE/C,uBAAuB,EAAE,MAAM,GAAG,IAAI,CAAQ;IAE9C,sBAAsB,EAAE,MAAM,GAAG,IAAI,CAAQ;IAE7C,0BAA0B,EAAE,MAAM,GAAG,IAAI,CAAQ;IAEjD,yBAAyB,EAAE,MAAM,GAAG,IAAI,CAAQ;IAEhD,WAAW,EAAE,WAAW,CAA4B;IAC3C,MAAM;IA4Bf,OAAO,CAAC,UAAU;IASlB,OAAO,CAAC,KAAK;IAoBb,OAAO,CAAC,eAAe;IAiEvB,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,8BAA8B,EAAE,yBAAyB,CAAC;KAC3D;CACF"}
+{"version":3,"file":"velocity-projection-plot.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/velocity-projection-plot/velocity-projection-plot.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EAMX,MAAM,KAAK,CAAC;AAGb,OAAO,mBAAmB,CAAC;AAC3B,OAAO,EAAC,WAAW,EAAkB,MAAM,mBAAmB,CAAC;AAG/D,MAAM,WAAW,2BAA2B;IAC1C,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,4BAA4B,EAAE,MAAM,CAAC;IACrC,gBAAgB,EAAE,MAAM,CAAC;CAC1B;AAED,qBACa,yBAA0B,SAAQ,UAAU;IAEvD,UAAU,EAAE,2BAA2B,EAAE,CAAM;IAE/C,wBAAwB,EAAE,MAAM,GAAG,IAAI,CAAQ;IAE/C,qBAAqB,EAAE,MAAM,GAAG,IAAI,CAAQ;IAE5C,oBAAoB,EAAE,MAAM,GAAG,IAAI,CAAQ;IAE3C,iBAAiB,EAAE,MAAM,GAAG,IAAI,CAAQ;IAExC,WAAW,EAAE,WAAW,CAA4B;IAC3C,MAAM;IAgCf,OAAO,CAAC,UAAU;IASlB,OAAO,CAAC,KAAK;IAoBb,OAAO,CAAC,eAAe;IAiEvB,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,8BAA8B,EAAE,yBAAyB,CAAC;KAC3D;CACF"}

package/dist/navigation-instruments/velocity-projection-plot/velocity-projection-plot.js

@@ -18,15 +18,16 @@ let ObcVelocityProjectionPlot = class extends LitElement {
   constructor() {
     super(...arguments);
     this.dataPoints = [];
-    this.instantWindDirectionDeg = null;
-    this.instantWindSpeedNumber = null;
-    this.instantCurrentDirectionDeg = null;
-    this.instantCurrentSpeedNumber = null;
+    this.currentWindFromDirection = null;
+    this.currentWindSpeedKnots = null;
+    this.currentFromDirection = null;
+    this.currentSpeedKnots = null;
     this.vesselImage = VesselImage.cargoWindTop;
   }
   render() {
     const width = 320;
     const viewBox = `-${width / 2} -${width / 2} ${width} ${width}`;
+    const currentLevel = this.currentSpeedKnots == null ? null : Math.max(0, Math.min(4, Math.round(this.currentSpeedKnots)));
     return html`
       <div class="container">
         <obc-watch
@@ -39,10 +40,10 @@ let ObcVelocityProjectionPlot = class extends LitElement {
         transform: ""
       }
     ]}
-          .windFromDirectionDeg=${this.instantWindDirectionDeg}
-          .wind=${this.instantWindSpeedNumber}
-          .currentFromDirectionDeg=${this.instantCurrentDirectionDeg}
-          .current=${this.instantCurrentSpeedNumber}
+          .windFromDirectionDeg=${this.currentWindFromDirection}
+          .windKnots=${this.currentWindSpeedKnots}
+          .currentFromDirectionDeg=${this.currentFromDirection}
+          .current=${currentLevel}
           .padding=${70}
         >
         </obc-watch>
@@ -51,8 +52,8 @@ let ObcVelocityProjectionPlot = class extends LitElement {
     `;
   }
   isSelected(dp) {
-    if (this.instantWindDirectionDeg != null) {
-      return dp.startAngleDeg <= this.instantWindDirectionDeg && dp.endAngleDeg >= this.instantWindDirectionDeg;
+    if (this.currentWindFromDirection != null) {
+      return dp.startAngleDeg <= this.currentWindFromDirection && dp.endAngleDeg >= this.currentWindFromDirection;
     }
     return true;
   }
@@ -123,16 +124,16 @@ __decorateClass([
 ], ObcVelocityProjectionPlot.prototype, "dataPoints", 2);
 __decorateClass([
   property({ type: Number })
-], ObcVelocityProjectionPlot.prototype, "instantWindDirectionDeg", 2);
+], ObcVelocityProjectionPlot.prototype, "currentWindFromDirection", 2);
 __decorateClass([
   property({ type: Number })
-], ObcVelocityProjectionPlot.prototype, "instantWindSpeedNumber", 2);
+], ObcVelocityProjectionPlot.prototype, "currentWindSpeedKnots", 2);
 __decorateClass([
   property({ type: Number })
-], ObcVelocityProjectionPlot.prototype, "instantCurrentDirectionDeg", 2);
+], ObcVelocityProjectionPlot.prototype, "currentFromDirection", 2);
 __decorateClass([
   property({ type: Number })
-], ObcVelocityProjectionPlot.prototype, "instantCurrentSpeedNumber", 2);
+], ObcVelocityProjectionPlot.prototype, "currentSpeedKnots", 2);
 __decorateClass([
   property({ type: String })
 ], ObcVelocityProjectionPlot.prototype, "vesselImage", 2);

package/dist/navigation-instruments/velocity-projection-plot/velocity-projection-plot.js.map

@@ -1 +1 @@
-{"version":3,"file":"velocity-projection-plot.js","sources":["../../../src/navigation-instruments/velocity-projection-plot/velocity-projection-plot.ts"],"sourcesContent":["import {\n  LitElement,\n  SVGTemplateResult,\n  html,\n  nothing,\n  svg,\n  unsafeCSS,\n} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport compentStyle from './velocity-projection-plot.css?inline';\nimport '../watch/watch.js';\nimport {VesselImage, VesselImageSize} from '../watch/watch.js';\nimport {customElement} from '../../decorator.js';\n\nexport interface VelocityProjectionDatapoint {\n  startAngleDeg: number;\n  endAngleDeg: number;\n  ratioWindEnergyOrExcessSpeed: number; // If the ratio is below 1, the value is the ratio of wind energy, if it is above 1, the value is the ratio of excess speed\n  ratioTotalEnergy: number;\n}\n\n@customElement('obc-velocity-projection-plot')\nexport class ObcVelocityProjectionPlot extends LitElement {\n  @property({type: Array, attribute: false})\n  dataPoints: VelocityProjectionDatapoint[] = [];\n  @property({type: Number})\n  instantWindDirectionDeg: number | null = null;\n  @property({type: Number})\n  instantWindSpeedNumber: number | null = null;\n  @property({type: Number})\n  instantCurrentDirectionDeg: number | null = null;\n  @property({type: Number})\n  instantCurrentSpeedNumber: number | null = null;\n  @property({type: String})\n  vesselImage: VesselImage = VesselImage.cargoWindTop;\n  override render() {\n    const width = 320;\n    const viewBox = `-${width / 2} -${width / 2} ${width} ${width}`;\n\n    return html`\n      <div class=\"container\">\n        <obc-watch\n          crosshairEnabled\n          northArrow\n          .vessels=${[\n            {\n              size: VesselImageSize.small,\n              vesselImage: this.vesselImage,\n              transform: '',\n            },\n          ]}\n          .windFromDirectionDeg=${this.instantWindDirectionDeg}\n          .wind=${this.instantWindSpeedNumber}\n          .currentFromDirectionDeg=${this.instantCurrentDirectionDeg}\n          .current=${this.instantCurrentSpeedNumber}\n          .padding=${70}\n        >\n        </obc-watch>\n        <svg viewBox=\"${viewBox}\">${this.renderPlotLines()}</svg>\n      </div>\n    `;\n  }\n\n  private isSelected(dp: VelocityProjectionDatapoint): boolean {\n    if (this.instantWindDirectionDeg != null) {\n      return (\n        dp.startAngleDeg <= this.instantWindDirectionDeg &&\n        dp.endAngleDeg >= this.instantWindDirectionDeg\n      );\n    }\n    return true;\n  }\n  private color(dp: VelocityProjectionDatapoint): {\n    totalEnergy: string;\n    windEnergy: string;\n    speed: string;\n  } {\n    if (this.isSelected(dp)) {\n      return {\n        totalEnergy: 'var(--instrument-frame-tertiary-color)',\n        windEnergy: 'var(--instrument-enhanced-tertiary-color)',\n        speed: 'var(--instrument-enhanced-secondary-color)',\n      };\n    } else {\n      return {\n        totalEnergy: 'var(--instrument-frame-primary-color)',\n        windEnergy: 'var(--instrument-frame-secondary-color)',\n        speed: 'var(--instrument-frame-secondary-color)',\n      };\n    }\n  }\n\n  private renderPlotLines(): SVGTemplateResult {\n    const innerRadius = 65 / 2;\n\n    const dataPoints = this.dataPoints;\n    const maxLength = Math.max(\n      ...dataPoints.map(\n        (dp) => dp.ratioWindEnergyOrExcessSpeed * dp.ratioTotalEnergy\n      ),\n      ...dataPoints.map((dp) => dp.ratioTotalEnergy)\n    );\n\n    const elements = dataPoints.map((dp) => {\n      const startAngle = (dp.startAngleDeg * Math.PI) / 180 - Math.PI / 2;\n      const endAngle = (dp.endAngleDeg * Math.PI) / 180 - Math.PI / 2;\n\n      const c = this.color(dp);\n\n      const totalEnergyRadius =\n        (100 - innerRadius) * (dp.ratioTotalEnergy / maxLength) + innerRadius;\n      const windEnergyOrExcessSpeedRadius =\n        (totalEnergyRadius - innerRadius) * dp.ratioWindEnergyOrExcessSpeed +\n        innerRadius;\n\n      const innerArchPath = `M ${Math.cos(endAngle) * innerRadius} ${Math.sin(endAngle) * innerRadius} A ${innerRadius} ${innerRadius} 0 0 0 ${Math.cos(startAngle) * innerRadius} ${Math.sin(startAngle) * innerRadius}`;\n\n      const totalEnergyArchPath = `${Math.cos(startAngle) * totalEnergyRadius} ${Math.sin(startAngle) * totalEnergyRadius} A ${totalEnergyRadius} ${totalEnergyRadius} 0 0 1 ${Math.cos(endAngle) * totalEnergyRadius} ${Math.sin(endAngle) * totalEnergyRadius}`;\n\n      const windEnergyOrExcessSpeedArchPath = `${Math.cos(startAngle) * windEnergyOrExcessSpeedRadius} ${Math.sin(startAngle) * windEnergyOrExcessSpeedRadius} A ${windEnergyOrExcessSpeedRadius} ${windEnergyOrExcessSpeedRadius} 1 0 1 ${Math.cos(endAngle) * windEnergyOrExcessSpeedRadius} ${Math.sin(endAngle) * windEnergyOrExcessSpeedRadius}`;\n\n      const windEnergyOrExcessSpeedArchPathReverse = `${Math.cos(endAngle) * windEnergyOrExcessSpeedRadius} ${Math.sin(endAngle) * windEnergyOrExcessSpeedRadius} A ${windEnergyOrExcessSpeedRadius} ${windEnergyOrExcessSpeedRadius} 1 0 0 ${Math.cos(startAngle) * windEnergyOrExcessSpeedRadius} ${Math.sin(startAngle) * windEnergyOrExcessSpeedRadius}`;\n      const windEnergyPie = svg`<path d=\"${innerArchPath} L ${windEnergyOrExcessSpeedArchPath} Z\" fill=${c.windEnergy} stroke=${c.windEnergy} stroke-width=\"1\" />`;\n      const windEnergyArch = svg`<path d=\"M${windEnergyOrExcessSpeedArchPath}\" fill=\"none\" stroke=${c.windEnergy} stroke-width=\"1\" />`;\n      const totalEnergyArch = svg`\n      <path d=\"M${totalEnergyArchPath}\" fill=\"none\" stroke=\"var(--border-silhouette-color)\" stroke-width=\"2\" />\n      <path d=\"M${totalEnergyArchPath}\" fill=\"none\" stroke=\"var(--element-inactive-color)\" stroke-width=\"1\" />\n      `;\n\n      const totalEneryPie = svg`<path d=\"${innerArchPath} L ${totalEnergyArchPath} Z\" fill=${c.totalEnergy}/>`;\n\n      const speedPie =\n        dp.ratioWindEnergyOrExcessSpeed > 1\n          ? svg`<path d=\"M${totalEnergyArchPath} L ${windEnergyOrExcessSpeedArchPathReverse} Z\" fill=${c.speed}/>`\n          : nothing;\n\n      const maxRadius =\n        Math.max(totalEnergyRadius, windEnergyOrExcessSpeedRadius) + 0.5;\n      const minRadius = innerRadius - 0.5;\n      const startLine = svg`<line x1=\"${Math.cos(startAngle) * minRadius}\" y1=\"${Math.sin(startAngle) * minRadius}\" x2=\"${Math.cos(startAngle) * maxRadius}\" y2=\"${Math.sin(startAngle) * maxRadius}\" stroke=\"var(--border-silhouette-color)\" stroke-width=\"1\" />`;\n      const endLine = svg`<line x1=\"${Math.cos(endAngle) * minRadius}\" y1=\"${Math.sin(endAngle) * minRadius}\" x2=\"${Math.cos(endAngle) * maxRadius}\" y2=\"${Math.sin(endAngle) * maxRadius}\" stroke=\"var(--border-silhouette-color)\" stroke-width=\"1\" />`;\n      return svg`<g>\n      ${totalEneryPie}\n        ${windEnergyPie}\n        ${speedPie}\n        ${totalEnergyArch}\n        ${windEnergyArch}\n        ${startLine}\n        ${endLine}\n      </g>`;\n    });\n\n    return svg`<g>\n        ${elements}\n      </g>`;\n  }\n\n  static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-velocity-projection-plot': ObcVelocityProjectionPlot;\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"velocity-projection-plot.js","sources":["../../../src/navigation-instruments/velocity-projection-plot/velocity-projection-plot.ts"],"sourcesContent":["import {\n  LitElement,\n  SVGTemplateResult,\n  html,\n  nothing,\n  svg,\n  unsafeCSS,\n} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport compentStyle from './velocity-projection-plot.css?inline';\nimport '../watch/watch.js';\nimport {VesselImage, VesselImageSize} from '../watch/watch.js';\nimport {customElement} from '../../decorator.js';\n\nexport interface VelocityProjectionDatapoint {\n  startAngleDeg: number;\n  endAngleDeg: number;\n  ratioWindEnergyOrExcessSpeed: number; // If the ratio is below 1, the value is the ratio of wind energy, if it is above 1, the value is the ratio of excess speed\n  ratioTotalEnergy: number;\n}\n\n@customElement('obc-velocity-projection-plot')\nexport class ObcVelocityProjectionPlot extends LitElement {\n  @property({type: Array, attribute: false})\n  dataPoints: VelocityProjectionDatapoint[] = [];\n  @property({type: Number})\n  currentWindFromDirection: number | null = null;\n  @property({type: Number})\n  currentWindSpeedKnots: number | null = null;\n  @property({type: Number})\n  currentFromDirection: number | null = null;\n  @property({type: Number})\n  currentSpeedKnots: number | null = null;\n  @property({type: String})\n  vesselImage: VesselImage = VesselImage.cargoWindTop;\n  override render() {\n    const width = 320;\n    const viewBox = `-${width / 2} -${width / 2} ${width} ${width}`;\n    const currentLevel =\n      this.currentSpeedKnots == null\n        ? null\n        : Math.max(0, Math.min(4, Math.round(this.currentSpeedKnots)));\n\n    return html`\n      <div class=\"container\">\n        <obc-watch\n          crosshairEnabled\n          northArrow\n          .vessels=${[\n            {\n              size: VesselImageSize.small,\n              vesselImage: this.vesselImage,\n              transform: '',\n            },\n          ]}\n          .windFromDirectionDeg=${this.currentWindFromDirection}\n          .windKnots=${this.currentWindSpeedKnots}\n          .currentFromDirectionDeg=${this.currentFromDirection}\n          .current=${currentLevel}\n          .padding=${70}\n        >\n        </obc-watch>\n        <svg viewBox=\"${viewBox}\">${this.renderPlotLines()}</svg>\n      </div>\n    `;\n  }\n\n  private isSelected(dp: VelocityProjectionDatapoint): boolean {\n    if (this.currentWindFromDirection != null) {\n      return (\n        dp.startAngleDeg <= this.currentWindFromDirection &&\n        dp.endAngleDeg >= this.currentWindFromDirection\n      );\n    }\n    return true;\n  }\n  private color(dp: VelocityProjectionDatapoint): {\n    totalEnergy: string;\n    windEnergy: string;\n    speed: string;\n  } {\n    if (this.isSelected(dp)) {\n      return {\n        totalEnergy: 'var(--instrument-frame-tertiary-color)',\n        windEnergy: 'var(--instrument-enhanced-tertiary-color)',\n        speed: 'var(--instrument-enhanced-secondary-color)',\n      };\n    } else {\n      return {\n        totalEnergy: 'var(--instrument-frame-primary-color)',\n        windEnergy: 'var(--instrument-frame-secondary-color)',\n        speed: 'var(--instrument-frame-secondary-color)',\n      };\n    }\n  }\n\n  private renderPlotLines(): SVGTemplateResult {\n    const innerRadius = 65 / 2;\n\n    const dataPoints = this.dataPoints;\n    const maxLength = Math.max(\n      ...dataPoints.map(\n        (dp) => dp.ratioWindEnergyOrExcessSpeed * dp.ratioTotalEnergy\n      ),\n      ...dataPoints.map((dp) => dp.ratioTotalEnergy)\n    );\n\n    const elements = dataPoints.map((dp) => {\n      const startAngle = (dp.startAngleDeg * Math.PI) / 180 - Math.PI / 2;\n      const endAngle = (dp.endAngleDeg * Math.PI) / 180 - Math.PI / 2;\n\n      const c = this.color(dp);\n\n      const totalEnergyRadius =\n        (100 - innerRadius) * (dp.ratioTotalEnergy / maxLength) + innerRadius;\n      const windEnergyOrExcessSpeedRadius =\n        (totalEnergyRadius - innerRadius) * dp.ratioWindEnergyOrExcessSpeed +\n        innerRadius;\n\n      const innerArchPath = `M ${Math.cos(endAngle) * innerRadius} ${Math.sin(endAngle) * innerRadius} A ${innerRadius} ${innerRadius} 0 0 0 ${Math.cos(startAngle) * innerRadius} ${Math.sin(startAngle) * innerRadius}`;\n\n      const totalEnergyArchPath = `${Math.cos(startAngle) * totalEnergyRadius} ${Math.sin(startAngle) * totalEnergyRadius} A ${totalEnergyRadius} ${totalEnergyRadius} 0 0 1 ${Math.cos(endAngle) * totalEnergyRadius} ${Math.sin(endAngle) * totalEnergyRadius}`;\n\n      const windEnergyOrExcessSpeedArchPath = `${Math.cos(startAngle) * windEnergyOrExcessSpeedRadius} ${Math.sin(startAngle) * windEnergyOrExcessSpeedRadius} A ${windEnergyOrExcessSpeedRadius} ${windEnergyOrExcessSpeedRadius} 1 0 1 ${Math.cos(endAngle) * windEnergyOrExcessSpeedRadius} ${Math.sin(endAngle) * windEnergyOrExcessSpeedRadius}`;\n\n      const windEnergyOrExcessSpeedArchPathReverse = `${Math.cos(endAngle) * windEnergyOrExcessSpeedRadius} ${Math.sin(endAngle) * windEnergyOrExcessSpeedRadius} A ${windEnergyOrExcessSpeedRadius} ${windEnergyOrExcessSpeedRadius} 1 0 0 ${Math.cos(startAngle) * windEnergyOrExcessSpeedRadius} ${Math.sin(startAngle) * windEnergyOrExcessSpeedRadius}`;\n      const windEnergyPie = svg`<path d=\"${innerArchPath} L ${windEnergyOrExcessSpeedArchPath} Z\" fill=${c.windEnergy} stroke=${c.windEnergy} stroke-width=\"1\" />`;\n      const windEnergyArch = svg`<path d=\"M${windEnergyOrExcessSpeedArchPath}\" fill=\"none\" stroke=${c.windEnergy} stroke-width=\"1\" />`;\n      const totalEnergyArch = svg`\n      <path d=\"M${totalEnergyArchPath}\" fill=\"none\" stroke=\"var(--border-silhouette-color)\" stroke-width=\"2\" />\n      <path d=\"M${totalEnergyArchPath}\" fill=\"none\" stroke=\"var(--element-inactive-color)\" stroke-width=\"1\" />\n      `;\n\n      const totalEneryPie = svg`<path d=\"${innerArchPath} L ${totalEnergyArchPath} Z\" fill=${c.totalEnergy}/>`;\n\n      const speedPie =\n        dp.ratioWindEnergyOrExcessSpeed > 1\n          ? svg`<path d=\"M${totalEnergyArchPath} L ${windEnergyOrExcessSpeedArchPathReverse} Z\" fill=${c.speed}/>`\n          : nothing;\n\n      const maxRadius =\n        Math.max(totalEnergyRadius, windEnergyOrExcessSpeedRadius) + 0.5;\n      const minRadius = innerRadius - 0.5;\n      const startLine = svg`<line x1=\"${Math.cos(startAngle) * minRadius}\" y1=\"${Math.sin(startAngle) * minRadius}\" x2=\"${Math.cos(startAngle) * maxRadius}\" y2=\"${Math.sin(startAngle) * maxRadius}\" stroke=\"var(--border-silhouette-color)\" stroke-width=\"1\" />`;\n      const endLine = svg`<line x1=\"${Math.cos(endAngle) * minRadius}\" y1=\"${Math.sin(endAngle) * minRadius}\" x2=\"${Math.cos(endAngle) * maxRadius}\" y2=\"${Math.sin(endAngle) * maxRadius}\" stroke=\"var(--border-silhouette-color)\" stroke-width=\"1\" />`;\n      return svg`<g>\n      ${totalEneryPie}\n        ${windEnergyPie}\n        ${speedPie}\n        ${totalEnergyArch}\n        ${windEnergyArch}\n        ${startLine}\n        ${endLine}\n      </g>`;\n    });\n\n    return svg`<g>\n        ${elements}\n      </g>`;\n  }\n\n  static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-velocity-projection-plot': ObcVelocityProjectionPlot;\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/navigation-instruments/watch/environment.d.ts

@@ -1,6 +1,44 @@
 import { SVGTemplateResult } from 'lit';
+import '../../icons/icon-wind-true-1.js';
+import '../../icons/icon-wind-true-2.js';
+import '../../icons/icon-wind-true-3.js';
+import '../../icons/icon-wind-true-4.js';
+import '../../icons/icon-wind-true-5.js';
+import '../../icons/icon-wind-true-6.js';
+import '../../icons/icon-wind-true-7.js';
+import '../../icons/icon-wind-true-8.js';
+import '../../icons/icon-wind-true-9.js';
+import '../../icons/icon-wind-true-10.js';
+import '../../icons/icon-wind-true-11.js';
+import '../../icons/icon-wind-true-12.js';
+import '../../icons/icon-wind-true-13.js';
+import '../../icons/icon-wind-true-14.js';
+/**
+ * Maps a wind speed in **knots** to a wind-barb icon index in `[1, 14]`.
+ *
+ * Implements the designer-confirmed "Option C" mapping: speeds round to
+ * the nearest 5-knot bucket (with two sub-pennant buckets for calm and
+ * near-calm conditions):
+ *
+ * | Knots range | Icon | Glyph                |
+ * | ----------- | ---- | -------------------- |
+ * | `[0, 0.5)`  | 1    | calm                 |
+ * | `[0.5, 2.5)`| 2    | shaft only           |
+ * | `[2.5, 7.5)`| 3    | shaft + ½ barb       |
+ * | `[7.5, 12.5)`| 4   | shaft + 1 full barb  |
+ * | …5-kn steps…| …    | …                    |
+ * | `[42.5, 47.5)`| 11 | shaft + 4 full + ½   |
+ * | `[47.5, 55)`| 12   | pennant (50 kn)      |
+ * | `[55, 65)`  | 13   | pennant + 1 full barb |
+ * | `[65, ∞)`   | 14   | pennant + 2 full barbs |
+ *
+ * The 55 / 65 / 100-knot buckets currently collapse to the nearest
+ * available icon; dedicated glyphs are tracked for a follow-up icon
+ * refresh. Non-finite / null / undefined inputs fall back to icon 1.
+ */
+export declare function windKnotsToIconIndex(knots: number | null | undefined): number;
 export declare function renderWind(options: {
-    wind: number;
+    windKnots: number;
     fromDirectionDeg: number;
     radius: number;
     color?: string;

package/dist/navigation-instruments/watch/environment.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"environment.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/watch/environment.ts"],"names":[],"mappings":"AAAA,OAAO,EAAM,iBAAiB,EAAC,MAAM,KAAK,CAAC;AAG3C,wBAAgB,UAAU,CAAC,OAAO,EAAE;IAClC,IAAI,EAAE,MAAM,CAAC;IACb,gBAAgB,EAAE,MAAM,CAAC;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,iBAAiB,CAOpB;AAED,wBAAgB,aAAa,CAAC,OAAO,EAAE;IACrC,OAAO,EAAE,MAAM,CAAC;IAChB,gBAAgB,EAAE,MAAM,CAAC;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,iBAAiB,CAOpB;AAiBD,eAAO,MAAM,eAAe,EAAE,MAAM,CAAC,MAAM,EAAE,iBAAiB,CA6G7D,CAAC"}
+{"version":3,"file":"environment.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/watch/environment.ts"],"names":[],"mappings":"AAAA,OAAO,EAAM,iBAAiB,EAAC,MAAM,KAAK,CAAC;AAE3C,OAAO,iCAAiC,CAAC;AACzC,OAAO,iCAAiC,CAAC;AACzC,OAAO,iCAAiC,CAAC;AACzC,OAAO,iCAAiC,CAAC;AACzC,OAAO,iCAAiC,CAAC;AACzC,OAAO,iCAAiC,CAAC;AACzC,OAAO,iCAAiC,CAAC;AACzC,OAAO,iCAAiC,CAAC;AACzC,OAAO,iCAAiC,CAAC;AACzC,OAAO,kCAAkC,CAAC;AAC1C,OAAO,kCAAkC,CAAC;AAC1C,OAAO,kCAAkC,CAAC;AAC1C,OAAO,kCAAkC,CAAC;AAC1C,OAAO,kCAAkC,CAAC;AAgD1C;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,GAAG,MAAM,CAiB7E;AAED,wBAAgB,UAAU,CAAC,OAAO,EAAE;IAClC,SAAS,EAAE,MAAM,CAAC;IAClB,gBAAgB,EAAE,MAAM,CAAC;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,iBAAiB,CAkBpB;AAED,wBAAgB,aAAa,CAAC,OAAO,EAAE;IACrC,OAAO,EAAE,MAAM,CAAC;IAChB,gBAAgB,EAAE,MAAM,CAAC;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,iBAAiB,CAOpB;AAiBD,eAAO,MAAM,eAAe,EAAE,MAAM,CAAC,MAAM,EAAE,iBAAiB,CA6B7D,CAAC"}