@pie-element/match-list 7.2.1 → 7.2.2-beta.3

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 (18) hide show
  1. package/CHANGELOG.md +28 -35
  2. package/controller/CHANGELOG.md +42 -6
  3. package/controller/package.json +1 -1
  4. package/lib/answer-area.js +7 -20
  5. package/lib/answer-area.js.map +1 -1
  6. package/lib/answer.js +27 -129
  7. package/lib/answer.js.map +1 -1
  8. package/lib/arrow.js +3 -8
  9. package/lib/arrow.js.map +1 -1
  10. package/lib/choices-list.js +4 -13
  11. package/lib/choices-list.js.map +1 -1
  12. package/lib/droppable-placeholder.js +1 -12
  13. package/lib/droppable-placeholder.js.map +1 -1
  14. package/lib/main.js +19 -223
  15. package/lib/main.js.map +1 -1
  16. package/package.json +5 -5
  17. package/lib/keyboard-coordinates.js +0 -154
  18. package/lib/keyboard-coordinates.js.map +0 -1
package/CHANGELOG.md CHANGED
@@ -3,70 +3,63 @@
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
- ## [7.2.1](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.2.0...@pie-element/match-list@7.2.1) (2026-08-26)
6
+ ## [7.2.2-beta.3](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.2.2-beta.2...@pie-element/match-list@7.2.2-beta.3) (2026-09-04)
7
7
 
8
- ### Bug Fixes
8
+ **Note:** Version bump only for package @pie-element/match-list
9
9
 
