@oicl/openbridge-webcomponents 2.0.0-next.57 → 2.0.0-next.59

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 (133) hide show
  1. package/bundle/openbridge-webcomponents.bundle.js +6585 -4581
  2. package/bundle/openbridge-webcomponents.bundle.js.map +1 -1
  3. package/custom-elements.json +1047 -83
  4. package/dist/alert-severity.d.ts +38 -0
  5. package/dist/alert-severity.d.ts.map +1 -0
  6. package/dist/alert-severity.js +176 -0
  7. package/dist/alert-severity.js.map +1 -0
  8. package/dist/ar/building-blocks/poi-header/poi-header.css.js +38 -7
  9. package/dist/ar/building-blocks/poi-header/poi-header.css.js.map +1 -1
  10. package/dist/ar/building-blocks/poi-header/poi-header.d.ts +7 -2
  11. package/dist/ar/building-blocks/poi-header/poi-header.d.ts.map +1 -1
  12. package/dist/ar/building-blocks/poi-header/poi-header.js +5 -0
  13. package/dist/ar/building-blocks/poi-header/poi-header.js.map +1 -1
  14. package/dist/ar/poi-button/poi-button.css.js +110 -32
  15. package/dist/ar/poi-button/poi-button.css.js.map +1 -1
  16. package/dist/ar/poi-button/poi-button.d.ts +7 -2
  17. package/dist/ar/poi-button/poi-button.d.ts.map +1 -1
  18. package/dist/ar/poi-button/poi-button.js +15 -0
  19. package/dist/ar/poi-button/poi-button.js.map +1 -1
  20. package/dist/ar/types.d.ts +6 -1
  21. package/dist/ar/types.d.ts.map +1 -1
  22. package/dist/ar/types.js +5 -0
  23. package/dist/ar/types.js.map +1 -1
  24. package/dist/automation/automation-badge/automation-badge.d.ts +9 -1
  25. package/dist/automation/automation-badge/automation-badge.d.ts.map +1 -1
  26. package/dist/automation/automation-badge/automation-badge.js +119 -12
  27. package/dist/automation/automation-badge/automation-badge.js.map +1 -1
  28. package/dist/automation/automation-button/abstract-automation-button-storybook-helpers.d.ts +25 -1
  29. package/dist/automation/automation-button/abstract-automation-button-storybook-helpers.d.ts.map +1 -1
  30. package/dist/automation/automation-button/abstract-automation-button-storybook-helpers.js +7 -2
  31. package/dist/automation/automation-button/abstract-automation-button-storybook-helpers.js.map +1 -1
  32. package/dist/automation/automation-button/abstract-automation-button.d.ts +10 -3
  33. package/dist/automation/automation-button/abstract-automation-button.d.ts.map +1 -1
  34. package/dist/automation/automation-button/abstract-automation-button.js +23 -2
  35. package/dist/automation/automation-button/abstract-automation-button.js.map +1 -1
  36. package/dist/automation/automation-button/automation-button.css.js +9 -4
  37. package/dist/automation/automation-button/automation-button.css.js.map +1 -1
  38. package/dist/automation/automation-button/automation-button.d.ts +4 -2
  39. package/dist/automation/automation-button/automation-button.d.ts.map +1 -1
  40. package/dist/automation/automation-button/automation-button.js +24 -6
  41. package/dist/automation/automation-button/automation-button.js.map +1 -1
  42. package/dist/automation/automation-tank/automation-tank.d.ts +3 -2
  43. package/dist/automation/automation-tank/automation-tank.d.ts.map +1 -1
  44. package/dist/automation/automation-tank/automation-tank.js +13 -2
  45. package/dist/automation/automation-tank/automation-tank.js.map +1 -1
  46. package/dist/building-blocks/instrument-radial/instrument-radial.d.ts +10 -0
  47. package/dist/building-blocks/instrument-radial/instrument-radial.d.ts.map +1 -1
  48. package/dist/building-blocks/instrument-radial/instrument-radial.js +86 -21
  49. package/dist/building-blocks/instrument-radial/instrument-radial.js.map +1 -1
  50. package/dist/components/accordion-card/accordion-card.css.js +34 -0
  51. package/dist/components/accordion-card/accordion-card.css.js.map +1 -1
  52. package/dist/components/accordion-card/accordion-card.d.ts +3 -2
  53. package/dist/components/accordion-card/accordion-card.d.ts.map +1 -1
  54. package/dist/components/accordion-card/accordion-card.js +4 -3
  55. package/dist/components/accordion-card/accordion-card.js.map +1 -1
  56. package/dist/components/alert-button/alert-button.css.js +744 -7
  57. package/dist/components/alert-button/alert-button.css.js.map +1 -1
  58. package/dist/components/alert-button/alert-button.d.ts +3 -1
  59. package/dist/components/alert-button/alert-button.d.ts.map +1 -1
  60. package/dist/components/alert-button/alert-button.js +33 -31
  61. package/dist/components/alert-button/alert-button.js.map +1 -1
  62. package/dist/components/alert-frame/alert-frame.css.js +116 -29
  63. package/dist/components/alert-frame/alert-frame.css.js.map +1 -1
  64. package/dist/components/alert-frame/alert-frame.d.ts +42 -15
  65. package/dist/components/alert-frame/alert-frame.d.ts.map +1 -1
  66. package/dist/components/alert-frame/alert-frame.js +68 -17
  67. package/dist/components/alert-frame/alert-frame.js.map +1 -1
  68. package/dist/components/alert-frame/critical-badge.d.ts +12 -0
  69. package/dist/components/alert-frame/critical-badge.d.ts.map +1 -0
  70. package/dist/components/alert-frame/critical-badge.js +47 -0
  71. package/dist/components/alert-frame/critical-badge.js.map +1 -0
  72. package/dist/components/alert-frame/diagnostic-badge.d.ts +12 -0
  73. package/dist/components/alert-frame/diagnostic-badge.d.ts.map +1 -0
  74. package/dist/components/alert-frame/diagnostic-badge.js +60 -0
  75. package/dist/components/alert-frame/diagnostic-badge.js.map +1 -0
  76. package/dist/components/alert-icon/alert-icon.d.ts +6 -1
  77. package/dist/components/alert-icon/alert-icon.d.ts.map +1 -1
  78. package/dist/components/alert-icon/alert-icon.js +96 -38
  79. package/dist/components/alert-icon/alert-icon.js.map +1 -1
  80. package/dist/components/alert-icon/icons/icon-critical.d.ts +3 -0
  81. package/dist/components/alert-icon/icons/icon-critical.d.ts.map +1 -0
  82. package/dist/components/alert-icon/icons/icon-critical.js +26 -0
  83. package/dist/components/alert-icon/icons/icon-critical.js.map +1 -0
  84. package/dist/components/alert-list-details/alert-list-details.d.ts.map +1 -1
  85. package/dist/components/alert-list-details/alert-list-details.js +6 -7
  86. package/dist/components/alert-list-details/alert-list-details.js.map +1 -1
  87. package/dist/components/badge/badge.css.js +50 -2
  88. package/dist/components/badge/badge.css.js.map +1 -1
  89. package/dist/components/badge/badge.d.ts +13 -2
  90. package/dist/components/badge/badge.d.ts.map +1 -1
  91. package/dist/components/badge/badge.js +54 -0
  92. package/dist/components/badge/badge.js.map +1 -1
  93. package/dist/index.js +2 -1
  94. package/dist/manual-icon/icon-alerts-critical-twotone.d.ts +30 -0
  95. package/dist/manual-icon/icon-alerts-critical-twotone.d.ts.map +1 -0
  96. package/dist/manual-icon/icon-alerts-critical-twotone.js +55 -0
  97. package/dist/manual-icon/icon-alerts-critical-twotone.js.map +1 -0
  98. package/dist/manual-icon/icon-alerts-diagnostic-twotone.d.ts +30 -0
  99. package/dist/manual-icon/icon-alerts-diagnostic-twotone.d.ts.map +1 -0
  100. package/dist/manual-icon/icon-alerts-diagnostic-twotone.js +55 -0
  101. package/dist/manual-icon/icon-alerts-diagnostic-twotone.js.map +1 -0
  102. package/dist/navigation-instruments/gauge-radial/gauge-radial.css.js +99 -0
  103. package/dist/navigation-instruments/gauge-radial/gauge-radial.css.js.map +1 -0
  104. package/dist/navigation-instruments/gauge-radial/gauge-radial.d.ts +42 -7
  105. package/dist/navigation-instruments/gauge-radial/gauge-radial.d.ts.map +1 -1
  106. package/dist/navigation-instruments/gauge-radial/gauge-radial.js +178 -31
  107. package/dist/navigation-instruments/gauge-radial/gauge-radial.js.map +1 -1
  108. package/dist/navigation-instruments/readout/readout.css.js +7 -18
  109. package/dist/navigation-instruments/readout/readout.css.js.map +1 -1
  110. package/dist/navigation-instruments/readout/readout.d.ts +6 -7
  111. package/dist/navigation-instruments/readout/readout.d.ts.map +1 -1
  112. package/dist/navigation-instruments/readout/readout.js +54 -52
  113. package/dist/navigation-instruments/readout/readout.js.map +1 -1
  114. package/dist/navigation-instruments/readout-list-item/readout-list-item.css.js +9 -36
  115. package/dist/navigation-instruments/readout-list-item/readout-list-item.css.js.map +1 -1
  116. package/dist/navigation-instruments/readout-list-item/readout-list-item.d.ts +8 -8
  117. package/dist/navigation-instruments/readout-list-item/readout-list-item.d.ts.map +1 -1
  118. package/dist/navigation-instruments/readout-list-item/readout-list-item.js +49 -42
  119. package/dist/navigation-instruments/readout-list-item/readout-list-item.js.map +1 -1
  120. package/dist/navigation-instruments/watch/tickmark.d.ts +2 -1
  121. package/dist/navigation-instruments/watch/tickmark.d.ts.map +1 -1
  122. package/dist/navigation-instruments/watch/tickmark.js +24 -4
  123. package/dist/navigation-instruments/watch/tickmark.js.map +1 -1
  124. package/dist/navigation-instruments/watch/watch.d.ts +23 -1
  125. package/dist/navigation-instruments/watch/watch.d.ts.map +1 -1
  126. package/dist/navigation-instruments/watch/watch.js +48 -20
  127. package/dist/navigation-instruments/watch/watch.js.map +1 -1
  128. package/dist/openbridge.css +155 -0
  129. package/dist/types.d.ts +7 -1
  130. package/dist/types.d.ts.map +1 -1
  131. package/dist/types.js +18 -7
  132. package/dist/types.js.map +1 -1
  133. package/package.json +1 -1
