@oicl/openbridge-webcomponents 2.0.0-next.117 → 2.0.0-next.119

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 (88) hide show
  1. package/bundle/openbridge-webcomponents.bundle.js +37 -33
  2. package/bundle/openbridge-webcomponents.bundle.js.map +1 -1
  3. package/custom-elements.json +30 -24
  4. package/dist/ar/poi/poi-base.d.ts +6 -0
  5. package/dist/ar/poi/poi-base.d.ts.map +1 -1
  6. package/dist/ar/poi/poi-base.js.map +1 -1
  7. package/dist/ar/poi-button/poi-button.d.ts +2 -2
  8. package/dist/ar/poi-button/poi-button.js.map +1 -1
  9. package/dist/automation/vertical-line/vertical-line.d.ts +6 -0
  10. package/dist/automation/vertical-line/vertical-line.d.ts.map +1 -1
  11. package/dist/automation/vertical-line/vertical-line.js.map +1 -1
  12. package/dist/components/accordion-card/accordion-card.d.ts.map +1 -1
  13. package/dist/components/accordion-card/accordion-card.js.map +1 -1
  14. package/dist/components/advice-message-item/advice-message-item.d.ts +4 -2
  15. package/dist/components/advice-message-item/advice-message-item.d.ts.map +1 -1
  16. package/dist/components/advice-message-item/advice-message-item.js +4 -2
  17. package/dist/components/advice-message-item/advice-message-item.js.map +1 -1
  18. package/dist/components/app-menu/app-menu.d.ts +1 -1
  19. package/dist/components/app-menu/app-menu.js +1 -1
  20. package/dist/components/app-menu/app-menu.js.map +1 -1
  21. package/dist/components/brilliance-menu/brilliance-menu.d.ts +8 -4
  22. package/dist/components/brilliance-menu/brilliance-menu.d.ts.map +1 -1
  23. package/dist/components/brilliance-menu/brilliance-menu.js +8 -4
  24. package/dist/components/brilliance-menu/brilliance-menu.js.map +1 -1
  25. package/dist/components/check-button/check-button.js.map +1 -1
  26. package/dist/components/checkbox/checkbox.d.ts +2 -2
  27. package/dist/components/checkbox/checkbox.js.map +1 -1
  28. package/dist/components/command-menu/command-menu.d.ts +1 -1
  29. package/dist/components/command-menu/command-menu.js +1 -1
  30. package/dist/components/command-menu/command-menu.js.map +1 -1
  31. package/dist/components/dropdown-button/dropdown-button.d.ts +2 -2
  32. package/dist/components/dropdown-button/dropdown-button.js +2 -2
  33. package/dist/components/dropdown-button/dropdown-button.js.map +1 -1
  34. package/dist/components/menu-button/menu-button.d.ts.map +1 -1
  35. package/dist/components/menu-button/menu-button.js.map +1 -1
  36. package/dist/components/navigation-item/navigation-item.d.ts +1 -5
  37. package/dist/components/navigation-item/navigation-item.d.ts.map +1 -1
  38. package/dist/components/navigation-item/navigation-item.js +0 -8
  39. package/dist/components/navigation-item/navigation-item.js.map +1 -1
  40. package/dist/components/navigation-item-group/navigation-item-group.d.ts +2 -1
  41. package/dist/components/navigation-item-group/navigation-item-group.d.ts.map +1 -1
  42. package/dist/components/navigation-item-group/navigation-item-group.js +2 -1
  43. package/dist/components/navigation-item-group/navigation-item-group.js.map +1 -1
  44. package/dist/components/notification-button/notification-button.d.ts +1 -1
  45. package/dist/components/notification-button/notification-button.js +1 -1
  46. package/dist/components/notification-button/notification-button.js.map +1 -1
  47. package/dist/components/notification-message-item/notification-message-item.d.ts +4 -2
  48. package/dist/components/notification-message-item/notification-message-item.d.ts.map +1 -1
  49. package/dist/components/notification-message-item/notification-message-item.js +4 -2
  50. package/dist/components/notification-message-item/notification-message-item.js.map +1 -1
  51. package/dist/components/pivot-item/pivot-item.d.ts +1 -1
  52. package/dist/components/pivot-item/pivot-item.js +1 -1
  53. package/dist/components/pivot-item/pivot-item.js.map +1 -1
  54. package/dist/components/pivot-item-group/pivot-item-group.d.ts +1 -0
  55. package/dist/components/pivot-item-group/pivot-item-group.d.ts.map +1 -1
  56. package/dist/components/pivot-item-group/pivot-item-group.js.map +1 -1
  57. package/dist/components/slide-button/slide-button.d.ts.map +1 -1
  58. package/dist/components/slide-button/slide-button.js.map +1 -1
  59. package/dist/components/slider/slider.d.ts +2 -2
  60. package/dist/components/slider/slider.js +2 -2
  61. package/dist/components/slider/slider.js.map +1 -1
  62. package/dist/components/slider-double/slider-double.d.ts +2 -2
  63. package/dist/components/slider-double/slider-double.js +2 -2
  64. package/dist/components/slider-double/slider-double.js.map +1 -1
  65. package/dist/components/stepper-box/stepper-box.d.ts +4 -2
  66. package/dist/components/stepper-box/stepper-box.d.ts.map +1 -1
  67. package/dist/components/stepper-box/stepper-box.js +4 -2
  68. package/dist/components/stepper-box/stepper-box.js.map +1 -1
  69. package/dist/components/system-button/system-button.d.ts +1 -1
  70. package/dist/components/system-button/system-button.js +1 -1
  71. package/dist/components/system-button/system-button.js.map +1 -1
  72. package/dist/components/tabbed-card/tabbed-card.d.ts.map +1 -1
  73. package/dist/components/tabbed-card/tabbed-card.js.map +1 -1
  74. package/dist/components/toggle-button-option/toggle-button-option.d.ts +2 -1
  75. package/dist/components/toggle-button-option/toggle-button-option.d.ts.map +1 -1
  76. package/dist/components/toggle-button-option/toggle-button-option.js +2 -1
  77. package/dist/components/toggle-button-option/toggle-button-option.js.map +1 -1
  78. package/dist/components/toggle-button-vertical-group/toggle-button-vertical-group.js.map +1 -1
  79. package/dist/components/toggle-switch/toggle-switch.d.ts +1 -1
  80. package/dist/components/toggle-switch/toggle-switch.js +1 -1
  81. package/dist/components/toggle-switch/toggle-switch.js.map +1 -1
  82. package/dist/components/top-bar/top-bar.d.ts.map +1 -1
  83. package/dist/components/top-bar/top-bar.js.map +1 -1
  84. package/dist/components/topbar-message-item/topbar-message-item.js.map +1 -1
  85. package/dist/integration-systems/integration-dropdown-button/integration-dropdown-button.d.ts +1 -1
  86. package/dist/integration-systems/integration-dropdown-button/integration-dropdown-button.js +1 -1
  87. package/dist/integration-systems/integration-dropdown-button/integration-dropdown-button.js.map +1 -1
  88. package/package.json +3 -1
