@pie-lib/mask-markup 2.0.0-next.0 → 2.1.0-next.2

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.
@@ -1 +0,0 @@
1
- {"version":3,"file":"componentize.js","names":["REGEX","_default","exports","s","t","markup","replace","match","g","concat"],"sources":["../src/componentize.js"],"sourcesContent":["const REGEX = /\\{\\{(\\d+)\\}\\}/g;\n\nexport default (s, t) => {\n if (!s) {\n return { markup: '' };\n }\n\n const markup = s.replace(REGEX, (match, g) => {\n return `<span data-component=\"${t}\" data-id=\"${g}\"></span>`;\n });\n\n return { markup };\n};\n"],"mappings":";;;;;;AAAA,IAAMA,KAAK,GAAG,gBAAgB;AAAC,IAAAC,QAAA,GAAAC,OAAA,cAEhB,SAAAD,SAACE,CAAC,EAAEC,CAAC,EAAK;EACvB,IAAI,CAACD,CAAC,EAAE;IACN,OAAO;MAAEE,MAAM,EAAE;IAAG,CAAC;EACvB;EAEA,IAAMA,MAAM,GAAGF,CAAC,CAACG,OAAO,CAACN,KAAK,EAAE,UAACO,KAAK,EAAEC,CAAC,EAAK;IAC5C,iCAAAC,MAAA,CAAgCL,CAAC,mBAAAK,MAAA,CAAcD,CAAC;EAClD,CAAC,CAAC;EAEF,OAAO;IAAEH,MAAM,EAANA;EAAO,CAAC;AACnB,CAAC","ignoreList":[]}
@@ -1,357 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- var _typeof = require("@babel/runtime/helpers/typeof");
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports["default"] = void 0;
9
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
10
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
11
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
12
- var _react = _interopRequireWildcard(require("react"));
13
- var _propTypes = _interopRequireDefault(require("prop-types"));
14
- var _mathRendering = require("@pie-lib/math-rendering");
15
- var _debug = _interopRequireDefault(require("debug"));
16
- var _core = require("@dnd-kit/core");
17
- var _utilities = require("@dnd-kit/utilities");
18
- var _styles = require("@mui/material/styles");
19
- var _Chip = _interopRequireDefault(require("@mui/material/Chip"));
20
- var _classnames = _interopRequireDefault(require("classnames"));
21
- var _renderUi = require("@pie-lib/render-ui");
22
- var _colors = require("@mui/material/colors");
23
- 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); }
24
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
25
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
26
- var log = (0, _debug["default"])('pie-lib:mask-markup:blank');
27
- var StyledContent = (0, _styles.styled)('span')(function (_ref) {
28
- var dragged = _ref.dragged,
29
- over = _ref.over;
30
- return _objectSpread(_objectSpread({
31
- border: "solid 0px ".concat(_renderUi.color.primary()),
32
- minWidth: '200px',
33
- touchAction: 'none',
34
- overflow: 'hidden',
35
- whiteSpace: 'nowrap',
36
- opacity: 1
37
- }, over && {
38
- whiteSpace: 'nowrap',
39
- overflow: 'hidden'
40
- }), dragged && {
41
- opacity: 0.5
42
- });
43
- });
44
- var StyledChip = (0, _styles.styled)(_Chip["default"])(function () {
45
- return {
46
- backgroundColor: _renderUi.color.background(),
47
- border: "2px dashed ".concat(_renderUi.color.text()),
48
- color: _renderUi.color.text(),
49
- fontSize: 'inherit',
50
- maxWidth: '374px',
51
- position: 'relative',
52
- borderRadius: '3px',
53
- '&.over': {
54
- whiteSpace: 'nowrap',
55
- overflow: 'hidden'
56
- },
57
- '&.parentOver': {
58
- border: "1px solid ".concat(_colors.grey[500]),
59
- backgroundColor: "".concat(_colors.grey[300])
60
- },
61
- '&.correct': {
62
- border: "solid 1px ".concat(_renderUi.color.correct())
63
- },
64
- '&.incorrect': {
65
- border: "solid 1px ".concat(_renderUi.color.incorrect())
66
- },
67
- '&.Mui-disabled': {
68
- opacity: 1
69
- }
70
- };
71
- });
72
- var StyledChipLabel = (0, _styles.styled)('span')(function () {
73
- return {
74
- whiteSpace: 'normal',
75
- // Added for touch devices, for image content.
76
- // This will prevent the context menu from appearing and not allowing other interactions with the image.
77
- // If interactions with the image in the token will be requested we should handle only the context Menu.
78
- pointerEvents: 'none',
79
- '& img': {
80
- display: 'block',
81
- padding: '2px 0'
82
- },
83
- // Remove default <p> margins to ensure consistent spacing across all wrapped content (p, span, div, math)
84
- // Padding for top and bottom will instead be controlled by the container for consistent layout
85
- // Ensures consistent behavior with pie-api-browser, where marginTop is already removed by a Bootstrap stylesheet
86
- '& p': {
87
- marginTop: '0',
88
- marginBottom: '0'
89
- },
90
- '& mjx-frac': {
91
- fontSize: '120% !important'
92
- },
93
- '&.over': {
94
- whiteSpace: 'nowrap',
95
- overflow: 'hidden'
96
- },
97
- '&.hidden': {
98
- color: 'transparent',
99
- opacity: 0
100
- },
101
- '&.dragged': {
102
- position: 'absolute',
103
- left: 16,
104
- maxWidth: '60px'
105
- }
106
- };
107
- });
108
- function BlankContent(_ref2) {
109
- var _dragItem$choice, _frozenRef$current, _frozenRef$current2;
110
- var disabled = _ref2.disabled,
111
- choice = _ref2.choice,
112
- isOver = _ref2.isOver,
113
- isDragging = _ref2.isDragging,
114
- dragItem = _ref2.dragItem,
115
- correct = _ref2.correct,
116
- emptyResponseAreaWidth = _ref2.emptyResponseAreaWidth,
117
- emptyResponseAreaHeight = _ref2.emptyResponseAreaHeight;
118
- var rootRef = (0, _react.useRef)(null);
119
- var spanRef = (0, _react.useRef)(null);
120
- var frozenRef = (0, _react.useRef)(null); // to use during dragging to prevent flickering
121
- var _useState = (0, _react.useState)({
122
- height: 0,
123
- width: 0
124
- }),
125
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
126
- dimensions = _useState2[0],
127
- setDimensions = _useState2[1];
128
- var handleImageLoad = function handleImageLoad() {
129
- updateDimensions();
130
- };
131
- var handleElements = function handleElements() {
132
- var _spanRef$current;
133
- var imageElement = (_spanRef$current = spanRef.current) === null || _spanRef$current === void 0 ? void 0 : _spanRef$current.querySelector('img');
134
- if (imageElement) {
135
- imageElement.onload = handleImageLoad;
136
- } else {
137
- setTimeout(function () {
138
- updateDimensions();
139
- }, 300);
140
- }
141
- };
142
- var updateDimensions = function updateDimensions() {
143
- if (spanRef.current && rootRef.current) {
144
- // Temporarily set rootRef width to 'auto' for natural measurement
145
- rootRef.current.style.width = 'auto';
146
-
147
- // Get the natural dimensions of the content
148
- var width = spanRef.current.offsetWidth || 0;
149
- var height = spanRef.current.offsetHeight || 0;
150
- var widthWithPadding = width + 24; // 12px padding on each side
151
- var heightWithPadding = height + 24; // 12px padding on top and bottom
152
-
153
- var responseAreaWidth = parseFloat(emptyResponseAreaWidth) || 0;
154
- var responseAreaHeight = parseFloat(emptyResponseAreaHeight) || 0;
155
- var adjustedWidth = widthWithPadding <= responseAreaWidth ? responseAreaWidth : widthWithPadding;
156
- var adjustedHeight = heightWithPadding <= responseAreaHeight ? responseAreaHeight : heightWithPadding;
157
- setDimensions(function (prevState) {
158
- return {
159
- width: adjustedWidth > responseAreaWidth ? adjustedWidth : prevState.width,
160
- height: adjustedHeight > responseAreaHeight ? adjustedHeight : prevState.height
161
- };
162
- });
163
- rootRef.current.style.width = "".concat(adjustedWidth, "px");
164
- rootRef.current.style.height = "".concat(adjustedHeight, "px");
165
- }
166
- };
167
- var getRootDimensions = function getRootDimensions() {
168
- // Handle potential non-numeric values
169
- var responseAreaWidth = !isNaN(parseFloat(emptyResponseAreaWidth)) ? parseFloat(emptyResponseAreaWidth) : 0;
170
- var responseAreaHeight = !isNaN(parseFloat(emptyResponseAreaHeight)) ? parseFloat(emptyResponseAreaHeight) : 0;
171
- var rootStyle = {
172
- height: dimensions.height || responseAreaHeight,
173
- width: dimensions.width || responseAreaWidth
174
- };
175
-
176
- // add minWidth, minHeight if width and height are not defined
177
- return _objectSpread(_objectSpread(_objectSpread({}, rootStyle), responseAreaWidth ? {} : {
178
- minWidth: 90
179
- }), responseAreaHeight ? {} : {
180
- minHeight: 32
181
- });
182
- };
183
- (0, _react.useEffect)(function () {
184
- handleElements();
185
- }, []);
186
-
187
- // Render math for the placeholder/preview when dragging over
188
- (0, _react.useEffect)(function () {
189
- if (rootRef.current) {
190
- (0, _mathRendering.renderMath)(rootRef.current);
191
- }
192
- }, [isOver, dragItem === null || dragItem === void 0 || (_dragItem$choice = dragItem.choice) === null || _dragItem$choice === void 0 ? void 0 : _dragItem$choice.value]);
193
- (0, _react.useEffect)(function () {
194
- if (!choice) {
195
- setDimensions({
196
- height: 0,
197
- width: 0
198
- });
199
- return;
200
- }
201
- handleElements();
202
- }, [choice]);
203
- (0, _react.useEffect)(function () {
204
- if (!isOver && !isDragging) {
205
- frozenRef.current = {
206
- width: rootRef.current.offsetWidth,
207
- height: rootRef.current.offsetHeight
208
- };
209
- }
210
- }, [choice, isOver, isDragging]);
211
- var draggedLabel = dragItem && isOver && dragItem.choice && dragItem.choice.value;
212
- var label = choice && choice.value;
213
- var style = isOver || isDragging ? {
214
- width: (_frozenRef$current = frozenRef.current) === null || _frozenRef$current === void 0 ? void 0 : _frozenRef$current.width,
215
- height: (_frozenRef$current2 = frozenRef.current) === null || _frozenRef$current2 === void 0 ? void 0 : _frozenRef$current2.height
216
- } : getRootDimensions();
217
- return /*#__PURE__*/_react["default"].createElement(StyledChip, {
218
- clickable: false,
219
- disabled: disabled,
220
- ref: rootRef,
221
- component: "span",
222
- label: /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(StyledChipLabel, {
223
- ref: spanRef,
224
- draggable: true,
225
- className: (0, _classnames["default"])({
226
- over: isOver,
227
- hidden: draggedLabel
228
- }),
229
- dangerouslySetInnerHTML: {
230
- __html: label || ''
231
- }
232
- }), draggedLabel && /*#__PURE__*/_react["default"].createElement(StyledChipLabel, {
233
- draggable: true,
234
- className: (0, _classnames["default"])({
235
- over: isOver,
236
- dragged: true
237
- }),
238
- dangerouslySetInnerHTML: {
239
- __html: draggedLabel || ''
240
- }
241
- })),
242
- className: (0, _classnames["default"])({
243
- over: isOver,
244
- parentOver: isOver,
245
- correct: correct !== undefined && correct,
246
- incorrect: correct !== undefined && !correct
247
- }),
248
- variant: disabled ? 'outlined' : undefined,
249
- style: style
250
- });
251
- }
252
- BlankContent.defaultProps = {
253
- emptyResponseAreaWidth: 0,
254
- emptyResponseAreaHeight: 0
255
- };
256
- BlankContent.propTypes = {
257
- id: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
258
- disabled: _propTypes["default"].bool,
259
- duplicates: _propTypes["default"].bool,
260
- choice: _propTypes["default"].object,
261
- isOver: _propTypes["default"].bool,
262
- dragItem: _propTypes["default"].object,
263
- correct: _propTypes["default"].bool,
264
- onChange: _propTypes["default"].func,
265
- emptyResponseAreaWidth: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
266
- emptyResponseAreaHeight: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
267
- instanceId: _propTypes["default"].string
268
- };
269
-
270
- // New functional component using @dnd-kit hooks
271
- function DragDropBlank(_ref3) {
272
- var _dragItem$data;
273
- var id = _ref3.id,
274
- disabled = _ref3.disabled,
275
- duplicates = _ref3.duplicates,
276
- choice = _ref3.choice,
277
- correct = _ref3.correct,
278
- onChange = _ref3.onChange,
279
- emptyResponseAreaWidth = _ref3.emptyResponseAreaWidth,
280
- emptyResponseAreaHeight = _ref3.emptyResponseAreaHeight,
281
- instanceId = _ref3.instanceId;
282
- // Setup draggable functionality
283
- var _useDraggable = (0, _core.useDraggable)({
284
- id: "mask-blank-drag-".concat(id),
285
- disabled: disabled || !choice,
286
- data: {
287
- id: id,
288
- choice: choice,
289
- instanceId: instanceId,
290
- fromChoice: false,
291
- // This is from a blank, not from choices
292
- type: 'MaskBlank'
293
- }
294
- }),
295
- dragAttributes = _useDraggable.attributes,
296
- dragListeners = _useDraggable.listeners,
297
- setDragNodeRef = _useDraggable.setNodeRef,
298
- transform = _useDraggable.transform,
299
- isDragging = _useDraggable.isDragging;
300
-
301
- // Setup droppable functionality
302
- var _useDroppable = (0, _core.useDroppable)({
303
- id: "mask-blank-drop-".concat(id),
304
- data: {
305
- id: id,
306
- accepts: ['MaskBlank'],
307
- instanceId: instanceId
308
- }
309
- }),
310
- setDropNodeRef = _useDroppable.setNodeRef,
311
- isOver = _useDroppable.isOver,
312
- dragItem = _useDroppable.active;
313
-
314
- // Combine refs for both drag and drop
315
- var setNodeRef = function setNodeRef(node) {
316
- setDragNodeRef(node);
317
- setDropNodeRef(node);
318
- };
319
- var style = {
320
- transform: _utilities.CSS.Translate.toString(transform)
321
- };
322
- return /*#__PURE__*/_react["default"].createElement(StyledContent, (0, _extends2["default"])({
323
- ref: setNodeRef,
324
- style: style,
325
- dragged: isDragging,
326
- over: isOver
327
- }, dragAttributes, dragListeners), /*#__PURE__*/_react["default"].createElement(BlankContent, {
328
- id: id,
329
- disabled: disabled,
330
- duplicates: duplicates,
331
- choice: choice,
332
- isOver: isOver,
333
- dragItem: dragItem === null || dragItem === void 0 || (_dragItem$data = dragItem.data) === null || _dragItem$data === void 0 ? void 0 : _dragItem$data.current,
334
- correct: correct,
335
- onChange: onChange,
336
- emptyResponseAreaWidth: emptyResponseAreaWidth,
337
- emptyResponseAreaHeight: emptyResponseAreaHeight,
338
- instanceId: instanceId
339
- }));
340
- }
341
- DragDropBlank.defaultProps = {
342
- emptyResponseAreaWidth: 0,
343
- emptyResponseAreaHeight: 0
344
- };
345
- DragDropBlank.propTypes = {
346
- id: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
347
- disabled: _propTypes["default"].bool,
348
- duplicates: _propTypes["default"].bool,
349
- choice: _propTypes["default"].object,
350
- correct: _propTypes["default"].bool,
351
- onChange: _propTypes["default"].func,
352
- emptyResponseAreaWidth: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
353
- emptyResponseAreaHeight: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
354
- instanceId: _propTypes["default"].string
355
- };
356
- var _default = exports["default"] = DragDropBlank;
357
- //# sourceMappingURL=blank.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"blank.js","names":["_react","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_mathRendering","_debug","_core","_utilities","_styles","_Chip","_classnames","_renderUi","_colors","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","_typeof","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ownKeys","keys","getOwnPropertySymbols","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","log","debug","StyledContent","styled","_ref","dragged","over","border","concat","color","primary","minWidth","touchAction","overflow","whiteSpace","opacity","StyledChip","Chip","backgroundColor","background","text","fontSize","maxWidth","position","borderRadius","grey","correct","incorrect","StyledChipLabel","pointerEvents","display","padding","marginTop","marginBottom","left","BlankContent","_ref2","_dragItem$choice","_frozenRef$current","_frozenRef$current2","disabled","choice","isOver","isDragging","dragItem","emptyResponseAreaWidth","emptyResponseAreaHeight","rootRef","useRef","spanRef","frozenRef","_useState","useState","height","width","_useState2","_slicedToArray2","dimensions","setDimensions","handleImageLoad","updateDimensions","handleElements","_spanRef$current","imageElement","current","querySelector","onload","setTimeout","style","offsetWidth","offsetHeight","widthWithPadding","heightWithPadding","responseAreaWidth","parseFloat","responseAreaHeight","adjustedWidth","adjustedHeight","prevState","getRootDimensions","isNaN","rootStyle","minHeight","useEffect","renderMath","value","draggedLabel","label","createElement","clickable","ref","component","Fragment","draggable","className","classnames","hidden","dangerouslySetInnerHTML","__html","parentOver","undefined","variant","defaultProps","propTypes","id","PropTypes","oneOfType","string","number","bool","duplicates","object","onChange","func","instanceId","DragDropBlank","_ref3","_dragItem$data","_useDraggable","useDraggable","data","fromChoice","type","dragAttributes","attributes","dragListeners","listeners","setDragNodeRef","setNodeRef","transform","_useDroppable","useDroppable","accepts","setDropNodeRef","active","node","CSS","Translate","toString","_extends2","_default","exports"],"sources":["../../src/components/blank.jsx"],"sourcesContent":["import React, { useRef, useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport debug from 'debug';\nimport { useDraggable, useDroppable } from '@dnd-kit/core';\nimport { CSS } from '@dnd-kit/utilities';\nimport { styled } from '@mui/material/styles';\nimport Chip from '@mui/material/Chip';\nimport classnames from 'classnames';\nimport { color } from '@pie-lib/render-ui';\nimport { grey } from '@mui/material/colors';\n\nconst log = debug('pie-lib:mask-markup:blank');\n\nconst StyledContent = styled('span')(({ dragged, over }) => ({\n border: `solid 0px ${color.primary()}`,\n minWidth: '200px',\n touchAction: 'none',\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n opacity: 1,\n ...(over && {\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n }),\n ...(dragged && {\n opacity: 0.5,\n }),\n}));\n\nconst StyledChip = styled(Chip)(() => ({\n backgroundColor: color.background(),\n border: `2px dashed ${color.text()}`,\n color: color.text(),\n fontSize: 'inherit',\n maxWidth: '374px',\n position: 'relative',\n borderRadius: '3px',\n '&.over': {\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n },\n '&.parentOver': {\n border: `1px solid ${grey[500]}`,\n backgroundColor: `${grey[300]}`,\n },\n '&.correct': {\n border: `solid 1px ${color.correct()}`,\n },\n '&.incorrect': {\n border: `solid 1px ${color.incorrect()}`,\n },\n '&.Mui-disabled': {\n opacity: 1,\n },\n}));\n\nconst StyledChipLabel = styled('span')(() => ({\n whiteSpace: 'normal',\n // Added for touch devices, for image content.\n // This will prevent the context menu from appearing and not allowing other interactions with the image.\n // If interactions with the image in the token will be requested we should handle only the context Menu.\n pointerEvents: 'none',\n '& img': {\n display: 'block',\n padding: '2px 0',\n },\n // Remove default <p> margins to ensure consistent spacing across all wrapped content (p, span, div, math)\n // Padding for top and bottom will instead be controlled by the container for consistent layout\n // Ensures consistent behavior with pie-api-browser, where marginTop is already removed by a Bootstrap stylesheet\n '& p': {\n marginTop: '0',\n marginBottom: '0',\n },\n '& mjx-frac': {\n fontSize: '120% !important',\n },\n '&.over': {\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n },\n '&.hidden': {\n color: 'transparent',\n opacity: 0,\n },\n '&.dragged': {\n position: 'absolute',\n left: 16,\n maxWidth: '60px',\n },\n}));\n\nfunction BlankContent({\n disabled,\n choice,\n isOver,\n isDragging,\n dragItem,\n correct,\n emptyResponseAreaWidth,\n emptyResponseAreaHeight,\n}) {\n const rootRef = useRef(null);\n const spanRef = useRef(null);\n const frozenRef = useRef(null); // to use during dragging to prevent flickering\n const [dimensions, setDimensions] = useState({ height: 0, width: 0 });\n\n const handleImageLoad = () => {\n updateDimensions();\n };\n\n const handleElements = () => {\n const imageElement = spanRef.current?.querySelector('img');\n if (imageElement) {\n imageElement.onload = handleImageLoad;\n } else {\n setTimeout(() => {\n updateDimensions();\n }, 300);\n }\n };\n\n const updateDimensions = () => {\n if (spanRef.current && rootRef.current) {\n // Temporarily set rootRef width to 'auto' for natural measurement\n rootRef.current.style.width = 'auto';\n\n // Get the natural dimensions of the content\n const width = spanRef.current.offsetWidth || 0;\n const height = spanRef.current.offsetHeight || 0;\n\n const widthWithPadding = width + 24; // 12px padding on each side\n const heightWithPadding = height + 24; // 12px padding on top and bottom\n\n const responseAreaWidth = parseFloat(emptyResponseAreaWidth) || 0;\n const responseAreaHeight = parseFloat(emptyResponseAreaHeight) || 0;\n\n const adjustedWidth = widthWithPadding <= responseAreaWidth ? responseAreaWidth : widthWithPadding;\n const adjustedHeight = heightWithPadding <= responseAreaHeight ? responseAreaHeight : heightWithPadding;\n\n setDimensions((prevState) => ({\n width: adjustedWidth > responseAreaWidth ? adjustedWidth : prevState.width,\n height: adjustedHeight > responseAreaHeight ? adjustedHeight : prevState.height,\n }));\n\n rootRef.current.style.width = `${adjustedWidth}px`;\n rootRef.current.style.height = `${adjustedHeight}px`;\n }\n };\n\n const getRootDimensions = () => {\n // Handle potential non-numeric values\n const responseAreaWidth = !isNaN(parseFloat(emptyResponseAreaWidth)) ? parseFloat(emptyResponseAreaWidth) : 0;\n const responseAreaHeight = !isNaN(parseFloat(emptyResponseAreaHeight)) ? parseFloat(emptyResponseAreaHeight) : 0;\n\n const rootStyle = {\n height: dimensions.height || responseAreaHeight,\n width: dimensions.width || responseAreaWidth,\n };\n\n // add minWidth, minHeight if width and height are not defined\n return {\n ...rootStyle,\n ...(responseAreaWidth ? {} : { minWidth: 90 }),\n ...(responseAreaHeight ? {} : { minHeight: 32 }),\n };\n };\n\n useEffect(() => {\n handleElements();\n }, []);\n\n // Render math for the placeholder/preview when dragging over\n useEffect(() => {\n if (rootRef.current) {\n renderMath(rootRef.current);\n }\n }, [isOver, dragItem?.choice?.value]);\n\n useEffect(() => {\n if (!choice) {\n setDimensions({ height: 0, width: 0 });\n return;\n }\n handleElements();\n }, [choice]);\n\n useEffect(() => {\n if (!isOver && !isDragging) {\n frozenRef.current = {\n width: rootRef.current.offsetWidth,\n height: rootRef.current.offsetHeight,\n };\n }\n }, [choice, isOver, isDragging]);\n\n const draggedLabel = dragItem && isOver && dragItem.choice && dragItem.choice.value;\n const label = choice && choice.value;\n const style =\n isOver || isDragging\n ? {\n width: frozenRef.current?.width,\n height: frozenRef.current?.height,\n }\n : getRootDimensions();\n\n return (\n <StyledChip\n clickable={false}\n disabled={disabled}\n ref={rootRef}\n component=\"span\"\n label={\n <React.Fragment>\n <StyledChipLabel\n ref={spanRef}\n draggable={true}\n className={classnames({\n over: isOver,\n hidden: draggedLabel,\n })}\n dangerouslySetInnerHTML={{ __html: label || '' }}\n />\n {draggedLabel && (\n <StyledChipLabel\n draggable={true}\n className={classnames({\n over: isOver,\n dragged: true,\n })}\n dangerouslySetInnerHTML={{ __html: draggedLabel || '' }}\n />\n )}\n </React.Fragment>\n }\n className={classnames({\n over: isOver,\n parentOver: isOver,\n correct: correct !== undefined && correct,\n incorrect: correct !== undefined && !correct,\n })}\n variant={disabled ? 'outlined' : undefined}\n style={style}\n />\n );\n}\n\nBlankContent.defaultProps = {\n emptyResponseAreaWidth: 0,\n emptyResponseAreaHeight: 0,\n};\n\nBlankContent.propTypes = {\n id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n disabled: PropTypes.bool,\n duplicates: PropTypes.bool,\n choice: PropTypes.object,\n isOver: PropTypes.bool,\n dragItem: PropTypes.object,\n correct: PropTypes.bool,\n onChange: PropTypes.func,\n emptyResponseAreaWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n emptyResponseAreaHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n instanceId: PropTypes.string,\n};\n\n// New functional component using @dnd-kit hooks\nfunction DragDropBlank({\n id,\n disabled,\n duplicates,\n choice,\n correct,\n onChange,\n emptyResponseAreaWidth,\n emptyResponseAreaHeight,\n instanceId,\n}) {\n // Setup draggable functionality\n const {\n attributes: dragAttributes,\n listeners: dragListeners,\n setNodeRef: setDragNodeRef,\n transform,\n isDragging,\n } = useDraggable({\n id: `mask-blank-drag-${id}`,\n disabled: disabled || !choice,\n data: {\n id: id,\n choice: choice,\n instanceId: instanceId,\n fromChoice: false, // This is from a blank, not from choices\n type: 'MaskBlank',\n },\n });\n\n // Setup droppable functionality\n const { setNodeRef: setDropNodeRef, isOver, active: dragItem } = useDroppable({\n id: `mask-blank-drop-${id}`,\n data: {\n id: id,\n accepts: ['MaskBlank'],\n instanceId: instanceId,\n },\n });\n\n // Combine refs for both drag and drop\n const setNodeRef = (node) => {\n setDragNodeRef(node);\n setDropNodeRef(node);\n };\n\n const style = {\n transform: CSS.Translate.toString(transform),\n };\n\n return (\n <StyledContent\n ref={setNodeRef}\n style={style}\n dragged={isDragging}\n over={isOver}\n {...dragAttributes}\n {...dragListeners}\n >\n <BlankContent\n id={id}\n disabled={disabled}\n duplicates={duplicates}\n choice={choice}\n isOver={isOver}\n dragItem={dragItem?.data?.current}\n correct={correct}\n onChange={onChange}\n emptyResponseAreaWidth={emptyResponseAreaWidth}\n emptyResponseAreaHeight={emptyResponseAreaHeight}\n instanceId={instanceId}\n />\n </StyledContent>\n );\n}\n\nDragDropBlank.defaultProps = {\n emptyResponseAreaWidth: 0,\n emptyResponseAreaHeight: 0,\n};\n\nDragDropBlank.propTypes = {\n id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n disabled: PropTypes.bool,\n duplicates: PropTypes.bool,\n choice: PropTypes.object,\n correct: PropTypes.bool,\n onChange: PropTypes.func,\n emptyResponseAreaWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n emptyResponseAreaHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n instanceId: PropTypes.string,\n};\n\nexport default DragDropBlank;\n"],"mappings":"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","ignoreList":[]}
@@ -1,94 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports["default"] = void 0;
8
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
9
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
10
- var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
11
- var _react = _interopRequireDefault(require("react"));
12
- var _OutlinedInput = _interopRequireDefault(require("@mui/material/OutlinedInput"));
13
- var _classnames2 = _interopRequireDefault(require("classnames"));
14
- var _styles = require("@mui/material/styles");
15
- var _renderUi = require("@pie-lib/render-ui");
16
- var _excluded = ["correct", "charactersLimit", "disabled", "isBox", "isConstructedResponse", "width", "spellCheck"];
17
- var StyledOutlinedInput = (0, _styles.styled)(_OutlinedInput["default"])(function () {
18
- return {
19
- padding: '2px',
20
- borderRadius: '4px',
21
- fontSize: 'inherit',
22
- display: 'inline-block',
23
- verticalAlign: 'middle',
24
- '& fieldset': {
25
- border: 0
26
- },
27
- '& .MuiOutlinedInput-input': {
28
- color: _renderUi.color.text(),
29
- backgroundColor: _renderUi.color.background(),
30
- borderRadius: '4px !important',
31
- borderWidth: '1px',
32
- borderStyle: 'solid',
33
- padding: '10px 20px 10px 10px',
34
- '&:disabled': {
35
- opacity: 0.8,
36
- cursor: 'not-allowed !important'
37
- },
38
- '&:hover': {
39
- borderColor: _renderUi.color.primary(),
40
- '&:disabled': {
41
- borderColor: 'initial'
42
- }
43
- },
44
- '&.Mui-focused': {
45
- borderColor: _renderUi.color.primaryDark()
46
- },
47
- '&.crInput': {
48
- padding: '8px !important'
49
- },
50
- '&.correct': {
51
- borderColor: "".concat(_renderUi.color.correct(), " !important")
52
- },
53
- '&.incorrect': {
54
- borderColor: "".concat(_renderUi.color.incorrect(), " !important")
55
- }
56
- }
57
- };
58
- });
59
- var CorrectInput = function CorrectInput(props) {
60
- var correct = props.correct,
61
- charactersLimit = props.charactersLimit,
62
- disabled = props.disabled,
63
- isBox = props.isBox,
64
- isConstructedResponse = props.isConstructedResponse,
65
- width = props.width,
66
- spellCheck = props.spellCheck,
67
- rest = (0, _objectWithoutProperties2["default"])(props, _excluded);
68
- var label = typeof correct === 'boolean' ? correct ? 'correct' : 'incorrect' : undefined;
69
- var inputProps = charactersLimit ? {
70
- maxLength: charactersLimit,
71
- 'aria-label': 'Enter answer'
72
- } : {
73
- 'aria-label': 'Enter answer'
74
- };
75
- if (width) {
76
- inputProps.style = {
77
- width: "".concat(width + Math.round(width / 10) + 1, "ch") // added some extra space for capital letters
78
- };
79
- }
80
- return /*#__PURE__*/_react["default"].createElement(StyledOutlinedInput, (0, _extends2["default"])({
81
- className: (0, _classnames2["default"])({
82
- disabledInput: disabled,
83
- box: isBox
84
- }),
85
- classes: {
86
- input: (0, _classnames2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, label, label), "crInput", isConstructedResponse))
87
- },
88
- inputProps: inputProps,
89
- disabled: disabled,
90
- spellCheck: spellCheck
91
- }, rest));
92
- };
93
- var _default = exports["default"] = CorrectInput;
94
- //# sourceMappingURL=correct-input.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"correct-input.js","names":["_react","_interopRequireDefault","require","_OutlinedInput","_classnames2","_styles","_renderUi","_excluded","StyledOutlinedInput","styled","OutlinedInput","padding","borderRadius","fontSize","display","verticalAlign","border","color","text","backgroundColor","background","borderWidth","borderStyle","opacity","cursor","borderColor","primary","primaryDark","concat","correct","incorrect","CorrectInput","props","charactersLimit","disabled","isBox","isConstructedResponse","width","spellCheck","rest","_objectWithoutProperties2","label","undefined","inputProps","maxLength","style","Math","round","createElement","_extends2","className","classnames","disabledInput","box","classes","input","_defineProperty2","_default","exports"],"sources":["../../src/components/correct-input.jsx"],"sourcesContent":["import React from 'react';\nimport OutlinedInput from '@mui/material/OutlinedInput';\nimport classnames from 'classnames';\nimport { styled } from '@mui/material/styles';\nimport { color } from '@pie-lib/render-ui';\n\nconst StyledOutlinedInput = styled(OutlinedInput)(() => ({\n padding: '2px',\n borderRadius: '4px',\n fontSize: 'inherit',\n display: 'inline-block',\n verticalAlign: 'middle',\n '& fieldset': {\n border: 0,\n },\n '& .MuiOutlinedInput-input': {\n color: color.text(),\n backgroundColor: color.background(),\n borderRadius: '4px !important',\n borderWidth: '1px',\n borderStyle: 'solid',\n padding: '10px 20px 10px 10px',\n '&:disabled': {\n opacity: 0.8,\n cursor: 'not-allowed !important',\n },\n '&:hover': {\n borderColor: color.primary(),\n '&:disabled': {\n borderColor: 'initial',\n },\n },\n '&.Mui-focused': {\n borderColor: color.primaryDark(),\n },\n '&.crInput': {\n padding: '8px !important',\n },\n '&.correct': {\n borderColor: `${color.correct()} !important`,\n },\n '&.incorrect': {\n borderColor: `${color.incorrect()} !important`,\n },\n },\n}));\n\nconst CorrectInput = (props) => {\n const {\n correct,\n charactersLimit,\n disabled,\n isBox,\n isConstructedResponse,\n width,\n spellCheck,\n ...rest\n } = props;\n\n const label = typeof correct === 'boolean' ? (correct ? 'correct' : 'incorrect') : undefined;\n const inputProps = charactersLimit\n ? { maxLength: charactersLimit, 'aria-label': 'Enter answer' }\n : { 'aria-label': 'Enter answer' };\n\n if (width) {\n inputProps.style = {\n width: `${width + Math.round(width / 10) + 1}ch`, // added some extra space for capital letters\n };\n }\n\n return (\n <StyledOutlinedInput\n className={classnames({\n disabledInput: disabled,\n box: isBox,\n })}\n classes={{\n input: classnames({\n [label]: label,\n crInput: isConstructedResponse,\n }),\n }}\n inputProps={inputProps}\n disabled={disabled}\n spellCheck={spellCheck}\n {...rest}\n />\n );\n};\n\nexport default CorrectInput;\n\n"],"mappings":"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","ignoreList":[]}