@oicl/openbridge-webcomponents 2.0.0-next.166 → 2.0.0-next.167

package/custom-elements.json

@@ -60364,6 +60364,12 @@
           "kind": "class",
           "description": "`<obc-brilliance-menu>` – A settings menu component for adjusting display palette and brightness.\n\nProvides a combined interface for users to select a color palette (night, dusk, day, bright) and adjust screen brightness. Includes options for toggling automatic palette and brightness modes. Designed for quick access to visual environment controls in applications where adaptable display settings are important.\n\n### Features\n- **Palette Selection:** Choose between four preset palettes: night, dusk, day, and bright. Each palette is represented by an icon.\n- **Brightness Control:** Adjustable slider for fine-tuning brightness from 0 to 100. Optionally displays left/right icons for low and high brilliance.\n- **Auto Modes:** Optional toggles for enabling automatic palette switching and automatic brightness adjustment.\n- **Configurable Visibility:** Brightness controls and auto toggles can be shown or hidden via properties.\n- **Responsive Layout:** Arranged in a card-style panel for use in settings menus or overlays.\n\n### Variants\n- **Palette:** Four options—`night`, `dusk`, `day`, `bright`. Each is visually distinct and selectable via toggle button group.\n- **Auto Toggles:** `showAutoBrightness` and `showAutoPalette` properties control the presence of auto mode switches.\n- **Show Brightness:** The `showBrightness` property controls whether the brightness slider and auto brightness toggle are visible.\n\n### Usage Guidelines\nUse `obc-brilliance-menu` in settings panels or overlays where users need to quickly adjust display appearance. Ideal for scenarios requiring rapid adaptation to changing lighting conditions or user preferences.\n**TODO(designer):** Confirm if there are recommended default palette/brightness settings, and clarify intended use cases for auto toggles versus manual controls.\n\n### Properties and Configuration\n- `palette` (`ObcPalette`): The currently selected palette. Accepts `'night'`, `'dusk'`, `'day'`, or `'bright'`. Defaults to `'day'`.\n- `brightness` (`number`): Current brightness value (0–100). Defaults to `50`.\n- `showAutoBrightness` (`boolean`): If true, displays the auto brightness toggle.\n- `showAutoPalette` (`boolean`): If true, displays the auto palette toggle.\n- `showBrightness` (`boolean`): If true, shows the brightness slider and auto brightness toggle.\n\n### Events\n- `palette-changed` – Fired when the user selects a new palette. Event detail: `{ value: ObcPalette }`\n- `brightness-changed` – Fired when the brightness slider is adjusted. Event detail: `{ value: number }`\n\n### Example\n```html\n<obc-brilliance-menu\n  palette=\"dusk\"\n  brightness=\"75\"\n  showAutoBrightness\n  showAutoPalette\n></obc-brilliance-menu>\n```\nIn this example, both auto toggles are visible, the palette is set to dusk, and brightness is set to 75.",
           "name": "ObcBrillianceMenu",
+          "slots": [
+            {
+              "description": "Consumer-defined controls, placed after the screen control link; rendered when `showAdditionalScreenControls` is true",
+              "name": "additional-screen-controls"
+            }
+          ],
           "members": [
             {
               "kind": "field",
@@ -60516,6 +60522,16 @@
               "description": "If true, displays the screen control link.",
               "attribute": "showScreenControlLink"
             },
+            {
+              "kind": "field",
+              "name": "showAdditionalScreenControls",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "If true, displays the additional screen controls slot.",
+              "attribute": "showAdditionalScreenControls"
+            },
             {
               "kind": "method",
               "name": "onPaletteChanged",
@@ -60608,6 +60624,37 @@
               "name": "canDecreasePalette",
               "readonly": true
             },
+            {
+              "kind": "field",
+              "name": "selectedTabId",
+              "privacy": "private",
+              "default": "'brilliance'",
+              "type": {
+                "text": "string"
+              }
+            },
+            {
+              "kind": "method",
+              "name": "onTabSelected",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "event",
+                  "type": {
+                    "text": "CustomEvent<{id: string}>"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "field",
+              "name": "tabs",
+              "type": {
+                "text": "TabData[]"
+              },
+              "privacy": "private",
+              "readonly": true
+            },
             {
               "kind": "method",
               "name": "nextPalette"
@@ -60780,6 +60827,15 @@
               "default": "false",
               "description": "If true, displays the screen control link.",
               "fieldName": "showScreenControlLink"
+            },
+            {
+              "name": "showAdditionalScreenControls",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "If true, displays the additional screen controls slot.",
+              "fieldName": "showAdditionalScreenControls"
             }
           ],
           "superclass": {
@@ -89104,6 +89160,10 @@
             {
               "description": "Custom clock content, rendered when `showClock` is true",
               "name": "clock"
+            },
+            {
+              "description": "Consumer-defined controls, placed first in the right-hand button group; rendered when `hasRightTrayLeading` is true",
+              "name": "right-tray-leading"
             }
           ],
           "members": [
@@ -89349,6 +89409,16 @@
               "description": "How many `status-icon-N`/`status-label-N` slot pairs are rendered.",
               "attribute": "nStatusFields"
             },
+            {
+              "kind": "field",
+              "name": "hasRightTrayLeading",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Renders the `right-tray-leading` slot first in the right-hand button group.",
+              "attribute": "hasRightTrayLeading"
+            },
             {
               "kind": "method",
               "name": "renderStatusFields",
@@ -89630,6 +89700,15 @@
               "default": "0",
               "description": "How many `status-icon-N`/`status-label-N` slot pairs are rendered.",
               "fieldName": "nStatusFields"
+            },
+            {
+              "name": "hasRightTrayLeading",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Renders the `right-tray-leading` slot first in the right-hand button group.",
+              "fieldName": "hasRightTrayLeading"
             }
           ],
           "superclass": {
@@ -89679,6 +89758,10 @@
             {
               "description": "Compact vessel integration buttons; slotted integration buttons are forced to hug type",
               "name": "hug-buttons"
+            },
+            {
+              "description": "Consumer-defined controls, placed first in the right-hand button group; rendered when `hasRightTrayLeading` is true",
+              "name": "right-tray-leading"
             }
           ],
           "members": [
@@ -89882,6 +89965,16 @@
               "description": "Label for the fleet button",
               "attribute": "fleetButtonLabel"
             },
