@pie-lib/drag 2.30.0-mui-update.0 → 2.31.0-mui-update.0
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 +11 -59
- package/lib/drag-provider.js +7 -2
- package/lib/drag-provider.js.map +1 -1
- package/lib/draggable-choice.js +11 -12
- package/lib/draggable-choice.js.map +1 -1
- package/package.json +4 -4
- package/src/drag-provider.jsx +5 -1
- package/src/draggable-choice.jsx +20 -21
package/CHANGELOG.md
CHANGED
|
@@ -3,59 +3,24 @@
|
|
|
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.
|
|
6
|
+
# [2.31.0-mui-update.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/drag@2.30.0-mui-update.0...@pie-lib/drag@2.31.0-mui-update.0) (2025-12-02)
|
|
7
7
|
|
|
8
8
|
|
|
9
9
|
### Bug Fixes
|
|
10
10
|
|
|
11
|
-
*
|
|
11
|
+
* drag components ([bea5eaa](https://github.com/pie-framework/pie-lib/commit/bea5eaaa54fc9060ac83bb7d6383b4c9e2491574))
|
|
12
12
|
|
|
13
13
|
|
|
14
|
+
### Features
|
|
14
15
|
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
## [2.29.1-mui-update.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/drag@2.29.0-mui-update.0...@pie-lib/drag@2.29.1-mui-update.0) (2025-11-20)
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
### Bug Fixes
|
|
21
|
-
|
|
22
|
-
* remove carets from [@pie-lib](https://github.com/pie-lib) dependencies and configure lerna to use exact versions ([c9cd800](https://github.com/pie-framework/pie-lib/commit/c9cd800844abca09e7acf1fd35b2ddf51a6d86df))
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
# [2.29.0-mui-update.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/drag@2.28.0-mui-update.0...@pie-lib/drag@2.29.0-mui-update.0) (2025-11-20)
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
### Bug Fixes
|
|
32
|
-
|
|
33
|
-
* remove carret, point to specific libs version ([09939a5](https://github.com/pie-framework/pie-lib/commit/09939a5aca19d7dda03d62c93d4d524f98dd69da))
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
# [2.28.0-mui-update.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/drag@2.27.0-mui-update.0...@pie-lib/drag@2.28.0-mui-update.0) (2025-11-20)
|
|
40
|
-
|
|
41
|
-
**Note:** Version bump only for package @pie-lib/drag
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
# [2.27.0-mui-update.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/drag@2.26.0-mui-update.0...@pie-lib/drag@2.27.0-mui-update.0) (2025-11-19)
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
### Bug Fixes
|
|
51
|
-
|
|
52
|
-
* use fixed lib deps ([de7c64d](https://github.com/pie-framework/pie-lib/commit/de7c64d14f13259fe44d47405e4421baef21e24e))
|
|
16
|
+
* add drag provider onDragStart prop ([0879247](https://github.com/pie-framework/pie-lib/commit/087924747b02ceed710e971e8dbe0291071396af))
|
|
17
|
+
* sync latest changes from dev ([c936e9c](https://github.com/pie-framework/pie-lib/commit/c936e9c7f9e095e7d9b9805ac2bf72bd271e05f1))
|
|
53
18
|
|
|
54
19
|
|
|
55
20
|
|
|
56
21
|
|
|
57
22
|
|
|
58
|
-
|
|
23
|
+
## [2.22.2](https://github.com/pie-framework/pie-lib/compare/@pie-lib/drag@2.22.1...@pie-lib/drag@2.22.2) (2025-11-27)
|
|
59
24
|
|
|
60
25
|
**Note:** Version bump only for package @pie-lib/drag
|
|
61
26
|
|
|
@@ -63,7 +28,7 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
|
|
|
63
28
|
|
|
64
29
|
|
|
65
30
|
|
|
66
|
-
|
|
31
|
+
## [2.22.1](https://github.com/pie-framework/pie-lib/compare/@pie-lib/drag@2.18.2...@pie-lib/drag@2.22.1) (2025-10-22)
|
|
67
32
|
|
|
68
33
|
**Note:** Version bump only for package @pie-lib/drag
|
|
69
34
|
|
|
@@ -71,7 +36,7 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
|
|
|
71
36
|
|
|
72
37
|
|
|
73
38
|
|
|
74
|
-
# [2.
|
|
39
|
+
# [2.22.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/drag@2.21.0...@pie-lib/drag@2.22.0) (2025-10-16)
|
|
75
40
|
|
|
76
41
|
**Note:** Version bump only for package @pie-lib/drag
|
|
77
42
|
|
|
@@ -79,7 +44,7 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
|
|
|
79
44
|
|
|
80
45
|
|
|
81
46
|
|
|
82
|
-
# [2.
|
|
47
|
+
# [2.21.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/drag@2.18.0...@pie-lib/drag@2.21.0) (2025-10-16)
|
|
83
48
|
|
|
84
49
|
**Note:** Version bump only for package @pie-lib/drag
|
|
85
50
|
|
|
@@ -87,7 +52,7 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
|
|
|
87
52
|
|
|
88
53
|
|
|
89
54
|
|
|
90
|
-
# [2.
|
|
55
|
+
# [2.20.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/drag@2.18.0...@pie-lib/drag@2.20.0) (2025-10-16)
|
|
91
56
|
|
|
92
57
|
**Note:** Version bump only for package @pie-lib/drag
|
|
93
58
|
|
|
@@ -95,7 +60,7 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
|
|
|
95
60
|
|
|
96
61
|
|
|
97
62
|
|
|
98
|
-
# [2.
|
|
63
|
+
# [2.19.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/drag@2.18.0...@pie-lib/drag@2.19.0) (2025-10-16)
|
|
99
64
|
|
|
100
65
|
**Note:** Version bump only for package @pie-lib/drag
|
|
101
66
|
|
|
@@ -103,19 +68,6 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
|
|
|
103
68
|
|
|
104
69
|
|
|
105
70
|
|
|
106
|
-
# [2.19.0-mui-update.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/drag@2.18.2...@pie-lib/drag@2.19.0-mui-update.0) (2025-10-31)
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
### Features
|
|
110
|
-
|
|
111
|
-
* drag library update ([fb7a4d0](https://github.com/pie-framework/pie-lib/commit/fb7a4d0ce761f2f4c1a122854cfa306abb8ea7c8))
|
|
112
|
-
* **drag:** update drag package to corresp to material v5 PD-5258 ([7400327](https://github.com/pie-framework/pie-lib/commit/740032735077939f4e05897aaf6b618bfa5b236d))
|
|
113
|
-
* bump react and react-dom ([01dc19e](https://github.com/pie-framework/pie-lib/commit/01dc19e88bbc8d372c561d1511df1a82937d45af))
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
71
|
## [2.18.2](https://github.com/pie-framework/pie-lib/compare/@pie-lib/drag@2.18.1...@pie-lib/drag@2.18.2) (2025-10-14)
|
|
120
72
|
|
|
121
73
|
**Note:** Version bump only for package @pie-lib/drag
|
package/lib/drag-provider.js
CHANGED
|
@@ -14,7 +14,8 @@ var _core = require("@dnd-kit/core");
|
|
|
14
14
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(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 (var _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); }
|
|
15
15
|
function DragProvider(_ref) {
|
|
16
16
|
var children = _ref.children,
|
|
17
|
-
onDragEnd = _ref.onDragEnd
|
|
17
|
+
onDragEnd = _ref.onDragEnd,
|
|
18
|
+
onDragStart = _ref.onDragStart;
|
|
18
19
|
var _useState = (0, _react.useState)(null),
|
|
19
20
|
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
20
21
|
activeId = _useState2[0],
|
|
@@ -26,6 +27,9 @@ function DragProvider(_ref) {
|
|
|
26
27
|
}), (0, _core.useSensor)(_core.KeyboardSensor));
|
|
27
28
|
var handleDragStart = function handleDragStart(event) {
|
|
28
29
|
setActiveId(event.active.id);
|
|
30
|
+
if (onDragStart) {
|
|
31
|
+
onDragStart(event);
|
|
32
|
+
}
|
|
29
33
|
};
|
|
30
34
|
var handleDragEnd = function handleDragEnd(event) {
|
|
31
35
|
setActiveId(null);
|
|
@@ -41,7 +45,8 @@ function DragProvider(_ref) {
|
|
|
41
45
|
}
|
|
42
46
|
DragProvider.propTypes = {
|
|
43
47
|
children: _propTypes["default"].node.isRequired,
|
|
44
|
-
onDragEnd: _propTypes["default"].func
|
|
48
|
+
onDragEnd: _propTypes["default"].func,
|
|
49
|
+
onDragStart: _propTypes["default"].func
|
|
45
50
|
};
|
|
46
51
|
var _default = exports["default"] = DragProvider;
|
|
47
52
|
//# sourceMappingURL=drag-provider.js.map
|
package/lib/drag-provider.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"drag-provider.js","names":["_react","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_core","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","_typeof","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","DragProvider","_ref","children","onDragEnd","_useState","useState","_useState2","_slicedToArray2","activeId","setActiveId","sensors","useSensors","useSensor","PointerSensor","activationConstraint","distance","KeyboardSensor","handleDragStart","event","active","id","handleDragEnd","createElement","DndContext","
|
|
1
|
+
{"version":3,"file":"drag-provider.js","names":["_react","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_core","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","_typeof","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","DragProvider","_ref","children","onDragEnd","onDragStart","_useState","useState","_useState2","_slicedToArray2","activeId","setActiveId","sensors","useSensors","useSensor","PointerSensor","activationConstraint","distance","KeyboardSensor","handleDragStart","event","active","id","handleDragEnd","createElement","DndContext","propTypes","PropTypes","node","isRequired","func","_default","exports"],"sources":["../src/drag-provider.jsx"],"sourcesContent":["import React, { useState } from 'react';\nimport PropTypes from 'prop-types';\nimport { DndContext, PointerSensor, KeyboardSensor, useSensor, useSensors } from '@dnd-kit/core';\n\nexport function DragProvider({ children, onDragEnd, onDragStart }) {\n const [activeId, setActiveId] = useState(null);\n \n const sensors = useSensors(\n useSensor(PointerSensor, { activationConstraint: { distance: 8 }}),\n useSensor(KeyboardSensor)\n );\n\n const handleDragStart = (event) => {\n setActiveId(event.active.id);\n if (onDragStart) {\n onDragStart(event);\n }\n };\n\n const handleDragEnd = (event) => {\n setActiveId(null);\n if (onDragEnd) {\n onDragEnd(event);\n }\n };\n\n return (\n <DndContext \n sensors={sensors} \n onDragStart={handleDragStart}\n onDragEnd={handleDragEnd}\n >\n {children}\n </DndContext>\n );\n}\n\nDragProvider.propTypes = {\n children: PropTypes.node.isRequired,\n onDragEnd: PropTypes.func,\n onDragStart: PropTypes.func,\n};\n\nexport default DragProvider;"],"mappings":";;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,UAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AAAiG,SAAAD,wBAAAK,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAP,uBAAA,YAAAA,wBAAAK,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,mBAAAT,CAAA,iBAAAA,CAAA,gBAAAU,OAAA,CAAAV,CAAA,0BAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,cAAAM,EAAA,IAAAd,CAAA,gBAAAc,EAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,EAAA,OAAAP,CAAA,IAAAD,CAAA,GAAAW,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAnB,CAAA,EAAAc,EAAA,OAAAP,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAM,EAAA,EAAAP,CAAA,IAAAC,CAAA,CAAAM,EAAA,IAAAd,CAAA,CAAAc,EAAA,WAAAN,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAE1F,SAASmB,YAAYA,CAAAC,IAAA,EAAuC;EAAA,IAApCC,QAAQ,GAAAD,IAAA,CAARC,QAAQ;IAAEC,SAAS,GAAAF,IAAA,CAATE,SAAS;IAAEC,WAAW,GAAAH,IAAA,CAAXG,WAAW;EAC7D,IAAAC,SAAA,GAAgC,IAAAC,eAAQ,EAAC,IAAI,CAAC;IAAAC,UAAA,OAAAC,eAAA,aAAAH,SAAA;IAAvCI,QAAQ,GAAAF,UAAA;IAAEG,WAAW,GAAAH,UAAA;EAE5B,IAAMI,OAAO,GAAG,IAAAC,gBAAU,EACxB,IAAAC,eAAS,EAACC,mBAAa,EAAE;IAAEC,oBAAoB,EAAE;MAAEC,QAAQ,EAAE;IAAE;EAAC,CAAC,CAAC,EAClE,IAAAH,eAAS,EAACI,oBAAc,CAC1B,CAAC;EAED,IAAMC,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,KAAK,EAAK;IACjCT,WAAW,CAACS,KAAK,CAACC,MAAM,CAACC,EAAE,CAAC;IAC5B,IAAIjB,WAAW,EAAE;MACfA,WAAW,CAACe,KAAK,CAAC;IACpB;EACF,CAAC;EAED,IAAMG,aAAa,GAAG,SAAhBA,aAAaA,CAAIH,KAAK,EAAK;IAC/BT,WAAW,CAAC,IAAI,CAAC;IACjB,IAAIP,SAAS,EAAE;MACbA,SAAS,CAACgB,KAAK,CAAC;IAClB;EACF,CAAC;EAED,oBACE7C,MAAA,YAAAiD,aAAA,CAAC5C,KAAA,CAAA6C,UAAU;IACTb,OAAO,EAAEA,OAAQ;IACjBP,WAAW,EAAEc,eAAgB;IAC7Bf,SAAS,EAAEmB;EAAc,GAExBpB,QACS,CAAC;AAEjB;AAEAF,YAAY,CAACyB,SAAS,GAAG;EACvBvB,QAAQ,EAAEwB,qBAAS,CAACC,IAAI,CAACC,UAAU;EACnCzB,SAAS,EAAEuB,qBAAS,CAACG,IAAI;EACzBzB,WAAW,EAAEsB,qBAAS,CAACG;AACzB,CAAC;AAAC,IAAAC,QAAA,GAAAC,OAAA,cAEa/B,YAAY","ignoreList":[]}
|
package/lib/draggable-choice.js
CHANGED
|
@@ -12,12 +12,10 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
12
12
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
13
|
var _styles = require("@mui/material/styles");
|
|
14
14
|
var _core = require("@dnd-kit/core");
|
|
15
|
-
var _utilities = require("@dnd-kit/utilities");
|
|
16
15
|
var _colors = require("@mui/material/colors");
|
|
17
16
|
var DRAG_TYPE = exports.DRAG_TYPE = 'CHOICE';
|
|
18
17
|
var StyledChoice = (0, _styles.styled)('div')(function (_ref) {
|
|
19
|
-
var theme = _ref.theme
|
|
20
|
-
isDragging = _ref.isDragging;
|
|
18
|
+
var theme = _ref.theme;
|
|
21
19
|
return {
|
|
22
20
|
backgroundColor: theme.palette.background.paper,
|
|
23
21
|
border: "solid 1px ".concat(_colors.grey[400]),
|
|
@@ -26,7 +24,6 @@ var StyledChoice = (0, _styles.styled)('div')(function (_ref) {
|
|
|
26
24
|
minWidth: theme.spacing(20),
|
|
27
25
|
maxWidth: theme.spacing(75),
|
|
28
26
|
cursor: 'grab',
|
|
29
|
-
opacity: isDragging ? 0.5 : 1,
|
|
30
27
|
'&:active': {
|
|
31
28
|
cursor: 'grabbing'
|
|
32
29
|
}
|
|
@@ -40,30 +37,31 @@ function DraggableChoice(_ref2) {
|
|
|
40
37
|
category = _ref2.category,
|
|
41
38
|
alternateResponseIndex = _ref2.alternateResponseIndex,
|
|
42
39
|
choiceIndex = _ref2.choiceIndex,
|
|
43
|
-
onRemoveChoice = _ref2.onRemoveChoice
|
|
40
|
+
onRemoveChoice = _ref2.onRemoveChoice,
|
|
41
|
+
type = _ref2.type;
|
|
44
42
|
var _useDraggable = (0, _core.useDraggable)({
|
|
45
43
|
id: choice.id,
|
|
46
44
|
disabled: disabled,
|
|
45
|
+
categoryId: category === null || category === void 0 ? void 0 : category.id,
|
|
46
|
+
alternateResponseIndex: alternateResponseIndex,
|
|
47
47
|
data: {
|
|
48
|
+
id: choice.id,
|
|
48
49
|
value: choice.value,
|
|
49
50
|
choiceId: choice.id,
|
|
50
51
|
from: category === null || category === void 0 ? void 0 : category.id,
|
|
52
|
+
categoryId: category === null || category === void 0 ? void 0 : category.id,
|
|
51
53
|
alternateResponseIndex: alternateResponseIndex,
|
|
52
54
|
choiceIndex: choiceIndex,
|
|
53
|
-
onRemoveChoice: onRemoveChoice
|
|
55
|
+
onRemoveChoice: onRemoveChoice,
|
|
56
|
+
type: type
|
|
54
57
|
}
|
|
55
58
|
}),
|
|
56
59
|
attributes = _useDraggable.attributes,
|
|
57
60
|
listeners = _useDraggable.listeners,
|
|
58
61
|
setNodeRef = _useDraggable.setNodeRef,
|
|
59
|
-
transform = _useDraggable.transform,
|
|
60
62
|
isDragging = _useDraggable.isDragging;
|
|
61
|
-
var style = {
|
|
62
|
-
transform: _utilities.CSS.Translate.toString(transform)
|
|
63
|
-
};
|
|
64
63
|
return /*#__PURE__*/_react["default"].createElement(StyledChoice, (0, _extends2["default"])({
|
|
65
64
|
ref: setNodeRef,
|
|
66
|
-
style: style,
|
|
67
65
|
className: className,
|
|
68
66
|
isDragging: isDragging
|
|
69
67
|
}, attributes, listeners), children);
|
|
@@ -81,7 +79,8 @@ DraggableChoice.propTypes = {
|
|
|
81
79
|
}),
|
|
82
80
|
alternateResponseIndex: _propTypes["default"].number,
|
|
83
81
|
choiceIndex: _propTypes["default"].number,
|
|
84
|
-
onRemoveChoice: _propTypes["default"].func
|
|
82
|
+
onRemoveChoice: _propTypes["default"].func,
|
|
83
|
+
type: _propTypes["default"].string
|
|
85
84
|
};
|
|
86
85
|
var _default = exports["default"] = DraggableChoice;
|
|
87
86
|
//# sourceMappingURL=draggable-choice.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"draggable-choice.js","names":["_react","_interopRequireDefault","require","_propTypes","_styles","_core","
|
|
1
|
+
{"version":3,"file":"draggable-choice.js","names":["_react","_interopRequireDefault","require","_propTypes","_styles","_core","_colors","DRAG_TYPE","exports","StyledChoice","styled","_ref","theme","backgroundColor","palette","background","paper","border","concat","grey","padding","spacing","minHeight","minWidth","maxWidth","cursor","DraggableChoice","_ref2","choice","children","className","disabled","category","alternateResponseIndex","choiceIndex","onRemoveChoice","type","_useDraggable","useDraggable","id","categoryId","data","value","choiceId","from","attributes","listeners","setNodeRef","isDragging","createElement","_extends2","ref","propTypes","PropTypes","shape","oneOfType","string","number","isRequired","any","arrayOf","node","bool","func","_default"],"sources":["../src/draggable-choice.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@mui/material/styles';\nimport { useDraggable } from '@dnd-kit/core';\nimport { grey } from '@mui/material/colors';\n\nexport const DRAG_TYPE = 'CHOICE';\n\nconst StyledChoice = styled('div')(({ theme }) => ({\n backgroundColor: theme.palette.background.paper,\n border: `solid 1px ${grey[400]}`,\n padding: theme.spacing(1),\n minHeight: '30px',\n minWidth: theme.spacing(20),\n maxWidth: theme.spacing(75),\n cursor: 'grab',\n '&:active': {\n cursor: 'grabbing',\n },\n}));\n\nexport function DraggableChoice({\n choice,\n children,\n className,\n disabled,\n category,\n alternateResponseIndex,\n choiceIndex,\n onRemoveChoice,\n type,\n}) {\n const {\n attributes,\n listeners,\n setNodeRef,\n isDragging\n } = useDraggable({\n id: choice.id,\n disabled: disabled,\n categoryId: category?.id,\n alternateResponseIndex,\n data: {\n id: choice.id,\n value: choice.value,\n choiceId: choice.id,\n from: category?.id,\n categoryId: category?.id,\n alternateResponseIndex,\n choiceIndex,\n onRemoveChoice,\n type\n }\n });\n\n return (\n <StyledChoice\n ref={setNodeRef}\n className={className}\n isDragging={isDragging}\n {...attributes}\n {...listeners}\n >\n {children}\n </StyledChoice>\n );\n}\n\nDraggableChoice.propTypes = {\n choice: PropTypes.shape({\n id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,\n value: PropTypes.any,\n }).isRequired,\n children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),\n className: PropTypes.string,\n disabled: PropTypes.bool,\n category: PropTypes.shape({\n id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n }),\n alternateResponseIndex: PropTypes.number,\n choiceIndex: PropTypes.number,\n onRemoveChoice: PropTypes.func,\n type: PropTypes.string,\n};\n\nexport default DraggableChoice;\n"],"mappings":";;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,UAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AAEO,IAAMK,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAG,QAAQ;AAEjC,IAAME,YAAY,GAAG,IAAAC,cAAM,EAAC,KAAK,CAAC,CAAC,UAAAC,IAAA;EAAA,IAAGC,KAAK,GAAAD,IAAA,CAALC,KAAK;EAAA,OAAQ;IACjDC,eAAe,EAAED,KAAK,CAACE,OAAO,CAACC,UAAU,CAACC,KAAK;IAC/CC,MAAM,eAAAC,MAAA,CAAeC,YAAI,CAAC,GAAG,CAAC,CAAE;IAChCC,OAAO,EAAER,KAAK,CAACS,OAAO,CAAC,CAAC,CAAC;IACzBC,SAAS,EAAE,MAAM;IACjBC,QAAQ,EAAEX,KAAK,CAACS,OAAO,CAAC,EAAE,CAAC;IAC3BG,QAAQ,EAAEZ,KAAK,CAACS,OAAO,CAAC,EAAE,CAAC;IAC3BI,MAAM,EAAE,MAAM;IACd,UAAU,EAAE;MACVA,MAAM,EAAE;IACV;EACF,CAAC;AAAA,CAAC,CAAC;AAEI,SAASC,eAAeA,CAAAC,KAAA,EAU5B;EAAA,IATDC,MAAM,GAAAD,KAAA,CAANC,MAAM;IACNC,QAAQ,GAAAF,KAAA,CAARE,QAAQ;IACRC,SAAS,GAAAH,KAAA,CAATG,SAAS;IACTC,QAAQ,GAAAJ,KAAA,CAARI,QAAQ;IACRC,QAAQ,GAAAL,KAAA,CAARK,QAAQ;IACRC,sBAAsB,GAAAN,KAAA,CAAtBM,sBAAsB;IACtBC,WAAW,GAAAP,KAAA,CAAXO,WAAW;IACXC,cAAc,GAAAR,KAAA,CAAdQ,cAAc;IACdC,IAAI,GAAAT,KAAA,CAAJS,IAAI;EAEJ,IAAAC,aAAA,GAKI,IAAAC,kBAAY,EAAC;MACfC,EAAE,EAAEX,MAAM,CAACW,EAAE;MACbR,QAAQ,EAAEA,QAAQ;MAClBS,UAAU,EAAER,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAEO,EAAE;MACxBN,sBAAsB,EAAtBA,sBAAsB;MACtBQ,IAAI,EAAE;QACJF,EAAE,EAAEX,MAAM,CAACW,EAAE;QACbG,KAAK,EAAEd,MAAM,CAACc,KAAK;QACnBC,QAAQ,EAAEf,MAAM,CAACW,EAAE;QACnBK,IAAI,EAAEZ,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAEO,EAAE;QAClBC,UAAU,EAAER,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAEO,EAAE;QACxBN,sBAAsB,EAAtBA,sBAAsB;QACtBC,WAAW,EAAXA,WAAW;QACXC,cAAc,EAAdA,cAAc;QACdC,IAAI,EAAJA;MACF;IACF,CAAC,CAAC;IApBAS,UAAU,GAAAR,aAAA,CAAVQ,UAAU;IACVC,SAAS,GAAAT,aAAA,CAATS,SAAS;IACTC,UAAU,GAAAV,aAAA,CAAVU,UAAU;IACVC,UAAU,GAAAX,aAAA,CAAVW,UAAU;EAmBZ,oBACEhD,MAAA,YAAAiD,aAAA,CAACxC,YAAY,MAAAyC,SAAA;IACXC,GAAG,EAAEJ,UAAW;IAChBjB,SAAS,EAAEA,SAAU;IACrBkB,UAAU,EAAEA;EAAW,GACnBH,UAAU,EACVC,SAAS,GAEZjB,QACW,CAAC;AAEnB;AAEAH,eAAe,CAAC0B,SAAS,GAAG;EAC1BxB,MAAM,EAAEyB,qBAAS,CAACC,KAAK,CAAC;IACtBf,EAAE,EAAEc,qBAAS,CAACE,SAAS,CAAC,CAACF,qBAAS,CAACG,MAAM,EAAEH,qBAAS,CAACI,MAAM,CAAC,CAAC,CAACC,UAAU;IACxEhB,KAAK,EAAEW,qBAAS,CAACM;EACnB,CAAC,CAAC,CAACD,UAAU;EACb7B,QAAQ,EAAEwB,qBAAS,CAACE,SAAS,CAAC,CAACF,qBAAS,CAACO,OAAO,CAACP,qBAAS,CAACQ,IAAI,CAAC,EAAER,qBAAS,CAACQ,IAAI,CAAC,CAAC;EAClF/B,SAAS,EAAEuB,qBAAS,CAACG,MAAM;EAC3BzB,QAAQ,EAAEsB,qBAAS,CAACS,IAAI;EACxB9B,QAAQ,EAAEqB,qBAAS,CAACC,KAAK,CAAC;IACxBf,EAAE,EAAEc,qBAAS,CAACE,SAAS,CAAC,CAACF,qBAAS,CAACG,MAAM,EAAEH,qBAAS,CAACI,MAAM,CAAC;EAC9D,CAAC,CAAC;EACFxB,sBAAsB,EAAEoB,qBAAS,CAACI,MAAM;EACxCvB,WAAW,EAAEmB,qBAAS,CAACI,MAAM;EAC7BtB,cAAc,EAAEkB,qBAAS,CAACU,IAAI;EAC9B3B,IAAI,EAAEiB,qBAAS,CAACG;AAClB,CAAC;AAAC,IAAAQ,QAAA,GAAAxD,OAAA,cAEakB,eAAe","ignoreList":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pie-lib/drag",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.31.0-mui-update.0",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "src/index.js",
|
|
@@ -12,8 +12,8 @@
|
|
|
12
12
|
"@emotion/style": "^0.8.0",
|
|
13
13
|
"@mui/icons-material": "^7.3.4",
|
|
14
14
|
"@mui/material": "^7.3.4",
|
|
15
|
-
"@pie-lib/math-rendering": "3.
|
|
16
|
-
"@pie-lib/render-ui": "4.
|
|
15
|
+
"@pie-lib/math-rendering": "3.35.0-mui-update.0",
|
|
16
|
+
"@pie-lib/render-ui": "4.44.0-mui-update.0",
|
|
17
17
|
"classnames": "^2.2.6",
|
|
18
18
|
"lodash": "^4.17.11",
|
|
19
19
|
"prop-types": "^15.7.2",
|
|
@@ -25,5 +25,5 @@
|
|
|
25
25
|
"scripts": {},
|
|
26
26
|
"author": "",
|
|
27
27
|
"license": "ISC",
|
|
28
|
-
"gitHead": "
|
|
28
|
+
"gitHead": "23a7cb8864b947778ac7e6dffdc6fa4a74af5927"
|
|
29
29
|
}
|
package/src/drag-provider.jsx
CHANGED
|
@@ -2,7 +2,7 @@ import React, { useState } from 'react';
|
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
3
|
import { DndContext, PointerSensor, KeyboardSensor, useSensor, useSensors } from '@dnd-kit/core';
|
|
4
4
|
|
|
5
|
-
export function DragProvider({ children, onDragEnd }) {
|
|
5
|
+
export function DragProvider({ children, onDragEnd, onDragStart }) {
|
|
6
6
|
const [activeId, setActiveId] = useState(null);
|
|
7
7
|
|
|
8
8
|
const sensors = useSensors(
|
|
@@ -12,6 +12,9 @@ export function DragProvider({ children, onDragEnd }) {
|
|
|
12
12
|
|
|
13
13
|
const handleDragStart = (event) => {
|
|
14
14
|
setActiveId(event.active.id);
|
|
15
|
+
if (onDragStart) {
|
|
16
|
+
onDragStart(event);
|
|
17
|
+
}
|
|
15
18
|
};
|
|
16
19
|
|
|
17
20
|
const handleDragEnd = (event) => {
|
|
@@ -35,6 +38,7 @@ export function DragProvider({ children, onDragEnd }) {
|
|
|
35
38
|
DragProvider.propTypes = {
|
|
36
39
|
children: PropTypes.node.isRequired,
|
|
37
40
|
onDragEnd: PropTypes.func,
|
|
41
|
+
onDragStart: PropTypes.func,
|
|
38
42
|
};
|
|
39
43
|
|
|
40
44
|
export default DragProvider;
|
package/src/draggable-choice.jsx
CHANGED
|
@@ -2,12 +2,11 @@ import React from 'react';
|
|
|
2
2
|
import PropTypes from 'prop-types';
|
|
3
3
|
import { styled } from '@mui/material/styles';
|
|
4
4
|
import { useDraggable } from '@dnd-kit/core';
|
|
5
|
-
import { CSS } from '@dnd-kit/utilities';
|
|
6
5
|
import { grey } from '@mui/material/colors';
|
|
7
6
|
|
|
8
7
|
export const DRAG_TYPE = 'CHOICE';
|
|
9
8
|
|
|
10
|
-
const StyledChoice = styled('div')(({ theme
|
|
9
|
+
const StyledChoice = styled('div')(({ theme }) => ({
|
|
11
10
|
backgroundColor: theme.palette.background.paper,
|
|
12
11
|
border: `solid 1px ${grey[400]}`,
|
|
13
12
|
padding: theme.spacing(1),
|
|
@@ -15,49 +14,48 @@ const StyledChoice = styled('div')(({ theme, isDragging }) => ({
|
|
|
15
14
|
minWidth: theme.spacing(20),
|
|
16
15
|
maxWidth: theme.spacing(75),
|
|
17
16
|
cursor: 'grab',
|
|
18
|
-
opacity: isDragging ? 0.5 : 1,
|
|
19
17
|
'&:active': {
|
|
20
18
|
cursor: 'grabbing',
|
|
21
19
|
},
|
|
22
20
|
}));
|
|
23
21
|
|
|
24
|
-
export function DraggableChoice({
|
|
25
|
-
choice,
|
|
26
|
-
children,
|
|
22
|
+
export function DraggableChoice({
|
|
23
|
+
choice,
|
|
24
|
+
children,
|
|
27
25
|
className,
|
|
28
26
|
disabled,
|
|
29
27
|
category,
|
|
30
28
|
alternateResponseIndex,
|
|
31
29
|
choiceIndex,
|
|
32
|
-
onRemoveChoice
|
|
30
|
+
onRemoveChoice,
|
|
31
|
+
type,
|
|
33
32
|
}) {
|
|
34
|
-
const {
|
|
35
|
-
attributes,
|
|
36
|
-
listeners,
|
|
37
|
-
setNodeRef,
|
|
38
|
-
|
|
39
|
-
isDragging
|
|
33
|
+
const {
|
|
34
|
+
attributes,
|
|
35
|
+
listeners,
|
|
36
|
+
setNodeRef,
|
|
37
|
+
isDragging
|
|
40
38
|
} = useDraggable({
|
|
41
39
|
id: choice.id,
|
|
42
40
|
disabled: disabled,
|
|
43
|
-
|
|
41
|
+
categoryId: category?.id,
|
|
42
|
+
alternateResponseIndex,
|
|
43
|
+
data: {
|
|
44
|
+
id: choice.id,
|
|
44
45
|
value: choice.value,
|
|
45
46
|
choiceId: choice.id,
|
|
46
47
|
from: category?.id,
|
|
48
|
+
categoryId: category?.id,
|
|
47
49
|
alternateResponseIndex,
|
|
48
50
|
choiceIndex,
|
|
49
|
-
onRemoveChoice
|
|
51
|
+
onRemoveChoice,
|
|
52
|
+
type
|
|
50
53
|
}
|
|
51
54
|
});
|
|
52
55
|
|
|
53
|
-
const style = {
|
|
54
|
-
transform: CSS.Translate.toString(transform),
|
|
55
|
-
};
|
|
56
|
-
|
|
57
56
|
return (
|
|
58
|
-
<StyledChoice
|
|
57
|
+
<StyledChoice
|
|
59
58
|
ref={setNodeRef}
|
|
60
|
-
style={style}
|
|
61
59
|
className={className}
|
|
62
60
|
isDragging={isDragging}
|
|
63
61
|
{...attributes}
|
|
@@ -82,6 +80,7 @@ DraggableChoice.propTypes = {
|
|
|
82
80
|
alternateResponseIndex: PropTypes.number,
|
|
83
81
|
choiceIndex: PropTypes.number,
|
|
84
82
|
onRemoveChoice: PropTypes.func,
|
|
83
|
+
type: PropTypes.string,
|
|
85
84
|
};
|
|
86
85
|
|
|
87
86
|
export default DraggableChoice;
|