npm - @oicl/openbridge-webcomponents-full-bundle - Versions diffs - 2.0.0-next.54 → 2.0.0-next.55 - Mend

@oicl/openbridge-webcomponents-full-bundle 2.0.0-next.54 → 2.0.0-next.55

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 (29) hide show

package/dist/navigation-instruments/readout-setpoint/readout-setpoint.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"readout-setpoint.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/readout-setpoint/readout-setpoint.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAA2B,MAAM,KAAK,CAAC;AAKzD,OAAO,mCAAmC,CAAC;AAC3C,OAAO,yCAAyC,CAAC;AACjD,OAAO,KAAK,EACV,gBAAgB,IAAI,wBAAwB,EAC5C,cAAc,IAAI,2BAA2B,EAC9C,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAC,QAAQ,EAAC,MAAM,aAAa,CAAC;AAOrC,oBAAY,sBAAsB;IAChC,QAAQ,aAAa;IACrB,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB;AAED,oBAAY,mBAAmB;IAC7B,KAAK,UAAU;IACf,OAAO,YAAY;IACnB,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB;AAED,oBAAY,qBAAqB;IAC/B,OAAO,YAAY;IACnB,WAAW,gBAAgB;IAC3B,KAAK,UAAU;IACf,aAAa,mBAAmB;IAChC,QAAQ,aAAa;IACrB,MAAM,WAAW;CAClB;AAED,oBAAY,mBAAmB;IAC7B,OAAO,YAAY;IACnB,QAAQ,aAAa;IACrB,iBAAiB,uBAAuB;CACzC;AAED,oBAAY,8BAA8B;IACxC,OAAO,YAAY;IACnB,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB;AAOD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,qBACa,kBAAmB,SAAQ,UAAU;IACtB,OAAO,EAAE,sBAAsB,CACvB;IACR,YAAY,CAAC,EAAE,2BAA2B,CAAC;IAC3C,SAAS,CAAC,EAAE,wBAAwB,CAAC;IACrC,IAAI,EAAE,mBAAmB,CACvB;IAK5B,eAAe,CAAC,EAAE,8BAA8B,CAAC;IAEvB,MAAM,CAAC,EAAE,qBAAqB,CAAC;IAC/B,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACJ,UAAU,UAAS;IACnC,cAAc,SAAK;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,CAAC;IACvB,GAAG,UAAS;IACb,WAAW,SAAM;IAChB,cAAc,UAAS;IACvB,SAAS,UAAS;IAClB,eAAe,UAAS;IACzB,cAAc,SAAK;~~IAEpC~~,OAAO,CAAC,oBAAoB,CAAS;IAElB,OAAO,CAAC,QAAQ,CAAC,CAAkB;IAE/D,OAAO,KAAK,cAAc,GAEzB;IAED,OAAO,KAAK,YAAY,GAEvB;IAED,OAAO,KAAK,kBAAkB,GAU7B;IAED,OAAO,KAAK,iBAAiB,GAE5B;IAED,OAAO,KAAK,YAAY,GAEvB;IAED,OAAO,KAAK,kBAAkB,GAiB7B;IAED,OAAO,KAAK,wBAAwB,GAcnC;IAED,OAAO,KAAK,mBAAmB,GAM9B;IAED,OAAO,CAAC,0BAA0B;IAiBlC,OAAO,KAAK,uBAAuB,GAElC;IAED,OAAO,KAAK,gCAAgC,GAE3C;IAED,OAAO,CAAC,kBAAkB;IAkBjB,YAAY;IAKrB,OAAO,KAAK,UAAU,GAqBrB;IAED,OAAO,KAAK,kBAAkB,GAY7B;IAED,OAAO,KAAK,oBAAoB,GAM/B;IAED,OAAO,CAAC,sBAAsB;IA6B9B,OAAO,CAAC,sBAAsB;IAyC9B,OAAO,CAAC,2BAA2B;IAsCnC,OAAO,CAAC,4BAA4B;~~IA6BpC~~,OAAO,CAAC,2CAA2C;IAoCnD,OAAO,CAAC,oBAAoB;IA4C5B,OAAO,CAAC,qBAAqB;IAuBpB,MAAM;IAwCf,OAAgB,MAAM,0BAA6B;CACpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,sBAAsB,EAAE,kBAAkB,CAAC;KAC5C;CACF"}
1	+ {"version":3,"file":"readout-setpoint.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/readout-setpoint/readout-setpoint.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAA2B,MAAM,KAAK,CAAC;AAKzD,OAAO,mCAAmC,CAAC;AAC3C,OAAO,yCAAyC,CAAC;AACjD,OAAO,KAAK,EACV,gBAAgB,IAAI,wBAAwB,EAC5C,cAAc,IAAI,2BAA2B,EAC9C,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAC,QAAQ,EAAC,MAAM,aAAa,CAAC;AAOrC,oBAAY,sBAAsB;IAChC,QAAQ,aAAa;IACrB,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB;AAED,oBAAY,mBAAmB;IAC7B,KAAK,UAAU;IACf,OAAO,YAAY;IACnB,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB;AAED,oBAAY,qBAAqB;IAC/B,OAAO,YAAY;IACnB,WAAW,gBAAgB;IAC3B,KAAK,UAAU;IACf,aAAa,mBAAmB;IAChC,QAAQ,aAAa;IACrB,MAAM,WAAW;CAClB;AAED,oBAAY,mBAAmB;IAC7B,OAAO,YAAY;IACnB,QAAQ,aAAa;IACrB,iBAAiB,uBAAuB;CACzC;AAED,oBAAY,8BAA8B;IACxC,OAAO,YAAY;IACnB,MAAM,WAAW;IACjB,KAAK,UAAU;CAChB;AAOD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,qBACa,kBAAmB,SAAQ,UAAU;IACtB,OAAO,EAAE,sBAAsB,CACvB;IACR,YAAY,CAAC,EAAE,2BAA2B,CAAC;IAC3C,SAAS,CAAC,EAAE,wBAAwB,CAAC;IACrC,IAAI,EAAE,mBAAmB,CACvB;IAK5B,eAAe,CAAC,EAAE,8BAA8B,CAAC;IAEvB,MAAM,CAAC,EAAE,qBAAqB,CAAC;IAC/B,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACJ,UAAU,UAAS;IACnC,cAAc,SAAK;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,CAAC;IACvB,GAAG,UAAS;IACb,WAAW,SAAM;IAChB,cAAc,UAAS;IACvB,SAAS,UAAS;IAClB,eAAe,UAAS;IACzB,cAAc,SAAK;IACA,mBAAmB,UAAS;IAEhE,OAAO,CAAC,oBAAoB,CAAS;IAElB,OAAO,CAAC,QAAQ,CAAC,CAAkB;IAE/D,OAAO,KAAK,cAAc,GAEzB;IAED,OAAO,KAAK,YAAY,GAEvB;IAED,OAAO,KAAK,kBAAkB,GAU7B;IAED,OAAO,KAAK,iBAAiB,GAE5B;IAED,OAAO,KAAK,YAAY,GAEvB;IAED,OAAO,KAAK,kBAAkB,GAiB7B;IAED,OAAO,KAAK,wBAAwB,GAcnC;IAED,OAAO,KAAK,mBAAmB,GAM9B;IAED,OAAO,CAAC,0BAA0B;IAiBlC,OAAO,KAAK,uBAAuB,GAElC;IAED,OAAO,KAAK,gCAAgC,GAE3C;IAED,OAAO,CAAC,kBAAkB;IAkBjB,YAAY;IAKrB,OAAO,KAAK,UAAU,GAqBrB;IAED,OAAO,KAAK,kBAAkB,GAY7B;IAED,OAAO,KAAK,oBAAoB,GAM/B;IAED,OAAO,CAAC,sBAAsB;IA6B9B,OAAO,CAAC,sBAAsB;IAyC9B,OAAO,CAAC,2BAA2B;IAsCnC,OAAO,CAAC,4BAA4B;IAgCpC,OAAO,CAAC,2CAA2C;IAoCnD,OAAO,CAAC,oBAAoB;IA4C5B,OAAO,CAAC,qBAAqB;IAuBpB,MAAM;IAwCf,OAAgB,MAAM,0BAA6B;CACpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,sBAAsB,EAAE,kBAAkB,CAAC;KAC5C;CACF"}