@@ -1 +1 @@
1
- {"version":3,"file":"instrument-radial.js","sources":["../../../src/building-blocks/instrument-radial/instrument-radial.ts"],"sourcesContent":["import {css, LitElement, html, svg, nothing} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {customElement} from '../../decorator.js';\nimport {\n AdviceState,\n AdviceType,\n AngleAdviceRaw,\n} from '../../navigation-instruments/watch/advice.js';\nimport {WatchCircleType} from '../../navigation-instruments/watch/watch.js';\nimport {Tickmark} from '../../navigation-instruments/watch/tickmark.js';\nimport {TickmarkType} from '../../navigation-instruments/watch/tickmark.js';\nimport {TickmarkStyle} from '../../navigation-instruments/watch/tickmark.js';\nimport {InstrumentState, Priority} from '../../navigation-instruments/types.js';\nimport {SetpointMixin} from '../../svghelpers/setpoint-mixin.js';\nimport {\n OUTER_RING_RADIUS,\n innerRingRadiusFor,\n} from '../../navigation-instruments/watch/watch.js';\nimport {\n computeZoomToFitArcFrame,\n type ZoomToFitArcFrame,\n} from '../../svghelpers/arc-frame.js';\n\nexport enum ObcGaugeRadialType {\n filled = 'filled',\n bar = 'bar',\n needle = 'needle',\n}\n\nexport interface GaugeRadialAdvice {\n minValue: number;\n maxValue: number;\n type: AdviceType;\n hinted: boolean;\n}\n\nfunction rangeIncludesZero(minValue: number, maxValue: number): boolean {\n return minValue <= 0 && maxValue >= 0;\n}\n\nfunction strongerTickmarkType(\n existing: TickmarkType,\n candidate: TickmarkType\n): TickmarkType {\n const priority: Record<TickmarkType, number> = {\n [TickmarkType.zeroLineThick]: 6,\n [TickmarkType.zeroLine]: 5,\n [TickmarkType.main]: 4,\n [TickmarkType.primary]: 3,\n [TickmarkType.secondary]: 2,\n [TickmarkType.tertiary]: 1,\n [TickmarkType.textOnly]: 0,\n };\n\n return priority[candidate] > priority[existing] ? candidate : existing;\n}\n\n@customElement('obc-instrument-radial')\nexport class ObcInstrumentRadial extends SetpointMixin(LitElement) {\n // setpoint, newSetpoint, atSetpoint, touching, autoAtSetpoint,\n // autoAtSetpointDeadband, setpointAtZeroDeadband, setpointOverride\n // — all inherited from SetpointMixin\n\n @property({type: String}) state: InstrumentState = InstrumentState.active;\n @property({type: String}) priority: Priority = Priority.regular;\n\n @property({type: Number}) value = 0;\n @property({type: Number}) maxValue = 100;\n @property({type: Number}) minValue = 0;\n @property({attribute: false}) getAngle!: (v: number) => number;\n @property({type: String}) needleColor: string | undefined;\n @property({type: String}) barColor: string | undefined;\n @property({type: Boolean}) showLabels: boolean = false;\n /**\n * Interval for primary tickmarks in value units.\n * When undefined or <= 0, no primary tickmarks are shown.\n */\n @property({type: Number}) primaryTickmarkInterval: number | undefined = 50;\n /**\n * Interval for secondary tickmarks in value units.\n * When undefined or <= 0, no secondary tickmarks are shown.\n */\n @property({type: Number}) secondaryTickmarkInterval: number | undefined = 10;\n /**\n * Interval for tertiary tickmarks in value units.\n * When undefined or <= 0, no tertiary tickmarks are shown.\n */\n @property({type: Number}) tertiaryTickmarkInterval: number | undefined =\n undefined;\n @property({type: String}) type: ObcGaugeRadialType =\n ObcGaugeRadialType.filled;\n @property({type: String}) needleType: ObcGaugeRadialType =\n ObcGaugeRadialType.filled;\n @property({type: Boolean}) tickmarksInside: boolean = false;\n @property({type: String}) tickmarkStyle: TickmarkStyle =\n TickmarkStyle.regular;\n @property({type: Array, attribute: false}) advices: GaugeRadialAdvice[] = [];\n @property({type: Number}) clipTop: number = 0; // in percent of height\n @property({type: Number}) clipBottom: number = 0; // in percent of height\n @property({type: Boolean}) zoomToFitArc: boolean = false;\n\n private _radiusOffset = 0;\n private _arcFrame: ZoomToFitArcFrame | undefined;\n\n private get clampedValue(): number {\n const lowerBound = Math.min(this.minValue, this.maxValue);\n const upperBound = Math.max(this.minValue, this.maxValue);\n return Math.max(lowerBound, Math.min(this.value, upperBound));\n }\n\n private get minAngle(): number {\n return this.getAngle(this.minValue);\n }\n\n private get maxAngle(): number {\n return this.getAngle(this.maxValue);\n }\n\n private get _derivedNeedleColor(): string {\n if (\n this.state === InstrumentState.loading ||\n this.state === InstrumentState.off\n ) {\n return 'transparent';\n }\n return this.priority === Priority.enhanced\n ? 'var(--instrument-enhanced-secondary-color)'\n : 'var(--instrument-regular-secondary-color)';\n }\n\n private get _derivedBarColor(): string {\n if (\n this.state === InstrumentState.loading ||\n this.state === InstrumentState.off\n ) {\n return 'transparent';\n }\n if (this.type === ObcGaugeRadialType.filled) {\n return this.priority === Priority.enhanced\n ? 'var(--instrument-enhanced-secondary-color)'\n : 'var(--instrument-regular-secondary-color)';\n }\n return this.priority === Priority.enhanced\n ? 'var(--instrument-enhanced-tertiary-color)'\n : 'var(--instrument-regular-tertiary-color)';\n }\n\n override render() {\n const barColor = this.barColor ?? this._derivedBarColor;\n const barStartValue = Math.max(this.minValue, Math.min(0, this.maxValue));\n const value = this.clampedValue;\n const setpointAngle =\n this.setpoint !== undefined ? this.getAngle(this.setpoint) : undefined;\n const newSetpointAngle =\n this.newSetpoint !== undefined\n ? this.getAngle(this.newSetpoint)\n : undefined;\n\n const barAreas =\n this.type === ObcGaugeRadialType.needle\n ? []\n : [\n {\n startAngle: this.getAngle(barStartValue),\n endAngle: this.getAngle(value),\n fillColor: barColor,\n },\n ];\n\n const areas = [\n {\n startAngle: this.minAngle,\n endAngle: this.maxAngle,\n roundInsideCut: true,\n roundOutsideCut: true,\n },\n ];\n\n const watchCircleType =\n this.type === ObcGaugeRadialType.needle\n ? WatchCircleType.single\n : WatchCircleType.double;\n\n let viewBox: string;\n if (this.zoomToFitArc) {\n const ext = 48;\n const targetSize = (176 + ext) * 2;\n const frame = computeZoomToFitArcFrame({\n areas,\n outerRadius: OUTER_RING_RADIUS,\n innerRadius: innerRingRadiusFor(watchCircleType),\n extension: ext,\n targetSize,\n });\n viewBox = frame.viewBox;\n this._radiusOffset = frame.radiusOffset;\n this._arcFrame = frame;\n } else {\n this._radiusOffset = 0;\n this._arcFrame = undefined;\n const width = 448;\n const height = width * (1 - this.clipTop / 100 - this.clipBottom / 100);\n const top = -width / 2 + (width * this.clipTop) / 100;\n viewBox = `${-width / 2} ${top} ${width} ${height}`;\n }\n\n return html`\n <div class=\"container\">\n <obc-watch\n .state=${this.state}\n .priority=${this.priority}\n .angleSetpoint=${setpointAngle}\n .newAngleSetpoint=${newSetpointAngle}\n .atAngleSetpoint=${this.computeAtSetpoint(value)}\n .angleSetpointAtZeroDeadband=${this.setpointAtZeroDeadband}\n .setpointOverride=${this.setpointOverride}\n .animateSetpoint=${this.animateSetpoint}\n .padding=${48}\n .tickmarks=${this.tickmarks}\n .tickmarksInside=${this.tickmarksInside}\n .tickmarkStyle=${this.tickmarkStyle}\n .advices=${this._advices}\n .areas=${areas}\n .watchCircleType=${watchCircleType}\n .barAreas=${barAreas}\n .clipTop=${this.zoomToFitArc ? 0 : this.clipTop}\n .clipBottom=${this.zoomToFitArc ? 0 : this.clipBottom}\n .zoomToFitArc=${this.zoomToFitArc}\n .arcFrame=${this._arcFrame}\n ></obc-watch>\n <svg class=\"gauge-radial\" viewBox=${viewBox}>${this._needle}</svg>\n </div>\n `;\n }\n\n private get _needle() {\n if (this.type === ObcGaugeRadialType.filled) {\n return nothing;\n }\n const needleColor = this.needleColor ?? this._derivedNeedleColor;\n const rOff = this._radiusOffset;\n const value = this.clampedValue;\n if (this.type === ObcGaugeRadialType.needle) {\n return svg`<g transform=\"rotate(${this.getAngle(value)}) translate(-256, -256)\">\n <circle cx=\"256\" cy=\"256\" r=\"14\" fill=${needleColor}/>\n <rect x=\"250\" y=\"${96 - rOff}\" width=\"12\" height=\"${192 + rOff}\" rx=\"6\" fill=${needleColor}/>\n <rect x=\"252\" y=\"${98 - rOff}\" width=\"8\" height=\"${188 + rOff}\" rx=\"4\" stroke=${needleColor} fill=${needleColor} stroke-width=\"4\"/>\n </g>\n`;\n } else {\n return svg`<g transform=\"rotate(${this.getAngle(value)}) translate(-256, -256)\">\n<rect x=\"252\" y=\"${96 - rOff}\" width=\"8\" height=\"48\" rx=\"4\" fill=${needleColor} stroke=\"var(--border-silhouette-color)\"/>\n</g>\n `;\n }\n }\n\n get tickmarks(): Tickmark[] {\n const tickmarksByValue = new Map<number, Tickmark>();\n const normalizeValue = (value: number) =>\n Math.abs(value) < 1e-9 ? 0 : Number(value.toFixed(6));\n\n const upsertTickmark = (\n value: number,\n type: TickmarkType,\n text?: string\n ) => {\n if (\n !Number.isFinite(value) ||\n value < this.minValue ||\n value > this.maxValue\n ) {\n return;\n }\n\n const normalizedValue = normalizeValue(value);\n const existing = tickmarksByValue.get(normalizedValue);\n if (existing) {\n existing.type = strongerTickmarkType(existing.type, type);\n if (text !== undefined) {\n existing.text = text;\n }\n return;\n }\n\n tickmarksByValue.set(normalizedValue, {\n angle: this.getAngle(normalizedValue),\n type,\n text,\n });\n };\n\n const addTickmarksAtInterval = (\n interval: number | undefined,\n type: TickmarkType,\n withLabels = false\n ) => {\n if (\n interval === undefined ||\n interval <= 0 ||\n !Number.isFinite(interval)\n ) {\n return;\n }\n\n const epsilon = Math.abs(interval) * 1e-6;\n const startValue =\n Math.ceil((this.minValue - epsilon) / interval) * interval;\n\n for (\n let value = startValue;\n value < this.maxValue - epsilon;\n value += interval\n ) {\n const normalizedValue = normalizeValue(value);\n if (\n normalizedValue <= this.minValue + epsilon ||\n normalizedValue >= this.maxValue - epsilon\n ) {\n continue;\n }\n\n upsertTickmark(\n normalizedValue,\n type,\n withLabels && this.showLabels ? normalizedValue.toString() : undefined\n );\n }\n };\n\n addTickmarksAtInterval(\n this.primaryTickmarkInterval,\n TickmarkType.primary,\n true\n );\n addTickmarksAtInterval(\n this.secondaryTickmarkInterval,\n TickmarkType.secondary\n );\n addTickmarksAtInterval(\n this.tertiaryTickmarkInterval,\n TickmarkType.tertiary\n );\n\n if (rangeIncludesZero(this.minValue, this.maxValue)) {\n upsertTickmark(\n 0,\n this.minValue < 0 ? TickmarkType.main : TickmarkType.textOnly,\n this.showLabels ? '0' : undefined\n );\n }\n\n if (this.showLabels) {\n upsertTickmark(\n this.minValue,\n TickmarkType.textOnly,\n this.minValue.toString()\n );\n upsertTickmark(\n this.maxValue,\n TickmarkType.textOnly,\n this.maxValue.toString()\n );\n }\n\n return [...tickmarksByValue.values()].sort((a, b) => a.angle - b.angle);\n }\n\n private get _advices(): AngleAdviceRaw[] {\n const value = this.clampedValue;\n\n return this.advices.map((advice) => {\n const minAngle = this.getAngle(advice.minValue);\n const maxAngle = this.getAngle(advice.maxValue);\n let state = advice.hinted ? AdviceState.hinted : AdviceState.regular;\n if (value >= advice.minValue && value <= advice.maxValue) {\n state = AdviceState.triggered;\n }\n\n return {\n minAngle,\n maxAngle,\n type: advice.type,\n state,\n hideMinTickmark: advice.minValue === this.minValue,\n hideMaxTickmark: advice.maxValue === this.maxValue,\n };\n });\n }\n\n static override styles = css`\n * {\n box-sizing: border-box;\n }\n\n .container {\n position: relative;\n width: 100%;\n height: 100%;\n }\n\n .container > * {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n obc-watch {\n anchor-name: --watch;\n }\n\n .speed-gauge-value {\n position: absolute;\n top: clamp(\n 70%,\n calc(80% - (anchor-size(--watch height) - 200px) * 0.2),\n 80%\n );\n left: 50%;\n transform: translateX(-50%);\n width: fit-content;\n height: fit-content;\n }\n `;\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-instrument-radial': ObcInstrumentRadial;\n }\n}\n"],"names":["ObcGaugeRadialType"],"mappings":"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"}
1
+ {"version":3,"file":"instrument-radial.js","sources":["../../../src/building-blocks/instrument-radial/instrument-radial.ts"],"sourcesContent":["import {css, LitElement, html, svg, nothing} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {customElement} from '../../decorator.js';\nimport {\n AdviceState,\n AdviceType,\n AngleAdviceRaw,\n} from '../../navigation-instruments/watch/advice.js';\nimport {WatchCircleType} from '../../navigation-instruments/watch/watch.js';\nimport {Tickmark} from '../../navigation-instruments/watch/tickmark.js';\nimport {TickmarkType} from '../../navigation-instruments/watch/tickmark.js';\nimport {TickmarkStyle} from '../../navigation-instruments/watch/tickmark.js';\nimport {InstrumentState, Priority} from '../../navigation-instruments/types.js';\nimport {SetpointMixin} from '../../svghelpers/setpoint-mixin.js';\nimport {\n OUTER_RING_RADIUS,\n innerRingRadiusFor,\n} from '../../navigation-instruments/watch/watch.js';\nimport {\n computeZoomToFitArcFrame,\n type ZoomToFitArcFrame,\n} from '../../svghelpers/arc-frame.js';\n\n// Must match obc-watch's un-zoomed viewBox `(176 + getPadding()) * 2`\n// (default padding 48 → 448); instrument-radial overlays obc-watch 1:1.\nconst WATCH_DEFAULT_VIEWBOX = 448;\n\nexport enum ObcGaugeRadialType {\n filled = 'filled',\n bar = 'bar',\n needle = 'needle',\n}\n\nexport interface GaugeRadialAdvice {\n minValue: number;\n maxValue: number;\n type: AdviceType;\n hinted: boolean;\n}\n\nconst NEEDLE_TIP_RADIUS = 160;\nconst NEEDLE_TIP_GAP = 5; // tip stops this far short of the scale\nconst NEEDLE_WIDTH = 8;\nconst NEEDLE_HUB_RADIUS = 16;\n\nfunction rangeIncludesZero(minValue: number, maxValue: number): boolean {\n return minValue <= 0 && maxValue >= 0;\n}\n\nfunction strongerTickmarkType(\n existing: TickmarkType,\n candidate: TickmarkType\n): TickmarkType {\n const priority: Record<TickmarkType, number> = {\n [TickmarkType.zeroLineThick]: 6,\n [TickmarkType.zeroLine]: 5,\n [TickmarkType.main]: 4,\n [TickmarkType.primary]: 3,\n [TickmarkType.secondary]: 2,\n [TickmarkType.tertiary]: 1,\n [TickmarkType.textOnly]: 0,\n };\n\n return priority[candidate] > priority[existing] ? candidate : existing;\n}\n\ninterface Clips {\n top: number;\n bottom: number;\n left: number;\n right: number;\n}\n\n/** Clamp a clip percentage to [0, 100]; non-finite returns 0. */\nfunction clampClipPercent(n: number): number {\n return Number.isFinite(n) ? Math.min(Math.max(n, 0), 100) : 0;\n}\n\n/**\n * Clamp the four clips to [0, 100] and drop any opposite pair that would\n * collapse the viewBox (sum >= 100), so a bad clip can't produce a zero- or\n * negative-size box. Valid clips pass through unchanged.\n */\nfunction normalizeClips(clips: Clips): Clips {\n let top = clampClipPercent(clips.top);\n let bottom = clampClipPercent(clips.bottom);\n let left = clampClipPercent(clips.left);\n let right = clampClipPercent(clips.right);\n if (top + bottom >= 100) {\n top = 0;\n bottom = 0;\n }\n if (left + right >= 100) {\n left = 0;\n right = 0;\n }\n return {top, bottom, left, right};\n}\n\n/**\n * Fallback value-to-angle mapping when no `getAngle` is supplied: linear over\n * the historical 270° sweep (-135 to 135). Returns -135 for a non-positive or\n * non-finite span.\n */\nfunction defaultGaugeAngle(\n value: number,\n minValue: number,\n maxValue: number\n): number {\n const span = maxValue - minValue;\n if (!Number.isFinite(span) || span <= 0) {\n return -135;\n }\n return ((value - minValue) / span) * 270 - 135;\n}\n\n@customElement('obc-instrument-radial')\nexport class ObcInstrumentRadial extends SetpointMixin(LitElement) {\n // setpoint, newSetpoint, atSetpoint, touching, autoAtSetpoint,\n // autoAtSetpointDeadband, setpointAtZeroDeadband, setpointOverride\n // — all inherited from SetpointMixin\n\n @property({type: String}) state: InstrumentState = InstrumentState.active;\n @property({type: String}) priority: Priority = Priority.regular;\n\n @property({type: Number}) value = 0;\n @property({type: Number}) maxValue = 100;\n @property({type: Number}) minValue = 0;\n @property({attribute: false}) getAngle!: (v: number) => number;\n @property({type: String}) needleColor: string | undefined;\n @property({type: String}) barColor: string | undefined;\n @property({type: Boolean}) showLabels: boolean = false;\n /**\n * Interval for primary tickmarks in value units.\n * When undefined or <= 0, no primary tickmarks are shown.\n */\n @property({type: Number}) primaryTickmarkInterval: number | undefined = 50;\n /**\n * Interval for secondary tickmarks in value units.\n * When undefined or <= 0, no secondary tickmarks are shown.\n */\n @property({type: Number}) secondaryTickmarkInterval: number | undefined = 10;\n /**\n * Interval for tertiary tickmarks in value units.\n * When undefined or <= 0, no tertiary tickmarks are shown.\n */\n @property({type: Number}) tertiaryTickmarkInterval: number | undefined =\n undefined;\n @property({type: String}) type: ObcGaugeRadialType =\n ObcGaugeRadialType.filled;\n @property({type: String}) needleType: ObcGaugeRadialType =\n ObcGaugeRadialType.filled;\n @property({type: Boolean}) tickmarksInside: boolean = false;\n @property({type: String}) tickmarkStyle: TickmarkStyle =\n TickmarkStyle.regular;\n @property({type: Array, attribute: false}) advices: GaugeRadialAdvice[] = [];\n @property({type: Number}) clipTop: number = 0; // in percent of height\n @property({type: Number}) clipBottom: number = 0; // in percent of height\n @property({type: Number}) clipLeft: number = 0; // in percent of width\n @property({type: Number}) clipRight: number = 0; // in percent of width\n /**\n * Place the horizontal end labels (±90°, e.g. min/max) below the tick instead\n * of beside it — the \"Max-min\" placement from the radial label model\n * (External / Internal / Max-min). See PR #903 / design discussion.\n */\n @property({type: Boolean}) endLabelsMaxMin: boolean = false;\n @property({type: Boolean}) zoomToFitArc: boolean = false;\n\n private _radiusOffset = 0;\n private _arcFrame: ZoomToFitArcFrame | undefined;\n\n private get clampedValue(): number {\n const lowerBound = Math.min(this.minValue, this.maxValue);\n const upperBound = Math.max(this.minValue, this.maxValue);\n return Math.max(lowerBound, Math.min(this.value, upperBound));\n }\n\n private get minAngle(): number {\n return this.mapAngle(this.minValue);\n }\n\n private get maxAngle(): number {\n return this.mapAngle(this.maxValue);\n }\n\n // Map a value to an angle via the consumer's `getAngle`, guarding a missing\n // or non-finite mapping so a misconfigured consumer can't emit NaN geometry.\n private mapAngle(value: number): number {\n const fn = this.getAngle;\n const angle =\n typeof fn === 'function'\n ? fn(value)\n : defaultGaugeAngle(value, this.minValue, this.maxValue);\n return Number.isFinite(angle) ? angle : 0;\n }\n\n // Clamped clips, reused for the overlay viewBox and the clips forwarded to\n // obc-watch.\n private get safeClips(): Clips {\n return normalizeClips({\n top: this.clipTop,\n bottom: this.clipBottom,\n left: this.clipLeft,\n right: this.clipRight,\n });\n }\n\n private get _derivedNeedleColor(): string {\n if (\n this.state === InstrumentState.loading ||\n this.state === InstrumentState.off\n ) {\n return 'transparent';\n }\n return this.priority === Priority.enhanced\n ? 'var(--instrument-enhanced-secondary-color)'\n : 'var(--instrument-regular-secondary-color)';\n }\n\n private get _derivedBarColor(): string {\n if (\n this.state === InstrumentState.loading ||\n this.state === InstrumentState.off\n ) {\n return 'transparent';\n }\n if (this.type === ObcGaugeRadialType.filled) {\n return this.priority === Priority.enhanced\n ? 'var(--instrument-enhanced-secondary-color)'\n : 'var(--instrument-regular-secondary-color)';\n }\n return this.priority === Priority.enhanced\n ? 'var(--instrument-enhanced-tertiary-color)'\n : 'var(--instrument-regular-tertiary-color)';\n }\n\n override render() {\n const barColor = this.barColor ?? this._derivedBarColor;\n const barStartValue = Math.max(this.minValue, Math.min(0, this.maxValue));\n const value = this.clampedValue;\n const setpointAngle =\n this.setpoint !== undefined ? this.mapAngle(this.setpoint) : undefined;\n const newSetpointAngle =\n this.newSetpoint !== undefined\n ? this.mapAngle(this.newSetpoint)\n : undefined;\n\n const barAreas =\n this.type === ObcGaugeRadialType.needle\n ? []\n : [\n {\n startAngle: this.mapAngle(barStartValue),\n endAngle: this.mapAngle(value),\n fillColor: barColor,\n },\n ];\n\n const areas = [\n {\n startAngle: this.minAngle,\n endAngle: this.maxAngle,\n roundInsideCut: true,\n roundOutsideCut: true,\n },\n ];\n\n const watchCircleType =\n this.type === ObcGaugeRadialType.needle\n ? WatchCircleType.single\n : WatchCircleType.double;\n\n const clips = this.safeClips;\n let viewBox: string;\n if (this.zoomToFitArc) {\n const ext = 48;\n const targetSize = (176 + ext) * 2;\n const frame = computeZoomToFitArcFrame({\n areas,\n outerRadius: OUTER_RING_RADIUS,\n innerRadius: innerRingRadiusFor(watchCircleType),\n extension: ext,\n targetSize,\n });\n this._radiusOffset = frame.radiusOffset;\n viewBox = frame.viewBox;\n this._arcFrame = frame;\n } else {\n this._radiusOffset = 0;\n this._arcFrame = undefined;\n const full = WATCH_DEFAULT_VIEWBOX;\n const w = full * (1 - clips.left / 100 - clips.right / 100);\n const h = full * (1 - clips.top / 100 - clips.bottom / 100);\n const left = -full / 2 + (full * clips.left) / 100;\n const top = -full / 2 + (full * clips.top) / 100;\n viewBox = `${left} ${top} ${w} ${h}`;\n }\n\n return html`\n <div class=\"container\">\n <obc-watch\n .state=${this.state}\n .priority=${this.priority}\n .angleSetpoint=${setpointAngle}\n .newAngleSetpoint=${newSetpointAngle}\n .atAngleSetpoint=${this.computeAtSetpoint(value)}\n .angleSetpointAtZeroDeadband=${this.setpointAtZeroDeadband}\n .setpointOverride=${this.setpointOverride}\n .animateSetpoint=${this.animateSetpoint}\n .padding=${48}\n .tickmarks=${this.tickmarks}\n .tickmarksInside=${this.tickmarksInside}\n .tickmarkStyle=${this.tickmarkStyle}\n .advices=${this._advices}\n .areas=${areas}\n .watchCircleType=${watchCircleType}\n .barAreas=${barAreas}\n .clipTop=${this.zoomToFitArc ? 0 : clips.top}\n .clipBottom=${this.zoomToFitArc ? 0 : clips.bottom}\n .clipLeft=${this.zoomToFitArc ? 0 : clips.left}\n .clipRight=${this.zoomToFitArc ? 0 : clips.right}\n .endLabelsMaxMin=${this.endLabelsMaxMin}\n .zoomToFitArc=${this.zoomToFitArc}\n .arcFrame=${this._arcFrame}\n ></obc-watch>\n <svg class=\"gauge-radial\" viewBox=${viewBox}>${this._needle}</svg>\n </div>\n `;\n }\n\n private get _needle() {\n if (this.type === ObcGaugeRadialType.filled) {\n return nothing;\n }\n const needleColor = this.needleColor ?? this._derivedNeedleColor;\n const rOff = this._radiusOffset;\n const value = this.clampedValue;\n if (this.type === ObcGaugeRadialType.needle) {\n // Rod runs from the value tip down to the center hub. Width is constant;\n // the tip shifts outward additively under zoom.\n const tipY = 256 - (NEEDLE_TIP_RADIUS - NEEDLE_TIP_GAP) - rOff;\n return svg`<g transform=\"rotate(${this.mapAngle(value)}) translate(-256, -256)\">\n <rect x=\"${256 - NEEDLE_WIDTH / 2}\" y=\"${tipY}\" width=\"${NEEDLE_WIDTH}\" height=\"${256 - tipY}\" rx=\"${NEEDLE_WIDTH / 2}\" fill=${needleColor} stroke=${needleColor}/>\n <circle cx=\"256\" cy=\"256\" r=\"${NEEDLE_HUB_RADIUS}\" fill=${needleColor}/>\n </g>\n`;\n } else {\n return svg`<g transform=\"rotate(${this.mapAngle(value)}) translate(-256, -256)\">\n<rect x=\"252\" y=\"${96 - rOff}\" width=\"8\" height=\"48\" rx=\"4\" fill=${needleColor} stroke=\"var(--border-silhouette-color)\"/>\n</g>\n `;\n }\n }\n\n get tickmarks(): Tickmark[] {\n const tickmarksByValue = new Map<number, Tickmark>();\n const normalizeValue = (value: number) =>\n Math.abs(value) < 1e-9 ? 0 : Number(value.toFixed(6));\n\n const upsertTickmark = (\n value: number,\n type: TickmarkType,\n text?: string\n ) => {\n if (\n !Number.isFinite(value) ||\n value < this.minValue ||\n value > this.maxValue\n ) {\n return;\n }\n\n const normalizedValue = normalizeValue(value);\n const existing = tickmarksByValue.get(normalizedValue);\n if (existing) {\n existing.type = strongerTickmarkType(existing.type, type);\n if (text !== undefined) {\n existing.text = text;\n }\n return;\n }\n\n tickmarksByValue.set(normalizedValue, {\n angle: this.mapAngle(normalizedValue),\n type,\n text,\n });\n };\n\n const addTickmarksAtInterval = (\n interval: number | undefined,\n type: TickmarkType,\n withLabels = false\n ) => {\n if (\n interval === undefined ||\n interval <= 0 ||\n !Number.isFinite(interval)\n ) {\n return;\n }\n\n const epsilon = Math.abs(interval) * 1e-6;\n const startValue =\n Math.ceil((this.minValue - epsilon) / interval) * interval;\n\n for (\n let value = startValue;\n value < this.maxValue - epsilon;\n value += interval\n ) {\n const normalizedValue = normalizeValue(value);\n if (\n normalizedValue <= this.minValue + epsilon ||\n normalizedValue >= this.maxValue - epsilon\n ) {\n continue;\n }\n\n upsertTickmark(\n normalizedValue,\n type,\n withLabels && this.showLabels ? normalizedValue.toString() : undefined\n );\n }\n };\n\n addTickmarksAtInterval(\n this.primaryTickmarkInterval,\n TickmarkType.primary,\n true\n );\n addTickmarksAtInterval(\n this.secondaryTickmarkInterval,\n TickmarkType.secondary\n );\n addTickmarksAtInterval(\n this.tertiaryTickmarkInterval,\n TickmarkType.tertiary\n );\n\n if (rangeIncludesZero(this.minValue, this.maxValue)) {\n upsertTickmark(\n 0,\n this.minValue < 0 ? TickmarkType.main : TickmarkType.textOnly,\n this.showLabels ? '0' : undefined\n );\n }\n\n if (this.showLabels) {\n upsertTickmark(\n this.minValue,\n TickmarkType.textOnly,\n this.minValue.toString()\n );\n upsertTickmark(\n this.maxValue,\n TickmarkType.textOnly,\n this.maxValue.toString()\n );\n }\n\n return [...tickmarksByValue.values()].sort((a, b) => a.angle - b.angle);\n }\n\n private get _advices(): AngleAdviceRaw[] {\n const value = this.clampedValue;\n\n return this.advices.map((advice) => {\n const minAngle = this.mapAngle(advice.minValue);\n const maxAngle = this.mapAngle(advice.maxValue);\n let state = advice.hinted ? AdviceState.hinted : AdviceState.regular;\n if (value >= advice.minValue && value <= advice.maxValue) {\n state = AdviceState.triggered;\n }\n\n return {\n minAngle,\n maxAngle,\n type: advice.type,\n state,\n hideMinTickmark: advice.minValue === this.minValue,\n hideMaxTickmark: advice.maxValue === this.maxValue,\n };\n });\n }\n\n static override styles = css`\n * {\n box-sizing: border-box;\n }\n\n .container {\n position: relative;\n width: 100%;\n height: 100%;\n }\n\n .container > * {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n }\n\n obc-watch {\n anchor-name: --watch;\n }\n\n .speed-gauge-value {\n position: absolute;\n top: clamp(\n 70%,\n calc(80% - (anchor-size(--watch height) - 200px) * 0.2),\n 80%\n );\n left: 50%;\n transform: translateX(-50%);\n width: fit-content;\n height: fit-content;\n }\n `;\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-instrument-radial': ObcInstrumentRadial;\n }\n}\n"],"names":["ObcGaugeRadialType"],"mappings":"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"}
@@ -281,7 +281,41 @@ const compentStyle = css`
281
281
 
282
282
  .alert {
283
283
  pointer-events: none;
284
+
285
+ /* z-index follows ALERT_SEVERITY_PRIORITY: more severe statuses stack on top. */
284
286
  }
287
+
288
+ .alert.alert-isa-critical {
289
+ z-index: 8;
290
+ }
291
+
292
+ .alert.alert-alarm {
293
+ z-index: 7;
294
+ }
295
+
296
+ .alert.alert-isa-high {
297
+ z-index: 6;
298
+ }
299
+
300
+ .alert.alert-warning {
301
+ z-index: 5;
302
+ }
303
+
304
+ .alert.alert-isa-medium {
305
+ z-index: 4;
306
+ }
307
+
308
+ .alert.alert-caution {
309
+ z-index: 3;
310
+ }
311
+
312
+ .alert.alert-isa-low {
313
+ z-index: 2;
314
+ }
315
+
316
+ .alert.alert-isa-diagnostic {
317
+ z-index: 1;
318
+ }
285
319
  `;
