@operato/attribute 2.0.0-alpha.10 → 2.0.0-alpha.100

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
  1. package/CHANGELOG.md +480 -0
  2. package/dist/src/grist-editor/ox-grist-editor-attributes.d.ts +1 -1
  3. package/dist/src/grist-editor/ox-popup-attributes.d.ts +2 -1
  4. package/dist/src/grist-editor/ox-popup-attributes.js +7 -8
  5. package/dist/src/grist-editor/ox-popup-attributes.js.map +1 -1
  6. package/dist/src/ox-attribute-form.d.ts +1 -1
  7. package/dist/src/ox-attribute-form.js +2 -2
  8. package/dist/src/ox-attribute-form.js.map +1 -1
  9. package/dist/src/ox-attribute-view.d.ts +1 -1
  10. package/dist/src/ox-attribute-view.js +2 -2
  11. package/dist/src/ox-attribute-view.js.map +1 -1
  12. package/dist/stories/ox-attribute-form.stories.d.ts +1 -1
  13. package/dist/stories/ox-attribute-form.stories.js +25 -13
  14. package/dist/stories/ox-attribute-form.stories.js.map +1 -1
  15. package/dist/stories/ox-attribute-view.stories.d.ts +1 -1
  16. package/dist/stories/ox-attribute-view.stories.js +21 -9
  17. package/dist/stories/ox-attribute-view.stories.js.map +1 -1
  18. package/dist/stories/ox-grist-editor-attributes.stories.d.ts +1 -1
  19. package/dist/stories/ox-grist-editor-attributes.stories.js +66 -54
  20. package/dist/stories/ox-grist-editor-attributes.stories.js.map +1 -1
  21. package/dist/tsconfig.tsbuildinfo +1 -1
  22. package/package.json +24 -26
  23. package/src/grist-editor/ox-popup-attributes.ts +7 -8
  24. package/src/ox-attribute-form.ts +11 -8
  25. package/src/ox-attribute-view.ts +2 -2
  26. package/stories/ox-attribute-form.stories.ts +29 -18
  27. package/stories/ox-attribute-view.stories.ts +22 -11
  28. package/stories/ox-grist-editor-attributes.stories.ts +67 -56
  29. package/themes/grist-theme.css +3 -1
