@operato/process 1.1.1

package/dist/src/modeller/scene-viewer/scene-handler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scene-handler.js","sourceRoot":"","sources":["../../../../src/modeller/scene-viewer/scene-handler.ts"],"names":[],"mappings":";AAAA,OAAO,kBAAkB,CAAA;AAEzB,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE5C,MAAM,CAAC,OAAO,OAAO,YAAa,SAAQ,UAAU;IAOlD,MAAM;QACJ,OAAO,IAAI,CAAA,yCAAyC,CAAA;IACtD,CAAC;IAED,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAA;QAEzB,IAAI,KAAK,GAAQ;YACf,IAAI,EAAE,IAAI,CAAC,IAAI;SAChB,CAAA;QAED,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,KAAU,EAAE,QAAa,EAAE,EAAE;YAC/F,MAAM,IAAI,GAAG,QAAQ,CAAC,YAAY,CAAC,MAAM,CAAC,CAAA;YAC1C,MAAM,KAAK,GAAG,QAAQ,CAAC,YAAY,CAAC,OAAO,CAAC,CAAA;YAE5C,IAAI,IAAI,EAAE;gBACR,KAAK,CAAC,IAAI,CAAC,GAAG,KAAK,CAAA;aACpB;YAED,OAAO,KAAK,CAAA;QACd,CAAC,EAAE,KAAK,CAAC,CAAA;QAET,KAAK,CAAC,QAAQ,GAAG,IAAI,CAAA;QAErB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAA;IACpB,CAAC;CACF;AAhC6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAc;AACb;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CAG1B","sourcesContent":["import './scene-property'\n\nimport { LitElement, html } from 'lit'\nimport { property } from 'lit/decorators.js'\n\nexport default class SceneHandler extends LitElement {\n  @property({ type: String }) type!: string\n  @property({ type: Object }) model!: {\n    type: Object\n    notify: true\n  }\n\n  render() {\n    return html` <slot select=\"scene-property\"></slot> `\n  }\n\n  connectedCallback() {\n    super.connectedCallback()\n\n    let model: any = {\n      type: this.type\n    }\n\n    model = Array.from(this.querySelectorAll('scene-property')).reduce((model: any, property: any) => {\n      const name = property.getAttribute('name')\n      const value = property.getAttribute('value')\n\n      if (name) {\n        model[name] = value\n      }\n\n      return model\n    }, model)\n\n    model.__host__ = this\n\n    this.model = model\n  }\n}\n"]}

package/dist/src/modeller/scene-viewer/scene-layer.d.ts

@@ -0,0 +1,10 @@
+import './scene-property';
+import { LitElement } from 'lit';
+export default class SceneLayer extends LitElement {
+    type?: String;
+    text?: String;
+    render(): import("lit-html").TemplateResult<1>;
+    getModel(): {
+        type: String | undefined;
+    };
+}

package/dist/src/modeller/scene-viewer/scene-layer.js

@@ -0,0 +1,38 @@
+import { __decorate } from "tslib";
+import './scene-property';
+import { LitElement, html } from 'lit';
+import { property } from 'lit/decorators.js';
+export default class SceneLayer extends LitElement {
+    render() {
+        return html ` <slot select="scene-property"></slot> `;
+    }
+    getModel() {
+        let model = {
+            type: this.type
+        };
+        model = Array.from(this.querySelectorAll('scene-property')).reduce((model, property) => {
+            let value = property.value;
+            if (property.name) {
+                switch (property.type) {
+                    case 'number':
+                        value = Number(value);
+                        break;
+                    case 'boolean':
+                        value = Boolean(value);
+                        break;
+                    default:
+                }
+                model[property.name] = value;
+            }
+            return model;
+        }, model);
+        return model;
+    }
+}
+__decorate([
+    property({ type: String })
+], SceneLayer.prototype, "type", void 0);
+__decorate([
+    property({ type: String })
+], SceneLayer.prototype, "text", void 0);
+//# sourceMappingURL=scene-layer.js.map