package/dist/navigation-instruments/readout-setpoint/readout-setpoint.js CHANGED Viewed

@@ -64,6 +64,7 @@ let ObcReadoutSetpoint = class extends LitElement {
     this.hasDegree = false;
     this.showZeroPadding = false;
     this.fractionDigits = 0;
+    this.reserveSpaceForIcon = false;
     this.hasAssignedValueIcon = false;
   }
   get resolvedFormat() {
@@ -276,6 +277,9 @@ let ObcReadoutSetpoint = class extends LitElement {
     `;
   }
   renderRegularValueInlineIcon(size) {
+    if (!this.reserveSpaceForIcon) {
+      return nothing;
+    }
     const hideStyle = this.hasAssignedValueIcon ? "" : this.direction === "vertical" ? "visibility:hidden;" : "display:none;";
     return html`
       <div class="icon-container" aria-hidden="true" style=${hideStyle}>
@@ -476,6 +480,9 @@ __decorateClass([
 __decorateClass([
   property({ type: Number })
 ], ObcReadoutSetpoint.prototype, "fractionDigits", 2);
+__decorateClass([
+  property({ type: Boolean, attribute: false })
+], ObcReadoutSetpoint.prototype, "reserveSpaceForIcon", 2);
 __decorateClass([
   state()
 ], ObcReadoutSetpoint.prototype, "hasAssignedValueIcon", 2);

package/dist/navigation-instruments/readout-setpoint/readout-setpoint.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"readout-setpoint.js","sources":["../../../src/navigation-instruments/readout-setpoint/readout-setpoint.ts"],"sourcesContent":["import {LitElement, html, nothing, unsafeCSS} from 'lit';\nimport {property, query, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport componentStyle from './readout-setpoint.css?inline';\nimport {customElement} from '../../decorator.js';\nimport '../../components/button/button.js';\nimport '../../icons/icon-notification-advice.js';\nimport type {\n ReadoutDirection as ReadoutSetpointDirection,\n ReadoutVariant as ReadoutSetpointReadoutStyle,\n} from '../readout/readout.js';\nimport {Priority} from '../types.js';\nimport {\n getHintZeros,\n formatNumericValue,\n type ReadoutNumericFormatOptions,\n} from '../readout/readout-formatters.js';\n\nexport enum ReadoutSetpointVariant {\n setpoint = 'setpoint',\n advice = 'advice',\n value = 'value',\n}\n\nexport enum ReadoutSetpointSize {\n small = 'small',\n regular = 'regular',\n medium = 'medium',\n large = 'large',\n}\n\nexport enum ReadoutSetpointFormat {\n regular = 'regular',\n description = 'description',\n range = 'range',\n verticalStack = 'vertical-stack',\n baseline = 'baseline',\n button = 'button',\n}\n\nexport enum ReadoutSetpointMode {\n display = 'display',\n setpoint = 'setpoint',\n setpointTemporary = 'setpoint-temporary',\n}\n\nexport enum ReadoutSetpointValueTypography {\n regular = 'regular',\n medium = 'medium',\n large = 'large',\n}\n\ntype ReadoutValueRenderModel = {\n valueText: string; // formatted value\n hintedText: string; // hinted zeros (used to reserve space or for zero-padding)\n};\n\n/*\n `<obc-readout-setpoint>` - A readout segment for displaying a value, setpoint, or temporary entry.\n \n Renders a leading marker icon and a single value string with optional fixed-width rendering, hinted zero padding, and an optional degree suffix. Use it as a low-level building block when one value segment must be shown separately inside a larger readout.\n \n ## Features\n * - Variants: Supports `setpoint`, `advice`, and `value`.\n * - Sizes: Supports `small`, `regular`, `medium`, and `large`.\n * - Formats: Supports `regular`, `description`, `range`, `vertical-stack`, `baseline`, and `button`. Format selects the structural subtype; size is controlled independently via the `size` property.\n * - Mode axis: `mode` controls behavior/typography (`display`, `setpoint`, `setpointTemporary`).\n * - Priority axis: `priority` controls color emphasis (`regular`/`enhanced`).\n * - Width control: `minValueLength` defines the minimum digit count reserved for the formatted numeric value. Longer values expand the segment width naturally.\n * - Hinted zeros: `hasHintedZeros` renders muted leading zeroes that fill the remaining `minValueLength` slots when the formatted value is shorter than the minimum.\n * - Degree suffix: `hasDegree` renders a trailing degree symbol (`°`).\n * - Description line: `type=\"description\"` can render a secondary label below the value by using the `description` property.\n * - Range line: `type=\"range\"` can render a second numeric line below the value by using the `secondaryValue` property.\n * - Vertical stack marker: `type=\"vertical-stack\"` renders a trailing label to the right of the value.\n * - Icon override: A named slot can replace the default leading marker icon.\n \n ## Usage Guidelines\n * Use this component when one value segment needs to be rendered inside a larger readout composition. Prefer a higher-level readout container when label, unit, advice, or source content must be arranged together.\n \n For fixed-width layouts, set `minValueLength` to the minimum digit count the segment should reserve. Enable `hasHintedZeros` when the reserved leading positions should remain visible as muted zeroes; otherwise the space is preserved without a visible glyph.\n \n ## Slots\n \n - `icon`: Replaces the default leading marker icon.\n * - `value`: Replaces the formatted value content for `variant=\"value\"`.\n \n @slot icon - Replaces the default leading marker icon.\n * @slot value - Replaces the formatted value content for `variant=\"value\"`.\n */\n@customElement('obc-readout-setpoint')\nexport class ObcReadoutSetpoint extends LitElement {\n @property({type: String}) variant: ReadoutSetpointVariant =\n ReadoutSetpointVariant.setpoint;\n @property({type: String}) readoutStyle?: ReadoutSetpointReadoutStyle;\n @property({type: String}) direction?: ReadoutSetpointDirection;\n @property({type: String}) size: ReadoutSetpointSize =\n ReadoutSetpointSize.small;\n @property({\n type: String,\n reflect: true,\n })\n valueTypography?: ReadoutSetpointValueTypography;\n\n @property({type: String}) format?: ReadoutSetpointFormat;\n @property({type: String}) mode?: ReadoutSetpointMode;\n @property({type: String}) priority?: Priority;\n @property({type: Boolean, reflect: true}) hugContent = false;\n @property({type: Number}) minValueLength = 0;\n @property({type: Number}) value?: number;\n @property({type: Number}) secondaryValue?: number;\n @property({type: Boolean}) off = false;\n @property({type: String}) description = '';\n @property({type: Boolean}) hasHintedZeros = false;\n @property({type: Boolean}) hasDegree = false;\n @property({type: Boolean}) showZeroPadding = false;\n @property({type: Number}) fractionDigits = 0;\n\n @state() private hasAssignedValueIcon = false;\n\n @query('slot[name=\"icon\"]') private iconSlot?: HTMLSlotElement;\n\n private get resolvedFormat(): ReadoutSetpointFormat {\n return this.format ?? ReadoutSetpointFormat.regular;\n }\n\n private get resolvedMode(): ReadoutSetpointMode {\n return this.mode ?? ReadoutSetpointMode.display;\n }\n\n private get resolvedStateClass(): string {\n if (this.resolvedMode === ReadoutSetpointMode.setpointTemporary) {\n return 'setpoint-temporary';\n }\n if (this.resolvedMode === ReadoutSetpointMode.setpoint) {\n return 'setpoint';\n }\n return (this.priority ?? Priority.regular) === Priority.enhanced\n ? 'enhanced'\n : 'enabled';\n }\n\n private get resolvedHasDegree(): boolean {\n return this.hasDegree && !this.off;\n }\n\n private get resolvedSize(): ReadoutSetpointSize {\n return this.size;\n }\n\n private get resolvedInlineSize(): ReadoutSetpointSize {\n const format = this.resolvedFormat;\n const canPromoteToLarge =\n format !== ReadoutSetpointFormat.description &&\n format !== ReadoutSetpointFormat.range;\n\n if (\n this.direction === 'horizontal' &&\n canPromoteToLarge &&\n (this.readoutStyle === 'enhanced' \|\| this.readoutStyle === 'stack') &&\n (this.resolvedSize === ReadoutSetpointSize.regular \|\|\n this.resolvedSize === ReadoutSetpointSize.medium)\n ) {\n return ReadoutSetpointSize.large;\n }\n\n return this.resolvedSize;\n }\n\n private get resolvedValueVariantSize(): ReadoutSetpointSize {\n if (this.readoutStyle === 'enhanced' \|\| this.readoutStyle === 'stack') {\n return ReadoutSetpointSize.large;\n }\n\n if (this.readoutStyle === 'regular') {\n return this.resolvedInlineSize;\n }\n\n if (this.readoutStyle) {\n return ReadoutSetpointSize.medium;\n }\n\n return this.resolvedInlineSize;\n }\n\n private get resolvedVariantSize(): ReadoutSetpointSize {\n if (this.variant === ReadoutSetpointVariant.value) {\n return this.resolvedValueVariantSize;\n }\n\n return this.resolvedInlineSize;\n }\n\n private getValueVariantRenderModel(\n value: number \| undefined\n ): ReadoutValueRenderModel {\n const numericFormatOptions: ReadoutNumericFormatOptions = {\n showZeroPadding: this.showZeroPadding,\n minValueLength: this.minValueLength,\n fractionDigits: this.fractionDigits,\n };\n const formattedText = formatNumericValue(value, numericFormatOptions);\n const hintedText = getHintZeros(value, numericFormatOptions);\n\n return {\n hintedText,\n valueText: formattedText,\n };\n }\n\n private get valueVariantRenderModel(): ReadoutValueRenderModel {\n return this.getValueVariantRenderModel(this.value);\n }\n\n private get secondaryValueVariantRenderModel(): string {\n return this.getValueVariantRenderModel(this.secondaryValue).valueText;\n }\n\n private renderSetpointIcon() {\n return html`\n <slot\n name=\"icon\"\n @slotchange=${(event: Event) => {\n this.hasAssignedValueIcon =\n ((event.target as HTMLSlotElement).assignedElements({\n flatten: true,\n }).length ?? 0) > 0;\n }}\n ></slot>\n ${this.variant === ReadoutSetpointVariant.advice &&\n !this.hasAssignedValueIcon\n ? html`<obi-notification-advice></obi-notification-advice>`\n : nothing}\n `;\n }\n\n override firstUpdated() {\n this.hasAssignedValueIcon =\n (this.iconSlot?.assignedElements({flatten: true}).length ?? 0) > 0;\n }\n\n private get toneAccent() {\n if (this.priority === Priority.enhanced) {\n return true;\n }\n\n if (this.priority === Priority.regular) {\n return false;\n }\n\n if (this.variant === ReadoutSetpointVariant.value) {\n if (this.readoutStyle) {\n return (\n this.hasAttribute('data-obc-priority-scoped') &&\n this.priority === Priority.enhanced\n );\n }\n\n return true;\n }\n\n return this.priority === Priority.enhanced;\n }\n\n private get wrapperBaseClasses() {\n return {\n 'readout-setpoint-wrapper': true,\n [`variant-${this.variant}`]: true,\n 'tone-accent': this.toneAccent,\n [`direction-${this.direction}`]: Boolean(this.direction),\n [`readout-style-${this.readoutStyle}`]: Boolean(this.readoutStyle),\n [this.resolvedSize]: true,\n [`type-${this.resolvedFormat}`]: true,\n [`state-${this.resolvedStateClass}`]: true,\n 'no-hug-content': !this.hugContent,\n };\n }\n\n private get setpointValueClasses() {\n return {\n 'setpoint-value': true,\n [this.resolvedVariantSize]: true,\n 'has-fixed-length': this.minValueLength > 1,\n };\n }\n\n private renderValueVariantIcon() {\n return html`\n <div\n class=${classMap({\n 'icon-container': true,\n hidden: !this.hasAssignedValueIcon,\n })}\n aria-hidden=\"true\"\n >\n <div\n class=${classMap({\n 'setpoint-linear': true,\n [this.resolvedVariantSize]: true,\n })}\n >\n <slot\n name=\"icon\"\n @slotchange=${(event: Event) => {\n this.hasAssignedValueIcon =\n ((event.target as HTMLSlotElement).assignedElements({\n flatten: true,\n }).length ?? 0) > 0;\n }}\n ></slot>\n </div>\n </div>\n `;\n }\n\n private renderValueTextContent({\n hintedText,\n valueText,\n }: ReadoutValueRenderModel) {\n if (this.off) {\n return html`\n <span class=\"value-layer\">\n <span class=\"value\">OFF</span>\n </span>\n `;\n }\n\n let hasZeroPadding = true;\n if (hintedText === '') {\n hasZeroPadding = false;\n } else if (\n this.hugContent &&\n !this.hasHintedZeros &&\n this.variant !== ReadoutSetpointVariant.value\n ) {\n // TODO: Make a shadow element that reserve space the minimum value length.\n hasZeroPadding = false;\n }\n\n return html`\n <span class=\"value-layer\">\n ${hasZeroPadding\n ? html`<span\n class=${classMap({\n 'hinted-zero': true,\n 'is-hidden': !this.hasHintedZeros,\n })}\n aria-hidden=\"true\"\n >${hintedText}</span\n >`\n : nothing}\n <span class=\"value\">${valueText}</span>\n </span>\n `;\n }\n\n private renderValueVariantComponent() {\n const size = this.resolvedVariantSize;\n const valueModel = this.valueVariantRenderModel;\n\n return html`\n <div\n class=${classMap({\n 'readout-setpoint-wrapper': true,\n 'variant-value': true,\n 'tone-accent': this.toneAccent,\n [`direction-${this.direction}`]: Boolean(this.direction),\n [`readout-style-${this.readoutStyle}`]: Boolean(this.readoutStyle),\n [`state-${this.resolvedStateClass}`]: true,\n [size]: true,\n })}\n >\n ${this.renderValueVariantIcon()}\n <span\n class=${classMap({\n 'variant-value-content': true,\n [size]: true,\n 'with-degree': this.resolvedHasDegree,\n })}\n part=\"variant-value-content\"\n >\n <span class=\"value-content-container\" part=\"value-content-container\">\n <slot name=\"value\">\n ${this.renderValueTextContent(valueModel)}\n </slot>\n ${this.resolvedHasDegree\n ? html`<span class=\"degree\">°</span>`\n : nothing}\n </span>\n </span>\n </div>\n `;\n }\n\n private renderRegularValueInlineIcon(size: ReadoutSetpointSize) {\n const hideStyle = this.hasAssignedValueIcon\n ? ''\n : this.direction === 'vertical'\n ? 'visibility:hidden;'\n : 'display:none;';\n\n return html`\n <div class=\"icon-container\" aria-hidden=\"true\" style=${hideStyle}>\n <div\n class=${classMap({\n 'setpoint-linear': true,\n [size]: true,\n })}\n >\n <slot\n name=\"icon\"\n @slotchange=${(event: Event) => {\n this.hasAssignedValueIcon =\n ((event.target as HTMLSlotElement).assignedElements({\n flatten: true,\n }).length ?? 0) > 0;\n }}\n ></slot>\n </div>\n </div>\n `;\n }\n\n private renderRegularVerticalReadoutValueLikeInline() {\n const size = this.resolvedInlineSize;\n const valueModel = this.valueVariantRenderModel;\n\n return html`\n <div\n class=${classMap({\n 'readout-setpoint-wrapper': true,\n 'tone-accent': this.toneAccent,\n [`direction-${this.direction}`]: Boolean(this.direction),\n [`readout-style-${this.readoutStyle}`]: Boolean(this.readoutStyle),\n [`state-${this.resolvedStateClass}`]: true,\n [size]: true,\n [`type-${this.resolvedFormat}`]: true,\n 'no-hug-content': !this.hugContent,\n })}\n >\n ${this.renderRegularValueInlineIcon(size)}\n <div\n class=${classMap({\n 'setpoint-value': true,\n [size]: true,\n 'with-degree': this.resolvedHasDegree,\n })}\n >\n <span class=\"value-content-container\">\n ${this.renderValueTextContent(valueModel)}\n ${this.resolvedHasDegree\n ? html`<span class=\"degree\">°</span>`\n : nothing}\n </span>\n </div>\n </div>\n `;\n }\n\n private renderValueComponent() {\n const format = this.resolvedFormat;\n const valueModel = this.valueVariantRenderModel;\n const showsDescription =\n format === ReadoutSetpointFormat.description &&\n this.description.trim().length > 0;\n const showsVerticalStackLabel =\n format === ReadoutSetpointFormat.verticalStack &&\n this.description.trim().length > 0;\n const resolvedSecondaryValue = this.secondaryValueVariantRenderModel;\n const showsSecondaryValue =\n format === ReadoutSetpointFormat.range &&\n resolvedSecondaryValue.length > 0;\n return html`\n <span class=\"value-content-container\">\n ${this.renderValueTextContent(valueModel)}\n ${this.resolvedHasDegree\n ? html`<span class=\"degree\">°</span>`\n : nothing}\n </span>\n ${showsDescription\n ? html`\n <span class=\"description-box\">\n <span class=\"description\">${this.description}</span>\n </span>\n `\n : nothing}\n ${showsSecondaryValue\n ? html`\n <span class=\"secondary-value-box\">\n <span class=\"secondary-value\">${resolvedSecondaryValue}</span>\n </span>\n `\n : nothing}\n ${showsVerticalStackLabel\n ? html`\n <span class=\"vertical-stack-label-box\">\n <span class=\"vertical-stack-label\">${this.description}</span>\n </span>\n `\n : nothing}\n `;\n }\n\n private renderButtonComponent() {\n return html`\n <obc-button\n class=\"readout-setpoint-button\"\n variant=\"flat\"\n .fullWidth=${false}\n ?showLeadingIcon=${this.hasAssignedValueIcon}\n >\n <span slot=\"leading-icon\" class=\"readout-setpoint-button-icon\">\n ${this.renderSetpointIcon()}\n </span>\n <span\n class=${classMap({\n ...this.setpointValueClasses,\n 'with-degree': this.resolvedHasDegree,\n })}\n >\n ${this.renderValueComponent()}\n </span>\n </obc-button>\n `;\n }\n\n override render() {\n if (this.variant === ReadoutSetpointVariant.value) {\n if (this.readoutStyle === 'regular') {\n return this.renderRegularVerticalReadoutValueLikeInline();\n }\n return this.renderValueVariantComponent();\n }\n\n if (this.resolvedFormat === ReadoutSetpointFormat.button) {\n return html`\n <div class=${classMap(this.wrapperBaseClasses)}>\n ${this.renderButtonComponent()}\n </div>\n `;\n }\n\n return html`\n <div class=${classMap(this.wrapperBaseClasses)}>\n <div class=\"icon-container\" aria-hidden=\"true\">\n <div\n class=${classMap({\n 'setpoint-linear': true,\n [this.resolvedVariantSize]: true,\n })}\n >\n ${this.renderSetpointIcon()}\n </div>\n </div>\n <div\n class=${classMap({\n ...this.setpointValueClasses,\n 'with-degree': this.resolvedHasDegree,\n })}\n >\n ${this.renderValueComponent()}\n </div>\n </div>\n `;\n }\n\n static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-readout-setpoint': ObcReadoutSetpoint;\n }\n}\n"],"names":["ReadoutSetpointVariant","ReadoutSetpointSize","ReadoutSetpointFormat","ReadoutSetpointMode","ReadoutSetpointValueTypography"],"mappings":"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"}
1	+ {"version":3,"file":"readout-setpoint.js","sources":["../../../src/navigation-instruments/readout-setpoint/readout-setpoint.ts"],"sourcesContent":["import {LitElement, html, nothing, unsafeCSS} from 'lit';\nimport {property, query, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport componentStyle from './readout-setpoint.css?inline';\nimport {customElement} from '../../decorator.js';\nimport '../../components/button/button.js';\nimport '../../icons/icon-notification-advice.js';\nimport type {\n ReadoutDirection as ReadoutSetpointDirection,\n ReadoutVariant as ReadoutSetpointReadoutStyle,\n} from '../readout/readout.js';\nimport {Priority} from '../types.js';\nimport {\n getHintZeros,\n formatNumericValue,\n type ReadoutNumericFormatOptions,\n} from '../readout/readout-formatters.js';\n\nexport enum ReadoutSetpointVariant {\n setpoint = 'setpoint',\n advice = 'advice',\n value = 'value',\n}\n\nexport enum ReadoutSetpointSize {\n small = 'small',\n regular = 'regular',\n medium = 'medium',\n large = 'large',\n}\n\nexport enum ReadoutSetpointFormat {\n regular = 'regular',\n description = 'description',\n range = 'range',\n verticalStack = 'vertical-stack',\n baseline = 'baseline',\n button = 'button',\n}\n\nexport enum ReadoutSetpointMode {\n display = 'display',\n setpoint = 'setpoint',\n setpointTemporary = 'setpoint-temporary',\n}\n\nexport enum ReadoutSetpointValueTypography {\n regular = 'regular',\n medium = 'medium',\n large = 'large',\n}\n\ntype ReadoutValueRenderModel = {\n valueText: string; // formatted value\n hintedText: string; // hinted zeros (used to reserve space or for zero-padding)\n};\n\n/*\n `<obc-readout-setpoint>` - A readout segment for displaying a value, setpoint, or temporary entry.\n \n Renders a leading marker icon and a single value string with optional fixed-width rendering, hinted zero padding, and an optional degree suffix. Use it as a low-level building block when one value segment must be shown separately inside a larger readout.\n \n ## Features\n * - Variants: Supports `setpoint`, `advice`, and `value`.\n * - Sizes: Supports `small`, `regular`, `medium`, and `large`.\n * - Formats: Supports `regular`, `description`, `range`, `vertical-stack`, `baseline`, and `button`. Format selects the structural subtype; size is controlled independently via the `size` property.\n * - Mode axis: `mode` controls behavior/typography (`display`, `setpoint`, `setpointTemporary`).\n * - Priority axis: `priority` controls color emphasis (`regular`/`enhanced`).\n * - Width control: `minValueLength` defines the minimum digit count reserved for the formatted numeric value. Longer values expand the segment width naturally.\n * - Hinted zeros: `hasHintedZeros` renders muted leading zeroes that fill the remaining `minValueLength` slots when the formatted value is shorter than the minimum.\n * - Degree suffix: `hasDegree` renders a trailing degree symbol (`°`).\n * - Description line: `type=\"description\"` can render a secondary label below the value by using the `description` property.\n * - Range line: `type=\"range\"` can render a second numeric line below the value by using the `secondaryValue` property.\n * - Vertical stack marker: `type=\"vertical-stack\"` renders a trailing label to the right of the value.\n * - Icon override: A named slot can replace the default leading marker icon.\n \n ## Usage Guidelines\n * Use this component when one value segment needs to be rendered inside a larger readout composition. Prefer a higher-level readout container when label, unit, advice, or source content must be arranged together.\n \n For fixed-width layouts, set `minValueLength` to the minimum digit count the segment should reserve. Enable `hasHintedZeros` when the reserved leading positions should remain visible as muted zeroes; otherwise the space is preserved without a visible glyph.\n \n ## Slots\n \n - `icon`: Replaces the default leading marker icon.\n * - `value`: Replaces the formatted value content for `variant=\"value\"`.\n \n @slot icon - Replaces the default leading marker icon.\n * @slot value - Replaces the formatted value content for `variant=\"value\"`.\n */\n@customElement('obc-readout-setpoint')\nexport class ObcReadoutSetpoint extends LitElement {\n @property({type: String}) variant: ReadoutSetpointVariant =\n ReadoutSetpointVariant.setpoint;\n @property({type: String}) readoutStyle?: ReadoutSetpointReadoutStyle;\n @property({type: String}) direction?: ReadoutSetpointDirection;\n @property({type: String}) size: ReadoutSetpointSize =\n ReadoutSetpointSize.small;\n @property({\n type: String,\n reflect: true,\n })\n valueTypography?: ReadoutSetpointValueTypography;\n\n @property({type: String}) format?: ReadoutSetpointFormat;\n @property({type: String}) mode?: ReadoutSetpointMode;\n @property({type: String}) priority?: Priority;\n @property({type: Boolean, reflect: true}) hugContent = false;\n @property({type: Number}) minValueLength = 0;\n @property({type: Number}) value?: number;\n @property({type: Number}) secondaryValue?: number;\n @property({type: Boolean}) off = false;\n @property({type: String}) description = '';\n @property({type: Boolean}) hasHintedZeros = false;\n @property({type: Boolean}) hasDegree = false;\n @property({type: Boolean}) showZeroPadding = false;\n @property({type: Number}) fractionDigits = 0;\n @property({type: Boolean, attribute: false}) reserveSpaceForIcon = false;\n\n @state() private hasAssignedValueIcon = false;\n\n @query('slot[name=\"icon\"]') private iconSlot?: HTMLSlotElement;\n\n private get resolvedFormat(): ReadoutSetpointFormat {\n return this.format ?? ReadoutSetpointFormat.regular;\n }\n\n private get resolvedMode(): ReadoutSetpointMode {\n return this.mode ?? ReadoutSetpointMode.display;\n }\n\n private get resolvedStateClass(): string {\n if (this.resolvedMode === ReadoutSetpointMode.setpointTemporary) {\n return 'setpoint-temporary';\n }\n if (this.resolvedMode === ReadoutSetpointMode.setpoint) {\n return 'setpoint';\n }\n return (this.priority ?? Priority.regular) === Priority.enhanced\n ? 'enhanced'\n : 'enabled';\n }\n\n private get resolvedHasDegree(): boolean {\n return this.hasDegree && !this.off;\n }\n\n private get resolvedSize(): ReadoutSetpointSize {\n return this.size;\n }\n\n private get resolvedInlineSize(): ReadoutSetpointSize {\n const format = this.resolvedFormat;\n const canPromoteToLarge =\n format !== ReadoutSetpointFormat.description &&\n format !== ReadoutSetpointFormat.range;\n\n if (\n this.direction === 'horizontal' &&\n canPromoteToLarge &&\n (this.readoutStyle === 'enhanced' \|\| this.readoutStyle === 'stack') &&\n (this.resolvedSize === ReadoutSetpointSize.regular \|\|\n this.resolvedSize === ReadoutSetpointSize.medium)\n ) {\n return ReadoutSetpointSize.large;\n }\n\n return this.resolvedSize;\n }\n\n private get resolvedValueVariantSize(): ReadoutSetpointSize {\n if (this.readoutStyle === 'enhanced' \|\| this.readoutStyle === 'stack') {\n return ReadoutSetpointSize.large;\n }\n\n if (this.readoutStyle === 'regular') {\n return this.resolvedInlineSize;\n }\n\n if (this.readoutStyle) {\n return ReadoutSetpointSize.medium;\n }\n\n return this.resolvedInlineSize;\n }\n\n private get resolvedVariantSize(): ReadoutSetpointSize {\n if (this.variant === ReadoutSetpointVariant.value) {\n return this.resolvedValueVariantSize;\n }\n\n return this.resolvedInlineSize;\n }\n\n private getValueVariantRenderModel(\n value: number \| undefined\n ): ReadoutValueRenderModel {\n const numericFormatOptions: ReadoutNumericFormatOptions = {\n showZeroPadding: this.showZeroPadding,\n minValueLength: this.minValueLength,\n fractionDigits: this.fractionDigits,\n };\n const formattedText = formatNumericValue(value, numericFormatOptions);\n const hintedText = getHintZeros(value, numericFormatOptions);\n\n return {\n hintedText,\n valueText: formattedText,\n };\n }\n\n private get valueVariantRenderModel(): ReadoutValueRenderModel {\n return this.getValueVariantRenderModel(this.value);\n }\n\n private get secondaryValueVariantRenderModel(): string {\n return this.getValueVariantRenderModel(this.secondaryValue).valueText;\n }\n\n private renderSetpointIcon() {\n return html`\n <slot\n name=\"icon\"\n @slotchange=${(event: Event) => {\n this.hasAssignedValueIcon =\n ((event.target as HTMLSlotElement).assignedElements({\n flatten: true,\n }).length ?? 0) > 0;\n }}\n ></slot>\n ${this.variant === ReadoutSetpointVariant.advice &&\n !this.hasAssignedValueIcon\n ? html`<obi-notification-advice></obi-notification-advice>`\n : nothing}\n `;\n }\n\n override firstUpdated() {\n this.hasAssignedValueIcon =\n (this.iconSlot?.assignedElements({flatten: true}).length ?? 0) > 0;\n }\n\n private get toneAccent() {\n if (this.priority === Priority.enhanced) {\n return true;\n }\n\n if (this.priority === Priority.regular) {\n return false;\n }\n\n if (this.variant === ReadoutSetpointVariant.value) {\n if (this.readoutStyle) {\n return (\n this.hasAttribute('data-obc-priority-scoped') &&\n this.priority === Priority.enhanced\n );\n }\n\n return true;\n }\n\n return this.priority === Priority.enhanced;\n }\n\n private get wrapperBaseClasses() {\n return {\n 'readout-setpoint-wrapper': true,\n [`variant-${this.variant}`]: true,\n 'tone-accent': this.toneAccent,\n [`direction-${this.direction}`]: Boolean(this.direction),\n [`readout-style-${this.readoutStyle}`]: Boolean(this.readoutStyle),\n [this.resolvedSize]: true,\n [`type-${this.resolvedFormat}`]: true,\n [`state-${this.resolvedStateClass}`]: true,\n 'no-hug-content': !this.hugContent,\n };\n }\n\n private get setpointValueClasses() {\n return {\n 'setpoint-value': true,\n [this.resolvedVariantSize]: true,\n 'has-fixed-length': this.minValueLength > 1,\n };\n }\n\n private renderValueVariantIcon() {\n return html`\n <div\n class=${classMap({\n 'icon-container': true,\n hidden: !this.hasAssignedValueIcon,\n })}\n aria-hidden=\"true\"\n >\n <div\n class=${classMap({\n 'setpoint-linear': true,\n [this.resolvedVariantSize]: true,\n })}\n >\n <slot\n name=\"icon\"\n @slotchange=${(event: Event) => {\n this.hasAssignedValueIcon =\n ((event.target as HTMLSlotElement).assignedElements({\n flatten: true,\n }).length ?? 0) > 0;\n }}\n ></slot>\n </div>\n </div>\n `;\n }\n\n private renderValueTextContent({\n hintedText,\n valueText,\n }: ReadoutValueRenderModel) {\n if (this.off) {\n return html`\n <span class=\"value-layer\">\n <span class=\"value\">OFF</span>\n </span>\n `;\n }\n\n let hasZeroPadding = true;\n if (hintedText === '') {\n hasZeroPadding = false;\n } else if (\n this.hugContent &&\n !this.hasHintedZeros &&\n this.variant !== ReadoutSetpointVariant.value\n ) {\n // TODO: Make a shadow element that reserve space the minimum value length.\n hasZeroPadding = false;\n }\n\n return html`\n <span class=\"value-layer\">\n ${hasZeroPadding\n ? html`<span\n class=${classMap({\n 'hinted-zero': true,\n 'is-hidden': !this.hasHintedZeros,\n })}\n aria-hidden=\"true\"\n >${hintedText}</span\n >`\n : nothing}\n <span class=\"value\">${valueText}</span>\n </span>\n `;\n }\n\n private renderValueVariantComponent() {\n const size = this.resolvedVariantSize;\n const valueModel = this.valueVariantRenderModel;\n\n return html`\n <div\n class=${classMap({\n 'readout-setpoint-wrapper': true,\n 'variant-value': true,\n 'tone-accent': this.toneAccent,\n [`direction-${this.direction}`]: Boolean(this.direction),\n [`readout-style-${this.readoutStyle}`]: Boolean(this.readoutStyle),\n [`state-${this.resolvedStateClass}`]: true,\n [size]: true,\n })}\n >\n ${this.renderValueVariantIcon()}\n <span\n class=${classMap({\n 'variant-value-content': true,\n [size]: true,\n 'with-degree': this.resolvedHasDegree,\n })}\n part=\"variant-value-content\"\n >\n <span class=\"value-content-container\" part=\"value-content-container\">\n <slot name=\"value\">\n ${this.renderValueTextContent(valueModel)}\n </slot>\n ${this.resolvedHasDegree\n ? html`<span class=\"degree\">°</span>`\n : nothing}\n </span>\n </span>\n </div>\n `;\n }\n\n private renderRegularValueInlineIcon(size: ReadoutSetpointSize) {\n if (!this.reserveSpaceForIcon) {\n return nothing;\n }\n const hideStyle = this.hasAssignedValueIcon\n ? ''\n : this.direction === 'vertical'\n ? 'visibility:hidden;'\n : 'display:none;';\n\n return html`\n <div class=\"icon-container\" aria-hidden=\"true\" style=${hideStyle}>\n <div\n class=${classMap({\n 'setpoint-linear': true,\n [size]: true,\n })}\n >\n <slot\n name=\"icon\"\n @slotchange=${(event: Event) => {\n this.hasAssignedValueIcon =\n ((event.target as HTMLSlotElement).assignedElements({\n flatten: true,\n }).length ?? 0) > 0;\n }}\n ></slot>\n </div>\n </div>\n `;\n }\n\n private renderRegularVerticalReadoutValueLikeInline() {\n const size = this.resolvedInlineSize;\n const valueModel = this.valueVariantRenderModel;\n\n return html`\n <div\n class=${classMap({\n 'readout-setpoint-wrapper': true,\n 'tone-accent': this.toneAccent,\n [`direction-${this.direction}`]: Boolean(this.direction),\n [`readout-style-${this.readoutStyle}`]: Boolean(this.readoutStyle),\n [`state-${this.resolvedStateClass}`]: true,\n [size]: true,\n [`type-${this.resolvedFormat}`]: true,\n 'no-hug-content': !this.hugContent,\n })}\n >\n ${this.renderRegularValueInlineIcon(size)}\n <div\n class=${classMap({\n 'setpoint-value': true,\n [size]: true,\n 'with-degree': this.resolvedHasDegree,\n })}\n >\n <span class=\"value-content-container\">\n ${this.renderValueTextContent(valueModel)}\n ${this.resolvedHasDegree\n ? html`<span class=\"degree\">°</span>`\n : nothing}\n </span>\n </div>\n </div>\n `;\n }\n\n private renderValueComponent() {\n const format = this.resolvedFormat;\n const valueModel = this.valueVariantRenderModel;\n const showsDescription =\n format === ReadoutSetpointFormat.description &&\n this.description.trim().length > 0;\n const showsVerticalStackLabel =\n format === ReadoutSetpointFormat.verticalStack &&\n this.description.trim().length > 0;\n const resolvedSecondaryValue = this.secondaryValueVariantRenderModel;\n const showsSecondaryValue =\n format === ReadoutSetpointFormat.range &&\n resolvedSecondaryValue.length > 0;\n return html`\n <span class=\"value-content-container\">\n ${this.renderValueTextContent(valueModel)}\n ${this.resolvedHasDegree\n ? html`<span class=\"degree\">°</span>`\n : nothing}\n </span>\n ${showsDescription\n ? html`\n <span class=\"description-box\">\n <span class=\"description\">${this.description}</span>\n </span>\n `\n : nothing}\n ${showsSecondaryValue\n ? html`\n <span class=\"secondary-value-box\">\n <span class=\"secondary-value\">${resolvedSecondaryValue}</span>\n </span>\n `\n : nothing}\n ${showsVerticalStackLabel\n ? html`\n <span class=\"vertical-stack-label-box\">\n <span class=\"vertical-stack-label\">${this.description}</span>\n </span>\n `\n : nothing}\n `;\n }\n\n private renderButtonComponent() {\n return html`\n <obc-button\n class=\"readout-setpoint-button\"\n variant=\"flat\"\n .fullWidth=${false}\n ?showLeadingIcon=${this.hasAssignedValueIcon}\n >\n <span slot=\"leading-icon\" class=\"readout-setpoint-button-icon\">\n ${this.renderSetpointIcon()}\n </span>\n <span\n class=${classMap({\n ...this.setpointValueClasses,\n 'with-degree': this.resolvedHasDegree,\n })}\n >\n ${this.renderValueComponent()}\n </span>\n </obc-button>\n `;\n }\n\n override render() {\n if (this.variant === ReadoutSetpointVariant.value) {\n if (this.readoutStyle === 'regular') {\n return this.renderRegularVerticalReadoutValueLikeInline();\n }\n return this.renderValueVariantComponent();\n }\n\n if (this.resolvedFormat === ReadoutSetpointFormat.button) {\n return html`\n <div class=${classMap(this.wrapperBaseClasses)}>\n ${this.renderButtonComponent()}\n </div>\n `;\n }\n\n return html`\n <div class=${classMap(this.wrapperBaseClasses)}>\n <div class=\"icon-container\" aria-hidden=\"true\">\n <div\n class=${classMap({\n 'setpoint-linear': true,\n [this.resolvedVariantSize]: true,\n })}\n >\n ${this.renderSetpointIcon()}\n </div>\n </div>\n <div\n class=${classMap({\n ...this.setpointValueClasses,\n 'with-degree': this.resolvedHasDegree,\n })}\n >\n ${this.renderValueComponent()}\n </div>\n </div>\n `;\n }\n\n static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-readout-setpoint': ObcReadoutSetpoint;\n }\n}\n"],"names":["ReadoutSetpointVariant","ReadoutSetpointSize","ReadoutSetpointFormat","ReadoutSetpointMode","ReadoutSetpointValueTypography"],"mappings":"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"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@oicl/openbridge-webcomponents-full-bundle",
-  "version": "2.0.0-next.54",
+  "version": "2.0.0-next.55",
   "type": "module",
   "repository": {
     "type": "git",

package/src/integration-systems/integration-bar/integration-bar.css CHANGED Viewed

@@ -37,14 +37,21 @@
   flex: 1 1 auto;
 }
-.integration-buttons-slot::slotted(obc-integration-button) {
+.integration-buttons-slot::slotted(*) {
+  display: flex;
   flex: 1;
 }
-.hug-buttons-slot::slotted(obc-integration-button) {
+.hug-buttons-slot::slotted(*) {
+  display: flex;
   flex: 0 1 auto;
 }
+.hug-buttons-slot,
+.integration-buttons-slot {
+  display: contents;
+}
 .home-button,
 .link-button {
   width: var(--app-components-integration-system-icon-button-touch-target);

package/src/navigation-instruments/readout/readout.css CHANGED Viewed

@@ -394,8 +394,12 @@
   margin-left: 0;
 }
-.readout.stack.vertical.alignment-center {
+.readout.vertical.alignment-center {
   justify-items: center;
+  > * {
+    justify-self: center !important;
+  }
 }
 .readout.stack.vertical.alignment-center

package/src/navigation-instruments/readout/readout.stories.ts CHANGED Viewed

@@ -40,6 +40,11 @@ const meta: Meta<ObcReadout> = {
     direction: ReadoutDirection.vertical,
   },
   argTypes: {
+    value: {
+      control: {
+        type: 'number',
+      },
+    },
     variant: {
       control: {
         type: 'select',
@@ -226,3 +231,24 @@ export const Off: Story = {
   },
   render: (args) => renderComponent(args as ObcReadout),
 };
+export const Center: Story = {
+  args: {
+    value: 100,
+    hasDegree: false,
+    hasSetpoint: true,
+    setpointValue: 12,
+    setpointSecondaryValue: 14,
+    adviceValue: 16,
+    adviceSecondaryValue: 18,
+    label: 'SOG',
+    unit: 'kn',
+    minValueLength: 0,
+    variant: 'regular',
+    valuePriority: 'regular',
+    direction: 'vertical',
+    alignment: 'center',
+  },
+  render: (args) => renderComponent(args as ObcReadout),
+};

package/src/navigation-instruments/readout/readout.ts CHANGED Viewed

@@ -779,6 +779,8 @@ export class ObcReadout extends LitElement {
       >
         <slot name="setpoint">
           <obc-readout-setpoint
+            .reserveSpaceForIcon=${this.alignment !==
+            ReadoutStackVerticalAlignment.center}
             data-obc-value-typography=${this.variant ===
               ReadoutVariant.regular &&
             this.isVertical &&

package/src/navigation-instruments/readout-list-item/readout-list-item.css CHANGED Viewed

@@ -3,17 +3,14 @@
 }
 :host {
-  display: inline-flex;
-  min-width: 160px;
-  width: max-content;
-  max-width: none;
+  display: block;
+  width: 100%;
 }
 .root {
   display: inline-flex;
   align-items: flex-end;
   border-radius: var(--global-border-radius-border-radius-base);
-  max-width: none;
   width: 100%;
   .content {

package/src/navigation-instruments/readout-list-item/readout-list-item.stories.ts CHANGED Viewed

@@ -31,6 +31,7 @@ type ReadoutListItemStoryArgs = {
   value: number;
   fractionDigits: number;
   showZeroPadding: boolean;
+  labelOnly: boolean;
 };
 type ReadoutShowcaseCase = {
@@ -174,6 +175,7 @@ function renderReadoutListItem(args: Partial<ReadoutListItemStoryArgs>) {
       .value=${resolved.value}
       .fractionDigits=${resolved.fractionDigits}
       .showZeroPadding=${resolved.showZeroPadding}
+      .labelOnly=${resolved.labelOnly}
     >
       ${resolved.hasLeadingIcon
         ? html`<span

package/src/navigation-instruments/readout-list-item/readout-list-item.ts CHANGED Viewed

@@ -95,6 +95,8 @@ export class ObcReadoutListItem extends LitElement {
   @property({type: Number}) minValueLength = 0;
   @property({type: Boolean}) hasHintedZeros = false;
+  @property({type: Boolean}) labelOnly = false;
   private get resolvedMainValueSize(): ReadoutSetpointSize {
     return this.size === ReadoutListItemSize.enhanced
       ? ReadoutSetpointSize.large
@@ -395,11 +397,15 @@ export class ObcReadoutListItem extends LitElement {
             ${this.renderLabelContainer()}
           </div>
-          <div class="value-container" part="value-container">
-            ${this.renderValue()} ${this.renderTrailingUnit()}
-          </div>
+          ${this.labelOnly
+            ? nothing
+            : html`
+                <div class="value-container" part="value-container">
+                  ${this.renderValue()} ${this.renderTrailingUnit()}
+                </div>
-          ${this.renderTrailingSource()}
+                ${this.renderTrailingSource()}
+              `}
         </div>
       </div>
     `;

package/src/navigation-instruments/readout-setpoint/readout-setpoint.ts CHANGED Viewed

@@ -114,6 +114,7 @@ export class ObcReadoutSetpoint extends LitElement {
   @property({type: Boolean}) hasDegree = false;
   @property({type: Boolean}) showZeroPadding = false;
   @property({type: Number}) fractionDigits = 0;
+  @property({type: Boolean, attribute: false}) reserveSpaceForIcon = false;
   @state() private hasAssignedValueIcon = false;
@@ -392,6 +393,9 @@ export class ObcReadoutSetpoint extends LitElement {
   }
   private renderRegularValueInlineIcon(size: ReadoutSetpointSize) {
+    if (!this.reserveSpaceForIcon) {
+      return nothing;
+    }
     const hideStyle = this.hasAssignedValueIcon
       ? ''
       : this.direction === 'vertical'