@operato/dataset 1.0.0-beta.1 → 1.0.0-beta.12

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/CHANGELOG.md CHANGED
@@ -3,6 +3,353 @@
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
+ ## [1.0.0-beta.12](https://github.com/hatiolab/operato/compare/v1.0.0-beta.11...v1.0.0-beta.12) (2022-05-13)
7
+
8
+
9
+ ### :bug: Bug Fix
10
+
11
+ * dataset ox-data-ooc-view style ([404331b](https://github.com/hatiolab/operato/commit/404331b25f8a0f8d23c56dd07a1aca3e82cedf96))
12
+ * dataset title style ([8b4f620](https://github.com/hatiolab/operato/commit/8b4f620211a70525303ee6d7999df40b1f77b0dc))
13
+
14
+
15
+ ### :rocket: New Features
16
+
17
+ * storybook started ([90c08c9](https://github.com/hatiolab/operato/commit/90c08c9a15e5fe554baaa1becca07793e8434799))
18
+
19
+
20
+
21
+ ## [1.0.0-beta.11](https://github.com/hatiolab/operato/compare/v1.0.0-beta.10...v1.0.0-beta.11) (2022-05-01)
22
+
23
+
24
+ ### :rocket: New Features
25
+
26
+ * separated filter-form from data-grist ([21e27f7](https://github.com/hatiolab/operato/commit/21e27f74d3e66d782da4aa75801c39a037627f62))
27
+
28
+
29
+
30
+ ## [1.0.0-beta.10](https://github.com/hatiolab/operato/compare/v1.0.0-beta.9...v1.0.0-beta.10) (2022-04-28)
31
+
32
+ **Note:** Version bump only for package @operato/dataset
33
+
34
+
35
+
36
+
37
+
38
+ ## [1.0.0-beta.9](https://github.com/hatiolab/operato/compare/v1.0.0-beta.8...v1.0.0-beta.9) (2022-04-28)
39
+
40
+ **Note:** Version bump only for package @operato/dataset
41
+
42
+
43
+
44
+
45
+
46
+ ## [1.0.0-beta.8](https://github.com/hatiolab/operato/compare/v1.0.0-beta.7...v1.0.0-beta.8) (2022-04-27)
47
+
48
+
49
+ ### :bug: Bug Fix
50
+
51
+ * ox-popup-data-item-spec style ([f1fd6d0](https://github.com/hatiolab/operato/commit/f1fd6d06cce99ac0fa1d2b4ced55878bb89d1143))
52
+
53
+
54
+
55
+ ## [1.0.0-beta.7](https://github.com/hatiolab/operato/compare/v1.0.0-beta.6...v1.0.0-beta.7) (2022-04-24)
56
+
57
+ **Note:** Version bump only for package @operato/dataset
58
+
59
+
60
+
61
+
62
+
63
+ ## [1.0.0-beta.6](https://github.com/hatiolab/operato/compare/v0.4.5...v1.0.0-beta.6) (2022-04-22)
64
+
65
+ ## [1.0.0-beta.5](https://github.com/hatiolab/operato/compare/v1.0.0-beta.4...v1.0.0-beta.5) (2022-04-18)
66
+
67
+ ## [1.0.0-beta.4](https://github.com/hatiolab/operato/compare/v1.0.0-beta.3...v1.0.0-beta.4) (2022-04-14)
68
+
69
+ ## [1.0.0-beta.3](https://github.com/hatiolab/operato/compare/v1.0.0-beta.2...v1.0.0-beta.3) (2022-04-12)
70
+
71
+
72
+ ### :bug: Bug Fix
73
+
74
+ * translation and ox-data-entry-form ([424014e](https://github.com/hatiolab/operato/commit/424014edc61181f373db2aa107d60e258a8776af))
75
+
76
+ ## [1.0.0-beta.2](https://github.com/hatiolab/operato/compare/v1.0.0-beta.1...v1.0.0-beta.2) (2022-04-12)
77
+
78
+ ## [1.0.0-beta.1](https://github.com/hatiolab/operato/compare/v1.0.0-beta.0...v1.0.0-beta.1) (2022-04-11)
79
+
80
+ ## [1.0.0-beta.0](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.53...v1.0.0-beta.0) (2022-04-10)
81
+
82
+ ## [1.0.0-alpha.53](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.52...v1.0.0-alpha.53) (2022-04-08)
83
+
84
+ ## [1.0.0-alpha.52](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.51...v1.0.0-alpha.52) (2022-04-08)
85
+
86
+ ## [1.0.0-alpha.51](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.50...v1.0.0-alpha.51) (2022-04-05)
87
+
88
+
89
+ ### :bug: Bug Fix
90
+
91
+ * export ox-grist-renderer-crontab.js ([3615720](https://github.com/hatiolab/operato/commit/3615720d119526a17272db2369bd80340b6cbc31))
92
+
93
+ ## [1.0.0-alpha.50](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.49...v1.0.0-alpha.50) (2022-04-04)
94
+
95
+ ## [1.0.0-alpha.49](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.48...v1.0.0-alpha.49) (2022-04-04)
96
+
97
+
98
+ ### :bug: Bug Fix
99
+
100
+ * lit@2.2.1 ([6707752](https://github.com/hatiolab/operato/commit/6707752907d24f7ecbe248cba18a4b18cfda282f))
101
+
102
+ ## [1.0.0-alpha.48](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.47...v1.0.0-alpha.48) (2022-04-03)
103
+
104
+ ## [1.0.0-alpha.47](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.46...v1.0.0-alpha.47) (2022-04-02)
105
+
106
+ ## [1.0.0-alpha.46](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.45...v1.0.0-alpha.46) (2022-04-02)
107
+
108
+ ## [1.0.0-alpha.45](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.44...v1.0.0-alpha.45) (2022-03-31)
109
+
110
+
111
+ ### :bug: Bug Fix
112
+
113
+ * shift => workShift ([449b030](https://github.com/hatiolab/operato/commit/449b030b209adb67fdd3635125ac19f280eed861))
114
+
115
+ ## [1.0.0-alpha.44](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.43...v1.0.0-alpha.44) (2022-03-31)
116
+
117
+
118
+ ### :rocket: New Features
119
+
120
+ * add workData and shift into data-sample and data-ooc ([35f8857](https://github.com/hatiolab/operato/commit/35f885742a59553c57891f1b6f2297afcf0b8fda))
121
+
122
+ ## [1.0.0-alpha.43](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.42...v1.0.0-alpha.43) (2022-03-30)
123
+
124
+ ## [1.0.0-alpha.42](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.41...v1.0.0-alpha.42) (2022-03-29)
125
+
126
+ ## [1.0.0-alpha.41](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.40...v1.0.0-alpha.41) (2022-03-27)
127
+
128
+ ## [1.0.0-alpha.40](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.39...v1.0.0-alpha.40) (2022-03-26)
129
+
130
+
131
+ ### :bug: Bug Fix
132
+
133
+ * ox-data-ooc ([77ce499](https://github.com/hatiolab/operato/commit/77ce49978d60cb964ce736f9289655103740f04c))
134
+
135
+ ## [1.0.0-alpha.39](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.38...v1.0.0-alpha.39) (2022-03-25)
136
+
137
+
138
+ ### :bug: Bug Fix
139
+
140
+ * added ox-data-ooc-view ([6693d0c](https://github.com/hatiolab/operato/commit/6693d0cdea7481c877ded73ab1ca1746f49b5ead))
141
+ * ox-data-sample-view ooc oos style ([7e8bebe](https://github.com/hatiolab/operato/commit/7e8bebe1d08eb60a42823bb1850a8d8738b1bb75))
142
+ * ox-data-sample-view ooc,oos icon checked => done ([3e3e345](https://github.com/hatiolab/operato/commit/3e3e3459104eac47a60fac60ab3c6ceeb933df14))
143
+ * ox-data-sample-view style ([ff0513d](https://github.com/hatiolab/operato/commit/ff0513dbd5f8cc6a72c336c2336f544e463ab78a))
144
+
145
+ ## [1.0.0-alpha.38](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.37...v1.0.0-alpha.38) (2022-03-25)
146
+
147
+
148
+ ### :bug: Bug Fix
149
+
150
+ * ox-data-sample-view ([6c998f1](https://github.com/hatiolab/operato/commit/6c998f10dcae30fcf228bfe6f547930d0bfc777c))
151
+ * ox-data-sample-view datetime format ([ca8f7ca](https://github.com/hatiolab/operato/commit/ca8f7ca8c29037d5a5bef518f6dfad2df9363097))
152
+ * ox-data-sample-view style ([ec02b2f](https://github.com/hatiolab/operato/commit/ec02b2fae0084f81229a335216672e1231dede7d))
153
+ * ox-data-sample-view style ([7b7c5ee](https://github.com/hatiolab/operato/commit/7b7c5eed16672a4b97c332b5933cc305208d8553))
154
+
155
+ ## [1.0.0-alpha.37](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.36...v1.0.0-alpha.37) (2022-03-25)
156
+
157
+
158
+ ### :bug: Bug Fix
159
+
160
+ * data-item-spec => data-use-case ([3b5e684](https://github.com/hatiolab/operato/commit/3b5e684362621b89883ea6ed22acb7084678d3a5))
161
+ * data-use-case-xx ([7564cd3](https://github.com/hatiolab/operato/commit/7564cd3bdc9d4f61ac4eba6d382e9066a6d36a90))
162
+ * dataset ox-data-sample-view started ([42ceefe](https://github.com/hatiolab/operato/commit/42ceefe919739bbc9e30e468b3f526831e0a56c8))
163
+ * export some components and remove unused components ([3b9788d](https://github.com/hatiolab/operato/commit/3b9788d9d2a73235a2f96d586dcb02643768f0d6))
164
+ * handling data-use-case acceptables ([9ac1239](https://github.com/hatiolab/operato/commit/9ac12396fe15aebddef52bb0ed7fe1f445a6dbfd))
165
+
166
+ ## [1.0.0-alpha.36](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.35...v1.0.0-alpha.36) (2022-03-21)
167
+
168
+ ## [1.0.0-alpha.35](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.34...v1.0.0-alpha.35) (2022-03-21)
169
+
170
+ ## [1.0.0-alpha.34](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.33...v1.0.0-alpha.34) (2022-03-20)
171
+
172
+
173
+ ### :bug: Bug Fix
174
+
175
+ * data-grist field styles for tooltip ([5f90650](https://github.com/hatiolab/operato/commit/5f90650ef36023834af3d3bf027cd300cc6bffc1))
176
+ * tooltip style ([4cd1b9d](https://github.com/hatiolab/operato/commit/4cd1b9d05c46c6a607865a0ff71a50f6e0df8797))
177
+
178
+ ## [1.0.0-alpha.33](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.32...v1.0.0-alpha.33) (2022-03-19)
179
+
180
+ ## [1.0.0-alpha.32](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.31...v1.0.0-alpha.32) (2022-03-19)
181
+
182
+ ## [1.0.0-alpha.31](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.30...v1.0.0-alpha.31) (2022-03-19)
183
+
184
+
185
+ ### :bug: Bug Fix
186
+
187
+ * added unit for ox-data-entry-form demo page, add active filter for ox-data-entry-form ([e981771](https://github.com/hatiolab/operato/commit/e9817714b86ffa6be742f1c5f4c72df7ad09a863))
188
+ * ox-grist-renderer support class type renderer (refer ox-grist-renderer-progress) ([ad7c8e1](https://github.com/hatiolab/operato/commit/ad7c8e1b453d19af9daa13ae4eb7c2059d85dfbb))
189
+
190
+ ## [1.0.0-alpha.30](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.29...v1.0.0-alpha.30) (2022-03-18)
191
+
192
+ ## [1.0.0-alpha.29](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.28...v1.0.0-alpha.29) (2022-03-17)
193
+
194
+ ## [1.0.0-alpha.28](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.26...v1.0.0-alpha.28) (2022-03-17)
195
+
196
+
197
+ ### :rocket: New Features
198
+
199
+ * add ox-grist-editor for partition-keys ([7672a27](https://github.com/hatiolab/operato/commit/7672a2729f78475602733a83779f6a7a96e128fd))
200
+
201
+ ## [1.0.0-alpha.26](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.25...v1.0.0-alpha.26) (2022-03-17)
202
+
203
+ ## [1.0.0-alpha.25](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.24...v1.0.0-alpha.25) (2022-03-17)
204
+
205
+ ## [1.0.0-alpha.24](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.23...v1.0.0-alpha.24) (2022-03-17)
206
+
207
+
208
+ ### :bug: Bug Fix
209
+
210
+ * ccp, dataset, property-editor style ([92b2448](https://github.com/hatiolab/operato/commit/92b2448756604ee0b885949dd193241f319cf147))
211
+ * ox-data-item-spec style ([f963757](https://github.com/hatiolab/operato/commit/f963757ccef0144687ce49493281c25a82a259d3))
212
+ * refactoring grist-editor, property-editor and input ([bdc3197](https://github.com/hatiolab/operato/commit/bdc31977d148c80a3ac0bea4b33160bac277df1e))
213
+ * refactoring grist-editor, property-editor and input ([ea7431a](https://github.com/hatiolab/operato/commit/ea7431a5e2dfd96ef392c1905e9622df7c2ef88c))
214
+
215
+ ## [1.0.0-alpha.23](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.22...v1.0.0-alpha.23) (2022-03-17)
216
+
217
+
218
+ ### :rocket: New Features
219
+
220
+ * added qc module ([263b679](https://github.com/hatiolab/operato/commit/263b6794b97a635df1a50d013adaef2e83635908))
221
+
222
+ ## [1.0.0-alpha.22](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.21...v1.0.0-alpha.22) (2022-03-17)
223
+
224
+
225
+ ### :bug: Bug Fix
226
+
227
+ * ccp demo ([67b7d65](https://github.com/hatiolab/operato/commit/67b7d65b48d0ca7b3350684a45a396c0538c4902))
228
+
229
+
230
+ ### :rocket: New Features
231
+
232
+ * added data-item-spec-editor for grist ([8376e14](https://github.com/hatiolab/operato/commit/8376e142d894a709e60ed676e917d5a26e01e374))
233
+
234
+ ## [1.0.0-alpha.21](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.20...v1.0.0-alpha.21) (2022-03-16)
235
+
236
+
237
+ ### :rocket: New Features
238
+
239
+ * @operato/ccp module added ([f08ba5a](https://github.com/hatiolab/operato/commit/f08ba5a464c04b7fb132c6f18de975997087846a))
240
+ * ccp spec provider ([d72fe7c](https://github.com/hatiolab/operato/commit/d72fe7c497685e7f033ef04e6a866bd86613f397))
241
+
242
+
243
+ ### :bug: Bug Fix
244
+
245
+ * demo ([6fa3eac](https://github.com/hatiolab/operato/commit/6fa3eac612bd98ce25e3ef6d8ce89527d7152fb4))
246
+ * description on ox-data-item-spec view ([47da306](https://github.com/hatiolab/operato/commit/47da306a253a96e0c24c986e4608bfe0713a111a))
247
+
248
+ ## [1.0.0-alpha.20](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.19...v1.0.0-alpha.20) (2022-03-15)
249
+
250
+
251
+ ### :bug: Bug Fix
252
+
253
+ * ox-data-entry-form in dataset module ([736fe96](https://github.com/hatiolab/operato/commit/736fe968e292059055d18a4c18a5da979bbb4722))
254
+
255
+ ## [1.0.0-alpha.19](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.18...v1.0.0-alpha.19) (2022-03-14)
256
+
257
+ ## [1.0.0-alpha.18](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.17...v1.0.0-alpha.18) (2022-03-14)
258
+
259
+ ## [1.0.0-alpha.17](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.16...v1.0.0-alpha.17) (2022-03-13)
260
+
261
+ ## [1.0.0-alpha.16](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.15...v1.0.0-alpha.16) (2022-03-13)
262
+
263
+ ## [1.0.0-alpha.15](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.14...v1.0.0-alpha.15) (2022-03-13)
264
+
265
+ ## [1.0.0-alpha.14](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.13...v1.0.0-alpha.14) (2022-03-13)
266
+
267
+ ## [1.0.0-alpha.13](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.12...v1.0.0-alpha.13) (2022-03-13)
268
+
269
+ ## [1.0.0-alpha.12](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.11...v1.0.0-alpha.12) (2022-03-13)
270
+
271
+ ## [1.0.0-alpha.11](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.10...v1.0.0-alpha.11) (2022-03-12)
272
+
273
+ ## [1.0.0-alpha.10](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.9...v1.0.0-alpha.10) (2022-03-12)
274
+
275
+ ## [1.0.0-alpha.9](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.8...v1.0.0-alpha.9) (2022-03-12)
276
+
277
+ ## [1.0.0-alpha.8](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.7...v1.0.0-alpha.8) (2022-03-11)
278
+
279
+ ## [1.0.0-alpha.7](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.6...v1.0.0-alpha.7) (2022-03-11)
280
+
281
+ ## [1.0.0-alpha.6](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.5...v1.0.0-alpha.6) (2022-03-11)
282
+
283
+
284
+ ### :bug: Bug Fix
285
+
286
+ * ox-data-entry-form style ([c94c833](https://github.com/hatiolab/operato/commit/c94c8338aee8cf3e69c286e6af7cb2b5f081bbc7))
287
+
288
+ ## [1.0.0-alpha.5](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.4...v1.0.0-alpha.5) (2022-03-11)
289
+
290
+
291
+ ### :bug: Bug Fix
292
+
293
+ * data entry style ([d3dc3a6](https://github.com/hatiolab/operato/commit/d3dc3a6612c75597162621bd22421fa8d808cb13))
294
+
295
+ ## [1.0.0-alpha.4](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.3...v1.0.0-alpha.4) (2022-03-11)
296
+
297
+
298
+ ### :bug: Bug Fix
299
+
300
+ * ox-data-entry-form options and inputs layout ([56987c6](https://github.com/hatiolab/operato/commit/56987c664000d558427ba8dbf77730130061cb1a))
301
+
302
+ ## [1.0.0-alpha.3](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.2...v1.0.0-alpha.3) (2022-03-10)
303
+
304
+
305
+ ### :bug: Bug Fix
306
+
307
+ * add file type for data-item ([0177c84](https://github.com/hatiolab/operato/commit/0177c84ef3a91bfe85e6aec796b33b29a0e0f45e))
308
+
309
+ ## [1.0.0-alpha.2](https://github.com/hatiolab/operato/compare/v1.0.0-alpha.1...v1.0.0-alpha.2) (2022-03-10)
310
+
311
+
312
+ ### :bug: Bug Fix
313
+
314
+ * data-entry-form select options ([5a008c6](https://github.com/hatiolab/operato/commit/5a008c64ee07ff6763a4b1a50ef88dc976643275))
315
+
316
+ ## [1.0.0-alpha.1](https://github.com/hatiolab/operato/compare/v0.4.3...v1.0.0-alpha.1) (2022-03-09)
317
+
318
+
319
+
320
+ ## [1.0.0-beta.5](https://github.com/hatiolab/operato/compare/v1.0.0-beta.4...v1.0.0-beta.5) (2022-04-18)
321
+
322
+ **Note:** Version bump only for package @operato/dataset
323
+
324
+
325
+
326
+
327
+
328
+ ## [1.0.0-beta.4](https://github.com/hatiolab/operato/compare/v1.0.0-beta.3...v1.0.0-beta.4) (2022-04-14)
329
+
330
+ **Note:** Version bump only for package @operato/dataset
331
+
332
+
333
+
334
+
335
+
336
+ ## [1.0.0-beta.3](https://github.com/hatiolab/operato/compare/v1.0.0-beta.2...v1.0.0-beta.3) (2022-04-12)
337
+
338
+
339
+ ### :bug: Bug Fix
340
+
341
+ * translation and ox-data-entry-form ([424014e](https://github.com/hatiolab/operato/commit/424014edc61181f373db2aa107d60e258a8776af))
342
+
343
+
344
+
345
+ ## [1.0.0-beta.2](https://github.com/hatiolab/operato/compare/v1.0.0-beta.1...v1.0.0-beta.2) (2022-04-12)
346
+
347
+ **Note:** Version bump only for package @operato/dataset
348
+
349
+
350
+
351
+
352
+
6
353
  ## [1.0.0-beta.1](https://github.com/hatiolab/operato/compare/v1.0.0-beta.0...v1.0.0-beta.1) (2022-04-11)
7
354
 
8
355
  **Note:** Version bump only for package @operato/dataset
@@ -2,7 +2,7 @@
2
2
  <html lang="en-GB">
3
3
  <head>
4
4
  <meta charset="utf-8" />
5
- <meta name="viewport" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
6
6
  <style>
7
7
  body {
8
8
  /* box-sizing: border-box; */
@@ -1,9 +1,9 @@
1
1
  import { __decorate } from "tslib";
2
2
  import '../ox-data-item-spec.js';
3
- import { LitElement, css, html } from 'lit';
3
+ import { css, html, LitElement } from 'lit';
4
4
  import { customElement, property } from 'lit/decorators.js';
5
- import { ScrollbarStyles } from '@operato/styles';
6
5
  import { i18next } from '@operato/i18n';
6
+ import { ScrollbarStyles } from '@operato/styles';
7
7
  let OxPopupDataItemSpec = class OxPopupDataItemSpec extends LitElement {
8
8
  render() {
9
9
  var dataItem = this.dataItem || {};
@@ -56,6 +56,7 @@ OxPopupDataItemSpec.styles = [
56
56
  ox-data-item-spec {
57
57
  flex: 1;
58
58
  overflow-y: auto;
59
+ padding: var(--padding-wide);
59
60
  }
60
61
 
61
62
  span {
@@ -1 +1 @@
1
- {"version":3,"file":"ox-popup-data-item-spec.js","sourceRoot":"","sources":["../../../src/grist-editor/ox-popup-data-item-spec.ts"],"names":[],"mappings":";AAAA,OAAO,yBAAyB,CAAA;AAEhC,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAG3D,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AACjD,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAGvC,IAAa,mBAAmB,GAAhC,MAAa,mBAAoB,SAAQ,UAAU;IAwCjD,MAAM;QACJ,IAAI,QAAQ,GAAG,IAAI,CAAC,QAAQ,IAAI,EAAE,CAAA;QAElC,OAAO,IAAI,CAAA;kCACmB,IAAI,CAAC,KAAK,cAAc,QAAQ,YAAY,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;;;;6BAIzE,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,OAAO,CAAC,IAAI,EAAE,CAAA;IAChB,CAAC;IAEO,SAAS,CAAC,CAAQ;QACxB,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACxD,OAAO,CAAC,IAAI,EAAE,CAAA;IAChB,CAAC;CACF,CAAA;AA9EQ,0BAAM,GAAG;IACd,eAAe;IACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA8BF;CACF,CAAA;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAAW;AACV;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qDAAoB;AACnB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4DAAwC;AAtCxD,mBAAmB;IAD/B,aAAa,CAAC,yBAAyB,CAAC;GAC5B,mBAAmB,CA+E/B;SA/EY,mBAAmB","sourcesContent":["import '../ox-data-item-spec.js'\n\nimport { LitElement, css, html } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { DataItem } from '../types.js'\nimport { ScrollbarStyles } from '@operato/styles'\nimport { i18next } from '@operato/i18n'\n\n@customElement('ox-popup-data-item-spec')\nexport class OxPopupDataItemSpec 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-data-item-spec {\n flex: 1;\n overflow-y: auto;\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 }) dataItem?: DataItem\n @property({ type: Object }) confirmCallback!: (newval: any) => void\n\n render() {\n var dataItem = this.dataItem || {}\n\n return html`\n <ox-data-item-spec .value=${this.value} .dataItem=${dataItem} @change=${this.onChange.bind(this)}>\n </ox-data-item-spec>\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 history.back()\n }\n\n private onConfirm(e: Event) {\n this.confirmCallback && this.confirmCallback(this.value)\n history.back()\n }\n}\n"]}
1
+ {"version":3,"file":"ox-popup-data-item-spec.js","sourceRoot":"","sources":["../../../src/grist-editor/ox-popup-data-item-spec.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,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAKjD,IAAa,mBAAmB,GAAhC,MAAa,mBAAoB,SAAQ,UAAU;IAyCjD,MAAM;QACJ,IAAI,QAAQ,GAAG,IAAI,CAAC,QAAQ,IAAI,EAAE,CAAA;QAElC,OAAO,IAAI,CAAA;kCACmB,IAAI,CAAC,KAAK,cAAc,QAAQ,YAAY,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;;;;6BAIzE,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,OAAO,CAAC,IAAI,EAAE,CAAA;IAChB,CAAC;IAEO,SAAS,CAAC,CAAQ;QACxB,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;QACxD,OAAO,CAAC,IAAI,EAAE,CAAA;IAChB,CAAC;CACF,CAAA;AA/EQ,0BAAM,GAAG;IACd,eAAe;IACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA+BF;CACF,CAAA;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAAW;AACV;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qDAAoB;AACnB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4DAAwC;AAvCxD,mBAAmB;IAD/B,aAAa,CAAC,yBAAyB,CAAC;GAC5B,mBAAmB,CAgF/B;SAhFY,mBAAmB","sourcesContent":["import '../ox-data-item-spec.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { i18next } from '@operato/i18n'\nimport { ScrollbarStyles } from '@operato/styles'\n\nimport { DataItem } from '../types.js'\n\n@customElement('ox-popup-data-item-spec')\nexport class OxPopupDataItemSpec 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-data-item-spec {\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 }) dataItem?: DataItem\n @property({ type: Object }) confirmCallback!: (newval: any) => void\n\n render() {\n var dataItem = this.dataItem || {}\n\n return html`\n <ox-data-item-spec .value=${this.value} .dataItem=${dataItem} @change=${this.onChange.bind(this)}>\n </ox-data-item-spec>\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 history.back()\n }\n\n private onConfirm(e: Event) {\n this.confirmCallback && this.confirmCallback(this.value)\n history.back()\n }\n}\n"]}
@@ -4,7 +4,12 @@ import { css, html, LitElement } from 'lit';
4
4
  import { customElement, property } from 'lit/decorators.js';
5
5
  let OxDataEntryForm = class OxDataEntryForm extends LitElement {
6
6
  render() {
7
- return html `<form @change=${(e) => this.onChange(e)}>${this.buildInputs()}</form>`;
7
+ var _a, _b;
8
+ return html ` <form @change=${(e) => this.onChange(e)}>
9
+ <h2>${((_a = this.dataSet) === null || _a === void 0 ? void 0 : _a.name) || ''}</h2>
10
+ <h3>${((_b = this.dataSet) === null || _b === void 0 ? void 0 : _b.description) || ''}</h3>
11
+ ${this.buildInputs()}
12
+ </form>`;
8
13
  }
9
14
  onChange(e) {
10
15
  this.value = this.buildValue();
@@ -50,6 +55,7 @@ let OxDataEntryForm = class OxDataEntryForm extends LitElement {
50
55
  });
51
56
  return html ` <label .title=${description}>
52
57
  <div name>${name}${unit ? `(${unit})` : ''}</div>
58
+ <div description><mwc-icon>info_outline</mwc-icon> ${description}</div>
53
59
  <div elements>${elements}</div>
54
60
  </label>`;
55
61
  });
@@ -70,6 +76,23 @@ OxDataEntryForm.styles = css `
70
76
  :host {
71
77
  display: flex;
72
78
  flex-direction: row;
79
+ --item-description-font: normal 0.8rem/1rem var(--theme-font);
80
+ --item-description-color: var(--page-description-color);
81
+ }
82
+
83
+ h2 {
84
+ margin: var(--title-margin);
85
+ font: var(--title-font);
86
+ color: var(--title-text-color);
87
+ text-transform: capitalize;
88
+ text-align: center;
89
+ }
90
+ h3 {
91
+ margin: var(--page-description-margin);
92
+ font: var(--page-description-font);
93
+ color: var(--page-description-color);
94
+ text-transform: capitalize;
95
+ text-align: center;
73
96
  }
74
97
 
75
98
  form {
@@ -80,24 +103,42 @@ OxDataEntryForm.styles = css `
80
103
  }
81
104
  label {
82
105
  display: grid;
83
- grid-template-columns: repeat(12, 1fr);
84
- gap: 9px;
106
+
107
+ grid-template-rows: auto 1fr;
108
+ grid-template-columns: 1fr 5fr;
109
+ grid-template-areas: 'name description' 'empty inputs';
110
+
111
+ grid-gap: 9px;
85
112
  align-items: center;
86
113
  margin-bottom: var(--margin-default);
87
114
  }
88
- label:nth-child(even) {
115
+ label:nth-child(odd) {
89
116
  background-color: var(--main-section-background-color);
90
117
  padding: var(--padding-default) 0;
91
118
  }
92
119
 
93
120
  div[name] {
94
- grid-column: span 2 / auto;
121
+ grid-area: name;
95
122
  font: var(--label-font);
96
123
  color: var(--label-color);
97
124
  text-align: right;
98
125
  }
126
+ div[description] {
127
+ grid-area: description;
128
+ opacity: 0.7;
129
+ font: var(--item-description-font);
130
+ color: var(--item-description-color);
131
+ text-align: left;
132
+ }
133
+ div[description] * {
134
+ vertical-align: middle;
135
+ }
136
+ div[description] mwc-icon {
137
+ margin-top: -3px;
138
+ font-size: 0.9rem;
139
+ }
99
140
  div[elements] {
100
- grid-column: span 10 / auto;
141
+ grid-area: inputs;
101
142
  display: flex;
102
143
  flex-direction: row;
103
144
  flex-wrap: wrap;
@@ -116,11 +157,20 @@ OxDataEntryForm.styles = css `
116
157
  }
117
158
 
118
159
  @media only screen and (max-width: 460px) {
119
- div[name] {
120
- grid-column: span 3 / auto;
160
+ label {
161
+ display: grid;
162
+
163
+ grid-template-rows: auto auto 1fr;
164
+ grid-template-columns: 1fr;
165
+ grid-template-areas: 'name' 'description' 'inputs';
166
+
167
+ grid-gap: 9px;
168
+ align-items: center;
169
+ margin-bottom: var(--margin-default);
121
170
  }
122
- div[elements] {
123
- grid-column: span 9 / auto;
171
+
172
+ div[name] {
173
+ text-align: left;
124
174
  }
125
175
  }
126
176
  `;
@@ -1 +1 @@
1
- {"version":3,"file":"ox-data-entry-form.js","sourceRoot":"","sources":["../../src/ox-data-entry-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 { DataSet } from './types.js'\n\n@customElement('ox-data-entry-form')\nexport class OxDataEntryForm extends LitElement {\n static styles = css`\n :host {\n display: flex;\n flex-direction: row;\n }\n\n form {\n flex: 1;\n\n display: flex;\n flex-direction: column;\n }\n label {\n display: grid;\n grid-template-columns: repeat(12, 1fr);\n gap: 9px;\n align-items: center;\n margin-bottom: var(--margin-default);\n }\n label:nth-child(even) {\n background-color: var(--main-section-background-color);\n padding: var(--padding-default) 0;\n }\n\n div[name] {\n grid-column: span 2 / auto;\n font: var(--label-font);\n color: var(--label-color);\n text-align: right;\n }\n div[elements] {\n grid-column: span 10 / auto;\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n gap: 10px;\n padding-right: var(--padding-default);\n }\n div[elements] * {\n flex: 1;\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 div[name] {\n grid-column: span 3 / auto;\n }\n div[elements] {\n grid-column: span 9 / auto;\n }\n }\n `\n\n @property({ type: Object }) dataSet?: DataSet\n @property({ type: Object }) value?: { [tag: string]: any }\n\n render() {\n return html`<form @change=${(e: Event) => this.onChange(e)}>${this.buildInputs()}</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 dataItems = this.dataSet!.dataItems.filter(item => item.active)\n\n return (dataItems || []).map(dataItem => {\n const { name, description, tag, type, quota = 1, options = {}, unit } = dataItem\n\n const samples = new Array(quota).fill(0)\n const value = this.value && this.value[tag]\n\n const elements = samples.map((_, idx) => {\n const v = value instanceof Array ? value[idx] : idx === 0 ? value : undefined\n\n switch (type) {\n case 'select':\n return html` <select .name=${tag}>\n <option value=\"\"></option>\n ${(options.options || []).map(\n option => html`<option value=${option.value} ?selected=${option.value === v}>${option.text}</option>`\n )}\n </select>`\n break\n\n case 'boolean':\n return html` <input type=\"checkbox\" name=${tag} .checked=${v} />`\n break\n\n case 'number':\n return html` <input type=\"number\" name=${tag} value=${v} />`\n break\n\n case 'file':\n return 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 return html` <input type=\"string\" name=${tag} value=${v} />`\n }\n })\n\n return html` <label .title=${description}>\n <div name>${name}${unit ? `(${unit})` : ''}</div>\n <div elements>${elements}</div>\n </label>`\n })\n }\n\n private buildValue() {\n const dataItems = this.dataSet!.dataItems\n\n return (dataItems || []).reduce((sum, dataItem) => {\n const { tag, type } = dataItem\n\n const editors = Array.prototype.slice.call(\n this.renderRoot.querySelectorAll(`[name=${tag}]`) as NodeListOf<HTMLInputElement>\n ) as HTMLInputElement[]\n\n if (editors.length > 0) {\n sum[tag] = editors.map(editor => (type === 'boolean' ? editor.checked : editor.value))\n }\n\n return sum\n }, {} as { [tag: string]: any })\n }\n}\n"]}
1
+ {"version":3,"file":"ox-data-entry-form.js","sourceRoot":"","sources":["../../src/ox-data-entry-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 { DataSet } from './types.js'\n\n@customElement('ox-data-entry-form')\nexport class OxDataEntryForm 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 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 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 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 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 div[description] * {\n vertical-align: middle;\n }\n div[description] mwc-icon {\n margin-top: -3px;\n font-size: 0.9rem;\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 div[elements] * {\n flex: 1;\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 }) dataSet?: DataSet\n @property({ type: Object }) value?: { [tag: string]: any }\n\n render() {\n return html` <form @change=${(e: Event) => this.onChange(e)}>\n <h2>${this.dataSet?.name || ''}</h2>\n <h3>${this.dataSet?.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 dataItems = this.dataSet!.dataItems.filter(item => item.active)\n\n return (dataItems || []).map(dataItem => {\n const { name, description, tag, type, quota = 1, options = {}, unit } = dataItem\n\n const samples = new Array(quota).fill(0)\n const value = this.value && this.value[tag]\n\n const elements = samples.map((_, idx) => {\n const v = value instanceof Array ? value[idx] : idx === 0 ? value : undefined\n\n switch (type) {\n case 'select':\n return html` <select .name=${tag}>\n <option value=\"\"></option>\n ${(options.options || []).map(\n option => html`<option value=${option.value} ?selected=${option.value === v}>${option.text}</option>`\n )}\n </select>`\n break\n\n case 'boolean':\n return html` <input type=\"checkbox\" name=${tag} .checked=${v} />`\n break\n\n case 'number':\n return html` <input type=\"number\" name=${tag} value=${v} />`\n break\n\n case 'file':\n return 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 return html` <input type=\"string\" name=${tag} value=${v} />`\n }\n })\n\n return html` <label .title=${description}>\n <div name>${name}${unit ? `(${unit})` : ''}</div>\n <div description><mwc-icon>info_outline</mwc-icon> ${description}</div>\n <div elements>${elements}</div>\n </label>`\n })\n }\n\n private buildValue() {\n const dataItems = this.dataSet!.dataItems\n\n return (dataItems || []).reduce((sum, dataItem) => {\n const { tag, type } = dataItem\n\n const editors = Array.prototype.slice.call(\n this.renderRoot.querySelectorAll(`[name=${tag}]`) as NodeListOf<HTMLInputElement>\n ) as HTMLInputElement[]\n\n if (editors.length > 0) {\n sum[tag] = editors.map(editor => (type === 'boolean' ? editor.checked : editor.value))\n }\n\n return sum\n }, {} as { [tag: string]: any })\n }\n}\n"]}
@@ -1,7 +1,8 @@
1
1
  import '@operato/input/ox-input-file.js';
2
2
  import './ox-data-sample-view';
3
- import { DataOoc, DataSet } from './types.js';
3
+ import '@material/mwc-icon';
4
4
  import { LitElement } from 'lit';
5
+ import { DataOoc, DataSet } from './types.js';
5
6
  export declare class OxDataOocView extends LitElement {
6
7
  static styles: import("lit").CSSResult;
7
8
  dataSet?: DataSet;