@wcardinal/wcardinal-ui 0.200.2 → 0.202.0

package/dist/wcardinal-ui.js

@@ -1,5 +1,5 @@
 /*
- Winter Cardinal UI v0.200.2
+ Winter Cardinal UI v0.202.0
  Copyright (C) 2019 Toshiba Corporation
  SPDX-License-Identifier: Apache-2.0
 
@@ -505,12 +505,12 @@
             iv += 4;
         }
     };
-    var buildTextStep = function (steps, voffset, vcount, textAtlas, textSize, textOutlineWidth, textWeight) {
+    var buildTextStep = function (steps, voffset, vcount, textAtlas, textSize, textOutlineWidth, textWeight, scaleX, scaleY) {
         var is = voffset * 6 - 1;
         var ismax = (voffset + vcount) * 6 - 1;
         var scaleInvariant = toScaleInvariant(EShapeStrokeStyle.NONE);
         if (textAtlas != null) {
-            var scale = textAtlas.font.size / textSize;
+            var scale = textAtlas.font.size / (textSize * (scaleX + scaleY) * 0.5);
             var position = textWeight === EShapeTextWeight.NORMAL ? 0.0 : 0.05;
             for (; is < ismax;) {
                 steps[++is] = textOutlineWidth;
@@ -742,19 +742,6 @@
                 break;
         }
     };
-    var toNormalized = function (dx, dy, defx, defy, result) {
-        var d = dx * dx + dy * dy;
-        if (TEXT_FMIN < d) {
-            var l = Math.sqrt(d);
-            var li = 1 / l;
-            result.set(dx * li, dy * li);
-            return l;
-        }
-        else {
-            result.set(defx, defy);
-            return 0;
-        }
-    };
     var rotateAlignHorizontalRight = function (align) {
         switch (align) {
             case EShapeTextAlignHorizontal.LEFT:
@@ -822,36 +809,78 @@
         //
         var sx = sizeX * 0.5;
         var sy = sizeY * 0.5;
-        var work = TEXT_WORK_POINT;
-        work.set(originX - sx, originY - sy);
-        internalTransform.apply(work, work);
-        var x0 = work.x;
-        var y0 = work.y;
-        work.set(originX + sx, originY - sy);
-        internalTransform.apply(work, work);
-        var x1 = work.x;
-        var y1 = work.y;
-        work.set(originX + sx, originY + sy);
-        internalTransform.apply(work, work);
-        var x2 = work.x;
-        var y2 = work.y;
+        var a = internalTransform.a;
+        var b = internalTransform.b;
+        var c = internalTransform.c;
+        var d = internalTransform.d;
+        var tx = internalTransform.tx;
+        var ty = internalTransform.ty;
+        var ltx = originX - sx;
+        var lty = originY - sy;
+        var rtx = originX + sx;
+        var rty = originY - sy;
+        var rbx = originX + sx;
+        var rby = originY + sy;
+        var x0 = a * ltx + c * lty + tx;
+        var y0 = b * ltx + d * lty + ty;
+        var x1 = a * rtx + c * rty + tx;
+        var y1 = b * rtx + d * rty + ty;
+        var x2 = a * rbx + c * rby + tx;
+        var y2 = b * rbx + d * rby + ty;
         var x3 = x0 + (x2 - x1);
         var y3 = y0 + (y2 - y1);
         // Horizontal normal
         var hl = toLength(x0, y0, x1, y1);
-        toNormalized(internalTransform.a, internalTransform.b, 1, 0, work);
-        var hnx = work.x;
-        var hny = work.y;
+        var hnl = toLength(0, 0, a, b);
+        var hnx = 1;
+        var hny = 0;
+        if (TEXT_FMIN < hnl) {
+            var hnli = 1 / hnl;
+            hnx = a * hnli;
+            hny = b * hnli;
+        }
         // Vertical normal
         var vl = toLength(x0, y0, x3, y3);
-        toNormalized(internalTransform.c, internalTransform.d, 0, 1, work);
-        var vnx = work.x;
-        var vny = work.y;
+        var vnl = toLength(0, 0, c, d);
+        var vnx = 0;
+        var vny = 1;
+        if (TEXT_FMIN < hnl) {
+            var vnli = 1 / vnl;
+            vnx = c * vnli;
+            vny = d * vnli;
+        }
+        var work = TEXT_WORK_POINT;
+        switch (textDirection) {
+            case EShapeTextDirection.LEFT_TO_RIGHT:
+                // DO NOTHING
+                break;
+            case EShapeTextDirection.TOP_TO_BOTTOM:
+                work.set(vnx, vny);
+                vnx = -hnx;
+                vny = -hny;
+                hnx = work.x;
+                hny = work.y;
+                work.x = vnl;
+                vnl = hnl;
+                hnl = work.x;
+                break;
+            case EShapeTextDirection.BOTTOM_TO_TOP:
+                work.set(vnx, vny);
+                vnx = hnx;
+                vny = hny;
+                hnx = -work.x;
+                hny = -work.y;
+                work.x = vnl;
+                vnl = hnl;
+                hnl = work.x;
+                break;
+        }
         // Calculate the width / height
         var width = 0;
         var height = 0;
         var heightChar = 0;
-        var lineHeight = Math.max(0, textSize + textSpacingVertical);
+        var textSizeY = textSize * vnl;
+        var lineHeight = Math.max(0, textSize + textSpacingVertical) * vnl;
         var lineWidth = 0;
         var textAtlasCharacters = textAtlas.characters;
         var iterator = UtilCharacterIterator.from(textValue);
@@ -879,12 +908,14 @@
                 height += lineHeight;
             }
         }
-        var scale = textSize / textAtlas.font.size;
+        var scaleZ = textSize / textAtlas.font.size;
+        var scaleX = hnl * scaleZ;
+        var scaleY = vnl * scaleZ;
         lineWidth += advancePrevious;
-        width = Math.max(width, lineWidth) * scale;
+        width = Math.max(width, lineWidth) * scaleX;
         lineWidth = 0;
-        heightChar *= scale;
-        height += textSize;
+        heightChar *= scaleY;
+        height += textSizeY;
         //
         var tx0 = 0;
         var ty0 = 0;
@@ -911,13 +942,6 @@
                 }
                 break;
             case EShapeTextDirection.TOP_TO_BOTTOM:
-                // Swap normals
-                work.set(vnx, vny);
-                vnx = -hnx;
-                vny = -hny;
-                hnx = work.x;
-                hny = work.y;
-                // Get text bbox
                 getTextBBox(rotateAlignVerticalRight(textAlignVertical), rotateAlignHorizontalRight(textAlignHorizontal), textOffsetVertical, textOffsetHorizontal, textPaddingVertical, textPaddingHorizontal, width, height, x1, y1, x2, y2, x3, y3, x0, y0, hnx, hny, vnx, vny, work);
                 tx0 = work.x;
                 ty0 = work.y;
@@ -938,13 +962,6 @@
                 }
                 break;
             case EShapeTextDirection.BOTTOM_TO_TOP:
-                // Swap normals
-                work.set(vnx, vny);
-                vnx = hnx;
-                vny = hny;
-                hnx = -work.x;
-                hny = -work.y;
-                // Get text bbox
                 getTextBBox(rotateAlignVerticalLeft(textAlignVertical), rotateAlignHorizontalLeft(textAlignHorizontal), textOffsetVertical, textOffsetHorizontal, textPaddingVertical, textPaddingHorizontal, width, height, x3, y3, x0, y0, x1, y1, x2, y2, hnx, hny, vnx, vny, work);
                 tx0 = work.x;
                 ty0 = work.y;
@@ -976,6 +993,8 @@
             textWorld[5] = vny;
             textWorld[6] = lineWidthMaximum;
             textWorld[7] = height;
+            textWorld[8] = hnl;
+            textWorld[9] = vnl;
         }
         else {
             textWorld[0] = tx0;
@@ -986,6 +1005,8 @@
             textWorld[5] = vny;
             textWorld[6] = width;
             textWorld[7] = height;
+            textWorld[8] = hnl;
+            textWorld[9] = vnl;
         }
         // Texture
         var uvx0 = textureUvs.x0;
@@ -1001,16 +1022,16 @@
         // Vertices & UVs
         var lhx = lineHeight * vnx;
         var lhy = lineHeight * vny;
-        var snx = scale * hnx;
-        var sny = scale * hny;
-        var offsetY = (heightChar - textSize) * 0.5;
+        var snx = scaleX * hnx;
+        var sny = scaleX * hny;
+        var offsetY = (heightChar - textSizeY) * 0.5;
         var oyx = offsetY * vnx;
         var oyy = offsetY * vny;
         var offsetItalic = textStyle === EShapeTextStyle.NORMAL ? 0 : textSize * 0.25;
         var bx0 = tx0 - oyx + offsetItalic * snx;
         var by0 = ty0 - oyy + offsetItalic * sny;
-        var bx3 = tx0 + oyx + textSize * vnx;
-        var by3 = ty0 + oyy + textSize * vny;
+        var bx3 = tx0 + oyx + textSizeY * vnx;
+        var by3 = ty0 + oyy + textSizeY * vny;
         var cx0 = bx0;
         var cy0 = by0;
         var cx3 = bx3;
@@ -1037,11 +1058,11 @@
                 lineCount += 1;
                 if (data) {
                     var advance = data.advance;
-                    if (lineWidthMaximum < (lineWidth + advance) * scale) {
+                    if (lineWidthMaximum < (lineWidth + advance) * scaleX) {
                         var dots = textAtlasCharacters["..."];
                         if (dots) {
                             if (1 < lineCount &&
-                                lineWidthMaximum < (lineWidth + dots.advance) * scale) {
+                                lineWidthMaximum < (lineWidth + dots.advance) * scaleX) {
                                 lineWidth = lineWidthPrevious;
                                 iv -= 8;
                                 lineCount -= 1;
@@ -1092,13 +1113,13 @@
                 cx3 = bx3;
                 cy3 = by3;
                 writeCharacterEmpty(vertices, uvs, iv, cx0, cy0, cx3, cy3, uvx0, uvy0, uvx3, uvy3);
-                adjustTextAlignment(vertices, hnx, hny, lineCount, iv, width - lineWidth * scale, textDirection, textAlignHorizontal, textAlignVertical);
+                adjustTextAlignment(vertices, hnx, hny, lineCount, iv, width - lineWidth * scaleX, textDirection, textAlignHorizontal, textAlignVertical);
                 lineWidth = 0;
                 lineCount = 0;
             }
         }
         lineWidth += advancePrevious;
-        adjustTextAlignment(vertices, hnx, hny, lineCount, iv, width - lineWidth * scale, textDirection, textAlignHorizontal, textAlignVertical);
+        adjustTextAlignment(vertices, hnx, hny, lineCount, iv, width - lineWidth * scaleX, textDirection, textAlignHorizontal, textAlignVertical);
         for (var ivmax = (voffset + vcount) * 2; iv < ivmax; iv += 2) {
             vertices[iv + 0] = tx0;
             vertices[iv + 1] = ty0;
@@ -4140,7 +4161,9 @@
                     var ty = transform.b * x + transform.d * y + transform.ty - textWorld[1];
                     var th = textWorld[2] * tx + textWorld[3] * ty;
                     var tv = textWorld[4] * tx + textWorld[5] * ty;
-                    if (0 <= th && th <= textWorld[6] && 0 <= tv && tv <= textWorld[7]) {
+                    var w = textWorld[6];
+                    var h = textWorld[7];
+                    if (0 <= th && th <= w && 0 <= tv && tv <= h) {
                         return this;
                     }
                 }
@@ -4889,6 +4912,42 @@
         PROTECTED: 2
     };
 
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var EShapeDataValueState = {
+        /**
+         * The data status is not known.
+         * This is the default state.
+         */
+        UNKOWN: -1,
+        /**
+         * The request succeeded.
+         */
+        FOUND: 0,
+        /**
+         * The server can not find the requested data.
+         */
+        NOT_FOUND: 1,
+        /**
+         * The settings or something provided by clients are considered incorrect.
+         */
+        BAD_REQUEST: 2,
+        /**
+         * The server has encountered unknown errors.
+         */
+        SERVER_ERROR: 3,
+        /**
+         * The server is not ready to handle the request.
+         */
+        SERVICE_UNAVAILABLE: 4,
+        /**
+         * A client is not allowed to access this data.
+         */
+        FORBIDDEN: 5
+    };
+
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
@@ -4899,6 +4958,7 @@
     var EShapeDataValueImpl = /** @class */ (function () {
         function EShapeDataValueImpl() {
             this.id = "";
+            this.as = "";
             this.type = EShapeDataValueType.NUMBER;
             this.scope = EShapeDataValueScope.PUBLIC;
             this.initial = "";
@@ -4906,6 +4966,7 @@
             this.range = new EShapeDataValueRangeImpl();
             this._value = 0;
             this._time = 0;
+            this._state = EShapeDataValueState.UNKOWN;
             this._capacity = 0;
             this._order = EShapeDataValueOrder.ASCENDING;
         }
@@ -4996,10 +5057,11 @@
                 return result;
             },
             set: function (newValues) {
-                if (0 < newValues.length) {
+                var newValuesLength = newValues.length;
+                if (0 < newValuesLength) {
                     var capacity = this._capacity;
                     if (capacity <= 0) {
-                        var newValue = newValues[newValues.length - 1];
+                        var newValue = newValues[newValuesLength - 1];
                         var formatter = this.formatter;
                         if (formatter != null) {
                             newValue = formatter(newValue);
@@ -5022,30 +5084,30 @@
                         var formatter = this.formatter;
                         if (formatter != null) {
                             // Update the value
-                            this._value = formatter(newValues[newValues.length - 1]);
+                            this._value = formatter(newValues[newValuesLength - 1]);
                             // Update the values
                             if (order === EShapeDataValueOrder.ASCENDING) {
-                                for (var i = 0, imax = newValues.length; i < imax; ++i) {
+                                for (var i = 0; i < newValuesLength; ++i) {
                                     values.push(formatter(newValues[i]));
                                 }
                             }
                             else {
-                                for (var i = 0, imax = newValues.length; i < imax; ++i) {
+                                for (var i = 0; i < newValuesLength; ++i) {
                                     values.unshift(formatter(newValues[i]));
                                 }
                             }
                         }
                         else {
                             // Update the value
-                            this._value = newValues[newValues.length - 1];
+                            this._value = newValues[newValuesLength - 1];
                             // Update the values
                             if (order === EShapeDataValueOrder.ASCENDING) {
-                                for (var i = 0, imax = newValues.length; i < imax; ++i) {
+                                for (var i = 0; i < newValuesLength; ++i) {
                                     values.push(newValues[i]);
                                 }
                             }
                             else {
-                                for (var i = 0, imax = newValues.length; i < imax; ++i) {
+                                for (var i = 0; i < newValuesLength; ++i) {
                                     values.unshift(newValues[i]);
                                 }
                             }
@@ -5137,10 +5199,11 @@
                 return result;
             },
             set: function (newTimes) {
-                if (0 < newTimes.length) {
+                var newTimesLength = newTimes.length;
+                if (0 < newTimesLength) {
                     var capacity = this._capacity;
                     if (capacity <= 0) {
-                        var newTime = newTimes[newTimes.length - 1];
+                        var newTime = newTimes[newTimesLength - 1];
                         if (this._time !== newTime) {
                             this._time = newTime;
                             var parent_7 = this.parent;
@@ -5157,16 +5220,16 @@
                             this._times = times;
                         }
                         // Update the value
-                        this._time = newTimes[newTimes.length - 1];
+                        this._time = newTimes[newTimesLength - 1];
                         //
                         var order = this._order;
                         if (order === EShapeDataValueOrder.ASCENDING) {
-                            for (var i = 0, imax = newTimes.length; i < imax; ++i) {
+                            for (var i = 0; i < newTimesLength; ++i) {
                                 times.push(newTimes[i]);
                             }
                         }
                         else {
-                            for (var i = 0, imax = newTimes.length; i < imax; ++i) {
+                            for (var i = 0; i < newTimesLength; ++i) {
                                 times.unshift(newTimes[i]);
                             }
                         }
@@ -5193,6 +5256,127 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(EShapeDataValueImpl.prototype, "state", {
+            get: function () {
+                return this._state;
+            },
+            set: function (newState) {
+                var capacity = this._capacity;
+                if (capacity <= 0) {
+                    if (this._state !== newState) {
+                        this._state = newState;
+                        var parent_9 = this.parent;
+                        if (parent_9 != null) {
+                            parent_9.isChanged = true;
+                        }
+                    }
+                }
+                else {
+                    // Update the states
+                    var states = this._states;
+                    if (states == null) {
+                        states = [];
+                        this._states = states;
+                    }
+                    // Update the state
+                    this._state = newState;
+                    // Update the states
+                    var order = this._order;
+                    if (order === EShapeDataValueOrder.ASCENDING) {
+                        states.push(newState);
+                    }
+                    else {
+                        states.unshift(newState);
+                    }
+                    // Remove the unnecessary states
+                    var count = states.length - capacity;
+                    if (0 < count) {
+                        if (order === EShapeDataValueOrder.ASCENDING) {
+                            for (var i = 0; i < count; ++i) {
+                                states.shift();
+                            }
+                        }
+                        else {
+                            states.length = capacity;
+                        }
+                    }
+                    // Tell the parent it's changed
+                    var parent_10 = this.parent;
+                    if (parent_10 != null) {
+                        parent_10.isChanged = true;
+                    }
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(EShapeDataValueImpl.prototype, "states", {
+            get: function () {
+                var result = this._states;
+                if (result == null) {
+                    result = [];
+                    this._states = result;
+                }
+                return result;
+            },
+            set: function (newStates) {
+                var newStatesLength = newStates.length;
+                if (0 < newStatesLength) {
+                    var capacity = this._capacity;
+                    if (capacity <= 0) {
+                        var newState = newStates[newStatesLength - 1];
+                        if (this._state !== newState) {
+                            this._state = newState;
+                            var parent_11 = this.parent;
+                            if (parent_11 != null) {
+                                parent_11.isChanged = true;
+                            }
+                        }
+                    }
+                    else {
+                        // Update the states
+                        var states = this._states;
+                        if (states == null) {
+                            states = [];
+                            this._states = states;
+                        }
+                        // Update the value
+                        this._state = newStates[newStatesLength - 1];
+                        //
+                        var order = this._order;
+                        if (order === EShapeDataValueOrder.ASCENDING) {
+                            for (var i = 0; i < newStatesLength; ++i) {
+                                states.push(newStates[i]);
+                            }
+                        }
+                        else {
+                            for (var i = 0; i < newStatesLength; ++i) {
+                                states.unshift(newStates[i]);
+                            }
+                        }
+                        //
+                        var count = states.length - capacity;
+                        if (0 < count) {
+                            if (order === EShapeDataValueOrder.ASCENDING) {
+                                for (var i = 0; i < count; ++i) {
+                                    states.shift();
+                                }
+                            }
+                            else {
+                                states.length = capacity;
+                            }
+                        }
+                        // Tell the parent it's changed
+                        var parent_12 = this.parent;
+                        if (parent_12 != null) {
+                            parent_12.isChanged = true;
+                        }
+                    }
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
         Object.defineProperty(EShapeDataValueImpl.prototype, "capacity", {
             get: function () {
                 return this._capacity;
@@ -5237,10 +5421,26 @@
                             isChanged = true;
                         }
                     }
+                    // States
+                    var states = this._states;
+                    if (states != null) {
+                        var count = states.length - capacity;
+                        if (0 < count) {
+                            if (order === EShapeDataValueOrder.ASCENDING) {
+                                for (var i = 0; i < count; ++i) {
+                                    states.shift();
+                                }
+                            }
+                            else {
+                                states.length = capacity;
+                            }
+                            isChanged = true;
+                        }
+                    }
                     if (isChanged) {
-                        var parent_9 = this.parent;
-                        if (parent_9 != null) {
-                            parent_9.isChanged = true;
+                        var parent_13 = this.parent;
+                        if (parent_13 != null) {
+                            parent_13.isChanged = true;
                         }
                     }
                 }
@@ -5276,59 +5476,62 @@
                     isChanged = true;
                 }
             }
+            // States
+            var states = this._states;
+            if (states != null) {
+                if (0 <= index && index < states.length) {
+                    states.splice(index, 1);
+                    isChanged = true;
+                }
+            }
             if (isChanged) {
-                var parent_10 = this.parent;
-                if (parent_10 != null) {
-                    parent_10.isChanged = true;
+                var parent_14 = this.parent;
+                if (parent_14 != null) {
+                    parent_14.isChanged = true;
                 }
             }
         };
         EShapeDataValueImpl.prototype.removeAll = function (indices) {
             var isChanged = false;
-            var values = this._values;
-            var times = this._times;
             var sorted = indices.slice(0).sort(INDEX_COMPARATOR);
+            var sortedLength = sorted.length;
+            // Values
+            var values = this._values;
             if (values != null) {
-                if (times != null) {
-                    for (var i = sorted.length - 1; 0 <= i; --i) {
-                        var index = sorted[i];
-                        if (0 <= index) {
-                            if (index < values.length) {
-                                values.splice(index, 1);
-                                isChanged = true;
-                            }
-                            if (index < times.length) {
-                                times.splice(index, 1);
-                                isChanged = true;
-                            }
-                        }
+                for (var i = sortedLength - 1; 0 <= i; --i) {
+                    var index = sorted[i];
+                    if (0 <= index && index < values.length) {
+                        values.splice(index, 1);
+                        isChanged = true;
                     }
                 }
-                else {
-                    for (var i = sorted.length - 1; 0 <= i; --i) {
-                        var index = sorted[i];
-                        if (0 <= index && index < values.length) {
-                            values.splice(index, 1);
-                            isChanged = true;
-                        }
+            }
+            // Times
+            var times = this._times;
+            if (times != null) {
+                for (var i = sortedLength - 1; 0 <= i; --i) {
+                    var index = sorted[i];
+                    if (0 <= index && index < times.length) {
+                        times.splice(index, 1);
+                        isChanged = true;
                     }
                 }
             }
-            else {
-                if (times != null) {
-                    for (var i = sorted.length - 1; 0 <= i; --i) {
-                        var index = sorted[i];
-                        if (0 <= index && index < times.length) {
-                            times.splice(index, 1);
-                            isChanged = true;
-                        }
+            // States
+            var states = this._states;
+            if (states != null) {
+                for (var i = sortedLength - 1; 0 <= i; --i) {
+                    var index = sorted[i];
+                    if (0 <= index && index < states.length) {
+                        states.splice(index, 1);
+                        isChanged = true;
                     }
                 }
             }
             if (isChanged) {
-                var parent_11 = this.parent;
-                if (parent_11 != null) {
-                    parent_11.isChanged = true;
+                var parent_15 = this.parent;
+                if (parent_15 != null) {
+                    parent_15.isChanged = true;
                 }
             }
         };
@@ -5346,11 +5549,17 @@
                 times.length = 0;
                 isChanged = true;
             }
+            // States
+            var states = this._states;
+            if (states != null) {
+                states.length = 0;
+                isChanged = true;
+            }
             // Change flag
             if (isChanged) {
-                var parent_12 = this.parent;
-                if (parent_12 != null) {
-                    parent_12.isChanged = true;
+                var parent_16 = this.parent;
+                if (parent_16 != null) {
+                    parent_16.isChanged = true;
                 }
             }
         };
@@ -5375,6 +5584,7 @@
             this.range.copy(target.range);
             this._value = target.value;
             this._time = target.time;
+            this._state = target.state;
             this._capacity = target.capacity;
             return this;
         };
@@ -5391,7 +5601,8 @@
             var initial = manager.addResource(this.initial);
             var format = manager.addResource(this.format.trim());
             var range = this.range.serialize(manager);
-            return manager.addResource("[".concat(id, ",").concat(initial, ",").concat(format, ",").concat(range, ",").concat(this._capacity, ",").concat(this._order, ",").concat(this.type, ",").concat(this.scope, "]"));
+            var as = manager.addResource(this.as);
+            return manager.addResource("[".concat(id, ",").concat(initial, ",").concat(format, ",").concat(range, ",").concat(this._capacity, ",").concat(this._order, ",").concat(this.type, ",").concat(this.scope, ",").concat(as, "]"));
         };
         EShapeDataValueImpl.prototype.deserialize = function (target, manager) {
             var _a, _b;
@@ -5403,6 +5614,8 @@
                     manager.setDataValue(target, parsed);
                 }
                 this.id = manager.data[parsed[0]] || "";
+                var as = parsed[8];
+                this.as = as != null ? resources[as] || "" : "";
                 this.type = (_a = parsed[6]) !== null && _a !== void 0 ? _a : EShapeDataValueType.NUMBER;
                 this.scope = (_b = parsed[7]) !== null && _b !== void 0 ? _b : EShapeDataValueScope.PUBLIC;
                 this.initial = resources[parsed[1]] || "";
@@ -5588,7 +5801,7 @@
                 list.push(value);
             }
         };
-        EShapeDataScopedImpl.prototype.set = function (id, value, time, from, to) {
+        EShapeDataScopedImpl.prototype.set = function (id, value, time, state, from, to) {
             var data = this._data;
             if (data == null) {
                 return false;
@@ -5610,6 +5823,10 @@
                 if (time !== undefined) {
                     datumValue.time = time;
                 }
+                // State
+                if (state !== undefined) {
+                    datumValue.state = state;
+                }
                 // Value
                 datumValue.value = value;
             }
@@ -5656,6 +5873,7 @@
      * SPDX-License-Identifier: Apache-2.0
      */
     var RANGE_DUMMY;
+    var ALIAS_DUMMY;
     var EShapeDataImpl = /** @class */ (function () {
         function EShapeDataImpl() {
             this._values = [];
@@ -5689,6 +5907,17 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(EShapeDataImpl.prototype, "as", {
+            get: function () {
+                var values = this._values;
+                if (0 < values.length) {
+                    return values[0].as;
+                }
+                return "";
+            },
+            enumerable: false,
+            configurable: true
+        });
         Object.defineProperty(EShapeDataImpl.prototype, "type", {
             get: function () {
                 var values = this._values;
@@ -5789,6 +6018,23 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(EShapeDataImpl.prototype, "state", {
+            get: function () {
+                var values = this._values;
+                if (0 < values.length) {
+                    return values[0].state;
+                }
+                return EShapeDataValueState.UNKOWN;
+            },
+            set: function (state) {
+                var values = this._values;
+                if (0 < values.length) {
+                    values[0].state = state;
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
         Object.defineProperty(EShapeDataImpl.prototype, "capacity", {
             get: function () {
                 var values = this._values;
@@ -5806,6 +6052,33 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(EShapeDataImpl.prototype, "alias", {
+            get: function () {
+                var result = this._alias;
+                if (result == null) {
+                    result = this.newAlias();
+                    this._alias = result;
+                }
+                return result;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        EShapeDataImpl.prototype.newAlias = function () {
+            var values = this._values;
+            var valuesLength = values.length;
+            if (0 < valuesLength) {
+                var result = {};
+                for (var i = 0; i < valuesLength; ++i) {
+                    var value = values[i];
+                    result[value.as || value.id] = value;
+                }
+                return result;
+            }
+            else {
+                return (ALIAS_DUMMY !== null && ALIAS_DUMMY !== void 0 ? ALIAS_DUMMY : (ALIAS_DUMMY = {}));
+            }
+        };
         Object.defineProperty(EShapeDataImpl.prototype, "mapping", {
             get: function () {
                 var result = this._mapping;
@@ -7098,6 +7371,8 @@
             this.sizeX = NaN;
             this.sizeY = NaN;
             this.transformLocalId = NaN;
+            this.scaleX = 1;
+            this.scaleY = 1;
             this.size = NaN;
             this.family = "auto";
             this.value = "";
@@ -7256,12 +7531,25 @@
             var text = shape.text;
             var textOutline = text.outline;
             var textOutlineWidth = textOutline.enable ? textOutline.width : 0;
+            var isOutlineWidthChanged = textOutlineWidth !== this.outlineWidth;
             var textWeight = text.weight;
-            if (textWeight !== this.weight || textOutlineWidth !== this.outlineWidth) {
+            var isWeightChanged = textWeight !== this.weight;
+            var scaleX = 1;
+            var scaleY = 1;
+            var textWorld = text.world;
+            if (textWorld != null) {
+                scaleX = textWorld[8];
+                scaleY = textWorld[9];
+            }
+            var isScaleChanged = TEXT_FMIN < Math.abs(this.scaleX - scaleX) ||
+                TEXT_FMIN < Math.abs(this.scaleY - scaleY);
+            if (isWeightChanged || isOutlineWidthChanged || isScaleChanged) {
                 this.weight = textWeight;
                 this.outlineWidth = textOutlineWidth;
+                this.scaleX = scaleX;
+                this.scaleY = scaleY;
                 buffer.updateSteps();
-                buildTextStep(buffer.steps, this.vertexOffset, this.vertexCount, text.atlas, text.size, textOutlineWidth, textWeight);
+                buildTextStep(buffer.steps, this.vertexOffset, this.vertexCount, text.atlas, text.size, textOutlineWidth, textWeight, this.scaleX, this.scaleY);
             }
         };
         BuilderText.prototype.buildUnit = function (builder) {
@@ -7833,15 +8121,17 @@
             var data = shape.data;
             var isEffectTimeUp = this.effect <= time;
             if (data.isChanged || this.isStateChanged || isEffectTimeUp) {
+                this.isStateChanged = false;
+                data.isChanged = false;
                 if (isEffectTimeUp) {
                     this.effect = NaN;
                 }
                 shape.disallowUploadedUpdate();
                 this.onUpdate(shape, time);
                 shape.allowUploadedUpdate();
+                var wasStateChanged = this.isStateChanged;
                 shape.state.removeAll(EShapeState.CLICKED, EShapeState.DOWN, EShapeState.UP, EShapeState.ACTIVATED, EShapeState.DEACTIVATED);
-                this.isStateChanged = false;
-                data.isChanged = false;
+                this.isStateChanged = wasStateChanged;
             }
         };
         EShapeRuntime.prototype.onRender = function (shape, time, renderer) {
@@ -7960,6 +8250,7 @@
                     "try {" +
                     "with (shape) {" +
                     "with (state) {" +
+                    "with (data.alias) {" +
                     "with (environment) {" +
                     (nullable ?
                         ("var result = (".concat(expression, ");") +
@@ -7968,6 +8259,7 @@
                     "}" +
                     "}" +
                     "}" +
+                    "}" +
                     "} catch (e) {" +
                     "return ".concat(defLiteral, ";") +
                     "}";
@@ -13521,9 +13813,9 @@
             if (target === this) {
                 return true;
             }
-            else if (target != null && !(target instanceof DBase)) {
+            else if (target != null && !(target instanceof DBase && target.interactive)) {
                 var parent_5 = target.parent;
-                while (parent_5 != null && !(parent_5 instanceof DBase)) {
+                while (parent_5 != null && !(parent_5 instanceof DBase && parent_5.interactive)) {
                     parent_5 = parent_5.parent;
                 }
                 return parent_5 === this;
@@ -16018,569 +16310,6 @@
         return EShapeGroupFillViewer;
     }());
 
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    /* eslint-disable prettier/prettier */
-    var NONE = 0x0;
-    var ID = 0x1;
-    var POSITION = 0x2;
-    var WIDTH = 0x4;
-    var HEIGHT = 0x8;
-    var ROTATION = 0x10;
-    var SKEW = 0x20;
-    var REPLACING = 0x40;
-    var GROUPING = 0x80;
-    var UNGROUPING = 0x100;
-    var FILL = 0x200;
-    var STROKE = 0x400;
-    var STROKE_SIDE = 0x800;
-    var BORDER_RADIUS = 0x1000;
-    var TEXT = 0x2000;
-    var TEXTURE = 0x4000;
-    var DATA = 0x8000;
-    var ACTION = 0x10000;
-    var CURSOR = 0x20000;
-    var ORDER_IN_LAYER = 0x40000;
-    var CHILDREN = 0x80000;
-    var DATA_MAPPING = 0x100000;
-    var COORDINATE = ID | POSITION | WIDTH | HEIGHT | ROTATION | SKEW;
-    var SHAPE = REPLACING | GROUPING | FILL | STROKE;
-    var LAYER = ORDER_IN_LAYER;
-    var PRIMITIVE = COORDINATE | SHAPE | TEXT | TEXTURE | DATA | ACTION | CURSOR | LAYER | CHILDREN;
-    var GROUP = PRIMITIVE | UNGROUPING;
-    var EMBEDDED = COORDINATE | REPLACING | GROUPING | TEXT | DATA | ACTION | LAYER | DATA_MAPPING;
-    var CONNECTOR = ID | REPLACING | FILL | STROKE | TEXT | TEXTURE | DATA | ACTION | CURSOR | LAYER | CHILDREN;
-    var ALL = PRIMITIVE | STROKE_SIDE | BORDER_RADIUS | DATA_MAPPING | UNGROUPING;
-    var EShapeCapability = {
-        NONE: NONE,
-        /**
-         * Allows shape IDs to be modified.
-         */
-        ID: ID,
-        /**
-         * Allows shape positions to be modified.
-         */
-        POSITION: POSITION,
-        /**
-         * Allows shape widths to be modified.
-         */
-        WIDTH: WIDTH,
-        /**
-         * Allows shape heights to be modified.
-         */
-        HEIGHT: HEIGHT,
-        /**
-         * Allows shape rotations to be modified.
-         */
-        ROTATION: ROTATION,
-        /**
-         * Allows shape skews to be modified.
-         */
-        SKEW: SKEW,
-        /** @deprecated */
-        ALIGN: NONE,
-        /**
-         * Allows shapes to be replaced with other shapes.
-         */
-        REPLACING: REPLACING,
-        /**
-         * Allows shapes to be grouped.
-         */
-        GROUPING: GROUPING,
-        /**
-         * Allows grouped shapes to be ungrouped.
-         */
-        UNGROUPING: UNGROUPING,
-        /**
-         * Allows shape fills to be modified.
-         */
-        FILL: FILL,
-        /**
-         * Allows shape strokes to be modified.
-         */
-        STROKE: STROKE,
-        /**
-         * Allows shape stroke sides to be modified.
-         */
-        STROKE_SIDE: STROKE_SIDE,
-        /**
-         * Allows shape border radiuses to be modified.
-         */
-        BORDER_RADIUS: BORDER_RADIUS,
-        /**
-         * Allows shape texts to be modified.
-         */
-        TEXT: TEXT,
-        /**
-         * Allows shape textures to be modified.
-         */
-        TEXTURE: TEXTURE,
-        /** @deprecated in favor of {@link DATA} */
-        TAG: DATA,
-        /**
-         * Allows shape data to be modified.
-         */
-        DATA: DATA,
-        /**
-         * Allows shape data mapping to be modified.
-         */
-        DATA_MAPPING: DATA_MAPPING,
-        /**
-         * Allows shape actions to be modified.
-         */
-        ACTION: ACTION,
-        /**
-         * Allows shape cursors to be modified.
-         */
-        CURSOR: CURSOR,
-        /**
-         * Allows shape orders in layer to be modified.
-         */
-        ORDER_IN_LAYER: ORDER_IN_LAYER,
-        /**
-         * Allows shape children to be modified.
-         */
-        CHILDREN: CHILDREN,
-        COORDINATE: COORDINATE,
-        SHAPE: SHAPE,
-        LAYER: LAYER,
-        PRIMITIVE: PRIMITIVE,
-        GROUP: GROUP,
-        EMBEDDED: EMBEDDED,
-        CONNECTOR: CONNECTOR,
-        ALL: ALL
-    };
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var EShapeCapabilities = /** @class */ (function () {
-        function EShapeCapabilities() {
-        }
-        EShapeCapabilities.get = function (type) {
-            var capability = this.mappings[type];
-            if (capability != null) {
-                return capability;
-            }
-            return EShapeCapability.PRIMITIVE;
-        };
-        EShapeCapabilities.contains = function (shape, target) {
-            if (shape != null) {
-                var capability = this.get(shape.type);
-                if (capability & target) {
-                    return true;
-                }
-                if (capability & EShapeCapability.CHILDREN) {
-                    var children = shape.children;
-                    for (var i = 0, imax = children.length; i < imax; ++i) {
-                        if (this.contains(children[i], target)) {
-                            return true;
-                        }
-                    }
-                }
-            }
-            return false;
-        };
-        EShapeCapabilities.set = function (type, capability) {
-            this.mappings[type] = capability;
-        };
-        EShapeCapabilities.mappings = {};
-        return EShapeCapabilities;
-    }());
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var EShapeEditor = /** @class */ (function () {
-        function EShapeEditor() {
-            this.localTransform = new pixi_js.Matrix();
-            this.internalTransform = new pixi_js.Matrix();
-            this.internalTransformParentInverse = new pixi_js.Matrix();
-            this.rotation = 0;
-            this.size = new pixi_js.Point();
-        }
-        return EShapeEditor;
-    }());
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var toSizeNormalized = function (size) {
-        var THRESHOLD = 0.001;
-        if (Math.abs(size) < THRESHOLD) {
-            return size < 0 ? -THRESHOLD : +THRESHOLD;
-        }
-        return size;
-    };
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var EShapeTransforms = /** @class */ (function () {
-        function EShapeTransforms() {
-        }
-        EShapeTransforms.prepare = function (shape) {
-            var editor = shape.editor || new EShapeEditor();
-            shape.editor = editor;
-            // Transform
-            shape.updateTransform();
-            var parent = shape.parent;
-            if (parent instanceof EShapeBase) {
-                parent.transform.internalTransform
-                    .copyTo(editor.internalTransformParentInverse)
-                    .invert();
-            }
-            else {
-                editor.internalTransformParentInverse.identity();
-            }
-            shape.transform.internalTransform.copyTo(editor.internalTransform);
-            // Rotation
-            editor.rotation = shape.transform.rotation;
-            // Size
-            editor.size.copyFrom(shape.size);
-            //
-            shape.disallowOnTransformChange();
-        };
-        EShapeTransforms.finalize = function (shape) {
-            shape.allowOnTransformChange(true);
-        };
-        EShapeTransforms.apply = function (shape, transform, keepSize) {
-            var editor = shape.editor;
-            if (editor != null) {
-                var newLocalTransform = editor.localTransform;
-                editor.internalTransformParentInverse
-                    .copyTo(newLocalTransform)
-                    .append(transform)
-                    .append(editor.internalTransform);
-                if (keepSize) {
-                    this.applyLocal(shape, newLocalTransform);
-                }
-                else {
-                    var size = editor.size;
-                    this.applyLocal(shape, newLocalTransform, size.x, size.y);
-                }
-            }
-        };
-        EShapeTransforms.applyLocal = function (shape, localTransform, bx, by) {
-            shape.disallowUploadedUpdate();
-            // Reconstruct the position, the rotation and the size
-            var a = localTransform.a;
-            var b = localTransform.b;
-            var c = localTransform.c;
-            var d = localTransform.d;
-            var tx = localTransform.tx;
-            var ty = localTransform.ty;
-            // Rotation
-            var transform = shape.transform;
-            var rx = Math.atan2(-c, d); // rotation - skewX
-            var ry = Math.atan2(+b, a); // rotation + skewY
-            transform.rotation = (rx + ry) * 0.5; // Here, assumes `skewX` === `skewY`
-            // Skew
-            var skew = (ry - rx) * 0.5;
-            transform.skew.set(skew, skew);
-            // Position: Assumes the pivot is invariant.
-            // tx = position.x - (a * px + c * py)
-            // ty = position.y - (b * px + d * py)
-            //
-            // Thus,
-            // position.x = tx + (a * px + c * py)
-            // position.y = ty + (b * px + d * py)
-            var pivot = transform.pivot;
-            var px = pivot.x;
-            var py = pivot.y;
-            transform.position.set(tx + (a * px + c * py), ty + (b * px + d * py));
-            // Scale
-            if (bx != null && by != null) {
-                var sx = Math.sqrt(a * a + b * b);
-                var sy = Math.sqrt(c * c + d * d);
-                shape.size.set(toSizeNormalized(bx * sx), toSizeNormalized(by * sy));
-            }
-            //
-            shape.allowUploadedUpdate();
-        };
-        return EShapeTransforms;
-    }());
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var EShapeGroupSizeLayout = /** @class */ (function () {
-        function EShapeGroupSizeLayout(shape, bx, by) {
-            this.shape = shape;
-            // Base group size
-            this.base = new pixi_js.Point(bx, by);
-            // Base shape size
-            var size = shape.size;
-            this.shapeBase = new pixi_js.Point(size.x, size.y);
-            // Transform
-            this.transform = new pixi_js.Matrix();
-            shape.updateTransform();
-            shape.transform.localTransform.copyTo(this.transform);
-            this.capable =
-                EShapeCapabilities.contains(shape, EShapeCapability.POSITION) &&
-                    EShapeCapabilities.contains(shape, EShapeCapability.WIDTH) &&
-                    EShapeCapabilities.contains(shape, EShapeCapability.HEIGHT) &&
-                    EShapeCapabilities.contains(shape, EShapeCapability.ROTATION) &&
-                    EShapeCapabilities.contains(shape, EShapeCapability.SKEW);
-        }
-        EShapeGroupSizeLayout.prototype.isCompatible = function (shape) {
-            return this.shape === shape;
-        };
-        EShapeGroupSizeLayout.prototype.reset = function (shape, baseX, baseY) {
-            this.base.set(baseX, baseY);
-            // Base shape size
-            var size = shape.size;
-            this.shapeBase.copyFrom(size);
-            // Transform
-            shape.updateTransform();
-            shape.transform.localTransform.copyTo(this.transform);
-        };
-        EShapeGroupSizeLayout.prototype.update = function (shape, baseX, baseY, pivotX, pivotY) {
-            if (!this.capable) {
-                return;
-            }
-            var sx = baseX / this.base.x;
-            var sy = baseY / this.base.y;
-            var childBase = this.shapeBase;
-            var transform = EShapeGroupSizeLayout.WORK_TRANSFORM;
-            transform
-                .identity()
-                .append(this.transform)
-                .translate(-pivotX, -pivotY)
-                .scale(sx, sy)
-                .translate(+pivotX, +pivotY);
-            shape.disallowOnTransformChange();
-            EShapeTransforms.applyLocal(shape, transform, childBase.x, childBase.y);
-            shape.allowOnTransformChange(false);
-        };
-        EShapeGroupSizeLayout.WORK_TRANSFORM = new pixi_js.Matrix();
-        return EShapeGroupSizeLayout;
-    }());
-
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var EShapeGroupSizeEditor = /** @class */ (function () {
-        function EShapeGroupSizeEditor(parent, x, y, isFittable) {
-            this._workRectForCalcRect = new pixi_js.Rectangle();
-            this._workRectForFit = new pixi_js.Rectangle();
-            this._parent = parent;
-            this._layouts = [];
-            this._size = new pixi_js.Point(x, y);
-            this._isFittable = isFittable;
-        }
-        EShapeGroupSizeEditor.prototype.init = function () {
-            // DO NOTHING
-        };
-        Object.defineProperty(EShapeGroupSizeEditor.prototype, "x", {
-            get: function () {
-                return this._size.x;
-            },
-            set: function (x) {
-                var size = this._size;
-                if (size.x !== x) {
-                    var ox = size.x;
-                    size.x = x;
-                    this.onChange(ox, size.y);
-                }
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(EShapeGroupSizeEditor.prototype, "y", {
-            get: function () {
-                return this._size.y;
-            },
-            set: function (y) {
-                var size = this._size;
-                if (size.y !== y) {
-                    var oy = size.y;
-                    size.y = y;
-                    this.onChange(size.x, oy);
-                }
-            },
-            enumerable: false,
-            configurable: true
-        });
-        EShapeGroupSizeEditor.prototype.set = function (x, y) {
-            var isChanged = false;
-            var size = this._size;
-            var ox = size.x;
-            var oy = size.y;
-            if (x != null && ox !== x) {
-                isChanged = true;
-                size.x = x;
-            }
-            if (y != null && oy !== y) {
-                isChanged = true;
-                size.y = y;
-            }
-            if (isChanged) {
-                this.onChange(ox, oy);
-            }
-            return this;
-        };
-        EShapeGroupSizeEditor.prototype.clone = function () {
-            var size = this._size;
-            return new EShapeGroupSizeEditor(this._parent, size.x, size.y, this._isFittable);
-        };
-        EShapeGroupSizeEditor.prototype.copy = function () {
-            // DO NOTHING
-        };
-        EShapeGroupSizeEditor.prototype.copyFrom = function (point) {
-            var x = point.x;
-            var y = point.y;
-            var size = this._size;
-            var ox = size.x;
-            var oy = size.y;
-            if (ox !== x || oy !== y) {
-                size.x = x;
-                size.y = y;
-                this.onChange(ox, oy);
-            }
-            return this;
-        };
-        EShapeGroupSizeEditor.prototype.copyTo = function (point) {
-            return this._size.copyTo(point);
-        };
-        EShapeGroupSizeEditor.prototype.equals = function (point) {
-            return this._size.equals(point);
-        };
-        EShapeGroupSizeEditor.prototype.fit = function () {
-            if (this._isFittable) {
-                this.doFit();
-            }
-        };
-        EShapeGroupSizeEditor.prototype.doFit = function () {
-            var parent = this._parent;
-            parent.disallowOnTransformChange();
-            // Calculate the rect
-            var rect = this.calcRect(this._workRectForFit);
-            // Set size
-            var size = this._size;
-            size.set(rect.width, rect.height);
-            // Position & Pivot
-            // rx := rect.x
-            // ry := rect.y
-            //
-            // | a c tx | | 1 0 +rx | | 1 0 -rx |   | a c tx + (a * rx + c * ry) | | 1 0 -rx |
-            // | b d ty | | 0 1 +ry | | 0 1 -ry | = | b d ty + (b * rx + d * ry) | | 0 1 -ry |
-            // | 0 0 1  | | 0 0  1  | | 0 0  1  |   | 0 0 1                      | | 0 0  1  |
-            //
-            // tx -> tx + (a * rx + c * ry) = poxition.x - (a * pivot.x + c * pivot.y)
-            // ty -> ty + (b * rx + d * ry) = poxition.y - (b * pivot.x + d * pivot.y)
-            // position.x -> position.x + (a * rx + c * ry) - (a * pivot.x + c * pivot.y)
-            // position.y -> position.y + (b * rx + d * ry) - (b * pivot.x + d * pivot.y)
-            // pivot.x -> 0
-            // pivot.y -> 0
-            //
-            // a -> a', b -> b', c -> c', tx -> tx', ty -> ty'
-            //
-            // | a' c' tx' | | 1 0 -rx |   | a' c' tx' - (a' * rx + c' * ry) |
-            // | b' d' ty' | | 0 1 -ry | = | b' d' ty' - (b' * rx + d' * ry) |
-            // | 0  0  1   | | 0 0  1  |   | 0  0  1                         |
-            //
-            // tx' -> tx' - (a' * rx + c' * ry) = poxition.x - (a' * pivot.x + c' * pivot.y)
-            // ty' -> ty' - (b' * rx + d' * ry) = poxition.y - (b' * pivot.x + d' * pivot.y)
-            // pivot.x -> pivot.x + rx
-            // pivot.y -> pivot.y + ry
-            parent.updateTransform();
-            var transform = parent.transform;
-            var x = rect.x + rect.width * 0.5;
-            var y = rect.y + rect.height * 0.5;
-            var position = transform.position;
-            var localTransform = transform.localTransform;
-            var a = localTransform.a;
-            var b = localTransform.b;
-            var c = localTransform.c;
-            var d = localTransform.d;
-            var pivot = transform.pivot;
-            position.set(position.x + (a * x + c * y) - (a * pivot.x + c * pivot.y), position.y + (b * x + d * y) - (b * pivot.x + d * pivot.y));
-            pivot.set(x, y);
-            // Reset the data
-            this.reset(parent.children, this._layouts, size);
-            //
-            parent.allowOnTransformChange(true);
-        };
-        EShapeGroupSizeEditor.prototype.reset = function (children, layouts, size) {
-            for (var i = 0, imax = Math.min(layouts.length, children.length); i < imax; ++i) {
-                var child = children[i];
-                var layout = layouts[i];
-                if (layout.isCompatible(child)) {
-                    layout.reset(child, size.x, size.y);
-                }
-                else {
-                    layouts.length = i;
-                    break;
-                }
-            }
-            if (children.length < layouts.length) {
-                layouts.length = children.length;
-            }
-        };
-        EShapeGroupSizeEditor.prototype.calcRect = function (result) {
-            var parent = this._parent;
-            var children = parent.children;
-            if (children.length <= 0) {
-                result.x = 0;
-                result.y = 0;
-                result.width = 0;
-                result.height = 0;
-            }
-            else {
-                var workRect = this._workRectForCalcRect;
-                children[0].getBoundsLocal(false, result);
-                for (var i = 1, imax = children.length; i < imax; ++i) {
-                    var child = children[i];
-                    child.getBoundsLocal(false, workRect);
-                    result.enlarge(workRect);
-                }
-            }
-            return result;
-        };
-        EShapeGroupSizeEditor.prototype.onChange = function (ox, oy) {
-            var parent = this._parent;
-            var size = this._size;
-            var pivot = parent.transform.pivot;
-            this.onChange_(parent.children, this._layouts, size.x, size.y, pivot.x, pivot.y, ox, oy);
-            parent.onSizeChange();
-        };
-        EShapeGroupSizeEditor.prototype.onChange_ = function (children, layouts, sx, sy, px, py, ox, oy) {
-            for (var i = 0, imax = Math.min(layouts.length, children.length); i < imax; ++i) {
-                var child = children[i];
-                var layout = layouts[i];
-                if (layout.isCompatible(child)) {
-                    layout.update(child, sx, sy, px, py);
-                }
-                else {
-                    layouts.length = i;
-                    break;
-                }
-            }
-            for (var i = layouts.length, imax = children.length; i < imax; ++i) {
-                var child = children[i];
-                var layout = this.newLayout(child, ox, oy);
-                layout.update(child, sx, sy, px, py);
-                layouts.push(layout);
-            }
-            if (layouts.length !== children.length) {
-                layouts.length = children.length;
-            }
-        };
-        EShapeGroupSizeEditor.prototype.newLayout = function (shape, ox, oy) {
-            return shape.layout || new EShapeGroupSizeLayout(shape, ox, oy);
-        };
-        return EShapeGroupSizeEditor;
-    }());
-
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
@@ -17207,34 +16936,21 @@
      */
     var EShapeGroupViewer = /** @class */ (function (_super) {
         __extends(EShapeGroupViewer, _super);
-        function EShapeGroupViewer(isEditMode, type) {
+        function EShapeGroupViewer(type) {
             var _this = _super.call(this, type) || this;
-            _this._isEditMode = isEditMode;
             var data = _this.newData();
             _this.data = data;
             _this.tag = data;
-            _this.size = _this.newGroupSize(isEditMode);
+            _this.size = _this.newGroupSize();
             _this.fill = _this.newGroupFill();
             _this.stroke = _this.newGroupStroke();
             _this.text = _this.newGroupText();
             return _this;
         }
-        Object.defineProperty(EShapeGroupViewer.prototype, "isEditMode", {
-            get: function () {
-                return this._isEditMode;
-            },
-            enumerable: false,
-            configurable: true
-        });
-        EShapeGroupViewer.prototype.newGroupSize = function (isEditMode) {
+        EShapeGroupViewer.prototype.newGroupSize = function () {
             var sizeX = EShapeDefaults.SIZE_X;
             var sizeY = EShapeDefaults.SIZE_Y;
-            if (isEditMode) {
-                return new EShapeGroupSizeEditor(this, sizeX, sizeY, this.isGroupSizeFittable());
-            }
-            else {
-                return new EShapeGroupSizeViewer(this, sizeX, sizeY, sizeX, sizeY);
-            }
+            return new EShapeGroupSizeViewer(this, sizeX, sizeY, sizeX, sizeY);
         };
         EShapeGroupViewer.prototype.isGroupSizeFittable = function () {
             return true;
@@ -17332,9 +17048,9 @@
 
     var EShapeEmbedded = /** @class */ (function (_super) {
         __extends(EShapeEmbedded, _super);
-        function EShapeEmbedded(name, isEditMode, type) {
+        function EShapeEmbedded(name, type) {
             if (type === void 0) { type = EShapeType.EMBEDDED; }
-            var _this = _super.call(this, isEditMode, type) || this;
+            var _this = _super.call(this, type) || this;
             _this._name = name;
             return _this;
         }
@@ -17365,7 +17081,7 @@
         };
         EShapeEmbedded.prototype.newClone = function () {
             var constructor = this.constructor;
-            return new constructor(this._name, this._isEditMode, this.type);
+            return new constructor(this._name, this.type);
         };
         EShapeEmbedded.prototype.serializeChildren = function (manager) {
             return [];
@@ -19958,7 +19674,7 @@
      * SPDX-License-Identifier: Apache-2.0
      */
     var VERTEX_SHADER$2 = "\nattribute vec2 aVertexPosition;\nattribute vec2 aTextureCoord;\nvarying mediump vec2 vTextureCoord;\nvoid main(void) {\n\tgl_Position = vec4(aVertexPosition, 0.0, 1.0);\n\tvTextureCoord = aTextureCoord;\n}\n";
-    var FRAGMENT_SHADER$2 = "\nprecision mediump float;\n\nvarying mediump vec2 vTextureCoord;\nuniform sampler2D uSampler;\nuniform vec2 uSize;\n\nfloat calcDistance( float x, float y, float dx, float dy ) {\n\tfloat xd = x + dx;\n\tfloat yd = y + dy;\n\tfloat u = xd / uSize.x;\n\tfloat v = yd / uSize.y;\n\tfloat ul = (xd - 1.0) / uSize.x;\n\tfloat vt = (yd - 1.0) / uSize.y;\n\n\tfloat m = texture2D(uSampler, vec2(u , v )).a;\n\tfloat l = texture2D(uSampler, vec2(ul, v )).a;\n\tfloat t = texture2D(uSampler, vec2(u , vt)).a;\n\n\tfloat xl = mix( xd - 1.0, xd, (0.5 - l) / (m - l) );\n\tfloat yt = mix( yd - 1.0, yd, (0.5 - t) / (m - t) );\n\n\tbool bl = ( min(l, m) < 0.5 && 0.5 <= max(l, m) );\n\tbool bt = ( min(t, m) < 0.5 && 0.5 <= max(t, m) );\n\n\tfloat ll = (bl ? length( vec2( xl - x, yd - y ) ) : 100.0);\n\tfloat lt = (bt ? length( vec2( xd - x, yt - y ) ) : 100.0);\n\n\treturn min( ll, lt );\n}\n\nfloat calcDistancesY( float x, float y, float dx ) {\n\tfloat d = 100.0;\n\tfor( float dy=-6.0; dy<6.5; dy++ ) {\n\t\td = min( d, calcDistance( x, y, dx, dy ) );\n\t}\n\treturn d;\n}\n\nfloat calcDistances( float x, float y ) {\n\tfloat d = 100.0;\n\tfor( float dx=-6.0; dx<6.5; dx++ ) {\n\t\td = min( d, calcDistancesY( x, y, dx ) );\n\t}\n\treturn d;\n}\n\nvoid main(void) {\n\tfloat t = texture2D(uSampler, vTextureCoord).a;\n\tfloat x = vTextureCoord.x * uSize.x;\n\tfloat y = vTextureCoord.y * uSize.y;\n\tfloat d = min( 6.0, calcDistances( x, y ) ) / 12.0;\n\td = clamp( mix( 0.5 - d, 0.5 + d, step( 0.5, t ) ), 0.0, 1.0 );\n\tgl_FragColor = vec4(1.0, 1.0, 1.0, d);\n}\n";
+    var FRAGMENT_SHADER$2 = "\nprecision mediump float;\n\nvarying mediump vec2 vTextureCoord;\nuniform sampler2D uSampler;\nuniform vec2 uSize;\n\nfloat calcDistance( float x, float y, float dx, float dy ) {\n\tfloat xd = x + dx;\n\tfloat yd = y + dy;\n\tfloat u = xd / uSize.x;\n\tfloat v = yd / uSize.y;\n\tfloat ul = (xd - 1.0) / uSize.x;\n\tfloat vt = (yd - 1.0) / uSize.y;\n\n\tfloat m = texture2D(uSampler, vec2(u , v )).a;\n\tfloat l = texture2D(uSampler, vec2(ul, v )).a;\n\tfloat t = texture2D(uSampler, vec2(u , vt)).a;\n\tfloat ddx = -(0.5 - m) / (l - m);\n\tfloat ddy = -(0.5 - m) / (t - m);\n\tbool bl = min(l,m) < 0.5 && 0.5 <= max(l,m);\n\tbool bt = min(t,m) < 0.5 && 0.5 <= max(t,m);\n\treturn (\n\t\tbl ?\n\t\t(bt ?\n\t\t\tlength(vec2(dx + ddx * 0.5, dy + ddy * 0.5)) :\n\t\t\tlength(vec2(dx + ddx, dy))\n\t\t) :\n\t\t(bt ?\n\t\t\tlength(vec2(dx, dy + ddy)) :\n\t\t\t100.0\n\t\t)\n\t);\n}\n\nfloat calcDistancesY( float x, float y, float dx ) {\n\tfloat d = 100.0;\n\tfor( float dy=-6.0; dy<6.5; dy++ ) {\n\t\td = min( d, calcDistance( x, y, dx, dy ) );\n\t}\n\treturn d;\n}\n\nfloat calcDistances( float x, float y ) {\n\tfloat d = 100.0;\n\tfor( float dx=-6.0; dx<6.5; dx++ ) {\n\t\td = min( d, calcDistancesY( x, y, dx ) );\n\t}\n\treturn d;\n}\n\nvoid main(void) {\n\tfloat t = texture2D(uSampler, vTextureCoord).a;\n\tfloat x = vTextureCoord.x * uSize.x;\n\tfloat y = vTextureCoord.y * uSize.y;\n\tfloat d = min( 6.0, calcDistances( x, y ) ) / 12.0;\n\td = clamp( mix( 0.5 - d, 0.5 + d, step( 0.5, t ) ), 0.0, 1.0 );\n\tgl_FragColor = vec4(1.0, 1.0, 1.0, d);\n}\n";
     var DynamicSDFFontGenerator = /** @class */ (function () {
         function DynamicSDFFontGenerator() {
             var _this = this;
@@ -21323,9 +21039,9 @@
      */
     var EShapeEmbeddedLayer = /** @class */ (function (_super) {
         __extends(EShapeEmbeddedLayer, _super);
-        function EShapeEmbeddedLayer(name, isEditMode, type) {
+        function EShapeEmbeddedLayer(name, type) {
             if (type === void 0) { type = EShapeType.EMBEDDED_LAYER; }
-            var _this = _super.call(this, isEditMode, type) || this;
+            var _this = _super.call(this, type) || this;
             _this._name = name;
             return _this;
         }
@@ -21357,7 +21073,7 @@
         };
         EShapeEmbeddedLayer.prototype.newClone = function () {
             var constructor = this.constructor;
-            return new constructor(this._name, this._isEditMode, this.type);
+            return new constructor(this._name, this.type);
         };
         EShapeEmbeddedLayer.prototype.serializeChildren = function (manager) {
             return [];
@@ -21797,9 +21513,7 @@
     var deserializeEmbeddedLayer = function (serialized, manager, width, height, creator) {
         var _a, _b, _c;
         var name = deserializeEmbeddedLayerName(serialized[0], manager);
-        var result = creator
-            ? creator(name, manager)
-            : new EShapeEmbeddedLayer(name, manager.isEditMode);
+        var result = creator ? creator(name, manager) : new EShapeEmbeddedLayer(name);
         var visibility = serialized[1];
         var visible = visibility == null || !!(visibility & 0x2);
         if (!visible) {
@@ -21812,6 +21526,7 @@
         var sizeX = (_a = serialized[4]) !== null && _a !== void 0 ? _a : width;
         var sizeY = (_b = serialized[5]) !== null && _b !== void 0 ? _b : height;
         result.size.set(sizeX, sizeY);
+        result.size.init();
         var fillId = serialized[6];
         if (fillId != null) {
             result.fill.deserialize(fillId, manager);
@@ -22107,42 +21822,42 @@
                 }
             }
         };
-        EShapeActionRuntimes.write = function (shape, id, value, time, remote) {
+        EShapeActionRuntimes.writeLocal = function (shape, id, value, time, state) {
             var _a;
-            if (remote) {
-                var container = this.toContainer(shape);
-                if (container) {
-                    return container.data.remote.set(id, value, time);
-                }
-            }
-            else {
-                var current = shape;
-                while (current != null) {
-                    if (this.isContainer(current)) {
-                        if (current.data.private.set(id, value, time)) {
-                            DApplications.update(current);
-                            return true;
-                        }
-                        else if (current.data.protected.set(id, value, time)) {
-                            DApplications.update(current);
-                            return true;
-                        }
-                        else {
-                            if (current.data.set(id, value, time)) {
-                                DApplications.update(current);
-                                return true;
-                            }
-                        }
-                        return false;
+            if (state === void 0) { state = EShapeDataValueState.FOUND; }
+            var current = shape;
+            while (current != null) {
+                if (this.isContainer(current)) {
+                    if (current.data.private.set(id, value, time, state)) {
+                        DApplications.update(current);
+                        return true;
+                    }
+                    else if (current.data.protected.set(id, value, time, state)) {
+                        DApplications.update(current);
+                        return true;
                     }
-                    else if (this.isEmbedded(current)) {
-                        if ((_a = current.data.getPrivate()) === null || _a === void 0 ? void 0 : _a.set(id, value, time)) {
+                    else {
+                        if (current.data.set(id, value, time, state)) {
                             DApplications.update(current);
                             return true;
                         }
                     }
-                    current = current.parent;
+                    return false;
                 }
+                else if (this.isEmbedded(current)) {
+                    if ((_a = current.data.getPrivate()) === null || _a === void 0 ? void 0 : _a.set(id, value, time, state)) {
+                        DApplications.update(current);
+                        return true;
+                    }
+                }
+                current = current.parent;
+            }
+            return false;
+        };
+        EShapeActionRuntimes.writeRemote = function (shape, id, value) {
+            var container = this.toContainer(shape);
+            if (container) {
+                return container.data.remote.set(id, value);
             }
             return false;
         };
@@ -24189,14 +23904,14 @@
                     EShapeActionRuntimes.emit(shape, target, value, time);
                     break;
                 case EShapeActionValueOnInputAction.WRITE_LOCAL:
-                    EShapeActionRuntimes.write(shape, target, value, time, false);
+                    EShapeActionRuntimes.writeLocal(shape, target, value, time);
                     break;
                 case EShapeActionValueOnInputAction.WRITE_REMOTE:
-                    EShapeActionRuntimes.write(shape, target, value, time, true);
+                    EShapeActionRuntimes.writeRemote(shape, target, value);
                     break;
                 case EShapeActionValueOnInputAction.WRITE_BOTH:
-                    EShapeActionRuntimes.write(shape, target, value, time, false);
-                    EShapeActionRuntimes.write(shape, target, value, time, true);
+                    EShapeActionRuntimes.writeLocal(shape, target, value, time);
+                    EShapeActionRuntimes.writeRemote(shape, target, value);
                     break;
             }
         };
@@ -24397,8 +24112,8 @@
             return _super !== null && _super.apply(this, arguments) || this;
         }
         EShapeActionRuntimeMiscWriteBoth.prototype.write = function (shape, target, value, time) {
-            EShapeActionRuntimes.write(shape, target, value, time, false);
-            EShapeActionRuntimes.write(shape, target, value, time, true);
+            EShapeActionRuntimes.writeLocal(shape, target, value, time);
+            EShapeActionRuntimes.writeRemote(shape, target, value);
         };
         return EShapeActionRuntimeMiscWriteBoth;
     }(EShapeActionRuntimeMiscWrite));
@@ -24413,7 +24128,7 @@
             return _super !== null && _super.apply(this, arguments) || this;
         }
         EShapeActionRuntimeMiscWriteLocal.prototype.write = function (shape, target, value, time) {
-            EShapeActionRuntimes.write(shape, target, value, time, false);
+            EShapeActionRuntimes.writeLocal(shape, target, value, time);
         };
         return EShapeActionRuntimeMiscWriteLocal;
     }(EShapeActionRuntimeMiscWrite));
@@ -24428,7 +24143,7 @@
             return _super !== null && _super.apply(this, arguments) || this;
         }
         EShapeActionRuntimeMiscWriteRemote.prototype.write = function (shape, target, value, time) {
-            EShapeActionRuntimes.write(shape, target, value, time, true);
+            EShapeActionRuntimes.writeRemote(shape, target, value);
         };
         return EShapeActionRuntimeMiscWriteRemote;
     }(EShapeActionRuntimeMiscWrite));
@@ -32251,6 +31966,18 @@
         return EShapeActionValueTransformMove;
     }(EShapeActionValueOpetyped));
 
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var toSizeNormalized = function (size) {
+        var THRESHOLD = 0.001;
+        if (Math.abs(size) < THRESHOLD) {
+            return size < 0 ? -THRESHOLD : +THRESHOLD;
+        }
+        return size;
+    };
+
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
@@ -32992,6 +32719,179 @@
         EShapeDeserializers[EShapeType.BAR] = deserializeBar;
     };
 
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    /* eslint-disable prettier/prettier */
+    var NONE = 0x0;
+    var ID = 0x1;
+    var POSITION = 0x2;
+    var WIDTH = 0x4;
+    var HEIGHT = 0x8;
+    var ROTATION = 0x10;
+    var SKEW = 0x20;
+    var REPLACING = 0x40;
+    var GROUPING = 0x80;
+    var UNGROUPING = 0x100;
+    var FILL = 0x200;
+    var STROKE = 0x400;
+    var STROKE_SIDE = 0x800;
+    var BORDER_RADIUS = 0x1000;
+    var TEXT = 0x2000;
+    var TEXTURE = 0x4000;
+    var DATA = 0x8000;
+    var ACTION = 0x10000;
+    var CURSOR = 0x20000;
+    var ORDER_IN_LAYER = 0x40000;
+    var CHILDREN = 0x80000;
+    var DATA_MAPPING = 0x100000;
+    var COORDINATE = ID | POSITION | WIDTH | HEIGHT | ROTATION | SKEW;
+    var SHAPE = REPLACING | GROUPING | FILL | STROKE;
+    var LAYER = ORDER_IN_LAYER;
+    var PRIMITIVE = COORDINATE | SHAPE | TEXT | TEXTURE | DATA | ACTION | CURSOR | LAYER | CHILDREN;
+    var GROUP = PRIMITIVE | UNGROUPING;
+    var EMBEDDED = COORDINATE | REPLACING | GROUPING | TEXT | DATA | ACTION | LAYER | DATA_MAPPING;
+    var CONNECTOR = ID | REPLACING | FILL | STROKE | TEXT | TEXTURE | DATA | ACTION | CURSOR | LAYER | CHILDREN;
+    var ALL = PRIMITIVE | STROKE_SIDE | BORDER_RADIUS | DATA_MAPPING | UNGROUPING;
+    var EShapeCapability = {
+        NONE: NONE,
+        /**
+         * Allows shape IDs to be modified.
+         */
+        ID: ID,
+        /**
+         * Allows shape positions to be modified.
+         */
+        POSITION: POSITION,
+        /**
+         * Allows shape widths to be modified.
+         */
+        WIDTH: WIDTH,
+        /**
+         * Allows shape heights to be modified.
+         */
+        HEIGHT: HEIGHT,
+        /**
+         * Allows shape rotations to be modified.
+         */
+        ROTATION: ROTATION,
+        /**
+         * Allows shape skews to be modified.
+         */
+        SKEW: SKEW,
+        /** @deprecated */
+        ALIGN: NONE,
+        /**
+         * Allows shapes to be replaced with other shapes.
+         */
+        REPLACING: REPLACING,
+        /**
+         * Allows shapes to be grouped.
+         */
+        GROUPING: GROUPING,
+        /**
+         * Allows grouped shapes to be ungrouped.
+         */
+        UNGROUPING: UNGROUPING,
+        /**
+         * Allows shape fills to be modified.
+         */
+        FILL: FILL,
+        /**
+         * Allows shape strokes to be modified.
+         */
+        STROKE: STROKE,
+        /**
+         * Allows shape stroke sides to be modified.
+         */
+        STROKE_SIDE: STROKE_SIDE,
+        /**
+         * Allows shape border radiuses to be modified.
+         */
+        BORDER_RADIUS: BORDER_RADIUS,
+        /**
+         * Allows shape texts to be modified.
+         */
+        TEXT: TEXT,
+        /**
+         * Allows shape textures to be modified.
+         */
+        TEXTURE: TEXTURE,
+        /** @deprecated in favor of {@link DATA} */
+        TAG: DATA,
+        /**
+         * Allows shape data to be modified.
+         */
+        DATA: DATA,
+        /**
+         * Allows shape data mapping to be modified.
+         */
+        DATA_MAPPING: DATA_MAPPING,
+        /**
+         * Allows shape actions to be modified.
+         */
+        ACTION: ACTION,
+        /**
+         * Allows shape cursors to be modified.
+         */
+        CURSOR: CURSOR,
+        /**
+         * Allows shape orders in layer to be modified.
+         */
+        ORDER_IN_LAYER: ORDER_IN_LAYER,
+        /**
+         * Allows shape children to be modified.
+         */
+        CHILDREN: CHILDREN,
+        COORDINATE: COORDINATE,
+        SHAPE: SHAPE,
+        LAYER: LAYER,
+        PRIMITIVE: PRIMITIVE,
+        GROUP: GROUP,
+        EMBEDDED: EMBEDDED,
+        CONNECTOR: CONNECTOR,
+        ALL: ALL
+    };
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var EShapeCapabilities = /** @class */ (function () {
+        function EShapeCapabilities() {
+        }
+        EShapeCapabilities.get = function (type) {
+            var capability = this.mappings[type];
+            if (capability != null) {
+                return capability;
+            }
+            return EShapeCapability.PRIMITIVE;
+        };
+        EShapeCapabilities.contains = function (shape, target) {
+            if (shape != null) {
+                var capability = this.get(shape.type);
+                if (capability & target) {
+                    return true;
+                }
+                if (capability & EShapeCapability.CHILDREN) {
+                    var children = shape.children;
+                    for (var i = 0, imax = children.length; i < imax; ++i) {
+                        if (this.contains(children[i], target)) {
+                            return true;
+                        }
+                    }
+                }
+            }
+            return false;
+        };
+        EShapeCapabilities.set = function (type, capability) {
+            this.mappings[type] = capability;
+        };
+        EShapeCapabilities.mappings = {};
+        return EShapeCapabilities;
+    }());
+
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
@@ -36784,7 +36684,7 @@
      * SPDX-License-Identifier: Apache-2.0
      */
     var create = function (name, width, height, container, manager, item, shape) {
-        shape = shape || new EShapeEmbedded(name, manager.isEditMode);
+        shape = shape || new EShapeEmbedded(name);
         var result = deserializeBase(item, manager, shape);
         var shapeSize = shape.size;
         var sizeX = shapeSize.x;
@@ -36797,17 +36697,18 @@
         return result;
     };
     var createMissing = function (name, manager, item, shape) {
-        shape = shape || new EShapeEmbedded(name, manager.isEditMode);
+        shape = shape || new EShapeEmbedded(name);
         var result = deserializeBase(item, manager, shape);
         var size = shape.size;
         var sizeX = size.x;
         var sizeY = size.y;
         var children = shape.children;
-        var layer = new EShapeEmbeddedLayer("missing", manager.isEditMode);
+        var layer = new EShapeEmbeddedLayer("missing");
         var px = 0.5 * sizeX;
         var py = 0.5 * sizeX;
         layer.transform.position.set(-px, -py);
         layer.size.set(sizeX, sizeY);
+        layer.size.init();
         layer.parent = shape;
         var rectangle = new EShapeRectangle();
         rectangle.stroke.color = 0xff0000;
@@ -37108,89 +37009,467 @@
                     return points.getMarker();
                 }
             }
-            return undefined;
+            return undefined;
+        };
+        Object.defineProperty(EShapeGroupPoints.prototype, "formatter", {
+            get: function () {
+                var children = this._parent.children;
+                if (0 < children.length) {
+                    var points = children[children.length - 1].points;
+                    if (points != null) {
+                        return points.formatter;
+                    }
+                }
+                return null;
+            },
+            set: function (formatter) {
+                var children = this._parent.children;
+                for (var i = 0, imax = children.length; i < imax; ++i) {
+                    var points = children[i].points;
+                    if (points != null) {
+                        points.formatter = formatter;
+                    }
+                }
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(EShapeGroupPoints.prototype, "formatted", {
+            get: function () {
+                var children = this._parent.children;
+                if (0 < children.length) {
+                    var points = children[children.length - 1].points;
+                    if (points != null) {
+                        return points.formatted;
+                    }
+                }
+                return this;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        EShapeGroupPoints.prototype.copy = function (source) {
+            var children = this._parent.children;
+            for (var i = 0, imax = children.length; i < imax; ++i) {
+                var points = children[i].points;
+                if (points != null) {
+                    points.copy(source);
+                }
+            }
+            return this;
+        };
+        EShapeGroupPoints.prototype.set = function (values, segments, style) {
+            var children = this._parent.children;
+            for (var i = 0, imax = children.length; i < imax; ++i) {
+                var points = children[i].points;
+                if (points != null) {
+                    points.set(values, segments, style);
+                }
+            }
+            return this;
+        };
+        EShapeGroupPoints.prototype.clone = function (parent) {
+            return new EShapeGroupPoints(parent);
+        };
+        EShapeGroupPoints.prototype.toPoints = function (transform) {
+            var children = this._parent.children;
+            for (var i = 0, imax = children.length; i < imax; ++i) {
+                var points = children[i].points;
+                if (points != null) {
+                    return points.toPoints(transform);
+                }
+            }
+            return [];
+        };
+        EShapeGroupPoints.prototype.serialize = function (manager) {
+            var children = this._parent.children;
+            for (var i = 0, imax = children.length; i < imax; ++i) {
+                var points = children[i].points;
+                if (points != null) {
+                    return points.serialize(manager);
+                }
+            }
+            return -1;
+        };
+        return EShapeGroupPoints;
+    }());
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var EShapeEditor = /** @class */ (function () {
+        function EShapeEditor() {
+            this.localTransform = new pixi_js.Matrix();
+            this.internalTransform = new pixi_js.Matrix();
+            this.internalTransformParentInverse = new pixi_js.Matrix();
+            this.rotation = 0;
+            this.size = new pixi_js.Point();
+        }
+        return EShapeEditor;
+    }());
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var EShapeTransforms = /** @class */ (function () {
+        function EShapeTransforms() {
+        }
+        EShapeTransforms.prepare = function (shape) {
+            var editor = shape.editor || new EShapeEditor();
+            shape.editor = editor;
+            // Transform
+            shape.updateTransform();
+            var parent = shape.parent;
+            if (parent instanceof EShapeBase) {
+                parent.transform.internalTransform
+                    .copyTo(editor.internalTransformParentInverse)
+                    .invert();
+            }
+            else {
+                editor.internalTransformParentInverse.identity();
+            }
+            shape.transform.internalTransform.copyTo(editor.internalTransform);
+            // Rotation
+            editor.rotation = shape.transform.rotation;
+            // Size
+            editor.size.copyFrom(shape.size);
+            //
+            shape.disallowOnTransformChange();
+        };
+        EShapeTransforms.finalize = function (shape) {
+            shape.allowOnTransformChange(true);
+        };
+        EShapeTransforms.apply = function (shape, transform, keepSize) {
+            var editor = shape.editor;
+            if (editor != null) {
+                var newLocalTransform = editor.localTransform;
+                editor.internalTransformParentInverse
+                    .copyTo(newLocalTransform)
+                    .append(transform)
+                    .append(editor.internalTransform);
+                if (keepSize) {
+                    this.applyLocal(shape, newLocalTransform);
+                }
+                else {
+                    var size = editor.size;
+                    this.applyLocal(shape, newLocalTransform, size.x, size.y);
+                }
+            }
         };
-        Object.defineProperty(EShapeGroupPoints.prototype, "formatter", {
+        EShapeTransforms.applyLocal = function (shape, localTransform, bx, by) {
+            shape.disallowUploadedUpdate();
+            // Reconstruct the position, the rotation and the size
+            var a = localTransform.a;
+            var b = localTransform.b;
+            var c = localTransform.c;
+            var d = localTransform.d;
+            var tx = localTransform.tx;
+            var ty = localTransform.ty;
+            // Rotation
+            var transform = shape.transform;
+            var rx = Math.atan2(-c, d); // rotation - skewX
+            var ry = Math.atan2(+b, a); // rotation + skewY
+            transform.rotation = (rx + ry) * 0.5; // Here, assumes `skewX` === `skewY`
+            // Skew
+            var skew = (ry - rx) * 0.5;
+            transform.skew.set(skew, skew);
+            // Position: Assumes the pivot is invariant.
+            // tx = position.x - (a * px + c * py)
+            // ty = position.y - (b * px + d * py)
+            //
+            // Thus,
+            // position.x = tx + (a * px + c * py)
+            // position.y = ty + (b * px + d * py)
+            var pivot = transform.pivot;
+            var px = pivot.x;
+            var py = pivot.y;
+            transform.position.set(tx + (a * px + c * py), ty + (b * px + d * py));
+            // Scale
+            if (bx != null && by != null) {
+                var sx = Math.sqrt(a * a + b * b);
+                var sy = Math.sqrt(c * c + d * d);
+                shape.size.set(toSizeNormalized(bx * sx), toSizeNormalized(by * sy));
+            }
+            //
+            shape.allowUploadedUpdate();
+        };
+        return EShapeTransforms;
+    }());
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var EShapeGroupSizeLayout = /** @class */ (function () {
+        function EShapeGroupSizeLayout(shape, bx, by) {
+            this.shape = shape;
+            // Base group size
+            this.base = new pixi_js.Point(bx, by);
+            // Base shape size
+            var size = shape.size;
+            this.shapeBase = new pixi_js.Point(size.x, size.y);
+            // Transform
+            this.transform = new pixi_js.Matrix();
+            shape.updateTransform();
+            shape.transform.localTransform.copyTo(this.transform);
+            this.capable =
+                EShapeCapabilities.contains(shape, EShapeCapability.POSITION) &&
+                    EShapeCapabilities.contains(shape, EShapeCapability.WIDTH) &&
+                    EShapeCapabilities.contains(shape, EShapeCapability.HEIGHT) &&
+                    EShapeCapabilities.contains(shape, EShapeCapability.ROTATION) &&
+                    EShapeCapabilities.contains(shape, EShapeCapability.SKEW);
+        }
+        EShapeGroupSizeLayout.prototype.isCompatible = function (shape) {
+            return this.shape === shape;
+        };
+        EShapeGroupSizeLayout.prototype.reset = function (shape, baseX, baseY) {
+            this.base.set(baseX, baseY);
+            // Base shape size
+            var size = shape.size;
+            this.shapeBase.copyFrom(size);
+            // Transform
+            shape.updateTransform();
+            shape.transform.localTransform.copyTo(this.transform);
+        };
+        EShapeGroupSizeLayout.prototype.update = function (shape, baseX, baseY, pivotX, pivotY) {
+            if (!this.capable) {
+                return;
+            }
+            var sx = baseX / this.base.x;
+            var sy = baseY / this.base.y;
+            var childBase = this.shapeBase;
+            var transform = EShapeGroupSizeLayout.WORK_TRANSFORM;
+            transform
+                .identity()
+                .append(this.transform)
+                .translate(-pivotX, -pivotY)
+                .scale(sx, sy)
+                .translate(+pivotX, +pivotY);
+            shape.disallowOnTransformChange();
+            EShapeTransforms.applyLocal(shape, transform, childBase.x, childBase.y);
+            shape.allowOnTransformChange(false);
+        };
+        EShapeGroupSizeLayout.WORK_TRANSFORM = new pixi_js.Matrix();
+        return EShapeGroupSizeLayout;
+    }());
+
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var EShapeGroupSizeEditor = /** @class */ (function () {
+        function EShapeGroupSizeEditor(parent, x, y, isFittable) {
+            this._workRectForCalcRect = new pixi_js.Rectangle();
+            this._workRectForFit = new pixi_js.Rectangle();
+            this._parent = parent;
+            this._layouts = [];
+            this._size = new pixi_js.Point(x, y);
+            this._isFittable = isFittable;
+        }
+        EShapeGroupSizeEditor.prototype.init = function () {
+            // DO NOTHING
+        };
+        Object.defineProperty(EShapeGroupSizeEditor.prototype, "x", {
             get: function () {
-                var children = this._parent.children;
-                if (0 < children.length) {
-                    var points = children[children.length - 1].points;
-                    if (points != null) {
-                        return points.formatter;
-                    }
-                }
-                return null;
+                return this._size.x;
             },
-            set: function (formatter) {
-                var children = this._parent.children;
-                for (var i = 0, imax = children.length; i < imax; ++i) {
-                    var points = children[i].points;
-                    if (points != null) {
-                        points.formatter = formatter;
-                    }
+            set: function (x) {
+                var size = this._size;
+                if (size.x !== x) {
+                    var ox = size.x;
+                    size.x = x;
+                    this.onChange(ox, size.y);
                 }
             },
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(EShapeGroupPoints.prototype, "formatted", {
+        Object.defineProperty(EShapeGroupSizeEditor.prototype, "y", {
             get: function () {
-                var children = this._parent.children;
-                if (0 < children.length) {
-                    var points = children[children.length - 1].points;
-                    if (points != null) {
-                        return points.formatted;
-                    }
+                return this._size.y;
+            },
+            set: function (y) {
+                var size = this._size;
+                if (size.y !== y) {
+                    var oy = size.y;
+                    size.y = y;
+                    this.onChange(size.x, oy);
                 }
-                return this;
             },
             enumerable: false,
             configurable: true
         });
-        EShapeGroupPoints.prototype.copy = function (source) {
-            var children = this._parent.children;
-            for (var i = 0, imax = children.length; i < imax; ++i) {
-                var points = children[i].points;
-                if (points != null) {
-                    points.copy(source);
-                }
+        EShapeGroupSizeEditor.prototype.set = function (x, y) {
+            var isChanged = false;
+            var size = this._size;
+            var ox = size.x;
+            var oy = size.y;
+            if (x != null && ox !== x) {
+                isChanged = true;
+                size.x = x;
+            }
+            if (y != null && oy !== y) {
+                isChanged = true;
+                size.y = y;
+            }
+            if (isChanged) {
+                this.onChange(ox, oy);
             }
             return this;
         };
-        EShapeGroupPoints.prototype.set = function (values, segments, style) {
-            var children = this._parent.children;
-            for (var i = 0, imax = children.length; i < imax; ++i) {
-                var points = children[i].points;
-                if (points != null) {
-                    points.set(values, segments, style);
-                }
+        EShapeGroupSizeEditor.prototype.clone = function () {
+            var size = this._size;
+            return new EShapeGroupSizeEditor(this._parent, size.x, size.y, this._isFittable);
+        };
+        EShapeGroupSizeEditor.prototype.copy = function () {
+            // DO NOTHING
+        };
+        EShapeGroupSizeEditor.prototype.copyFrom = function (point) {
+            var x = point.x;
+            var y = point.y;
+            var size = this._size;
+            var ox = size.x;
+            var oy = size.y;
+            if (ox !== x || oy !== y) {
+                size.x = x;
+                size.y = y;
+                this.onChange(ox, oy);
             }
             return this;
         };
-        EShapeGroupPoints.prototype.clone = function (parent) {
-            return new EShapeGroupPoints(parent);
+        EShapeGroupSizeEditor.prototype.copyTo = function (point) {
+            return this._size.copyTo(point);
         };
-        EShapeGroupPoints.prototype.toPoints = function (transform) {
-            var children = this._parent.children;
-            for (var i = 0, imax = children.length; i < imax; ++i) {
-                var points = children[i].points;
-                if (points != null) {
-                    return points.toPoints(transform);
+        EShapeGroupSizeEditor.prototype.equals = function (point) {
+            return this._size.equals(point);
+        };
+        EShapeGroupSizeEditor.prototype.fit = function () {
+            if (this._isFittable) {
+                this.doFit();
+            }
+        };
+        EShapeGroupSizeEditor.prototype.doFit = function () {
+            var parent = this._parent;
+            parent.disallowOnTransformChange();
+            // Calculate the rect
+            var rect = this.calcRect(this._workRectForFit);
+            // Set size
+            var size = this._size;
+            size.set(rect.width, rect.height);
+            // Position & Pivot
+            // rx := rect.x
+            // ry := rect.y
+            //
+            // | a c tx | | 1 0 +rx | | 1 0 -rx |   | a c tx + (a * rx + c * ry) | | 1 0 -rx |
+            // | b d ty | | 0 1 +ry | | 0 1 -ry | = | b d ty + (b * rx + d * ry) | | 0 1 -ry |
+            // | 0 0 1  | | 0 0  1  | | 0 0  1  |   | 0 0 1                      | | 0 0  1  |
+            //
+            // tx -> tx + (a * rx + c * ry) = poxition.x - (a * pivot.x + c * pivot.y)
+            // ty -> ty + (b * rx + d * ry) = poxition.y - (b * pivot.x + d * pivot.y)
+            // position.x -> position.x + (a * rx + c * ry) - (a * pivot.x + c * pivot.y)
+            // position.y -> position.y + (b * rx + d * ry) - (b * pivot.x + d * pivot.y)
+            // pivot.x -> 0
+            // pivot.y -> 0
+            //
+            // a -> a', b -> b', c -> c', tx -> tx', ty -> ty'
+            //
+            // | a' c' tx' | | 1 0 -rx |   | a' c' tx' - (a' * rx + c' * ry) |
+            // | b' d' ty' | | 0 1 -ry | = | b' d' ty' - (b' * rx + d' * ry) |
+            // | 0  0  1   | | 0 0  1  |   | 0  0  1                         |
+            //
+            // tx' -> tx' - (a' * rx + c' * ry) = poxition.x - (a' * pivot.x + c' * pivot.y)
+            // ty' -> ty' - (b' * rx + d' * ry) = poxition.y - (b' * pivot.x + d' * pivot.y)
+            // pivot.x -> pivot.x + rx
+            // pivot.y -> pivot.y + ry
+            parent.updateTransform();
+            var transform = parent.transform;
+            var x = rect.x + rect.width * 0.5;
+            var y = rect.y + rect.height * 0.5;
+            var position = transform.position;
+            var localTransform = transform.localTransform;
+            var a = localTransform.a;
+            var b = localTransform.b;
+            var c = localTransform.c;
+            var d = localTransform.d;
+            var pivot = transform.pivot;
+            position.set(position.x + (a * x + c * y) - (a * pivot.x + c * pivot.y), position.y + (b * x + d * y) - (b * pivot.x + d * pivot.y));
+            pivot.set(x, y);
+            // Reset the data
+            this.reset(parent.children, this._layouts, size);
+            //
+            parent.allowOnTransformChange(true);
+        };
+        EShapeGroupSizeEditor.prototype.reset = function (children, layouts, size) {
+            for (var i = 0, imax = Math.min(layouts.length, children.length); i < imax; ++i) {
+                var child = children[i];
+                var layout = layouts[i];
+                if (layout.isCompatible(child)) {
+                    layout.reset(child, size.x, size.y);
+                }
+                else {
+                    layouts.length = i;
+                    break;
                 }
             }
-            return [];
+            if (children.length < layouts.length) {
+                layouts.length = children.length;
+            }
         };
-        EShapeGroupPoints.prototype.serialize = function (manager) {
-            var children = this._parent.children;
-            for (var i = 0, imax = children.length; i < imax; ++i) {
-                var points = children[i].points;
-                if (points != null) {
-                    return points.serialize(manager);
+        EShapeGroupSizeEditor.prototype.calcRect = function (result) {
+            var parent = this._parent;
+            var children = parent.children;
+            if (children.length <= 0) {
+                result.x = 0;
+                result.y = 0;
+                result.width = 0;
+                result.height = 0;
+            }
+            else {
+                var workRect = this._workRectForCalcRect;
+                children[0].getBoundsLocal(false, result);
+                for (var i = 1, imax = children.length; i < imax; ++i) {
+                    var child = children[i];
+                    child.getBoundsLocal(false, workRect);
+                    result.enlarge(workRect);
                 }
             }
-            return -1;
+            return result;
         };
-        return EShapeGroupPoints;
+        EShapeGroupSizeEditor.prototype.onChange = function (ox, oy) {
+            var parent = this._parent;
+            var size = this._size;
+            var pivot = parent.transform.pivot;
+            this.onChange_(parent.children, this._layouts, size.x, size.y, pivot.x, pivot.y, ox, oy);
+            parent.onSizeChange();
+        };
+        EShapeGroupSizeEditor.prototype.onChange_ = function (children, layouts, sx, sy, px, py, ox, oy) {
+            for (var i = 0, imax = Math.min(layouts.length, children.length); i < imax; ++i) {
+                var child = children[i];
+                var layout = layouts[i];
+                if (layout.isCompatible(child)) {
+                    layout.update(child, sx, sy, px, py);
+                }
+                else {
+                    layouts.length = i;
+                    break;
+                }
+            }
+            for (var i = layouts.length, imax = children.length; i < imax; ++i) {
+                var child = children[i];
+                var layout = this.newLayout(child, ox, oy);
+                layout.update(child, sx, sy, px, py);
+                layouts.push(layout);
+            }
+            if (layouts.length !== children.length) {
+                layouts.length = children.length;
+            }
+        };
+        EShapeGroupSizeEditor.prototype.newLayout = function (shape, ox, oy) {
+            return shape.layout || new EShapeGroupSizeLayout(shape, ox, oy);
+        };
+        return EShapeGroupSizeEditor;
     }());
 
     /*
@@ -43043,7 +43322,7 @@
             });
         };
         EShapeEmbeddeds.create = function (name, width, height, container, manager) {
-            var shape = new EShapeEmbedded(name, manager.isEditMode);
+            var shape = new EShapeEmbedded(name);
             shape.size.set(width, height);
             container.copyTo(shape);
             shape.size.init();
@@ -44743,6 +45022,19 @@
         return DynamicFontAtlases;
     }());
 
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var isObject = function (target) {
+        if (typeof target === "object" &&
+            Object.prototype.toString.call(target) === "[object Object]") {
+            var prototype = Object.getPrototypeOf(target);
+            return prototype == null || prototype === Object.prototype;
+        }
+        return false;
+    };
+
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
@@ -44806,6 +45098,36 @@
         return Math.max(i0, i1);
     };
 
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var toClonedArray = function (target) {
+        var result = [];
+        for (var i = 0, imax = target.length; i < imax; ++i) {
+            result[i] = target[i];
+        }
+        return result;
+    };
+    var toClonedObject = function (target) {
+        var result = {};
+        for (var key in target) {
+            if (Object.hasOwnProperty.call(target, key)) {
+                result[key] = toCloned(target[key]);
+            }
+        }
+        return result;
+    };
+    var toCloned = function (target) {
+        if (isArray(target)) {
+            return toClonedArray(target);
+        }
+        else if (isObject(target)) {
+            return toClonedObject(target);
+        }
+        return target;
+    };
+
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
@@ -44831,6 +45153,46 @@
         return "";
     };
 
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var toMerged = function (one, other) {
+        if (one != null) {
+            var o = toCloned(one);
+            if (other != null) {
+                for (var key in other) {
+                    if (Object.prototype.hasOwnProperty.call(other, key)) {
+                        var otherValue = other[key];
+                        if (isObject(otherValue)) {
+                            if (Object.prototype.hasOwnProperty.call(o, key)) {
+                                var oneValue = o[key];
+                                if (isObject(oneValue)) {
+                                    toMerged(oneValue, otherValue);
+                                }
+                            }
+                            else {
+                                o[key] = toCloned(otherValue);
+                            }
+                        }
+                        else {
+                            if (!Object.prototype.hasOwnProperty.call(o, key)) {
+                                o[key] = otherValue;
+                            }
+                        }
+                    }
+                }
+            }
+            return o;
+        }
+        else if (other != null) {
+            return toCloned(other);
+        }
+        else {
+            return {};
+        }
+    };
+
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
@@ -46295,9 +46657,9 @@
     var isCommandClean = function (command) {
         return !!(command.getFlag() & DCommandFlag.CLEAN);
     };
-    var DControllerDefaultCommand = /** @class */ (function (_super) {
-        __extends(DControllerDefaultCommand, _super);
-        function DControllerDefaultCommand() {
+    var DControllerCommandImpl = /** @class */ (function (_super) {
+        __extends(DControllerCommandImpl, _super);
+        function DControllerCommandImpl() {
             var _this = _super.call(this) || this;
             _this._position = 0;
             _this._done = [];
@@ -46305,7 +46667,7 @@
             _this._executing = null;
             return _this;
         }
-        DControllerDefaultCommand.prototype.last = function () {
+        DControllerCommandImpl.prototype.last = function () {
             var done = this._done;
             var waiting = this._waiting;
             if (waiting.length <= 0) {
@@ -46320,11 +46682,11 @@
                 return waiting[waiting.length - 1];
             }
         };
-        DControllerDefaultCommand.prototype.push = function (command) {
+        DControllerCommandImpl.prototype.push = function (command) {
             this._waiting.push(command);
             this.next();
         };
-        DControllerDefaultCommand.prototype.next = function () {
+        DControllerCommandImpl.prototype.next = function () {
             if (this._executing != null) {
                 // Still executing a command.
                 // So do nothing.
@@ -46352,7 +46714,7 @@
                 this.execute(command);
             }
         };
-        DControllerDefaultCommand.prototype.executeUndo = function (command) {
+        DControllerCommandImpl.prototype.executeUndo = function (command) {
             var _this = this;
             var done = this._done;
             if (this._position < done.length) {
@@ -46375,7 +46737,7 @@
                 }
             }
         };
-        DControllerDefaultCommand.prototype.executeRedo = function (command) {
+        DControllerCommandImpl.prototype.executeRedo = function (command) {
             var _this = this;
             var done = this._done;
             if (0 < this._position) {
@@ -46398,7 +46760,7 @@
                 }
             }
         };
-        DControllerDefaultCommand.prototype.execute = function (command) {
+        DControllerCommandImpl.prototype.execute = function (command) {
             var _this = this;
             var isClear = isCommandClear(command);
             var isStorable = isCommandStorable(command);
@@ -46426,7 +46788,7 @@
                 });
             }
         };
-        DControllerDefaultCommand.prototype.cleanup = function () {
+        DControllerCommandImpl.prototype.cleanup = function () {
             var done = this._done;
             var size = done.length - 100;
             if (0 < size) {
@@ -46436,7 +46798,7 @@
                 }
             }
         };
-        DControllerDefaultCommand.prototype.remove = function (size) {
+        DControllerCommandImpl.prototype.remove = function (size) {
             var done = this._done;
             if (0 < size) {
                 var ifrom = Math.max(0, done.length - size);
@@ -46451,7 +46813,7 @@
             }
             return false;
         };
-        DControllerDefaultCommand.prototype.onSuccess = function (command) {
+        DControllerCommandImpl.prototype.onSuccess = function (command) {
             this._executing = null;
             if (isCommandStorable(command)) {
                 this._done.push(command);
@@ -46462,7 +46824,7 @@
             this.emit("change", this);
             this.next();
         };
-        DControllerDefaultCommand.prototype.onSuccessUndo = function (undoed) {
+        DControllerCommandImpl.prototype.onSuccessUndo = function (undoed) {
             this._executing = null;
             if (!isCommandClean(undoed)) {
                 this.emit("dirty", this);
@@ -46470,7 +46832,7 @@
             this.emit("change", this);
             this.next();
         };
-        DControllerDefaultCommand.prototype.onSuccessRedo = function (redoed) {
+        DControllerCommandImpl.prototype.onSuccessRedo = function (redoed) {
             this._executing = null;
             if (!isCommandClean(redoed)) {
                 this.emit("dirty", this);
@@ -46478,7 +46840,7 @@
             this.emit("change", this);
             this.next();
         };
-        DControllerDefaultCommand.prototype.onFail = function (command) {
+        DControllerCommandImpl.prototype.onFail = function (command) {
             this._executing = null;
             var waiting = this._waiting;
             command.destroy();
@@ -46488,31 +46850,31 @@
             waiting.length = 0;
             this.emit("change", this);
         };
-        DControllerDefaultCommand.prototype.size = function () {
+        DControllerCommandImpl.prototype.size = function () {
             return this._done.length;
         };
-        DControllerDefaultCommand.prototype.clear = function () {
+        DControllerCommandImpl.prototype.clear = function () {
             this.push(new DCommandClear());
         };
-        DControllerDefaultCommand.prototype.redo = function () {
+        DControllerCommandImpl.prototype.redo = function () {
             if (this.isRedoable()) {
                 this._waiting.push(new DCommandRedo());
                 this.next();
             }
         };
-        DControllerDefaultCommand.prototype.undo = function () {
+        DControllerCommandImpl.prototype.undo = function () {
             if (this.isUndoable()) {
                 this._waiting.push(new DCommandUndo());
                 this.next();
             }
         };
-        DControllerDefaultCommand.prototype.isRedoable = function () {
+        DControllerCommandImpl.prototype.isRedoable = function () {
             return 0 < this._position && this._executing == null;
         };
-        DControllerDefaultCommand.prototype.isUndoable = function () {
+        DControllerCommandImpl.prototype.isUndoable = function () {
             return this._position < this._done.length && this._executing == null;
         };
-        return DControllerDefaultCommand;
+        return DControllerCommandImpl;
     }(pixi_js.utils.EventEmitter));
 
     /*
@@ -46599,7 +46961,7 @@
         // Command
         DControllers.getCommandController = function () {
             if (this.COMMAND == null) {
-                this.COMMAND = new DControllerDefaultCommand();
+                this.COMMAND = new DControllerCommandImpl();
             }
             return this.COMMAND;
         };
@@ -46913,11 +47275,11 @@
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
      */
-    var DControllerDefaultFocus = /** @class */ (function () {
-        function DControllerDefaultFocus() {
+    var DControllerFocusImpl = /** @class */ (function () {
+        function DControllerFocusImpl() {
             this._focused = null;
         }
-        DControllerDefaultFocus.prototype.focus = function (focusable) {
+        DControllerFocusImpl.prototype.focus = function (focusable) {
             var previous = this._focused;
             if (previous !== focusable) {
                 if (previous != null) {
@@ -46931,7 +47293,7 @@
             }
             return null;
         };
-        DControllerDefaultFocus.prototype.blur = function (focusable) {
+        DControllerFocusImpl.prototype.blur = function (focusable) {
             if (focusable != null && this._focused === focusable) {
                 this._focused = null;
                 focusable.state.isFocused = false;
@@ -46939,10 +47301,10 @@
             }
             return null;
         };
-        DControllerDefaultFocus.prototype.clear = function () {
+        DControllerFocusImpl.prototype.clear = function () {
             return this.focus(null);
         };
-        DControllerDefaultFocus.prototype.set = function (focusable, isFocused) {
+        DControllerFocusImpl.prototype.set = function (focusable, isFocused) {
             if (isFocused) {
                 return this.focus(focusable);
             }
@@ -46950,10 +47312,10 @@
                 return this.blur(focusable);
             }
         };
-        DControllerDefaultFocus.prototype.get = function () {
+        DControllerFocusImpl.prototype.get = function () {
             return this._focused;
         };
-        DControllerDefaultFocus.prototype.findParent = function (mightBeFocusable) {
+        DControllerFocusImpl.prototype.findParent = function (mightBeFocusable) {
             var current = mightBeFocusable;
             while (current != null) {
                 if (this.isFocusable(current)) {
@@ -46965,7 +47327,7 @@
             }
             return null;
         };
-        DControllerDefaultFocus.prototype.find = function (target, includesTarget, includesTargetChildren, direction, root) {
+        DControllerFocusImpl.prototype.find = function (target, includesTarget, includesTargetChildren, direction, root) {
             if (direction) {
                 var result = this.findNext(target, includesTarget, includesTargetChildren);
                 if (result != null) {
@@ -47079,7 +47441,7 @@
             }
             return null;
         };
-        DControllerDefaultFocus.prototype.findNext = function (target, includesTarget, includesTargetChildren) {
+        DControllerFocusImpl.prototype.findNext = function (target, includesTarget, includesTargetChildren) {
             // Target itself
             if (includesTarget) {
                 if (this.isFocusable(target)) {
@@ -47110,7 +47472,7 @@
             // Found nothing
             return null;
         };
-        DControllerDefaultFocus.prototype.findPrevious = function (target, includesTarget, includesTargetChildren) {
+        DControllerFocusImpl.prototype.findPrevious = function (target, includesTarget, includesTargetChildren) {
             // Target children
             if (includesTargetChildren && this.isFocusableContainer(target) && target.visible) {
                 var children = target.children;
@@ -47141,26 +47503,26 @@
             // Found nothing
             return null;
         };
-        DControllerDefaultFocus.prototype.isFocusable = function (target) {
+        DControllerFocusImpl.prototype.isFocusable = function (target) {
             return (target != null &&
                 "state" in target &&
                 target.state.inEnabled &&
                 target.state.isFocusable &&
                 target.visible);
         };
-        DControllerDefaultFocus.prototype.isFocusableContainer = function (target) {
+        DControllerFocusImpl.prototype.isFocusableContainer = function (target) {
             return target != null && "children" in target;
         };
-        DControllerDefaultFocus.prototype.isFocusRoot = function (target, root) {
+        DControllerFocusImpl.prototype.isFocusRoot = function (target, root) {
             if (target === root) {
                 return true;
             }
             return target != null && "state" in target && target.state.isFocusRoot && target.visible;
         };
-        DControllerDefaultFocus.prototype.isFocusReverse = function (target) {
+        DControllerFocusImpl.prototype.isFocusReverse = function (target) {
             return target != null && "state" in target && target.state.isFocusReverse;
         };
-        return DControllerDefaultFocus;
+        return DControllerFocusImpl;
     }());
 
     /*
@@ -47242,7 +47604,7 @@
         };
         DApplication.prototype.getFocusController = function () {
             if (this._focus == null) {
-                this._focus = new DControllerDefaultFocus();
+                this._focus = new DControllerFocusImpl();
             }
             return this._focus;
         };
@@ -58546,7 +58908,7 @@
                 list.push(value);
             }
         };
-        DDiagramCanvasDataImpl.prototype.set = function (id, value, time, from, to) {
+        DDiagramCanvasDataImpl.prototype.set = function (id, value, time, state, from, to) {
             var data = this._data;
             if (data == null) {
                 return false;
@@ -58568,6 +58930,10 @@
                 if (time !== undefined) {
                     datumValue.time = time;
                 }
+                // State
+                if (state !== undefined) {
+                    datumValue.state = state;
+                }
                 // Value
                 datumValue.value = value;
             }
@@ -58609,7 +58975,7 @@
             }
             return true;
         };
-        DDiagramCanvasDataImpl.prototype.setAll = function (id, values, times, from, to) {
+        DDiagramCanvasDataImpl.prototype.setAll = function (id, values, times, states, from, to) {
             var data = this._data;
             if (data == null) {
                 return false;
@@ -58631,12 +58997,16 @@
                 if (times !== undefined) {
                     datumValue.times = times;
                 }
+                // State
+                if (states !== undefined) {
+                    datumValue.states = states;
+                }
                 // Value
                 datumValue.values = values;
             }
             return true;
         };
-        DDiagramCanvasDataImpl.prototype.setValue = function (id, value, time) {
+        DDiagramCanvasDataImpl.prototype.setValue = function (id, value) {
             var data = this._data;
             if (data == null) {
                 return false;
@@ -58650,15 +59020,11 @@
                 return false;
             }
             for (var i = 0; i < size; ++i) {
-                var datumValue = datum[i];
-                if (time !== undefined) {
-                    datumValue.time = time;
-                }
-                datumValue.value = value;
+                datum[i].value = value;
             }
             return true;
         };
-        DDiagramCanvasDataImpl.prototype.setValues = function (id, values, times) {
+        DDiagramCanvasDataImpl.prototype.setValues = function (id, values) {
             var data = this._data;
             if (data == null) {
                 return false;
@@ -58672,11 +59038,7 @@
                 return false;
             }
             for (var i = 0; i < size; ++i) {
-                var datumValue = datum[i];
-                if (times !== undefined) {
-                    datumValue.times = times;
-                }
-                datumValue.values = values;
+                datum[i].values = values;
             }
             return true;
         };
@@ -58716,6 +59078,42 @@
             }
             return true;
         };
+        DDiagramCanvasDataImpl.prototype.setState = function (id, state) {
+            var data = this._data;
+            if (data == null) {
+                return false;
+            }
+            var datum = data.get(id);
+            if (datum == null) {
+                return false;
+            }
+            var size = datum.length;
+            if (size <= 0) {
+                return false;
+            }
+            for (var i = 0; i < size; ++i) {
+                datum[i].state = state;
+            }
+            return true;
+        };
+        DDiagramCanvasDataImpl.prototype.setStates = function (id, states) {
+            var data = this._data;
+            if (data == null) {
+                return false;
+            }
+            var datum = data.get(id);
+            if (datum == null) {
+                return false;
+            }
+            var size = datum.length;
+            if (size <= 0) {
+                return false;
+            }
+            for (var i = 0; i < size; ++i) {
+                datum[i].states = states;
+            }
+            return true;
+        };
         DDiagramCanvasDataImpl.prototype.setRange = function (id, from, to) {
             var data = this._data;
             if (data == null) {
@@ -59139,7 +59537,7 @@
         DDiagramCanvas.prototype.initialize = function (shapes, mapper) {
             var time = Date.now();
             var actionables = this._actionables;
-            this.initialize_(shapes, null, mapper, new Map(), new Map(), new Map(), this._ticker, this._shape, this._data, actionables);
+            this.initialize_(shapes, null, null, mapper, new Map(), new Map(), new Map(), this._ticker, this._shape, this._data, actionables);
             var layers = this._layer.children;
             for (var i = 0, imax = layers.length; i < imax; ++i) {
                 layers[i].initialize(actionables);
@@ -59154,7 +59552,7 @@
             EShapeActionEnvironment.isInitializing = false;
             this._ticker.start();
         };
-        DDiagramCanvas.prototype.initialize_ = function (shapes, dataShape, mapper, formatToFormatter, initialToInitialValue, actionValueToRuntime, canvasTicker, canvasShape, canvasData, actionables) {
+        DDiagramCanvas.prototype.initialize_ = function (shapes, dataShape, containerShape, mapper, formatToFormatter, initialToInitialValue, actionValueToRuntime, canvasTicker, canvasShape, canvasData, actionables) {
             var _loop_1 = function (i, imax) {
                 var shape = shapes[i];
                 // ID
@@ -59163,7 +59561,7 @@
                     canvasShape.add(id, shape);
                 }
                 // Data
-                this_1.initData(shape, dataShape, mapper, formatToFormatter, initialToInitialValue, canvasTicker, canvasData);
+                this_1.initData(shape, dataShape, containerShape, mapper, formatToFormatter, initialToInitialValue, canvasTicker, canvasData);
                 // Runtime
                 var runtime = new (EShapeRuntimes[shape.type] || EShapeRuntime)(shape);
                 shape.runtime = runtime;
@@ -59185,7 +59583,13 @@
                 // Children
                 var children = shape.children;
                 if (0 < children.length) {
-                    this_1.initialize_(children, this_1.toDataShape(dataShape, shape), mapper, formatToFormatter, initialToInitialValue, actionValueToRuntime, canvasTicker, canvasShape, canvasData, actionables);
+                    if (shape instanceof EShapeEmbedded) {
+                        if (dataShape == null) {
+                            dataShape = shape;
+                        }
+                        containerShape = shape;
+                    }
+                    this_1.initialize_(children, dataShape, containerShape, mapper, formatToFormatter, initialToInitialValue, actionValueToRuntime, canvasTicker, canvasShape, canvasData, actionables);
                 }
             };
             var this_1 = this;
@@ -59193,7 +59597,7 @@
                 _loop_1(i);
             }
         };
-        DDiagramCanvas.prototype.initData = function (shape, dataShape, mapper, formatToFormatter, initialToInitialValue, canvasTicker, canvasData) {
+        DDiagramCanvas.prototype.initData = function (shape, dataShape, containerShape, mapper, formatToFormatter, initialToInitialValue, canvasTicker, canvasData) {
             var data = shape.data;
             var format = "";
             var initial = "";
@@ -59212,8 +59616,8 @@
                         if (value.scope === EShapeDataValueScope.PRIVATE) {
                             var id = value.id;
                             if (0 < id.length) {
-                                if (dataShape) {
-                                    dataShape.data.private.add(id, value);
+                                if (containerShape) {
+                                    containerShape.data.private.add(id, value);
                                 }
                                 else {
                                     canvasData.private.add(id, value);
@@ -59365,15 +59769,6 @@
                     return "0";
             }
         };
-        DDiagramCanvas.prototype.toDataShape = function (dataShape, shape) {
-            if (dataShape != null) {
-                return dataShape;
-            }
-            if (shape instanceof EShapeEmbedded) {
-                return shape;
-            }
-            return null;
-        };
         DDiagramCanvas.prototype.onDestroy = function () {
             this._ticker.stop();
             _super.prototype.onDestroy.call(this);
@@ -59639,10 +60034,10 @@
             enumerable: false,
             configurable: true
         });
-        DDiagramDataPrivateImpl.prototype.set = function (id, value, time, from, to) {
+        DDiagramDataPrivateImpl.prototype.set = function (id, value, time, state, from, to) {
             var canvas = this._diagram.canvas;
             if (canvas != null) {
-                return canvas.data.private.set(id, value, time, from, to);
+                return canvas.data.private.set(id, value, time, state, from, to);
             }
             return false;
         };
@@ -59682,10 +60077,10 @@
             enumerable: false,
             configurable: true
         });
-        DDiagramDataProtectedImpl.prototype.set = function (id, value, time, from, to) {
+        DDiagramDataProtectedImpl.prototype.set = function (id, value, time, state, from, to) {
             var canvas = this._diagram.canvas;
             if (canvas != null) {
-                return canvas.data.protected.set(id, value, time, from, to);
+                return canvas.data.protected.set(id, value, time, state, from, to);
             }
             return false;
         };
@@ -59714,7 +60109,7 @@
         function DDiagramDataRemoteImpl(options) {
             this._controller = options && options.controller;
         }
-        DDiagramDataRemoteImpl.prototype.set = function (id, value, time) {
+        DDiagramDataRemoteImpl.prototype.set = function (id, value) {
             var controller = this._controller;
             if (controller) {
                 controller.write(id, value);
@@ -59744,10 +60139,10 @@
             enumerable: false,
             configurable: true
         });
-        DDiagramDataExtendedImpl.prototype.set = function (id, value, time, from, to) {
+        DDiagramDataExtendedImpl.prototype.set = function (id, value, time, state, from, to) {
             var canvas = this._diagram.canvas;
             if (canvas != null) {
-                return canvas.data.extended.set(id, value, time, from, to);
+                return canvas.data.extended.set(id, value, time, state, from, to);
             }
             return false;
         };
@@ -59843,10 +60238,10 @@
             }
             return null;
         };
-        DDiagramDataImpl.prototype.set = function (id, value, time, from, to) {
+        DDiagramDataImpl.prototype.set = function (id, value, time, state, from, to) {
             var canvas = this._diagram.canvas;
             if (canvas != null) {
-                return canvas.data.set(id, value, time, from, to);
+                return canvas.data.set(id, value, time, state, from, to);
             }
             return false;
         };
@@ -59864,24 +60259,24 @@
             }
             return false;
         };
-        DDiagramDataImpl.prototype.setAll = function (id, values, times, from, to) {
+        DDiagramDataImpl.prototype.setAll = function (id, values, times, states, from, to) {
             var canvas = this._diagram.canvas;
             if (canvas != null) {
-                return canvas.data.setAll(id, values, times, from, to);
+                return canvas.data.setAll(id, values, times, states, from, to);
             }
             return false;
         };
-        DDiagramDataImpl.prototype.setValue = function (id, value, time) {
+        DDiagramDataImpl.prototype.setValue = function (id, value) {
             var canvas = this._diagram.canvas;
             if (canvas != null) {
-                return canvas.data.setValue(id, value, time);
+                return canvas.data.setValue(id, value);
             }
             return false;
         };
-        DDiagramDataImpl.prototype.setValues = function (id, values, times) {
+        DDiagramDataImpl.prototype.setValues = function (id, values) {
             var canvas = this._diagram.canvas;
             if (canvas != null) {
-                return canvas.data.setValues(id, values, times);
+                return canvas.data.setValues(id, values);
             }
             return false;
         };
@@ -59899,6 +60294,20 @@
             }
             return false;
         };
+        DDiagramDataImpl.prototype.setState = function (id, state) {
+            var canvas = this._diagram.canvas;
+            if (canvas != null) {
+                return canvas.data.setState(id, state);
+            }
+            return false;
+        };
+        DDiagramDataImpl.prototype.setStates = function (id, states) {
+            var canvas = this._diagram.canvas;
+            if (canvas != null) {
+                return canvas.data.setStates(id, states);
+            }
+            return false;
+        };
         DDiagramDataImpl.prototype.setRange = function (id, from, to) {
             var canvas = this._diagram.canvas;
             if (canvas != null) {
@@ -63894,13 +64303,21 @@
     var DTableBodyCells = /** @class */ (function () {
         function DTableBodyCells() {
         }
-        DTableBodyCells.setReadOnly = function (target, row, columnIndex, column) {
-            target.state.isReadOnly = this.toReadOnly(row, columnIndex, column);
-        };
-        DTableBodyCells.setRenderable = function (target, row, columnIndex, column) {
+        DTableBodyCells.set = function (target, row, columnIndex, column, readOnly) {
+            var _a;
             var renderable = this.toRenderable(row, columnIndex, column);
             target.renderable = renderable;
-            target.state.isDisabled = !renderable;
+            var state = target.state;
+            state.lock();
+            state.isDisabled = !renderable;
+            if (readOnly !== false) {
+                state.isReadOnly = this.toReadOnly(row, columnIndex, column);
+            }
+            var columnStateModifier = (_a = column.state) === null || _a === void 0 ? void 0 : _a.modifier;
+            if (columnStateModifier) {
+                columnStateModifier(row, columnIndex, target.state);
+            }
+            state.unlock();
         };
         DTableBodyCells.toReadOnly = function (row, columnIndex, column) {
             var enable = column.editing.enable;
@@ -64033,9 +64450,7 @@
             else {
                 this.text = value;
             }
-            var column = this._column;
-            DTableBodyCells.setReadOnly(this, row, columnIndex, column);
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this, row, columnIndex, this._column);
         };
         DTableBodyCellSelectDialog.prototype.unset = function () {
             this._row = undefined;
@@ -64121,9 +64536,7 @@
             this._row = row;
             this._rowIndex = rowIndex;
             this.text = value;
-            var column = this._column;
-            DTableBodyCells.setReadOnly(this, row, columnIndex, column);
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this, row, columnIndex, this._column);
         };
         DTableBodyCellActionMenu.prototype.unset = function () {
             this._row = undefined;
@@ -64237,9 +64650,7 @@
             else {
                 this.text = value;
             }
-            var column = this._column;
-            DTableBodyCells.setReadOnly(this, row, columnIndex, column);
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this, row, columnIndex, this._column);
         };
         DTableBodyCellSelectPromise.prototype.unset = function () {
             this._row = undefined;
@@ -64312,9 +64723,7 @@
             this._row = row;
             this._rowIndex = rowIndex;
             this.text = value;
-            var column = this._column;
-            DTableBodyCells.setReadOnly(this, row, columnIndex, column);
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this, row, columnIndex, this._column);
         };
         DTableBodyCellText.prototype.unset = function () {
             this._row = undefined;
@@ -64517,9 +64926,7 @@
             this._row = row;
             this._rowIndex = rowIndex;
             this.state.isActive = !!value;
-            var column = this._column;
-            DTableBodyCells.setReadOnly(this, row, columnIndex, column);
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this, row, columnIndex, this._column);
         };
         DTableBodyCellCheck.prototype.unset = function () {
             this._row = undefined;
@@ -64586,32 +64993,30 @@
             enumerable: false,
             configurable: true
         });
-        DTableBodyCellColor.prototype.set = function (newValue, row, supplimental, rowIndex, columnIndex, forcibly) {
+        DTableBodyCellColor.prototype.set = function (value, row, supplimental, rowIndex, columnIndex, forcibly) {
             this._row = row;
             this._rowIndex = rowIndex;
-            var value = this.value;
-            if (isNumber(newValue)) {
-                value.color = newValue;
-                value.alpha = 1;
-            }
-            else if (isString(newValue)) {
-                var parsed = Number(newValue);
-                value.color = parsed === parsed ? parsed : 0xffffff;
-                value.alpha = 1;
-            }
-            else if (newValue != null) {
-                var color = newValue.color;
-                var alpha = newValue.alpha;
-                value.color = isNumber(color) ? color : 0xffffff;
-                value.alpha = isNumber(alpha) ? alpha : 1;
+            var cell = this.value;
+            if (isNumber(value)) {
+                cell.color = value;
+                cell.alpha = 1;
+            }
+            else if (isString(value)) {
+                var parsed = Number(value);
+                cell.color = parsed === parsed ? parsed : 0xffffff;
+                cell.alpha = 1;
+            }
+            else if (value != null) {
+                var color = value.color;
+                var alpha = value.alpha;
+                cell.color = isNumber(color) ? color : 0xffffff;
+                cell.alpha = isNumber(alpha) ? alpha : 1;
             }
             else {
-                value.color = 0xffffff;
-                value.alpha = 1;
+                cell.color = 0xffffff;
+                cell.alpha = 1;
             }
-            var column = this._column;
-            DTableBodyCells.setReadOnly(this, row, columnIndex, column);
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this, row, columnIndex, this._column);
         };
         DTableBodyCellColor.prototype.unset = function () {
             this._row = undefined;
@@ -64703,9 +65108,7 @@
                     this.createOrUpdateText();
                 }
             }
-            var column = this._column;
-            DTableBodyCells.setReadOnly(this, row, columnIndex, column);
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this, row, columnIndex, this._column);
         };
         DTableBodyCellDate.prototype.unset = function () {
             this._row = undefined;
@@ -64788,7 +65191,7 @@
             }
             else if (isNumber(value)) {
                 var textValueComputed = this._textValueComputed;
-                if (textValueComputed === undefined) {
+                if (textValueComputed == null) {
                     this.text = new Date(value);
                 }
                 else if (textValueComputed.getTime() !== value) {
@@ -64797,9 +65200,7 @@
                     this.createOrUpdateText();
                 }
             }
-            var column = this._column;
-            DTableBodyCells.setReadOnly(this, row, columnIndex, column);
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this, row, columnIndex, this._column);
         };
         DTableBodyCellDatetime.prototype.unset = function () {
             this._row = undefined;
@@ -64857,9 +65258,7 @@
             this._row = row;
             this._rowIndex = rowIndex;
             this.text = rowIndex;
-            var column = this._column;
-            DTableBodyCells.setReadOnly(this, row, columnIndex, column);
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this, row, columnIndex, this._column);
         };
         DTableBodyCellIndex.prototype.unset = function () {
             this._row = undefined;
@@ -64927,9 +65326,7 @@
             this._row = row;
             this._rowIndex = rowIndex;
             this.text = Number(value);
-            var column = this._column;
-            DTableBodyCells.setReadOnly(this, row, columnIndex, column);
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this, row, columnIndex, this._column);
         };
         DTableBodyCellInputInteger.prototype.unset = function () {
             this._row = undefined;
@@ -64997,9 +65394,7 @@
             this._row = row;
             this._rowIndex = rowIndex;
             this.text = Number(value);
-            var column = this._column;
-            DTableBodyCells.setReadOnly(this, row, columnIndex, column);
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this, row, columnIndex, this._column);
         };
         DTableBodyCellInputReal.prototype.unset = function () {
             this._row = undefined;
@@ -65067,9 +65462,7 @@
             this._row = row;
             this._rowIndex = rowIndex;
             this.text = String(value);
-            var column = this._column;
-            DTableBodyCells.setReadOnly(this, row, columnIndex, column);
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this, row, columnIndex, this._column);
         };
         DTableBodyCellInputText.prototype.unset = function () {
             this._row = undefined;
@@ -65325,9 +65718,7 @@
                 marker.hide();
                 input.padding.adjLeft(0);
             }
-            var column = this._column;
-            DTableBodyCells.setReadOnly(this._input, row, columnIndex, column);
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this._input, row, columnIndex, this._column);
         };
         DTableBodyCellInputTree.prototype.unset = function () {
             this._row = undefined;
@@ -65481,9 +65872,7 @@
             this._row = row;
             this._rowIndex = rowIndex;
             this.value = value;
-            var column = this._column;
-            DTableBodyCells.setReadOnly(this, row, columnIndex, column);
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this, row, columnIndex, this._column);
         };
         DTableBodyCellSelectMenu.prototype.unset = function () {
             this._row = undefined;
@@ -65554,9 +65943,7 @@
             this._row = row;
             this._rowIndex = rowIndex;
             this.values = value;
-            var column = this._column;
-            DTableBodyCells.setReadOnly(this, row, columnIndex, column);
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this, row, columnIndex, this._column);
         };
         DTableBodyCellSelectMultiple.prototype.unset = function () {
             this._row = undefined;
@@ -65648,9 +66035,7 @@
                     this.createOrUpdateText();
                 }
             }
-            var column = this._column;
-            DTableBodyCells.setReadOnly(this, row, columnIndex, column);
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this, row, columnIndex, this._column);
         };
         DTableBodyCellTime.prototype.unset = function () {
             this._row = undefined;
@@ -65748,8 +66133,7 @@
             this._row = row;
             this._rowIndex = rowIndex;
             this.text = value;
-            var column = this._column;
-            DTableBodyCells.setRenderable(this, row, columnIndex, column);
+            DTableBodyCells.set(this, row, columnIndex, this._column, false);
             var link = this.link;
             var padding = this._padding;
             if (isNumber(supplimental)) {
@@ -65897,20 +66281,26 @@
      */
     var DTableBodyRow = /** @class */ (function (_super) {
         __extends(DTableBodyRow, _super);
-        function DTableBodyRow(onChange, isEven, options) {
+        function DTableBodyRow(onChange, isEven, columnIndexToCellOptions, options) {
             var _this = _super.call(this, options) || this;
             _this._index = -1;
             _this._onCellChangeBound = function (newValue, oldValue, row, rowIndex, columnIndex) {
                 _this.emit("change", newValue, oldValue, row, rowIndex, columnIndex, _this);
                 onChange(newValue, oldValue, row, rowIndex, columnIndex, _this);
             };
+            _this._columnIndexToCellOptions = columnIndexToCellOptions;
             _this.state.isAlternated = !isEven;
             _this.initCells(options, _this._columns, _this._frozen);
             return _this;
         }
         DTableBodyRow.prototype.newCell = function (columnIndex, column, columns, options) {
             var onChange = this._onCellChangeBound;
-            var cellOptions = this.toCellOptions(columnIndex, column, options);
+            var columnIndexToCellOptions = this._columnIndexToCellOptions;
+            var cellOptions = columnIndexToCellOptions.get(columnIndex);
+            if (cellOptions == null) {
+                cellOptions = this.toCellOptions(columnIndex, column, options);
+                columnIndexToCellOptions.set(columnIndex, cellOptions);
+            }
             if (column.editing.enable !== false) {
                 return this.newCellEditable(columnIndex, column, onChange, cellOptions);
             }
@@ -66026,51 +66416,48 @@
             }
         };
         DTableBodyRow.prototype.toCellOptions = function (columnIndex, column, options) {
-            var _a, _b;
-            var result = column.body || options.cell;
-            var columnWeight = column.weight;
-            var columnWidth = column.width;
+            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+            var _p;
+            var result = toMerged(column.body, options.cell);
+            // Weight
+            result.weight = column.weight;
+            // Width
+            result.width = column.width;
+            // State
+            (_a = result.state) !== null && _a !== void 0 ? _a : (result.state = column.state.initial);
+            // Text formatter
             var columnFormatter = column.formatter;
-            var columnAlign = column.align;
-            var columnSelecting = column.selecting;
-            var columnSelectingMenu = columnSelecting.menu || columnSelecting.multiple;
-            if (result != null) {
-                result.weight = columnWeight;
-                result.width = columnWidth;
-                var text = result.text || {};
-                result.text = text;
-                text.formatter || (text.formatter = columnFormatter);
-                var textAlign = text.align || {};
-                text.align = textAlign;
-                textAlign.horizontal = columnAlign;
-                result.menu || (result.menu = columnSelectingMenu);
+            if (columnFormatter != null) {
+                var text = ((_b = result.text) !== null && _b !== void 0 ? _b : (result.text = {}));
+                (_c = text.formatter) !== null && _c !== void 0 ? _c : (text.formatter = columnFormatter);
             }
-            else {
-                result = {
-                    weight: columnWeight,
-                    width: columnWidth,
-                    text: {
-                        formatter: columnFormatter,
-                        align: {
-                            horizontal: columnAlign
-                        }
-                    },
-                    menu: columnSelectingMenu
-                };
+            // Text align horizontal
+            var columnAlign = column.align;
+            if (columnAlign != null) {
+                var text = ((_d = result.text) !== null && _d !== void 0 ? _d : (result.text = {}));
+                var textAlign = ((_e = text.align) !== null && _e !== void 0 ? _e : (text.align = {}));
+                (_f = textAlign.horizontal) !== null && _f !== void 0 ? _f : (textAlign.horizontal = columnAlign);
             }
+            // Editing
             var columnEditing = column.editing;
             if (columnEditing.enable !== false) {
-                var editing = result.editing || {};
-                result.editing = editing;
-                editing.formatter || (editing.formatter = columnEditing.formatter);
-                editing.unformatter || (editing.unformatter = columnEditing.unformatter);
-                editing.validator || (editing.validator = columnEditing.validator);
+                var editing = ((_g = (_p = result).editing) !== null && _g !== void 0 ? _g : (_p.editing = {}));
+                (_h = editing.formatter) !== null && _h !== void 0 ? _h : (editing.formatter = columnEditing.formatter);
+                (_j = editing.unformatter) !== null && _j !== void 0 ? _j : (editing.unformatter = columnEditing.unformatter);
+                (_k = editing.validator) !== null && _k !== void 0 ? _k : (editing.validator = columnEditing.validator);
             }
+            // Link
             var columnLink = column.link;
-            if (columnLink) {
+            if (columnLink !== undefined) {
                 result.link = columnLink;
             }
-            var selectionType = (_b = (_a = options === null || options === void 0 ? void 0 : options.selection) === null || _a === void 0 ? void 0 : _a.type) !== null && _b !== void 0 ? _b : DTableDataSelectionType.NONE;
+            // Selecting
+            var columnSelecting = column.selecting;
+            var columnSelectingMenu = (_l = columnSelecting.menu) !== null && _l !== void 0 ? _l : columnSelecting.multiple;
+            if (columnSelectingMenu !== undefined) {
+                result.menu = columnSelectingMenu;
+            }
+            var selectionType = (_o = (_m = options === null || options === void 0 ? void 0 : options.selection) === null || _m === void 0 ? void 0 : _m.type) !== null && _o !== void 0 ? _o : DTableDataSelectionType.NONE;
             if (selectionType !== DTableDataSelectionType.NONE) {
                 result.when = "DOUBLE_CLICKED";
                 result.cursor = function (state) {
@@ -67108,6 +67495,7 @@
             _this._onRowChangeBound = function (newValue, oldValue, row, rowIndex, columnIndex) {
                 data.emit("change", newValue, oldValue, row, rowIndex, columnIndex, data);
             };
+            _this._columnIndexToCellOptions = new Map();
             _this._data.emit("init", _this._data);
             return _this;
         }
@@ -67299,7 +67687,7 @@
             return row;
         };
         DTableBody.prototype.newRow = function (isEven) {
-            return new DTableBodyRow(this._onRowChangeBound, isEven, this._rowOptions);
+            return new DTableBodyRow(this._onRowChangeBound, isEven, this._columnIndexToCellOptions, this._rowOptions);
         };
         DTableBody.prototype.onParentMove = function (newX, newY, oldX, oldY) {
             _super.prototype.onParentMove.call(this, newX, newY, oldX, oldY);
@@ -69062,6 +69450,27 @@
                 }
         }
     };
+    var toColumnState = function (options) {
+        var state = options.state;
+        if (state != null) {
+            if (isString(state) || isArray(state)) {
+                return {
+                    initial: state,
+                    modifier: undefined
+                };
+            }
+            else {
+                return {
+                    initial: undefined,
+                    modifier: state
+                };
+            }
+        }
+        return {
+            initial: undefined,
+            modifier: undefined
+        };
+    };
     var toColumnPath = function (options) {
         return options.path != null ? options.path.split(".") : null;
     };
@@ -69103,6 +69512,7 @@
             formatter: options.formatter,
             renderable: toColumnRenderable(options, path),
             align: align,
+            state: toColumnState(options),
             editing: toColumnEditing(options, path),
             sorting: toColumnSorting(getter, index, options),
             header: options.header,
@@ -71223,6 +71633,7 @@
         buildRectangleUv: buildRectangleUv,
         TEXT_VERTEX_COUNT: TEXT_VERTEX_COUNT,
         TEXT_INDEX_COUNT: TEXT_INDEX_COUNT,
+        TEXT_FMIN: TEXT_FMIN,
         toTextBufferCount: toTextBufferCount,
         buildTextClipping: buildTextClipping,
         buildTextIndex: buildTextIndex,
@@ -71447,6 +71858,7 @@
         EShapeDataValueRangeImpl: EShapeDataValueRangeImpl,
         EShapeDataValueRangeType: EShapeDataValueRangeType,
         EShapeDataValueScope: EShapeDataValueScope,
+        EShapeDataValueState: EShapeDataValueState,
         EShapeDataValueType: EShapeDataValueType,
         EShapeDefaults: EShapeDefaults,
         EShapeDeleter: EShapeDeleter,
@@ -71548,14 +71960,17 @@
         isFunction: isFunction,
         isNaN: isNaN,
         isNumber: isNumber,
+        isObject: isObject,
         isString: isString,
         Lazy: Lazy,
         NumberFormatterImpl: NumberFormatterImpl,
         NumberFormatters: NumberFormatters,
         toCeilingIndex: toCeilingIndex,
+        toCloned: toCloned,
         toEnum: toEnum,
         toIndexOf: toIndexOf,
         toLabel: toLabel$1,
+        toMerged: toMerged,
         toPadded: toPadded,
         toString: toString,
         toSvgTexture: toSvgTexture,
@@ -71734,8 +72149,8 @@
         DCommandSave: DCommandSave,
         DCommandUndo: DCommandUndo,
         DContent: DContent,
-        DControllerDefaultCommand: DControllerDefaultCommand,
-        DControllerDefaultFocus: DControllerDefaultFocus,
+        DControllerCommandImpl: DControllerCommandImpl,
+        DControllerFocusImpl: DControllerFocusImpl,
         DControllerKeyboard: DControllerKeyboard,
         DControllers: DControllers,
         DCornerMask: DCornerMask,