@eva/plugin-a11y 2.0.0-beta.0 → 2.0.0-beta.10

package/dist/plugin-a11y.esm.js

@@ -1,4 +1,4 @@
-import { Component, decorators, System, OBSERVER_TYPE } from '@eva/eva.js';
+import { Component, System, decorators, OBSERVER_TYPE } from '@eva/eva.js';
 import { RendererSystem } from '@eva/plugin-renderer';
 import { type, step } from '@eva/inspector-decorator';
 
@@ -16,31 +16,6 @@ MERCHANTABLITY OR NON-INFRINGEMENT.
 See the Apache Version 2.0 License for specific language governing permissions
 and limitations under the License.
 ***************************************************************************** */
-/* global Reflect, Promise */
-
-var extendStatics = function(d, b) {
-    extendStatics = Object.setPrototypeOf ||
-        ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-        function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-    return extendStatics(d, b);
-};
-
-function __extends(d, b) {
-    extendStatics(d, b);
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-}
-
-var __assign = function() {
-    __assign = Object.assign || function __assign(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 
 function __decorate(decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
@@ -56,117 +31,74 @@ function __awaiter(thisArg, _arguments, P, generator) {
         function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
-}
-
-function __generator(thisArg, body) {
-    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
-    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
-    function verb(n) { return function (v) { return step([n, v]); }; }
-    function step(op) {
-        if (f) throw new TypeError("Generator is already executing.");
-        while (_) try {
-            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
-            if (y = 0, t) op = [op[0] & 2, t.value];
-            switch (op[0]) {
-                case 0: case 1: t = op; break;
-                case 4: _.label++; return { value: op[1], done: false };
-                case 5: _.label++; y = op[1]; op = [0]; continue;
-                case 7: op = _.ops.pop(); _.trys.pop(); continue;
-                default:
-                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
-                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
-                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
-                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
-                    if (t[2]) _.ops.pop();
-                    _.trys.pop(); continue;
-            }
-            op = body.call(thisArg, _);
-        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
-        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
-    }
-}
-
-function __values(o) {
-    var m = typeof Symbol === "function" && o[Symbol.iterator], i = 0;
-    if (m) return m.call(o);
-    return {
-        next: function () {
-            if (o && i >= o.length) o = void 0;
-            return { value: o && o[i++], done: !o };
-        }
-    };
 }
 
 function uuid(len) {
-    var chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('');
-    var uuid = [];
-    var radix = chars.length;
-    for (var i = 0; i < len; i++)
+    let chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz'.split('');
+    let uuid = [];
+    let radix = chars.length;
+    for (let i = 0; i < len; i++)
         uuid[i] = chars[0 | (Math.random() * radix)];
     return uuid.join('');
 }
-var setStyle = function (element, style) {
-    var width = style.width, height = style.height, position = style.position, _a = style.left, left = _a === void 0 ? 0 : _a, _b = style.top, top = _b === void 0 ? 0 : _b, zIndex = style.zIndex, pointerEvents = style.pointerEvents, background = style.background;
-    element.style.width = width + "px";
-    element.style.height = height + "px";
+const setStyle = (element, style) => {
+    const { width, height, position, left = 0, top = 0, zIndex, pointerEvents, background } = style;
+    element.style.width = `${width}px`;
+    element.style.height = `${height}px`;
     element.style.position = position;
-    element.style.left = "" + left;
-    element.style.top = "" + top;
-    element.style.zIndex = "" + zIndex;
+    element.style.left = `${left}`;
+    element.style.top = `${top}`;
+    element.style.zIndex = `${zIndex}`;
     element.style.pointerEvents = pointerEvents;
     element.style.background = background;
     element.style.border = 'none';
     element.style.overflow = 'hidden';
 };
-var setTransform = function (element, transform, ratioX, ratioY) {
-    var worldTransform = transform.worldTransform;
-    var a = worldTransform.a, b = worldTransform.b, c = worldTransform.c, d = worldTransform.d, tx = worldTransform.tx, ty = worldTransform.ty;
-    var matrix = "matrix(" + a + ", " + b + ", " + c + ", " + d + ", " + tx * ratioX + ", " + ty * ratioY + ")";
-    element.style.transform = "" + matrix;
-    element.style.webkitTransform = "" + matrix;
+const setTransform = (element, transform, ratioX, ratioY) => {
+    const { worldTransform } = transform;
+    const { a, b, c, d, tx, ty } = worldTransform;
+    const matrix = `matrix(${a}, ${b}, ${c}, ${d}, ${tx * ratioX}, ${ty * ratioY})`;
+    element.style.transform = `${matrix}`;
+    element.style.webkitTransform = `${matrix}`;
     element.style.transformOrigin = 'left top';
     element.style.webkitTransformOrigin = 'left top';
 };
 
-var A11y = (function (_super) {
-    __extends(A11y, _super);
-    function A11y(param) {
-        var _this = _super.call(this) || this;
-        Object.assign(_this, param);
-        var _a = param.hint, hint = _a === void 0 ? '' : _a, event = param.event, _b = param.delay, delay = _b === void 0 ? 0 : _b, _c = param.attr, attr = _c === void 0 ? {} : _c, _d = param.role, role = _d === void 0 ? '' : _d, _e = param.props, props = _e === void 0 ? {} : _e, _f = param.state, state = _f === void 0 ? {} : _f;
-        _this.hint = hint;
-        _this.event = event;
-        _this.delay = delay;
-        _this.attr = attr;
-        _this.role = role;
-        _this.props = props;
-        _this.state = state;
-        _this.a11yId = "_" + uuid(6);
-        return _this;
+class A11y extends Component {
+    constructor(param) {
+        super();
+        Object.assign(this, param);
+        const { hint = '', event, delay = 0, attr = {}, role = '', props = {}, state = {} } = param;
+        this.hint = hint;
+        this.event = event;
+        this.delay = delay;
+        this.attr = attr;
+        this.role = role;
+        this.props = props;
+        this.state = state;
+        this.a11yId = `_${uuid(6)}`;
     }
-    A11y.componentName = 'A11y';
-    __decorate([
-        type('boolean')
-    ], A11y.prototype, "interactive", void 0);
-    __decorate([
-        type('string')
-    ], A11y.prototype, "hint", void 0);
-    __decorate([
-        type('number'),
-        step(1)
-    ], A11y.prototype, "delay", void 0);
-    __decorate([
-        type('string')
-    ], A11y.prototype, "role", void 0);
-    __decorate([
-        type('string')
-    ], A11y.prototype, "a11yId", void 0);
-    return A11y;
-}(Component));
-var A11y$1 = A11y;
+}
+A11y.componentName = 'A11y';
+__decorate([
+    type('boolean')
+], A11y.prototype, "interactive", void 0);
+__decorate([
+    type('string')
+], A11y.prototype, "hint", void 0);
+__decorate([
+    type('number'),
+    step(1)
+], A11y.prototype, "delay", void 0);
+__decorate([
+    type('string')
+], A11y.prototype, "role", void 0);
+__decorate([
+    type('string')
+], A11y.prototype, "a11yId", void 0);
 
-var POSITION = 'absolute';
-var ZINDEX = 3;
+const POSITION = 'absolute';
+const ZINDEX = 3;
 var A11yActivate;
 (function (A11yActivate) {
     A11yActivate[A11yActivate["ENABLE"] = 0] = "ENABLE";
@@ -189,119 +121,90 @@ var ElementType;
     ElementType["DIV"] = "div";
 })(ElementType || (ElementType = {}));
 
-var notAttr = ['hint', 'event', 'delay', 'attr', 'role', 'props', 'state', 'a11yId', 'name'];
-var getEventFunc = function (event, gameObject, e) {
-    var _this = this;
-    ['touchstart', 'touchend', 'tap'].forEach(function (name) {
+const notAttr = ['hint', 'event', 'delay', 'attr', 'role', 'props', 'state', 'a11yId', 'name'];
+const getEventFunc = function (event, gameObject, e) {
+    ['touchstart', 'touchend', 'tap'].forEach(name => {
         event.emit(name, {
-            stopPropagation: function () { return e.stopPropagation(); },
+            stopPropagation: () => e.stopPropagation(),
             data: {
-                position: _this.eventPosition,
+                position: this.eventPosition,
             },
-            gameObject: gameObject,
+            gameObject,
         });
     });
 };
-var A11ySystem = (function (_super) {
-    __extends(A11ySystem, _super);
-    function A11ySystem(opt) {
-        var _this = _super.call(this, opt) || this;
-        _this.cache = new Map();
-        _this.eventCache = new Map();
-        _this.zIndex = ZINDEX;
-        return _this;
+let A11ySystem = class A11ySystem extends System {
+    constructor(opt) {
+        super(opt);
+        this.cache = new Map();
+        this.eventCache = new Map();
+        this.zIndex = ZINDEX;
     }
-    Object.defineProperty(A11ySystem.prototype, "ratioX", {
-        get: function () {
-            if (this._ratioX) {
+    get ratioX() {
+        if (this._ratioX) {
+            return this._ratioX;
+        }
+        else {
+            const success = this.setRatio();
+            if (success) {
                 return this._ratioX;
             }
             else {
-                var success = this.setRatio();
-                if (success) {
-                    return this._ratioX;
-                }
-                else {
-                    return 0;
-                }
+                return 0;
             }
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(A11ySystem.prototype, "ratioY", {
-        get: function () {
-            if (this._ratioY) {
+        }
+    }
+    get ratioY() {
+        if (this._ratioY) {
+            return this._ratioY;
+        }
+        else {
+            const success = this.setRatio();
+            if (success) {
                 return this._ratioY;
             }
             else {
-                var success = this.setRatio();
-                if (success) {
-                    return this._ratioY;
-                }
-                else {
-                    return 0;
-                }
+                return 0;
             }
-        },
-        enumerable: false,
-        configurable: true
-    });
-    A11ySystem.prototype.init = function (opt) {
-        if (opt === void 0) { opt = {}; }
-        return __awaiter(this, void 0, void 0, function () {
-            var _a, activate, _b, delay, _c, checkA11yOpen, zIndex, _d, _e, div;
-            return __generator(this, function (_f) {
-                switch (_f.label) {
-                    case 0:
-                        _a = opt.activate, activate = _a === void 0 ? A11yActivate.CHECK : _a, _b = opt.delay, delay = _b === void 0 ? 100 : _b, _c = opt.checkA11yOpen, checkA11yOpen = _c === void 0 ? function () { return Promise.resolve(false); } : _c, zIndex = opt.zIndex;
-                        this.delay = delay;
-                        this.zIndex = zIndex || this.zIndex;
-                        _d = activate;
-                        switch (_d) {
-                            case A11yActivate.CHECK: return [3, 1];
-                            case A11yActivate.DISABLE: return [3, 5];
-                            case A11yActivate.ENABLE: return [3, 6];
-                        }
-                        return [3, 7];
-                    case 1:
-                        _f.trys.push([1, 3, , 4]);
-                        _e = this;
-                        return [4, checkA11yOpen()];
-                    case 2:
-                        _e.activate = _f.sent();
-                        return [3, 4];
-                    case 3:
-                        _f.sent();
-                        this.activate = false;
-                        return [3, 4];
-                    case 4: return [3, 7];
-                    case 5:
+        }
+    }
+    init(opt = {}) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const { activate = A11yActivate.CHECK, delay = 100, checkA11yOpen = () => Promise.resolve(false), zIndex } = opt;
+            this.delay = delay;
+            this.zIndex = zIndex || this.zIndex;
+            switch (activate) {
+                case A11yActivate.CHECK:
+                    try {
+                        this.activate = yield checkA11yOpen();
+                    }
+                    catch (error) {
                         this.activate = false;
-                        return [3, 7];
-                    case 6:
-                        this.activate = true;
-                        return [3, 7];
-                    case 7:
-                        this.debug = opt.debug || false;
-                        if (this.debug) {
-                            this.activate = true;
-                        }
-                        if (!this.activate)
-                            return [2];
-                        div = document.createElement('div');
-                        this.div = div;
-                        if (this.game.canvas.parentNode) {
-                            this.game.canvas.parentNode.insertBefore(this.div, this.game.canvas);
-                        }
-                        return [2];
-                }
-            });
+                    }
+                    break;
+                case A11yActivate.DISABLE:
+                    this.activate = false;
+                    break;
+                case A11yActivate.ENABLE:
+                    this.activate = true;
+                    break;
+            }
+            this.debug = opt.debug || false;
+            if (this.debug) {
+                this.activate = true;
+            }
+            if (!this.activate)
+                return;
+            const div = document.createElement('div');
+            this.div = div;
+            if (this.game.canvas.parentNode) {
+                this.game.canvas.parentNode.insertBefore(this.div, this.game.canvas);
+            }
         });
-    };
-    A11ySystem.prototype.setRatio = function () {
-        var _a = this.getCanvasBoundingClientRect(), width = _a.width, height = _a.height;
-        var _b = this.getRenderRect(), renderWidth = _b.renderWidth, renderHeight = _b.renderHeight;
+    }
+    setRatio() {
+        const { width, height } = this.getCanvasBoundingClientRect();
+        const { renderWidth, renderHeight } = this.getRenderRect();
         this._ratioX = width / renderWidth;
         this._ratioY = height / renderHeight;
         if (width || height) {
@@ -311,226 +214,178 @@ var A11ySystem = (function (_super) {
         else {
             return false;
         }
-    };
-    A11ySystem.prototype.getRenderRect = function () {
-        var _a = this.game.getSystem(RendererSystem).params, params = _a === void 0 ? { width: 300, height: 300 } : _a;
-        var renderHeight = params.height, renderWidth = params.width;
-        return { renderWidth: renderWidth, renderHeight: renderHeight };
-    };
-    A11ySystem.prototype.getCanvasBoundingClientRect = function () {
-        var _a = this.game.canvas.getBoundingClientRect(), width = _a.width, height = _a.height, left = _a.left, top = _a.top;
-        return { width: width, height: height, left: left, top: top };
-    };
-    A11ySystem.prototype.initDiv = function () {
-        var _this = this;
-        var pageXOffset = window.pageXOffset, pageYOffset = window.pageYOffset;
-        var _a = this.getCanvasBoundingClientRect(), width = _a.width, height = _a.height, left = _a.left, top = _a.top;
-        var style = {
-            width: width,
-            height: height,
-            left: left + pageXOffset + "px",
-            top: top + pageYOffset + "px",
+    }
+    getRenderRect() {
+        const { params = { width: 300, height: 300 } } = this.game.getSystem(RendererSystem);
+        const { height: renderHeight, width: renderWidth } = params;
+        return { renderWidth, renderHeight };
+    }
+    getCanvasBoundingClientRect() {
+        const { width, height, left, top } = this.game.canvas.getBoundingClientRect();
+        return { width, height, left, top };
+    }
+    initDiv() {
+        const { pageXOffset, pageYOffset } = window;
+        const { width, height, left, top } = this.getCanvasBoundingClientRect();
+        const style = {
+            width,
+            height,
+            left: `${left + pageXOffset}px`,
+            top: `${top + pageYOffset}px`,
             position: POSITION,
             zIndex: this.zIndex,
             pointerEvents: PointerEvents.NONE,
             background: MaskBackground.NONE,
         };
         setStyle(this.div, style);
-        this.div.addEventListener('click', function (e) {
-            var currentTarget = e.currentTarget;
-            var _a = currentTarget.getBoundingClientRect(), left = _a.left, top = _a.top;
-            var x = (e.pageX - left) / _this.ratioX;
-            var y = (e.pageY - top) / _this.ratioY;
-            _this.eventPosition = { x: x, y: y };
+        this.div.addEventListener('click', e => {
+            const currentTarget = e.currentTarget;
+            const { left, top } = currentTarget.getBoundingClientRect();
+            const x = (e.pageX - left) / this.ratioX;
+            const y = (e.pageY - top) / this.ratioY;
+            this.eventPosition = { x, y };
         }, true);
-    };
-    A11ySystem.prototype.update = function () {
-        return __awaiter(this, void 0, void 0, function () {
-            var changes, changes_1, changes_1_1, changed;
-            var e_1, _a;
-            return __generator(this, function (_b) {
-                changes = this.componentObserver.clear();
-                if (!this.activate) {
-                    return [2];
-                }
-                try {
-                    for (changes_1 = __values(changes), changes_1_1 = changes_1.next(); !changes_1_1.done; changes_1_1 = changes_1.next()) {
-                        changed = changes_1_1.value;
-                        switch (changed.type) {
-                            case OBSERVER_TYPE.ADD:
-                                changed.componentName === 'Event' && this.addEvent(changed.gameObject);
-                                changed.componentName === 'A11y' && this.add(changed);
-                                break;
-                            case OBSERVER_TYPE.CHANGE:
-                                changed.componentName === 'Transform' && this.transformChange(changed);
-                                changed.componentName === 'A11y' && this.change(changed);
-                                break;
-                            case OBSERVER_TYPE.REMOVE:
-                                changed.componentName === 'Event' && this.removeEvent(changed);
-                                changed.componentName === 'A11y' && this.remove(changed);
-                        }
-                    }
-                }
-                catch (e_1_1) { e_1 = { error: e_1_1 }; }
-                finally {
-                    try {
-                        if (changes_1_1 && !changes_1_1.done && (_a = changes_1.return)) _a.call(changes_1);
-                    }
-                    finally { if (e_1) throw e_1.error; }
+    }
+    update() {
+        return __awaiter(this, void 0, void 0, function* () {
+            const changes = this.componentObserver.clear();
+            if (!this.activate) {
+                return;
+            }
+            for (const changed of changes) {
+                switch (changed.type) {
+                    case OBSERVER_TYPE.ADD:
+                        changed.componentName === 'Event' && this.addEvent(changed.gameObject);
+                        changed.componentName === 'A11y' && this.add(changed);
+                        break;
+                    case OBSERVER_TYPE.CHANGE:
+                        changed.componentName === 'Transform' && this.transformChange(changed);
+                        changed.componentName === 'A11y' && this.change(changed);
+                        break;
+                    case OBSERVER_TYPE.REMOVE:
+                        changed.componentName === 'Event' && this.removeEvent(changed);
+                        changed.componentName === 'A11y' && this.remove(changed);
                 }
-                return [2];
-            });
+            }
         });
-    };
-    A11ySystem.prototype.change = function (changed) {
-        var component = changed.component;
+    }
+    change(changed) {
+        const component = changed.component;
         if (changed.prop.prop[0] === 'hint') {
-            var dom = this.cache.get(component.a11yId);
+            const dom = this.cache.get(component.a11yId);
             dom === null || dom === void 0 ? void 0 : dom.setAttribute('aria-label', component.hint);
             dom && this.setPosition(dom, changed.gameObject.transform);
         }
-    };
-    A11ySystem.prototype.remove = function (changed) {
-        var component = changed.component;
+    }
+    remove(changed) {
+        const component = changed.component;
         if (!component)
             return;
-        var a11yId = component.a11yId;
-        var element = this.div.querySelector("#" + a11yId);
+        const { a11yId } = component;
+        const element = this.div.querySelector(`#${a11yId}`);
         element && this.div.removeChild(element);
         this.cache.delete(a11yId);
-    };
-    A11ySystem.prototype.add = function (changed) {
-        var _this = this;
+    }
+    add(changed) {
         if (!this.activate)
             return;
-        var component = changed.component;
-        var gameObject = changed.gameObject;
-        var delay = component.delay, id = component.a11yId;
-        var event = component.event;
+        const component = changed.component;
+        const { gameObject } = changed;
+        const { delay, a11yId: id } = component;
+        let { event } = component;
         if (!gameObject)
             return;
-        var transform = gameObject.transform;
+        const { transform } = gameObject;
         if (!transform)
             return;
-        var element = document.createElement('div');
+        const element = document.createElement('div');
         this.cache.set(id, element);
         if (!event) {
             event = gameObject.getComponent('Event');
         }
-        setTimeout(function () {
-            _this.setPosition(element, transform);
-            _this.setA11yAttr(element, component);
+        setTimeout(() => {
+            this.setPosition(element, transform);
+            this.setA11yAttr(element, component);
             if (event) {
-                _this.addEvent(gameObject);
+                this.addEvent(gameObject);
             }
             if (gameObject.scene) {
-                _this.div.appendChild(element);
+                this.div.appendChild(element);
             }
         }, delay || this.delay);
-    };
-    A11ySystem.prototype.transformChange = function (changed) {
-        var component = changed.component;
-        var gameObject = changed.gameObject;
-        var a11yComponent = gameObject.getComponent(A11y$1);
+    }
+    transformChange(changed) {
+        const component = changed.component;
+        const { gameObject } = changed;
+        const a11yComponent = gameObject.getComponent(A11y);
         if (!a11yComponent)
             return;
-        var a11yId = a11yComponent.a11yId;
+        const { a11yId } = a11yComponent;
         if (!component.inScene) {
-            var dom = this.div.querySelector("#" + a11yId);
+            const dom = this.div.querySelector(`#${a11yId}`);
             dom && this.div.removeChild(dom);
         }
         else {
             if (this.cache.has(a11yId)) {
-                var addDom = this.cache.get(a11yId);
+                const addDom = this.cache.get(a11yId);
                 addDom && this.div.appendChild(addDom);
             }
         }
-    };
-    A11ySystem.prototype.setEvent = function (element, event, gameObject, id) {
+    }
+    setEvent(element, event, gameObject, id) {
         if (!event) {
             return;
         }
-        var func = getEventFunc.bind(this, event, gameObject);
+        const func = getEventFunc.bind(this, event, gameObject);
         this.eventCache.set(id, func);
         element.addEventListener('click', func);
-    };
-    A11ySystem.prototype.addEvent = function (gameObject) {
-        var a11y = gameObject.getComponent(A11y$1);
+    }
+    addEvent(gameObject) {
+        const a11y = gameObject.getComponent(A11y);
         if (!a11y)
             return;
-        var event = gameObject.getComponent('Event');
+        const event = gameObject.getComponent('Event');
         if (!event)
             return;
-        var element = this.cache.get(a11y.a11yId);
+        const element = this.cache.get(a11y.a11yId);
         element && this.setEvent(element, event, gameObject, a11y.a11yId);
-    };
-    A11ySystem.prototype.removeEvent = function (changed) {
-        var gameObject = changed.gameObject;
-        var a11y = gameObject.getComponent(A11y$1);
+    }
+    removeEvent(changed) {
+        const { gameObject } = changed;
+        const a11y = gameObject.getComponent(A11y);
         if (!a11y)
             return;
-        var event = changed.component;
+        const event = changed.component;
         if (!event)
             return;
-        var a11yId = a11y.a11yId;
-        var func = this.eventCache.get(a11yId);
-        var element = this.cache.get(a11yId);
+        const { a11yId } = a11y;
+        const func = this.eventCache.get(a11yId);
+        const element = this.cache.get(a11yId);
         element && element.removeEventListener('click', func);
-    };
-    A11ySystem.prototype.setA11yAttr = function (element, component) {
-        var e_2, _a, e_3, _b, e_4, _c;
-        var hint = component.hint, _d = component.props, props = _d === void 0 ? {} : _d, _e = component.state, state = _e === void 0 ? {} : _e, role = component.role, id = component.a11yId;
-        var realRole = role || 'text';
+    }
+    setA11yAttr(element, component) {
+        const { hint, props = {}, state = {}, role, a11yId: id } = component;
+        const realRole = role || 'text';
         element.setAttribute('role', realRole);
         element.setAttribute('aria-label', hint);
         element.id = id;
-        var ariaProps = Object.keys(props);
-        try {
-            for (var ariaProps_1 = __values(ariaProps), ariaProps_1_1 = ariaProps_1.next(); !ariaProps_1_1.done; ariaProps_1_1 = ariaProps_1.next()) {
-                var key = ariaProps_1_1.value;
-                element.setAttribute(key, props[key]);
-            }
+        const ariaProps = Object.keys(props);
+        for (const key of ariaProps) {
+            element.setAttribute(key, props[key]);
         }
-        catch (e_2_1) { e_2 = { error: e_2_1 }; }
-        finally {
-            try {
-                if (ariaProps_1_1 && !ariaProps_1_1.done && (_a = ariaProps_1.return)) _a.call(ariaProps_1);
-            }
-            finally { if (e_2) throw e_2.error; }
-        }
-        var ariaState = Object.keys(state);
-        try {
-            for (var ariaState_1 = __values(ariaState), ariaState_1_1 = ariaState_1.next(); !ariaState_1_1.done; ariaState_1_1 = ariaState_1.next()) {
-                var key = ariaState_1_1.value;
-                element.setAttribute(key, state[key]);
-            }
+        const ariaState = Object.keys(state);
+        for (const key of ariaState) {
+            element.setAttribute(key, state[key]);
         }
-        catch (e_3_1) { e_3 = { error: e_3_1 }; }
-        finally {
-            try {
-                if (ariaState_1_1 && !ariaState_1_1.done && (_b = ariaState_1.return)) _b.call(ariaState_1);
+        for (const key of Object.keys(component)) {
+            if (typeof component[key] === 'string' && notAttr.indexOf(key) === -1 && key.indexOf('_') !== 1) {
+                element.setAttribute(key, component[key]);
             }
-            finally { if (e_3) throw e_3.error; }
         }
-        try {
-            for (var _f = __values(Object.keys(component)), _g = _f.next(); !_g.done; _g = _f.next()) {
-                var key = _g.value;
-                if (typeof component[key] === 'string' && notAttr.indexOf(key) === -1 && key.indexOf('_') !== 1) {
-                    element.setAttribute(key, component[key]);
-                }
-            }
-        }
-        catch (e_4_1) { e_4 = { error: e_4_1 }; }
-        finally {
-            try {
-                if (_g && !_g.done && (_c = _f.return)) _c.call(_f);
-            }
-            finally { if (e_4) throw e_4.error; }
-        }
-    };
-    A11ySystem.prototype.setPosition = function (element, transform) {
-        var _a = transform.size, width = _a.width, height = _a.height;
-        var style = {
+    }
+    setPosition(element, transform) {
+        const { width, height } = transform.size;
+        const style = {
             width: width === 0 ? 1 : width * this.ratioX,
             height: height === 0 ? 1 : height * this.ratioY,
             position: POSITION,
@@ -538,26 +393,25 @@ var A11ySystem = (function (_super) {
             pointerEvents: PointerEvents.AUTO,
             background: this.debug ? MaskBackground.DEBUG : MaskBackground.NONE,
         };
-        var transformProps = __assign({}, transform);
+        const transformProps = Object.assign({}, transform);
         setStyle(element, style);
         setTransform(element, transformProps, this.ratioX, this.ratioY);
-    };
-    A11ySystem.prototype.onDestroy = function () {
+    }
+    onDestroy() {
         this.div.parentElement.removeChild(this.div);
         this.cache = null;
         this.eventCache = null;
         this.div = null;
-    };
-    A11ySystem.systemName = 'A11ySystem';
-    A11ySystem = __decorate([
-        decorators.componentObserver({
-            A11y: ['hint'],
-            Transform: ['inScene'],
-            Event: [],
-        })
-    ], A11ySystem);
-    return A11ySystem;
-}(System));
+    }
+};
+A11ySystem.systemName = 'A11ySystem';
+A11ySystem = __decorate([
+    decorators.componentObserver({
+        A11y: ['hint'],
+        Transform: ['inScene'],
+        Event: [],
+    })
+], A11ySystem);
 var A11ySystem$1 = A11ySystem;
 
-export { A11y$1 as A11y, A11yActivate, A11ySystem$1 as A11ySystem };
+export { A11y, A11yActivate, A11ySystem$1 as A11ySystem };