@pie-element/explicit-constructed-response 7.6.6-next.15 → 7.6.6-next.17

package/configure/package.json

@@ -8,7 +8,7 @@
     "@material-ui/core": "^3.9.2",
     "@material-ui/icons": "^3.0.1",
     "@pie-framework/pie-configure-events": "^1.3.0",
-    "@pie-lib/pie-toolbox": "2.23.2",
+    "@pie-lib/pie-toolbox": "2.23.3",
     "classnames": "^2.2.6",
     "debug": "^3.1.0",
     "lodash": "^4.17.15",

package/controller/package.json

@@ -8,7 +8,7 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@pie-lib/pie-toolbox": "2.23.2",
+    "@pie-lib/pie-toolbox": "2.23.3",
     "debug": "^3.1.0",
     "he": "^1.2.0",
     "lodash": "^4.17.15",

package/module/configure.js

@@ -1,5 +1,5 @@
 import {_dll_react, _dll_prop_types, _dll_classnames, _dll_react_dom, _dll_lodash, _dll_debug} from "../../../@pie-lib/pie-toolbox-math-rendering-module@5.5.2/module/index.js";
-import {_dll_pie_lib__pie_toolbox_editable_html, _dll_pie_lib__pie_toolbox_config_ui} from "../../../@pie-lib/pie-toolbox-module@8.5.1/module/index.js";
+import {_dll_pie_lib__pie_toolbox_editable_html, _dll_pie_lib__pie_toolbox_config_ui} from "../../../@pie-lib/pie-toolbox-module@8.5.2/module/index.js";
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 function getDefaultExportFromCjs(x) {
   return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;

package/module/element.js

@@ -1,5 +1,5 @@
 import {_dll_react, _dll_prop_types, _dll_debug, _dll_lodash, _dll_react_dom_server, _dll_classnames, _dll_react_dom, _dll_pie_framework__mathquill, _dll_pie_lib__pie_toolbox_math_rendering} from "../../../@pie-lib/pie-toolbox-math-rendering-module@5.5.2/module/index.js";
-import {_dll_pie_lib__pie_toolbox_correct_answer_toggle, _dll_pie_lib__pie_toolbox_render_ui} from "../../../@pie-lib/pie-toolbox-module@8.5.1/module/index.js";
+import {_dll_pie_lib__pie_toolbox_correct_answer_toggle, _dll_pie_lib__pie_toolbox_render_ui} from "../../../@pie-lib/pie-toolbox-module@8.5.2/module/index.js";
 function _mergeNamespaces(n, m) {
   m.forEach(function (e) {
     e && typeof e !== 'string' && !Array.isArray(e) && Object.keys(e).forEach(function (k) {
@@ -149762,6 +149762,9 @@ const require$$16$1 = _dll_classnames;
       (0, _classCallCheck2["default"])(this, BlankContent);
       _this = _super.call(this, props);
       _this.handleClick = _this.handleClick.bind((0, _assertThisInitialized2["default"])(_this));
+      _this.state = {
+        hoveredElementSize: null
+      };
       return _this;
     }
     (0, _createClass2["default"])(BlankContent, [{
@@ -149782,21 +149785,46 @@ const require$$16$1 = _dll_classnames;
           this.elementRef.className = this.elementRef.contains(event.target) ? classes.selected : '';
         }
       }
+    }, {
+      key: "getSnapshotBeforeUpdate",
+      value: function getSnapshotBeforeUpdate(prevProps) {
+        if (!prevProps.isOver && this.props.isOver && this.elementRef) {
+          var node = this.elementRef;
+          return {
+            width: node.offsetWidth,
+            height: node.offsetHeight
+          };
+        }
+        return null;
+      }
     }, {
       key: "componentDidUpdate",
-      value: function componentDidUpdate() {
-        if (this.elementRef) {
+      value: function componentDidUpdate(prevProps, prevState, snapshot) {
+        if (this.elementRef && typeof _mathRendering.renderMath === 'function') {
           (0, _mathRendering.renderMath)(this.elementRef);
         }
+        if (snapshot && (!this.state.hoveredElementSize || this.state.hoveredElementSize.width !== snapshot.width || this.state.hoveredElementSize.height !== snapshot.height)) {
+          this.setState({
+            hoveredElementSize: snapshot
+          });
+          return;
+        }
+        if (prevProps.isOver && !this.props.isOver && this.state.hoveredElementSize) {
+          this.setState({
+            hoveredElementSize: null
+          });
+        }
       }
     }, {
       key: "render",
       value: function render() {
         var _this2 = this;
         var _this$props = this.props, n = _this$props.n, children = _this$props.children, isDragging = _this$props.isDragging, dragItem = _this$props.dragItem, isOver = _this$props.isOver, value = _this$props.value;
+        var hoveredElementSize = this.state.hoveredElementSize;
         var label = dragItem && isOver ? dragItem.value.value : value.value || "\xA0";
         var finalLabel = isDragging ? "\xA0" : label;
         var hasGrip = finalLabel !== "\xA0";
+        var isPreview = dragItem && isOver;
         return _react["default"].createElement("div", {
           ref: function ref(_ref) {
             return _this2.elementRef = _ref;
@@ -149805,13 +149833,15 @@ const require$$16$1 = _dll_classnames;
             display: 'inline-flex',
             minWidth: '178px',
             minHeight: '36px',
-            background: '#FFF',
-            border: '1px solid #C0C3CF',
+            background: isPreview ? ("").concat(_renderUi.color.defaults.BORDER_LIGHT) : ("").concat(_renderUi.color.defaults.WHITE),
+            border: isPreview ? ("1px solid  ").concat(_renderUi.color.defaults.BORDER_DARK) : ("1px solid  ").concat(_renderUi.color.defaults.BORDER_LIGHT),
             boxSizing: 'border-box',
             borderRadius: '3px',
             overflow: 'hidden',
             position: 'relative',
-            padding: '8px 8px 8px 35px'
+            padding: '8px 8px 8px 35px',
+            width: hoveredElementSize ? hoveredElementSize.width : undefined,
+            height: hoveredElementSize ? hoveredElementSize.height : undefined
           },
           "data-key": n.key,
           contentEditable: false
@@ -149873,7 +149903,9 @@ const require$$16$1 = _dll_classnames;
   var DropTile = (0, _drag.DropTarget)('drag-in-the-blank-choice', tileTarget, function (connect, monitor) {
     return {
       connectDropTarget: connect.dropTarget(),
-      isOver: monitor.isOver(),
+      isOver: monitor.isOver({
+        shallow: true
+      }),
       dragItem: monitor.getItem()
     };
   })(connectedBlankContent);
@@ -155560,14 +155592,18 @@ const require$$19 = _dll_classnames;
             visibility: 'hidden',
             top: 0,
             left: 0
-          }
+          },
+          tabIndex: -1,
+          "aria-hidden": "true"
         }, (choices || []).map(function (c, index) {
           return _react["default"].createElement(_MenuItem["default"], {
             key: index,
             classes: {
               root: classes.menuRoot,
               selected: classes.selected
-            }
+            },
+            tabIndex: -1,
+            "aria-hidden": "true"
           }, _react["default"].createElement("span", {
             className: classes.label,
             dangerouslySetInnerHTML: {
@@ -155576,7 +155612,9 @@ const require$$19 = _dll_classnames;
           }));
         })), _react["default"].createElement(_InputLabel["default"], {
           className: classes.srOnly,
-          id: labelId
+          id: labelId,
+          tabIndex: -1,
+          "aria-hidden": "true"
         }, labelText), _react["default"].createElement(_Button["default"], {
           ref: this.buttonRef,
           style: _objectSpread(_objectSpread({}, this.state.menuWidth && ({

package/module/manifest.json

@@ -8,7 +8,7 @@
     },
     {
       "name": "@pie-lib/pie-toolbox-module",
-      "version": "8.5.1"
+      "version": "8.5.2"
     }
   ]
 }

package/module/print.js

@@ -1,5 +1,5 @@
 import {_dll_react, _dll_prop_types, _dll_debug, _dll_lodash, _dll_react_dom_server, _dll_classnames, _dll_react_dom, _dll_pie_framework__mathquill, _dll_pie_lib__pie_toolbox_math_rendering} from "../../../@pie-lib/pie-toolbox-math-rendering-module@5.5.2/module/index.js";
-import {_dll_pie_lib__pie_toolbox_correct_answer_toggle, _dll_pie_lib__pie_toolbox_render_ui} from "../../../@pie-lib/pie-toolbox-module@8.5.1/module/index.js";
+import {_dll_pie_lib__pie_toolbox_correct_answer_toggle, _dll_pie_lib__pie_toolbox_render_ui} from "../../../@pie-lib/pie-toolbox-module@8.5.2/module/index.js";
 function _mergeNamespaces(n, m) {
   m.forEach(function (e) {
     e && typeof e !== 'string' && !Array.isArray(e) && Object.keys(e).forEach(function (k) {
@@ -149725,6 +149725,9 @@ const require$$16$1 = _dll_classnames;
       (0, _classCallCheck2["default"])(this, BlankContent);
       _this = _super.call(this, props);
       _this.handleClick = _this.handleClick.bind((0, _assertThisInitialized2["default"])(_this));
+      _this.state = {
+        hoveredElementSize: null
+      };
       return _this;
     }
     (0, _createClass2["default"])(BlankContent, [{
@@ -149745,21 +149748,46 @@ const require$$16$1 = _dll_classnames;
           this.elementRef.className = this.elementRef.contains(event.target) ? classes.selected : '';
         }
       }
+    }, {
+      key: "getSnapshotBeforeUpdate",
+      value: function getSnapshotBeforeUpdate(prevProps) {
+        if (!prevProps.isOver && this.props.isOver && this.elementRef) {
+          var node = this.elementRef;
+          return {
+            width: node.offsetWidth,
+            height: node.offsetHeight
+          };
+        }
+        return null;
+      }
     }, {
       key: "componentDidUpdate",
-      value: function componentDidUpdate() {
-        if (this.elementRef) {
+      value: function componentDidUpdate(prevProps, prevState, snapshot) {
+        if (this.elementRef && typeof _mathRendering.renderMath === 'function') {
           (0, _mathRendering.renderMath)(this.elementRef);
         }
+        if (snapshot && (!this.state.hoveredElementSize || this.state.hoveredElementSize.width !== snapshot.width || this.state.hoveredElementSize.height !== snapshot.height)) {
+          this.setState({
+            hoveredElementSize: snapshot
+          });
+          return;
+        }
+        if (prevProps.isOver && !this.props.isOver && this.state.hoveredElementSize) {
+          this.setState({
+            hoveredElementSize: null
+          });
+        }
       }
     }, {
       key: "render",
       value: function render() {
         var _this2 = this;
         var _this$props = this.props, n = _this$props.n, children = _this$props.children, isDragging = _this$props.isDragging, dragItem = _this$props.dragItem, isOver = _this$props.isOver, value = _this$props.value;
+        var hoveredElementSize = this.state.hoveredElementSize;
         var label = dragItem && isOver ? dragItem.value.value : value.value || "\xA0";
         var finalLabel = isDragging ? "\xA0" : label;
         var hasGrip = finalLabel !== "\xA0";
+        var isPreview = dragItem && isOver;
         return _react["default"].createElement("div", {
           ref: function ref(_ref) {
             return _this2.elementRef = _ref;
@@ -149768,13 +149796,15 @@ const require$$16$1 = _dll_classnames;
             display: 'inline-flex',
             minWidth: '178px',
             minHeight: '36px',
-            background: '#FFF',
-            border: '1px solid #C0C3CF',
+            background: isPreview ? ("").concat(_renderUi.color.defaults.BORDER_LIGHT) : ("").concat(_renderUi.color.defaults.WHITE),
+            border: isPreview ? ("1px solid  ").concat(_renderUi.color.defaults.BORDER_DARK) : ("1px solid  ").concat(_renderUi.color.defaults.BORDER_LIGHT),
             boxSizing: 'border-box',
             borderRadius: '3px',
             overflow: 'hidden',
             position: 'relative',
-            padding: '8px 8px 8px 35px'
+            padding: '8px 8px 8px 35px',
+            width: hoveredElementSize ? hoveredElementSize.width : undefined,
+            height: hoveredElementSize ? hoveredElementSize.height : undefined
           },
           "data-key": n.key,
           contentEditable: false
@@ -149836,7 +149866,9 @@ const require$$16$1 = _dll_classnames;
   var DropTile = (0, _drag.DropTarget)('drag-in-the-blank-choice', tileTarget, function (connect, monitor) {
     return {
       connectDropTarget: connect.dropTarget(),
-      isOver: monitor.isOver(),
+      isOver: monitor.isOver({
+        shallow: true
+      }),
       dragItem: monitor.getItem()
     };
   })(connectedBlankContent);
@@ -155523,14 +155555,18 @@ const require$$19 = _dll_classnames;
             visibility: 'hidden',
             top: 0,
             left: 0
-          }
+          },
+          tabIndex: -1,
+          "aria-hidden": "true"
         }, (choices || []).map(function (c, index) {
           return _react["default"].createElement(_MenuItem["default"], {
             key: index,
             classes: {
               root: classes.menuRoot,
               selected: classes.selected
-            }
+            },
+            tabIndex: -1,
+            "aria-hidden": "true"
           }, _react["default"].createElement("span", {
             className: classes.label,
             dangerouslySetInnerHTML: {
@@ -155539,7 +155575,9 @@ const require$$19 = _dll_classnames;
           }));
         })), _react["default"].createElement(_InputLabel["default"], {
           className: classes.srOnly,
-          id: labelId
+          id: labelId,
+          tabIndex: -1,
+          "aria-hidden": "true"
         }, labelText), _react["default"].createElement(_Button["default"], {
           ref: this.buttonRef,
           style: _objectSpread(_objectSpread({}, this.state.menuWidth && ({

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "repository": "pie-framework/pie-elements",
-  "version": "7.6.6-next.15+e7330e746",
+  "version": "7.6.6-next.17+fe5bbd145",
   "description": "",
   "scripts": {
     "postpublish": "../../scripts/postpublish"
@@ -12,7 +12,7 @@
   "dependencies": {
     "@material-ui/core": "^3.9.2",
     "@pie-framework/pie-player-events": "^0.1.0",
-    "@pie-lib/pie-toolbox": "2.23.2",
+    "@pie-lib/pie-toolbox": "2.23.3",
     "classnames": "^2.2.5",
     "he": "^1.2.0",
     "lodash": "^4.17.10",
@@ -22,7 +22,7 @@
   },
   "author": "",
   "license": "ISC",
-  "gitHead": "e7330e746f2a1695f3e96d0647dd7cde82043b8e",
+  "gitHead": "fe5bbd1455a83f8d2a97029ec86ffce85e8a5e59",
   "main": "lib/index.js",
   "module": "src/index.js",
   "exports": {