@operato/data-grist 0.3.13 → 0.3.17

package/dist/src/data-grid/data-grid.js

@@ -2,20 +2,15 @@ import { __decorate } from "tslib";
 import './data-grid-header';
 import './data-grid-body';
 import './data-grid-footer';
-import { LitElement, css, html } from 'lit';
-import { ZERO_CONFIG, ZERO_DATA } from '../configure/zero-config';
+import { css, html } from 'lit';
 import { customElement, property, query } from 'lit/decorators.js';
 import { ScrollbarStyles } from '@operato/styles';
+import { DataManipulator } from '../data-manipulator';
 import { supportsPassive } from '../utils';
 /**
  * DataGrid
  */
-let DataGrid = class DataGrid extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.config = ZERO_CONFIG;
-        this.data = ZERO_DATA;
-    }
+let DataGrid = class DataGrid extends DataManipulator {
     firstUpdated() {
         /* header and body scroll synchronization */
         this.header.addEventListener('scroll', e => {
@@ -41,136 +36,27 @@ let DataGrid = class DataGrid extends LitElement {
             this.header.requestUpdate();
             this.body.requestUpdate();
         });
-        this.addEventListener('select-record-change', e => {
-            var { records: selectedRecords, added = [], removed = [] } = e.detail;
-            var { records } = this.data;
-            var { selectable } = this.config.rows;
-            if (!records) {
-                return;
-            }
-            if (selectable && !selectable.multiple) {
-                records.forEach(record => (record['__selected__'] = false));
-            }
-            if (selectedRecords) {
-                records.forEach(record => (record['__selected__'] = false));
-                selectedRecords.forEach(record => (record['__selected__'] = true));
-            }
-            else {
-                removed.forEach(record => (record['__selected__'] = false));
-                added.forEach(record => (record['__selected__'] = true));
-            }
-            this.header.requestUpdate();
-            this.body.requestUpdate();
-        });
-        /* field change processing */
-        this.addEventListener('field-change', e => {
-            var { after, before, column, record, row } = e.detail;
-            /* compare changes */
-            if (after === before) {
-                return;
-            }
-            var validation = column.validation;
-            if (validation && typeof (validation == 'function')) {
-                if (!validation.call(this, after, before, record, column)) {
-                    return;
-                }
-            }
-            this.onRecordChanged({ [column.name]: after }, row, column);
-        });
         this.addEventListener('focus-change', e => {
             this.focused = e.detail;
             this.focus();
             this.requestUpdate();
         });
-        /* record reset processing */
-        this.addEventListener('record-reset', e => {
-            var { record, row } = e.detail;
-            this.onRecordChanged(record['__origin__'], row, null);
-        });
     }
     onWheelEvent(e) {
         var delta = Math.max(-1, Math.min(1, e.deltaY || 0));
         this.body.scrollLeft = Math.max(0, this.body.scrollLeft - delta * 30);
         supportsPassive || e.preventDefault();
     }
+    onSelectRecordChanged({ selectedRecords, added, removed }) {
+        super.onSelectRecordChanged({ selectedRecords, added, removed });
+        this.header.requestUpdate();
+        this.body.requestUpdate();
+    }
     onRecordChanged(recordData, row, column /* TODO column should be removed */) {
-        // TODO 오브젝트나 배열 타입인 경우 deepCompare 후에 변경 적용 여부를 결정한다.
-        /* 빈 그리드로 시작한 경우, data 설정이 되어있지 않을 수 있다. */
-        var records = this.data.records;
-        var beforeRecord = records[row];
-        var afterRecord;
-        var wantToDelete = false;
-        var wantToAppend = false;
-        if (!recordData) {
-            if (!beforeRecord) {
-                /* recordData가 없고, beforeRecord도 없다면, 레코드 생성 중에 리셋된 경우이므로 아무것도 하지 않는다. */
-                this.requestUpdate();
-                return;
-            }
-            else {
-                /*
-                 * beforeRecord가 있는데, 빈데이타로 업데이트하고자 한다면,
-                 * 삭제하고자 하는 의도로 이해된다. (주의 필요)
-                 */
-                if (beforeRecord['__dirty__'] == '+') {
-                    wantToDelete = true;
-                }
-                else {
-                    afterRecord = {
-                        ...beforeRecord,
-                        __dirty__: '-'
-                    };
-                }
-            }
-        }
-        else {
-            if (!beforeRecord) {
-                /* 기존 레코드가 없는 경우에는 새로운 레코드가 생성된다 */
-                afterRecord = {
-                    ...recordData,
-                    __dirty__: '+'
-                };
-                wantToAppend = true;
-            }
-            else {
-                let beforeDirty = beforeRecord.__dirty__;
-                if (beforeDirty == '+') {
-                    /* 기존에 새로 생성된 레코드가 있었으며 계속 수정중이다. */
-                    afterRecord = {
-                        ...beforeRecord,
-                        ...recordData,
-                        __dirty__: '+'
-                    };
-                }
-                else {
-                    /* 기존에 레코드가 있었으며 계속 수정중이다. */
-                    afterRecord = {
-                        ...beforeRecord,
-                        ...recordData,
-                        __dirty__: 'M'
-                    };
-                }
-            }
-        }
-        if (wantToAppend) {
-            records.push(afterRecord);
-        }
-        else if (wantToDelete) {
-            records.splice(row, 1);
-        }
-        else {
-            records.splice(row, 1, afterRecord);
-        }
-        this.dispatchEvent(new CustomEvent('record-change', {
-            bubbles: true,
-            composed: true,
-            detail: {
-                before: beforeRecord,
-                after: afterRecord,
-                column,
-                row
-            }
-        }));
+        /* record-viewer 등 grid 외에서 변경되는 경우에도 header와 body를 refresh 하도록 한다. */
+        super.onRecordChanged(recordData, row, column);
+        this.header.requestUpdate();
+        this.body.requestUpdate();
     }
     updated(changes) {
         if (changes.has('config') || changes.has('data')) {
@@ -274,12 +160,6 @@ DataGrid.styles = [
       }
     `
 ];
-__decorate([
-    property({ type: Object })
-], DataGrid.prototype, "config", void 0);
-__decorate([
-    property({ type: Object })
-], DataGrid.prototype, "data", void 0);
 __decorate([
     property({ type: Object })
 ], DataGrid.prototype, "focused", void 0);

package/dist/src/data-grid/data-grid.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-grid.js","sourceRoot":"","sources":["../../../src/data-grid/data-grid.ts"],"names":[],"mappings":"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","sourcesContent":["import './data-grid-header'\nimport './data-grid-body'\nimport './data-grid-footer'\n\nimport { ColumnConfig, GristConfig, GristData, GristRecord, PaginationConfig } from '../types'\nimport { LitElement, PropertyValues, css, html } from 'lit'\nimport { ZERO_CONFIG, ZERO_DATA } from '../configure/zero-config'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { DataGridHeader } from './data-grid-header'\nimport { ScrollbarStyles } from '@operato/styles'\nimport { supportsPassive } from '../utils'\n\n/**\n * DataGrid\n */\n@customElement('ox-grid')\nexport class DataGrid extends LitElement {\n  static styles = [\n    ScrollbarStyles,\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n\n        overflow: hidden;\n\n        border-width: var(--grid-container-border-width);\n      }\n\n      ox-grid-body {\n        flex: 1;\n      }\n\n      @media print {\n        :host {\n          zoom: 80%;\n        }\n      }\n    `\n  ]\n\n  @property({ type: Object }) config: GristConfig = ZERO_CONFIG\n  @property({ type: Object }) data: GristData = ZERO_DATA\n  @property({ type: Object }) focused?: { row: number; column: number }\n\n  @query('ox-grid-body', true) body!: LitElement\n  @query('ox-grid-header', true) header!: DataGridHeader\n  @query('ox-grid-footer', true) footer!: LitElement\n\n  private _widths?: string\n\n  firstUpdated() {\n    /* header and body scroll synchronization */\n    this.header.addEventListener('scroll', e => {\n      if (this.body.scrollLeft !== this.header.scrollLeft) {\n        this.body.scrollLeft = this.header.scrollLeft\n      }\n    })\n\n    this.body.addEventListener('scroll', e => {\n      if (this.body.scrollLeft !== this.header.scrollLeft) {\n        this.header.scrollLeft = this.body.scrollLeft\n      }\n    })\n\n    this.header.addEventListener('wheel', this.onWheelEvent.bind(this))\n    this.footer && this.footer.addEventListener('wheel', this.onWheelEvent.bind(this))\n\n    /* record selection processing */\n    this.addEventListener('select-all-change', e => {\n      if (this.data.records.length == 0) {\n        return\n      }\n\n      var { selected } = (e as CustomEvent).detail\n      var { records } = this.data\n\n      records.forEach(record => (record['__selected__'] = selected))\n\n      this.header.requestUpdate()\n      this.body.requestUpdate()\n    })\n\n    this.addEventListener('select-record-change', e => {\n      var {\n        records: selectedRecords,\n        added = [],\n        removed = []\n      } = (e as CustomEvent).detail as {\n        records: GristRecord[]\n        added: GristRecord[]\n        removed: GristRecord[]\n      }\n      var { records } = this.data\n      var { selectable } = this.config.rows\n\n      if (!records) {\n        return\n      }\n\n      if (selectable && !selectable.multiple) {\n        records.forEach(record => (record['__selected__'] = false))\n      }\n\n      if (selectedRecords) {\n        records.forEach(record => (record['__selected__'] = false))\n        selectedRecords.forEach(record => (record['__selected__'] = true))\n      } else {\n        removed.forEach(record => (record['__selected__'] = false))\n        added.forEach(record => (record['__selected__'] = true))\n      }\n\n      this.header.requestUpdate()\n      this.body.requestUpdate()\n    })\n\n    /* field change processing */\n    this.addEventListener('field-change', e => {\n      var { after, before, column, record, row } = (e as CustomEvent).detail\n\n      /* compare changes */\n      if (after === before) {\n        return\n      }\n\n      var validation = column.validation\n      if (validation && typeof (validation == 'function')) {\n        if (!validation.call(this, after, before, record, column)) {\n          return\n        }\n      }\n\n      this.onRecordChanged({ [column.name]: after }, row, column)\n    })\n\n    this.addEventListener('focus-change', e => {\n      this.focused = (e as CustomEvent).detail\n      this.focus()\n      this.requestUpdate()\n    })\n\n    /* record reset processing */\n    this.addEventListener('record-reset', e => {\n      var { record, row } = (e as CustomEvent).detail\n\n      this.onRecordChanged(record['__origin__'], row, null)\n    })\n  }\n\n  onWheelEvent(e: WheelEvent) {\n    var delta = Math.max(-1, Math.min(1, e.deltaY || 0))\n    this.body.scrollLeft = Math.max(0, this.body.scrollLeft - delta * 30)\n\n    supportsPassive || e.preventDefault()\n  }\n\n  onRecordChanged(\n    recordData: GristRecord,\n    row: number,\n    column: ColumnConfig | null /* TODO column should be removed */\n  ) {\n    // TODO 오브젝트나 배열 타입인 경우 deepCompare 후에 변경 적용 여부를 결정한다.\n\n    /* 빈 그리드로 시작한 경우, data 설정이 되어있지 않을 수 있다. */\n    var records = this.data.records\n\n    var beforeRecord: GristRecord = records[row]\n    var afterRecord: GristRecord\n    var wantToDelete = false\n    var wantToAppend = false\n\n    if (!recordData) {\n      if (!beforeRecord) {\n        /* recordData가 없고, beforeRecord도 없다면, 레코드 생성 중에 리셋된 경우이므로 아무것도 하지 않는다. */\n        this.requestUpdate()\n        return\n      } else {\n        /*\n         * beforeRecord가 있는데, 빈데이타로 업데이트하고자 한다면,\n         * 삭제하고자 하는 의도로 이해된다. (주의 필요)\n         */\n        if (beforeRecord['__dirty__'] == '+') {\n          wantToDelete = true\n        } else {\n          afterRecord = {\n            ...beforeRecord,\n            __dirty__: '-'\n          }\n        }\n      }\n    } else {\n      if (!beforeRecord) {\n        /* 기존 레코드가 없는 경우에는 새로운 레코드가 생성된다 */\n        afterRecord = {\n          ...recordData,\n          __dirty__: '+'\n        }\n\n        wantToAppend = true\n      } else {\n        let beforeDirty = beforeRecord.__dirty__\n        if (beforeDirty == '+') {\n          /* 기존에 새로 생성된 레코드가 있었으며 계속 수정중이다. */\n          afterRecord = {\n            ...beforeRecord,\n            ...recordData,\n            __dirty__: '+'\n          }\n        } else {\n          /* 기존에 레코드가 있었으며 계속 수정중이다. */\n          afterRecord = {\n            ...beforeRecord,\n            ...recordData,\n            __dirty__: 'M'\n          }\n        }\n      }\n    }\n\n    if (wantToAppend) {\n      records.push(afterRecord!)\n    } else if (wantToDelete) {\n      records.splice(row, 1)\n    } else {\n      records.splice(row, 1, afterRecord!)\n    }\n\n    this.dispatchEvent(\n      new CustomEvent('record-change', {\n        bubbles: true,\n        composed: true,\n        detail: {\n          before: beforeRecord,\n          after: afterRecord!,\n          column,\n          row\n        }\n      })\n    )\n  }\n\n  updated(changes: PropertyValues<this>) {\n    if (changes.has('config') || changes.has('data')) {\n      /*\n       * 데이타 내용에 따라 동적으로 컬럼의 폭이 달라지는 경우(예를 들면, sequence field)가 있으므로,\n       * data의 변동에 대해서도 다시 계산되어야 한다.\n       */\n      this.calculateWidths(this.config.columns)\n\n      if (this.focused && 'row' in this.focused) {\n        var { row = 0, column = 0 } = this.focused\n        var { records: oldrecords = [] } = changes.get('data') as any\n        var { records: newrecords } = this.data\n\n        var oldrecord = oldrecords[row]\n\n        if (oldrecord && oldrecord !== newrecords[row]) {\n          var newrecord = newrecords.find(\n            record =>\n              /* TODO keyfields를 정의하고, keyfields의 동일성으로 확정해야 한다. */\n              oldrecord === record ||\n              ('id' in oldrecord && record.id == oldrecord.id) ||\n              ('name' in oldrecord && record.name == oldrecord.name)\n          )\n\n          this.focused = {\n            row: newrecord ? newrecords.indexOf(newrecord) : row,\n            column\n          }\n        }\n      }\n    }\n\n    this.focus()\n  }\n\n  calculateWidths(columns: ColumnConfig[]) {\n    /*\n     * 컬럼 모델 마지막에 'auto' cell을 추가하여, 자투리 영역을 꽉 채워서 표시한다.\n     */\n    this._widths = columns\n      .filter(column => !column.hidden)\n      .map(column => {\n        switch (typeof column.width) {\n          case 'number':\n            return column.width + 'px'\n          case 'string':\n            return column.width\n          case 'function':\n            return column.width.call(this, column)\n          default:\n            return 'auto'\n        }\n      })\n      .concat(['auto'])\n      .join(' ')\n\n    this.style.setProperty('--grid-template-columns', this._widths)\n    this.style.setProperty('--grid-template-print-columns', this._widths.replace(/px/gi, 'fr'))\n  }\n\n  render() {\n    var { pagination = {} as PaginationConfig, columns = [] } = this.config\n\n    var paginatable = !pagination.infinite\n    var data = this.data\n\n    return html`\n      <ox-grid-header\n        .config=${this.config}\n        .columns=${columns}\n        .data=${data}\n        @column-width-change=${(e: CustomEvent) => {\n          let { idx, width } = e.detail\n          columns[idx].width = width\n          this.calculateWidths(columns)\n        }}\n      ></ox-grid-header>\n\n      <ox-grid-body .config=${this.config} .columns=${columns} .data=${data} .focused=${this.focused}></ox-grid-body>\n\n      ${paginatable ? html` <ox-grid-footer .config=${this.config} .data=${data}></ox-grid-footer> ` : html``}\n    `\n  }\n\n  focus() {\n    super.focus()\n\n    this.body.focus()\n  }\n\n  get pullToRefreshTarget() {\n    return this.body\n  }\n}\n"]}
+{"version":3,"file":"data-grid.js","sourceRoot":"","sources":["../../../src/data-grid/data-grid.ts"],"names":[],"mappings":"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","sourcesContent":["import './data-grid-header'\nimport './data-grid-body'\nimport './data-grid-footer'\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { ScrollbarStyles } from '@operato/styles'\n\nimport { DataManipulator } from '../data-manipulator'\nimport { ColumnConfig, GristRecord, PaginationConfig } from '../types'\nimport { supportsPassive } from '../utils'\nimport { DataGridHeader } from './data-grid-header'\n\n/**\n * DataGrid\n */\n@customElement('ox-grid')\nexport class DataGrid extends DataManipulator {\n  static styles = [\n    ScrollbarStyles,\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n\n        overflow: hidden;\n\n        border-width: var(--grid-container-border-width);\n      }\n\n      ox-grid-body {\n        flex: 1;\n      }\n\n      @media print {\n        :host {\n          zoom: 80%;\n        }\n      }\n    `\n  ]\n\n  @property({ type: Object }) focused?: { row: number; column: number }\n\n  @query('ox-grid-body', true) body!: LitElement\n  @query('ox-grid-header', true) header!: DataGridHeader\n  @query('ox-grid-footer', true) footer!: LitElement\n\n  private _widths?: string\n\n  firstUpdated() {\n    /* header and body scroll synchronization */\n    this.header.addEventListener('scroll', e => {\n      if (this.body.scrollLeft !== this.header.scrollLeft) {\n        this.body.scrollLeft = this.header.scrollLeft\n      }\n    })\n\n    this.body.addEventListener('scroll', e => {\n      if (this.body.scrollLeft !== this.header.scrollLeft) {\n        this.header.scrollLeft = this.body.scrollLeft\n      }\n    })\n\n    this.header.addEventListener('wheel', this.onWheelEvent.bind(this))\n    this.footer && this.footer.addEventListener('wheel', this.onWheelEvent.bind(this))\n\n    /* record selection processing */\n    this.addEventListener('select-all-change', e => {\n      if (this.data.records.length == 0) {\n        return\n      }\n\n      var { selected } = (e as CustomEvent).detail\n      var { records } = this.data\n\n      records.forEach(record => (record['__selected__'] = selected))\n\n      this.header.requestUpdate()\n      this.body.requestUpdate()\n    })\n\n    this.addEventListener('focus-change', e => {\n      this.focused = (e as CustomEvent).detail\n      this.focus()\n      this.requestUpdate()\n    })\n  }\n\n  onWheelEvent(e: WheelEvent) {\n    var delta = Math.max(-1, Math.min(1, e.deltaY || 0))\n    this.body.scrollLeft = Math.max(0, this.body.scrollLeft - delta * 30)\n\n    supportsPassive || e.preventDefault()\n  }\n\n  onSelectRecordChanged({\n    selectedRecords,\n    added,\n    removed\n  }: {\n    selectedRecords: GristRecord[]\n    added: GristRecord[]\n    removed: GristRecord[]\n  }): void {\n    super.onSelectRecordChanged({ selectedRecords, added, removed })\n\n    this.header.requestUpdate()\n    this.body.requestUpdate()\n  }\n\n  onRecordChanged(\n    recordData: GristRecord,\n    row: number,\n    column: ColumnConfig | null /* TODO column should be removed */\n  ) {\n    /* record-viewer 등 grid 외에서 변경되는 경우에도 header와 body를 refresh 하도록 한다. */\n    super.onRecordChanged(recordData, row, column)\n\n    this.header.requestUpdate()\n    this.body.requestUpdate()\n  }\n\n  updated(changes: PropertyValues<this>) {\n    if (changes.has('config') || changes.has('data')) {\n      /*\n       * 데이타 내용에 따라 동적으로 컬럼의 폭이 달라지는 경우(예를 들면, sequence field)가 있으므로,\n       * data의 변동에 대해서도 다시 계산되어야 한다.\n       */\n      this.calculateWidths(this.config.columns)\n\n      if (this.focused && 'row' in this.focused) {\n        var { row = 0, column = 0 } = this.focused\n        var { records: oldrecords = [] } = changes.get('data') as any\n        var { records: newrecords } = this.data\n\n        var oldrecord = oldrecords[row]\n\n        if (oldrecord && oldrecord !== newrecords[row]) {\n          var newrecord = newrecords.find(\n            record =>\n              /* TODO keyfields를 정의하고, keyfields의 동일성으로 확정해야 한다. */\n              oldrecord === record ||\n              ('id' in oldrecord && record.id == oldrecord.id) ||\n              ('name' in oldrecord && record.name == oldrecord.name)\n          )\n\n          this.focused = {\n            row: newrecord ? newrecords.indexOf(newrecord) : row,\n            column\n          }\n        }\n      }\n    }\n\n    this.focus()\n  }\n\n  calculateWidths(columns: ColumnConfig[]) {\n    /*\n     * 컬럼 모델 마지막에 'auto' cell을 추가하여, 자투리 영역을 꽉 채워서 표시한다.\n     */\n    this._widths = columns\n      .filter(column => !column.hidden)\n      .map(column => {\n        switch (typeof column.width) {\n          case 'number':\n            return column.width + 'px'\n          case 'string':\n            return column.width\n          case 'function':\n            return column.width.call(this, column)\n          default:\n            return 'auto'\n        }\n      })\n      .concat(['auto'])\n      .join(' ')\n\n    this.style.setProperty('--grid-template-columns', this._widths)\n    this.style.setProperty('--grid-template-print-columns', this._widths.replace(/px/gi, 'fr'))\n  }\n\n  render() {\n    var { pagination = {} as PaginationConfig, columns = [] } = this.config\n\n    var paginatable = !pagination.infinite\n    var data = this.data\n\n    return html`\n      <ox-grid-header\n        .config=${this.config}\n        .columns=${columns}\n        .data=${data}\n        @column-width-change=${(e: CustomEvent) => {\n          let { idx, width } = e.detail\n          columns[idx].width = width\n          this.calculateWidths(columns)\n        }}\n      ></ox-grid-header>\n\n      <ox-grid-body .config=${this.config} .columns=${columns} .data=${data} .focused=${this.focused}></ox-grid-body>\n\n      ${paginatable ? html` <ox-grid-footer .config=${this.config} .data=${data}></ox-grid-footer> ` : html``}\n    `\n  }\n\n  focus() {\n    super.focus()\n\n    this.body.focus()\n  }\n\n  get pullToRefreshTarget() {\n    return this.body\n  }\n}\n"]}

package/dist/src/data-grist.d.ts

@@ -36,6 +36,7 @@ export declare class DataGrist extends LitElement implements DataConsumer {
     render(): import("lit-html").TemplateResult<1>;
     fetch(reset?: boolean): Promise<void>;
     updated(changes: PropertyValues<this>): Promise<void>;
+    get compiledConfig(): GristConfig;
     get sorters(): SortersConfig | undefined;
     get dirtyData(): GristData;
     get dirtyRecords(): GristRecord[];

package/dist/src/data-grist.js

@@ -171,6 +171,9 @@ let DataGrist = class DataGrist extends LitElement {
             await this._setPullToRefresh();
         }
     }
+    get compiledConfig() {
+        return this._config;
+    }
     get sorters() {
         var _a;
         return (_a = this._config) === null || _a === void 0 ? void 0 : _a.sorters;

package/dist/src/data-grist.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-grist.js","sourceRoot":"","sources":["../../src/data-grist.ts"],"names":[],"mappings":"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","sourcesContent":["import './data-grid/data-grid'\nimport './data-list/data-list'\nimport './data-card/data-card'\nimport './empty-note'\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property, query, queryAsync, state } from 'lit/decorators.js'\nimport isEmpty from 'lodash-es/isEmpty'\nimport isEqual from 'lodash-es/isEqual'\n\nimport Headroom from '@operato/headroom'\nimport { pulltorefresh } from '@operato/pull-to-refresh'\nimport { HeadroomStyles, ScrollbarStyles, SpinnerStyles } from '@operato/styles'\n\nimport { buildConfig } from './configure/config-builder'\nimport { ZERO_CONFIG, ZERO_DATA, ZERO_PAGINATION } from './configure/zero-config'\nimport { DataCard } from './data-card/data-card'\nimport { DataConsumer } from './data-consumer'\nimport { DataGrid } from './data-grid/data-grid'\nimport { DataList } from './data-list/data-list'\nimport { DataProvider } from './data-provider'\nimport { FetchHandler, GristConfig, GristData, GristRecord, SortersConfig } from './types'\n\n@customElement('ox-grist')\nexport class DataGrist extends LitElement implements DataConsumer {\n  static styles = [\n    ScrollbarStyles,\n    HeadroomStyles,\n    SpinnerStyles,\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n        box-sizing: border-box;\n        background-color: var(--grist-background-color);\n        min-height: 120px;\n\n        overflow: hidden;\n\n        /* for pulltorefresh controller */\n        position: relative;\n\n        --mdc-icon-size: var(--grid-record-wide-fontsize);\n      }\n\n      #wrap {\n        flex: 1;\n        display: flex;\n        flex-direction: column;\n        overflow: auto;\n      }\n\n      ox-grid,\n      ox-list {\n        flex: 1;\n      }\n\n      ox-empty-note {\n        display: block;\n        position: absolute;\n        left: 50%;\n        top: 50%;\n        transform: translate(-50%, -50%);\n      }\n\n      slot[name='headroom'] {\n        display: block;\n\n        position: absolute;\n        top: 0;\n        left: 0;\n\n        width: 100%;\n        box-sizing: border-box;\n      }\n    `\n  ]\n\n  @property() mode: string = 'GRID'\n  @property() config: any\n  @property() data: GristData = ZERO_DATA\n  @property() selectedRecords?: GristRecord[]\n  @property({ type: Boolean, attribute: 'auto-fetch' }) autoFetch: boolean = false\n  @property() fetchHandler?: FetchHandler\n  @property() fetchOptions: any\n\n  @state() _data: GristData = ZERO_DATA\n  @state() _config: GristConfig = ZERO_CONFIG\n  @state() private _showSpinner: boolean = false\n\n  private dataProvider?: DataProvider\n  private _pulltorefreshHandle?: any\n  private _headroom?: Headroom\n  private orginPaddingTop?: string\n  private originMarginTop?: string\n\n  @query('slot[name=headroom]') head!: HTMLElement\n  @query('#grist') grist!: DataGrid | DataList | DataCard\n  @queryAsync('#wrap') private wrap!: Promise<HTMLElement>\n\n  async connectedCallback() {\n    super.connectedCallback()\n\n    this.dataProvider = new DataProvider(this)\n\n    await this.updateComplete\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback()\n\n    this.dataProvider?.dispose()\n    this._resetPullToRefresh()\n  }\n\n  private _resetPullToRefresh() {\n    if (this._pulltorefreshHandle) {\n      this._pulltorefreshHandle()\n      delete this._pulltorefreshHandle\n    }\n  }\n\n  private async _setPullToRefresh() {\n    this._resetPullToRefresh()\n    if (this.fetchHandler) {\n      this._pulltorefreshHandle = pulltorefresh({\n        container: await this.wrap,\n        scrollable: this.grist.pullToRefreshTarget,\n        refresh: () => {\n          return this.fetch(true)\n        }\n      })\n    }\n  }\n\n  private _setHeadroom() {\n    this._headroom?.destroy()\n\n    if (this.grist && this.head) {\n      const style = getComputedStyle(this.grist)\n\n      this.orginPaddingTop = style.paddingTop || '0'\n      this.originMarginTop = style.marginTop || '0'\n\n      console.log(this.orginPaddingTop, this.originMarginTop)\n\n      this._headroom = new Headroom(this.head, {\n        scroller: this.grist,\n        onTop: () => {\n          this.grist.style.paddingTop = this.orginPaddingTop!\n\n          this.originMarginTop = this.grist.style.marginTop\n          this.grist.style.marginTop = this.head.clientHeight + 'px'\n        },\n        onNotTop: () => {\n          this.grist.style.marginTop = this.originMarginTop!\n\n          this.orginPaddingTop = this.grist.style.paddingTop\n          this.grist.style.paddingTop = this.head.clientHeight + 'px'\n        }\n      })\n      this._headroom.init()\n    }\n  }\n\n  render() {\n    var oops = !this._showSpinner && this._data.records.length == 0\n\n    return html`\n      ${oops\n        ? html`\n            <ox-empty-note\n              icon=\"list\"\n              title=\"EMPTY LIST\"\n              description=\"There are no records to be shown\"\n            ></ox-empty-note>\n          `\n        : html``}\n      <div id=\"wrap\">\n        ${this.mode == 'GRID'\n          ? html` <ox-grid id=\"grist\" .config=${this._config} .data=${this._data}> </ox-grid> `\n          : this.mode == 'CARD'\n          ? html` <ox-card id=\"grist\" .config=${this._config} .data=${this._data}> </ox-card> `\n          : html` <ox-list id=\"grist\" .config=${this._config} .data=${this._data}> </ox-list> `}\n      </div>\n\n      <div id=\"spinner\" ?show=${this._showSpinner}></div>\n\n      <slot name=\"headroom\"> </slot>\n    `\n  }\n\n  async fetch(reset = true) {\n    if (!this._config) {\n      /* avoid to be here */\n      console.warn('grist is not configured yet.')\n      return\n    }\n\n    if (reset && this.grist) {\n      /*\n       * scroll 의 현재위치에 의해서 scroll 이벤트가 발생할 수 있으므로, 이를 방지하기 위해서 스크롤의 위치를 TOP으로 옮긴다.\n       * (scroll 이 첫페이지 크기 이상으로 내려가 있는 경우, 첫페이지부터 다시 표시하는 경우에, scroll 이벤트가 발생한다.)\n       */\n      this.grist.scrollTop = 0\n    }\n\n    if (this.dataProvider) {\n      let { limit: initLimit, page: initPage, infinite } = this._config.pagination || {}\n      let { limit = initLimit || ZERO_PAGINATION.limit, page = initPage || ZERO_PAGINATION.page } = this.dataProvider\n\n      if (infinite || this.mode !== 'GRID') {\n        await this.dataProvider.attach(reset)\n      } else {\n        await this.dataProvider.fetch({\n          limit,\n          page,\n          sorters: this.sorters\n        })\n      }\n    }\n  }\n\n  async updated(changes: PropertyValues<this>) {\n    var needToSetPullToRefresh = false\n\n    if (changes.has('config')) {\n      this._config = buildConfig({\n        ...this.config\n      })\n\n      this.dataProvider && (this.dataProvider.sorters = this.sorters)\n      this.fetch()\n    }\n\n    if (changes.has('fetchHandler')) {\n      this.dataProvider && (this.dataProvider.fetchHandler = this.fetchHandler)\n      needToSetPullToRefresh = true\n    }\n\n    if (changes.has('fetchOptions')) {\n      this.dataProvider && (this.dataProvider.fetchOptions = this.fetchOptions)\n    }\n\n    if (changes.has('data')) {\n      this.reset()\n    }\n\n    if (changes.has('mode')) {\n      needToSetPullToRefresh = true\n      this._setHeadroom()\n    }\n\n    if (changes.has('selectedRecords')) {\n      var { records } = this.data || []\n      var selectedRecords = this.selectedRecords || []\n\n      var _records = this._data.records\n\n      /* 원본데이타에서 index를 찾아서, 복사본 데이타의 selected를 설정한다. */\n      selectedRecords.forEach(selected => {\n        var index = records.indexOf(selected)\n        var record = _records[index]\n        if (record) {\n          record['__selected__'] = true\n        }\n      })\n\n      /* update _data property intentionally */\n      this.refresh()\n    }\n\n    if (needToSetPullToRefresh) {\n      await this._setPullToRefresh()\n    }\n  }\n\n  get sorters(): SortersConfig | undefined {\n    return this._config?.sorters\n  }\n\n  get dirtyData(): GristData {\n    return (this.grist as any)?.data || {}\n  }\n\n  get dirtyRecords() {\n    var { records = [] } = this.dirtyData\n    return records.filter(record => record['__dirty__'])\n  }\n\n  exportPatchList({ flagName = 'patchFlag', addedFlag = '+', deletedFlag = '-', modifiedFlag = 'M', idField = 'id' }) {\n    let dirtyRecords = this.dirtyRecords\n    if (!dirtyRecords || dirtyRecords.length == 0) {\n      return []\n    }\n\n    return dirtyRecords.map(record => {\n      let flag = record.__dirty__\n\n      let patch = {\n        [flagName]: flag == 'M' ? modifiedFlag : flag == '+' ? addedFlag : deletedFlag\n      }\n\n      if (idField in record && record[idField]) {\n        patch[idField] = record[idField]\n      }\n\n      for (let key in record.__dirtyfields__) {\n        patch[key] = record[key]\n      }\n      return patch\n    })\n  }\n\n  exportRecords({ ifSelectedOnly = true, includeHiddenField = true } = {}) {\n    let records = ifSelectedOnly ? this.selected : this.data.records\n\n    if (ifSelectedOnly && (!records || records.length == 0)) {\n      records = this.data.records\n    }\n\n    let columns = this._config.columns.filter(column => column.type !== 'gutter')\n    if (!includeHiddenField) {\n      columns = columns.filter(column => !column.hidden)\n    }\n    let columnNames = columns.map(column => column.name)\n\n    return records.map(item => {\n      return columnNames.reduce((record, name) => {\n        record[name] = item[name]\n        return record\n      }, {} as any)\n    })\n  }\n\n  get selected() {\n    var { records = [] } = this.grist?.data\n    return records.filter(record => record['__selected__'])\n  }\n\n  showSpinner() {\n    this._showSpinner = true\n  }\n\n  hideSpinner() {\n    this._showSpinner = false\n  }\n\n  focus() {\n    super.focus()\n\n    this.grist.focus()\n  }\n\n  commit() {\n    var { page, total, limit, records } = this.grist.data\n\n    this.data = {\n      page,\n      total,\n      limit,\n      records: records.map(record => {\n        var copied = {\n          ...record\n        }\n\n        delete copied.__seq__\n        delete copied.__dirty__\n        delete copied.__selected__\n        delete copied.__changes__\n        delete copied.__dirtyfields__\n        delete copied.__origin__\n\n        return copied\n      })\n    }\n  }\n\n  /**\n   * Forced internal data to be reflected on the screen\n   * Data changing through a normal method is automatically reflected on the screen, so it is a method that does not need to be used in general.\n   * Therefore, it will be deprecated.\n   * @method\n   */\n  refresh() {\n    this._data = { ...this._data }\n  }\n\n  /**\n   * This method cancels all changes in the dirty state before being reflected in the data.\n   *\n   * @method\n   */\n  reset() {\n    var {\n      limit = ZERO_PAGINATION.limit,\n      page = ZERO_PAGINATION.page,\n      total = ZERO_PAGINATION.total,\n      records = []\n    } = this.data || ZERO_PAGINATION\n\n    /* 원본 데이타를 남기고, 복사본(_data)을 사용한다. */\n    records = records.map((record, idx) => {\n      return {\n        ...record,\n        __seq__: this.mode == 'GRID' ? (page - 1) * limit + idx + 1 : idx + 1,\n        __origin__: record\n      }\n    })\n\n    this._data = {\n      limit,\n      page,\n      total,\n      records\n    }\n  }\n\n  checkDirties() {\n    const records = this.dirtyRecords\n    const { columns = [] } = this._config || {}\n\n    for (var record of records || []) {\n      var origin = record['__origin__'] || {}\n\n      var dirtyFields = (record['__dirtyfields__'] = columns\n        .filter(column => column.type !== 'gutter' && !isEqual(origin[column.name], record[column.name]))\n        .reduce((sum, column) => {\n          var name = column.name\n\n          sum[name] = {\n            before: origin[name],\n            after: record[name]\n          }\n\n          return sum\n        }, {} as any))\n\n      if (record['__dirty__'] == 'M' && isEmpty(dirtyFields)) {\n        delete record['__dirty__']\n      }\n    }\n  }\n}\n"]}
+{"version":3,"file":"data-grist.js","sourceRoot":"","sources":["../../src/data-grist.ts"],"names":[],"mappings":"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","sourcesContent":["import './data-grid/data-grid'\nimport './data-list/data-list'\nimport './data-card/data-card'\nimport './empty-note'\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property, query, queryAsync, state } from 'lit/decorators.js'\nimport isEmpty from 'lodash-es/isEmpty'\nimport isEqual from 'lodash-es/isEqual'\n\nimport Headroom from '@operato/headroom'\nimport { pulltorefresh } from '@operato/pull-to-refresh'\nimport { HeadroomStyles, ScrollbarStyles, SpinnerStyles } from '@operato/styles'\n\nimport { buildConfig } from './configure/config-builder'\nimport { ZERO_CONFIG, ZERO_DATA, ZERO_PAGINATION } from './configure/zero-config'\nimport { DataCard } from './data-card/data-card'\nimport { DataConsumer } from './data-consumer'\nimport { DataGrid } from './data-grid/data-grid'\nimport { DataList } from './data-list/data-list'\nimport { DataProvider } from './data-provider'\nimport { FetchHandler, GristConfig, GristData, GristRecord, SortersConfig } from './types'\n\n@customElement('ox-grist')\nexport class DataGrist extends LitElement implements DataConsumer {\n  static styles = [\n    ScrollbarStyles,\n    HeadroomStyles,\n    SpinnerStyles,\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n        box-sizing: border-box;\n        background-color: var(--grist-background-color);\n        min-height: 120px;\n\n        overflow: hidden;\n\n        /* for pulltorefresh controller */\n        position: relative;\n\n        --mdc-icon-size: var(--grid-record-wide-fontsize);\n      }\n\n      #wrap {\n        flex: 1;\n        display: flex;\n        flex-direction: column;\n        overflow: auto;\n      }\n\n      ox-grid,\n      ox-list {\n        flex: 1;\n      }\n\n      ox-empty-note {\n        display: block;\n        position: absolute;\n        left: 50%;\n        top: 50%;\n        transform: translate(-50%, -50%);\n      }\n\n      slot[name='headroom'] {\n        display: block;\n\n        position: absolute;\n        top: 0;\n        left: 0;\n\n        width: 100%;\n        box-sizing: border-box;\n      }\n    `\n  ]\n\n  @property() mode: string = 'GRID'\n  @property() config: any\n  @property() data: GristData = ZERO_DATA\n  @property() selectedRecords?: GristRecord[]\n  @property({ type: Boolean, attribute: 'auto-fetch' }) autoFetch: boolean = false\n  @property() fetchHandler?: FetchHandler\n  @property() fetchOptions: any\n\n  @state() _data: GristData = ZERO_DATA\n  @state() _config: GristConfig = ZERO_CONFIG\n  @state() private _showSpinner: boolean = false\n\n  private dataProvider?: DataProvider\n  private _pulltorefreshHandle?: any\n  private _headroom?: Headroom\n  private orginPaddingTop?: string\n  private originMarginTop?: string\n\n  @query('slot[name=headroom]') head!: HTMLElement\n  @query('#grist') grist!: DataGrid | DataList | DataCard\n  @queryAsync('#wrap') private wrap!: Promise<HTMLElement>\n\n  async connectedCallback() {\n    super.connectedCallback()\n\n    this.dataProvider = new DataProvider(this)\n\n    await this.updateComplete\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback()\n\n    this.dataProvider?.dispose()\n    this._resetPullToRefresh()\n  }\n\n  private _resetPullToRefresh() {\n    if (this._pulltorefreshHandle) {\n      this._pulltorefreshHandle()\n      delete this._pulltorefreshHandle\n    }\n  }\n\n  private async _setPullToRefresh() {\n    this._resetPullToRefresh()\n    if (this.fetchHandler) {\n      this._pulltorefreshHandle = pulltorefresh({\n        container: await this.wrap,\n        scrollable: this.grist.pullToRefreshTarget,\n        refresh: () => {\n          return this.fetch(true)\n        }\n      })\n    }\n  }\n\n  private _setHeadroom() {\n    this._headroom?.destroy()\n\n    if (this.grist && this.head) {\n      const style = getComputedStyle(this.grist)\n\n      this.orginPaddingTop = style.paddingTop || '0'\n      this.originMarginTop = style.marginTop || '0'\n\n      console.log(this.orginPaddingTop, this.originMarginTop)\n\n      this._headroom = new Headroom(this.head, {\n        scroller: this.grist,\n        onTop: () => {\n          this.grist.style.paddingTop = this.orginPaddingTop!\n\n          this.originMarginTop = this.grist.style.marginTop\n          this.grist.style.marginTop = this.head.clientHeight + 'px'\n        },\n        onNotTop: () => {\n          this.grist.style.marginTop = this.originMarginTop!\n\n          this.orginPaddingTop = this.grist.style.paddingTop\n          this.grist.style.paddingTop = this.head.clientHeight + 'px'\n        }\n      })\n      this._headroom.init()\n    }\n  }\n\n  render() {\n    var oops = !this._showSpinner && this._data.records.length == 0\n\n    return html`\n      ${oops\n        ? html`\n            <ox-empty-note\n              icon=\"list\"\n              title=\"EMPTY LIST\"\n              description=\"There are no records to be shown\"\n            ></ox-empty-note>\n          `\n        : html``}\n      <div id=\"wrap\">\n        ${this.mode == 'GRID'\n          ? html` <ox-grid id=\"grist\" .config=${this._config} .data=${this._data}> </ox-grid> `\n          : this.mode == 'CARD'\n          ? html` <ox-card id=\"grist\" .config=${this._config} .data=${this._data}> </ox-card> `\n          : html` <ox-list id=\"grist\" .config=${this._config} .data=${this._data}> </ox-list> `}\n      </div>\n\n      <div id=\"spinner\" ?show=${this._showSpinner}></div>\n\n      <slot name=\"headroom\"> </slot>\n    `\n  }\n\n  async fetch(reset = true) {\n    if (!this._config) {\n      /* avoid to be here */\n      console.warn('grist is not configured yet.')\n      return\n    }\n\n    if (reset && this.grist) {\n      /*\n       * scroll 의 현재위치에 의해서 scroll 이벤트가 발생할 수 있으므로, 이를 방지하기 위해서 스크롤의 위치를 TOP으로 옮긴다.\n       * (scroll 이 첫페이지 크기 이상으로 내려가 있는 경우, 첫페이지부터 다시 표시하는 경우에, scroll 이벤트가 발생한다.)\n       */\n      this.grist.scrollTop = 0\n    }\n\n    if (this.dataProvider) {\n      let { limit: initLimit, page: initPage, infinite } = this._config.pagination || {}\n      let { limit = initLimit || ZERO_PAGINATION.limit, page = initPage || ZERO_PAGINATION.page } = this.dataProvider\n\n      if (infinite || this.mode !== 'GRID') {\n        await this.dataProvider.attach(reset)\n      } else {\n        await this.dataProvider.fetch({\n          limit,\n          page,\n          sorters: this.sorters\n        })\n      }\n    }\n  }\n\n  async updated(changes: PropertyValues<this>) {\n    var needToSetPullToRefresh = false\n\n    if (changes.has('config')) {\n      this._config = buildConfig({\n        ...this.config\n      })\n\n      this.dataProvider && (this.dataProvider.sorters = this.sorters)\n      this.fetch()\n    }\n\n    if (changes.has('fetchHandler')) {\n      this.dataProvider && (this.dataProvider.fetchHandler = this.fetchHandler)\n      needToSetPullToRefresh = true\n    }\n\n    if (changes.has('fetchOptions')) {\n      this.dataProvider && (this.dataProvider.fetchOptions = this.fetchOptions)\n    }\n\n    if (changes.has('data')) {\n      this.reset()\n    }\n\n    if (changes.has('mode')) {\n      needToSetPullToRefresh = true\n      this._setHeadroom()\n    }\n\n    if (changes.has('selectedRecords')) {\n      var { records } = this.data || []\n      var selectedRecords = this.selectedRecords || []\n\n      var _records = this._data.records\n\n      /* 원본데이타에서 index를 찾아서, 복사본 데이타의 selected를 설정한다. */\n      selectedRecords.forEach(selected => {\n        var index = records.indexOf(selected)\n        var record = _records[index]\n        if (record) {\n          record['__selected__'] = true\n        }\n      })\n\n      /* update _data property intentionally */\n      this.refresh()\n    }\n\n    if (needToSetPullToRefresh) {\n      await this._setPullToRefresh()\n    }\n  }\n\n  get compiledConfig(): GristConfig {\n    return this._config\n  }\n\n  get sorters(): SortersConfig | undefined {\n    return this._config?.sorters\n  }\n\n  get dirtyData(): GristData {\n    return (this.grist as any)?.data || {}\n  }\n\n  get dirtyRecords() {\n    var { records = [] } = this.dirtyData\n    return records.filter(record => record['__dirty__'])\n  }\n\n  exportPatchList({ flagName = 'patchFlag', addedFlag = '+', deletedFlag = '-', modifiedFlag = 'M', idField = 'id' }) {\n    let dirtyRecords = this.dirtyRecords\n    if (!dirtyRecords || dirtyRecords.length == 0) {\n      return []\n    }\n\n    return dirtyRecords.map(record => {\n      let flag = record.__dirty__\n\n      let patch = {\n        [flagName]: flag == 'M' ? modifiedFlag : flag == '+' ? addedFlag : deletedFlag\n      }\n\n      if (idField in record && record[idField]) {\n        patch[idField] = record[idField]\n      }\n\n      for (let key in record.__dirtyfields__) {\n        patch[key] = record[key]\n      }\n      return patch\n    })\n  }\n\n  exportRecords({ ifSelectedOnly = true, includeHiddenField = true } = {}) {\n    let records = ifSelectedOnly ? this.selected : this.data.records\n\n    if (ifSelectedOnly && (!records || records.length == 0)) {\n      records = this.data.records\n    }\n\n    let columns = this._config.columns.filter(column => column.type !== 'gutter')\n    if (!includeHiddenField) {\n      columns = columns.filter(column => !column.hidden)\n    }\n    let columnNames = columns.map(column => column.name)\n\n    return records.map(item => {\n      return columnNames.reduce((record, name) => {\n        record[name] = item[name]\n        return record\n      }, {} as any)\n    })\n  }\n\n  get selected() {\n    var { records = [] } = this.grist?.data\n    return records.filter(record => record['__selected__'])\n  }\n\n  showSpinner() {\n    this._showSpinner = true\n  }\n\n  hideSpinner() {\n    this._showSpinner = false\n  }\n\n  focus() {\n    super.focus()\n\n    this.grist.focus()\n  }\n\n  commit() {\n    var { page, total, limit, records } = this.grist.data\n\n    this.data = {\n      page,\n      total,\n      limit,\n      records: records.map(record => {\n        var copied = {\n          ...record\n        }\n\n        delete copied.__seq__\n        delete copied.__dirty__\n        delete copied.__selected__\n        delete copied.__changes__\n        delete copied.__dirtyfields__\n        delete copied.__origin__\n\n        return copied\n      })\n    }\n  }\n\n  /**\n   * Forced internal data to be reflected on the screen\n   * Data changing through a normal method is automatically reflected on the screen, so it is a method that does not need to be used in general.\n   * Therefore, it will be deprecated.\n   * @method\n   */\n  refresh() {\n    this._data = { ...this._data }\n  }\n\n  /**\n   * This method cancels all changes in the dirty state before being reflected in the data.\n   *\n   * @method\n   */\n  reset() {\n    var {\n      limit = ZERO_PAGINATION.limit,\n      page = ZERO_PAGINATION.page,\n      total = ZERO_PAGINATION.total,\n      records = []\n    } = this.data || ZERO_PAGINATION\n\n    /* 원본 데이타를 남기고, 복사본(_data)을 사용한다. */\n    records = records.map((record, idx) => {\n      return {\n        ...record,\n        __seq__: this.mode == 'GRID' ? (page - 1) * limit + idx + 1 : idx + 1,\n        __origin__: record\n      }\n    })\n\n    this._data = {\n      limit,\n      page,\n      total,\n      records\n    }\n  }\n\n  checkDirties() {\n    const records = this.dirtyRecords\n    const { columns = [] } = this._config || {}\n\n    for (var record of records || []) {\n      var origin = record['__origin__'] || {}\n\n      var dirtyFields = (record['__dirtyfields__'] = columns\n        .filter(column => column.type !== 'gutter' && !isEqual(origin[column.name], record[column.name]))\n        .reduce((sum, column) => {\n          var name = column.name\n\n          sum[name] = {\n            before: origin[name],\n            after: record[name]\n          }\n\n          return sum\n        }, {} as any))\n\n      if (record['__dirty__'] == 'M' && isEmpty(dirtyFields)) {\n        delete record['__dirty__']\n      }\n    }\n  }\n}\n"]}

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

@@ -1,18 +1,15 @@
 import '@material/mwc-icon';
 import './record-partial';
-import { LitElement, PropertyValues } from 'lit';
-import { ColumnConfig, GristConfig, GristData, GristRecord } from '../types';
-export declare class DataList extends LitElement {
+import { PropertyValues } from 'lit';
+import { DataManipulator } from '../data-manipulator';
+export declare class DataList extends DataManipulator {
     static styles: import("lit").CSSResult[];
-    config: GristConfig;
-    data: GristData;
     isTop: boolean;
     private _records;
     private _total;
     private _limit;
     private _page;
     firstUpdated(changes: PropertyValues<this>): void;
-    onRecordChanged(recordData: GristRecord, row: number, column: ColumnConfig | null): void;
     updated(changes: PropertyValues<this>): void;
     render(): import("lit-html").TemplateResult<1>;
     gotoTop(e: Event): void;

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

@@ -1,14 +1,12 @@
 import { __decorate } from "tslib";
 import '@material/mwc-icon';
 import './record-partial';
-import { css, html, LitElement } from 'lit';
+import { css, html } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
-import { ZERO_CONFIG, ZERO_DATA } from '../configure/zero-config';
-let DataList = class DataList extends LitElement {
+import { DataManipulator } from '../data-manipulator';
+let DataList = class DataList extends DataManipulator {
     constructor() {
         super(...arguments);
-        this.config = ZERO_CONFIG;
-        this.data = ZERO_DATA;
         this.isTop = false;
         this._records = [];
         this._total = 0;
@@ -31,126 +29,6 @@ let DataList = class DataList extends LitElement {
             }
             this.isTop = this.scrollTop == 0;
         });
-        this.addEventListener('select-record-change', e => {
-            var { records: selectedRecords, added = [], removed = [] } = e.detail;
-            var { records } = this.data || {};
-            var { selectable = false } = this.config.rows || {};
-            if (!records || !selectable) {
-                return;
-            }
-            else if (selectable && !selectable.multiple) {
-                records.forEach(record => (record['__selected__'] = false));
-            }
-            if (selectedRecords) {
-                records.forEach(record => (record['__selected__'] = false));
-                selectedRecords.forEach(record => (record['__selected__'] = true));
-            }
-            else {
-                removed.forEach(record => (record['__selected__'] = false));
-                added.forEach(record => (record['__selected__'] = true));
-            }
-            this.requestUpdate();
-        });
-        /* field change processing */
-        this.addEventListener('field-change', e => {
-            var { after, before, column, record, row } = e.detail;
-            /* compare changes */
-            if (after === before) {
-                return;
-            }
-            var validation = column.validation;
-            if (validation && typeof validation == 'function') {
-                if (!validation.call(this, after, before, record, column)) {
-                    return;
-                }
-            }
-            this.onRecordChanged({ [column.name]: after }, row, column);
-        });
-        /* record reset processing */
-        this.addEventListener('record-reset', e => {
-            var { record, row } = e.detail;
-            this.onRecordChanged(record['__origin__'], row, null);
-        });
-    }
-    onRecordChanged(recordData, row, column /* TODO column should be removed */) {
-        // TODO 오브젝트나 배열 타입인 경우 deepCompare 후에 변경 적용 여부를 결정한다.
-        /* 빈 그리드로 시작한 경우, data 설정이 되어있지 않을 수 있다. */
-        var records = this.data.records;
-        var beforeRecord = records[row];
-        var afterRecord;
-        var wantToDelete = false;
-        var wantToAppend = false;
-        if (!recordData) {
-            if (!beforeRecord) {
-                /* recordData가 없고, beforeRecord도 없다면, 레코드 생성 중에 리셋된 경우이므로 아무것도 하지 않는다. */
-                this.requestUpdate();
-                return;
-            }
-            else {
-                /*
-                 * beforeRecord가 있는데, 빈데이타로 업데이트하고자 한다면,
-                 * 삭제하고자 하는 의도로 이해된다. (주의 필요)
-                 */
-                if (beforeRecord['__dirty__'] == '+') {
-                    wantToDelete = true;
-                }
-                else {
-                    afterRecord = {
-                        ...beforeRecord,
-                        __dirty__: '-'
-                    };
-                }
-            }
-        }
-        else {
-            if (!beforeRecord) {
-                /* 기존 레코드가 없는 경우에는 새로운 레코드가 생성된다 */
-                afterRecord = {
-                    ...recordData,
-                    __dirty__: '+'
-                };
-                wantToAppend = true;
-            }
-            else {
-                let beforeDirty = beforeRecord['__dirty__'];
-                if (beforeDirty == '+') {
-                    /* 기존에 새로 생성된 레코드가 있었으며 계속 수정중이다. */
-                    afterRecord = {
-                        ...beforeRecord,
-                        ...recordData,
-                        __dirty__: '+'
-                    };
-                }
-                else {
-                    /* 기존에 레코드가 있었으며 계속 수정중이다. */
-                    afterRecord = {
-                        ...beforeRecord,
-                        ...recordData,
-                        __dirty__: 'M'
-                    };
-                }
-            }
-        }
-        if (wantToAppend) {
-            records.push(afterRecord);
-        }
-        else if (wantToDelete) {
-            records.splice(row, 1);
-        }
-        else {
-            records.splice(row, 1, afterRecord);
-        }
-        this.dispatchEvent(new CustomEvent('record-change', {
-            bubbles: true,
-            composed: true,
-            detail: {
-                before: beforeRecord,
-                after: afterRecord,
-                column,
-                row
-            }
-        }));
-        this.requestUpdate();
     }
     updated(changes) {
         if (changes.has('config')) {
@@ -225,12 +103,6 @@ DataList.styles = [
       }
     `
 ];
-__decorate([
-    property({ type: Object })
-], DataList.prototype, "config", void 0);
-__decorate([
-    property({ type: Object })
-], DataList.prototype, "data", void 0);
 __decorate([
     property({ type: Boolean })
 ], DataList.prototype, "isTop", void 0);

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

@@ -1 +1 @@
-{"version":3,"file":"data-list.js","sourceRoot":"","sources":["../../../src/data-list/data-list.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/mwc-icon'\nimport './record-partial'\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { ZERO_CONFIG, ZERO_DATA } from '../configure/zero-config'\nimport { ColumnConfig, GristConfig, GristData, GristRecord } from '../types'\n\n@customElement('ox-list')\nexport class DataList extends LitElement {\n  static styles = [\n    css`\n      :host {\n        background-color: var(--data-list-background-color);\n        overflow-y: auto;\n      }\n\n      :nth-child(even) {\n        background-color: var(--theme-white-color);\n      }\n\n      [selected-row] {\n        background-color: var(--data-list-selected-background-color);\n      }\n\n      #upward {\n        --mdc-icon-size: 26px;\n        position: absolute;\n        top: var(--data-list-fab-position-vertical);\n        right: var(--data-list-fab-position-horizontal);\n        background-color: rgba(255, 255, 255, 0.7);\n        border-radius: 20px;\n        color: var(--data-list-fab-color);\n        box-shadow: var(--data-list-fab-shadow);\n        padding: 7px;\n      }\n\n      slot {\n        width: 100%;\n      }\n    `\n  ]\n\n  @property({ type: Object }) config: GristConfig = ZERO_CONFIG\n  @property({ type: Object }) data: GristData = ZERO_DATA\n  @property({ type: Boolean }) isTop: boolean = false\n  @property({ type: Array }) private _records: GristRecord[] = []\n\n  private _total: number = 0\n  private _limit: number = 20\n  private _page: number = 1\n\n  firstUpdated(changes: PropertyValues<this>) {\n    this.isTop = true\n\n    /* infinite scrolling */\n    this.addEventListener('scroll', e => {\n      const totalScrollHeight = this.scrollHeight\n      const screenHeight = this.offsetHeight\n      const currentScrollTop = this.scrollTop\n\n      if (totalScrollHeight <= screenHeight + currentScrollTop + 1) {\n        /* 마지막 페이지까지 계속 페이지를 증가시킨다. */\n        var lastPage = Math.ceil(this._total / this._limit)\n\n        if (this._page < lastPage) {\n          this.dispatchEvent(new CustomEvent('attach-page', { bubbles: true, composed: true }))\n        }\n      }\n\n      this.isTop = this.scrollTop == 0\n    })\n\n    this.addEventListener('select-record-change', e => {\n      var {\n        records: selectedRecords,\n        added = [],\n        removed = []\n      } = (e as CustomEvent).detail as {\n        records: GristRecord[]\n        added: GristRecord[]\n        removed: GristRecord[]\n      }\n      var { records } = this.data || {}\n      var { selectable = false } = this.config.rows || {}\n\n      if (!records || !selectable) {\n        return\n      } else if (selectable && !selectable.multiple) {\n        records.forEach(record => (record['__selected__'] = false))\n      }\n\n      if (selectedRecords) {\n        records.forEach(record => (record['__selected__'] = false))\n        selectedRecords.forEach(record => (record['__selected__'] = true))\n      } else {\n        removed.forEach(record => (record['__selected__'] = false))\n        added.forEach(record => (record['__selected__'] = true))\n      }\n\n      this.requestUpdate()\n    })\n\n    /* field change processing */\n    this.addEventListener('field-change', e => {\n      var { after, before, column, record, row } = (e as CustomEvent).detail as {\n        after: any\n        before: any\n        column: ColumnConfig\n        record: GristRecord\n        row: number\n      }\n\n      /* compare changes */\n      if (after === before) {\n        return\n      }\n\n      var validation = column.validation\n      if (validation && typeof validation == 'function') {\n        if (!validation.call(this, after, before, record, column)) {\n          return\n        }\n      }\n\n      this.onRecordChanged({ [column.name]: after }, row, column)\n    })\n\n    /* record reset processing */\n    this.addEventListener('record-reset', e => {\n      var { record, row } = (e as CustomEvent).detail as {\n        record: GristRecord\n        row: number\n      }\n\n      this.onRecordChanged(record['__origin__'], row, null)\n    })\n  }\n\n  onRecordChanged(\n    recordData: GristRecord,\n    row: number,\n    column: ColumnConfig | null /* TODO column should be removed */\n  ) {\n    // TODO 오브젝트나 배열 타입인 경우 deepCompare 후에 변경 적용 여부를 결정한다.\n\n    /* 빈 그리드로 시작한 경우, data 설정이 되어있지 않을 수 있다. */\n    var records = this.data.records\n\n    var beforeRecord = records[row]\n    var afterRecord: GristRecord\n    var wantToDelete = false\n    var wantToAppend = false\n\n    if (!recordData) {\n      if (!beforeRecord) {\n        /* recordData가 없고, beforeRecord도 없다면, 레코드 생성 중에 리셋된 경우이므로 아무것도 하지 않는다. */\n        this.requestUpdate()\n        return\n      } else {\n        /*\n         * beforeRecord가 있는데, 빈데이타로 업데이트하고자 한다면,\n         * 삭제하고자 하는 의도로 이해된다. (주의 필요)\n         */\n        if (beforeRecord['__dirty__'] == '+') {\n          wantToDelete = true\n        } else {\n          afterRecord = {\n            ...beforeRecord,\n            __dirty__: '-'\n          }\n        }\n      }\n    } else {\n      if (!beforeRecord) {\n        /* 기존 레코드가 없는 경우에는 새로운 레코드가 생성된다 */\n        afterRecord = {\n          ...recordData,\n          __dirty__: '+'\n        }\n\n        wantToAppend = true\n      } else {\n        let beforeDirty = beforeRecord['__dirty__']\n        if (beforeDirty == '+') {\n          /* 기존에 새로 생성된 레코드가 있었으며 계속 수정중이다. */\n          afterRecord = {\n            ...beforeRecord,\n            ...recordData,\n            __dirty__: '+'\n          }\n        } else {\n          /* 기존에 레코드가 있었으며 계속 수정중이다. */\n          afterRecord = {\n            ...beforeRecord,\n            ...recordData,\n            __dirty__: 'M'\n          }\n        }\n      }\n    }\n\n    if (wantToAppend) {\n      records.push(afterRecord!)\n    } else if (wantToDelete) {\n      records.splice(row, 1)\n    } else {\n      records.splice(row, 1, afterRecord!)\n    }\n\n    this.dispatchEvent(\n      new CustomEvent('record-change', {\n        bubbles: true,\n        composed: true,\n        detail: {\n          before: beforeRecord,\n          after: afterRecord!,\n          column,\n          row\n        }\n      })\n    )\n\n    this.requestUpdate()\n  }\n\n  updated(changes: PropertyValues<this>) {\n    if (changes.has('config')) {\n      this._records = []\n      this._page = 1\n    }\n\n    if (changes.has('data')) {\n      this._records = this.data.records\n      this._total = this.data.total || 0\n      this._limit = this.data.limit || 20\n      this._page = this.data.page || 0\n    }\n  }\n\n  render() {\n    var records = this._records || []\n\n    if (this.config && this.config.rows.appendable) {\n      records = [...records, { __dirty__: '+' }]\n    }\n\n    return html`\n      ${records.map(\n        (record, rowIndex) => html`\n          <ox-record-partial\n            .config=${this.config}\n            .data=${this.data}\n            .record=${record}\n            .rowIndex=${rowIndex}\n            ?selected-row=${record['__selected__']}\n            ?dirty=${record['__dirty__']}\n          ></ox-record-partial>\n        `\n      )}\n      ${this.isTop\n        ? html``\n        : html` <mwc-icon id=\"upward\" @click=${(e: Event) => this.gotoTop(e)}>arrow_upward</mwc-icon> `}\n    `\n  }\n\n  gotoTop(e: Event) {\n    this.scrollTop = 0\n\n    e.stopPropagation()\n  }\n\n  get pullToRefreshTarget() {\n    return this\n  }\n}\n"]}
+{"version":3,"file":"data-list.js","sourceRoot":"","sources":["../../../src/data-list/data-list.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/mwc-icon'\nimport './record-partial'\n\nimport { css, html, PropertyValues } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { DataManipulator } from '../data-manipulator'\nimport { GristRecord } from '../types'\n\n@customElement('ox-list')\nexport class DataList extends DataManipulator {\n  static styles = [\n    css`\n      :host {\n        background-color: var(--data-list-background-color);\n        overflow-y: auto;\n      }\n\n      :nth-child(even) {\n        background-color: var(--theme-white-color);\n      }\n\n      [selected-row] {\n        background-color: var(--data-list-selected-background-color);\n      }\n\n      #upward {\n        --mdc-icon-size: 26px;\n        position: absolute;\n        top: var(--data-list-fab-position-vertical);\n        right: var(--data-list-fab-position-horizontal);\n        background-color: rgba(255, 255, 255, 0.7);\n        border-radius: 20px;\n        color: var(--data-list-fab-color);\n        box-shadow: var(--data-list-fab-shadow);\n        padding: 7px;\n      }\n\n      slot {\n        width: 100%;\n      }\n    `\n  ]\n\n  @property({ type: Boolean }) isTop: boolean = false\n  @property({ type: Array }) private _records: GristRecord[] = []\n\n  private _total: number = 0\n  private _limit: number = 20\n  private _page: number = 1\n\n  firstUpdated(changes: PropertyValues<this>) {\n    this.isTop = true\n\n    /* infinite scrolling */\n    this.addEventListener('scroll', e => {\n      const totalScrollHeight = this.scrollHeight\n      const screenHeight = this.offsetHeight\n      const currentScrollTop = this.scrollTop\n\n      if (totalScrollHeight <= screenHeight + currentScrollTop + 1) {\n        /* 마지막 페이지까지 계속 페이지를 증가시킨다. */\n        var lastPage = Math.ceil(this._total / this._limit)\n\n        if (this._page < lastPage) {\n          this.dispatchEvent(new CustomEvent('attach-page', { bubbles: true, composed: true }))\n        }\n      }\n\n      this.isTop = this.scrollTop == 0\n    })\n  }\n\n  updated(changes: PropertyValues<this>) {\n    if (changes.has('config')) {\n      this._records = []\n      this._page = 1\n    }\n\n    if (changes.has('data')) {\n      this._records = this.data.records\n      this._total = this.data.total || 0\n      this._limit = this.data.limit || 20\n      this._page = this.data.page || 0\n    }\n  }\n\n  render() {\n    var records = this._records || []\n\n    if (this.config && this.config.rows.appendable) {\n      records = [...records, { __dirty__: '+' }]\n    }\n\n    return html`\n      ${records.map(\n        (record, rowIndex) => html`\n          <ox-record-partial\n            .config=${this.config}\n            .data=${this.data}\n            .record=${record}\n            .rowIndex=${rowIndex}\n            ?selected-row=${record['__selected__']}\n            ?dirty=${record['__dirty__']}\n          ></ox-record-partial>\n        `\n      )}\n      ${this.isTop\n        ? html``\n        : html` <mwc-icon id=\"upward\" @click=${(e: Event) => this.gotoTop(e)}>arrow_upward</mwc-icon> `}\n    `\n  }\n\n  gotoTop(e: Event) {\n    this.scrollTop = 0\n\n    e.stopPropagation()\n  }\n\n  get pullToRefreshTarget() {\n    return this\n  }\n}\n"]}

package/dist/src/data-list/record-partial.d.ts

@@ -13,8 +13,6 @@ export declare class RecordPartial extends LitElement {
     selectedRow: boolean;
     private _recordView;
     attributeChangedCallback(name: string, oldval: any, newval: any): void;
-    onFieldChange(e: Event): void;
-    get recordView(): any;
     firstUpdated(): void;
     updated(changes: PropertyValues<this>): void;
     render(): import("lit-html").TemplateResult<1>;