@oicl/openbridge-webcomponents-full-bundle 2.0.0-next.158 → 2.0.0-next.159

package/dist/components/command-menu/command-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"command-menu.js","sources":["../../../src/components/command-menu/command-menu.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS, nothing} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport compentStyle from './command-menu.css?inline';\nimport '../start-stop-switch/start-stop-switch.js';\nimport '../../icons/icon-command-in.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {ObcStartStopSwitchChangeEvent} from '../start-stop-switch/start-stop-switch.js';\nimport {customElement} from '../../decorator.js';\n\nexport type ObcCommandMenuChangeEvent = CustomEvent<{inCommand: boolean}>;\n\n/**\n * `<obc-command-menu>` – A toggleable command status menu for switching between \"in command\" and \"no command\" states.\n *\n * Displays the current command status, description, and (optionally) location, along with a prominent toggle control for taking or releasing command. The component is designed for scenarios where a user needs to view and change the active command state for a system or station.\n *\n * ---\n *\n * ### Features\n * - **Command State Toggle:** Switch between \"in command\" and \"no command\" states using an integrated toggle (based on `obc-start-stop-switch`).\n * - **Status Display:** Shows a customizable status label, description, and optional location for the current command.\n * - **Icon Support:** Accepts custom icons for command state via slots.\n * - **Customizable Labels:** All action and state labels for the toggle can be customized via slots.\n * - **Visual Feedback:** The component visually distinguishes between \"in command\" and \"no command\" states, including color and icon changes.\n * - **Location Support:** Optionally displays the location of the command if `showLocation` is true.\n *\n * ---\n *\n * ### Usage Guidelines\n * Use `<obc-command-menu>` to present and manage the active command state for a system, device, or station. It is ideal when users need to clearly see the current command status and quickly toggle control. The component is suitable for dashboards, control panels, or any interface where command handover is required.\n *\n * **TODO(designer):** Confirm if there are recommended icons, color schemes, or text length limits for status/description. Clarify if there are any constraints on when to use this component versus other status/toggle components.\n *\n * ---\n *\n * ### Slots\n * | Slot Name                             | Renders When...                | Purpose                                                         |\n * |---------------------------------------|-------------------------------|-----------------------------------------------------------------|\n * | `command-icon`                        | Always                        | Main icon representing the current command state.               |\n * | `command-status`                      | Always                        | Status label (e.g., \"Joystick\", \"NO CMD\").                      |\n * | `command-description`                 | Always                        | Description of the command state (e.g., \"DP\", \"CMD at DP\").     |\n * | `command-location`                    | `showLocation` is true        | Location label for the command (e.g., \"Aft Bridge\").            |\n * | `toogle-action-to-in-command-label`   | Always                        | Label for the action to take command (toggle to \"in command\").  |\n * | `toogle-action-to-no-command-label`   | Always                        | Label for the action to release command (toggle to \"no command\").|\n * | `toogle-state-in-command-label`       | Always                        | Status label when in \"in command\" state.                        |\n * | `toogle-state-no-command-label`       | Always                        | Status label when in \"no command\" state.                        |\n * | `toogle-state-in-command-icon`        | Always                        | Icon for the \"in command\" state (defaults to `<obi-command-in>`).|\n *\n * ---\n *\n * ### Properties and Attributes\n * - **`inCommand`** (`boolean`): Whether the menu is in the \"in command\" state. Controls the toggle and visual state. (Default: `false`)\n * - **`showLocation`** (`boolean`): Whether to display the location slot. If `false`, the location is omitted. (Default: `true`)\n *\n * ---\n *\n * ### Events\n * - **`change`** – Fired when the command state is toggled. The event detail contains `{inCommand: boolean}` indicating the new state.\n *\n * ---\n *\n * ### Best Practices & Constraints\n * - Use clear, concise labels for status and actions to ensure quick recognition.\n * - Only display the location if it is relevant to the command context.\n * - Ensure that only one command menu is active for a given system at a time to avoid conflicting states.\n * - For accessibility, provide meaningful icons and text in all slots.\n * - **TODO(designer):** Specify if there are any timing, animation, or accessibility requirements for the toggle interaction.\n *\n * ---\n *\n * ### Example\n * ```html\n * <obc-command-menu .inCommand=${true}>\n *   <div slot=\"command-icon\"><obi-joystick></obi-joystick></div>\n *   <div slot=\"command-status\">Joystick</div>\n *   <div slot=\"command-description\">DP</div>\n *   <div slot=\"command-location\">Aft Bridge</div>\n *   <div slot=\"toogle-action-to-in-command-label\">Take</div>\n *   <div slot=\"toogle-action-to-no-command-label\">Release</div>\n *   <div slot=\"toogle-state-in-command-label\">In CMD</div>\n *   <div slot=\"toogle-state-no-command-label\">DP Aft Bridge</div>\n * </obc-command-menu>\n * ```\n *\n * @property inCommand - Whether the menu is in the \"in command\" state.\n *   Controls the toggle and visual state.\n * @property showLocation - Whether to display the location slot.\n *   If false, the location is omitted from the menu.\n * @slot command-icon - Main icon representing the current command state.\n * @slot command-status - Status label (e.g., \"Joystick\", \"NO CMD\").\n * @slot command-description - Description of the command state.\n * @slot command-location - Location label for the command (shown if `showLocation` is true).\n * @slot toogle-action-to-in-command-label - Label for the action to take command.\n * @slot toogle-action-to-no-command-label - Label for the action to release command.\n * @slot toogle-state-in-command-label - Status label when in \"in command\" state.\n * @slot toogle-state-no-command-label - Status label when in \"no command\" state.\n * @slot toogle-state-in-command-icon - Icon for the \"in command\" state (defaults to `<obi-command-in>`).\n * @fires {CustomEvent<{inCommand: boolean}>} change - Fired when the command state is toggled.\n * @beta\n */\n@customElement('obc-command-menu')\nexport class ObcCommandMenu extends LitElement {\n  @property({type: Boolean}) inCommand = false;\n\n  @property({type: Boolean, attribute: false}) showLocation: boolean = true;\n\n  override render() {\n    return html`\n      <div\n        class=${classMap({\n          card: true,\n          'in-command': this.inCommand,\n          'no-command': !this.inCommand,\n          'has-location': this.showLocation,\n        })}\n      >\n        <div class=\"title-container\">Command</div>\n        <div class=\"command-container\">\n          <div class=\"value-container\">\n            <div class=\"icon command\">\n              <slot name=\"command-icon\"></slot>\n            </div>\n            <div class=\"value\">\n              <div class=\"status\">\n                <slot name=\"command-status\"></slot>\n              </div>\n              <div class=\"description\">\n                <div class=\"command-description\">\n                  <slot name=\"command-description\"></slot>\n                </div>\n                ${this.showLocation\n                  ? html` <div class=\"divider\"></div>\n                      <div class=\"command-location\">\n                        <slot name=\"command-location\"></slot>\n                      </div>`\n                  : nothing}\n              </div>\n            </div>\n          </div>\n          <div class=\"action-container\">\n            <obc-start-stop-switch\n              @change=${this.onChange}\n              .checked=${this.inCommand}\n              showCheckedStateIcon\n              .size=${'large'}\n            >\n              <div slot=\"to-checked-action-label\">\n                <slot name=\"toogle-action-to-in-command-label\"></slot>\n              </div>\n              <div slot=\"to-unchecked-action-label\">\n                <slot name=\"toogle-action-to-no-command-label\"></slot>\n              </div>\n              <div slot=\"checked-state-label\">\n                <slot name=\"toogle-state-in-command-label\"></slot>\n              </div>\n              <div slot=\"checked-state-icon\">\n                <slot name=\"toogle-state-in-command-icon\">\n                  <obi-command-in></obi-command-in>\n                </slot>\n              </div>\n              <div slot=\"unchecked-state-label\">\n                <slot name=\"toogle-state-no-command-label\"></slot>\n              </div>\n            </obc-start-stop-switch>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  /**\n   * Handles the toggle change event from the start-stop switch and emits a `change` event with the new command state.\n   *\n   * @fires change\n   */\n  private onChange(event: ObcStartStopSwitchChangeEvent) {\n    // Stop the start-stop-switch's composed event from leaking through\n    // our shadow DOM — consumers should only see command-menu's own event.\n    event.stopPropagation();\n    const newValue = event.detail.checked;\n    this.inCommand = newValue;\n    this.dispatchEvent(\n      new CustomEvent<{inCommand: boolean}>('change', {\n        detail: {inCommand: newValue},\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-command-menu': ObcCommandMenu;\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAqGO,IAAM,iBAAN,cAA6B,WAAW;AAAA,EAAxC,cAAA;AAAA,UAAA,GAAA,SAAA;AACsB,SAAA,YAAY;AAEM,SAAA,eAAwB;AAAA,EAAA;AAAA,EAE5D,SAAS;AAChB,WAAO;AAAA;AAAA,gBAEK,SAAS;AAAA,MACf,MAAM;AAAA,MACN,cAAc,KAAK;AAAA,MACnB,cAAc,CAAC,KAAK;AAAA,MACpB,gBAAgB,KAAK;AAAA,IAAA,CACtB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAgBQ,KAAK,eACH;AAAA;AAAA;AAAA,gCAIA,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAMH,KAAK,QAAQ;AAAA,yBACZ,KAAK,SAAS;AAAA;AAAA,sBAEjB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAwB3B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOQ,SAAS,OAAsC;AAGrD,UAAM,gBAAA;AACN,UAAM,WAAW,MAAM,OAAO;AAC9B,SAAK,YAAY;AACjB,SAAK;AAAA,MACH,IAAI,YAAkC,UAAU;AAAA,QAC9C,QAAQ,EAAC,WAAW,SAAA;AAAA,QACpB,SAAS;AAAA,QACT,UAAU;AAAA,MAAA,CACX;AAAA,IAAA;AAAA,EAEL;AAGF;AA1Fa,eAyFK,SAAS,UAAU,YAAY;AAxFpB,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GADd,eACgB,WAAA,aAAA,CAAA;AAEkB,gBAAA;AAAA,EAA5C,SAAS,EAAC,MAAM,SAAS,WAAW,OAAM;AAAA,GAHhC,eAGkC,WAAA,gBAAA,CAAA;AAHlC,iBAAN,gBAAA;AAAA,EADN,cAAc,kBAAkB;AAAA,GACpB,cAAA;"}
+{"version":3,"file":"command-menu.js","sources":["../../../src/components/command-menu/command-menu.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS, nothing} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport compentStyle from './command-menu.css?inline';\nimport '../start-stop-switch/start-stop-switch.js';\nimport '../../icons/icon-command-in.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {ObcStartStopSwitchChangeEvent} from '../start-stop-switch/start-stop-switch.js';\nimport {customElement} from '../../decorator.js';\n\nexport type ObcCommandMenuChangeEvent = CustomEvent<{inCommand: boolean}>;\n\n/**\n * `<obc-command-menu>` – A toggleable command status menu for switching between \"in command\" and \"no command\" states.\n *\n * Displays the current command status, description, and (optionally) location, along with a prominent toggle control for taking or releasing command. The component is designed for scenarios where a user needs to view and change the active command state for a system or station.\n *\n * ---\n *\n * ### Features\n * - **Command State Toggle:** Switch between \"in command\" and \"no command\" states using an integrated toggle (based on `obc-start-stop-switch`).\n * - **Status Display:** Shows a customizable status label, description, and optional location for the current command.\n * - **Icon Support:** Accepts custom icons for command state via slots.\n * - **Customizable Labels:** All action and state labels for the toggle can be customized via slots.\n * - **Visual Feedback:** The component visually distinguishes between \"in command\" and \"no command\" states, including color and icon changes.\n * - **Location Support:** Optionally displays the location of the command if `showLocation` is true.\n *\n * ---\n *\n * ### Usage Guidelines\n * Use `<obc-command-menu>` to present and manage the active command state for a system, device, or station. It is ideal when users need to clearly see the current command status and quickly toggle control. The component is suitable for dashboards, control panels, or any interface where command handover is required.\n *\n * **TODO(designer):** Confirm if there are recommended icons, color schemes, or text length limits for status/description. Clarify if there are any constraints on when to use this component versus other status/toggle components.\n *\n * ---\n *\n * ### Slots\n * | Slot Name                             | Renders When...                | Purpose                                                         |\n * |---------------------------------------|-------------------------------|-----------------------------------------------------------------|\n * | `command-icon`                        | Always                        | Main icon representing the current command state.               |\n * | `command-status`                      | Always                        | Status label (e.g., \"Joystick\", \"NO CMD\").                      |\n * | `command-description`                 | Always                        | Description of the command state (e.g., \"DP\", \"CMD at DP\").     |\n * | `command-location`                    | `showLocation` is true        | Location label for the command (e.g., \"Aft Bridge\").            |\n * | `toogle-action-to-in-command-label`   | Always                        | Label for the action to take command (toggle to \"in command\").  |\n * | `toogle-action-to-no-command-label`   | Always                        | Label for the action to release command (toggle to \"no command\").|\n * | `toogle-state-in-command-label`       | Always                        | Status label when in \"in command\" state.                        |\n * | `toogle-state-no-command-label`       | Always                        | Status label when in \"no command\" state.                        |\n * | `toogle-state-in-command-icon`        | Always                        | Icon for the \"in command\" state (defaults to `<obi-command-in>`).|\n *\n * ---\n *\n * ### Properties and Attributes\n * - **`inCommand`** (`boolean`): Whether the menu is in the \"in command\" state. Controls the toggle and visual state. (Default: `false`)\n * - **`showLocation`** (`boolean`): Whether to display the location slot. If `false`, the location is omitted. (Default: `true`)\n *\n * ---\n *\n * ### Events\n * - **`change`** – Fired when the command state is toggled. The event detail contains `{inCommand: boolean}` indicating the new state.\n *\n * ---\n *\n * ### Best Practices & Constraints\n * - Use clear, concise labels for status and actions to ensure quick recognition.\n * - Only display the location if it is relevant to the command context.\n * - Ensure that only one command menu is active for a given system at a time to avoid conflicting states.\n * - For accessibility, provide meaningful icons and text in all slots.\n * - **TODO(designer):** Specify if there are any timing, animation, or accessibility requirements for the toggle interaction.\n *\n * ---\n *\n * ### Example\n * ```html\n * <obc-command-menu .inCommand=${true}>\n *   <div slot=\"command-icon\"><obi-joystick></obi-joystick></div>\n *   <div slot=\"command-status\">Joystick</div>\n *   <div slot=\"command-description\">DP</div>\n *   <div slot=\"command-location\">Aft Bridge</div>\n *   <div slot=\"toogle-action-to-in-command-label\">Take</div>\n *   <div slot=\"toogle-action-to-no-command-label\">Release</div>\n *   <div slot=\"toogle-state-in-command-label\">In CMD</div>\n *   <div slot=\"toogle-state-no-command-label\">DP Aft Bridge</div>\n * </obc-command-menu>\n * ```\n *\n * @property inCommand - Whether the menu is in the \"in command\" state.\n *   Controls the toggle and visual state.\n * @property showLocation - Whether to display the location slot.\n *   If false, the location is omitted from the menu.\n * @slot command-icon - Main icon representing the current command state.\n * @slot command-status - Status label (e.g., \"Joystick\", \"NO CMD\").\n * @slot command-description - Description of the command state.\n * @slot command-location - Location label for the command (shown if `showLocation` is true).\n * @slot toogle-action-to-in-command-label - Label for the action to take command.\n * @slot toogle-action-to-no-command-label - Label for the action to release command.\n * @slot toogle-state-in-command-label - Status label when in \"in command\" state.\n * @slot toogle-state-no-command-label - Status label when in \"no command\" state.\n * @slot toogle-state-in-command-icon - Icon for the \"in command\" state (defaults to `<obi-command-in>`).\n * @fires {CustomEvent<{inCommand: boolean}>} change - Fired when the command state is toggled.\n * @beta\n */\n@customElement('obc-command-menu')\nexport class ObcCommandMenu extends LitElement {\n  @property({type: Boolean}) inCommand = false;\n\n  @property({type: Boolean, attribute: false}) showLocation: boolean = true;\n\n  override render() {\n    return html`\n      <div\n        class=${classMap({\n          card: true,\n          'in-command': this.inCommand,\n          'no-command': !this.inCommand,\n          'has-location': this.showLocation,\n        })}\n      >\n        <div class=\"title-container\">Command</div>\n        <div class=\"command-container\">\n          <div class=\"value-container\">\n            <div class=\"icon command\">\n              <slot name=\"command-icon\"></slot>\n            </div>\n            <div class=\"value\">\n              <div class=\"status\">\n                <slot name=\"command-status\"></slot>\n              </div>\n              <div class=\"description\">\n                <div class=\"command-description\">\n                  <slot name=\"command-description\"></slot>\n                </div>\n                ${this.showLocation\n                  ? html` <div class=\"divider\"></div>\n                      <div class=\"command-location\">\n                        <slot name=\"command-location\"></slot>\n                      </div>`\n                  : nothing}\n              </div>\n            </div>\n          </div>\n          <div class=\"action-container\">\n            <obc-start-stop-switch\n              @change=${this.onChange}\n              .checked=${this.inCommand}\n              .size=${'large'}\n            >\n              <div slot=\"to-checked-action-label\">\n                <slot name=\"toogle-action-to-in-command-label\"></slot>\n              </div>\n              <div slot=\"to-unchecked-action-label\">\n                <slot name=\"toogle-action-to-no-command-label\"></slot>\n              </div>\n              <div slot=\"checked-state-label\">\n                <slot name=\"toogle-state-in-command-label\"></slot>\n              </div>\n              <div slot=\"checked-state-icon\">\n                <slot name=\"toogle-state-in-command-icon\">\n                  <obi-command-in></obi-command-in>\n                </slot>\n              </div>\n              <div slot=\"unchecked-state-label\">\n                <slot name=\"toogle-state-no-command-label\"></slot>\n              </div>\n            </obc-start-stop-switch>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  /**\n   * Handles the toggle change event from the start-stop switch and emits a `change` event with the new command state.\n   *\n   * @fires change\n   */\n  private onChange(event: ObcStartStopSwitchChangeEvent) {\n    // Stop the start-stop-switch's composed event from leaking through\n    // our shadow DOM — consumers should only see command-menu's own event.\n    event.stopPropagation();\n    const newValue = event.detail.checked;\n    this.inCommand = newValue;\n    this.dispatchEvent(\n      new CustomEvent<{inCommand: boolean}>('change', {\n        detail: {inCommand: newValue},\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-command-menu': ObcCommandMenu;\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAqGO,IAAM,iBAAN,cAA6B,WAAW;AAAA,EAAxC,cAAA;AAAA,UAAA,GAAA,SAAA;AACsB,SAAA,YAAY;AAEM,SAAA,eAAwB;AAAA,EAAA;AAAA,EAE5D,SAAS;AAChB,WAAO;AAAA;AAAA,gBAEK,SAAS;AAAA,MACf,MAAM;AAAA,MACN,cAAc,KAAK;AAAA,MACnB,cAAc,CAAC,KAAK;AAAA,MACpB,gBAAgB,KAAK;AAAA,IAAA,CACtB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAgBQ,KAAK,eACH;AAAA;AAAA;AAAA,gCAIA,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAMH,KAAK,QAAQ;AAAA,yBACZ,KAAK,SAAS;AAAA,sBACjB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAwB3B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOQ,SAAS,OAAsC;AAGrD,UAAM,gBAAA;AACN,UAAM,WAAW,MAAM,OAAO;AAC9B,SAAK,YAAY;AACjB,SAAK;AAAA,MACH,IAAI,YAAkC,UAAU;AAAA,QAC9C,QAAQ,EAAC,WAAW,SAAA;AAAA,QACpB,SAAS;AAAA,QACT,UAAU;AAAA,MAAA,CACX;AAAA,IAAA;AAAA,EAEL;AAGF;AAzFa,eAwFK,SAAS,UAAU,YAAY;AAvFpB,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GADd,eACgB,WAAA,aAAA,CAAA;AAEkB,gBAAA;AAAA,EAA5C,SAAS,EAAC,MAAM,SAAS,WAAW,OAAM;AAAA,GAHhC,eAGkC,WAAA,gBAAA,CAAA;AAHlC,iBAAN,gBAAA;AAAA,EADN,cAAc,kBAAkB;AAAA,GACpB,cAAA;"}

package/dist/components/notification-badge-button/notification-badge-button.d.ts

@@ -59,7 +59,10 @@ import { LitElement } from 'lit';
  *   Useful for visually separating the button from others or indicating a secondary action.
  * @slot - Main content slot for icon or text label.
  * @fires click - Fired when the button is clicked (if not disabled).
- * @deprecated
+ * @deprecated The notification-badge-button component is deprecated and will be removed in future releases.
+ * Use `obc-icon-button` instead; `openLeft`, `openRight` and `indent` have no
+ * equivalent, and its default slot takes the icon while text goes in the `label`
+ * slot behind `hasLabel`.
  */
 export declare class ObcNotificationBadgeButton extends LitElement {
     /** Removes the right border for seamless grouping with adjacent buttons. Use when this button is not the last in a horizontal group. */

package/dist/components/notification-badge-button/notification-badge-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"notification-badge-button.d.ts","sourceRoot":"","sources":["../../../src/components/notification-badge-button/notification-badge-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAMhD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6DG;AACH,qBACa,0BAA2B,SAAQ,UAAU;IAC7B,SAAS,UAAS;IAElB,QAAQ,UAAS;IAEjB,UAAU,UAAS;IAEnB,WAAW,UAAS;IAEpB,IAAI,UAAS;IAEb,QAAQ,UAAS;IAEjB,MAAM,UAAS;IAEjC,MAAM;IAqBf,OAAgB,MAAM,0BAA6B;CACpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,+BAA+B,EAAE,0BAA0B,CAAC;KAC7D;CACF"}
+{"version":3,"file":"notification-badge-button.d.ts","sourceRoot":"","sources":["../../../src/components/notification-badge-button/notification-badge-button.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAMhD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgEG;AACH,qBACa,0BAA2B,SAAQ,UAAU;IAC7B,SAAS,UAAS;IAElB,QAAQ,UAAS;IAEjB,UAAU,UAAS;IAEnB,WAAW,UAAS;IAEpB,IAAI,UAAS;IAEb,QAAQ,UAAS;IAEjB,MAAM,UAAS;IAEjC,MAAM;IAqBf,OAAgB,MAAM,0BAA6B;CACpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,+BAA+B,EAAE,0BAA0B,CAAC;KAC7D;CACF"}

package/dist/components/notification-badge-button/notification-badge-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"notification-badge-button.js","sources":["../../../src/components/notification-badge-button/notification-badge-button.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport componentStyle from './notification-badge-button.css?inline';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {customElement} from '../../decorator.js';\n\n/**\n * `<obc-notification-badge-button>` – A compact action button for notification-related commands or acknowledgments.\n *\n * This component provides a visually distinct button, often used for quick actions such as acknowledging alerts, muting notifications, or similar context-specific responses. It supports both text and icon content, and can be styled to fit seamlessly into notification bars, toolbars, or grouped button sets.\n *\n * ### Features\n * - **Icon or Text Content:** Supports either a text label (e.g., \"ACK\") or an icon via the default slot.\n * - **Visual Variants:**\n *   - **icon:** Applies icon-specific styling for icon-only buttons.\n *   - **openRight / openLeft:** Removes the border on the right or left, allowing the button to visually connect with adjacent elements (e.g., for grouped buttons).\n *   - **cornerLeft / cornerRight:** Rounds the left or right corners for placement at the start or end of a button group.\n *   - **indent:** Applies an indented background style for emphasis or grouping.\n * - **Disabled State:** Prevents interaction and applies a muted visual style.\n * - **Customizable Width:** Fixed width (64px) ensures consistency in toolbars or notification rows.\n *\n * ### Usage Guidelines\n * Use `obc-notification-badge-button` for actions directly related to notifications, alerts, or quick status changes. It is ideal for scenarios where space is limited and a compact, easily recognizable action is needed—such as in notification trays, alert banners, or grouped with other quick-action buttons.\n *\n * - For icon-only actions (like mute), set the `icon` property and supply an icon in the slot.\n * - For text actions (like \"ACK\"), provide the label as slot content.\n * - Use `openRight`/`openLeft` and `cornerLeft`/`cornerRight` to visually group multiple buttons or align them to the edges of a container.\n * - Use the `disabled` property to indicate unavailable actions.\n *\n * **TODO(designer):** Clarify if there are recommended icon choices or color guidelines for specific notification types, and if there are accessibility requirements (e.g., minimum contrast, focus ring).\n *\n * ### Slots\n *\n * | Slot Name | Renders When... | Purpose |\n * |-----------|-----------------|---------|\n * | (default) | Always          | Main content of the button (icon or text label). |\n *\n * ### Best Practices\n * - Keep button content concise—use a single icon or a short label.\n * - When grouping multiple notification buttons, use the `openRight`/`openLeft` and `cornerLeft`/`cornerRight` properties for seamless visual integration.\n * - For accessibility, ensure that icon-only buttons have an appropriate `aria-label` or accessible text.\n *\n * ### Example:\n * ```\n * <obc-notification-badge-button icon>\n *   <obi-sound-muted-fill></obi-sound-muted-fill>\n * </obc-notification-badge-button>\n *\n * <obc-notification-badge-button>ACK</obc-notification-badge-button>\n * ```\n *\n * @property openRight - Removes the right border for seamless grouping with adjacent buttons.\n *   Use when this button is not the last in a horizontal group.\n * @property openLeft - Removes the left border for seamless grouping with adjacent buttons.\n *   Use when this button is not the first in a horizontal group.\n * @property cornerLeft - Applies rounded corners to the left side of the button.\n *   Use for the first button in a group or when aligning to a container's left edge.\n * @property cornerRight - Applies rounded corners to the right side of the button.\n *   Use for the last button in a group or when aligning to a container's right edge.\n * @property icon - Applies icon-specific styling for icon-only buttons.\n *   When true, supply an icon in the default slot.\n * @property disabled - Disables the button, preventing user interaction and applying a muted style.\n * @property indent - Applies an indented background style for emphasis or grouping.\n *   Useful for visually separating the button from others or indicating a secondary action.\n * @slot - Main content slot for icon or text label.\n * @fires click - Fired when the button is clicked (if not disabled).\n * @deprecated\n */\n@customElement('obc-notification-badge-button')\nexport class ObcNotificationBadgeButton extends LitElement {\n  @property({type: Boolean}) openRight = false;\n\n  @property({type: Boolean}) openLeft = false;\n\n  @property({type: Boolean}) cornerLeft = false;\n\n  @property({type: Boolean}) cornerRight = false;\n\n  @property({type: Boolean}) icon = false;\n\n  @property({type: Boolean}) disabled = false;\n\n  @property({type: Boolean}) indent = false;\n\n  override render() {\n    return html`\n      <button\n        class=${classMap({\n          wrapper: true,\n          'open-right': this.openRight,\n          'open-left': this.openLeft,\n          'corner-left': this.cornerLeft,\n          'corner-right': this.cornerRight,\n          icon: this.icon,\n          indent: this.indent,\n        })}\n        ?disabled=${this.disabled}\n      >\n        <div class=\"visible-wrapper\">\n          <slot></slot>\n        </div>\n      </button>\n    `;\n  }\n\n  static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-notification-badge-button': ObcNotificationBadgeButton;\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAqEO,IAAM,6BAAN,cAAyC,WAAW;AAAA,EAApD,cAAA;AAAA,UAAA,GAAA,SAAA;AACsB,SAAA,YAAY;AAEZ,SAAA,WAAW;AAEX,SAAA,aAAa;AAEb,SAAA,cAAc;AAEd,SAAA,OAAO;AAEP,SAAA,WAAW;AAEX,SAAA,SAAS;AAAA,EAAA;AAAA,EAE3B,SAAS;AAChB,WAAO;AAAA;AAAA,gBAEK,SAAS;AAAA,MACf,SAAS;AAAA,MACT,cAAc,KAAK;AAAA,MACnB,aAAa,KAAK;AAAA,MAClB,eAAe,KAAK;AAAA,MACpB,gBAAgB,KAAK;AAAA,MACrB,MAAM,KAAK;AAAA,MACX,QAAQ,KAAK;AAAA,IAAA,CACd,CAAC;AAAA,oBACU,KAAK,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAO/B;AAGF;AArCa,2BAoCK,SAAS,UAAU,cAAc;AAnCtB,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GADd,2BACgB,WAAA,aAAA,CAAA;AAEA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAHd,2BAGgB,WAAA,YAAA,CAAA;AAEA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GALd,2BAKgB,WAAA,cAAA,CAAA;AAEA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAPd,2BAOgB,WAAA,eAAA,CAAA;AAEA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GATd,2BASgB,WAAA,QAAA,CAAA;AAEA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAXd,2BAWgB,WAAA,YAAA,CAAA;AAEA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAbd,2BAagB,WAAA,UAAA,CAAA;AAbhB,6BAAN,gBAAA;AAAA,EADN,cAAc,+BAA+B;AAAA,GACjC,0BAAA;"}
+{"version":3,"file":"notification-badge-button.js","sources":["../../../src/components/notification-badge-button/notification-badge-button.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport componentStyle from './notification-badge-button.css?inline';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {customElement} from '../../decorator.js';\n\n/**\n * `<obc-notification-badge-button>` – A compact action button for notification-related commands or acknowledgments.\n *\n * This component provides a visually distinct button, often used for quick actions such as acknowledging alerts, muting notifications, or similar context-specific responses. It supports both text and icon content, and can be styled to fit seamlessly into notification bars, toolbars, or grouped button sets.\n *\n * ### Features\n * - **Icon or Text Content:** Supports either a text label (e.g., \"ACK\") or an icon via the default slot.\n * - **Visual Variants:**\n *   - **icon:** Applies icon-specific styling for icon-only buttons.\n *   - **openRight / openLeft:** Removes the border on the right or left, allowing the button to visually connect with adjacent elements (e.g., for grouped buttons).\n *   - **cornerLeft / cornerRight:** Rounds the left or right corners for placement at the start or end of a button group.\n *   - **indent:** Applies an indented background style for emphasis or grouping.\n * - **Disabled State:** Prevents interaction and applies a muted visual style.\n * - **Customizable Width:** Fixed width (64px) ensures consistency in toolbars or notification rows.\n *\n * ### Usage Guidelines\n * Use `obc-notification-badge-button` for actions directly related to notifications, alerts, or quick status changes. It is ideal for scenarios where space is limited and a compact, easily recognizable action is needed—such as in notification trays, alert banners, or grouped with other quick-action buttons.\n *\n * - For icon-only actions (like mute), set the `icon` property and supply an icon in the slot.\n * - For text actions (like \"ACK\"), provide the label as slot content.\n * - Use `openRight`/`openLeft` and `cornerLeft`/`cornerRight` to visually group multiple buttons or align them to the edges of a container.\n * - Use the `disabled` property to indicate unavailable actions.\n *\n * **TODO(designer):** Clarify if there are recommended icon choices or color guidelines for specific notification types, and if there are accessibility requirements (e.g., minimum contrast, focus ring).\n *\n * ### Slots\n *\n * | Slot Name | Renders When... | Purpose |\n * |-----------|-----------------|---------|\n * | (default) | Always          | Main content of the button (icon or text label). |\n *\n * ### Best Practices\n * - Keep button content concise—use a single icon or a short label.\n * - When grouping multiple notification buttons, use the `openRight`/`openLeft` and `cornerLeft`/`cornerRight` properties for seamless visual integration.\n * - For accessibility, ensure that icon-only buttons have an appropriate `aria-label` or accessible text.\n *\n * ### Example:\n * ```\n * <obc-notification-badge-button icon>\n *   <obi-sound-muted-fill></obi-sound-muted-fill>\n * </obc-notification-badge-button>\n *\n * <obc-notification-badge-button>ACK</obc-notification-badge-button>\n * ```\n *\n * @property openRight - Removes the right border for seamless grouping with adjacent buttons.\n *   Use when this button is not the last in a horizontal group.\n * @property openLeft - Removes the left border for seamless grouping with adjacent buttons.\n *   Use when this button is not the first in a horizontal group.\n * @property cornerLeft - Applies rounded corners to the left side of the button.\n *   Use for the first button in a group or when aligning to a container's left edge.\n * @property cornerRight - Applies rounded corners to the right side of the button.\n *   Use for the last button in a group or when aligning to a container's right edge.\n * @property icon - Applies icon-specific styling for icon-only buttons.\n *   When true, supply an icon in the default slot.\n * @property disabled - Disables the button, preventing user interaction and applying a muted style.\n * @property indent - Applies an indented background style for emphasis or grouping.\n *   Useful for visually separating the button from others or indicating a secondary action.\n * @slot - Main content slot for icon or text label.\n * @fires click - Fired when the button is clicked (if not disabled).\n * @deprecated The notification-badge-button component is deprecated and will be removed in future releases.\n * Use `obc-icon-button` instead; `openLeft`, `openRight` and `indent` have no\n * equivalent, and its default slot takes the icon while text goes in the `label`\n * slot behind `hasLabel`.\n */\n@customElement('obc-notification-badge-button')\nexport class ObcNotificationBadgeButton extends LitElement {\n  @property({type: Boolean}) openRight = false;\n\n  @property({type: Boolean}) openLeft = false;\n\n  @property({type: Boolean}) cornerLeft = false;\n\n  @property({type: Boolean}) cornerRight = false;\n\n  @property({type: Boolean}) icon = false;\n\n  @property({type: Boolean}) disabled = false;\n\n  @property({type: Boolean}) indent = false;\n\n  override render() {\n    return html`\n      <button\n        class=${classMap({\n          wrapper: true,\n          'open-right': this.openRight,\n          'open-left': this.openLeft,\n          'corner-left': this.cornerLeft,\n          'corner-right': this.cornerRight,\n          icon: this.icon,\n          indent: this.indent,\n        })}\n        ?disabled=${this.disabled}\n      >\n        <div class=\"visible-wrapper\">\n          <slot></slot>\n        </div>\n      </button>\n    `;\n  }\n\n  static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-notification-badge-button': ObcNotificationBadgeButton;\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;AAwEO,IAAM,6BAAN,cAAyC,WAAW;AAAA,EAApD,cAAA;AAAA,UAAA,GAAA,SAAA;AACsB,SAAA,YAAY;AAEZ,SAAA,WAAW;AAEX,SAAA,aAAa;AAEb,SAAA,cAAc;AAEd,SAAA,OAAO;AAEP,SAAA,WAAW;AAEX,SAAA,SAAS;AAAA,EAAA;AAAA,EAE3B,SAAS;AAChB,WAAO;AAAA;AAAA,gBAEK,SAAS;AAAA,MACf,SAAS;AAAA,MACT,cAAc,KAAK;AAAA,MACnB,aAAa,KAAK;AAAA,MAClB,eAAe,KAAK;AAAA,MACpB,gBAAgB,KAAK;AAAA,MACrB,MAAM,KAAK;AAAA,MACX,QAAQ,KAAK;AAAA,IAAA,CACd,CAAC;AAAA,oBACU,KAAK,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAO/B;AAGF;AArCa,2BAoCK,SAAS,UAAU,cAAc;AAnCtB,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GADd,2BACgB,WAAA,aAAA,CAAA;AAEA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAHd,2BAGgB,WAAA,YAAA,CAAA;AAEA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GALd,2BAKgB,WAAA,cAAA,CAAA;AAEA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAPd,2BAOgB,WAAA,eAAA,CAAA;AAEA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GATd,2BASgB,WAAA,QAAA,CAAA;AAEA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAXd,2BAWgB,WAAA,YAAA,CAAA;AAEA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAbd,2BAagB,WAAA,UAAA,CAAA;AAbhB,6BAAN,gBAAA;AAAA,EADN,cAAc,+BAA+B;AAAA,GACjC,0BAAA;"}

package/dist/components/start-stop-switch/start-stop-switch.d.ts

@@ -107,10 +107,6 @@ export declare class ObcStartStopSwitch extends LitElement {
      * - `running`: Green appearance indicating motor/process is running
      * - `loading`: Light blue appearance indicating a pending/loading state
      *
-     * If `true`, the content of the `checked-state-icon` slot will be displayed when checked.
-     */
-    showUncheckedStateIcon: boolean;
-    /**
      * This only affects the visual style, not the switch position.
      *
      * Defaults to `'normal'`.
@@ -118,11 +114,6 @@ export declare class ObcStartStopSwitch extends LitElement {
     variant: StartStopSwitchVariant;
     /**
      * The size of the switch.
-     *
-     * If `true`, the content of the `unchecked-state-icon` slot will be displayed when unchecked.
-     */
-    showCheckedStateIcon: boolean;
-    /**
      * - `regular`: Standard size with 32px track height
      * - `large`: Larger size with 48px track height
      *

package/dist/components/start-stop-switch/start-stop-switch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"start-stop-switch.d.ts","sourceRoot":"","sources":["../../../src/components/start-stop-switch/start-stop-switch.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAKhD,OAAO,wCAAwC,CAAC;AAGhD;;;;;GAKG;AACH,oBAAY,sBAAsB;IAChC,MAAM,WAAW;IACjB,OAAO,YAAY;IACnB,OAAO,YAAY;CACpB;AAED;;;;GAIG;AACH,oBAAY,mBAAmB;IAC7B,OAAO,YAAY;IACnB,KAAK,UAAU;CAChB;AAED,MAAM,MAAM,6BAA6B,GAAG,WAAW,CAAC;IACtD,OAAO,EAAE,OAAO,CAAC;CAClB,CAAC,CAAC;AAQH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoEG;AACH,qBACa,kBAAmB,SAAQ,UAAU;IAChD;;;;;;OAMG;IACuC,OAAO,UAAS;IAE1D;;;;;;;OAOG;IACwB,sBAAsB,UAAS;IAC1D;;;;OAIG;IACsC,OAAO,EAAE,sBAAsB,CACxC;IAEhC;;;;OAIG;IACwB,oBAAoB,UAAS;IACxD;;;;;OAKG;IACsC,IAAI,EAAE,mBAAmB,CACpC;IAE9B;;;;;;;OAOG;IACuC,QAAQ,UAAS;IAE3D;;;;;;;OAOG;IACwB,QAAQ,UAAS;IAE5C;;;;;;;OAOG;IACwB,cAAc,UAAS;IAElD;;;;;;;;OAQG;IACuB,WAAW,SAAwB;IAEpD,OAAO,CAAC,QAAQ,CAAS;IACzB,OAAO,CAAC,UAAU,CAAS;IAEpC,OAAO,CAAC,UAAU,CAAK;IACvB,OAAO,CAAC,YAAY,CAAK;IACzB,OAAO,CAAC,UAAU,CAAK;IACvB,OAAO,CAAC,UAAU,CAAK;IACvB,OAAO,CAAC,WAAW,CAAK;IACxB,OAAO,CAAC,cAAc,CAAC,CAAiB;IAGxC,OAAO,CAAC,SAAS,CAAC,CAAc;IAGhC,OAAO,CAAC,QAAQ,CAAC,CAAc;IAE/B,OAAO,CAAC,WAAW,CAwBjB;IAEF,OAAO,CAAC,UAAU,CAgBhB;IAEF,OAAO,CAAC,SAAS,CAwBf;IAEF,OAAO,CAAC,aAAa,CAOnB;IAEF,OAAO,CAAC,mBAAmB;IAU3B,OAAO,CAAC,cAAc;IAiBb,YAAY;IASZ,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAiC/C,oBAAoB;IASpB,MAAM;IA6Ff,OAAgB,MAAM,0BAA6B;CACpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,uBAAuB,EAAE,kBAAkB,CAAC;KAC7C;CACF"}
+{"version":3,"file":"start-stop-switch.d.ts","sourceRoot":"","sources":["../../../src/components/start-stop-switch/start-stop-switch.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAKhD,OAAO,wCAAwC,CAAC;AAGhD;;;;;GAKG;AACH,oBAAY,sBAAsB;IAChC,MAAM,WAAW;IACjB,OAAO,YAAY;IACnB,OAAO,YAAY;CACpB;AAED;;;;GAIG;AACH,oBAAY,mBAAmB;IAC7B,OAAO,YAAY;IACnB,KAAK,UAAU;CAChB;AAED,MAAM,MAAM,6BAA6B,GAAG,WAAW,CAAC;IACtD,OAAO,EAAE,OAAO,CAAC;CAClB,CAAC,CAAC;AAQH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoEG;AACH,qBACa,kBAAmB,SAAQ,UAAU;IAChD;;;;;;OAMG;IACuC,OAAO,UAAS;IAE1D;;;;;;;;;OASG;IACsC,OAAO,EAAE,sBAAsB,CACxC;IAEhC;;;;;;OAMG;IACsC,IAAI,EAAE,mBAAmB,CACpC;IAE9B;;;;;;;OAOG;IACuC,QAAQ,UAAS;IAE3D;;;;;;;OAOG;IACwB,QAAQ,UAAS;IAE5C;;;;;;;OAOG;IACwB,cAAc,UAAS;IAElD;;;;;;;;OAQG;IACuB,WAAW,SAAwB;IAEpD,OAAO,CAAC,QAAQ,CAAS;IACzB,OAAO,CAAC,UAAU,CAAS;IAEpC,OAAO,CAAC,UAAU,CAAK;IACvB,OAAO,CAAC,YAAY,CAAK;IACzB,OAAO,CAAC,UAAU,CAAK;IACvB,OAAO,CAAC,UAAU,CAAK;IACvB,OAAO,CAAC,WAAW,CAAK;IACxB,OAAO,CAAC,cAAc,CAAC,CAAiB;IAGxC,OAAO,CAAC,SAAS,CAAC,CAAc;IAGhC,OAAO,CAAC,QAAQ,CAAC,CAAc;IAE/B,OAAO,CAAC,WAAW,CAwBjB;IAEF,OAAO,CAAC,UAAU,CAgBhB;IAEF,OAAO,CAAC,SAAS,CAwBf;IAEF,OAAO,CAAC,aAAa,CAOnB;IAEF,OAAO,CAAC,mBAAmB;IAU3B,OAAO,CAAC,cAAc;IAiBb,YAAY;IASZ,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC;IAiC/C,oBAAoB;IASpB,MAAM;IA6Ff,OAAgB,MAAM,0BAA6B;CACpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,uBAAuB,EAAE,kBAAkB,CAAC;KAC7C;CACF"}

package/dist/components/start-stop-switch/start-stop-switch.js

@@ -31,9 +31,7 @@ let ObcStartStopSwitch = class extends LitElement {
   constructor() {
     super(...arguments);
     this.checked = false;
-    this.showUncheckedStateIcon = false;
     this.variant = "normal";
-    this.showCheckedStateIcon = false;
     this.size = "regular";
     this.disabled = false;
     this.hasAlert = false;
@@ -261,15 +259,9 @@ ObcStartStopSwitch.styles = unsafeCSS(componentStyle);
 __decorateClass([
   property({ type: Boolean, reflect: true })
 ], ObcStartStopSwitch.prototype, "checked", 2);
-__decorateClass([
-  property({ type: Boolean })
-], ObcStartStopSwitch.prototype, "showUncheckedStateIcon", 2);
 __decorateClass([
   property({ type: String, reflect: true })
 ], ObcStartStopSwitch.prototype, "variant", 2);
-__decorateClass([
-  property({ type: Boolean })
-], ObcStartStopSwitch.prototype, "showCheckedStateIcon", 2);
 __decorateClass([
   property({ type: String, reflect: true })
 ], ObcStartStopSwitch.prototype, "size", 2);

package/dist/components/start-stop-switch/start-stop-switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"start-stop-switch.js","sources":["../../../src/components/start-stop-switch/start-stop-switch.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {property, query, state} from 'lit/decorators.js';\nimport componentStyle from './start-stop-switch.css?inline';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {ifDefined} from 'lit/directives/if-defined.js';\nimport '../../icons/icon-arrow-right-google.js';\nimport {customElement} from '../../decorator.js';\n\n/**\n * The visual variant for the start-stop switch when checked.\n * - `normal`: Standard blue appearance (default)\n * - `running`: Green appearance indicating motor/process is running\n * - `loading`: Light blue appearance indicating a pending/loading state\n */\nexport enum StartStopSwitchVariant {\n  normal = 'normal',\n  running = 'running',\n  loading = 'loading',\n}\n\n/**\n * The possible sizes for the start-stop switch.\n * - `regular`: Standard size with 32px track height\n * - `large`: Larger size with 48px track height\n */\nexport enum StartStopSwitchSize {\n  regular = 'regular',\n  large = 'large',\n}\n\nexport type ObcStartStopSwitchChangeEvent = CustomEvent<{\n  checked: boolean;\n}>;\n\n/**\n * Threshold for completing a drag gesture (90% of track width).\n * User must drag past this threshold to toggle the switch state.\n */\nconst DRAG_COMPLETE_THRESHOLD = 0.9;\n\n/**\n * `<obc-start-stop-switch>` – A two-state draggable toggle switch for significant binary actions like start/stop or enable/disable.\n *\n * This switch provides a visually distinct, draggable toggle for binary actions where both states need to be explicitly labeled and reinforced. Unlike a simple on/off toggle, it displays both the current state label and an action label on the draggable thumb, making it ideal for consequential actions where user awareness is critical.\n *\n * ### Features\n * - **Drag-to-toggle interaction:** Users must drag the thumb across the track to change state (90% threshold required). This deliberate interaction prevents accidental toggles.\n * - **Dual state labels:** Displays both a state label (e.g., \"Running\", \"Stopped\") and an action label on the thumb (e.g., \"Start\", \"Stop\").\n * - **Visual variants:**\n *   - `normal`: Standard blue appearance when checked (default)\n *   - `running`: Green appearance indicating an active process (e.g., motor running)\n *   - `loading`: Light blue appearance indicating a pending/transitional state\n * - **Size options:** `regular` (32px track height) or `large` (48px track height, matching touch target).\n * - **Alert frame:** Optional red border to indicate alarm or critical state.\n * - **Description text:** Optional text below the switch for additional context.\n * - **Animated transitions:** Smooth CSS transitions for thumb movement and state changes.\n * - **Keyboard accessible:** The switch is focusable and follows the ARIA switch pattern — `Enter` or `Space` toggles the state and fires the same `change` event as a completed drag.\n *\n * ### Usage Guidelines\n * Use `<obc-start-stop-switch>` when you need a prominent control for toggling between two mutually exclusive states where:\n * - Both states should be explicitly labeled (not just \"on/off\")\n * - The action has significant consequences (starting a motor, enabling a system)\n * - Accidental activation should be prevented through deliberate drag interaction\n *\n * Avoid using this component for simple preferences or settings where a standard `<obc-switch>` or checkbox would suffice. This component is best suited for operational controls where the user must be aware of both the current state and the action they're about to take.\n *\n * **Related components:** For simple binary toggles without labels, use `<obc-switch>`. For grouped selections, use `<obc-radio>` or `<obc-checkbox>`.\n *\n * ### Slots\n * | Slot Name                 | Renders When...      | Purpose                                                    |\n * |---------------------------|----------------------|------------------------------------------------------------|\n * | checked-state-icon        | Always (if provided) | Icon displayed in the checked state area.                  |\n * | unchecked-state-icon      | Always (if provided) | Icon displayed in the unchecked state area.                |\n * | checked-state-label       | Always               | Label shown when switch is in checked position.            |\n * | unchecked-state-label     | Always               | Label shown when switch is in unchecked position.          |\n * | to-checked-action-label   | When unchecked       | Action label on thumb prompting user to activate.          |\n * | to-unchecked-action-label | When checked         | Action label on thumb prompting user to deactivate.        |\n *\n * ### Events\n * - `change` – Fired when the switch state changes after a successful drag. The event detail contains `{checked: boolean}` indicating the new state.\n *\n * ### Best Practices\n * - Keep labels concise (1-2 words) to fit within the track width.\n * - Use meaningful action verbs: \"Start/Stop\", \"Enable/Disable\", \"Request/Release\".\n * - Use the `running` variant to indicate an actively running process.\n * - Use the `loading` variant during async operations before transitioning to `running` or `normal`.\n * - Consider using `hasAlert` when the switch controls a critical system in alarm state.\n * - The accessible name is computed from the slotted labels; provide `aria-label` on the host when those labels alone are not descriptive (`aria-labelledby` is not supported — ID references cannot cross the shadow boundary).\n *\n * ### Example\n * ```html\n * <obc-start-stop-switch checked variant=\"running\">\n *   <div slot=\"checked-state-icon\"><obi-placeholder></obi-placeholder></div>\n *   <div slot=\"checked-state-label\">Running</div>\n *   <div slot=\"unchecked-state-label\">Stopped</div>\n *   <div slot=\"to-checked-action-label\">Start</div>\n *   <div slot=\"to-unchecked-action-label\">Stop</div>\n * </obc-start-stop-switch>\n * ```\n *\n * @slot checked-state-icon - Icon displayed in the checked (active) state area.\n * @slot unchecked-state-icon - Icon displayed in the unchecked (inactive) state area.\n * @slot checked-state-label - Label for the checked state (e.g., \"Running\", \"Enabled\").\n * @slot unchecked-state-label - Label for the unchecked state (e.g., \"Stopped\", \"Disabled\").\n * @slot to-checked-action-label - Action label on thumb when unchecked (e.g., \"Start\", \"Enable\").\n * @slot to-unchecked-action-label - Action label on thumb when checked (e.g., \"Stop\", \"Disable\").\n * @fires {ObcStartStopSwitchChangeEvent} change - Emitted when the switch is toggled via drag interaction.\n * @stable\n */\n@customElement('obc-start-stop-switch')\nexport class ObcStartStopSwitch extends LitElement {\n  /**\n   * Whether the switch is in the checked (active) state.\n   * When checked, the thumb is on the right side.\n   * When unchecked, the thumb is on the left side.\n   *\n   * Defaults to `false`.\n   */\n  @property({type: Boolean, reflect: true}) checked = false;\n\n  /**\n   * The visual variant for the switch when checked.\n   * - `normal`: Standard blue appearance (default)\n   * - `running`: Green appearance indicating motor/process is running\n   * - `loading`: Light blue appearance indicating a pending/loading state\n   *\n   * If `true`, the content of the `checked-state-icon` slot will be displayed when checked.\n   */\n  @property({type: Boolean}) showUncheckedStateIcon = false;\n  /**\n   * This only affects the visual style, not the switch position.\n   *\n   * Defaults to `'normal'`.\n   */\n  @property({type: String, reflect: true}) variant: StartStopSwitchVariant =\n    StartStopSwitchVariant.normal;\n\n  /**\n   * The size of the switch.\n   *\n   * If `true`, the content of the `unchecked-state-icon` slot will be displayed when unchecked.\n   */\n  @property({type: Boolean}) showCheckedStateIcon = false;\n  /**\n   * - `regular`: Standard size with 32px track height\n   * - `large`: Larger size with 48px track height\n   *\n   * Defaults to `'regular'`.\n   */\n  @property({type: String, reflect: true}) size: StartStopSwitchSize =\n    StartStopSwitchSize.regular;\n\n  /**\n   * Whether the switch is disabled.\n   *\n   * When disabled, the switch cannot be interacted with and displays a muted appearance.\n   * In the disabled state, the thumb is hidden and only the state label is shown.\n   *\n   * Defaults to `false`.\n   */\n  @property({type: Boolean, reflect: true}) disabled = false;\n\n  /**\n   * Whether to show an alert frame around the switch.\n   *\n   * When true, displays a red alert border around the switch to indicate\n   * an alarm or critical state.\n   *\n   * Defaults to `false`.\n   */\n  @property({type: Boolean}) hasAlert = false;\n\n  /**\n   * Whether to show the description below the switch.\n   *\n   * When true, displays the description text below the switch track.\n   * The component's minimum height is maintained at the touch target size.\n   *\n   * Defaults to `false`.\n   */\n  @property({type: Boolean}) hasDescription = false;\n\n  /**\n   * Description text displayed below the switch when `hasDescription` is true.\n   *\n   * Use this to provide additional context about the switch's purpose or current state.\n   *\n   * Defaults to `'Action description'`.\n   *\n   * @availableWhen hasDescription==true\n   */\n  @property({type: String}) description = 'Action description';\n\n  @state() private dragging = false;\n  @state() private tmpChecked = false;\n\n  private dragStartX = 0;\n  private dragCurrentX = 0;\n  private dragOffset = 0;\n  private trackWidth = 0;\n  private buttonWidth = 0;\n  private resizeObserver?: ResizeObserver;\n\n  @query('.button')\n  private buttonRef?: HTMLElement;\n\n  @query('.button-track')\n  private trackRef?: HTMLElement;\n\n  private onDragStart = (e: MouseEvent | TouchEvent) => {\n    this.dragging = true;\n    if (e instanceof MouseEvent) {\n      this.dragStartX = e.clientX;\n    } else {\n      this.dragStartX = e.touches[0].clientX;\n    }\n    this.dragCurrentX = this.dragStartX;\n\n    const trackRect = this.trackRef?.getBoundingClientRect();\n    const buttonRect = this.buttonRef?.getBoundingClientRect();\n\n    if (trackRect && buttonRect) {\n      this.trackWidth = trackRect.width;\n      this.buttonWidth = buttonRect.width;\n    } else {\n      this.trackWidth = this.trackRef?.offsetWidth || 0;\n      this.buttonWidth = this.buttonRef?.offsetWidth || 0;\n    }\n\n    window.addEventListener('mousemove', this.onDragMove);\n    window.addEventListener('touchmove', this.onDragMove, {passive: false});\n    window.addEventListener('mouseup', this.onDragEnd);\n    window.addEventListener('touchend', this.onDragEnd);\n  };\n\n  private onDragMove = (e: MouseEvent | TouchEvent) => {\n    if (!this.dragging) return;\n    let clientX;\n    if (e instanceof MouseEvent) {\n      clientX = e.clientX;\n    } else {\n      clientX = e.touches[0].clientX;\n      e.preventDefault();\n    }\n    this.dragCurrentX = clientX;\n    this.dragOffset = this.dragCurrentX - this.dragStartX;\n    const percent = Math.abs(\n      this.dragOffset / (this.trackWidth - this.buttonWidth)\n    );\n    this.tmpChecked = this.checked ? percent < 0.5 : percent > 0.5;\n    this.requestUpdate();\n  };\n\n  private onDragEnd = () => {\n    if (!this.dragging) return;\n    this.dragging = false;\n\n    const maxOffset = this.trackWidth - this.buttonWidth;\n    const startPosition = this.checked ? maxOffset : 0;\n    const newPosition = startPosition + this.dragOffset;\n    const percent = newPosition / maxOffset;\n\n    if (!this.checked && percent > DRAG_COMPLETE_THRESHOLD) {\n      this.checked = true;\n      this.dispatchChangeEvent();\n    } else if (this.checked && percent < 1 - DRAG_COMPLETE_THRESHOLD) {\n      this.checked = false;\n      this.dispatchChangeEvent();\n    }\n\n    this.tmpChecked = this.checked;\n    this.dragOffset = 0;\n    window.removeEventListener('mousemove', this.onDragMove);\n    window.removeEventListener('touchmove', this.onDragMove);\n    window.removeEventListener('mouseup', this.onDragEnd);\n    window.removeEventListener('touchend', this.onDragEnd);\n    this.requestUpdate();\n  };\n\n  private handleKeydown = (e: KeyboardEvent) => {\n    if (e.key !== 'Enter' && e.key !== ' ') return;\n    e.preventDefault();\n    if (this.disabled) return;\n    this.checked = !this.checked;\n    this.tmpChecked = this.checked;\n    this.dispatchChangeEvent();\n  };\n\n  private dispatchChangeEvent() {\n    this.dispatchEvent(\n      new CustomEvent('change', {\n        detail: {checked: this.checked},\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  private getButtonStyle() {\n    if (!this.dragging) return '';\n\n    // Keep same positioning mode as CSS to avoid subpixel issues when switching modes\n    if (this.checked) {\n      let right = -1 - this.dragOffset;\n      const maxRight = this.trackWidth - this.buttonWidth + 1;\n      right = Math.max(-1, Math.min(right, maxRight));\n      return `right: ${right}px; left: auto; transition: none;`;\n    } else {\n      let left = -1 + this.dragOffset;\n      const maxLeft = this.trackWidth - this.buttonWidth + 1;\n      left = Math.max(-1, Math.min(left, maxLeft));\n      return `left: ${left}px; right: auto; transition: none;`;\n    }\n  }\n\n  override firstUpdated() {\n    this.resizeObserver = new ResizeObserver(() => {\n      this.trackWidth = this.trackRef?.offsetWidth || 0;\n      this.buttonWidth = this.buttonRef?.offsetWidth || 0;\n    });\n    if (this.trackRef) this.resizeObserver.observe(this.trackRef);\n    if (this.buttonRef) this.resizeObserver.observe(this.buttonRef);\n  }\n\n  override updated(changedProperties: Map<string, unknown>) {\n    super.updated(changedProperties);\n    // CSS Anchor Positioning (`right: anchor(center)`) on .button-track-checked\n    // may not repaint when the thumb moves via a CSS transition (checked property change).\n    // Force the browser to recalculate anchor positions after the transition completes.\n    if (changedProperties.has('checked') && !this.dragging) {\n      const trackChecked = this.renderRoot.querySelector(\n        '.button-track-checked'\n      ) as HTMLElement | null;\n      const button = this.buttonRef;\n      if (trackChecked && button) {\n        const nudgeRepaint = () => {\n          trackChecked.style.display = 'none';\n          // Force a synchronous layout recalculation\n          void trackChecked.offsetHeight;\n          trackChecked.style.display = '';\n        };\n        // Wait one frame for the browser to start any CSS transitions,\n        // then wait for all animations on the thumb to finish before nudging.\n        requestAnimationFrame(() => {\n          const animations = button.getAnimations();\n          if (animations.length > 0) {\n            Promise.allSettled(animations.map((a) => a.finished)).then(\n              nudgeRepaint\n            );\n          } else {\n            nudgeRepaint();\n          }\n        });\n      }\n    }\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.resizeObserver?.disconnect();\n    window.removeEventListener('mousemove', this.onDragMove);\n    window.removeEventListener('touchmove', this.onDragMove);\n    window.removeEventListener('mouseup', this.onDragEnd);\n    window.removeEventListener('touchend', this.onDragEnd);\n  }\n\n  override render() {\n    const isChecked = this.checked;\n    const forwardedAriaLabel = this.getAttribute('aria-label') ?? undefined;\n\n    return html`\n              <div class=\"outer-container\">\n                <div\n                  class=${classMap({\n                    wrapper: true,\n                    checked: isChecked,\n                    unchecked: !isChecked,\n                    dragging: this.dragging,\n                    'tmp-checked': this.tmpChecked && this.dragging,\n                    'tmp-unchecked': !this.tmpChecked && this.dragging,\n                    disabled: this.disabled,\n                    'has-alert': this.hasAlert,\n                    'size-regular': this.size === 'regular',\n                    'size-large': this.size === 'large',\n                    'variant-normal': this.variant === 'normal',\n                    'variant-running': this.variant === 'running',\n                    'variant-loading': this.variant === 'loading',\n                  })}\n                  tabindex=${this.disabled ? -1 : 0}\n                  role=\"switch\"\n                  aria-checked=${isChecked ? 'true' : 'false'}\n                  aria-disabled=${this.disabled ? 'true' : 'false'}\n                  aria-label=${ifDefined(forwardedAriaLabel)}\n                  @keydown=${this.handleKeydown}\n                >\n                  <div class=\"button-track\">\n                    <button\n                      class=\"button\"\n                      style=${this.getButtonStyle()}\n                      @mousedown=${this.disabled ? undefined : this.onDragStart}\n                      @touchstart=${\n                        this.disabled ? undefined : this.onDragStart\n                      }\n                      ?disabled=${this.disabled}\n                      tabindex=\"-1\"\n                    >\n                      ${\n                        !this.disabled\n                          ? html`\n                              <div class=\"button-visible\">\n                                <obi-arrow-right-google\n                                  class=\"button-icon\"\n                                  aria-hidden=\"true\"\n                                ></obi-arrow-right-google>\n                                <div class=\"button-label\">\n                                  <slot\n                                    name=${isChecked\n                                      ? 'to-unchecked-action-label'\n                                      : 'to-checked-action-label'}\n                                  ></slot>\n                                </div>\n                              </div>\n                            `\n                          : ''\n                      }\n                    </button>\n                    ${\n                      !this.disabled\n                        ? html`<div class=\"button-track-checked\"></div>`\n                        : ''\n                    }\n                    <div class=\"checked state\">\n                      <slot name=\"checked-state-icon\"></slot>\n                      <div class=\"state-label\">\n                        <slot name=\"checked-state-label\"></slot>\n                      </div>\n                    </div>\n                    <div class=\"unchecked state\">\n                      <slot name=\"unchecked-state-icon\"></slot>\n                      <div class=\"state-label\">\n                        <slot name=\"unchecked-state-label\"></slot>\n                      </div>\n                    </div>\n                  </div>\n                  ${this.hasAlert ? html`<div class=\"alert-frame\"></div>` : ''}\n                </div>\n                ${\n                  this.hasDescription\n                    ? html`<div class=\"description\">${this.description}</div>`\n                    : ''\n                }\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-start-stop-switch': ObcStartStopSwitch;\n  }\n}\n"],"names":["StartStopSwitchVariant","StartStopSwitchSize"],"mappings":"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"}
+{"version":3,"file":"start-stop-switch.js","sources":["../../../src/components/start-stop-switch/start-stop-switch.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {property, query, state} from 'lit/decorators.js';\nimport componentStyle from './start-stop-switch.css?inline';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {ifDefined} from 'lit/directives/if-defined.js';\nimport '../../icons/icon-arrow-right-google.js';\nimport {customElement} from '../../decorator.js';\n\n/**\n * The visual variant for the start-stop switch when checked.\n * - `normal`: Standard blue appearance (default)\n * - `running`: Green appearance indicating motor/process is running\n * - `loading`: Light blue appearance indicating a pending/loading state\n */\nexport enum StartStopSwitchVariant {\n  normal = 'normal',\n  running = 'running',\n  loading = 'loading',\n}\n\n/**\n * The possible sizes for the start-stop switch.\n * - `regular`: Standard size with 32px track height\n * - `large`: Larger size with 48px track height\n */\nexport enum StartStopSwitchSize {\n  regular = 'regular',\n  large = 'large',\n}\n\nexport type ObcStartStopSwitchChangeEvent = CustomEvent<{\n  checked: boolean;\n}>;\n\n/**\n * Threshold for completing a drag gesture (90% of track width).\n * User must drag past this threshold to toggle the switch state.\n */\nconst DRAG_COMPLETE_THRESHOLD = 0.9;\n\n/**\n * `<obc-start-stop-switch>` – A two-state draggable toggle switch for significant binary actions like start/stop or enable/disable.\n *\n * This switch provides a visually distinct, draggable toggle for binary actions where both states need to be explicitly labeled and reinforced. Unlike a simple on/off toggle, it displays both the current state label and an action label on the draggable thumb, making it ideal for consequential actions where user awareness is critical.\n *\n * ### Features\n * - **Drag-to-toggle interaction:** Users must drag the thumb across the track to change state (90% threshold required). This deliberate interaction prevents accidental toggles.\n * - **Dual state labels:** Displays both a state label (e.g., \"Running\", \"Stopped\") and an action label on the thumb (e.g., \"Start\", \"Stop\").\n * - **Visual variants:**\n *   - `normal`: Standard blue appearance when checked (default)\n *   - `running`: Green appearance indicating an active process (e.g., motor running)\n *   - `loading`: Light blue appearance indicating a pending/transitional state\n * - **Size options:** `regular` (32px track height) or `large` (48px track height, matching touch target).\n * - **Alert frame:** Optional red border to indicate alarm or critical state.\n * - **Description text:** Optional text below the switch for additional context.\n * - **Animated transitions:** Smooth CSS transitions for thumb movement and state changes.\n * - **Keyboard accessible:** The switch is focusable and follows the ARIA switch pattern — `Enter` or `Space` toggles the state and fires the same `change` event as a completed drag.\n *\n * ### Usage Guidelines\n * Use `<obc-start-stop-switch>` when you need a prominent control for toggling between two mutually exclusive states where:\n * - Both states should be explicitly labeled (not just \"on/off\")\n * - The action has significant consequences (starting a motor, enabling a system)\n * - Accidental activation should be prevented through deliberate drag interaction\n *\n * Avoid using this component for simple preferences or settings where a standard `<obc-switch>` or checkbox would suffice. This component is best suited for operational controls where the user must be aware of both the current state and the action they're about to take.\n *\n * **Related components:** For simple binary toggles without labels, use `<obc-switch>`. For grouped selections, use `<obc-radio>` or `<obc-checkbox>`.\n *\n * ### Slots\n * | Slot Name                 | Renders When...      | Purpose                                                    |\n * |---------------------------|----------------------|------------------------------------------------------------|\n * | checked-state-icon        | Always (if provided) | Icon displayed in the checked state area.                  |\n * | unchecked-state-icon      | Always (if provided) | Icon displayed in the unchecked state area.                |\n * | checked-state-label       | Always               | Label shown when switch is in checked position.            |\n * | unchecked-state-label     | Always               | Label shown when switch is in unchecked position.          |\n * | to-checked-action-label   | When unchecked       | Action label on thumb prompting user to activate.          |\n * | to-unchecked-action-label | When checked         | Action label on thumb prompting user to deactivate.        |\n *\n * ### Events\n * - `change` – Fired when the switch state changes after a successful drag. The event detail contains `{checked: boolean}` indicating the new state.\n *\n * ### Best Practices\n * - Keep labels concise (1-2 words) to fit within the track width.\n * - Use meaningful action verbs: \"Start/Stop\", \"Enable/Disable\", \"Request/Release\".\n * - Use the `running` variant to indicate an actively running process.\n * - Use the `loading` variant during async operations before transitioning to `running` or `normal`.\n * - Consider using `hasAlert` when the switch controls a critical system in alarm state.\n * - The accessible name is computed from the slotted labels; provide `aria-label` on the host when those labels alone are not descriptive (`aria-labelledby` is not supported — ID references cannot cross the shadow boundary).\n *\n * ### Example\n * ```html\n * <obc-start-stop-switch checked variant=\"running\">\n *   <div slot=\"checked-state-icon\"><obi-placeholder></obi-placeholder></div>\n *   <div slot=\"checked-state-label\">Running</div>\n *   <div slot=\"unchecked-state-label\">Stopped</div>\n *   <div slot=\"to-checked-action-label\">Start</div>\n *   <div slot=\"to-unchecked-action-label\">Stop</div>\n * </obc-start-stop-switch>\n * ```\n *\n * @slot checked-state-icon - Icon displayed in the checked (active) state area.\n * @slot unchecked-state-icon - Icon displayed in the unchecked (inactive) state area.\n * @slot checked-state-label - Label for the checked state (e.g., \"Running\", \"Enabled\").\n * @slot unchecked-state-label - Label for the unchecked state (e.g., \"Stopped\", \"Disabled\").\n * @slot to-checked-action-label - Action label on thumb when unchecked (e.g., \"Start\", \"Enable\").\n * @slot to-unchecked-action-label - Action label on thumb when checked (e.g., \"Stop\", \"Disable\").\n * @fires {ObcStartStopSwitchChangeEvent} change - Emitted when the switch is toggled via drag interaction.\n * @stable\n */\n@customElement('obc-start-stop-switch')\nexport class ObcStartStopSwitch extends LitElement {\n  /**\n   * Whether the switch is in the checked (active) state.\n   * When checked, the thumb is on the right side.\n   * When unchecked, the thumb is on the left side.\n   *\n   * Defaults to `false`.\n   */\n  @property({type: Boolean, reflect: true}) checked = false;\n\n  /**\n   * The visual variant for the switch when checked.\n   * - `normal`: Standard blue appearance (default)\n   * - `running`: Green appearance indicating motor/process is running\n   * - `loading`: Light blue appearance indicating a pending/loading state\n   *\n   * This only affects the visual style, not the switch position.\n   *\n   * Defaults to `'normal'`.\n   */\n  @property({type: String, reflect: true}) variant: StartStopSwitchVariant =\n    StartStopSwitchVariant.normal;\n\n  /**\n   * The size of the switch.\n   * - `regular`: Standard size with 32px track height\n   * - `large`: Larger size with 48px track height\n   *\n   * Defaults to `'regular'`.\n   */\n  @property({type: String, reflect: true}) size: StartStopSwitchSize =\n    StartStopSwitchSize.regular;\n\n  /**\n   * Whether the switch is disabled.\n   *\n   * When disabled, the switch cannot be interacted with and displays a muted appearance.\n   * In the disabled state, the thumb is hidden and only the state label is shown.\n   *\n   * Defaults to `false`.\n   */\n  @property({type: Boolean, reflect: true}) disabled = false;\n\n  /**\n   * Whether to show an alert frame around the switch.\n   *\n   * When true, displays a red alert border around the switch to indicate\n   * an alarm or critical state.\n   *\n   * Defaults to `false`.\n   */\n  @property({type: Boolean}) hasAlert = false;\n\n  /**\n   * Whether to show the description below the switch.\n   *\n   * When true, displays the description text below the switch track.\n   * The component's minimum height is maintained at the touch target size.\n   *\n   * Defaults to `false`.\n   */\n  @property({type: Boolean}) hasDescription = false;\n\n  /**\n   * Description text displayed below the switch when `hasDescription` is true.\n   *\n   * Use this to provide additional context about the switch's purpose or current state.\n   *\n   * Defaults to `'Action description'`.\n   *\n   * @availableWhen hasDescription==true\n   */\n  @property({type: String}) description = 'Action description';\n\n  @state() private dragging = false;\n  @state() private tmpChecked = false;\n\n  private dragStartX = 0;\n  private dragCurrentX = 0;\n  private dragOffset = 0;\n  private trackWidth = 0;\n  private buttonWidth = 0;\n  private resizeObserver?: ResizeObserver;\n\n  @query('.button')\n  private buttonRef?: HTMLElement;\n\n  @query('.button-track')\n  private trackRef?: HTMLElement;\n\n  private onDragStart = (e: MouseEvent | TouchEvent) => {\n    this.dragging = true;\n    if (e instanceof MouseEvent) {\n      this.dragStartX = e.clientX;\n    } else {\n      this.dragStartX = e.touches[0].clientX;\n    }\n    this.dragCurrentX = this.dragStartX;\n\n    const trackRect = this.trackRef?.getBoundingClientRect();\n    const buttonRect = this.buttonRef?.getBoundingClientRect();\n\n    if (trackRect && buttonRect) {\n      this.trackWidth = trackRect.width;\n      this.buttonWidth = buttonRect.width;\n    } else {\n      this.trackWidth = this.trackRef?.offsetWidth || 0;\n      this.buttonWidth = this.buttonRef?.offsetWidth || 0;\n    }\n\n    window.addEventListener('mousemove', this.onDragMove);\n    window.addEventListener('touchmove', this.onDragMove, {passive: false});\n    window.addEventListener('mouseup', this.onDragEnd);\n    window.addEventListener('touchend', this.onDragEnd);\n  };\n\n  private onDragMove = (e: MouseEvent | TouchEvent) => {\n    if (!this.dragging) return;\n    let clientX;\n    if (e instanceof MouseEvent) {\n      clientX = e.clientX;\n    } else {\n      clientX = e.touches[0].clientX;\n      e.preventDefault();\n    }\n    this.dragCurrentX = clientX;\n    this.dragOffset = this.dragCurrentX - this.dragStartX;\n    const percent = Math.abs(\n      this.dragOffset / (this.trackWidth - this.buttonWidth)\n    );\n    this.tmpChecked = this.checked ? percent < 0.5 : percent > 0.5;\n    this.requestUpdate();\n  };\n\n  private onDragEnd = () => {\n    if (!this.dragging) return;\n    this.dragging = false;\n\n    const maxOffset = this.trackWidth - this.buttonWidth;\n    const startPosition = this.checked ? maxOffset : 0;\n    const newPosition = startPosition + this.dragOffset;\n    const percent = newPosition / maxOffset;\n\n    if (!this.checked && percent > DRAG_COMPLETE_THRESHOLD) {\n      this.checked = true;\n      this.dispatchChangeEvent();\n    } else if (this.checked && percent < 1 - DRAG_COMPLETE_THRESHOLD) {\n      this.checked = false;\n      this.dispatchChangeEvent();\n    }\n\n    this.tmpChecked = this.checked;\n    this.dragOffset = 0;\n    window.removeEventListener('mousemove', this.onDragMove);\n    window.removeEventListener('touchmove', this.onDragMove);\n    window.removeEventListener('mouseup', this.onDragEnd);\n    window.removeEventListener('touchend', this.onDragEnd);\n    this.requestUpdate();\n  };\n\n  private handleKeydown = (e: KeyboardEvent) => {\n    if (e.key !== 'Enter' && e.key !== ' ') return;\n    e.preventDefault();\n    if (this.disabled) return;\n    this.checked = !this.checked;\n    this.tmpChecked = this.checked;\n    this.dispatchChangeEvent();\n  };\n\n  private dispatchChangeEvent() {\n    this.dispatchEvent(\n      new CustomEvent('change', {\n        detail: {checked: this.checked},\n        bubbles: true,\n        composed: true,\n      })\n    );\n  }\n\n  private getButtonStyle() {\n    if (!this.dragging) return '';\n\n    // Keep same positioning mode as CSS to avoid subpixel issues when switching modes\n    if (this.checked) {\n      let right = -1 - this.dragOffset;\n      const maxRight = this.trackWidth - this.buttonWidth + 1;\n      right = Math.max(-1, Math.min(right, maxRight));\n      return `right: ${right}px; left: auto; transition: none;`;\n    } else {\n      let left = -1 + this.dragOffset;\n      const maxLeft = this.trackWidth - this.buttonWidth + 1;\n      left = Math.max(-1, Math.min(left, maxLeft));\n      return `left: ${left}px; right: auto; transition: none;`;\n    }\n  }\n\n  override firstUpdated() {\n    this.resizeObserver = new ResizeObserver(() => {\n      this.trackWidth = this.trackRef?.offsetWidth || 0;\n      this.buttonWidth = this.buttonRef?.offsetWidth || 0;\n    });\n    if (this.trackRef) this.resizeObserver.observe(this.trackRef);\n    if (this.buttonRef) this.resizeObserver.observe(this.buttonRef);\n  }\n\n  override updated(changedProperties: Map<string, unknown>) {\n    super.updated(changedProperties);\n    // CSS Anchor Positioning (`right: anchor(center)`) on .button-track-checked\n    // may not repaint when the thumb moves via a CSS transition (checked property change).\n    // Force the browser to recalculate anchor positions after the transition completes.\n    if (changedProperties.has('checked') && !this.dragging) {\n      const trackChecked = this.renderRoot.querySelector(\n        '.button-track-checked'\n      ) as HTMLElement | null;\n      const button = this.buttonRef;\n      if (trackChecked && button) {\n        const nudgeRepaint = () => {\n          trackChecked.style.display = 'none';\n          // Force a synchronous layout recalculation\n          void trackChecked.offsetHeight;\n          trackChecked.style.display = '';\n        };\n        // Wait one frame for the browser to start any CSS transitions,\n        // then wait for all animations on the thumb to finish before nudging.\n        requestAnimationFrame(() => {\n          const animations = button.getAnimations();\n          if (animations.length > 0) {\n            Promise.allSettled(animations.map((a) => a.finished)).then(\n              nudgeRepaint\n            );\n          } else {\n            nudgeRepaint();\n          }\n        });\n      }\n    }\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.resizeObserver?.disconnect();\n    window.removeEventListener('mousemove', this.onDragMove);\n    window.removeEventListener('touchmove', this.onDragMove);\n    window.removeEventListener('mouseup', this.onDragEnd);\n    window.removeEventListener('touchend', this.onDragEnd);\n  }\n\n  override render() {\n    const isChecked = this.checked;\n    const forwardedAriaLabel = this.getAttribute('aria-label') ?? undefined;\n\n    return html`\n              <div class=\"outer-container\">\n                <div\n                  class=${classMap({\n                    wrapper: true,\n                    checked: isChecked,\n                    unchecked: !isChecked,\n                    dragging: this.dragging,\n                    'tmp-checked': this.tmpChecked && this.dragging,\n                    'tmp-unchecked': !this.tmpChecked && this.dragging,\n                    disabled: this.disabled,\n                    'has-alert': this.hasAlert,\n                    'size-regular': this.size === 'regular',\n                    'size-large': this.size === 'large',\n                    'variant-normal': this.variant === 'normal',\n                    'variant-running': this.variant === 'running',\n                    'variant-loading': this.variant === 'loading',\n                  })}\n                  tabindex=${this.disabled ? -1 : 0}\n                  role=\"switch\"\n                  aria-checked=${isChecked ? 'true' : 'false'}\n                  aria-disabled=${this.disabled ? 'true' : 'false'}\n                  aria-label=${ifDefined(forwardedAriaLabel)}\n                  @keydown=${this.handleKeydown}\n                >\n                  <div class=\"button-track\">\n                    <button\n                      class=\"button\"\n                      style=${this.getButtonStyle()}\n                      @mousedown=${this.disabled ? undefined : this.onDragStart}\n                      @touchstart=${\n                        this.disabled ? undefined : this.onDragStart\n                      }\n                      ?disabled=${this.disabled}\n                      tabindex=\"-1\"\n                    >\n                      ${\n                        !this.disabled\n                          ? html`\n                              <div class=\"button-visible\">\n                                <obi-arrow-right-google\n                                  class=\"button-icon\"\n                                  aria-hidden=\"true\"\n                                ></obi-arrow-right-google>\n                                <div class=\"button-label\">\n                                  <slot\n                                    name=${isChecked\n                                      ? 'to-unchecked-action-label'\n                                      : 'to-checked-action-label'}\n                                  ></slot>\n                                </div>\n                              </div>\n                            `\n                          : ''\n                      }\n                    </button>\n                    ${\n                      !this.disabled\n                        ? html`<div class=\"button-track-checked\"></div>`\n                        : ''\n                    }\n                    <div class=\"checked state\">\n                      <slot name=\"checked-state-icon\"></slot>\n                      <div class=\"state-label\">\n                        <slot name=\"checked-state-label\"></slot>\n                      </div>\n                    </div>\n                    <div class=\"unchecked state\">\n                      <slot name=\"unchecked-state-icon\"></slot>\n                      <div class=\"state-label\">\n                        <slot name=\"unchecked-state-label\"></slot>\n                      </div>\n                    </div>\n                  </div>\n                  ${this.hasAlert ? html`<div class=\"alert-frame\"></div>` : ''}\n                </div>\n                ${\n                  this.hasDescription\n                    ? html`<div class=\"description\">${this.description}</div>`\n                    : ''\n                }\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-start-stop-switch': ObcStartStopSwitch;\n  }\n}\n"],"names":["StartStopSwitchVariant","StartStopSwitchSize"],"mappings":"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"}

package/dist/navigation-instruments/azimuth-thruster-labeled/azimuth-thruster-labeled.d.ts

@@ -25,7 +25,8 @@ export declare enum AzimuthThrusterLabeledSize {
  * @availableWhen autoAtThrustSetpointDeadband thrustSetpoint!=undefined && autoAtThrustSetpoint==true
  * @availableWhen thrustSetpointAtZeroDeadband thrustSetpoint!=undefined
  * @availableWhen thrustSetpointOverride thrustSetpoint!=undefined
- * @deprecated
+ * @deprecated The azimuth-thruster-labeled component is deprecated and will be removed in future releases.
+ * Please make a combined component by using <obc-azimuth-thruster> in combination with <obc-readout> instead.
  */
 export declare class ObcAzimuthThrusterLabeled extends LitElement {
     label: string;

package/dist/navigation-instruments/azimuth-thruster-labeled/azimuth-thruster-labeled.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"azimuth-thruster-labeled.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/azimuth-thruster-labeled/azimuth-thruster-labeled.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAGhD,OAAO,EAAC,aAAa,EAAC,MAAM,mCAAmC,CAAC;AAEhE,OAAO,mCAAmC,CAAC;AAC3C,OAAO,yCAAyC,CAAC;AACjD,OAAO,uBAAuB,CAAC;AAE/B,OAAO,EAAC,gBAAgB,EAAC,MAAM,sDAAsD,CAAC;AAEtF,OAAO,EAAC,WAAW,EAAC,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAC,YAAY,EAAC,MAAM,uBAAuB,CAAC;AACnD,OAAO,EAAC,aAAa,EAAC,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAC,aAAa,EAAC,MAAM,sBAAsB,CAAC;AAGnD,oBAAY,0BAA0B;IACpC,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB;AAED;;;;;;;;;;;;;;GAcG;AACH,qBACa,yBAA0B,SAAQ,UAAU;IAC7B,KAAK,SAAM;IAErC,aAAa,EAAE,aAAa,CAA2B;IAC7B,IAAI,EAAE,0BAA0B,CACtB;IACV,WAAW,EAAE,gBAAgB,CAC9B;IACC,KAAK,SAAK;IACV,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC;IAE/D,eAAe,EAAE,OAAO,CAAS;IACP,2BAA2B,EAAE,MAAM,CAAO;IACzC,qBAAqB,EAAE,OAAO,CAAS;IACrB,mBAAmB,EAAE,OAAO,CAClE;IACmB,2BAA2B,EAAE,MAAM,CAAK;IACvC,QAAQ,EAAE,OAAO,CAAS;IAE3B,MAAM,SAAK;IACX,cAAc,CAAC,EAAE,MAAM,CAAC;IAElD,gBAAgB,EAAE,OAAO,CAAS;IACW,oBAAoB,EAAE,OAAO,CACnE;IACmB,4BAA4B,EAAE,MAAM,CAAK;IACzC,4BAA4B,EAAE,MAAM,CAAO;IAC1C,sBAAsB,EAAE,OAAO,CAAS;IACxB,YAAY,EAAE,WAAW,EAAE,CAAM;IACjC,aAAa,EAAE,YAAY,EAAE,CAAM;IACpD,aAAa,EAAE,aAAa,CAC9B;IACG,eAAe,EAAE,OAAO,CAAS;IAClC,YAAY,EAAE,aAAa,CAAsB;IACjD,eAAe,EAAE,aAAa,CAAsB;IAErE,MAAM;IAkHf,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,8BAA8B,EAAE,yBAAyB,CAAC;KAC3D;CACF"}
+{"version":3,"file":"azimuth-thruster-labeled.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/azimuth-thruster-labeled/azimuth-thruster-labeled.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAGhD,OAAO,EAAC,aAAa,EAAC,MAAM,mCAAmC,CAAC;AAEhE,OAAO,mCAAmC,CAAC;AAC3C,OAAO,yCAAyC,CAAC;AACjD,OAAO,uBAAuB,CAAC;AAE/B,OAAO,EAAC,gBAAgB,EAAC,MAAM,sDAAsD,CAAC;AAEtF,OAAO,EAAC,WAAW,EAAC,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EAAC,YAAY,EAAC,MAAM,uBAAuB,CAAC;AACnD,OAAO,EAAC,aAAa,EAAC,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAC,aAAa,EAAC,MAAM,sBAAsB,CAAC;AAGnD,oBAAY,0BAA0B;IACpC,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB;AAED;;;;;;;;;;;;;;;GAeG;AACH,qBACa,yBAA0B,SAAQ,UAAU;IAC7B,KAAK,SAAM;IAErC,aAAa,EAAE,aAAa,CAA2B;IAC7B,IAAI,EAAE,0BAA0B,CACtB;IACV,WAAW,EAAE,gBAAgB,CAC9B;IACC,KAAK,SAAK;IACV,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAC;IAE/D,eAAe,EAAE,OAAO,CAAS;IACP,2BAA2B,EAAE,MAAM,CAAO;IACzC,qBAAqB,EAAE,OAAO,CAAS;IACrB,mBAAmB,EAAE,OAAO,CAClE;IACmB,2BAA2B,EAAE,MAAM,CAAK;IACvC,QAAQ,EAAE,OAAO,CAAS;IAE3B,MAAM,SAAK;IACX,cAAc,CAAC,EAAE,MAAM,CAAC;IAElD,gBAAgB,EAAE,OAAO,CAAS;IACW,oBAAoB,EAAE,OAAO,CACnE;IACmB,4BAA4B,EAAE,MAAM,CAAK;IACzC,4BAA4B,EAAE,MAAM,CAAO;IAC1C,sBAAsB,EAAE,OAAO,CAAS;IACxB,YAAY,EAAE,WAAW,EAAE,CAAM;IACjC,aAAa,EAAE,YAAY,EAAE,CAAM;IACpD,aAAa,EAAE,aAAa,CAC9B;IACG,eAAe,EAAE,OAAO,CAAS;IAClC,YAAY,EAAE,aAAa,CAAsB;IACjD,eAAe,EAAE,aAAa,CAAsB;IAErE,MAAM;IAkHf,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,8BAA8B,EAAE,yBAAyB,CAAC;KAC3D;CACF"}

package/dist/navigation-instruments/azimuth-thruster-labeled/azimuth-thruster-labeled.js.map

@@ -1 +1 @@
-{"version":3,"file":"azimuth-thruster-labeled.js","sources":["../../../src/navigation-instruments/azimuth-thruster-labeled/azimuth-thruster-labeled.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport compentStyle from './azimuth-thruster-labeled.css?inline';\nimport {CommandStatus} from '../badge-command/badge-command.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport '../badge-command/badge-command.js';\nimport '../azimuth-thruster/azimuth-thruster.js';\nimport '../readout/readout.js';\nimport {ReadoutDirection} from '../readout/readout.js';\nimport {ReadoutBlockSize} from '../../building-blocks/readout-block/readout-block.js';\nimport {InstrumentState, Priority} from '../types.js';\nimport {AngleAdvice} from '../watch/advice.js';\nimport {LinearAdvice} from '../thruster/advice.js';\nimport {PropellerType} from '../thruster/propeller.js';\nimport {TickmarkStyle} from '../watch/tickmark.js';\nimport {customElement} from '../../decorator.js';\n\nexport enum AzimuthThrusterLabeledSize {\n  medium = 'medium',\n  large = 'large',\n}\n\n/**\n * @availableWhen newAngleSetpoint angleSetpoint!=undefined\n * @availableWhen atAngleSetpoint angleSetpoint!=undefined && autoAtAngleSetpoint==false\n * @availableWhen angleSetpointAtZeroDeadband angleSetpoint!=undefined\n * @availableWhen angleSetpointOverride angleSetpoint!=undefined\n * @availableWhen autoAtAngleSetpoint angleSetpoint!=undefined\n * @availableWhen autoAtAngleSetpointDeadband angleSetpoint!=undefined && autoAtAngleSetpoint==true\n * @availableWhen touching angleSetpoint!=undefined || thrustSetpoint!=undefined\n * @availableWhen atThrustSetpoint thrustSetpoint!=undefined && autoAtThrustSetpoint==false\n * @availableWhen autoAtThrustSetpoint thrustSetpoint!=undefined\n * @availableWhen autoAtThrustSetpointDeadband thrustSetpoint!=undefined && autoAtThrustSetpoint==true\n * @availableWhen thrustSetpointAtZeroDeadband thrustSetpoint!=undefined\n * @availableWhen thrustSetpointOverride thrustSetpoint!=undefined\n * @deprecated\n */\n@customElement('obc-azimuth-thruster-labeled')\nexport class ObcAzimuthThrusterLabeled extends LitElement {\n  @property({type: String}) label = '';\n  @property({type: String})\n  commandStatus: CommandStatus = CommandStatus.InCommand;\n  @property({type: String}) size: AzimuthThrusterLabeledSize =\n    AzimuthThrusterLabeledSize.medium;\n  @property({type: String}) readoutSize: ReadoutBlockSize =\n    ReadoutBlockSize.large;\n  @property({type: Number}) angle = 0;\n  @property({type: Number}) angleSetpoint?: number;\n  @property({type: Number}) newAngleSetpoint: number | undefined;\n  @property({type: Boolean})\n  atAngleSetpoint: boolean = false;\n  @property({type: Number}) angleSetpointAtZeroDeadband: number = 0.5;\n  @property({type: Boolean}) angleSetpointOverride: boolean = false;\n  @property({type: Boolean, attribute: false}) autoAtAngleSetpoint: boolean =\n    true;\n  @property({type: Number}) autoAtAngleSetpointDeadband: number = 2;\n  @property({type: Boolean}) touching: boolean = false;\n\n  @property({type: Number}) thrust = 0;\n  @property({type: Number}) thrustSetpoint?: number;\n  @property({type: Boolean})\n  atThrustSetpoint: boolean = false;\n  @property({type: Boolean, attribute: false}) autoAtThrustSetpoint: boolean =\n    true;\n  @property({type: Number}) autoAtThrustSetpointDeadband: number = 1;\n  @property({type: Number}) thrustSetpointAtZeroDeadband: number = 0.1;\n  @property({type: Boolean}) thrustSetpointOverride: boolean = false;\n  @property({type: Array, attribute: false}) angleAdvices: AngleAdvice[] = [];\n  @property({type: Array, attribute: false}) thrustAdvices: LinearAdvice[] = [];\n  @property({type: String}) tickmarkStyle: TickmarkStyle =\n    TickmarkStyle.regular;\n  @property({type: Boolean}) singleDirection: boolean = false;\n  @property({type: String}) topPropeller: PropellerType = PropellerType.none;\n  @property({type: String}) bottomPropeller: PropellerType = PropellerType.none;\n\n  override render() {\n    let state: InstrumentState = InstrumentState.active;\n    let priority: Priority = Priority.enhanced;\n    const isNotInCommand = [\n      CommandStatus.NoCommand,\n      CommandStatus.Blocked,\n      CommandStatus.CommandAvailable,\n    ].includes(this.commandStatus);\n\n    if (isNotInCommand) {\n      state = InstrumentState.active;\n      priority = Priority.regular;\n    }\n\n    const readoutPriority = isNotInCommand\n      ? Priority.regular\n      : Priority.enhanced;\n\n    const effectiveReadoutSize = isNotInCommand\n      ? ReadoutBlockSize.medium\n      : this.readoutSize;\n\n    return html`\n      <div class=${classMap({wrapper: true, [this.size]: true})}>\n        <div class=\"label\">\n          <obc-badge-command\n            class=\"badge\"\n            status=${this.commandStatus}\n            ?large=${this.size === AzimuthThrusterLabeledSize.large}\n          ></obc-badge-command>\n          <div class=\"label-text\">${this.label}</div>\n        </div>\n        <obc-readout\n          class=\"readout-angle\"\n          .size=${effectiveReadoutSize}\n          .direction=${ReadoutDirection.vertical}\n          .hasSetpoint=${true}\n          .setpoint=${this.angleSetpoint}\n          .priority=${readoutPriority}\n          .value=${this.angle}\n          label=\"Angle\"\n          unit=\"DEG\"\n        >\n          <svg\n            slot=\"setpoint-icon\"\n            width=\"16\"\n            height=\"16\"\n            viewBox=\"0 0 16 16\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <path\n              d=\"M4.66797 4.80263C4.66797 4.14363 5.45194 3.76746 6.0013 4.16286L10.4456 7.17243C11.0312 7.56899 11.0314 8.43154 10.4459 8.82828L6.0013 11.8401C5.45194 12.2355 4.66797 11.8593 4.66797 11.2003L4.66797 4.80263Z\"\n              fill=\"var(--instrument-enhanced-primary-color)\"\n            />\n          </svg>\n        </obc-readout>\n        <obc-readout\n          class=\"readout-power\"\n          .size=${effectiveReadoutSize}\n          .direction=${ReadoutDirection.vertical}\n          .hasSetpoint=${true}\n          .setpoint=${this.thrustSetpoint}\n          .priority=${readoutPriority}\n          .value=${this.thrust}\n          label=\"Power\"\n          unit=\"%\"\n        >\n          <svg\n            slot=\"setpoint-icon\"\n            width=\"16\"\n            height=\"16\"\n            viewBox=\"0 0 16 16\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <path\n              d=\"M4.66797 4.80263C4.66797 4.14363 5.45194 3.76746 6.0013 4.16286L10.4456 7.17243C11.0312 7.56899 11.0314 8.43154 10.4459 8.82828L6.0013 11.8401C5.45194 12.2355 4.66797 11.8593 4.66797 11.2003L4.66797 4.80263Z\"\n              fill=\"var(--instrument-enhanced-primary-color)\"\n            />\n          </svg>\n        </obc-readout>\n        <obc-azimuth-thruster\n          class=\"azimuth-thruster\"\n          .hasLabelSpacer=${false}\n          .thrust=${this.thrust}\n          .thrustSetpoint=${this.thrustSetpoint}\n          .autoAtThrustSetpoint=${this.autoAtThrustSetpoint}\n          .autoAtThrustSetpointDeadband=${this.autoAtThrustSetpointDeadband}\n          .angle=${this.angle}\n          .angleSetpoint=${this.angleSetpoint}\n          .autoAtAngleSetpoint=${this.autoAtAngleSetpoint}\n          .autoAtAngleSetpointDeadband=${this.autoAtAngleSetpointDeadband}\n          .atThrustSetpoint=${this.atThrustSetpoint}\n          .atAngleSetpoint=${this.atAngleSetpoint}\n          .newAngleSetpoint=${this.newAngleSetpoint}\n          .angleSetpointAtZeroDeadband=${this.angleSetpointAtZeroDeadband}\n          .angleSetpointOverride=${this.angleSetpointOverride}\n          .thrustSetpointAtZeroDeadband=${this.thrustSetpointAtZeroDeadband}\n          .thrustSetpointOverride=${this.thrustSetpointOverride}\n          .state=${state}\n          .priority=${priority}\n          .touching=${this.touching}\n          .angleAdvices=${this.angleAdvices}\n          .thrustAdvices=${this.thrustAdvices}\n          .singleDirection=${this.singleDirection}\n          .tickmarkStyle=${this.tickmarkStyle}\n          .topPropeller=${this.topPropeller}\n          .bottomPropeller=${this.bottomPropeller}\n        ></obc-azimuth-thruster>\n      </div>\n    `;\n  }\n\n  static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-azimuth-thruster-labeled': ObcAzimuthThrusterLabeled;\n  }\n}\n"],"names":["AzimuthThrusterLabeledSize"],"mappings":"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"}
+{"version":3,"file":"azimuth-thruster-labeled.js","sources":["../../../src/navigation-instruments/azimuth-thruster-labeled/azimuth-thruster-labeled.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport compentStyle from './azimuth-thruster-labeled.css?inline';\nimport {CommandStatus} from '../badge-command/badge-command.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport '../badge-command/badge-command.js';\nimport '../azimuth-thruster/azimuth-thruster.js';\nimport '../readout/readout.js';\nimport {ReadoutDirection} from '../readout/readout.js';\nimport {ReadoutBlockSize} from '../../building-blocks/readout-block/readout-block.js';\nimport {InstrumentState, Priority} from '../types.js';\nimport {AngleAdvice} from '../watch/advice.js';\nimport {LinearAdvice} from '../thruster/advice.js';\nimport {PropellerType} from '../thruster/propeller.js';\nimport {TickmarkStyle} from '../watch/tickmark.js';\nimport {customElement} from '../../decorator.js';\n\nexport enum AzimuthThrusterLabeledSize {\n  medium = 'medium',\n  large = 'large',\n}\n\n/**\n * @availableWhen newAngleSetpoint angleSetpoint!=undefined\n * @availableWhen atAngleSetpoint angleSetpoint!=undefined && autoAtAngleSetpoint==false\n * @availableWhen angleSetpointAtZeroDeadband angleSetpoint!=undefined\n * @availableWhen angleSetpointOverride angleSetpoint!=undefined\n * @availableWhen autoAtAngleSetpoint angleSetpoint!=undefined\n * @availableWhen autoAtAngleSetpointDeadband angleSetpoint!=undefined && autoAtAngleSetpoint==true\n * @availableWhen touching angleSetpoint!=undefined || thrustSetpoint!=undefined\n * @availableWhen atThrustSetpoint thrustSetpoint!=undefined && autoAtThrustSetpoint==false\n * @availableWhen autoAtThrustSetpoint thrustSetpoint!=undefined\n * @availableWhen autoAtThrustSetpointDeadband thrustSetpoint!=undefined && autoAtThrustSetpoint==true\n * @availableWhen thrustSetpointAtZeroDeadband thrustSetpoint!=undefined\n * @availableWhen thrustSetpointOverride thrustSetpoint!=undefined\n * @deprecated The azimuth-thruster-labeled component is deprecated and will be removed in future releases.\n * Please make a combined component by using <obc-azimuth-thruster> in combination with <obc-readout> instead.\n */\n@customElement('obc-azimuth-thruster-labeled')\nexport class ObcAzimuthThrusterLabeled extends LitElement {\n  @property({type: String}) label = '';\n  @property({type: String})\n  commandStatus: CommandStatus = CommandStatus.InCommand;\n  @property({type: String}) size: AzimuthThrusterLabeledSize =\n    AzimuthThrusterLabeledSize.medium;\n  @property({type: String}) readoutSize: ReadoutBlockSize =\n    ReadoutBlockSize.large;\n  @property({type: Number}) angle = 0;\n  @property({type: Number}) angleSetpoint?: number;\n  @property({type: Number}) newAngleSetpoint: number | undefined;\n  @property({type: Boolean})\n  atAngleSetpoint: boolean = false;\n  @property({type: Number}) angleSetpointAtZeroDeadband: number = 0.5;\n  @property({type: Boolean}) angleSetpointOverride: boolean = false;\n  @property({type: Boolean, attribute: false}) autoAtAngleSetpoint: boolean =\n    true;\n  @property({type: Number}) autoAtAngleSetpointDeadband: number = 2;\n  @property({type: Boolean}) touching: boolean = false;\n\n  @property({type: Number}) thrust = 0;\n  @property({type: Number}) thrustSetpoint?: number;\n  @property({type: Boolean})\n  atThrustSetpoint: boolean = false;\n  @property({type: Boolean, attribute: false}) autoAtThrustSetpoint: boolean =\n    true;\n  @property({type: Number}) autoAtThrustSetpointDeadband: number = 1;\n  @property({type: Number}) thrustSetpointAtZeroDeadband: number = 0.1;\n  @property({type: Boolean}) thrustSetpointOverride: boolean = false;\n  @property({type: Array, attribute: false}) angleAdvices: AngleAdvice[] = [];\n  @property({type: Array, attribute: false}) thrustAdvices: LinearAdvice[] = [];\n  @property({type: String}) tickmarkStyle: TickmarkStyle =\n    TickmarkStyle.regular;\n  @property({type: Boolean}) singleDirection: boolean = false;\n  @property({type: String}) topPropeller: PropellerType = PropellerType.none;\n  @property({type: String}) bottomPropeller: PropellerType = PropellerType.none;\n\n  override render() {\n    let state: InstrumentState = InstrumentState.active;\n    let priority: Priority = Priority.enhanced;\n    const isNotInCommand = [\n      CommandStatus.NoCommand,\n      CommandStatus.Blocked,\n      CommandStatus.CommandAvailable,\n    ].includes(this.commandStatus);\n\n    if (isNotInCommand) {\n      state = InstrumentState.active;\n      priority = Priority.regular;\n    }\n\n    const readoutPriority = isNotInCommand\n      ? Priority.regular\n      : Priority.enhanced;\n\n    const effectiveReadoutSize = isNotInCommand\n      ? ReadoutBlockSize.medium\n      : this.readoutSize;\n\n    return html`\n      <div class=${classMap({wrapper: true, [this.size]: true})}>\n        <div class=\"label\">\n          <obc-badge-command\n            class=\"badge\"\n            status=${this.commandStatus}\n            ?large=${this.size === AzimuthThrusterLabeledSize.large}\n          ></obc-badge-command>\n          <div class=\"label-text\">${this.label}</div>\n        </div>\n        <obc-readout\n          class=\"readout-angle\"\n          .size=${effectiveReadoutSize}\n          .direction=${ReadoutDirection.vertical}\n          .hasSetpoint=${true}\n          .setpoint=${this.angleSetpoint}\n          .priority=${readoutPriority}\n          .value=${this.angle}\n          label=\"Angle\"\n          unit=\"DEG\"\n        >\n          <svg\n            slot=\"setpoint-icon\"\n            width=\"16\"\n            height=\"16\"\n            viewBox=\"0 0 16 16\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <path\n              d=\"M4.66797 4.80263C4.66797 4.14363 5.45194 3.76746 6.0013 4.16286L10.4456 7.17243C11.0312 7.56899 11.0314 8.43154 10.4459 8.82828L6.0013 11.8401C5.45194 12.2355 4.66797 11.8593 4.66797 11.2003L4.66797 4.80263Z\"\n              fill=\"var(--instrument-enhanced-primary-color)\"\n            />\n          </svg>\n        </obc-readout>\n        <obc-readout\n          class=\"readout-power\"\n          .size=${effectiveReadoutSize}\n          .direction=${ReadoutDirection.vertical}\n          .hasSetpoint=${true}\n          .setpoint=${this.thrustSetpoint}\n          .priority=${readoutPriority}\n          .value=${this.thrust}\n          label=\"Power\"\n          unit=\"%\"\n        >\n          <svg\n            slot=\"setpoint-icon\"\n            width=\"16\"\n            height=\"16\"\n            viewBox=\"0 0 16 16\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <path\n              d=\"M4.66797 4.80263C4.66797 4.14363 5.45194 3.76746 6.0013 4.16286L10.4456 7.17243C11.0312 7.56899 11.0314 8.43154 10.4459 8.82828L6.0013 11.8401C5.45194 12.2355 4.66797 11.8593 4.66797 11.2003L4.66797 4.80263Z\"\n              fill=\"var(--instrument-enhanced-primary-color)\"\n            />\n          </svg>\n        </obc-readout>\n        <obc-azimuth-thruster\n          class=\"azimuth-thruster\"\n          .hasLabelSpacer=${false}\n          .thrust=${this.thrust}\n          .thrustSetpoint=${this.thrustSetpoint}\n          .autoAtThrustSetpoint=${this.autoAtThrustSetpoint}\n          .autoAtThrustSetpointDeadband=${this.autoAtThrustSetpointDeadband}\n          .angle=${this.angle}\n          .angleSetpoint=${this.angleSetpoint}\n          .autoAtAngleSetpoint=${this.autoAtAngleSetpoint}\n          .autoAtAngleSetpointDeadband=${this.autoAtAngleSetpointDeadband}\n          .atThrustSetpoint=${this.atThrustSetpoint}\n          .atAngleSetpoint=${this.atAngleSetpoint}\n          .newAngleSetpoint=${this.newAngleSetpoint}\n          .angleSetpointAtZeroDeadband=${this.angleSetpointAtZeroDeadband}\n          .angleSetpointOverride=${this.angleSetpointOverride}\n          .thrustSetpointAtZeroDeadband=${this.thrustSetpointAtZeroDeadband}\n          .thrustSetpointOverride=${this.thrustSetpointOverride}\n          .state=${state}\n          .priority=${priority}\n          .touching=${this.touching}\n          .angleAdvices=${this.angleAdvices}\n          .thrustAdvices=${this.thrustAdvices}\n          .singleDirection=${this.singleDirection}\n          .tickmarkStyle=${this.tickmarkStyle}\n          .topPropeller=${this.topPropeller}\n          .bottomPropeller=${this.bottomPropeller}\n        ></obc-azimuth-thruster>\n      </div>\n    `;\n  }\n\n  static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-azimuth-thruster-labeled': ObcAzimuthThrusterLabeled;\n  }\n}\n"],"names":["AzimuthThrusterLabeledSize"],"mappings":"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"}

package/dist/navigation-instruments/instrument-field/instrument-field.d.ts

@@ -52,7 +52,9 @@ export declare enum InstrumentFieldSize {
  *
  * @csspart label - The container for the tag and unit.
  * @csspart tag - The tag text element.
- * @deprecated
+ * @deprecated The instrument-field component is deprecated and will be removed in future releases.
+ * Please use the <obc-readout> component instead. See storybook for migration details.
+ * https://openbridge-next-storybook.web.app/?path=/docs/instruments-instrument-field-deprecated--docs
  */
 export declare class ObcInstrumentField extends LitElement {
     /** The size of the instrument field. */

package/dist/navigation-instruments/instrument-field/instrument-field.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"instrument-field.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/instrument-field/instrument-field.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAA2B,MAAM,KAAK,CAAC;AAIzD,OAAO,mCAAmC,CAAC;AAC3C,OAAO,sCAAsC,CAAC;AAC9C,OAAO,qDAAqD,CAAC;AAI7D;;;;GAIG;AACH,oBAAY,mBAAmB;IAC7B,OAAO,YAAY;IACnB,QAAQ,aAAa;CACtB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,qBACa,kBAAmB,SAAQ,UAAU;IACtB,IAAI,EAAE,mBAAmB,CACrB;IAEJ,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAE5B,WAAW,UAAS;IAEpB,MAAM,UAAS;IAEhB,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAE1B,SAAS,SAAK;IAEb,eAAe,UAAS;IAEzB,cAAc,SAAK;IAEnB,GAAG,SAAM;IAET,IAAI,SAAM;IAEV,GAAG,SAAM;IAER,YAAY,UAAS;IAErB,UAAU,UAAS;IAEnB,MAAM,UAAS;IAEf,SAAS,UAAS;IAElB,GAAG,UAAS;IAEZ,gBAAgB,UAAS;IAE1B,gBAAgB,SAAK;IAE/C;;;OAGG;IACH,eAAe,IAAI,MAAM;IAchB,MAAM;IA0Ef;;;OAGG;IACH,IAAI,wBAAwB,IAAI,MAAM,CAMrC;IAED;;;OAGG;IACH,IAAI,gBAAgB,IAAI,MAAM,CAM7B;IAED;;;OAGG;IACH,IAAI,SAAS,IAAI,MAAM,CAUtB;IAED,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,sBAAsB,EAAE,kBAAkB,CAAC;KAC5C;CACF"}
+{"version":3,"file":"instrument-field.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/instrument-field/instrument-field.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAA2B,MAAM,KAAK,CAAC;AAIzD,OAAO,mCAAmC,CAAC;AAC3C,OAAO,sCAAsC,CAAC;AAC9C,OAAO,qDAAqD,CAAC;AAI7D;;;;GAIG;AACH,oBAAY,mBAAmB;IAC7B,OAAO,YAAY;IACnB,QAAQ,aAAa;CACtB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,qBACa,kBAAmB,SAAQ,UAAU;IACtB,IAAI,EAAE,mBAAmB,CACrB;IAEJ,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAE5B,WAAW,UAAS;IAEpB,MAAM,UAAS;IAEhB,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAE1B,SAAS,SAAK;IAEb,eAAe,UAAS;IAEzB,cAAc,SAAK;IAEnB,GAAG,SAAM;IAET,IAAI,SAAM;IAEV,GAAG,SAAM;IAER,YAAY,UAAS;IAErB,UAAU,UAAS;IAEnB,MAAM,UAAS;IAEf,SAAS,UAAS;IAElB,GAAG,UAAS;IAEZ,gBAAgB,UAAS;IAE1B,gBAAgB,SAAK;IAE/C;;;OAGG;IACH,eAAe,IAAI,MAAM;IAchB,MAAM;IA0Ef;;;OAGG;IACH,IAAI,wBAAwB,IAAI,MAAM,CAMrC;IAED;;;OAGG;IACH,IAAI,gBAAgB,IAAI,MAAM,CAM7B;IAED;;;OAGG;IACH,IAAI,SAAS,IAAI,MAAM,CAUtB;IAED,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,sBAAsB,EAAE,kBAAkB,CAAC;KAC5C;CACF"}

package/dist/navigation-instruments/instrument-field/instrument-field.js.map

@@ -1 +1 @@
-{"version":3,"file":"instrument-field.js","sources":["../../../src/navigation-instruments/instrument-field/instrument-field.ts"],"sourcesContent":["import {LitElement, html, nothing, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport compentStyle from './instrument-field.css?inline';\nimport {classMap} from 'lit/directives/class-map.js';\nimport '../../components/button/button.js';\nimport '../../icons/icon-drop-down-google.js';\nimport '../../components/navigation-item/navigation-item.js';\nimport {customElement} from '../../decorator.js';\nimport {READOUT_UNAVAILABLE_DASH} from '../readout/readout-formatters.js';\n\n/**\n * Enum for instrument field sizes.\n * - `regular`: Standard size for navigation instrument data fields.\n * - `enhanced`: Larger size with increased visual prominence.\n */\nexport enum InstrumentFieldSize {\n  regular = 'regular',\n  enhanced = 'enhanced',\n}\n\n/**\n * `<obc-instrument-field>` – A component for displaying navigation instrument data.\n *\n * This component is used to show a primary value, an optional setpoint, units, and a source (e.g., GPS, Gyro).\n * It supports different sizes, horizontal/vertical layouts, and configurable numeric formatting.\n *\n * ### Features\n * - **Sizes:** Supports `regular` and `enhanced` sizes.\n * - **Setpoint:** Optional setpoint display with an arrow indicator.\n * - **Source Picker:** Optional source selection with a dropdown and context menu.\n * - **Formatting:** Customizable integer and fraction digits, with optional zero padding.\n * - **Status Indicators:** Supports an \"OFF\" state and neutral color mode.\n * - **Layouts:** Can be oriented horizontally or vertically, with various alignment options.\n *\n * ### Slots\n * | Slot Name           | Purpose                                                                 |\n * |---------------------|-------------------------------------------------------------------------|\n * | off-value           | Content to display when the `off` property is true (defaults to \"OFF\"). |\n *\n * @property size - The size of the instrument field.\n * @property setpoint - The setpoint value to display.\n * @property hasSetpoint - Whether to show the setpoint.\n * @property hasSrc - Whether to show the source (src) field.\n * @property value - The primary value to display.\n * @property maxDigits - The maximum number of integer digits to show (for zero padding).\n * @property showZeroPadding - Whether to show leading zeros up to `maxDigits`.\n * @property fractionDigits - The number of decimal places to display.\n * @property tag - The tag or label for the data (e.g., \"HDG\", \"SPD\").\n * @property unit - The unit of measurement (e.g., \"DEG\", \"KN\").\n * @property src - The current source name (e.g., \"GPS 1\").\n * @property neutralColor - If true, uses a neutral color scheme instead of the default instrument color.\n * @property horizontal - If true, uses a horizontal layout.\n * @property center - If true, centers the content.\n * @property labelOnly - If true, only the label (tag and unit) is displayed.\n * @property off - If true, displays the \"off\" state (e.g., showing \"OFF\" instead of value).\n * @property autoHideSetpoint - If true, automatically hides the setpoint when the value is close to it.\n * @property autoHideDeadband - The deadband within which the setpoint is hidden if `autoHideSetpoint` is true.\n * @slot off-value - Content to display when the `off` property is true (defaults to \"OFF\").\n *\n * @csspart label - The container for the tag and unit.\n * @csspart tag - The tag text element.\n * @deprecated\n */\n@customElement('obc-instrument-field')\nexport class ObcInstrumentField extends LitElement {\n  @property({type: String}) size: InstrumentFieldSize =\n    InstrumentFieldSize.regular;\n\n  @property({type: Number}) setpoint: number | undefined;\n\n  @property({type: Boolean}) hasSetpoint = false;\n\n  @property({type: Boolean}) hasSrc = false;\n\n  @property({type: Number}) value: number | undefined;\n\n  @property({type: Number}) maxDigits = 1;\n\n  @property({type: Boolean}) showZeroPadding = false;\n\n  @property({type: Number}) fractionDigits = 0;\n\n  @property({type: String}) tag = '';\n\n  @property({type: String}) unit = '';\n\n  @property({type: String}) src = '';\n\n  @property({type: Boolean}) neutralColor = false;\n\n  @property({type: Boolean}) horizontal = false;\n\n  @property({type: Boolean}) center = false;\n\n  @property({type: Boolean}) labelOnly = false;\n\n  @property({type: Boolean}) off = false;\n\n  @property({type: Boolean}) autoHideSetpoint = false;\n\n  @property({type: Number}) autoHideDeadband = 0;\n\n  /**\n   * Generates a dashed string representation for undefined values.\n   * @returns A string of dashes formatted according to the current numeric settings.\n   */\n  dashedGenerator(): string {\n    const n = this.showZeroPadding ? Math.max(this.maxDigits, 1) : 1;\n    if (this.fractionDigits < 1) {\n      return READOUT_UNAVAILABLE_DASH.repeat(n);\n    } else {\n      const diff = n - this.fractionDigits;\n      return (\n        READOUT_UNAVAILABLE_DASH.repeat(Math.max(diff, 1)) +\n        '.' +\n        READOUT_UNAVAILABLE_DASH.repeat(this.fractionDigits)\n      );\n    }\n  }\n\n  override render() {\n    const hideSetpoint =\n      this.hasSetpoint &&\n      this.autoHideSetpoint &&\n      this.setpoint !== undefined &&\n      this.value !== undefined &&\n      Math.abs(this.setpoint - this.value) <= this.autoHideDeadband;\n\n    return html`\n      <div\n        class=${classMap({\n          wrapper: true,\n          [this.size]: true,\n          'neutral-color': this.neutralColor,\n          off: this.off,\n          horizontal: this.horizontal,\n          center: this.center,\n          'left-aligned':\n            this.labelOnly || (this.horizontal && !this.hasSetpoint),\n          'hide-setpoint': hideSetpoint,\n          'show-zero-padding': this.showZeroPadding,\n        })}\n      >\n        ${this.horizontal && this.size === InstrumentFieldSize.regular\n          ? html`<div class=\"label\">\n              <div class=\"tag\" part=\"tag\">${this.tag}</div>\n            </div>`\n          : nothing}\n        ${this.hasSetpoint\n          ? html`<div class=\"setpoint\">\n              <svg\n                class=\"setpoint-arrow\"\n                width=\"16\"\n                height=\"16\"\n                viewBox=\"0 0 16 16\"\n                fill=\"none\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n              >\n                <path\n                  fill=\"var(--instrument-enhanced-secondary-color)\"\n                  d=\"M4.66797 4.80263C4.66797 4.14363 5.45194 3.76746 6.0013 4.16286L10.4456 7.17243C11.0312 7.56899 11.0314 8.43154 10.4459 8.82828L6.0013 11.8401C5.45194 12.2355 4.66797 11.8593 4.66797 11.2003L4.66797 4.80263Z\"\n                  fill=\"var(--instrument-enhanced-primary-color)\"\n                />\n              </svg>\n              <div class=\"setpoint-value\">${this.setpointValueBlueNumbers}</div>\n            </div>`\n          : nothing}\n        ${this.horizontal && !this.labelOnly && this.hasSetpoint\n          ? html`<div class=\"divider\"></div>`\n          : nothing}\n        ${!this.labelOnly\n          ? html` <div class=\"value\">\n              ${this.off\n                ? html`<div class=\"value-blue\">\n                    <slot name=\"off-value\">OFF</slot>\n                  </div>`\n                : html` <div class=\"value-hint-zero\">${this.hintZeros}</div>\n                    <div class=\"value-blue\">${this.valueBlueNumbers}</div>`}\n            </div>`\n          : nothing}\n        <div class=\"label\" part=\"label\">\n          ${this.horizontal && this.size === InstrumentFieldSize.regular\n            ? nothing\n            : html`<div class=\"tag\" part=\"tag\">${this.tag}</div>`}\n          <div class=\"unit\">${this.unit}</div>\n        </div>\n        ${this.hasSrc && this.horizontal\n          ? html`<div class=\"divider src-divider\"></div>`\n          : nothing}\n        ${this.hasSrc ? html`<div class=\"src\">${this.src}</div>` : nothing}\n      </div>\n    `;\n  }\n\n  /**\n   * Returns the formatted setpoint value as a string.\n   * If the setpoint is undefined, it returns a dashed string.\n   */\n  get setpointValueBlueNumbers(): string {\n    if (this.setpoint === undefined) {\n      return this.dashedGenerator();\n    }\n\n    return this.setpoint.toFixed(this.fractionDigits);\n  }\n\n  /**\n   * Returns the formatted primary value as a string.\n   * If the value is undefined, it returns a dashed string.\n   */\n  get valueBlueNumbers(): string {\n    if (this.value === undefined) {\n      return this.dashedGenerator();\n    }\n\n    return this.value.toFixed(this.fractionDigits);\n  }\n\n  /**\n   * Generates a string of hint zeros for alignment when `showZeroPadding` is false.\n   * These zeros are typically displayed with lower opacity.\n   */\n  get hintZeros(): string {\n    if (this.value === undefined || this.value < 0) {\n      return '';\n    }\n    const nBlues = this.valueBlueNumbers.length;\n    const nHints = this.maxDigits - nBlues;\n    if (nHints > 0) {\n      return '0'.repeat(nHints);\n    }\n    return '';\n  }\n\n  static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-instrument-field': ObcInstrumentField;\n  }\n}\n"],"names":["InstrumentFieldSize"],"mappings":"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"}
+{"version":3,"file":"instrument-field.js","sources":["../../../src/navigation-instruments/instrument-field/instrument-field.ts"],"sourcesContent":["import {LitElement, html, nothing, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport compentStyle from './instrument-field.css?inline';\nimport {classMap} from 'lit/directives/class-map.js';\nimport '../../components/button/button.js';\nimport '../../icons/icon-drop-down-google.js';\nimport '../../components/navigation-item/navigation-item.js';\nimport {customElement} from '../../decorator.js';\nimport {READOUT_UNAVAILABLE_DASH} from '../readout/readout-formatters.js';\n\n/**\n * Enum for instrument field sizes.\n * - `regular`: Standard size for navigation instrument data fields.\n * - `enhanced`: Larger size with increased visual prominence.\n */\nexport enum InstrumentFieldSize {\n  regular = 'regular',\n  enhanced = 'enhanced',\n}\n\n/**\n * `<obc-instrument-field>` – A component for displaying navigation instrument data.\n *\n * This component is used to show a primary value, an optional setpoint, units, and a source (e.g., GPS, Gyro).\n * It supports different sizes, horizontal/vertical layouts, and configurable numeric formatting.\n *\n * ### Features\n * - **Sizes:** Supports `regular` and `enhanced` sizes.\n * - **Setpoint:** Optional setpoint display with an arrow indicator.\n * - **Source Picker:** Optional source selection with a dropdown and context menu.\n * - **Formatting:** Customizable integer and fraction digits, with optional zero padding.\n * - **Status Indicators:** Supports an \"OFF\" state and neutral color mode.\n * - **Layouts:** Can be oriented horizontally or vertically, with various alignment options.\n *\n * ### Slots\n * | Slot Name           | Purpose                                                                 |\n * |---------------------|-------------------------------------------------------------------------|\n * | off-value           | Content to display when the `off` property is true (defaults to \"OFF\"). |\n *\n * @property size - The size of the instrument field.\n * @property setpoint - The setpoint value to display.\n * @property hasSetpoint - Whether to show the setpoint.\n * @property hasSrc - Whether to show the source (src) field.\n * @property value - The primary value to display.\n * @property maxDigits - The maximum number of integer digits to show (for zero padding).\n * @property showZeroPadding - Whether to show leading zeros up to `maxDigits`.\n * @property fractionDigits - The number of decimal places to display.\n * @property tag - The tag or label for the data (e.g., \"HDG\", \"SPD\").\n * @property unit - The unit of measurement (e.g., \"DEG\", \"KN\").\n * @property src - The current source name (e.g., \"GPS 1\").\n * @property neutralColor - If true, uses a neutral color scheme instead of the default instrument color.\n * @property horizontal - If true, uses a horizontal layout.\n * @property center - If true, centers the content.\n * @property labelOnly - If true, only the label (tag and unit) is displayed.\n * @property off - If true, displays the \"off\" state (e.g., showing \"OFF\" instead of value).\n * @property autoHideSetpoint - If true, automatically hides the setpoint when the value is close to it.\n * @property autoHideDeadband - The deadband within which the setpoint is hidden if `autoHideSetpoint` is true.\n * @slot off-value - Content to display when the `off` property is true (defaults to \"OFF\").\n *\n * @csspart label - The container for the tag and unit.\n * @csspart tag - The tag text element.\n * @deprecated The instrument-field component is deprecated and will be removed in future releases.\n * Please use the <obc-readout> component instead. See storybook for migration details.\n * https://openbridge-next-storybook.web.app/?path=/docs/instruments-instrument-field-deprecated--docs\n */\n@customElement('obc-instrument-field')\nexport class ObcInstrumentField extends LitElement {\n  @property({type: String}) size: InstrumentFieldSize =\n    InstrumentFieldSize.regular;\n\n  @property({type: Number}) setpoint: number | undefined;\n\n  @property({type: Boolean}) hasSetpoint = false;\n\n  @property({type: Boolean}) hasSrc = false;\n\n  @property({type: Number}) value: number | undefined;\n\n  @property({type: Number}) maxDigits = 1;\n\n  @property({type: Boolean}) showZeroPadding = false;\n\n  @property({type: Number}) fractionDigits = 0;\n\n  @property({type: String}) tag = '';\n\n  @property({type: String}) unit = '';\n\n  @property({type: String}) src = '';\n\n  @property({type: Boolean}) neutralColor = false;\n\n  @property({type: Boolean}) horizontal = false;\n\n  @property({type: Boolean}) center = false;\n\n  @property({type: Boolean}) labelOnly = false;\n\n  @property({type: Boolean}) off = false;\n\n  @property({type: Boolean}) autoHideSetpoint = false;\n\n  @property({type: Number}) autoHideDeadband = 0;\n\n  /**\n   * Generates a dashed string representation for undefined values.\n   * @returns A string of dashes formatted according to the current numeric settings.\n   */\n  dashedGenerator(): string {\n    const n = this.showZeroPadding ? Math.max(this.maxDigits, 1) : 1;\n    if (this.fractionDigits < 1) {\n      return READOUT_UNAVAILABLE_DASH.repeat(n);\n    } else {\n      const diff = n - this.fractionDigits;\n      return (\n        READOUT_UNAVAILABLE_DASH.repeat(Math.max(diff, 1)) +\n        '.' +\n        READOUT_UNAVAILABLE_DASH.repeat(this.fractionDigits)\n      );\n    }\n  }\n\n  override render() {\n    const hideSetpoint =\n      this.hasSetpoint &&\n      this.autoHideSetpoint &&\n      this.setpoint !== undefined &&\n      this.value !== undefined &&\n      Math.abs(this.setpoint - this.value) <= this.autoHideDeadband;\n\n    return html`\n      <div\n        class=${classMap({\n          wrapper: true,\n          [this.size]: true,\n          'neutral-color': this.neutralColor,\n          off: this.off,\n          horizontal: this.horizontal,\n          center: this.center,\n          'left-aligned':\n            this.labelOnly || (this.horizontal && !this.hasSetpoint),\n          'hide-setpoint': hideSetpoint,\n          'show-zero-padding': this.showZeroPadding,\n        })}\n      >\n        ${this.horizontal && this.size === InstrumentFieldSize.regular\n          ? html`<div class=\"label\">\n              <div class=\"tag\" part=\"tag\">${this.tag}</div>\n            </div>`\n          : nothing}\n        ${this.hasSetpoint\n          ? html`<div class=\"setpoint\">\n              <svg\n                class=\"setpoint-arrow\"\n                width=\"16\"\n                height=\"16\"\n                viewBox=\"0 0 16 16\"\n                fill=\"none\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n              >\n                <path\n                  fill=\"var(--instrument-enhanced-secondary-color)\"\n                  d=\"M4.66797 4.80263C4.66797 4.14363 5.45194 3.76746 6.0013 4.16286L10.4456 7.17243C11.0312 7.56899 11.0314 8.43154 10.4459 8.82828L6.0013 11.8401C5.45194 12.2355 4.66797 11.8593 4.66797 11.2003L4.66797 4.80263Z\"\n                  fill=\"var(--instrument-enhanced-primary-color)\"\n                />\n              </svg>\n              <div class=\"setpoint-value\">${this.setpointValueBlueNumbers}</div>\n            </div>`\n          : nothing}\n        ${this.horizontal && !this.labelOnly && this.hasSetpoint\n          ? html`<div class=\"divider\"></div>`\n          : nothing}\n        ${!this.labelOnly\n          ? html` <div class=\"value\">\n              ${this.off\n                ? html`<div class=\"value-blue\">\n                    <slot name=\"off-value\">OFF</slot>\n                  </div>`\n                : html` <div class=\"value-hint-zero\">${this.hintZeros}</div>\n                    <div class=\"value-blue\">${this.valueBlueNumbers}</div>`}\n            </div>`\n          : nothing}\n        <div class=\"label\" part=\"label\">\n          ${this.horizontal && this.size === InstrumentFieldSize.regular\n            ? nothing\n            : html`<div class=\"tag\" part=\"tag\">${this.tag}</div>`}\n          <div class=\"unit\">${this.unit}</div>\n        </div>\n        ${this.hasSrc && this.horizontal\n          ? html`<div class=\"divider src-divider\"></div>`\n          : nothing}\n        ${this.hasSrc ? html`<div class=\"src\">${this.src}</div>` : nothing}\n      </div>\n    `;\n  }\n\n  /**\n   * Returns the formatted setpoint value as a string.\n   * If the setpoint is undefined, it returns a dashed string.\n   */\n  get setpointValueBlueNumbers(): string {\n    if (this.setpoint === undefined) {\n      return this.dashedGenerator();\n    }\n\n    return this.setpoint.toFixed(this.fractionDigits);\n  }\n\n  /**\n   * Returns the formatted primary value as a string.\n   * If the value is undefined, it returns a dashed string.\n   */\n  get valueBlueNumbers(): string {\n    if (this.value === undefined) {\n      return this.dashedGenerator();\n    }\n\n    return this.value.toFixed(this.fractionDigits);\n  }\n\n  /**\n   * Generates a string of hint zeros for alignment when `showZeroPadding` is false.\n   * These zeros are typically displayed with lower opacity.\n   */\n  get hintZeros(): string {\n    if (this.value === undefined || this.value < 0) {\n      return '';\n    }\n    const nBlues = this.valueBlueNumbers.length;\n    const nHints = this.maxDigits - nBlues;\n    if (nHints > 0) {\n      return '0'.repeat(nHints);\n    }\n    return '';\n  }\n\n  static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-instrument-field': ObcInstrumentField;\n  }\n}\n"],"names":["InstrumentFieldSize"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oicl/openbridge-webcomponents-full-bundle",
-  "version": "2.0.0-next.158",
+  "version": "2.0.0-next.159",
   "type": "module",
   "repository": {
     "type": "git",

package/script/eslint-property-docs-rule.mjs

@@ -42,6 +42,10 @@ export function classifyFieldDoc(lines, initializerText, initializerIsLiteral) {
     else if (tags.length) tags[tags.length - 1].rest += ' ' + l.trim();
     else text.push(l);
   }
+  // cem lifts a member @deprecated into the manifest and the class JSDoc has
+  // no tag for it, so this doc has to stay inline (`keep`: not reported).
+  if (tags.some((t) => t.tag === 'deprecated'))
+    return {ok: false, reason: 'contains @deprecated', keep: true};
   const foreign = tags.find(
     (t) => t.tag !== 'availableWhen' && t.tag !== 'default'
   );
@@ -59,15 +63,22 @@ export function classifyFieldDoc(lines, initializerText, initializerIsLiteral) {
   // checked" rather than "no initializer" — that's `null`, which never
   // matches a present @default tag and correctly falls through to `manual`.
   if (def && initializerText !== undefined) {
+    // cem only emits `default` from the declaration for literal initializers
+    // (`384`, `'x'`, `-1`, …); for anything else (an enum member, …) the tag
+    // is the manifest's only source, so the doc stays inline and is not
+    // reported. Over a literal, a differing tag contradicts what cem reads.
     if (def.rest.trim() !== (initializerText ?? '').trim()) {
-      return {ok: false, reason: '@default differs from the initializer'};
+      const reason = '@default differs from the initializer';
+      return initializerIsLiteral
+        ? {ok: false, reason}
+        : {ok: false, reason, keep: true};
     }
-    // cem only emits `default` from the declaration for literal initializers
-    // (`384`, `'x'`, `-1`, …); for anything else (an enum member, a shared
-    // constant, …) the now-dropped @default tag was the manifest's only
-    // source of `.default`, so hoisting would silently lose it.
     if (!initializerIsLiteral) {
-      return {ok: false, reason: '@default on a non-literal initializer'};
+      return {
+        ok: false,
+        reason: '@default on a non-literal initializer',
+        keep: true,
+      };
     }
   }
   const avail = tags.find((t) => t.tag === 'availableWhen');
@@ -266,6 +277,7 @@ export const propertyDocsRule = {
             f.value ? sourceCode.getText(f.value) : null,
             isLiteralInitializer(f.value)
           );
+          if (cls.keep) continue;
           if (!cls.ok || !classDoc || hasTypedef) {
             const reason = !classDoc
               ? 'class has no JSDoc'