10
- - **match-list:** match dragged item to droppable by containment, not reconstructed center PIE-920 PIE-921 ([f77c20c](https://github.com/pie-framework/pie-elements/commit/f77c20cedae8628fdd9675c2bec29373d7939a3c))
10
+ ## [7.2.2-beta.2](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.4.0-beta.7...@pie-element/match-list@7.2.2-beta.2) (2026-08-26)
11
11
 
12
- # [7.2.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.1.9...@pie-element/match-list@7.2.0) (2026-08-21)
12
+ **Note:** Version bump only for package @pie-element/match-list
13
13
 
14
- ### Bug Fixes
14
+ # [7.4.0-beta.7](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.4.0-beta.6...@pie-element/match-list@7.4.0-beta.7) (2026-08-20)
15
15
 
16
- - move [@pie-lib](https://github.com/pie-lib) deps back to latest, off next prereleases PIE-927 ([a53e012](https://github.com/pie-framework/pie-elements/commit/a53e0127eb4ac95ece54e1e2bd669ae4974f4251))
17
- - **theming:** move the grey palette reads onto --pie-\* tokens PIE-856 ([d7d005b](https://github.com/pie-framework/pie-elements/commit/d7d005bf081843335b4b0377852f2ecd075cb62d)), closes [#000000](https://github.com/pie-framework/pie-elements/issues/000000) [#E0E1E6](https://github.com/pie-framework/pie-elements/issues/E0E1E6) [#646464](https://github.com/pie-framework/pie-elements/issues/646464) [#616161](https://github.com/pie-framework/pie-elements/issues/616161) [#E0E1E6](https://github.com/pie-framework/pie-elements/issues/E0E1E6) [#C0C3](https://github.com/pie-framework/pie-elements/issues/C0C3)
16
+ **Note:** Version bump only for package @pie-element/match-list
18
17
 
19
- ### Features
18
+ # [7.4.0-beta.6](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.4.0-beta.5...@pie-element/match-list@7.4.0-beta.6) (2026-08-14)
20
19
 
21
- - bump libs PIE-856, PIE-681, PIE-927 ([cb26d7a](https://github.com/pie-framework/pie-elements/commit/cb26d7afa6c99522533c321d5ff8ce3148a66e9e))
20
+ **Note:** Version bump only for package @pie-element/match-list
22
21
 
23
- ## [7.1.9](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.1.8...@pie-element/match-list@7.1.9) (2026-08-19)
22
+ # [7.4.0-beta.5](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.4.0-beta.4...@pie-element/match-list@7.4.0-beta.5) (2026-08-11)
24
23
 
25
24
  **Note:** Version bump only for package @pie-element/match-list
26
25
 
27
- ## [7.1.8](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.1.6...@pie-element/match-list@7.1.8) (2026-08-13)
28
-
29
- ### Bug Fixes
26
+ # [7.4.0-beta.4](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.4.0-beta.3...@pie-element/match-list@7.4.0-beta.4) (2026-08-11)
30
27
 
31
- - **match-list/placement-ordering:** scroll the interactive region horizontally when it does not fit PIE-766 & PIE-768 ([f0395a9](https://github.com/pie-framework/pie-elements/commit/f0395a91b16a803c5609d5ece6d3f87208dee1b2))
32
- - **match-list:** improve keyboard drag-and-drop, collision detection and drop-zone visuals PIE-643 ([265b832](https://github.com/pie-framework/pie-elements/commit/265b8329b27b0226ce49ac83f3f3b944c18fc506))
28
+ **Note:** Version bump only for package @pie-element/match-list
33
29
 
34
- ## [7.1.7](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.1.6...@pie-element/match-list@7.1.7) (2026-08-11)
30
+ # [7.4.0-beta.3](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.4.0-beta.2...@pie-element/match-list@7.4.0-beta.3) (2026-08-11)
35
31
 
36
32
  **Note:** Version bump only for package @pie-element/match-list
37
33
 
38
- ## [7.1.6](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.1.5...@pie-element/match-list@7.1.6) (2026-07-02)
34
+ # [7.4.0-beta.2](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.4.0-beta.1...@pie-element/match-list@7.4.0-beta.2) (2026-08-11)
39
35
 
40
- ### Bug Fixes
36
+ **Note:** Version bump only for package @pie-element/match-list
41
37
 
42
- - bump shared modules and libs PIE-695, PIE-697, PIE-699, PIE-680, PIE-714, PIE-665, PIE-656 ([4b76ae7](https://github.com/pie-framework/pie-elements/commit/4b76ae75d1c5ea6d55f7c6fb53f299dfcbda2b1f))
43
- - sync libs versions ([48b5be9](https://github.com/pie-framework/pie-elements/commit/48b5be9559eb5b5235ca05f51c5f0161032a7041))
38
+ # [7.4.0-beta.1](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.4.0-beta.0...@pie-element/match-list@7.4.0-beta.1) (2026-08-07)
44
39
 
45
- ## [7.1.5](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.1.4...@pie-element/match-list@7.1.5) (2026-06-22)
40
+ **Note:** Version bump only for package @pie-element/match-list
46
41
 
47
- ### Bug Fixes
42
+ # [7.4.0-beta.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.3.0-beta.0...@pie-element/match-list@7.4.0-beta.0) (2026-08-07)
48
43
 
49
- - handle webcomponent lifecycle on every element that misses it PIE-703 ([9d5923f](https://github.com/pie-framework/pie-elements/commit/9d5923f973f0471e1e8f69ad4309cfc63d980d93))
44
+ **Note:** Version bump only for package @pie-element/match-list
50
45
 
51
- ## [7.1.4](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.1.3...@pie-element/match-list@7.1.4) (2026-06-17)
46
+ # [7.3.0-beta.1](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.3.0-beta.0...@pie-element/match-list@7.3.0-beta.1) (2026-08-07)
52
47
 
53
- ### Bug Fixes
48
+ **Note:** Version bump only for package @pie-element/match-list
54
49
 
55
- - bump shared modules and libs PIE-661 PIE-664 PIE-683 PIE-666 PIE-656 PIE-657 PIE-658 PIE-659 PIE-670 ([ebd6be4](https://github.com/pie-framework/pie-elements/commit/ebd6be4fd48fca41ad4c4908f606b25334731aed))
50
+ # [7.3.0-beta.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.2.0-beta.0...@pie-element/match-list@7.3.0-beta.0) (2026-08-07)
56
51
 
57
- ## [7.1.3](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.1.2...@pie-element/match-list@7.1.3) (2026-06-12)
52
+ **Note:** Version bump only for package @pie-element/match-list
53
+
54
+ # [7.2.0-beta.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.1.0...@pie-element/match-list@7.2.0-beta.0) (2026-08-07)
58
55
 
59
56
  ### Bug Fixes
60
57
 
58
+ - bump shared modules and libs PIE-661 PIE-664 PIE-683 PIE-666 PIE-656 PIE-657 PIE-658 PIE-659 PIE-670 ([ebd6be4](https://github.com/pie-framework/pie-elements/commit/ebd6be4fd48fca41ad4c4908f606b25334731aed))
59
+ - bump shared modules and libs PIE-695, PIE-697, PIE-699, PIE-680, PIE-714, PIE-665, PIE-656 ([4b76ae7](https://github.com/pie-framework/pie-elements/commit/4b76ae75d1c5ea6d55f7c6fb53f299dfcbda2b1f))
61
60
  - bump shared modules and libsPIE-603, PIE-604, PIE-663, PIE-662, PIE-678 ([e61c7a7](https://github.com/pie-framework/pie-elements/commit/e61c7a7d23744586337dfbb17a18ebfc656c202f))
62
-
63
- ## [7.1.2](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.1.1...@pie-element/match-list@7.1.2) (2026-06-04)
64
-
65
- **Note:** Version bump only for package @pie-element/match-list
66
-
67
- ## [7.1.1](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.1.0...@pie-element/match-list@7.1.1) (2026-05-21)
68
-
69
- **Note:** Version bump only for package @pie-element/match-list
61
+ - handle webcomponent lifecycle on every element that misses it PIE-703 ([9d5923f](https://github.com/pie-framework/pie-elements/commit/9d5923f973f0471e1e8f69ad4309cfc63d980d93))
62
+ - sync libs versions ([48b5be9](https://github.com/pie-framework/pie-elements/commit/48b5be9559eb5b5235ca05f51c5f0161032a7041))
70
63
 
71
64
  # [7.1.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list@7.1.0-next.1...@pie-element/match-list@7.1.0) (2026-05-21)
72
65
 
package/controller/CHANGELOG.md CHANGED
@@ -3,24 +3,60 @@
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
- ## [6.1.4](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.1.2...@pie-element/match-list-controller@6.1.4) (2026-08-13)
6
+ # [6.4.0-beta.9](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.4.0-beta.8...@pie-element/match-list-controller@6.4.0-beta.9) (2026-09-04)
7
7
 
8
8
  **Note:** Version bump only for package @pie-element/match-list-controller
9
9
 
10
- ## [6.1.3](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.1.2...@pie-element/match-list-controller@6.1.3) (2026-08-11)
10
+ # [6.4.0-beta.8](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.4.0-beta.7...@pie-element/match-list-controller@6.4.0-beta.8) (2026-08-26)
11
11
 
12
12
  **Note:** Version bump only for package @pie-element/match-list-controller
13
13
 
14
- ## [6.1.2](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.1.1...@pie-element/match-list-controller@6.1.2) (2026-07-02)
14
+ # [6.4.0-beta.7](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.4.0-beta.6...@pie-element/match-list-controller@6.4.0-beta.7) (2026-08-20)
15
15
 
16
- ### Bug Fixes
16
+ **Note:** Version bump only for package @pie-element/match-list-controller
17
17
 
18
- - bump shared modules and libs PIE-695, PIE-697, PIE-699, PIE-680, PIE-714, PIE-665, PIE-656 ([4b76ae7](https://github.com/pie-framework/pie-elements/commit/4b76ae75d1c5ea6d55f7c6fb53f299dfcbda2b1f))
18
+ # [6.4.0-beta.6](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.4.0-beta.5...@pie-element/match-list-controller@6.4.0-beta.6) (2026-08-14)
19
+
20
+ **Note:** Version bump only for package @pie-element/match-list-controller
21
+
22
+ # [6.4.0-beta.5](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.4.0-beta.4...@pie-element/match-list-controller@6.4.0-beta.5) (2026-08-11)
23
+
24
+ **Note:** Version bump only for package @pie-element/match-list-controller
19
25
 
20
- ## [6.1.1](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.1.0...@pie-element/match-list-controller@6.1.1) (2026-05-21)
26
+ # [6.4.0-beta.4](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.4.0-beta.3...@pie-element/match-list-controller@6.4.0-beta.4) (2026-08-11)
21
27
 
22
28
  **Note:** Version bump only for package @pie-element/match-list-controller
23
29
 
30
+ # [6.4.0-beta.3](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.4.0-beta.2...@pie-element/match-list-controller@6.4.0-beta.3) (2026-08-11)
31
+
32
+ **Note:** Version bump only for package @pie-element/match-list-controller
33
+
34
+ # [6.4.0-beta.2](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.4.0-beta.1...@pie-element/match-list-controller@6.4.0-beta.2) (2026-08-11)
35
+
36
+ **Note:** Version bump only for package @pie-element/match-list-controller
37
+
38
+ # [6.4.0-beta.1](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.4.0-beta.0...@pie-element/match-list-controller@6.4.0-beta.1) (2026-08-07)
39
+
40
+ **Note:** Version bump only for package @pie-element/match-list-controller
41
+
42
+ # [6.4.0-beta.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.3.0-beta.0...@pie-element/match-list-controller@6.4.0-beta.0) (2026-08-07)
43
+
44
+ **Note:** Version bump only for package @pie-element/match-list-controller
45
+
46
+ # [6.3.0-beta.1](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.3.0-beta.0...@pie-element/match-list-controller@6.3.0-beta.1) (2026-08-07)
47
+
48
+ **Note:** Version bump only for package @pie-element/match-list-controller
49
+
50
+ # [6.3.0-beta.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.2.0-beta.0...@pie-element/match-list-controller@6.3.0-beta.0) (2026-08-07)
51
+
52
+ **Note:** Version bump only for package @pie-element/match-list-controller
53
+
54
+ # [6.2.0-beta.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.1.0...@pie-element/match-list-controller@6.2.0-beta.0) (2026-08-07)
55
+
56
+ ### Bug Fixes
57
+
58
+ - bump shared modules and libs PIE-695, PIE-697, PIE-699, PIE-680, PIE-714, PIE-665, PIE-656 ([4b76ae7](https://github.com/pie-framework/pie-elements/commit/4b76ae75d1c5ea6d55f7c6fb53f299dfcbda2b1f))
59
+
24
60
  # [6.1.0](https://github.com/pie-framework/pie-elements/compare/@pie-element/match-list-controller@6.1.0-next.1...@pie-element/match-list-controller@6.1.0) (2026-05-21)
25
61
 
26
62
  ### Bug Fixes
package/controller/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@pie-element/match-list-controller",
3
3
  "private": true,
4
- "version": "6.1.4",
4
+ "version": "6.4.0-beta.9",
5
5
  "description": "",
6
6
  "main": "lib/index.js",
7
7
  "module": "src/index.js",
package/lib/answer-area.js CHANGED
@@ -12,14 +12,9 @@ var _styles = require("@mui/material/styles");
12
12
  var _lodashEs = require("lodash-es");
13
13
  var _arrow = _interopRequireDefault(require("./arrow"));
14
14
  var _answer = _interopRequireDefault(require("./answer"));
15
- var _renderUi = require("@pie-lib/render-ui");
16
- // matches the min width of the answer entries (see AnswerContainer in ./answer), so the two columns
17
- // give the row an intrinsic min width that the horizontal scroll container can overflow.
18
- const MIN_COLUMN_WIDTH = 200;
19
15
  const ArrowEntry = (0, _styles.styled)('div')({
20
16
  alignItems: 'normal',
21
17
  display: 'flex',
22
- flexShrink: 0,
23
18
  height: 40,
24
19
  margin: '10px 20px'
25
20
  });
@@ -34,13 +29,14 @@ const ItemList = (0, _styles.styled)('div')(({
34
29
  marginTop: theme.spacing(2),
35
30
  marginBottom: theme.spacing(2)
36
31
  }));
37
- const PromptEntry = (0, _styles.styled)('div')(() => ({
38
- border: `1px solid ${_renderUi.color.border()}`,
32
+ const PromptEntry = (0, _styles.styled)('div')(({
33
+ theme
34
+ }) => ({
35
+ border: `1px solid ${theme.palette.grey[400]}`,
39
36
  boxSizing: 'border-box',
40
37
  flex: 1,
41
38
  margin: '10px 0',
42
39
  minHeight: 40,
43
- minWidth: MIN_COLUMN_WIDTH,
44
40
  overflow: 'hidden',
45
41
  padding: 10,
46
42
  textAlign: 'center',
@@ -123,10 +119,7 @@ class AnswerArea extends _react.default.Component {
123
119
  const {
124
120
  disabled,
125
121
  instanceId,
126
- onRemoveAnswer,
127
- selectedAnswer,
128
- onChoiceClick,
129
- onPlacementClick
122
+ onRemoveAnswer
130
123
  } = this.props;
131
124
  const rows = this.buildRows();
132
125
  const correctnessMap = this.getCorrectOrIncorrectMap();
@@ -155,10 +148,7 @@ class AnswerArea extends _react.default.Component {
155
148
  id: sessionAnswer.id,
156
149
  title: sessionAnswer.title,
157
150
  type: 'target',
158
- onRemoveChoice: () => onRemoveAnswer(id),
159
- selectedAnswer: selectedAnswer,
160
- onSelectClick: onChoiceClick,
161
- onPlacementClick: onPlacementClick
151
+ onRemoveChoice: () => onRemoveAnswer(id)
162
152
  }));
163
153
  }));
164
154
  }
@@ -172,10 +162,7 @@ exports.AnswerArea = AnswerArea;
172
162
  onRemoveAnswer: _propTypes.default.func,
173
163
  instanceId: _propTypes.default.string.isRequired,
174
164
  model: _propTypes.default.object.isRequired,
175
- prompt: _propTypes.default.string,
176
- selectedAnswer: _propTypes.default.object,
177
- onChoiceClick: _propTypes.default.func,
178
- onPlacementClick: _propTypes.default.func
165
+ prompt: _propTypes.default.string
179
166
  });
180
167
  var _default = exports.default = AnswerArea;
181
168
  //# sourceMappingURL=answer-area.js.map
package/lib/answer-area.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"answer-area.js","names":["_react","_interopRequireDefault","require","_propTypes","_styles","_lodashEs","_arrow","_answer","_renderUi","MIN_COLUMN_WIDTH","ArrowEntry","styled","alignItems","display","flexShrink","height","margin","ItemList","theme","flex","flexDirection","justifyContent","marginTop","spacing","marginBottom","PromptEntry","border","color","boxSizing","minHeight","minWidth","overflow","padding","textAlign","width","wordBreak","Row","AnswerArea","React","Component","constructor","args","_defineProperty2","default","promptId","model","session","showCorrect","props","config","answerId","prompts","find","p","id","relatedAnswer","value","answer","answers","sessionValue","reduce","obj","prompt","undefined","mode","correctPromptMap","isUndefined","val","key","map","sessionAnswer","getAnswerFromSession","render","disabled","instanceId","onRemoveAnswer","selectedAnswer","onChoiceClick","onPlacementClick","rows","buildRows","correctnessMap","getCorrectOrIncorrectMap","createElement","title","index","dangerouslySetInnerHTML","__html","direction","className","correct","draggable","isEmpty","type","onRemoveChoice","onSelectClick","exports","PropTypes","object","isRequired","bool","onSessionChange","func","string","_default"],"sources":["../src/answer-area.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@mui/material/styles';\nimport { isEmpty, isUndefined, reduce } from 'lodash-es';\n\nimport Arrow from './arrow';\nimport DragAndDropAnswer from './answer';\nimport { color } from '@pie-lib/render-ui';\n\n// matches the min width of the answer entries (see AnswerContainer in ./answer), so the two columns\n// give the row an intrinsic min width that the horizontal scroll container can overflow.\nconst MIN_COLUMN_WIDTH = 200;\n\nconst ArrowEntry = styled('div')({\n alignItems: 'normal',\n display: 'flex',\n flexShrink: 0,\n height: 40,\n margin: '10px 20px',\n});\n\nconst ItemList = styled('div')(({ theme }) => ({\n alignItems: 'flex-start',\n display: 'flex',\n flex: 1,\n flexDirection: 'column',\n justifyContent: 'space-between',\n marginTop: theme.spacing(2),\n marginBottom: theme.spacing(2),\n}));\n\nconst PromptEntry = styled('div')(() => ({\n border: `1px solid ${color.border()}`,\n boxSizing: 'border-box',\n flex: 1,\n margin: '10px 0',\n minHeight: 40,\n minWidth: MIN_COLUMN_WIDTH,\n overflow: 'hidden',\n padding: 10,\n textAlign: 'center',\n width: '100%',\n wordBreak: 'break-word',\n}));\n\nconst Row = styled('div')({\n alignItems: 'center',\n display: 'flex',\n justifyContent: 'space-between',\n width: '100%',\n});\n\nexport class AnswerArea extends React.Component {\n static propTypes = {\n session: PropTypes.object.isRequired,\n showCorrect: PropTypes.bool.isRequired,\n disabled: PropTypes.bool.isRequired,\n onSessionChange: PropTypes.func,\n onRemoveAnswer: PropTypes.func,\n instanceId: PropTypes.string.isRequired,\n model: PropTypes.object.isRequired,\n prompt: PropTypes.string,\n selectedAnswer: PropTypes.object,\n onChoiceClick: PropTypes.func,\n onPlacementClick: PropTypes.func,\n };\n\n getAnswerFromSession = (promptId) => {\n const { model, session, showCorrect } = this.props;\n const { config } = model;\n const answerId = showCorrect\n ? config.prompts.find((p) => p.id === promptId).relatedAnswer\n : session.value && session.value[promptId];\n const answer = config.answers.find((answer) => answer.id === answerId);\n\n return answer || {};\n };\n\n getCorrectOrIncorrectMap = () => {\n const { model, session, showCorrect } = this.props;\n const { config } = model;\n const sessionValue =\n session.value ||\n config.prompts.reduce((obj, prompt) => {\n obj[prompt.id] = undefined;\n return obj;\n }, {});\n\n if (model.mode !== 'evaluate') {\n return {};\n }\n\n if (showCorrect) {\n return config.prompts.reduce((obj, prompt) => {\n obj[prompt.id] = true;\n\n return obj;\n }, {});\n }\n\n const correctPromptMap = config.prompts.reduce((obj, prompt) => {\n if (!isUndefined(prompt.relatedAnswer)) {\n obj[prompt.id] = prompt.relatedAnswer;\n }\n\n return obj;\n }, {});\n\n return reduce(\n sessionValue,\n (obj, val, key) => {\n obj[key] = correctPromptMap[key] === sessionValue[key];\n\n return obj;\n },\n {},\n );\n };\n\n buildRows = () => {\n const { model } = this.props;\n const { config } = model;\n const prompts = config.prompts || [];\n\n return prompts.map((prompt) => {\n const sessionAnswer = this.getAnswerFromSession(prompt.id);\n\n return {\n ...prompt,\n sessionAnswer,\n };\n });\n };\n\n render() {\n const { disabled, instanceId, onRemoveAnswer, selectedAnswer, onChoiceClick, onPlacementClick } = this.props;\n const rows = this.buildRows();\n const correctnessMap = this.getCorrectOrIncorrectMap();\n\n return (\n <ItemList>\n {rows.map(({ sessionAnswer, title, id }, index) => {\n return (\n <Row key={index}>\n <PromptEntry dangerouslySetInnerHTML={{ __html: title }} />\n\n <ArrowEntry>\n <Arrow direction=\"left\" />\n <Arrow />\n </ArrowEntry>\n\n <DragAndDropAnswer\n key={index}\n className=\"answer\"\n index={index}\n promptId={id}\n correct={correctnessMap[id]}\n draggable={!isEmpty(sessionAnswer)}\n disabled={disabled}\n instanceId={instanceId}\n id={sessionAnswer.id}\n title={sessionAnswer.title}\n type={'target'}\n onRemoveChoice={() => onRemoveAnswer(id)}\n selectedAnswer={selectedAnswer}\n onSelectClick={onChoiceClick}\n onPlacementClick={onPlacementClick}\n />\n </Row>\n );\n })}\n </ItemList>\n );\n }\n}\n\nexport default AnswerArea;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"answer-area.js","names":["_react","_interopRequireDefault","require","_propTypes","_styles","_lodashEs","_arrow","_answer","ArrowEntry","styled","alignItems","display","height","margin","ItemList","theme","flex","flexDirection","justifyContent","marginTop","spacing","marginBottom","PromptEntry","border","palette","grey","boxSizing","minHeight","overflow","padding","textAlign","width","wordBreak","Row","AnswerArea","React","Component","constructor","args","_defineProperty2","default","promptId","model","session","showCorrect","props","config","answerId","prompts","find","p","id","relatedAnswer","value","answer","answers","sessionValue","reduce","obj","prompt","undefined","mode","correctPromptMap","isUndefined","val","key","map","sessionAnswer","getAnswerFromSession","render","disabled","instanceId","onRemoveAnswer","rows","buildRows","correctnessMap","getCorrectOrIncorrectMap","createElement","title","index","dangerouslySetInnerHTML","__html","direction","className","correct","draggable","isEmpty","type","onRemoveChoice","exports","PropTypes","object","isRequired","bool","onSessionChange","func","string","_default"],"sources":["../src/answer-area.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@mui/material/styles';\nimport { isEmpty, isUndefined, reduce } from 'lodash-es';\n\nimport Arrow from './arrow';\nimport DragAndDropAnswer from './answer';\n\nconst ArrowEntry = styled('div')({\n alignItems: 'normal',\n display: 'flex',\n height: 40,\n margin: '10px 20px',\n});\n\nconst ItemList = styled('div')(({ theme }) => ({\n alignItems: 'flex-start',\n display: 'flex',\n flex: 1,\n flexDirection: 'column',\n justifyContent: 'space-between',\n marginTop: theme.spacing(2),\n marginBottom: theme.spacing(2),\n}));\n\nconst PromptEntry = styled('div')(({ theme }) => ({\n border: `1px solid ${theme.palette.grey[400]}`,\n boxSizing: 'border-box',\n flex: 1,\n margin: '10px 0',\n minHeight: 40,\n overflow: 'hidden',\n padding: 10,\n textAlign: 'center',\n width: '100%',\n wordBreak: 'break-word',\n}));\n\nconst Row = styled('div')({\n alignItems: 'center',\n display: 'flex',\n justifyContent: 'space-between',\n width: '100%',\n});\n\nexport class AnswerArea extends React.Component {\n static propTypes = {\n session: PropTypes.object.isRequired,\n showCorrect: PropTypes.bool.isRequired,\n disabled: PropTypes.bool.isRequired,\n onSessionChange: PropTypes.func,\n onRemoveAnswer: PropTypes.func,\n instanceId: PropTypes.string.isRequired,\n model: PropTypes.object.isRequired,\n prompt: PropTypes.string,\n };\n\n getAnswerFromSession = (promptId) => {\n const { model, session, showCorrect } = this.props;\n const { config } = model;\n const answerId = showCorrect\n ? config.prompts.find((p) => p.id === promptId).relatedAnswer\n : session.value && session.value[promptId];\n const answer = config.answers.find((answer) => answer.id === answerId);\n\n return answer || {};\n };\n\n getCorrectOrIncorrectMap = () => {\n const { model, session, showCorrect } = this.props;\n const { config } = model;\n const sessionValue =\n session.value ||\n config.prompts.reduce((obj, prompt) => {\n obj[prompt.id] = undefined;\n return obj;\n }, {});\n\n if (model.mode !== 'evaluate') {\n return {};\n }\n\n if (showCorrect) {\n return config.prompts.reduce((obj, prompt) => {\n obj[prompt.id] = true;\n\n return obj;\n }, {});\n }\n\n const correctPromptMap = config.prompts.reduce((obj, prompt) => {\n if (!isUndefined(prompt.relatedAnswer)) {\n obj[prompt.id] = prompt.relatedAnswer;\n }\n\n return obj;\n }, {});\n\n return reduce(\n sessionValue,\n (obj, val, key) => {\n obj[key] = correctPromptMap[key] === sessionValue[key];\n\n return obj;\n },\n {},\n );\n };\n\n buildRows = () => {\n const { model } = this.props;\n const { config } = model;\n const prompts = config.prompts || [];\n\n return prompts.map((prompt) => {\n const sessionAnswer = this.getAnswerFromSession(prompt.id);\n\n return {\n ...prompt,\n sessionAnswer,\n };\n });\n };\n\n render() {\n const { disabled, instanceId, onRemoveAnswer } = this.props;\n const rows = this.buildRows();\n const correctnessMap = this.getCorrectOrIncorrectMap();\n\n return (\n <ItemList>\n {rows.map(({ sessionAnswer, title, id }, index) => {\n return (\n <Row key={index}>\n <PromptEntry dangerouslySetInnerHTML={{ __html: title }} />\n\n <ArrowEntry>\n <Arrow direction=\"left\" />\n <Arrow />\n </ArrowEntry>\n\n <DragAndDropAnswer\n key={index}\n className=\"answer\"\n index={index}\n promptId={id}\n correct={correctnessMap[id]}\n draggable={!isEmpty(sessionAnswer)}\n disabled={disabled}\n instanceId={instanceId}\n id={sessionAnswer.id}\n title={sessionAnswer.title}\n type={'target'}\n onRemoveChoice={() => onRemoveAnswer(id)}\n />\n </Row>\n );\n })}\n </ItemList>\n );\n }\n}\n\nexport default AnswerArea;\n"],"mappings":"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","ignoreList":[]}
package/lib/answer.js CHANGED
@@ -9,13 +9,12 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
9
9
  var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
10
10
  var _core = require("@dnd-kit/core");
11
11
  var _propTypes = _interopRequireDefault(require("prop-types"));
12
- var _react = _interopRequireWildcard(require("react"));
12
+ var _react = _interopRequireDefault(require("react"));
13
13
  var _debug = _interopRequireDefault(require("debug"));
14
14
  var _styles = require("@mui/material/styles");
15
15
  var _drag = require("@pie-lib/drag");
16
16
  var _lodashEs = require("lodash-es");
17
17
  var _renderUi = require("@pie-lib/render-ui");
18
- function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
19
18
  const log = (0, _debug.default)('pie-elements:match-title:answer');
20
19
  const HolderNumber = (0, _styles.styled)('div')(({
21
20
  theme
@@ -49,15 +48,15 @@ Holder.propTypes = {
49
48
  type: _propTypes.default.string
50
49
  };
51
50
  const AnswerContentContainer = (0, _styles.styled)('div')(({
51
+ theme,
52
52
  isDragging,
53
- isSelected,
54
53
  isOver,
55
54
  disabled,
56
55
  outcome
57
56
  }) => ({
58
57
  color: _renderUi.color.text(),
59
58
  backgroundColor: _renderUi.color.white(),
60
- border: `1px solid ${outcome === 'correct' ? _renderUi.color.correct() : outcome === 'incorrect' ? _renderUi.color.incorrect() : _renderUi.color.border()}`,
59
+ border: `1px solid ${outcome === 'correct' ? _renderUi.color.correct() : outcome === 'incorrect' ? _renderUi.color.incorrect() : theme.palette.grey[400]}`,
61
60
  cursor: disabled ? 'not-allowed' : 'pointer',
62
61
  width: '100%',
63
62
  padding: '10px',
@@ -65,13 +64,12 @@ const AnswerContentContainer = (0, _styles.styled)('div')(({
65
64
  overflow: 'hidden',
66
65
  transition: 'opacity 200ms linear',
67
66
  wordBreak: 'break-word',
68
- opacity: (isDragging || isSelected) && !disabled ? 0.5 : isOver && !disabled ? 0.2 : 1,
67
+ opacity: isDragging && !disabled ? 0.5 : isOver && !disabled ? 0.2 : 1,
69
68
  touchAction: 'none'
70
69
  }));
71
70
  const AnswerContent = props => {
72
71
  const {
73
72
  isDragging,
74
- isSelected,
75
73
  isOver,
76
74
  title,
77
75
  disabled,
@@ -90,7 +88,6 @@ const AnswerContent = props => {
90
88
  } else {
91
89
  return /*#__PURE__*/_react.default.createElement(AnswerContentContainer, {
92
90
  isDragging: isDragging,
93
- isSelected: isSelected,
94
91
  isOver: isOver,
95
92
  disabled: disabled,
96
93
  outcome: outcome,
@@ -142,7 +139,6 @@ class Answer extends _react.default.Component {
142
139
  id,
143
140
  title,
144
141
  isDragging = false,
145
- isSelected = false,
146
142
  className,
147
143
  disabled,
148
144
  isOver = false,
@@ -160,7 +156,6 @@ class Answer extends _react.default.Component {
160
156
  isOver: isOver,
161
157
  empty: (0, _lodashEs.isEmpty)(title),
162
158
  isDragging: isDragging,
163
- isSelected: isSelected,
164
159
  disabled: disabled,
165
160
  type: type
166
161
  }));
@@ -170,7 +165,6 @@ exports.Answer = Answer;
170
165
  (0, _defineProperty2.default)(Answer, "propTypes", {
171
166
  className: _propTypes.default.string,
172
167
  isDragging: _propTypes.default.bool,
173
- isSelected: _propTypes.default.bool,
174
168
  id: _propTypes.default.any,
175
169
  title: _propTypes.default.string,
176
170
  isOver: _propTypes.default.bool,
@@ -186,29 +180,11 @@ function DragAndDropAnswer(props) {
186
180
  promptId,
187
181
  draggable = true,
188
182
  disabled = false,
189
- type,
190
- selectedAnswer,
191
- onSelectClick,
192
- onPlacementClick
183
+ type
193
184
  } = props;
194
185
  const dragId = `${type || 'answer'}-${id}`;
195
186
  // droppable only if promptId exists
196
187
  const dropId = promptId !== undefined && promptId !== null ? `drop-${promptId}` : undefined;
197
-
198
- // Built once and reused for both dnd-kit's own data and the click handlers below, so
199
- // a click carries exactly the same shape dnd-kit's onDragStart/onDragEnd would.
200
- const activeData = {
201
- type: type || 'answer',
202
- id,
203
- instanceId,
204
- value: props.title,
205
- promptId
206
- };
207
- const dropZoneData = dropId ? {
208
- type: 'drop-zone',
209
- promptId,
210
- instanceId
211
- } : undefined;
212
188
  const {
213
189
  attributes,
214
190
  listeners,
@@ -218,138 +194,63 @@ function DragAndDropAnswer(props) {
218
194
  isDragging
219
195
  } = (0, _core.useDraggable)({
220
196
  id: dragId,
221
- data: activeData,
222
- disabled: !draggable || disabled,
223
- // dnd-kit's own `attributes` default tabIndex to 0 unconditionally, even when
224
- // `disabled` — so a non-draggable (empty) tile stays a native Tab stop of its own.
225
- // For a drop-zone (dropId set), that duplicates the outer wrapper's own tab stop
226
- // (see isNativeTabStop below) at the exact same position, so Tab/Shift+Tab has to
227
- // pass through both to move anywhere visibly, making every other press look like a
228
- // no-op. Drop it out of the tab order here whenever it isn't independently
229
- // reachable/interactive, leaving the outer wrapper (for an empty drop-zone) or
230
- // nothing (for a disabled choice) as the sole stop.
231
- attributes: {
232
- tabIndex: draggable && !disabled ? 0 : -1
233
- }
197
+ data: {
198
+ type: type || 'answer',
199
+ id,
200
+ instanceId,
201
+ value: props.title,
202
+ promptId
203
+ },
204
+ disabled: !draggable || disabled
234
205
  });
235
206
  const droppable = (0, _core.useDroppable)({
236
207
  id: dropId,
237
- data: dropZoneData,
208
+ data: dropId ? {
209
+ type: 'drop-zone',
210
+ promptId,
211
+ instanceId
212
+ } : undefined,
238
213
  disabled: disabled || !dropId
239
214
  });
240
215
  const setDropRef = droppable.setNodeRef;
241
216
  const isOver = droppable.isOver;
242
217
 
243
- // dnd-kit's own isOver only reflects real collision detection during an active drag,
244
- // so it stays false while an answer is merely click-selected (no drag in progress).
245
- // Track hovering locally and fold it into the same isOver signal used everywhere
246
- // below, so hovering a response area while something is selected gets the exact same
247
- // treatment as hovering it during a real drag — one code path, no duplicated CSS.
248
- const [isHovered, setIsHovered] = (0, _react.useState)(false);
249
- const hasSelection = !!selectedAnswer;
250
- const showsHoverEffect = isOver || hasSelection && isHovered && !disabled;
251
- const isSelected = !!selectedAnswer && selectedAnswer.type === activeData.type && selectedAnswer.id === activeData.id && selectedAnswer.promptId === activeData.promptId;
252
-
253
218
  // compute style: apply transform to the element that actually moves
254
219
  const transformStyle = transform ? `translate3d(${transform.x}px, ${transform.y}px, 0)` : undefined;
255
220
 
256
221
  // If this item is a drop-zone (prompt slot), we render an outer droppable wrapper.
257
- // The outer wrapper's rect is what dnd-kit measures for this slot's own droppable
258
- // ("drop-{promptId}"), so it must stay untransformed — applying the drag transform
259
- // there would make the slot's own droppable rect chase the dragged item during the
260
- // drag, corrupting collision/keyboard-navigation results. The transform belongs on
261
- // the inner draggable node instead.
222
+ // For droppable wrapper we apply style to the outer wrapper
262
223
  if (dropId) {
263
- const handleResponseAreaClick = () => {
264
- if (disabled) return;
265
- if (isSelected) {
266
- // Clicking the already-selected placed answer again deselects it, same as
267
- // for a choice in the pool.
268
- onSelectClick?.(activeData);
269
- } else if (selectedAnswer) {
270
- // Something else is selected — place it here, same whether this area is
271
- // currently empty or already occupied.
272
- onPlacementClick?.(dropZoneData);
273
- } else if (draggable) {
274
- // Nothing selected yet, and this response area holds an answer — clicking it
275
- // selects that answer for moving elsewhere, the same way Tab+Space/Enter does.
276
- onSelectClick?.(activeData);
277
- }
278
-
279
- // Empty response area clicked with nothing selected: nothing to place or select.
280
- };
281
-
282
- // An empty response area isn't draggable, so dnd-kit's own attributes (only
283
- // applied to the inner node, and only when draggable) never make it tabbable —
284
- // this outer wrapper needs its own focus/activation handling so "select a choice,
285
- // then Tab to a response area and press Space/Enter" works even when the area is
286
- // empty. This is independent of, and doesn't change, the existing in-drag
287
- // Tab-cycling (that's driven by an active dnd-kit drag, not native focus).
288
- //
289
- // Only made a native Tab stop when NOT draggable (i.e. empty): when the target is
290
- // filled, the inner node is already independently tabbable via dnd-kit's own
291
- // attributes for the existing pick-up-to-move gesture, and adding a second,
292
- // outer Tab stop for the same visual tile would add an extra stop to the existing
293
- // Tab order. Placing into an occupied area is still fully reachable by mouse click
294
- // here, or by the existing keyboard drag flow (Tab+Space/Enter on the choice,
295
- // Tab-cycle to the occupied target, Space/Enter to swap).
296
- const isNativeTabStop = !draggable && !disabled;
297
- const handleResponseAreaKeyDown = e => {
298
- if (e.code === 'Space' || e.code === 'Enter') {
299
- e.preventDefault();
300
- handleResponseAreaClick();
301
- }
302
- };
303
224
  return /*#__PURE__*/_react.default.createElement("div", {
304
225
  ref: setDropRef,
305
- role: "button",
306
- tabIndex: isNativeTabStop ? 0 : -1,
307
- onClick: handleResponseAreaClick,
308
- onKeyDown: isNativeTabStop ? handleResponseAreaKeyDown : undefined,
309
- onMouseEnter: () => setIsHovered(true),
310
- onMouseLeave: () => setIsHovered(false),
311
226
  style: {
312
227
  flex: 1,
313
- opacity: isDragging || isSelected ? 0.5 : 1,
314
- backgroundColor: isDragging || isSelected || showsHoverEffect ? 'rgba(0,0,0,0.05)' : 'transparent',
315
- cursor: hasSelection && !disabled ? 'pointer' : undefined
228
+ transform: transformStyle,
229
+ transition,
230
+ opacity: isDragging ? 0.5 : 1,
231
+ backgroundColor: isOver ? 'rgba(0,0,0,0.05)' : 'transparent'
316
232
  }
317
233
  }, /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
318
234
  ref: setDragRef
319
- }, listeners, attributes, {
320
- style: {
321
- transform: transformStyle,
322
- transition
323
- }
324
- }), /*#__PURE__*/_react.default.createElement(Answer, (0, _extends2.default)({}, props, {
235
+ }, listeners, attributes), /*#__PURE__*/_react.default.createElement(Answer, (0, _extends2.default)({}, props, {
325
236
  isDragging: isDragging,
326
- isSelected: isSelected,
327
- isOver: showsHoverEffect
237
+ isOver: isOver
328
238
  }))));
329
239
  }
330
- const handleChoiceClick = e => {
331
- if (disabled) {
332
- return;
333
- }
334
- e.stopPropagation();
335
- onSelectClick?.(activeData);
336
- };
337
240
 
338
241
  // if there is NO dropId (this is a choice / draggable-only), render only draggable node and apply transform to it.
339
242
  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
340
243
  ref: setDragRef
341
244
  }, listeners, attributes, {
342
- onClick: handleChoiceClick,
343
245
  style: {
344
246
  transform: transformStyle,
345
247
  transition,
346
248
  cursor: disabled ? 'not-allowed' : 'grab',
347
- opacity: isDragging || isSelected ? 0.5 : 1,
249
+ opacity: isDragging ? 0.5 : 1,
348
250
  touchAction: draggable && !disabled ? 'none' : 'auto'
349
251
  }
350
252
  }), /*#__PURE__*/_react.default.createElement(Answer, (0, _extends2.default)({}, props, {
351
253
  isDragging: isDragging,
352
- isSelected: isSelected,
353
254
  isOver: false
354
255
  })));
355
256
  }
@@ -360,10 +261,7 @@ DragAndDropAnswer.propTypes = {
360
261
  title: _propTypes.default.string,
361
262
  draggable: _propTypes.default.bool,
362
263
  disabled: _propTypes.default.bool,
363
- type: _propTypes.default.string,
364
- selectedAnswer: _propTypes.default.object,
365
- onSelectClick: _propTypes.default.func,
366
- onPlacementClick: _propTypes.default.func
264
+ type: _propTypes.default.string
367
265
  };
368
266
  var _default = exports.default = DragAndDropAnswer;
369
267
  //# sourceMappingURL=answer.js.map