+            {
+              "kind": "field",
+              "name": "hasRightTrayLeading",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Renders the `right-tray-leading` slot first in the right-hand button group",
+              "attribute": "hasRightTrayLeading"
+            },
             {
               "kind": "field",
               "name": "buttonsOnBar",
@@ -90153,6 +90246,15 @@
               "default": "'Fleet'",
               "description": "Label for the fleet button",
               "fieldName": "fleetButtonLabel"
+            },
+            {
+              "name": "hasRightTrayLeading",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Renders the `right-tray-leading` slot first in the right-hand button group",
+              "fieldName": "hasRightTrayLeading"
             }
           ],
           "superclass": {

package/dist/components/brilliance-menu/brilliance-menu.css.js

@@ -19,6 +19,10 @@ const componentStyle = css`* {
   user-select: none;
 }
 
+.card.tabbed {
+  overflow: hidden;
+}
+
 .title-container {
   padding: var(--app-components-system-menu-margin-vertical)
     calc(

package/dist/components/brilliance-menu/brilliance-menu.css.js.map

@@ -1 +1 @@
-{"version":3,"file":"brilliance-menu.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"brilliance-menu.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/brilliance-menu/brilliance-menu.d.ts

@@ -20,7 +20,7 @@ import '../progress-indicator-dots/progress-indicator-dots.js';
 import '../navigation-item/navigation-item.js';
 import '../app-button/app-button.js';
 import '../user-button/user-button.js';
-import '../tabbed-card/tabbed-card.js';
+import '../tab-row/tab-row.js';
 import '../../icons/icon-display-brilliance-iec.js';
 import '../../icons/icon-palette-day-night-iec.js';
 export declare enum ObcPalette {
@@ -116,6 +116,8 @@ export type ObcLinkBrightnessChangeEvent = CustomEvent<{
  * @property brightnessMajorStep - The major step of the brightness slider.
  * @property brightnessInputVariant - The variant of the brightness input.
  * @property showScreenControlLink - If true, displays the screen control link.
+ * @property showAdditionalScreenControls - If true, displays the additional screen controls slot.
+ * @slot additional-screen-controls - Consumer-defined controls, placed after the screen control link; rendered when `showAdditionalScreenControls` is true
  * @fires {ObcPaletteChangeEvent} palette-changed - When the palette is changed
  * @fires {ObcBrightnessChangeEvent} brightness-changed - When the brightness is changed
  * @fires {ObcLinkPaletteChangeEvent} link-palette-changed - When the link palette toggle is changed
@@ -153,6 +155,8 @@ export declare class ObcBrillianceMenu extends LitElement {
     brightnessInputVariant: ObcBrillianceInputVariant;
     /** If true, displays the screen control link. */
     showScreenControlLink: boolean;
+    /** If true, displays the additional screen controls slot. */
+    showAdditionalScreenControls: boolean;
     willUpdate(_changed: Map<string, unknown>): void;
     /**
      * Handles palette selection changes and emits `palette-changed`.
@@ -184,6 +188,9 @@ export declare class ObcBrillianceMenu extends LitElement {
     get availablePalettes(): ObcPalette[];
     get canIncreasePalette(): boolean;
     get canDecreasePalette(): boolean;
+    private selectedTabId;
+    private onTabSelected;
+    private get tabs();
     nextPalette(): void;
     previousPalette(): void;
     renderBrightness(): import('lit-html').TemplateResult<1>;

package/dist/components/brilliance-menu/brilliance-menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"brilliance-menu.d.ts","sourceRoot":"","sources":["../../../src/components/brilliance-menu/brilliance-menu.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"brilliance-menu.d.ts","sourceRoot":"","sources":["../../../src/components/brilliance-menu/brilliance-menu.ts"],"names":[],"mappings":"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"}

package/dist/components/brilliance-menu/brilliance-menu.js

@@ -1,5 +1,5 @@
 import { unsafeCSS, LitElement, nothing, html } from "lit";
-import { property } from "lit/decorators.js";
+import { property, state } from "lit/decorators.js";
 import componentStyle from "./brilliance-menu.css.js";
 import "../button/button.js";
 import { ObcSliderVariant } from "../slider/slider.js";
@@ -24,7 +24,7 @@ import "../progress-indicator-dots/progress-indicator-dots.js";
 import "../navigation-item/navigation-item.js";
 import "../app-button/app-button.js";
 import "../user-button/user-button.js";
-import "../tabbed-card/tabbed-card.js";
+import "../tab-row/tab-row.js";
 import "../../icons/icon-display-brilliance-iec.js";
 import "../../icons/icon-palette-day-night-iec.js";
 var __defProp = Object.defineProperty;
@@ -55,6 +55,8 @@ var ObcBrillianceInputVariant = /* @__PURE__ */ ((ObcBrillianceInputVariant2) =>
   ObcBrillianceInputVariant2["slider"] = "slider";
   return ObcBrillianceInputVariant2;
 })(ObcBrillianceInputVariant || {});
+const BRILLIANCE_TAB_ID = "brilliance";
+const PALETTE_TAB_ID = "palette";
 let ObcBrillianceMenu = class extends LitElement {
   constructor() {
     super(...arguments);
@@ -75,6 +77,8 @@ let ObcBrillianceMenu = class extends LitElement {
     this.brightnessMajorStep = 25;
     this.brightnessInputVariant = "buttons";
     this.showScreenControlLink = false;
+    this.showAdditionalScreenControls = false;
+    this.selectedTabId = BRILLIANCE_TAB_ID;
   }
   willUpdate(_changed) {
     if (this.showPalette) {
@@ -186,6 +190,23 @@ let ObcBrillianceMenu = class extends LitElement {
     const idx = palettes.indexOf(this.palette);
     return idx > 0;
   }
+  onTabSelected(event) {
+    this.selectedTabId = event.detail.id;
+  }
+  get tabs() {
+    return [
+      {
+        id: BRILLIANCE_TAB_ID,
+        title: msg("Brilliance"),
+        hasLeadingIcon: true
+      },
+      {
+        id: PALETTE_TAB_ID,
+        title: `${msg("Day")}/${msg("Night")}`,
+        hasLeadingIcon: true
+      }
+    ];
+  }
   nextPalette() {
     if (this.canIncreasePalette) {
       const palettes = this.availablePalettes;
@@ -475,41 +496,68 @@ let ObcBrillianceMenu = class extends LitElement {
     `;
   }
   renderScreenControlLink() {
-    if (!this.showScreenControlLink) {
-      return nothing;
+    if (this.showScreenControlLink || this.showAdditionalScreenControls) {
+      return html`
+        <div class="footer">
+          ${this.showScreenControlLink ? html`
+                  <obc-navigation-item
+                    .label="${msg("Screen Control")}"
+                    @click=${() => this.handleScreenControlLinkClicked()}
+                    hasicon
+                  >
+                    <obc-user-button
+                      slot="icon"
+                      static
+                      variant="icon"
+                      styleType="normal"
+                    >
+                      <obi-screen-desk slot="icon"></obi-screen-desk>
+                    </obc-user-button>
+                  </obc-navigation-item>
+                ` : nothing}
+          ${this.showAdditionalScreenControls ? html`<slot name="additional-screen-controls"></slot>` : nothing}
+        </div>
+      `;
     }
-    return html`
-      <div class="footer">
-        <obc-navigation-item
-          .label="${msg("Screen Control")}"
-          @click=${() => this.handleScreenControlLinkClicked()}
-          hasicon
-        >
-          <obc-user-button slot="icon" static variant="icon" styleType="normal">
-            <obi-screen-desk slot="icon"></obi-screen-desk>
-          </obc-user-button>
-        </obc-navigation-item>
-      </div>
-    `;
+    return nothing;
   }
   render() {
     if (this.variant === "tabbed") {
-      return html`<obc-tabbed-card class="card" nTabs=${2} hasTabIcons>
-        <span slot="tab-title-0">${msg("Brilliance")}</span>
-        <obi-display-brilliance-iec
-          slot="tab-icon-0"
-        ></obi-display-brilliance-iec>
-        <span slot="tab-title-1">${msg("Day")}/${msg("Night")}</span>
-        <obi-palette-day-night-iec
-          slot="tab-icon-1"
-        ></obi-palette-day-night-iec>
-        <div slot="tab-content-0">
-          ${this.renderBrightness()} ${this.renderScreenControlLink()}
-        </div>
-        <div slot="tab-content-1">
-          ${this.renderPalette()} ${this.renderScreenControlLink()}
+      const tabs = this.tabs;
+      const [brillianceTab, paletteTab] = tabs;
+      return html`
+        <div class="card tabbed">
+          <obc-tab-row
+            .tabs=${tabs}
+            .selectedTabId=${this.selectedTabId}
+            .centerContent=${true}
+            @tab-selected=${this.onTabSelected}
+          >
+            <obi-display-brilliance-iec
+              slot="tab-${BRILLIANCE_TAB_ID}-icon"
+            ></obi-display-brilliance-iec>
+            <obi-palette-day-night-iec
+              slot="tab-${PALETTE_TAB_ID}-icon"
+            ></obi-palette-day-night-iec>
+          </obc-tab-row>
+          <!-- TODO(#1312): link the panels to their tabs once obc-tab-row supports it -->
+          <div
+            role="tabpanel"
+            aria-label=${brillianceTab.title}
+            ?hidden=${this.selectedTabId !== BRILLIANCE_TAB_ID}
+          >
+            ${this.renderBrightness()}
+          </div>
+          <div
+            role="tabpanel"
+            aria-label=${paletteTab.title}
+            ?hidden=${this.selectedTabId !== PALETTE_TAB_ID}
+          >
+            ${this.renderPalette()}
+          </div>
+          ${this.renderScreenControlLink()}
         </div>
-      </obc-tabbed-card>`;
+      `;
     } else {
       return html`
         <div class="card ${this.variant}">
@@ -577,6 +625,12 @@ __decorateClass([
 __decorateClass([
   property({ type: Boolean })
 ], ObcBrillianceMenu.prototype, "showScreenControlLink", 2);
+__decorateClass([
+  property({ type: Boolean })
+], ObcBrillianceMenu.prototype, "showAdditionalScreenControls", 2);
+__decorateClass([
+  state()
+], ObcBrillianceMenu.prototype, "selectedTabId", 2);
 ObcBrillianceMenu = __decorateClass([
   localized(),
   customElement("obc-brilliance-menu")

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

@@ -1 +1 @@
-{"version":3,"file":"brilliance-menu.js","sources":["../../../src/components/brilliance-menu/brilliance-menu.ts"],"sourcesContent":["import {HTMLTemplateResult, LitElement, html, nothing, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport componentStyle from './brilliance-menu.css?inline';\nimport '../button/button.js';\nimport '../slider/slider.js';\nimport '../toggle-switch/toggle-switch.js';\nimport '../toggle-button-group/toggle-button-group.js';\nimport '../toggle-button-option/toggle-button-option.js';\nimport '../../icons/icon-display-brilliance-low.js';\nimport '../../icons/icon-display-brilliance-proposal.js';\nimport '../../icons/icon-palette-night.js';\nimport '../../icons/icon-palette-dusk.js';\nimport '../../icons/icon-palette-day.js';\nimport '../../icons/icon-palette-day-bright.js';\nimport '../../icons/icon-link.js';\nimport '../../icons/icon-chevron-double-right-google.js';\nimport '../../icons/icon-chevron-double-left-google.js';\nimport '../../icons/icon-chevron-left-google.js';\nimport '../../icons/icon-chevron-right-google.js';\nimport '../../icons/icon-screen-desk.js';\n\nimport {localized, msg} from '@lit/localize';\nimport {customElement} from '../../decorator.js';\nimport {\n  ObcToggleButtonOptionType,\n  ObcToggleButtonOptionVariant,\n} from '../toggle-button-option/toggle-button-option.js';\nimport {ObcSliderVariant} from '../slider/slider.js';\nimport {ObcToggleSwitch} from '../toggle-switch/toggle-switch.js';\nimport '../progress-indicator-dots/progress-indicator-dots.js';\nimport '../navigation-item/navigation-item.js';\nimport '../app-button/app-button.js';\nimport '../user-button/user-button.js';\nimport '../tabbed-card/tabbed-card.js';\nimport '../../icons/icon-display-brilliance-iec.js';\nimport '../../icons/icon-palette-day-night-iec.js';\n\nexport enum ObcPalette {\n  night = 'night',\n  dusk = 'dusk',\n  day = 'day',\n  bright = 'bright',\n}\n\nexport enum ObcBrillianceMenuVariant {\n  normal = 'normal',\n  compact = 'compact',\n  tabbed = 'tabbed',\n}\n\nexport enum ObcBrillianceInputVariant {\n  buttons = 'buttons',\n  slider = 'slider',\n}\n\nexport type ObcPaletteChangeEvent = CustomEvent<{value: ObcPalette}>;\nexport type ObcBrightnessChangeEvent = CustomEvent<{value: number}>;\nexport type ObcLinkPaletteChangeEvent = CustomEvent<{value: boolean}>;\nexport type ObcLinkBrightnessChangeEvent = CustomEvent<{value: boolean}>;\n\n/**\n * Event fired when the palette is changed.\n * @typedef {CustomEvent<{value: ObcPalette}>} ObcPaletteChangeEvent\n */\n\n/**\n * Event fired when the brightness is changed.\n * @typedef {CustomEvent<{value: number}>} ObcBrightnessChangeEvent\n */\n\n/**\n * `<obc-brilliance-menu>` – A settings menu component for adjusting display palette and brightness.\n *\n * Provides a combined interface for users to select a color palette (night, dusk, day, bright) and adjust screen brightness. Includes options for toggling automatic palette and brightness modes. Designed for quick access to visual environment controls in applications where adaptable display settings are important.\n *\n * ### Features\n * - **Palette Selection:** Choose between four preset palettes: night, dusk, day, and bright. Each palette is represented by an icon.\n * - **Brightness Control:** Adjustable slider for fine-tuning brightness from 0 to 100. Optionally displays left/right icons for low and high brilliance.\n * - **Auto Modes:** Optional toggles for enabling automatic palette switching and automatic brightness adjustment.\n * - **Configurable Visibility:** Brightness controls and auto toggles can be shown or hidden via properties.\n * - **Responsive Layout:** Arranged in a card-style panel for use in settings menus or overlays.\n *\n * ### Variants\n * - **Palette:** Four options—`night`, `dusk`, `day`, `bright`. Each is visually distinct and selectable via toggle button group.\n * - **Auto Toggles:** `showAutoBrightness` and `showAutoPalette` properties control the presence of auto mode switches.\n * - **Show Brightness:** The `showBrightness` property controls whether the brightness slider and auto brightness toggle are visible.\n *\n * ### Usage Guidelines\n * Use `obc-brilliance-menu` in settings panels or overlays where users need to quickly adjust display appearance. Ideal for scenarios requiring rapid adaptation to changing lighting conditions or user preferences.\n * **TODO(designer):** Confirm if there are recommended default palette/brightness settings, and clarify intended use cases for auto toggles versus manual controls.\n *\n * ### Properties and Configuration\n * - `palette` (`ObcPalette`): The currently selected palette. Accepts `'night'`, `'dusk'`, `'day'`, or `'bright'`. Defaults to `'day'`.\n * - `brightness` (`number`): Current brightness value (0–100). Defaults to `50`.\n * - `showAutoBrightness` (`boolean`): If true, displays the auto brightness toggle.\n * - `showAutoPalette` (`boolean`): If true, displays the auto palette toggle.\n * - `showBrightness` (`boolean`): If true, shows the brightness slider and auto brightness toggle.\n *\n * ### Events\n * - `palette-changed` – Fired when the user selects a new palette. Event detail: `{ value: ObcPalette }`\n * - `brightness-changed` – Fired when the brightness slider is adjusted. Event detail: `{ value: number }`\n *\n * ### Example\n * ```html\n * <obc-brilliance-menu\n *   palette=\"dusk\"\n *   brightness=\"75\"\n *   showAutoBrightness\n *   showAutoPalette\n * ></obc-brilliance-menu>\n * ```\n * In this example, both auto toggles are visible, the palette is set to dusk, and brightness is set to 75.\n *\n * @property palette - The currently selected palette. Possible values: `'night'`, `'dusk'`, `'day'`, `'bright'`.\n *   Defaults to `'day'`.\n * @property brightness - The current brightness value (0–100). Defaults to `50`.\n * @property showLinkBrightness - If true, displays the link brightness toggle below the brightness slider.\n * @property showLinkPalette - If true, displays the link palette toggle below the palette selector.\n * @property showBrightness - If true, shows the brightness slider and auto brightness toggle in the menu.\n * @property showPalette - If true, shows the palette selector and link palette toggle in the menu.\n * @property variant - The variant of the menu. Possible values: `'normal'`, `'compact'`, `'tabbed'`.\n *   Defaults to `'normal'`.\n * @property brightnessUnit - The unit of the brightness value.\n * @property brightnessMax - The maximum value of the brightness slider.\n * @property brightnessMinorStep - The minor step of the brightness slider.\n * @property brightnessMajorStep - The major step of the brightness slider.\n * @property brightnessInputVariant - The variant of the brightness input.\n * @property showScreenControlLink - If true, displays the screen control link.\n * @fires {ObcPaletteChangeEvent} palette-changed - When the palette is changed\n * @fires {ObcBrightnessChangeEvent} brightness-changed - When the brightness is changed\n * @fires {ObcLinkPaletteChangeEvent} link-palette-changed - When the link palette toggle is changed\n * @fires {ObcLinkBrightnessChangeEvent} link-brightness-changed - When the link brightness toggle is changed\n * @fires {CustomEvent} screen-control-link-clicked - When the screen control link is clicked\n */\n@localized()\n/**\n * @stable\n */\n@customElement('obc-brilliance-menu')\nexport class ObcBrillianceMenu extends LitElement {\n  @property({type: String}) palette: ObcPalette = ObcPalette.day;\n\n  @property({type: Number}) brightness = 50;\n\n  @property({type: Boolean})\n  showLinkBrightness = false;\n\n  @property({type: Boolean}) showLinkPalette = false;\n\n  @property({type: Boolean, attribute: false}) showBrightness = true;\n\n  @property({type: Boolean, attribute: false}) showPalette = true;\n\n  @property({type: Boolean, attribute: false}) showNightPalette = true;\n  @property({type: Boolean, attribute: false}) showDuskPalette = true;\n  @property({type: Boolean, attribute: false}) showDayPalette = true;\n  @property({type: Boolean, attribute: false}) showBrightPalette = true;\n\n  @property({type: String}) variant = ObcBrillianceMenuVariant.normal;\n\n  @property({type: String}) brightnessUnit = '%';\n\n  @property({type: Number}) brightnessMax = 100;\n\n  @property({type: Number}) brightnessMinorStep = 5;\n\n  @property({type: Number}) brightnessMajorStep = 25;\n\n  @property({type: String}) brightnessInputVariant =\n    ObcBrillianceInputVariant.buttons;\n\n  @property({type: Boolean}) showScreenControlLink = false;\n\n  override willUpdate(_changed: Map<string, unknown>) {\n    if (this.showPalette) {\n      const available = this.availablePalettes;\n      if (available.length > 0 && !available.includes(this.palette)) {\n        this.palette = available[0];\n        this.dispatchEvent(\n          new CustomEvent('palette-changed', {\n            detail: {value: this.palette},\n          })\n        );\n      }\n    }\n  }\n\n  /**\n   * Handles palette selection changes and emits `palette-changed`.\n   * @fires palette-changed\n   * @param {CustomEvent} event\n   */\n  onPaletteChanged(event: CustomEvent) {\n    this.palette = event.detail.value;\n    this.dispatchEvent(\n      new CustomEvent('palette-changed', {\n        detail: {value: event.detail.value},\n      })\n    );\n  }\n\n  /**\n   * Handles brightness slider changes and emits `brightness-changed`.\n   * @fires brightness-changed\n   * @param {CustomEvent} event\n   */\n  handleBrightnessChanged(event: CustomEvent) {\n    this.brightness = event.detail;\n    this.dispatchEvent(\n      new CustomEvent('brightness-changed', {\n        detail: {value: event.detail},\n      })\n    );\n  }\n\n  increaseBrightness(step: number) {\n    this.brightness = Math.max(\n      0,\n      Math.min(this.brightness + step, this.brightnessMax)\n    );\n    this.dispatchEvent(\n      new CustomEvent('brightness-changed', {\n        detail: {value: this.brightness},\n      })\n    );\n  }\n\n  get canIncreaseBrightness() {\n    return this.brightness < this.brightnessMax;\n  }\n\n  get canDecreaseBrightness() {\n    return this.brightness > 0;\n  }\n\n  /**\n   * Handles link palette changes and emits `link-palette-changed`.\n   * @fires link-palette-changed\n   * @param {CustomEvent} event\n   */\n  onLinkPaletteChanged(event: CustomEvent) {\n    this.dispatchEvent(\n      new CustomEvent('link-palette-changed', {\n        detail: {value: (event.target as ObcToggleSwitch).checked},\n      })\n    );\n  }\n\n  /**\n   * Handles link brightness changes and emits `link-brightness-changed`.\n   * @fires link-brightness-changed\n   * @param {CustomEvent} event\n   */\n  onLinkBrightnessChanged(event: CustomEvent) {\n    this.dispatchEvent(\n      new CustomEvent('link-brightness-changed', {\n        detail: {value: (event.target as ObcToggleSwitch).checked},\n      })\n    );\n  }\n\n  get availablePalettes(): ObcPalette[] {\n    const palettes: ObcPalette[] = [];\n    if (this.showNightPalette) palettes.push(ObcPalette.night);\n    if (this.showDuskPalette) palettes.push(ObcPalette.dusk);\n    if (this.showDayPalette) palettes.push(ObcPalette.day);\n    if (this.showBrightPalette) palettes.push(ObcPalette.bright);\n    return palettes;\n  }\n\n  get canIncreasePalette() {\n    const palettes = this.availablePalettes;\n    const idx = palettes.indexOf(this.palette);\n    return idx >= 0 && idx < palettes.length - 1;\n  }\n\n  get canDecreasePalette() {\n    const palettes = this.availablePalettes;\n    const idx = palettes.indexOf(this.palette);\n    return idx > 0;\n  }\n\n  nextPalette() {\n    if (this.canIncreasePalette) {\n      const palettes = this.availablePalettes;\n      const idx = palettes.indexOf(this.palette);\n      this.palette = palettes[idx + 1];\n      this.dispatchEvent(\n        new CustomEvent('palette-changed', {\n          detail: {value: this.palette},\n        })\n      );\n    }\n  }\n\n  previousPalette() {\n    if (this.canDecreasePalette) {\n      const palettes = this.availablePalettes;\n      const idx = palettes.indexOf(this.palette);\n      this.palette = palettes[idx - 1];\n      this.dispatchEvent(\n        new CustomEvent('palette-changed', {\n          detail: {value: this.palette},\n        })\n      );\n    }\n  }\n\n  renderBrightness() {\n    const title =\n      this.variant === ObcBrillianceMenuVariant.tabbed\n        ? nothing\n        : html`<div class=\"title-container\">\n            <h3>${msg('Brilliance')}</h3>\n          </div>`;\n    const valueLength =\n      this.brightness.toString().length + 0.5 * this.brightnessUnit.length;\n\n    return html`${title}\n      <div class=\"content-container brilliance\">\n        ${\n          this.variant === ObcBrillianceMenuVariant.compact\n            ? html` <obc-slider\n                value=${this.brightness}\n                @value=${this.handleBrightnessChanged}\n                min=\"0\"\n                max=${this.brightnessMax}\n                variant=${ObcSliderVariant.Normal}\n                haslefticon\n                hasrighticon\n              >\n                <obi-display-brilliance-low\n                  slot=\"icon-left\"\n                ></obi-display-brilliance-low>\n                <obi-display-brilliance-proposal\n                  slot=\"icon-right\"\n                ></obi-display-brilliance-proposal>\n              </obc-slider>`\n            : html`\n                <div class=\"value-container\">\n                  <div class=\"value-label-container\">\n                    <obi-display-brilliance-proposal\n                      class=\"icon\"\n                    ></obi-display-brilliance-proposal>\n                    <div\n                      class=\"label-container\"\n                      style=\"width: ${valueLength}ch\"\n                    >\n                      <div class=\"value\">${this.brightness.toFixed(0)}</div>\n                      <div class=\"unit\">${this.brightnessUnit}</div>\n                    </div>\n                  </div>\n                  <div class=\"value-slider-container\">\n                    ${\n                      this.brightnessInputVariant ===\n                      ObcBrillianceInputVariant.buttons\n                        ? html`\n                            <obc-slider\n                              value=${this.brightness}\n                              variant=${ObcSliderVariant.NoInput}\n                              min=\"0\"\n                              max=${this.brightnessMax}\n                            ></obc-slider>\n                          `\n                        : html`\n                            <obc-slider\n                              value=${this.brightness}\n                              variant=${ObcSliderVariant.Enhanced}\n                              @value=${this.handleBrightnessChanged}\n                              min=\"0\"\n                              max=${this.brightnessMax}\n                            ></obc-slider>\n                          `\n                    }\n                  </div>\n                </div>\n                ${\n                  this.brightnessInputVariant ===\n                  ObcBrillianceInputVariant.buttons\n                    ? html`\n                        <div class=\"icon-button-container\">\n                          <obc-button\n                            segmentPosition=\"start\"\n                            fullWidth\n                            ?disabled=${!this.canDecreaseBrightness}\n                            class=${this.canDecreaseBrightness ? '' : 'disabled'}\n                            @click=${() =>\n                              this.increaseBrightness(\n                                -this.brightnessMajorStep\n                              )}\n                          >\n                            <obi-chevron-double-left-google\n                              class=\"btn-icon\"\n                            ></obi-chevron-double-left-google>\n                          </obc-button>\n                          <obc-button\n                            segmentPosition=\"middle\"\n                            fullWidth\n                            ?disabled=${!this.canDecreaseBrightness}\n                            class=${this.canDecreaseBrightness ? '' : 'disabled'}\n                            @click=${() =>\n                              this.increaseBrightness(\n                                -this.brightnessMinorStep\n                              )}\n                          >\n                            <obi-chevron-left-google\n                              class=\"btn-icon\"\n                            ></obi-chevron-left-google>\n                          </obc-button>\n                          <obc-button\n                            segmentPosition=\"middle\"\n                            fullWidth\n                            ?disabled=${!this.canIncreaseBrightness}\n                            class=${this.canIncreaseBrightness ? '' : 'disabled'}\n                            @click=${() =>\n                              this.increaseBrightness(this.brightnessMinorStep)}\n                          >\n                            <obi-chevron-right-google\n                              class=\"btn-icon\"\n                            ></obi-chevron-right-google>\n                          </obc-button>\n                          <obc-button\n                            segmentPosition=\"end\"\n                            fullWidth\n                            ?disabled=${!this.canIncreaseBrightness}\n                            class=${this.canIncreaseBrightness ? '' : 'disabled'}\n                            @click=${() =>\n                              this.increaseBrightness(this.brightnessMajorStep)}\n                          >\n                            <obi-chevron-double-right-google\n                              class=\"btn-icon\"\n                            ></obi-chevron-double-right-google>\n                          </obc-button>\n                        </div>\n                      `\n                    : nothing\n                }\n              `\n        }\n        ${\n          this.showLinkBrightness\n            ? html`<obc-toggle-switch\n                .label=\"${msg('Link')}\"\n                hasicon\n                @input=${this.onLinkBrightnessChanged}\n              >\n                <obi-link slot=\"icon\"></obi-link>\n              </obc-toggle-switch>`\n            : nothing\n        }\n      </div>`;\n  }\n\n  get effectivePalette() {\n    const palettes = this.availablePalettes;\n    return palettes.includes(this.palette) ? this.palette : palettes[0];\n  }\n\n  get paletteIcon() {\n    if (this.effectivePalette === ObcPalette.night) {\n      return html`<obi-palette-night class=\"icon\"></obi-palette-night>`;\n    } else if (this.effectivePalette === ObcPalette.dusk) {\n      return html`<obi-palette-dusk class=\"icon\"></obi-palette-dusk>`;\n    } else if (this.effectivePalette === ObcPalette.day) {\n      return html`<obi-palette-day class=\"icon\"></obi-palette-day>`;\n    } else if (this.effectivePalette === ObcPalette.bright) {\n      return html`<obi-palette-day-bright\n        class=\"icon\"\n      ></obi-palette-day-bright>`;\n    } else {\n      return nothing;\n    }\n  }\n\n  private paletteOptions(): HTMLTemplateResult[] {\n    const out = [];\n    if (this.showNightPalette)\n      out.push(\n        html`<obc-toggle-button-option value=\"night\" type=\"icon\">\n          <obi-palette-night slot=\"icon\"></obi-palette-night>\n        </obc-toggle-button-option>`\n      );\n    if (this.showDuskPalette)\n      out.push(\n        html`<obc-toggle-button-option value=\"dusk\" type=\"icon\">\n          <obi-palette-dusk slot=\"icon\"></obi-palette-dusk>\n        </obc-toggle-button-option>`\n      );\n    if (this.showDayPalette)\n      out.push(\n        html`<obc-toggle-button-option value=\"day\" type=\"icon\">\n          <obi-palette-day slot=\"icon\"></obi-palette-day>\n        </obc-toggle-button-option>`\n      );\n    if (this.showBrightPalette)\n      out.push(\n        html`<obc-toggle-button-option value=\"bright\" type=\"icon\">\n          <obi-palette-day-bright slot=\"icon\"></obi-palette-day-bright>\n        </obc-toggle-button-option>`\n      );\n    return out;\n  }\n\n  renderPalette() {\n    const palettes = this.availablePalettes;\n    if (palettes.length === 0) return nothing;\n\n    const paletteNames: Record<ObcPalette, string> = {\n      [ObcPalette.night]: msg('Night'),\n      [ObcPalette.dusk]: msg('Dusk'),\n      [ObcPalette.day]: msg('Day'),\n      [ObcPalette.bright]: msg('Bright'),\n    };\n    const currentPaletteName = paletteNames[this.effectivePalette];\n    const valueLength = currentPaletteName.length;\n    const index = palettes.indexOf(this.effectivePalette);\n    const nextIndex = Math.min(index + 1, palettes.length - 1);\n    const previousIndex = Math.max(index - 1, 0);\n    const nextPalette = paletteNames[palettes[nextIndex]];\n    const previousPalette = paletteNames[palettes[previousIndex]];\n\n    return html`\n      ${\n        this.variant === ObcBrillianceMenuVariant.tabbed\n          ? nothing\n          : html`\n              <div class=\"title-container\">\n                <h3>${msg('Day')}/${msg('Night')}</h3>\n              </div>\n            `\n      }\n      <div\n        class=\"content-container palette ${\n          this.showLinkPalette ? 'with-link' : 'without-link'\n        }\"\n      >\n        ${\n          this.variant === ObcBrillianceMenuVariant.compact\n            ? html` <obc-toggle-button-group\n                value=${this.effectivePalette}\n                @value=${this.onPaletteChanged}\n                variant=${ObcToggleButtonOptionVariant.regular}\n                type=${ObcToggleButtonOptionType.icon}\n              >\n                ${this.paletteOptions()}\n              </obc-toggle-button-group>`\n            : html`\n                <div class=\"value-container\">\n                  <div class=\"value-label-container\">\n                    ${this.paletteIcon}\n                    <div\n                      class=\"label-container\"\n                      style=\"width: ${valueLength}ch\"\n                    >\n                      <div class=\"value\">${currentPaletteName}</div>\n                    </div>\n                  </div>\n                  <obc-progress-indicator-dots\n                    .totalSteps=${palettes.length}\n                    .currentStep=${index + 1}\n                  ></obc-progress-indicator-dots>\n                </div>\n                <div class=\"icon-button-container\">\n                  <obc-button\n                    segmentPosition=\"start\"\n                    fullWidth\n                    showLeadingIcon\n                    ?disabled=${!this.canDecreasePalette}\n                    class=${this.canDecreasePalette ? '' : 'disabled'}\n                    @click=${() => this.previousPalette()}\n                  >\n                    ${previousPalette}\n                    <obi-chevron-left-google\n                      slot=\"leading-icon\"\n                    ></obi-chevron-left-google>\n                  </obc-button>\n\n                  <obc-button\n                    segmentPosition=\"end\"\n                    fullWidth\n                    showTrailingIcon\n                    ?disabled=${!this.canIncreasePalette}\n                    class=${this.canIncreasePalette ? '' : 'disabled'}\n                    @click=${() => this.nextPalette()}\n                  >\n                    ${nextPalette}\n                    <obi-chevron-right-google\n                      slot=\"trailing-icon\"\n                    ></obi-chevron-right-google>\n                  </obc-button>\n                </div>\n              `\n        }\n        ${\n          this.showLinkPalette\n            ? html`<obc-toggle-switch\n                .label=\"${msg('Link')}\"\n                hasicon\n                @input=${this.onLinkPaletteChanged}\n              >\n                <obi-link slot=\"icon\"></obi-link>\n              </obc-toggle-switch>`\n            : nothing\n        }\n      </div>\n    `;\n  }\n\n  renderScreenControlLink() {\n    if (!this.showScreenControlLink) {\n      return nothing;\n    }\n    return html`\n      <div class=\"footer\">\n        <obc-navigation-item\n          .label=\"${msg('Screen Control')}\"\n          @click=${() => this.handleScreenControlLinkClicked()}\n          hasicon\n        >\n          <obc-user-button slot=\"icon\" static variant=\"icon\" styleType=\"normal\">\n            <obi-screen-desk slot=\"icon\"></obi-screen-desk>\n          </obc-user-button>\n        </obc-navigation-item>\n      </div>\n    `;\n  }\n\n  override render() {\n    if (this.variant === ObcBrillianceMenuVariant.tabbed) {\n      return html`<obc-tabbed-card class=\"card\" nTabs=${2} hasTabIcons>\n        <span slot=\"tab-title-0\">${msg('Brilliance')}</span>\n        <obi-display-brilliance-iec\n          slot=\"tab-icon-0\"\n        ></obi-display-brilliance-iec>\n        <span slot=\"tab-title-1\">${msg('Day')}/${msg('Night')}</span>\n        <obi-palette-day-night-iec\n          slot=\"tab-icon-1\"\n        ></obi-palette-day-night-iec>\n        <div slot=\"tab-content-0\">\n          ${this.renderBrightness()} ${this.renderScreenControlLink()}\n        </div>\n        <div slot=\"tab-content-1\">\n          ${this.renderPalette()} ${this.renderScreenControlLink()}\n        </div>\n      </obc-tabbed-card>`;\n    } else {\n      return html`\n        <div class=\"card ${this.variant}\">\n          ${this.showBrightness ? this.renderBrightness() : nothing}\n          ${\n            this.showBrightness && this.showPalette\n              ? html`<div class=\"divider\"></div>`\n              : nothing\n          }\n          ${this.showPalette ? this.renderPalette() : nothing}\n          ${this.renderScreenControlLink()}\n        </div>\n      `;\n    }\n  }\n\n  handleScreenControlLinkClicked() {\n    this.dispatchEvent(new CustomEvent('screen-control-link-clicked'));\n  }\n\n  static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-brilliance-menu': ObcBrillianceMenu;\n  }\n}\n"],"names":["ObcPalette","ObcBrillianceMenuVariant","ObcBrillianceInputVariant"],"mappings":"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"}
+{"version":3,"file":"brilliance-menu.js","sources":["../../../src/components/brilliance-menu/brilliance-menu.ts"],"sourcesContent":["import {HTMLTemplateResult, LitElement, html, nothing, unsafeCSS} from 'lit';\nimport {property, state} from 'lit/decorators.js';\nimport componentStyle from './brilliance-menu.css?inline';\nimport '../button/button.js';\nimport '../slider/slider.js';\nimport '../toggle-switch/toggle-switch.js';\nimport '../toggle-button-group/toggle-button-group.js';\nimport '../toggle-button-option/toggle-button-option.js';\nimport '../../icons/icon-display-brilliance-low.js';\nimport '../../icons/icon-display-brilliance-proposal.js';\nimport '../../icons/icon-palette-night.js';\nimport '../../icons/icon-palette-dusk.js';\nimport '../../icons/icon-palette-day.js';\nimport '../../icons/icon-palette-day-bright.js';\nimport '../../icons/icon-link.js';\nimport '../../icons/icon-chevron-double-right-google.js';\nimport '../../icons/icon-chevron-double-left-google.js';\nimport '../../icons/icon-chevron-left-google.js';\nimport '../../icons/icon-chevron-right-google.js';\nimport '../../icons/icon-screen-desk.js';\n\nimport {localized, msg} from '@lit/localize';\nimport {customElement} from '../../decorator.js';\nimport {\n  ObcToggleButtonOptionType,\n  ObcToggleButtonOptionVariant,\n} from '../toggle-button-option/toggle-button-option.js';\nimport {ObcSliderVariant} from '../slider/slider.js';\nimport {ObcToggleSwitch} from '../toggle-switch/toggle-switch.js';\nimport '../progress-indicator-dots/progress-indicator-dots.js';\nimport '../navigation-item/navigation-item.js';\nimport '../app-button/app-button.js';\nimport '../user-button/user-button.js';\nimport '../tab-row/tab-row.js';\nimport type {TabData} from '../tab-row/tab-row.js';\nimport '../../icons/icon-display-brilliance-iec.js';\nimport '../../icons/icon-palette-day-night-iec.js';\n\nexport enum ObcPalette {\n  night = 'night',\n  dusk = 'dusk',\n  day = 'day',\n  bright = 'bright',\n}\n\nexport enum ObcBrillianceMenuVariant {\n  normal = 'normal',\n  compact = 'compact',\n  tabbed = 'tabbed',\n}\n\nexport enum ObcBrillianceInputVariant {\n  buttons = 'buttons',\n  slider = 'slider',\n}\n\nexport type ObcPaletteChangeEvent = CustomEvent<{value: ObcPalette}>;\nexport type ObcBrightnessChangeEvent = CustomEvent<{value: number}>;\nexport type ObcLinkPaletteChangeEvent = CustomEvent<{value: boolean}>;\nexport type ObcLinkBrightnessChangeEvent = CustomEvent<{value: boolean}>;\n\nconst BRILLIANCE_TAB_ID = 'brilliance';\nconst PALETTE_TAB_ID = 'palette';\n\n/**\n * Event fired when the palette is changed.\n * @typedef {CustomEvent<{value: ObcPalette}>} ObcPaletteChangeEvent\n */\n\n/**\n * Event fired when the brightness is changed.\n * @typedef {CustomEvent<{value: number}>} ObcBrightnessChangeEvent\n */\n\n/**\n * `<obc-brilliance-menu>` – A settings menu component for adjusting display palette and brightness.\n *\n * Provides a combined interface for users to select a color palette (night, dusk, day, bright) and adjust screen brightness. Includes options for toggling automatic palette and brightness modes. Designed for quick access to visual environment controls in applications where adaptable display settings are important.\n *\n * ### Features\n * - **Palette Selection:** Choose between four preset palettes: night, dusk, day, and bright. Each palette is represented by an icon.\n * - **Brightness Control:** Adjustable slider for fine-tuning brightness from 0 to 100. Optionally displays left/right icons for low and high brilliance.\n * - **Auto Modes:** Optional toggles for enabling automatic palette switching and automatic brightness adjustment.\n * - **Configurable Visibility:** Brightness controls and auto toggles can be shown or hidden via properties.\n * - **Responsive Layout:** Arranged in a card-style panel for use in settings menus or overlays.\n *\n * ### Variants\n * - **Palette:** Four options—`night`, `dusk`, `day`, `bright`. Each is visually distinct and selectable via toggle button group.\n * - **Auto Toggles:** `showAutoBrightness` and `showAutoPalette` properties control the presence of auto mode switches.\n * - **Show Brightness:** The `showBrightness` property controls whether the brightness slider and auto brightness toggle are visible.\n *\n * ### Usage Guidelines\n * Use `obc-brilliance-menu` in settings panels or overlays where users need to quickly adjust display appearance. Ideal for scenarios requiring rapid adaptation to changing lighting conditions or user preferences.\n * **TODO(designer):** Confirm if there are recommended default palette/brightness settings, and clarify intended use cases for auto toggles versus manual controls.\n *\n * ### Properties and Configuration\n * - `palette` (`ObcPalette`): The currently selected palette. Accepts `'night'`, `'dusk'`, `'day'`, or `'bright'`. Defaults to `'day'`.\n * - `brightness` (`number`): Current brightness value (0–100). Defaults to `50`.\n * - `showAutoBrightness` (`boolean`): If true, displays the auto brightness toggle.\n * - `showAutoPalette` (`boolean`): If true, displays the auto palette toggle.\n * - `showBrightness` (`boolean`): If true, shows the brightness slider and auto brightness toggle.\n *\n * ### Events\n * - `palette-changed` – Fired when the user selects a new palette. Event detail: `{ value: ObcPalette }`\n * - `brightness-changed` – Fired when the brightness slider is adjusted. Event detail: `{ value: number }`\n *\n * ### Example\n * ```html\n * <obc-brilliance-menu\n *   palette=\"dusk\"\n *   brightness=\"75\"\n *   showAutoBrightness\n *   showAutoPalette\n * ></obc-brilliance-menu>\n * ```\n * In this example, both auto toggles are visible, the palette is set to dusk, and brightness is set to 75.\n *\n * @property palette - The currently selected palette. Possible values: `'night'`, `'dusk'`, `'day'`, `'bright'`.\n *   Defaults to `'day'`.\n * @property brightness - The current brightness value (0–100). Defaults to `50`.\n * @property showLinkBrightness - If true, displays the link brightness toggle below the brightness slider.\n * @property showLinkPalette - If true, displays the link palette toggle below the palette selector.\n * @property showBrightness - If true, shows the brightness slider and auto brightness toggle in the menu.\n * @property showPalette - If true, shows the palette selector and link palette toggle in the menu.\n * @property variant - The variant of the menu. Possible values: `'normal'`, `'compact'`, `'tabbed'`.\n *   Defaults to `'normal'`.\n * @property brightnessUnit - The unit of the brightness value.\n * @property brightnessMax - The maximum value of the brightness slider.\n * @property brightnessMinorStep - The minor step of the brightness slider.\n * @property brightnessMajorStep - The major step of the brightness slider.\n * @property brightnessInputVariant - The variant of the brightness input.\n * @property showScreenControlLink - If true, displays the screen control link.\n * @property showAdditionalScreenControls - If true, displays the additional screen controls slot.\n * @slot additional-screen-controls - Consumer-defined controls, placed after the screen control link; rendered when `showAdditionalScreenControls` is true\n * @fires {ObcPaletteChangeEvent} palette-changed - When the palette is changed\n * @fires {ObcBrightnessChangeEvent} brightness-changed - When the brightness is changed\n * @fires {ObcLinkPaletteChangeEvent} link-palette-changed - When the link palette toggle is changed\n * @fires {ObcLinkBrightnessChangeEvent} link-brightness-changed - When the link brightness toggle is changed\n * @fires {CustomEvent} screen-control-link-clicked - When the screen control link is clicked\n */\n@localized()\n/**\n * @stable\n */\n@customElement('obc-brilliance-menu')\nexport class ObcBrillianceMenu extends LitElement {\n  @property({type: String}) palette: ObcPalette = ObcPalette.day;\n\n  @property({type: Number}) brightness = 50;\n\n  @property({type: Boolean})\n  showLinkBrightness = false;\n\n  @property({type: Boolean}) showLinkPalette = false;\n\n  @property({type: Boolean, attribute: false}) showBrightness = true;\n\n  @property({type: Boolean, attribute: false}) showPalette = true;\n\n  @property({type: Boolean, attribute: false}) showNightPalette = true;\n  @property({type: Boolean, attribute: false}) showDuskPalette = true;\n  @property({type: Boolean, attribute: false}) showDayPalette = true;\n  @property({type: Boolean, attribute: false}) showBrightPalette = true;\n\n  @property({type: String}) variant = ObcBrillianceMenuVariant.normal;\n\n  @property({type: String}) brightnessUnit = '%';\n\n  @property({type: Number}) brightnessMax = 100;\n\n  @property({type: Number}) brightnessMinorStep = 5;\n\n  @property({type: Number}) brightnessMajorStep = 25;\n\n  @property({type: String}) brightnessInputVariant =\n    ObcBrillianceInputVariant.buttons;\n\n  @property({type: Boolean}) showScreenControlLink = false;\n\n  @property({type: Boolean}) showAdditionalScreenControls = false;\n\n  override willUpdate(_changed: Map<string, unknown>) {\n    if (this.showPalette) {\n      const available = this.availablePalettes;\n      if (available.length > 0 && !available.includes(this.palette)) {\n        this.palette = available[0];\n        this.dispatchEvent(\n          new CustomEvent('palette-changed', {\n            detail: {value: this.palette},\n          })\n        );\n      }\n    }\n  }\n\n  /**\n   * Handles palette selection changes and emits `palette-changed`.\n   * @fires palette-changed\n   * @param {CustomEvent} event\n   */\n  onPaletteChanged(event: CustomEvent) {\n    this.palette = event.detail.value;\n    this.dispatchEvent(\n      new CustomEvent('palette-changed', {\n        detail: {value: event.detail.value},\n      })\n    );\n  }\n\n  /**\n   * Handles brightness slider changes and emits `brightness-changed`.\n   * @fires brightness-changed\n   * @param {CustomEvent} event\n   */\n  handleBrightnessChanged(event: CustomEvent) {\n    this.brightness = event.detail;\n    this.dispatchEvent(\n      new CustomEvent('brightness-changed', {\n        detail: {value: event.detail},\n      })\n    );\n  }\n\n  increaseBrightness(step: number) {\n    this.brightness = Math.max(\n      0,\n      Math.min(this.brightness + step, this.brightnessMax)\n    );\n    this.dispatchEvent(\n      new CustomEvent('brightness-changed', {\n        detail: {value: this.brightness},\n      })\n    );\n  }\n\n  get canIncreaseBrightness() {\n    return this.brightness < this.brightnessMax;\n  }\n\n  get canDecreaseBrightness() {\n    return this.brightness > 0;\n  }\n\n  /**\n   * Handles link palette changes and emits `link-palette-changed`.\n   * @fires link-palette-changed\n   * @param {CustomEvent} event\n   */\n  onLinkPaletteChanged(event: CustomEvent) {\n    this.dispatchEvent(\n      new CustomEvent('link-palette-changed', {\n        detail: {value: (event.target as ObcToggleSwitch).checked},\n      })\n    );\n  }\n\n  /**\n   * Handles link brightness changes and emits `link-brightness-changed`.\n   * @fires link-brightness-changed\n   * @param {CustomEvent} event\n   */\n  onLinkBrightnessChanged(event: CustomEvent) {\n    this.dispatchEvent(\n      new CustomEvent('link-brightness-changed', {\n        detail: {value: (event.target as ObcToggleSwitch).checked},\n      })\n    );\n  }\n\n  get availablePalettes(): ObcPalette[] {\n    const palettes: ObcPalette[] = [];\n    if (this.showNightPalette) palettes.push(ObcPalette.night);\n    if (this.showDuskPalette) palettes.push(ObcPalette.dusk);\n    if (this.showDayPalette) palettes.push(ObcPalette.day);\n    if (this.showBrightPalette) palettes.push(ObcPalette.bright);\n    return palettes;\n  }\n\n  get canIncreasePalette() {\n    const palettes = this.availablePalettes;\n    const idx = palettes.indexOf(this.palette);\n    return idx >= 0 && idx < palettes.length - 1;\n  }\n\n  get canDecreasePalette() {\n    const palettes = this.availablePalettes;\n    const idx = palettes.indexOf(this.palette);\n    return idx > 0;\n  }\n\n  @state() private selectedTabId = BRILLIANCE_TAB_ID;\n\n  private onTabSelected(event: CustomEvent<{id: string}>) {\n    this.selectedTabId = event.detail.id;\n  }\n\n  private get tabs(): TabData[] {\n    return [\n      {\n        id: BRILLIANCE_TAB_ID,\n        title: msg('Brilliance'),\n        hasLeadingIcon: true,\n      },\n      {\n        id: PALETTE_TAB_ID,\n        title: `${msg('Day')}/${msg('Night')}`,\n        hasLeadingIcon: true,\n      },\n    ];\n  }\n\n  nextPalette() {\n    if (this.canIncreasePalette) {\n      const palettes = this.availablePalettes;\n      const idx = palettes.indexOf(this.palette);\n      this.palette = palettes[idx + 1];\n      this.dispatchEvent(\n        new CustomEvent('palette-changed', {\n          detail: {value: this.palette},\n        })\n      );\n    }\n  }\n\n  previousPalette() {\n    if (this.canDecreasePalette) {\n      const palettes = this.availablePalettes;\n      const idx = palettes.indexOf(this.palette);\n      this.palette = palettes[idx - 1];\n      this.dispatchEvent(\n        new CustomEvent('palette-changed', {\n          detail: {value: this.palette},\n        })\n      );\n    }\n  }\n\n  renderBrightness() {\n    const title =\n      this.variant === ObcBrillianceMenuVariant.tabbed\n        ? nothing\n        : html`<div class=\"title-container\">\n            <h3>${msg('Brilliance')}</h3>\n          </div>`;\n    const valueLength =\n      this.brightness.toString().length + 0.5 * this.brightnessUnit.length;\n\n    return html`${title}\n      <div class=\"content-container brilliance\">\n        ${\n          this.variant === ObcBrillianceMenuVariant.compact\n            ? html` <obc-slider\n                value=${this.brightness}\n                @value=${this.handleBrightnessChanged}\n                min=\"0\"\n                max=${this.brightnessMax}\n                variant=${ObcSliderVariant.Normal}\n                haslefticon\n                hasrighticon\n              >\n                <obi-display-brilliance-low\n                  slot=\"icon-left\"\n                ></obi-display-brilliance-low>\n                <obi-display-brilliance-proposal\n                  slot=\"icon-right\"\n                ></obi-display-brilliance-proposal>\n              </obc-slider>`\n            : html`\n                <div class=\"value-container\">\n                  <div class=\"value-label-container\">\n                    <obi-display-brilliance-proposal\n                      class=\"icon\"\n                    ></obi-display-brilliance-proposal>\n                    <div\n                      class=\"label-container\"\n                      style=\"width: ${valueLength}ch\"\n                    >\n                      <div class=\"value\">${this.brightness.toFixed(0)}</div>\n                      <div class=\"unit\">${this.brightnessUnit}</div>\n                    </div>\n                  </div>\n                  <div class=\"value-slider-container\">\n                    ${\n                      this.brightnessInputVariant ===\n                      ObcBrillianceInputVariant.buttons\n                        ? html`\n                            <obc-slider\n                              value=${this.brightness}\n                              variant=${ObcSliderVariant.NoInput}\n                              min=\"0\"\n                              max=${this.brightnessMax}\n                            ></obc-slider>\n                          `\n                        : html`\n                            <obc-slider\n                              value=${this.brightness}\n                              variant=${ObcSliderVariant.Enhanced}\n                              @value=${this.handleBrightnessChanged}\n                              min=\"0\"\n                              max=${this.brightnessMax}\n                            ></obc-slider>\n                          `\n                    }\n                  </div>\n                </div>\n                ${\n                  this.brightnessInputVariant ===\n                  ObcBrillianceInputVariant.buttons\n                    ? html`\n                        <div class=\"icon-button-container\">\n                          <obc-button\n                            segmentPosition=\"start\"\n                            fullWidth\n                            ?disabled=${!this.canDecreaseBrightness}\n                            class=${this.canDecreaseBrightness ? '' : 'disabled'}\n                            @click=${() =>\n                              this.increaseBrightness(\n                                -this.brightnessMajorStep\n                              )}\n                          >\n                            <obi-chevron-double-left-google\n                              class=\"btn-icon\"\n                            ></obi-chevron-double-left-google>\n                          </obc-button>\n                          <obc-button\n                            segmentPosition=\"middle\"\n                            fullWidth\n                            ?disabled=${!this.canDecreaseBrightness}\n                            class=${this.canDecreaseBrightness ? '' : 'disabled'}\n                            @click=${() =>\n                              this.increaseBrightness(\n                                -this.brightnessMinorStep\n                              )}\n                          >\n                            <obi-chevron-left-google\n                              class=\"btn-icon\"\n                            ></obi-chevron-left-google>\n                          </obc-button>\n                          <obc-button\n                            segmentPosition=\"middle\"\n                            fullWidth\n                            ?disabled=${!this.canIncreaseBrightness}\n                            class=${this.canIncreaseBrightness ? '' : 'disabled'}\n                            @click=${() =>\n                              this.increaseBrightness(this.brightnessMinorStep)}\n                          >\n                            <obi-chevron-right-google\n                              class=\"btn-icon\"\n                            ></obi-chevron-right-google>\n                          </obc-button>\n                          <obc-button\n                            segmentPosition=\"end\"\n                            fullWidth\n                            ?disabled=${!this.canIncreaseBrightness}\n                            class=${this.canIncreaseBrightness ? '' : 'disabled'}\n                            @click=${() =>\n                              this.increaseBrightness(this.brightnessMajorStep)}\n                          >\n                            <obi-chevron-double-right-google\n                              class=\"btn-icon\"\n                            ></obi-chevron-double-right-google>\n                          </obc-button>\n                        </div>\n                      `\n                    : nothing\n                }\n              `\n        }\n        ${\n          this.showLinkBrightness\n            ? html`<obc-toggle-switch\n                .label=\"${msg('Link')}\"\n                hasicon\n                @input=${this.onLinkBrightnessChanged}\n              >\n                <obi-link slot=\"icon\"></obi-link>\n              </obc-toggle-switch>`\n            : nothing\n        }\n      </div>`;\n  }\n\n  get effectivePalette() {\n    const palettes = this.availablePalettes;\n    return palettes.includes(this.palette) ? this.palette : palettes[0];\n  }\n\n  get paletteIcon() {\n    if (this.effectivePalette === ObcPalette.night) {\n      return html`<obi-palette-night class=\"icon\"></obi-palette-night>`;\n    } else if (this.effectivePalette === ObcPalette.dusk) {\n      return html`<obi-palette-dusk class=\"icon\"></obi-palette-dusk>`;\n    } else if (this.effectivePalette === ObcPalette.day) {\n      return html`<obi-palette-day class=\"icon\"></obi-palette-day>`;\n    } else if (this.effectivePalette === ObcPalette.bright) {\n      return html`<obi-palette-day-bright\n        class=\"icon\"\n      ></obi-palette-day-bright>`;\n    } else {\n      return nothing;\n    }\n  }\n\n  private paletteOptions(): HTMLTemplateResult[] {\n    const out = [];\n    if (this.showNightPalette)\n      out.push(\n        html`<obc-toggle-button-option value=\"night\" type=\"icon\">\n          <obi-palette-night slot=\"icon\"></obi-palette-night>\n        </obc-toggle-button-option>`\n      );\n    if (this.showDuskPalette)\n      out.push(\n        html`<obc-toggle-button-option value=\"dusk\" type=\"icon\">\n          <obi-palette-dusk slot=\"icon\"></obi-palette-dusk>\n        </obc-toggle-button-option>`\n      );\n    if (this.showDayPalette)\n      out.push(\n        html`<obc-toggle-button-option value=\"day\" type=\"icon\">\n          <obi-palette-day slot=\"icon\"></obi-palette-day>\n        </obc-toggle-button-option>`\n      );\n    if (this.showBrightPalette)\n      out.push(\n        html`<obc-toggle-button-option value=\"bright\" type=\"icon\">\n          <obi-palette-day-bright slot=\"icon\"></obi-palette-day-bright>\n        </obc-toggle-button-option>`\n      );\n    return out;\n  }\n\n  renderPalette() {\n    const palettes = this.availablePalettes;\n    if (palettes.length === 0) return nothing;\n\n    const paletteNames: Record<ObcPalette, string> = {\n      [ObcPalette.night]: msg('Night'),\n      [ObcPalette.dusk]: msg('Dusk'),\n      [ObcPalette.day]: msg('Day'),\n      [ObcPalette.bright]: msg('Bright'),\n    };\n    const currentPaletteName = paletteNames[this.effectivePalette];\n    const valueLength = currentPaletteName.length;\n    const index = palettes.indexOf(this.effectivePalette);\n    const nextIndex = Math.min(index + 1, palettes.length - 1);\n    const previousIndex = Math.max(index - 1, 0);\n    const nextPalette = paletteNames[palettes[nextIndex]];\n    const previousPalette = paletteNames[palettes[previousIndex]];\n\n    return html`\n      ${\n        this.variant === ObcBrillianceMenuVariant.tabbed\n          ? nothing\n          : html`\n              <div class=\"title-container\">\n                <h3>${msg('Day')}/${msg('Night')}</h3>\n              </div>\n            `\n      }\n      <div\n        class=\"content-container palette ${\n          this.showLinkPalette ? 'with-link' : 'without-link'\n        }\"\n      >\n        ${\n          this.variant === ObcBrillianceMenuVariant.compact\n            ? html` <obc-toggle-button-group\n                value=${this.effectivePalette}\n                @value=${this.onPaletteChanged}\n                variant=${ObcToggleButtonOptionVariant.regular}\n                type=${ObcToggleButtonOptionType.icon}\n              >\n                ${this.paletteOptions()}\n              </obc-toggle-button-group>`\n            : html`\n                <div class=\"value-container\">\n                  <div class=\"value-label-container\">\n                    ${this.paletteIcon}\n                    <div\n                      class=\"label-container\"\n                      style=\"width: ${valueLength}ch\"\n                    >\n                      <div class=\"value\">${currentPaletteName}</div>\n                    </div>\n                  </div>\n                  <obc-progress-indicator-dots\n                    .totalSteps=${palettes.length}\n                    .currentStep=${index + 1}\n                  ></obc-progress-indicator-dots>\n                </div>\n                <div class=\"icon-button-container\">\n                  <obc-button\n                    segmentPosition=\"start\"\n                    fullWidth\n                    showLeadingIcon\n                    ?disabled=${!this.canDecreasePalette}\n                    class=${this.canDecreasePalette ? '' : 'disabled'}\n                    @click=${() => this.previousPalette()}\n                  >\n                    ${previousPalette}\n                    <obi-chevron-left-google\n                      slot=\"leading-icon\"\n                    ></obi-chevron-left-google>\n                  </obc-button>\n\n                  <obc-button\n                    segmentPosition=\"end\"\n                    fullWidth\n                    showTrailingIcon\n                    ?disabled=${!this.canIncreasePalette}\n                    class=${this.canIncreasePalette ? '' : 'disabled'}\n                    @click=${() => this.nextPalette()}\n                  >\n                    ${nextPalette}\n                    <obi-chevron-right-google\n                      slot=\"trailing-icon\"\n                    ></obi-chevron-right-google>\n                  </obc-button>\n                </div>\n              `\n        }\n        ${\n          this.showLinkPalette\n            ? html`<obc-toggle-switch\n                .label=\"${msg('Link')}\"\n                hasicon\n                @input=${this.onLinkPaletteChanged}\n              >\n                <obi-link slot=\"icon\"></obi-link>\n              </obc-toggle-switch>`\n            : nothing\n        }\n      </div>\n    `;\n  }\n\n  renderScreenControlLink() {\n    if (this.showScreenControlLink || this.showAdditionalScreenControls) {\n      return html`\n        <div class=\"footer\">\n          ${\n            this.showScreenControlLink\n              ? html`\n                  <obc-navigation-item\n                    .label=\"${msg('Screen Control')}\"\n                    @click=${() => this.handleScreenControlLinkClicked()}\n                    hasicon\n                  >\n                    <obc-user-button\n                      slot=\"icon\"\n                      static\n                      variant=\"icon\"\n                      styleType=\"normal\"\n                    >\n                      <obi-screen-desk slot=\"icon\"></obi-screen-desk>\n                    </obc-user-button>\n                  </obc-navigation-item>\n                `\n              : nothing\n          }\n          ${\n            this.showAdditionalScreenControls\n              ? html`<slot name=\"additional-screen-controls\"></slot>`\n              : nothing\n          }\n        </div>\n      `;\n    }\n    return nothing;\n  }\n\n  override render() {\n    if (this.variant === ObcBrillianceMenuVariant.tabbed) {\n      const tabs = this.tabs;\n      const [brillianceTab, paletteTab] = tabs;\n      return html`\n        <div class=\"card tabbed\">\n          <obc-tab-row\n            .tabs=${tabs}\n            .selectedTabId=${this.selectedTabId}\n            .centerContent=${true}\n            @tab-selected=${this.onTabSelected}\n          >\n            <obi-display-brilliance-iec\n              slot=\"tab-${BRILLIANCE_TAB_ID}-icon\"\n            ></obi-display-brilliance-iec>\n            <obi-palette-day-night-iec\n              slot=\"tab-${PALETTE_TAB_ID}-icon\"\n            ></obi-palette-day-night-iec>\n          </obc-tab-row>\n          <!-- TODO(#1312): link the panels to their tabs once obc-tab-row supports it -->\n          <div\n            role=\"tabpanel\"\n            aria-label=${brillianceTab.title}\n            ?hidden=${this.selectedTabId !== BRILLIANCE_TAB_ID}\n          >\n            ${this.renderBrightness()}\n          </div>\n          <div\n            role=\"tabpanel\"\n            aria-label=${paletteTab.title}\n            ?hidden=${this.selectedTabId !== PALETTE_TAB_ID}\n          >\n            ${this.renderPalette()}\n          </div>\n          ${this.renderScreenControlLink()}\n        </div>\n      `;\n    } else {\n      return html`\n        <div class=\"card ${this.variant}\">\n          ${this.showBrightness ? this.renderBrightness() : nothing}\n          ${\n            this.showBrightness && this.showPalette\n              ? html`<div class=\"divider\"></div>`\n              : nothing\n          }\n          ${this.showPalette ? this.renderPalette() : nothing}\n          ${this.renderScreenControlLink()}\n        </div>\n      `;\n    }\n  }\n\n  handleScreenControlLinkClicked() {\n    this.dispatchEvent(new CustomEvent('screen-control-link-clicked'));\n  }\n\n  static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-brilliance-menu': ObcBrillianceMenu;\n  }\n}\n"],"names":["ObcPalette","ObcBrillianceMenuVariant","ObcBrillianceInputVariant"],"mappings":"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"}

package/dist/integration-systems/integration-bar/integration-bar.d.ts

@@ -38,9 +38,11 @@ import '../../icons/icon-link.js';
  * @property fleetButtonSelected - Selected state of fleet button
  * @property fleetButtonActivated - Active state of fleet button while selection is pending
  * @property fleetButtonLabel - Label for the fleet button
+ * @property hasRightTrayLeading - Renders the `right-tray-leading` slot first in the right-hand button group
  * @slot clock - Custom clock content, rendered when `showClock` is true
  * @slot integration-buttons - Regular vessel integration buttons
  * @slot hug-buttons - Compact vessel integration buttons; slotted integration buttons are forced to hug type
+ * @slot right-tray-leading - Consumer-defined controls, placed first in the right-hand button group; rendered when `hasRightTrayLeading` is true
  * @fires {CustomEvent} fleet-button-click - Fired when the fleet button is clicked
  * @fires {CustomEvent} link-button-clicked - Fired when the link button is clicked
  * @fires {CustomEvent} alert-button-clicked - Fired when the alert button is clicked
@@ -92,6 +94,8 @@ export declare class ObcIntegrationBar extends LitElement {
     fleetButtonActivated: boolean;
     /** Label for the fleet button */
     fleetButtonLabel: string;
+    /** Renders the `right-tray-leading` slot first in the right-hand button group */
+    hasRightTrayLeading: boolean;
     private buttonsOnBar;
     private onFleetButtonClick;
     private onHugButtonsSlotChange;

package/dist/integration-systems/integration-bar/integration-bar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"integration-bar.d.ts","sourceRoot":"","sources":["../../../src/integration-systems/integration-bar/integration-bar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAA2B,MAAM,KAAK,CAAC;AAGzD,OAAO,yCAAyC,CAAC;AACjD,OAAO,6CAA6C,CAAC;AAKrD,OAAO,iCAAiC,CAAC;AACzC,OAAO,6CAA6C,CAAC;AACrD,OAAO,2CAA2C,CAAC;AACnD,OAAO,0BAA0B,CAAC;AAClC,OAAO,+BAA+B,CAAC;AACvC,OAAO,kCAAkC,CAAC;AAC1C,OAAO,0BAA0B,CAAC;AAClC,OAAO,0BAA0B,CAAC;AAClC,OAAO,iCAAiC,CAAC;AACzC,OAAO,4BAA4B,CAAC;AACpC,OAAO,0BAA0B,CAAC;AAKlC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,qBACa,iBAAkB,SAAQ,UAAU;IACpB,cAAc,UAAS;IACvB,SAAS,UAAS;IAClB,cAAc,UAAS;IACvB,mBAAmB,UAAS;IAC5B,cAAc,UAAS;IACvB,mBAAmB,UAAS;IAC5B,iBAAiB,UAAS;IAC1B,sBAAsB,UAAS;IAC/B,gBAAgB,UAAS;IACzB,qBAAqB,UAAS;IAC9B,gBAAgB,UAAS;IACzB,qBAAqB,UAAS;IAC9B,sBAAsB,UAAS;IAC/B,2BAA2B,UAAS;IACpC,eAAe,UAAS;IACxB,oBAAoB,UAAS;IAC7B,eAAe,UAAS;IACxB,mBAAmB,UAAS;IAC5B,oBAAoB,UAAS;IAC9B,gBAAgB,SAAW;IAE5C,OAAO,CAAC,YAAY,CAAS;IAEtC,OAAO,CAAC,kBAAkB;IAI1B,OAAO,CAAC,sBAAsB;IAe9B,OAAO,CAAC,mBAAmB;IAIlB,MAAM;IAsOf,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,iBAAiB,CAAC;KAC1C;CACF"}
+{"version":3,"file":"integration-bar.d.ts","sourceRoot":"","sources":["../../../src/integration-systems/integration-bar/integration-bar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAA2B,MAAM,KAAK,CAAC;AAGzD,OAAO,yCAAyC,CAAC;AACjD,OAAO,6CAA6C,CAAC;AAKrD,OAAO,iCAAiC,CAAC;AACzC,OAAO,6CAA6C,CAAC;AACrD,OAAO,2CAA2C,CAAC;AACnD,OAAO,0BAA0B,CAAC;AAClC,OAAO,+BAA+B,CAAC;AACvC,OAAO,kCAAkC,CAAC;AAC1C,OAAO,0BAA0B,CAAC;AAClC,OAAO,0BAA0B,CAAC;AAClC,OAAO,iCAAiC,CAAC;AACzC,OAAO,4BAA4B,CAAC;AACpC,OAAO,0BAA0B,CAAC;AAKlC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AACH,qBACa,iBAAkB,SAAQ,UAAU;IACpB,cAAc,UAAS;IACvB,SAAS,UAAS;IAClB,cAAc,UAAS;IACvB,mBAAmB,UAAS;IAC5B,cAAc,UAAS;IACvB,mBAAmB,UAAS;IAC5B,iBAAiB,UAAS;IAC1B,sBAAsB,UAAS;IAC/B,gBAAgB,UAAS;IACzB,qBAAqB,UAAS;IAC9B,gBAAgB,UAAS;IACzB,qBAAqB,UAAS;IAC9B,sBAAsB,UAAS;IAC/B,2BAA2B,UAAS;IACpC,eAAe,UAAS;IACxB,oBAAoB,UAAS;IAC7B,eAAe,UAAS;IACxB,mBAAmB,UAAS;IAC5B,oBAAoB,UAAS;IAC9B,gBAAgB,SAAW;IAC1B,mBAAmB,UAAS;IAE9C,OAAO,CAAC,YAAY,CAAS;IAEtC,OAAO,CAAC,kBAAkB;IAI1B,OAAO,CAAC,sBAAsB;IAe9B,OAAO,CAAC,mBAAmB;IAIlB,MAAM;IA2Of,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,iBAAiB,CAAC;KAC1C;CACF"}