@hatiolab/things-scene 9.0.0-beta.2 → 9.0.0-beta.21

package/dist/components/popup.js

@@ -0,0 +1,138 @@
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ */
+import ScenePopup from '../layer/action/popup';
+import Component from './component';
+import RectPath from './mixins/rect-path';
+import Shape from './shape';
+const CENTER = 'center';
+const LEFTTOP = 'left-top';
+const RIGHTTOP = 'right-top';
+const LEFTBOTTOM = 'left-bottom';
+const RIGHTBOTTOM = 'right-bottom';
+const AUTO = 'auto';
+const NATURE = {
+    mutable: false,
+    resizable: true,
+    rotatable: true,
+    properties: [
+        {
+            type: 'board-selector',
+            label: 'board',
+            name: 'board'
+        },
+        {
+            type: 'checkbox',
+            label: 'modal',
+            name: 'modal'
+        },
+        {
+            type: 'checkbox',
+            label: 'closable',
+            name: 'closable'
+        },
+        {
+            type: 'checkbox',
+            label: 'show',
+            name: 'show'
+        },
+        {
+            type: 'select',
+            label: 'location',
+            name: 'location',
+            property: {
+                options: [CENTER, LEFTTOP, RIGHTTOP, LEFTBOTTOM, RIGHTBOTTOM, AUTO]
+            }
+        },
+        {
+            type: 'data',
+            label: 'value',
+            name: 'value'
+        }
+    ],
+    help: 'scene/component/popup'
+};
+const POPUP_IMAGE = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEYAAABGCAMAAABG8BK2AAADJmlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNy4xLWMwMDAgNzkuZGFiYWNiYiwgMjAyMS8wNC8xNC0wMDozOTo0NCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIzLjAgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RkM4QzQxNUMzMzBEMTFFQ0JEMzZDMDUwQUI4MEI3QTAiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RkM4QzQxNUQzMzBEMTFFQ0JEMzZDMDUwQUI4MEI3QTAiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpENjlENTQ3RjMzMDkxMUVDQkQzNkMwNTBBQjgwQjdBMCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpENjlENTQ4MDMzMDkxMUVDQkQzNkMwNTBBQjgwQjdBMCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsiUYSQAAAAZdEVYdFNvZnR3YXJlAEFkb2JlIEltYWdlUmVhZHlxyWU8AAAA51BMVEVHcEwzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzOguTm2AAAATHRSTlMARhB73r9B7YLrsqdE+0cq9Avzeg31eQx4aQ+Ks6aUd5DsYKixEX1w8vyT2VjoZ3YezY/cCEDvl+QTvRwJ0ifwK/5T/aw6+IuFuCImAcS6MQAAAeJJREFUWMPt2FlX2zAQhuHJYmOSFhIggbC0QNn3rS1dKXSH9///Hi58CJLxKIpEWi6YO8c5z4lG/nxGEXmu/1OVLGnhrFaSVQYg1SZetTTvUibqeFZ9QlfmvRWoV1VmCaCRzroXPpsuAjTV7gLUfPahBqD1OQMW/fazAWTKvQRI/ZgUSJR7U8CM/dHZ+/2VcatWdvdEZAaYUhiAwkerJXt0rnzXwdRKmHfDM0fHD5kxjTFyVLzVfvvirn7+cDJWjhy7c7XlYuwc6Urvu2tRhRypyhwAf1sKY+TIxfQA+H39q5wxc+RgVrcBduTmZTlj5khnDgH4IzKpMGaOVCbvyyvRGTNHGtPrKypjXirM5jb910I4k69oQeKY+77EMAcALEsck/+W6f71tyCma/ZFROTrJVwMy7wmf3bv6/MX+Dgkkysblvxps/dhOKZb6IvrTakzXXuPApnpYneDGOeKvJlaSXcDmA7AicQyW84VeTOnY+NdiWcG1uiZksFEHdyAlsJEjEkmkwGNsKHNZCJGSKtVTYC1tO022mnjwUBrMdXg8dreuOBhv7D/62/8lGZ1wLxXyZKOm+iUHIQintyny0TkaATHjYgcjeAoFpEje9R/nGPqIx2aw3NU9odCQI6e6x/VLY32cKQXVBnkAAAAAElFTkSuQmCC';
+/*
+ * Popup Window를 통해서 다른 Scene Model을 보여준다.
+ */
+export default class Popup extends RectPath(Shape) {
+    static get image() {
+        if (!Popup._image) {
+            Popup._image = new Image();
+            Popup._image.src = POPUP_IMAGE;
+        }
+        return Popup._image;
+    }
+    /* Members */
+    ready() {
+        super.ready();
+        this.show && this.onchangeShow(true);
+    }
+    render(context) {
+        var { left, top, width, height } = this.bounds;
+        context.beginPath();
+        this.drawImage(context, Popup.image, left, top, width, height);
+    }
+    onchange(after, before) {
+        if ('value' in after) {
+            if (this.show) {
+                this.onchangeShow(true);
+            }
+            else {
+                this.show = true;
+            }
+        }
+        else if ('show' in after) {
+            this.onchangeShow(this.show);
+        }
+    }
+    onchangeShow(value) {
+        if (this.app.isEditMode || !this.getState('board')) {
+            return;
+        }
+        if (value) {
+            ScenePopup.show(this, this.board, {
+                location: this.getState('location'),
+                modal: this.getState('modal'),
+                closable: this.getState('closable') || false,
+                data: this.value
+            });
+        }
+        else {
+            ScenePopup.hide(this);
+        }
+    }
+    get board() {
+        return this.getState('board');
+    }
+    set board(board) {
+        this.set('board', board);
+    }
+    get show() {
+        return this.getState('show');
+    }
+    set show(show) {
+        this.setState('show', show);
+    }
+    get started() {
+        return this.getState('show');
+    }
+    set started(show) {
+        this.setState('show', show);
+    }
+    get value() {
+        return this.getState('value');
+    }
+    set value(value) {
+        this.setState('value', value);
+    }
+    get hasTextProperty() {
+        return false;
+    }
+    get nature() {
+        return NATURE;
+    }
+}
+Component.register('popup', Popup);
+//# sourceMappingURL=popup.js.map

