@pie-element/math-templated 5.3.4-next.0 → 6.0.0-beta.0

package/controller/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@pie-element/math-templated-controller",
   "private": true,
-  "version": "4.3.3",
+  "version": "5.0.0-beta.0",
   "description": "",
   "main": "lib/index.js",
   "module": "src/index.js",
   "dependencies": {
     "@pie-framework/math-validation": "^1.4.2",
-    "@pie-lib/controller-utils": "0.22.2",
-    "@pie-lib/translator": "2.23.1",
+    "@pie-lib/controller-utils": "0.22.4-next.0",
+    "@pie-lib/translator": "2.23.3-next.0",
     "debug": "^3.1.0",
     "lodash": "^4.17.15"
   },

package/lib/index.js

@@ -1,117 +1,76 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
-
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-
-var _wrapNativeSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/wrapNativeSuper"));
-
+exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
-
-var _reactDom = _interopRequireDefault(require("react-dom"));
-
+var _client = require("react-dom/client");
 var _piePlayerEvents = require("@pie-framework/pie-player-events");
-
 var _main = _interopRequireDefault(require("./main"));
-
 var _lodash = _interopRequireDefault(require("lodash"));
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-var MathTemplated = /*#__PURE__*/function (_HTMLElement) {
-  (0, _inherits2["default"])(MathTemplated, _HTMLElement);
-
-  var _super = _createSuper(MathTemplated);
-
-  function MathTemplated() {
-    var _this;
-
-    (0, _classCallCheck2["default"])(this, MathTemplated);
-    _this = _super.call(this);
-    _this.sessionChangedEventCaller = _lodash["default"].debounce(function () {
-      _this.dispatchEvent(new _piePlayerEvents.SessionChangedEvent(_this.tagName.toLowerCase(), true));
+class MathTemplated extends HTMLElement {
+  constructor() {
+    super();
+    this._root = null;
+    this.sessionChangedEventCaller = _lodash.default.debounce(() => {
+      this.dispatchEvent(new _piePlayerEvents.SessionChangedEvent(this.tagName.toLowerCase(), true));
     }, 1000);
-    return _this;
   }
+  set model(m) {
+    this._model = m;
+    this.render();
+    this.dispatchEvent(new _piePlayerEvents.ModelSetEvent(this.tagName.toLowerCase(), this.isSessionComplete(), this._model !== undefined));
+  }
+  get model() {
+    return this._model;
+  }
+  set session(s) {
+    this._session = s;
+    this.render();
+  }
+  get session() {
+    return this._session;
+  }
+  isSessionComplete() {
+    // a method to check if student answered the question
+    return true;
+  }
+  onSessionChange(session) {
+    // you can add an extra step here to validate session
+    Object.keys(session).map(key => {
+      this._session[key] = session[key];
+    });
+    this.sessionChangedEventCaller();
+    this.render();
+  }
+  connectedCallback() {
+    // TODO set accessibility labels
 
-  (0, _createClass2["default"])(MathTemplated, [{
-    key: "model",
-    get: function get() {
-      return this._model;
-    },
-    set: function set(m) {
-      this._model = m;
-      this.render();
-      this.dispatchEvent(new _piePlayerEvents.ModelSetEvent(this.tagName.toLowerCase(), this.isSessionComplete(), this._model !== undefined));
-    }
-  }, {
-    key: "session",
-    get: function get() {
-      return this._session;
-    },
-    set: function set(s) {
-      this._session = s;
-      this.render();
-    }
-  }, {
-    key: "isSessionComplete",
-    value: function isSessionComplete() {
-      // a method to check if student answered the question
-      return true;
+    this.render();
+  }
+  render() {
+    if (!this._model || !this._session) {
+      return;
     }
-  }, {
-    key: "onSessionChange",
-    value: function onSessionChange(session) {
-      var _this2 = this;
-
-      // you can add an extra step here to validate session
-      Object.keys(session).map(function (key) {
-        _this2._session[key] = session[key];
+    if (this._model && this._session) {
+      const el = /*#__PURE__*/_react.default.createElement(_main.default, {
+        model: this._model,
+        session: this._session,
+        onSessionChange: this.onSessionChange.bind(this)
       });
-      this.sessionChangedEventCaller();
-      this.render();
-    }
-  }, {
-    key: "connectedCallback",
-    value: function connectedCallback() {
-      // TODO set accessibility labels
-      this.render();
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      if (!this._model || !this._session) {
-        return;
-      }
-
-      if (this._model && this._session) {
-        var el = /*#__PURE__*/_react["default"].createElement(_main["default"], {
-          model: this._model,
-          session: this._session,
-          onSessionChange: this.onSessionChange.bind(this)
-        });
-
-        _reactDom["default"].render(el, this);
+      if (!this._root) {
+        this._root = (0, _client.createRoot)(this);
       }
+      this._root.render(el);
     }
-  }]);
-  return MathTemplated;
-}( /*#__PURE__*/(0, _wrapNativeSuper2["default"])(HTMLElement));
-
-exports["default"] = MathTemplated;
+  }
+  disconnectedCallback() {
+    if (this._root) {
+      this._root.unmount();
+    }
+  }
+}
+exports.default = MathTemplated;
 //# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.js"],"names":["MathTemplated","sessionChangedEventCaller","_","debounce","dispatchEvent","SessionChangedEvent","tagName","toLowerCase","_model","m","render","ModelSetEvent","isSessionComplete","undefined","_session","s","session","Object","keys","map","key","el","React","createElement","Main","model","onSessionChange","bind","ReactDOM","HTMLElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;IAEqBA,a;;;;;AACjB,2BAAc;AAAA;;AAAA;AACV;AACA,UAAKC,yBAAL,GAAiCC,mBAAEC,QAAF,CAAW,YAAM;AAC9C,YAAKC,aAAL,CAAmB,IAAIC,oCAAJ,CAAwB,MAAKC,OAAL,CAAaC,WAAb,EAAxB,EAAoD,IAApD,CAAnB;AACH,KAFgC,EAE9B,IAF8B,CAAjC;AAFU;AAKb;;;;SASD,eAAY;AACR,aAAO,KAAKC,MAAZ;AACH,K;SATD,aAAUC,CAAV,EAAa;AACT,WAAKD,MAAL,GAAcC,CAAd;AAEA,WAAKC,MAAL;AACA,WAAKN,aAAL,CAAmB,IAAIO,8BAAJ,CAAkB,KAAKL,OAAL,CAAaC,WAAb,EAAlB,EAA8C,KAAKK,iBAAL,EAA9C,EAAwE,KAAKJ,MAAL,KAAgBK,SAAxF,CAAnB;AACH;;;SAYD,eAAc;AACV,aAAO,KAAKC,QAAZ;AACH,K;SARD,aAAYC,CAAZ,EAAe;AACX,WAAKD,QAAL,GAAgBC,CAAhB;AAEA,WAAKL,MAAL;AACH;;;WAMD,6BAAoB;AAChB;AACA,aAAO,IAAP;AACH;;;WAED,yBAAgBM,OAAhB,EAAyB;AAAA;;AACrB;AACAC,MAAAA,MAAM,CAACC,IAAP,CAAYF,OAAZ,EAAqBG,GAArB,CAAyB,UAACC,GAAD,EAAS;AAC9B,QAAA,MAAI,CAACN,QAAL,CAAcM,GAAd,IAAqBJ,OAAO,CAACI,GAAD,CAA5B;AACH,OAFD;AAIA,WAAKnB,yBAAL;AACA,WAAKS,MAAL;AACH;;;WAED,6BAAoB;AAChB;AAEA,WAAKA,MAAL;AACH;;;WAED,kBAAS;AACL,UAAI,CAAC,KAAKF,MAAN,IAAgB,CAAC,KAAKM,QAA1B,EAAoC;AAChC;AACH;;AAED,UAAI,KAAKN,MAAL,IAAe,KAAKM,QAAxB,EAAkC;AAC9B,YAAMO,EAAE,gBAAGC,kBAAMC,aAAN,CAAoBC,gBAApB,EAA0B;AACjCC,UAAAA,KAAK,EAAE,KAAKjB,MADqB;AAEjCQ,UAAAA,OAAO,EAAE,KAAKF,QAFmB;AAGjCY,UAAAA,eAAe,EAAE,KAAKA,eAAL,CAAqBC,IAArB,CAA0B,IAA1B;AAHgB,SAA1B,CAAX;;AAMAC,6BAASlB,MAAT,CAAgBW,EAAhB,EAAoB,IAApB;AACH;AACJ;;;kDAhEsCQ,W","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport {SessionChangedEvent, ModelSetEvent} from '@pie-framework/pie-player-events';\nimport Main from './main';\nimport _ from 'lodash';\n\nexport default class MathTemplated extends HTMLElement {\n    constructor() {\n        super();\n        this.sessionChangedEventCaller = _.debounce(() => {\n            this.dispatchEvent(new SessionChangedEvent(this.tagName.toLowerCase(), true));\n        }, 1000);\n    }\n\n    set model(m) {\n        this._model = m;\n\n        this.render();\n        this.dispatchEvent(new ModelSetEvent(this.tagName.toLowerCase(), this.isSessionComplete(), this._model !== undefined));\n    }\n\n    get model() {\n        return this._model;\n    }\n\n    set session(s) {\n        this._session = s;\n\n        this.render();\n    }\n\n    get session() {\n        return this._session;\n    }\n\n    isSessionComplete() {\n        // a method to check if student answered the question\n        return true;\n    }\n\n    onSessionChange(session) {\n        // you can add an extra step here to validate session\n        Object.keys(session).map((key) => {\n            this._session[key] = session[key];\n        });\n\n        this.sessionChangedEventCaller();\n        this.render();\n    }\n\n    connectedCallback() {\n        // TODO set accessibility labels\n\n        this.render();\n    }\n\n    render() {\n        if (!this._model || !this._session) {\n            return;\n        }\n\n        if (this._model && this._session) {\n            const el = React.createElement(Main, {\n                model: this._model,\n                session: this._session,\n                onSessionChange: this.onSessionChange.bind(this),\n            });\n\n            ReactDOM.render(el, this);\n        }\n    }\n}\n"],"file":"index.js"}
+{"version":3,"file":"index.js","names":["_react","_interopRequireDefault","require","_client","_piePlayerEvents","_main","_lodash","MathTemplated","HTMLElement","constructor","_root","sessionChangedEventCaller","_","debounce","dispatchEvent","SessionChangedEvent","tagName","toLowerCase","model","m","_model","render","ModelSetEvent","isSessionComplete","undefined","session","s","_session","onSessionChange","Object","keys","map","key","connectedCallback","el","React","createElement","Main","bind","createRoot","disconnectedCallback","unmount","exports","default"],"sources":["../src/index.js"],"sourcesContent":["import React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport {SessionChangedEvent, ModelSetEvent} from '@pie-framework/pie-player-events';\nimport Main from './main';\nimport _ from 'lodash';\n\nexport default class MathTemplated extends HTMLElement {\n    constructor() {\n        super();\n        this._root = null;\n        this.sessionChangedEventCaller = _.debounce(() => {\n            this.dispatchEvent(new SessionChangedEvent(this.tagName.toLowerCase(), true));\n        }, 1000);\n    }\n\n    set model(m) {\n        this._model = m;\n\n        this.render();\n        this.dispatchEvent(new ModelSetEvent(this.tagName.toLowerCase(), this.isSessionComplete(), this._model !== undefined));\n    }\n\n    get model() {\n        return this._model;\n    }\n\n    set session(s) {\n        this._session = s;\n\n        this.render();\n    }\n\n    get session() {\n        return this._session;\n    }\n\n    isSessionComplete() {\n        // a method to check if student answered the question\n        return true;\n    }\n\n    onSessionChange(session) {\n        // you can add an extra step here to validate session\n        Object.keys(session).map((key) => {\n            this._session[key] = session[key];\n        });\n\n        this.sessionChangedEventCaller();\n        this.render();\n    }\n\n    connectedCallback() {\n        // TODO set accessibility labels\n\n        this.render();\n    }\n\n    render() {\n        if (!this._model || !this._session) {\n            return;\n        }\n\n        if (this._model && this._session) {\n            const el = React.createElement(Main, {\n                model: this._model,\n                session: this._session,\n                onSessionChange: this.onSessionChange.bind(this),\n            });\n\n            if (!this._root) {\n                this._root = createRoot(this);\n            }\n            this._root.render(el);\n        }\n    }\n\n    disconnectedCallback() {\n        if (this._root) {\n            this._root.unmount();\n        }\n    }\n}\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,gBAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,OAAA,GAAAL,sBAAA,CAAAC,OAAA;AAEe,MAAMK,aAAa,SAASC,WAAW,CAAC;EACnDC,WAAWA,CAAA,EAAG;IACV,KAAK,CAAC,CAAC;IACP,IAAI,CAACC,KAAK,GAAG,IAAI;IACjB,IAAI,CAACC,yBAAyB,GAAGC,eAAC,CAACC,QAAQ,CAAC,MAAM;MAC9C,IAAI,CAACC,aAAa,CAAC,IAAIC,oCAAmB,CAAC,IAAI,CAACC,OAAO,CAACC,WAAW,CAAC,CAAC,EAAE,IAAI,CAAC,CAAC;IACjF,CAAC,EAAE,IAAI,CAAC;EACZ;EAEA,IAAIC,KAAKA,CAACC,CAAC,EAAE;IACT,IAAI,CAACC,MAAM,GAAGD,CAAC;IAEf,IAAI,CAACE,MAAM,CAAC,CAAC;IACb,IAAI,CAACP,aAAa,CAAC,IAAIQ,8BAAa,CAAC,IAAI,CAACN,OAAO,CAACC,WAAW,CAAC,CAAC,EAAE,IAAI,CAACM,iBAAiB,CAAC,CAAC,EAAE,IAAI,CAACH,MAAM,KAAKI,SAAS,CAAC,CAAC;EAC1H;EAEA,IAAIN,KAAKA,CAAA,EAAG;IACR,OAAO,IAAI,CAACE,MAAM;EACtB;EAEA,IAAIK,OAAOA,CAACC,CAAC,EAAE;IACX,IAAI,CAACC,QAAQ,GAAGD,CAAC;IAEjB,IAAI,CAACL,MAAM,CAAC,CAAC;EACjB;EAEA,IAAII,OAAOA,CAAA,EAAG;IACV,OAAO,IAAI,CAACE,QAAQ;EACxB;EAEAJ,iBAAiBA,CAAA,EAAG;IAChB;IACA,OAAO,IAAI;EACf;EAEAK,eAAeA,CAACH,OAAO,EAAE;IACrB;IACAI,MAAM,CAACC,IAAI,CAACL,OAAO,CAAC,CAACM,GAAG,CAAEC,GAAG,IAAK;MAC9B,IAAI,CAACL,QAAQ,CAACK,GAAG,CAAC,GAAGP,OAAO,CAACO,GAAG,CAAC;IACrC,CAAC,CAAC;IAEF,IAAI,CAACrB,yBAAyB,CAAC,CAAC;IAChC,IAAI,CAACU,MAAM,CAAC,CAAC;EACjB;EAEAY,iBAAiBA,CAAA,EAAG;IAChB;;IAEA,IAAI,CAACZ,MAAM,CAAC,CAAC;EACjB;EAEAA,MAAMA,CAAA,EAAG;IACL,IAAI,CAAC,IAAI,CAACD,MAAM,IAAI,CAAC,IAAI,CAACO,QAAQ,EAAE;MAChC;IACJ;IAEA,IAAI,IAAI,CAACP,MAAM,IAAI,IAAI,CAACO,QAAQ,EAAE;MAC9B,MAAMO,EAAE,gBAAGC,cAAK,CAACC,aAAa,CAACC,aAAI,EAAE;QACjCnB,KAAK,EAAE,IAAI,CAACE,MAAM;QAClBK,OAAO,EAAE,IAAI,CAACE,QAAQ;QACtBC,eAAe,EAAE,IAAI,CAACA,eAAe,CAACU,IAAI,CAAC,IAAI;MACnD,CAAC,CAAC;MAEF,IAAI,CAAC,IAAI,CAAC5B,KAAK,EAAE;QACb,IAAI,CAACA,KAAK,GAAG,IAAA6B,kBAAU,EAAC,IAAI,CAAC;MACjC;MACA,IAAI,CAAC7B,KAAK,CAACW,MAAM,CAACa,EAAE,CAAC;IACzB;EACJ;EAEAM,oBAAoBA,CAAA,EAAG;IACnB,IAAI,IAAI,CAAC9B,KAAK,EAAE;MACZ,IAAI,CAACA,KAAK,CAAC+B,OAAO,CAAC,CAAC;IACxB;EACJ;AACJ;AAACC,OAAA,CAAAC,OAAA,GAAApC,aAAA","ignoreList":[]}