@pie-lib/mask-markup 1.33.3-next.2 → 1.33.3-next.203

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 (61) hide show
  1. package/CHANGELOG.md +13 -67
  2. package/lib/choices/choice.js +98 -203
  3. package/lib/choices/choice.js.map +1 -1
  4. package/lib/choices/index.js +21 -53
  5. package/lib/choices/index.js.map +1 -1
  6. package/lib/componentize.js +1 -5
  7. package/lib/componentize.js.map +1 -1
  8. package/lib/components/blank.js +303 -361
  9. package/lib/components/blank.js.map +1 -1
  10. package/lib/components/correct-input.js +41 -65
  11. package/lib/components/correct-input.js.map +1 -1
  12. package/lib/components/dropdown.js +218 -257
  13. package/lib/components/dropdown.js.map +1 -1
  14. package/lib/components/input.js +10 -17
  15. package/lib/components/input.js.map +1 -1
  16. package/lib/constructed-response.js +40 -54
  17. package/lib/constructed-response.js.map +1 -1
  18. package/lib/customizable.js +5 -9
  19. package/lib/customizable.js.map +1 -1
  20. package/lib/drag-in-the-blank.js +140 -105
  21. package/lib/drag-in-the-blank.js.map +1 -1
  22. package/lib/index.js +0 -7
  23. package/lib/index.js.map +1 -1
  24. package/lib/inline-dropdown.js +4 -12
  25. package/lib/inline-dropdown.js.map +1 -1
  26. package/lib/mask.js +60 -118
  27. package/lib/mask.js.map +1 -1
  28. package/lib/serialization.js +8 -48
  29. package/lib/serialization.js.map +1 -1
  30. package/lib/with-mask.js +30 -58
  31. package/lib/with-mask.js.map +1 -1
  32. package/package.json +12 -20
  33. package/src/__tests__/drag-in-the-blank.test.js +66 -26
  34. package/src/__tests__/mask.test.js +147 -112
  35. package/src/__tests__/with-mask.test.js +44 -19
  36. package/src/choices/__tests__/index.test.js +38 -25
  37. package/src/choices/choice.jsx +86 -153
  38. package/src/choices/index.jsx +9 -3
  39. package/src/components/__tests__/blank.test.js +92 -156
  40. package/src/components/__tests__/correct-input.test.js +60 -19
  41. package/src/components/__tests__/dropdown.test.js +61 -19
  42. package/src/components/__tests__/input.test.js +72 -20
  43. package/src/components/blank.jsx +273 -272
  44. package/src/components/correct-input.jsx +33 -39
  45. package/src/components/dropdown.jsx +173 -161
  46. package/src/constructed-response.jsx +25 -30
  47. package/src/drag-in-the-blank.jsx +131 -42
  48. package/src/mask.jsx +38 -29
  49. package/src/with-mask.jsx +7 -4
  50. package/esm/index.css +0 -847
  51. package/esm/index.js +0 -195939
  52. package/esm/index.js.map +0 -1
  53. package/esm/package.json +0 -3
  54. package/src/__tests__/__snapshots__/drag-in-the-blank.test.js.snap +0 -316
  55. package/src/__tests__/__snapshots__/mask.test.js.snap +0 -55
  56. package/src/__tests__/__snapshots__/with-mask.test.js.snap +0 -62
  57. package/src/choices/__tests__/__snapshots__/index.test.js.snap +0 -209
  58. package/src/components/__tests__/__snapshots__/blank.test.js.snap +0 -111
  59. package/src/components/__tests__/__snapshots__/correct-input.test.js.snap +0 -64
  60. package/src/components/__tests__/__snapshots__/dropdown.test.js.snap +0 -136
  61. package/src/components/__tests__/__snapshots__/input.test.js.snap +0 -34
