@operato/dataset 2.0.0-alpha.3 → 2.0.0-alpha.30

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 (75) hide show
  1. package/CHANGELOG.md +214 -0
  2. package/demo/favicon.ico +0 -0
  3. package/demo/index.html +338 -0
  4. package/demo/ox-data-ooc-brief-view-test.html +338 -0
  5. package/dist/src/ox-data-entry-form.js +48 -36
  6. package/dist/src/ox-data-entry-form.js.map +1 -1
  7. package/dist/src/ox-data-entry-subgroup-form.js +2 -0
  8. package/dist/src/ox-data-entry-subgroup-form.js.map +1 -1
  9. package/dist/src/ox-data-entry-view.d.ts +2 -2
  10. package/dist/src/ox-data-entry-view.js +12 -2
  11. package/dist/src/ox-data-entry-view.js.map +1 -1
  12. package/dist/src/ox-data-ooc-badge.d.ts +9 -0
  13. package/dist/src/ox-data-ooc-badge.js +66 -0
  14. package/dist/src/ox-data-ooc-badge.js.map +1 -0
  15. package/dist/src/ox-data-ooc-brief-view.d.ts +2 -0
  16. package/dist/src/ox-data-ooc-brief-view.js +8 -110
  17. package/dist/src/ox-data-ooc-brief-view.js.map +1 -1
  18. package/dist/src/ox-data-ooc-correction-part.d.ts +9 -0
  19. package/dist/src/ox-data-ooc-correction-part.js +99 -0
  20. package/dist/src/ox-data-ooc-correction-part.js.map +1 -0
  21. package/dist/src/ox-data-ooc-history.d.ts +10 -0
  22. package/dist/src/ox-data-ooc-history.js +72 -0
  23. package/dist/src/ox-data-ooc-history.js.map +1 -0
  24. package/dist/src/ox-data-ooc-view.d.ts +1 -0
  25. package/dist/src/ox-data-ooc-view.js +6 -89
  26. package/dist/src/ox-data-ooc-view.js.map +1 -1
  27. package/dist/src/ox-data-sample-subgroup-view.js +1 -1
  28. package/dist/src/ox-data-sample-subgroup-view.js.map +1 -1
  29. package/dist/src/ox-data-sample-view.js +47 -30
  30. package/dist/src/ox-data-sample-view.js.map +1 -1
  31. package/dist/src/ox-data-summary-view.js +7 -1
  32. package/dist/src/ox-data-summary-view.js.map +1 -1
  33. package/dist/src/types.d.ts +57 -9
  34. package/dist/src/types.js.map +1 -1
  35. package/dist/src/usecase/spc/index.d.ts +1 -0
  36. package/dist/src/usecase/spc/index.js +8 -0
  37. package/dist/src/usecase/spc/index.js.map +1 -0
  38. package/dist/src/usecase/spc/ox-data-use-case-spc.d.ts +7 -0
  39. package/dist/src/usecase/spc/ox-data-use-case-spc.js +102 -0
  40. package/dist/src/usecase/spc/ox-data-use-case-spc.js.map +1 -0
  41. package/dist/src/usecase/spc/ox-input-spc-limits.d.ts +44 -0
  42. package/dist/src/usecase/spc/ox-input-spc-limits.js +193 -0
  43. package/dist/src/usecase/spc/ox-input-spc-limits.js.map +1 -0
  44. package/dist/src/usecase/spc/ox-property-editor-spc-limits.d.ts +6 -0
  45. package/dist/src/usecase/spc/ox-property-editor-spc-limits.js +24 -0
  46. package/dist/src/usecase/spc/ox-property-editor-spc-limits.js.map +1 -0
  47. package/dist/stories/ox-data-entry-form.stories.js +43 -0
  48. package/dist/stories/ox-data-entry-form.stories.js.map +1 -1
  49. package/dist/stories/ox-data-ooc-view.stories.js +2 -0
  50. package/dist/stories/ox-data-ooc-view.stories.js.map +1 -1
  51. package/dist/tsconfig.tsbuildinfo +1 -1
  52. package/package.json +37 -22
  53. package/src/ox-data-entry-form.ts +65 -46
  54. package/src/ox-data-entry-subgroup-form.ts +2 -0
  55. package/src/ox-data-entry-view.ts +13 -2
  56. package/src/ox-data-ooc-badge.ts +64 -0
  57. package/src/ox-data-ooc-brief-view.ts +9 -120
  58. package/src/ox-data-ooc-correction-part.ts +107 -0
  59. package/src/ox-data-ooc-history.ts +74 -0
  60. package/src/ox-data-ooc-view.ts +6 -91
  61. package/src/ox-data-sample-subgroup-view.ts +1 -1
  62. package/src/ox-data-sample-view.ts +47 -30
  63. package/src/ox-data-summary-view.ts +7 -1
  64. package/src/types.ts +76 -27
  65. package/src/usecase/spc/index.ts +10 -0
  66. package/src/usecase/spc/ox-data-use-case-spc.ts +147 -0
  67. package/src/usecase/spc/ox-input-spc-limits.ts +182 -0
  68. package/src/usecase/spc/ox-property-editor-spc-limits.ts +23 -0
  69. package/stories/ox-data-entry-form.stories.ts +44 -0
  70. package/stories/ox-data-ooc-view.stories.ts +2 -0
  71. package/themes/grist-theme.css +1 -1
  72. package/translations/en.json +1 -0
  73. package/translations/ko.json +1 -0
  74. package/translations/ms.json +142 -70
  75. package/translations/zh.json +146 -75