286
320
  export {
287
321
  compentStyle as default
@@ -1 +1 @@
1
- {"version":3,"file":"accordion-card.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"accordion-card.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -1,5 +1,6 @@
1
1
  import { LitElement } from 'lit';
2
- import { ObcAlertFrameStatus, ObcAlertFrameThickness, ObcAlertFrameType } from '../alert-frame/alert-frame.js';
2
+ import { ObcAlertFrameThickness, ObcAlertFrameType } from '../alert-frame/alert-frame.js';
3
+ import { AlertType } from '../../types.js';
3
4
  import '../../icons/icon-chevron-up-google.js';
4
5
  import '../../icons/icon-chevron-down-google.js';
5
6
  import '../alert-frame/alert-frame.js';
@@ -161,7 +162,7 @@ export declare class ObcAccordionCard extends LitElement {
161
162
  * Status of the alert frame overlay (used when `hasAlert` is true).
162
163
  * See `obc-alert-frame` for available statuses.
163
164
  */
164
- alertFrameStatus: ObcAlertFrameStatus;
165
+ alertFrameStatus: AlertType;
165
166
  private get shouldShowDescription();
166
167
  private handleToggle;
167
168
  private renderContentMain;
@@ -1 +1 @@
1
- {"version":3,"file":"accordion-card.d.ts","sourceRoot":"","sources":["../../../src/components/accordion-card/accordion-card.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAKhD,OAAO,uCAAuC,CAAC;AAC/C,OAAO,yCAAyC,CAAC;AACjD,OAAO,+BAA+B,CAAC;AACvC,OAAO,EACL,mBAAmB,EACnB,sBAAsB,EACtB,iBAAiB,EAClB,MAAM,+BAA+B,CAAC;AAEvC,oBAAY,aAAa;IACvB,UAAU,gBAAgB;IAC1B,KAAK,UAAU;CAChB;AAED,oBAAY,QAAQ;IAClB,GAAG,QAAQ;IACX,MAAM,WAAW;IACjB,MAAM,WAAW;IACjB,OAAO,YAAY;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkFG;AACH,qBACa,gBAAiB,SAAQ,UAAU;IAC9C;;OAEG;IACuB,SAAS,SAAM;IAEzC;;OAEG;IACuB,WAAW,SAAM;IAE3C;;OAEG;IACuB,WAAW,SAAM;IAE3C;;OAEG;IACwB,QAAQ,UAAS;IAE5C;;OAEG;IACwB,QAAQ,UAAS;IAE5C;;OAEG;IACwB,QAAQ,UAAS;IAE5C;;OAEG;IACwB,cAAc,UAAS;IAElD;;OAEG;IACwB,cAAc,UAAS;IAElD;;OAEG;IACwB,cAAc,UAAS;IAElD;;;;;;OAMG;IACuB,QAAQ,EAAE,QAAQ,CAAoB;IAEhE;;;;OAIG;IACuB,IAAI,EAAE,aAAa,CAA4B;IAEzE;;;OAGG;IACuB,cAAc,EAAE,iBAAiB,CAC/B;IAE5B;;;OAGG;IACuB,mBAAmB,EAAE,sBAAsB,CACtC;IAE/B;;;OAGG;IACuB,gBAAgB,EAAE,mBAAmB,CACnC;IAE5B,OAAO,KAAK,qBAAqB,GAMhC;IAED,OAAO,CAAC,YAAY;IAmBpB,OAAO,CAAC,iBAAiB;IAkCzB,OAAO,CAAC,uBAAuB;IAU/B,OAAO,CAAC,iBAAiB;IAGzB,OAAO,CAAC,cAAc;IAMb,MAAM;IAoDf,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,oBAAoB,EAAE,gBAAgB,CAAC;KACxC;CACF"}
1
+ {"version":3,"file":"accordion-card.d.ts","sourceRoot":"","sources":["../../../src/components/accordion-card/accordion-card.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAKhD,OAAO,uCAAuC,CAAC;AAC/C,OAAO,yCAAyC,CAAC;AACjD,OAAO,+BAA+B,CAAC;AACvC,OAAO,EACL,sBAAsB,EACtB,iBAAiB,EAClB,MAAM,+BAA+B,CAAC;AACvC,OAAO,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAEzC,oBAAY,aAAa;IACvB,UAAU,gBAAgB;IAC1B,KAAK,UAAU;CAChB;AAED,oBAAY,QAAQ;IAClB,GAAG,QAAQ;IACX,MAAM,WAAW;IACjB,MAAM,WAAW;IACjB,OAAO,YAAY;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkFG;AACH,qBACa,gBAAiB,SAAQ,UAAU;IAC9C;;OAEG;IACuB,SAAS,SAAM;IAEzC;;OAEG;IACuB,WAAW,SAAM;IAE3C;;OAEG;IACuB,WAAW,SAAM;IAE3C;;OAEG;IACwB,QAAQ,UAAS;IAE5C;;OAEG;IACwB,QAAQ,UAAS;IAE5C;;OAEG;IACwB,QAAQ,UAAS;IAE5C;;OAEG;IACwB,cAAc,UAAS;IAElD;;OAEG;IACwB,cAAc,UAAS;IAElD;;OAEG;IACwB,cAAc,UAAS;IAElD;;;;;;OAMG;IACuB,QAAQ,EAAE,QAAQ,CAAoB;IAEhE;;;;OAIG;IACuB,IAAI,EAAE,aAAa,CAA4B;IAEzE;;;OAGG;IACuB,cAAc,EAAE,iBAAiB,CAC/B;IAE5B;;;OAGG;IACuB,mBAAmB,EAAE,sBAAsB,CACtC;IAE/B;;;OAGG;IACuB,gBAAgB,EAAE,SAAS,CAAmB;IAExE,OAAO,KAAK,qBAAqB,GAMhC;IAED,OAAO,CAAC,YAAY;IAmBpB,OAAO,CAAC,iBAAiB;IAkCzB,OAAO,CAAC,uBAAuB;IAU/B,OAAO,CAAC,iBAAiB;IAGzB,OAAO,CAAC,cAAc;IAMb,MAAM;IAoDf,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,oBAAoB,EAAE,gBAAgB,CAAC;KACxC;CACF"}
@@ -5,7 +5,8 @@ import compentStyle from "./accordion-card.css.js";
5
5
  import { property } from "lit/decorators.js";
6
6
  import "../../icons/icon-chevron-up-google.js";
7
7
  import "../../icons/icon-chevron-down-google.js";
8
- import { ObcAlertFrameType, ObcAlertFrameThickness, ObcAlertFrameStatus } from "../alert-frame/alert-frame.js";
8
+ import { ObcAlertFrameType, ObcAlertFrameThickness } from "../alert-frame/alert-frame.js";
9
+ import { AlertType } from "../../types.js";
9
10
  var __defProp = Object.defineProperty;
10
11
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
11
12
  var __decorateClass = (decorators, target, key, kind) => {
@@ -44,7 +45,7 @@ let ObcAccordionCard = class extends LitElement {
44
45
  this.size = "single-line";
45
46
  this.alertFrameType = ObcAlertFrameType.Regular;
46
47
  this.alertFrameThickness = ObcAlertFrameThickness.Small;
47
- this.alertFrameStatus = ObcAlertFrameStatus.Alarm;
48
+ this.alertFrameStatus = AlertType.Alarm;
48
49
  }
49
50
  get shouldShowDescription() {
50
51
  return this.size === "large" && this.hasDescription && this.description.trim() !== "";
@@ -133,7 +134,7 @@ let ObcAccordionCard = class extends LitElement {
133
134
 
134
135
  ${this.hasAlert ? html`
135
136
  <obc-alert-frame
136
- class="alert"
137
+ class="alert alert-${this.alertFrameStatus}"
137
138
  .sharpEdgeTopLeft=${this.isShartEdgeTop()}
138
139
  .sharpEdgeTopRight=${this.isShartEdgeTop()}
139
140
  .sharpEdgeBottomLeft=${this.isShartEdgeBottom()}
@@ -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 ObcAlertFrameStatus,\n ObcAlertFrameThickness,\n ObcAlertFrameType,\n} from '../alert-frame/alert-frame.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 accordion-toggle {CustomEvent<{expanded: boolean, cardTitle: string}>} Fired when the accordion is expanded or collapsed\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 */\n @property({type: String}) description = '';\n\n /**\n * Optional status label displayed in the header (shown if `hasStatusLabel` is 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 */\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 */\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 */\n @property({type: String}) alertFrameStatus: ObcAlertFrameStatus =\n ObcAlertFrameStatus.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 {CustomEvent<{expanded: boolean, cardTitle: string}>}\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\"\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 accordion-toggle {CustomEvent<{expanded: boolean, cardTitle: string}>} Fired when the accordion is expanded or collapsed\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 */\n @property({type: String}) description = '';\n\n /**\n * Optional status label displayed in the header (shown if `hasStatusLabel` is 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 */\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 */\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 */\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 {CustomEvent<{expanded: boolean, cardTitle: string}>}\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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"}