@oicl/openbridge-webcomponents 0.0.20260408055359 → 0.0.20260408064217

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 (15) hide show
  1. package/dist/components/app-button/app-button.css.js +2 -1
  2. package/dist/components/app-button/app-button.css.js.map +1 -1
  3. package/dist/components/app-menu/app-menu.css.js +6 -4
  4. package/dist/components/app-menu/app-menu.css.js.map +1 -1
  5. package/dist/navigation-instruments/instrument-field/instrument-field.d.ts +0 -7
  6. package/dist/navigation-instruments/instrument-field/instrument-field.d.ts.map +1 -1
  7. package/dist/navigation-instruments/instrument-field/instrument-field.js +6 -34
  8. package/dist/navigation-instruments/instrument-field/instrument-field.js.map +1 -1
  9. package/package.json +1 -1
  10. package/dist/components/context-menu/context-menu.css.js +0 -21
  11. package/dist/components/context-menu/context-menu.css.js.map +0 -1
  12. package/dist/components/context-menu/context-menu.d.ts +0 -54
  13. package/dist/components/context-menu/context-menu.d.ts.map +0 -1
  14. package/dist/components/context-menu/context-menu.js +0 -26
  15. package/dist/components/context-menu/context-menu.js.map +0 -1
package/dist/components/app-button/app-button.css.js CHANGED
@@ -90,7 +90,7 @@ const compentStyle = css`
90
90
 
91
91
  width: var(--ui-components-app-button-visual-size-enhanced);
92
92
  height: var(--ui-components-app-button-visual-size-enhanced);
93
- border-radius: 100%;
93
+ border-radius: var(--ui-components-app-button-border-radius-large);
94
94
 
95
95
  display: flex;
96
96
 
@@ -125,6 +125,7 @@ const compentStyle = css`
125
125
  .wrapper.small .icon-wrapper {
126
126
  width: var(--ui-components-app-button-visual-size);
127
127
  height: var(--ui-components-app-button-visual-size);
128
+ border-radius: var(--ui-components-app-button-border-radius-small);
128
129
  }
129
130
 