package/dist/src/modeller/scene-viewer/scene-layer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scene-layer.js","sourceRoot":"","sources":["../../../../src/modeller/scene-viewer/scene-layer.ts"],"names":[],"mappings":";AAAA,OAAO,kBAAkB,CAAA;AAEzB,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AACtC,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE5C,MAAM,CAAC,OAAO,OAAO,UAAW,SAAQ,UAAU;IAIhD,MAAM;QACJ,OAAO,IAAI,CAAA,yCAAyC,CAAA;IACtD,CAAC;IAED,QAAQ;QACN,IAAI,KAAK,GAAG;YACV,IAAI,EAAE,IAAI,CAAC,IAAI;SAChB,CAAA;QAED,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,gBAAgB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,KAAU,EAAE,QAAa,EAAE,EAAE;YAC/F,IAAI,KAAK,GAAQ,QAAQ,CAAC,KAAK,CAAA;YAE/B,IAAI,QAAQ,CAAC,IAAI,EAAE;gBACjB,QAAQ,QAAQ,CAAC,IAAI,EAAE;oBACrB,KAAK,QAAQ;wBACX,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA;wBACrB,MAAK;oBACP,KAAK,SAAS;wBACZ,KAAK,GAAG,OAAO,CAAC,KAAK,CAAC,CAAA;wBACtB,MAAK;oBACP,QAAQ;iBACT;gBAED,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,KAAK,CAAA;aAC7B;YAED,OAAO,KAAK,CAAA;QACd,CAAC,EAAE,KAAK,CAAC,CAAA;QAET,OAAO,KAAK,CAAA;IACd,CAAC;CACF;AAlC6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAAc;AACb;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAAc","sourcesContent":["import './scene-property'\n\nimport { LitElement, html } from 'lit'\nimport { property } from 'lit/decorators.js'\n\nexport default class SceneLayer extends LitElement {\n  @property({ type: String }) type?: String\n  @property({ type: String }) text?: String\n\n  render() {\n    return html` <slot select=\"scene-property\"></slot> `\n  }\n\n  getModel() {\n    let model = {\n      type: this.type\n    }\n\n    model = Array.from(this.querySelectorAll('scene-property')).reduce((model: any, property: any) => {\n      let value: any = property.value\n\n      if (property.name) {\n        switch (property.type) {\n          case 'number':\n            value = Number(value)\n            break\n          case 'boolean':\n            value = Boolean(value)\n            break\n          default:\n        }\n\n        model[property.name] = value\n      }\n\n      return model\n    }, model)\n\n    return model\n  }\n}\n"]}

package/dist/src/modeller/scene-viewer/scene-property.d.ts

@@ -0,0 +1,6 @@
+import { LitElement } from 'lit';
+export default class OxSceneProperty extends LitElement {
+    name: string;
+    value: string;
+    type: string;
+}

package/dist/src/modeller/scene-viewer/scene-property.js

@@ -0,0 +1,15 @@
+import { __decorate } from "tslib";
+import { property } from 'lit/decorators.js';
+import { LitElement } from 'lit';
+export default class OxSceneProperty extends LitElement {
+}
+__decorate([
+    property({ type: String })
+], OxSceneProperty.prototype, "name", void 0);
+__decorate([
+    property({ type: String })
+], OxSceneProperty.prototype, "value", void 0);
+__decorate([
+    property({ type: String })
+], OxSceneProperty.prototype, "type", void 0);
+//# sourceMappingURL=scene-property.js.map

package/dist/src/modeller/scene-viewer/scene-property.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scene-property.js","sourceRoot":"","sources":["../../../../src/modeller/scene-viewer/scene-property.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE5C,OAAO,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAEhC,MAAM,CAAC,OAAO,OAAO,eAAgB,SAAQ,UAAU;CAItD;AAH6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAc;AACb;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAc","sourcesContent":["import { property } from 'lit/decorators.js'\n\nimport { LitElement } from 'lit'\n\nexport default class OxSceneProperty extends LitElement {\n  @property({ type: String }) name!: string\n  @property({ type: String }) value!: string\n  @property({ type: String }) type!: string\n}\n"]}

