@oicl/openbridge-webcomponents 2.0.0-next.72 → 2.0.0-next.74

package/dist/components/toggle-button-vertical-group/toggle-button-vertical-group.d.ts

@@ -26,6 +26,10 @@ export type ObcToggleButtonVerticalGroupValueChangeEvent = CustomEvent<{
  * - **Layout behavior:**
  *   - By default, the group stretches to fill available container width, with options stacked vertically.
  *   - When `hugWidth` is true, the group shrinks to fit its content width instead of expanding.
+ * - **Empty selection mode:** When `allowEmptySelection` is true, a `value` that does not match any enabled
+ *   option leaves the group with no option selected, instead of defaulting to the first enabled option. Use
+ *   this when a selection may legitimately be absent (e.g. unset, loading, or error states) so the UI does not
+ *   imply a choice the user has not made.
  * - **Disabled state:** Setting `disabled` on the group disables all contained options at once. Individual
  *   options can also be disabled independently while the group remains enabled.
  * - **Divider management:** Automatically shows visual dividers between options and hides the divider after
@@ -113,6 +117,16 @@ export declare class ObcToggleButtonVerticalGroup extends LitElement {
      * Defaults to false.
      */
     hugWidth: boolean;
+    /**
+     * If true, a `value` that does not match any enabled option leaves the group with no option selected
+     * instead of defaulting to the first enabled option.
+     *
+     * This also applies when the currently selected option becomes disabled: the group clears its selection
+     * rather than falling back to another option.
+     *
+     * Defaults to false (the first enabled option is selected when the value does not match).
+     */
+    allowEmptySelection: boolean;
     /**
      * Disables the entire group and all contained options.
      *

package/dist/components/toggle-button-vertical-group/toggle-button-vertical-group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toggle-button-vertical-group.d.ts","sourceRoot":"","sources":["../../../src/components/toggle-button-vertical-group/toggle-button-vertical-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAmB,cAAc,EAAC,MAAM,KAAK,CAAC;AAKhE,OAAO,EAEL,iCAAiC,EAClC,MAAM,mEAAmE,CAAC;AAI3E,MAAM,MAAM,4CAA4C,GAAG,WAAW,CAAC;IACrE,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,MAAM,CAAC;CACvB,CAAC,CAAC;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyFG;AACH,qBACa,4BAA6B,SAAQ,UAAU;IAC1D;;;;OAIG;IACuB,KAAK,SAAM;IAErC;;;;OAIG;IACuB,IAAI,oCAA6C;IAE3E;;;;OAIG;IACwB,QAAQ,UAAS;IAE5C;;;;;;OAMG;IACuC,QAAQ,UAAS;IAG3D,OAAO,CAAC,OAAO,CAA6C;IAE5D,OAAO,CAAC,uBAAuB,CAG3B;IAEJ,OAAO,CAAC,mBAAmB;IAK3B,OAAO,CAAC,eAAe;IAMvB,OAAO,CAAC,gBAAgB;IAMxB,OAAO,CAAC,wBAAwB;IAKhC,OAAO,CAAC,eAAe;cAgDJ,YAAY,CAAC,OAAO,EAAE,cAAc;IA+CvD,OAAO,CAAC,0BAA0B;IAUzB,UAAU,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI;IA0BzC,OAAO,CAAC,iBAAiB,EAAE,cAAc;IAYlD,OAAO,CAAC,cAAc;IAOtB,OAAO,CAAC,gBAAgB;IAKf,MAAM;IAiBf,OAAgB,MAAM,0BAAoB;CAC3C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kCAAkC,EAAE,4BAA4B,CAAC;KAClE;CACF"}
+{"version":3,"file":"toggle-button-vertical-group.d.ts","sourceRoot":"","sources":["../../../src/components/toggle-button-vertical-group/toggle-button-vertical-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAmB,cAAc,EAAC,MAAM,KAAK,CAAC;AAKhE,OAAO,EAEL,iCAAiC,EAClC,MAAM,mEAAmE,CAAC;AAI3E,MAAM,MAAM,4CAA4C,GAAG,WAAW,CAAC;IACrE,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,MAAM,CAAC;CACvB,CAAC,CAAC;AAEH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6FG;AACH,qBACa,4BAA6B,SAAQ,UAAU;IAC1D;;;;OAIG;IACuB,KAAK,SAAM;IAErC;;;;OAIG;IACuB,IAAI,oCAA6C;IAE3E;;;;OAIG;IACwB,QAAQ,UAAS;IAE5C;;;;;;;;OAQG;IACwB,mBAAmB,UAAS;IAEvD;;;;;;OAMG;IACuC,QAAQ,UAAS;IAG3D,OAAO,CAAC,OAAO,CAA6C;IAE5D,OAAO,CAAC,uBAAuB,CAG3B;IAEJ,OAAO,CAAC,mBAAmB;IAK3B,OAAO,CAAC,eAAe;IAMvB,OAAO,CAAC,gBAAgB;IAMxB,OAAO,CAAC,wBAAwB;IAKhC,OAAO,CAAC,eAAe;cAoDJ,YAAY,CAAC,OAAO,EAAE,cAAc;IAmDvD,OAAO,CAAC,0BAA0B;IAczB,UAAU,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI;IA0BzC,OAAO,CAAC,iBAAiB,EAAE,cAAc;IAgBlD,OAAO,CAAC,cAAc;IAOtB,OAAO,CAAC,gBAAgB;IAKf,MAAM;IAiBf,OAAgB,MAAM,0BAAoB;CAC3C;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kCAAkC,EAAE,4BAA4B,CAAC;KAClE;CACF"}

package/dist/components/toggle-button-vertical-group/toggle-button-vertical-group.js

@@ -20,6 +20,7 @@ let ObcToggleButtonVerticalGroup = class extends LitElement {
     this.value = "";
     this.type = ObcToggleButtonVerticalOptionType.regular;
     this.hugWidth = false;
+    this.allowEmptySelection = false;
     this.disabled = false;
     this._originalDisabledStates = /* @__PURE__ */ new Map();
   }
@@ -56,8 +57,12 @@ let ObcToggleButtonVerticalGroup = class extends LitElement {
         this.updateDividers();
         return;
       }
-      const fallback = this.getFirstSelectableOption();
-      newValue = fallback?.value || "";
+      if (this.allowEmptySelection) {
+        newValue = "";
+      } else {
+        const fallback = this.getFirstSelectableOption();
+        newValue = fallback?.value || "";
+      }
     }
     this.value = newValue;
     this.options.forEach((option) => {
@@ -100,9 +105,13 @@ let ObcToggleButtonVerticalGroup = class extends LitElement {
       }
     });
     if (!this.value || !this.getOptionByValue(this.value)) {
-      const firstSelectable = this.getFirstSelectableOption();
-      if (firstSelectable) {
-        this.updateSelection(firstSelectable.value, false);
+      if (this.allowEmptySelection) {
+        this.updateSelection("", false);
+      } else {
+        const firstSelectable = this.getFirstSelectableOption();
+        if (firstSelectable) {
+          this.updateSelection(firstSelectable.value, false);
+        }
       }
     } else {
       this.updateSelection(this.value, false);
@@ -111,6 +120,10 @@ let ObcToggleButtonVerticalGroup = class extends LitElement {
   handleOptionDisabledChange() {
     const currentOption = this.getOptionByValue(this.value);
     if (currentOption?.disabled && this.hasAnyEnabledOption()) {
+      if (this.allowEmptySelection) {
+        this.updateSelection("");
+        return;
+      }
       const firstSelectable = this.getFirstSelectableOption();
       if (firstSelectable) {
         this.updateSelection(firstSelectable.value);
@@ -143,6 +156,10 @@ let ObcToggleButtonVerticalGroup = class extends LitElement {
     super.updated(changedProperties);
     const currentOption = this.getOptionByValue(this.value);
     if (currentOption?.disabled && this.hasAnyEnabledOption()) {
+      if (this.allowEmptySelection) {
+        this.updateSelection("");
+        return;
+      }
       const firstSelectable = this.getFirstSelectableOption();
       if (firstSelectable) {
         this.updateSelection(firstSelectable.value);
@@ -185,6 +202,9 @@ __decorateClass([
 __decorateClass([
   property({ type: Boolean })
 ], ObcToggleButtonVerticalGroup.prototype, "hugWidth", 2);
+__decorateClass([
+  property({ type: Boolean })
+], ObcToggleButtonVerticalGroup.prototype, "allowEmptySelection", 2);
 __decorateClass([
   property({ type: Boolean, reflect: true })
 ], ObcToggleButtonVerticalGroup.prototype, "disabled", 2);

package/dist/components/toggle-button-vertical-group/toggle-button-vertical-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"toggle-button-vertical-group.js","sources":["../../../src/components/toggle-button-vertical-group/toggle-button-vertical-group.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS, PropertyValues} from 'lit';\nimport {property, queryAssignedElements} from 'lit/decorators.js';\nimport {customElement} from '../../decorator.js';\nimport {classMap} from 'lit/directives/class-map.js';\n\nimport {\n  ObcToggleButtonVerticalOption,\n  ObcToggleButtonVerticalOptionType,\n} from '../toggle-button-vertical-option/toggle-button-vertical-option.js';\n\nimport style from './toggle-button-vertical-group.css?inline';\n\nexport type ObcToggleButtonVerticalGroupValueChangeEvent = CustomEvent<{\n  value: string;\n  previousValue: string;\n}>;\n\n/**\n * `<obc-toggle-button-vertical-group>` – A vertically oriented segmented control for selecting a single option from a set.\n *\n * Provides a vertical stack of connected toggle buttons where only one option can be selected at a time.\n * Each option is represented by an `<obc-toggle-button-vertical-option>` child element. The group manages selection\n * state automatically, deselecting the previous option when a new one is chosen.\n *\n * Appears as a visually unified vertical column of buttons with clear selection indicators. Commonly used for sidebar\n * navigation, vertical filter controls, or mode selection in vertical layouts. Ideal for scenarios where vertical\n * space is available and horizontal space is limited, such as side panels or navigation drawers.\n *\n * ### Features\n *\n * - **Single selection mode:** Only one option can be active at a time; selecting a new option automatically\n *   deselects the previous one. Similar to radio button behavior but with a button-like vertical appearance.\n * - **Visual variants:**\n *   - `regular` (default): Standard appearance with full background and border styling.\n *   - `flat`: Minimal style with reduced visual weight, no prominent background or border.\n *   - `normal`: **TODO(designer)** – Clarify the visual difference and intended use case for the `normal` variant compared to `regular` and `flat`.\n * - **Layout behavior:**\n *   - By default, the group stretches to fill available container width, with options stacked vertically.\n *   - When `hugWidth` is true, the group shrinks to fit its content width instead of expanding.\n * - **Disabled state:** Setting `disabled` on the group disables all contained options at once. Individual\n *   options can also be disabled independently while the group remains enabled.\n * - **Divider management:** Automatically shows visual dividers between options and hides the divider after\n *   the last option for a clean, unified appearance.\n * - **Property propagation:** The group automatically synchronizes the `type` property to all child\n *   `<obc-toggle-button-vertical-option>` elements for consistent styling.\n * - **Automatic fallback selection:** If the current value is set to a disabled or non-existent option, the\n *   group automatically selects the first enabled option to ensure a valid state.\n *\n * ### Usage Guidelines\n *\n * Use `<obc-toggle-button-vertical-group>` when you need users to choose exactly one option from a small set of\n * mutually exclusive choices (typically 2-5 options) in a vertical layout. It provides a more compact and visually\n * integrated alternative to radio buttons for vertical navigation or control panels.\n *\n * **Ideal use cases:**\n * - Sidebar navigation toggles (e.g., dashboard/reports/settings views)\n * - Vertical filter controls (e.g., all/active/archived items)\n * - Mode selectors in vertical panels (e.g., edit/preview/code modes)\n * - View toggles in constrained horizontal spaces (e.g., mobile side panels)\n * - Control panels with vertical layout preference\n *\n * **When not to use:**\n * - For binary on/off choices, use a switch or checkbox instead.\n * - For multiple selections from a set, use checkboxes or chips.\n * - For many options (6+), consider a dropdown/select or radio button list for better scannability.\n * - For horizontal layouts with adequate space, use `<obc-toggle-button-group>` instead.\n * - For navigation between pages or sections, use tabs or a navigation menu.\n *\n * **Best Practices:**\n * - Each option must have a unique `value` property to prevent selection conflicts.\n * - Provide clear, concise labels for each option. Keep text short (1-2 words ideal).\n * - For icon-only buttons, ensure icons are universally recognizable or provide tooltips.\n * - Set an initial `value` to indicate the default selection, or the first enabled option will be selected automatically.\n * - Avoid disabling the currently selected option; if an option becomes unavailable, selection will shift to the first enabled option.\n * - Use `type=\"flat\"` in dense UIs or when the toggle is secondary to other content.\n * - Ensure adequate vertical space for the number of options to avoid excessive scrolling or cramped layouts.\n *\n * ### Slots\n *\n * | Slot Name | Renders When... | Purpose |\n * |-----------|-----------------|---------|\n * | (default) | Always | Place one or more `<obc-toggle-button-vertical-option>` elements here to define the selectable options in the group. Each option can include an icon via its own `icon` slot. |\n *\n * ### Events\n *\n * - `value` – Fired when the selected value changes, either through user interaction or programmatic change.\n *   Event detail: `{ value: string, previousValue: string }`. Listen to this event to react to selection changes.\n *\n * ### Example\n *\n * ```html\n * <obc-toggle-button-vertical-group value=\"list\" type=\"regular\">\n *   <obc-toggle-button-vertical-option value=\"list\" label=\"List\" hasIcon>\n *     <obi-placeholder slot=\"icon\"></obi-placeholder>\n *   </obc-toggle-button-vertical-option>\n *   <obc-toggle-button-vertical-option value=\"grid\" label=\"Grid\" hasIcon>\n *     <obi-placeholder slot=\"icon\"></obi-placeholder>\n *   </obc-toggle-button-vertical-option>\n *   <obc-toggle-button-vertical-option value=\"table\" label=\"Table\" hasIcon>\n *     <obi-placeholder slot=\"icon\"></obi-placeholder>\n *   </obc-toggle-button-vertical-option>\n * </obc-toggle-button-vertical-group>\n * ```\n *\n * @slot - Place one or more `<obc-toggle-button-vertical-option>` elements here to define the selectable options.\n * @fires value {CustomEvent<{value: string, previousValue: string}>} Fired when the selected value changes.\n */\n@customElement('obc-toggle-button-vertical-group')\nexport class ObcToggleButtonVerticalGroup extends LitElement {\n  /**\n   * The value of the currently selected option.\n   *\n   * Setting this property programmatically updates the selection. If the value does not match any enabled option, the group selects the first available enabled option.\n   */\n  @property({type: String}) value = '';\n\n  /**\n   * Visual style for all options in the group.\n   *\n   * One of: \"flat\", \"regular\", \"normal\".\n   */\n  @property({type: String}) type = ObcToggleButtonVerticalOptionType.regular;\n\n  /**\n   * If true, the group shrinks to fit its content width instead of stretching to fill its container.\n   *\n   * Defaults to false.\n   */\n  @property({type: Boolean}) hugWidth = false;\n\n  /**\n   * Disables the entire group and all contained options.\n   *\n   * When set to true, all options become non-interactive, regardless of their individual disabled state.\n   *\n   * Defaults to false.\n   */\n  @property({type: Boolean, reflect: true}) disabled = false;\n\n  @queryAssignedElements({selector: 'obc-toggle-button-vertical-option'})\n  private options!: NodeListOf<ObcToggleButtonVerticalOption>;\n\n  private _originalDisabledStates = new Map<\n    ObcToggleButtonVerticalOption,\n    boolean\n  >();\n\n  private hasAnyEnabledOption(): boolean {\n    if (this.disabled) return false;\n    return Array.from(this.options).some((opt) => !opt.disabled);\n  }\n\n  private canSelectOption(value: string): boolean {\n    if (this.disabled) return false;\n    const option = this.getOptionByValue(value);\n    return option !== null && !option.disabled;\n  }\n\n  private getOptionByValue(\n    value: string\n  ): ObcToggleButtonVerticalOption | null {\n    return Array.from(this.options).find((opt) => opt.value === value) || null;\n  }\n\n  private getFirstSelectableOption(): ObcToggleButtonVerticalOption | null {\n    if (this.disabled) return null;\n    return Array.from(this.options).find((opt) => !opt.disabled) || null;\n  }\n\n  private updateSelection(newValue: string, emitEvent: boolean = true) {\n    const oldValue = this.value;\n\n    if (!this.hasAnyEnabledOption()) {\n      this.options.forEach((option) => {\n        option.selected = option.value === this.value;\n      });\n      this.updateDividers();\n      return;\n    }\n\n    if (!this.canSelectOption(newValue)) {\n      if (this.value && this.getOptionByValue(this.value)) {\n        this.options.forEach((option) => {\n          option.selected = option.value === this.value;\n        });\n        this.updateDividers();\n        return;\n      }\n      const fallback = this.getFirstSelectableOption();\n      newValue = fallback?.value || '';\n    }\n\n    this.value = newValue;\n\n    this.options.forEach((option) => {\n      option.selected = option.value === newValue;\n    });\n\n    this.updateDividers();\n\n    if (emitEvent && oldValue !== newValue) {\n      /**\n       * Fired when the selected option changes.\n       *\n       * The event detail contains the new value and the previous value:\n       * `{ value: string, previousValue: string }`\n       *\n       * @event value\n       */\n      this.dispatchEvent(\n        new CustomEvent('value', {\n          detail: {value: newValue, previousValue: oldValue},\n        })\n      );\n    }\n  }\n\n  protected override firstUpdated(changed: PropertyValues) {\n    super.firstUpdated(changed);\n\n    const values = Array.from(this.options).map((opt) => opt.value);\n    const uniqueValues = new Set(values);\n    if (values.length !== uniqueValues.size) {\n      console.warn(\n        'Toggle button vertical group has duplicate values. This may cause unexpected behavior.'\n      );\n    }\n\n    this.options.forEach((opt) => {\n      this._originalDisabledStates.set(opt, opt.disabled);\n\n      opt.addEventListener('selected', (e) => this.onOptionSelected(e));\n\n      const observer = new MutationObserver((mutations) => {\n        mutations.forEach((mutation) => {\n          if (\n            mutation.attributeName === 'disabled' &&\n            !opt.hasAttribute('data-group-disabled')\n          ) {\n            this._originalDisabledStates.set(opt, opt.disabled);\n            this.handleOptionDisabledChange();\n          }\n        });\n      });\n      observer.observe(opt, {attributes: true, attributeFilter: ['disabled']});\n\n      opt.type = this.type;\n\n      if (this.disabled) {\n        opt.setAttribute('data-group-disabled', 'true');\n        opt.disabled = true;\n      }\n    });\n\n    if (!this.value || !this.getOptionByValue(this.value)) {\n      const firstSelectable = this.getFirstSelectableOption();\n      if (firstSelectable) {\n        this.updateSelection(firstSelectable.value, false);\n      }\n    } else {\n      this.updateSelection(this.value, false);\n    }\n  }\n\n  private handleOptionDisabledChange() {\n    const currentOption = this.getOptionByValue(this.value);\n    if (currentOption?.disabled && this.hasAnyEnabledOption()) {\n      const firstSelectable = this.getFirstSelectableOption();\n      if (firstSelectable) {\n        this.updateSelection(firstSelectable.value);\n      }\n    }\n  }\n\n  override willUpdate(changed: PropertyValues): void {\n    if (changed.has('value')) {\n      this.updateSelection(this.value);\n    }\n\n    if (changed.has('type')) {\n      this.options.forEach((opt) => {\n        opt.type = this.type;\n      });\n    }\n\n    if (changed.has('disabled')) {\n      this.options.forEach((option) => {\n        if (this.disabled) {\n          option.setAttribute('data-group-disabled', 'true');\n          option.disabled = true;\n        } else {\n          option.removeAttribute('data-group-disabled');\n          const originalState =\n            this._originalDisabledStates.get(option) || false;\n          option.disabled = originalState;\n        }\n      });\n    }\n  }\n\n  override updated(changedProperties: PropertyValues) {\n    super.updated(changedProperties);\n\n    const currentOption = this.getOptionByValue(this.value);\n    if (currentOption?.disabled && this.hasAnyEnabledOption()) {\n      const firstSelectable = this.getFirstSelectableOption();\n      if (firstSelectable) {\n        this.updateSelection(firstSelectable.value);\n      }\n    }\n  }\n\n  private updateDividers(): void {\n    const last = this.options.length - 1;\n    this.options.forEach((opt, idx) => {\n      opt.showDivider = idx !== last;\n    });\n  }\n\n  private onOptionSelected(e: Event): void {\n    const {value} = (e as CustomEvent).detail;\n    this.updateSelection(value);\n  }\n\n  override render() {\n    const classes = {\n      'outer-wrapper': true,\n      flat: this.type === ObcToggleButtonVerticalOptionType.flat,\n      regular: this.type === ObcToggleButtonVerticalOptionType.regular,\n      normal: this.type === ObcToggleButtonVerticalOptionType.normal,\n      'hug-width': this.hugWidth,\n      disabled: this.disabled,\n    };\n\n    return html`\n      <div class=${classMap(classes)}>\n        <div class=\"wrapper\"><slot></slot></div>\n      </div>\n    `;\n  }\n\n  static override styles = unsafeCSS(style);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-toggle-button-vertical-group': ObcToggleButtonVerticalGroup;\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"toggle-button-vertical-group.js","sources":["../../../src/components/toggle-button-vertical-group/toggle-button-vertical-group.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS, PropertyValues} from 'lit';\nimport {property, queryAssignedElements} from 'lit/decorators.js';\nimport {customElement} from '../../decorator.js';\nimport {classMap} from 'lit/directives/class-map.js';\n\nimport {\n  ObcToggleButtonVerticalOption,\n  ObcToggleButtonVerticalOptionType,\n} from '../toggle-button-vertical-option/toggle-button-vertical-option.js';\n\nimport style from './toggle-button-vertical-group.css?inline';\n\nexport type ObcToggleButtonVerticalGroupValueChangeEvent = CustomEvent<{\n  value: string;\n  previousValue: string;\n}>;\n\n/**\n * `<obc-toggle-button-vertical-group>` – A vertically oriented segmented control for selecting a single option from a set.\n *\n * Provides a vertical stack of connected toggle buttons where only one option can be selected at a time.\n * Each option is represented by an `<obc-toggle-button-vertical-option>` child element. The group manages selection\n * state automatically, deselecting the previous option when a new one is chosen.\n *\n * Appears as a visually unified vertical column of buttons with clear selection indicators. Commonly used for sidebar\n * navigation, vertical filter controls, or mode selection in vertical layouts. Ideal for scenarios where vertical\n * space is available and horizontal space is limited, such as side panels or navigation drawers.\n *\n * ### Features\n *\n * - **Single selection mode:** Only one option can be active at a time; selecting a new option automatically\n *   deselects the previous one. Similar to radio button behavior but with a button-like vertical appearance.\n * - **Visual variants:**\n *   - `regular` (default): Standard appearance with full background and border styling.\n *   - `flat`: Minimal style with reduced visual weight, no prominent background or border.\n *   - `normal`: **TODO(designer)** – Clarify the visual difference and intended use case for the `normal` variant compared to `regular` and `flat`.\n * - **Layout behavior:**\n *   - By default, the group stretches to fill available container width, with options stacked vertically.\n *   - When `hugWidth` is true, the group shrinks to fit its content width instead of expanding.\n * - **Empty selection mode:** When `allowEmptySelection` is true, a `value` that does not match any enabled\n *   option leaves the group with no option selected, instead of defaulting to the first enabled option. Use\n *   this when a selection may legitimately be absent (e.g. unset, loading, or error states) so the UI does not\n *   imply a choice the user has not made.\n * - **Disabled state:** Setting `disabled` on the group disables all contained options at once. Individual\n *   options can also be disabled independently while the group remains enabled.\n * - **Divider management:** Automatically shows visual dividers between options and hides the divider after\n *   the last option for a clean, unified appearance.\n * - **Property propagation:** The group automatically synchronizes the `type` property to all child\n *   `<obc-toggle-button-vertical-option>` elements for consistent styling.\n * - **Automatic fallback selection:** If the current value is set to a disabled or non-existent option, the\n *   group automatically selects the first enabled option to ensure a valid state.\n *\n * ### Usage Guidelines\n *\n * Use `<obc-toggle-button-vertical-group>` when you need users to choose exactly one option from a small set of\n * mutually exclusive choices (typically 2-5 options) in a vertical layout. It provides a more compact and visually\n * integrated alternative to radio buttons for vertical navigation or control panels.\n *\n * **Ideal use cases:**\n * - Sidebar navigation toggles (e.g., dashboard/reports/settings views)\n * - Vertical filter controls (e.g., all/active/archived items)\n * - Mode selectors in vertical panels (e.g., edit/preview/code modes)\n * - View toggles in constrained horizontal spaces (e.g., mobile side panels)\n * - Control panels with vertical layout preference\n *\n * **When not to use:**\n * - For binary on/off choices, use a switch or checkbox instead.\n * - For multiple selections from a set, use checkboxes or chips.\n * - For many options (6+), consider a dropdown/select or radio button list for better scannability.\n * - For horizontal layouts with adequate space, use `<obc-toggle-button-group>` instead.\n * - For navigation between pages or sections, use tabs or a navigation menu.\n *\n * **Best Practices:**\n * - Each option must have a unique `value` property to prevent selection conflicts.\n * - Provide clear, concise labels for each option. Keep text short (1-2 words ideal).\n * - For icon-only buttons, ensure icons are universally recognizable or provide tooltips.\n * - Set an initial `value` to indicate the default selection, or the first enabled option will be selected automatically.\n * - Avoid disabling the currently selected option; if an option becomes unavailable, selection will shift to the first enabled option.\n * - Use `type=\"flat\"` in dense UIs or when the toggle is secondary to other content.\n * - Ensure adequate vertical space for the number of options to avoid excessive scrolling or cramped layouts.\n *\n * ### Slots\n *\n * | Slot Name | Renders When... | Purpose |\n * |-----------|-----------------|---------|\n * | (default) | Always | Place one or more `<obc-toggle-button-vertical-option>` elements here to define the selectable options in the group. Each option can include an icon via its own `icon` slot. |\n *\n * ### Events\n *\n * - `value` – Fired when the selected value changes, either through user interaction or programmatic change.\n *   Event detail: `{ value: string, previousValue: string }`. Listen to this event to react to selection changes.\n *\n * ### Example\n *\n * ```html\n * <obc-toggle-button-vertical-group value=\"list\" type=\"regular\">\n *   <obc-toggle-button-vertical-option value=\"list\" label=\"List\" hasIcon>\n *     <obi-placeholder slot=\"icon\"></obi-placeholder>\n *   </obc-toggle-button-vertical-option>\n *   <obc-toggle-button-vertical-option value=\"grid\" label=\"Grid\" hasIcon>\n *     <obi-placeholder slot=\"icon\"></obi-placeholder>\n *   </obc-toggle-button-vertical-option>\n *   <obc-toggle-button-vertical-option value=\"table\" label=\"Table\" hasIcon>\n *     <obi-placeholder slot=\"icon\"></obi-placeholder>\n *   </obc-toggle-button-vertical-option>\n * </obc-toggle-button-vertical-group>\n * ```\n *\n * @slot - Place one or more `<obc-toggle-button-vertical-option>` elements here to define the selectable options.\n * @fires value {CustomEvent<{value: string, previousValue: string}>} Fired when the selected value changes.\n */\n@customElement('obc-toggle-button-vertical-group')\nexport class ObcToggleButtonVerticalGroup extends LitElement {\n  /**\n   * The value of the currently selected option.\n   *\n   * Setting this property programmatically updates the selection. If the value does not match any enabled option, the group selects the first available enabled option.\n   */\n  @property({type: String}) value = '';\n\n  /**\n   * Visual style for all options in the group.\n   *\n   * One of: \"flat\", \"regular\", \"normal\".\n   */\n  @property({type: String}) type = ObcToggleButtonVerticalOptionType.regular;\n\n  /**\n   * If true, the group shrinks to fit its content width instead of stretching to fill its container.\n   *\n   * Defaults to false.\n   */\n  @property({type: Boolean}) hugWidth = false;\n\n  /**\n   * If true, a `value` that does not match any enabled option leaves the group with no option selected\n   * instead of defaulting to the first enabled option.\n   *\n   * This also applies when the currently selected option becomes disabled: the group clears its selection\n   * rather than falling back to another option.\n   *\n   * Defaults to false (the first enabled option is selected when the value does not match).\n   */\n  @property({type: Boolean}) allowEmptySelection = false;\n\n  /**\n   * Disables the entire group and all contained options.\n   *\n   * When set to true, all options become non-interactive, regardless of their individual disabled state.\n   *\n   * Defaults to false.\n   */\n  @property({type: Boolean, reflect: true}) disabled = false;\n\n  @queryAssignedElements({selector: 'obc-toggle-button-vertical-option'})\n  private options!: NodeListOf<ObcToggleButtonVerticalOption>;\n\n  private _originalDisabledStates = new Map<\n    ObcToggleButtonVerticalOption,\n    boolean\n  >();\n\n  private hasAnyEnabledOption(): boolean {\n    if (this.disabled) return false;\n    return Array.from(this.options).some((opt) => !opt.disabled);\n  }\n\n  private canSelectOption(value: string): boolean {\n    if (this.disabled) return false;\n    const option = this.getOptionByValue(value);\n    return option !== null && !option.disabled;\n  }\n\n  private getOptionByValue(\n    value: string\n  ): ObcToggleButtonVerticalOption | null {\n    return Array.from(this.options).find((opt) => opt.value === value) || null;\n  }\n\n  private getFirstSelectableOption(): ObcToggleButtonVerticalOption | null {\n    if (this.disabled) return null;\n    return Array.from(this.options).find((opt) => !opt.disabled) || null;\n  }\n\n  private updateSelection(newValue: string, emitEvent: boolean = true) {\n    const oldValue = this.value;\n\n    if (!this.hasAnyEnabledOption()) {\n      this.options.forEach((option) => {\n        option.selected = option.value === this.value;\n      });\n      this.updateDividers();\n      return;\n    }\n\n    if (!this.canSelectOption(newValue)) {\n      if (this.value && this.getOptionByValue(this.value)) {\n        this.options.forEach((option) => {\n          option.selected = option.value === this.value;\n        });\n        this.updateDividers();\n        return;\n      }\n      if (this.allowEmptySelection) {\n        newValue = '';\n      } else {\n        const fallback = this.getFirstSelectableOption();\n        newValue = fallback?.value || '';\n      }\n    }\n\n    this.value = newValue;\n\n    this.options.forEach((option) => {\n      option.selected = option.value === newValue;\n    });\n\n    this.updateDividers();\n\n    if (emitEvent && oldValue !== newValue) {\n      /**\n       * Fired when the selected option changes.\n       *\n       * The event detail contains the new value and the previous value:\n       * `{ value: string, previousValue: string }`\n       *\n       * @event value\n       */\n      this.dispatchEvent(\n        new CustomEvent('value', {\n          detail: {value: newValue, previousValue: oldValue},\n        })\n      );\n    }\n  }\n\n  protected override firstUpdated(changed: PropertyValues) {\n    super.firstUpdated(changed);\n\n    const values = Array.from(this.options).map((opt) => opt.value);\n    const uniqueValues = new Set(values);\n    if (values.length !== uniqueValues.size) {\n      console.warn(\n        'Toggle button vertical group has duplicate values. This may cause unexpected behavior.'\n      );\n    }\n\n    this.options.forEach((opt) => {\n      this._originalDisabledStates.set(opt, opt.disabled);\n\n      opt.addEventListener('selected', (e) => this.onOptionSelected(e));\n\n      const observer = new MutationObserver((mutations) => {\n        mutations.forEach((mutation) => {\n          if (\n            mutation.attributeName === 'disabled' &&\n            !opt.hasAttribute('data-group-disabled')\n          ) {\n            this._originalDisabledStates.set(opt, opt.disabled);\n            this.handleOptionDisabledChange();\n          }\n        });\n      });\n      observer.observe(opt, {attributes: true, attributeFilter: ['disabled']});\n\n      opt.type = this.type;\n\n      if (this.disabled) {\n        opt.setAttribute('data-group-disabled', 'true');\n        opt.disabled = true;\n      }\n    });\n\n    if (!this.value || !this.getOptionByValue(this.value)) {\n      if (this.allowEmptySelection) {\n        this.updateSelection('', false);\n      } else {\n        const firstSelectable = this.getFirstSelectableOption();\n        if (firstSelectable) {\n          this.updateSelection(firstSelectable.value, false);\n        }\n      }\n    } else {\n      this.updateSelection(this.value, false);\n    }\n  }\n\n  private handleOptionDisabledChange() {\n    const currentOption = this.getOptionByValue(this.value);\n    if (currentOption?.disabled && this.hasAnyEnabledOption()) {\n      if (this.allowEmptySelection) {\n        this.updateSelection('');\n        return;\n      }\n      const firstSelectable = this.getFirstSelectableOption();\n      if (firstSelectable) {\n        this.updateSelection(firstSelectable.value);\n      }\n    }\n  }\n\n  override willUpdate(changed: PropertyValues): void {\n    if (changed.has('value')) {\n      this.updateSelection(this.value);\n    }\n\n    if (changed.has('type')) {\n      this.options.forEach((opt) => {\n        opt.type = this.type;\n      });\n    }\n\n    if (changed.has('disabled')) {\n      this.options.forEach((option) => {\n        if (this.disabled) {\n          option.setAttribute('data-group-disabled', 'true');\n          option.disabled = true;\n        } else {\n          option.removeAttribute('data-group-disabled');\n          const originalState =\n            this._originalDisabledStates.get(option) || false;\n          option.disabled = originalState;\n        }\n      });\n    }\n  }\n\n  override updated(changedProperties: PropertyValues) {\n    super.updated(changedProperties);\n\n    const currentOption = this.getOptionByValue(this.value);\n    if (currentOption?.disabled && this.hasAnyEnabledOption()) {\n      if (this.allowEmptySelection) {\n        this.updateSelection('');\n        return;\n      }\n      const firstSelectable = this.getFirstSelectableOption();\n      if (firstSelectable) {\n        this.updateSelection(firstSelectable.value);\n      }\n    }\n  }\n\n  private updateDividers(): void {\n    const last = this.options.length - 1;\n    this.options.forEach((opt, idx) => {\n      opt.showDivider = idx !== last;\n    });\n  }\n\n  private onOptionSelected(e: Event): void {\n    const {value} = (e as CustomEvent).detail;\n    this.updateSelection(value);\n  }\n\n  override render() {\n    const classes = {\n      'outer-wrapper': true,\n      flat: this.type === ObcToggleButtonVerticalOptionType.flat,\n      regular: this.type === ObcToggleButtonVerticalOptionType.regular,\n      normal: this.type === ObcToggleButtonVerticalOptionType.normal,\n      'hug-width': this.hugWidth,\n      disabled: this.disabled,\n    };\n\n    return html`\n      <div class=${classMap(classes)}>\n        <div class=\"wrapper\"><slot></slot></div>\n      </div>\n    `;\n  }\n\n  static override styles = unsafeCSS(style);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-toggle-button-vertical-group': ObcToggleButtonVerticalGroup;\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/integration-systems/integration-vessel-menu/integration-vessel-menu.css.js

@@ -8,6 +8,10 @@ const componentStyle = css`
   box-sizing: border-box;
 }
 
+:host {
+  display: block;
+}
+
 .wrapper {
             border-color: var(--integration-normal-enabled-border-color);
             background-color: var(--integration-normal-enabled-background-color);
@@ -18,6 +22,7 @@ const componentStyle = css`
   display: flex;
   flex-direction: column;
   align-items: center;
+  height: 100%;
   background: var(--container-global-color);
   border-radius: var(
     --app-components-integration-system-dropdown-menu-border-radius
@@ -44,6 +49,10 @@ const componentStyle = css`
   border-radius: 12px;
 }
 
+.footer-container.hidden {
+    display: none;
+  }
+
 .content-area {
   display: flex;
   flex-direction: column;
@@ -53,6 +62,10 @@ const componentStyle = css`
   border-radius: 8px;
 }
 
+.content-area.hidden {
+    display: none;
+  }
+
 .footer-container slot[name="buttons"]::slotted(*) {
   display: flex;
   flex: 1 1 0px;
@@ -67,7 +80,8 @@ const componentStyle = css`
   gap: var(--app-components-integration-system-menu-action-spacing);
 }
 
-.buttons-slot {
+.buttons-slot,
+.content-slot {
   display: contents;
 }
 
@@ -81,12 +95,13 @@ const componentStyle = css`
   border-radius: 8px;
 }
 
-.content-container.hidealarmlist {
+.content-container.hidden {
     display: none;
   }
 
 .alertlist {
   width: 100%;
+  height: 100%;
 }
 
 .leading-icon {

package/dist/integration-systems/integration-vessel-menu/integration-vessel-menu.css.js.map

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

package/dist/integration-systems/integration-vessel-menu/integration-vessel-menu.d.ts

@@ -2,17 +2,39 @@ import { LitElement } from 'lit';
 import '../../components/button/button.js';
 import '../../components/icon-button/icon-button.js';
 import '../../icons/icon-placeholder.js';
+import '../../icons/icon-unacknowledged.js';
 import '../../building-blocks/alert-list/alert-list.js';
 /**
  * `<obc-integration-vessel-menu>` – A menu to be shown when selecting a obc-integration-button from a obc-integration-bar.
  *
+ * ## Sizing
+ *
+ * The menu hugs its content and never reserves more space than its slotted
+ * sections need; it deliberately does not impose a height of its own. Sizing is
+ * owned by the consumer, since only the consumer knows how large the menu may
+ * grow in a given layout.
+ *
+ * From a web components perspective, drive the size from the host element and
+ * the slotted light-DOM nodes — not from component properties:
+ *
+ * - **Bound the whole menu** by giving the host element a definite `height`. The
+ *   menu fills that height and the alert list scrolls within the remaining space
+ *   while the footer and content keep their size. This is the recommended
+ *   approach. (A `max-height` alone will not bound the list — the internal
+ *   scroll needs a definite height to resolve against.)
+ * - **Size sections independently** (advanced) by sizing the slotted nodes
+ *   directly — e.g. a fixed-height `content` element, or a capped, scrollable
+ *   wrapper around the `alarms` items.
+ * - **Leave it unbounded** to let the menu grow with its content.
+ *
  * @slot buttons - Buttons shown in the footer.
  * @slot content - Main content shown in the content area.
  * @slot alarms - Alarm items rendered inside the alert list.
  */
 export declare class ObcIntegrationVesselMenu extends LitElement {
-    /** Hide the alarm list, ensuring it doesn't take space (display: none). */
-    hideAlarmList: boolean;
+    hasActions: boolean;
+    hasAlertList: boolean;
+    hasContent: boolean;
     protected render(): import('lit-html').TemplateResult<1>;
     static styles: import('lit').CSSResult;
 }

package/dist/integration-systems/integration-vessel-menu/integration-vessel-menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"integration-vessel-menu.d.ts","sourceRoot":"","sources":["../../../src/integration-systems/integration-vessel-menu/integration-vessel-menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAMhD,OAAO,mCAAmC,CAAC;AAC3C,OAAO,6CAA6C,CAAC;AACrD,OAAO,iCAAiC,CAAC;AACzC,OAAO,gDAAgD,CAAC;AAExD;;;;;;GAMG;AAEH,qBACa,wBAAyB,SAAQ,UAAU;IACtD,2EAA2E;IAChD,aAAa,UAAS;cAE9B,MAAM;IA2BzB,OAAgB,MAAM,0BAA6B;CACpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,6BAA6B,EAAE,wBAAwB,CAAC;KACzD;CACF"}
+{"version":3,"file":"integration-vessel-menu.d.ts","sourceRoot":"","sources":["../../../src/integration-systems/integration-vessel-menu/integration-vessel-menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAMhD,OAAO,mCAAmC,CAAC;AAC3C,OAAO,6CAA6C,CAAC;AACrD,OAAO,iCAAiC,CAAC;AACzC,OAAO,oCAAoC,CAAC;AAC5C,OAAO,gDAAgD,CAAC;AAExD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AAEH,qBACa,wBAAyB,SAAQ,UAAU;IACT,UAAU,UAAQ;IAClB,YAAY,UAAQ;IACpB,UAAU,UAAQ;cAE5C,MAAM;IAuCzB,OAAgB,MAAM,0BAA6B;CACpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,6BAA6B,EAAE,wBAAwB,CAAC;KACzD;CACF"}

package/dist/integration-systems/integration-vessel-menu/integration-vessel-menu.js

@@ -6,6 +6,7 @@ import componentStyle from "./integration-vessel-menu.css.js";
 import "../../components/button/button.js";
 import "../../components/icon-button/icon-button.js";
 import "../../icons/icon-placeholder.js";
+import "../../icons/icon-unacknowledged.js";
 import "../../building-blocks/alert-list/alert-list.js";
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -20,29 +21,43 @@ var __decorateClass = (decorators, target, key, kind) => {
 let ObcIntegrationVesselMenu = class extends LitElement {
   constructor() {
     super(...arguments);
-    this.hideAlarmList = false;
+    this.hasActions = true;
+    this.hasAlertList = true;
+    this.hasContent = true;
   }
   render() {
     return html`
-      <div
-        class=${classMap({
-      wrapper: true
+      <div class="wrapper">
+        <div
+          class=${classMap({
+      "footer-container": true,
+      hidden: !this.hasActions
     })}
-      >
-        <div class="footer-container">
+        >
           <slot name="buttons" class="buttons-slot"></slot>
         </div>
-        <div class="content-area">
-          <slot name="content"></slot>
+        <div
+          class=${classMap({
+      "content-area": true,
+      hidden: !this.hasContent
+    })}
+        >
+          <slot name="content" class="content-slot"></slot>
         </div>
         <div
           class=${classMap({
       "content-container": true,
-      hidealarmlist: this.hideAlarmList
+      hidden: !this.hasAlertList
     })}
         >
           <obc-alert-list class="alertlist"
             ><slot name="alarms"></slot>
+            <div slot="empty-icon">
+              <obi-unacknowledged></obi-unacknowledged>
+            </div>
+            <div slot="empty-title">
+              <span>No alerts</span>
+            </div>
           </obc-alert-list>
         </div>
       </div>
@@ -51,8 +66,14 @@ let ObcIntegrationVesselMenu = class extends LitElement {
 };
 ObcIntegrationVesselMenu.styles = unsafeCSS(componentStyle);
 __decorateClass([
-  property({ type: Boolean })
-], ObcIntegrationVesselMenu.prototype, "hideAlarmList", 2);
+  property({ type: Boolean, attribute: false })
+], ObcIntegrationVesselMenu.prototype, "hasActions", 2);
+__decorateClass([
+  property({ type: Boolean, attribute: false })
+], ObcIntegrationVesselMenu.prototype, "hasAlertList", 2);
+__decorateClass([
+  property({ type: Boolean, attribute: false })
+], ObcIntegrationVesselMenu.prototype, "hasContent", 2);
 ObcIntegrationVesselMenu = __decorateClass([
   customElement("obc-integration-vessel-menu")
 ], ObcIntegrationVesselMenu);

package/dist/integration-systems/integration-vessel-menu/integration-vessel-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"integration-vessel-menu.js","sources":["../../../src/integration-systems/integration-vessel-menu/integration-vessel-menu.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {customElement} from '../../decorator.js';\nimport componentStyle from './integration-vessel-menu.css?inline';\n\nimport '../../components/button/button.js';\nimport '../../components/icon-button/icon-button.js';\nimport '../../icons/icon-placeholder.js';\nimport '../../building-blocks/alert-list/alert-list.js';\n\n/**\n * `<obc-integration-vessel-menu>` – A menu to be shown when selecting a obc-integration-button from a obc-integration-bar.\n *\n * @slot buttons - Buttons shown in the footer.\n * @slot content - Main content shown in the content area.\n * @slot alarms - Alarm items rendered inside the alert list.\n */\n\n@customElement('obc-integration-vessel-menu')\nexport class ObcIntegrationVesselMenu extends LitElement {\n  /** Hide the alarm list, ensuring it doesn't take space (display: none). */\n  @property({type: Boolean}) hideAlarmList = false;\n\n  protected override render() {\n    return html`\n      <div\n        class=${classMap({\n          wrapper: true,\n        })}\n      >\n        <div class=\"footer-container\">\n          <slot name=\"buttons\" class=\"buttons-slot\"></slot>\n        </div>\n        <div class=\"content-area\">\n          <slot name=\"content\"></slot>\n        </div>\n        <div\n          class=${classMap({\n            'content-container': true,\n            hidealarmlist: this.hideAlarmList,\n          })}\n        >\n          <obc-alert-list class=\"alertlist\"\n            ><slot name=\"alarms\"></slot>\n          </obc-alert-list>\n        </div>\n      </div>\n    `;\n  }\n\n  static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-integration-vessel-menu': ObcIntegrationVesselMenu;\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAoBO,IAAM,2BAAN,cAAuC,WAAW;AAAA,EAAlD,cAAA;AAAA,UAAA,GAAA,SAAA;AAEsB,SAAA,gBAAgB;AAAA,EAAA;AAAA,EAExB,SAAS;AAC1B,WAAO;AAAA;AAAA,gBAEK,SAAS;AAAA,MACf,SAAS;AAAA,IAAA,CACV,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBASQ,SAAS;AAAA,MACf,qBAAqB;AAAA,MACrB,eAAe,KAAK;AAAA,IAAA,CACrB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQV;AAGF;AAhCa,yBA+BK,SAAS,UAAU,cAAc;AA7BtB,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAFd,yBAEgB,WAAA,iBAAA,CAAA;AAFhB,2BAAN,gBAAA;AAAA,EADN,cAAc,6BAA6B;AAAA,GAC/B,wBAAA;"}
+{"version":3,"file":"integration-vessel-menu.js","sources":["../../../src/integration-systems/integration-vessel-menu/integration-vessel-menu.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {customElement} from '../../decorator.js';\nimport componentStyle from './integration-vessel-menu.css?inline';\n\nimport '../../components/button/button.js';\nimport '../../components/icon-button/icon-button.js';\nimport '../../icons/icon-placeholder.js';\nimport '../../icons/icon-unacknowledged.js';\nimport '../../building-blocks/alert-list/alert-list.js';\n\n/**\n * `<obc-integration-vessel-menu>` – A menu to be shown when selecting a obc-integration-button from a obc-integration-bar.\n *\n * ## Sizing\n *\n * The menu hugs its content and never reserves more space than its slotted\n * sections need; it deliberately does not impose a height of its own. Sizing is\n * owned by the consumer, since only the consumer knows how large the menu may\n * grow in a given layout.\n *\n * From a web components perspective, drive the size from the host element and\n * the slotted light-DOM nodes — not from component properties:\n *\n * - **Bound the whole menu** by giving the host element a definite `height`. The\n *   menu fills that height and the alert list scrolls within the remaining space\n *   while the footer and content keep their size. This is the recommended\n *   approach. (A `max-height` alone will not bound the list — the internal\n *   scroll needs a definite height to resolve against.)\n * - **Size sections independently** (advanced) by sizing the slotted nodes\n *   directly — e.g. a fixed-height `content` element, or a capped, scrollable\n *   wrapper around the `alarms` items.\n * - **Leave it unbounded** to let the menu grow with its content.\n *\n * @slot buttons - Buttons shown in the footer.\n * @slot content - Main content shown in the content area.\n * @slot alarms - Alarm items rendered inside the alert list.\n */\n\n@customElement('obc-integration-vessel-menu')\nexport class ObcIntegrationVesselMenu extends LitElement {\n  @property({type: Boolean, attribute: false}) hasActions = true;\n  @property({type: Boolean, attribute: false}) hasAlertList = true;\n  @property({type: Boolean, attribute: false}) hasContent = true;\n\n  protected override render() {\n    return html`\n      <div class=\"wrapper\">\n        <div\n          class=${classMap({\n            'footer-container': true,\n            hidden: !this.hasActions,\n          })}\n        >\n          <slot name=\"buttons\" class=\"buttons-slot\"></slot>\n        </div>\n        <div\n          class=${classMap({\n            'content-area': true,\n            hidden: !this.hasContent,\n          })}\n        >\n          <slot name=\"content\" class=\"content-slot\"></slot>\n        </div>\n        <div\n          class=${classMap({\n            'content-container': true,\n            hidden: !this.hasAlertList,\n          })}\n        >\n          <obc-alert-list class=\"alertlist\"\n            ><slot name=\"alarms\"></slot>\n            <div slot=\"empty-icon\">\n              <obi-unacknowledged></obi-unacknowledged>\n            </div>\n            <div slot=\"empty-title\">\n              <span>No alerts</span>\n            </div>\n          </obc-alert-list>\n        </div>\n      </div>\n    `;\n  }\n\n  static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'obc-integration-vessel-menu': ObcIntegrationVesselMenu;\n  }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;AAyCO,IAAM,2BAAN,cAAuC,WAAW;AAAA,EAAlD,cAAA;AAAA,UAAA,GAAA,SAAA;AACwC,SAAA,aAAa;AACb,SAAA,eAAe;AACf,SAAA,aAAa;AAAA,EAAA;AAAA,EAEvC,SAAS;AAC1B,WAAO;AAAA;AAAA;AAAA,kBAGO,SAAS;AAAA,MACf,oBAAoB;AAAA,MACpB,QAAQ,CAAC,KAAK;AAAA,IAAA,CACf,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,kBAKM,SAAS;AAAA,MACf,gBAAgB;AAAA,MAChB,QAAQ,CAAC,KAAK;AAAA,IAAA,CACf,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,kBAKM,SAAS;AAAA,MACf,qBAAqB;AAAA,MACrB,QAAQ,CAAC,KAAK;AAAA,IAAA,CACf,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAcV;AAGF;AA7Ca,yBA4CK,SAAS,UAAU,cAAc;AA3CJ,gBAAA;AAAA,EAA5C,SAAS,EAAC,MAAM,SAAS,WAAW,OAAM;AAAA,GADhC,yBACkC,WAAA,cAAA,CAAA;AACA,gBAAA;AAAA,EAA5C,SAAS,EAAC,MAAM,SAAS,WAAW,OAAM;AAAA,GAFhC,yBAEkC,WAAA,gBAAA,CAAA;AACA,gBAAA;AAAA,EAA5C,SAAS,EAAC,MAAM,SAAS,WAAW,OAAM;AAAA,GAHhC,yBAGkC,WAAA,cAAA,CAAA;AAHlC,2BAAN,gBAAA;AAAA,EADN,cAAc,6BAA6B;AAAA,GAC/B,wBAAA;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oicl/openbridge-webcomponents",
-  "version": "2.0.0-next.72",
+  "version": "2.0.0-next.74",
   "type": "module",
   "repository": {
     "type": "git",