@oicl/openbridge-webcomponents 0.0.15-dev-20241104120701 → 0.0.15-dev-20241106154355
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.
- package/custom-elements.json +2759 -2740
- package/dist/components/brilliance-menu/brilliance-menu.d.ts +2 -0
- package/dist/components/brilliance-menu/brilliance-menu.d.ts.map +1 -1
- package/dist/components/brilliance-menu/brilliance-menu.js +25 -17
- package/dist/components/brilliance-menu/brilliance-menu.js.map +1 -1
- package/package.json +1 -1
- package/src/components/brilliance-menu/brilliance-menu.ts +27 -19
|
@@ -17,6 +17,7 @@ import '../../icons/icon-04-day-bright';
|
|
|
17
17
|
* @prop {Number} brightness - The brightness value
|
|
18
18
|
* @prop {Boolean} showAutoBrightness - Show the auto brightness toggle
|
|
19
19
|
* @prop {Boolean} showAutoPalette - Show the auto palette toggle
|
|
20
|
+
* @prop {Boolean} hideBrightness - Show the auto brightness toggle
|
|
20
21
|
*
|
|
21
22
|
* @fires palette-changed - Fires when the palette is changed
|
|
22
23
|
* @fires brightness-changed - Fires when the brightness is changed
|
|
@@ -26,6 +27,7 @@ export declare class ObcBrillianceMenu extends LitElement {
|
|
|
26
27
|
brightness: number;
|
|
27
28
|
showAutoBrightness: boolean;
|
|
28
29
|
showAutoPalette: boolean;
|
|
30
|
+
hideBrightness: boolean;
|
|
29
31
|
onPaletteChanged(event: CustomEvent): void;
|
|
30
32
|
onBrightnessChanged(event: CustomEvent): void;
|
|
31
33
|
render(): import("lit-html").TemplateResult<1>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"brilliance-menu.d.ts","sourceRoot":"","sources":["../../../src/components/brilliance-menu/brilliance-menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAGhD,OAAO,4BAA4B,CAAC;AACpC,OAAO,kBAAkB,CAAC;AAC1B,OAAO,gCAAgC,CAAC;AACxC,OAAO,4CAA4C,CAAC;AACpD,OAAO,8CAA8C,CAAC;AACtD,OAAO,oCAAoC,CAAC;AAC5C,OAAO,qCAAqC,CAAC;AAC7C,OAAO,2BAA2B,CAAC;AACnC,OAAO,0BAA0B,CAAC;AAClC,OAAO,yBAAyB,CAAC;AACjC,OAAO,gCAAgC,CAAC;AAExC
|
|
1
|
+
{"version":3,"file":"brilliance-menu.d.ts","sourceRoot":"","sources":["../../../src/components/brilliance-menu/brilliance-menu.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAkB,MAAM,KAAK,CAAC;AAGhD,OAAO,4BAA4B,CAAC;AACpC,OAAO,kBAAkB,CAAC;AAC1B,OAAO,gCAAgC,CAAC;AACxC,OAAO,4CAA4C,CAAC;AACpD,OAAO,8CAA8C,CAAC;AACtD,OAAO,oCAAoC,CAAC;AAC5C,OAAO,qCAAqC,CAAC;AAC7C,OAAO,2BAA2B,CAAC;AACnC,OAAO,0BAA0B,CAAC;AAClC,OAAO,yBAAyB,CAAC;AACjC,OAAO,gCAAgC,CAAC;AAExC;;;;;;;;;;;GAWG;AACH,qBACa,iBAAkB,SAAQ,UAAU;IACrB,OAAO,EAAE,OAAO,GAAG,MAAM,GAAG,KAAK,GAAG,QAAQ,CAC9D;IACkB,UAAU,SAAM;IAE1C,kBAAkB,UAAS;IACA,eAAe,UAAS;IACxB,cAAc,UAAS;IAElD,gBAAgB,CAAC,KAAK,EAAE,WAAW;IASnC,mBAAmB,CAAC,KAAK,EAAE,WAAW;IAS7B,MAAM;IAwDf,OAAgB,MAAM,0BAA6B;CACpD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,qBAAqB,EAAE,iBAAiB,CAAC;KAC1C;CACF"}
|
|
@@ -30,6 +30,7 @@ let ObcBrillianceMenu = class extends LitElement {
|
|
|
30
30
|
this.brightness = 50;
|
|
31
31
|
this.showAutoBrightness = false;
|
|
32
32
|
this.showAutoPalette = false;
|
|
33
|
+
this.hideBrightness = false;
|
|
33
34
|
}
|
|
34
35
|
onPaletteChanged(event) {
|
|
35
36
|
this.palette = event.detail.value;
|
|
@@ -50,23 +51,27 @@ let ObcBrillianceMenu = class extends LitElement {
|
|
|
50
51
|
render() {
|
|
51
52
|
return html`
|
|
52
53
|
<div class="card">
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
54
|
+
${this.hideBrightness ? "" : html`
|
|
55
|
+
<h3>Brilliance</h3>
|
|
56
|
+
<obc-slider
|
|
57
|
+
value=${this.brightness}
|
|
58
|
+
@value=${this.onBrightnessChanged}
|
|
59
|
+
min="0"
|
|
60
|
+
max="100"
|
|
61
|
+
hugcontainer
|
|
62
|
+
haslefticon
|
|
63
|
+
hasrighticon
|
|
64
|
+
>
|
|
65
|
+
<obi-04-brilliance-low slot="icon-left"></obi-04-brilliance-low>
|
|
66
|
+
<obi-04-brilliance-high
|
|
67
|
+
slot="icon-right"
|
|
68
|
+
></obi-04-brilliance-high>
|
|
69
|
+
</obc-slider>
|
|
70
|
+
${this.showAutoBrightness ? html`<obc-toggle-switch
|
|
71
|
+
label="Auto brilliance"
|
|
72
|
+
></obc-toggle-switch>` : ""}
|
|
73
|
+
<div class="divider"></div>
|
|
74
|
+
`}
|
|
70
75
|
<h3>Day - Night</h3>
|
|
71
76
|
<obc-toggle-button-group
|
|
72
77
|
value=${this.palette}
|
|
@@ -106,6 +111,9 @@ __decorateClass([
|
|
|
106
111
|
__decorateClass([
|
|
107
112
|
property({ type: Boolean })
|
|
108
113
|
], ObcBrillianceMenu.prototype, "showAutoPalette", 2);
|
|
114
|
+
__decorateClass([
|
|
115
|
+
property({ type: Boolean })
|
|
116
|
+
], ObcBrillianceMenu.prototype, "hideBrightness", 2);
|
|
109
117
|
ObcBrillianceMenu = __decorateClass([
|
|
110
118
|
customElement("obc-brilliance-menu")
|
|
111
119
|
], ObcBrillianceMenu);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"brilliance-menu.js","sources":["../../../src/components/brilliance-menu/brilliance-menu.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {customElement, property} from 'lit/decorators.js';\nimport componentStyle from './brilliance-menu.css?inline';\nimport '../icon-button/icon-button';\nimport '../slider/slider';\nimport '../toggle-switch/toggle-switch';\nimport '../toggle-button-group/toggle-button-group';\nimport '../toggle-button-option/toggle-button-option';\nimport '../../icons/icon-04-brilliance-low';\nimport '../../icons/icon-04-brilliance-high';\nimport '../../icons/icon-04-night';\nimport '../../icons/icon-04-dusk';\nimport '../../icons/icon-04-day';\nimport '../../icons/icon-04-day-bright';\n\n/**\n * @element obc-brilliance-menu\n *\n * @prop {String} palette - The palette to use. Possible values are 'night', 'dusk', 'day', 'bright'\n * @prop {Number} brightness - The brightness value\n * @prop {Boolean} showAutoBrightness - Show the auto brightness toggle\n * @prop {Boolean} showAutoPalette - Show the auto palette toggle\n *\n * @fires palette-changed - Fires when the palette is changed\n * @fires brightness-changed - Fires when the brightness is changed\n */\n@customElement('obc-brilliance-menu')\nexport class ObcBrillianceMenu extends LitElement {\n @property({type: String}) palette: 'night' | 'dusk' | 'day' | 'bright' =\n 'day';\n @property({type: Number}) brightness = 50;\n @property({type: Boolean})\n showAutoBrightness = false;\n @property({type: Boolean}) showAutoPalette = false;\n\n onPaletteChanged(event: CustomEvent) {\n this.palette = event.detail.value;\n this.dispatchEvent(\n new CustomEvent('palette-changed', {\n detail: {value: event.detail.value},\n })\n );\n }\n\n onBrightnessChanged(event: CustomEvent) {\n this.brightness = event.detail;\n this.dispatchEvent(\n new CustomEvent('brightness-changed', {\n detail: {value: event.detail},\n })\n );\n }\n\n override render() {\n return html`\n <div class=\"card\">\n <h3>Brilliance</h3>\n
|
|
1
|
+
{"version":3,"file":"brilliance-menu.js","sources":["../../../src/components/brilliance-menu/brilliance-menu.ts"],"sourcesContent":["import {LitElement, html, unsafeCSS} from 'lit';\nimport {customElement, property} from 'lit/decorators.js';\nimport componentStyle from './brilliance-menu.css?inline';\nimport '../icon-button/icon-button';\nimport '../slider/slider';\nimport '../toggle-switch/toggle-switch';\nimport '../toggle-button-group/toggle-button-group';\nimport '../toggle-button-option/toggle-button-option';\nimport '../../icons/icon-04-brilliance-low';\nimport '../../icons/icon-04-brilliance-high';\nimport '../../icons/icon-04-night';\nimport '../../icons/icon-04-dusk';\nimport '../../icons/icon-04-day';\nimport '../../icons/icon-04-day-bright';\n\n/**\n * @element obc-brilliance-menu\n *\n * @prop {String} palette - The palette to use. Possible values are 'night', 'dusk', 'day', 'bright'\n * @prop {Number} brightness - The brightness value\n * @prop {Boolean} showAutoBrightness - Show the auto brightness toggle\n * @prop {Boolean} showAutoPalette - Show the auto palette toggle\n * @prop {Boolean} hideBrightness - Show the auto brightness toggle\n *\n * @fires palette-changed - Fires when the palette is changed\n * @fires brightness-changed - Fires when the brightness is changed\n */\n@customElement('obc-brilliance-menu')\nexport class ObcBrillianceMenu extends LitElement {\n @property({type: String}) palette: 'night' | 'dusk' | 'day' | 'bright' =\n 'day';\n @property({type: Number}) brightness = 50;\n @property({type: Boolean})\n showAutoBrightness = false;\n @property({type: Boolean}) showAutoPalette = false;\n @property({type: Boolean}) hideBrightness = false;\n\n onPaletteChanged(event: CustomEvent) {\n this.palette = event.detail.value;\n this.dispatchEvent(\n new CustomEvent('palette-changed', {\n detail: {value: event.detail.value},\n })\n );\n }\n\n onBrightnessChanged(event: CustomEvent) {\n this.brightness = event.detail;\n this.dispatchEvent(\n new CustomEvent('brightness-changed', {\n detail: {value: event.detail},\n })\n );\n }\n\n override render() {\n return html`\n <div class=\"card\">\n ${this.hideBrightness\n ? ''\n : html`\n <h3>Brilliance</h3>\n <obc-slider\n value=${this.brightness}\n @value=${this.onBrightnessChanged}\n min=\"0\"\n max=\"100\"\n hugcontainer\n haslefticon\n hasrighticon\n >\n <obi-04-brilliance-low slot=\"icon-left\"></obi-04-brilliance-low>\n <obi-04-brilliance-high\n slot=\"icon-right\"\n ></obi-04-brilliance-high>\n </obc-slider>\n ${this.showAutoBrightness\n ? html`<obc-toggle-switch\n label=\"Auto brilliance\"\n ></obc-toggle-switch>`\n : ''}\n <div class=\"divider\"></div>\n `}\n <h3>Day - Night</h3>\n <obc-toggle-button-group\n value=${this.palette}\n @value=${this.onPaletteChanged}\n >\n <obc-toggle-button-option value=\"night\">\n <obi-04-night slot=\"icon\"></obi-04-night>\n </obc-toggle-button-option>\n <obc-toggle-button-option value=\"dusk\">\n <obi-04-dusk slot=\"icon\"></obi-04-dusk>\n </obc-toggle-button-option>\n <obc-toggle-button-option value=\"day\">\n <obi-04-day slot=\"icon\"></obi-04-day>\n </obc-toggle-button-option>\n <obc-toggle-button-option value=\"bright\">\n <obi-04-day-bright slot=\"icon\"></obi-04-day-bright>\n </obc-toggle-button-option>\n </obc-toggle-button-group>\n ${this.showAutoPalette\n ? html`<obc-toggle-switch\n label=\"Auto day - night\"\n checked\n ></obc-toggle-switch>`\n : ''}\n </div>\n `;\n }\n\n static override styles = unsafeCSS(componentStyle);\n}\n\ndeclare global {\n interface HTMLElementTagNameMap {\n 'obc-brilliance-menu': ObcBrillianceMenu;\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AA4Ba,IAAA,oBAAN,cAAgC,WAAW;AAAA,EAA3C,cAAA;AAAA,UAAA,GAAA,SAAA;AAEH,SAAA,UAAA;AACqC,SAAA,aAAA;AAElB,SAAA,qBAAA;AACwB,SAAA,kBAAA;AACD,SAAA,iBAAA;AAAA,EAAA;AAAA,EAE5C,iBAAiB,OAAoB;AAC9B,SAAA,UAAU,MAAM,OAAO;AACvB,SAAA;AAAA,MACH,IAAI,YAAY,mBAAmB;AAAA,QACjC,QAAQ,EAAC,OAAO,MAAM,OAAO,MAAK;AAAA,MAAA,CACnC;AAAA,IAAA;AAAA,EAEL;AAAA,EAEA,oBAAoB,OAAoB;AACtC,SAAK,aAAa,MAAM;AACnB,SAAA;AAAA,MACH,IAAI,YAAY,sBAAsB;AAAA,QACpC,QAAQ,EAAC,OAAO,MAAM,OAAM;AAAA,MAAA,CAC7B;AAAA,IAAA;AAAA,EAEL;AAAA,EAES,SAAS;AACT,WAAA;AAAA;AAAA,UAED,KAAK,iBACH,KACA;AAAA;AAAA;AAAA,wBAGY,KAAK,UAAU;AAAA,yBACd,KAAK,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAYjC,KAAK,qBACH;AAAA;AAAA,2CAGA,EAAE;AAAA;AAAA,aAEP;AAAA;AAAA;AAAA,kBAGK,KAAK,OAAO;AAAA,mBACX,KAAK,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAe9B,KAAK,kBACH;AAAA;AAAA;AAAA,qCAIA,EAAE;AAAA;AAAA;AAAA,EAGZ;AAGF;AApFa,kBAmFK,SAAS,UAAU,cAAc;AAlFvB,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,QAAO;AAAA,GADb,kBACe,WAAA,WAAA,CAAA;AAEA,gBAAA;AAAA,EAAzB,SAAS,EAAC,MAAM,QAAO;AAAA,GAHb,kBAGe,WAAA,cAAA,CAAA;AAE1B,gBAAA;AAAA,EADC,SAAS,EAAC,MAAM,SAAQ;AAAA,GAJd,kBAKX,WAAA,sBAAA,CAAA;AAC2B,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,SAAQ;AAAA,GANd,kBAMgB,WAAA,mBAAA,CAAA;AACA,gBAAA;AAAA,EAA1B,SAAS,EAAC,MAAM,SAAQ;AAAA,GAPd,kBAOgB,WAAA,kBAAA,CAAA;AAPhB,oBAAN,gBAAA;AAAA,EADN,cAAc,qBAAqB;AAAA,GACvB,iBAAA;"}
|
package/package.json
CHANGED
|
@@ -20,6 +20,7 @@ import '../../icons/icon-04-day-bright';
|
|
|
20
20
|
* @prop {Number} brightness - The brightness value
|
|
21
21
|
* @prop {Boolean} showAutoBrightness - Show the auto brightness toggle
|
|
22
22
|
* @prop {Boolean} showAutoPalette - Show the auto palette toggle
|
|
23
|
+
* @prop {Boolean} hideBrightness - Show the auto brightness toggle
|
|
23
24
|
*
|
|
24
25
|
* @fires palette-changed - Fires when the palette is changed
|
|
25
26
|
* @fires brightness-changed - Fires when the brightness is changed
|
|
@@ -32,6 +33,7 @@ export class ObcBrillianceMenu extends LitElement {
|
|
|
32
33
|
@property({type: Boolean})
|
|
33
34
|
showAutoBrightness = false;
|
|
34
35
|
@property({type: Boolean}) showAutoPalette = false;
|
|
36
|
+
@property({type: Boolean}) hideBrightness = false;
|
|
35
37
|
|
|
36
38
|
onPaletteChanged(event: CustomEvent) {
|
|
37
39
|
this.palette = event.detail.value;
|
|
@@ -54,25 +56,31 @@ export class ObcBrillianceMenu extends LitElement {
|
|
|
54
56
|
override render() {
|
|
55
57
|
return html`
|
|
56
58
|
<div class="card">
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
59
|
+
${this.hideBrightness
|
|
60
|
+
? ''
|
|
61
|
+
: html`
|
|
62
|
+
<h3>Brilliance</h3>
|
|
63
|
+
<obc-slider
|
|
64
|
+
value=${this.brightness}
|
|
65
|
+
@value=${this.onBrightnessChanged}
|
|
66
|
+
min="0"
|
|
67
|
+
max="100"
|
|
68
|
+
hugcontainer
|
|
69
|
+
haslefticon
|
|
70
|
+
hasrighticon
|
|
71
|
+
>
|
|
72
|
+
<obi-04-brilliance-low slot="icon-left"></obi-04-brilliance-low>
|
|
73
|
+
<obi-04-brilliance-high
|
|
74
|
+
slot="icon-right"
|
|
75
|
+
></obi-04-brilliance-high>
|
|
76
|
+
</obc-slider>
|
|
77
|
+
${this.showAutoBrightness
|
|
78
|
+
? html`<obc-toggle-switch
|
|
79
|
+
label="Auto brilliance"
|
|
80
|
+
></obc-toggle-switch>`
|
|
81
|
+
: ''}
|
|
82
|
+
<div class="divider"></div>
|
|
83
|
+
`}
|
|
76
84
|
<h3>Day - Night</h3>
|
|
77
85
|
<obc-toggle-button-group
|
|
78
86
|
value=${this.palette}
|