package/dist/src/modeller/scene-viewer/scene-viewer.d.ts

@@ -0,0 +1,38 @@
+import './scene-layer';
+import './scene-handler';
+import { LitElement, PropertyValues } from 'lit';
+import { Component, FITMODE, Model, Properties, Scene, SCENE_MODE } from '@hatiolab/things-scene';
+export default class SceneViewer extends LitElement {
+    static styles: import("lit").CSSResult;
+    scene: Scene | null;
+    model?: Model;
+    mode: SCENE_MODE;
+    screenSize: number;
+    variables: Properties;
+    data: any;
+    fit: FITMODE;
+    selected: Component[];
+    disposeWhenDetached: boolean;
+    baseUrl: string;
+    provider: any;
+    name: string;
+    enableInspector: boolean;
+    showInspector: boolean;
+    private lastOffsetWidth?;
+    disconnectedCallback(): void;
+    render(): import("lit-html").TemplateResult<1>;
+    updated(change: PropertyValues<this>): void;
+    _setScene(scene: Scene | null): void;
+    _setMode(mode: SCENE_MODE): void;
+    _setVariables(variables: Properties): void;
+    _setSelected(selected: Component[]): void;
+    _disposeScene(): void;
+    resize(force: boolean): void;
+    _onModelChanged(model?: Model): void;
+    _onDisplayChanged(screenSize: string | number): void;
+    _onModeChanged(mode: SCENE_MODE): void;
+    _onDataChanged(data: any): void;
+    _onSelectedChanged(after: Component[]): void;
+    _onSceneModeChanged(after: SCENE_MODE): void;
+    _onBaseUrlChanged(after: string): void;
+}

package/dist/src/modeller/scene-viewer/scene-viewer.js