package/CHANGELOG.md CHANGED
@@ -3,6 +3,220 @@
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.30](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.29...v2.0.0-alpha.30) (2024-03-03)
7
+
8
+ **Note:** Version bump only for package @operato/dataset
9
+
10
+
11
+
12
+
13
+
14
+ ## [2.0.0-alpha.29](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.28...v2.0.0-alpha.29) (2024-02-22)
15
+
16
+
17
+ ### :bug: Bug Fix
18
+
19
+ * ox-data-entry-form style ([a3bb9df](https://github.com/hatiolab/operato/commit/a3bb9dfc7a88ef87b916f1c6c09581ba7fd885ce))
20
+ * value 어트리뷰트 바인딩 해제 (undefined 나옴) ([793caef](https://github.com/hatiolab/operato/commit/793caeff940b6863cf765783418727e0947f6f1e))
21
+
22
+
23
+
24
+ ## [2.0.0-alpha.28](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.27...v2.0.0-alpha.28) (2024-02-20)
25
+
26
+
27
+ ### :bug: Bug Fix
28
+
29
+ * ox-data-entry-form style ([52610be](https://github.com/hatiolab/operato/commit/52610beb2a3f47ce92c9ef537571356bb06f2593))
30
+ * ox-data-entry-form style ([b1b2483](https://github.com/hatiolab/operato/commit/b1b24830bdbbe37dc520dda813a0ad93e2962ea0))
31
+ * upgrade devDependencies for webcomponents ([1489b8b](https://github.com/hatiolab/operato/commit/1489b8b790d9bcee779a070a630697f25c01728f))
32
+
33
+
34
+
35
+ ## [2.0.0-alpha.27](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.26...v2.0.0-alpha.27) (2024-02-17)
36
+
37
+
38
+ ### :rocket: New Features
39
+
40
+ * 데이터셋에 타입에 radio 추가 ([e2ac89f](https://github.com/hatiolab/operato/commit/e2ac89f940d5d2ab0eb611fcdb4234b6e4d6856e))
41
+
42
+
43
+ ### :bug: Bug Fix
44
+
45
+ * escape undefined error ([91e7168](https://github.com/hatiolab/operato/commit/91e71680e7185c52a2bde09d6972de74e9aa953a))
46
+ * 모바일 데이터셋 그리드 최소 길이 설정 ([01a8c9a](https://github.com/hatiolab/operato/commit/01a8c9a46df507bb5cdb832858fd4421abea11ab))
47
+
48
+
49
+
50
+ ## [2.0.0-alpha.23](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.22...v2.0.0-alpha.23) (2024-02-10)
51
+
52
+ **Note:** Version bump only for package @operato/dataset
53
+
54
+
55
+
56
+
57
+
58
+ ## [2.0.0-alpha.22](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.21...v2.0.0-alpha.22) (2024-02-10)
59
+
60
+ **Note:** Version bump only for package @operato/dataset
61
+
62
+
63
+
64
+
65
+
66
+ ## [2.0.0-alpha.21](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.20...v2.0.0-alpha.21) (2024-02-09)
67
+
68
+
69
+ ### :bug: Bug Fix
70
+
71
+ * print-friendly ([e9a3eba](https://github.com/hatiolab/operato/commit/e9a3eba4550772e5d0bd0cbce31c5740568a2459))
72
+ * update dataset types ([84253fd](https://github.com/hatiolab/operato/commit/84253fdb2b052861b4017fd8675b0f047f252e1a))
73
+
74
+
75
+
76
+ ## [2.0.0-alpha.20](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.19...v2.0.0-alpha.20) (2024-02-05)
77
+
78
+ **Note:** Version bump only for package @operato/dataset
79
+
80
+
81
+
82
+
83
+
84
+ ## [2.0.0-alpha.19](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.18...v2.0.0-alpha.19) (2024-02-05)
85
+
86
+ **Note:** Version bump only for package @operato/dataset
87
+
88
+
89
+
90
+
91
+
92
+ ## [2.0.0-alpha.18](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.17...v2.0.0-alpha.18) (2024-02-04)
93
+
94
+
95
+ ### :bug: Bug Fix
96
+
97
+ * export spc chart components ([64c7524](https://github.com/hatiolab/operato/commit/64c752427cffa27f7d43e25a1d73b4be4e9bc28a))
98
+
99
+
100
+
101
+ ## [2.0.0-alpha.17](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.16...v2.0.0-alpha.17) (2024-02-04)
102
+
103
+
104
+ ### :bug: Bug Fix
105
+
106
+ * styling for printing ([c8557a6](https://github.com/hatiolab/operato/commit/c8557a69880bafe5a6a152b07b367946e584c6fb))
107
+
108
+
109
+
110
+ ## [2.0.0-alpha.16](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.15...v2.0.0-alpha.16) (2024-02-03)
111
+
112
+
113
+ ### :bug: Bug Fix
114
+
115
+ * dataset components for mobile ([f434288](https://github.com/hatiolab/operato/commit/f434288f8724c983b6ebed863a67a315efc9a7ce))
116
+
117
+
118
+
119
+ ## [2.0.0-alpha.15](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.14...v2.0.0-alpha.15) (2024-02-03)
120
+
121
+
122
+ ### :bug: Bug Fix
123
+
124
+ * rewrite spc module ([2311e10](https://github.com/hatiolab/operato/commit/2311e10ae19f5c512a71aae84743aca2bba12efd))
125
+
126
+
127
+
128
+ ## [2.0.0-alpha.14](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.13...v2.0.0-alpha.14) (2024-01-29)
129
+
130
+
131
+ ### :bug: Bug Fix
132
+
133
+ * simplify dataset component ([b88d5b4](https://github.com/hatiolab/operato/commit/b88d5b4778807fbecef11dcab4de40b3cf397de3))
134
+ * typo for dataset ox-data-ooc-view ([b2e68d5](https://github.com/hatiolab/operato/commit/b2e68d57017bde6dc609621620e45d4f78979835))
135
+
136
+
137
+
138
+ ## [2.0.0-alpha.13](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.12...v2.0.0-alpha.13) (2024-01-28)
139
+
140
+
141
+ ### :bug: Bug Fix
142
+
143
+ * css-variable --grid-record-padding ([b057312](https://github.com/hatiolab/operato/commit/b0573120fcb46c71b6b283065f08ae926e9f826f))
144
+
145
+
146
+
147
+ ## [2.0.0-alpha.12](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.11...v2.0.0-alpha.12) (2024-01-24)
148
+
149
+ **Note:** Version bump only for package @operato/dataset
150
+
151
+
152
+
153
+
154
+
155
+ ## [2.0.0-alpha.11](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.10...v2.0.0-alpha.11) (2024-01-24)
156
+
157
+ **Note:** Version bump only for package @operato/dataset
158
+
159
+
160
+
161
+
162
+
163
+ ## [2.0.0-alpha.10](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.9...v2.0.0-alpha.10) (2024-01-22)
164
+
165
+ **Note:** Version bump only for package @operato/dataset
166
+
167
+
168
+
169
+
170
+
171
+ ## [2.0.0-alpha.9](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.8...v2.0.0-alpha.9) (2024-01-20)
172
+
173
+ **Note:** Version bump only for package @operato/dataset
174
+
175
+
176
+
177
+
178
+
179
+ ## [2.0.0-alpha.8](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.7...v2.0.0-alpha.8) (2024-01-20)
180
+
181
+
182
+ ### :bug: Bug Fix
183
+
184
+ * stat-function => finalizing-function 마감함수 ([38d66d3](https://github.com/hatiolab/operato/commit/38d66d3a14ce9974bc72570f31f6b4e6bc39fca0))
185
+
186
+
187
+
188
+ ## [2.0.0-alpha.7](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.6...v2.0.0-alpha.7) (2024-01-15)
189
+
190
+ **Note:** Version bump only for package @operato/dataset
191
+
192
+
193
+
194
+
195
+
196
+ ## [2.0.0-alpha.6](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.5...v2.0.0-alpha.6) (2024-01-15)
197
+
198
+ **Note:** Version bump only for package @operato/dataset
199
+
200
+
201
+
202
+
203
+
204
+ ## [2.0.0-alpha.5](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.4...v2.0.0-alpha.5) (2024-01-15)
205
+
206
+ **Note:** Version bump only for package @operato/dataset
207
+
208
+
209
+
210
+
211
+
212
+ ## [2.0.0-alpha.4](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.3...v2.0.0-alpha.4) (2024-01-15)
213
+
214
+ **Note:** Version bump only for package @operato/dataset
215
+
216
+
217
+
218
+
219
+
6
220
  ## [2.0.0-alpha.3](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.2...v2.0.0-alpha.3) (2024-01-14)
7
221
 
8
222
  **Note:** Version bump only for package @operato/dataset
Binary file
@@ -0,0 +1,338 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en-GB">
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
6
+ <style>
7
+ body {
8
+ /* box-sizing: border-box; */
9
+ margin: 0;
10
+ padding: 0;
11
+ overflow: hidden;
12
+
13
+ /* This is a font-stack that tries to use the system-default sans-serifs first */
14
+ font-family: Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
15
+ line-height: 1.5;
16
+ -webkit-font-smoothing: antialiased;
17
+ }
18
+
19
+ #app {
20
+ width: 100vw;
21
+ height: 100dvh;
22
+ overflow: auto;
23
+
24
+ display: flex;
25
+ flex-direction: column;
26
+ }
27
+
28
+ #demo {
29
+ flex: 1;
30
+
31
+ display: flex;
32
+ flex-direction: column;
33
+ }
34
+
35
+ @media print {
36
+ #app {
37
+ height: unset;
38
+ }
39
+ }
40
+ </style>
41
+ <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
42
+ <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
43
+
44
+ <link href="/themes/app-theme.css" rel="stylesheet" />
45
+ <link href="/themes/oops-theme.css" rel="stylesheet" />
46
+ </head>
47
+
48
+ <body>
49
+ <script type="module">
50
+ import { LitElement, html, css, render } from 'lit'
51
+ import '../dist/src/index.js'
52
+ import '../dist/src/usecase/ccp/index.js'
53
+ import '../dist/src/ox-data-sample-view.js'
54
+
55
+ const dataSet = {
56
+ name: 'sample',
57
+ description: 'sample description',
58
+ type: 'manual',
59
+ useCase: 'CCP',
60
+ dataItems: [
61
+ {
62
+ name: '창고 온도',
63
+ description: '창고 온도는 섭씨 0도 이하로 유지되어야 합니다.',
64
+ sequence: 1,
65
+ tag: 'temp',
66
+ group: '측정데이타',
67
+ type: 'number',
68
+ quota: 1,
69
+ active: true,
70
+ unit: '℃',
71
+ spec: {
72
+ CCP: {
73
+ criticalLimits: {
74
+ minimum: 100,
75
+ maximum: 200
76
+ },
77
+ targetLimits: {
78
+ minimum: 120,
79
+ maximum: 180
80
+ }
81
+ }
82
+ }
83
+ },
84
+ {
85
+ name: '창고 습도',
86
+ description: '창고 습도는 30% 이하로 유지되어야 합니다.',
87
+ sequence: 2,
88
+ tag: 'humid',
89
+ group: '측정데이타',
90
+ type: 'number',
91
+ quota: 5,
92
+ active: true,
93
+ unit: '%',
94
+ spec: {
95
+ CCP: {
96
+ criticalLimits: {
97
+ minimum: 10,
98
+ maximum: 50
99
+ },
100
+ targetLimits: {
101
+ minimum: 20,
102
+ maximum: 40
103
+ }
104
+ }
105
+ }
106
+ },
107
+ {
108
+ name: '육안 검사',
109
+ description: '육안 검사는 포장전 30분 내로 실행되어야 합니다.',
110
+ sequence: 3,
111
+ tag: 'inspection',
112
+ group: '측정데이타',
113
+ type: 'boolean',
114
+ quota: 3,
115
+ active: true,
116
+ spec: {
117
+ CCP: {
118
+ criticalLimits: {
119
+ acceptables: true
120
+ },
121
+ targetLimits: {
122
+ acceptables: true
123
+ }
124
+ }
125
+ }
126
+ },
127
+ {
128
+ name: '품평',
129
+ description: '품평은 최우수/우수/보통/미달을 포함하여 간단히 평가.',
130
+ sequence: 4,
131
+ tag: 'evaluation',
132
+ group: '측정데이타',
133
+ type: 'select',
134
+ options: {
135
+ options: [
136
+ { text: '최우수', value: '최우수' },
137
+ { text: '우수', value: '우수' },
138
+ { text: '보통', value: '보통' },
139
+ { text: '미달', value: '미달' }
140
+ ]
141
+ },
142
+ quota: 3,
143
+ active: true,
144
+ spec: {
145
+ CCP: {
146
+ criticalLimits: {
147
+ acceptables: ['최우수', '우수', '보통']
148
+ },
149
+ targetLimits: {
150
+ acceptables: ['최우수', '우수']
151
+ }
152
+ }
153
+ }
154
+ },
155
+ {
156
+ name: '코멘트',
157
+ description: '특이사항을 기록함.',
158
+ sequence: 4,
159
+ tag: 'comment',
160
+ type: 'string',
161
+ quota: 1,
162
+ active: true
163
+ },
164
+ {
165
+ name: '첨부파일',
166
+ description: '참조 첨부 파일.',
167
+ sequence: 4,
168
+ tag: 'attachment',
169
+ type: 'file',
170
+ quota: 1,
171
+ active: true
172
+ }
173
+ ]
174
+ }
175
+
176
+ var dataSample = {
177
+ name: 'Data Sample Name',
178
+ description: 'Data Sample이 어쩌구 저쩌구 그래서 중요합니다. 당연히 그래야죠.',
179
+ state: 'CORRECTED',
180
+ useCase: 'CCP',
181
+ judgment: {
182
+ temp: {
183
+ ooc: true,
184
+ oos: false
185
+ },
186
+ humid: {
187
+ ooc: false,
188
+ oos: true
189
+ }
190
+ },
191
+ data: {
192
+ temp: [1000, 1023, 1027, 997, 981],
193
+ humid: [20, 23, 21, 26, 27],
194
+ inspection: [true, false, true, false, false],
195
+ evaluation: ['최우수', '보통', '우수', '보통', '최우수'],
196
+ comment: '이것은 코멘트입니다.'
197
+ },
198
+ dataItems: dataSet.dataItems,
199
+ spec: {
200
+ temp: {
201
+ name: '창고 온도',
202
+ description: '창고 온도는 섭씨 0도 이하로 유지되어야 합니다.',
203
+ spec: {
204
+ CCP: {
205
+ criticalLimits: {
206
+ minimum: 100,
207
+ maximum: 200
208
+ },
209
+ targetLimits: {
210
+ minimum: 120,
211
+ maximum: 180
212
+ }
213
+ }
214
+ }
215
+ },
216
+ humid: {
217
+ name: '창고 습도',
218
+ description: '창고 습도는 30% 이하로 유지되어야 합니다.',
219
+ spec: {
220
+ CCP: {
221
+ criticalLimits: {
222
+ minimum: 10,
223
+ maximum: 50
224
+ },
225
+ targetLimits: {
226
+ minimum: 20,
227
+ maximum: 40
228
+ }
229
+ }
230
+ }
231
+ },
232
+ inspection: {
233
+ name: '육안 검사',
234
+ description: '육안 검사는 포장전 30분 내로 실행되어야 합니다.'
235
+ },
236
+ evaluation: {
237
+ name: '품평',
238
+ description: '품평은 최우수/우수/보통/미달을 포함하여 간단히 평가.',
239
+ spec: {
240
+ CCP: {
241
+ criticalLimits: {
242
+ acceptables: ['최우수', '우수', '보통']
243
+ },
244
+ targetLimits: {
245
+ acceptables: ['최우수', '우수']
246
+ }
247
+ }
248
+ }
249
+ },
250
+ comment: {
251
+ name: '코멘트',
252
+ description: '특이사항을 기록함.'
253
+ },
254
+ attachment: {
255
+ name: '첨부파일',
256
+ description: '참조 첨부 파일.'
257
+ }
258
+ },
259
+ collectedAt: Date.now(),
260
+ reviewer: {
261
+ name: '남상혁'
262
+ },
263
+ reviewedAt: Date.now(),
264
+ correctiveInstruction: '바지틀고서 만나오리오. 쿠투추파',
265
+ corrector: {
266
+ name: '남상혁'
267
+ },
268
+ correctedAt: Date.now(),
269
+ correctiveAction: '바지틀고서 만나오리오. 쿠투추파',
270
+ history: [
271
+ {
272
+ user: {
273
+ id: 0,
274
+ name: 'shnam'
275
+ },
276
+ state: 'ISSUED',
277
+ timestamp: Date.now()
278
+ },
279
+ {
280
+ user: {
281
+ id: 0,
282
+ name: 'shnam'
283
+ },
284
+ state: 'REVIEWED',
285
+ comment: '금일 생산한 제품은 전량 폐기합니다',
286
+ timestamp: Date.now()
287
+ },
288
+ {
289
+ user: {
290
+ id: 0,
291
+ name: 'shnam'
292
+ },
293
+ state: 'CORRECTED',
294
+ timestamp: Date.now()
295
+ }
296
+ ]
297
+ }
298
+
299
+ class OxDataSampleViewDemo extends LitElement {
300
+ static styles = [
301
+ css`
302
+ :host {
303
+ display: block;
304
+ }
305
+
306
+ ox-data-sample-view {
307
+ page-break-after: always;
308
+ }
309
+ `
310
+ ]
311
+
312
+ render() {
313
+ return Array(10)
314
+ .fill(null)
315
+ .map(
316
+ () => html`
317
+ <ox-data-sample-view
318
+ .dataSet=${dataSet}
319
+ .dataSample=${dataSample}
320
+ @change=${e => console.log(e.detail)}
321
+ ></ox-data-sample-view>
322
+ `
323
+ )
324
+ }
325
+ }
326
+
327
+ customElements.define('ox-data-sample-view-demo', OxDataSampleViewDemo)
328
+
329
+ setTimeout(() => {
330
+ render(html` <ox-data-sample-view-demo></ox-data-sample-view-demo> `, document.querySelector('#demo'))
331
+ })
332
+ </script>
333
+
334
+ <div id="app">
335
+ <div id="demo"></div>
336
+ </div>
337
+ </body>
338
+ </html>