@operato/scene-chartjs 1.1.5 → 1.1.11

Sign up to get free protection for your applications and to get access to all the features.
Files changed (41) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/editors/property-editor-chartjs-abstract.d.ts +1 -0
  3. package/dist/editors/property-editor-chartjs-abstract.js +14 -13
  4. package/dist/editors/property-editor-chartjs-abstract.js.map +1 -1
  5. package/dist/editors/property-editor-chartjs-hbar.d.ts +1 -0
  6. package/dist/editors/property-editor-chartjs-hbar.js +22 -21
  7. package/dist/editors/property-editor-chartjs-hbar.js.map +1 -1
  8. package/dist/editors/property-editor-chartjs-mixed.d.ts +1 -0
  9. package/dist/editors/property-editor-chartjs-mixed.js +28 -27
  10. package/dist/editors/property-editor-chartjs-mixed.js.map +1 -1
  11. package/dist/editors/property-editor-chartjs-multi-series-abstract.d.ts +1 -0
  12. package/dist/editors/property-editor-chartjs-multi-series-abstract.js +38 -37
  13. package/dist/editors/property-editor-chartjs-multi-series-abstract.js.map +1 -1
  14. package/dist/editors/property-editor-chartjs-pie.d.ts +1 -0
  15. package/dist/editors/property-editor-chartjs-pie.js +6 -5
  16. package/dist/editors/property-editor-chartjs-pie.js.map +1 -1
  17. package/dist/editors/property-editor-chartjs-radar.d.ts +1 -0
  18. package/dist/editors/property-editor-chartjs-radar.js +4 -3
  19. package/dist/editors/property-editor-chartjs-radar.js.map +1 -1
  20. package/dist/editors/property-editor-chartjs.d.ts +1 -0
  21. package/dist/editors/property-editor-chartjs.js +2 -1
  22. package/dist/editors/property-editor-chartjs.js.map +1 -1
  23. package/logs/.08636eb59927f12972f6774f5947c8507b3564c2-audit.json +3 -13
  24. package/logs/.5e5d741d8b7784a2fbad65eedc0fd46946aaf6f2-audit.json +3 -13
  25. package/logs/application-2022-11-07-00.log +6 -0
  26. package/logs/connections-2022-11-07-00.log +35 -0
  27. package/package.json +2 -2
  28. package/src/editors/property-editor-chartjs-abstract.ts +15 -13
  29. package/src/editors/property-editor-chartjs-hbar.ts +23 -21
  30. package/src/editors/property-editor-chartjs-mixed.ts +29 -27
  31. package/src/editors/property-editor-chartjs-multi-series-abstract.ts +39 -37
  32. package/src/editors/property-editor-chartjs-pie.ts +7 -5
  33. package/src/editors/property-editor-chartjs-radar.ts +5 -3
  34. package/src/editors/property-editor-chartjs.ts +3 -1
  35. package/tsconfig.tsbuildinfo +1 -1
  36. package/logs/application-2022-10-17-18.log +0 -18
  37. package/logs/application-2022-10-17-19.log +0 -16
  38. package/logs/application-2022-10-17-22.log +0 -7
  39. package/logs/connections-2022-10-17-18.log +0 -105
  40. package/logs/connections-2022-10-17-19.log +0 -70
  41. package/logs/connections-2022-10-17-22.log +0 -35
@@ -1,3 +1,5 @@
1
+ import '@operato/i18n/ox-i18n.js'
2
+
1
3
  import { html, LitElement } from 'lit'
2
4
  import { property } from 'lit/decorators.js'
3
5
 