package/CHANGELOG.md CHANGED
@@ -3,6 +3,486 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [2.0.0-alpha.100](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.99...v2.0.0-alpha.100) (2024-04-21)
7
+
8
+ **Note:** Version bump only for package @operato/attribute
9
+
10
+
11
+
12
+
13
+
14
+ ## [2.0.0-alpha.99](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.98...v2.0.0-alpha.99) (2024-04-21)
15
+
16
+ **Note:** Version bump only for package @operato/attribute
17
+
18
+
19
+
20
+
21
+
22
+ ## [2.0.0-alpha.98](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.97...v2.0.0-alpha.98) (2024-04-21)
23
+
24
+ **Note:** Version bump only for package @operato/attribute
25
+
26
+
27
+
28
+
29
+
30
+ ## [2.0.0-alpha.97](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.96...v2.0.0-alpha.97) (2024-04-21)
31
+
32
+ **Note:** Version bump only for package @operato/attribute
33
+
34
+
35
+
36
+
37
+
38
+ ## [2.0.0-alpha.96](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.95...v2.0.0-alpha.96) (2024-04-21)
39
+
40
+ **Note:** Version bump only for package @operato/attribute
41
+
42
+
43
+
44
+
45
+
46
+ ## [2.0.0-alpha.95](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.94...v2.0.0-alpha.95) (2024-04-21)
47
+
48
+ **Note:** Version bump only for package @operato/attribute
49
+
50
+
51
+
52
+
53
+
54
+ ## [2.0.0-alpha.94](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.93...v2.0.0-alpha.94) (2024-04-20)
55
+
56
+ **Note:** Version bump only for package @operato/attribute
57
+
58
+
59
+
60
+
61
+
62
+ ## [2.0.0-alpha.93](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.92...v2.0.0-alpha.93) (2024-04-19)
63
+
64
+
65
+ ### :bug: Bug Fix
66
+
67
+ * grid body border-bottom style ([708a937](https://github.com/hatiolab/operato/commit/708a93789d23417a318e2ac9f499bec85d7e4776))
68
+
69
+
70
+
71
+ ## [2.0.0-alpha.92](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.91...v2.0.0-alpha.92) (2024-04-19)
72
+
73
+ **Note:** Version bump only for package @operato/attribute
74
+
75
+
76
+
77
+
78
+
79
+ ## [2.0.0-alpha.90](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.89...v2.0.0-alpha.90) (2024-04-18)
80
+
81
+ **Note:** Version bump only for package @operato/attribute
82
+
83
+
84
+
85
+
86
+
87
+ ## [2.0.0-alpha.89](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.88...v2.0.0-alpha.89) (2024-04-18)
88
+
89
+ **Note:** Version bump only for package @operato/attribute
90
+
91
+
92
+
93
+
94
+
95
+ ## [2.0.0-alpha.88](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.87...v2.0.0-alpha.88) (2024-04-18)
96
+
97
+ **Note:** Version bump only for package @operato/attribute
98
+
99
+
100
+
101
+
102
+
103
+ ## [2.0.0-alpha.87](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.86...v2.0.0-alpha.87) (2024-04-17)
104
+
105
+ **Note:** Version bump only for package @operato/attribute
106
+
107
+
108
+
109
+
110
+
111
+ ## [2.0.0-alpha.86](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.85...v2.0.0-alpha.86) (2024-04-16)
112
+
113
+ **Note:** Version bump only for package @operato/attribute
114
+
115
+
116
+
117
+
118
+
119
+ ## [2.0.0-alpha.85](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.84...v2.0.0-alpha.85) (2024-04-16)
120
+
121
+ **Note:** Version bump only for package @operato/attribute
122
+
123
+
124
+
125
+
126
+
127
+ ## [2.0.0-alpha.82](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.81...v2.0.0-alpha.82) (2024-04-15)
128
+
129
+
130
+ ### :bug: Bug Fix
131
+
132
+ * correct import ([a3587dd](https://github.com/hatiolab/operato/commit/a3587dd65903a0acaa7b25aa4ef15b2d85aaf418))
133
+
134
+
135
+
136
+ ## [2.0.0-alpha.81](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.80...v2.0.0-alpha.81) (2024-04-15)
137
+
138
+
139
+ ### :bug: Bug Fix
140
+
141
+ * use button-container styles ([bd91be3](https://github.com/hatiolab/operato/commit/bd91be3eaf5337a0ffe8cfc3b37191b6427ce5f6))
142
+
143
+
144
+
145
+ ## [2.0.0-alpha.80](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.79...v2.0.0-alpha.80) (2024-04-15)
146
+
147
+ **Note:** Version bump only for package @operato/attribute
148
+
149
+
150
+
151
+
152
+
153
+ ## [2.0.0-alpha.77](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.76...v2.0.0-alpha.77) (2024-04-14)
154
+
155
+ **Note:** Version bump only for package @operato/attribute
156
+
157
+
158
+
159
+
160
+
161
+ ## [2.0.0-alpha.71](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.70...v2.0.0-alpha.71) (2024-04-13)
162
+
163
+ **Note:** Version bump only for package @operato/attribute
164
+
165
+
166
+
167
+
168
+
169
+ ## [2.0.0-alpha.69](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.68...v2.0.0-alpha.69) (2024-04-13)
170
+
171
+
172
+ ### :bug: Bug Fix
173
+
174
+ * mwc=>md for context ([972f5fd](https://github.com/hatiolab/operato/commit/972f5fd8da02820b6d6238cf1dd099591f97d8df))
175
+
176
+
177
+
178
+ ## [2.0.0-alpha.68](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.67...v2.0.0-alpha.68) (2024-04-13)
179
+
180
+
181
+ ### :bug: Bug Fix
182
+
183
+ * mwc=>md for context ([2bc13f2](https://github.com/hatiolab/operato/commit/2bc13f285f257782f73e5d7b5d1ddd197df85393))
184
+
185
+
186
+
187
+ ## [2.0.0-alpha.64](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.63...v2.0.0-alpha.64) (2024-04-13)
188
+
189
+ **Note:** Version bump only for package @operato/attribute
190
+
191
+
192
+
193
+
194
+
195
+ ## [2.0.0-alpha.63](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.62...v2.0.0-alpha.63) (2024-04-12)
196
+
197
+ **Note:** Version bump only for package @operato/attribute
198
+
199
+
200
+
201
+
202
+
203
+ ## [2.0.0-alpha.62](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.61...v2.0.0-alpha.62) (2024-04-12)
204
+
205
+ **Note:** Version bump only for package @operato/attribute
206
+
207
+
208
+
209
+
210
+
211
+ ## [2.0.0-alpha.61](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.60...v2.0.0-alpha.61) (2024-04-11)
212
+
213
+ **Note:** Version bump only for package @operato/attribute
214
+
215
+
216
+
217
+
218
+
219
+ ## [2.0.0-alpha.60](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.59...v2.0.0-alpha.60) (2024-04-11)
220
+
221
+ **Note:** Version bump only for package @operato/attribute
222
+
223
+
224
+
225
+
226
+
227
+ ## [2.0.0-alpha.59](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.58...v2.0.0-alpha.59) (2024-04-11)
228
+
229
+ **Note:** Version bump only for package @operato/attribute
230
+
231
+
232
+
233
+
234
+
235
+ ## [2.0.0-alpha.57](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.56...v2.0.0-alpha.57) (2024-04-07)
236
+
237
+ **Note:** Version bump only for package @operato/attribute
238
+
239
+
240
+
241
+
242
+
243
+
244
+
245
+ **Note:** Version bump only for package @operato/attribute
246
+
247
+
248
+
249
+
250
+
251
+ ## [2.0.0-alpha.54](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.53...v2.0.0-alpha.54) (2024-04-01)
252
+
253
+ **Note:** Version bump only for package @operato/attribute
254
+
255
+
256
+
257
+
258
+
259
+ ## [2.0.0-alpha.52](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.51...v2.0.0-alpha.52) (2024-03-29)
260
+
261
+ **Note:** Version bump only for package @operato/attribute
262
+
263
+
264
+
265
+
266
+
267
+ ## [2.0.0-alpha.51](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.50...v2.0.0-alpha.51) (2024-03-29)
268
+
269
+
270
+ ### :bug: Bug Fix
271
+
272
+ * upgrade lit ([e661c33](https://github.com/hatiolab/operato/commit/e661c333d2bb97f784b5ac2c0e365714ee5e80ff))
273
+
274
+
275
+
276
+ ## [2.0.0-alpha.49](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.48...v2.0.0-alpha.49) (2024-03-28)
277
+
278
+ **Note:** Version bump only for package @operato/attribute
279
+
280
+
281
+
282
+
283
+
284
+ ## [2.0.0-alpha.48](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.47...v2.0.0-alpha.48) (2024-03-28)
285
+
286
+ **Note:** Version bump only for package @operato/attribute
287
+
288
+
289
+
290
+
291
+
292
+ ## [2.0.0-alpha.47](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.46...v2.0.0-alpha.47) (2024-03-27)
293
+
294
+ **Note:** Version bump only for package @operato/attribute
295
+
296
+
297
+
298
+
299
+
300
+ ## [2.0.0-alpha.46](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.45...v2.0.0-alpha.46) (2024-03-26)
301
+
302
+ **Note:** Version bump only for package @operato/attribute
303
+
304
+
305
+
306
+
307
+
308
+ ## [2.0.0-alpha.44](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.43...v2.0.0-alpha.44) (2024-03-24)
309
+
310
+ **Note:** Version bump only for package @operato/attribute
311
+
312
+
313
+
314
+
315
+
316
+ ## [2.0.0-alpha.43](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.42...v2.0.0-alpha.43) (2024-03-24)
317
+
318
+ **Note:** Version bump only for package @operato/attribute
319
+
320
+
321
+
322
+
323
+
324
+ ## [2.0.0-alpha.37](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.36...v2.0.0-alpha.37) (2024-03-18)
325
+
326
+ **Note:** Version bump only for package @operato/attribute
327
+
328
+
329
+
330
+
331
+
332
+ ## [2.0.0-alpha.36](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.35...v2.0.0-alpha.36) (2024-03-14)
333
+
334
+ **Note:** Version bump only for package @operato/attribute
335
+
336
+
337
+
338
+
339
+
340
+ ## [2.0.0-alpha.35](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.34...v2.0.0-alpha.35) (2024-03-13)
341
+
342
+ **Note:** Version bump only for package @operato/attribute
343
+
344
+
345
+
346
+
347
+
348
+ ## [2.0.0-alpha.34](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.33...v2.0.0-alpha.34) (2024-03-12)
349
+
350
+ **Note:** Version bump only for package @operato/attribute
351
+
352
+
353
+
354
+
355
+
356
+ ## [2.0.0-alpha.33](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.32...v2.0.0-alpha.33) (2024-03-12)
357
+
358
+ **Note:** Version bump only for package @operato/attribute
359
+
360
+
361
+
362
+
363
+
364
+ ## [2.0.0-alpha.32](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.31...v2.0.0-alpha.32) (2024-03-12)
365
+
366
+ **Note:** Version bump only for package @operato/attribute
367
+
368
+
369
+
370
+
371
+
372
+ ## [2.0.0-alpha.31](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.30...v2.0.0-alpha.31) (2024-03-03)
373
+
374
+ **Note:** Version bump only for package @operato/attribute
375
+
376
+
377
+
378
+
379
+
380
+ ## [2.0.0-alpha.30](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.29...v2.0.0-alpha.30) (2024-03-03)
381
+
382
+ **Note:** Version bump only for package @operato/attribute
383
+
384
+
385
+
386
+
387
+
388
+ ## [2.0.0-alpha.28](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.27...v2.0.0-alpha.28) (2024-02-20)
389
+
390
+
391
+ ### :bug: Bug Fix
392
+
393
+ * upgrade devDependencies for webcomponents ([1489b8b](https://github.com/hatiolab/operato/commit/1489b8b790d9bcee779a070a630697f25c01728f))
394
+
395
+
396
+
397
+ ## [2.0.0-alpha.27](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.26...v2.0.0-alpha.27) (2024-02-17)
398
+
399
+ **Note:** Version bump only for package @operato/attribute
400
+
401
+
402
+
403
+
404
+
405
+ ## [2.0.0-alpha.23](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.22...v2.0.0-alpha.23) (2024-02-10)
406
+
407
+ **Note:** Version bump only for package @operato/attribute
408
+
409
+
410
+
411
+
412
+
413
+ ## [2.0.0-alpha.22](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.21...v2.0.0-alpha.22) (2024-02-10)
414
+
415
+ **Note:** Version bump only for package @operato/attribute
416
+
417
+
418
+
419
+
420
+
421
+ ## [2.0.0-alpha.21](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.20...v2.0.0-alpha.21) (2024-02-09)
422
+
423
+ **Note:** Version bump only for package @operato/attribute
424
+
425
+
426
+
427
+
428
+
429
+ ## [2.0.0-alpha.20](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.19...v2.0.0-alpha.20) (2024-02-05)
430
+
431
+ **Note:** Version bump only for package @operato/attribute
432
+
433
+
434
+
435
+
436
+
437
+ ## [2.0.0-alpha.19](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.18...v2.0.0-alpha.19) (2024-02-05)
438
+
439
+ **Note:** Version bump only for package @operato/attribute
440
+
441
+
442
+
443
+
444
+
445
+ ## [2.0.0-alpha.17](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.16...v2.0.0-alpha.17) (2024-02-04)
446
+
447
+ **Note:** Version bump only for package @operato/attribute
448
+
449
+
450
+
451
+
452
+
453
+ ## [2.0.0-alpha.16](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.15...v2.0.0-alpha.16) (2024-02-03)
454
+
455
+ **Note:** Version bump only for package @operato/attribute
456
+
457
+
458
+
459
+
460
+
461
+ ## [2.0.0-alpha.13](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.12...v2.0.0-alpha.13) (2024-01-28)
462
+
463
+
464
+ ### :bug: Bug Fix
465
+
466
+ * css-variable --grid-record-padding ([b057312](https://github.com/hatiolab/operato/commit/b0573120fcb46c71b6b283065f08ae926e9f826f))
467
+
468
+
469
+
470
+ ## [2.0.0-alpha.12](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.11...v2.0.0-alpha.12) (2024-01-24)
471
+
472
+ **Note:** Version bump only for package @operato/attribute
473
+
474
+
475
+
476
+
477
+
478
+ ## [2.0.0-alpha.11](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.10...v2.0.0-alpha.11) (2024-01-24)
479
+
480
+ **Note:** Version bump only for package @operato/attribute
481
+
482
+
483
+
484
+
485
+
6
486
  ## [2.0.0-alpha.10](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.9...v2.0.0-alpha.10) (2024-01-22)
7
487
 
8
488
  **Note:** Version bump only for package @operato/attribute
@@ -5,7 +5,7 @@ import './ox-popup-attributes.js';
5
5
  import { OxGristEditor } from '@operato/data-grist';
6
6
  export declare class OxGristEditorAttributes extends OxGristEditor {
7
7
  private popup?;
8
- get editorTemplate(): import("lit").TemplateResult<1>;
8
+ get editorTemplate(): import("lit-html").TemplateResult<1>;
9
9
  _onclick(e: Event): void;
10
10
  _onkeydown(e: KeyboardEvent): void;
11
11
  openPopup(): Promise<void>;
@@ -1,3 +1,4 @@
1
+ import '@material/web/icon/icon.js';
1
2
  import '../ox-attribute-form.js';
2
3
  import { LitElement } from 'lit';
3
4
  import { AttributeSet } from '../types.js';
@@ -6,7 +7,7 @@ export declare class OxPopupAttributes extends LitElement {
6
7
  value: any;
7
8
  attributeSet?: AttributeSet;
8
9
  confirmCallback: (newval: any) => void;
9
- render(): import("lit").TemplateResult<1>;
10
+ render(): import("lit-html").TemplateResult<1>;
10
11
  private onChange;
11
12
  private onCancel;
12
13
  private onConfirm;
@@ -1,10 +1,11 @@
1
1
  import { __decorate } from "tslib";
2
+ import '@material/web/icon/icon.js';
2
3
  import '../ox-attribute-form.js';
3
4
  import { css, html, LitElement } from 'lit';
4
5
  import { customElement, property } from 'lit/decorators.js';
5
6
  import { i18next } from '@operato/i18n';
6
7
  import { closePopup } from '@operato/popup';
7
- import { ScrollbarStyles } from '@operato/styles';
8
+ import { ButtonContainerStyles, ScrollbarStyles } from '@operato/styles';
8
9
  let OxPopupAttributes = class OxPopupAttributes extends LitElement {
9
10
  render() {
10
11
  var attributeSet = this.attributeSet || {};
@@ -13,8 +14,10 @@ let OxPopupAttributes = class OxPopupAttributes extends LitElement {
13
14
  </ox-attribute-form>
14
15
 
15
16
  <div class="button-container">
16
- <mwc-button @click=${this.onCancel.bind(this)}>${i18next.t('button.cancel')}</mwc-button>
17
- <mwc-button @click=${this.onConfirm.bind(this)}>${i18next.t('button.confirm')}</mwc-button>
17
+ <button @click=${this.onCancel.bind(this)} danger>
18
+ <md-icon>cancel</md-icon>${i18next.t('button.cancel')}
19
+ </button>
20
+ <button @click=${this.onConfirm.bind(this)}><md-icon>done</md-icon>${i18next.t('button.confirm')}</button>
18
21
  </div>
19
22
  `;
20
23
  }
@@ -42,6 +45,7 @@ let OxPopupAttributes = class OxPopupAttributes extends LitElement {
42
45
  }
43
46
  };
44
47
  OxPopupAttributes.styles = [
48
+ ButtonContainerStyles,
45
49
  ScrollbarStyles,
46
50
  css `
47
51
  :host {
@@ -69,11 +73,6 @@ OxPopupAttributes.styles = [
69
73
 
70
74
  color: var(--primary-color);
71
75
  }
72
-
73
- .button-container {
74
- display: flex;
75
- margin-left: auto;
76
- }
77
76
  `
78
77
  ];
79
78
  __decorate([
@@ -1 +1 @@
1
- {"version":3,"file":"ox-popup-attributes.js","sourceRoot":"","sources":["../../../src/grist-editor/ox-popup-attributes.ts"],"names":[],"mappings":";AAAA,OAAO,yBAAyB,CAAA;AAEhC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAK1C,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,UAAU;IAyC/C,MAAM;QACJ,IAAI,YAAY,GAAG,IAAI,CAAC,YAAY,IAAI,EAAE,CAAA;QAE1C,OAAO,IAAI,CAAA;kCACmB,IAAI,CAAC,KAAK,kBAAkB,YAAY,YAAY,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;;;;6BAIjF,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC;6BACtD,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC;;KAEhF,CAAA;IACH,CAAC;IAEO,QAAQ,CAAC,CAAc;QAC7B,CAAC,CAAC,eAAe,EAAE,CAAA;QAEnB;;;;;;;;;;UAUE;QACF,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,MAAM,CAAA;IACvB,CAAC;IAEO,QAAQ,CAAC,CAAQ;QACvB,UAAU,CAAC,IAAI,CAAC,CAAA;IAClB,CAAC;IAEO,SAAS,CAAC,CAAQ;QACxB,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACxD,UAAU,CAAC,IAAI,CAAC,CAAA;IAClB,CAAC;;AA9EM,wBAAM,GAAG;IACd,eAAe;IACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA+BF;CACF,AAlCY,CAkCZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDAAW;AACV;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uDAA4B;AAC3B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0DAAwC;AAvCxD,iBAAiB;IAD7B,aAAa,CAAC,qBAAqB,CAAC;GACxB,iBAAiB,CAgF7B","sourcesContent":["import '../ox-attribute-form.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\nimport { closePopup } from '@operato/popup'\nimport { ScrollbarStyles } from '@operato/styles'\n\nimport { AttributeSet } from '../types.js'\n\n@customElement('ox-popup-attributes')\nexport class OxPopupAttributes extends LitElement {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n background-color: #fff;\n\n width: var(--overlay-center-normal-width, 50%);\n height: var(--overlay-center-normal-height, 50%);\n }\n\n ox-attribute-form {\n flex: 1;\n overflow-y: auto;\n padding: var(--padding-wide);\n }\n\n span {\n flex: 1;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n color: var(--primary-color);\n }\n\n .button-container {\n display: flex;\n margin-left: auto;\n }\n `\n ]\n\n @property({ type: Object }) value: any\n @property({ type: Object }) attributeSet?: AttributeSet\n @property({ type: Object }) confirmCallback!: (newval: any) => void\n\n render() {\n var attributeSet = this.attributeSet || {}\n\n return html`\n <ox-attribute-form .value=${this.value} .attributeSet=${attributeSet} @change=${this.onChange.bind(this)}>\n </ox-attribute-form>\n\n <div class=\"button-container\">\n <mwc-button @click=${this.onCancel.bind(this)}>${i18next.t('button.cancel')}</mwc-button>\n <mwc-button @click=${this.onConfirm.bind(this)}>${i18next.t('button.confirm')}</mwc-button>\n </div>\n `\n }\n\n private onChange(e: CustomEvent) {\n e.stopPropagation()\n\n /* \n 주의 : 이 팝업 템플릿은 layout 모듈에 의해서 render 되므로, \n layout의 구성에 변화가 발생하면, 다시 render된다.\n 이 팝업이 떠 있는 상태에서, 또 다른 팝업이 뜨는 경우도 layout 구성의 변화를 야기한다. (overlay의 갯수의 증가)\n 이 경우 value, options, confirmCallback 등 클로져를 사용한 것들이 초기 바인딩된 값으로 다시 바인딩되게 되는데,\n 만약, 템플릿 내부에서 이들 속성의 레퍼런스가 변화했다면, 원래 상태로 되돌아가는 현상이 발생하게 된다.\n 따라서, 가급적 이들 속성의 레퍼런스를 변화시키지 않는 것이 좋다.\n (이 팝업 클래스를 템플릿으로 사용한 곳의 코드를 참조하세요.)\n => \n 이런 이유로, Object.assign(...)을 사용하였다.\n */\n this.value = e.detail\n }\n\n private onCancel(e: Event) {\n closePopup(this)\n }\n\n private onConfirm(e: Event) {\n this.confirmCallback && this.confirmCallback(this.value)\n closePopup(this)\n }\n}\n"]}
1
+ {"version":3,"file":"ox-popup-attributes.js","sourceRoot":"","sources":["../../../src/grist-editor/ox-popup-attributes.ts"],"names":[],"mappings":";AAAA,OAAO,4BAA4B,CAAA;AACnC,OAAO,yBAAyB,CAAA;AAEhC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAC3C,OAAO,EAAE,qBAAqB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAKjE,IAAM,iBAAiB,GAAvB,MAAM,iBAAkB,SAAQ,UAAU;IAqC/C,MAAM;QACJ,IAAI,YAAY,GAAG,IAAI,CAAC,YAAY,IAAI,EAAE,CAAA;QAE1C,OAAO,IAAI,CAAA;kCACmB,IAAI,CAAC,KAAK,kBAAkB,YAAY,YAAY,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;;;;yBAIrF,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;qCACZ,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC;;yBAEtC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,2BAA2B,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC;;KAEnG,CAAA;IACH,CAAC;IAEO,QAAQ,CAAC,CAAc;QAC7B,CAAC,CAAC,eAAe,EAAE,CAAA;QAEnB;;;;;;;;;;UAUE;QACF,IAAI,CAAC,KAAK,GAAG,CAAC,CAAC,MAAM,CAAA;IACvB,CAAC;IAEO,QAAQ,CAAC,CAAQ;QACvB,UAAU,CAAC,IAAI,CAAC,CAAA;IAClB,CAAC;IAEO,SAAS,CAAC,CAAQ;QACxB,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACxD,UAAU,CAAC,IAAI,CAAC,CAAA;IAClB,CAAC;;AA5EM,wBAAM,GAAG;IACd,qBAAqB;IACrB,eAAe;IACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;KA0BF;CACF,AA9BY,CA8BZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDAAW;AACV;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uDAA4B;AAC3B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0DAAwC;AAnCxD,iBAAiB;IAD7B,aAAa,CAAC,qBAAqB,CAAC;GACxB,iBAAiB,CA8E7B","sourcesContent":["import '@material/web/icon/icon.js'\nimport '../ox-attribute-form.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\nimport { closePopup } from '@operato/popup'\nimport { ButtonContainerStyles, ScrollbarStyles } from '@operato/styles'\n\nimport { AttributeSet } from '../types.js'\n\n@customElement('ox-popup-attributes')\nexport class OxPopupAttributes extends LitElement {\n static styles = [\n ButtonContainerStyles,\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n background-color: #fff;\n\n width: var(--overlay-center-normal-width, 50%);\n height: var(--overlay-center-normal-height, 50%);\n }\n\n ox-attribute-form {\n flex: 1;\n overflow-y: auto;\n padding: var(--padding-wide);\n }\n\n span {\n flex: 1;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n color: var(--primary-color);\n }\n `\n ]\n\n @property({ type: Object }) value: any\n @property({ type: Object }) attributeSet?: AttributeSet\n @property({ type: Object }) confirmCallback!: (newval: any) => void\n\n render() {\n var attributeSet = this.attributeSet || {}\n\n return html`\n <ox-attribute-form .value=${this.value} .attributeSet=${attributeSet} @change=${this.onChange.bind(this)}>\n </ox-attribute-form>\n\n <div class=\"button-container\">\n <button @click=${this.onCancel.bind(this)} danger>\n <md-icon>cancel</md-icon>${i18next.t('button.cancel')}\n </button>\n <button @click=${this.onConfirm.bind(this)}><md-icon>done</md-icon>${i18next.t('button.confirm')}</button>\n </div>\n `\n }\n\n private onChange(e: CustomEvent) {\n e.stopPropagation()\n\n /* \n 주의 : 이 팝업 템플릿은 layout 모듈에 의해서 render 되므로, \n layout의 구성에 변화가 발생하면, 다시 render된다.\n 이 팝업이 떠 있는 상태에서, 또 다른 팝업이 뜨는 경우도 layout 구성의 변화를 야기한다. (overlay의 갯수의 증가)\n 이 경우 value, options, confirmCallback 등 클로져를 사용한 것들이 초기 바인딩된 값으로 다시 바인딩되게 되는데,\n 만약, 템플릿 내부에서 이들 속성의 레퍼런스가 변화했다면, 원래 상태로 되돌아가는 현상이 발생하게 된다.\n 따라서, 가급적 이들 속성의 레퍼런스를 변화시키지 않는 것이 좋다.\n (이 팝업 클래스를 템플릿으로 사용한 곳의 코드를 참조하세요.)\n => \n 이런 이유로, Object.assign(...)을 사용하였다.\n */\n this.value = e.detail\n }\n\n private onCancel(e: Event) {\n closePopup(this)\n }\n\n private onConfirm(e: Event) {\n this.confirmCallback && this.confirmCallback(this.value)\n closePopup(this)\n }\n}\n"]}
@@ -7,7 +7,7 @@ export declare class OxAttributeForm extends LitElement {
7
7
  value?: {
8
8
  [tag: string]: any;
9
9
  };
10
- render(): import("lit").TemplateResult<1>;
10
+ render(): import("lit-html").TemplateResult<1>;
11
11
  private onChange;
12
12
  private buildInputs;
13
13
  private buildValue;
@@ -58,7 +58,7 @@ let OxAttributeForm = class OxAttributeForm extends LitElement {
58
58
  }
59
59
  return html ` <label .title=${description}>
60
60
  <div name>${name}</div>
61
- <div description><mwc-icon>info_outline</mwc-icon> ${description}</div>
61
+ <div description><md-icon>info_outline</md-icon> ${description}</div>
62
62
  <div elements>${element}</div>
63
63
  </label>`;
64
64
  });
@@ -140,7 +140,7 @@ OxAttributeForm.styles = css `
140
140
  vertical-align: middle;
141
141
  }
142
142
 
143
- div[description] mwc-icon {
143
+ div[description] md-icon {
144
144
  margin-top: -3px;
145
145
  font-size: 0.9rem;
146
146
  }
@@ -1 +1 @@
1
- {"version":3,"file":"ox-attribute-form.js","sourceRoot":"","sources":["../../src/ox-attribute-form.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/input/ox-input-file.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { AttributeSet } from './types.js'\n\n@customElement('ox-attribute-form')\nexport class OxAttributeForm extends LitElement {\n static styles = css`\n :host {\n display: flex;\n flex-direction: row;\n --item-description-font: normal 0.8rem/1rem var(--theme-font);\n --item-description-color: var(--page-description-color);\n }\n\n h2 {\n margin: var(--title-margin);\n font: var(--title-font);\n color: var(--title-text-color);\n text-transform: capitalize;\n text-align: center;\n }\n\n h3 {\n margin: var(--page-description-margin);\n font: var(--page-description-font);\n color: var(--page-description-color);\n text-transform: capitalize;\n text-align: center;\n }\n\n form {\n flex: 1;\n\n display: flex;\n flex-direction: column;\n }\n\n label {\n display: grid;\n\n grid-template-rows: auto 1fr;\n grid-template-columns: 1fr 5fr;\n grid-template-areas: 'name description' 'empty inputs';\n\n grid-gap: 9px;\n align-items: center;\n margin-bottom: var(--margin-default);\n }\n\n label:nth-child(odd) {\n background-color: var(--main-section-background-color);\n padding: var(--padding-default) 0;\n }\n\n div[name] {\n grid-area: name;\n font: var(--label-font);\n color: var(--label-color);\n text-align: right;\n }\n\n div[description] {\n grid-area: description;\n opacity: 0.7;\n font: var(--item-description-font);\n color: var(--item-description-color);\n text-align: left;\n }\n\n div[description] * {\n vertical-align: middle;\n }\n\n div[description] mwc-icon {\n margin-top: -3px;\n font-size: 0.9rem;\n }\n\n div[elements] {\n grid-area: inputs;\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 10px;\n padding-right: var(--padding-default);\n }\n\n div[elements] * {\n flex: 1;\n }\n\n div[elements] input,\n div[elements] select {\n border: var(--input-field-border);\n border-radius: var(--input-field-border-radius);\n padding: var(--input-field-padding);\n font: var(--input-field-font);\n }\n\n @media only screen and (max-width: 460px) {\n label {\n display: grid;\n\n grid-template-rows: auto auto 1fr;\n grid-template-columns: 1fr;\n grid-template-areas: 'name' 'description' 'inputs';\n\n grid-gap: 9px;\n align-items: center;\n margin-bottom: var(--margin-default);\n }\n\n div[name] {\n text-align: left;\n }\n }\n `\n\n @property({ type: Object }) attributeSet?: AttributeSet\n @property({ type: Object }) value?: { [tag: string]: any }\n\n render() {\n return html` <form @change=${(e: Event) => this.onChange(e)}>\n <h2>${this.attributeSet?.entity || ''}</h2>\n <h3>${this.attributeSet?.description || ''}</h3>\n ${this.buildInputs()}\n </form>`\n }\n\n private onChange(e: Event) {\n this.value = this.buildValue()\n\n this.dispatchEvent(\n new CustomEvent('change', {\n bubbles: true,\n composed: true,\n detail: this.value\n })\n )\n }\n\n private buildInputs() {\n const items = (this.attributeSet?.items || []).filter(item => item.active)\n\n return (items || []).map(item => {\n const { name, description, tag, type, options = {} } = item\n\n const value = this.value && this.value[tag]\n\n switch (type) {\n case 'select':\n var element = html` <select .name=${tag}>\n <option value=\"\"></option>\n ${(options.options || []).map(\n option => html`<option value=${option.value} ?selected=${option.value === value}>${option.text}</option>`\n )}\n </select>`\n break\n\n case 'boolean':\n var element = html` <input type=\"checkbox\" name=${tag} .checked=${value} />`\n break\n\n case 'number':\n var element = html` <input type=\"number\" name=${tag} value=${value} />`\n break\n\n case 'date':\n var element = html` <input type=\"date\" name=${tag} value=${value} />`\n break\n\n case 'datetime':\n var element = html` <input type=\"datetime-local\" name=${tag} value=${value} />`\n break\n\n case 'file':\n var element = html`<ox-input-file\n name=${tag}\n label=\"Attach Files\"\n accept=\"*/*\"\n multiple=\"true\"\n hide-filelist\n ></ox-input-file>`\n\n case 'string':\n default:\n var element = html` <input type=\"text\" name=${tag} value=${value} />`\n }\n\n return html` <label .title=${description}>\n <div name>${name}</div>\n <div description><mwc-icon>info_outline</mwc-icon> ${description}</div>\n <div elements>${element}</div>\n </label>`\n })\n }\n\n private buildValue() {\n const items = this.attributeSet!.items\n\n return (items || []).reduce((sum, item) => {\n const { tag, type } = item\n\n const editor = this.renderRoot.querySelector(`[name=${tag}]`) as HTMLInputElement\n\n sum[tag] = type === 'boolean' ? editor.checked : editor.value\n\n return sum\n }, {} as { [tag: string]: any })\n }\n}\n"]}
1
+ {"version":3,"file":"ox-attribute-form.js","sourceRoot":"","sources":["../../src/ox-attribute-form.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/input/ox-input-file.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { AttributeSet } from './types.js'\n\n@customElement('ox-attribute-form')\nexport class OxAttributeForm extends LitElement {\n static styles = css`\n :host {\n display: flex;\n flex-direction: row;\n --item-description-font: normal 0.8rem/1rem var(--theme-font);\n --item-description-color: var(--page-description-color);\n }\n\n h2 {\n margin: var(--title-margin);\n font: var(--title-font);\n color: var(--title-text-color);\n text-transform: capitalize;\n text-align: center;\n }\n\n h3 {\n margin: var(--page-description-margin);\n font: var(--page-description-font);\n color: var(--page-description-color);\n text-transform: capitalize;\n text-align: center;\n }\n\n form {\n flex: 1;\n\n display: flex;\n flex-direction: column;\n }\n\n label {\n display: grid;\n\n grid-template-rows: auto 1fr;\n grid-template-columns: 1fr 5fr;\n grid-template-areas: 'name description' 'empty inputs';\n\n grid-gap: 9px;\n align-items: center;\n margin-bottom: var(--margin-default);\n }\n\n label:nth-child(odd) {\n background-color: var(--main-section-background-color);\n padding: var(--padding-default) 0;\n }\n\n div[name] {\n grid-area: name;\n font: var(--label-font);\n color: var(--label-color);\n text-align: right;\n }\n\n div[description] {\n grid-area: description;\n opacity: 0.7;\n font: var(--item-description-font);\n color: var(--item-description-color);\n text-align: left;\n }\n\n div[description] * {\n vertical-align: middle;\n }\n\n div[description] md-icon {\n margin-top: -3px;\n font-size: 0.9rem;\n }\n\n div[elements] {\n grid-area: inputs;\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 10px;\n padding-right: var(--padding-default);\n }\n\n div[elements] * {\n flex: 1;\n }\n\n div[elements] input,\n div[elements] select {\n border: var(--input-field-border);\n border-radius: var(--input-field-border-radius);\n padding: var(--input-field-padding);\n font: var(--input-field-font);\n }\n\n @media only screen and (max-width: 460px) {\n label {\n display: grid;\n\n grid-template-rows: auto auto 1fr;\n grid-template-columns: 1fr;\n grid-template-areas: 'name' 'description' 'inputs';\n\n grid-gap: 9px;\n align-items: center;\n margin-bottom: var(--margin-default);\n }\n\n div[name] {\n text-align: left;\n }\n }\n `\n\n @property({ type: Object }) attributeSet?: AttributeSet\n @property({ type: Object }) value?: { [tag: string]: any }\n\n render() {\n return html` <form @change=${(e: Event) => this.onChange(e)}>\n <h2>${this.attributeSet?.entity || ''}</h2>\n <h3>${this.attributeSet?.description || ''}</h3>\n ${this.buildInputs()}\n </form>`\n }\n\n private onChange(e: Event) {\n this.value = this.buildValue()\n\n this.dispatchEvent(\n new CustomEvent('change', {\n bubbles: true,\n composed: true,\n detail: this.value\n })\n )\n }\n\n private buildInputs() {\n const items = (this.attributeSet?.items || []).filter(item => item.active)\n\n return (items || []).map(item => {\n const { name, description, tag, type, options = {} } = item\n\n const value = this.value && this.value[tag]\n\n switch (type) {\n case 'select':\n var element = html` <select .name=${tag}>\n <option value=\"\"></option>\n ${(options.options || []).map(\n option => html`<option value=${option.value} ?selected=${option.value === value}>${option.text}</option>`\n )}\n </select>`\n break\n\n case 'boolean':\n var element = html` <input type=\"checkbox\" name=${tag} .checked=${value} />`\n break\n\n case 'number':\n var element = html` <input type=\"number\" name=${tag} value=${value} />`\n break\n\n case 'date':\n var element = html` <input type=\"date\" name=${tag} value=${value} />`\n break\n\n case 'datetime':\n var element = html` <input type=\"datetime-local\" name=${tag} value=${value} />`\n break\n\n case 'file':\n var element = html`<ox-input-file\n name=${tag}\n label=\"Attach Files\"\n accept=\"*/*\"\n multiple=\"true\"\n hide-filelist\n ></ox-input-file>`\n\n case 'string':\n default:\n var element = html` <input type=\"text\" name=${tag} value=${value} />`\n }\n\n return html` <label .title=${description}>\n <div name>${name}</div>\n <div description><md-icon>info_outline</md-icon> ${description}</div>\n <div elements>${element}</div>\n </label>`\n })\n }\n\n private buildValue() {\n const items = this.attributeSet!.items\n\n return (items || []).reduce(\n (sum, item) => {\n const { tag, type } = item\n\n const editor = this.renderRoot.querySelector(`[name=${tag}]`) as HTMLInputElement\n\n sum[tag] = type === 'boolean' ? editor.checked : editor.value\n\n return sum\n },\n {} as { [tag: string]: any }\n )\n }\n}\n"]}
@@ -7,6 +7,6 @@ export declare class OxAttributeView extends LitElement {
7
7
  value?: {
8
8
  [tag: string]: any;
9
9
  };
10
- render(): import("lit").TemplateResult<1>;
10
+ render(): import("lit-html").TemplateResult<1>;
11
11
  private buildEntryViews;
12
12
  }
@@ -46,7 +46,7 @@ let OxAttributeView = class OxAttributeView extends LitElement {
46
46
  }
47
47
  return html ` <label .title=${description}>
48
48
  <div name>${name}</div>
49
- <div description><mwc-icon>info_outline</mwc-icon> ${description}</div>
49
+ <div description><md-icon>info_outline</md-icon> ${description}</div>
50
50
  <div elements>${element}</div>
51
51
  </label>`;
52
52
  });
@@ -125,7 +125,7 @@ OxAttributeView.styles = [
125
125
  vertical-align: middle;
126
126
  }
127
127
 
128
- div[description] mwc-icon {
128
+ div[description] md-icon {
129
129
  margin-top: -3px;
130
130
  font-size: 0.9rem;
131
131
  }