package/esm/package.json DELETED
@@ -1,3 +0,0 @@
1
- {
2
- "type": "module"
3
- }
@@ -1,316 +0,0 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
2
-
3
- exports[`DragInTheBlank render renders correctly with default props 1`] = `
4
- <div
5
- style={
6
- Object {
7
- "alignItems": undefined,
8
- "display": "flex",
9
- "flexDirection": "column-reverse",
10
- "justifyContent": undefined,
11
- "minWidth": "100px",
12
- }
13
- }
14
- >
15
- <Choices
16
- choicePosition="below"
17
- choices={
18
- Array [
19
- Object {
20
- "id": "0",
21
- "value": "Jumped",
22
- },
23
- Object {
24
- "id": "1",
25
- "value": "Laughed",
26
- },
27
- Object {
28
- "id": "2",
29
- "value": "Spoon",
30
- },
31
- Object {
32
- "id": "3",
33
- "value": "Fork",
34
- },
35
- Object {
36
- "id": "4",
37
- "value": "Bumped",
38
- },
39
- Object {
40
- "id": "5",
41
- "value": "Smiled",
42
- },
43
- ]
44
- }
45
- disabled={false}
46
- value={
47
- Object {
48
- "0": undefined,
49
- }
50
- }
51
- />
52
- <WithMask
53
- choices={
54
- Array [
55
- Object {
56
- "id": "0",
57
- "value": "Jumped",
58
- },
59
- Object {
60
- "id": "1",
61
- "value": "Laughed",
62
- },
63
- Object {
64
- "id": "2",
65
- "value": "Spoon",
66
- },
67
- Object {
68
- "id": "3",
69
- "value": "Fork",
70
- },
71
- Object {
72
- "id": "4",
73
- "value": "Bumped",
74
- },
75
- Object {
76
- "id": "5",
77
- "value": "Smiled",
78
- },
79
- ]
80
- }
81
- disabled={false}
82
- elementType="drag-in-the-blank"
83
- feedback={Object {}}
84
- markup="<div>
85
- <img src=\\"https://image.shutterstock.com/image-vector/cow-jumped-over-moon-traditional-260nw-1152899330.jpg\\"></img>
86
- <h5>Hey Diddle Diddle <i>by ?</i></h5>
87
- <p>1: Hey, diddle, diddle,</p>
88
- <p>2: The cat and the fiddle,</p>
89
- <p>3: The cow {{0}} over the moon;</p>
90
- <p>4: The little dog {{1}},</p>
91
- <p>5: To see such sport,</p>
92
- <p>6: And the dish ran away with the {{2}}.</p>
93
- </div>"
94
- value={
95
- Object {
96
- "0": undefined,
97
- }
98
- }
99
- />
100
- </div>
101
- `;
102
-
103
- exports[`DragInTheBlank render renders correctly with disabled prop as true 1`] = `
104
- <div
105
- style={
106
- Object {
107
- "alignItems": undefined,
108
- "display": "flex",
109
- "flexDirection": "column-reverse",
110
- "justifyContent": undefined,
111
- "minWidth": "100px",
112
- }
113
- }
114
- >
115
- <Choices
116
- choicePosition="below"
117
- choices={
118
- Array [
119
- Object {
120
- "id": "0",
121
- "value": "Jumped",
122
- },
123
- Object {
124
- "id": "1",
125
- "value": "Laughed",
126
- },
127
- Object {
128
- "id": "2",
129
- "value": "Spoon",
130
- },
131
- Object {
132
- "id": "3",
133
- "value": "Fork",
134
- },
135
- Object {
136
- "id": "4",
137
- "value": "Bumped",
138
- },
139
- Object {
140
- "id": "5",
141
- "value": "Smiled",
142
- },
143
- ]
144
- }
145
- disabled={true}
146
- value={
147
- Object {
148
- "0": undefined,
149
- }
150
- }
151
- />
152
- <WithMask
153
- choices={
154
- Array [
155
- Object {
156
- "id": "0",
157
- "value": "Jumped",
158
- },
159
- Object {
160
- "id": "1",
161
- "value": "Laughed",
162
- },
163
- Object {
164
- "id": "2",
165
- "value": "Spoon",
166
- },
167
- Object {
168
- "id": "3",
169
- "value": "Fork",
170
- },
171
- Object {
172
- "id": "4",
173
- "value": "Bumped",
174
- },
175
- Object {
176
- "id": "5",
177
- "value": "Smiled",
178
- },
179
- ]
180
- }
181
- disabled={true}
182
- elementType="drag-in-the-blank"
183
- feedback={Object {}}
184
- markup="<div>
185
- <img src=\\"https://image.shutterstock.com/image-vector/cow-jumped-over-moon-traditional-260nw-1152899330.jpg\\"></img>
186
- <h5>Hey Diddle Diddle <i>by ?</i></h5>
187
- <p>1: Hey, diddle, diddle,</p>
188
- <p>2: The cat and the fiddle,</p>
189
- <p>3: The cow {{0}} over the moon;</p>
190
- <p>4: The little dog {{1}},</p>
191
- <p>5: To see such sport,</p>
192
- <p>6: And the dish ran away with the {{2}}.</p>
193
- </div>"
194
- value={
195
- Object {
196
- "0": undefined,
197
- }
198
- }
199
- />
200
- </div>
201
- `;
202
-
203
- exports[`DragInTheBlank render renders correctly with feedback 1`] = `
204
- <div
205
- style={
206
- Object {
207
- "alignItems": undefined,
208
- "display": "flex",
209
- "flexDirection": "column-reverse",
210
- "justifyContent": undefined,
211
- "minWidth": "100px",
212
- }
213
- }
214
- >
215
- <Choices
216
- choicePosition="below"
217
- choices={
218
- Array [
219
- Object {
220
- "id": "0",
221
- "value": "Jumped",
222
- },
223
- Object {
224
- "id": "1",
225
- "value": "Laughed",
226
- },
227
- Object {
228
- "id": "2",
229
- "value": "Spoon",
230
- },
231
- Object {
232
- "id": "3",
233
- "value": "Fork",
234
- },
235
- Object {
236
- "id": "4",
237
- "value": "Bumped",
238
- },
239
- Object {
240
- "id": "5",
241
- "value": "Smiled",
242
- },
243
- ]
244
- }
245
- disabled={false}
246
- value={
247
- Object {
248
- "0": undefined,
249
- }
250
- }
251
- />
252
- <WithMask
253
- choices={
254
- Array [
255
- Object {
256
- "id": "0",
257
- "value": "Jumped",
258
- },
259
- Object {
260
- "id": "1",
261
- "value": "Laughed",
262
- },
263
- Object {
264
- "id": "2",
265
- "value": "Spoon",
266
- },
267
- Object {
268
- "id": "3",
269
- "value": "Fork",
270
- },
271
- Object {
272
- "id": "4",
273
- "value": "Bumped",
274
- },
275
- Object {
276
- "id": "5",
277
- "value": "Smiled",
278
- },
279
- ]
280
- }
281
- disabled={false}
282
- elementType="drag-in-the-blank"
283
- feedback={
284
- Object {
285
- "0": Object {
286
- "correct": "Jumped",
287
- "value": "Jumped",
288
- },
289
- "1": Object {
290
- "correct": "Laughed",
291
- "value": "Laughed",
292
- },
293
- "2": Object {
294
- "correct": "Spoon",
295
- "value": "Spoon",
296
- },
297
- }
298
- }
299
- markup="<div>
300
- <img src=\\"https://image.shutterstock.com/image-vector/cow-jumped-over-moon-traditional-260nw-1152899330.jpg\\"></img>
301
- <h5>Hey Diddle Diddle <i>by ?</i></h5>
302
- <p>1: Hey, diddle, diddle,</p>
303
- <p>2: The cat and the fiddle,</p>
304
- <p>3: The cow {{0}} over the moon;</p>
305
- <p>4: The little dog {{1}},</p>
306
- <p>5: To see such sport,</p>
307
- <p>6: And the dish ran away with the {{2}}.</p>
308
- </div>"
309
- value={
310
- Object {
311
- "0": undefined,
312
- }
313
- }
314
- />
315
- </div>
316
- `;
@@ -1,55 +0,0 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
2
-
3
- exports[`Mask render renders correctly a div 1`] = `
4
- <div>
5
- <div
6
- key="div-0"
7
- >
8
- <WithStyles(Component)
9
- key="p-0"
10
- >
11
- Foo
12
- </WithStyles(Component)>
13
- </div>
14
- </div>
15
- `;
16
-
17
- exports[`Mask render renders correctly a em 1`] = `
18
- <WithStyles(Component)>
19
- Foo
20
- <em
21
- key="1"
22
- >
23
- x
24
- </em>
25
- bar
26
- </WithStyles(Component)>
27
- `;
28
-
29
- exports[`Mask render renders correctly a paragraph 1`] = `
30
- <div>
31
- <WithStyles(Component)
32
- key="p-0"
33
- >
34
- Foo
35
- </WithStyles(Component)>
36
- </div>
37
- `;
38
-
39
- exports[`Mask render renders correctly with default props 1`] = `
40
- <div>
41
- Foo
42
- </div>
43
- `;
44
-
45
- exports[`Mask render renders without space under tbody 1`] = `
46
- <div>
47
- <tbody
48
- key="tbody-0"
49
- >
50
- <tr
51
- key="tr-1"
52
- />
53
- </tbody>
54
- </div>
55
- `;
@@ -1,62 +0,0 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
2
-
3
- exports[`WithMask render renders correctly with default props 1`] = `
4
- <Mask
5
- layout={
6
- Object {
7
- "data": Object {},
8
- "nodes": Array [
9
- Object {
10
- "data": Object {
11
- "attributes": Object {},
12
- "dataset": Object {},
13
- },
14
- "nodes": Array [
15
- Object {
16
- "leaves": Array [
17
- Object {
18
- "text": "Foo bar ",
19
- },
20
- ],
21
- "object": "text",
22
- },
23
- Object {
24
- "data": Object {
25
- "attributes": Object {
26
- "data-component": "foo",
27
- "data-id": "0",
28
- },
29
- "dataset": Object {
30
- "component": "foo",
31
- "id": "0",
32
- },
33
- },
34
- "nodes": Array [],
35
- "object": "inline",
36
- "type": "span",
37
- },
38
- Object {
39
- "leaves": Array [
40
- Object {
41
- "text": " over the moon;",
42
- },
43
- ],
44
- "object": "text",
45
- },
46
- ],
47
- "object": "block",
48
- "type": "p",
49
- },
50
- ],
51
- "object": "document",
52
- }
53
- }
54
- onChange={[MockFunction]}
55
- renderChildren={[Function]}
56
- value={
57
- Object {
58
- "0": "blank",
59
- }
60
- }
61
- />
62
- `;
@@ -1,209 +0,0 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
2
-
3
- exports[`index Choice render renders correctly with default props 1`] = `
4
- <BlankContentComp
5
- classes={
6
- Object {
7
- "chip": "BlankContentComp-chip-2",
8
- "chipLabel": "BlankContentComp-chipLabel-3",
9
- "choice": "BlankContentComp-choice-1",
10
- "disabled": "BlankContentComp-disabled-4",
11
- }
12
- }
13
- disabled={false}
14
- label="Label"
15
- targetId="1"
16
- value="1"
17
- />
18
- `;
19
-
20
- exports[`index Choice render renders correctly with disabled prop as true 1`] = `
21
- <BlankContentComp
22
- classes={
23
- Object {
24
- "chip": "BlankContentComp-chip-2",
25
- "chipLabel": "BlankContentComp-chipLabel-3",
26
- "choice": "BlankContentComp-choice-1",
27
- "disabled": "BlankContentComp-disabled-4",
28
- }
29
- }
30
- disabled={true}
31
- label="Label"
32
- targetId="1"
33
- value="1"
34
- />
35
- `;
36
-
37
- exports[`index Choices renders correctly with default props 1`] = `
38
- <div
39
- style={
40
- Object {
41
- "margin": "0 40px 0 0",
42
- "minWidth": "100px",
43
- }
44
- }
45
- >
46
- <DropTarget(DroppablePlaceholder)
47
- disabled={false}
48
- >
49
- <DragSource(WithStyles(BlankContentComp))
50
- choice={
51
- Object {
52
- "id": "0",
53
- "label": "Jumped",
54
- "value": "Jumped",
55
- }
56
- }
57
- disabled={false}
58
- key="Jumped-0"
59
- />
60
- <DragSource(WithStyles(BlankContentComp))
61
- choice={
62
- Object {
63
- "id": "1",
64
- "label": "Laughed",
65
- "value": "Laughed",
66
- }
67
- }
68
- disabled={false}
69
- key="Laughed-1"
70
- />
71
- <DragSource(WithStyles(BlankContentComp))
72
- choice={
73
- Object {
74
- "id": "2",
75
- "label": "Spoon",
76
- "value": "Spoon",
77
- }
78
- }
79
- disabled={false}
80
- key="Spoon-2"
81
- />
82
- </DropTarget(DroppablePlaceholder)>
83
- </div>
84
- `;
85
-
86
- exports[`index Choices renders correctly with disabled prop as true 1`] = `
87
- <div
88
- style={
89
- Object {
90
- "margin": "0 40px 0 0",
91
- "minWidth": "100px",
92
- }
93
- }
94
- >
95
- <DropTarget(DroppablePlaceholder)
96
- disabled={true}
97
- >
98
- <DragSource(WithStyles(BlankContentComp))
99
- choice={
100
- Object {
101
- "id": "0",
102
- "label": "Jumped",
103
- "value": "Jumped",
104
- }
105
- }
106
- disabled={true}
107
- key="Jumped-0"
108
- />
109
- <DragSource(WithStyles(BlankContentComp))
110
- choice={
111
- Object {
112
- "id": "1",
113
- "label": "Laughed",
114
- "value": "Laughed",
115
- }
116
- }
117
- disabled={true}
118
- key="Laughed-1"
119
- />
120
- <DragSource(WithStyles(BlankContentComp))
121
- choice={
122
- Object {
123
- "id": "2",
124
- "label": "Spoon",
125
- "value": "Spoon",
126
- }
127
- }
128
- disabled={true}
129
- key="Spoon-2"
130
- />
131
- </DropTarget(DroppablePlaceholder)>
132
- </div>
133
- `;
134
-
135
- exports[`index Choices renders with duplicates 1`] = `
136
- <div
137
- style={
138
- Object {
139
- "margin": "0 40px 0 0",
140
- "minWidth": "100px",
141
- }
142
- }
143
- >
144
- <DropTarget(DroppablePlaceholder)
145
- disabled={false}
146
- >
147
- <DragSource(WithStyles(BlankContentComp))
148
- choice={
149
- Object {
150
- "id": "0",
151
- "label": "Jumped",
152
- "value": "Jumped",
153
- }
154
- }
155
- disabled={false}
156
- key="Jumped-0"
157
- />
158
- <DragSource(WithStyles(BlankContentComp))
159
- choice={
160
- Object {
161
- "id": "1",
162
- "label": "Laughed",
163
- "value": "Laughed",
164
- }
165
- }
166
- disabled={false}
167
- key="Laughed-1"
168
- />
169
- <DragSource(WithStyles(BlankContentComp))
170
- choice={
171
- Object {
172
- "id": "2",
173
- "label": "Spoon",
174
- "value": "Spoon",
175
- }
176
- }
177
- disabled={false}
178
- key="Spoon-2"
179
- />
180
- </DropTarget(DroppablePlaceholder)>
181
- </div>
182
- `;
183
-
184
- exports[`index Choices renders without duplicates 1`] = `
185
- <div
186
- style={
187
- Object {
188
- "margin": "0 40px 0 0",
189
- "minWidth": "100px",
190
- }
191
- }
192
- >
193
- <DropTarget(DroppablePlaceholder)
194
- disabled={false}
195
- >
196
- <DragSource(WithStyles(BlankContentComp))
197
- choice={
198
- Object {
199
- "id": "2",
200
- "label": "Spoon",
201
- "value": "Spoon",
202
- }
203
- }
204
- disabled={false}
205
- key="Spoon-0"
206
- />
207
- </DropTarget(DroppablePlaceholder)>
208
- </div>
209
- `;