@@ -1 +1 @@
1
- {"version":3,"file":"accordion-card.js","sources":["../../../src/components/accordion-card/accordion-card.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {customElement} from '../../decorator.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport compentStyle from './accordion-card.css?inline';\nimport {property} from 'lit/decorators.js';\nimport '../../icons/icon-chevron-up-google.js';\nimport '../../icons/icon-chevron-down-google.js';\nimport '../alert-frame/alert-frame.js';\nimport {\n ObcAlertFrameThickness,\n ObcAlertFrameType,\n} from '../alert-frame/alert-frame.js';\nimport {AlertType} from '../../types.js';\n\nexport enum AccordionSize {\n SingleLine = 'single-line',\n Large = 'large',\n}\n\nexport enum Position {\n top = 'top',\n bottom = 'bottom',\n center = 'center',\n regular = 'regular',\n}\n\n/**\n * `<obc-accordion-card>` – Expandable/collapsible card component for grouping content in a compact, interactive section (accordion, expandable panel, disclosure).\n *\n * Provides a summary row with optional icon, title, description, and status label. Expands to reveal additional content on click/tap, supporting both single-line and large layouts. Can display an alert overlay for contextual warnings or notifications.\n *\n * ### Features\n * - **Expandable/collapsible:** Click/tap toggles between collapsed and expanded states, revealing or hiding additional content.\n * - **Variants:**\n * - **Single-line:** Compact header with only title (and optional icon/status).\n * - **Large:** Header includes a description beneath the title for more detail.\n * - **Positioning:** Supports `top`, `bottom`, `center`, or `regular` (default) border radius/edge styling for stacking multiple accordions.\n * - **Status label:** Optional status text displayed in the header (e.g., \"Active\", \"Warning\").\n * - **Leading icon:** Optional icon slot at the start of the header for visual context.\n * - **Alert overlay:** Can display an alert frame (with icon, label, timer) above the card for warnings or notifications.\n * - **Disabled state:** Prevents interaction and visually indicates non-interactive status.\n * - **Accessibility:** Uses button semantics and ARIA attributes for expand/collapse.\n *\n * ### Usage Guidelines\n * Use `obc-accordion-card` to organize related content in a collapsible section, especially when space is limited or when users may want to focus on one section at a time. Ideal for settings panels, grouped controls, or dashboards where expandable details are needed. Avoid using for persistent, always-visible content.\n *\n * - Use the **single-line** variant for brief titles or when space is tight.\n * - Use the **large** variant when you need to provide a short description or supporting text under the title.\n * - The **status label** is useful for showing quick state info (e.g., \"Active\", \"Error\").\n * - The **alert overlay** is intended for contextual warnings or notifications related to the card's content.\n * - For stacking multiple accordions, adjust the `position` property to control border radii and visual grouping.\n *\n * **TODO(designer):** Confirm if there are recommended limits on title/description length, and if only one accordion should be expanded at a time in a group.\n *\n * ### Slots\n * | Slot Name | Renders When... | Purpose |\n * |-------------------|------------------------|-------------------------------------------------------|\n * | leading-icon | `hasLeadingIcon` true | Icon at the start of the header (e.g., `<obi-placeholder></obi-placeholder>`). |\n * | expanded-content | Always | Content revealed when the accordion is expanded. |\n * | alert-icon | `hasAlert` true | Icon for the alert overlay (slot=\"icon\" in alert frame). |\n * | alert-label | `hasAlert` true | Label text for the alert overlay (slot=\"label\" in alert frame). |\n * | alert-timer | `hasAlert` true | Timer or duration text for the alert overlay (slot=\"timer\" in alert frame). |\n *\n * ### Properties\n * - `expanded` (boolean): Whether the card is expanded (shows additional content). Toggled by user interaction.\n * - `disabled` (boolean): Disables interaction and visually dims the card.\n * - `cardTitle` (string): Main title text shown in the header.\n * - `description` (string): Supporting description (shown only in large size and if `hasDescription` is true).\n * - `statusLabel` (string): Optional status text in the header (shown if `hasStatusLabel` is true).\n * - `hasAlert` (boolean): Shows an alert overlay above the card when true.\n * - `hasDescription` (boolean): Enables description text in large variant.\n * - `hasStatusLabel` (boolean): Enables status label in header.\n * - `hasLeadingIcon` (boolean): Enables leading icon slot in header.\n * - `size` (`AccordionSize` enum): Layout variant, either `'single-line'` (default) or `'large'`.\n * - `position` (`Position` enum): Controls border radius for stacking (`'top'`, `'bottom'`, `'center'`, `'regular'`).\n * - `alertFrameType`, `alertFrameThickness`, `alertFrameStatus`: Configure the alert overlay's appearance (see `obc-alert-frame` for details).\n *\n * ### Events\n * - `accordion-toggle` – Fired when the accordion is expanded or collapsed. Event detail includes `{ expanded, cardTitle }`.\n *\n * ### Best Practices\n * - Only use the alert overlay for important, contextual notifications related to the card's content.\n * - For accessibility, ensure the card title is descriptive and unique within a group.\n * - Avoid nesting interactive elements (like buttons) directly in the header; place them in the expanded content if needed.\n *\n * ### Example:\n * ```\n * <obc-accordion-card\n * cardTitle=\"Settings\"\n * description=\"Configure your preferences\"\n * size=\"large\"\n * hasDescription\n * expanded\n * hasLeadingIcon\n * >\n * <span slot=\"leading-icon\"><obi-placeholder></obi-placeholder></span>\n * <div slot=\"expanded-content\">\n * <!-- Additional settings controls here -->\n * </div>\n * </obc-accordion-card>\n * ```\n *\n * @slot leading-icon - Icon at the start of the header (shown when `hasLeadingIcon` is true)\n * @slot expanded-content - Content revealed when the accordion is expanded\n * @slot alert-icon - Icon for the alert overlay (used when `hasAlert` is true)\n * @slot alert-label - Label text for the alert overlay (used when `hasAlert` is true)\n * @slot alert-timer - Timer/duration text for the alert overlay (used when `hasAlert` is true)\n * @fires {CustomEvent<{expanded: boolean, cardTitle: string}>} accordion-toggle - Fired when the accordion is expanded or collapsed\n * @stable\n */\n@customElement('obc-accordion-card')\nexport class ObcAccordionCard extends LitElement {\n /**\n * Main title text displayed in the accordion header.\n */\n @property({type: String}) cardTitle = '';\n\n /**\n * Supporting description text shown under the title (only in large size and if `hasDescription` is true).\n * @availableWhen size==large && hasDescription==true\n */\n @property({type: String}) description = '';\n\n /**\n * Optional status label displayed in the header (shown if `hasStatusLabel` is true).\n * @availableWhen hasStatusLabel==true\n */\n @property({type: String}) statusLabel = '';\n\n /**\n * Whether the accordion card is expanded (shows additional content).\n */\n @property({type: Boolean}) expanded = false;\n\n /**\n * Disables the accordion card, preventing user interaction and dimming its appearance.\n */\n @property({type: Boolean}) disabled = false;\n\n /**\n * Shows an alert overlay above the card when true. Configure appearance with `alertFrameType`, `alertFrameThickness`, and `alertFrameStatus`.\n */\n @property({type: Boolean}) hasAlert = false;\n\n /**\n * Enables the description text in the header (only in large size).\n */\n @property({type: Boolean}) hasDescription = false;\n\n /**\n * Enables the status label in the header.\n */\n @property({type: Boolean}) hasStatusLabel = false;\n\n /**\n * Enables the leading icon slot in the header.\n */\n @property({type: Boolean}) hasLeadingIcon = false;\n\n /**\n * Controls border radius/edge styling for stacking multiple accordions.\n * - `regular` (default): Standard border radius.\n * - `top`: Flat bottom edge (for top of a stack).\n * - `bottom`: Flat top edge (for bottom of a stack).\n * - `center`: Flat top and bottom edges (for middle of a stack).\n */\n @property({type: String}) position: Position = Position.regular;\n\n /**\n * Layout variant of the accordion card.\n * - `single-line` (default): Compact header with only title.\n * - `large`: Header includes a description beneath the title.\n */\n @property({type: String}) size: AccordionSize = AccordionSize.SingleLine;\n\n /**\n * Type of the alert frame overlay (used when `hasAlert` is true).\n * See `obc-alert-frame` for available types.\n * @availableWhen hasAlert==true\n */\n @property({type: String}) alertFrameType: ObcAlertFrameType =\n ObcAlertFrameType.Regular;\n\n /**\n * Thickness of the alert frame overlay (used when `hasAlert` is true).\n * See `obc-alert-frame` for available thickness values.\n * @availableWhen hasAlert==true\n */\n @property({type: String}) alertFrameThickness: ObcAlertFrameThickness =\n ObcAlertFrameThickness.Small;\n\n /**\n * Status of the alert frame overlay (used when `hasAlert` is true).\n * See `obc-alert-frame` for available statuses.\n * @availableWhen hasAlert==true\n */\n @property({type: String}) alertFrameStatus: AlertType = AlertType.Alarm;\n\n private get shouldShowDescription() {\n return (\n this.size === AccordionSize.Large &&\n this.hasDescription &&\n this.description.trim() !== ''\n );\n }\n\n private handleToggle() {\n if (this.disabled) return;\n\n this.expanded = !this.expanded;\n\n /**\n * @fires {CustomEvent<{expanded: boolean, cardTitle: string}>} accordion-toggle - Fired when the accordion is expanded or collapsed.\n */\n this.dispatchEvent(\n new CustomEvent('accordion-toggle', {\n detail: {\n expanded: this.expanded,\n cardTitle: this.cardTitle,\n },\n })\n );\n }\n\n private renderContentMain() {\n return html`\n <div class=\"header-container\">\n <div class=\"content-container\">\n ${this.hasLeadingIcon\n ? html`\n <div class=\"container-icon\">\n <slot name=\"leading-icon\"></slot>\n </div>\n `\n : ''}\n <div class=\"container-labels\">\n <div class=\"label-title\">${this.cardTitle}</div>\n ${this.shouldShowDescription\n ? html` <div class=\"label-description\">${this.description}</div> `\n : ''}\n </div>\n ${this.hasStatusLabel\n ? html`\n <div class=\"container-status\">\n <div class=\"status\">${this.statusLabel}</div>\n </div>\n `\n : ''}\n <div class=\"trailing-icon\">\n ${this.expanded\n ? html`<obi-chevron-up-google></obi-chevron-up-google>`\n : html`<obi-chevron-down-google></obi-chevron-down-google>`}\n </div>\n </div>\n </div>\n `;\n }\n\n private renderContentAdditional() {\n if (!this.expanded) return '';\n\n return html`\n <div class=\"container-content-additional\">\n <slot name=\"expanded-content\"></slot>\n </div>\n `;\n }\n\n private isShartEdgeBottom() {\n return this.position === Position.top || this.position === Position.center;\n }\n private isShartEdgeTop() {\n return (\n this.position === Position.bottom || this.position === Position.center\n );\n }\n\n override render() {\n return html`\n <div\n class=${classMap({\n wrapper: true,\n 'state-expanded': this.expanded,\n 'state-collapsed': !this.expanded,\n 'state-disabled': this.disabled,\n 'style-single-line': this.size === AccordionSize.SingleLine,\n 'style-large': this.size === AccordionSize.Large,\n 'position-top': this.position === Position.top,\n 'position-bottom': this.position === Position.bottom,\n 'position-center': this.position === Position.center,\n })}\n style=\"position: relative;\"\n >\n <div class=\"card-container\">\n <button\n class=\"content-button\"\n @click=${this.handleToggle}\n ?disabled=${this.disabled}\n aria-expanded=${this.expanded}\n aria-controls=\"accordion-content\"\n >\n ${this.renderContentMain()}\n </button>\n\n ${this.renderContentAdditional()}\n </div>\n\n ${this.hasAlert\n ? html`\n <obc-alert-frame\n class=\"alert alert-${this.alertFrameStatus}\"\n .sharpEdgeTopLeft=${this.isShartEdgeTop()}\n .sharpEdgeTopRight=${this.isShartEdgeTop()}\n .sharpEdgeBottomLeft=${this.isShartEdgeBottom()}\n .sharpEdgeBottomRight=${this.isShartEdgeBottom()}\n .type=${this.alertFrameType}\n .thickness=${this.alertFrameThickness}\n .status=${this.alertFrameStatus}\n >\n <slot name=\"alert-icon\" slot=\"icon\"></slot>\n <slot name=\"alert-label\" slot=\"label\"></slot>\n <slot name=\"alert-timer\" slot=\"timer\"></slot>\n </obc-alert-frame>\n `\n : ''}\n </div>\n `;\n }\n\n static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-accordion-card': ObcAccordionCard;\n }\n}\n"],"names":["AccordionSize","Position"],"mappings":"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"}
1
+ {"version":3,"file":"accordion-card.js","sources":["../../../src/components/accordion-card/accordion-card.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {customElement} from '../../decorator.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport compentStyle from './accordion-card.css?inline';\nimport {property} from 'lit/decorators.js';\nimport '../../icons/icon-chevron-up-google.js';\nimport '../../icons/icon-chevron-down-google.js';\nimport '../alert-frame/alert-frame.js';\nimport {\n ObcAlertFrameThickness,\n ObcAlertFrameType,\n} from '../alert-frame/alert-frame.js';\nimport {AlertType} from '../../types.js';\n\nexport enum AccordionSize {\n SingleLine = 'single-line',\n Large = 'large',\n}\n\nexport enum Position {\n top = 'top',\n bottom = 'bottom',\n center = 'center',\n regular = 'regular',\n}\n\n/**\n * `<obc-accordion-card>` – Expandable/collapsible card component for grouping content in a compact, interactive section (accordion, expandable panel, disclosure).\n *\n * Provides a summary row with optional icon, title, description, and status label. Expands to reveal additional content on click/tap, supporting both single-line and large layouts. Can display an alert overlay for contextual warnings or notifications.\n *\n * ### Features\n * - **Expandable/collapsible:** Click/tap toggles between collapsed and expanded states, revealing or hiding additional content.\n * - **Variants:**\n * - **Single-line:** Compact header with only title (and optional icon/status).\n * - **Large:** Header includes a description beneath the title for more detail.\n * - **Positioning:** Supports `top`, `bottom`, `center`, or `regular` (default) border radius/edge styling for stacking multiple accordions.\n * - **Status label:** Optional status text displayed in the header (e.g., \"Active\", \"Warning\").\n * - **Leading icon:** Optional icon slot at the start of the header for visual context.\n * - **Alert overlay:** Can display an alert frame (with icon, label, timer) above the card for warnings or notifications.\n * - **Disabled state:** Prevents interaction and visually indicates non-interactive status.\n * - **Accessibility:** Uses button semantics and ARIA attributes for expand/collapse.\n *\n * ### Usage Guidelines\n * Use `obc-accordion-card` to organize related content in a collapsible section, especially when space is limited or when users may want to focus on one section at a time. Ideal for settings panels, grouped controls, or dashboards where expandable details are needed. Avoid using for persistent, always-visible content.\n *\n * - Use the **single-line** variant for brief titles or when space is tight.\n * - Use the **large** variant when you need to provide a short description or supporting text under the title.\n * - The **status label** is useful for showing quick state info (e.g., \"Active\", \"Error\").\n * - The **alert overlay** is intended for contextual warnings or notifications related to the card's content.\n * - For stacking multiple accordions, adjust the `position` property to control border radii and visual grouping.\n *\n * **TODO(designer):** Confirm if there are recommended limits on title/description length, and if only one accordion should be expanded at a time in a group.\n *\n * ### Slots\n * | Slot Name | Renders When... | Purpose |\n * |-------------------|------------------------|-------------------------------------------------------|\n * | leading-icon | `hasLeadingIcon` true | Icon at the start of the header (e.g., `<obi-placeholder></obi-placeholder>`). |\n * | expanded-content | Always | Content revealed when the accordion is expanded. |\n * | alert-icon | `hasAlert` true | Icon for the alert overlay (slot=\"icon\" in alert frame). |\n * | alert-label | `hasAlert` true | Label text for the alert overlay (slot=\"label\" in alert frame). |\n * | alert-timer | `hasAlert` true | Timer or duration text for the alert overlay (slot=\"timer\" in alert frame). |\n *\n * ### Properties\n * - `expanded` (boolean): Whether the card is expanded (shows additional content). Toggled by user interaction.\n * - `disabled` (boolean): Disables interaction and visually dims the card.\n * - `cardTitle` (string): Main title text shown in the header.\n * - `description` (string): Supporting description (shown only in large size and if `hasDescription` is true).\n * - `statusLabel` (string): Optional status text in the header (shown if `hasStatusLabel` is true).\n * - `hasAlert` (boolean): Shows an alert overlay above the card when true.\n * - `hasDescription` (boolean): Enables description text in large variant.\n * - `hasStatusLabel` (boolean): Enables status label in header.\n * - `hasLeadingIcon` (boolean): Enables leading icon slot in header.\n * - `size` (`AccordionSize` enum): Layout variant, either `'single-line'` (default) or `'large'`.\n * - `position` (`Position` enum): Controls border radius for stacking (`'top'`, `'bottom'`, `'center'`, `'regular'`).\n * - `alertFrameType`, `alertFrameThickness`, `alertFrameStatus`: Configure the alert overlay's appearance (see `obc-alert-frame` for details).\n *\n * ### Events\n * - `accordion-toggle` – Fired when the accordion is expanded or collapsed. Event detail includes `{ expanded, cardTitle }`.\n *\n * ### Best Practices\n * - Only use the alert overlay for important, contextual notifications related to the card's content.\n * - For accessibility, ensure the card title is descriptive and unique within a group.\n * - Avoid nesting interactive elements (like buttons) directly in the header; place them in the expanded content if needed.\n *\n * ### Example:\n * ```\n * <obc-accordion-card\n * cardTitle=\"Settings\"\n * description=\"Configure your preferences\"\n * size=\"large\"\n * hasDescription\n * expanded\n * hasLeadingIcon\n * >\n * <span slot=\"leading-icon\"><obi-placeholder></obi-placeholder></span>\n * <div slot=\"expanded-content\">\n * <!-- Additional settings controls here -->\n * </div>\n * </obc-accordion-card>\n * ```\n *\n * @slot leading-icon - Icon at the start of the header (shown when `hasLeadingIcon` is true)\n * @slot expanded-content - Content revealed when the accordion is expanded\n * @slot alert-icon - Icon for the alert overlay (used when `hasAlert` is true)\n * @slot alert-label - Label text for the alert overlay (used when `hasAlert` is true)\n * @slot alert-timer - Timer/duration text for the alert overlay (used when `hasAlert` is true)\n * @fires {CustomEvent<{expanded: boolean, cardTitle: string}>} accordion-toggle - Fired when the accordion is expanded or collapsed\n * @stable\n */\n@customElement('obc-accordion-card')\nexport class ObcAccordionCard extends LitElement {\n /**\n * Main title text displayed in the accordion header.\n */\n @property({type: String}) cardTitle = '';\n\n /**\n * Supporting description text shown under the title (only in large size and if `hasDescription` is true).\n * @availableWhen size==large && hasDescription==true\n */\n @property({type: String}) description = '';\n\n /**\n * Optional status label displayed in the header (shown if `hasStatusLabel` is true).\n * @availableWhen hasStatusLabel==true\n */\n @property({type: String}) statusLabel = '';\n\n /**\n * Whether the accordion card is expanded (shows additional content).\n */\n @property({type: Boolean}) expanded = false;\n\n /**\n * Disables the accordion card, preventing user interaction and dimming its appearance.\n */\n @property({type: Boolean}) disabled = false;\n\n /**\n * Shows an alert overlay above the card when true. Configure appearance with `alertFrameType`, `alertFrameThickness`, and `alertFrameStatus`.\n */\n @property({type: Boolean}) hasAlert = false;\n\n /**\n * Enables the description text in the header (only in large size).\n */\n @property({type: Boolean}) hasDescription = false;\n\n /**\n * Enables the status label in the header.\n */\n @property({type: Boolean}) hasStatusLabel = false;\n\n /**\n * Enables the leading icon slot in the header.\n */\n @property({type: Boolean}) hasLeadingIcon = false;\n\n /**\n * Controls border radius/edge styling for stacking multiple accordions.\n * - `regular` (default): Standard border radius.\n * - `top`: Flat bottom edge (for top of a stack).\n * - `bottom`: Flat top edge (for bottom of a stack).\n * - `center`: Flat top and bottom edges (for middle of a stack).\n */\n @property({type: String}) position: Position = Position.regular;\n\n /**\n * Layout variant of the accordion card.\n * - `single-line` (default): Compact header with only title.\n * - `large`: Header includes a description beneath the title.\n */\n @property({type: String}) size: AccordionSize = AccordionSize.SingleLine;\n\n /**\n * Type of the alert frame overlay (used when `hasAlert` is true).\n * See `obc-alert-frame` for available types.\n * @availableWhen hasAlert==true\n */\n @property({type: String}) alertFrameType: ObcAlertFrameType =\n ObcAlertFrameType.Regular;\n\n /**\n * Thickness of the alert frame overlay (used when `hasAlert` is true).\n * See `obc-alert-frame` for available thickness values.\n * @availableWhen hasAlert==true\n */\n @property({type: String}) alertFrameThickness: ObcAlertFrameThickness =\n ObcAlertFrameThickness.Small;\n\n /**\n * Status of the alert frame overlay (used when `hasAlert` is true).\n * See `obc-alert-frame` for available statuses.\n * @availableWhen hasAlert==true\n */\n @property({type: String}) alertFrameStatus: AlertType = AlertType.Alarm;\n\n private get shouldShowDescription() {\n return (\n this.size === AccordionSize.Large &&\n this.hasDescription &&\n this.description.trim() !== ''\n );\n }\n\n private handleToggle() {\n if (this.disabled) return;\n\n this.expanded = !this.expanded;\n\n /**\n * Fired when the accordion is expanded or collapsed.\n * @fires accordion-toggle\n */\n this.dispatchEvent(\n new CustomEvent('accordion-toggle', {\n detail: {\n expanded: this.expanded,\n cardTitle: this.cardTitle,\n },\n })\n );\n }\n\n private renderContentMain() {\n return html`\n <div class=\"header-container\">\n <div class=\"content-container\">\n ${this.hasLeadingIcon\n ? html`\n <div class=\"container-icon\">\n <slot name=\"leading-icon\"></slot>\n </div>\n `\n : ''}\n <div class=\"container-labels\">\n <div class=\"label-title\">${this.cardTitle}</div>\n ${this.shouldShowDescription\n ? html` <div class=\"label-description\">${this.description}</div> `\n : ''}\n </div>\n ${this.hasStatusLabel\n ? html`\n <div class=\"container-status\">\n <div class=\"status\">${this.statusLabel}</div>\n </div>\n `\n : ''}\n <div class=\"trailing-icon\">\n ${this.expanded\n ? html`<obi-chevron-up-google></obi-chevron-up-google>`\n : html`<obi-chevron-down-google></obi-chevron-down-google>`}\n </div>\n </div>\n </div>\n `;\n }\n\n private renderContentAdditional() {\n if (!this.expanded) return '';\n\n return html`\n <div class=\"container-content-additional\">\n <slot name=\"expanded-content\"></slot>\n </div>\n `;\n }\n\n private isShartEdgeBottom() {\n return this.position === Position.top || this.position === Position.center;\n }\n private isShartEdgeTop() {\n return (\n this.position === Position.bottom || this.position === Position.center\n );\n }\n\n override render() {\n return html`\n <div\n class=${classMap({\n wrapper: true,\n 'state-expanded': this.expanded,\n 'state-collapsed': !this.expanded,\n 'state-disabled': this.disabled,\n 'style-single-line': this.size === AccordionSize.SingleLine,\n 'style-large': this.size === AccordionSize.Large,\n 'position-top': this.position === Position.top,\n 'position-bottom': this.position === Position.bottom,\n 'position-center': this.position === Position.center,\n })}\n style=\"position: relative;\"\n >\n <div class=\"card-container\">\n <button\n class=\"content-button\"\n @click=${this.handleToggle}\n ?disabled=${this.disabled}\n aria-expanded=${this.expanded}\n aria-controls=\"accordion-content\"\n >\n ${this.renderContentMain()}\n </button>\n\n ${this.renderContentAdditional()}\n </div>\n\n ${this.hasAlert\n ? html`\n <obc-alert-frame\n class=\"alert alert-${this.alertFrameStatus}\"\n .sharpEdgeTopLeft=${this.isShartEdgeTop()}\n .sharpEdgeTopRight=${this.isShartEdgeTop()}\n .sharpEdgeBottomLeft=${this.isShartEdgeBottom()}\n .sharpEdgeBottomRight=${this.isShartEdgeBottom()}\n .type=${this.alertFrameType}\n .thickness=${this.alertFrameThickness}\n .status=${this.alertFrameStatus}\n >\n <slot name=\"alert-icon\" slot=\"icon\"></slot>\n <slot name=\"alert-label\" slot=\"label\"></slot>\n <slot name=\"alert-timer\" slot=\"timer\"></slot>\n </obc-alert-frame>\n `\n : ''}\n </div>\n `;\n }\n\n static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-accordion-card': ObcAccordionCard;\n }\n}\n"],"names":["AccordionSize","Position"],"mappings":";;;;;;;;;;;;;;;;;;;AAcO,IAAK,kCAAAA,mBAAL;AACLA,iBAAA,YAAA,IAAa;AACbA,iBAAA,OAAA,IAAQ;AAFE,SAAAA;AAAA,GAAA,iBAAA,CAAA,CAAA;AAKL,IAAK,6BAAAC,cAAL;AACLA,YAAA,KAAA,IAAM;AACNA,YAAA,QAAA,IAAS;AACTA,YAAA,QAAA,IAAS;AACTA,YAAA,SAAA,IAAU;AAJA,SAAAA;AAAA,GAAA,YAAA,CAAA,CAAA;AA4FL,IAAM,mBAAN,cAA+B,WAAW;AAAA,EAA1C,cAAA;AAAA,UAAA,GAAA,SAAA;AAIqB,SAAA,YAAY;AAMZ,SAAA,cAAc;AAMd,SAAA,cAAc;AAKb,SAAA,WAAW;AAKX,SAAA,WAAW;AAKX,SAAA,WAAW;AAKX,SAAA,iBAAiB;AAKjB,SAAA,iBAAiB;AAKjB,SAAA,iBAAiB;AASlB,SAAA,WAAqB;AAOrB,SAAA,OAAsB;AAOtB,SAAA,iBACxB,kBAAkB;AAOM,SAAA,sBACxB,uBAAuB;AAOC,SAAA,mBAA8B,UAAU;AAAA,EAAA;AAAA,EAElE,IAAY,wBAAwB;AAClC,WACE,KAAK,SAAS,WACd,KAAK,kBACL,KAAK,YAAY,WAAW;AAAA,EAEhC;AAAA,EAEQ,eAAe;AACrB,QAAI,KAAK,SAAU;AAEnB,SAAK,WAAW,CAAC,KAAK;AAMtB,SAAK;AAAA,MACH,IAAI,YAAY,oBAAoB;AAAA,QAClC,QAAQ;AAAA,UACN,UAAU,KAAK;AAAA,UACf,WAAW,KAAK;AAAA,QAAA;AAAA,MAClB,CACD;AAAA,IAAA;AAAA,EAEL;AAAA,EAEQ,oBAAoB;AAC1B,WAAO;AAAA;AAAA;AAAA,YAGC,KAAK,iBACH;AAAA;AAAA;AAAA;AAAA,kBAKA,EAAE;AAAA;AAAA,uCAEuB,KAAK,SAAS;AAAA,cACvC,KAAK,wBACH,uCAAuC,KAAK,WAAW,YACvD,EAAE;AAAA;AAAA,YAEN,KAAK,iBACH;AAAA;AAAA,wCAE0B,KAAK,WAAW;AAAA;AAAA,kBAG1C,EAAE;AAAA;AAAA,cAEF,KAAK,WACH,wDACA,yDAAyD;AAAA;AAAA;AAAA;AAAA;AAAA,EAKvE;AAAA,EAEQ,0BAA0B;AAChC,QAAI,CAAC,KAAK,SAAU,QAAO;AAE3B,WAAO;AAAA;AAAA;AAAA;AAAA;AAAA,EAKT;AAAA,EAEQ,oBAAoB;AAC1B,WAAO,KAAK,aAAa,SAAgB,KAAK,aAAa;AAAA,EAC7D;AAAA,EACQ,iBAAiB;AACvB,WACE,KAAK,aAAa,YAAmB,KAAK,aAAa;AAAA,EAE3D;AAAA,EAES,SAAS;AAChB,WAAO;AAAA;AAAA,gBAEK,SAAS;AAAA,MACf,SAAS;AAAA,MACT,kBAAkB,KAAK;AAAA,MACvB,mBAAmB,CAAC,KAAK;AAAA,MACzB,kBAAkB,KAAK;AAAA,MACvB,qBAAqB,KAAK,SAAS;AAAA,MACnC,eAAe,KAAK,SAAS;AAAA,MAC7B,gBAAgB,KAAK,aAAa;AAAA,MAClC,mBAAmB,KAAK,aAAa;AAAA,MACrC,mBAAmB,KAAK,aAAa;AAAA;AAAA,IAAA,CACtC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBAMW,KAAK,YAAY;AAAA,wBACd,KAAK,QAAQ;AAAA,4BACT,KAAK,QAAQ;AAAA;AAAA;AAAA,cAG3B,KAAK,mBAAmB;AAAA;AAAA;AAAA,YAG1B,KAAK,yBAAyB;AAAA;AAAA;AAAA,UAGhC,KAAK,WACH;AAAA;AAAA,qCAEyB,KAAK,gBAAgB;AAAA,oCACtB,KAAK,gBAAgB;AAAA,qCACpB,KAAK,gBAAgB;AAAA,uCACnB,KAAK,mBAAmB;AAAA,wCACvB,KAAK,mBAAmB;AAAA,wBACxC,KAAK,cAAc;AAAA,6BACd,KAAK,mBAAmB;AAAA,0BAC3B,KAAK,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAOnC,EAAE;AAAA;AAAA;AAAA,EAGZ;AAGF;AA5Na,iBA2NK,SAAS,UAAU,YAAY;AAvNrB,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GAJb,iBAIe,WAAA,aAAA,CAAA;AAMA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GAVb,iBAUe,WAAA,eAAA,CAAA;AAMA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GAhBb,iBAgBe,WAAA,eAAA,CAAA;AAKC,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GArBd,iBAqBgB,WAAA,YAAA,CAAA;AAKA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GA1Bd,iBA0BgB,WAAA,YAAA,CAAA;AAKA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GA/Bd,iBA+BgB,WAAA,YAAA,CAAA;AAKA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GApCd,iBAoCgB,WAAA,kBAAA,CAAA;AAKA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GAzCd,iBAyCgB,WAAA,kBAAA,CAAA;AAKA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,QAAA,CAAQ;AAAA,GA9Cd,iBA8CgB,WAAA,kBAAA,CAAA;AASD,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GAvDb,iBAuDe,WAAA,YAAA,CAAA;AAOA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GA9Db,iBA8De,WAAA,QAAA,CAAA;AAOA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GArEb,iBAqEe,WAAA,kBAAA,CAAA;AAQA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GA7Eb,iBA6Ee,WAAA,uBAAA,CAAA;AAQA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,OAAA,CAAO;AAAA,GArFb,iBAqFe,WAAA,oBAAA,CAAA;AArFf,mBAAN,gBAAA;AAAA,EADN,cAAc,oBAAoB;AAAA,GACtB,gBAAA;"}
@@ -184,11 +184,13 @@ export declare class ObcAdviceMessageItem extends LitElement {
184
184
  emptyText: string;
185
185
  private get mappedType();
186
186
  /**
187
- * @fires {CustomEvent<void>} message-click - Fired when the main message area is clicked.
187
+ * Fired when the main message area is clicked.
188
+ * @fires message-click
188
189
  */
189
190
  private handleMessageClick;
190
191
  /**
191
- * @fires {CustomEvent<void>} action-click - Fired when the action button (text or icon) is clicked.
192
+ * Fired when the action button (text or icon) is clicked.
193
+ * @fires action-click
192
194
  */
193
195
  private handleActionClick;
194
196
  render(): import('lit-html').TemplateResult<1>;
@@ -1 +1 @@
1
- {"version":3,"file":"advice-message-item.d.ts","sourceRoot":"","sources":["../../../src/components/advice-message-item/advice-message-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAA2B,MAAM,KAAK,CAAC;AAIzD,OAAO,+CAA+C,CAAC;AAEvD,OAAO,gDAAgD,CAAC;AACxD,OAAO,kCAAkC,CAAC;AAE1C,oBAAY,wBAAwB;IAClC,MAAM,WAAW;IACjB,UAAU,gBAAgB;IAC1B,cAAc,qBAAqB;IACnC,QAAQ,aAAa;CACtB;AAED,oBAAY,wBAAwB;IAClC,OAAO,YAAY;IACnB,IAAI,SAAS;CACd;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoFG;AACH,qBACa,oBAAqB,SAAQ,UAAU;IAClD;;;;OAIG;IACgC,KAAK,SAAM;IAE9C;;;;OAIG;IACuB,WAAW,SAAM;IAE3C;;;;OAIG;IACuB,IAAI,SAAM;IAEpC;;;;OAIG;IACuB,aAAa,SAAM;IAE7C;;;;OAIG;IACuB,WAAW,SAAU;IAE/C;;;;;;;;OAQG;IACuB,IAAI,EAAE,wBAAwB,CACtB;IAElC;;;;;;OAMG;IACuB,IAAI,EAAE,wBAAwB,CACrB;IAEnC;;;;OAIG;IAC0C,SAAS,EAAE,OAAO,CAAQ;IAEvE;;;;OAIG;IAC0C,eAAe,EAAE,OAAO,CAAQ;IAE7E;;;;OAIG;IAC0C,aAAa,EAAE,OAAO,CAAQ;IAE3E;;;;OAIG;IACwB,aAAa,UAAS;IAEjD;;;;OAIG;IACwB,gBAAgB,UAAS;IAEpD;;;;OAIG;IACuB,SAAS,SAAsB;IAEzD,OAAO,KAAK,UAAU,GAerB;IAED;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAI1B;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAIhB,MAAM;IA2Cf,OAAgB,MAAM,0BAA6B;CACpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,yBAAyB,EAAE,oBAAoB,CAAC;KACjD;CACF"}
1
+ {"version":3,"file":"advice-message-item.d.ts","sourceRoot":"","sources":["../../../src/components/advice-message-item/advice-message-item.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAA2B,MAAM,KAAK,CAAC;AAIzD,OAAO,+CAA+C,CAAC;AAEvD,OAAO,gDAAgD,CAAC;AACxD,OAAO,kCAAkC,CAAC;AAE1C,oBAAY,wBAAwB;IAClC,MAAM,WAAW;IACjB,UAAU,gBAAgB;IAC1B,cAAc,qBAAqB;IACnC,QAAQ,aAAa;CACtB;AAED,oBAAY,wBAAwB;IAClC,OAAO,YAAY;IACnB,IAAI,SAAS;CACd;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoFG;AACH,qBACa,oBAAqB,SAAQ,UAAU;IAClD;;;;OAIG;IACgC,KAAK,SAAM;IAE9C;;;;OAIG;IACuB,WAAW,SAAM;IAE3C;;;;OAIG;IACuB,IAAI,SAAM;IAEpC;;;;OAIG;IACuB,aAAa,SAAM;IAE7C;;;;OAIG;IACuB,WAAW,SAAU;IAE/C;;;;;;;;OAQG;IACuB,IAAI,EAAE,wBAAwB,CACtB;IAElC;;;;;;OAMG;IACuB,IAAI,EAAE,wBAAwB,CACrB;IAEnC;;;;OAIG;IAC0C,SAAS,EAAE,OAAO,CAAQ;IAEvE;;;;OAIG;IAC0C,eAAe,EAAE,OAAO,CAAQ;IAE7E;;;;OAIG;IAC0C,aAAa,EAAE,OAAO,CAAQ;IAE3E;;;;OAIG;IACwB,aAAa,UAAS;IAEjD;;;;OAIG;IACwB,gBAAgB,UAAS;IAEpD;;;;OAIG;IACuB,SAAS,SAAsB;IAEzD,OAAO,KAAK,UAAU,GAerB;IAED;;;OAGG;IACH,OAAO,CAAC,kBAAkB;IAI1B;;;OAGG;IACH,OAAO,CAAC,iBAAiB;IAIhB,MAAM;IA2Cf,OAAgB,MAAM,0BAA6B;CACpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,yBAAyB,EAAE,oBAAoB,CAAC;KACjD;CACF"}
@@ -60,13 +60,15 @@ let ObcAdviceMessageItem = class extends LitElement {
60
60
  }
61
61
  }
62
62
  /**
63
- * @fires {CustomEvent<void>} message-click - Fired when the main message area is clicked.
63
+ * Fired when the main message area is clicked.
64
+ * @fires message-click
64
65
  */
65
66
  handleMessageClick() {
66
67
  this.dispatchEvent(new CustomEvent("message-click"));
67
68
  }
68
69
  /**
69
- * @fires {CustomEvent<void>} action-click - Fired when the action button (text or icon) is clicked.
70
+ * Fired when the action button (text or icon) is clicked.
71
+ * @fires action-click
70
72
  */
71
73
  handleActionClick() {
72
74
  this.dispatchEvent(new CustomEvent("action-click"));
@@ -1 +1 @@
1
- {"version":3,"file":"advice-message-item.js","sources":["../../../src/components/advice-message-item/advice-message-item.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS, nothing} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {customElement} from '../../decorator.js';\nimport componentStyle from './advice-message-item.css?inline';\nimport '../topbar-message-item/topbar-message-item.js';\nimport {ObcTopbarMessageItemType} from '../topbar-message-item/topbar-message-item.js';\nimport '../../icons/icon-notification-advice-active.js';\nimport '../../icons/icon-close-google.js';\n\nexport enum ObcAdviceMessageItemType {\n Simple = 'simple',\n WithButton = 'with-button',\n WithIconButton = 'with-icon-button',\n Inactive = 'inactive',\n}\n\nexport enum ObcAdviceMessageItemSize {\n Regular = 'regular',\n Tall = 'tall',\n}\n\n/**\n * `<obc-advice-message-item>` – A compact, actionable message component for displaying system advice, recommendations, or notifications.\n *\n * This component presents a brief advice or recommendation message, optionally with a title, description, timestamp(s), and action(s). It is designed for use in notification panels, topbars, or summary lists where users need to quickly review and act on advice items. The component supports several display variants, including simple messages, messages with action buttons, and inactive/empty states.\n *\n * ---\n *\n * ### Features\n * - **Display Types:**\n * - `simple`: Standard advice message with optional title, description, and timestamp.\n * - `with-button`: Includes a text action button (label set via `actionLabel`).\n * - `with-icon-button`: Shows an icon button for quick actions (e.g., dismiss or close).\n * - `inactive`: Indicates an empty or inactive state, typically used when there are no active advice messages.\n * - **Size Variants:**\n * - `regular`: Default compact layout.\n * - `tall`: Provides a larger, more spacious layout for increased content or emphasis.\n * - **Content Options:**\n * - Title and description can be shown or hidden independently.\n * - Supports one or two timestamps (primary and secondary) for time or duration display.\n * - Optional secondary icon overlay for additional status or categorization.\n * - Customizable empty state text for when no advice is present.\n * - **Actions:**\n * - Text action button (with customizable label) or icon button, depending on type.\n * - Clickable message area for additional interactions.\n * - **Accessibility & Responsiveness:**\n * - Truncates long titles/descriptions with ellipsis for readability.\n * - Layout adapts to size variant and content presence.\n *\n * ---\n *\n * ### Usage Guidelines\n * Use `<obc-advice-message-item>` to present actionable advice, recommendations, or notifications that require user attention or review. Ideal for notification panels, summary lists, or topbars where users may need to quickly scan and act on advice items. Choose the `with-button` or `with-icon-button` types when an immediate action (such as \"View\", \"Acknowledge\", or \"Dismiss\") is needed. Use the `inactive` type (or set `empty` to true) to indicate that there are currently no active advice messages.\n *\n * - For persistent or critical alerts, consider using a dedicated alert/banner component.\n * - For simple, informational messages without actions, use the `simple` type.\n * - Use the `tall` size for layouts where more space is available or when emphasizing the advice.\n * - The secondary icon slot can be used to indicate priority, category, or additional status.\n *\n * **TODO(designer):** Confirm if there are recommended icon choices or color conventions for different advice types, and if there are character limits for title/description.\n *\n * ---\n *\n * ### Slots\n * | Slot Name | Renders When... | Purpose |\n * |-------------------|----------------------------|----------------------------------------------------------|\n * | `secondary-icon` | `hasSecondaryIcon` is true | Optional overlay icon for additional status or category. |\n *\n * All other content (title, description, timestamps, action label/icon, empty-state\n * text) is driven by properties and rendered internally; it is not exposed as slots.\n *\n * ---\n *\n * ### Events\n * - `message-click` – Fired when the main message area is clicked.\n * - `action-click` – Fired when the action button (text or icon) is clicked.\n *\n * ---\n *\n * ### Best Practices & Constraints\n * - Only one action (text or icon) is shown at a time, depending on the `type`.\n * - Use concise titles and descriptions for optimal readability; long content will be truncated.\n * - The `large` and `empty` properties are deprecated; use `size=\"tall\"` and `type=\"inactive\"` instead.\n * - For accessibility, ensure action labels are descriptive and icons have appropriate meaning.\n *\n * ---\n *\n * **Example:**\n * ```html\n * <obc-advice-message-item\n * title=\"System Recommendation\"\n * description=\"Your system performance can be improved\"\n * time=\"10:30:15\"\n * type=\"with-button\"\n * actionLabel=\"View\"\n * >\n * </obc-advice-message-item>\n * ```\n *\n * In this example, the advice message displays a title, description, timestamp, and a \"View\" action button.\n *\n * @slot secondary-icon - Optional overlay icon for additional status/category (shown when `hasSecondaryIcon` is true)\n * @fires {CustomEvent<void>} message-click - When the main message area is clicked\n * @fires {CustomEvent<void>} action-click - When the action button (text or icon) is clicked\n * @beta\n */\n@customElement('obc-advice-message-item')\nexport class ObcAdviceMessageItem extends LitElement {\n /**\n * Title or heading of the advice message.\n * Shown in the `title` slot if `hasTitle` is true.\n * @availableWhen showTitle==true && type!=Inactive\n */\n @property({type: String}) override title = '';\n\n /**\n * Detailed message text for the advice.\n * Shown in the `description` slot if `hasDescription` is true.\n * @availableWhen showDescription==true && type!=Inactive\n */\n @property({type: String}) description = '';\n\n /**\n * Primary timestamp to display (e.g., time of advice).\n * Shown in the `time` slot if `hasTimestamp` is true.\n * @availableWhen showTimestamp==true && type!=Inactive\n */\n @property({type: String}) time = '';\n\n /**\n * Secondary timestamp (e.g., duration, relative time).\n * Shown in the `time-secondary` slot if `hasTimestamp2` is true.\n * @availableWhen hasTimestamp2==true && type!=Inactive\n */\n @property({type: String}) timeSecondary = '';\n\n /**\n * Label for the action button (when `type` is \"with-button\").\n * Shown in the `action-text` slot.\n * @availableWhen type==WithButton\n */\n @property({type: String}) actionLabel = 'View';\n\n /**\n * Display type of the advice message.\n * - `simple`: Standard message with optional title, description, and timestamp.\n * - `with-button`: Includes a text action button.\n * - `with-icon-button`: Includes an icon action button.\n * - `inactive`: Shows the empty/inactive state.\n *\n * Default: `simple`\n */\n @property({type: String}) type: ObcAdviceMessageItemType =\n ObcAdviceMessageItemType.Simple;\n\n /**\n * Size variant of the advice message.\n * - `regular`: Default compact layout.\n * - `tall`: Larger, more spacious layout.\n *\n * Default: `regular`\n */\n @property({type: String}) size: ObcAdviceMessageItemSize =\n ObcAdviceMessageItemSize.Regular;\n\n /**\n * Whether to show the title.\n * If false, the title is hidden even if set.\n * @availableWhen type!=Inactive\n */\n @property({type: Boolean, attribute: false}) showTitle: boolean = true;\n\n /**\n * Whether to show the description.\n * If false, the description is hidden even if set.\n * @availableWhen type!=Inactive\n */\n @property({type: Boolean, attribute: false}) showDescription: boolean = true;\n\n /**\n * Whether to show the primary timestamp.\n * If false, the `time` slot is not rendered.\n * @availableWhen type!=Inactive\n */\n @property({type: Boolean, attribute: false}) showTimestamp: boolean = true;\n\n /**\n * Whether to show the secondary timestamp.\n * If true, the `time-secondary` slot is rendered.\n * @availableWhen type!=Inactive\n */\n @property({type: Boolean}) hasTimestamp2 = false;\n\n /**\n * Whether to show the secondary icon overlay.\n * If true, the `secondary-icon` slot is rendered.\n * @availableWhen type!=Inactive\n */\n @property({type: Boolean}) hasSecondaryIcon = false;\n\n /**\n * Text to display in the empty/inactive state.\n * Shown in the `empty` slot when `type=\"inactive\"` or `empty` is true.\n * @availableWhen type==Inactive\n */\n @property({type: String}) emptyText = 'No active advice';\n\n private get mappedType(): ObcTopbarMessageItemType {\n if (this.type === ObcAdviceMessageItemType.Inactive) {\n return ObcTopbarMessageItemType.Inactive;\n }\n\n switch (this.type) {\n case ObcAdviceMessageItemType.WithButton:\n return ObcTopbarMessageItemType.WithButton;\n case ObcAdviceMessageItemType.WithIconButton:\n return ObcTopbarMessageItemType.WithIconButton;\n case ObcAdviceMessageItemType.Simple:\n return ObcTopbarMessageItemType.Simple;\n default:\n return ObcTopbarMessageItemType.Simple;\n }\n }\n\n /**\n * @fires {CustomEvent<void>} message-click - Fired when the main message area is clicked.\n */\n private handleMessageClick() {\n this.dispatchEvent(new CustomEvent('message-click'));\n }\n\n /**\n * @fires {CustomEvent<void>} action-click - Fired when the action button (text or icon) is clicked.\n */\n private handleActionClick() {\n this.dispatchEvent(new CustomEvent('action-click'));\n }\n\n override render() {\n return html`\n <obc-topbar-message-item\n .type=${this.mappedType}\n .size=${this.size}\n .showTitle=${this.showTitle}\n .showDescription=${this.showDescription}\n .showTimestamp=${this.showTimestamp}\n .hasTimestamp2=${this.hasTimestamp2}\n .hasSecondaryIcon=${this.hasSecondaryIcon}\n @message-click=${this.handleMessageClick}\n @action-click=${this.handleActionClick}\n >\n <obi-notification-advice-active\n slot=\"primary-icon\"\n ></obi-notification-advice-active>\n\n ${this.hasSecondaryIcon\n ? html`<slot name=\"secondary-icon\" slot=\"secondary-icon\"></slot>`\n : nothing}\n ${this.title && this.showTitle\n ? html`<span slot=\"title\">${this.title}</span>`\n : nothing}\n ${this.description && this.showDescription\n ? html`<span slot=\"description\">${this.description}</span>`\n : nothing}\n ${this.time && this.showTimestamp\n ? html`<span slot=\"time\">${this.time}</span>`\n : nothing}\n ${this.timeSecondary && this.hasTimestamp2\n ? html`<span slot=\"time-secondary\">${this.timeSecondary}</span>`\n : nothing}\n ${this.type === ObcAdviceMessageItemType.WithButton\n ? html`<span slot=\"action-text\">${this.actionLabel}</span>`\n : this.type === ObcAdviceMessageItemType.WithIconButton\n ? html`<obi-close-google slot=\"action-icon\"></obi-close-google>`\n : nothing}\n\n <span slot=\"empty\">${this.emptyText}</span>\n </obc-topbar-message-item>\n `;\n }\n\n static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-advice-message-item': ObcAdviceMessageItem;\n }\n}\n"],"names":["ObcAdviceMessageItemType","ObcAdviceMessageItemSize"],"mappings":"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"}
1
+ {"version":3,"file":"advice-message-item.js","sources":["../../../src/components/advice-message-item/advice-message-item.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS, nothing} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {customElement} from '../../decorator.js';\nimport componentStyle from './advice-message-item.css?inline';\nimport '../topbar-message-item/topbar-message-item.js';\nimport {ObcTopbarMessageItemType} from '../topbar-message-item/topbar-message-item.js';\nimport '../../icons/icon-notification-advice-active.js';\nimport '../../icons/icon-close-google.js';\n\nexport enum ObcAdviceMessageItemType {\n Simple = 'simple',\n WithButton = 'with-button',\n WithIconButton = 'with-icon-button',\n Inactive = 'inactive',\n}\n\nexport enum ObcAdviceMessageItemSize {\n Regular = 'regular',\n Tall = 'tall',\n}\n\n/**\n * `<obc-advice-message-item>` – A compact, actionable message component for displaying system advice, recommendations, or notifications.\n *\n * This component presents a brief advice or recommendation message, optionally with a title, description, timestamp(s), and action(s). It is designed for use in notification panels, topbars, or summary lists where users need to quickly review and act on advice items. The component supports several display variants, including simple messages, messages with action buttons, and inactive/empty states.\n *\n * ---\n *\n * ### Features\n * - **Display Types:**\n * - `simple`: Standard advice message with optional title, description, and timestamp.\n * - `with-button`: Includes a text action button (label set via `actionLabel`).\n * - `with-icon-button`: Shows an icon button for quick actions (e.g., dismiss or close).\n * - `inactive`: Indicates an empty or inactive state, typically used when there are no active advice messages.\n * - **Size Variants:**\n * - `regular`: Default compact layout.\n * - `tall`: Provides a larger, more spacious layout for increased content or emphasis.\n * - **Content Options:**\n * - Title and description can be shown or hidden independently.\n * - Supports one or two timestamps (primary and secondary) for time or duration display.\n * - Optional secondary icon overlay for additional status or categorization.\n * - Customizable empty state text for when no advice is present.\n * - **Actions:**\n * - Text action button (with customizable label) or icon button, depending on type.\n * - Clickable message area for additional interactions.\n * - **Accessibility & Responsiveness:**\n * - Truncates long titles/descriptions with ellipsis for readability.\n * - Layout adapts to size variant and content presence.\n *\n * ---\n *\n * ### Usage Guidelines\n * Use `<obc-advice-message-item>` to present actionable advice, recommendations, or notifications that require user attention or review. Ideal for notification panels, summary lists, or topbars where users may need to quickly scan and act on advice items. Choose the `with-button` or `with-icon-button` types when an immediate action (such as \"View\", \"Acknowledge\", or \"Dismiss\") is needed. Use the `inactive` type (or set `empty` to true) to indicate that there are currently no active advice messages.\n *\n * - For persistent or critical alerts, consider using a dedicated alert/banner component.\n * - For simple, informational messages without actions, use the `simple` type.\n * - Use the `tall` size for layouts where more space is available or when emphasizing the advice.\n * - The secondary icon slot can be used to indicate priority, category, or additional status.\n *\n * **TODO(designer):** Confirm if there are recommended icon choices or color conventions for different advice types, and if there are character limits for title/description.\n *\n * ---\n *\n * ### Slots\n * | Slot Name | Renders When... | Purpose |\n * |-------------------|----------------------------|----------------------------------------------------------|\n * | `secondary-icon` | `hasSecondaryIcon` is true | Optional overlay icon for additional status or category. |\n *\n * All other content (title, description, timestamps, action label/icon, empty-state\n * text) is driven by properties and rendered internally; it is not exposed as slots.\n *\n * ---\n *\n * ### Events\n * - `message-click` – Fired when the main message area is clicked.\n * - `action-click` – Fired when the action button (text or icon) is clicked.\n *\n * ---\n *\n * ### Best Practices & Constraints\n * - Only one action (text or icon) is shown at a time, depending on the `type`.\n * - Use concise titles and descriptions for optimal readability; long content will be truncated.\n * - The `large` and `empty` properties are deprecated; use `size=\"tall\"` and `type=\"inactive\"` instead.\n * - For accessibility, ensure action labels are descriptive and icons have appropriate meaning.\n *\n * ---\n *\n * **Example:**\n * ```html\n * <obc-advice-message-item\n * title=\"System Recommendation\"\n * description=\"Your system performance can be improved\"\n * time=\"10:30:15\"\n * type=\"with-button\"\n * actionLabel=\"View\"\n * >\n * </obc-advice-message-item>\n * ```\n *\n * In this example, the advice message displays a title, description, timestamp, and a \"View\" action button.\n *\n * @slot secondary-icon - Optional overlay icon for additional status/category (shown when `hasSecondaryIcon` is true)\n * @fires {CustomEvent<void>} message-click - When the main message area is clicked\n * @fires {CustomEvent<void>} action-click - When the action button (text or icon) is clicked\n * @beta\n */\n@customElement('obc-advice-message-item')\nexport class ObcAdviceMessageItem extends LitElement {\n /**\n * Title or heading of the advice message.\n * Shown in the `title` slot if `hasTitle` is true.\n * @availableWhen showTitle==true && type!=Inactive\n */\n @property({type: String}) override title = '';\n\n /**\n * Detailed message text for the advice.\n * Shown in the `description` slot if `hasDescription` is true.\n * @availableWhen showDescription==true && type!=Inactive\n */\n @property({type: String}) description = '';\n\n /**\n * Primary timestamp to display (e.g., time of advice).\n * Shown in the `time` slot if `hasTimestamp` is true.\n * @availableWhen showTimestamp==true && type!=Inactive\n */\n @property({type: String}) time = '';\n\n /**\n * Secondary timestamp (e.g., duration, relative time).\n * Shown in the `time-secondary` slot if `hasTimestamp2` is true.\n * @availableWhen hasTimestamp2==true && type!=Inactive\n */\n @property({type: String}) timeSecondary = '';\n\n /**\n * Label for the action button (when `type` is \"with-button\").\n * Shown in the `action-text` slot.\n * @availableWhen type==WithButton\n */\n @property({type: String}) actionLabel = 'View';\n\n /**\n * Display type of the advice message.\n * - `simple`: Standard message with optional title, description, and timestamp.\n * - `with-button`: Includes a text action button.\n * - `with-icon-button`: Includes an icon action button.\n * - `inactive`: Shows the empty/inactive state.\n *\n * Default: `simple`\n */\n @property({type: String}) type: ObcAdviceMessageItemType =\n ObcAdviceMessageItemType.Simple;\n\n /**\n * Size variant of the advice message.\n * - `regular`: Default compact layout.\n * - `tall`: Larger, more spacious layout.\n *\n * Default: `regular`\n */\n @property({type: String}) size: ObcAdviceMessageItemSize =\n ObcAdviceMessageItemSize.Regular;\n\n /**\n * Whether to show the title.\n * If false, the title is hidden even if set.\n * @availableWhen type!=Inactive\n */\n @property({type: Boolean, attribute: false}) showTitle: boolean = true;\n\n /**\n * Whether to show the description.\n * If false, the description is hidden even if set.\n * @availableWhen type!=Inactive\n */\n @property({type: Boolean, attribute: false}) showDescription: boolean = true;\n\n /**\n * Whether to show the primary timestamp.\n * If false, the `time` slot is not rendered.\n * @availableWhen type!=Inactive\n */\n @property({type: Boolean, attribute: false}) showTimestamp: boolean = true;\n\n /**\n * Whether to show the secondary timestamp.\n * If true, the `time-secondary` slot is rendered.\n * @availableWhen type!=Inactive\n */\n @property({type: Boolean}) hasTimestamp2 = false;\n\n /**\n * Whether to show the secondary icon overlay.\n * If true, the `secondary-icon` slot is rendered.\n * @availableWhen type!=Inactive\n */\n @property({type: Boolean}) hasSecondaryIcon = false;\n\n /**\n * Text to display in the empty/inactive state.\n * Shown in the `empty` slot when `type=\"inactive\"` or `empty` is true.\n * @availableWhen type==Inactive\n */\n @property({type: String}) emptyText = 'No active advice';\n\n private get mappedType(): ObcTopbarMessageItemType {\n if (this.type === ObcAdviceMessageItemType.Inactive) {\n return ObcTopbarMessageItemType.Inactive;\n }\n\n switch (this.type) {\n case ObcAdviceMessageItemType.WithButton:\n return ObcTopbarMessageItemType.WithButton;\n case ObcAdviceMessageItemType.WithIconButton:\n return ObcTopbarMessageItemType.WithIconButton;\n case ObcAdviceMessageItemType.Simple:\n return ObcTopbarMessageItemType.Simple;\n default:\n return ObcTopbarMessageItemType.Simple;\n }\n }\n\n /**\n * Fired when the main message area is clicked.\n * @fires message-click\n */\n private handleMessageClick() {\n this.dispatchEvent(new CustomEvent('message-click'));\n }\n\n /**\n * Fired when the action button (text or icon) is clicked.\n * @fires action-click\n */\n private handleActionClick() {\n this.dispatchEvent(new CustomEvent('action-click'));\n }\n\n override render() {\n return html`\n <obc-topbar-message-item\n .type=${this.mappedType}\n .size=${this.size}\n .showTitle=${this.showTitle}\n .showDescription=${this.showDescription}\n .showTimestamp=${this.showTimestamp}\n .hasTimestamp2=${this.hasTimestamp2}\n .hasSecondaryIcon=${this.hasSecondaryIcon}\n @message-click=${this.handleMessageClick}\n @action-click=${this.handleActionClick}\n >\n <obi-notification-advice-active\n slot=\"primary-icon\"\n ></obi-notification-advice-active>\n\n ${this.hasSecondaryIcon\n ? html`<slot name=\"secondary-icon\" slot=\"secondary-icon\"></slot>`\n : nothing}\n ${this.title && this.showTitle\n ? html`<span slot=\"title\">${this.title}</span>`\n : nothing}\n ${this.description && this.showDescription\n ? html`<span slot=\"description\">${this.description}</span>`\n : nothing}\n ${this.time && this.showTimestamp\n ? html`<span slot=\"time\">${this.time}</span>`\n : nothing}\n ${this.timeSecondary && this.hasTimestamp2\n ? html`<span slot=\"time-secondary\">${this.timeSecondary}</span>`\n : nothing}\n ${this.type === ObcAdviceMessageItemType.WithButton\n ? html`<span slot=\"action-text\">${this.actionLabel}</span>`\n : this.type === ObcAdviceMessageItemType.WithIconButton\n ? html`<obi-close-google slot=\"action-icon\"></obi-close-google>`\n : nothing}\n\n <span slot=\"empty\">${this.emptyText}</span>\n </obc-topbar-message-item>\n `;\n }\n\n static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-advice-message-item': ObcAdviceMessageItem;\n }\n}\n"],"names":["ObcAdviceMessageItemType","ObcAdviceMessageItemSize"],"mappings":"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"}
@@ -52,7 +52,7 @@ export declare class ObcAppMenu extends LitElement {
52
52
  * Handles input events from the search field and emits a `search` event with the current value.
53
53
  *
54
54
  * @param e - The input event from the search field.
55
- * @fires {CustomEvent<string>} search - Fired when the search input value changes.
55
+ * @fires search
56
56
  */
57
57
  onSearchInput(e: Event): void;
58
58
  render(): import('lit-html').TemplateResult<1>;
@@ -17,7 +17,7 @@ let ObcAppMenu = class extends LitElement {
17
17
  * Handles input events from the search field and emits a `search` event with the current value.
18
18
  *
19
19
  * @param e - The input event from the search field.
20
- * @fires {CustomEvent<string>} search - Fired when the search input value changes.
20
+ * @fires search
21
21
  */
22
22
  onSearchInput(e) {
23
23
  this.dispatchEvent(
@@ -1 +1 @@
1
- {"version":3,"file":"app-menu.js","sources":["../../../src/components/app-menu/app-menu.ts"],"sourcesContent":["import {customElement} from '../../decorator.js';\nimport {LitElement, html, unsafeCSS} from 'lit';\nimport compentStyle from './app-menu.css?inline';\nimport '../text-input-field/text-input-field.js';\nimport '../app-button/app-button.js';\nimport '../../icons/icon-search.js';\n\n/**\n * `<obc-app-menu>` – A vertical application menu component with integrated search and customizable app buttons.\n *\n * Provides a structured container for displaying a grid of application buttons, typically used for quick navigation or launching key features. Includes a built-in search input at the top to filter or locate specific applications within the menu.\n *\n * ### Features\n * - **Integrated Search:** Includes a search field with a leading icon, allowing users to filter or search for menu items.\n * - **Customizable Content:** Uses a default slot to accept any number of `<obc-app-button>` elements or other custom content.\n * - **Grid Layout:** Arranges child buttons in a responsive grid (4 columns by default) for efficient use of space.\n * - **Icon Support:** Each app button can display an icon via its own slot, supporting a wide range of visual representations.\n * - **Event Emission:** Dispatches a `search` event whenever the search input changes, enabling live filtering or external handling.\n *\n * ### Usage Guidelines\n * Use `<obc-app-menu>` to present a collection of application shortcuts, tools, or frequently accessed features in a compact, visually organized menu. Ideal for dashboards, launchers, or side panels where users need to quickly access multiple apps or modules.\n *\n * The search input is intended for filtering the visible buttons or triggering search-related logic externally. Place `<obc-app-button>` elements as children to represent each app or function.\n *\n * **TODO(designer):** Clarify if the menu is intended only for application launchers, or if it can be used for other grouped actions. Also, specify any recommended maximum number of buttons or best practices for grouping.\n *\n * ### Slots\n * | Slot Name | Renders When... | Purpose |\n * |-----------|-----------------|---------|\n * | (default) | Always | Place one or more `<obc-app-button>` elements or custom content to populate the menu grid. |\n *\n * ### Events\n * - `search` – Fired whenever the user types in the search input. The event's `detail` contains the current input value.\n *\n * ### Example\n * ```\n * <obc-app-menu>\n * <obc-app-button label=\"Radar\" checked>\n * <obi-placeholder slot=\"icon\"></obi-placeholder>\n * </obc-app-button>\n * <obc-app-button label=\"Maps\">\n * <obi-placeholder slot=\"icon\"></obi-placeholder>\n * </obc-app-button>\n * <!-- More app buttons... -->\n * </obc-app-menu>\n * ```\n * In this example, the menu displays a search bar and a grid of app buttons, each with an icon.\n *\n * @slot - Default slot for app buttons or custom menu items\n * @fires {CustomEvent<string>} search - Fired when the search input value changes, with the current value in `detail`.\n * @stable\n */\n@customElement('obc-app-menu')\nexport class ObcAppMenu extends LitElement {\n /**\n * Handles input events from the search field and emits a `search` event with the current value.\n *\n * @param e - The input event from the search field.\n * @fires {CustomEvent<string>} search - Fired when the search input value changes.\n */\n onSearchInput(e: Event) {\n this.dispatchEvent(\n new CustomEvent('search', {detail: (e.target as HTMLInputElement).value})\n );\n }\n\n override render() {\n return html`\n <div class=\"card\">\n <obc-text-input-field\n placeholder=\"Search\"\n @input=${this.onSearchInput}\n hasLeadingIcon\n >\n <obi-search slot=\"leading-icon\"></obi-search>\n </obc-text-input-field>\n <div class=\"main-apps\">\n <slot></slot>\n </div>\n </div>\n `;\n }\n\n static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-app-menu': ObcAppMenu;\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAqDO,IAAM,aAAN,cAAyB,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOzC,cAAc,GAAU;AACtB,SAAK;AAAA,MACH,IAAI,YAAY,UAAU,EAAC,QAAS,EAAE,OAA4B,OAAM;AAAA,IAAA;AAAA,EAE5E;AAAA,EAES,SAAS;AAChB,WAAO;AAAA;AAAA;AAAA;AAAA,mBAIQ,KAAK,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUnC;AAGF;AA/Ba,WA8BK,SAAS,UAAU,YAAY;AA9BpC,aAAN,gBAAA;AAAA,EADN,cAAc,cAAc;AAAA,GAChB,UAAA;"}
1
+ {"version":3,"file":"app-menu.js","sources":["../../../src/components/app-menu/app-menu.ts"],"sourcesContent":["import {customElement} from '../../decorator.js';\nimport {LitElement, html, unsafeCSS} from 'lit';\nimport compentStyle from './app-menu.css?inline';\nimport '../text-input-field/text-input-field.js';\nimport '../app-button/app-button.js';\nimport '../../icons/icon-search.js';\n\n/**\n * `<obc-app-menu>` – A vertical application menu component with integrated search and customizable app buttons.\n *\n * Provides a structured container for displaying a grid of application buttons, typically used for quick navigation or launching key features. Includes a built-in search input at the top to filter or locate specific applications within the menu.\n *\n * ### Features\n * - **Integrated Search:** Includes a search field with a leading icon, allowing users to filter or search for menu items.\n * - **Customizable Content:** Uses a default slot to accept any number of `<obc-app-button>` elements or other custom content.\n * - **Grid Layout:** Arranges child buttons in a responsive grid (4 columns by default) for efficient use of space.\n * - **Icon Support:** Each app button can display an icon via its own slot, supporting a wide range of visual representations.\n * - **Event Emission:** Dispatches a `search` event whenever the search input changes, enabling live filtering or external handling.\n *\n * ### Usage Guidelines\n * Use `<obc-app-menu>` to present a collection of application shortcuts, tools, or frequently accessed features in a compact, visually organized menu. Ideal for dashboards, launchers, or side panels where users need to quickly access multiple apps or modules.\n *\n * The search input is intended for filtering the visible buttons or triggering search-related logic externally. Place `<obc-app-button>` elements as children to represent each app or function.\n *\n * **TODO(designer):** Clarify if the menu is intended only for application launchers, or if it can be used for other grouped actions. Also, specify any recommended maximum number of buttons or best practices for grouping.\n *\n * ### Slots\n * | Slot Name | Renders When... | Purpose |\n * |-----------|-----------------|---------|\n * | (default) | Always | Place one or more `<obc-app-button>` elements or custom content to populate the menu grid. |\n *\n * ### Events\n * - `search` – Fired whenever the user types in the search input. The event's `detail` contains the current input value.\n *\n * ### Example\n * ```\n * <obc-app-menu>\n * <obc-app-button label=\"Radar\" checked>\n * <obi-placeholder slot=\"icon\"></obi-placeholder>\n * </obc-app-button>\n * <obc-app-button label=\"Maps\">\n * <obi-placeholder slot=\"icon\"></obi-placeholder>\n * </obc-app-button>\n * <!-- More app buttons... -->\n * </obc-app-menu>\n * ```\n * In this example, the menu displays a search bar and a grid of app buttons, each with an icon.\n *\n * @slot - Default slot for app buttons or custom menu items\n * @fires {CustomEvent<string>} search - Fired when the search input value changes, with the current value in `detail`.\n * @stable\n */\n@customElement('obc-app-menu')\nexport class ObcAppMenu extends LitElement {\n /**\n * Handles input events from the search field and emits a `search` event with the current value.\n *\n * @param e - The input event from the search field.\n * @fires search\n */\n onSearchInput(e: Event) {\n this.dispatchEvent(\n new CustomEvent('search', {detail: (e.target as HTMLInputElement).value})\n );\n }\n\n override render() {\n return html`\n <div class=\"card\">\n <obc-text-input-field\n placeholder=\"Search\"\n @input=${this.onSearchInput}\n hasLeadingIcon\n >\n <obi-search slot=\"leading-icon\"></obi-search>\n </obc-text-input-field>\n <div class=\"main-apps\">\n <slot></slot>\n </div>\n </div>\n `;\n }\n\n static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-app-menu': ObcAppMenu;\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAqDO,IAAM,aAAN,cAAyB,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOzC,cAAc,GAAU;AACtB,SAAK;AAAA,MACH,IAAI,YAAY,UAAU,EAAC,QAAS,EAAE,OAA4B,OAAM;AAAA,IAAA;AAAA,EAE5E;AAAA,EAES,SAAS;AAChB,WAAO;AAAA;AAAA;AAAA;AAAA,mBAIQ,KAAK,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUnC;AAGF;AA/Ba,WA8BK,SAAS,UAAU,YAAY;AA9BpC,aAAN,gBAAA;AAAA,EADN,cAAc,cAAc;AAAA,GAChB,UAAA;"}
@@ -168,12 +168,14 @@ export declare class ObcBrillianceMenu extends LitElement {
168
168
  showScreenControlLink: boolean;
169
169
  willUpdate(_changed: Map<string, unknown>): void;
170
170
  /**
171
- * @fires palette-changed - Handles palette selection changes and emits `palette-changed`.
171
+ * Handles palette selection changes and emits `palette-changed`.
172
+ * @fires palette-changed
172
173
  * @param {CustomEvent} event
173
174
  */
174
175
  onPaletteChanged(event: CustomEvent): void;
175
176
  /**
176
- * @fires brightness-changed - Handles brightness slider changes and emits `brightness-changed`.
177
+ * Handles brightness slider changes and emits `brightness-changed`.
178
+ * @fires brightness-changed
177
179
  * @param {CustomEvent} event
178
180
  */
179
181
  handleBrightnessChanged(event: CustomEvent): void;
@@ -181,12 +183,14 @@ export declare class ObcBrillianceMenu extends LitElement {
181
183
  get canIncreaseBrightness(): boolean;
182
184
  get canDecreaseBrightness(): boolean;
183
185
  /**
184
- * @fires link-palette-changed - Handles link palette changes and emits `link-palette-changed`.
186
+ * Handles link palette changes and emits `link-palette-changed`.
187
+ * @fires link-palette-changed
185
188
  * @param {CustomEvent} event
186
189
  */
187
190
  onLinkPaletteChanged(event: CustomEvent): void;
188
191
  /**
189
- * @fires link-brightness-changed - Handles link brightness changes and emits `link-brightness-changed`.
192
+ * Handles link brightness changes and emits `link-brightness-changed`.
193
+ * @fires link-brightness-changed
190
194
  * @param {CustomEvent} event
191
195
  */
192
196
  onLinkBrightnessChanged(event: CustomEvent): void;
@@ -1 +1 @@
1
- {"version":3,"file":"brilliance-menu.d.ts","sourceRoot":"","sources":["../../../src/components/brilliance-menu/brilliance-menu.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"brilliance-menu.d.ts","sourceRoot":"","sources":["../../../src/components/brilliance-menu/brilliance-menu.ts"],"names":[],"mappings":"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"}
@@ -90,7 +90,8 @@ let ObcBrillianceMenu = class extends LitElement {
90
90
  }
91
91
  }
92
92
  /**
93
- * @fires palette-changed - Handles palette selection changes and emits `palette-changed`.
93
+ * Handles palette selection changes and emits `palette-changed`.
94
+ * @fires palette-changed
94
95
  * @param {CustomEvent} event
95
96
  */
96
97
  onPaletteChanged(event) {
@@ -102,7 +103,8 @@ let ObcBrillianceMenu = class extends LitElement {
102
103
  );
103
104
  }
104
105
  /**
105
- * @fires brightness-changed - Handles brightness slider changes and emits `brightness-changed`.
106
+ * Handles brightness slider changes and emits `brightness-changed`.
107
+ * @fires brightness-changed
106
108
  * @param {CustomEvent} event
107
109
  */
108
110
  handleBrightnessChanged(event) {
@@ -131,7 +133,8 @@ let ObcBrillianceMenu = class extends LitElement {
131
133
  return this.brightness > 0;
132
134
  }
133
135
  /**
134
- * @fires link-palette-changed - Handles link palette changes and emits `link-palette-changed`.
136
+ * Handles link palette changes and emits `link-palette-changed`.
137
+ * @fires link-palette-changed
135
138
  * @param {CustomEvent} event
136
139
  */
137
140
  onLinkPaletteChanged(event) {
@@ -142,7 +145,8 @@ let ObcBrillianceMenu = class extends LitElement {
142
145
  );
143
146
  }
144
147
  /**
145
- * @fires link-brightness-changed - Handles link brightness changes and emits `link-brightness-changed`.
148
+ * Handles link brightness changes and emits `link-brightness-changed`.
149
+ * @fires link-brightness-changed
146
150
  * @param {CustomEvent} event
147
151
  */
148
152
  onLinkBrightnessChanged(event) {
@@ -1 +1 @@
1
- {"version":3,"file":"brilliance-menu.js","sources":["../../../src/components/brilliance-menu/brilliance-menu.ts"],"sourcesContent":["import {HTMLTemplateResult, LitElement, html, nothing, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport componentStyle from './brilliance-menu.css?inline';\nimport '../button/button.js';\nimport '../slider/slider.js';\nimport '../toggle-switch/toggle-switch.js';\nimport '../toggle-button-group/toggle-button-group.js';\nimport '../toggle-button-option/toggle-button-option.js';\nimport '../../icons/icon-display-brilliance-low.js';\nimport '../../icons/icon-display-brilliance-proposal.js';\nimport '../../icons/icon-palette-night.js';\nimport '../../icons/icon-palette-dusk.js';\nimport '../../icons/icon-palette-day.js';\nimport '../../icons/icon-palette-day-bright.js';\nimport '../../icons/icon-link.js';\nimport '../../icons/icon-chevron-double-right-google.js';\nimport '../../icons/icon-chevron-double-left-google.js';\nimport '../../icons/icon-chevron-left-google.js';\nimport '../../icons/icon-chevron-right-google.js';\nimport '../../icons/icon-screen-desk.js';\n\nimport {localized, msg} from '@lit/localize';\nimport {customElement} from '../../decorator.js';\nimport {\n ObcToggleButtonOptionType,\n ObcToggleButtonOptionVariant,\n} from '../toggle-button-option/toggle-button-option.js';\nimport {ObcSliderVariant} from '../slider/slider.js';\nimport {ObcToggleSwitch} from '../toggle-switch/toggle-switch.js';\nimport '../progress-indicator-dots/progress-indicator-dots.js';\nimport '../navigation-item/navigation-item.js';\nimport '../app-button/app-button.js';\nimport '../user-button/user-button.js';\nimport '../tabbed-card/tabbed-card.js';\nimport '../../icons/icon-display-brilliance-iec.js';\nimport '../../icons/icon-palette-day-night-iec.js';\n\nexport enum ObcPalette {\n night = 'night',\n dusk = 'dusk',\n day = 'day',\n bright = 'bright',\n}\n\nexport enum ObcBrillianceMenuVariant {\n normal = 'normal',\n compact = 'compact',\n tabbed = 'tabbed',\n}\n\nexport enum ObcBrillianceInputVariant {\n buttons = 'buttons',\n slider = 'slider',\n}\n\nexport type ObcPaletteChangeEvent = CustomEvent<{value: ObcPalette}>;\nexport type ObcBrightnessChangeEvent = CustomEvent<{value: number}>;\nexport type ObcLinkPaletteChangeEvent = CustomEvent<{value: boolean}>;\nexport type ObcLinkBrightnessChangeEvent = CustomEvent<{value: boolean}>;\n\n/**\n * Event fired when the palette is changed.\n * @typedef {CustomEvent<{value: ObcPalette}>} ObcPaletteChangeEvent\n */\n\n/**\n * Event fired when the brightness is changed.\n * @typedef {CustomEvent<{value: number}>} ObcBrightnessChangeEvent\n */\n\n/**\n * `<obc-brilliance-menu>` – A settings menu component for adjusting display palette and brightness.\n *\n * Provides a combined interface for users to select a color palette (night, dusk, day, bright) and adjust screen brightness. Includes options for toggling automatic palette and brightness modes. Designed for quick access to visual environment controls in applications where adaptable display settings are important.\n *\n * ### Features\n * - **Palette Selection:** Choose between four preset palettes: night, dusk, day, and bright. Each palette is represented by an icon.\n * - **Brightness Control:** Adjustable slider for fine-tuning brightness from 0 to 100. Optionally displays left/right icons for low and high brilliance.\n * - **Auto Modes:** Optional toggles for enabling automatic palette switching and automatic brightness adjustment.\n * - **Configurable Visibility:** Brightness controls and auto toggles can be shown or hidden via properties.\n * - **Responsive Layout:** Arranged in a card-style panel for use in settings menus or overlays.\n *\n * ### Variants\n * - **Palette:** Four options—`night`, `dusk`, `day`, `bright`. Each is visually distinct and selectable via toggle button group.\n * - **Auto Toggles:** `showAutoBrightness` and `showAutoPalette` properties control the presence of auto mode switches.\n * - **Show Brightness:** The `showBrightness` property controls whether the brightness slider and auto brightness toggle are visible.\n *\n * ### Usage Guidelines\n * Use `obc-brilliance-menu` in settings panels or overlays where users need to quickly adjust display appearance. Ideal for scenarios requiring rapid adaptation to changing lighting conditions or user preferences.\n * **TODO(designer):** Confirm if there are recommended default palette/brightness settings, and clarify intended use cases for auto toggles versus manual controls.\n *\n * ### Properties and Configuration\n * - `palette` (`ObcPalette`): The currently selected palette. Accepts `'night'`, `'dusk'`, `'day'`, or `'bright'`. Defaults to `'day'`.\n * - `brightness` (`number`): Current brightness value (0–100). Defaults to `50`.\n * - `showAutoBrightness` (`boolean`): If true, displays the auto brightness toggle.\n * - `showAutoPalette` (`boolean`): If true, displays the auto palette toggle.\n * - `showBrightness` (`boolean`): If true, shows the brightness slider and auto brightness toggle.\n *\n * ### Events\n * - `palette-changed` – Fired when the user selects a new palette. Event detail: `{ value: ObcPalette }`\n * - `brightness-changed` – Fired when the brightness slider is adjusted. Event detail: `{ value: number }`\n *\n * ### Example\n * ```html\n * <obc-brilliance-menu\n * palette=\"dusk\"\n * brightness=\"75\"\n * showAutoBrightness\n * showAutoPalette\n * ></obc-brilliance-menu>\n * ```\n * In this example, both auto toggles are visible, the palette is set to dusk, and brightness is set to 75.\n *\n * @fires {ObcPaletteChangeEvent} palette-changed - When the palette is changed\n * @fires {ObcBrightnessChangeEvent} brightness-changed - When the brightness is changed\n * @fires {ObcLinkPaletteChangeEvent} link-palette-changed - When the link palette toggle is changed\n * @fires {ObcLinkBrightnessChangeEvent} link-brightness-changed - When the link brightness toggle is changed\n * @fires {CustomEvent} screen-control-link-clicked - When the screen control link is clicked\n */\n@localized()\n/**\n * @stable\n */\n@customElement('obc-brilliance-menu')\nexport class ObcBrillianceMenu extends LitElement {\n /**\n * The currently selected palette. Possible values: `'night'`, `'dusk'`, `'day'`, `'bright'`.\n * Defaults to `'day'`.\n */\n @property({type: String}) palette: ObcPalette = ObcPalette.day;\n\n /**\n * The current brightness value (0–100). Defaults to `50`.\n */\n @property({type: Number}) brightness = 50;\n\n /**\n * If true, displays the link brightness toggle below the brightness slider.\n */\n @property({type: Boolean})\n showLinkBrightness = false;\n\n /**\n * If true, displays the link palette toggle below the palette selector.\n */\n @property({type: Boolean}) showLinkPalette = false;\n\n /**\n * If true, shows the brightness slider and auto brightness toggle in the menu.\n */\n @property({type: Boolean, attribute: false}) showBrightness = true;\n\n /**\n * If true, shows the palette selector and link palette toggle in the menu.\n */\n @property({type: Boolean, attribute: false}) showPalette = true;\n\n @property({type: Boolean, attribute: false}) showNightPalette = true;\n @property({type: Boolean, attribute: false}) showDuskPalette = true;\n @property({type: Boolean, attribute: false}) showDayPalette = true;\n @property({type: Boolean, attribute: false}) showBrightPalette = true;\n\n /**\n * The variant of the menu. Possible values: `'normal'`, `'compact'`.\n * Defaults to `'normal'`.\n */\n @property({type: String}) variant = ObcBrillianceMenuVariant.normal;\n\n /**\n * The unit of the brightness value.\n */\n @property({type: String}) brightnessUnit = '%';\n\n /**\n * The maximum value of the brightness slider.\n */\n @property({type: Number}) brightnessMax = 100;\n\n /**\n * The minor step of the brightness slider.\n */\n @property({type: Number}) brightnessMinorStep = 5;\n\n /**\n * The major step of the brightness slider.\n */\n @property({type: Number}) brightnessMajorStep = 25;\n\n /**\n * The variant of the brightness input.\n */\n @property({type: String}) brightnessInputVariant =\n ObcBrillianceInputVariant.buttons;\n\n /**\n * If true, displays the screen control link.\n */\n @property({type: Boolean}) showScreenControlLink = false;\n\n override willUpdate(_changed: Map<string, unknown>) {\n if (this.showPalette) {\n const available = this.availablePalettes;\n if (available.length > 0 && !available.includes(this.palette)) {\n this.palette = available[0];\n this.dispatchEvent(\n new CustomEvent('palette-changed', {\n detail: {value: this.palette},\n })\n );\n }\n }\n }\n\n /**\n * @fires palette-changed - Handles palette selection changes and emits `palette-changed`.\n * @param {CustomEvent} event\n */\n onPaletteChanged(event: CustomEvent) {\n this.palette = event.detail.value;\n this.dispatchEvent(\n new CustomEvent('palette-changed', {\n detail: {value: event.detail.value},\n })\n );\n }\n\n /**\n * @fires brightness-changed - Handles brightness slider changes and emits `brightness-changed`.\n * @param {CustomEvent} event\n */\n handleBrightnessChanged(event: CustomEvent) {\n this.brightness = event.detail;\n this.dispatchEvent(\n new CustomEvent('brightness-changed', {\n detail: {value: event.detail},\n })\n );\n }\n\n increaseBrightness(step: number) {\n this.brightness = Math.max(\n 0,\n Math.min(this.brightness + step, this.brightnessMax)\n );\n this.dispatchEvent(\n new CustomEvent('brightness-changed', {\n detail: {value: this.brightness},\n })\n );\n }\n\n get canIncreaseBrightness() {\n return this.brightness < this.brightnessMax;\n }\n\n get canDecreaseBrightness() {\n return this.brightness > 0;\n }\n\n /**\n * @fires link-palette-changed - Handles link palette changes and emits `link-palette-changed`.\n * @param {CustomEvent} event\n */\n onLinkPaletteChanged(event: CustomEvent) {\n this.dispatchEvent(\n new CustomEvent('link-palette-changed', {\n detail: {value: (event.target as ObcToggleSwitch).checked},\n })\n );\n }\n\n /**\n * @fires link-brightness-changed - Handles link brightness changes and emits `link-brightness-changed`.\n * @param {CustomEvent} event\n */\n onLinkBrightnessChanged(event: CustomEvent) {\n this.dispatchEvent(\n new CustomEvent('link-brightness-changed', {\n detail: {value: (event.target as ObcToggleSwitch).checked},\n })\n );\n }\n\n get availablePalettes(): ObcPalette[] {\n const palettes: ObcPalette[] = [];\n if (this.showNightPalette) palettes.push(ObcPalette.night);\n if (this.showDuskPalette) palettes.push(ObcPalette.dusk);\n if (this.showDayPalette) palettes.push(ObcPalette.day);\n if (this.showBrightPalette) palettes.push(ObcPalette.bright);\n return palettes;\n }\n\n get canIncreasePalette() {\n const palettes = this.availablePalettes;\n const idx = palettes.indexOf(this.palette);\n return idx >= 0 && idx < palettes.length - 1;\n }\n\n get canDecreasePalette() {\n const palettes = this.availablePalettes;\n const idx = palettes.indexOf(this.palette);\n return idx > 0;\n }\n\n nextPalette() {\n if (this.canIncreasePalette) {\n const palettes = this.availablePalettes;\n const idx = palettes.indexOf(this.palette);\n this.palette = palettes[idx + 1];\n this.dispatchEvent(\n new CustomEvent('palette-changed', {\n detail: {value: this.palette},\n })\n );\n }\n }\n\n previousPalette() {\n if (this.canDecreasePalette) {\n const palettes = this.availablePalettes;\n const idx = palettes.indexOf(this.palette);\n this.palette = palettes[idx - 1];\n this.dispatchEvent(\n new CustomEvent('palette-changed', {\n detail: {value: this.palette},\n })\n );\n }\n }\n\n renderBrightness() {\n const title =\n this.variant === ObcBrillianceMenuVariant.tabbed\n ? nothing\n : html`<div class=\"title-container\">\n <h3>${msg('Brilliance')}</h3>\n </div>`;\n const valueLength =\n this.brightness.toString().length + 0.5 * this.brightnessUnit.length;\n\n return html`${title}\n <div class=\"content-container brilliance\">\n ${this.variant === ObcBrillianceMenuVariant.compact\n ? html` <obc-slider\n value=${this.brightness}\n @value=${this.handleBrightnessChanged}\n min=\"0\"\n max=${this.brightnessMax}\n variant=${ObcSliderVariant.Normal}\n haslefticon\n hasrighticon\n >\n <obi-display-brilliance-low\n slot=\"icon-left\"\n ></obi-display-brilliance-low>\n <obi-display-brilliance-proposal\n slot=\"icon-right\"\n ></obi-display-brilliance-proposal>\n </obc-slider>`\n : html`\n <div class=\"value-container\">\n <div class=\"value-label-container\">\n <obi-display-brilliance-proposal\n class=\"icon\"\n ></obi-display-brilliance-proposal>\n <div class=\"label-container\" style=\"width: ${valueLength}ch\">\n <div class=\"value\">${this.brightness.toFixed(0)}</div>\n <div class=\"unit\">${this.brightnessUnit}</div>\n </div>\n </div>\n <div class=\"value-slider-container\">\n ${this.brightnessInputVariant ===\n ObcBrillianceInputVariant.buttons\n ? html`\n <obc-slider\n value=${this.brightness}\n variant=${ObcSliderVariant.NoInput}\n min=\"0\"\n max=${this.brightnessMax}\n ></obc-slider>\n `\n : html`\n <obc-slider\n value=${this.brightness}\n variant=${ObcSliderVariant.Enhanced}\n @value=${this.handleBrightnessChanged}\n min=\"0\"\n max=${this.brightnessMax}\n ></obc-slider>\n `}\n </div>\n </div>\n ${this.brightnessInputVariant ===\n ObcBrillianceInputVariant.buttons\n ? html`\n <div class=\"icon-button-container\">\n <obc-button\n segmentPosition=\"start\"\n fullWidth\n ?disabled=${!this.canDecreaseBrightness}\n class=${this.canDecreaseBrightness ? '' : 'disabled'}\n @click=${() =>\n this.increaseBrightness(-this.brightnessMajorStep)}\n >\n <obi-chevron-double-left-google\n class=\"btn-icon\"\n ></obi-chevron-double-left-google>\n </obc-button>\n <obc-button\n segmentPosition=\"middle\"\n fullWidth\n ?disabled=${!this.canDecreaseBrightness}\n class=${this.canDecreaseBrightness ? '' : 'disabled'}\n @click=${() =>\n this.increaseBrightness(-this.brightnessMinorStep)}\n >\n <obi-chevron-left-google\n class=\"btn-icon\"\n ></obi-chevron-left-google>\n </obc-button>\n <obc-button\n segmentPosition=\"middle\"\n fullWidth\n ?disabled=${!this.canIncreaseBrightness}\n class=${this.canIncreaseBrightness ? '' : 'disabled'}\n @click=${() =>\n this.increaseBrightness(this.brightnessMinorStep)}\n >\n <obi-chevron-right-google\n class=\"btn-icon\"\n ></obi-chevron-right-google>\n </obc-button>\n <obc-button\n segmentPosition=\"end\"\n fullWidth\n ?disabled=${!this.canIncreaseBrightness}\n class=${this.canIncreaseBrightness ? '' : 'disabled'}\n @click=${() =>\n this.increaseBrightness(this.brightnessMajorStep)}\n >\n <obi-chevron-double-right-google\n class=\"btn-icon\"\n ></obi-chevron-double-right-google>\n </obc-button>\n </div>\n `\n : nothing}\n `}\n ${this.showLinkBrightness\n ? html`<obc-toggle-switch\n .label=\"${msg('Link')}\"\n hasicon\n @input=${this.onLinkBrightnessChanged}\n >\n <obi-link slot=\"icon\"></obi-link>\n </obc-toggle-switch>`\n : nothing}\n </div>`;\n }\n\n get effectivePalette() {\n const palettes = this.availablePalettes;\n return palettes.includes(this.palette) ? this.palette : palettes[0];\n }\n\n get paletteIcon() {\n if (this.effectivePalette === ObcPalette.night) {\n return html`<obi-palette-night class=\"icon\"></obi-palette-night>`;\n } else if (this.effectivePalette === ObcPalette.dusk) {\n return html`<obi-palette-dusk class=\"icon\"></obi-palette-dusk>`;\n } else if (this.effectivePalette === ObcPalette.day) {\n return html`<obi-palette-day class=\"icon\"></obi-palette-day>`;\n } else if (this.effectivePalette === ObcPalette.bright) {\n return html`<obi-palette-day-bright\n class=\"icon\"\n ></obi-palette-day-bright>`;\n } else {\n return nothing;\n }\n }\n\n private paletteOptions(): HTMLTemplateResult[] {\n const out = [];\n if (this.showNightPalette)\n out.push(\n html`<obc-toggle-button-option value=\"night\" type=\"icon\">\n <obi-palette-night slot=\"icon\"></obi-palette-night>\n </obc-toggle-button-option>`\n );\n if (this.showDuskPalette)\n out.push(\n html`<obc-toggle-button-option value=\"dusk\" type=\"icon\">\n <obi-palette-dusk slot=\"icon\"></obi-palette-dusk>\n </obc-toggle-button-option>`\n );\n if (this.showDayPalette)\n out.push(\n html`<obc-toggle-button-option value=\"day\" type=\"icon\">\n <obi-palette-day slot=\"icon\"></obi-palette-day>\n </obc-toggle-button-option>`\n );\n if (this.showBrightPalette)\n out.push(\n html`<obc-toggle-button-option value=\"bright\" type=\"icon\">\n <obi-palette-day-bright slot=\"icon\"></obi-palette-day-bright>\n </obc-toggle-button-option>`\n );\n return out;\n }\n\n renderPalette() {\n const palettes = this.availablePalettes;\n if (palettes.length === 0) return nothing;\n\n const paletteNames: Record<ObcPalette, string> = {\n [ObcPalette.night]: msg('Night'),\n [ObcPalette.dusk]: msg('Dusk'),\n [ObcPalette.day]: msg('Day'),\n [ObcPalette.bright]: msg('Bright'),\n };\n const currentPaletteName = paletteNames[this.effectivePalette];\n const valueLength = currentPaletteName.length;\n const index = palettes.indexOf(this.effectivePalette);\n const nextIndex = Math.min(index + 1, palettes.length - 1);\n const previousIndex = Math.max(index - 1, 0);\n const nextPalette = paletteNames[palettes[nextIndex]];\n const previousPalette = paletteNames[palettes[previousIndex]];\n\n return html`\n ${this.variant === ObcBrillianceMenuVariant.tabbed\n ? nothing\n : html`\n <div class=\"title-container\">\n <h3>${msg('Day')}/${msg('Night')}</h3>\n </div>\n `}\n <div\n class=\"content-container palette ${this.showLinkPalette\n ? 'with-link'\n : 'without-link'}\"\n >\n ${this.variant === ObcBrillianceMenuVariant.compact\n ? html` <obc-toggle-button-group\n value=${this.effectivePalette}\n @value=${this.onPaletteChanged}\n variant=${ObcToggleButtonOptionVariant.regular}\n type=${ObcToggleButtonOptionType.icon}\n >\n ${this.paletteOptions()}\n </obc-toggle-button-group>`\n : html`\n <div class=\"value-container\">\n <div class=\"value-label-container\">\n ${this.paletteIcon}\n <div class=\"label-container\" style=\"width: ${valueLength}ch\">\n <div class=\"value\">${currentPaletteName}</div>\n </div>\n </div>\n <obc-progress-indicator-dots\n .totalSteps=${palettes.length}\n .currentStep=${index + 1}\n ></obc-progress-indicator-dots>\n </div>\n <div class=\"icon-button-container\">\n <obc-button\n segmentPosition=\"start\"\n fullWidth\n showLeadingIcon\n ?disabled=${!this.canDecreasePalette}\n class=${this.canDecreasePalette ? '' : 'disabled'}\n @click=${() => this.previousPalette()}\n >\n ${previousPalette}\n <obi-chevron-left-google\n slot=\"leading-icon\"\n ></obi-chevron-left-google>\n </obc-button>\n\n <obc-button\n segmentPosition=\"end\"\n fullWidth\n showTrailingIcon\n ?disabled=${!this.canIncreasePalette}\n class=${this.canIncreasePalette ? '' : 'disabled'}\n @click=${() => this.nextPalette()}\n >\n ${nextPalette}\n <obi-chevron-right-google\n slot=\"trailing-icon\"\n ></obi-chevron-right-google>\n </obc-button>\n </div>\n `}\n ${this.showLinkPalette\n ? html`<obc-toggle-switch\n .label=\"${msg('Link')}\"\n hasicon\n @input=${this.onLinkPaletteChanged}\n >\n <obi-link slot=\"icon\"></obi-link>\n </obc-toggle-switch>`\n : nothing}\n </div>\n `;\n }\n\n renderScreenControlLink() {\n if (!this.showScreenControlLink) {\n return nothing;\n }\n return html`\n <div class=\"footer\">\n <obc-navigation-item\n .label=\"${msg('Screen Control')}\"\n @click=${() => this.handleScreenControlLinkClicked()}\n hasicon\n >\n <obc-user-button slot=\"icon\" static variant=\"icon\" styleType=\"normal\">\n <obi-screen-desk slot=\"icon\"></obi-screen-desk>\n </obc-user-button>\n </obc-navigation-item>\n </div>\n `;\n }\n\n override render() {\n if (this.variant === ObcBrillianceMenuVariant.tabbed) {\n return html`<obc-tabbed-card class=\"card\" nTabs=${2} hasTabIcons>\n <span slot=\"tab-title-0\">${msg('Brilliance')}</span>\n <obi-display-brilliance-iec\n slot=\"tab-icon-0\"\n ></obi-display-brilliance-iec>\n <span slot=\"tab-title-1\">${msg('Day')}/${msg('Night')}</span>\n <obi-palette-day-night-iec\n slot=\"tab-icon-1\"\n ></obi-palette-day-night-iec>\n <div slot=\"tab-content-0\">\n ${this.renderBrightness()} ${this.renderScreenControlLink()}\n </div>\n <div slot=\"tab-content-1\">\n ${this.renderPalette()} ${this.renderScreenControlLink()}\n </div>\n </obc-tabbed-card>`;\n } else {\n return html`\n <div class=\"card ${this.variant}\">\n ${this.showBrightness ? this.renderBrightness() : nothing}\n ${this.showBrightness && this.showPalette\n ? html`<div class=\"divider\"></div>`\n : nothing}\n ${this.showPalette ? this.renderPalette() : nothing}\n ${this.renderScreenControlLink()}\n </div>\n `;\n }\n }\n\n handleScreenControlLinkClicked() {\n this.dispatchEvent(new CustomEvent('screen-control-link-clicked'));\n }\n\n static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-brilliance-menu': ObcBrillianceMenu;\n }\n}\n"],"names":["ObcPalette","ObcBrillianceMenuVariant","ObcBrillianceInputVariant"],"mappings":"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"}
1
+ {"version":3,"file":"brilliance-menu.js","sources":["../../../src/components/brilliance-menu/brilliance-menu.ts"],"sourcesContent":["import {HTMLTemplateResult, LitElement, html, nothing, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport componentStyle from './brilliance-menu.css?inline';\nimport '../button/button.js';\nimport '../slider/slider.js';\nimport '../toggle-switch/toggle-switch.js';\nimport '../toggle-button-group/toggle-button-group.js';\nimport '../toggle-button-option/toggle-button-option.js';\nimport '../../icons/icon-display-brilliance-low.js';\nimport '../../icons/icon-display-brilliance-proposal.js';\nimport '../../icons/icon-palette-night.js';\nimport '../../icons/icon-palette-dusk.js';\nimport '../../icons/icon-palette-day.js';\nimport '../../icons/icon-palette-day-bright.js';\nimport '../../icons/icon-link.js';\nimport '../../icons/icon-chevron-double-right-google.js';\nimport '../../icons/icon-chevron-double-left-google.js';\nimport '../../icons/icon-chevron-left-google.js';\nimport '../../icons/icon-chevron-right-google.js';\nimport '../../icons/icon-screen-desk.js';\n\nimport {localized, msg} from '@lit/localize';\nimport {customElement} from '../../decorator.js';\nimport {\n ObcToggleButtonOptionType,\n ObcToggleButtonOptionVariant,\n} from '../toggle-button-option/toggle-button-option.js';\nimport {ObcSliderVariant} from '../slider/slider.js';\nimport {ObcToggleSwitch} from '../toggle-switch/toggle-switch.js';\nimport '../progress-indicator-dots/progress-indicator-dots.js';\nimport '../navigation-item/navigation-item.js';\nimport '../app-button/app-button.js';\nimport '../user-button/user-button.js';\nimport '../tabbed-card/tabbed-card.js';\nimport '../../icons/icon-display-brilliance-iec.js';\nimport '../../icons/icon-palette-day-night-iec.js';\n\nexport enum ObcPalette {\n night = 'night',\n dusk = 'dusk',\n day = 'day',\n bright = 'bright',\n}\n\nexport enum ObcBrillianceMenuVariant {\n normal = 'normal',\n compact = 'compact',\n tabbed = 'tabbed',\n}\n\nexport enum ObcBrillianceInputVariant {\n buttons = 'buttons',\n slider = 'slider',\n}\n\nexport type ObcPaletteChangeEvent = CustomEvent<{value: ObcPalette}>;\nexport type ObcBrightnessChangeEvent = CustomEvent<{value: number}>;\nexport type ObcLinkPaletteChangeEvent = CustomEvent<{value: boolean}>;\nexport type ObcLinkBrightnessChangeEvent = CustomEvent<{value: boolean}>;\n\n/**\n * Event fired when the palette is changed.\n * @typedef {CustomEvent<{value: ObcPalette}>} ObcPaletteChangeEvent\n */\n\n/**\n * Event fired when the brightness is changed.\n * @typedef {CustomEvent<{value: number}>} ObcBrightnessChangeEvent\n */\n\n/**\n * `<obc-brilliance-menu>` – A settings menu component for adjusting display palette and brightness.\n *\n * Provides a combined interface for users to select a color palette (night, dusk, day, bright) and adjust screen brightness. Includes options for toggling automatic palette and brightness modes. Designed for quick access to visual environment controls in applications where adaptable display settings are important.\n *\n * ### Features\n * - **Palette Selection:** Choose between four preset palettes: night, dusk, day, and bright. Each palette is represented by an icon.\n * - **Brightness Control:** Adjustable slider for fine-tuning brightness from 0 to 100. Optionally displays left/right icons for low and high brilliance.\n * - **Auto Modes:** Optional toggles for enabling automatic palette switching and automatic brightness adjustment.\n * - **Configurable Visibility:** Brightness controls and auto toggles can be shown or hidden via properties.\n * - **Responsive Layout:** Arranged in a card-style panel for use in settings menus or overlays.\n *\n * ### Variants\n * - **Palette:** Four options—`night`, `dusk`, `day`, `bright`. Each is visually distinct and selectable via toggle button group.\n * - **Auto Toggles:** `showAutoBrightness` and `showAutoPalette` properties control the presence of auto mode switches.\n * - **Show Brightness:** The `showBrightness` property controls whether the brightness slider and auto brightness toggle are visible.\n *\n * ### Usage Guidelines\n * Use `obc-brilliance-menu` in settings panels or overlays where users need to quickly adjust display appearance. Ideal for scenarios requiring rapid adaptation to changing lighting conditions or user preferences.\n * **TODO(designer):** Confirm if there are recommended default palette/brightness settings, and clarify intended use cases for auto toggles versus manual controls.\n *\n * ### Properties and Configuration\n * - `palette` (`ObcPalette`): The currently selected palette. Accepts `'night'`, `'dusk'`, `'day'`, or `'bright'`. Defaults to `'day'`.\n * - `brightness` (`number`): Current brightness value (0–100). Defaults to `50`.\n * - `showAutoBrightness` (`boolean`): If true, displays the auto brightness toggle.\n * - `showAutoPalette` (`boolean`): If true, displays the auto palette toggle.\n * - `showBrightness` (`boolean`): If true, shows the brightness slider and auto brightness toggle.\n *\n * ### Events\n * - `palette-changed` – Fired when the user selects a new palette. Event detail: `{ value: ObcPalette }`\n * - `brightness-changed` – Fired when the brightness slider is adjusted. Event detail: `{ value: number }`\n *\n * ### Example\n * ```html\n * <obc-brilliance-menu\n * palette=\"dusk\"\n * brightness=\"75\"\n * showAutoBrightness\n * showAutoPalette\n * ></obc-brilliance-menu>\n * ```\n * In this example, both auto toggles are visible, the palette is set to dusk, and brightness is set to 75.\n *\n * @fires {ObcPaletteChangeEvent} palette-changed - When the palette is changed\n * @fires {ObcBrightnessChangeEvent} brightness-changed - When the brightness is changed\n * @fires {ObcLinkPaletteChangeEvent} link-palette-changed - When the link palette toggle is changed\n * @fires {ObcLinkBrightnessChangeEvent} link-brightness-changed - When the link brightness toggle is changed\n * @fires {CustomEvent} screen-control-link-clicked - When the screen control link is clicked\n */\n@localized()\n/**\n * @stable\n */\n@customElement('obc-brilliance-menu')\nexport class ObcBrillianceMenu extends LitElement {\n /**\n * The currently selected palette. Possible values: `'night'`, `'dusk'`, `'day'`, `'bright'`.\n * Defaults to `'day'`.\n */\n @property({type: String}) palette: ObcPalette = ObcPalette.day;\n\n /**\n * The current brightness value (0–100). Defaults to `50`.\n */\n @property({type: Number}) brightness = 50;\n\n /**\n * If true, displays the link brightness toggle below the brightness slider.\n */\n @property({type: Boolean})\n showLinkBrightness = false;\n\n /**\n * If true, displays the link palette toggle below the palette selector.\n */\n @property({type: Boolean}) showLinkPalette = false;\n\n /**\n * If true, shows the brightness slider and auto brightness toggle in the menu.\n */\n @property({type: Boolean, attribute: false}) showBrightness = true;\n\n /**\n * If true, shows the palette selector and link palette toggle in the menu.\n */\n @property({type: Boolean, attribute: false}) showPalette = true;\n\n @property({type: Boolean, attribute: false}) showNightPalette = true;\n @property({type: Boolean, attribute: false}) showDuskPalette = true;\n @property({type: Boolean, attribute: false}) showDayPalette = true;\n @property({type: Boolean, attribute: false}) showBrightPalette = true;\n\n /**\n * The variant of the menu. Possible values: `'normal'`, `'compact'`.\n * Defaults to `'normal'`.\n */\n @property({type: String}) variant = ObcBrillianceMenuVariant.normal;\n\n /**\n * The unit of the brightness value.\n */\n @property({type: String}) brightnessUnit = '%';\n\n /**\n * The maximum value of the brightness slider.\n */\n @property({type: Number}) brightnessMax = 100;\n\n /**\n * The minor step of the brightness slider.\n */\n @property({type: Number}) brightnessMinorStep = 5;\n\n /**\n * The major step of the brightness slider.\n */\n @property({type: Number}) brightnessMajorStep = 25;\n\n /**\n * The variant of the brightness input.\n */\n @property({type: String}) brightnessInputVariant =\n ObcBrillianceInputVariant.buttons;\n\n /**\n * If true, displays the screen control link.\n */\n @property({type: Boolean}) showScreenControlLink = false;\n\n override willUpdate(_changed: Map<string, unknown>) {\n if (this.showPalette) {\n const available = this.availablePalettes;\n if (available.length > 0 && !available.includes(this.palette)) {\n this.palette = available[0];\n this.dispatchEvent(\n new CustomEvent('palette-changed', {\n detail: {value: this.palette},\n })\n );\n }\n }\n }\n\n /**\n * Handles palette selection changes and emits `palette-changed`.\n * @fires palette-changed\n * @param {CustomEvent} event\n */\n onPaletteChanged(event: CustomEvent) {\n this.palette = event.detail.value;\n this.dispatchEvent(\n new CustomEvent('palette-changed', {\n detail: {value: event.detail.value},\n })\n );\n }\n\n /**\n * Handles brightness slider changes and emits `brightness-changed`.\n * @fires brightness-changed\n * @param {CustomEvent} event\n */\n handleBrightnessChanged(event: CustomEvent) {\n this.brightness = event.detail;\n this.dispatchEvent(\n new CustomEvent('brightness-changed', {\n detail: {value: event.detail},\n })\n );\n }\n\n increaseBrightness(step: number) {\n this.brightness = Math.max(\n 0,\n Math.min(this.brightness + step, this.brightnessMax)\n );\n this.dispatchEvent(\n new CustomEvent('brightness-changed', {\n detail: {value: this.brightness},\n })\n );\n }\n\n get canIncreaseBrightness() {\n return this.brightness < this.brightnessMax;\n }\n\n get canDecreaseBrightness() {\n return this.brightness > 0;\n }\n\n /**\n * Handles link palette changes and emits `link-palette-changed`.\n * @fires link-palette-changed\n * @param {CustomEvent} event\n */\n onLinkPaletteChanged(event: CustomEvent) {\n this.dispatchEvent(\n new CustomEvent('link-palette-changed', {\n detail: {value: (event.target as ObcToggleSwitch).checked},\n })\n );\n }\n\n /**\n * Handles link brightness changes and emits `link-brightness-changed`.\n * @fires link-brightness-changed\n * @param {CustomEvent} event\n */\n onLinkBrightnessChanged(event: CustomEvent) {\n this.dispatchEvent(\n new CustomEvent('link-brightness-changed', {\n detail: {value: (event.target as ObcToggleSwitch).checked},\n })\n );\n }\n\n get availablePalettes(): ObcPalette[] {\n const palettes: ObcPalette[] = [];\n if (this.showNightPalette) palettes.push(ObcPalette.night);\n if (this.showDuskPalette) palettes.push(ObcPalette.dusk);\n if (this.showDayPalette) palettes.push(ObcPalette.day);\n if (this.showBrightPalette) palettes.push(ObcPalette.bright);\n return palettes;\n }\n\n get canIncreasePalette() {\n const palettes = this.availablePalettes;\n const idx = palettes.indexOf(this.palette);\n return idx >= 0 && idx < palettes.length - 1;\n }\n\n get canDecreasePalette() {\n const palettes = this.availablePalettes;\n const idx = palettes.indexOf(this.palette);\n return idx > 0;\n }\n\n nextPalette() {\n if (this.canIncreasePalette) {\n const palettes = this.availablePalettes;\n const idx = palettes.indexOf(this.palette);\n this.palette = palettes[idx + 1];\n this.dispatchEvent(\n new CustomEvent('palette-changed', {\n detail: {value: this.palette},\n })\n );\n }\n }\n\n previousPalette() {\n if (this.canDecreasePalette) {\n const palettes = this.availablePalettes;\n const idx = palettes.indexOf(this.palette);\n this.palette = palettes[idx - 1];\n this.dispatchEvent(\n new CustomEvent('palette-changed', {\n detail: {value: this.palette},\n })\n );\n }\n }\n\n renderBrightness() {\n const title =\n this.variant === ObcBrillianceMenuVariant.tabbed\n ? nothing\n : html`<div class=\"title-container\">\n <h3>${msg('Brilliance')}</h3>\n </div>`;\n const valueLength =\n this.brightness.toString().length + 0.5 * this.brightnessUnit.length;\n\n return html`${title}\n <div class=\"content-container brilliance\">\n ${this.variant === ObcBrillianceMenuVariant.compact\n ? html` <obc-slider\n value=${this.brightness}\n @value=${this.handleBrightnessChanged}\n min=\"0\"\n max=${this.brightnessMax}\n variant=${ObcSliderVariant.Normal}\n haslefticon\n hasrighticon\n >\n <obi-display-brilliance-low\n slot=\"icon-left\"\n ></obi-display-brilliance-low>\n <obi-display-brilliance-proposal\n slot=\"icon-right\"\n ></obi-display-brilliance-proposal>\n </obc-slider>`\n : html`\n <div class=\"value-container\">\n <div class=\"value-label-container\">\n <obi-display-brilliance-proposal\n class=\"icon\"\n ></obi-display-brilliance-proposal>\n <div class=\"label-container\" style=\"width: ${valueLength}ch\">\n <div class=\"value\">${this.brightness.toFixed(0)}</div>\n <div class=\"unit\">${this.brightnessUnit}</div>\n </div>\n </div>\n <div class=\"value-slider-container\">\n ${this.brightnessInputVariant ===\n ObcBrillianceInputVariant.buttons\n ? html`\n <obc-slider\n value=${this.brightness}\n variant=${ObcSliderVariant.NoInput}\n min=\"0\"\n max=${this.brightnessMax}\n ></obc-slider>\n `\n : html`\n <obc-slider\n value=${this.brightness}\n variant=${ObcSliderVariant.Enhanced}\n @value=${this.handleBrightnessChanged}\n min=\"0\"\n max=${this.brightnessMax}\n ></obc-slider>\n `}\n </div>\n </div>\n ${this.brightnessInputVariant ===\n ObcBrillianceInputVariant.buttons\n ? html`\n <div class=\"icon-button-container\">\n <obc-button\n segmentPosition=\"start\"\n fullWidth\n ?disabled=${!this.canDecreaseBrightness}\n class=${this.canDecreaseBrightness ? '' : 'disabled'}\n @click=${() =>\n this.increaseBrightness(-this.brightnessMajorStep)}\n >\n <obi-chevron-double-left-google\n class=\"btn-icon\"\n ></obi-chevron-double-left-google>\n </obc-button>\n <obc-button\n segmentPosition=\"middle\"\n fullWidth\n ?disabled=${!this.canDecreaseBrightness}\n class=${this.canDecreaseBrightness ? '' : 'disabled'}\n @click=${() =>\n this.increaseBrightness(-this.brightnessMinorStep)}\n >\n <obi-chevron-left-google\n class=\"btn-icon\"\n ></obi-chevron-left-google>\n </obc-button>\n <obc-button\n segmentPosition=\"middle\"\n fullWidth\n ?disabled=${!this.canIncreaseBrightness}\n class=${this.canIncreaseBrightness ? '' : 'disabled'}\n @click=${() =>\n this.increaseBrightness(this.brightnessMinorStep)}\n >\n <obi-chevron-right-google\n class=\"btn-icon\"\n ></obi-chevron-right-google>\n </obc-button>\n <obc-button\n segmentPosition=\"end\"\n fullWidth\n ?disabled=${!this.canIncreaseBrightness}\n class=${this.canIncreaseBrightness ? '' : 'disabled'}\n @click=${() =>\n this.increaseBrightness(this.brightnessMajorStep)}\n >\n <obi-chevron-double-right-google\n class=\"btn-icon\"\n ></obi-chevron-double-right-google>\n </obc-button>\n </div>\n `\n : nothing}\n `}\n ${this.showLinkBrightness\n ? html`<obc-toggle-switch\n .label=\"${msg('Link')}\"\n hasicon\n @input=${this.onLinkBrightnessChanged}\n >\n <obi-link slot=\"icon\"></obi-link>\n </obc-toggle-switch>`\n : nothing}\n </div>`;\n }\n\n get effectivePalette() {\n const palettes = this.availablePalettes;\n return palettes.includes(this.palette) ? this.palette : palettes[0];\n }\n\n get paletteIcon() {\n if (this.effectivePalette === ObcPalette.night) {\n return html`<obi-palette-night class=\"icon\"></obi-palette-night>`;\n } else if (this.effectivePalette === ObcPalette.dusk) {\n return html`<obi-palette-dusk class=\"icon\"></obi-palette-dusk>`;\n } else if (this.effectivePalette === ObcPalette.day) {\n return html`<obi-palette-day class=\"icon\"></obi-palette-day>`;\n } else if (this.effectivePalette === ObcPalette.bright) {\n return html`<obi-palette-day-bright\n class=\"icon\"\n ></obi-palette-day-bright>`;\n } else {\n return nothing;\n }\n }\n\n private paletteOptions(): HTMLTemplateResult[] {\n const out = [];\n if (this.showNightPalette)\n out.push(\n html`<obc-toggle-button-option value=\"night\" type=\"icon\">\n <obi-palette-night slot=\"icon\"></obi-palette-night>\n </obc-toggle-button-option>`\n );\n if (this.showDuskPalette)\n out.push(\n html`<obc-toggle-button-option value=\"dusk\" type=\"icon\">\n <obi-palette-dusk slot=\"icon\"></obi-palette-dusk>\n </obc-toggle-button-option>`\n );\n if (this.showDayPalette)\n out.push(\n html`<obc-toggle-button-option value=\"day\" type=\"icon\">\n <obi-palette-day slot=\"icon\"></obi-palette-day>\n </obc-toggle-button-option>`\n );\n if (this.showBrightPalette)\n out.push(\n html`<obc-toggle-button-option value=\"bright\" type=\"icon\">\n <obi-palette-day-bright slot=\"icon\"></obi-palette-day-bright>\n </obc-toggle-button-option>`\n );\n return out;\n }\n\n renderPalette() {\n const palettes = this.availablePalettes;\n if (palettes.length === 0) return nothing;\n\n const paletteNames: Record<ObcPalette, string> = {\n [ObcPalette.night]: msg('Night'),\n [ObcPalette.dusk]: msg('Dusk'),\n [ObcPalette.day]: msg('Day'),\n [ObcPalette.bright]: msg('Bright'),\n };\n const currentPaletteName = paletteNames[this.effectivePalette];\n const valueLength = currentPaletteName.length;\n const index = palettes.indexOf(this.effectivePalette);\n const nextIndex = Math.min(index + 1, palettes.length - 1);\n const previousIndex = Math.max(index - 1, 0);\n const nextPalette = paletteNames[palettes[nextIndex]];\n const previousPalette = paletteNames[palettes[previousIndex]];\n\n return html`\n ${this.variant === ObcBrillianceMenuVariant.tabbed\n ? nothing\n : html`\n <div class=\"title-container\">\n <h3>${msg('Day')}/${msg('Night')}</h3>\n </div>\n `}\n <div\n class=\"content-container palette ${this.showLinkPalette\n ? 'with-link'\n : 'without-link'}\"\n >\n ${this.variant === ObcBrillianceMenuVariant.compact\n ? html` <obc-toggle-button-group\n value=${this.effectivePalette}\n @value=${this.onPaletteChanged}\n variant=${ObcToggleButtonOptionVariant.regular}\n type=${ObcToggleButtonOptionType.icon}\n >\n ${this.paletteOptions()}\n </obc-toggle-button-group>`\n : html`\n <div class=\"value-container\">\n <div class=\"value-label-container\">\n ${this.paletteIcon}\n <div class=\"label-container\" style=\"width: ${valueLength}ch\">\n <div class=\"value\">${currentPaletteName}</div>\n </div>\n </div>\n <obc-progress-indicator-dots\n .totalSteps=${palettes.length}\n .currentStep=${index + 1}\n ></obc-progress-indicator-dots>\n </div>\n <div class=\"icon-button-container\">\n <obc-button\n segmentPosition=\"start\"\n fullWidth\n showLeadingIcon\n ?disabled=${!this.canDecreasePalette}\n class=${this.canDecreasePalette ? '' : 'disabled'}\n @click=${() => this.previousPalette()}\n >\n ${previousPalette}\n <obi-chevron-left-google\n slot=\"leading-icon\"\n ></obi-chevron-left-google>\n </obc-button>\n\n <obc-button\n segmentPosition=\"end\"\n fullWidth\n showTrailingIcon\n ?disabled=${!this.canIncreasePalette}\n class=${this.canIncreasePalette ? '' : 'disabled'}\n @click=${() => this.nextPalette()}\n >\n ${nextPalette}\n <obi-chevron-right-google\n slot=\"trailing-icon\"\n ></obi-chevron-right-google>\n </obc-button>\n </div>\n `}\n ${this.showLinkPalette\n ? html`<obc-toggle-switch\n .label=\"${msg('Link')}\"\n hasicon\n @input=${this.onLinkPaletteChanged}\n >\n <obi-link slot=\"icon\"></obi-link>\n </obc-toggle-switch>`\n : nothing}\n </div>\n `;\n }\n\n renderScreenControlLink() {\n if (!this.showScreenControlLink) {\n return nothing;\n }\n return html`\n <div class=\"footer\">\n <obc-navigation-item\n .label=\"${msg('Screen Control')}\"\n @click=${() => this.handleScreenControlLinkClicked()}\n hasicon\n >\n <obc-user-button slot=\"icon\" static variant=\"icon\" styleType=\"normal\">\n <obi-screen-desk slot=\"icon\"></obi-screen-desk>\n </obc-user-button>\n </obc-navigation-item>\n </div>\n `;\n }\n\n override render() {\n if (this.variant === ObcBrillianceMenuVariant.tabbed) {\n return html`<obc-tabbed-card class=\"card\" nTabs=${2} hasTabIcons>\n <span slot=\"tab-title-0\">${msg('Brilliance')}</span>\n <obi-display-brilliance-iec\n slot=\"tab-icon-0\"\n ></obi-display-brilliance-iec>\n <span slot=\"tab-title-1\">${msg('Day')}/${msg('Night')}</span>\n <obi-palette-day-night-iec\n slot=\"tab-icon-1\"\n ></obi-palette-day-night-iec>\n <div slot=\"tab-content-0\">\n ${this.renderBrightness()} ${this.renderScreenControlLink()}\n </div>\n <div slot=\"tab-content-1\">\n ${this.renderPalette()} ${this.renderScreenControlLink()}\n </div>\n </obc-tabbed-card>`;\n } else {\n return html`\n <div class=\"card ${this.variant}\">\n ${this.showBrightness ? this.renderBrightness() : nothing}\n ${this.showBrightness && this.showPalette\n ? html`<div class=\"divider\"></div>`\n : nothing}\n ${this.showPalette ? this.renderPalette() : nothing}\n ${this.renderScreenControlLink()}\n </div>\n `;\n }\n }\n\n handleScreenControlLinkClicked() {\n this.dispatchEvent(new CustomEvent('screen-control-link-clicked'));\n }\n\n static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-brilliance-menu': ObcBrillianceMenu;\n }\n}\n"],"names":["ObcPalette","ObcBrillianceMenuVariant","ObcBrillianceInputVariant"],"mappings":"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"}