@wcardinal/wcardinal-ui 0.425.0 → 0.427.0

package/dist/wcardinal-ui.js

@@ -1,5 +1,5 @@
 /*
- Winter Cardinal UI v0.425.0
+ Winter Cardinal UI v0.427.0
  Copyright (C) 2019 Toshiba Corporation
  SPDX-License-Identifier: Apache-2.0
 
@@ -355,91 +355,6 @@
         uvs[++iuv] = textureUvs.y2;
     };
 
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var UtilCharacterIterator = /** @class */ (function () {
-        function UtilCharacterIterator() {
-            this.target = "";
-            this.position = 0;
-        }
-        UtilCharacterIterator.prototype.init = function (target) {
-            this.target = target;
-            this.position = 0;
-        };
-        UtilCharacterIterator.prototype.hasNext = function () {
-            return this.position < this.target.length;
-        };
-        UtilCharacterIterator.prototype.findNextBreak = function (target, istart) {
-            var iend = target.length;
-            for (var i = istart; i < iend; ++i) {
-                var code = target.charCodeAt(i);
-                if (!this.isLowSurrogate(code) && !this.isVariationSelector(code)) {
-                    return i;
-                }
-            }
-            return iend;
-        };
-        UtilCharacterIterator.prototype.isHighSurrogate = function (code) {
-            return 0xd800 <= code && code <= 0xdbff;
-        };
-        UtilCharacterIterator.prototype.isLowSurrogate = function (code) {
-            return 0xdc00 <= code && code <= 0xdfff;
-        };
-        UtilCharacterIterator.prototype.isVariationSelector = function (code) {
-            return 0xfe00 <= code && code <= 0xfe0f;
-        };
-        UtilCharacterIterator.prototype.next = function () {
-            var target = this.target;
-            var position = this.position;
-            var nextBreak = this.findNextBreak(target, position + 1);
-            var result = target.substring(position, nextBreak);
-            this.position = nextBreak;
-            return result;
-        };
-        /**
-         * Advances the position if the next character is not equal to
-         * the given `except`.
-         *
-         * @param except
-         * @return true if the position is advanced
-         */
-        UtilCharacterIterator.prototype.advance = function (except) {
-            var target = this.target;
-            var position = this.position;
-            var nextBreak = this.findNextBreak(target, position + 1);
-            if (target.substring(position, nextBreak) !== except) {
-                this.position = nextBreak;
-                return true;
-            }
-            return false;
-        };
-        /**
-         * Closes this iterator.
-         *
-         * @returns true if closed.
-         */
-        UtilCharacterIterator.prototype.close = function () {
-            var length = this.target.length;
-            if (this.position < length) {
-                this.position = length;
-                return true;
-            }
-            return false;
-        };
-        UtilCharacterIterator.from = function (target) {
-            if (UtilCharacterIterator._instance == null) {
-                UtilCharacterIterator._instance = new UtilCharacterIterator();
-            }
-            var instance = UtilCharacterIterator._instance;
-            instance.init(target);
-            return instance;
-        };
-        UtilCharacterIterator._instance = null;
-        return UtilCharacterIterator;
-    }());
-
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
@@ -498,6 +413,19 @@
         return Math.sqrt(dx01 * dx01 + dy01 * dy01);
     };
 
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var Character = {
+        ASCII: "!\"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\\]^_`abcdefghijklmnopqrstuvwxyz{|}~",
+        SPACE: " ",
+        TAB: "\t",
+        SOFT_TAB: "    ",
+        DOTS: "...",
+        NEW_LINE: "\n"
+    };
+
     var TEXT_VERTEX_COUNT = 4;
     var TEXT_VERTEX_COUNT_SHIFT = 2;
     var TEXT_INDEX_COUNT = 2;
@@ -844,7 +772,7 @@
                 return EShapeTextAlignVertical.OUTSIDE_TOP;
         }
     };
