@pie-element/explicit-constructed-response 7.3.7-next.7 → 7.3.7

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [7.3.7](https://github.com/pie-framework/pie-elements/compare/@pie-element/explicit-constructed-response@7.3.6...@pie-element/explicit-constructed-response@7.3.7) (2025-03-13)
+
+
+### Bug Fixes
+
+* update pie-lib/pie-toolbox PD-4872, PD-4093, PD-4588, PD-4812, PD-4867 ([2386fb5](https://github.com/pie-framework/pie-elements/commit/2386fb5f84cadb42305ab5a0e6248bd2b2279e0a))
+
+
+
+
+
 ## [7.3.6](https://github.com/pie-framework/pie-elements/compare/@pie-element/explicit-constructed-response@7.3.5...@pie-element/explicit-constructed-response@7.3.6) (2025-03-03)
 
 

package/configure/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [7.2.7](https://github.com/pie-framework/pie-elements/compare/@pie-element/explicit-constructed-response-configure@7.2.6...@pie-element/explicit-constructed-response-configure@7.2.7) (2025-03-13)
+
+
+### Bug Fixes
+
+* update pie-lib/pie-toolbox PD-4872, PD-4093, PD-4588, PD-4812, PD-4867 ([2386fb5](https://github.com/pie-framework/pie-elements/commit/2386fb5f84cadb42305ab5a0e6248bd2b2279e0a))
+
+
+
+
+
 ## [7.2.6](https://github.com/pie-framework/pie-elements/compare/@pie-element/explicit-constructed-response-configure@7.2.5...@pie-element/explicit-constructed-response-configure@7.2.6) (2025-03-03)
 
 

package/configure/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pie-element/explicit-constructed-response-configure",
-  "version": "7.2.6",
+  "version": "7.2.7",
   "private": true,
   "main": "lib/index.js",
   "modue": "src/index.js",
@@ -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.10.0",
+    "@pie-lib/pie-toolbox": "2.10.1",
     "classnames": "^2.2.6",
     "debug": "^3.1.0",
     "lodash": "^4.17.15",

package/controller/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [5.1.18](https://github.com/pie-framework/pie-elements/compare/@pie-element/explicit-constructed-response-controller@5.1.17...@pie-element/explicit-constructed-response-controller@5.1.18) (2025-03-13)
+
+
+### Bug Fixes
+
+* update pie-lib/pie-toolbox PD-4872, PD-4093, PD-4588, PD-4812, PD-4867 ([2386fb5](https://github.com/pie-framework/pie-elements/commit/2386fb5f84cadb42305ab5a0e6248bd2b2279e0a))
+
+
+
+
+
 ## [5.1.17](https://github.com/pie-framework/pie-elements/compare/@pie-element/explicit-constructed-response-controller@5.1.16...@pie-element/explicit-constructed-response-controller@5.1.17) (2025-03-03)
 
 

package/controller/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@pie-element/explicit-constructed-response-controller",
   "private": true,
-  "version": "5.1.17",
+  "version": "5.1.18",
   "description": "",
   "main": "lib/index.js",
   "module": "src/index.js",
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@pie-lib/pie-toolbox": "2.10.0",
+    "@pie-lib/pie-toolbox": "2.10.1",
     "debug": "^3.1.0",
     "lodash": "^4.17.15",
     "type-of": "^2.0.1"

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@3.3.5/module/index.js";
-import {_dll_pie_lib__pie_toolbox_editable_html, _dll_pie_lib__pie_toolbox_config_ui} from "../../../@pie-lib/pie-toolbox-module@5.10.5/module/index.js";
+import {_dll_react, _dll_prop_types, _dll_classnames, _dll_react_dom, _dll_lodash, _dll_debug} from "../../../@pie-lib/pie-toolbox-math-rendering-module@3.4.0/module/index.js";
+import {_dll_pie_lib__pie_toolbox_editable_html, _dll_pie_lib__pie_toolbox_config_ui} from "../../../@pie-lib/pie-toolbox-module@5.11.0/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@3.3.5/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@5.10.5/module/index.js";
+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@3.4.0/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@5.11.0/module/index.js";
 function _mergeNamespaces(n, m) {
   m.forEach(function (e) {
     e && typeof e !== 'string' && !Array.isArray(e) && Object.keys(e).forEach(function (k) {
@@ -19166,7 +19166,7 @@ const require$$14$5 = _dll_classnames;
     return {
       spacer: {
         display: 'inline-block',
-        width: '1.5em'
+        width: '.75em'
       }
     };
   })(function (props) {
@@ -19193,7 +19193,7 @@ const require$$14$5 = _dll_classnames;
     }
     return null;
   };
-  var renderChildren = function renderChildren(layout, value, onChange, rootRenderChildren, parentNode) {
+  var renderChildren = function renderChildren(layout, value, onChange, rootRenderChildren, parentNode, elementType) {
     if (!value) {
       return null;
     }
@@ -19212,7 +19212,7 @@ const require$$14$5 = _dll_classnames;
         var c = rootRenderChildren(n, value, onChange);
         if (c) {
           children.push(c);
-          if ((parentNode === null || parentNode === void 0 ? void 0 : parentNode.type) !== 'td') {
+          if ((parentNode === null || parentNode === void 0 ? void 0 : parentNode.type) !== 'td' && elementType === 'drag-in-the-blank') {
             children.push(_react["default"].createElement(Spacer, {
               key: ("spacer-").concat(index)
             }));
@@ -19240,9 +19240,14 @@ const require$$14$5 = _dll_classnames;
           }
         } else if (content.length > 0) {
           children.push(content);
+          if ((parentNode === null || parentNode === void 0 ? void 0 : parentNode.type) !== 'td' && elementType === 'drag-in-the-blank') {
+            children.push(_react["default"].createElement(Spacer, {
+              key: ("spacer-").concat(index)
+            }));
+          }
         }
       } else {
-        var subNodes = renderChildren(n, value, onChange, rootRenderChildren, n);
+        var subNodes = renderChildren(n, value, onChange, rootRenderChildren, n, elementType);
         if (n.type === 'p' || n.type === 'paragraph') {
           children.push(_react["default"].createElement(Paragraph, {
             key: key
@@ -19303,8 +19308,8 @@ const require$$14$5 = _dll_classnames;
     (0, _createClass2["default"])(Mask, [{
       key: "render",
       value: function render() {
-        var _this$props = this.props, value = _this$props.value, layout = _this$props.layout;
-        var children = renderChildren(layout, value, this.handleChange, this.props.renderChildren);
+        var _this$props = this.props, value = _this$props.value, layout = _this$props.layout, elementType = _this$props.elementType;
+        var children = renderChildren(layout, value, this.handleChange, this.props.renderChildren, null, elementType);
         return _react["default"].createElement(MaskContainer, null, children);
       }
     }]);
@@ -19315,7 +19320,8 @@ const require$$14$5 = _dll_classnames;
     renderChildren: _propTypes["default"].func,
     layout: _propTypes["default"].object,
     value: _propTypes["default"].object,
-    onChange: _propTypes["default"].func
+    onChange: _propTypes["default"].func,
+    elementType: _propTypes["default"].string
   });
 })(mask);
 getDefaultExportFromCjs(mask);
@@ -19421,9 +19427,10 @@ var withMask = function withMask(type, renderChildren) {
     }, {
       key: "render",
       value: function render() {
-        var _this$props = this.props, markup = _this$props.markup, layout = _this$props.layout, value = _this$props.value, onChange = _this$props.onChange;
+        var _this$props = this.props, markup = _this$props.markup, layout = _this$props.layout, value = _this$props.value, onChange = _this$props.onChange, elementType = _this$props.elementType;
         var maskLayout = layout ? layout : buildLayoutFromMarkup(markup, type);
         return _react$2M["default"].createElement(_mask["default"], {
+          elementType: elementType,
           layout: maskLayout,
           value: value,
           onChange: onChange,
@@ -139566,10 +139573,15 @@ const {omit: require$$13$7} = _dll_lodash;
     (0, _createClass2["default"])(UiLayout, [{
       key: "computeStyle",
       value: function computeStyle(fontSizeFactor) {
-        var rootFontSize = parseFloat(getComputedStyle(document.documentElement).fontSize);
-        return {
-          fontSize: ("").concat(rootFontSize * fontSizeFactor, "px")
+        var getFontSize = function getFontSize(element) {
+          return parseFloat(getComputedStyle(element).fontSize);
         };
+        var rootFontSize = getFontSize(document.documentElement);
+        var bodyFontSize = getFontSize(document.body);
+        var effectiveFontSize = Math.max(rootFontSize, bodyFontSize);
+        return fontSizeFactor !== 1 ? {
+          fontSize: ("").concat(effectiveFontSize * fontSizeFactor, "px")
+        } : null;
       }
     }, {
       key: "render",
@@ -139577,11 +139589,12 @@ const {omit: require$$13$7} = _dll_lodash;
         var _this$props = this.props, children = _this$props.children, className = _this$props.className, classes = _this$props.classes, fontSizeFactor = _this$props.fontSizeFactor, rest = (0, _objectWithoutProperties2["default"])(_this$props, _excluded);
         var finalClass = (0, _classnames["default"])(className, classes.extraCSSRules, classes.uiLayoutContainer);
         var restProps = (0, _omit["default"])(rest, 'extraCSSRules');
+        var style = this.computeStyle(fontSizeFactor);
         return _react["default"].createElement("div", (0, _extends2["default"])({
           className: finalClass
-        }, restProps, {
-          style: this.computeStyle(fontSizeFactor)
-        }), children);
+        }, restProps, style && ({
+          style: style
+        })), children);
       }
     }]);
     return UiLayout;
@@ -145387,6 +145400,7 @@ const require$$9$C = _dll_prop_types;
           value: value,
           disabled: disabled
         }), _react["default"].createElement(Masked, {
+          elementType: 'drag-in-the-blank',
           markup: markup,
           layout: layout,
           value: value,
@@ -175509,6 +175523,7 @@ const require$$3$6 = _dll_prop_types;
     return _react["default"].createElement("span", (0, _extends2["default"])({}, attributes, {
       style: {
         display: 'inline-flex',
+        visibility: props.isFocused ? 'hidden' : 'visible',
         minHeight: '55px',
         minWidth: '178px',
         position: 'relative',
@@ -175536,7 +175551,8 @@ const require$$3$6 = _dll_prop_types;
   ExplicitConstructedResponse.propTypes = {
     attributes: _propTypes["default"].object,
     error: _propTypes["default"].any,
-    value: _propTypes["default"].string
+    value: _propTypes["default"].string,
+    isFocused: _propTypes["default"].bool
   };
   var _default = ExplicitConstructedResponse;
   exports["default"] = _default;
@@ -175862,7 +175878,7 @@ const {isUndefined: require$$3$4} = _dll_lodash;
         onChange(change);
       },
       renderNode: function renderNode(props) {
-        var attributes = props.attributes, n = props.node;
+        var attributes = props.attributes, n = props.node, isFocused = props.isFocused;
         if (n.type === 'explicit_constructed_response') {
           var data = n.data.toJSON();
           var error;
@@ -175871,6 +175887,7 @@ const {isUndefined: require$$3$4} = _dll_lodash;
           }
           return _react["default"].createElement(_explicitConstructedResponse["default"], {
             attributes: attributes,
+            isFocused: isFocused,
             value: data.value,
             error: error && error[data.index] && error[data.index][0]
           });
@@ -180292,6 +180309,11 @@ const require$$21 = _dll_debug;
       },
       '& table:not([border="1"]) td, th': {
         border: '1px solid #dfe2e5'
+      },
+      '& > div::after': {
+        display: 'block',
+        content: '"¶"',
+        color: '#146EB3'
       }
     },
     toolbarOnTop: {

package/module/manifest.json

@@ -4,11 +4,11 @@
   "modules": [
     {
       "name": "@pie-lib/pie-toolbox-math-rendering-module",
-      "version": "3.3.5"
+      "version": "3.4.0"
     },
     {
       "name": "@pie-lib/pie-toolbox-module",
-      "version": "5.10.5"
+      "version": "5.11.0"
     }
   ]
 }

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@3.3.5/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@5.10.5/module/index.js";
+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@3.4.0/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@5.11.0/module/index.js";
 function _mergeNamespaces(n, m) {
   m.forEach(function (e) {
     e && typeof e !== 'string' && !Array.isArray(e) && Object.keys(e).forEach(function (k) {
@@ -19129,7 +19129,7 @@ const require$$14$5 = _dll_classnames;
     return {
       spacer: {
         display: 'inline-block',
-        width: '1.5em'
+        width: '.75em'
       }
     };
   })(function (props) {
@@ -19156,7 +19156,7 @@ const require$$14$5 = _dll_classnames;
     }
     return null;
   };
-  var renderChildren = function renderChildren(layout, value, onChange, rootRenderChildren, parentNode) {
+  var renderChildren = function renderChildren(layout, value, onChange, rootRenderChildren, parentNode, elementType) {
     if (!value) {
       return null;
     }
@@ -19175,7 +19175,7 @@ const require$$14$5 = _dll_classnames;
         var c = rootRenderChildren(n, value, onChange);
         if (c) {
           children.push(c);
-          if ((parentNode === null || parentNode === void 0 ? void 0 : parentNode.type) !== 'td') {
+          if ((parentNode === null || parentNode === void 0 ? void 0 : parentNode.type) !== 'td' && elementType === 'drag-in-the-blank') {
             children.push(_react["default"].createElement(Spacer, {
               key: ("spacer-").concat(index)
             }));
@@ -19203,9 +19203,14 @@ const require$$14$5 = _dll_classnames;
           }
         } else if (content.length > 0) {
           children.push(content);
+          if ((parentNode === null || parentNode === void 0 ? void 0 : parentNode.type) !== 'td' && elementType === 'drag-in-the-blank') {
+            children.push(_react["default"].createElement(Spacer, {
+              key: ("spacer-").concat(index)
+            }));
+          }
         }
       } else {
-        var subNodes = renderChildren(n, value, onChange, rootRenderChildren, n);
+        var subNodes = renderChildren(n, value, onChange, rootRenderChildren, n, elementType);
         if (n.type === 'p' || n.type === 'paragraph') {
           children.push(_react["default"].createElement(Paragraph, {
             key: key
@@ -19266,8 +19271,8 @@ const require$$14$5 = _dll_classnames;
     (0, _createClass2["default"])(Mask, [{
       key: "render",
       value: function render() {
-        var _this$props = this.props, value = _this$props.value, layout = _this$props.layout;
-        var children = renderChildren(layout, value, this.handleChange, this.props.renderChildren);
+        var _this$props = this.props, value = _this$props.value, layout = _this$props.layout, elementType = _this$props.elementType;
+        var children = renderChildren(layout, value, this.handleChange, this.props.renderChildren, null, elementType);
         return _react["default"].createElement(MaskContainer, null, children);
       }
     }]);
@@ -19278,7 +19283,8 @@ const require$$14$5 = _dll_classnames;
     renderChildren: _propTypes["default"].func,
     layout: _propTypes["default"].object,
     value: _propTypes["default"].object,
-    onChange: _propTypes["default"].func
+    onChange: _propTypes["default"].func,
+    elementType: _propTypes["default"].string
   });
 })(mask);
 getDefaultExportFromCjs(mask);
@@ -19384,9 +19390,10 @@ var withMask = function withMask(type, renderChildren) {
     }, {
       key: "render",
       value: function render() {
-        var _this$props = this.props, markup = _this$props.markup, layout = _this$props.layout, value = _this$props.value, onChange = _this$props.onChange;
+        var _this$props = this.props, markup = _this$props.markup, layout = _this$props.layout, value = _this$props.value, onChange = _this$props.onChange, elementType = _this$props.elementType;
         var maskLayout = layout ? layout : buildLayoutFromMarkup(markup, type);
         return _react$2M["default"].createElement(_mask["default"], {
+          elementType: elementType,
           layout: maskLayout,
           value: value,
           onChange: onChange,
@@ -139529,10 +139536,15 @@ const {omit: require$$13$7} = _dll_lodash;
     (0, _createClass2["default"])(UiLayout, [{
       key: "computeStyle",
       value: function computeStyle(fontSizeFactor) {
-        var rootFontSize = parseFloat(getComputedStyle(document.documentElement).fontSize);
-        return {
-          fontSize: ("").concat(rootFontSize * fontSizeFactor, "px")
+        var getFontSize = function getFontSize(element) {
+          return parseFloat(getComputedStyle(element).fontSize);
         };
+        var rootFontSize = getFontSize(document.documentElement);
+        var bodyFontSize = getFontSize(document.body);
+        var effectiveFontSize = Math.max(rootFontSize, bodyFontSize);
+        return fontSizeFactor !== 1 ? {
+          fontSize: ("").concat(effectiveFontSize * fontSizeFactor, "px")
+        } : null;
       }
     }, {
       key: "render",
@@ -139540,11 +139552,12 @@ const {omit: require$$13$7} = _dll_lodash;
         var _this$props = this.props, children = _this$props.children, className = _this$props.className, classes = _this$props.classes, fontSizeFactor = _this$props.fontSizeFactor, rest = (0, _objectWithoutProperties2["default"])(_this$props, _excluded);
         var finalClass = (0, _classnames["default"])(className, classes.extraCSSRules, classes.uiLayoutContainer);
         var restProps = (0, _omit["default"])(rest, 'extraCSSRules');
+        var style = this.computeStyle(fontSizeFactor);
         return _react["default"].createElement("div", (0, _extends2["default"])({
           className: finalClass
-        }, restProps, {
-          style: this.computeStyle(fontSizeFactor)
-        }), children);
+        }, restProps, style && ({
+          style: style
+        })), children);
       }
     }]);
     return UiLayout;
@@ -145350,6 +145363,7 @@ const require$$9$C = _dll_prop_types;
           value: value,
           disabled: disabled
         }), _react["default"].createElement(Masked, {
+          elementType: 'drag-in-the-blank',
           markup: markup,
           layout: layout,
           value: value,
@@ -175472,6 +175486,7 @@ const require$$3$6 = _dll_prop_types;
     return _react["default"].createElement("span", (0, _extends2["default"])({}, attributes, {
       style: {
         display: 'inline-flex',
+        visibility: props.isFocused ? 'hidden' : 'visible',
         minHeight: '55px',
         minWidth: '178px',
         position: 'relative',
@@ -175499,7 +175514,8 @@ const require$$3$6 = _dll_prop_types;
   ExplicitConstructedResponse.propTypes = {
     attributes: _propTypes["default"].object,
     error: _propTypes["default"].any,
-    value: _propTypes["default"].string
+    value: _propTypes["default"].string,
+    isFocused: _propTypes["default"].bool
   };
   var _default = ExplicitConstructedResponse;
   exports["default"] = _default;
@@ -175825,7 +175841,7 @@ const {isUndefined: require$$3$4} = _dll_lodash;
         onChange(change);
       },
       renderNode: function renderNode(props) {
-        var attributes = props.attributes, n = props.node;
+        var attributes = props.attributes, n = props.node, isFocused = props.isFocused;
         if (n.type === 'explicit_constructed_response') {
           var data = n.data.toJSON();
           var error;
@@ -175834,6 +175850,7 @@ const {isUndefined: require$$3$4} = _dll_lodash;
           }
           return _react["default"].createElement(_explicitConstructedResponse["default"], {
             attributes: attributes,
+            isFocused: isFocused,
             value: data.value,
             error: error && error[data.index] && error[data.index][0]
           });
@@ -180255,6 +180272,11 @@ const require$$21 = _dll_debug;
       },
       '& table:not([border="1"]) td, th': {
         border: '1px solid #dfe2e5'
+      },
+      '& > div::after': {
+        display: 'block',
+        content: '"¶"',
+        color: '#146EB3'
       }
     },
     toolbarOnTop: {

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "repository": "pie-framework/pie-elements",
-  "version": "7.3.7-next.7+fa996579e",
+  "version": "7.3.7",
   "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.10.0",
+    "@pie-lib/pie-toolbox": "2.10.1",
     "classnames": "^2.2.5",
     "lodash": "^4.17.10",
     "prop-types": "^15.6.1",
@@ -21,7 +21,7 @@
   },
   "author": "",
   "license": "ISC",
-  "gitHead": "fa996579e3be43d638e8d2a434ba6a40c8052cf5",
+  "gitHead": "451b0779d505a4f14d70141cd4df7e8f25df67d6",
   "main": "lib/index.js",
   "module": "src/index.js",
   "exports": {