targetj 1.0.99 → 1.0.101

package/README.md

@@ -184,40 +184,34 @@ In the example below, we define a target named 'load' that attempts to fetch a s
 
 The target will remain active using the loop function, with value() continuing to return undefined while polling the system every 50ms (as specified in the interval property) until the loader retrieves the API result. When the API result arrives, it triggers onValueChange, which creates a user object based on the retrieved data. Additionally, we define two targets to handle scenarios for both fast and slow connections. The slow target is enabled if polling exceeds 100 times, while the fast target is enabled if the API result is retrieved in less than 600ms. The fast target will reactivate the load target till it fetches 10 users.
 
-![api loading example](https://targetj.io/img/apiLoading2.gif)
+![api loading example](https://targetj.io/img/apiLoading3.gif)
 
 ```bash
 import { App, TModel, getLoader, getScreenHeight, getScreenWidth, Moves } from "targetj";
 
-App(new TModel("apiCall", {
-    start() { this.users = 0; },
+App(
+  new TModel("apiCall", {
     width: getScreenWidth,
     height: getScreenHeight,
     load: {
-      interval: 50,
-      loop() { return !this.val(this.key); },
-      value() {
-        const fetchId = `user${this.users}`;
-        getLoader().initSingleLoad(fetchId, {
-          url: "https://targetj.io/api/randomUser",
-          data: { id: fetchId }
-        });
-        return getLoader().fetchResult(fetchId);
+      interval: 1000,
+      cycles: 9,
+      value: function (cycle) {
+        return getLoader().fetch(this, "https://targetj.io/api/randomUser", { id: `user${cycle}` });
       },
-      onValueChange(newValue) {
-        if (!newValue) return;
-        const user = newValue.result;
-        this.addChild(
-          new TModel("user", {
+      onSuccess(res) {
+        this.addChild(new TModel("user", {
             bounce: {
               value() {
-                this.setTarget("move", Moves.bounceSimple(this, {
+                this.setTarget("move",
+                  Moves.bounceSimple(this, {
                     xStart: this.getX() || Math.random() * 300,
-                    yStart: 0,
-                    to: Math.random() * 200,
+                    yStart: 200,
+                    from: 0,
+                    to: 200,
                     widthStart: 50,
                     heightStart: 50,
-                  }), 50);
+                  }), 20);
               },
               onImperativeEnd() {
                 if (!this.hasUpdatingTargets(this)) {
@@ -227,33 +221,12 @@ App(new TModel("apiCall", {
             },
             lineHeight: 50,
             textAlign: "center",
-            html: user.name,
+            html: res.result.name,
             background: "yellow",
           })
         );
       },
     },
-    slowLoad: {
-      value() {
-        console.log("Connection issue: please try again later.");
-      },
-      enabledOn() {
-        return this.getTargetExecutionCount("load") > 30;
-      },
-    },
-    fastLoad: {
-      loop() { return this.users < 9; },
-      value() {
-        //Loading is fast: We can load additional details about the user or more users.
-        this.users++;
-        this.activateTarget("load");
-      },
-      enabledOn() {
-        return (
-          this.isTargetComplete("load") && this.val("load").loadingTime < 600
-        );
-      }
-    }
   })
 );
 ```

package/build/$Dom.js

@@ -39,8 +39,13 @@ var $Dom = exports.$Dom = /*#__PURE__*/function () {
     }
   }, {
     key: "create",
-    value: function create(tag) {
-      this.element = document.createElement(tag);
+    value: function create(tagName) {
+      this.element = document.createElement(tagName);
+    }
+  }, {
+    key: "getTagName",
+    value: function getTagName() {
+      return this.element.tagName.toLowerCase();
     }
   }, {
     key: "setSelector",

package/build/App.js

@@ -157,8 +157,8 @@ var App = exports.App = function App(tmodel) {
 };
 App.oids = {};
 App.getOid = function (type) {
-  var _tApp;
-  var oids = ((_tApp = tApp) === null || _tApp === void 0 || (_tApp = _tApp.tRoot) === null || _tApp === void 0 ? void 0 : _tApp.oids) || App.oids;
+  var _App$tRoot;
+  var oids = type === 'Bracket' ? App.oids : (App === null || App === void 0 || (_App$tRoot = App.tRoot) === null || _App$tRoot === void 0 ? void 0 : _App$tRoot.oids) || App.oids;
   if (!_TUtil.TUtil.isDefined(oids[type])) {
     oids[type] = 0;
   }
@@ -172,47 +172,47 @@ var isRunning = exports.isRunning = function isRunning() {
   return tApp ? tApp.runningFlag : false;
 };
 var tRoot = exports.tRoot = function tRoot() {
-  var _tApp2;
-  return (_tApp2 = tApp) === null || _tApp2 === void 0 ? void 0 : _tApp2.tRoot;
+  var _tApp;
+  return (_tApp = tApp) === null || _tApp === void 0 ? void 0 : _tApp.tRoot;
 };
 var getEvents = exports.getEvents = function getEvents() {
-  var _tApp3;
-  return (_tApp3 = tApp) === null || _tApp3 === void 0 ? void 0 : _tApp3.events;
+  var _tApp2;
+  return (_tApp2 = tApp) === null || _tApp2 === void 0 ? void 0 : _tApp2.events;
 };
 var getPager = exports.getPager = function getPager() {
-  var _tApp4;
-  return (_tApp4 = tApp) === null || _tApp4 === void 0 ? void 0 : _tApp4.pager;
+  var _tApp3;
+  return (_tApp3 = tApp) === null || _tApp3 === void 0 ? void 0 : _tApp3.pager;
 };
 var getLoader = exports.getLoader = function getLoader() {
-  var _tApp5;
-  return (_tApp5 = tApp) === null || _tApp5 === void 0 ? void 0 : _tApp5.loader;
+  var _tApp4;
+  return (_tApp4 = tApp) === null || _tApp4 === void 0 ? void 0 : _tApp4.loader;
 };
 var getManager = exports.getManager = function getManager() {
-  var _tApp6;
-  return (_tApp6 = tApp) === null || _tApp6 === void 0 ? void 0 : _tApp6.manager;
+  var _tApp5;
+  return (_tApp5 = tApp) === null || _tApp5 === void 0 ? void 0 : _tApp5.manager;
 };
 var getRunScheduler = exports.getRunScheduler = function getRunScheduler() {
-  var _tApp7;
-  return (_tApp7 = tApp) === null || _tApp7 === void 0 ? void 0 : _tApp7.runScheduler;
+  var _tApp6;
+  return (_tApp6 = tApp) === null || _tApp6 === void 0 ? void 0 : _tApp6.runScheduler;
 };
 var getLocationManager = exports.getLocationManager = function getLocationManager() {
-  var _tApp8;
-  return (_tApp8 = tApp) === null || _tApp8 === void 0 ? void 0 : _tApp8.locationManager;
+  var _tApp7;
+  return (_tApp7 = tApp) === null || _tApp7 === void 0 ? void 0 : _tApp7.locationManager;
 };
 var getBrowser = exports.getBrowser = function getBrowser() {
-  var _tApp9;
-  return (_tApp9 = tApp) === null || _tApp9 === void 0 ? void 0 : _tApp9.browser;
+  var _tApp8;
+  return (_tApp8 = tApp) === null || _tApp8 === void 0 ? void 0 : _tApp8.browser;
 };
 var getScreenWidth = exports.getScreenWidth = function getScreenWidth() {
-  var _tApp$tRoot$getWidth, _tApp10;
-  return (_tApp$tRoot$getWidth = (_tApp10 = tApp) === null || _tApp10 === void 0 || (_tApp10 = _tApp10.tRoot) === null || _tApp10 === void 0 ? void 0 : _tApp10.getWidth()) !== null && _tApp$tRoot$getWidth !== void 0 ? _tApp$tRoot$getWidth : 0;
+  var _tApp$tRoot$getWidth, _tApp9;
+  return (_tApp$tRoot$getWidth = (_tApp9 = tApp) === null || _tApp9 === void 0 || (_tApp9 = _tApp9.tRoot) === null || _tApp9 === void 0 ? void 0 : _tApp9.getWidth()) !== null && _tApp$tRoot$getWidth !== void 0 ? _tApp$tRoot$getWidth : 0;
 };
 var getScreenHeight = exports.getScreenHeight = function getScreenHeight() {
-  var _tApp$tRoot$getHeight, _tApp11;
-  return (_tApp$tRoot$getHeight = (_tApp11 = tApp) === null || _tApp11 === void 0 || (_tApp11 = _tApp11.tRoot) === null || _tApp11 === void 0 ? void 0 : _tApp11.getHeight()) !== null && _tApp$tRoot$getHeight !== void 0 ? _tApp$tRoot$getHeight : 0;
+  var _tApp$tRoot$getHeight, _tApp10;
+  return (_tApp$tRoot$getHeight = (_tApp10 = tApp) === null || _tApp10 === void 0 || (_tApp10 = _tApp10.tRoot) === null || _tApp10 === void 0 ? void 0 : _tApp10.getHeight()) !== null && _tApp$tRoot$getHeight !== void 0 ? _tApp$tRoot$getHeight : 0;
 };
 var getVisibles = exports.getVisibles = function getVisibles() {
-  var _tApp12;
-  return (_tApp12 = tApp) === null || _tApp12 === void 0 || (_tApp12 = _tApp12.manager) === null || _tApp12 === void 0 ? void 0 : _tApp12.lists.visible;
+  var _tApp11;
+  return (_tApp11 = tApp) === null || _tApp11 === void 0 || (_tApp11 = _tApp11.manager) === null || _tApp11 === void 0 ? void 0 : _tApp11.lists.visible;
 };
 window.t = window.t || _SearchUtil.SearchUtil.find;

package/build/LoadingManager.js

@@ -22,17 +22,19 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 var LoadingManager = exports.LoadingManager = /*#__PURE__*/function () {
   function LoadingManager() {
     _classCallCheck(this, LoadingManager);
-    this.resultMap = {};
+    this.cacheMap = {};
     this.fetchingAPIMap = {};
     this.fetchingImageMap = {};
   }
   return _createClass(LoadingManager, [{
     key: "fetchCommon",
-    value: function fetchCommon(fetchId, tmodel, fetchMap, fetchFn) {
-      if (this.isFetched(fetchId)) {
+    value: function fetchCommon(fetchId, cacheId, tmodel, fetchMap, fetchFn) {
+      if (cacheId && this.isFetched(cacheId)) {
         var _tmodel$targets$tmode;
         if (typeof ((_tmodel$targets$tmode = tmodel.targets[tmodel.key]) === null || _tmodel$targets$tmode === void 0 ? void 0 : _tmodel$targets$tmode.onSuccess) === 'function' && tmodel.isTargetEnabled(tmodel.key)) {
-          tmodel.targets[tmodel.key].onSuccess.call(tmodel, this.resultMap[fetchId]);
+          tmodel.targets[tmodel.key].onSuccess.call(tmodel, _objectSpread(_objectSpread({}, this.cacheMap[cacheId]), {}, {
+            fetchingPeriod: 0
+          }));
         }
       } else if (fetchMap[fetchId]) {
         fetchMap[fetchId].targets.push({
@@ -42,9 +44,9 @@ var LoadingManager = exports.LoadingManager = /*#__PURE__*/function () {
       } else {
         fetchMap[fetchId] = {
           fetchId: fetchId,
+          cacheId: cacheId,
           fetchingFlag: true,
           startTime: _TUtil.TUtil.now(),
-          fetchTime: undefined,
           targets: [{
             tmodel: tmodel,
             targetName: tmodel.key
@@ -53,23 +55,23 @@ var LoadingManager = exports.LoadingManager = /*#__PURE__*/function () {
         };
         fetchFn();
       }
-      return this.getFetchingPeriod(fetchId);
+      return fetchId;
     }
   }, {
     key: "fetch",
-    value: function fetch(tmodel, url, query, fetchId) {
+    value: function fetch(tmodel, url, query, cacheId) {
       var _this = this;
-      fetchId = fetchId || "".concat(tmodel.oid, "_").concat(url, "_").concat(JSON.stringify(query));
-      return this.fetchCommon(fetchId, tmodel, this.fetchingAPIMap, function () {
+      var fetchId = "".concat(tmodel.oid, "_").concat(url, "_").concat(JSON.stringify(query));
+      return this.fetchCommon(fetchId, cacheId, tmodel, this.fetchingAPIMap, function () {
         _this.ajaxAPI(url, query, _this.fetchingAPIMap[fetchId]);
       });
     }
   }, {
     key: "fetchImage",
-    value: function fetchImage(tmodel, src, fetchId) {
+    value: function fetchImage(tmodel, src, cacheId) {
       var _this2 = this;
-      fetchId = fetchId || "".concat(tmodel.oid, "_").concat(src);
-      return this.fetchCommon(fetchId, tmodel, this.fetchingImageMap, function () {
+      var fetchId = "".concat(tmodel.oid, "_").concat(src);
+      return this.fetchCommon(fetchId, cacheId, tmodel, this.fetchingImageMap, function () {
         _this2.loadImage(src, _this2.fetchingImageMap[fetchId]);
       });
     }
@@ -81,43 +83,30 @@ var LoadingManager = exports.LoadingManager = /*#__PURE__*/function () {
     }
   }, {
     key: "isFetched",
-    value: function isFetched(fetchId) {
-      var _this$resultMap$fetch, _this$resultMap$fetch2;
-      return (_this$resultMap$fetch = (_this$resultMap$fetch2 = this.resultMap[fetchId]) === null || _this$resultMap$fetch2 === void 0 ? void 0 : _this$resultMap$fetch2.success) !== null && _this$resultMap$fetch !== void 0 ? _this$resultMap$fetch : false;
+    value: function isFetched(cacheId) {
+      var _this$cacheMap$cacheI, _this$cacheMap$cacheI2;
+      return (_this$cacheMap$cacheI = (_this$cacheMap$cacheI2 = this.cacheMap[cacheId]) === null || _this$cacheMap$cacheI2 === void 0 ? void 0 : _this$cacheMap$cacheI2.success) !== null && _this$cacheMap$cacheI !== void 0 ? _this$cacheMap$cacheI : false;
     }
   }, {
     key: "getFetchingPeriod",
     value: function getFetchingPeriod(fetchId) {
-      if (this.fetchingAPIMap[fetchId]) {
-        var _this$fetchingAPIMap$3 = this.fetchingAPIMap[fetchId],
-          startTime = _this$fetchingAPIMap$3.startTime,
-          fetchTime = _this$fetchingAPIMap$3.fetchTime;
-        return fetchTime === undefined ? _TUtil.TUtil.now() - startTime : fetchTime - startTime;
-      }
-    }
-  }, {
-    key: "fetchResult",
-    value: function fetchResult(fetchId) {
-      return this.resultMap[fetchId];
+      return this.fetchingAPIMap[fetchId] ? _TUtil.TUtil.now() - this.fetchingAPIMap[fetchId].startTime : undefined;
     }
   }, {
-    key: "getFetchErrors",
-    value: function getFetchErrors(fetchId) {
-      var _this$resultMap$fetch3;
-      return (_this$resultMap$fetch3 = this.resultMap[fetchId]) === null || _this$resultMap$fetch3 === void 0 || (_this$resultMap$fetch3 = _this$resultMap$fetch3.result) === null || _this$resultMap$fetch3 === void 0 ? void 0 : _this$resultMap$fetch3.errors;
+    key: "fetchCache",
+    value: function fetchCache(cacheId) {
+      return this.cacheMap[cacheId];
     }
   }, {
     key: "handleSuccess",
     value: function handleSuccess(fetchStatus, result) {
-      var _this3 = this;
-      fetchStatus.fetchingFlag = false;
-      fetchStatus.fetchTime = fetchStatus.fetchTime || _TUtil.TUtil.now();
+      var fetchTime = _TUtil.TUtil.now();
       var fetchId = fetchStatus.fetchId,
-        fetchTime = fetchStatus.fetchTime,
+        cacheId = fetchStatus.cacheId,
         startTime = fetchStatus.startTime,
         targets = fetchStatus.targets,
         fetchMap = fetchStatus.fetchMap;
-      this.resultMap[fetchId] = {
+      var res = {
         fetchingPeriod: fetchTime - startTime,
         success: true,
         result: result
@@ -127,24 +116,25 @@ var LoadingManager = exports.LoadingManager = /*#__PURE__*/function () {
         var tmodel = _ref.tmodel,
           targetName = _ref.targetName;
         if (typeof ((_tmodel$targets$targe = tmodel.targets[targetName]) === null || _tmodel$targets$targe === void 0 ? void 0 : _tmodel$targets$targe.onSuccess) === 'function' && tmodel.isTargetEnabled(targetName)) {
-          tmodel.targets[targetName].onSuccess.call(tmodel, _this3.resultMap[fetchId]);
+          tmodel.targets[targetName].onSuccess.call(tmodel, res);
         }
       });
-      delete fetchMap.fetchId;
+      delete fetchMap[fetchId];
+      if (cacheId) {
+        this.cacheMap[cacheId] = res;
+      }
       (0, _App.getRunScheduler)().schedule(0, "api_success_".concat(fetchId));
     }
   }, {
     key: "handleError",
     value: function handleError(fetchStatus, error) {
-      var _this4 = this;
-      fetchStatus.fetchingFlag = false;
-      fetchStatus.fetchTime = fetchStatus.fetchTime || _TUtil.TUtil.now();
+      var fetchTime = _TUtil.TUtil.now();
       var fetchId = fetchStatus.fetchId,
-        fetchTime = fetchStatus.fetchTime,
+        cacheId = fetchStatus.cacheId,
         startTime = fetchStatus.startTime,
         targets = fetchStatus.targets,
         fetchMap = fetchStatus.fetchMap;
-      this.resultMap[fetchId] = {
+      var res = {
         fetchingPeriod: fetchTime - startTime,
         success: false,
         error: error
@@ -154,24 +144,27 @@ var LoadingManager = exports.LoadingManager = /*#__PURE__*/function () {
         var tmodel = _ref2.tmodel,
           targetName = _ref2.targetName;
         if (typeof ((_tmodel$targets$targe2 = tmodel.targets[targetName]) === null || _tmodel$targets$targe2 === void 0 ? void 0 : _tmodel$targets$targe2.onError) === 'function') {
-          tmodel.targets[targetName].onError.call(tmodel, _this4.resultMap[fetchId]);
+          tmodel.targets[targetName].onError.call(tmodel, res);
         }
       });
-      delete fetchMap.fetchId;
+      delete fetchMap[fetchId];
+      if (cacheId) {
+        this.cacheMap[cacheId] = res;
+      }
       (0, _App.getRunScheduler)().schedule(0, "api_error_".concat(fetchId));
     }
   }, {
     key: "ajaxAPI",
     value: function ajaxAPI(url, query, fetchStatus) {
-      var _this5 = this;
+      var _this3 = this;
       var defaultQuery = {
         dataType: "json",
         type: "GET",
         success: function success(dataList) {
-          return _this5.handleSuccess(fetchStatus, dataList);
+          return _this3.handleSuccess(fetchStatus, dataList);
         },
         error: function error(textStatus) {
-          return _this5.handleError(fetchStatus, textStatus);
+          return _this3.handleError(fetchStatus, textStatus);
         }
       };
       _$Dom.$Dom.ajax(_objectSpread(_objectSpread({}, defaultQuery), {}, {
@@ -183,7 +176,7 @@ var LoadingManager = exports.LoadingManager = /*#__PURE__*/function () {
   }, {
     key: "loadImage",
     value: function loadImage(src, fetchStatus) {
-      var _this6 = this;
+      var _this4 = this;
       var image = new Image();
       image.src = src;
       image.onload = function () {
@@ -192,10 +185,10 @@ var LoadingManager = exports.LoadingManager = /*#__PURE__*/function () {
           height: image.height,
           src: image.src
         };
-        _this6.handleSuccess(fetchStatus, result);
+        _this4.handleSuccess(fetchStatus, result);
       };
       image.onerror = image.onerror = function () {
-        _this6.handleError(fetchStatus, "not found");
+        _this4.handleError(fetchStatus, "not found");
       };
     }
   }]);

package/build/RunScheduler.js

@@ -149,10 +149,10 @@ var RunScheduler = exports.RunScheduler = /*#__PURE__*/function () {
               _App.tApp.manager.createDoms();
               break;
             case 3:
-              _App.tApp.manager.renderTModels();
+              _App.tApp.manager.reattachTModels();
               break;
             case 4:
-              _App.tApp.manager.reattachTModels();
+              _App.tApp.manager.renderTModels();
               break;
             case 5:
               _App.tApp.manager.fixStyles();

package/build/TModel.js

@@ -314,6 +314,11 @@ var TModel = exports.TModel = /*#__PURE__*/function (_BaseModel) {
     value: function hasDomHolderChanged() {
       return this.getDomHolder() && this.getDomHolder().exists() && this.$dom.parent().getAttribute("id") !== this.getDomHolder().attr("id");
     }
+  }, {
+    key: "hasDomChanged",
+    value: function hasDomChanged() {
+      return this.getBaseElement() !== this.$dom.getTagName();
+    }
   }, {
     key: "hasDom",
     value: function hasDom() {

package/build/TModelManager.js

@@ -134,6 +134,8 @@ var TModelManager = exports.TModelManager = /*#__PURE__*/function () {
     value: function needsRestyle(tmodel) {
       if (tmodel.hasDom() && tmodel.styleTargetList.length > 0) {
         this.lists.restyle.push(tmodel);
+        tmodel.domHeight = undefined;
+        tmodel.domWidth = undefined;
         return true;
       }
       return false;
@@ -141,7 +143,7 @@ var TModelManager = exports.TModelManager = /*#__PURE__*/function () {
   }, {
     key: "needsReattach",
     value: function needsReattach(tmodel) {
-      if (tmodel.hasDom() && tmodel.hasDomHolderChanged()) {
+      if (tmodel.hasDom() && (tmodel.hasDomHolderChanged() || tmodel.hasDomChanged())) {
         this.lists.reattach.push(tmodel);
         return true;
       }
@@ -175,6 +177,10 @@ var TModelManager = exports.TModelManager = /*#__PURE__*/function () {
         for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
           var tmodel = _step3.value;
           tmodel.$dom.detach();
+          if (tmodel.hasDomChanged()) {
+            _TModelUtil.TModelUtil.createDom(tmodel);
+            this.fixStyle(tmodel);
+          }
           tmodel.getDomHolder().appendTModel$Dom(tmodel);
         }
       } catch (err) {
@@ -351,16 +357,7 @@ var TModelManager = exports.TModelManager = /*#__PURE__*/function () {
       var _loop2 = function _loop2() {
         var tmodel = _needsDom[_i];
         tmodel.$dom = new _$Dom.$Dom();
-        tmodel.$dom.create(tmodel.getBaseElement());
-        tmodel.$dom.setSelector("#".concat(tmodel.oid));
-        tmodel.$dom.setId(tmodel.oid);
-        tmodel.transformMap = {};
-        tmodel.styleMap = {};
-        tmodel.allStyleTargetList.forEach(function (key) {
-          if (_TUtil.TUtil.isDefined(tmodel.val(key))) {
-            tmodel.addToStyleTargetList(key);
-          }
-        });
+        _TModelUtil.TModelUtil.createDom(tmodel);
         _this.fixStyle(tmodel);
         var contentItem = contentList.find(function (item) {
           return item.domHolder === tmodel.getDomHolder();

package/build/TModelUtil.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.TModelUtil = void 0;
 var _TUtil = require("./TUtil.js");
+var _$Dom = require("./$Dom.js");
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
 function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
@@ -102,6 +103,21 @@ var TModelUtil = exports.TModelUtil = /*#__PURE__*/function () {
         css: ''
       };
     }
+  }, {
+    key: "createDom",
+    value: function createDom(tmodel) {
+      tmodel.$dom = new _$Dom.$Dom();
+      tmodel.$dom.create(tmodel.getBaseElement());
+      tmodel.$dom.setSelector("#".concat(tmodel.oid));
+      tmodel.$dom.setId(tmodel.oid);
+      tmodel.transformMap = {};
+      tmodel.styleMap = {};
+      tmodel.allStyleTargetList.forEach(function (key) {
+        if (_TUtil.TUtil.isDefined(tmodel.val(key))) {
+          tmodel.addToStyleTargetList(key);
+        }
+      });
+    }
   }, {
     key: "getTransformString",
     value: function getTransformString(tmodel) {

package/build/TargetUtil.js

@@ -223,8 +223,9 @@ var TargetUtil = exports.TargetUtil = /*#__PURE__*/function () {
   }, {
     key: "setWidthFromDom",
     value: function setWidthFromDom(child) {
-      var height = _TUtil.TUtil.isDefined(child.domWidth) ? child.domWidth.height : undefined;
-      var width = _TUtil.TUtil.isDefined(child.domWidth) ? child.domWidth.width : undefined;
+      var _child$domWidth, _child$domWidth2;
+      var height = (_child$domWidth = child.domWidth) === null || _child$domWidth === void 0 ? void 0 : _child$domWidth.height;
+      var width = (_child$domWidth2 = child.domWidth) === null || _child$domWidth2 === void 0 ? void 0 : _child$domWidth2.width;
       var domParent = child.getDomParent();
       var rerender = false;
       if ((0, _App.getManager)().needsRerender(child)) {
@@ -246,8 +247,9 @@ var TargetUtil = exports.TargetUtil = /*#__PURE__*/function () {
   }, {
     key: "setHeightFromDom",
     value: function setHeightFromDom(child) {
-      var height = _TUtil.TUtil.isDefined(child.domHeight) ? child.domHeight.height : undefined;
-      var width = _TUtil.TUtil.isDefined(child.domHeight) ? child.domHeight.width : undefined;
+      var _child$domHeight, _child$domHeight2;
+      var height = (_child$domHeight = child.domHeight) === null || _child$domHeight === void 0 ? void 0 : _child$domHeight.height;
+      var width = (_child$domHeight2 = child.domHeight) === null || _child$domHeight2 === void 0 ? void 0 : _child$domHeight2.width;
       var domParent = child.getDomParent();
       var rerender = false;
       if ((0, _App.getManager)().needsRerender(child)) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "targetj",
-  "version": "1.0.099",
+  "version": "1.0.101",
   "keywords": [
     "targetj"
   ],