@operato/scene-table 0.0.17

package/@types/global/index.d.ts

@@ -0,0 +1 @@
+declare module '*.png'

package/CHANGELOG.md

@@ -0,0 +1,16 @@
+# Change Log
+
+All notable changes to this project will be documented in this file.
+See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+### [0.0.17](https://github.com/things-scene/operato-scene/compare/v0.0.16...v0.0.17) (2021-12-11)
+
+
+### :rocket: New Features
+
+* add @operato/scene-table ([f8a6748](https://github.com/things-scene/operato-scene/commit/f8a6748e23c0195d40c788a92b4e5f9b795d49f4))
+
+
+### :bug: Bug Fix
+
+* upgrade operato to 0.2.45 ([0032bad](https://github.com/things-scene/operato-scene/commit/0032bad0914e7fd7eae5e8cc1574df20ce7cb851))

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2021 Hearty, Oh
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,33 @@
+# things-scene-table
+
+## node package를 설치한다.
+
+`$ yarn`
+
+## 실행
+
+`$ yarn serve`
+`$ yarn serve:dev`
+
+## 포트를 바꾸려면, -p 3001 식으로 추가해준다.
+
+`$ yarn serve`
+`$ yarn serve -p 3001`
+
+## test in browser
+
+http://localhost:3000
+
+## build
+
+`$ yarn build`
+
+| type | filename                 | for            | tested |
+| ---- | ------------------------ | -------------- | ------ |
+| UMD  | things-scene-table.js    | modern browser | 0      |
+| UMD  | things-scene-table-ie.js | ie 11          | 0      |
+| ESM  | things-scene-table.mjs   | modern browser | 0      |
+
+## publish
+
+`$ yarn publish`

package/dist/data-list/data-cell.d.ts

@@ -0,0 +1,22 @@
+import { Component, Style } from '@hatiolab/things-scene';
+declare const DataCell_base: typeof Component;
+export default class DataCell extends DataCell_base {
+    get nature(): {
+        mutable: boolean;
+        resizable: boolean;
+        rotatable: boolean;
+        properties: {
+            type: string;
+            label: string;
+            name: string;
+            property: {
+                merge: boolean;
+                split: boolean;
+            };
+        }[];
+        help: string;
+    };
+    _drawBorder(context: CanvasRenderingContext2D, x: number, y: number, to_x: number, to_y: number, style: Style): void;
+    _draw(context: CanvasRenderingContext2D): void;
+}
+export {};

package/dist/data-list/data-cell.js

@@ -0,0 +1,56 @@
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ */
+import { Component, RectPath } from '@hatiolab/things-scene';
+const NATURE = {
+    mutable: false,
+    resizable: true,
+    rotatable: true,
+    properties: [
+        {
+            type: 'editor-table',
+            label: '',
+            name: '',
+            property: {
+                merge: false,
+                split: false
+            }
+        }
+    ],
+    help: 'scene/component/data-cell'
+};
+export default class DataCell extends RectPath(Component) {
+    get nature() {
+        return NATURE;
+    }
+    _drawBorder(context, x, y, to_x, to_y, style) {
+        if (style && style.strokeStyle && style.lineWidth && style.lineDash) {
+            context.beginPath();
+            context.moveTo(x, y);
+            context.lineTo(to_x, to_y);
+            Component.drawStroke(context, style);
+        }
+    }
+    _draw(context) {
+        var { left, top, width, height } = this.bounds;
+        var border = this.model.border || {};
+        // Cell 채우기.
+        context.beginPath();
+        context.lineWidth = 0;
+        context.rect(left, top, width, height);
+        this.drawFill(context);
+        // Border 그리기
+        var parent = this.parent;
+        var idx = parent.components.indexOf(this);
+        var columns = parent.columns || 1;
+        this._drawBorder(context, left, top, left + width, top, border.top);
+        this._drawBorder(context, left, top + height, left, top, border.left);
+        if ((idx + 1) % columns == 0) {
+            /* if this filed is right most, draw right side border. */
+            this._drawBorder(context, left + width, top, left + width, top + height, border.right);
+        }
+        this._drawBorder(context, left + width, top + height, left, top + height, border.bottom);
+    }
+}
+Component.register('data-cell', DataCell);
+//# sourceMappingURL=data-cell.js.map

package/dist/data-list/data-cell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-cell.js","sourceRoot":"","sources":["../../src/data-list/data-cell.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAS,MAAM,wBAAwB,CAAA;AAInE,MAAM,MAAM,GAAG;IACb,OAAO,EAAE,KAAK;IACd,SAAS,EAAE,IAAI;IACf,SAAS,EAAE,IAAI;IACf,UAAU,EAAE;QACV;YACE,IAAI,EAAE,cAAc;YACpB,KAAK,EAAE,EAAE;YACT,IAAI,EAAE,EAAE;YACR,QAAQ,EAAE;gBACR,KAAK,EAAE,KAAK;gBACZ,KAAK,EAAE,KAAK;aACb;SACF;KACF;IACD,IAAI,EAAE,2BAA2B;CAClC,CAAA;AAED,MAAM,CAAC,OAAO,OAAO,QAAS,SAAQ,QAAQ,CAAC,SAAS,CAAC;IACvD,IAAI,MAAM;QACR,OAAO,MAAM,CAAA;IACf,CAAC;IAED,WAAW,CAAC,OAAiC,EAAE,CAAS,EAAE,CAAS,EAAE,IAAY,EAAE,IAAY,EAAE,KAAY;QAC3G,IAAI,KAAK,IAAI,KAAK,CAAC,WAAW,IAAI,KAAK,CAAC,SAAS,IAAI,KAAK,CAAC,QAAQ,EAAE;YACnE,OAAO,CAAC,SAAS,EAAE,CAAA;YACnB,OAAO,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA;YACpB,OAAO,CAAC,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,CAAA;YAC1B,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,KAAK,CAAC,CAAA;SACrC;IACH,CAAC;IAED,KAAK,CAAC,OAAiC;QACrC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC,MAAM,CAAA;QAE9C,IAAI,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,IAAI,EAAE,CAAA;QAEpC,YAAY;QACZ,OAAO,CAAC,SAAS,EAAE,CAAA;QACnB,OAAO,CAAC,SAAS,GAAG,CAAC,CAAA;QACrB,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,CAAC,CAAA;QACtC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAA;QAEtB,aAAa;QACb,IAAI,MAAM,GAAG,IAAI,CAAC,MAAe,CAAA;QACjC,IAAI,GAAG,GAAG,MAAM,CAAC,UAAU,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;QACzC,IAAI,OAAO,GAAG,MAAM,CAAC,OAAO,IAAI,CAAC,CAAA;QAEjC,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,GAAG,KAAK,EAAE,GAAG,EAAE,MAAM,CAAC,GAAG,CAAC,CAAA;QACnE,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE,IAAI,EAAE,GAAG,GAAG,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,CAAC,IAAI,CAAC,CAAA;QACrE,IAAI,CAAC,GAAG,GAAG,CAAC,CAAC,GAAG,OAAO,IAAI,CAAC,EAAE;YAC5B,0DAA0D;YAC1D,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE,IAAI,GAAG,KAAK,EAAE,GAAG,EAAE,IAAI,GAAG,KAAK,EAAE,GAAG,GAAG,MAAM,EAAE,MAAM,CAAC,KAAK,CAAC,CAAA;SACvF;QACD,IAAI,CAAC,WAAW,CAAC,OAAO,EAAE,IAAI,GAAG,KAAK,EAAE,GAAG,GAAG,MAAM,EAAE,IAAI,EAAE,GAAG,GAAG,MAAM,EAAE,MAAM,CAAC,MAAM,CAAC,CAAA;IAC1F,CAAC;CACF;AAED,SAAS,CAAC,QAAQ,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAA","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\nimport { Component, RectPath, Style } from '@hatiolab/things-scene'\n\nimport { Table } from '..'\n\nconst NATURE = {\n  mutable: false,\n  resizable: true,\n  rotatable: true,\n  properties: [\n    {\n      type: 'editor-table',\n      label: '',\n      name: '',\n      property: {\n        merge: false,\n        split: false\n      }\n    }\n  ],\n  help: 'scene/component/data-cell'\n}\n\nexport default class DataCell extends RectPath(Component) {\n  get nature() {\n    return NATURE\n  }\n\n  _drawBorder(context: CanvasRenderingContext2D, x: number, y: number, to_x: number, to_y: number, style: Style) {\n    if (style && style.strokeStyle && style.lineWidth && style.lineDash) {\n      context.beginPath()\n      context.moveTo(x, y)\n      context.lineTo(to_x, to_y)\n      Component.drawStroke(context, style)\n    }\n  }\n\n  _draw(context: CanvasRenderingContext2D) {\n    var { left, top, width, height } = this.bounds\n\n    var border = this.model.border || {}\n\n    // Cell 채우기.\n    context.beginPath()\n    context.lineWidth = 0\n    context.rect(left, top, width, height)\n    this.drawFill(context)\n\n    // Border 그리기\n    var parent = this.parent as Table\n    var idx = parent.components.indexOf(this)\n    var columns = parent.columns || 1\n\n    this._drawBorder(context, left, top, left + width, top, border.top)\n    this._drawBorder(context, left, top + height, left, top, border.left)\n    if ((idx + 1) % columns == 0) {\n      /* if this filed is right most, draw right side border. */\n      this._drawBorder(context, left + width, top, left + width, top + height, border.right)\n    }\n    this._drawBorder(context, left + width, top + height, left, top + height, border.bottom)\n  }\n}\n\nComponent.register('data-cell', DataCell)\n"]}

package/dist/data-list/data-list-layout.d.ts

@@ -0,0 +1,10 @@
+import { Component, Container } from '@hatiolab/things-scene';
+declare var DataListLayout: {
+    reflow: (container: Container) => void;
+    capturables: (container: Container) => Component[];
+    drawables: (container: Container) => Component[];
+    isStuck: (component: Component) => boolean;
+    keyNavigate: (container: Container, component: Component, e: KeyboardEvent) => Component | undefined;
+    joinType: boolean;
+};
+export default DataListLayout;

package/dist/data-list/data-list-layout.js

@@ -0,0 +1,95 @@
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ */
+import { Layout } from '@hatiolab/things-scene';
+var DataListLayout = {
+    reflow: function (container) {
+        var layoutConfig = container.get('layoutConfig');
+        var columns = (layoutConfig && layoutConfig.columns) || container.get('columns');
+        var rows = (layoutConfig && layoutConfig.rows) || container.get('rows');
+        var widths = (layoutConfig && layoutConfig.widths) || container.get('widths');
+        var heights = (layoutConfig && layoutConfig.heights) || container.get('heights');
+        var { offset = { x: 0, y: 0 } } = container.state;
+        var widths_sum = widths ? widths.filter((width, i) => i < columns).reduce((sum, width) => sum + width, 0) : columns;
+        var heights_sum = heights ? heights.filter((height, i) => i < rows).reduce((sum, height) => sum + height, 0) : rows;
+        var inside = container.textBounds;
+        var paddingLeft = container.get('paddingLeft') || 0;
+        var paddingTop = container.get('paddingTop') || 0;
+        var width_unit = inside.width / widths_sum;
+        var height_unit = inside.height / heights_sum;
+        var x = offset.x;
+        var y = offset.y;
+        var components = container.components;
+        components.forEach((component, idx) => {
+            let w = widths ? widths[idx % columns] : 1;
+            let h = heights ? heights[0] : 1;
+            let left = paddingLeft + x;
+            let top = paddingTop + y;
+            let width = width_unit * w;
+            let height = height_unit * h;
+            component.bounds = {
+                left,
+                top,
+                width,
+                height
+            };
+            component.set('rotation', 0);
+            if (idx % columns == columns - 1) {
+                x = 0;
+                y += h * height_unit;
+            }
+            else {
+                x += w * width_unit;
+            }
+        });
+    },
+    capturables: function (container) {
+        return container.components;
+    },
+    drawables: function (container) {
+        return container.components;
+    },
+    isStuck: function (component) {
+        return true;
+    },
+    /*
+     * 레이아웃별로, 키보드 방향키 등을 사용해서 네비게이션 할 수 있는 기능을 제공할 수 있다.
+     * 하나의 컴포넌트만 선택되어있고, 키보드 이벤트가 발생했을 때 호출되게 된다.
+     * keyNavigate 메쏘드가 정의되어 있지 않으면, 'Tab' 키에 대한 네비게이션만 작동한다.
+     * 'Tab'키에 의한 네비게이션은 모든 레이아웃에 공통으로 적용된다.
+     */
+    keyNavigate: function (container, component, e) {
+        var layoutConfig = container.get('layoutConfig');
+        var columns = (layoutConfig && layoutConfig.columns) || container.get('columns');
+        var rows = (layoutConfig && layoutConfig.rows) || container.get('rows');
+        var { row, column } = container.getRowColumn(component);
+        switch (e.code) {
+            case 'ArrowUp':
+                if (row > 0)
+                    return container.getAt((row - 1) * columns + column);
+                break;
+            case 'ArrowDown':
+                if (row < rows - 1)
+                    return container.getAt((row + 1) * columns + column);
+                break;
+            case 'ArrowRight':
+                if (column < columns - 1)
+                    return container.getAt(row * columns + column + 1);
+                break;
+            case 'ArrowLeft':
+                if (column > 0)
+                    return container.getAt(row * columns + column - 1);
+                break;
+            default:
+                return component;
+        }
+    },
+    /*
+     * 하위 컴포넌트를 영역으로 선택하는 경우에, 바운드에 join만 되어도 선택된 것으로 판단하도록 한다.
+     * joinType이 false이거나, 정의되어있지 않으면, 바운드에 포함되어야 선택된 것으로 판단한다.
+     */
+    joinType: true
+};
+Layout.register('data-list', DataListLayout);
+export default DataListLayout;
+//# sourceMappingURL=data-list-layout.js.map

package/dist/data-list/data-list-layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"data-list-layout.js","sourceRoot":"","sources":["../../src/data-list/data-list-layout.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport { Component, Container, Layout } from '@hatiolab/things-scene'\n\nimport DataCell from './data-cell'\nimport DataList from './data-list'\n\nvar DataListLayout = {\n  reflow: function(container: Container) {\n    var layoutConfig = container.get('layoutConfig')\n\n    var columns = (layoutConfig && layoutConfig.columns) || container.get('columns')\n    var rows = (layoutConfig && layoutConfig.rows) || container.get('rows')\n    var widths = (layoutConfig && layoutConfig.widths) || container.get('widths')\n    var heights = (layoutConfig && layoutConfig.heights) || container.get('heights')\n    var { offset = { x: 0, y: 0 } } = container.state\n\n    var widths_sum = widths ? widths.filter((width: number, i: number) => i < columns).reduce((sum: number, width: number) => sum + width, 0) : columns\n    var heights_sum = heights ? heights.filter((height: number, i: number) => i < rows).reduce((sum: number, height: number) => sum + height, 0) : rows\n\n    var inside = container.textBounds\n    var paddingLeft = container.get('paddingLeft') || 0\n    var paddingTop = container.get('paddingTop') || 0\n\n    var width_unit = inside.width / widths_sum\n    var height_unit = inside.height / heights_sum\n\n    var x = offset.x\n    var y = offset.y\n    var components = container.components\n\n    components.forEach((component, idx) => {\n      let w = widths ? widths[idx % columns] : 1\n      let h = heights ? heights[0] : 1\n\n      let left = paddingLeft + x\n      let top = paddingTop + y\n      let width = width_unit * w\n      let height = height_unit * h\n\n      component.bounds = {\n        left,\n        top,\n        width,\n        height\n      }\n      component.set('rotation', 0)\n\n      if (idx % columns == columns - 1) {\n        x = 0\n        y += h * height_unit\n      } else {\n        x += w * width_unit\n      }\n    })\n  },\n\n  capturables: function(container: Container) {\n    return container.components\n  },\n\n  drawables: function(container: Container) {\n    return container.components\n  },\n\n  isStuck: function(component: Component) {\n    return true\n  },\n\n  /*\n   * 레이아웃별로, 키보드 방향키 등을 사용해서 네비게이션 할 수 있는 기능을 제공할 수 있다.\n   * 하나의 컴포넌트만 선택되어있고, 키보드 이벤트가 발생했을 때 호출되게 된다.\n   * keyNavigate 메쏘드가 정의되어 있지 않으면, 'Tab' 키에 대한 네비게이션만 작동한다.\n   * 'Tab'키에 의한 네비게이션은 모든 레이아웃에 공통으로 적용된다.\n   */\n  keyNavigate: function(container: Container, component: Component, e: KeyboardEvent) {\n    var layoutConfig = container.get('layoutConfig')\n\n    var columns = (layoutConfig && layoutConfig.columns) || container.get('columns')\n    var rows = (layoutConfig && layoutConfig.rows) || container.get('rows')\n\n    var { row, column } = (container as DataList).getRowColumn(component as DataCell)\n\n    switch (e.code) {\n      case 'ArrowUp':\n        if (row > 0) return container.getAt((row - 1) * columns + column)\n        break\n      case 'ArrowDown':\n        if (row < rows - 1) return container.getAt((row + 1) * columns + column)\n        break\n      case 'ArrowRight':\n        if (column < columns - 1) return container.getAt(row * columns + column + 1)\n        break\n      case 'ArrowLeft':\n        if (column > 0) return container.getAt(row * columns + column - 1)\n        break\n      default:\n        return component\n    }\n  },\n\n  /*\n   * 하위 컴포넌트를 영역으로 선택하는 경우에, 바운드에 join만 되어도 선택된 것으로 판단하도록 한다.\n   * joinType이 false이거나, 정의되어있지 않으면, 바운드에 포함되어야 선택된 것으로 판단한다.\n   */\n  joinType: true\n}\n\nLayout.register('data-list', DataListLayout)\n\nexport default DataListLayout\n"]}

package/dist/data-list/data-list.d.ts

@@ -0,0 +1,56 @@
+import './data-cell';
+import './data-list-layout';
+import { WHERE } from '../helper-functions';
+import { Component, ComponentNature, Container, Control, State, Style } from '@hatiolab/things-scene';
+export default class DataList extends Container {
+    postrender(context: CanvasRenderingContext2D): void;
+    renderScrollbar(context: CanvasRenderingContext2D): void;
+    created(): void;
+    _onwheel(e: WheelEvent): void;
+    private __START_OFFSET?;
+    private __START_Y?;
+    _ontouchstart(e: DragEvent): void;
+    _ontouchmove(e: DragEvent): void;
+    _ontouchend(e: DragEvent): void;
+    get layout(): import("@hatiolab/things-scene").LAYOUT;
+    containable(component: Component): boolean;
+    get focusible(): boolean;
+    get widths_sum(): number;
+    get heights_sum(): number;
+    get widths(): number[];
+    get heights(): number[];
+    get columns(): number;
+    get rows(): number;
+    get nature(): ComponentNature;
+    get controls(): Control[];
+    onchange(after: State, before: State): void;
+    get eventMap(): {
+        '(self)': {
+            '(all)': {
+                wheel: (e: WheelEvent) => void;
+                touchstart: (e: DragEvent) => void;
+                touchmove: (e: DragEvent) => void;
+                touchend: (e: DragEvent) => void;
+            };
+        };
+    };
+    setCellsData(): void;
+    setCellsStyle(cells: Component[], style: Style, where: WHERE): void;
+    buildCells(newcolumns: number, oldcolumns: number): void;
+    getRowColumn(cell: Component): {
+        column: number;
+        row: number;
+    };
+    getCellsByRow(row: number): Component[];
+    getCellsByColumn(column: number): Component[];
+    mergeCells(cells: Component[]): void;
+    splitCells(cells: Component[]): void;
+    deleteRows(cells: Component[]): void;
+    deleteColumns(cells: Component[]): void;
+    insertCellsAbove(cells: Component[]): void;
+    insertCellsBelow(cells: Component[]): void;
+    insertCellsLeft(cells: Component[]): false | undefined;
+    insertCellsRight(cells: Component[]): false | undefined;
+    distributeHorizontal(cells: Component[]): void;
+    distributeVertical(cells: Component[]): void;
+}