npm - @oicl/openbridge-webcomponents - Versions diffs - 2.0.0-next.84 → 2.0.0-next.86 - Mend

@oicl/openbridge-webcomponents 2.0.0-next.84 → 2.0.0-next.86

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (17) hide show

package/bundle/openbridge-webcomponents.bundle.js +76 -34
package/bundle/openbridge-webcomponents.bundle.js.map +1 -1
package/custom-elements.json +64 -16
package/dist/components/tab-item/tab-item.css.js +8 -1
package/dist/components/tab-item/tab-item.css.js.map +1 -1
package/dist/components/tab-item/tab-item.d.ts +44 -0
package/dist/components/tab-item/tab-item.d.ts.map +1 -1
package/dist/components/tab-item/tab-item.js +44 -25
package/dist/components/tab-item/tab-item.js.map +1 -1
package/dist/components/tab-row/tab-row.d.ts +23 -9
package/dist/components/tab-row/tab-row.d.ts.map +1 -1
package/dist/components/tab-row/tab-row.js +24 -7
package/dist/components/tab-row/tab-row.js.map +1 -1
package/dist/components/top-bar/top-bar.d.ts.map +1 -1
package/dist/components/top-bar/top-bar.js +0 -1
package/dist/components/top-bar/top-bar.js.map +1 -1
package/package.json +1 -1

package/dist/components/tab-row/tab-row.d.ts CHANGED Viewed

@@ -1,4 +1,5 @@
 import { LitElement } from 'lit';
+import { TabItemBadge } from '../tab-item/tab-item.js';
 import { BadgeType, BadgeSize } from '../badge/badge.js';
 import '../tab-item/tab-item.js';
 import '../icon-button/icon-button.js';
@@ -10,11 +11,22 @@ export interface TabData {
     subtitle?: string;
     showSubtitle?: boolean;
     hasLeadingIcon?: boolean;
+    /**
+     * One or more badges to display on the tab. When non-empty this takes
+     * precedence over the deprecated single-badge fields below.
+     */
+    badges?: TabItemBadge[];
+    /** @deprecated Use `badges` instead. */
     hasBadge?: boolean;
+    /** @deprecated Use `badges` instead. */
     badgeCount?: number;
+    /** @deprecated Use `badges` instead. */
     badgeType?: BadgeType;
+    /** @deprecated Use `badges` instead. */
     badgeSize?: BadgeSize;
+    /** @deprecated Use `badges` instead. */
     badgeShowNumber?: boolean;
+    /** @deprecated Use `badges` instead. */
     showLeadingBadgeIcon?: boolean;
     disabled?: boolean;
 }