-    var buildTextVertex = function (vertices, uvs, voffset, vcount, originX, originY, sizeX, sizeY, textAtlas, textSize, textValue, textStyle, textAlignHorizontal, textAlignVertical, textOffsetHorizontal, textOffsetVertical, textSpacingHorizontal, textSpacingVertical, textDirection, textPaddingHorizontal, textPaddingVertical, textClipping, textFitting, textWorld, textureUvs, internalTransform) {
+    var buildTextVertex = function (vertices, uvs, voffset, vcount, originX, originY, sizeX, sizeY, textAtlas, textSize, textCharacters, textStyle, textAlignHorizontal, textAlignVertical, textOffsetHorizontal, textOffsetVertical, textSpacingHorizontal, textSpacingVertical, textDirection, textPaddingHorizontal, textPaddingVertical, textClipping, textFitting, textWorld, textureUvs, internalTransform) {
         // Calculate the transformed positions
         //
         //  0               1
@@ -936,15 +864,14 @@
         var lineWidth = 0;
         var lineCount = 1;
         var textAtlasCharacters = textAtlas.characters;
-        var iterator = UtilCharacterIterator.from(textValue);
         var advancePrevious = 0;
-        while (iterator.hasNext()) {
-            var character = iterator.next();
-            if (character !== "\n") {
+        for (var i = 0, imax = textCharacters.length; i < imax; ++i) {
+            var character = textCharacters[i];
+            if (character !== Character.NEW_LINE) {
                 if (0 < advancePrevious) {
                     lineWidth += Math.max(0, advancePrevious + textSpacingHorizontal);
                 }
-                var data = textAtlasCharacters[character];
+                var data = textAtlasCharacters.get(character);
                 if (data) {
                     advancePrevious = data.advance;
                     heightChar = data.height;
@@ -1088,12 +1015,11 @@
         var cy3 = by3;
         lineWidth = 0;
         advancePrevious = 0;
-        iterator.position = 0;
         lineCount = 0;
         var iv = voffset * 2;
-        for (; iterator.hasNext(); iv += 8) {
-            var character = iterator.next();
-            if (character !== "\n") {
+        for (var i = 0, imax = textCharacters.length; i < imax; i += 1, iv += 8) {
+            var character = textCharacters[i];
+            if (character !== Character.NEW_LINE) {
                 var lineWidthPrevious = lineWidth;
                 if (0 < advancePrevious) {
                     lineWidth += Math.max(0, advancePrevious + textSpacingHorizontal);
@@ -1104,12 +1030,12 @@
                 cy0 = by0 + ay;
                 cx3 = bx3 + ax;
                 cy3 = by3 + ay;
-                var data = textAtlasCharacters[character];
+                var data = textAtlasCharacters.get(character);
                 lineCount += 1;
                 if (data) {
                     var advance = data.advance;
                     if (lineWidthMaximum < (lineWidth + advance) * scaleX) {
-                        var dots = textAtlasCharacters["..."];
+                        var dots = textAtlasCharacters.get(Character.DOTS);
                         if (dots) {
                             if (1 < lineCount &&
                                 lineWidthMaximum < (lineWidth + dots.advance) * scaleX) {
@@ -1126,9 +1052,10 @@
                             advancePrevious = dots.advance;
                             writeCharacter(vertices, uvs, iv, dots, textAtlas, snx, sny, cx0, cy0, cx3, cy3, duvx01, duvy01, duvx03, duvy03, uvx0, uvy0);
                             for (iv += 8; true; iv += 8) {
-                                if (iterator.hasNext() && iterator.advance("\n")) {
+                                if (i + 1 < imax && textCharacters[i + 1] !== Character.NEW_LINE) {
                                     writeCharacterEmpty(vertices, uvs, iv, cx0, cy0, cx3, cy3, uvx0, uvy0, uvx3, uvy3);
                                     lineCount += 1;
+                                    i += 1;
                                 }
                                 else {
                                     iv -= 8;
@@ -7797,6 +7724,9 @@
             this.padding = new EShapeTextOffsetImpl(parent, 10, 10);
             this._clipping = false;
             this._fitting = false;
+            this._characters = [];
+            this._nacharacters = [];
+            this.updateCharacters(value);
         }
         Object.defineProperty(EShapeTextImpl.prototype, "enable", {
             get: function () {
@@ -7823,7 +7753,8 @@
                     if (this._plength < length_1) {
                         this._plength = length_1;
                     }
-                    if (this.isCompatible(value)) {
+                    this.updateCharacters(value);
+                    if (this.isCompatible()) {
                         this._parent.updateUploaded();
                     }
                     else {
@@ -7835,7 +7766,78 @@
             enumerable: false,
             configurable: true
         });
-        EShapeTextImpl.prototype.isCompatible = function (value) {
+        Object.defineProperty(EShapeTextImpl.prototype, "characters", {
+            get: function () {
+                return this._characters;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(EShapeTextImpl.prototype, "nacharacters", {
+            get: function () {
+                return this._nacharacters;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        EShapeTextImpl.prototype.updateCharacters = function (value) {
+            var characters = this._characters;
+            var charactersLength = characters.length;
+            var icharacters = 0;
+            var nacharacters = this._nacharacters;
+            var nacharactersLength = nacharacters.length;
+            var inacharacters = 0;
+            for (var i = 0, imax = value.length; i < imax;) {
+                if (value.charCodeAt(i) <= 0xff) {
+                    // Add an ASCII character
+                    var ac = value.substring(i, i + 1);
+                    if (icharacters < charactersLength) {
+                        characters[icharacters] = ac;
+                    }
+                    else {
+                        characters.push(ac);
+                    }
+                    icharacters += 1;
+                    i += 1;
+                    continue;
+                }
+                var j = i + 1;
+                for (; j < imax; ++j) {
+                    var cc = value.charCodeAt(j);
+                    if ((0xdc00 <= cc && cc <= 0xdfff) || (0xfe00 <= cc && cc <= 0xfe0f)) {
+                        // Low surrogate
+                        // Variation selector
+                        continue;
+                    }
+                    break;
+                }
+                // Add an non-ascii character
+                var nac = value.substring(i, j);
+                if (icharacters < charactersLength) {
+                    characters[icharacters] = nac;
+                }
+                else {
+                    characters.push(nac);
+                }
+                icharacters += 1;
+                if (inacharacters < nacharactersLength) {
+                    nacharacters[inacharacters] = nac;
+                }
+                else {
+                    nacharacters.push(nac);
+                }
+                inacharacters += 1;
+                // Go to the next
+                i = j;
+            }
+            if (icharacters < charactersLength) {
+                characters.length = icharacters;
+            }
+            if (inacharacters < nacharactersLength) {
+                nacharacters.length = inacharacters;
+            }
+        };
+        EShapeTextImpl.prototype.isCompatible = function () {
             // Compatibility check
             var parent = this._parent;
             var uploaded = parent.uploaded;
@@ -7844,18 +7846,17 @@
             }
             // Character code check
             var atlas = this.atlas;
-            var characters = atlas && atlas.characters;
-            if (characters != null) {
-                for (var i = 0, imax = value.length; i < imax; ++i) {
-                    var char = value[i];
-                    if (!(char in characters)) {
-                        return false;
-                    }
-                }
-            }
-            else {
+            if (atlas == null) {
                 return false;
             }
+            var atlasCharacters = atlas.characters;
+            var nacharacters = this._nacharacters;
+            for (var i = 0, imax = nacharacters.length; i < imax; ++i) {
+                if (!atlasCharacters.has(nacharacters[i])) {
+                    return false;
+                }
+            }
+            // Done
             return true;
         };
         Object.defineProperty(EShapeTextImpl.prototype, "length", {
@@ -8010,7 +8011,8 @@
                 if (this._plength < length_2) {
                     this._plength = length_2;
                 }
-                if (this.isCompatible(value)) {
+                this.updateCharacters(value);
+                if (this.isCompatible()) {
                     isChangedUploaded = true;
                 }
                 else {
@@ -8841,7 +8843,7 @@
                     textWorld = [0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0, 0.0];
                     text.world = textWorld;
                 }
-                buildTextVertex(buffer.vertices, buffer.uvs, this.vertexOffset, this.vertexCount, 0, 0, shapeSize.x, shapeSize.y, textAtlas, textSize, textValue, textStyle, textAlignHorizontal, textAlignVertical, textOffsetHorizontal, textOffsetVertical, textSpacingHorizontal, textSpacingVertical, textDirection, textPaddingHorizontal, textPaddingVertical, textClipping, textFitting, textWorld, toTextureUvs(textTexture), shape.transform.internalTransform);
+                buildTextVertex(buffer.vertices, buffer.uvs, this.vertexOffset, this.vertexCount, 0, 0, shapeSize.x, shapeSize.y, textAtlas, textSize, text.characters, textStyle, textAlignHorizontal, textAlignVertical, textOffsetHorizontal, textOffsetVertical, textSpacingHorizontal, textSpacingVertical, textDirection, textPaddingHorizontal, textPaddingVertical, textClipping, textFitting, textWorld, toTextureUvs(textTexture), shape.transform.internalTransform);
             }
         };
         BuilderText.prototype.updateColor = function (buffer, shape) {
@@ -21156,12 +21158,6 @@
         return DynamicAtlasItemFontAtlas;
     }(DynamicAtlasItem));
 
-    /*
-     * Copyright (C) 2019 Toshiba Corporation
-     * SPDX-License-Identifier: Apache-2.0
-     */
-    var ASCII_CHARACTERS = "!\"#$%&'()*+,-./0123456789:;<=>?@ABCDEFGHIJKLMNOPQRSTUVWXYZ[\\]^_`abcdefghijklmnopqrstuvwxyz{|}~";
-
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
@@ -21181,7 +21177,7 @@
     var DynamicFontAtlasCharacter = /** @class */ (function () {
         function DynamicFontAtlasCharacter(type, character, x, y, width, height, advance) {
             this.ref = 1;
-            this.life = 10;
+            this.life = DynamicFontAtlasCharacter.LIFE;
             this.character = character;
             this.x = x;
             this.y = y;
@@ -21191,6 +21187,7 @@
             this.origin = new DynamicFontAtlasCharacterOrigin(0, 0);
             this.type = type;
         }
+        DynamicFontAtlasCharacter.LIFE = 10;
         return DynamicFontAtlasCharacter;
     }());
 
@@ -21610,11 +21607,20 @@
             this._generator = DynamicSDFFontGenerator.getInstance().init();
             this._canvas = document.createElement("canvas");
             this._font = new DynamicSDFFontAtlasFont(fontFamily);
-            this._characters = {};
-            this._length = 0;
             this._width = 1;
             this._height = 1;
+            var characters = new Map();
+            characters.set(Character.SPACE, this.newChar(Character.SPACE, DynamicFontAtlasCharacterType.SPACE_R));
+            characters.set(Character.TAB, this.newChar(Character.SOFT_TAB, DynamicFontAtlasCharacterType.SPACE_R));
+            characters.set(Character.DOTS, this.newChar(Character.DOTS, DynamicFontAtlasCharacterType.LETTER_RNB));
+            for (var i = 0, imax = Character.ASCII.length; i < imax; ++i) {
+                var ac = Character.ASCII[i];
+                characters.set(ac, this.newChar(ac, DynamicFontAtlasCharacterType.LETTER_RNB));
+            }
+            this._characters = characters;
             this._isDirty = true;
+            this._isTouched = false;
+            this._life = DynamicFontAtlasCharacter.LIFE;
         }
         Object.defineProperty(DynamicSDFFontAtlas.prototype, "id", {
             get: function () {
@@ -21671,143 +21677,125 @@
             configurable: true
         });
         DynamicSDFFontAtlas.prototype.begin = function () {
-            this._length = 0;
-            var characters = this._characters;
-            for (var id in characters) {
-                characters[id].ref = 0;
-            }
+            this._isTouched = false;
+            this._characters.forEach(function (character) {
+                if (!(character.type & DynamicFontAtlasCharacterType.RESERVED)) {
+                    character.ref = 0;
+                }
+            });
         };
         DynamicSDFFontAtlas.prototype.end = function () {
+            var _this = this;
             var characters = this._characters;
-            for (var id in characters) {
-                var data = characters[id];
-                if (data.ref <= 0) {
-                    data.life -= 1;
-                    if (data.life <= 0) {
-                        delete characters[id];
-                        this._isDirty = true;
+            if (this._isTouched) {
+                this._life = DynamicFontAtlasCharacter.LIFE;
+                characters.forEach(function (character, id) {
+                    if (character.ref <= 0 &&
+                        !(character.type & DynamicFontAtlasCharacterType.RESERVED)) {
+                        character.life -= 1;
+                        if (character.life <= 0) {
+                            characters.delete(id);
+                            _this._isDirty = true;
+                        }
                     }
+                });
+            }
+            else {
+                this._life -= 1;
+                if (this._life <= 0 && 0 < characters.size) {
+                    characters.clear();
+                    this._isDirty = true;
                 }
             }
         };
-        DynamicSDFFontAtlas.prototype.addAscii = function () {
-            this.addChar(" ", " ", DynamicFontAtlasCharacterType.SPACE_R);
-            this.addChar("\t", "    ", DynamicFontAtlasCharacterType.SPACE_R);
-            this.addChar("...", "...", DynamicFontAtlasCharacterType.LETTER_RNB);
-            for (var i = 0, imax = ASCII_CHARACTERS.length; i < imax; ++i) {
-                var char = ASCII_CHARACTERS[i];
-                this.addChar(char, char, DynamicFontAtlasCharacterType.LETTER_RNB);
-            }
+        DynamicSDFFontAtlas.prototype.newChar = function (character, type) {
+            return new DynamicFontAtlasCharacter(type, character, 0, 0, 1, 1, 0);
         };
-        DynamicSDFFontAtlas.prototype.addChar = function (id, character, type) {
-            var characters = this._characters;
-            if (!this.isIgnored(character)) {
-                var data = characters[id];
+        DynamicSDFFontAtlas.prototype.add = function (characters, nacharacters) {
+            var cs = this._characters;
+            for (var i = 0, imax = nacharacters.length; i < imax; ++i) {
+                var nac = nacharacters[i];
+                var data = cs.get(nac);
                 if (data != null) {
-                    if (data.ref <= 0) {
-                        this._length += 1;
-                    }
                     data.ref += 1;
+                    data.life = DynamicFontAtlasCharacter.LIFE;
                 }
                 else {
-                    characters[id] = new DynamicFontAtlasCharacter(type, character, 0, 0, 1, 1, 0);
-                    this._length += 1;
+                    cs.set(nac, this.newChar(nac, DynamicFontAtlasCharacterType.LETTER));
                     this._isDirty = true;
                 }
             }
-        };
-        DynamicSDFFontAtlas.prototype.isIgnored = function (character) {
-            switch (character) {
-                case "\n": // Line feed
-                    return true;
-                case "\r": // Carriage return
-                    return true;
-                case "\v": // Vertical tab
-                    return true;
-                case "\f": // Form feed
-                    return true;
-                case "\u0085": // Next line
-                    return true;
-            }
-            return false;
-        };
-        DynamicSDFFontAtlas.prototype.add = function (characters, type) {
-            if (type === void 0) { type = DynamicFontAtlasCharacterType.LETTER; }
-            var iterator = UtilCharacterIterator.from(characters);
-            while (iterator.hasNext()) {
-                var character = iterator.next();
-                this.addChar(character, character, type);
+            if (0 < characters.length) {
+                this._isTouched = true;
             }
         };
         DynamicSDFFontAtlas.prototype.get = function (id) {
-            return this._characters[id];
+            return this._characters.get(id);
         };
         DynamicSDFFontAtlas.prototype.update = function () {
             if (this._isDirty) {
                 var canvas = this._canvas;
                 var generator = this._generator;
                 if (canvas != null && generator != null) {
-                    var context = canvas.getContext("2d");
-                    if (context != null) {
+                    var context_1 = canvas.getContext("2d");
+                    if (context_1 != null) {
                         this._isDirty = false;
                         var font = this._font;
+                        var fontSize_1 = font.size + 14;
                         var characters = this._characters;
-                        var characterSize = font.size + 14;
-                        var width = this.toPowerOf2(Math.ceil(Math.sqrt(this._length)) * characterSize);
-                        this._width = width;
+                        var width_1 = this.toPowerOf2(Math.ceil(Math.sqrt(characters.size)) * fontSize_1);
+                        this._width = width_1;
                         var fontStyle = (font.italic ? "italic " : "") + (font.size + "px ") + font.id;
-                        context.font = fontStyle;
-                        context.textAlign = "left";
-                        context.textBaseline = "alphabetic";
-                        context.lineWidth = 0;
-                        context.lineCap = "round";
-                        context.lineJoin = "miter";
-                        context.miterLimit = 10;
-                        context.fillStyle = "#FFFFFF";
-                        UtilFont.measure(context, font);
-                        var offsetX = 7;
-                        var offsetY = Math.round((characterSize - (font.ascent + font.descent)) * 0.5 + font.ascent);
-                        var x = 0;
-                        var y = 0;
-                        for (var id in characters) {
-                            var data = characters[id];
-                            var advance = context.measureText(data.character).width;
-                            var characterWidth = Math.ceil(offsetX + advance + offsetX);
-                            var characterHeight = characterSize;
-                            if (width <= x + characterWidth) {
-                                x = 0;
-                                y += characterSize;
+                        context_1.font = fontStyle;
+                        context_1.textAlign = "left";
+                        context_1.textBaseline = "alphabetic";
+                        context_1.lineWidth = 0;
+                        context_1.lineCap = "round";
+                        context_1.lineJoin = "miter";
+                        context_1.miterLimit = 10;
+                        context_1.fillStyle = "#FFFFFF";
+                        UtilFont.measure(context_1, font);
+                        var offsetX_1 = 7;
+                        var offsetY_1 = Math.round((fontSize_1 - (font.ascent + font.descent)) * 0.5 + font.ascent);
+                        var x_1 = 0;
+                        var y_1 = 0;
+                        characters.forEach(function (character) {
+                            var advance = context_1.measureText(character.character).width;
+                            var characterWidth = Math.ceil(offsetX_1 + advance + offsetX_1);
+                            var characterHeight = fontSize_1;
+                            if (width_1 <= x_1 + characterWidth) {
+                                x_1 = 0;
+                                y_1 += fontSize_1;
                             }
-                            data.x = x;
-                            data.y = y;
-                            data.width = characterWidth;
-                            data.height = characterHeight;
-                            data.advance = advance;
-                            data.origin.x = x + offsetX;
-                            data.origin.y = y + offsetY;
-                            x += characterWidth;
-                        }
-                        var height = (this._height = y + characterSize);
+                            character.x = x_1;
+                            character.y = y_1;
+                            character.width = characterWidth;
+                            character.height = characterHeight;
+                            character.advance = advance;
+                            character.origin.x = x_1 + offsetX_1;
+                            character.origin.y = y_1 + offsetY_1;
+                            x_1 += characterWidth;
+                        });
+                        var height = (this._height = y_1 + fontSize_1);
                         // Make a input canvas
                         // Here, we need to reset the context because
                         // context settings will be lost when we set the width/height.
-                        canvas.width = width;
+                        canvas.width = width_1;
                         canvas.height = height;
-                        context.font = fontStyle;
-                        context.textAlign = "left";
-                        context.textBaseline = "alphabetic";
-                        context.lineWidth = 0;
-                        context.lineCap = "round";
-                        context.lineJoin = "miter";
-                        context.miterLimit = 10;
-                        context.fillStyle = "#FFFFFF";
-                        context.clearRect(0, 0, width, height);
-                        for (var id in characters) {
-                            var data = characters[id];
-                            context.fillText(data.character, data.origin.x, data.origin.y);
-                        }
+                        context_1.font = fontStyle;
+                        context_1.textAlign = "left";
+                        context_1.textBaseline = "alphabetic";
+                        context_1.lineWidth = 0;
+                        context_1.lineCap = "round";
+                        context_1.lineJoin = "miter";
+                        context_1.miterLimit = 10;
+                        context_1.fillStyle = "#FFFFFF";
+                        context_1.clearRect(0, 0, width_1, height);
+                        characters.forEach(function (character) {
+                            context_1.fillText(character.character, character.origin.x, character.origin.y);
+                        });
                         // Convert to SDF font texture
-                        generator.updateTexture(width, height, canvas);
+                        generator.updateTexture(width_1, height, canvas);
                         generator.render();
                         generator.read(canvas);
                         return true;
@@ -21818,7 +21806,7 @@
         };
         Object.defineProperty(DynamicSDFFontAtlas.prototype, "length", {
             get: function () {
-                return this._length;
+                return this._characters.size;
             },
             enumerable: false,
             configurable: true
@@ -21843,10 +21831,7 @@
             if (canvas != null) {
                 this._canvas = null;
             }
-            var characters = this._characters;
-            for (var id in characters) {
-                delete characters[id];
-            }
+            this._characters.clear();
         };
         DynamicSDFFontAtlas.prototype.toPowerOf2 = function (size) {
             var result = 32;
@@ -21864,52 +21849,45 @@
      */
     var DynamicSDFFontAtlases = /** @class */ (function () {
         function DynamicSDFFontAtlases() {
-            this._atlases = {};
+            this._atlases = new Map();
         }
         DynamicSDFFontAtlases.prototype.begin = function () {
-            var atlases = this._atlases;
-            for (var family in atlases) {
-                var atlas = atlases[family];
+            this._atlases.forEach(function (atlas) {
                 atlas.begin();
-            }
+            });
         };
         DynamicSDFFontAtlases.prototype.end = function () {
             var atlases = this._atlases;
-            for (var family in atlases) {
-                var atlas = atlases[family];
-                if (0 < atlas.length) {
-                    atlas.addAscii();
-                }
+            atlases.forEach(function (atlas, family) {
                 atlas.end();
                 if (atlas.length <= 0) {
                     atlas.destroy();
-                    delete atlases[family];
+                    atlases.delete(family);
                 }
-            }
+            });
         };
-        DynamicSDFFontAtlases.prototype.add = function (family, targets) {
-            var atlas = this._atlases[family];
+        DynamicSDFFontAtlases.prototype.add = function (family, characters, nacharacters) {
+            var atlases = this._atlases;
+            var atlas = atlases.get(family);
             if (atlas != null) {
-                atlas.add(targets);
+                atlas.add(characters, nacharacters);
             }
             else {
                 var newAtlas = new DynamicSDFFontAtlas(family);
-                newAtlas.add(targets);
-                this._atlases[family] = newAtlas;
+                newAtlas.add(characters, nacharacters);
+                atlases.set(family, newAtlas);
             }
         };
         DynamicSDFFontAtlases.prototype.get = function (family) {
-            var atlas = this._atlases[family];
+            var atlas = this._atlases.get(family);
             if (atlas != null) {
                 return atlas;
             }
             return null;
         };
         DynamicSDFFontAtlases.prototype.update = function (baseAtlas) {
-            var atlases = this._atlases;
             var baseTexture = baseAtlas.getBaseTexture();
-            for (var family in atlases) {
-                var atlas = atlases[family];
+            this._atlases.forEach(function (atlas) {
                 if (atlas.update()) {
                     var atlasId = atlas.id;
                     var item = baseAtlas.get(atlasId);
@@ -21927,15 +21905,14 @@
                         baseAtlas.set(atlasId, new DynamicAtlasItemFontAtlas(atlas, baseTexture));
                     }
                 }
-            }
+            });
         };
         DynamicSDFFontAtlases.prototype.destroy = function () {
             var atlases = this._atlases;
-            for (var family in atlases) {
-                var atlas = atlases[family];
+            atlases.forEach(function (atlas) {
                 atlas.destroy();
-            }
-            this._atlases = {};
+            });
+            atlases.clear();
         };
         return DynamicSDFFontAtlases;
     }());
@@ -22323,9 +22300,9 @@
             }
             // Font texture atlas
             var text = shape.text;
-            var textValue = text.value;
-            if (0 < textValue.length) {
-                fontAtlases.add(text.family, textValue);
+            var textCharacters = text.characters;
+            if (0 < textCharacters.length) {
+                fontAtlases.add(text.family, textCharacters, text.nacharacters);
             }
         };
         EShapeRenderer.prototype.updateAtlases = function (shapes, atlas, fontAtlases, defaultTexture, baseTexture) {
@@ -28692,6 +28669,74 @@
         return DDynamicTextMeasureResult;
     }());
 
+    /*
+     * Copyright (C) 2019 Toshiba Corporation
+     * SPDX-License-Identifier: Apache-2.0
+     */
+    var UtilCharacterIterator = /** @class */ (function () {
+        function UtilCharacterIterator() {
+            this.target = "";
+            this.position = 0;
+        }
+        UtilCharacterIterator.prototype.init = function (target) {
+            this.target = target;
+            this.position = 0;
+        };
+        UtilCharacterIterator.prototype.hasNext = function () {
+            return this.position < this.target.length;
+        };
+        UtilCharacterIterator.prototype.findNextBreak = function (target, istart) {
+            var iend = target.length;
+            for (var i = istart; i < iend; ++i) {
+                var code = target.charCodeAt(i);
+                if (!this.isLowSurrogate(code) && !this.isVariationSelector(code)) {
+                    return i;
+                }
+            }
+            return iend;
+        };
+        UtilCharacterIterator.prototype.isHighSurrogate = function (code) {
+            return 0xd800 <= code && code <= 0xdbff;
+        };
+        UtilCharacterIterator.prototype.isLowSurrogate = function (code) {
+            return 0xdc00 <= code && code <= 0xdfff;
+        };
+        UtilCharacterIterator.prototype.isVariationSelector = function (code) {
+            return 0xfe00 <= code && code <= 0xfe0f;
+        };
+        UtilCharacterIterator.prototype.next = function () {
+            var target = this.target;
+            var position = this.position;
+            var nextBreak = this.findNextBreak(target, position + 1);
+            var result = target.substring(position, nextBreak);
+            this.position = nextBreak;
+            return result;
+        };
+        /**
+         * Closes this iterator.
+         *
+         * @returns true if closed.
+         */
+        UtilCharacterIterator.prototype.close = function () {
+            var length = this.target.length;
+            if (this.position < length) {
+                this.position = length;
+                return true;
+            }
+            return false;
+        };
+        UtilCharacterIterator.from = function (target) {
+            if (UtilCharacterIterator._instance == null) {
+                UtilCharacterIterator._instance = new UtilCharacterIterator();
+            }
+            var instance = UtilCharacterIterator._instance;
+            instance.init(target);
+            return instance;
+        };
+        UtilCharacterIterator._instance = null;
+        return UtilCharacterIterator;
+    }());
+
     /*
      * Copyright (C) 2019 Toshiba Corporation
      * SPDX-License-Identifier: Apache-2.0
@@ -28702,7 +28747,6 @@
         BREAK_ALL: 2
     };
 
-    var NEW_LINE = "\n";
     var DDynamicTextMeasure = /** @class */ (function () {
         function DDynamicTextMeasure() {
         }
@@ -28772,7 +28816,7 @@
             while (iterator.hasNext()) {
                 var characterPosition = iterator.position;
                 var character = iterator.next();
-                if (character === NEW_LINE) {
+                if (character === Character.NEW_LINE) {
                     if (result.isPushableAtNewLine(clippingHeight, lineHeight, fontHeight)) {
                         result.newLine(lineHeight);
                     }
@@ -28804,7 +28848,7 @@
         DDynamicTextMeasure.measure1b = function (iterator, clippingWidth, clippingHeight, fontHeight, lineHeight, atlas, result) {
             while (iterator.hasNext()) {
                 var character = iterator.next();
-                if (character === NEW_LINE) {
+                if (character === Character.NEW_LINE) {
                     if (result.isPushableAtNewLine(clippingHeight, lineHeight, fontHeight)) {
                         result.newLine(lineHeight);
                     }
@@ -28835,7 +28879,7 @@
         DDynamicTextMeasure.measure1 = function (iterator, clippingWidth, clippingHeight, fontHeight, lineHeight, atlas, result) {
             while (iterator.hasNext()) {
                 var character = iterator.next();
-                if (character === NEW_LINE) {
+                if (character === Character.NEW_LINE) {
                     if (result.isPushableAtNewLine(clippingHeight, lineHeight, fontHeight)) {
                         result.newLine(lineHeight);
                     }
@@ -28867,7 +28911,7 @@
             while (iterator.hasNext()) {
                 var characterPosition = iterator.position;
                 var character = iterator.next();
-                if (character === NEW_LINE) {
+                if (character === Character.NEW_LINE) {
                     result.newLine(lineHeight);
                 }
                 else {
@@ -28889,7 +28933,7 @@
         DDynamicTextMeasure.measure2b = function (iterator, clippingWidth, lineHeight, atlas, result) {
             while (iterator.hasNext()) {
                 var character = iterator.next();
-                if (character === NEW_LINE) {
+                if (character === Character.NEW_LINE) {
                     result.newLine(lineHeight);
                 }
                 else {
@@ -28910,7 +28954,7 @@
         DDynamicTextMeasure.measure2 = function (iterator, clippingWidth, lineHeight, atlas, result) {
             while (iterator.hasNext()) {
                 var character = iterator.next();
-                if (character === NEW_LINE) {
+                if (character === Character.NEW_LINE) {
                     result.newLine(lineHeight);
                 }
                 else {
@@ -28930,7 +28974,7 @@
         DDynamicTextMeasure.measure3 = function (iterator, clippingWidth, clippingHeight, fontHeight, lineHeight, atlas, result) {
             while (iterator.hasNext()) {
                 var character = iterator.next();
-                if (character === NEW_LINE) {
+                if (character === Character.NEW_LINE) {
                     if (result.isPushableAtNewLine(clippingHeight, lineHeight, fontHeight)) {
                         result.newLine(lineHeight);
                     }
@@ -28954,7 +28998,7 @@
         DDynamicTextMeasure.measure4 = function (iterator, lineHeight, atlas, result) {
             while (iterator.hasNext()) {
                 var character = iterator.next();
-                if (character === NEW_LINE) {
+                if (character === Character.NEW_LINE) {
                     result.newLine(lineHeight);
                 }
                 else {
@@ -28967,7 +29011,7 @@
         };
         DDynamicTextMeasure.measure5 = function (iterator, clippingWidth, lineHeight, atlas, result, close) {
             result.clipped = true;
-            var dots = atlas.get("...");
+            var dots = atlas.get(Character.DOTS);
             if (dots != null) {
                 while (!result.isPushable(clippingWidth, dots)) {
                     if (!result.pop()) {
@@ -28983,7 +29027,7 @@
             }
             else {
                 while (iterator.hasNext()) {
-                    if (iterator.next() === NEW_LINE) {
+                    if (iterator.next() === Character.NEW_LINE) {
                         result.newLine(lineHeight);
                         break;
                     }
@@ -29067,47 +29111,61 @@
     var DDynamicTextGeometry = /** @class */ (function (_super) {
         __extends(DDynamicTextGeometry, _super);
         function DDynamicTextGeometry() {
-            var _this = _super.call(this, new Float32Array(64), new Float32Array(64), new Uint16Array(48)) || this;
+            var _a, _b, _c;
+            var _this = _super.call(this, ((_a = DDynamicTextGeometry.VERTICES) !== null && _a !== void 0 ? _a : (DDynamicTextGeometry.VERTICES = new Float32Array(0))), ((_b = DDynamicTextGeometry.UVS) !== null && _b !== void 0 ? _b : (DDynamicTextGeometry.UVS = new Float32Array(0))), ((_c = DDynamicTextGeometry.INDICES) !== null && _c !== void 0 ? _c : (DDynamicTextGeometry.INDICES = new Uint16Array(0)))) || this;
             _this.width = 0;
             _this.height = 0;
             _this.scale = 1;
             _this.scaled = false;
             _this.clipped = false;
+            _this.vertexBuffer = _this.getBuffer("aVertexPosition");
+            _this.vertices = DDynamicTextGeometry.VERTICES;
+            _this.uvBuffer = _this.getBuffer("aTextureCoord");
+            _this.uvs = DDynamicTextGeometry.UVS;
+            _this.indexBuffer = _this.getIndex();
+            _this.indices = DDynamicTextGeometry.INDICES;
+            _this.nchars = 0;
             return _this;
         }
         DDynamicTextGeometry.prototype.update = function (text, atlas, modifier) {
-            var vertexBuffer = this.getBuffer("aVertexPosition");
-            var uvBuffer = this.getBuffer("aTextureCoord");
-            var indexBuffer = this.getIndex();
             var result = DDynamicTextMeasure.measure(text, atlas, modifier);
-            var requiredTextSize = Math.ceil(result.count / 8) << 3;
-            var requiredVertexSize = requiredTextSize << 3;
-            if (vertexBuffer.data.length < requiredVertexSize) {
-                vertexBuffer.data = new Float32Array(requiredVertexSize);
-                uvBuffer.data = new Float32Array(requiredVertexSize);
-            }
-            var requiredIndexSize = requiredTextSize * 6;
-            if (indexBuffer.data.length < requiredIndexSize) {
-                indexBuffer.data = new Uint16Array(requiredIndexSize);
-            }
-            var vertices = vertexBuffer.data;
-            var uvs = uvBuffer.data;
-            var indices = indexBuffer.data;
+            var resultCount = result.count;
+            var nchars = ((resultCount >> 3) + (resultCount & 0x7 ? 1 : 0)) << 3;
+            if (this.nchars < nchars) {
+                this.nchars = nchars;
+                var nvertex = nchars << 3;
+                this.vertices = new Float32Array(nvertex);
+                this.uvs = new Float32Array(nvertex);
+                this.vertexBuffer.data = this.vertices;
+                this.uvBuffer.data = this.uvs;
+                var nindex = (nchars << 2) + (nchars << 1);
+                this.indices = new Uint16Array(nindex);
+                this.indexBuffer.data = this.indices;
+                this.initIndices(this.indices);
+                this.indexBuffer.update();
+            }
+            else {
+                nchars = this.nchars;
+            }
+            if (nchars <= 0) {
+                return;
+            }
+            var vertices = this.vertices;
+            var uvs = this.uvs;
             if (atlas != null) {
-                var count = result.count;
                 var characters = result.characters;
                 var scale = result.scale;
-                for (var i = 0; i < count; ++i) {
+                var fw = 1 / atlas.width;
+                var fh = 1 / atlas.height;
+                for (var i = 0; i < resultCount; ++i) {
                     var character = characters[i];
                     var cx = character.x;
                     var cy = character.y;
                     var cc = character.character;
-                    var w = atlas.width;
-                    var h = atlas.height;
-                    this.writeCharacter(vertices, uvs, indices, i, cx, cy, scale, cc, w, h);
+                    this.fill(vertices, uvs, i, cx, cy, scale, cc, fw, fh);
                 }
-                for (var i = count, imax = vertices.length >> 3; i < imax; ++i) {
-                    this.writeCharacterEmpty(vertices, uvs, indices, i);
+                for (var i = resultCount; i < nchars; ++i) {
+                    this.fillBlank(vertices, uvs, i);
                 }
                 this.width = result.width * scale;
                 this.height = result.height * scale;
@@ -29116,8 +29174,8 @@
                 this.clipped = result.clipped;
             }
             else {
-                for (var i = 0, imax = vertices.length >> 3; i < imax; ++i) {
-                    this.writeCharacterEmpty(vertices, uvs, indices, i);
+                for (var i = 0; i < nchars; ++i) {
+                    this.fillBlank(vertices, uvs, i);
                 }
                 this.width = 0;
                 this.height = 0;
@@ -29125,11 +29183,10 @@
                 this.scaled = false;
                 this.clipped = false;
             }
-            vertexBuffer.update();
-            uvBuffer.update();
-            indexBuffer.update();
+            this.vertexBuffer.update();
+            this.uvBuffer.update();
         };
-        DDynamicTextGeometry.prototype.writeCharacter = function (vertices, uvs, indices, index, x, y, scale, character, width, height) {
+        DDynamicTextGeometry.prototype.fill = function (vertices, uvs, index, x, y, scale, character, fw, fh) {
             var cx = character.x;
             var cy = character.y;
             var cw = character.width;
@@ -29148,10 +29205,10 @@
             vertices[iv + 5] = y1;
             vertices[iv + 6] = x0;
             vertices[iv + 7] = y1;
-            var u0 = cx / width;
-            var v0 = cy / height;
-            var u1 = (cx + cw) / width;
-            var v1 = (cy + ch) / height;
+            var u0 = cx * fw;
+            var v0 = cy * fh;
+            var u1 = (cx + cw) * fw;
+            var v1 = (cy + ch) * fh;
             uvs[iv + 0] = u0;
             uvs[iv + 1] = v0;
             uvs[iv + 2] = u1;
@@ -29160,16 +29217,8 @@
             uvs[iv + 5] = v1;
             uvs[iv + 6] = u0;
             uvs[iv + 7] = v1;
-            var ii = index * 6;
-            var vo = index << 2;
-            indices[ii + 0] = vo + 0;
-            indices[ii + 1] = vo + 1;
-            indices[ii + 2] = vo + 3;
-            indices[ii + 3] = vo + 1;
-            indices[ii + 4] = vo + 2;
-            indices[ii + 5] = vo + 3;
-        };
-        DDynamicTextGeometry.prototype.writeCharacterEmpty = function (vertices, uvs, indices, index) {
+        };
+        DDynamicTextGeometry.prototype.fillBlank = function (vertices, uvs, index) {
             var iv = index << 3;
             vertices[iv + 0] = 0;
             vertices[iv + 1] = 0;
@@ -29187,14 +29236,16 @@
             uvs[iv + 5] = 0;
             uvs[iv + 6] = 0;
             uvs[iv + 7] = 0;
-            var ii = index * 6;
-            var vo = index << 2;
-            indices[ii + 0] = vo + 0;
-            indices[ii + 1] = vo + 1;
-            indices[ii + 2] = vo + 3;
-            indices[ii + 3] = vo + 1;
-            indices[ii + 4] = vo + 2;
-            indices[ii + 5] = vo + 3;
+        };
+        DDynamicTextGeometry.prototype.initIndices = function (indices) {
+            for (var iv = 0, ivmax = this.nchars << 2, ii = 0; iv < ivmax; iv += 4, ii += 6) {
+                indices[ii] = iv;
+                indices[ii + 1] = iv + 1;
+                indices[ii + 2] = iv + 3;
+                indices[ii + 3] = iv + 1;
+                indices[ii + 4] = iv + 2;
+                indices[ii + 5] = iv + 3;
+            }
         };
         return DDynamicTextGeometry;
     }(pixi_js.MeshGeometry));
@@ -48249,26 +48300,26 @@
             var padding = this.toPadding(fontSize);
             this._padding = padding;
             this._font = new DynamicFontAtlasFont(fontId, fontSize, fontColor, padding);
-            this._characters = {};
-            this._length = 0;
             this._unrefCount = 0;
             this._width = 1;
             this._height = 1;
-            this._revision = 0;
             this._revisionUpdated = 0;
             this._texture = pixi_js.Texture.from(this._canvas, {
                 mipmap: pixi_js.MIPMAP_MODES.OFF,
                 resolution: resolution,
                 scaleMode: pixi_js.SCALE_MODES.NEAREST
             });
-            var characters = this._characters;
-            this.add_(" ", " ", characters, DynamicFontAtlasCharacterType.SPACE_R);
-            this.add_("\t", "    ", characters, DynamicFontAtlasCharacterType.SPACE_R);
-            this.add_("...", "...", characters, DynamicFontAtlasCharacterType.LETTER_RNB);
-            for (var i = 0, imax = ASCII_CHARACTERS.length; i < imax; ++i) {
-                var char = ASCII_CHARACTERS[i];
-                this.add_(char, char, characters, DynamicFontAtlasCharacterType.LETTER_RNB);
-            }
+            var characters = new Map();
+            characters.set(Character.SPACE, this.newChar(Character.SPACE, DynamicFontAtlasCharacterType.SPACE_R));
+            characters.set(Character.TAB, this.newChar(Character.SOFT_TAB, DynamicFontAtlasCharacterType.SPACE_R));
+            characters.set(Character.DOTS, this.newChar(Character.DOTS, DynamicFontAtlasCharacterType.LETTER_RNB));
+            for (var i = 0, imax = Character.ASCII.length; i < imax; ++i) {
+                var ac = Character.ASCII[i];
+                characters.set(ac, this.newChar(ac, DynamicFontAtlasCharacterType.LETTER_RNB));
+            }
+            this._characters = characters;
+            this._createds = new Map();
+            this._revision = 1;
         }
         DynamicFontAtlas.prototype.toPadding = function (fontSize) {
             return Math.max(3, Math.ceil(fontSize * 0.2));
@@ -48322,86 +48373,106 @@
             enumerable: false,
             configurable: true
         });
-        DynamicFontAtlas.prototype.add_ = function (id, character, characters, type) {
-            if (!this.isIgnored(character)) {
-                var data = characters[id];
-                if (data != null) {
-                    if (!(data.type & DynamicFontAtlasCharacterType.RESERVED)) {
-                        if (data.ref === 0) {
+        DynamicFontAtlas.prototype.newChar = function (character, type) {
+            var advance = this.getAdvance(character);
+            var padding = this._padding;
+            var width = Math.ceil(padding + advance + padding);
+            var height = this.font.height;
+            return new DynamicFontAtlasCharacter(type, character, -width, // Setting X and Y to zeros leads to render the character at the UV coordinate (0, 0).
+            -height, width, height, advance);
+        };
+        DynamicFontAtlas.prototype.add = function (characters, type) {
+            var cs = this._characters;
+            var cds = this._createds;
+            for (var i = 0, imax = characters.length; i < imax;) {
+                if (characters.charCodeAt(i) <= 0xff) {
+                    // Ignore ASCII characters
+                    i += 1;
+                    continue;
+                }
+                var j = i + 1;
+                for (; j < imax; ++j) {
+                    var cc = characters.charCodeAt(j);
+                    if ((0xdc00 <= cc && cc <= 0xdfff) || (0xfe00 <= cc && cc <= 0xfe0f)) {
+                        // Low surrogate
+                        // Variation selector
+                        continue;
+                    }
+                    break;
+                }
+                // Increment the reference count or create a new one
+                var nac = characters.substring(i, j);
+                var c = cs.get(nac);
+                if (c != null) {
+                    if (!(c.type & DynamicFontAtlasCharacterType.RESERVED)) {
+                        if (c.ref === 0) {
                             this._unrefCount -= 1;
                         }
-                        data.ref += 1;
+                        c.ref += 1;
                     }
                 }
                 else {
-                    var advance = this.getAdvance(character);
-                    var padding = this._padding;
-                    var width = Math.ceil(padding + advance + padding);
-                    var height = this.font.height;
-                    characters[id] = new DynamicFontAtlasCharacter(type, character, -width, // Setting X and Y to zeros leads to render the letter at the UV coordinate (0, 0).
-                    -height, width, height, advance);
-                    this._length += 1;
+                    var cd = cds.get(nac);
+                    if (cd != null) {
+                        cd.ref = 1;
+                        cs.set(nac, cd);
+                    }
+                    else {
+                        var newCharacter = this.newChar(nac, type);
+                        cs.set(nac, newCharacter);
+                        cds.set(nac, newCharacter);
+                    }
                     this._revision += 1;
                 }
+                // Go to the next
+                i = j;
             }
         };
-        DynamicFontAtlas.prototype.isIgnored = function (character) {
-            switch (character) {
-                case "\n": // Line feed
-                    return true;
-                case "\r": // Carriage return
-                    return true;
-                case "\v": // Vertical tab
-                    return true;
-                case "\f": // Form feed
-                    return true;
-                case "\u0085": // Next line
-                    return true;
-            }
-            return false;
-        };
-        DynamicFontAtlas.prototype.remove_ = function (id, characters) {
-            var data = characters[id];
-            if (data != null) {
-                if (!(data.type & DynamicFontAtlasCharacterType.RESERVED) && 0 < data.ref) {
-                    data.ref -= 1;
-                    if (data.ref === 0) {
+        DynamicFontAtlas.prototype.remove = function (characters) {
+            var cs = this._characters;
+            for (var i = 0, imax = characters.length; i < imax;) {
+                if (characters.charCodeAt(i) <= 0xff) {
+                    // Ignore ASCII characters
+                    i += 1;
+                    continue;
+                }
+                var j = i + 1;
+                for (; j < imax; ++j) {
+                    var cc = characters.charCodeAt(j);
+                    if ((0xdc00 <= cc && cc <= 0xdfff) || (0xfe00 <= cc && cc <= 0xfe0f)) {
+                        // Low surrogate
+                        // Variation selector
+                        continue;
+                    }
+                    break;
+                }
+                // Decrement the reference count
+                var nac = characters.substring(i, j);
+                var c = cs.get(nac);
+                if (c != null && 0 < c.ref && !(c.type & DynamicFontAtlasCharacterType.RESERVED)) {
+                    c.ref -= 1;
+                    if (c.ref === 0) {
                         this._unrefCount += 1;
                     }
                 }
+                // Go to the next
+                i = j;
             }
         };
-        DynamicFontAtlas.prototype.cleanup_ = function () {
-            if (this._length >> 1 <= this._unrefCount) {
-                var characters = this._characters;
-                for (var character in characters) {
-                    if (characters[character].ref <= 0) {
-                        delete characters[character];
+        DynamicFontAtlas.prototype.cleanup = function () {
+            var characters = this._characters;
+            if (characters.size >> 1 <= this._unrefCount) {
+                characters.forEach(function (char, id) {
+                    if (char.ref <= 0) {
+                        characters.delete(id);
                     }
-                }
-                this._length -= this._unrefCount;
+                });
                 this._revision += 1;
                 this._unrefCount = 0;
             }
         };
-        DynamicFontAtlas.prototype.add = function (targets, type) {
-            if (type === void 0) { type = DynamicFontAtlasCharacterType.LETTER; }
-            var characters = this._characters;
-            var iterator = UtilCharacterIterator.from(targets);
-            while (iterator.hasNext()) {
-                var character = iterator.next();
-                this.add_(character, character, characters, type);
-            }
-        };
-        DynamicFontAtlas.prototype.remove = function (targets) {
-            var characters = this._characters;
-            var iterator = UtilCharacterIterator.from(targets);
-            while (iterator.hasNext()) {
-                this.remove_(iterator.next(), characters);
-            }
-        };
         DynamicFontAtlas.prototype.get = function (id) {
-            return this._characters[id];
+            return this._characters.get(id);
         };
         DynamicFontAtlas.prototype.getAdvance = function (target) {
             var context = this.getContext();
@@ -48440,52 +48511,50 @@
             return context;
         };
         DynamicFontAtlas.prototype.update = function () {
-            this.cleanup_();
+            this.cleanup();
             if (this._revisionUpdated < this._revision) {
                 this._revisionUpdated = this._revision;
                 var canvas = this._canvas;
                 if (canvas != null) {
                     var font = this._font;
-                    var fontHeight = font.height;
+                    var fontHeight_1 = font.height;
                     var characters = this._characters;
-                    var width = (this._width = this.toPowerOf2(Math.ceil(Math.sqrt(this._length)) * fontHeight));
-                    var offsetX = this._padding;
-                    var x = 0;
-                    var y = 0;
-                    for (var key in characters) {
-                        var character = characters[key];
-                        if (width <= x + character.width) {
-                            x = 0;
-                            y += fontHeight;
+                    var width_1 = (this._width = this.toPowerOf2(Math.ceil(Math.sqrt(characters.size)) * fontHeight_1));
+                    var offsetX_1 = this._padding;
+                    var x_1 = 0;
+                    var y_1 = 0;
+                    characters.forEach(function (character) {
+                        if (width_1 <= x_1 + character.width) {
+                            x_1 = 0;
+                            y_1 += fontHeight_1;
                         }
-                        character.x = x;
-                        character.y = y;
-                        character.origin.x = x + offsetX;
-                        x += character.width;
-                    }
-                    var height = (this._height = y + fontHeight);
+                        character.x = x_1;
+                        character.y = y_1;
+                        character.origin.x = x_1 + offsetX_1;
+                        x_1 += character.width;
+                    });
+                    var height = (this._height = y_1 + fontHeight_1);
                     // Make an input canvas
                     // Here, we need to reset the context because
                     // context settings will be lost when we set the width/height.
                     var baseTexture = this._texture.baseTexture;
                     var resolution = baseTexture.resolution;
-                    var realWidth = Math.ceil(width * resolution);
+                    var realWidth = Math.ceil(width_1 * resolution);
                     var realHeight = Math.ceil(height * resolution);
                     canvas.width = realWidth;
                     canvas.height = realHeight;
-                    var context = this.getContext();
-                    if (context != null) {
-                        UtilFont.measure(context, font);
-                        var offsetY = Math.round((fontHeight - (font.ascent + font.descent)) * 0.5 + font.ascent);
-                        context.save();
-                        context.scale(resolution, resolution);
-                        context.clearRect(0, 0, width, height);
-                        for (var key in characters) {
-                            var character = characters[key];
-                            character.origin.y = character.y + offsetY;
-                            context.fillText(key, character.origin.x, character.origin.y);
-                        }
-                        context.restore();
+                    var context_1 = this.getContext();
+                    if (context_1 != null) {
+                        UtilFont.measure(context_1, font);
+                        var offsetY_1 = Math.round((fontHeight_1 - (font.ascent + font.descent)) * 0.5 + font.ascent);
+                        context_1.save();
+                        context_1.scale(resolution, resolution);
+                        context_1.clearRect(0, 0, width_1, height);
+                        characters.forEach(function (character) {
+                            character.origin.y = character.y + offsetY_1;
+                            context_1.fillText(character.character, character.origin.x, character.origin.y);
+                        });
+                        context_1.restore();
                     }
                     baseTexture.setRealSize(realWidth, realHeight);
                     return true;
@@ -48501,7 +48570,7 @@
         };
         Object.defineProperty(DynamicFontAtlas.prototype, "length", {
             get: function () {
-                return this._length;
+                return this._characters.size;
             },
             enumerable: false,
             configurable: true
@@ -48511,10 +48580,9 @@
             if (canvas != null) {
                 this._canvas = null;
             }
-            var characters = this._characters;
-            for (var character in characters) {
-                delete characters[character];
-            }
+            this._characters.clear();
+            this._createds.clear();
+            this._unrefCount = 0;
         };
         DynamicFontAtlas.prototype.toPowerOf2 = function (size) {
             var result = 32;
@@ -48563,7 +48631,7 @@
                 atlas = new DynamicFontAtlas(fontId, fontSize, fontColor, this._resolution);
                 colorToAtlas.set(fontColor, atlas);
             }
-            atlas.add(targets);
+            atlas.add(targets, DynamicFontAtlasCharacterType.LETTER);
         };
         DynamicFontAtlases.prototype.remove = function (fontId, fontColor, targets) {
             var colorToAtlas = this._atlases.get(fontId);
@@ -56495,22 +56563,7 @@
             });
         };
         DPane.prototype.onScrollBarUpdate = function (isRegionVisible) {
-            var overflowMask = this._overflowMask;
-            if (overflowMask != null) {
-                var content = this.content;
-                if (isRegionVisible) {
-                    if (content.mask !== overflowMask) {
-                        content.mask = overflowMask;
-                        DApplications.update(this);
-                    }
-                }
-                else {
-                    if (content.mask) {
-                        content.mask = null;
-                        DApplications.update(this);
-                    }
-                }
-            }
+            // DO NOTHING
         };
         DPane.prototype.initScrollBar = function (scrollbar) {
             var _this = this;
@@ -56583,14 +56636,18 @@
         };
         DPane.prototype.getOverflowMask = function () {
             var result = this._overflowMask;
-            if (result == null) {
-                result = new DBaseOverflowMask(this);
+            if (result === undefined) {
+                result = this.newOverflowMask();
                 this._overflowMask = result;
-                this.reflowable.add(result);
-                this.toDirty();
             }
             return result;
         };
+        DPane.prototype.newOverflowMask = function () {
+            var result = new DBaseOverflowMask(this);
+            this.reflowable.add(result);
+            this.toDirty();
+            return result;
+        };
         DPane.prototype.onWheel = function (e, deltas, global) {
             var content = this.content;
             var x = this.getWheelContentX(content, deltas.deltaX * deltas.lowest);
@@ -80137,6 +80194,7 @@
         FormatNodey: FormatNodey,
         FormatNodez: FormatNodez,
         FormatNodes: FormatNodes,
+        Character: Character,
         DynamicAtlasItemEmpty: DynamicAtlasItemEmpty,
         DynamicAtlasItemFontAtlas: DynamicAtlasItemFontAtlas,
         DynamicAtlasItemImage: DynamicAtlasItemImage,