@operato/scene-table 0.0.17

package/dist/helper-functions.js

@@ -0,0 +1,135 @@
+import { Model } from '@hatiolab/things-scene';
+export const SIDES = {
+    all: ['top', 'left', 'bottom', 'right'],
+    out: ['top', 'left', 'bottom', 'right'],
+    left: ['left'],
+    right: ['right'],
+    top: ['top'],
+    bottom: ['bottom'],
+    leftright: ['left', 'right'],
+    topbottom: ['top', 'bottom']
+};
+export const CLEAR_STYLE = {
+    strokeStyle: '',
+    lineDash: 'solid',
+    lineWidth: 0
+};
+export const DEFAULT_STYLE = {
+    strokeStyle: '#999',
+    lineDash: 'solid',
+    lineWidth: 1
+};
+export function buildNewCell(type, app) {
+    return Model.compile({
+        type,
+        strokeStyle: 'blue',
+        left: 0,
+        top: 0,
+        width: 1,
+        height: 1,
+        textWrap: true,
+        border: buildBorderStyle(DEFAULT_STYLE, 'all')
+    }, app);
+}
+export function buildCopiedCell(copy, app) {
+    var obj = JSON.parse(JSON.stringify(copy));
+    delete obj.text;
+    return Model.compile(obj, app);
+}
+export function buildBorderStyle(style, where) {
+    return (SIDES[where] || []).reduce((border, side) => {
+        border[side] = style;
+        return border;
+    }, {});
+}
+export function setCellBorder(cell, style, where) {
+    if (!cell)
+        return;
+    cell.set('border', Object.assign({}, cell.get('border') || {}, buildBorderStyle(style, where)));
+}
+export function isLeftMost(total, columns, indices, i) {
+    return i == 0 || !(i % columns) || indices.indexOf(i - 1) == -1;
+}
+export function isRightMost(total, columns, indices, i) {
+    return i == total - 1 || i % columns == columns - 1 || indices.indexOf(i + 1) == -1;
+}
+export function isTopMost(total, columns, indices, i) {
+    return i < columns || indices.indexOf(i - columns) == -1;
+}
+export function isBottomMost(total, columns, indices, i) {
+    return i > total - columns - 1 || indices.indexOf(i + columns) == -1;
+}
+export function above(columns, i) {
+    return i - columns;
+}
+export function below(columns, i) {
+    return i + columns;
+}
+export function before(columns, i) {
+    return !(i % columns) ? -1 : i - 1;
+}
+export function after(columns, i) {
+    return !((i + 1) % columns) ? -1 : i + 1;
+}
+export function array(value, size) {
+    var arr = [];
+    for (let i = 0; i < size; i++)
+        arr.push(1);
+    return arr;
+}
+export var columnControlHandler = {
+    ondragmove: function (point, index, component) {
+        var { left, width } = component.textBounds;
+        var widths_sum = component.widths_sum;
+        var widths = component.widths.slice();
+        /* 컨트롤의 원래 위치를 구한다. */
+        var origin_pos_unit = widths.slice(0, index + 1).reduce((sum, width) => sum + width, 0);
+        var origin_offset = left + (origin_pos_unit / widths_sum) * width;
+        /*
+         * point의 좌표는 부모 레이어 기준의 x, y 값이다.
+         * 따라서, 도형의 회전을 감안한 좌표로의 변환이 필요하다.
+         * Transcoord시에는 point좌표가 부모까지 transcoord되어있는 상태이므로,
+         * 컴포넌트자신에 대한 transcoord만 필요하다.(마지막 파라미터를 false로).
+         */
+        var transcoorded = component.transcoordP2S(point.x, point.y);
+        var diff = transcoorded.x - origin_offset;
+        var diff_unit = (diff / width) * widths_sum;
+        var min_width_unit = (widths_sum / width) * 10; // 10픽셀정도를 최소로
+        if (diff_unit < 0)
+            diff_unit = -Math.min(widths[index] - min_width_unit, -diff_unit);
+        else
+            diff_unit = Math.min(widths[index + 1] - min_width_unit, diff_unit);
+        widths[index] = Math.round((widths[index] + diff_unit) * 100) / 100;
+        widths[index + 1] = Math.round((widths[index + 1] - diff_unit) * 100) / 100;
+        component.set('widths', widths);
+    }
+};
+export var rowControlHandler = {
+    ondragmove: function (point, index, component) {
+        var { top, height } = component.textBounds;
+        var heights_sum = component.heights_sum;
+        var heights = component.heights.slice();
+        /* 컨트롤의 원래 위치를 구한다. */
+        index -= component.columns - 1;
+        var origin_pos_unit = heights.slice(0, index + 1).reduce((sum, height) => sum + height, 0);
+        var origin_offset = top + (origin_pos_unit / heights_sum) * height;
+        /*
+         * point의 좌표는 부모 레이어 기준의 x, y 값이다.
+         * 따라서, 도형의 회전을 감안한 좌표로의 변환이 필요하다.
+         * Transcoord시에는 point좌표가 부모까지 transcoord되어있는 상태이므로,
+         * 컴포넌트자신에 대한 transcoord만 필요하다.(마지막 파라미터를 false로).
+         */
+        var transcoorded = component.transcoordP2S(point.x, point.y);
+        var diff = transcoorded.y - origin_offset;
+        var diff_unit = (diff / height) * heights_sum;
+        var min_height_unit = (heights_sum / height) * 10; // 10픽셀정도를 최소로
+        if (diff_unit < 0)
+            diff_unit = -Math.min(heights[index] - min_height_unit, -diff_unit);
+        else
+            diff_unit = Math.min(heights[index + 1] - min_height_unit, diff_unit);
+        heights[index] = Math.round((heights[index] + diff_unit) * 100) / 100;
+        heights[index + 1] = Math.round((heights[index + 1] - diff_unit) * 100) / 100;
+        component.set('heights', heights);
+    }
+};
+//# sourceMappingURL=helper-functions.js.map