@@ -74,8 +86,8 @@ export interface TabData {
  *
  * | Slot Name                | Renders When...                   | Purpose                                              |
  * |--------------------------|------------------------------------|------------------------------------------------------|
- * | `tab-<id>-icon`          | If `hasLeadingIcon` is true        | Leading icon for a specific tab (replaceable)        |
- * | `tab-<id>-badge-icon`    | If `showLeadingBadgeIcon` is true  | Badge icon for a specific tab (replaceable)          |
+ * | `tab-<id>-icon`              | If `hasLeadingIcon` is true                          | Leading icon for a specific tab (replaceable)        |
+ * | `tab-<id>-<iconSlotName>`    | For each badge that declares an `iconSlotName`       | Custom icon for a specific tab's badge (replaceable). The deprecated single-badge path uses `tab-<id>-badge-icon`. |
  *
  * ---
  *
@@ -94,7 +106,7 @@ export interface TabData {
  * - If using custom icons, provide them via the appropriate named slot for each tab.
  *
  * @slot tab-<id>-icon - Leading icon slot for each tab (shown when `hasLeadingIcon` is true for that tab)
- * @slot tab-<id>-badge-icon - Badge icon slot for each tab (shown when `showLeadingBadgeIcon` is true for that tab)
+ * @slot tab-<id>-<iconSlotName> - Custom badge icon slot for each tab, one per badge that declares an `iconSlotName`. The deprecated single-badge path uses `tab-<id>-badge-icon`.
  * @fires tab-selected {CustomEvent<{tab: TabData, id: string, index: number}>} Fired when a tab is selected.
  * @fires tab-closed {CustomEvent<{tab: TabData, id: string, index: number}>} Fired when a tab's close button is clicked.
  * @fires add-new-tab {CustomEvent<void>} Fired when the "add new tab" button is clicked.
@@ -108,12 +120,13 @@ export declare class ObcTabRow extends LitElement {
      * - `subtitle` (string): Contextual text shown below the title when subtitle display is enabled.
      * - `showSubtitle` (boolean): Optional per-tab override for displaying the subtitle.
      * - `hasLeadingIcon` (boolean): Whether to show a leading icon (default: true).
-     * - `hasBadge` (boolean): Whether to show a badge on the tab.
-     * - `badgeCount` (number): Number to display in the badge.
-     * - `badgeType` (BadgeType): Visual style of the badge (e.g., notification, alarm, enhance).
-     * - `badgeSize` (BadgeSize): Size of the badge (e.g., regular, large).
-     * - `badgeShowNumber` (boolean): If true, shows the badge number.
-     * - `showLeadingBadgeIcon` (boolean): If true, shows a badge icon.
+     * - `badges` (TabItemBadge[]): One or more badges to display on the tab. Takes precedence over the deprecated single-badge fields below.
+     * - `hasBadge` (boolean, deprecated): Whether to show a badge on the tab.
+     * - `badgeCount` (number, deprecated): Number to display in the badge.
+     * - `badgeType` (BadgeType, deprecated): Visual style of the badge (e.g., notification, alarm, enhance).
+     * - `badgeSize` (BadgeSize, deprecated): Size of the badge (e.g., regular, large).
+     * - `badgeShowNumber` (boolean, deprecated): If true, shows the badge number.
+     * - `showLeadingBadgeIcon` (boolean, deprecated): If true, shows a badge icon.
      * - `disabled` (boolean): If true, disables the tab.
      */
     tabs: TabData[];
@@ -129,6 +142,7 @@ export declare class ObcTabRow extends LitElement {
      * Default: `false`.
      */
     hasClose: boolean;
+    centerContent: boolean;
     /**
      * Enables "hug" mode for a more compact tab layout with reduced padding.
      *

package/dist/components/tab-row/tab-row.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tab-row.d.ts","sourceRoot":"","sources":["../../../src/components/tab-row/tab-row.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAIhD,OAAO,yBAAyB,CAAC;AACjC,OAAO,+BAA+B,CAAC;AACvC,OAAO,iCAAiC,CAAC;AAEzC,OAAO,4BAA4B,CAAC;AACpC,OAAO,EAAC,SAAS,EAAE,SAAS,EAAC,MAAM,mBAAmB,CAAC;AAEvD,MAAM,WAAW,OAAO;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgFG;AACH,qBACa,SAAU,SAAQ,UAAU;IACvC~~;;;;;;;;;;;;;;;OAeG~~;IACsB,IAAI,EAAE,OAAO,EAAE,CAAM;IAE9C;;;;OAIG;IACqD,aAAa,SAAM;IAE3E;;;;OAIG;IACgD,QAAQ,UAAS;~~IAEpE~~;;;;OAIG;IACwB,GAAG,UAAS;IAEvC;;;;OAIG;IACoD,YAAY,UAAS;IAE5E;;;;OAIG;IACsD,YAAY,UAAS;IAE9E,OAAO,CAAC,cAAc;IAatB,OAAO,CAAC,cAAc;IAsBtB,OAAO,CAAC,eAAe;IAMvB,OAAO,CAAC,SAAS;~~IA6CR~~,MAAM;IAwBf,OAAgB,MAAM,0BAA2B;CAClD"}
1	+ {"version":3,"file":"tab-row.d.ts","sourceRoot":"","sources":["../../../src/components/tab-row/tab-row.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAIhD,OAAO,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,yBAAyB,CAAC;AAC1D,OAAO,+BAA+B,CAAC;AACvC,OAAO,iCAAiC,CAAC;AAEzC,OAAO,4BAA4B,CAAC;AACpC,OAAO,EAAC,SAAS,EAAE,SAAS,EAAC,MAAM,mBAAmB,CAAC;AAEvD,MAAM,WAAW,OAAO;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,MAAM,CAAC,EAAE,YAAY,EAAE,CAAC;IACxB,wCAAwC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wCAAwC;IACxC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,wCAAwC;IACxC,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,wCAAwC;IACxC,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,wCAAwC;IACxC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,wCAAwC;IACxC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgFG;AACH,qBACa,SAAU,SAAQ,UAAU;IACvC;;;;;;;;;;;;;;;;OAgBG;IACsB,IAAI,EAAE,OAAO,EAAE,CAAM;IAE9C;;;;OAIG;IACqD,aAAa,SAAM;IAE3E;;;;OAIG;IACgD,QAAQ,UAAS;IAEzC,aAAa,UAAS;IAEjD;;;;OAIG;IACwB,GAAG,UAAS;IAEvC;;;;OAIG;IACoD,YAAY,UAAS;IAE5E;;;;OAIG;IACsD,YAAY,UAAS;IAE9E,OAAO,CAAC,cAAc;IAatB,OAAO,CAAC,cAAc;IAsBtB,OAAO,CAAC,eAAe;IAMvB,OAAO,CAAC,SAAS;IAiER,MAAM;IAwBf,OAAgB,MAAM,0BAA2B;CAClD"}

package/dist/components/tab-row/tab-row.js CHANGED Viewed

@@ -24,6 +24,7 @@ let ObcTabRow = class extends LitElement {
     this.tabs = [];
     this.selectedTabId = "";
     this.hasClose = false;
+    this.centerContent = false;
     this.hug = false;
     this.showSubtitle = false;
     this.hasAddNewTab = false;
@@ -68,8 +69,17 @@ let ObcTabRow = class extends LitElement {
   }
   renderTab(tab, index) {
     const isFirst = index === 0;
+    const previousTabSelected = this.selectedTabId === this.tabs[index - 1]?.id;
     const isChecked = tab.id === this.selectedTabId;
     const showSubtitle = tab.showSubtitle ?? this.showSubtitle;
+    const badgeIconSlots = [
+      ...new Set(
+        (tab.badges ?? []).map((badge) => badge.iconSlotName).filter((slotName) => slotName !== void 0)
+      )
+    ];
+    if ((tab.showLeadingBadgeIcon ?? false) && !badgeIconSlots.includes("badge-icon")) {
+      badgeIconSlots.push("badge-icon");
+    }
     return html`
       <obc-tab-item
         .title=${tab.title}
@@ -79,10 +89,12 @@ let ObcTabRow = class extends LitElement {
         .hasClose=${this.hasClose}
         .hasLeadingIcon=${tab.hasLeadingIcon ?? true}
         .hasTitle=${true}
-        .hasDivider=${!isFirst}
+        .hasDivider=${!isFirst && !previousTabSelected}
         .hug=${this.hug}
+        .centerContent=${this.centerContent}
         .disabled=${tab.disabled || false}
-        .hasBadge=${tab.hasBadge || tab.badgeCount !== void 0 && tab.badgeCount > 0}
+        .badges=${tab.badges ?? []}
+        .hasBadge=${tab.hasBadge || false}
         .badgeCount=${tab.badgeCount || 0}
         .badgeType=${tab.badgeType ?? BadgeType.regular}
         .badgeSize=${tab.badgeSize ?? BadgeSize.regular}
@@ -97,11 +109,13 @@ let ObcTabRow = class extends LitElement {
               </slot>
             ` : ""}
         <span slot="title">${tab.title}</span>
-        ${tab.showLeadingBadgeIcon ? html`
-              <slot name="tab-${tab.id}-badge-icon" slot="badge-icon">
-                <obi-placeholder></obi-placeholder>
-              </slot>
-            ` : ""}
+        ${badgeIconSlots.map(
+      (slotName) => html`
+            <slot name="tab-${tab.id}-${slotName}" slot=${slotName}>
+              <obi-placeholder></obi-placeholder>
+            </slot>
+          `
+    )}
       </obc-tab-item>
     `;
   }
@@ -137,6 +151,9 @@ __decorateClass([
 __decorateClass([
   property({ type: Boolean, attribute: "has-close" })
 ], ObcTabRow.prototype, "hasClose", 2);
+__decorateClass([
+  property({ type: Boolean })
+], ObcTabRow.prototype, "centerContent", 2);
 __decorateClass([
   property({ type: Boolean })
 ], ObcTabRow.prototype, "hug", 2);

package/dist/components/tab-row/tab-row.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tab-row.js","sources":["../../../src/components/tab-row/tab-row.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {repeat} from 'lit/directives/repeat.js';\nimport compentStyle from './tab-row.css?inline';\nimport '../tab-item/tab-item.js';\nimport '../icon-button/icon-button.js';\nimport '../../icons/icon-placeholder.js';\nimport {customElement} from '../../decorator.js';\nimport '../../icons/icon-up-iec.js';\nimport {BadgeType, BadgeSize} from '../badge/badge.js';\n\nexport interface TabData {\n id: string;\n title: string;\n subtitle?: string;\n showSubtitle?: boolean;\n hasLeadingIcon?: boolean;\n hasBadge?: boolean;\n badgeCount?: number;\n badgeType?: BadgeType;\n badgeSize?: BadgeSize;\n badgeShowNumber?: boolean;\n showLeadingBadgeIcon?: boolean;\n disabled?: boolean;\n}\n\n/*\n `<obc-tab-row>` – A horizontal tab navigation bar for switching between multiple content sections.\n \n Displays a row of interactive tabs, each representing a distinct view or section. Supports subtitles, badges, icons, close buttons, and an optional \"add new tab\" action. Designed for use cases where users need to quickly switch between related content areas, such as dashboards, settings, or document editors.\n \n ---\n \n ### Features\n * - Tab Selection: Only one tab can be selected at a time; selection is managed via the `selectedTabId` property.\n * - Closeable Tabs: Optionally display a close button on each tab (`hasClose`), allowing users to remove tabs dynamically.\n * - Add New Tab: Optionally show an \"add new tab\" button at the end of the row (`hasAddNewTab`), emitting an event when clicked.\n * - Subtitles: Optionally show secondary contextual text below each tab title (`showSubtitle` and `subtitle`).\n * - Badges: Tabs can display badges with counts and types (e.g., notification, alarm, enhance), supporting different badge sizes and optional hiding of the number.\n * - Icons: Each tab can show a leading icon (customizable via slot), and optionally a badge icon.\n * - Disabled Tabs: Individual tabs can be disabled to prevent user interaction.\n * - Hug Mode: When `hug` is enabled, tabs use a compact layout with reduced padding.\n * - Responsive Layout: Tabs are arranged horizontally and adapt to the available width.\n \n ---\n \n ### Usage Guidelines\n * Use `<obc-tab-row>` to organize content into logical sections that users can switch between without leaving the current page. Ideal for navigation in multi-view interfaces, such as settings panels, dashboards, or editors. Each tab should represent a distinct, high-level section. Avoid using tabs for navigation between unrelated pages or for single-action toggles.\n \n - Use badges to highlight new activity or counts (e.g., unread messages).\n * - Use the close button for tabs that represent removable or temporary content (e.g., documents, chat sessions).\n * - The \"add new tab\" action is suitable for interfaces where users can create new sections dynamically.\n * - For best accessibility, ensure each tab has a unique `id` and descriptive `title`.\n \n TODO(designer): Confirm if there are recommended limits on the number of tabs, or guidance for handling overflow (e.g., scrolling, collapsing).\n \n ---\n \n ### Example\n * ```html\n * <obc-tab-row\n * .tabs=${[\n * {id: 'tab1', title: 'Inbox', subtitle: 'Monitoring', hasBadge: true, badgeCount: 5, badgeType: 'notification'},\n * {id: 'tab2', title: 'Updates'},\n * {id: 'tab3', title: 'Settings', hasLeadingIcon: true}\n * ]}\n * selectedTabId=\"tab1\"\n * show-subtitle\n * hasClose\n * hasAddNewTab\n * >\n * <obi-placeholder slot=\"tab-tab1-icon\"></obi-placeholder>\n * <obi-placeholder slot=\"tab-tab3-icon\"></obi-placeholder>\n * </obc-tab-row>\n * ```\n \n ---\n \n ### Slots\n \n \| Slot Name \| Renders When... \| Purpose \|\n * \|--------------------------\|------------------------------------\|------------------------------------------------------\|\n * \| `tab-<id>-icon` \| If `hasLeadingIcon` is true \| Leading icon for a specific tab (replaceable) \|\n * \| `tab-<id>-badge-icon` \| If `showLeadingBadgeIcon` is true \| Badge icon for a specific tab (replaceable) \|\n \n ---\n \n ### Events\n * - `tab-selected` – Fired when a tab is selected. Detail: `{tab, id, index}`.\n * - `tab-closed` – Fired when a tab's close button is clicked. Detail: `{tab, id, index}`.\n * - `add-new-tab` – Fired when the \"add new tab\" button is clicked. No detail.\n \n ---\n \n ### Best Practices\n * - Only one tab should be selected at a time.\n * - Use badges sparingly to avoid overwhelming the user.\n * - Avoid using the close button for tabs that should always be present.\n * - For accessibility, ensure tab titles are clear and concise.\n * - If using custom icons, provide them via the appropriate named slot for each tab.\n \n @slot tab-<id>-icon - Leading icon slot for each tab (shown when `hasLeadingIcon` is true for that tab)\n * @slot tab-<id>-badge-icon - Badge icon slot for each tab (shown when `showLeadingBadgeIcon` is true for that tab)\n * @fires tab-selected {CustomEvent<{tab: TabData, id: string, index: number}>} Fired when a tab is selected.\n * @fires tab-closed {CustomEvent<{tab: TabData, id: string, index: number}>} Fired when a tab's close button is clicked.\n * @fires add-new-tab {CustomEvent<void>} Fired when the \"add new tab\" button is clicked.\n /\n@customElement('obc-tab-row')\nexport class ObcTabRow extends LitElement {\n /\n The list of tabs to display. Each tab is defined by an object with properties such as `id`, `title`, `subtitle`, `showSubtitle`, `hasLeadingIcon`, `hasBadge`, `badgeCount`, `badgeType`, `badgeSize`, `badgeShowNumber`, `showLeadingBadgeIcon`, and `disabled`.\n \n - `id` (string): Unique identifier for the tab.\n * - `title` (string): Display label for the tab.\n * - `subtitle` (string): Contextual text shown below the title when subtitle display is enabled.\n * - `showSubtitle` (boolean): Optional per-tab override for displaying the subtitle.\n * - `hasLeadingIcon` (boolean): Whether to show a leading icon (default: true).\n * - `hasBadge` (boolean): Whether to show a badge on the tab.\n * - `badgeCount` (number): Number to display in the badge.\n * - `badgeType` (BadgeType): Visual style of the badge (e.g., notification, alarm, enhance).\n * - `badgeSize` (BadgeSize): Size of the badge (e.g., regular, large).\n * - `badgeShowNumber` (boolean): If true, shows the badge number.\n * - `showLeadingBadgeIcon` (boolean): If true, shows a badge icon.\n * - `disabled` (boolean): If true, disables the tab.\n /\n @property({type: Array}) tabs: TabData[] = [];\n\n /\n The `id` of the currently selected tab. Only one tab can be selected at a time.\n \n Changing this property updates the selected tab visually and emits the `tab-selected` event when changed by user interaction.\n /\n @property({type: String, attribute: 'selected-tab-id'}) selectedTabId = '';\n\n /\n Whether to display a close button on each tab. When enabled, users can remove tabs individually.\n \n Default: `false`.\n /\n @property({type: Boolean, attribute: 'has-close'}) hasClose = false;\n\n /\n Enables \"hug\" mode for a more compact tab layout with reduced padding.\n \n Default: `false`.\n /\n @property({type: Boolean}) hug = false;\n\n /\n Whether to display subtitle text for each tab. Individual tabs can override this with `tab.showSubtitle`.\n \n Default: `false`.\n /\n @property({type: Boolean, attribute: 'show-subtitle'}) showSubtitle = false;\n\n /\n Whether to display an \"add new tab\" button at the end of the tab row. When clicked, emits the `add-new-tab` event.\n \n Default: `false`.\n */\n @property({type: Boolean, attribute: 'has-add-new-tab'}) hasAddNewTab = false;\n\n private handleTabClick(_: Event, tabId: string) {\n const tabIndex = this.tabs.findIndex((t) => t.id === tabId);\n if (tabIndex === -1) return;\n this.selectedTabId = this.tabs[tabIndex].id;\n this.dispatchEvent(\n new CustomEvent('tab-selected', {\n detail: {tab: this.tabs[tabIndex], id: tabId, index: tabIndex},\n bubbles: true,\n composed: true,\n })\n );\n }\n\n private handleTabClose(event: Event, tabId: string) {\n event.stopPropagation();\n const tabIndex = this.tabs.findIndex((t) => t.id === tabId);\n if (tabIndex === -1) return;\n const removedTab = this.tabs[tabIndex];\n this.tabs = [\n ...this.tabs.slice(0, tabIndex),\n ...this.tabs.slice(tabIndex + 1),\n ];\n if (removedTab.id === this.selectedTabId && this.tabs.length) {\n const newIdx = Math.min(tabIndex, this.tabs.length - 1);\n this.selectedTabId = this.tabs[newIdx].id;\n }\n this.dispatchEvent(\n new CustomEvent('tab-closed', {\n detail: {tab: removedTab, id: removedTab.id, index: tabIndex},\n bubbles: true,\n composed: true,\n })\n );\n }\n\n private handleAddNewTab() {\n this.dispatchEvent(\n new CustomEvent('add-new-tab', {bubbles: true, composed: true})\n );\n }\n\n private renderTab(tab: TabData, index: number) {\n const isFirst = index === 0;\n const isChecked = tab.id === this.selectedTabId;\n const showSubtitle = tab.showSubtitle ?? this.showSubtitle;\n return html`\n <obc-tab-item\n .title=${tab.title}\n .subtitle=${tab.subtitle ?? ''}\n .showSubtitle=${showSubtitle}\n .checked=${isChecked}\n .hasClose=${this.hasClose}\n .hasLeadingIcon=${tab.hasLeadingIcon ?? true}\n .hasTitle=${true}\n .hasDivider=${!isFirst}\n .hug=${this.hug}\n .disabled=${tab.disabled \|\| false}\n .hasBadge=${tab.hasBadge \|\|\n (tab.badgeCount !== undefined && tab.badgeCount > 0)}\n .badgeCount=${tab.badgeCount \|\| 0}\n .badgeType=${tab.badgeType ?? BadgeType.regular}\n .badgeSize=${tab.badgeSize ?? BadgeSize.regular}\n .badgeShowNumber=${tab.badgeShowNumber ?? true}\n .showLeadingBadgeIcon=${tab.showLeadingBadgeIcon \|\| false}\n @tab-click=${(e: Event) => this.handleTabClick(e, tab.id)}\n @tab-close=${(e: Event) => this.handleTabClose(e, tab.id)}\n >\n ${tab.hasLeadingIcon !== false\n ? html`\n <slot name=\"tab-${tab.id}-icon\" slot=\"leading-icon\">\n <obi-placeholder></obi-placeholder>\n </slot>\n `\n : ''}\n <span slot=\"title\">${tab.title}</span>\n ${tab.showLeadingBadgeIcon\n ? html`\n <slot name=\"tab-${tab.id}-badge-icon\" slot=\"badge-icon\">\n <obi-placeholder></obi-placeholder>\n </slot>\n `\n : ''}\n </obc-tab-item>\n `;\n }\n\n override render() {\n return html`\n <div class=\"wrapper\" role=\"tablist\">\n ${repeat(\n this.tabs,\n (t) => t.id,\n (t, i) => this.renderTab(t, i)\n )}\n ${this.hasAddNewTab\n ? html`\n <obc-icon-button\n class=\"add-new-tab\"\n variant=\"flat\"\n @click=${this.handleAddNewTab}\n aria-label=\"Add new tab\"\n >\n <obi-up-iec></obi-up-iec>\n </obc-icon-button>\n `\n : ''}\n </div>\n `;\n }\n\n static override styles = unsafeCSS(compentStyle);\n}\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"tab-row.js","sources":["../../../src/components/tab-row/tab-row.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {repeat} from 'lit/directives/repeat.js';\nimport compentStyle from './tab-row.css?inline';\nimport '../tab-item/tab-item.js';\nimport type {TabItemBadge} from '../tab-item/tab-item.js';\nimport '../icon-button/icon-button.js';\nimport '../../icons/icon-placeholder.js';\nimport {customElement} from '../../decorator.js';\nimport '../../icons/icon-up-iec.js';\nimport {BadgeType, BadgeSize} from '../badge/badge.js';\n\nexport interface TabData {\n id: string;\n title: string;\n subtitle?: string;\n showSubtitle?: boolean;\n hasLeadingIcon?: boolean;\n /*\n One or more badges to display on the tab. When non-empty this takes\n * precedence over the deprecated single-badge fields below.\n /\n badges?: TabItemBadge[];\n /* @deprecated Use `badges` instead. /\n hasBadge?: boolean;\n /* @deprecated Use `badges` instead. /\n badgeCount?: number;\n /* @deprecated Use `badges` instead. /\n badgeType?: BadgeType;\n /* @deprecated Use `badges` instead. /\n badgeSize?: BadgeSize;\n /* @deprecated Use `badges` instead. /\n badgeShowNumber?: boolean;\n /* @deprecated Use `badges` instead. /\n showLeadingBadgeIcon?: boolean;\n disabled?: boolean;\n}\n\n/\n `<obc-tab-row>` – A horizontal tab navigation bar for switching between multiple content sections.\n \n Displays a row of interactive tabs, each representing a distinct view or section. Supports subtitles, badges, icons, close buttons, and an optional \"add new tab\" action. Designed for use cases where users need to quickly switch between related content areas, such as dashboards, settings, or document editors.\n \n ---\n \n ### Features\n * - Tab Selection: Only one tab can be selected at a time; selection is managed via the `selectedTabId` property.\n * - Closeable Tabs: Optionally display a close button on each tab (`hasClose`), allowing users to remove tabs dynamically.\n * - Add New Tab: Optionally show an \"add new tab\" button at the end of the row (`hasAddNewTab`), emitting an event when clicked.\n * - Subtitles: Optionally show secondary contextual text below each tab title (`showSubtitle` and `subtitle`).\n * - Badges: Tabs can display badges with counts and types (e.g., notification, alarm, enhance), supporting different badge sizes and optional hiding of the number.\n * - Icons: Each tab can show a leading icon (customizable via slot), and optionally a badge icon.\n * - Disabled Tabs: Individual tabs can be disabled to prevent user interaction.\n * - Hug Mode: When `hug` is enabled, tabs use a compact layout with reduced padding.\n * - Responsive Layout: Tabs are arranged horizontally and adapt to the available width.\n \n ---\n \n ### Usage Guidelines\n * Use `<obc-tab-row>` to organize content into logical sections that users can switch between without leaving the current page. Ideal for navigation in multi-view interfaces, such as settings panels, dashboards, or editors. Each tab should represent a distinct, high-level section. Avoid using tabs for navigation between unrelated pages or for single-action toggles.\n \n - Use badges to highlight new activity or counts (e.g., unread messages).\n * - Use the close button for tabs that represent removable or temporary content (e.g., documents, chat sessions).\n * - The \"add new tab\" action is suitable for interfaces where users can create new sections dynamically.\n * - For best accessibility, ensure each tab has a unique `id` and descriptive `title`.\n \n TODO(designer): Confirm if there are recommended limits on the number of tabs, or guidance for handling overflow (e.g., scrolling, collapsing).\n \n ---\n \n ### Example\n * ```html\n * <obc-tab-row\n * .tabs=${[\n * {id: 'tab1', title: 'Inbox', subtitle: 'Monitoring', hasBadge: true, badgeCount: 5, badgeType: 'notification'},\n * {id: 'tab2', title: 'Updates'},\n * {id: 'tab3', title: 'Settings', hasLeadingIcon: true}\n * ]}\n * selectedTabId=\"tab1\"\n * show-subtitle\n * hasClose\n * hasAddNewTab\n * >\n * <obi-placeholder slot=\"tab-tab1-icon\"></obi-placeholder>\n * <obi-placeholder slot=\"tab-tab3-icon\"></obi-placeholder>\n * </obc-tab-row>\n * ```\n \n ---\n \n ### Slots\n \n \| Slot Name \| Renders When... \| Purpose \|\n * \|--------------------------\|------------------------------------\|------------------------------------------------------\|\n * \| `tab-<id>-icon` \| If `hasLeadingIcon` is true \| Leading icon for a specific tab (replaceable) \|\n * \| `tab-<id>-<iconSlotName>` \| For each badge that declares an `iconSlotName` \| Custom icon for a specific tab's badge (replaceable). The deprecated single-badge path uses `tab-<id>-badge-icon`. \|\n \n ---\n \n ### Events\n * - `tab-selected` – Fired when a tab is selected. Detail: `{tab, id, index}`.\n * - `tab-closed` – Fired when a tab's close button is clicked. Detail: `{tab, id, index}`.\n * - `add-new-tab` – Fired when the \"add new tab\" button is clicked. No detail.\n \n ---\n \n ### Best Practices\n * - Only one tab should be selected at a time.\n * - Use badges sparingly to avoid overwhelming the user.\n * - Avoid using the close button for tabs that should always be present.\n * - For accessibility, ensure tab titles are clear and concise.\n * - If using custom icons, provide them via the appropriate named slot for each tab.\n \n @slot tab-<id>-icon - Leading icon slot for each tab (shown when `hasLeadingIcon` is true for that tab)\n * @slot tab-<id>-<iconSlotName> - Custom badge icon slot for each tab, one per badge that declares an `iconSlotName`. The deprecated single-badge path uses `tab-<id>-badge-icon`.\n * @fires tab-selected {CustomEvent<{tab: TabData, id: string, index: number}>} Fired when a tab is selected.\n * @fires tab-closed {CustomEvent<{tab: TabData, id: string, index: number}>} Fired when a tab's close button is clicked.\n * @fires add-new-tab {CustomEvent<void>} Fired when the \"add new tab\" button is clicked.\n /\n@customElement('obc-tab-row')\nexport class ObcTabRow extends LitElement {\n /\n The list of tabs to display. Each tab is defined by an object with properties such as `id`, `title`, `subtitle`, `showSubtitle`, `hasLeadingIcon`, `hasBadge`, `badgeCount`, `badgeType`, `badgeSize`, `badgeShowNumber`, `showLeadingBadgeIcon`, and `disabled`.\n \n - `id` (string): Unique identifier for the tab.\n * - `title` (string): Display label for the tab.\n * - `subtitle` (string): Contextual text shown below the title when subtitle display is enabled.\n * - `showSubtitle` (boolean): Optional per-tab override for displaying the subtitle.\n * - `hasLeadingIcon` (boolean): Whether to show a leading icon (default: true).\n * - `badges` (TabItemBadge[]): One or more badges to display on the tab. Takes precedence over the deprecated single-badge fields below.\n * - `hasBadge` (boolean, deprecated): Whether to show a badge on the tab.\n * - `badgeCount` (number, deprecated): Number to display in the badge.\n * - `badgeType` (BadgeType, deprecated): Visual style of the badge (e.g., notification, alarm, enhance).\n * - `badgeSize` (BadgeSize, deprecated): Size of the badge (e.g., regular, large).\n * - `badgeShowNumber` (boolean, deprecated): If true, shows the badge number.\n * - `showLeadingBadgeIcon` (boolean, deprecated): If true, shows a badge icon.\n * - `disabled` (boolean): If true, disables the tab.\n /\n @property({type: Array}) tabs: TabData[] = [];\n\n /\n The `id` of the currently selected tab. Only one tab can be selected at a time.\n \n Changing this property updates the selected tab visually and emits the `tab-selected` event when changed by user interaction.\n /\n @property({type: String, attribute: 'selected-tab-id'}) selectedTabId = '';\n\n /\n Whether to display a close button on each tab. When enabled, users can remove tabs individually.\n \n Default: `false`.\n /\n @property({type: Boolean, attribute: 'has-close'}) hasClose = false;\n\n @property({type: Boolean}) centerContent = false;\n\n /\n Enables \"hug\" mode for a more compact tab layout with reduced padding.\n \n Default: `false`.\n /\n @property({type: Boolean}) hug = false;\n\n /\n Whether to display subtitle text for each tab. Individual tabs can override this with `tab.showSubtitle`.\n \n Default: `false`.\n /\n @property({type: Boolean, attribute: 'show-subtitle'}) showSubtitle = false;\n\n /\n Whether to display an \"add new tab\" button at the end of the tab row. When clicked, emits the `add-new-tab` event.\n \n Default: `false`.\n */\n @property({type: Boolean, attribute: 'has-add-new-tab'}) hasAddNewTab = false;\n\n private handleTabClick(_: Event, tabId: string) {\n const tabIndex = this.tabs.findIndex((t) => t.id === tabId);\n if (tabIndex === -1) return;\n this.selectedTabId = this.tabs[tabIndex].id;\n this.dispatchEvent(\n new CustomEvent('tab-selected', {\n detail: {tab: this.tabs[tabIndex], id: tabId, index: tabIndex},\n bubbles: true,\n composed: true,\n })\n );\n }\n\n private handleTabClose(event: Event, tabId: string) {\n event.stopPropagation();\n const tabIndex = this.tabs.findIndex((t) => t.id === tabId);\n if (tabIndex === -1) return;\n const removedTab = this.tabs[tabIndex];\n this.tabs = [\n ...this.tabs.slice(0, tabIndex),\n ...this.tabs.slice(tabIndex + 1),\n ];\n if (removedTab.id === this.selectedTabId && this.tabs.length) {\n const newIdx = Math.min(tabIndex, this.tabs.length - 1);\n this.selectedTabId = this.tabs[newIdx].id;\n }\n this.dispatchEvent(\n new CustomEvent('tab-closed', {\n detail: {tab: removedTab, id: removedTab.id, index: tabIndex},\n bubbles: true,\n composed: true,\n })\n );\n }\n\n private handleAddNewTab() {\n this.dispatchEvent(\n new CustomEvent('add-new-tab', {bubbles: true, composed: true})\n );\n }\n\n private renderTab(tab: TabData, index: number) {\n const isFirst = index === 0;\n const previousTabSelected = this.selectedTabId === this.tabs[index - 1]?.id;\n const isChecked = tab.id === this.selectedTabId;\n const showSubtitle = tab.showSubtitle ?? this.showSubtitle;\n // Forward a light-DOM slot for every distinct `iconSlotName` declared by the\n // tab's badges (new `badges` array), plus the deprecated single badge-icon\n // slot. obc-tab-item renders `<slot name=${iconSlotName} slot=\"badge-icon\">`\n // inside each badge, so obc-tab-row must project matching content into that\n // slot. Slots are namespaced by tab id to stay unique across the row.\n const badgeIconSlots = [\n ...new Set(\n (tab.badges ?? [])\n .map((badge) => badge.iconSlotName)\n .filter((slotName): slotName is string => slotName !== undefined)\n ),\n ];\n if (\n (tab.showLeadingBadgeIcon ?? false) &&\n !badgeIconSlots.includes('badge-icon')\n ) {\n badgeIconSlots.push('badge-icon');\n }\n return html`\n <obc-tab-item\n .title=${tab.title}\n .subtitle=${tab.subtitle ?? ''}\n .showSubtitle=${showSubtitle}\n .checked=${isChecked}\n .hasClose=${this.hasClose}\n .hasLeadingIcon=${tab.hasLeadingIcon ?? true}\n .hasTitle=${true}\n .hasDivider=${!isFirst && !previousTabSelected}\n .hug=${this.hug}\n .centerContent=${this.centerContent}\n .disabled=${tab.disabled \|\| false}\n .badges=${tab.badges ?? []}\n .hasBadge=${tab.hasBadge \|\| false}\n .badgeCount=${tab.badgeCount \|\| 0}\n .badgeType=${tab.badgeType ?? BadgeType.regular}\n .badgeSize=${tab.badgeSize ?? BadgeSize.regular}\n .badgeShowNumber=${tab.badgeShowNumber ?? true}\n .showLeadingBadgeIcon=${tab.showLeadingBadgeIcon \|\| false}\n @tab-click=${(e: Event) => this.handleTabClick(e, tab.id)}\n @tab-close=${(e: Event) => this.handleTabClose(e, tab.id)}\n >\n ${tab.hasLeadingIcon !== false\n ? html`\n <slot name=\"tab-${tab.id}-icon\" slot=\"leading-icon\">\n <obi-placeholder></obi-placeholder>\n </slot>\n `\n : ''}\n <span slot=\"title\">${tab.title}</span>\n ${badgeIconSlots.map(\n (slotName) => html`\n <slot name=\"tab-${tab.id}-${slotName}\" slot=${slotName}>\n <obi-placeholder></obi-placeholder>\n </slot>\n `\n )}\n </obc-tab-item>\n `;\n }\n\n override render() {\n return html`\n <div class=\"wrapper\" role=\"tablist\">\n ${repeat(\n this.tabs,\n (t) => t.id,\n (t, i) => this.renderTab(t, i)\n )}\n ${this.hasAddNewTab\n ? html`\n <obc-icon-button\n class=\"add-new-tab\"\n variant=\"flat\"\n @click=${this.handleAddNewTab}\n aria-label=\"Add new tab\"\n >\n <obi-up-iec></obi-up-iec>\n </obc-icon-button>\n `\n : ''}\n </div>\n `;\n }\n\n static override styles = unsafeCSS(compentStyle);\n}\n"],"names":[],"mappings":"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"}

package/dist/components/top-bar/top-bar.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"top-bar.d.ts","sourceRoot":"","sources":["../../../src/components/top-bar/top-bar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAIhD,OAAO,+BAA+B,CAAC;AACvC,OAAO,mBAAmB,CAAC;AAC3B,OAAO,uBAAuB,CAAC;AAC/B,OAAO,6BAA6B,CAAC;AACrC,OAAO,8BAA8B,CAAC;AACtC,OAAO,0BAA0B,CAAC;AAClC,OAAO,kCAAkC,CAAC;AAC1C,OAAO,uCAAuC,CAAC;AAC/C,OAAO,wCAAwC,CAAC;AAChD,OAAO,2CAA2C,CAAC;AACnD,OAAO,kCAAkC,CAAC;AAC1C,OAAO,0CAA0C,CAAC;AAClD,OAAO,0BAA0B,CAAC;AAClC,OAAO,EAEL,cAAc,EACf,MAAM,6BAA6B,CAAC;AAGrC,oBAAY,uBAAuB;IACjC,IAAI,SAAS;IACb,IAAI,SAAS;CACd;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2HG;AACH,qBACa,SAAU,SAAQ,UAAU;IACvC;;;;OAIG;IACuB,QAAQ,SAAS;IAE3C;;;;;OAKG;IACuB,QAAQ,SAAU;IAE5C,wDAAwD;IAC9B,cAAc,0BAAgC;IAExE;;;;;OAKG;IAEH,mBAAmB,UAAS;IAE5B;;;;;OAKG;IAEH,sBAAsB,UAAS;IAE/B;;;;;OAKG;IAEH,mBAAmB,UAAS;IAE5B;;;;;OAKG;IAEH,uBAAuB,UAAS;IAEhC;;;;;OAKG;IAEH,mBAAmB,UAAS;IAE5B;;;;;OAKG;IAEH,kBAAkB,UAAS;IAE3B;;;;OAIG;IACwB,IAAI,UAAS;IAExC;;;;;OAKG;IACwB,cAAc,UAAS;IAElD;;;;OAIG;IACwB,cAAc,UAAS;IAElD;;;;OAIG;IAEH,iBAAiB,UAAS;IAE1B;;;;OAIG;IACwB,cAAc,UAAS;IAElD;;;;OAIG;IACwB,SAAS,UAAS;IAE7C;;;;OAIG;IACwB,QAAQ,UAAS;IAE5C;;;;OAIG;IACwB,WAAW,UAAS;IAE/C;;;;OAIG;IACwB,QAAQ,UAAS;IAE5C;;;;OAIG;IAEH,qBAAqB,SAAO;IAE5B;;;;OAIG;IAEH,yBAAyB,SAAO;IAEhC;;;;OAIG;IAEH,oBAAoB,SAAO;IAE3B;;;;OAIG;IAEH,sBAAsB,SAAO;IAE7B;;;;OAIG;IAEH,mBAAmB,SAAO;IAE1B;;;;OAIG;IACwB,QAAQ,UAAS;IAE5C;;;;;OAKG;IAEH,eAAe,EAAE,cAAc,EAAE,CAAM;IAEvC,OAAO,CAAC,oBAAoB;IAQ5B,OAAO,CAAC,iBAAiB;IAQzB,OAAO,CAAC,qBAAqB;IAQ7B,OAAO,CAAC,iBAAiB;IAQzB,OAAO,CAAC,eAAe,CAA4B;IACnD,OAAO,CAAC,iBAAiB,CAA+B;IACxD,OAAO,CAAC,gBAAgB,CAAS;IACjC,OAAO,CAAC,qBAAqB,CAAS;IAEtC,OAAO,CAAC,cAAc;IAUtB,OAAO,CAAC,YAAY;IAgBpB,OAAO,CAAC,eAAe;IAad,MAAM;~~IAmLf~~,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,SAAS,CAAC;KAC1B;CACF"}
1	+ {"version":3,"file":"top-bar.d.ts","sourceRoot":"","sources":["../../../src/components/top-bar/top-bar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAIhD,OAAO,+BAA+B,CAAC;AACvC,OAAO,mBAAmB,CAAC;AAC3B,OAAO,uBAAuB,CAAC;AAC/B,OAAO,6BAA6B,CAAC;AACrC,OAAO,8BAA8B,CAAC;AACtC,OAAO,0BAA0B,CAAC;AAClC,OAAO,kCAAkC,CAAC;AAC1C,OAAO,uCAAuC,CAAC;AAC/C,OAAO,wCAAwC,CAAC;AAChD,OAAO,2CAA2C,CAAC;AACnD,OAAO,kCAAkC,CAAC;AAC1C,OAAO,0CAA0C,CAAC;AAClD,OAAO,0BAA0B,CAAC;AAClC,OAAO,EAEL,cAAc,EACf,MAAM,6BAA6B,CAAC;AAGrC,oBAAY,uBAAuB;IACjC,IAAI,SAAS;IACb,IAAI,SAAS;CACd;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2HG;AACH,qBACa,SAAU,SAAQ,UAAU;IACvC;;;;OAIG;IACuB,QAAQ,SAAS;IAE3C;;;;;OAKG;IACuB,QAAQ,SAAU;IAE5C,wDAAwD;IAC9B,cAAc,0BAAgC;IAExE;;;;;OAKG;IAEH,mBAAmB,UAAS;IAE5B;;;;;OAKG;IAEH,sBAAsB,UAAS;IAE/B;;;;;OAKG;IAEH,mBAAmB,UAAS;IAE5B;;;;;OAKG;IAEH,uBAAuB,UAAS;IAEhC;;;;;OAKG;IAEH,mBAAmB,UAAS;IAE5B;;;;;OAKG;IAEH,kBAAkB,UAAS;IAE3B;;;;OAIG;IACwB,IAAI,UAAS;IAExC;;;;;OAKG;IACwB,cAAc,UAAS;IAElD;;;;OAIG;IACwB,cAAc,UAAS;IAElD;;;;OAIG;IAEH,iBAAiB,UAAS;IAE1B;;;;OAIG;IACwB,cAAc,UAAS;IAElD;;;;OAIG;IACwB,SAAS,UAAS;IAE7C;;;;OAIG;IACwB,QAAQ,UAAS;IAE5C;;;;OAIG;IACwB,WAAW,UAAS;IAE/C;;;;OAIG;IACwB,QAAQ,UAAS;IAE5C;;;;OAIG;IAEH,qBAAqB,SAAO;IAE5B;;;;OAIG;IAEH,yBAAyB,SAAO;IAEhC;;;;OAIG;IAEH,oBAAoB,SAAO;IAE3B;;;;OAIG;IAEH,sBAAsB,SAAO;IAE7B;;;;OAIG;IAEH,mBAAmB,SAAO;IAE1B;;;;OAIG;IACwB,QAAQ,UAAS;IAE5C;;;;;OAKG;IAEH,eAAe,EAAE,cAAc,EAAE,CAAM;IAEvC,OAAO,CAAC,oBAAoB;IAQ5B,OAAO,CAAC,iBAAiB;IAQzB,OAAO,CAAC,qBAAqB;IAQ7B,OAAO,CAAC,iBAAiB;IAQzB,OAAO,CAAC,eAAe,CAA4B;IACnD,OAAO,CAAC,iBAAiB,CAA+B;IACxD,OAAO,CAAC,gBAAgB,CAAS;IACjC,OAAO,CAAC,qBAAqB,CAAS;IAEtC,OAAO,CAAC,cAAc;IAUtB,OAAO,CAAC,YAAY;IAgBpB,OAAO,CAAC,eAAe;IAad,MAAM;IAkLf,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,aAAa,EAAE,SAAS,CAAC;KAC1B;CACF"}

package/dist/components/top-bar/top-bar.js CHANGED Viewed

@@ -127,7 +127,6 @@ let ObcTopBar = class extends LitElement {
           </obc-icon-button>
         </div>`
       );
-      leftGroup.push(html`<div class="divider"></div>`);
       leftGroup.push(
         html`<obc-icon-button
           variant="flat"

package/dist/components/top-bar/top-bar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"top-bar.js","sources":["../../../src/components/top-bar/top-bar.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport compentStyle from './top-bar.css?inline';\nimport '../icon-button/icon-button.js';\nimport '../clock/clock.js';\nimport '../divider/divider.js';\nimport '../breadcrumb/breadcrumb.js';\nimport '../../icons/icon-menu-iec.js';\nimport '../../icons/icon-home.js';\nimport '../../icons/icon-close-google.js';\nimport '../../icons/icon-arrow-left-google.js';\nimport '../../icons/icon-arrow-right-google.js';\nimport '../../icons/icon-palette-day-night-iec.js';\nimport '../../icons/icon-applications.js';\nimport '../../icons/icon-more-vertical-google.js';\nimport '../../icons/icon-user.js';\nimport {\n BreadcrumbClickEvent,\n BreadcrumbItem,\n} from '../breadcrumb/breadcrumb.js';\nimport {customElement} from '../../decorator.js';\n\nexport enum ObcTopBarMenuButtonIcon {\n Menu = 'menu',\n Home = 'home',\n}\n\n/*\n `<obc-top-bar>` – A responsive top navigation bar component for application layouts.\n \n Provides a flexible, highly configurable top bar for application interfaces, supporting navigation, context display, quick actions, and status indicators. The top bar adapts to screen size and can show or hide elements such as menu, app icon, breadcrumbs, user/profile, clock, and alert notifications.\n \n Appears at the top of the UI, organizing primary navigation and contextual actions in a single, persistent region. Designed for use as the main app bar or header in multi-pane or dashboard-style layouts.\n \n ## Features\n * - Configurable Sections: Supports left and right-aligned groups for navigation, context, and actions.\n * - Menu Button: Optional menu button for opening navigation drawers or sidebars; can be styled as wide or regular.\n * - App Icon Slot: Customizable slot for displaying an application or brand icon.\n * - App Title & Page Name: Displays the current application and page context.\n * - Breadcrumbs: Optional breadcrumb navigation for hierarchical context (in settings mode).\n * - Command Button Slot: Slot for inserting a primary command/action button.\n * - Alert/Notification Area: Slot for alert indicators, notification badges, or custom alert components.\n * - Dimming Button: Optional button for toggling display modes (e.g., day/night).\n * - User/Profile Button: Optional user icon for profile/account actions.\n * - Apps Button: Optional button for accessing additional applications or modules.\n * - Clock & Date: Optional digital clock and date display, responsive to screen size.\n * - Responsive Layout: Multiple breakpoint properties to control visibility and layout of elements based on viewport width.\n * - Settings Mode: Special mode with close, back, and forward navigation, breadcrumbs, and app title.\n * - Tall Variant: Optional increased height for touch or accessibility needs.\n * - Inactive State: Disables interactive elements and visually de-emphasizes the bar.\n \n ## Variants\n * - Regular: Standard top bar with menu, app icon, title, page name, and action slots.\n * - Settings: Shows close, back, forward buttons, breadcrumbs, and app title for configuration or settings screens.\n * - Inactive: Visually muted and disables interaction (e.g., when the app is locked or in a modal state).\n * - Tall: Increases the height of the bar for improved touch targets.\n \n ## Usage Guidelines\n * Use `<obc-top-bar>` as the persistent header for your application, providing navigation, context, and quick access to key actions or status. Configure which elements appear via boolean properties and slots. Adjust breakpoint properties to control responsive behavior for each section.\n \n - Place navigation, branding, and context (title, breadcrumbs) on the left; actions, alerts, and status (clock, user, apps) on the right.\n * - Use the `settings` property for configuration or setup screens to enable close/back/forward navigation and breadcrumbs.\n * - Use the `inactive` property to visually disable the bar and its actions when the app is not interactive.\n * - Insert custom icons or buttons using the `app-icon` and `command-button` slots.\n * - Use the `alerts` slot to display alert indicators, notification badges, or custom alert components.\n \n TODO(designer): Clarify recommended combinations of visible elements for different app contexts (e.g., when to show both user and apps buttons, or best practices for alert placement).\n \n ## Slots\n \n \| Slot Name \| Renders When... \| Purpose \|\n * \|------------------\|---------------------------------\|----------------------------------------------------------------\|\n * \| `app-icon` \| `showAppIcon` is true \| Custom icon representing the application or brand. \|\n * \| `command-button` \| Always (if provided) \| Primary command or action button for the current context. \|\n * \| `alerts` \| Always (if provided) \| Area for alert indicators, notification badges, or alert items.\|\n * \| `clock` \| Always (if provided) \| Clock component for displaying the current time. \|\n \n ## Properties and Attributes\n * - `appTitle` (string): Sets the main application title (default: \"App\").\n * - `pageName` (string): Sets the current page or section name (default: \"Page\").\n * - `menuButtonActivated` (boolean): Highlights the menu button as active.\n * - `dimmingButtonActivated` (boolean): Highlights the dimming button as active.\n * - `appsButtonActivated` (boolean): Highlights the apps button as active.\n * - `leftMoreButtonActivated` (boolean): Highlights the left more button as active.\n * - `userButtonActivated` (boolean): Highlights the user button as active.\n * - `tall` (boolean): Increases the bar height for larger touch targets.\n * - `wideMenuButton` (boolean): Expands the menu button for wide-rail layouts.\n * - `showAppsButton` (boolean): Shows/hides the apps button.\n * - `showDimmingButton` (boolean): Shows/hides the dimming (day/night) button.\n * - `showUserButton` (boolean): Shows/hides the user/profile button.\n * - `showClock` (boolean): Shows/hides the clock.\n * - `showDate` (boolean): Shows/hides the date in the clock.\n * - `showAppIcon` (boolean): Shows/hides the app icon slot.\n * - `inactive` (boolean): Disables interaction and visually de-emphasizes the bar.\n * - `settings` (boolean): Enables settings mode (shows close, back, forward, breadcrumbs).\n * - `breadcrumbItems` (BreadcrumbItem[]): Array of breadcrumb items for navigation.\n * - Breakpoint properties (`appButtonBreakpointPx`, `dimmingButtonBreakpointPx`, `appTitleBreakpointPx`, `userButtonBreakpointPx`, `appIconBreakpointPx`): Control responsive visibility of each section.\n \n ## Events\n * - `menu-button-clicked` – Fired when the menu button is clicked.\n * - `dimming-button-clicked` – Fired when the dimming (day/night) button is clicked.\n * - `apps-button-clicked` – Fired when the apps button is clicked.\n * - `left-more-button-clicked` – Fired when the left more button is clicked.\n * - `user-button-clicked` – Fired when the user/profile button is clicked.\n * - `close` – Fired in settings mode when the close button is clicked.\n * - `back` – Fired in settings mode when the back button is clicked.\n * - `forward` – Fired in settings mode when the forward button is clicked.\n * - `emergency-brightness-start` – Fired when the menu button is held for 500ms. This should increase the brightness of the screen slowly. Used when the screen is too dark.\n * - `emergency-brightness-stop` – Fired when the menu button is released.\n \n ## Best Practices and Constraints\n * - Only show interactive elements relevant to the current context to avoid clutter.\n * - Use the `alerts` slot for transient or critical notifications; persistent alerts may require a different component.\n * - For accessibility, ensure that all interactive elements have appropriate labels and focus handling.\n * - Adjust breakpoint properties to optimize the layout for different device sizes.\n * - In settings mode, use breadcrumbs to provide clear navigation context.\n \n ## Example\n \n ```html\n * <obc-top-bar\n * appTitle=\"My App\"\n * pageName=\"Dashboard\"\n * showAppsButton\n * showDimmingButton\n * showClock\n * showUserButton\n * showAppIcon\n * >\n * <obi-placeholder slot=\"app-icon\"></obi-placeholder>\n * <obc-command-button slot=\"command-button\"></obc-command-button>\n * <obc-topbar-message-item slot=\"alerts\"></obc-topbar-message-item>\n * <obc-clock slot=\"clock\"></obc-clock>\n * </obc-top-bar>\n * ```\n \n @slot app-icon - Custom icon representing the application or brand (shown when `showAppIcon` is true)\n * @slot command-button - Primary command/action button for the current context\n * @slot alerts - Area for alert indicators, notification badges, or alert items\n * @slot clock - Clock component for displaying the current time (shown when `showClock` is true)\n * @fires menu-button-clicked - Fired when the menu button is clicked\n * @fires dimming-button-clicked - Fired when the dimming (day/night) button is clicked\n * @fires apps-button-clicked - Fired when the apps button is clicked\n * @fires left-more-button-clicked - Fired when the left more button is clicked\n * @fires user-button-clicked - Fired when the user/profile button is clicked\n * @fires close - Fired in settings mode when the close button is clicked\n * @fires back - Fired in settings mode when the back button is clicked\n * @fires emergency-brightness-start - Fired when the menu button is held for 500ms. This should increase the brightness of the screen slowly. Used when the screen is too dark.\n * @fires emergency-brightness-stop - Fired when the menu button is released.\n * @fires breadcrumb-click {BreadcrumbClickEvent} - Fired when a breadcrumb item is clicked.\n /\n@customElement('obc-top-bar')\nexport class ObcTopBar extends LitElement {\n /\n Sets the main application title displayed in the top bar.\n * @type {string}\n * @default \"App\"\n /\n @property({type: String}) appTitle = 'App';\n\n /\n Sets the current page or section name displayed in the top bar.\n * @type {string}\n * @default \"Page\"\n * @availableWhen settings==false\n /\n @property({type: String}) pageName = 'Page';\n\n /* @availableWhen settings==false && inactive==false /\n @property({type: String}) menuButtonIcon = ObcTopBarMenuButtonIcon.Menu;\n\n /\n Highlights the menu button as active.\n * @type {boolean}\n * @default false\n * @availableWhen settings==false && inactive==false\n /\n @property({type: Boolean})\n menuButtonActivated = false;\n\n /\n Highlights the dimming (day/night) button as active.\n * @type {boolean}\n * @default false\n * @availableWhen showDimmingButton==true && inactive==false\n /\n @property({type: Boolean})\n dimmingButtonActivated = false;\n\n /\n Highlights the apps button as active.\n * @type {boolean}\n * @default false\n * @availableWhen showAppsButton==true && inactive==false\n /\n @property({type: Boolean})\n appsButtonActivated = false;\n\n /\n Highlights the left more button as active.\n * @type {boolean}\n * @default false\n * @availableWhen inactive==false\n /\n @property({type: Boolean})\n leftMoreButtonActivated = false;\n\n /\n Highlights the user/profile button as active.\n * @type {boolean}\n * @default false\n * @availableWhen showUserButton==true && inactive==false\n /\n @property({type: Boolean})\n userButtonActivated = false;\n\n /\n Disables the user/profile button.\n * @type {boolean}\n * @default false\n * @availableWhen showUserButton==true && inactive==false\n /\n @property({type: Boolean})\n userButtonDisabled = false;\n\n /\n Increases the height of the top bar for larger touch targets.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean}) tall = false;\n\n /\n Expands the menu button for wide-rail layouts.\n * @type {boolean}\n * @default false\n * @availableWhen settings==false && inactive==false\n /\n @property({type: Boolean}) wideMenuButton = false;\n\n /\n Shows or hides the apps button.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean}) showAppsButton = false;\n\n /\n Shows or hides the dimming (day/night) button.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean})\n showDimmingButton = false;\n\n /\n Shows or hides the user/profile button.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean}) showUserButton = false;\n\n /\n Shows or hides the clock.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean}) showClock = false;\n\n /\n Shows or hides the date in the clock display.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean}) showDate = false;\n\n /\n Shows or hides the app icon slot.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean}) showAppIcon = false;\n\n /\n Disables interaction and visually de-emphasizes the bar.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean}) inactive = false;\n\n /\n Controls the breakpoint (in px) for showing/hiding the apps button.\n * @type {number}\n * @default 500\n /\n @property({type: Number})\n appButtonBreakpointPx = 500;\n\n /\n Controls the breakpoint (in px) for showing/hiding the dimming button.\n * @type {number}\n * @default 500\n /\n @property({type: Number})\n dimmingButtonBreakpointPx = 500;\n\n /\n Controls the breakpoint (in px) for showing/hiding the app title.\n * @type {number}\n * @default 500\n /\n @property({type: Number})\n appTitleBreakpointPx = 500;\n\n /\n Controls the breakpoint (in px) for showing/hiding the user button.\n * @type {number}\n * @default 500\n /\n @property({type: Number})\n userButtonBreakpointPx = 500;\n\n /\n Controls the breakpoint (in px) for showing/hiding the app icon.\n * @type {number}\n * @default 500\n /\n @property({type: Number})\n appIconBreakpointPx = 500;\n\n /\n Enables settings mode, displaying close, back buttons, breadcrumbs, and app title.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean}) settings = false;\n\n /\n Array of breadcrumb items for navigation (used in settings mode).\n * @type {BreadcrumbItem[]}\n * @default []\n * @availableWhen settings==true\n /\n @property({type: Array})\n breadcrumbItems: BreadcrumbItem[] = [];\n\n private dimmingButtonClicked() {\n /\n Fired when the dimming (day/night) button is clicked.\n * @event dimming-button-clicked\n /\n this.dispatchEvent(new CustomEvent('dimming-button-clicked'));\n }\n\n private appsButtonClicked() {\n /\n Fired when the apps button is clicked.\n * @event apps-button-clicked\n /\n this.dispatchEvent(new CustomEvent('apps-button-clicked'));\n }\n\n private leftMoreButtonClicked() {\n /\n Fired when the left more button is clicked.\n * @event left-more-button-clicked\n /\n this.dispatchEvent(new CustomEvent('left-more-button-clicked'));\n }\n\n private userButtonClicked() {\n /\n Fired when the user/profile button is clicked.\n * @event user-button-clicked\n /\n this.dispatchEvent(new CustomEvent('user-button-clicked'));\n }\n\n private leftButtonEvent: null \| CustomEvent = null;\n private leftButtonTimeout: null \| NodeJS.Timeout = null;\n private isLeftButtonDown = false;\n private isEmergencyBrightness = false;\n\n private leftButtonDown(event: CustomEvent) {\n this.leftButtonEvent = event;\n this.isLeftButtonDown = true;\n this.leftButtonTimeout = setTimeout(() => {\n this.leftButtonEvent = null;\n this.dispatchEvent(new CustomEvent('emergency-brightness-start'));\n this.isEmergencyBrightness = true;\n }, 500);\n }\n\n private leftButtonUp() {\n if (this.leftButtonEvent) {\n this.dispatchEvent(this.leftButtonEvent);\n this.leftButtonEvent = null;\n }\n if (this.leftButtonTimeout) {\n clearTimeout(this.leftButtonTimeout);\n this.leftButtonTimeout = null;\n }\n if (this.isEmergencyBrightness) {\n this.dispatchEvent(new CustomEvent('emergency-brightness-stop'));\n this.isEmergencyBrightness = false;\n }\n this.isLeftButtonDown = false;\n }\n\n private leftButtonLeave() {\n if (!this.isLeftButtonDown) return;\n if (this.leftButtonTimeout) {\n clearInterval(this.leftButtonTimeout);\n this.leftButtonTimeout = null;\n }\n if (this.isEmergencyBrightness) {\n this.dispatchEvent(new CustomEvent('emergency-brightness-stop'));\n this.isEmergencyBrightness = false;\n }\n this.isLeftButtonDown = false;\n }\n\n override render() {\n const leftGroup = [];\n if (this.settings) {\n leftGroup.push(\n html`<div class=\"menu-button\">\n <obc-icon-button\n variant=\"flat\"\n @pointerdown=${() => this.leftButtonDown(new CustomEvent('close'))}\n @pointerup=${() => this.leftButtonUp()}\n @pointerleave=${() => this.leftButtonLeave()}\n >\n <obi-close-google></obi-close-google>\n </obc-icon-button>\n </div>`\n );\n leftGroup.push(html`<div class=\"divider\"></div>`);\n leftGroup.push(\n html`<obc-icon-button\n variant=\"flat\"\n @click=${() => this.dispatchEvent(new CustomEvent('back'))}\n >\n <obi-arrow-left-google></obi-arrow-left-google>\n </obc-icon-button>`\n );\n leftGroup.push(html`<div class=\"title\">${this.appTitle}</div>`);\n leftGroup.push(\n html`<obc-breadcrumb\n .items=${this.breadcrumbItems}\n @breadcrumb-click=${(e: BreadcrumbClickEvent) =>\n this.dispatchEvent(\n new CustomEvent('breadcrumb-click', {\n detail: e.detail,\n }) as BreadcrumbClickEvent\n )}\n ></obc-breadcrumb>`\n );\n } else {\n if (!this.inactive) {\n leftGroup.push(\n html`<div class=\"menu-button ${this.wideMenuButton ? 'wide' : null}\">\n <obc-icon-button\n variant=\"flat\"\n @pointerdown=${() =>\n this.leftButtonDown(new CustomEvent('menu-button-clicked'))}\n @pointerup=${() => this.leftButtonUp()}\n @pointerleave=${() => this.leftButtonLeave()}\n ?activated=${this.menuButtonActivated}\n >\n ${this.menuButtonIcon === ObcTopBarMenuButtonIcon.Menu\n ? html`<obi-menu-iec></obi-menu-iec>`\n : html`<obi-home></obi-home>`}\n </obc-icon-button>\n </div>`\n );\n }\n if (this.showAppIcon) {\n leftGroup.push(\n html`<div class=\"app-icon\"><slot name=\"app-icon\"></slot></div>`\n );\n }\n leftGroup.push(html`<div class=\"title\">${this.appTitle}</div>`);\n leftGroup.push(html`<div class=\"page-name\">${this.pageName}</div>`);\n leftGroup.push(html`<slot name=\"command-button\"></slot>`);\n }\n\n const breakpointMoreButton = Math.max(\n this.appButtonBreakpointPx,\n this.dimmingButtonBreakpointPx\n );\n\n return html`\n <style>\n @media (max-width: ${breakpointMoreButton}px) {\n .left-more-button {\n display: revert !important;\n import { customElement } from '../../decorator.js';\n }\n\n .group.left > {\n margin-right: 4px;\n margin-left: 4px;\n }\n }\n\n @media (max-width: ${this.appButtonBreakpointPx}px) {\n .apps-button {\n display: none;\n }\n }\n\n @media (max-width: ${this.dimmingButtonBreakpointPx}px) {\n .dimming-button {\n display: none;\n }\n }\n\n @media (max-width: ${this.appTitleBreakpointPx}px) {\n .title {\n display: none;\n }\n }\n\n @media (max-width: ${this.userButtonBreakpointPx}px) {\n .user-button {\n display: none;\n }\n }\n\n @media (max-width: ${this.appIconBreakpointPx}px) {\n .app-icon {\n display: none;\n }\n }\n </style>\n <nav\n class=${classMap({\n wrapper: true,\n inactive: this.inactive,\n settings: this.settings,\n tall: this.tall,\n })}\n role=\"menubar\"\n >\n <div class=\"left group\">${leftGroup}</div>\n <div class=\"right group\">\n <div class=\"alert-container\">\n <slot name=\"alerts\"></slot>\n </div>\n ${this.showDimmingButton && !this.inactive\n ? html`<obc-icon-button\n class=\"dimming-button\"\n part=\"dimming-button\"\n variant=\"flat\"\n @click=${this.dimmingButtonClicked}\n ?activated=${this.dimmingButtonActivated}\n >\n <obi-palette-day-night-iec></obi-palette-day-night-iec>\n </obc-icon-button>`\n : null}\n ${this.showUserButton && !this.inactive\n ? html`<obc-icon-button\n class=\"user-button\"\n variant=\"flat\"\n part=\"user-button\"\n @click=${this.userButtonClicked}\n ?activated=${this.userButtonActivated}\n ?disabled=${this.userButtonDisabled}\n >\n <obi-user></obi-user>\n </obc-icon-button>`\n : null}\n ${this.showAppsButton && !this.inactive\n ? html`<obc-icon-button\n class=\"apps-button\"\n variant=\"flat\"\n part=\"apps-button\"\n @click=${this.appsButtonClicked}\n ?activated=${this.appsButtonActivated}\n >\n <obi-applications></obi-applications>\n </obc-icon-button>`\n : null}\n ${this.showClock ? html`<slot name=\"clock\"></slot>` : null}\n ${!this.inactive\n ? html`<obc-icon-button\n class=\"left-more-button\"\n part=\"left-more-button\"\n variant=\"flat\"\n @click=${this.leftMoreButtonClicked}\n ?activated=${this.leftMoreButtonActivated}\n >\n <obi-more-vertical-google></obi-more-vertical-google>\n </obc-icon-button>`\n : null}\n </div>\n </nav>\n `;\n }\n\n static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-top-bar': ObcTopBar;\n }\n}\n"],"names":["ObcTopBarMenuButtonIcon"],"mappings":"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"}
1	+ {"version":3,"file":"top-bar.js","sources":["../../../src/components/top-bar/top-bar.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport compentStyle from './top-bar.css?inline';\nimport '../icon-button/icon-button.js';\nimport '../clock/clock.js';\nimport '../divider/divider.js';\nimport '../breadcrumb/breadcrumb.js';\nimport '../../icons/icon-menu-iec.js';\nimport '../../icons/icon-home.js';\nimport '../../icons/icon-close-google.js';\nimport '../../icons/icon-arrow-left-google.js';\nimport '../../icons/icon-arrow-right-google.js';\nimport '../../icons/icon-palette-day-night-iec.js';\nimport '../../icons/icon-applications.js';\nimport '../../icons/icon-more-vertical-google.js';\nimport '../../icons/icon-user.js';\nimport {\n BreadcrumbClickEvent,\n BreadcrumbItem,\n} from '../breadcrumb/breadcrumb.js';\nimport {customElement} from '../../decorator.js';\n\nexport enum ObcTopBarMenuButtonIcon {\n Menu = 'menu',\n Home = 'home',\n}\n\n/*\n `<obc-top-bar>` – A responsive top navigation bar component for application layouts.\n \n Provides a flexible, highly configurable top bar for application interfaces, supporting navigation, context display, quick actions, and status indicators. The top bar adapts to screen size and can show or hide elements such as menu, app icon, breadcrumbs, user/profile, clock, and alert notifications.\n \n Appears at the top of the UI, organizing primary navigation and contextual actions in a single, persistent region. Designed for use as the main app bar or header in multi-pane or dashboard-style layouts.\n \n ## Features\n * - Configurable Sections: Supports left and right-aligned groups for navigation, context, and actions.\n * - Menu Button: Optional menu button for opening navigation drawers or sidebars; can be styled as wide or regular.\n * - App Icon Slot: Customizable slot for displaying an application or brand icon.\n * - App Title & Page Name: Displays the current application and page context.\n * - Breadcrumbs: Optional breadcrumb navigation for hierarchical context (in settings mode).\n * - Command Button Slot: Slot for inserting a primary command/action button.\n * - Alert/Notification Area: Slot for alert indicators, notification badges, or custom alert components.\n * - Dimming Button: Optional button for toggling display modes (e.g., day/night).\n * - User/Profile Button: Optional user icon for profile/account actions.\n * - Apps Button: Optional button for accessing additional applications or modules.\n * - Clock & Date: Optional digital clock and date display, responsive to screen size.\n * - Responsive Layout: Multiple breakpoint properties to control visibility and layout of elements based on viewport width.\n * - Settings Mode: Special mode with close, back, and forward navigation, breadcrumbs, and app title.\n * - Tall Variant: Optional increased height for touch or accessibility needs.\n * - Inactive State: Disables interactive elements and visually de-emphasizes the bar.\n \n ## Variants\n * - Regular: Standard top bar with menu, app icon, title, page name, and action slots.\n * - Settings: Shows close, back, forward buttons, breadcrumbs, and app title for configuration or settings screens.\n * - Inactive: Visually muted and disables interaction (e.g., when the app is locked or in a modal state).\n * - Tall: Increases the height of the bar for improved touch targets.\n \n ## Usage Guidelines\n * Use `<obc-top-bar>` as the persistent header for your application, providing navigation, context, and quick access to key actions or status. Configure which elements appear via boolean properties and slots. Adjust breakpoint properties to control responsive behavior for each section.\n \n - Place navigation, branding, and context (title, breadcrumbs) on the left; actions, alerts, and status (clock, user, apps) on the right.\n * - Use the `settings` property for configuration or setup screens to enable close/back/forward navigation and breadcrumbs.\n * - Use the `inactive` property to visually disable the bar and its actions when the app is not interactive.\n * - Insert custom icons or buttons using the `app-icon` and `command-button` slots.\n * - Use the `alerts` slot to display alert indicators, notification badges, or custom alert components.\n \n TODO(designer): Clarify recommended combinations of visible elements for different app contexts (e.g., when to show both user and apps buttons, or best practices for alert placement).\n \n ## Slots\n \n \| Slot Name \| Renders When... \| Purpose \|\n * \|------------------\|---------------------------------\|----------------------------------------------------------------\|\n * \| `app-icon` \| `showAppIcon` is true \| Custom icon representing the application or brand. \|\n * \| `command-button` \| Always (if provided) \| Primary command or action button for the current context. \|\n * \| `alerts` \| Always (if provided) \| Area for alert indicators, notification badges, or alert items.\|\n * \| `clock` \| Always (if provided) \| Clock component for displaying the current time. \|\n \n ## Properties and Attributes\n * - `appTitle` (string): Sets the main application title (default: \"App\").\n * - `pageName` (string): Sets the current page or section name (default: \"Page\").\n * - `menuButtonActivated` (boolean): Highlights the menu button as active.\n * - `dimmingButtonActivated` (boolean): Highlights the dimming button as active.\n * - `appsButtonActivated` (boolean): Highlights the apps button as active.\n * - `leftMoreButtonActivated` (boolean): Highlights the left more button as active.\n * - `userButtonActivated` (boolean): Highlights the user button as active.\n * - `tall` (boolean): Increases the bar height for larger touch targets.\n * - `wideMenuButton` (boolean): Expands the menu button for wide-rail layouts.\n * - `showAppsButton` (boolean): Shows/hides the apps button.\n * - `showDimmingButton` (boolean): Shows/hides the dimming (day/night) button.\n * - `showUserButton` (boolean): Shows/hides the user/profile button.\n * - `showClock` (boolean): Shows/hides the clock.\n * - `showDate` (boolean): Shows/hides the date in the clock.\n * - `showAppIcon` (boolean): Shows/hides the app icon slot.\n * - `inactive` (boolean): Disables interaction and visually de-emphasizes the bar.\n * - `settings` (boolean): Enables settings mode (shows close, back, forward, breadcrumbs).\n * - `breadcrumbItems` (BreadcrumbItem[]): Array of breadcrumb items for navigation.\n * - Breakpoint properties (`appButtonBreakpointPx`, `dimmingButtonBreakpointPx`, `appTitleBreakpointPx`, `userButtonBreakpointPx`, `appIconBreakpointPx`): Control responsive visibility of each section.\n \n ## Events\n * - `menu-button-clicked` – Fired when the menu button is clicked.\n * - `dimming-button-clicked` – Fired when the dimming (day/night) button is clicked.\n * - `apps-button-clicked` – Fired when the apps button is clicked.\n * - `left-more-button-clicked` – Fired when the left more button is clicked.\n * - `user-button-clicked` – Fired when the user/profile button is clicked.\n * - `close` – Fired in settings mode when the close button is clicked.\n * - `back` – Fired in settings mode when the back button is clicked.\n * - `forward` – Fired in settings mode when the forward button is clicked.\n * - `emergency-brightness-start` – Fired when the menu button is held for 500ms. This should increase the brightness of the screen slowly. Used when the screen is too dark.\n * - `emergency-brightness-stop` – Fired when the menu button is released.\n \n ## Best Practices and Constraints\n * - Only show interactive elements relevant to the current context to avoid clutter.\n * - Use the `alerts` slot for transient or critical notifications; persistent alerts may require a different component.\n * - For accessibility, ensure that all interactive elements have appropriate labels and focus handling.\n * - Adjust breakpoint properties to optimize the layout for different device sizes.\n * - In settings mode, use breadcrumbs to provide clear navigation context.\n \n ## Example\n \n ```html\n * <obc-top-bar\n * appTitle=\"My App\"\n * pageName=\"Dashboard\"\n * showAppsButton\n * showDimmingButton\n * showClock\n * showUserButton\n * showAppIcon\n * >\n * <obi-placeholder slot=\"app-icon\"></obi-placeholder>\n * <obc-command-button slot=\"command-button\"></obc-command-button>\n * <obc-topbar-message-item slot=\"alerts\"></obc-topbar-message-item>\n * <obc-clock slot=\"clock\"></obc-clock>\n * </obc-top-bar>\n * ```\n \n @slot app-icon - Custom icon representing the application or brand (shown when `showAppIcon` is true)\n * @slot command-button - Primary command/action button for the current context\n * @slot alerts - Area for alert indicators, notification badges, or alert items\n * @slot clock - Clock component for displaying the current time (shown when `showClock` is true)\n * @fires menu-button-clicked - Fired when the menu button is clicked\n * @fires dimming-button-clicked - Fired when the dimming (day/night) button is clicked\n * @fires apps-button-clicked - Fired when the apps button is clicked\n * @fires left-more-button-clicked - Fired when the left more button is clicked\n * @fires user-button-clicked - Fired when the user/profile button is clicked\n * @fires close - Fired in settings mode when the close button is clicked\n * @fires back - Fired in settings mode when the back button is clicked\n * @fires emergency-brightness-start - Fired when the menu button is held for 500ms. This should increase the brightness of the screen slowly. Used when the screen is too dark.\n * @fires emergency-brightness-stop - Fired when the menu button is released.\n * @fires breadcrumb-click {BreadcrumbClickEvent} - Fired when a breadcrumb item is clicked.\n /\n@customElement('obc-top-bar')\nexport class ObcTopBar extends LitElement {\n /\n Sets the main application title displayed in the top bar.\n * @type {string}\n * @default \"App\"\n /\n @property({type: String}) appTitle = 'App';\n\n /\n Sets the current page or section name displayed in the top bar.\n * @type {string}\n * @default \"Page\"\n * @availableWhen settings==false\n /\n @property({type: String}) pageName = 'Page';\n\n /* @availableWhen settings==false && inactive==false /\n @property({type: String}) menuButtonIcon = ObcTopBarMenuButtonIcon.Menu;\n\n /\n Highlights the menu button as active.\n * @type {boolean}\n * @default false\n * @availableWhen settings==false && inactive==false\n /\n @property({type: Boolean})\n menuButtonActivated = false;\n\n /\n Highlights the dimming (day/night) button as active.\n * @type {boolean}\n * @default false\n * @availableWhen showDimmingButton==true && inactive==false\n /\n @property({type: Boolean})\n dimmingButtonActivated = false;\n\n /\n Highlights the apps button as active.\n * @type {boolean}\n * @default false\n * @availableWhen showAppsButton==true && inactive==false\n /\n @property({type: Boolean})\n appsButtonActivated = false;\n\n /\n Highlights the left more button as active.\n * @type {boolean}\n * @default false\n * @availableWhen inactive==false\n /\n @property({type: Boolean})\n leftMoreButtonActivated = false;\n\n /\n Highlights the user/profile button as active.\n * @type {boolean}\n * @default false\n * @availableWhen showUserButton==true && inactive==false\n /\n @property({type: Boolean})\n userButtonActivated = false;\n\n /\n Disables the user/profile button.\n * @type {boolean}\n * @default false\n * @availableWhen showUserButton==true && inactive==false\n /\n @property({type: Boolean})\n userButtonDisabled = false;\n\n /\n Increases the height of the top bar for larger touch targets.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean}) tall = false;\n\n /\n Expands the menu button for wide-rail layouts.\n * @type {boolean}\n * @default false\n * @availableWhen settings==false && inactive==false\n /\n @property({type: Boolean}) wideMenuButton = false;\n\n /\n Shows or hides the apps button.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean}) showAppsButton = false;\n\n /\n Shows or hides the dimming (day/night) button.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean})\n showDimmingButton = false;\n\n /\n Shows or hides the user/profile button.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean}) showUserButton = false;\n\n /\n Shows or hides the clock.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean}) showClock = false;\n\n /\n Shows or hides the date in the clock display.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean}) showDate = false;\n\n /\n Shows or hides the app icon slot.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean}) showAppIcon = false;\n\n /\n Disables interaction and visually de-emphasizes the bar.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean}) inactive = false;\n\n /\n Controls the breakpoint (in px) for showing/hiding the apps button.\n * @type {number}\n * @default 500\n /\n @property({type: Number})\n appButtonBreakpointPx = 500;\n\n /\n Controls the breakpoint (in px) for showing/hiding the dimming button.\n * @type {number}\n * @default 500\n /\n @property({type: Number})\n dimmingButtonBreakpointPx = 500;\n\n /\n Controls the breakpoint (in px) for showing/hiding the app title.\n * @type {number}\n * @default 500\n /\n @property({type: Number})\n appTitleBreakpointPx = 500;\n\n /\n Controls the breakpoint (in px) for showing/hiding the user button.\n * @type {number}\n * @default 500\n /\n @property({type: Number})\n userButtonBreakpointPx = 500;\n\n /\n Controls the breakpoint (in px) for showing/hiding the app icon.\n * @type {number}\n * @default 500\n /\n @property({type: Number})\n appIconBreakpointPx = 500;\n\n /\n Enables settings mode, displaying close, back buttons, breadcrumbs, and app title.\n * @type {boolean}\n * @default false\n /\n @property({type: Boolean}) settings = false;\n\n /\n Array of breadcrumb items for navigation (used in settings mode).\n * @type {BreadcrumbItem[]}\n * @default []\n * @availableWhen settings==true\n /\n @property({type: Array})\n breadcrumbItems: BreadcrumbItem[] = [];\n\n private dimmingButtonClicked() {\n /\n Fired when the dimming (day/night) button is clicked.\n * @event dimming-button-clicked\n /\n this.dispatchEvent(new CustomEvent('dimming-button-clicked'));\n }\n\n private appsButtonClicked() {\n /\n Fired when the apps button is clicked.\n * @event apps-button-clicked\n /\n this.dispatchEvent(new CustomEvent('apps-button-clicked'));\n }\n\n private leftMoreButtonClicked() {\n /\n Fired when the left more button is clicked.\n * @event left-more-button-clicked\n /\n this.dispatchEvent(new CustomEvent('left-more-button-clicked'));\n }\n\n private userButtonClicked() {\n /\n Fired when the user/profile button is clicked.\n * @event user-button-clicked\n /\n this.dispatchEvent(new CustomEvent('user-button-clicked'));\n }\n\n private leftButtonEvent: null \| CustomEvent = null;\n private leftButtonTimeout: null \| NodeJS.Timeout = null;\n private isLeftButtonDown = false;\n private isEmergencyBrightness = false;\n\n private leftButtonDown(event: CustomEvent) {\n this.leftButtonEvent = event;\n this.isLeftButtonDown = true;\n this.leftButtonTimeout = setTimeout(() => {\n this.leftButtonEvent = null;\n this.dispatchEvent(new CustomEvent('emergency-brightness-start'));\n this.isEmergencyBrightness = true;\n }, 500);\n }\n\n private leftButtonUp() {\n if (this.leftButtonEvent) {\n this.dispatchEvent(this.leftButtonEvent);\n this.leftButtonEvent = null;\n }\n if (this.leftButtonTimeout) {\n clearTimeout(this.leftButtonTimeout);\n this.leftButtonTimeout = null;\n }\n if (this.isEmergencyBrightness) {\n this.dispatchEvent(new CustomEvent('emergency-brightness-stop'));\n this.isEmergencyBrightness = false;\n }\n this.isLeftButtonDown = false;\n }\n\n private leftButtonLeave() {\n if (!this.isLeftButtonDown) return;\n if (this.leftButtonTimeout) {\n clearInterval(this.leftButtonTimeout);\n this.leftButtonTimeout = null;\n }\n if (this.isEmergencyBrightness) {\n this.dispatchEvent(new CustomEvent('emergency-brightness-stop'));\n this.isEmergencyBrightness = false;\n }\n this.isLeftButtonDown = false;\n }\n\n override render() {\n const leftGroup = [];\n if (this.settings) {\n leftGroup.push(\n html`<div class=\"menu-button\">\n <obc-icon-button\n variant=\"flat\"\n @pointerdown=${() => this.leftButtonDown(new CustomEvent('close'))}\n @pointerup=${() => this.leftButtonUp()}\n @pointerleave=${() => this.leftButtonLeave()}\n >\n <obi-close-google></obi-close-google>\n </obc-icon-button>\n </div>`\n );\n leftGroup.push(\n html`<obc-icon-button\n variant=\"flat\"\n @click=${() => this.dispatchEvent(new CustomEvent('back'))}\n >\n <obi-arrow-left-google></obi-arrow-left-google>\n </obc-icon-button>`\n );\n leftGroup.push(html`<div class=\"title\">${this.appTitle}</div>`);\n leftGroup.push(\n html`<obc-breadcrumb\n .items=${this.breadcrumbItems}\n @breadcrumb-click=${(e: BreadcrumbClickEvent) =>\n this.dispatchEvent(\n new CustomEvent('breadcrumb-click', {\n detail: e.detail,\n }) as BreadcrumbClickEvent\n )}\n ></obc-breadcrumb>`\n );\n } else {\n if (!this.inactive) {\n leftGroup.push(\n html`<div class=\"menu-button ${this.wideMenuButton ? 'wide' : null}\">\n <obc-icon-button\n variant=\"flat\"\n @pointerdown=${() =>\n this.leftButtonDown(new CustomEvent('menu-button-clicked'))}\n @pointerup=${() => this.leftButtonUp()}\n @pointerleave=${() => this.leftButtonLeave()}\n ?activated=${this.menuButtonActivated}\n >\n ${this.menuButtonIcon === ObcTopBarMenuButtonIcon.Menu\n ? html`<obi-menu-iec></obi-menu-iec>`\n : html`<obi-home></obi-home>`}\n </obc-icon-button>\n </div>`\n );\n }\n if (this.showAppIcon) {\n leftGroup.push(\n html`<div class=\"app-icon\"><slot name=\"app-icon\"></slot></div>`\n );\n }\n leftGroup.push(html`<div class=\"title\">${this.appTitle}</div>`);\n leftGroup.push(html`<div class=\"page-name\">${this.pageName}</div>`);\n leftGroup.push(html`<slot name=\"command-button\"></slot>`);\n }\n\n const breakpointMoreButton = Math.max(\n this.appButtonBreakpointPx,\n this.dimmingButtonBreakpointPx\n );\n\n return html`\n <style>\n @media (max-width: ${breakpointMoreButton}px) {\n .left-more-button {\n display: revert !important;\n import { customElement } from '../../decorator.js';\n }\n\n .group.left > {\n margin-right: 4px;\n margin-left: 4px;\n }\n }\n\n @media (max-width: ${this.appButtonBreakpointPx}px) {\n .apps-button {\n display: none;\n }\n }\n\n @media (max-width: ${this.dimmingButtonBreakpointPx}px) {\n .dimming-button {\n display: none;\n }\n }\n\n @media (max-width: ${this.appTitleBreakpointPx}px) {\n .title {\n display: none;\n }\n }\n\n @media (max-width: ${this.userButtonBreakpointPx}px) {\n .user-button {\n display: none;\n }\n }\n\n @media (max-width: ${this.appIconBreakpointPx}px) {\n .app-icon {\n display: none;\n }\n }\n </style>\n <nav\n class=${classMap({\n wrapper: true,\n inactive: this.inactive,\n settings: this.settings,\n tall: this.tall,\n })}\n role=\"menubar\"\n >\n <div class=\"left group\">${leftGroup}</div>\n <div class=\"right group\">\n <div class=\"alert-container\">\n <slot name=\"alerts\"></slot>\n </div>\n ${this.showDimmingButton && !this.inactive\n ? html`<obc-icon-button\n class=\"dimming-button\"\n part=\"dimming-button\"\n variant=\"flat\"\n @click=${this.dimmingButtonClicked}\n ?activated=${this.dimmingButtonActivated}\n >\n <obi-palette-day-night-iec></obi-palette-day-night-iec>\n </obc-icon-button>`\n : null}\n ${this.showUserButton && !this.inactive\n ? html`<obc-icon-button\n class=\"user-button\"\n variant=\"flat\"\n part=\"user-button\"\n @click=${this.userButtonClicked}\n ?activated=${this.userButtonActivated}\n ?disabled=${this.userButtonDisabled}\n >\n <obi-user></obi-user>\n </obc-icon-button>`\n : null}\n ${this.showAppsButton && !this.inactive\n ? html`<obc-icon-button\n class=\"apps-button\"\n variant=\"flat\"\n part=\"apps-button\"\n @click=${this.appsButtonClicked}\n ?activated=${this.appsButtonActivated}\n >\n <obi-applications></obi-applications>\n </obc-icon-button>`\n : null}\n ${this.showClock ? html`<slot name=\"clock\"></slot>` : null}\n ${!this.inactive\n ? html`<obc-icon-button\n class=\"left-more-button\"\n part=\"left-more-button\"\n variant=\"flat\"\n @click=${this.leftMoreButtonClicked}\n ?activated=${this.leftMoreButtonActivated}\n >\n <obi-more-vertical-google></obi-more-vertical-google>\n </obc-icon-button>`\n : null}\n </div>\n </nav>\n `;\n }\n\n static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-top-bar': ObcTopBar;\n }\n}\n"],"names":["ObcTopBarMenuButtonIcon"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuBO,IAAK,4CAAAA,6BAAL;AACLA,2BAAA,MAAA,IAAO;AACPA,2BAAA,MAAA,IAAO;AAFG,SAAAA;AAAA,GAAA,2BAAA,CAAA,CAAA;AAkIL,IAAM,YAAN,cAAwB,WAAW;AAAA,EAAnC,cAAA;AAAA,UAAA,GAAA,SAAA;AAMqB,SAAA,WAAW;AAQX,SAAA,WAAW;AAGX,SAAA,iBAAiB;AAS3C,SAAA,sBAAsB;AAStB,SAAA,yBAAyB;AASzB,SAAA,sBAAsB;AAStB,SAAA,0BAA0B;AAS1B,SAAA,sBAAsB;AAStB,SAAA,qBAAqB;AAOM,SAAA,OAAO;AAQP,SAAA,iBAAiB;AAOjB,SAAA,iBAAiB;AAQ5C,SAAA,oBAAoB;AAOO,SAAA,iBAAiB;AAOjB,SAAA,YAAY;AAOZ,SAAA,WAAW;AAOX,SAAA,cAAc;AAOd,SAAA,WAAW;AAQtC,SAAA,wBAAwB;AAQxB,SAAA,4BAA4B;AAQ5B,SAAA,uBAAuB;AAQvB,SAAA,yBAAyB;AAQzB,SAAA,sBAAsB;AAOK,SAAA,WAAW;AAStC,SAAA,kBAAoC,CAAA;AAkCpC,SAAQ,kBAAsC;AAC9C,SAAQ,oBAA2C;AACnD,SAAQ,mBAAmB;AAC3B,SAAQ,wBAAwB;AAAA,EAAA;AAAA,EAnCxB,uBAAuB;AAK7B,SAAK,cAAc,IAAI,YAAY,wBAAwB,CAAC;AAAA,EAC9D;AAAA,EAEQ,oBAAoB;AAK1B,SAAK,cAAc,IAAI,YAAY,qBAAqB,CAAC;AAAA,EAC3D;AAAA,EAEQ,wBAAwB;AAK9B,SAAK,cAAc,IAAI,YAAY,0BAA0B,CAAC;AAAA,EAChE;AAAA,EAEQ,oBAAoB;AAK1B,SAAK,cAAc,IAAI,YAAY,qBAAqB,CAAC;AAAA,EAC3D;AAAA,EAOQ,eAAe,OAAoB;AACzC,SAAK,kBAAkB;AACvB,SAAK,mBAAmB;AACxB,SAAK,oBAAoB,WAAW,MAAM;AACxC,WAAK,kBAAkB;AACvB,WAAK,cAAc,IAAI,YAAY,4BAA4B,CAAC;AAChE,WAAK,wBAAwB;AAAA,IAC/B,GAAG,GAAG;AAAA,EACR;AAAA,EAEQ,eAAe;AACrB,QAAI,KAAK,iBAAiB;AACxB,WAAK,cAAc,KAAK,eAAe;AACvC,WAAK,kBAAkB;AAAA,IACzB;AACA,QAAI,KAAK,mBAAmB;AAC1B,mBAAa,KAAK,iBAAiB;AACnC,WAAK,oBAAoB;AAAA,IAC3B;AACA,QAAI,KAAK,uBAAuB;AAC9B,WAAK,cAAc,IAAI,YAAY,2BAA2B,CAAC;AAC/D,WAAK,wBAAwB;AAAA,IAC/B;AACA,SAAK,mBAAmB;AAAA,EAC1B;AAAA,EAEQ,kBAAkB;AACxB,QAAI,CAAC,KAAK,iBAAkB;AAC5B,QAAI,KAAK,mBAAmB;AAC1B,oBAAc,KAAK,iBAAiB;AACpC,WAAK,oBAAoB;AAAA,IAC3B;AACA,QAAI,KAAK,uBAAuB;AAC9B,WAAK,cAAc,IAAI,YAAY,2BAA2B,CAAC;AAC/D,WAAK,wBAAwB;AAAA,IAC/B;AACA,SAAK,mBAAmB;AAAA,EAC1B;AAAA,EAES,SAAS;AAChB,UAAM,YAAY,CAAA;AAClB,QAAI,KAAK,UAAU;AACjB,gBAAU;AAAA,QACR;AAAA;AAAA;AAAA,2BAGmB,MAAM,KAAK,eAAe,IAAI,YAAY,OAAO,CAAC,CAAC;AAAA,yBACrD,MAAM,KAAK,aAAA,CAAc;AAAA,4BACtB,MAAM,KAAK,gBAAA,CAAiB;AAAA;AAAA;AAAA;AAAA;AAAA,MAAA;AAMlD,gBAAU;AAAA,QACR;AAAA;AAAA,mBAEW,MAAM,KAAK,cAAc,IAAI,YAAY,MAAM,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA,MAAA;AAK9D,gBAAU,KAAK,0BAA0B,KAAK,QAAQ,QAAQ;AAC9D,gBAAU;AAAA,QACR;AAAA,mBACW,KAAK,eAAe;AAAA,8BACT,CAAC,MACnB,KAAK;AAAA,UACH,IAAI,YAAY,oBAAoB;AAAA,YAClC,QAAQ,EAAE;AAAA,UAAA,CACX;AAAA,QAAA,CACF;AAAA;AAAA,MAAA;AAAA,IAGT,OAAO;AACL,UAAI,CAAC,KAAK,UAAU;AAClB,kBAAU;AAAA,UACR,+BAA+B,KAAK,iBAAiB,SAAS,IAAI;AAAA;AAAA;AAAA,6BAG/C,MACb,KAAK,eAAe,IAAI,YAAY,qBAAqB,CAAC,CAAC;AAAA,2BAChD,MAAM,KAAK,aAAA,CAAc;AAAA,8BACtB,MAAM,KAAK,gBAAA,CAAiB;AAAA,2BAC/B,KAAK,mBAAmB;AAAA;AAAA,gBAEnC,KAAK,mBAAmB,SACtB,sCACA,2BAA2B;AAAA;AAAA;AAAA,QAAA;AAAA,MAIvC;AACA,UAAI,KAAK,aAAa;AACpB,kBAAU;AAAA,UACR;AAAA,QAAA;AAAA,MAEJ;AACA,gBAAU,KAAK,0BAA0B,KAAK,QAAQ,QAAQ;AAC9D,gBAAU,KAAK,8BAA8B,KAAK,QAAQ,QAAQ;AAClE,gBAAU,KAAK,yCAAyC;AAAA,IAC1D;AAEA,UAAM,uBAAuB,KAAK;AAAA,MAChC,KAAK;AAAA,MACL,KAAK;AAAA,IAAA;AAGP,WAAO;AAAA;AAAA,qCAE0B,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qCAYpB,KAAK,qBAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qCAM1B,KAAK,yBAAyB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qCAM9B,KAAK,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qCAMzB,KAAK,sBAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qCAM3B,KAAK,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAO7C,SAAS;AAAA,MACf,SAAS;AAAA,MACT,UAAU,KAAK;AAAA,MACf,UAAU,KAAK;AAAA,MACf,MAAM,KAAK;AAAA,IAAA,CACZ,CAAC;AAAA;AAAA;AAAA,kCAGwB,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA,YAK/B,KAAK,qBAAqB,CAAC,KAAK,WAC9B;AAAA;AAAA;AAAA;AAAA,yBAIW,KAAK,oBAAoB;AAAA,6BACrB,KAAK,sBAAsB;AAAA;AAAA;AAAA,oCAI1C,IAAI;AAAA,YACN,KAAK,kBAAkB,CAAC,KAAK,WAC3B;AAAA;AAAA;AAAA;AAAA,yBAIW,KAAK,iBAAiB;AAAA,6BAClB,KAAK,mBAAmB;AAAA,4BACzB,KAAK,kBAAkB;AAAA;AAAA;AAAA,oCAIrC,IAAI;AAAA,YACN,KAAK,kBAAkB,CAAC,KAAK,WAC3B;AAAA;AAAA;AAAA;AAAA,yBAIW,KAAK,iBAAiB;AAAA,6BAClB,KAAK,mBAAmB;AAAA;AAAA;AAAA,oCAIvC,IAAI;AAAA,YACN,KAAK,YAAY,mCAAmC,IAAI;AAAA,YACxD,CAAC,KAAK,WACJ;AAAA;AAAA;AAAA;AAAA,yBAIW,KAAK,qBAAqB;AAAA,6BACtB,KAAK,uBAAuB;AAAA;AAAA;AAAA,oCAI3C,IAAI;AAAA;AAAA;AAAA;AAAA,EAIhB;AAGF;AAjca,UAgcK,SAAS,UAAU,YAAY;AA1brB,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GANb,UAMe,WAAA,YAAA,CAAA;AAQA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GAdb,UAce,WAAA,YAAA,CAAA;AAGA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GAjBb,UAiBe,WAAA,kBAAA,CAAA;AAS1B,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAzBd,UA0BX,WAAA,uBAAA,CAAA;AASA,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAlCd,UAmCX,WAAA,0BAAA,CAAA;AASA,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GA3Cd,UA4CX,WAAA,uBAAA,CAAA;AASA,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GApDd,UAqDX,WAAA,2BAAA,CAAA;AASA,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GA7Dd,UA8DX,WAAA,uBAAA,CAAA;AASA,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAtEd,UAuEX,WAAA,sBAAA,CAAA;AAO2B,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GA9Ed,UA8EgB,WAAA,QAAA,CAAA;AAQA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAtFd,UAsFgB,WAAA,kBAAA,CAAA;AAOA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GA7Fd,UA6FgB,WAAA,kBAAA,CAAA;AAQ3B,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GApGd,UAqGX,WAAA,qBAAA,CAAA;AAO2B,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GA5Gd,UA4GgB,WAAA,kBAAA,CAAA;AAOA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAnHd,UAmHgB,WAAA,aAAA,CAAA;AAOA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GA1Hd,UA0HgB,WAAA,YAAA,CAAA;AAOA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAjId,UAiIgB,WAAA,eAAA,CAAA;AAOA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAxId,UAwIgB,WAAA,YAAA,CAAA;AAQ3B,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GA/Ib,UAgJX,WAAA,yBAAA,CAAA;AAQA,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GAvJb,UAwJX,WAAA,6BAAA,CAAA;AAQA,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GA/Jb,UAgKX,WAAA,wBAAA,CAAA;AAQA,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GAvKb,UAwKX,WAAA,0BAAA,CAAA;AAQA,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GA/Kb,UAgLX,WAAA,uBAAA,CAAA;AAO2B,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAvLd,UAuLgB,WAAA,YAAA,CAAA;AAS3B,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,MAAA,CAAM;AAAA,GA/LZ,UAgMX,WAAA,mBAAA,CAAA;AAhMW,YAAN,gBAAA;AAAA,EADN,cAAc,aAAa;AAAA,GACf,SAAA;"}

package/package.json CHANGED Viewed

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