@@ -14,29 +16,29 @@ export default class PropertyEditorChartJSAbstract extends LitElement {
14
16
 
15
17
  render() {
16
18
  return html`
17
- <legend><i18n-msg msgid="label.chart">Chart</i18n-msg></legend>
19
+ <legend><ox-i18n msgid="label.chart">Chart</ox-i18n></legend>
18
20
 
19
- <label> <i18n-msg msgid="label.theme">theme</i18n-msg> </label>
21
+ <label> <ox-i18n msgid="label.theme">theme</ox-i18n> </label>
20
22
  <select value-key="theme" class="select-content" .value=${this.theme}>
21
23
  <option value="dark">dark</option>
22
24
  <option value="light">light</option>
23
25
  </select>
24
26
 
25
27
  <input type="checkbox" value-key="tooltip" .checked=${this.tooltip} />
26
- <label> <i18n-msg msgid="label.tooltip">Tooltip</i18n-msg> </label>
28
+ <label> <ox-i18n msgid="label.tooltip">Tooltip</ox-i18n> </label>
27
29
 
28
30
  <input type="checkbox" value-key="animation" .checked=${this.animation} />
29
- <label> <i18n-msg msgid="label.animation">Animation</i18n-msg> </label>
31
+ <label> <ox-i18n msgid="label.animation">Animation</ox-i18n> </label>
30
32
 
31
33
  <input type="checkbox" value-key="display" .checked=${this.display} />
32
- <label> <i18n-msg msgid="label.legend">Legend</i18n-msg> </label>
34
+ <label> <ox-i18n msgid="label.legend">Legend</ox-i18n> </label>
33
35
 
34
36
  <input type="checkbox" value-key="stacked" .checked=${this.stacked} />
35
- <label> <i18n-msg msgid="label.stacked">Stacked</i18n-msg> </label>
37
+ <label> <ox-i18n msgid="label.stacked">Stacked</ox-i18n> </label>
36
38
 
37
39
  ${this.display
38
40
  ? html`
39
- <label> <i18n-msg msgid="label.position">Position</i18n-msg> </label>
41
+ <label> <ox-i18n msgid="label.position">Position</ox-i18n> </label>
40
42
  <select value-key="position" class="select-content" .value=${this.position}>
41
43
  <option value="top">top</option>
42
44
  <option value="right">right</option>
@@ -55,25 +57,25 @@ export default class PropertyEditorChartJSAbstract extends LitElement {
55
57
 
56
58
  displayValueTemplate() {
57
59
  return html`
58
- <label> <i18n-msg msgid="label.value-prefix">Value Prefix</i18n-msg> </label>
60
+ <label> <ox-i18n msgid="label.value-prefix">Value Prefix</ox-i18n> </label>
59
61
  <input type="text" value-key="series.valuePrefix" .value=${this.series.valuePrefix || ''} />
60
62
 
61
- <label> <i18n-msg msgid="label.value-suffix">Value suffix</i18n-msg> </label>
63
+ <label> <ox-i18n msgid="label.value-suffix">Value suffix</ox-i18n> </label>
62
64
  <input type="text" value-key="series.valueSuffix" .value=${this.series.valueSuffix || ''} />
63
65
 
64
66
  <input type="checkbox" value-key="series.displayValue" .checked=${this.series.displayValue || false} />
65
- <label> <i18n-msg msgid="label.value-display">Value Display</i18n-msg> </label>
67
+ <label> <ox-i18n msgid="label.value-display">Value Display</ox-i18n> </label>
66
68
 
67
69
  ${this.series.displayValue
68
70
  ? html`
69
- <label> <i18n-msg msgid="label.font-color">Font Color</i18n-msg> </label>
71
+ <label> <ox-i18n msgid="label.font-color">Font Color</ox-i18n> </label>
70
72
  <ox-input-color
71
73
  value-key="series.defaultFontColor"
72
74
  .value=${this.series.defaultFontColor || '#000'}
73
75
  ></ox-input-color>
74
- <label> <i18n-msg msgid="label.font-size">Font Size</i18n-msg> </label>
76
+ <label> <ox-i18n msgid="label.font-size">Font Size</ox-i18n> </label>
75
77
  <input type="number" value-key="series.defaultFontSize" .value=${this.series.defaultFontSize || 10} />
76
- <label> <i18n-msg msgid="label.position">Position</i18n-msg> </label>
78
+ <label> <ox-i18n msgid="label.position">Position</ox-i18n> </label>
77
79
  <select value-key="series.dataLabelAnchor" .value=${this.series.dataLabelAnchor || 'center'}>
78
80
  <option value="start">Start</option>
79
81
  <option value="center" selected>Center</option>
@@ -2,6 +2,8 @@ import '@polymer/paper-icon-button/paper-icon-button'
2
2
  import '@polymer/paper-tabs/paper-tabs'
3
3
  import '@polymer/iron-pages/iron-pages'
4
4
 
5
+ import '@operato/i18n/ox-i18n.js'
6
+
5
7
  import { html } from 'lit'
6
8
  import { customElement } from 'lit/decorators.js'
7
9
 
@@ -11,18 +13,18 @@ import PropertyEditorChartJSMultiSeriesAbstract from './property-editor-chartjs-
11
13
  export default class PropertyEditorChartJSHBar extends PropertyEditorChartJSMultiSeriesAbstract {
12
14
  editorTemplate() {
13
15
  return html`
14
- <legend><i18n-msg msgid="label.series">Series</i18n-msg></legend>
16
+ <legend><ox-i18n msgid="label.series">Series</ox-i18n></legend>
15
17
  ${this.multiSeriesTabTemplate()}
16
18
 
17
- <legend><i18n-msg msgid="label.y-axes">Y Axes</i18n-msg></legend>
19
+ <legend><ox-i18n msgid="label.y-axes">Y Axes</ox-i18n></legend>
18
20
 
19
- <label> <i18n-msg msgid="label.data-key">Data Key</i18n-msg> </label>
21
+ <label> <ox-i18n msgid="label.data-key">Data Key</ox-i18n> </label>
20
22
  <input type="text" value-key="labelDataKey" .value=${this.labelDataKey} />
21
23
 
22
- <label> <i18n-msg msgid="label.title">Title</i18n-msg> </label>
24
+ <label> <ox-i18n msgid="label.title">Title</ox-i18n> </label>
23
25
  <input type="text" value-key="yAxes0.axisTitle" .value=${this.yAxes0.axisTitle || ''} />
24
26
 
25
- <label><i18n-msg msgid="label.bar-spacing">Bar Spacing</i18n-msg></label>
27
+ <label><ox-i18n msgid="label.bar-spacing">Bar Spacing</ox-i18n></label>
26
28
  <input
27
29
  type="number"
28
30
  min="0"
@@ -31,7 +33,7 @@ export default class PropertyEditorChartJSHBar extends PropertyEditorChartJSMult
31
33
  value-key="yAxes0.barSpacing"
32
34
  .value=${this.yAxes0.barSpacing || NaN}
33
35
  />
34
- <label><i18n-msg msgid="label.tick-spacing">Tick Spacing</i18n-msg></label>
36
+ <label><ox-i18n msgid="label.tick-spacing">Tick Spacing</ox-i18n></label>
35
37
  <input
36
38
  type="number"
37
39
  min="0"
@@ -42,43 +44,43 @@ export default class PropertyEditorChartJSHBar extends PropertyEditorChartJSMult
42
44
  />
43
45
 
44
46
  <input type="checkbox" value-key="value.options.xGridLine" .checked=${this.value.options.xGridLine} />
45
- <label> <i18n-msg msgid="label.grid-line">Grid Line</i18n-msg> </label>
47
+ <label> <ox-i18n msgid="label.grid-line">Grid Line</ox-i18n> </label>
46
48
 
47
49
  <input type="checkbox" value-key="xAxes0.ticks.display" .checked=${this.xAxes0.ticks.display} />
48
- <label> <i18n-msg msgid="label.display-tick">Display Tick</i18n-msg> </label>
50
+ <label> <ox-i18n msgid="label.display-tick">Display Tick</ox-i18n> </label>
49
51
 
50
- <legend><i18n-msg msgid="label.x-axes">X Axes</i18n-msg></legend>
52
+ <legend><ox-i18n msgid="label.x-axes">X Axes</ox-i18n></legend>
51
53
 
52
- <label> <i18n-msg msgid="label.title">Title</i18n-msg> </label>
54
+ <label> <ox-i18n msgid="label.title">Title</ox-i18n> </label>
53
55
  <input type="text" value-key="xAxes0.title" .value=${this.xAxes0.axisTitle || ''} />
54
56
 
55
57
  <input type="checkbox" value-key="xAxes0.ticks.autoMin" .checked=${this.xAxes0.ticks.autoMin} />
56
- <label> <i18n-msg msgid="label.axis-min-auto">Axis Min Auto</i18n-msg> </label>
58
+ <label> <ox-i18n msgid="label.axis-min-auto">Axis Min Auto</ox-i18n> </label>
57
59
 
58
60
  <input type="checkbox" value-key="xAxes0.ticks.autoMax" .checked=${this.xAxes0.ticks.autoMax} />
59
- <label> <i18n-msg msgid="label.axis-max-auto">Axis Max Auto</i18n-msg> </label>
61
+ <label> <ox-i18n msgid="label.axis-max-auto">Axis Max Auto</ox-i18n> </label>
60
62
 
61
63
  ${!this.xAxes0.ticks.autoMin
62
64
  ? html`
63
- <label> <i18n-msg msgid="label.axis-min">Axis Min</i18n-msg> </label>
65
+ <label> <ox-i18n msgid="label.axis-min">Axis Min</ox-i18n> </label>
64
66
  <input type="number" value-key="xAxes0.ticks.min" .value=${this.xAxes0.ticks.min} />
65
67
  `
66
68
  : html``}
67
69
  ${!this.xAxes0.ticks.autoMax
68
70
  ? html`
69
- <label> <i18n-msg msgid="label.axis-max">Axis Max</i18n-msg> </label>
71
+ <label> <ox-i18n msgid="label.axis-max">Axis Max</ox-i18n> </label>
70
72
  <input type="number" value-key="xAxes0.ticks.max" .value=${this.xAxes0.ticks.max} />
71
73
  `
72
74
  : html``}
73
75
 
74
- <label> <i18n-msg msgid="label.axis-step-size">Axis Step Size</i18n-msg> </label>
76
+ <label> <ox-i18n msgid="label.axis-step-size">Axis Step Size</ox-i18n> </label>
75
77
  <input type="number" value-key="yAxes0.ticks.stepSize" .value=${this.yAxes0.ticks.stepSize} />
76
78
 
77
79
  <input type="checkbox" .checked=${this.value.options.yGridLine} />
78
- <label> <i18n-msg msgid="label.grid-line">Grid Line</i18n-msg> </label>
80
+ <label> <ox-i18n msgid="label.grid-line">Grid Line</ox-i18n> </label>
79
81
 
80
82
  <input type="checkbox" value-key="yAxes0.ticks.display" .checked=${this.yAxes0.ticks.display} />
81
- <label> <i18n-msg msgid="label.display-tick">Display Tick</i18n-msg> </label>
83
+ <label> <ox-i18n msgid="label.display-tick">Display Tick</ox-i18n> </label>
82
84
  `
83
85
  }
84
86
 
@@ -139,13 +141,13 @@ export default class PropertyEditorChartJSHBar extends PropertyEditorChartJSMult
139
141
  ${this.datasets.map(
140
142
  (dataset: any, index: number) => html`
141
143
  <div class="tab-content" series-index="${index}">
142
- <label> <i18n-msg msgid="label.data-key">Data Key</i18n-msg> </label>
144
+ <label> <ox-i18n msgid="label.data-key">Data Key</ox-i18n> </label>
143
145
  <input type="text" value-key="dataKey" .value=${this.dataKey} />
144
- <label> <i18n-msg msgid="label.label">Label</i18n-msg> </label>
146
+ <label> <ox-i18n msgid="label.label">Label</ox-i18n> </label>
145
147
  <input type="text" value-key="series.label" .value=${this.series.label} />
146
- <label> <i18n-msg msgid="label.color">Color</i18n-msg> </label>
148
+ <label> <ox-i18n msgid="label.color">Color</ox-i18n> </label>
147
149
  <ox-input-color value-key="color" .value=${this.color}></ox-input-color>
148
- <label> <i18n-msg msgid="label.stack-group">Stack Group</i18n-msg> </label>
150
+ <label> <ox-i18n msgid="label.stack-group">Stack Group</ox-i18n> </label>
149
151
  <input type="text" value-key="series.stack" .value=${this.series.stack || ''} />
150
152
 
151
153
  ${this.displayValueTemplate()}
@@ -1,3 +1,5 @@
1
+ import '@operato/i18n/ox-i18n.js'
2
+
1
3
  import { html } from 'lit'
2
4
  import { customElement } from 'lit/decorators.js'
3
5
 
@@ -69,23 +71,23 @@ export default class PropertyEditorChartJSMixed extends PropertyEditorChartJSMul
69
71
  editorTemplate(props: Properties) {
70
72
  return html`
71
73
  <input type="checkbox" value-key="multiAxis" .checked=${this.multiAxis} />
72
- <label> <i18n-msg msgid="label.multi-axis">Multi Axis</i18n-msg> </label>
74
+ <label> <ox-i18n msgid="label.multi-axis">Multi Axis</ox-i18n> </label>
73
75
 
74
- <legend><i18n-msg msgid="label.series">Series</i18n-msg></legend>
76
+ <legend><ox-i18n msgid="label.series">Series</ox-i18n></legend>
75
77
 
76
78
  <div fullwidth>${this.multiSeriesTabTemplate()}</div>
77
79
 
78
- <legend><i18n-msg msgid="label.x-axes">X Axes</i18n-msg></legend>
80
+ <legend><ox-i18n msgid="label.x-axes">X Axes</ox-i18n></legend>
79
81
 
80
- <label> <i18n-msg msgid="label.data-key">Data Key</i18n-msg> </label>
82
+ <label> <ox-i18n msgid="label.data-key">Data Key</ox-i18n> </label>
81
83
  <input type="text" value-key="labelDataKey" .value=${this.labelDataKey} />
82
84
 
83
- <label> <i18n-msg msgid="label.title">Title</i18n-msg> </label>
85
+ <label> <ox-i18n msgid="label.title">Title</ox-i18n> </label>
84
86
  <input type="text" value-key="xAxes0.axisTitle" .value=${this.xAxes0.axisTitle || ''} />
85
87
 
86
88
  ${this._hasBarSeries(this.value)
87
89
  ? html`
88
- <label><i18n-msg msgid="label.bar-spacing">Bar Spacing</i18n-msg></label>
90
+ <label><ox-i18n msgid="label.bar-spacing">Bar Spacing</ox-i18n></label>
89
91
  <input
90
92
  type="number"
91
93
  min="0"
@@ -94,7 +96,7 @@ export default class PropertyEditorChartJSMixed extends PropertyEditorChartJSMul
94
96
  value-key="xAxes0.barSpacing"
95
97
  .value=${this.xAxes0.barSpacing || NaN}
96
98
  />
97
- <label><i18n-msg msgid="label.tick-spacing">Tick Spacing</i18n-msg></label>
99
+ <label><ox-i18n msgid="label.tick-spacing">Tick Spacing</ox-i18n></label>
98
100
  <input
99
101
  type="number"
100
102
  min="0"
@@ -107,71 +109,71 @@ export default class PropertyEditorChartJSMixed extends PropertyEditorChartJSMul
107
109
  : html``}
108
110
 
109
111
  <input type="checkbox" value-key="value.options.xGridLine" .checked=${props.value.options.xGridLine} />
110
- <label> <i18n-msg msgid="label.grid-line">Grid Line</i18n-msg> </label>
112
+ <label> <ox-i18n msgid="label.grid-line">Grid Line</ox-i18n> </label>
111
113
 
112
114
  <input type="checkbox" value-key="xAxes0.ticks.display" .checked=${this.xAxes0.ticks.display} />
113
- <label> <i18n-msg msgid="label.display-tick">Display Tick</i18n-msg> </label>
115
+ <label> <ox-i18n msgid="label.display-tick">Display Tick</ox-i18n> </label>
114
116
 
115
- <legend><i18n-msg msgid="label.y-axes">Y Axes</i18n-msg></legend>
117
+ <legend><ox-i18n msgid="label.y-axes">Y Axes</ox-i18n></legend>
116
118
 
117
- <label> <i18n-msg msgid="label.title">Title</i18n-msg> </label>
119
+ <label> <ox-i18n msgid="label.title">Title</ox-i18n> </label>
118
120
  <input type="text" value-key="yAxes0.axisTitle" .value=${this.yAxes0.axisTitle || ''} />
119
121
 
120
122
  <input type="checkbox" value-key="yAxes0.ticks.autoMin" .checked=${this.yAxes0.ticks.autoMin} />
121
- <label> <i18n-msg msgid="label.axis-min-auto">Min Auto</i18n-msg> </label>
123
+ <label> <ox-i18n msgid="label.axis-min-auto">Min Auto</ox-i18n> </label>
122
124
 
123
125
  <input type="checkbox" value-key="yAxes0.ticks.autoMax" .checked=${this.yAxes0.ticks.autoMax} />
124
- <label> <i18n-msg msgid="label.axis-max-auto">Max Auto</i18n-msg> </label>
126
+ <label> <ox-i18n msgid="label.axis-max-auto">Max Auto</ox-i18n> </label>
125
127
 
126
128
  ${!this.yAxes0.ticks.autoMin
127
129
  ? html`
128
- <label> <i18n-msg msgid="label.axis-min">Min</i18n-msg> </label>
130
+ <label> <ox-i18n msgid="label.axis-min">Min</ox-i18n> </label>
129
131
  <input type="number" value-key="yAxes0.ticks.min" .value=${this.yAxes0.ticks.min} />
130
132
  `
131
133
  : html``}
132
134
  ${!this.yAxes0.ticks.autoMax
133
135
  ? html`
134
- <label> <i18n-msg msgid="label.axis-max">Max</i18n-msg> </label>
136
+ <label> <ox-i18n msgid="label.axis-max">Max</ox-i18n> </label>
135
137
  <input type="number" value-key="yAxes0.ticks.max" .value=${this.yAxes0.ticks.max} />
136
138
  `
137
139
  : html``}
138
140
 
139
- <label> <i18n-msg msgid="label.axis-step-size">StepSize</i18n-msg> </label>
141
+ <label> <ox-i18n msgid="label.axis-step-size">StepSize</ox-i18n> </label>
140
142
  <input type="number" value-key="yAxes0.ticks.stepSize" .value=${this.yAxes0.ticks.stepSize} />
141
143
 
142
144
  <input type="checkbox" value-key="value.options.yGridLine" .checked=${props.value.options.yGridLine} />
143
- <label> <i18n-msg msgid="label.grid-line">Grid Line</i18n-msg> </label>
145
+ <label> <ox-i18n msgid="label.grid-line">Grid Line</ox-i18n> </label>
144
146
 
145
147
  <input type="checkbox" value-key="yAxes0.ticks.display" .checked=${this.yAxes0.ticks.display} />
146
- <label> <i18n-msg msgid="label.display-tick">Display Tick</i18n-msg> </label>
148
+ <label> <ox-i18n msgid="label.display-tick">Display Tick</ox-i18n> </label>
147
149
 
148
150
  ${props.value.options.multiAxis
149
151
  ? html`
150
- <legend><i18n-msg msgid="label.y-2nd-axes">Y 2nd Axes</i18n-msg></legend>
152
+ <legend><ox-i18n msgid="label.y-2nd-axes">Y 2nd Axes</ox-i18n></legend>
151
153
 
152
- <label> <i18n-msg msgid="label.title">Title</i18n-msg> </label>
154
+ <label> <ox-i18n msgid="label.title">Title</ox-i18n> </label>
153
155
  <input type="text" value-key="yAxes1.axisTitle" .value=${this.yAxes1.axisTitle || ''} />
154
156
 
155
157
  <input type="checkbox" value-key="yAxes1.ticks.autoMin" .checked=${this.yAxes1.ticks.autoMin} />
156
- <label> <i18n-msg msgid="label.axis-min-auto">Min Auto</i18n-msg> </label>
158
+ <label> <ox-i18n msgid="label.axis-min-auto">Min Auto</ox-i18n> </label>
157
159
 
158
160
  <input type="checkbox" value-key="yAxes1.ticks.autoMax" .checked=${this.yAxes1.ticks.autoMax} />
159
- <label> <i18n-msg msgid="label.axis-max-auto">Max Auto</i18n-msg> </label>
161
+ <label> <ox-i18n msgid="label.axis-max-auto">Max Auto</ox-i18n> </label>
160
162
 
161
163
  ${!this.yAxes1.ticks.autoMin
162
164
  ? html`
163
- <label> <i18n-msg msgid="label.axis-min">Min</i18n-msg> </label>
165
+ <label> <ox-i18n msgid="label.axis-min">Min</ox-i18n> </label>
164
166
  <input type="number" value-key="yAxes1.ticks.min" .value=${this.yAxes1.ticks.min} />
165
167
  `
166
168
  : html``}
167
169
  ${!this.yAxes1.ticks.autoMax
168
170
  ? html`
169
- <label> <i18n-msg msgid="label.axis-max">Max</i18n-msg> </label>
171
+ <label> <ox-i18n msgid="label.axis-max">Max</ox-i18n> </label>
170
172
  <input type="number" value-key="yAxes1.ticks.max" .value=${this.yAxes1.ticks.max} />
171
173
  `
172
174
  : html``}
173
175
 
174
- <label> <i18n-msg msgid="label.axis-step-size">StepSize</i18n-msg> </label>
176
+ <label> <ox-i18n msgid="label.axis-step-size">StepSize</ox-i18n> </label>
175
177
  <input type="number" value-key="yAxes1.ticks.stepSize" .value=${this.yAxes1.ticks.stepSize} />
176
178
 
177
179
  <input
@@ -179,10 +181,10 @@ export default class PropertyEditorChartJSMixed extends PropertyEditorChartJSMul
179
181
  value-key="value.options.y2ndGridLine"
180
182
  .checked=${props.value.options.y2ndGridLine}
181
183
  />
182
- <label> <i18n-msg msgid="label.grid-line">Grid Line</i18n-msg> </label>
184
+ <label> <ox-i18n msgid="label.grid-line">Grid Line</ox-i18n> </label>
183
185
 
184
186
  <input type="checkbox" value-key="yAxes1.ticks.display" .checked=${this.yAxes1.ticks.display} />
185
- <label> <i18n-msg msgid="label.display-tick">Display Tick</i18n-msg> </label>
187
+ <label> <ox-i18n msgid="label.display-tick">Display Tick</ox-i18n> </label>
186
188
  `
187
189
  : html``}
188
190
  `
@@ -2,6 +2,8 @@ import '@polymer/iron-pages/iron-pages'
2
2
  import '@polymer/paper-icon-button/paper-icon-button'
3
3
  import '@polymer/paper-tabs/paper-tabs'
4
4
 
5
+ import '@operato/i18n/ox-i18n.js'
6
+
5
7
  import { css, html } from 'lit'
6
8
  import { query } from 'lit/decorators.js'
7
9
 
@@ -113,96 +115,96 @@ export default class PropertyEditorChartJSMultiSeriesAbstract extends PropertyEd
113
115
  editorTemplate(props: Properties) {
114
116
  return html`
115
117
  <input type="checkbox" value-key="multiAxis" .checked=${this.multiAxis} />
116
- <label> <i18n-msg msgid="label.multi-axis">Multi Axis</i18n-msg> </label>
118
+ <label> <ox-i18n msgid="label.multi-axis">Multi Axis</ox-i18n> </label>
117
119
 
118
- <legend><i18n-msg msgid="label.series">Series</i18n-msg></legend>
120
+ <legend><ox-i18n msgid="label.series">Series</ox-i18n></legend>
119
121
 
120
122
  ${this.multiSeriesTabTemplate()}
121
123
 
122
- <legend><i18n-msg msgid="label.x-axes">X Axes</i18n-msg></legend>
124
+ <legend><ox-i18n msgid="label.x-axes">X Axes</ox-i18n></legend>
123
125
 
124
- <label> <i18n-msg msgid="label.data-key">Data Key</i18n-msg> </label>
126
+ <label> <ox-i18n msgid="label.data-key">Data Key</ox-i18n> </label>
125
127
  <input type="text" value-key="labelDataKey" .value=${this.labelDataKey} />
126
128
 
127
- <label> <i18n-msg msgid="label.title">Title</i18n-msg> </label>
129
+ <label> <ox-i18n msgid="label.title">Title</ox-i18n> </label>
128
130
  <input type="text" value-key="xAxes0.axisTitle" .value=${this.xAxes0.axisTitle || ''} />
129
131
 
130
- <label> <i18n-msg msgid="label.thickness">Thickness</i18n-msg> </label>
132
+ <label> <ox-i18n msgid="label.thickness">Thickness</ox-i18n> </label>
131
133
  <input type="number" value-key="xAxes0.barPercentage" .value=${this.xAxes0.barPercentage} />
132
134
 
133
135
  <input type="checkbox" value-key="value.options.xGridLine" .checked=${this.value.options.xGridLine} />
134
- <label> <i18n-msg msgid="label.grid-line">Grid Line</i18n-msg> </label>
136
+ <label> <ox-i18n msgid="label.grid-line">Grid Line</ox-i18n> </label>
135
137
 
136
138
  <input type="checkbox" value-key="xAxes0.ticks.display" .checked=${this.xAxes0.ticks.display} />
137
- <label> <i18n-msg msgid="label.display-tick">Display Tick</i18n-msg> </label>
139
+ <label> <ox-i18n msgid="label.display-tick">Display Tick</ox-i18n> </label>
138
140
 
139
- <legend><i18n-msg msgid="label.y-axes">Y Axes</i18n-msg></legend>
141
+ <legend><ox-i18n msgid="label.y-axes">Y Axes</ox-i18n></legend>
140
142
 
141
- <label> <i18n-msg msgid="label.title">Title</i18n-msg> </label>
143
+ <label> <ox-i18n msgid="label.title">Title</ox-i18n> </label>
142
144
  <input type="text" value-key="yAxes0.axisTitle" .value=${this.yAxes0.axisTitle || ''} />
143
145
 
144
146
  <input type="checkbox" value-key="yAxes0.ticks.autoMin" .checked=${this.yAxes0.ticks.autoMin} />
145
- <label> <i18n-msg msgid="label.axis-min-auto">Min Auto</i18n-msg> </label>
147
+ <label> <ox-i18n msgid="label.axis-min-auto">Min Auto</ox-i18n> </label>
146
148
 
147
149
  <input type="checkbox" value-key="yAxes0.ticks.autoMax" .checked=${this.yAxes0.ticks.autoMax} />
148
- <label> <i18n-msg msgid="label.axis-max-auto">Max Auto</i18n-msg> </label>
150
+ <label> <ox-i18n msgid="label.axis-max-auto">Max Auto</ox-i18n> </label>
149
151
 
150
152
  ${!this.yAxes0.ticks.autoMin
151
153
  ? html`
152
- <label> <i18n-msg msgid="label.axis-min">Min</i18n-msg> </label>
154
+ <label> <ox-i18n msgid="label.axis-min">Min</ox-i18n> </label>
153
155
  <input type="number" value-key="yAxes0.ticks.min" .value=${this.yAxes0.ticks.min} />
154
156
  `
155
157
  : html``}
156
158
  ${!this.yAxes0.ticks.autoMax
157
159
  ? html`
158
- <label> <i18n-msg msgid="label.axis-max">Max</i18n-msg> </label>
160
+ <label> <ox-i18n msgid="label.axis-max">Max</ox-i18n> </label>
159
161
  <input type="number" value-key="yAxes0.ticks.max" .value=${this.yAxes0.ticks.max} />
160
162
  `
161
163
  : html``}
162
164
 
163
- <label> <i18n-msg msgid="label.axis-step-size">StepSize</i18n-msg> </label>
165
+ <label> <ox-i18n msgid="label.axis-step-size">StepSize</ox-i18n> </label>
164
166
  <input type="number" value-key="yAxes0.ticks.stepSize" .value=${this.yAxes0.ticks.stepSize} />
165
167
 
166
168
  <input type="checkbox" value-key="value.options.yGridLine" .checked=${this.value.options.yGridLine} />
167
- <label> <i18n-msg msgid="label.grid-line">Grid Line</i18n-msg> </label>
169
+ <label> <ox-i18n msgid="label.grid-line">Grid Line</ox-i18n> </label>
168
170
 
169
171
  <input type="checkbox" value-key="yAxes0.ticks.display" .checked=${this.yAxes0.ticks.display} />
170
- <label> <i18n-msg msgid="label.display-tick">Display Tick</i18n-msg> </label>
172
+ <label> <ox-i18n msgid="label.display-tick">Display Tick</ox-i18n> </label>
171
173
 
172
174
  ${this.value.options.multiAxis
173
175
  ? html`
174
- <legend><i18n-msg msgid="label.y-2nd-axes">Y 2nd Axes</i18n-msg></legend>
176
+ <legend><ox-i18n msgid="label.y-2nd-axes">Y 2nd Axes</ox-i18n></legend>
175
177
 
176
- <label> <i18n-msg msgid="label.title">Title</i18n-msg> </label>
178
+ <label> <ox-i18n msgid="label.title">Title</ox-i18n> </label>
177
179
  <input type="text" value-key="yAxes1.axisTitle" .value=${this.yAxes1.axisTitle || ''} />
178
180
 
179
181
  <input type="checkbox" value-key="yAxes1.ticks.autoMin" .checked=${this.yAxes1.ticks.autoMin} />
180
- <label> <i18n-msg msgid="label.axis-min-auto">Min Auto</i18n-msg> </label>
182
+ <label> <ox-i18n msgid="label.axis-min-auto">Min Auto</ox-i18n> </label>
181
183
 
182
184
  <input type="checkbox" value-key="yAxes1.ticks.autoMax" .checked=${this.yAxes1.ticks.autoMax} />
183
- <label> <i18n-msg msgid="label.axis-max-auto">Max Auto</i18n-msg> </label>
185
+ <label> <ox-i18n msgid="label.axis-max-auto">Max Auto</ox-i18n> </label>
184
186
 
185
187
  ${!this.yAxes1.ticks.autoMin
186
188
  ? html`
187
- <label> <i18n-msg msgid="label.axis-min">Min</i18n-msg> </label>
189
+ <label> <ox-i18n msgid="label.axis-min">Min</ox-i18n> </label>
188
190
  <input type="number" value-key="yAxes1.ticks.min" .value=${this.yAxes1.ticks.min} />
189
191
  `
190
192
  : html``}
191
193
  ${!this.yAxes1.ticks.autoMax
192
194
  ? html`
193
- <label> <i18n-msg msgid="label.axis-max">Max</i18n-msg> </label>
195
+ <label> <ox-i18n msgid="label.axis-max">Max</ox-i18n> </label>
194
196
  <input type="number" value-key="yAxes1.ticks.max" .value=${this.yAxes1.ticks.max} />
195
197
  `
196
198
  : html``}
197
199
 
198
- <label> <i18n-msg msgid="label.axis-step-size">StepSize</i18n-msg> </label>
200
+ <label> <ox-i18n msgid="label.axis-step-size">StepSize</ox-i18n> </label>
199
201
  <input type="number" value-key="yAxes1.ticks.stepSize" .value=${this.yAxes1.ticks.stepSize} />
200
202
 
201
203
  <input type="checkbox" value-key="value.options.y2ndGridLine" .checked=${this.value.options.y2ndGridLine} />
202
- <label> <i18n-msg msgid="label.grid-line">Grid Line</i18n-msg> </label>
204
+ <label> <ox-i18n msgid="label.grid-line">Grid Line</ox-i18n> </label>
203
205
 
204
206
  <input type="checkbox" value-key="yAxes1.ticks.display" .checked=${this.yAxes1.ticks.display} />
205
- <label> <i18n-msg msgid="label.display-tick">Display Tick</i18n-msg> </label>
207
+ <label> <ox-i18n msgid="label.display-tick">Display Tick</ox-i18n> </label>
206
208
  `
207
209
  : html``}
208
210
  `
@@ -265,12 +267,12 @@ export default class PropertyEditorChartJSMultiSeriesAbstract extends PropertyEd
265
267
  ${this.datasets.map(
266
268
  (dataset: any, index: number) => html`
267
269
  <div class="tab-content" series-index="${index}">
268
- <label> <i18n-msg msgid="label.data-key">Data Key</i18n-msg> </label>
270
+ <label> <ox-i18n msgid="label.data-key">Data Key</ox-i18n> </label>
269
271
  <input type="text" value-key="dataKey" .value=${this.dataKey} />
270
272
 
271
273
  ${this.value.type == 'bar'
272
274
  ? html`
273
- <label> <i18n-msg msgid="label.type">type</i18n-msg> </label>
275
+ <label> <ox-i18n msgid="label.type">type</ox-i18n> </label>
274
276
  <select class="select-content" value-key="series.type" .value=${this.series.type}>
275
277
  <option value="bar" selected>bar</option>
276
278
  <option value="line">line</option>
@@ -278,12 +280,12 @@ export default class PropertyEditorChartJSMultiSeriesAbstract extends PropertyEd
278
280
  `
279
281
  : html``}
280
282
 
281
- <label> <i18n-msg msgid="label.label">label</i18n-msg> </label>
283
+ <label> <ox-i18n msgid="label.label">label</ox-i18n> </label>
282
284
  <input type="text" value-key="series.label" .value=${this.series.label} />
283
285
 
284
286
  ${this.series.type == 'line'
285
287
  ? html`
286
- <label> <i18n-msg msgid="label.line-tension">line tension</i18n-msg> </label>
288
+ <label> <ox-i18n msgid="label.line-tension">line tension</ox-i18n> </label>
287
289
  <select class="select-content" value-key="series.lineTension" .value=${this.series.lineTension}>
288
290
  <option value="0.4">smooth</option>
289
291
  <option value="0">angled</option>
@@ -292,17 +294,17 @@ export default class PropertyEditorChartJSMultiSeriesAbstract extends PropertyEd
292
294
  : html``}
293
295
  ${this.series.type == 'line'
294
296
  ? html`
295
- <label> <i18n-msg msgid="label.border-width">border width</i18n-msg> </label>
297
+ <label> <ox-i18n msgid="label.border-width">border width</ox-i18n> </label>
296
298
  <input type="number" value-key="series.borderWidth" .value=${this.series.borderWidth} />
297
299
  `
298
300
  : html``}
299
301
 
300
- <label> <i18n-msg msgid="label.color">color</i18n-msg> </label>
302
+ <label> <ox-i18n msgid="label.color">color</ox-i18n> </label>
301
303
  <ox-input-color value-key="color" .value=${this.color}></ox-input-color>
302
304
 
303
305
  ${this.series.type == 'line'
304
306
  ? html`
305
- <label> <i18n-msg msgid="label.point-shape">point shape</i18n-msg> </label>
307
+ <label> <ox-i18n msgid="label.point-shape">point shape</ox-i18n> </label>
306
308
  <select class="select-content" value-key="series.pointStyle" .value=${this.series.pointStyle}>
307
309
  <option value="circle">⚬</option>
308
310
  <option value="triangle">▵</option>
@@ -315,20 +317,20 @@ export default class PropertyEditorChartJSMultiSeriesAbstract extends PropertyEd
315
317
  <option value="dash">┄</option>
316
318
  </select>
317
319
 
318
- <label> <i18n-msg msgid="label.point-size">point size</i18n-msg> </label>
320
+ <label> <ox-i18n msgid="label.point-size">point size</ox-i18n> </label>
319
321
  <input type="number" value-key="series.pointRadius" .value=${this.series.pointRadius} />
320
322
  `
321
- : html``} <label> <i18n-msg msgid="label.stack-group">Stack group</i18n-msg> </label>
323
+ : html``} <label> <ox-i18n msgid="label.stack-group">Stack group</ox-i18n> </label>
322
324
  <input type="text" value-key="series.stack" .value=${this.series.stack || ''} /> ${this.series.type ==
323
325
  'line'
324
326
  ? html`
325
327
  <input type="checkbox" value-key="series.fill" .checked=${this.series.fill} />
326
- <label> <i18n-msg msgid="label.fill">fill</i18n-msg> </label>
328
+ <label> <ox-i18n msgid="label.fill">fill</ox-i18n> </label>
327
329
  `
328
330
  : html``}
329
331
  ${this.multiAxis
330
332
  ? html`
331
- <label> <i18n-msg msgid="label.target-axis">target axis</i18n-msg> </label>
333
+ <label> <ox-i18n msgid="label.target-axis">target axis</ox-i18n> </label>
332
334
  <select class="select-content" value-key="series.yAxisID" .value=${this.series.yAxisID}>
333
335
  <option value="left">left</option>
334
336
  <option value="right">right</option>
@@ -1,3 +1,5 @@
1
+ import '@operato/i18n/ox-i18n.js'
2
+
1
3
  import { Properties } from '@hatiolab/things-scene'
2
4
  import PropertyEditorChartJSAbstract from './property-editor-chartjs-abstract'
3
5
  import { customElement } from 'lit/decorators.js'
@@ -57,19 +59,19 @@ export default class PropertyEditorChartJSPie extends PropertyEditorChartJSAbstr
57
59
 
58
60
  editorTemplate(props: Properties) {
59
61
  return html`
60
- <legend><i18n-msg msgid="label.series">Series</i18n-msg></legend>
62
+ <legend><ox-i18n msgid="label.series">Series</ox-i18n></legend>
61
63
 
62
- <label> <i18n-msg msgid="label.data-key">Data Key</i18n-msg> </label>
64
+ <label> <ox-i18n msgid="label.data-key">Data Key</ox-i18n> </label>
63
65
  <input type="text" value-key="dataKey" .value=${this.series.dataKey} />
64
66
 
65
- <label> <i18n-msg msgid="label.color">color</i18n-msg> </label>
67
+ <label> <ox-i18n msgid="label.color">color</ox-i18n> </label>
66
68
  <ox-input-multiple-colors value-key="color" .value=${this.color}></ox-input-multiple-colors>
67
69
 
68
70
  ${this.displayValueTemplate()}
69
71
 
70
- <legend><i18n-msg msgid="label.axes">Axes</i18n-msg></legend>
72
+ <legend><ox-i18n msgid="label.axes">Axes</ox-i18n></legend>
71
73
 
72
- <label> <i18n-msg msgid="label.data-key">Data Key</i18n-msg> </label>
74
+ <label> <ox-i18n msgid="label.data-key">Data Key</ox-i18n> </label>
73
75
  <input type="text" value-key="labelDataKey" .value=${this.labelDataKey} />
74
76
  `
75
77
  }
@@ -1,3 +1,5 @@
1
+ import '@operato/i18n/ox-i18n.js'
2
+
1
3
  import { html } from 'lit'
2
4
  import { customElement } from 'lit/decorators.js'
3
5
 
@@ -24,13 +26,13 @@ export default class PropertyEditorChartJSRadar extends PropertyEditorChartJSMul
24
26
 
25
27
  editorTemplate(props: Properties) {
26
28
  return html`
27
- <legend><i18n-msg msgid="label.series">Series</i18n-msg></legend>
29
+ <legend><ox-i18n msgid="label.series">Series</ox-i18n></legend>
28
30
 
29
31
  <div fullwidth>${this.multiSeriesTabTemplate()}</div>
30
32
 
31
- <legend><i18n-msg msgid="label.axes">Axes</i18n-msg></legend>
33
+ <legend><ox-i18n msgid="label.axes">Axes</ox-i18n></legend>
32
34
 
33
- <label> <i18n-msg msgid="label.data-key">Data Key</i18n-msg> </label>
35
+ <label> <ox-i18n msgid="label.data-key">Data Key</ox-i18n> </label>
34
36
  <input type="text" value-key="labelDataKey" .value=${this.labelDataKey} />
35
37
  `
36
38
  }