package/dist/helper-functions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helper-functions.js","sourceRoot":"","sources":["../src/helper-functions.ts"],"names":[],"mappings":"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","sourcesContent":["import { ApplicationContext, Component, Model, POINT, Style } from '@hatiolab/things-scene'\nimport { Table, TableCell } from '.'\n\nexport type WHERE = 'all' | 'in' | 'out' | 'left' | 'right' | 'center' | 'middle' | 'top' | 'bottom' | 'clear'\n\nexport const SIDES: {[key: string]: string[]} = {\n  all: ['top', 'left', 'bottom', 'right'],\n  out: ['top', 'left', 'bottom', 'right'],\n  left: ['left'],\n  right: ['right'],\n  top: ['top'],\n  bottom: ['bottom'],\n  leftright: ['left', 'right'],\n  topbottom: ['top', 'bottom']\n}\n\nexport const CLEAR_STYLE = {\n  strokeStyle: '',\n  lineDash: 'solid',\n  lineWidth: 0\n}\n\nexport const DEFAULT_STYLE = {\n  strokeStyle: '#999',\n  lineDash: 'solid',\n  lineWidth: 1\n}\n\nexport function buildNewCell(type: string, app: ApplicationContext): TableCell {\n  return Model.compile(\n    {\n      type,\n      strokeStyle: 'blue',\n      left: 0,\n      top: 0,\n      width: 1,\n      height: 1,\n      textWrap: true,\n      border: buildBorderStyle(DEFAULT_STYLE, 'all')\n    },\n    app\n  ) as TableCell\n}\n\nexport function buildCopiedCell(copy: Model, app: ApplicationContext): TableCell {\n  var obj = JSON.parse(JSON.stringify(copy))\n  delete obj.text\n  return Model.compile(obj, app) as TableCell\n}\n\nexport function buildBorderStyle(style: Style, where: string) {\n  return (SIDES[where] || []).reduce((border: { [key: string]: any }, side: string) => {\n    border[side] = style\n    return border\n  }, {} as { [key: string]: any })\n}\n\nexport function setCellBorder(cell: any, style: Style, where: string) {\n  if (!cell) return\n  cell.set('border', Object.assign({}, cell.get('border') || {}, buildBorderStyle(style, where)))\n}\n\nexport function isLeftMost(total: number, columns: number, indices: number[], i: number) {\n  return i == 0 || !(i % columns) || indices.indexOf(i - 1) == -1\n}\n\nexport function isRightMost(total: number, columns: number, indices: number[], i: number) {\n  return i == total - 1 || i % columns == columns - 1 || indices.indexOf(i + 1) == -1\n}\n\nexport function isTopMost(total: number, columns: number, indices: number[], i: number) {\n  return i < columns || indices.indexOf(i - columns) == -1\n}\n\nexport function isBottomMost(total: number, columns: number, indices: number[], i: number) {\n  return i > total - columns - 1 || indices.indexOf(i + columns) == -1\n}\n\nexport function above(columns: number, i: number) {\n  return i - columns\n}\n\nexport function below(columns: number, i: number) {\n  return i + columns\n}\n\nexport function before(columns: number, i: number) {\n  return !(i % columns) ? -1 : i - 1\n}\n\nexport function after(columns: number, i: number) {\n  return !((i + 1) % columns) ? -1 : i + 1\n}\n\nexport function array(value: any, size: number) {\n  var arr = []\n  for (let i = 0; i < size; i++) arr.push(1)\n  return arr\n}\n\nexport var columnControlHandler = {\n  ondragmove: function(point: POINT, index: number, component: Table) {\n    var { left, width } = component.textBounds\n    var widths_sum = component.widths_sum\n\n    var widths = component.widths.slice()\n\n    /* 컨트롤의 원래 위치를 구한다. */\n    var origin_pos_unit = widths.slice(0, index + 1).reduce((sum: number, width: number) => sum + width, 0)\n    var origin_offset = left + (origin_pos_unit / widths_sum) * width\n\n    /*\n     * point의 좌표는 부모 레이어 기준의 x, y 값이다.\n     * 따라서, 도형의 회전을 감안한 좌표로의 변환이 필요하다.\n     * Transcoord시에는 point좌표가 부모까지 transcoord되어있는 상태이므로,\n     * 컴포넌트자신에 대한 transcoord만 필요하다.(마지막 파라미터를 false로).\n     */\n    var transcoorded = component.transcoordP2S(point.x, point.y)\n    var diff = transcoorded.x - origin_offset\n\n    var diff_unit = (diff / width) * widths_sum\n\n    var min_width_unit = (widths_sum / width) * 10 // 10픽셀정도를 최소로\n\n    if (diff_unit < 0) diff_unit = -Math.min(widths[index] - min_width_unit, -diff_unit)\n    else diff_unit = Math.min(widths[index + 1] - min_width_unit, diff_unit)\n\n    widths[index] = Math.round((widths[index] + diff_unit) * 100) / 100\n    widths[index + 1] = Math.round((widths[index + 1] - diff_unit) * 100) / 100\n\n    component.set('widths', widths)\n  }\n}\n\nexport var rowControlHandler = {\n  ondragmove: function(point: POINT, index: number, component: Table) {\n    var { top, height } = component.textBounds\n    var heights_sum = component.heights_sum\n\n    var heights = component.heights.slice()\n\n    /* 컨트롤의 원래 위치를 구한다. */\n    index -= component.columns - 1\n    var origin_pos_unit = heights.slice(0, index + 1).reduce((sum: number, height: number) => sum + height, 0)\n    var origin_offset = top + (origin_pos_unit / heights_sum) * height\n\n    /*\n     * point의 좌표는 부모 레이어 기준의 x, y 값이다.\n     * 따라서, 도형의 회전을 감안한 좌표로의 변환이 필요하다.\n     * Transcoord시에는 point좌표가 부모까지 transcoord되어있는 상태이므로,\n     * 컴포넌트자신에 대한 transcoord만 필요하다.(마지막 파라미터를 false로).\n     */\n    var transcoorded = component.transcoordP2S(point.x, point.y)\n    var diff = transcoorded.y - origin_offset\n\n    var diff_unit = (diff / height) * heights_sum\n\n    var min_height_unit = (heights_sum / height) * 10 // 10픽셀정도를 최소로\n\n    if (diff_unit < 0) diff_unit = -Math.min(heights[index] - min_height_unit, -diff_unit)\n    else diff_unit = Math.min(heights[index + 1] - min_height_unit, diff_unit)\n\n    heights[index] = Math.round((heights[index] + diff_unit) * 100) / 100\n    heights[index + 1] = Math.round((heights[index + 1] - diff_unit) * 100) / 100\n\n    component.set('heights', heights)\n  }\n}\n"]}

package/dist/index.d.ts

@@ -0,0 +1,3 @@
+export { default as Table } from './table';
+export { default as TableCell } from './table-cell';
+export { default as DataList } from './data-list/data-list';

package/dist/index.js

@@ -0,0 +1,7 @@
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ */
+export { default as Table } from './table';
+export { default as TableCell } from './table-cell';
+export { default as DataList } from './data-list/data-list';
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAA;AAC1C,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,cAAc,CAAA;AACnD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,uBAAuB,CAAA","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\nexport { default as Table } from './table'\nexport { default as TableCell } from './table-cell'\nexport { default as DataList } from './data-list/data-list'\n"]}

package/dist/table-cell.d.ts

@@ -0,0 +1,41 @@
+import { Component } from '@hatiolab/things-scene';
+declare type Style = {
+    [style: string]: any;
+};
+declare const TableCell_base: typeof Component;
+/**
+ * 1. 스타일을 상속 받아야 함. (cascade-style)
+ * 2. 스타일을 동적처리할 수 있음. (로직처리)
+ * 3. 데이타를 받을 수 있음.
+ */
+export default class TableCell extends TableCell_base {
+    get nature(): {
+        mutable: boolean;
+        resizable: boolean;
+        rotatable: boolean;
+        properties: ({
+            type: string;
+            label: string;
+            name: string;
+            property: {
+                merge: boolean;
+                split: boolean;
+            };
+        } | {
+            type: string;
+            label: string;
+            name: string;
+            property: string;
+        })[];
+        help: string;
+    };
+    set merged(merged: any);
+    get merged(): any;
+    set rowspan(rowspan: any);
+    get rowspan(): any;
+    set colspan(colspan: any);
+    get colspan(): any;
+    _drawBorder(context: CanvasRenderingContext2D, x: number, y: number, to_x: number, to_y: number, style: Style): void;
+    _draw(context: CanvasRenderingContext2D): void;
+}
+export {};

package/dist/table-cell.js

@@ -0,0 +1,104 @@
+/*
+ * 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: true,
+                split: true
+            }
+        },
+        {
+            type: 'string',
+            label: 'data-key',
+            name: 'dataKey',
+            property: 'dataKey'
+        },
+        {
+            type: 'number',
+            label: 'data-index',
+            name: 'dataIndex',
+            property: 'dataIndex'
+        }
+    ],
+    help: 'scene/component/table-cell'
+};
+const EMPTY_BORDER = {};
+function isBottomMost(idx, rows, columns, components) {
+    return idx >= (rows - 1) * columns || (components[idx + columns] && components[idx + columns].hidden);
+}
+function isRightMost(idx, rows, columns, components) {
+    return (idx + 1) % columns == 0 || (components[idx + 1] && components[idx + 1].hidden);
+}
+/**
+ * 1. 스타일을 상속 받아야 함. (cascade-style)
+ * 2. 스타일을 동적처리할 수 있음. (로직처리)
+ * 3. 데이타를 받을 수 있음.
+ */
+export default class TableCell extends RectPath(Component) {
+    // export default class TableCell extends Container {
+    // get layout() {
+    //   return Layout.get(this.get('layout') || 'card')
+    // }
+    get nature() {
+        return NATURE;
+    }
+    set merged(merged) {
+        this.set('merged', !!merged);
+        if (merged)
+            this.set('text', '');
+    }
+    get merged() {
+        return this.get('merged');
+    }
+    set rowspan(rowspan) {
+        this.set('rowspan', rowspan);
+    }
+    get rowspan() {
+        return this.get('rowspan');
+    }
+    set colspan(colspan) {
+        this.set('colspan', colspan);
+    }
+    get colspan() {
+        return this.get('colspan');
+    }
+    _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.model;
+        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;
+        var rows = parent.rows || 1;
+        this._drawBorder(context, left, top, left + width, top, border.top);
+        this._drawBorder(context, left, top + height, left, top, border.left);
+        if (isRightMost(idx, rows, columns, parent.components))
+            this._drawBorder(context, left + width, top, left + width, top + height, border.right);
+        if (isBottomMost(idx, rows, columns, parent.components))
+            this._drawBorder(context, left + width, top + height, left, top + height, border.bottom);
+    }
+}
+Component.register('table-cell', TableCell);
+//# sourceMappingURL=table-cell.js.map

package/dist/table-cell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-cell.js","sourceRoot":"","sources":["../src/table-cell.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\nimport { Component, Container, Layout, RectPath } from '@hatiolab/things-scene'\n\nimport Table from './table'\n\ntype Style = { [style: string]: any }\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: true,\n        split: true\n      }\n    },\n    {\n      type: 'string',\n      label: 'data-key',\n      name: 'dataKey',\n      property: 'dataKey'\n    },\n    {\n      type: 'number',\n      label: 'data-index',\n      name: 'dataIndex',\n      property: 'dataIndex'\n    }\n  ],\n  help: 'scene/component/table-cell'\n}\n\nconst EMPTY_BORDER = {}\n\nfunction isBottomMost(idx: number, rows: number, columns: number, components: Component[]) {\n  return idx >= (rows - 1) * columns || (components[idx + columns] && components[idx + columns].hidden)\n}\n\nfunction isRightMost(idx: number, rows: number, columns: number, components: Component[]) {\n  return (idx + 1) % columns == 0 || (components[idx + 1] && components[idx + 1].hidden)\n}\n\n/**\n * 1. 스타일을 상속 받아야 함. (cascade-style)\n * 2. 스타일을 동적처리할 수 있음. (로직처리)\n * 3. 데이타를 받을 수 있음.\n */\nexport default class TableCell extends RectPath(Component) {\n  // export default class TableCell extends Container {\n\n  // get layout() {\n  //   return Layout.get(this.get('layout') || 'card')\n  // }\n\n  get nature() {\n    return NATURE\n  }\n\n  set merged(merged) {\n    this.set('merged', !!merged)\n    if (merged) this.set('text', '')\n  }\n\n  get merged() {\n    return this.get('merged')\n  }\n\n  set rowspan(rowspan) {\n    this.set('rowspan', rowspan)\n  }\n\n  get rowspan() {\n    return this.get('rowspan')\n  }\n\n  set colspan(colspan) {\n    this.set('colspan', colspan)\n  }\n\n  get colspan() {\n    return this.get('colspan')\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.model\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    var rows = parent.rows || 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 (isRightMost(idx, rows, columns, parent.components))\n      this._drawBorder(context, left + width, top, left + width, top + height, border.right)\n    if (isBottomMost(idx, rows, columns, parent.components))\n      this._drawBorder(context, left + width, top + height, left, top + height, border.bottom)\n  }\n}\n\nComponent.register('table-cell', TableCell)\n"]}

package/dist/table.d.ts

@@ -0,0 +1,54 @@
+import { WHERE } from './helper-functions';
+import { Component, ComponentNature, Container, Control, State, Style } from '@hatiolab/things-scene';
+import { TableCell } from '.';
+export default class Table extends Container {
+    created(): void;
+    containable(component: Component): boolean;
+    get focusible(): boolean;
+    get widths(): any;
+    get heights(): any;
+    buildCells(newrows: number, newcolumns: number, oldrows: number, oldcolumns: number): void;
+    get layout(): import("@hatiolab/things-scene").LAYOUT;
+    get rows(): number;
+    setCellsStyle(cells: TableCell[], style: Style, where: WHERE): void;
+    setCellsData(): void;
+    getRowColumn(cell: TableCell): {
+        column: number;
+        row: number;
+    };
+    getCellsByRow(row: number): Component[];
+    getCellsByColumn(column: number): Component[];
+    findMergedCellByX(row: number): TableCell[];
+    findMergedCellByY(column: number): TableCell[];
+    mergeCells(cells: TableCell[]): false | undefined;
+    splitCells(cells: TableCell[]): void;
+    deleteRows(cells: TableCell[]): false | undefined;
+    deleteColumns(cells: TableCell[]): false | undefined;
+    insertCellsAbove(cells: TableCell[]): false | undefined;
+    insertCellsBelow(cells: TableCell[]): false | undefined;
+    insertCellsLeft(cells: TableCell[]): false | undefined;
+    insertCellsRight(cells: TableCell[]): false | undefined;
+    distributeHorizontal(cells: TableCell[]): void;
+    distributeVertical(cells: TableCell[]): void;
+    toObjectArrayValue(array: any[]): any[] | null;
+    get columns(): number;
+    get lefts(): Component[];
+    get centers(): Component[];
+    get rights(): Component[];
+    get tops(): Component[];
+    get middles(): Component[];
+    get bottoms(): Component[];
+    get widths_sum(): number;
+    get heights_sum(): number;
+    get nature(): ComponentNature;
+    get controls(): Control[];
+    onchange(after: State, before: State): void;
+    get eventMap(): {
+        '(self)': {
+            '(descendant)': {
+                change: (after: import("@hatiolab/things-scene").Properties, before: import("@hatiolab/things-scene").Properties) => void;
+            };
+        };
+    };
+    oncellchanged(after: State, before: State): void;
+}