130
131
  .wrapper.small .icon {
package/dist/components/app-button/app-button.css.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"app-button.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"app-button.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/dist/components/app-menu/app-menu.css.js CHANGED
@@ -10,15 +10,17 @@ const compentStyle = css`
10
10
  box-shadow: var(--shadow-floating);
11
11
  display: flex;
12
12
  flex-direction: column;
13
- padding: 8px 24px 8px;
13
+ padding: var(--app-components-app-menu-padding-vertical)
14
+ var(--app-components-app-menu-margin-horizontal);
14
15
  box-sizing: border-box;
15
- max-width: 440px;
16
+ width: fit-content;
16
17
  }
17
18
  .card .main-apps {
18
19
  display: grid;
19
20
  grid-template-columns: repeat(4, 1fr);
20
- gap: 16px;
21
- padding: 24px 0;
21
+ gap: 0 var(--app-components-app-menu-app-button-spacing);
22
+ padding: var(--app-components-app-menu-padding-vertical)
23
+ var(--app-components-app-menu-padding-horizontal);
22
24
  }
23
25
  `;
24
26
  export {
package/dist/components/app-menu/app-menu.css.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"app-menu.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"app-menu.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;"}
package/dist/navigation-instruments/instrument-field/instrument-field.d.ts CHANGED
@@ -1,7 +1,6 @@
1
1
  import { LitElement } from 'lit';
2
2
  import '../../components/button/button.js';
3
3
  import '../../icons/icon-drop-down-google.js';
4
- import '../../components/context-menu/context-menu.js';
5
4
  import '../../components/navigation-item/navigation-item.js';
6
5
  /**
7
6
  * Enum for instrument field sizes.
@@ -30,10 +29,8 @@ export declare enum InstrumentFieldSize {
30
29
  * | Slot Name | Purpose |
31
30
  * |---------------------|-------------------------------------------------------------------------|
32
31
  * | off-value | Content to display when the `off` property is true (defaults to "OFF"). |
33
- * | src-picker-content | Content for the source picker context menu (e.g., a list of sources). |
34
32
  *
35
33
  * @slot off-value - Content to display when the `off` property is true (defaults to "OFF").
36
- * @slot src-picker-content - Content for the source picker context menu (e.g., a list of sources).
37
34
  *
38
35
  * @csspart label - The container for the tag and unit.
39
36
  * @csspart tag - The tag text element.
@@ -71,14 +68,10 @@ export declare class ObcInstrumentField extends LitElement {
71
68
  labelOnly: boolean;
72
69
  /** If true, displays the "off" state (e.g., showing "OFF" instead of value). */
73
70
  off: boolean;
74
- /** If true, the source field acts as a button to open a picker. */
75
- hasSrcPicker: boolean;
76
71
  /** If true, automatically hides the setpoint when the value is close to it. */
77
72
  autoHideSetpoint: boolean;
78
73
  /** The deadband within which the setpoint is hidden if `autoHideSetpoint` is true. */
79
74
  autoHideDeadband: number;
80
- /** Controls the visibility of the source picker context menu. */
81
- private srcPickerContentVisible;
82
75
  /**
83
76
  * Generates a dashed string representation for undefined values.
84
77
  * @returns A string of dashes formatted according to the current numeric settings.
package/dist/navigation-instruments/instrument-field/instrument-field.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"instrument-field.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/instrument-field/instrument-field.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAA2B,MAAM,KAAK,CAAC;AAIzD,OAAO,mCAAmC,CAAC;AAC3C,OAAO,sCAAsC,CAAC;AAC9C,OAAO,+CAA+C,CAAC;AACvD,OAAO,qDAAqD,CAAC;AAG7D;;;;GAIG;AACH,oBAAY,mBAAmB;IAC7B,OAAO,YAAY;IACnB,QAAQ,aAAa;CACtB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,qBACa,kBAAmB,SAAQ,UAAU;IAChD,wCAAwC;IACd,IAAI,EAAE,mBAAmB,CACrB;IAE9B,qCAAqC;IACX,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAEvD,oCAAoC;IACT,WAAW,UAAS;IAE/C,8CAA8C;IACnB,MAAM,UAAS;IAE1C,oCAAoC;IACV,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAEpD,uEAAuE;IAC7C,SAAS,SAAK;IAExC,uDAAuD;IAC5B,eAAe,UAAS;IAEnD,+CAA+C;IACrB,cAAc,SAAK;IAE7C,0DAA0D;IAChC,GAAG,SAAM;IAEnC,mDAAmD;IACzB,IAAI,SAAM;IAEpC,+CAA+C;IACrB,GAAG,SAAM;IAEnC,oFAAoF;IACzD,YAAY,UAAS;IAEhD,yCAAyC;IACd,UAAU,UAAS;IAE9C,oCAAoC;IACT,MAAM,UAAS;IAE1C,2DAA2D;IAChC,SAAS,UAAS;IAE7C,gFAAgF;IACrD,GAAG,UAAS;IAEvC,mEAAmE;IACxC,YAAY,UAAS;IAEhD,+EAA+E;IACpD,gBAAgB,UAAS;IAEpD,sFAAsF;IAC5D,gBAAgB,SAAK;IAE/C,iEAAiE;IACxD,OAAO,CAAC,uBAAuB,CAAS;IAEjD;;;OAGG;IACH,eAAe,IAAI,MAAM;IAYhB,MAAM;IAqGf;;;OAGG;IACH,IAAI,wBAAwB,IAAI,MAAM,CAMrC;IAED;;;OAGG;IACH,IAAI,gBAAgB,IAAI,MAAM,CAM7B;IAED;;;OAGG;IACH,IAAI,SAAS,IAAI,MAAM,CAUtB;IAED,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,sBAAsB,EAAE,kBAAkB,CAAC;KAC5C;CACF"}
1
+ {"version":3,"file":"instrument-field.d.ts","sourceRoot":"","sources":["../../../src/navigation-instruments/instrument-field/instrument-field.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAA2B,MAAM,KAAK,CAAC;AAIzD,OAAO,mCAAmC,CAAC;AAC3C,OAAO,sCAAsC,CAAC;AAC9C,OAAO,qDAAqD,CAAC;AAG7D;;;;GAIG;AACH,oBAAY,mBAAmB;IAC7B,OAAO,YAAY;IACnB,QAAQ,aAAa;CACtB;AAED;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,qBACa,kBAAmB,SAAQ,UAAU;IAChD,wCAAwC;IACd,IAAI,EAAE,mBAAmB,CACrB;IAE9B,qCAAqC;IACX,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAEvD,oCAAoC;IACT,WAAW,UAAS;IAE/C,8CAA8C;IACnB,MAAM,UAAS;IAE1C,oCAAoC;IACV,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAEpD,uEAAuE;IAC7C,SAAS,SAAK;IAExC,uDAAuD;IAC5B,eAAe,UAAS;IAEnD,+CAA+C;IACrB,cAAc,SAAK;IAE7C,0DAA0D;IAChC,GAAG,SAAM;IAEnC,mDAAmD;IACzB,IAAI,SAAM;IAEpC,+CAA+C;IACrB,GAAG,SAAM;IAEnC,oFAAoF;IACzD,YAAY,UAAS;IAEhD,yCAAyC;IACd,UAAU,UAAS;IAE9C,oCAAoC;IACT,MAAM,UAAS;IAE1C,2DAA2D;IAChC,SAAS,UAAS;IAE7C,gFAAgF;IACrD,GAAG,UAAS;IAEvC,+EAA+E;IACpD,gBAAgB,UAAS;IAEpD,sFAAsF;IAC5D,gBAAgB,SAAK;IAE/C;;;OAGG;IACH,eAAe,IAAI,MAAM;IAYhB,MAAM;IA0Ef;;;OAGG;IACH,IAAI,wBAAwB,IAAI,MAAM,CAMrC;IAED;;;OAGG;IACH,IAAI,gBAAgB,IAAI,MAAM,CAM7B;IAED;;;OAGG;IACH,IAAI,SAAS,IAAI,MAAM,CAUtB;IAED,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,sBAAsB,EAAE,kBAAkB,CAAC;KAC5C;CACF"}
package/dist/navigation-instruments/instrument-field/instrument-field.js CHANGED
@@ -1,10 +1,9 @@
1
1
  import { unsafeCSS, LitElement, nothing, html } from "lit";
2
- import { property, state } from "lit/decorators.js";
2
+ import { property } from "lit/decorators.js";
3
3
  import compentStyle from "./instrument-field.css.js";
4
4
  import { classMap } from "lit/directives/class-map.js";
5
5
  import "../../components/button/button.js";
6
6
  import "../../icons/icon-drop-down-google.js";
7
- import "../../components/context-menu/context-menu.js";
8
7
  import "../../components/navigation-item/navigation-item.js";
9
8
  import { customElement } from "../../decorator.js";
10
9
  var __defProp = Object.defineProperty;
@@ -39,10 +38,8 @@ let ObcInstrumentField = class extends LitElement {
39
38
  this.center = false;
40
39
  this.labelOnly = false;
41
40
  this.off = false;
42
- this.hasSrcPicker = false;
43
41
  this.autoHideSetpoint = false;
44
42
  this.autoHideDeadband = 0;
45
- this.srcPickerContentVisible = false;
46
43
  }
47
44
  /**
48
45
  * Generates a dashed string representation for undefined values.
@@ -92,40 +89,21 @@ let ObcInstrumentField = class extends LitElement {
92
89
  />
93
90
  </svg>
94
91
  <div class="setpoint-value">${this.setpointValueBlueNumbers}</div>
95
- </div>` : null}
96
- ${this.horizontal && !this.labelOnly && this.hasSetpoint ? html`<div class="divider"></div>` : null}
92
+ </div>` : nothing}
93
+ ${this.horizontal && !this.labelOnly && this.hasSetpoint ? html`<div class="divider"></div>` : nothing}
97
94
  ${!this.labelOnly ? html` <div class="value">
98
95
  ${this.off ? html`<div class="value-blue">
99
96
  <slot name="off-value">OFF</slot>
100
97
  </div>` : html` <div class="value-hint-zero">${this.hintZeros}</div>
101
98
  <div class="value-blue">${this.valueBlueNumbers}</div>`}
102
- </div>` : null}
99
+ </div>` : nothing}
103
100
  <div class="label" part="label">
104
101
  ${this.horizontal && this.size === "regular" ? nothing : html`<div class="tag" part="tag">${this.tag}</div>`}
105
102
  <div class="unit">${this.unit}</div>
106
103
  </div>
107
- ${this.hasSrc && this.horizontal ? html`<div class="divider src-divider"></div>` : null}
108
- ${this.hasSrc ? this.hasSrcPicker ? html`<div class="src">
109
- <obc-button
110
- variant="flat"
111
- showTrailingIcon
112
- class="src-picker"
113
- @click=${() => this.srcPickerContentVisible = !this.srcPickerContentVisible}
114
- showTrailingIcon
115
- >
116
- ${this.src}
117
- <obi-drop-down-google
118
- slot="trailing-icon"
119
- ></obi-drop-down-google>
120
- </obc-button>
121
- </div>` : html`<div class="src">${this.src}</div>` : null}
104
+ ${this.hasSrc && this.horizontal ? html`<div class="divider src-divider"></div>` : nothing}
105
+ ${this.hasSrc ? html`<div class="src">${this.src}</div>` : nothing}
122
106
  </div>
123
- ${this.hasSrcPicker && this.srcPickerContentVisible ? html`<obc-context-menu
124
- class="src-picker-content"
125
- @click=${() => this.srcPickerContentVisible = false}
126
- >
127
- <slot name="src-picker-content"></slot>
128
- </obc-context-menu>` : nothing}
129
107
  `;
130
108
  }
131
109
  /**
@@ -213,18 +191,12 @@ __decorateClass([
213
191
  __decorateClass([
214
192
  property({ type: Boolean })
215
193
  ], ObcInstrumentField.prototype, "off", 2);
216
- __decorateClass([
217
- property({ type: Boolean })
218
- ], ObcInstrumentField.prototype, "hasSrcPicker", 2);
219
194
  __decorateClass([
220
195
  property({ type: Boolean })
221
196
  ], ObcInstrumentField.prototype, "autoHideSetpoint", 2);
222
197
  __decorateClass([
223
198
  property({ type: Number })
224
199
  ], ObcInstrumentField.prototype, "autoHideDeadband", 2);
225
- __decorateClass([
226
- state()
227
- ], ObcInstrumentField.prototype, "srcPickerContentVisible", 2);
228
200
  ObcInstrumentField = __decorateClass([
229
201
  customElement("obc-instrument-field")
230
202
  ], ObcInstrumentField);
package/dist/navigation-instruments/instrument-field/instrument-field.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"instrument-field.js","sources":["../../../src/navigation-instruments/instrument-field/instrument-field.ts"],"sourcesContent":["import {LitElement, html, nothing, unsafeCSS} from 'lit';\nimport {property, state} from 'lit/decorators.js';\nimport compentStyle from './instrument-field.css?inline';\nimport {classMap} from 'lit/directives/class-map.js';\nimport '../../components/button/button.js';\nimport '../../icons/icon-drop-down-google.js';\nimport '../../components/context-menu/context-menu.js';\nimport '../../components/navigation-item/navigation-item.js';\nimport {customElement} from '../../decorator.js';\n\n/**\n * Enum for instrument field sizes.\n * - `regular`: Standard size for navigation instrument data fields.\n * - `enhanced`: Larger size with increased visual prominence.\n */\nexport enum InstrumentFieldSize {\n regular = 'regular',\n enhanced = 'enhanced',\n}\n\n/**\n * `<obc-instrument-field>` – A component for displaying navigation instrument data.\n *\n * This component is used to show a primary value, an optional setpoint, units, and a source (e.g., GPS, Gyro).\n * It supports different sizes, horizontal/vertical layouts, and configurable numeric formatting.\n *\n * ### Features\n * - **Sizes:** Supports `regular` and `enhanced` sizes.\n * - **Setpoint:** Optional setpoint display with an arrow indicator.\n * - **Source Picker:** Optional source selection with a dropdown and context menu.\n * - **Formatting:** Customizable integer and fraction digits, with optional zero padding.\n * - **Status Indicators:** Supports an \"OFF\" state and neutral color mode.\n * - **Layouts:** Can be oriented horizontally or vertically, with various alignment options.\n *\n * ### Slots\n * | Slot Name | Purpose |\n * |---------------------|-------------------------------------------------------------------------|\n * | off-value | Content to display when the `off` property is true (defaults to \"OFF\"). |\n * | src-picker-content | Content for the source picker context menu (e.g., a list of sources). |\n *\n * @slot off-value - Content to display when the `off` property is true (defaults to \"OFF\").\n * @slot src-picker-content - Content for the source picker context menu (e.g., a list of sources).\n *\n * @csspart label - The container for the tag and unit.\n * @csspart tag - The tag text element.\n */\n@customElement('obc-instrument-field')\nexport class ObcInstrumentField extends LitElement {\n /** The size of the instrument field. */\n @property({type: String}) size: InstrumentFieldSize =\n InstrumentFieldSize.regular;\n\n /** The setpoint value to display. */\n @property({type: Number}) setpoint: number | undefined;\n\n /** Whether to show the setpoint. */\n @property({type: Boolean}) hasSetpoint = false;\n\n /** Whether to show the source (src) field. */\n @property({type: Boolean}) hasSrc = false;\n\n /** The primary value to display. */\n @property({type: Number}) value: number | undefined;\n\n /** The maximum number of integer digits to show (for zero padding). */\n @property({type: Number}) maxDigits = 1;\n\n /** Whether to show leading zeros up to `maxDigits`. */\n @property({type: Boolean}) showZeroPadding = false;\n\n /** The number of decimal places to display. */\n @property({type: Number}) fractionDigits = 0;\n\n /** The tag or label for the data (e.g., \"HDG\", \"SPD\"). */\n @property({type: String}) tag = '';\n\n /** The unit of measurement (e.g., \"DEG\", \"KN\"). */\n @property({type: String}) unit = '';\n\n /** The current source name (e.g., \"GPS 1\"). */\n @property({type: String}) src = '';\n\n /** If true, uses a neutral color scheme instead of the default instrument color. */\n @property({type: Boolean}) neutralColor = false;\n\n /** If true, uses a horizontal layout. */\n @property({type: Boolean}) horizontal = false;\n\n /** If true, centers the content. */\n @property({type: Boolean}) center = false;\n\n /** If true, only the label (tag and unit) is displayed. */\n @property({type: Boolean}) labelOnly = false;\n\n /** If true, displays the \"off\" state (e.g., showing \"OFF\" instead of value). */\n @property({type: Boolean}) off = false;\n\n /** If true, the source field acts as a button to open a picker. */\n @property({type: Boolean}) hasSrcPicker = false;\n\n /** If true, automatically hides the setpoint when the value is close to it. */\n @property({type: Boolean}) autoHideSetpoint = false;\n\n /** The deadband within which the setpoint is hidden if `autoHideSetpoint` is true. */\n @property({type: Number}) autoHideDeadband = 0;\n\n /** Controls the visibility of the source picker context menu. */\n @state() private srcPickerContentVisible = false;\n\n /**\n * Generates a dashed string representation for undefined values.\n * @returns A string of dashes formatted according to the current numeric settings.\n */\n dashedGenerator(): string {\n const n = this.showZeroPadding ? Math.max(this.maxDigits, 1) : 1;\n if (this.fractionDigits < 1) {\n return '-'.repeat(n);\n } else {\n const diff = n - this.fractionDigits;\n return (\n '-'.repeat(Math.max(diff, 1)) + '.' + '-'.repeat(this.fractionDigits)\n );\n }\n }\n\n override render() {\n const hideSetpoint =\n this.hasSetpoint &&\n this.autoHideSetpoint &&\n this.setpoint !== undefined &&\n this.value !== undefined &&\n Math.abs(this.setpoint - this.value) <= this.autoHideDeadband;\n\n return html`\n <div\n class=${classMap({\n wrapper: true,\n [this.size]: true,\n 'neutral-color': this.neutralColor,\n off: this.off,\n horizontal: this.horizontal,\n center: this.center,\n 'left-aligned':\n this.labelOnly || (this.horizontal && !this.hasSetpoint),\n 'hide-setpoint': hideSetpoint,\n 'show-zero-padding': this.showZeroPadding,\n })}\n >\n ${this.horizontal && this.size === InstrumentFieldSize.regular\n ? html`<div class=\"label\">\n <div class=\"tag\" part=\"tag\">${this.tag}</div>\n </div>`\n : nothing}\n ${this.hasSetpoint\n ? html`<div class=\"setpoint\">\n <svg\n class=\"setpoint-arrow\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill=\"var(--instrument-enhanced-secondary-color)\"\n d=\"M4.66797 4.80263C4.66797 4.14363 5.45194 3.76746 6.0013 4.16286L10.4456 7.17243C11.0312 7.56899 11.0314 8.43154 10.4459 8.82828L6.0013 11.8401C5.45194 12.2355 4.66797 11.8593 4.66797 11.2003L4.66797 4.80263Z\"\n fill=\"var(--instrument-enhanced-primary-color)\"\n />\n </svg>\n <div class=\"setpoint-value\">${this.setpointValueBlueNumbers}</div>\n </div>`\n : null}\n ${this.horizontal && !this.labelOnly && this.hasSetpoint\n ? html`<div class=\"divider\"></div>`\n : null}\n ${!this.labelOnly\n ? html` <div class=\"value\">\n ${this.off\n ? html`<div class=\"value-blue\">\n <slot name=\"off-value\">OFF</slot>\n </div>`\n : html` <div class=\"value-hint-zero\">${this.hintZeros}</div>\n <div class=\"value-blue\">${this.valueBlueNumbers}</div>`}\n </div>`\n : null}\n <div class=\"label\" part=\"label\">\n ${this.horizontal && this.size === InstrumentFieldSize.regular\n ? nothing\n : html`<div class=\"tag\" part=\"tag\">${this.tag}</div>`}\n <div class=\"unit\">${this.unit}</div>\n </div>\n ${this.hasSrc && this.horizontal\n ? html`<div class=\"divider src-divider\"></div>`\n : null}\n ${this.hasSrc\n ? this.hasSrcPicker\n ? html`<div class=\"src\">\n <obc-button\n variant=\"flat\"\n showTrailingIcon\n class=\"src-picker\"\n @click=${() =>\n (this.srcPickerContentVisible =\n !this.srcPickerContentVisible)}\n showTrailingIcon\n >\n ${this.src}\n <obi-drop-down-google\n slot=\"trailing-icon\"\n ></obi-drop-down-google>\n </obc-button>\n </div>`\n : html`<div class=\"src\">${this.src}</div>`\n : null}\n </div>\n ${this.hasSrcPicker && this.srcPickerContentVisible\n ? html`<obc-context-menu\n class=\"src-picker-content\"\n @click=${() => (this.srcPickerContentVisible = false)}\n >\n <slot name=\"src-picker-content\"></slot>\n </obc-context-menu>`\n : nothing}\n `;\n }\n\n /**\n * Returns the formatted setpoint value as a string.\n * If the setpoint is undefined, it returns a dashed string.\n */\n get setpointValueBlueNumbers(): string {\n if (this.setpoint === undefined) {\n return this.dashedGenerator();\n }\n\n return this.setpoint.toFixed(this.fractionDigits);\n }\n\n /**\n * Returns the formatted primary value as a string.\n * If the value is undefined, it returns a dashed string.\n */\n get valueBlueNumbers(): string {\n if (this.value === undefined) {\n return this.dashedGenerator();\n }\n\n return this.value.toFixed(this.fractionDigits);\n }\n\n /**\n * Generates a string of hint zeros for alignment when `showZeroPadding` is false.\n * These zeros are typically displayed with lower opacity.\n */\n get hintZeros(): string {\n if (this.value === undefined || this.value < 0) {\n return '';\n }\n const nBlues = this.valueBlueNumbers.length;\n const nHints = this.maxDigits - nBlues;\n if (nHints > 0) {\n return '0'.repeat(nHints);\n }\n return '';\n }\n\n static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-instrument-field': ObcInstrumentField;\n }\n}\n"],"names":["InstrumentFieldSize"],"mappings":"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"}
1
+ {"version":3,"file":"instrument-field.js","sources":["../../../src/navigation-instruments/instrument-field/instrument-field.ts"],"sourcesContent":["import {LitElement, html, nothing, unsafeCSS} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport compentStyle from './instrument-field.css?inline';\nimport {classMap} from 'lit/directives/class-map.js';\nimport '../../components/button/button.js';\nimport '../../icons/icon-drop-down-google.js';\nimport '../../components/navigation-item/navigation-item.js';\nimport {customElement} from '../../decorator.js';\n\n/**\n * Enum for instrument field sizes.\n * - `regular`: Standard size for navigation instrument data fields.\n * - `enhanced`: Larger size with increased visual prominence.\n */\nexport enum InstrumentFieldSize {\n regular = 'regular',\n enhanced = 'enhanced',\n}\n\n/**\n * `<obc-instrument-field>` – A component for displaying navigation instrument data.\n *\n * This component is used to show a primary value, an optional setpoint, units, and a source (e.g., GPS, Gyro).\n * It supports different sizes, horizontal/vertical layouts, and configurable numeric formatting.\n *\n * ### Features\n * - **Sizes:** Supports `regular` and `enhanced` sizes.\n * - **Setpoint:** Optional setpoint display with an arrow indicator.\n * - **Source Picker:** Optional source selection with a dropdown and context menu.\n * - **Formatting:** Customizable integer and fraction digits, with optional zero padding.\n * - **Status Indicators:** Supports an \"OFF\" state and neutral color mode.\n * - **Layouts:** Can be oriented horizontally or vertically, with various alignment options.\n *\n * ### Slots\n * | Slot Name | Purpose |\n * |---------------------|-------------------------------------------------------------------------|\n * | off-value | Content to display when the `off` property is true (defaults to \"OFF\"). |\n *\n * @slot off-value - Content to display when the `off` property is true (defaults to \"OFF\").\n *\n * @csspart label - The container for the tag and unit.\n * @csspart tag - The tag text element.\n */\n@customElement('obc-instrument-field')\nexport class ObcInstrumentField extends LitElement {\n /** The size of the instrument field. */\n @property({type: String}) size: InstrumentFieldSize =\n InstrumentFieldSize.regular;\n\n /** The setpoint value to display. */\n @property({type: Number}) setpoint: number | undefined;\n\n /** Whether to show the setpoint. */\n @property({type: Boolean}) hasSetpoint = false;\n\n /** Whether to show the source (src) field. */\n @property({type: Boolean}) hasSrc = false;\n\n /** The primary value to display. */\n @property({type: Number}) value: number | undefined;\n\n /** The maximum number of integer digits to show (for zero padding). */\n @property({type: Number}) maxDigits = 1;\n\n /** Whether to show leading zeros up to `maxDigits`. */\n @property({type: Boolean}) showZeroPadding = false;\n\n /** The number of decimal places to display. */\n @property({type: Number}) fractionDigits = 0;\n\n /** The tag or label for the data (e.g., \"HDG\", \"SPD\"). */\n @property({type: String}) tag = '';\n\n /** The unit of measurement (e.g., \"DEG\", \"KN\"). */\n @property({type: String}) unit = '';\n\n /** The current source name (e.g., \"GPS 1\"). */\n @property({type: String}) src = '';\n\n /** If true, uses a neutral color scheme instead of the default instrument color. */\n @property({type: Boolean}) neutralColor = false;\n\n /** If true, uses a horizontal layout. */\n @property({type: Boolean}) horizontal = false;\n\n /** If true, centers the content. */\n @property({type: Boolean}) center = false;\n\n /** If true, only the label (tag and unit) is displayed. */\n @property({type: Boolean}) labelOnly = false;\n\n /** If true, displays the \"off\" state (e.g., showing \"OFF\" instead of value). */\n @property({type: Boolean}) off = false;\n\n /** If true, automatically hides the setpoint when the value is close to it. */\n @property({type: Boolean}) autoHideSetpoint = false;\n\n /** The deadband within which the setpoint is hidden if `autoHideSetpoint` is true. */\n @property({type: Number}) autoHideDeadband = 0;\n\n /**\n * Generates a dashed string representation for undefined values.\n * @returns A string of dashes formatted according to the current numeric settings.\n */\n dashedGenerator(): string {\n const n = this.showZeroPadding ? Math.max(this.maxDigits, 1) : 1;\n if (this.fractionDigits < 1) {\n return '-'.repeat(n);\n } else {\n const diff = n - this.fractionDigits;\n return (\n '-'.repeat(Math.max(diff, 1)) + '.' + '-'.repeat(this.fractionDigits)\n );\n }\n }\n\n override render() {\n const hideSetpoint =\n this.hasSetpoint &&\n this.autoHideSetpoint &&\n this.setpoint !== undefined &&\n this.value !== undefined &&\n Math.abs(this.setpoint - this.value) <= this.autoHideDeadband;\n\n return html`\n <div\n class=${classMap({\n wrapper: true,\n [this.size]: true,\n 'neutral-color': this.neutralColor,\n off: this.off,\n horizontal: this.horizontal,\n center: this.center,\n 'left-aligned':\n this.labelOnly || (this.horizontal && !this.hasSetpoint),\n 'hide-setpoint': hideSetpoint,\n 'show-zero-padding': this.showZeroPadding,\n })}\n >\n ${this.horizontal && this.size === InstrumentFieldSize.regular\n ? html`<div class=\"label\">\n <div class=\"tag\" part=\"tag\">${this.tag}</div>\n </div>`\n : nothing}\n ${this.hasSetpoint\n ? html`<div class=\"setpoint\">\n <svg\n class=\"setpoint-arrow\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill=\"var(--instrument-enhanced-secondary-color)\"\n d=\"M4.66797 4.80263C4.66797 4.14363 5.45194 3.76746 6.0013 4.16286L10.4456 7.17243C11.0312 7.56899 11.0314 8.43154 10.4459 8.82828L6.0013 11.8401C5.45194 12.2355 4.66797 11.8593 4.66797 11.2003L4.66797 4.80263Z\"\n fill=\"var(--instrument-enhanced-primary-color)\"\n />\n </svg>\n <div class=\"setpoint-value\">${this.setpointValueBlueNumbers}</div>\n </div>`\n : nothing}\n ${this.horizontal && !this.labelOnly && this.hasSetpoint\n ? html`<div class=\"divider\"></div>`\n : nothing}\n ${!this.labelOnly\n ? html` <div class=\"value\">\n ${this.off\n ? html`<div class=\"value-blue\">\n <slot name=\"off-value\">OFF</slot>\n </div>`\n : html` <div class=\"value-hint-zero\">${this.hintZeros}</div>\n <div class=\"value-blue\">${this.valueBlueNumbers}</div>`}\n </div>`\n : nothing}\n <div class=\"label\" part=\"label\">\n ${this.horizontal && this.size === InstrumentFieldSize.regular\n ? nothing\n : html`<div class=\"tag\" part=\"tag\">${this.tag}</div>`}\n <div class=\"unit\">${this.unit}</div>\n </div>\n ${this.hasSrc && this.horizontal\n ? html`<div class=\"divider src-divider\"></div>`\n : nothing}\n ${this.hasSrc ? html`<div class=\"src\">${this.src}</div>` : nothing}\n </div>\n `;\n }\n\n /**\n * Returns the formatted setpoint value as a string.\n * If the setpoint is undefined, it returns a dashed string.\n */\n get setpointValueBlueNumbers(): string {\n if (this.setpoint === undefined) {\n return this.dashedGenerator();\n }\n\n return this.setpoint.toFixed(this.fractionDigits);\n }\n\n /**\n * Returns the formatted primary value as a string.\n * If the value is undefined, it returns a dashed string.\n */\n get valueBlueNumbers(): string {\n if (this.value === undefined) {\n return this.dashedGenerator();\n }\n\n return this.value.toFixed(this.fractionDigits);\n }\n\n /**\n * Generates a string of hint zeros for alignment when `showZeroPadding` is false.\n * These zeros are typically displayed with lower opacity.\n */\n get hintZeros(): string {\n if (this.value === undefined || this.value < 0) {\n return '';\n }\n const nBlues = this.valueBlueNumbers.length;\n const nHints = this.maxDigits - nBlues;\n if (nHints > 0) {\n return '0'.repeat(nHints);\n }\n return '';\n }\n\n static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-instrument-field': ObcInstrumentField;\n }\n}\n"],"names":["InstrumentFieldSize"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@oicl/openbridge-webcomponents",
3
- "version": "0.0.20260408055359",
3
+ "version": "0.0.20260408064217",
4
4
  "type": "module",
5
5
  "repository": {
6
6
  "type": "git",
package/dist/components/context-menu/context-menu.css.js DELETED
@@ -1,21 +0,0 @@
1
- import { css } from "lit";
2
- const compentStyle = css`
3
- * {
4
- -webkit-tap-highlight-color: transparent;
5
- }
6
- ol {
7
- display: block;
8
- list-style-type: none;
9
- margin: 0;
10
- padding: 0;
11
- width: fit-content;
12
-
13
- border-radius: 6px;
14
- background: var(--normal-enabled-background-color);
15
- box-shadow: var(--shadow-floating);
16
- }
17
- `;
18
- export {
19
- compentStyle as default
20
- };
21
- //# sourceMappingURL=context-menu.css.js.map
package/dist/components/context-menu/context-menu.css.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"context-menu.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;"}
package/dist/components/context-menu/context-menu.d.ts DELETED
@@ -1,54 +0,0 @@
1
- import { LitElement } from 'lit';
2
- /**
3
- * `<obc-context-menu>` – A contextual menu component for presenting a list of actions or navigation options.
4
- *
5
- * Displays a floating menu containing selectable items, typically invoked by right-clicking or interacting with a trigger element. The menu appears above other UI content, allowing users to choose from a set of related commands or destinations without navigating away from their current context.
6
- *
7
- * ### Features
8
- * - **Menu structure:** Renders its content as a vertical list of options using an ordered list (`<ol>`), with each item typically represented by a child component such as `<obc-navigation-item>`.
9
- * - **Customizable content:** Supports any number of menu items, each of which can include icons, labels, and additional metadata.
10
- * - **Icon support:** Menu items can display leading icons for visual identification (see example usage with `<obi-applications>` and `<obi-alerts>`).
11
- * - **Floating appearance:** Styled with background, border radius, and shadow to visually separate the menu from the underlying content.
12
- *
13
- * ### Usage Guidelines
14
- * Use `<obc-context-menu>` to present a set of context-specific actions or navigation links, typically in response to a user gesture such as right-clicking, long-pressing, or clicking a menu trigger. It is ideal for secondary actions that are relevant to a specific UI element or region. Avoid using it for primary navigation or persistent menus; for those scenarios, consider a sidebar or top navigation component.
15
- *
16
- * **TODO(designer):** Specify recommended trigger patterns (e.g., right-click, button click), keyboard accessibility expectations, and whether the menu should auto-close on selection or outside click.
17
- *
18
- * ### Slots
19
- *
20
- * | Slot Name | Renders When... | Purpose |
21
- * |-----------|-----------------|---------|
22
- * | (default) | Always | Accepts one or more menu item components (e.g., `<obc-navigation-item>`) to display as selectable options. |
23
- *
24
- * ### Best Practices and Constraints
25
- * - Each child should be a valid menu item component (such as `<obc-navigation-item>`) for consistent styling and interaction.
26
- * - Ensure menu items are accessible via keyboard navigation (arrow keys, Enter/Escape for selection and dismissal).
27
- * - Keep the number of menu items manageable to avoid overwhelming users.
28
- * - For destructive or critical actions, consider visually distinguishing those items.
29
- *
30
- * ### Example:
31
- * ```
32
- * <obc-context-menu>
33
- * <obc-navigation-item label="Apps" .hasIcon=${true}>
34
- * <obi-applications slot="icon"></obi-applications>
35
- * </obc-navigation-item>
36
- * <obc-navigation-item label="Alerts" .hasIcon=${true}>
37
- * <obi-alerts slot="icon"></obi-alerts>
38
- * </obc-navigation-item>
39
- * </obc-context-menu>
40
- * ```
41
- * In this example, the context menu displays two navigation items, each with a leading icon.
42
- *
43
- * @slot - Default slot for menu items (e.g., `<obc-navigation-item>`)
44
- */
45
- export declare class ObcContextMenu extends LitElement {
46
- render(): import('lit-html').TemplateResult<1>;
47
- static styles: import('lit').CSSResult;
48
- }
49
- declare global {
50
- interface HTMLElementTagNameMap {
51
- 'obc-context-menu': ObcContextMenu;
52
- }
53
- }
54
- //# sourceMappingURL=context-menu.d.ts.map
package/dist/components/context-menu/context-menu.d.ts.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"context-menu.d.ts","sourceRoot":"","sources":["../../../src/components/context-menu/context-menu.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAGhD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0CG;AACH,qBACa,cAAe,SAAQ,UAAU;IACnC,MAAM;IAMf,OAAgB,MAAM,0BAA2B;CAClD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kBAAkB,EAAE,cAAc,CAAC;KACpC;CACF"}
package/dist/components/context-menu/context-menu.js DELETED
@@ -1,26 +0,0 @@
1
- import { customElement } from "../../decorator.js";
2
- import { unsafeCSS, LitElement, html } from "lit";
3
- import compentStyle from "./context-menu.css.js";
4
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
- var __decorateClass = (decorators, target, key, kind) => {
6
- var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
7
- for (var i = decorators.length - 1, decorator; i >= 0; i--)
8
- if (decorator = decorators[i])
9
- result = decorator(result) || result;
10
- return result;
11
- };
12
- let ObcContextMenu = class extends LitElement {
13
- render() {
14
- return html` <ol>
15
- <slot></slot>
16
- </ol>`;
17
- }
18
- };
19
- ObcContextMenu.styles = unsafeCSS(compentStyle);
20
- ObcContextMenu = __decorateClass([
21
- customElement("obc-context-menu")
22
- ], ObcContextMenu);
23
- export {
24
- ObcContextMenu
25
- };
26
- //# sourceMappingURL=context-menu.js.map
package/dist/components/context-menu/context-menu.js.map DELETED
@@ -1 +0,0 @@
1
- {"version":3,"file":"context-menu.js","sources":["../../../src/components/context-menu/context-menu.ts"],"sourcesContent":["import {customElement} from '../../decorator.js';\nimport {LitElement, html, unsafeCSS} from 'lit';\nimport compentStyle from './context-menu.css?inline';\n\n/**\n * `<obc-context-menu>` – A contextual menu component for presenting a list of actions or navigation options.\n *\n * Displays a floating menu containing selectable items, typically invoked by right-clicking or interacting with a trigger element. The menu appears above other UI content, allowing users to choose from a set of related commands or destinations without navigating away from their current context.\n *\n * ### Features\n * - **Menu structure:** Renders its content as a vertical list of options using an ordered list (`<ol>`), with each item typically represented by a child component such as `<obc-navigation-item>`.\n * - **Customizable content:** Supports any number of menu items, each of which can include icons, labels, and additional metadata.\n * - **Icon support:** Menu items can display leading icons for visual identification (see example usage with `<obi-applications>` and `<obi-alerts>`).\n * - **Floating appearance:** Styled with background, border radius, and shadow to visually separate the menu from the underlying content.\n *\n * ### Usage Guidelines\n * Use `<obc-context-menu>` to present a set of context-specific actions or navigation links, typically in response to a user gesture such as right-clicking, long-pressing, or clicking a menu trigger. It is ideal for secondary actions that are relevant to a specific UI element or region. Avoid using it for primary navigation or persistent menus; for those scenarios, consider a sidebar or top navigation component.\n *\n * **TODO(designer):** Specify recommended trigger patterns (e.g., right-click, button click), keyboard accessibility expectations, and whether the menu should auto-close on selection or outside click.\n *\n * ### Slots\n *\n * | Slot Name | Renders When... | Purpose |\n * |-----------|-----------------|---------|\n * | (default) | Always | Accepts one or more menu item components (e.g., `<obc-navigation-item>`) to display as selectable options. |\n *\n * ### Best Practices and Constraints\n * - Each child should be a valid menu item component (such as `<obc-navigation-item>`) for consistent styling and interaction.\n * - Ensure menu items are accessible via keyboard navigation (arrow keys, Enter/Escape for selection and dismissal).\n * - Keep the number of menu items manageable to avoid overwhelming users.\n * - For destructive or critical actions, consider visually distinguishing those items.\n *\n * ### Example:\n * ```\n * <obc-context-menu>\n * <obc-navigation-item label=\"Apps\" .hasIcon=${true}>\n * <obi-applications slot=\"icon\"></obi-applications>\n * </obc-navigation-item>\n * <obc-navigation-item label=\"Alerts\" .hasIcon=${true}>\n * <obi-alerts slot=\"icon\"></obi-alerts>\n * </obc-navigation-item>\n * </obc-context-menu>\n * ```\n * In this example, the context menu displays two navigation items, each with a leading icon.\n *\n * @slot - Default slot for menu items (e.g., `<obc-navigation-item>`)\n */\n@customElement('obc-context-menu')\nexport class ObcContextMenu extends LitElement {\n override render() {\n return html` <ol>\n <slot></slot>\n </ol>`;\n }\n\n static override styles = unsafeCSS(compentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-context-menu': ObcContextMenu;\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAgDO,IAAM,iBAAN,cAA6B,WAAW;AAAA,EACpC,SAAS;AAChB,WAAO;AAAA;AAAA;AAAA,EAGT;AAGF;AARa,eAOK,SAAS,UAAU,YAAY;AAPpC,iBAAN,gBAAA;AAAA,EADN,cAAc,kBAAkB;AAAA,GACpB,cAAA;"}