package/dist/components/popup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"popup.js","sourceRoot":"","sources":["../../src/components/popup.js"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport ScenePopup from '../layer/action/popup'\nimport Component from './component'\nimport RectPath from './mixins/rect-path'\nimport Shape from './shape'\n\nconst CENTER = 'center'\nconst LEFTTOP = 'left-top'\nconst RIGHTTOP = 'right-top'\nconst LEFTBOTTOM = 'left-bottom'\nconst RIGHTBOTTOM = 'right-bottom'\nconst AUTO = 'auto'\n\nconst NATURE = {\n  mutable: false,\n  resizable: true,\n  rotatable: true,\n  properties: [\n    {\n      type: 'board-selector',\n      label: 'board',\n      name: 'board'\n    },\n    {\n      type: 'checkbox',\n      label: 'modal',\n      name: 'modal'\n    },\n    {\n      type: 'checkbox',\n      label: 'closable',\n      name: 'closable'\n    },\n    {\n      type: 'checkbox',\n      label: 'show',\n      name: 'show'\n    },\n    {\n      type: 'select',\n      label: 'location',\n      name: 'location',\n      property: {\n        options: [CENTER, LEFTTOP, RIGHTTOP, LEFTBOTTOM, RIGHTBOTTOM, AUTO]\n      }\n    },\n    {\n      type: 'data',\n      label: 'value',\n      name: 'value'\n    }\n  ],\n  help: 'scene/component/popup'\n}\n\nconst POPUP_IMAGE =\n  'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEYAAABGCAMAAABG8BK2AAADJmlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNy4xLWMwMDAgNzkuZGFiYWNiYiwgMjAyMS8wNC8xNC0wMDozOTo0NCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIzLjAgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RkM4QzQxNUMzMzBEMTFFQ0JEMzZDMDUwQUI4MEI3QTAiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RkM4QzQxNUQzMzBEMTFFQ0JEMzZDMDUwQUI4MEI3QTAiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpENjlENTQ3RjMzMDkxMUVDQkQzNkMwNTBBQjgwQjdBMCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpENjlENTQ4MDMzMDkxMUVDQkQzNkMwNTBBQjgwQjdBMCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsiUYSQAAAAZdEVYdFNvZnR3YXJlAEFkb2JlIEltYWdlUmVhZHlxyWU8AAAA51BMVEVHcEwzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzOguTm2AAAATHRSTlMARhB73r9B7YLrsqdE+0cq9Avzeg31eQx4aQ+Ks6aUd5DsYKixEX1w8vyT2VjoZ3YezY/cCEDvl+QTvRwJ0ifwK/5T/aw6+IuFuCImAcS6MQAAAeJJREFUWMPt2FlX2zAQhuHJYmOSFhIggbC0QNn3rS1dKXSH9///Hi58CJLxKIpEWi6YO8c5z4lG/nxGEXmu/1OVLGnhrFaSVQYg1SZetTTvUibqeFZ9QlfmvRWoV1VmCaCRzroXPpsuAjTV7gLUfPahBqD1OQMW/fazAWTKvQRI/ZgUSJR7U8CM/dHZ+/2VcatWdvdEZAaYUhiAwkerJXt0rnzXwdRKmHfDM0fHD5kxjTFyVLzVfvvirn7+cDJWjhy7c7XlYuwc6Urvu2tRhRypyhwAf1sKY+TIxfQA+H39q5wxc+RgVrcBduTmZTlj5khnDgH4IzKpMGaOVCbvyyvRGTNHGtPrKypjXirM5jb910I4k69oQeKY+77EMAcALEsck/+W6f71tyCma/ZFROTrJVwMy7wmf3bv6/MX+Dgkkysblvxps/dhOKZb6IvrTakzXXuPApnpYneDGOeKvJlaSXcDmA7AicQyW84VeTOnY+NdiWcG1uiZksFEHdyAlsJEjEkmkwGNsKHNZCJGSKtVTYC1tO022mnjwUBrMdXg8dreuOBhv7D/62/8lGZ1wLxXyZKOm+iUHIQintyny0TkaATHjYgcjeAoFpEje9R/nGPqIx2aw3NU9odCQI6e6x/VLY32cKQXVBnkAAAAAElFTkSuQmCC'\n\n/*\n * Popup Window를 통해서 다른 Scene Model을 보여준다.\n */\nexport default class Popup extends RectPath(Shape) {\n  static get image() {\n    if (!Popup._image) {\n      Popup._image = new Image()\n      Popup._image.src = POPUP_IMAGE\n    }\n\n    return Popup._image\n  }\n\n  /* Members */\n\n  ready() {\n    super.ready()\n\n    this.show && this.onchangeShow(true)\n  }\n\n  render(context) {\n    var { left, top, width, height } = this.bounds\n\n    context.beginPath()\n    this.drawImage(context, Popup.image, left, top, width, height)\n  }\n\n  onchange(after, before) {\n    if ('value' in after) {\n      if (this.show) {\n        this.onchangeShow(true)\n      } else {\n        this.show = true\n      }\n    } else if ('show' in after) {\n      this.onchangeShow(this.show)\n    }\n  }\n\n  onchangeShow(value) {\n    if (this.app.isEditMode || !this.getState('board')) {\n      return\n    }\n\n    if (value) {\n      ScenePopup.show(this, this.board, {\n        location: this.getState('location'),\n        modal: this.getState('modal'),\n        closable: this.getState('closable') || false,\n        data: this.value\n      })\n    } else {\n      ScenePopup.hide(this)\n    }\n  }\n\n  get board() {\n    return this.getState('board')\n  }\n\n  set board(board) {\n    this.set('board', board)\n  }\n\n  get show() {\n    return this.getState('show')\n  }\n\n  set show(show) {\n    this.setState('show', show)\n  }\n\n  get started() {\n    return this.getState('show')\n  }\n\n  set started(show) {\n    this.setState('show', show)\n  }\n\n  get value() {\n    return this.getState('value')\n  }\n\n  set value(value) {\n    this.setState('value', value)\n  }\n\n  get hasTextProperty() {\n    return false\n  }\n\n  get nature() {\n    return NATURE\n  }\n}\n\nComponent.register('popup', Popup)\n"]}

package/dist/components/rect.d.ts

@@ -0,0 +1,26 @@
+import * as THREE from 'three';
+import { Component, ComponentNature, Shape } from '@hatiolab/things-scene';
+import RealObject from '../threed/real-object';
+import RealObjectExtrude from '../threed/real-object-extrude';
+export declare class RectExtrude extends RealObjectExtrude {
+    get shape(): THREE.Shape;
+}
+declare const Rect_base: (new (...args: any[]) => {
+    findOutletLines(anchorName: string): import("@hatiolab/things-scene").Line[];
+    findOutletEnds(anchorName: string): Component[];
+    findInletLines(anchorName: string): import("@hatiolab/things-scene").Line[];
+    findInletEnds(anchorName: string): Component[];
+}) & typeof Shape;
+export default class Rect extends Rect_base {
+    is3dish(): boolean;
+    buildRealObject(): RealObject | undefined;
+    get controls(): {
+        x: any;
+        y: any;
+        handler: {
+            ondragmove: (point: import("@hatiolab/things-scene").DIMENSION, index: number, component: Component) => void;
+        };
+    }[];
+    get nature(): ComponentNature;
+}
+export {};

package/dist/components/rect.js

@@ -0,0 +1,91 @@
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ */
+import * as THREE from 'three';
+import { Component, Connectable, RectPath, Shape } from '@hatiolab/things-scene';
+import RealObjectExtrude from '../threed/real-object-extrude';
+const NATURE = {
+    mutable: false,
+    resizable: true,
+    rotatable: true,
+    properties: [
+        {
+            type: 'number',
+            label: 'round',
+            name: 'round',
+            property: {
+                min: 0
+            }
+        }
+    ],
+    help: 'scene/component/rect'
+};
+var controlHandler = {
+    ondragmove: function (point, index, component) {
+        var { left, top, width, height } = component.model;
+        var transcoorded = component.transcoordP2S(point.x, point.y);
+        var round = ((transcoorded.x - left) / (width / 2)) * 100;
+        round = safeRound(round, width, height);
+        component.set({
+            round
+        });
+    }
+};
+function safeRound(round, width, height) {
+    var max = width > height ? (height / width) * 100 : 100;
+    if (round >= max)
+        round = max;
+    else if (round <= 0)
+        round = 0;
+    return round;
+}
+export class RectExtrude extends RealObjectExtrude {
+    get shape() {
+        var { width, height, round } = this.component.state;
+        var shape = new THREE.Shape();
+        if (round > 0) {
+            var radius = (round / 100) * (width / 2);
+            shape.moveTo(radius, 0);
+            shape.lineTo(width - radius, 0);
+            shape.quadraticCurveTo(width, 0, width, radius);
+            shape.lineTo(width, height - radius);
+            shape.quadraticCurveTo(width, height, width - radius, height);
+            shape.lineTo(radius, height);
+            shape.quadraticCurveTo(0, height, 0, height - radius);
+            shape.lineTo(0, radius);
+            shape.quadraticCurveTo(0, 0, radius, 0);
+        }
+        else {
+            shape.moveTo(0, 0);
+            shape.lineTo(width, 0);
+            shape.lineTo(width, height);
+            shape.lineTo(0, height);
+            shape.lineTo(0, 0);
+        }
+        return shape;
+    }
+}
+export default class Rect extends Connectable(RectPath(Shape)) {
+    is3dish() {
+        return true;
+    }
+    buildRealObject() {
+        return new RectExtrude(this);
+    }
+    get controls() {
+        var { left, top, width, round, height } = this.state;
+        round = round == undefined ? 0 : safeRound(round, width, height);
+        return [
+            {
+                x: left + (width / 2) * (round / 100),
+                y: top,
+                handler: controlHandler
+            }
+        ];
+    }
+    get nature() {
+        return NATURE;
+    }
+}
+Component.register('rect', Rect);
+//# sourceMappingURL=rect.js.map

package/dist/components/rect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rect.js","sourceRoot":"","sources":["../../src/components/rect.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\nimport { Component, ComponentNature, Connectable, POSITION, Properties, RectPath, Shape } from '@hatiolab/things-scene'\nimport RealObject from '../threed/real-object'\nimport RealObjectExtrude from '../threed/real-object-extrude'\n\nconst NATURE: ComponentNature = {\n  mutable: false,\n  resizable: true,\n  rotatable: true,\n  properties: [\n    {\n      type: 'number',\n      label: 'round',\n      name: 'round',\n      property: {\n        min: 0\n      }\n    }\n  ],\n  help: 'scene/component/rect'\n}\n\nvar controlHandler = {\n  ondragmove: function (point: POSITION, index: number, component: Component) {\n    var { left, top, width, height } = component.model\n\n    var transcoorded = component.transcoordP2S(point.x, point.y)\n    var round = ((transcoorded.x - left) / (width / 2)) * 100\n\n    round = safeRound(round, width, height)\n\n    component.set({\n      round\n    })\n  }\n}\n\nfunction safeRound(round: number, width: number, height: number) {\n  var max = width > height ? (height / width) * 100 : 100\n\n  if (round >= max) round = max\n  else if (round <= 0) round = 0\n\n  return round\n}\n\nexport class RectExtrude extends RealObjectExtrude {\n  get shape() {\n    var { width, height, round } = this.component.state\n    var shape = new THREE.Shape()\n\n    if (round > 0) {\n      var radius = (round / 100) * (width / 2)\n\n      shape.moveTo(radius, 0)\n      shape.lineTo(width - radius, 0)\n      shape.quadraticCurveTo(width, 0, width, radius)\n      shape.lineTo(width, height - radius)\n      shape.quadraticCurveTo(width, height, width - radius, height)\n      shape.lineTo(radius, height)\n      shape.quadraticCurveTo(0, height, 0, height - radius)\n      shape.lineTo(0, radius)\n      shape.quadraticCurveTo(0, 0, radius, 0)\n    } else {\n      shape.moveTo(0, 0)\n      shape.lineTo(width, 0)\n      shape.lineTo(width, height)\n      shape.lineTo(0, height)\n      shape.lineTo(0, 0)\n    }\n\n    return shape\n  }\n}\n\nexport default class Rect extends Connectable(RectPath(Shape)) {\n  is3dish() {\n    return true\n  }\n\n  buildRealObject(): RealObject | undefined {\n    return new RectExtrude(this)\n  }\n\n  get controls() {\n    var { left, top, width, round, height } = this.state\n    round = round == undefined ? 0 : safeRound(round, width, height)\n\n    return [\n      {\n        x: left + (width / 2) * (round / 100),\n        y: top,\n        handler: controlHandler\n      }\n    ]\n  }\n\n  get nature() {\n    return NATURE\n  }\n}\n\nComponent.register('rect', Rect)\n"]}

package/dist/components/retention/retention-manager.d.ts

@@ -0,0 +1,8 @@
+declare const _default: RetentionManager;
+export default _default;
+declare class RetentionManager {
+    add(component: any): void;
+    remove(component: any): void;
+    touch(): void;
+    get length(): number;
+}

package/dist/components/root-container.d.ts

@@ -0,0 +1,90 @@
+export default class RootContainer extends ContainerAbstract {
+    _maxRefid: number;
+    fitMode: any;
+    _app: any;
+    set target_element(arg: any);
+    get target_element(): any;
+    isRoot(): boolean;
+    get app(): any;
+    _ua_event_handler: Event.UAEventHandler | undefined;
+    _target_element: any;
+    /**
+     * Scene 모델의 단위(unit)을 감안한 기본 Scale 값을 제공한다.
+     * 통산 'mm', 'cm' 단위의 Scene은 각 값에 10배를 곱한 수치로 모델링된다.(값을 10으로 나눈값이 실제 단위와 일치한다.)
+     * unitScale의 의미는 scene에 unitScale값으로 scale하면, 각 단위값이 화면과 일치한다는 의미이다.
+     *
+     * 모델링의 수치단위가 픽셀이 아니고, mm, cm, inch 등의 단위인 경우에,
+     * 화면에서의 크기가 실물과 유사하게 보이는 수준의 기본 스케일을 제공하는 기능이다.
+     * 이 값은 내부적으로는, Ruler에서 눈금을 실제 자의 눈금과 일치시키기 위해서 사용한다.
+     */
+    get unitScale(): number;
+    addTemplate(prefix: any, component: any): void;
+    removeTemplate(prefix: any, component: any): void;
+    findTemplateFor(id: any): any;
+    templatePrefixes: string[] | undefined;
+    addIndex(id: any, component: any): void;
+    removeIndex(id: any, component: any): void;
+    addRefidIndex(refid: any, component: any): void;
+    removeRefidIndex(refid: any, component: any): void;
+    getNewRefid(): number;
+    subscribe(tag: any, component: any): Promise<void>;
+    unsubscribe(tag: any, component: any): Promise<void>;
+    findOrCreate(id: any): any;
+    resize(): void;
+    _disposeAllResources(): void;
+    set selected(arg: any);
+    get selected(): any;
+    _ready: boolean | undefined;
+    indexMap: {} | undefined;
+    refidIndexMap: Map<any, any> | undefined;
+    templateMap: {} | undefined;
+    rebuildContentModel(contentModel: any): void;
+    eventEngine: Event.Engine | undefined;
+    model_layer: any;
+    assist_layers: any;
+    assist_handlers: any;
+    get root(): RootContainer;
+    get anchors(): void;
+    /**
+     * 모델들이 다 생성되고 준비되었는지를 알려준다.
+     */
+    get isReady(): boolean | undefined;
+    get rootModel(): any;
+    get stuck(): boolean;
+    set data(arg: any);
+    get data(): any;
+    set dataByRefid(arg: {});
+    get dataByRefid(): {};
+    set values(arg: any);
+    get values(): any;
+    set valuesByRefid(arg: {});
+    get valuesByRefid(): {};
+    _selected: any;
+    set focused(arg: any);
+    get focused(): any;
+    set style(arg: any);
+    get style(): any;
+    _style: any;
+    _compiled_style: any;
+    render(): void;
+    contains(x: any, y: any): boolean;
+    invalidate(): void;
+    get eventMap(): {
+        '(root)': {
+            '(descendant)': {
+                added: (container: any, component: any) => void;
+                removed: (container: any, component: any) => void;
+                change: (after: any, before: any, hint: any) => void;
+            };
+        };
+    };
+    refreshMappings(): void;
+    _refresh_mapping_debouncer: import("lodash").DebouncedFunc<(comp: any) => void> | undefined;
+    _addTraverse(component: any): void;
+    _removeTraverse(component: any): void;
+    onadded(container: any, component: any): void;
+    onremoved(container: any, component: any): void;
+    onchanged(after: any, before: any, hint: any): void;
+}
+import ContainerAbstract from "./container-abstract";
+import * as Event from "../event";