@@ -0,0 +1,243 @@
+import { __decorate } from "tslib";
+import './scene-layer';
+import './scene-handler';
+import { css, html, LitElement } from 'lit';
+import { property } from 'lit/decorators.js';
+import { create as createScene, SCENE_MODE } from '@hatiolab/things-scene';
+export default class SceneViewer extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.scene = null;
+        /* Scene Mode - mode 0 : view mode, mode 1 : edit mode, mode 2 : shift mode */
+        this.mode = SCENE_MODE.VIEW;
+        this.screenSize = 13.3;
+        this.variables = {};
+        /*
+         * 캔바스에 모델을 어떻게 적절하게 보여줄 것인지를 설정한다.
+         *
+         * @none 가로, 세로 스케일을 1로 고정하고, {0, 0}좌표로 translate시킨다.
+         * @both 캔바스에 모델을 꼭 채우도록 가로, 세로 스케일을 조정하고, {0, 0}좌표로 translate시킨다.
+         * @width 캔바스의 폭에 모델의 폭을 일치하도록 가로, 세로 스케일을 동일하게 조정하고, {0, 0}좌표로 translate시킨다.
+         * @height 캔바스의 높이에 모델의 높이를 일치하도록 가로, 세로 스케일을 동일하게 조정하고, {0, 0}좌표로 translate시킨다.
+         * @center 가로, 세로 스케일을 1로 고정하고 모델이 화면의 중앙에 위치하도록 translate시킨다.
+         * @ratio 모델의 모든 부분이 캔바스에 최대 크기로 표현될 수 있도록 가로, 세로 동일한 스케일로 조정하고, {0, 0}좌표로 translate시킨다.
+         */
+        this.fit = 'none';
+        this.selected = [];
+        this.disposeWhenDetached = false;
+        this.baseUrl = '';
+        this.name = 'noname';
+        this.enableInspector = true;
+        this.showInspector = false;
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        if (this.scene && this.disposeWhenDetached) {
+            this._disposeScene();
+        }
+    }
+    render() {
+        return html ` <slot></slot> `;
+    }
+    updated(change) {
+        change.has('model') && this._onModelChanged(this.model);
+        change.has('mode') && this._onModeChanged(this.mode);
+        change.has('screenSize') && this._onDisplayChanged(this.screenSize);
+        change.has('data') && this._onDataChanged(this.data);
+        change.has('baseUrl') && this._onBaseUrlChanged(this.baseUrl);
+    }
+    _setScene(scene) {
+        this.scene = scene;
+        this.dispatchEvent(new CustomEvent('scene-changed', {
+            bubbles: true,
+            composed: true,
+            detail: { value: scene }
+        }));
+    }
+    _setMode(mode) {
+        this.mode = mode;
+        this.dispatchEvent(new CustomEvent('mode-changed', {
+            bubbles: true,
+            composed: true,
+            detail: { value: mode }
+        }));
+    }
+    _setVariables(variables) {
+        this.variables = variables;
+        this.dispatchEvent(new CustomEvent('variables-changed', {
+            bubbles: true,
+            composed: true,
+            detail: { value: variables }
+        }));
+    }
+    _setSelected(selected) {
+        this.selected = selected;
+        this.dispatchEvent(new CustomEvent('selected-changed', {
+            bubbles: true,
+            composed: true,
+            detail: { value: selected }
+        }));
+    }
+    _disposeScene() {
+        if (this.scene) {
+            this.scene.off('selected', this._onSelectedChanged, this);
+            this.scene.off('mode', this._onSceneModeChanged, this);
+            if (this.provider) {
+                this.scene.release && this.scene.release();
+            }
+            else {
+                this.scene.dispose();
+            }
+            this._setScene(null);
+            this._setSelected([]);
+        }
+    }
+    resize(force) {
+        if (typeof this.scene == 'object') {
+            if (force || this.fit === 'both' || Math.abs(this.offsetWidth - (this.lastOffsetWidth || 0)) >= 1) {
+                requestAnimationFrame(() => {
+                    if (this.scene) {
+                        this.scene.resize();
+                        this.scene.fit(this.fit);
+                    }
+                });
+            }
+            this.lastOffsetWidth = this.offsetWidth;
+        }
+    }
+    _onModelChanged(model) {
+        this._disposeScene();
+        if (!model) {
+            return;
+        }
+        const layers = Array.from(this.querySelectorAll('scene-layer')).map(layer => layer.getModel());
+        const handlers = Array.from(this.querySelectorAll('scene-handler')).map(handler => handler.getAttribute('type'));
+        this._setScene(createScene({
+            target: this,
+            model: JSON.parse(JSON.stringify(model)),
+            layers,
+            handlers,
+            mode: this.mode,
+            refProvider: this.provider
+        }));
+        if (this.provider) {
+            this.provider.add(this.name, this.scene);
+        }
+        this.scene.screen = this.screenSize;
+        /* 이 컴포넌트의 폭이 값을 가지고 있으면 - 화면상에 자리를 잡고 보여지고 있음을 의미한다.
+         * 이 때는 정상적으로 그려주고,
+         * 그렇지 않으면, 다음 Resize Handling시에 처리하도록 한다.
+         */
+        this.resize(true);
+        this._setVariables(model.variables || this.scene.variables);
+        this.scene.on('selected', this._onSelectedChanged, this);
+        this.scene.on('mode', this._onSceneModeChanged, this);
+        this._onModeChanged(this.mode);
+        this._onDisplayChanged(this.screenSize);
+        this._onBaseUrlChanged(this.baseUrl);
+    }
+    _onDisplayChanged(screenSize) {
+        if (!this.scene) {
+            return;
+        }
+        if (screenSize) {
+            this.scene.screen = parseFloat(String(screenSize));
+        }
+    }
+    _onModeChanged(mode) {
+        if (!this.scene) {
+            return;
+        }
+        this.scene.mode = Number(mode);
+    }
+    _onDataChanged(data) {
+        if (!this.scene || !data) {
+            return;
+        }
+        this.scene.data = data;
+    }
+    _onSelectedChanged(after) {
+        /*
+         scene 컴포넌트의 속성을 속성 에디터(input box등)에서 변경하다가,
+         scene의 다른 컴포넌트를 클릭해서 포커스(선택) 컴포넌트를 변경하게되면,
+         속성 에디터(input box등)의 value change 이벤트의 처리와 충돌(레이스)하게된다.
+         
+         기대하는 순서는 먼저 속성 에디터의 value change 이벤트를 처리한 후에,
+         selected 이벤트를 처리할 수 있도록 requestAnimationFrame으로 한 프레임을 지연하도록 하였다.
+         */
+        requestAnimationFrame(() => {
+            this._setSelected(after);
+        });
+    }
+    _onSceneModeChanged(after) {
+        if (!this.scene) {
+            return;
+        }
+        if (this.mode !== after) {
+            this._setMode(after);
+        }
+        if (after === 2) {
+            this.style.cursor = 'all-scroll';
+        }
+        else if (after === 3) {
+            this.style.cursor = 'crosshair';
+        }
+        else {
+            this.style.cursor = 'default';
+        }
+    }
+    _onBaseUrlChanged(after) {
+        if (!this.scene) {
+            return;
+        }
+        this.scene.baseUrl = after;
+    }
+}
+SceneViewer.styles = css `
+    :host {
+      outline: none;
+    }
+  `;
+__decorate([
+    property({ type: Object })
+], SceneViewer.prototype, "scene", void 0);
+__decorate([
+    property({ type: Object })
+], SceneViewer.prototype, "model", void 0);
+__decorate([
+    property({ type: Number })
+], SceneViewer.prototype, "mode", void 0);
+__decorate([
+    property({ type: Number })
+], SceneViewer.prototype, "screenSize", void 0);
+__decorate([
+    property({ type: Object })
+], SceneViewer.prototype, "variables", void 0);
+__decorate([
+    property({ type: Object })
+], SceneViewer.prototype, "data", void 0);
+__decorate([
+    property({ type: String })
+], SceneViewer.prototype, "fit", void 0);
+__decorate([
+    property({ type: Array })
+], SceneViewer.prototype, "selected", void 0);
+__decorate([
+    property({ type: Boolean })
+], SceneViewer.prototype, "disposeWhenDetached", void 0);
+__decorate([
+    property({ type: String })
+], SceneViewer.prototype, "baseUrl", void 0);
+__decorate([
+    property({ type: Object })
+], SceneViewer.prototype, "provider", void 0);
+__decorate([
+    property({ type: String })
+], SceneViewer.prototype, "name", void 0);
+__decorate([
+    property({ type: Boolean })
+], SceneViewer.prototype, "enableInspector", void 0);
+__decorate([
+    property({ type: Boolean })
+], SceneViewer.prototype, "showInspector", void 0);
+//# sourceMappingURL=scene-viewer.js.map

package/dist/src/modeller/scene-viewer/scene-viewer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scene-viewer.js","sourceRoot":"","sources":["../../../../src/modeller/scene-viewer/scene-viewer.ts"],"names":[],"mappings":"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","sourcesContent":["import './scene-layer'\nimport './scene-handler'\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { property } from 'lit/decorators.js'\n\nimport { Component, create as createScene, FITMODE, Model, Properties, Scene, SCENE_MODE } from '@hatiolab/things-scene'\n\nimport SceneLayer from './scene-layer'\n\nexport default class SceneViewer extends LitElement {\n  static styles = css`\n    :host {\n      outline: none;\n    }\n  `\n\n  @property({ type: Object }) scene: Scene | null = null\n  @property({ type: Object }) model?: Model\n  /* Scene Mode - mode 0 : view mode, mode 1 : edit mode, mode 2 : shift mode */\n  @property({ type: Number }) mode: SCENE_MODE = SCENE_MODE.VIEW\n  @property({ type: Number }) screenSize: number = 13.3\n  @property({ type: Object }) variables: Properties = {}\n  @property({ type: Object }) data: any\n  /*\n   * 캔바스에 모델을 어떻게 적절하게 보여줄 것인지를 설정한다.\n   *\n   * @none 가로, 세로 스케일을 1로 고정하고, {0, 0}좌표로 translate시킨다.\n   * @both 캔바스에 모델을 꼭 채우도록 가로, 세로 스케일을 조정하고, {0, 0}좌표로 translate시킨다.\n   * @width 캔바스의 폭에 모델의 폭을 일치하도록 가로, 세로 스케일을 동일하게 조정하고, {0, 0}좌표로 translate시킨다.\n   * @height 캔바스의 높이에 모델의 높이를 일치하도록 가로, 세로 스케일을 동일하게 조정하고, {0, 0}좌표로 translate시킨다.\n   * @center 가로, 세로 스케일을 1로 고정하고 모델이 화면의 중앙에 위치하도록 translate시킨다.\n   * @ratio 모델의 모든 부분이 캔바스에 최대 크기로 표현될 수 있도록 가로, 세로 동일한 스케일로 조정하고, {0, 0}좌표로 translate시킨다.\n   */\n  @property({ type: String }) fit: FITMODE = 'none'\n  @property({ type: Array }) selected: Component[] = []\n  @property({ type: Boolean }) disposeWhenDetached: boolean = false\n  @property({ type: String }) baseUrl: string = ''\n  @property({ type: Object }) provider: any\n  @property({ type: String }) name: string = 'noname'\n  @property({ type: Boolean }) enableInspector: boolean = true\n  @property({ type: Boolean }) showInspector: boolean = false\n\n  private lastOffsetWidth?: number\n\n  disconnectedCallback() {\n    super.disconnectedCallback()\n\n    if (this.scene && this.disposeWhenDetached) {\n      this._disposeScene()\n    }\n  }\n\n  render() {\n    return html` <slot></slot> `\n  }\n\n  updated(change: PropertyValues<this>) {\n    change.has('model') && this._onModelChanged(this.model)\n    change.has('mode') && this._onModeChanged(this.mode)\n    change.has('screenSize') && this._onDisplayChanged(this.screenSize)\n    change.has('data') && this._onDataChanged(this.data)\n    change.has('baseUrl') && this._onBaseUrlChanged(this.baseUrl)\n  }\n\n  _setScene(scene: Scene | null) {\n    this.scene = scene\n    this.dispatchEvent(\n      new CustomEvent('scene-changed', {\n        bubbles: true,\n        composed: true,\n        detail: { value: scene }\n      })\n    )\n  }\n\n  _setMode(mode: SCENE_MODE) {\n    this.mode = mode\n    this.dispatchEvent(\n      new CustomEvent('mode-changed', {\n        bubbles: true,\n        composed: true,\n        detail: { value: mode }\n      })\n    )\n  }\n\n  _setVariables(variables: Properties) {\n    this.variables = variables\n    this.dispatchEvent(\n      new CustomEvent('variables-changed', {\n        bubbles: true,\n        composed: true,\n        detail: { value: variables }\n      })\n    )\n  }\n\n  _setSelected(selected: Component[]) {\n    this.selected = selected\n    this.dispatchEvent(\n      new CustomEvent('selected-changed', {\n        bubbles: true,\n        composed: true,\n        detail: { value: selected }\n      })\n    )\n  }\n\n  _disposeScene() {\n    if (this.scene) {\n      this.scene.off('selected', this._onSelectedChanged, this)\n      this.scene.off('mode', this._onSceneModeChanged, this)\n\n      if (this.provider) {\n        this.scene.release && this.scene.release()\n      } else {\n        this.scene.dispose()\n      }\n\n      this._setScene(null)\n      this._setSelected([])\n    }\n  }\n\n  resize(force: boolean) {\n    if (typeof this.scene == 'object') {\n      if (force || this.fit === 'both' || Math.abs(this.offsetWidth - (this.lastOffsetWidth || 0)) >= 1) {\n        requestAnimationFrame(() => {\n          if (this.scene) {\n            this.scene.resize()\n            this.scene.fit(this.fit)\n          }\n        })\n      }\n\n      this.lastOffsetWidth = this.offsetWidth\n    }\n  }\n\n  _onModelChanged(model?: Model) {\n    this._disposeScene()\n\n    if (!model) {\n      return\n    }\n\n    const layers = Array.from(this.querySelectorAll('scene-layer')).map(layer => (layer as SceneLayer).getModel())\n\n    const handlers = Array.from(this.querySelectorAll('scene-handler')).map(handler => handler.getAttribute('type'))\n\n    this._setScene(\n      createScene({\n        target: this,\n        model: JSON.parse(JSON.stringify(model)),\n        layers,\n        handlers,\n        mode: this.mode,\n        refProvider: this.provider\n      })\n    )\n\n    if (this.provider) {\n      this.provider.add(this.name, this.scene)\n    }\n\n    this.scene!.screen = this.screenSize\n\n    /* 이 컴포넌트의 폭이 값을 가지고 있으면 - 화면상에 자리를 잡고 보여지고 있음을 의미한다.\n     * 이 때는 정상적으로 그려주고,\n     * 그렇지 않으면, 다음 Resize Handling시에 처리하도록 한다.\n     */\n    this.resize(true)\n\n    this._setVariables(model.variables || this.scene!.variables)\n\n    this.scene!.on('selected', this._onSelectedChanged, this)\n    this.scene!.on('mode', this._onSceneModeChanged, this)\n\n    this._onModeChanged(this.mode)\n    this._onDisplayChanged(this.screenSize)\n    this._onBaseUrlChanged(this.baseUrl)\n  }\n\n  _onDisplayChanged(screenSize: string | number) {\n    if (!this.scene) {\n      return\n    }\n\n    if (screenSize) {\n      this.scene.screen = parseFloat(String(screenSize))\n    }\n  }\n\n  _onModeChanged(mode: SCENE_MODE) {\n    if (!this.scene) {\n      return\n    }\n    this.scene.mode = Number(mode)\n  }\n\n  _onDataChanged(data: any) {\n    if (!this.scene || !data) {\n      return\n    }\n\n    this.scene.data = data\n  }\n\n  _onSelectedChanged(after: Component[]) {\n    /*\n     scene 컴포넌트의 속성을 속성 에디터(input box등)에서 변경하다가,\n     scene의 다른 컴포넌트를 클릭해서 포커스(선택) 컴포넌트를 변경하게되면,\n     속성 에디터(input box등)의 value change 이벤트의 처리와 충돌(레이스)하게된다.\n     \n     기대하는 순서는 먼저 속성 에디터의 value change 이벤트를 처리한 후에,\n     selected 이벤트를 처리할 수 있도록 requestAnimationFrame으로 한 프레임을 지연하도록 하였다.\n     */\n    requestAnimationFrame(() => {\n      this._setSelected(after)\n    })\n  }\n\n  _onSceneModeChanged(after: SCENE_MODE) {\n    if (!this.scene) {\n      return\n    }\n\n    if (this.mode !== after) {\n      this._setMode(after)\n    }\n\n    if (after === 2) {\n      this.style.cursor = 'all-scroll'\n    } else if (after === 3) {\n      this.style.cursor = 'crosshair'\n    } else {\n      this.style.cursor = 'default'\n    }\n  }\n\n  _onBaseUrlChanged(after: string) {\n    if (!this.scene) {\n      return\n    }\n\n    this.scene.baseUrl = after\n  }\n}\n"]}

package/dist/src/ox-process-list.d.ts

@@ -0,0 +1,2 @@
+import '@operato/popup/ox-popup.js';
+import '@operato/data-grist';