@operato/data-grist 0.2.30 → 0.2.31

package/CHANGELOG.md

@@ -3,6 +3,21 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+### [0.2.31](https://github.com/hatiolab/operato/compare/v0.2.30...v0.2.31) (2021-12-03)
+
+
+### :rocket: New Features
+
+* @operato/property-editor added ([77e9429](https://github.com/hatiolab/operato/commit/77e9429dd6bfe974a283ab192245d68407480659))
+
+
+### :bug: Bug Fix
+
+* data-grist, board ([1fa8e53](https://github.com/hatiolab/operato/commit/1fa8e53a55e0f0ca65e9e8ce9891f27061f200c7))
+* upgrade things-scene ([b539c39](https://github.com/hatiolab/operato/commit/b539c39e70d285481c8083b4540129e44580b158))
+
+
+
 ### [0.2.30](https://github.com/hatiolab/operato/compare/v0.2.29...v0.2.30) (2021-12-01)
 
 **Note:** Version bump only for package @operato/data-grist

package/custom-elements.json

@@ -980,6 +980,12 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/types.d.ts",
+      "declarations": [],
+      "exports": []
+    },
     {
       "kind": "javascript-module",
       "path": "stories/index.stories.ts",

package/dist/src/configure/column-builder.d.ts

@@ -1,2 +1 @@
-import { ColumnConfig } from './config-types';
 export declare const buildColumn: (column: any) => ColumnConfig;

package/dist/src/configure/column-builder.js.map

@@ -1 +1 @@
-{"version":3,"file":"column-builder.js","sourceRoot":"","sources":["../../../src/configure/column-builder.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAC/B,OAAO,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAA;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAA;AACtC,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAA;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAE1C,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,MAAW,EAAgB,EAAE;IACvD,IAAI,QAAQ,GAAiB,EAAE,GAAG,MAAM,EAAE,CAAA;IAE1C,IAAI,MAAM,CAAC,IAAI,IAAI,QAAQ,EAAE;QAC3B,QAAQ,GAAG,oBAAoB,CAAC,MAAM,CAAC,CAAA;KACxC;IAED,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAA;IAExD,YAAY;IAEZ,IAAI,OAAO,MAAM,IAAI,QAAQ,EAAE;QAC7B,QAAQ,CAAC,MAAM,GAAG;YAChB,QAAQ,EAAE,GAAG,EAAE,CAAC,MAAM;SACvB,CAAA;KACF;SAAM;QACL,IAAI,EAAE,QAAQ,EAAE,cAAc,EAAE,GAAG,MAAM,IAAI,EAAE,CAAA;QAE/C,QAAQ,CAAC,MAAM,GAAG;YAChB,GAAG,MAAM;YACT,wCAAwC;SACzC,CAAA;KACF;IAED,WAAW;IACX,IAAI,KAAK,EAAE;QACT,IAAI,IAAI,GAAG,OAAO,KAAK,CAAA;QACvB,QAAQ,IAAI,EAAE;YACZ,KAAK,SAAS;gBACZ,IAAI,KAAK,GAAG,OAAO,MAAM,IAAI,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAA;gBACrD,QAAQ,CAAC,KAAK,GAAG;oBACf,QAAQ,EAAE,GAAG,EAAE,CAAC,KAAK;iBACtB,CAAA;gBACD,MAAK;YACP,KAAK,QAAQ;gBACX,QAAQ,CAAC,KAAK,GAAG;oBACf,QAAQ,EAAE,GAAG,EAAE,CAAC,KAAK;iBACtB,CAAA;gBACD,MAAK;YACP;gBACE,QAAQ,CAAC,KAAK,GAAG,KAAK,CAAA;SACzB;KACF;SAAM;QACL,QAAQ,CAAC,KAAK,GAAG,KAAK,CAAA;KACvB;IAED;;OAEG;IACH,IAAI,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,MAAM,IAAI,EAAE,CAAA;IAE7E,cAAc,GAAG,WAAW,CAAC,cAAc,IAAI,MAAM,CAAC,IAAI,CAAC,CAAA;IAE3D,IAAI,QAAQ,IAAI,OAAO,MAAM,KAAK,UAAU,EAAE;QAC5C,MAAM,GAAG,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,CAAA;KAChC;IAED,IAAI,OAAO,UAAU,KAAK,UAAU,EAAE;QACpC,UAAU,GAAG,IAAI,CAAA;KAClB;IAED,QAAQ,CAAC,MAAM,GAAG;QAChB,GAAG,MAAM;QACT,UAAU;QACV,QAAQ,EAAE,cAAc;QACxB,MAAM;KACP,CAAA;IAED,aAAa;IACb,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,QAAQ,IAAI,EAAE,CAAA;IAExC,QAAQ,CAAC,QAAQ,GAAG;QAClB,KAAK,EAAE,KAAK,IAAI,oBAAoB,CAAC,KAAK,CAAC;QAC3C,QAAQ,EAAE,QAAQ,IAAI,oBAAoB,CAAC,QAAQ,CAAC;KACrD,CAAA;IAED,OAAO,QAAQ,CAAA;AACjB,CAAC,CAAA","sourcesContent":["import { ColumnConfig } from './config-types'\nimport { NOOP } from '../const'\nimport { generateGutterColumn } from '../gutters'\nimport { getEditor } from '../editors'\nimport { getGristEventHandler } from '../handlers'\nimport { getRenderer } from '../renderers'\n\nexport const buildColumn = (column: any): ColumnConfig => {\n  var compiled: ColumnConfig = { ...column }\n\n  if (column.type == 'gutter') {\n    compiled = generateGutterColumn(column)\n  }\n\n  var { name, header, record, handlers, label } = compiled\n\n  /* header */\n\n  if (typeof header == 'string') {\n    compiled.header = {\n      renderer: () => header\n    }\n  } else {\n    var { renderer: headerRenderer } = header || {}\n\n    compiled.header = {\n      ...header\n      // renderer: getRenderer(headerRenderer)\n    }\n  }\n\n  /* label */\n  if (label) {\n    let type = typeof label\n    switch (type) {\n      case 'boolean':\n        let title = typeof header == 'string' ? header : name\n        compiled.label = {\n          renderer: () => title\n        }\n        break\n      case 'string':\n        compiled.label = {\n          renderer: () => label\n        }\n        break\n      default:\n        compiled.label = label\n    }\n  } else {\n    compiled.label = false\n  }\n\n  /*\n   * record\n   */\n  var { renderer: recordRenderer, editor, editable, classifier } = record || {}\n\n  recordRenderer = getRenderer(recordRenderer || column.type)\n\n  if (editable && typeof editor !== 'function') {\n    editor = getEditor(column.type)\n  }\n\n  if (typeof classifier !== 'function') {\n    classifier = NOOP\n  }\n\n  compiled.record = {\n    ...record,\n    classifier,\n    renderer: recordRenderer,\n    editor\n  }\n\n  /* handler */\n  var { click, dblclick } = handlers || {}\n\n  compiled.handlers = {\n    click: click && getGristEventHandler(click),\n    dblclick: dblclick && getGristEventHandler(dblclick)\n  }\n\n  return compiled\n}\n"]}
+{"version":3,"file":"column-builder.js","sourceRoot":"","sources":["../../../src/configure/column-builder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAC/B,OAAO,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAA;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAA;AACtC,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAA;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAE1C,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,MAAW,EAAgB,EAAE;IACvD,IAAI,QAAQ,GAAiB,EAAE,GAAG,MAAM,EAAE,CAAA;IAE1C,IAAI,MAAM,CAAC,IAAI,IAAI,QAAQ,EAAE;QAC3B,QAAQ,GAAG,oBAAoB,CAAC,MAAM,CAAC,CAAA;KACxC;IAED,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAA;IAExD,YAAY;IAEZ,IAAI,OAAO,MAAM,IAAI,QAAQ,EAAE;QAC7B,QAAQ,CAAC,MAAM,GAAG;YAChB,QAAQ,EAAE,GAAG,EAAE,CAAC,MAAM;SACvB,CAAA;KACF;SAAM;QACL,IAAI,EAAE,QAAQ,EAAE,cAAc,EAAE,GAAG,MAAM,IAAI,EAAE,CAAA;QAE/C,QAAQ,CAAC,MAAM,GAAG;YAChB,GAAG,MAAM;YACT,wCAAwC;SACzC,CAAA;KACF;IAED,WAAW;IACX,IAAI,KAAK,EAAE;QACT,IAAI,IAAI,GAAG,OAAO,KAAK,CAAA;QACvB,QAAQ,IAAI,EAAE;YACZ,KAAK,SAAS;gBACZ,IAAI,KAAK,GAAG,OAAO,MAAM,IAAI,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAA;gBACrD,QAAQ,CAAC,KAAK,GAAG;oBACf,QAAQ,EAAE,GAAG,EAAE,CAAC,KAAK;iBACtB,CAAA;gBACD,MAAK;YACP,KAAK,QAAQ;gBACX,QAAQ,CAAC,KAAK,GAAG;oBACf,QAAQ,EAAE,GAAG,EAAE,CAAC,KAAK;iBACtB,CAAA;gBACD,MAAK;YACP;gBACE,QAAQ,CAAC,KAAK,GAAG,KAAK,CAAA;SACzB;KACF;SAAM;QACL,QAAQ,CAAC,KAAK,GAAG,KAAK,CAAA;KACvB;IAED;;OAEG;IACH,IAAI,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,MAAM,IAAI,EAAE,CAAA;IAE7E,cAAc,GAAG,WAAW,CAAC,cAAc,IAAI,MAAM,CAAC,IAAI,CAAC,CAAA;IAE3D,IAAI,QAAQ,IAAI,OAAO,MAAM,KAAK,UAAU,EAAE;QAC5C,MAAM,GAAG,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,CAAA;KAChC;IAED,IAAI,OAAO,UAAU,KAAK,UAAU,EAAE;QACpC,UAAU,GAAG,IAAI,CAAA;KAClB;IAED,QAAQ,CAAC,MAAM,GAAG;QAChB,GAAG,MAAM;QACT,UAAU;QACV,QAAQ,EAAE,cAAc;QACxB,MAAM;KACP,CAAA;IAED,aAAa;IACb,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,QAAQ,IAAI,EAAE,CAAA;IAExC,QAAQ,CAAC,QAAQ,GAAG;QAClB,KAAK,EAAE,KAAK,IAAI,oBAAoB,CAAC,KAAK,CAAC;QAC3C,QAAQ,EAAE,QAAQ,IAAI,oBAAoB,CAAC,QAAQ,CAAC;KACrD,CAAA;IAED,OAAO,QAAQ,CAAA;AACjB,CAAC,CAAA","sourcesContent":["import { NOOP } from '../const'\nimport { generateGutterColumn } from '../gutters'\nimport { getEditor } from '../editors'\nimport { getGristEventHandler } from '../handlers'\nimport { getRenderer } from '../renderers'\n\nexport const buildColumn = (column: any): ColumnConfig => {\n  var compiled: ColumnConfig = { ...column }\n\n  if (column.type == 'gutter') {\n    compiled = generateGutterColumn(column)\n  }\n\n  var { name, header, record, handlers, label } = compiled\n\n  /* header */\n\n  if (typeof header == 'string') {\n    compiled.header = {\n      renderer: () => header\n    }\n  } else {\n    var { renderer: headerRenderer } = header || {}\n\n    compiled.header = {\n      ...header\n      // renderer: getRenderer(headerRenderer)\n    }\n  }\n\n  /* label */\n  if (label) {\n    let type = typeof label\n    switch (type) {\n      case 'boolean':\n        let title = typeof header == 'string' ? header : name\n        compiled.label = {\n          renderer: () => title\n        }\n        break\n      case 'string':\n        compiled.label = {\n          renderer: () => label\n        }\n        break\n      default:\n        compiled.label = label\n    }\n  } else {\n    compiled.label = false\n  }\n\n  /*\n   * record\n   */\n  var { renderer: recordRenderer, editor, editable, classifier } = record || {}\n\n  recordRenderer = getRenderer(recordRenderer || column.type)\n\n  if (editable && typeof editor !== 'function') {\n    editor = getEditor(column.type)\n  }\n\n  if (typeof classifier !== 'function') {\n    classifier = NOOP\n  }\n\n  compiled.record = {\n    ...record,\n    classifier,\n    renderer: recordRenderer,\n    editor\n  }\n\n  /* handler */\n  var { click, dblclick } = handlers || {}\n\n  compiled.handlers = {\n    click: click && getGristEventHandler(click),\n    dblclick: dblclick && getGristEventHandler(dblclick)\n  }\n\n  return compiled\n}\n"]}

package/dist/src/configure/config-builder.d.ts

@@ -1,2 +1 @@
-import { GristConfig } from './config-types';
 export declare const buildConfig: (config: any) => GristConfig;

package/dist/src/configure/config-builder.js.map

@@ -1 +1 @@
-{"version":3,"file":"config-builder.js","sourceRoot":"","sources":["../../../src/configure/config-builder.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAC9C,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAA;AACxD,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAA;AACxD,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAA;AAExD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,MAAW,EAAe,EAAE;IACtD,IAAI,EAAE,OAAO,GAAG,EAAE,EAAE,IAAI,GAAG,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,MAAM,CAAA;IAEzE,OAAO;QACL,GAAG,MAAM;QACT,OAAO,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,MAAW,EAAE,EAAE,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;QAC1D,IAAI,EAAE,gBAAgB,CAAC,IAAI,CAAC;QAC5B,UAAU;QACV,OAAO;QACP,IAAI,EAAE,gBAAgB,CAAC,IAAI,CAAC;QAC5B,IAAI,EAAE,gBAAgB,CAAC,IAAI,CAAC;KAC7B,CAAA;AACH,CAAC,CAAA","sourcesContent":["import { GristConfig } from './config-types'\nimport { buildColumn } from './column-builder'\nimport { buildImexOptions } from './imex-option-builder'\nimport { buildListOptions } from './list-option-builder'\nimport { buildRowsOptions } from './rows-option-builder'\n\nexport const buildConfig = (config: any): GristConfig => {\n  var { columns = [], rows = {}, pagination, sorters, list, imex } = config\n\n  return {\n    ...config,\n    columns: columns.map((column: any) => buildColumn(column)),\n    rows: buildRowsOptions(rows),\n    pagination,\n    sorters,\n    list: buildListOptions(list),\n    imex: buildImexOptions(imex)\n  }\n}\n"]}
+{"version":3,"file":"config-builder.js","sourceRoot":"","sources":["../../../src/configure/config-builder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAC9C,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAA;AACxD,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAA;AACxD,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAA;AAExD,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,MAAW,EAAe,EAAE;IACtD,IAAI,EAAE,OAAO,GAAG,EAAE,EAAE,IAAI,GAAG,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,MAAM,CAAA;IAEzE,OAAO;QACL,GAAG,MAAM;QACT,OAAO,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,MAAW,EAAE,EAAE,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;QAC1D,IAAI,EAAE,gBAAgB,CAAC,IAAI,CAAC;QAC5B,UAAU;QACV,OAAO;QACP,IAAI,EAAE,gBAAgB,CAAC,IAAI,CAAC;QAC5B,IAAI,EAAE,gBAAgB,CAAC,IAAI,CAAC;KAC7B,CAAA;AACH,CAAC,CAAA","sourcesContent":["import { buildColumn } from './column-builder'\nimport { buildImexOptions } from './imex-option-builder'\nimport { buildListOptions } from './list-option-builder'\nimport { buildRowsOptions } from './rows-option-builder'\n\nexport const buildConfig = (config: any): GristConfig => {\n  var { columns = [], rows = {}, pagination, sorters, list, imex } = config\n\n  return {\n    ...config,\n    columns: columns.map((column: any) => buildColumn(column)),\n    rows: buildRowsOptions(rows),\n    pagination,\n    sorters,\n    list: buildListOptions(list),\n    imex: buildImexOptions(imex)\n  }\n}\n"]}

package/dist/src/configure/config-types.d.ts

@@ -18,124 +18,3 @@ export declare const ZERO_PAGINATION: {
     limit: number;
     total: number;
 };
-export declare type GristConfig = {
-    columns: ColumnConfig[];
-    rows: RowsConfig;
-    list: ListConfig;
-    pagination?: PaginationConfig;
-    sorters?: SortersConfig;
-};
-export declare type SorterConfig = {
-    name: string;
-    desc?: boolean;
-};
-export declare type SortersConfig = SorterConfig[];
-export declare type PaginationConfig = {
-    page?: number;
-    limit?: number;
-    pages: number[];
-    infinite?: boolean;
-};
-export declare type GristEventHandler = (columns: ColumnConfig[], data?: GristData, column?: ColumnConfig, record?: GristRecord, rowIndex?: number, target?: any) => void;
-export declare type ColumnConfig = {
-    type: string;
-    name: string;
-    gutterName?: string;
-    header: HeaderConfig;
-    record: RecordConfig;
-    handlers: GristEventHandlerSet;
-    label: LabelConfig;
-    hidden?: boolean;
-    sortable?: boolean;
-    resizable?: boolean;
-    width?: number | string | ColumnWidthCallback;
-    forList?: boolean;
-    validation?: ValidationCallback;
-    imex?: ImexConfig;
-    multiple?: boolean;
-};
-export declare type ValidationCallback = (after: any, before: any, record: GristRecord, column: ColumnConfig) => boolean;
-export declare type LabelConfig = string | boolean | {
-    renderer: LabelRenderer;
-};
-export declare type LabelRenderer = () => void;
-export declare type ColumnWidthCallback = (column: ColumnConfig) => string;
-export declare type HeaderConfig = {
-    renderer: HeaderRenderer;
-};
-export declare type HeaderRenderer = (column: ColumnConfig) => any;
-export declare type RecordConfig = {
-    renderer: FieldRenderer;
-    editor?: FieldEditor;
-    editable?: boolean;
-    classifier: GristClassifier;
-    align?: 'left' | 'right' | 'center';
-    options: {
-        [key: string]: any;
-    };
-    rowOptionField?: string;
-};
-export declare type FieldRenderer = (value: any, column: ColumnConfig, record: GristRecord, rowIndex: number, owner: any) => any;
-export declare type FieldEditor = (value: any, column: ColumnConfig, record: GristRecord, rowIndex: number, owner: any) => any;
-export declare type FieldThumbnailRenderer = (record: GristRecord, rowIndex: number) => any;
-export declare type GristEventHandlerSet = {
-    click?: GristEventHandler;
-    dblclick?: GristEventHandler;
-};
-export declare type ListConfig = {
-    thumbnail: FieldThumbnailRenderer;
-    fields: string[];
-    details: string[];
-};
-export declare type ImexConfig = {
-    header: string;
-    key: string;
-    width: number;
-    type: string;
-};
-export declare type RowsConfig = {
-    appendable: boolean;
-    insertable: boolean;
-    selectable?: RowSelectableConfig;
-    groups: GroupConfig[];
-    totals: string[];
-    classifier: GristClassifier;
-    handlers: GristEventHandlerSet;
-};
-export declare type GristClassifier = (record: GristRecord, rowIndex: number) => {
-    emphasized?: boolean | string | string[];
-    [key: string]: any;
-} | void;
-export declare type GroupConfig = {
-    align: string;
-    titleColumn?: ColumnConfig;
-    title: string;
-    value?: string;
-    groupName?: string;
-    row?: number;
-    column: string | number;
-    rowspan: number;
-    colspan?: number;
-};
-export declare type RowSelectableConfig = {
-    multiple?: boolean;
-};
-export declare type GristRecord = {
-    id?: string;
-    name?: string;
-    __seq__?: number;
-    __dirty__?: string;
-    __selected__?: boolean;
-    __changes__?: object[];
-    __dirtyfields__?: {
-        [key: string]: any;
-    };
-    __origin__?: any;
-    [key: string]: any;
-};
-export declare type GristData = {
-    page?: number;
-    total?: number;
-    limit?: number;
-    records: GristRecord[];
-};

package/dist/src/configure/config-types.js.map

@@ -1 +1 @@
-{"version":3,"file":"config-types.js","sourceRoot":"","sources":["../../../src/configure/config-types.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,eAAe,GAAoB,CAAC,MAAM,EAAE,QAAQ,EAAE,EAAE,GAAE,CAAC,CAAA;AACxE,MAAM,CAAC,MAAM,mBAAmB,GAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,GAAE,CAAC,CAAA;AAChG,MAAM,CAAC,MAAM,uBAAuB,GAAG,UAAU,MAAmB,EAAE,QAAgB,IAAG,CAAC,CAAA;AAE1F,MAAM,CAAC,MAAM,oBAAoB,GAAyB;IACxD,KAAK,EAAE,SAAS;IAChB,QAAQ,EAAE,SAAS;CACpB,CAAA;AACD,MAAM,CAAC,MAAM,YAAY,GAAmB,EAAE,CAAA;AAC9C,MAAM,CAAC,MAAM,WAAW,GAAkB,EAAE,CAAA;AAC5C,MAAM,CAAC,MAAM,WAAW,GAAO,EAAE,CAAA;AACjC,MAAM,CAAC,MAAM,UAAU,GAAgB,KAAK,CAAA;AAE5C,MAAM,CAAC,MAAM,WAAW,GAAiB;IACvC,IAAI,EAAE,EAAE;IACR,IAAI,EAAE,EAAE;IACR,MAAM,EAAE;QACN,QAAQ,EAAE,MAAM,CAAC,EAAE,GAAE,CAAC;KACvB;IACD,MAAM,EAAE;QACN,QAAQ,EAAE,mBAAmB;QAC7B,UAAU,EAAE,eAAe;QAC3B,OAAO,EAAE,EAAE;KACZ;IACD,QAAQ,EAAE,oBAAoB;IAC9B,KAAK,EAAE,UAAU;CAClB,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAe;IACnC,UAAU,EAAE,KAAK;IACjB,UAAU,EAAE,KAAK;IACjB,MAAM,EAAE,WAAW;IACnB,MAAM,EAAE,WAAW;IACnB,UAAU,EAAE,eAAe;IAC3B,QAAQ,EAAE,oBAAoB;CAC/B,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAe;IACnC,SAAS,EAAE,uBAAuB;IAClC,MAAM,EAAE,CAAC,MAAM,EAAE,aAAa,EAAE,WAAW,CAAC;IAC5C,OAAO,EAAE,EAAE;CACZ,CAAA;AAED,MAAM,CAAC,MAAM,WAAW,GAAgB;IACtC,OAAO,EAAE,YAAY;IACrB,IAAI,EAAE,SAAS;IACf,IAAI,EAAE,SAAS;CAChB,CAAA;AAED,MAAM,CAAC,MAAM,WAAW,GAAgB,EAAE,CAAA;AAC1C,MAAM,CAAC,MAAM,YAAY,GAAkB,EAAE,CAAA;AAE7C,MAAM,CAAC,MAAM,SAAS,GAAc;IAClC,OAAO,EAAE,YAAY;CACtB,CAAA;AAED,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,IAAI,EAAE,CAAC;IACP,KAAK,EAAE,EAAE;IACT,KAAK,EAAE,CAAC;CACT,CAAA","sourcesContent":["export const ZERO_CLASSIFIER: GristClassifier = (record, rowIndex) => {}\nexport const ZERO_FIELD_RENDERER: FieldRenderer = (value, column, record, rowIndex, owner) => {}\nexport const ZERO_THUMBNAIL_TEMPLATE = function (record: GristRecord, rowIndex: number) {}\n\nexport const ZERO_EVENTHANDLERSET: GristEventHandlerSet = {\n  click: undefined,\n  dblclick: undefined\n}\nexport const ZERO_COLUMNS: ColumnConfig[] = []\nexport const ZERO_GROUPS: GroupConfig[] = []\nexport const ZERO_TOTALS: [] = []\nexport const ZERO_LABEL: LabelConfig = false\n\nexport const ZERO_COLUMN: ColumnConfig = {\n  type: '',\n  name: '',\n  header: {\n    renderer: column => {}\n  },\n  record: {\n    renderer: ZERO_FIELD_RENDERER,\n    classifier: ZERO_CLASSIFIER,\n    options: {}\n  },\n  handlers: ZERO_EVENTHANDLERSET,\n  label: ZERO_LABEL\n}\n\nexport const ZERO_ROWS: RowsConfig = {\n  appendable: false,\n  insertable: false,\n  groups: ZERO_GROUPS,\n  totals: ZERO_TOTALS,\n  classifier: ZERO_CLASSIFIER,\n  handlers: ZERO_EVENTHANDLERSET\n}\n\nexport const ZERO_LIST: ListConfig = {\n  thumbnail: ZERO_THUMBNAIL_TEMPLATE,\n  fields: ['name', 'description', 'updatedAt'],\n  details: []\n}\n\nexport const ZERO_CONFIG: GristConfig = {\n  columns: ZERO_COLUMNS,\n  rows: ZERO_ROWS,\n  list: ZERO_LIST\n}\n\nexport const ZERO_RECORD: GristRecord = {}\nexport const ZERO_RECORDS: GristRecord[] = []\n\nexport const ZERO_DATA: GristData = {\n  records: ZERO_RECORDS\n}\n\nexport const ZERO_PAGINATION = {\n  page: 1,\n  limit: 20,\n  total: 0\n}\n\nexport type GristConfig = {\n  columns: ColumnConfig[]\n  rows: RowsConfig\n  list: ListConfig\n  pagination?: PaginationConfig\n  sorters?: SortersConfig\n}\n\nexport type SorterConfig = { name: string; desc?: boolean }\nexport type SortersConfig = SorterConfig[]\n\nexport type PaginationConfig = {\n  page?: number\n  limit?: number\n  pages: number[]\n  infinite?: boolean\n}\n\nexport type GristEventHandler = (\n  columns: ColumnConfig[],\n  data?: GristData,\n  column?: ColumnConfig,\n  record?: GristRecord,\n  rowIndex?: number,\n  target?: any\n) => void\n\nexport type ColumnConfig = {\n  type: string\n  name: string\n  gutterName?: string\n  header: HeaderConfig\n  record: RecordConfig\n  handlers: GristEventHandlerSet\n  label: LabelConfig\n  hidden?: boolean\n  sortable?: boolean\n  resizable?: boolean\n  width?: number | string | ColumnWidthCallback\n  forList?: boolean\n  validation?: ValidationCallback\n  imex?: ImexConfig\n  multiple?: boolean\n}\n\nexport type ValidationCallback = (after: any, before: any, record: GristRecord, column: ColumnConfig) => boolean\n\nexport type LabelConfig =\n  | string\n  | boolean\n  | {\n      renderer: LabelRenderer\n    }\n\nexport type LabelRenderer = () => void\n\nexport type ColumnWidthCallback = (column: ColumnConfig) => string\n\nexport type HeaderConfig = {\n  renderer: HeaderRenderer\n}\nexport type HeaderRenderer = (column: ColumnConfig) => any\n\nexport type RecordConfig = {\n  renderer: FieldRenderer\n  editor?: FieldEditor\n  editable?: boolean\n  classifier: GristClassifier\n  align?: 'left' | 'right' | 'center'\n  options: { [key: string]: any }\n  rowOptionField?: string\n}\n\nexport type FieldRenderer = (value: any, column: ColumnConfig, record: GristRecord, rowIndex: number, owner: any) => any\nexport type FieldEditor = (value: any, column: ColumnConfig, record: GristRecord, rowIndex: number, owner: any) => any\nexport type FieldThumbnailRenderer = (record: GristRecord, rowIndex: number) => any\n\nexport type GristEventHandlerSet = {\n  click?: GristEventHandler\n  dblclick?: GristEventHandler\n}\n\nexport type ListConfig = {\n  thumbnail: FieldThumbnailRenderer\n  fields: string[]\n  details: string[]\n}\n\nexport type ImexConfig = {\n  header: string\n  key: string\n  width: number\n  type: string\n}\n\nexport type RowsConfig = {\n  appendable: boolean\n  insertable: boolean\n  selectable?: RowSelectableConfig\n  groups: GroupConfig[]\n  totals: string[]\n  classifier: GristClassifier\n  handlers: GristEventHandlerSet\n}\n\nexport type GristClassifier = (\n  record: GristRecord,\n  rowIndex: number\n) => { emphasized?: boolean | string | string[]; [key: string]: any } | void\n\nexport type GroupConfig = {\n  align: string\n  titleColumn?: ColumnConfig\n  title: string\n  value?: string\n  groupName?: string\n  row?: number\n  column: string | number\n  rowspan: number\n  colspan?: number\n}\n\nexport type RowSelectableConfig = {\n  multiple?: boolean\n}\n\nexport type GristRecord = {\n  id?: string\n  name?: string\n  __seq__?: number\n  __dirty__?: string\n  __selected__?: boolean\n  __changes__?: object[]\n  __dirtyfields__?: { [key: string]: any }\n  __origin__?: any\n  [key: string]: any\n}\n\nexport type GristData = {\n  page?: number\n  total?: number\n  limit?: number\n  records: GristRecord[]\n}\n"]}
+{"version":3,"file":"config-types.js","sourceRoot":"","sources":["../../../src/configure/config-types.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,eAAe,GAAoB,CAAC,MAAM,EAAE,QAAQ,EAAE,EAAE,GAAE,CAAC,CAAA;AACxE,MAAM,CAAC,MAAM,mBAAmB,GAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE,GAAE,CAAC,CAAA;AAChG,MAAM,CAAC,MAAM,uBAAuB,GAAG,UAAU,MAAmB,EAAE,QAAgB,IAAG,CAAC,CAAA;AAE1F,MAAM,CAAC,MAAM,oBAAoB,GAAyB;IACxD,KAAK,EAAE,SAAS;IAChB,QAAQ,EAAE,SAAS;CACpB,CAAA;AACD,MAAM,CAAC,MAAM,YAAY,GAAmB,EAAE,CAAA;AAC9C,MAAM,CAAC,MAAM,WAAW,GAAkB,EAAE,CAAA;AAC5C,MAAM,CAAC,MAAM,WAAW,GAAO,EAAE,CAAA;AACjC,MAAM,CAAC,MAAM,UAAU,GAAgB,KAAK,CAAA;AAE5C,MAAM,CAAC,MAAM,WAAW,GAAiB;IACvC,IAAI,EAAE,EAAE;IACR,IAAI,EAAE,EAAE;IACR,MAAM,EAAE;QACN,QAAQ,EAAE,MAAM,CAAC,EAAE,GAAE,CAAC;KACvB;IACD,MAAM,EAAE;QACN,QAAQ,EAAE,mBAAmB;QAC7B,UAAU,EAAE,eAAe;QAC3B,OAAO,EAAE,EAAE;KACZ;IACD,QAAQ,EAAE,oBAAoB;IAC9B,KAAK,EAAE,UAAU;CAClB,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAe;IACnC,UAAU,EAAE,KAAK;IACjB,UAAU,EAAE,KAAK;IACjB,MAAM,EAAE,WAAW;IACnB,MAAM,EAAE,WAAW;IACnB,UAAU,EAAE,eAAe;IAC3B,QAAQ,EAAE,oBAAoB;CAC/B,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAe;IACnC,SAAS,EAAE,uBAAuB;IAClC,MAAM,EAAE,CAAC,MAAM,EAAE,aAAa,EAAE,WAAW,CAAC;IAC5C,OAAO,EAAE,EAAE;CACZ,CAAA;AAED,MAAM,CAAC,MAAM,WAAW,GAAgB;IACtC,OAAO,EAAE,YAAY;IACrB,IAAI,EAAE,SAAS;IACf,IAAI,EAAE,SAAS;CAChB,CAAA;AAED,MAAM,CAAC,MAAM,WAAW,GAAgB,EAAE,CAAA;AAC1C,MAAM,CAAC,MAAM,YAAY,GAAkB,EAAE,CAAA;AAE7C,MAAM,CAAC,MAAM,SAAS,GAAc;IAClC,OAAO,EAAE,YAAY;CACtB,CAAA;AAED,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,IAAI,EAAE,CAAC;IACP,KAAK,EAAE,EAAE;IACT,KAAK,EAAE,CAAC;CACT,CAAA","sourcesContent":["export const ZERO_CLASSIFIER: GristClassifier = (record, rowIndex) => {}\nexport const ZERO_FIELD_RENDERER: FieldRenderer = (value, column, record, rowIndex, owner) => {}\nexport const ZERO_THUMBNAIL_TEMPLATE = function (record: GristRecord, rowIndex: number) {}\n\nexport const ZERO_EVENTHANDLERSET: GristEventHandlerSet = {\n  click: undefined,\n  dblclick: undefined\n}\nexport const ZERO_COLUMNS: ColumnConfig[] = []\nexport const ZERO_GROUPS: GroupConfig[] = []\nexport const ZERO_TOTALS: [] = []\nexport const ZERO_LABEL: LabelConfig = false\n\nexport const ZERO_COLUMN: ColumnConfig = {\n  type: '',\n  name: '',\n  header: {\n    renderer: column => {}\n  },\n  record: {\n    renderer: ZERO_FIELD_RENDERER,\n    classifier: ZERO_CLASSIFIER,\n    options: {}\n  },\n  handlers: ZERO_EVENTHANDLERSET,\n  label: ZERO_LABEL\n}\n\nexport const ZERO_ROWS: RowsConfig = {\n  appendable: false,\n  insertable: false,\n  groups: ZERO_GROUPS,\n  totals: ZERO_TOTALS,\n  classifier: ZERO_CLASSIFIER,\n  handlers: ZERO_EVENTHANDLERSET\n}\n\nexport const ZERO_LIST: ListConfig = {\n  thumbnail: ZERO_THUMBNAIL_TEMPLATE,\n  fields: ['name', 'description', 'updatedAt'],\n  details: []\n}\n\nexport const ZERO_CONFIG: GristConfig = {\n  columns: ZERO_COLUMNS,\n  rows: ZERO_ROWS,\n  list: ZERO_LIST\n}\n\nexport const ZERO_RECORD: GristRecord = {}\nexport const ZERO_RECORDS: GristRecord[] = []\n\nexport const ZERO_DATA: GristData = {\n  records: ZERO_RECORDS\n}\n\nexport const ZERO_PAGINATION = {\n  page: 1,\n  limit: 20,\n  total: 0\n}\n"]}

package/dist/src/configure/imex-option-builder.d.ts

@@ -1,2 +1 @@
-import { ImexConfig } from './config-types';
 export declare const buildImexOptions: (imex: any) => ImexConfig | undefined;

package/dist/src/configure/imex-option-builder.js.map

@@ -1 +1 @@
-{"version":3,"file":"imex-option-builder.js","sourceRoot":"","sources":["../../../src/configure/imex-option-builder.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAAS,EAA0B,EAAE;IACpE,OAAO,IAAI,CAAA;AACb,CAAC,CAAA","sourcesContent":["import { ImexConfig } from './config-types'\n\nexport const buildImexOptions = (imex: any): ImexConfig | undefined => {\n  return imex\n}\n"]}
+{"version":3,"file":"imex-option-builder.js","sourceRoot":"","sources":["../../../src/configure/imex-option-builder.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAAS,EAA0B,EAAE;IACpE,OAAO,IAAI,CAAA;AACb,CAAC,CAAA","sourcesContent":["export const buildImexOptions = (imex: any): ImexConfig | undefined => {\n  return imex\n}\n"]}

package/dist/src/configure/list-option-builder.d.ts

@@ -1,2 +1 @@
-import { ListConfig } from './config-types';
 export declare const buildListOptions: (list: ListConfig | undefined) => ListConfig;

package/dist/src/configure/list-option-builder.js.map

@@ -1 +1 @@
-{"version":3,"file":"list-option-builder.js","sourceRoot":"","sources":["../../../src/configure/list-option-builder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAc,uBAAuB,EAAE,MAAM,gBAAgB,CAAA;AAEpE,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAA4B,EAAc,EAAE;IAC3E,OAAO;QACL,SAAS,EAAE,uBAAuB;QAClC,MAAM,EAAE,CAAC,MAAM,EAAE,aAAa,EAAE,WAAW,CAAC;QAC5C,OAAO,EAAE,EAAE;QACX,GAAG,IAAI;KACR,CAAA;AACH,CAAC,CAAA","sourcesContent":["import { ListConfig, ZERO_THUMBNAIL_TEMPLATE } from './config-types'\n\nexport const buildListOptions = (list: ListConfig | undefined): ListConfig => {\n  return {\n    thumbnail: ZERO_THUMBNAIL_TEMPLATE,\n    fields: ['name', 'description', 'updatedAt'],\n    details: [],\n    ...list\n  }\n}\n"]}
+{"version":3,"file":"list-option-builder.js","sourceRoot":"","sources":["../../../src/configure/list-option-builder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,uBAAuB,EAAE,MAAM,gBAAgB,CAAA;AAExD,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAA4B,EAAc,EAAE;IAC3E,OAAO;QACL,SAAS,EAAE,uBAAuB;QAClC,MAAM,EAAE,CAAC,MAAM,EAAE,aAAa,EAAE,WAAW,CAAC;QAC5C,OAAO,EAAE,EAAE;QACX,GAAG,IAAI;KACR,CAAA;AACH,CAAC,CAAA","sourcesContent":["import { ZERO_THUMBNAIL_TEMPLATE } from './config-types'\n\nexport const buildListOptions = (list: ListConfig | undefined): ListConfig => {\n  return {\n    thumbnail: ZERO_THUMBNAIL_TEMPLATE,\n    fields: ['name', 'description', 'updatedAt'],\n    details: [],\n    ...list\n  }\n}\n"]}

package/dist/src/configure/rows-option-builder.d.ts

@@ -1,2 +1 @@
-import { RowsConfig } from './config-types';
 export declare const buildRowsOptions: (rows: any) => RowsConfig;

package/dist/src/configure/rows-option-builder.js.map

@@ -1 +1 @@
-{"version":3,"file":"rows-option-builder.js","sourceRoot":"","sources":["../../../src/configure/rows-option-builder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAE/B,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAA;AAElD,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAAS,EAAc,EAAE;IACxD,IAAI,EAAE,UAAU,GAAG,IAAI,EAAE,UAAU,GAAG,KAAK,EAAE,UAAU,EAAE,MAAM,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,UAAU,EAAE,GAAG,IAAI,CAAA;IAEtG,aAAa;IACb,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,QAAQ,IAAI,EAAE,CAAA;IAC7C,IAAI,OAAO,UAAU,KAAK,UAAU,EAAE;QACpC,UAAU,GAAG,IAAI,CAAA;KAClB;IAED,OAAO;QACL,UAAU;QACV,UAAU;QACV,UAAU;QACV,MAAM;QACN,MAAM;QACN,QAAQ,EAAE;YACR,KAAK,EAAE,oBAAoB,CAAC,KAAK,CAAC;YAClC,QAAQ,EAAE,oBAAoB,CAAC,QAAQ,CAAC;SACzC;QACD,UAAU;KACX,CAAA;AACH,CAAC,CAAA","sourcesContent":["import { NOOP } from '../const'\nimport { RowsConfig } from './config-types'\nimport { getGristEventHandler } from '../handlers'\n\nexport const buildRowsOptions = (rows: any): RowsConfig => {\n  var { appendable = true, insertable = false, selectable, groups = [], totals = [], classifier } = rows\n\n  /* handler */\n  var { click, dblclick } = rows.handlers || {}\n  if (typeof classifier !== 'function') {\n    classifier = NOOP\n  }\n\n  return {\n    appendable,\n    insertable,\n    selectable,\n    groups,\n    totals,\n    handlers: {\n      click: getGristEventHandler(click),\n      dblclick: getGristEventHandler(dblclick)\n    },\n    classifier\n  }\n}\n"]}
+{"version":3,"file":"rows-option-builder.js","sourceRoot":"","sources":["../../../src/configure/rows-option-builder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAC/B,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAA;AAElD,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,IAAS,EAAc,EAAE;IACxD,IAAI,EAAE,UAAU,GAAG,IAAI,EAAE,UAAU,GAAG,KAAK,EAAE,UAAU,EAAE,MAAM,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,UAAU,EAAE,GAAG,IAAI,CAAA;IAEtG,aAAa;IACb,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,QAAQ,IAAI,EAAE,CAAA;IAC7C,IAAI,OAAO,UAAU,KAAK,UAAU,EAAE;QACpC,UAAU,GAAG,IAAI,CAAA;KAClB;IAED,OAAO;QACL,UAAU;QACV,UAAU;QACV,UAAU;QACV,MAAM;QACN,MAAM;QACN,QAAQ,EAAE;YACR,KAAK,EAAE,oBAAoB,CAAC,KAAK,CAAC;YAClC,QAAQ,EAAE,oBAAoB,CAAC,QAAQ,CAAC;SACzC;QACD,UAAU;KACX,CAAA;AACH,CAAC,CAAA","sourcesContent":["import { NOOP } from '../const'\nimport { getGristEventHandler } from '../handlers'\n\nexport const buildRowsOptions = (rows: any): RowsConfig => {\n  var { appendable = true, insertable = false, selectable, groups = [], totals = [], classifier } = rows\n\n  /* handler */\n  var { click, dblclick } = rows.handlers || {}\n  if (typeof classifier !== 'function') {\n    classifier = NOOP\n  }\n\n  return {\n    appendable,\n    insertable,\n    selectable,\n    groups,\n    totals,\n    handlers: {\n      click: getGristEventHandler(click),\n      dblclick: getGristEventHandler(dblclick)\n    },\n    classifier\n  }\n}\n"]}

package/dist/src/data-card/data-card-field.d.ts

@@ -1,5 +1,4 @@
 import { LitElement } from 'lit';
-import { ColumnConfig, GristRecord } from '../configure/config-types';
 export declare class DataCardField extends LitElement {
     static styles: import("lit").CSSResult[];
     align?: string;

package/dist/src/data-card/data-card-field.js

@@ -1,7 +1,7 @@
 import { __decorate } from "tslib";
-import { css, html, LitElement } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
+import { LitElement, css, html } from 'lit';
 import { ZERO_COLUMN, ZERO_RECORD } from '../configure/config-types';
+import { customElement, property } from 'lit/decorators.js';
 let DataCardField = class DataCardField extends LitElement {
     constructor() {
         super(...arguments);

package/dist/src/data-card/data-card-field.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-card-field.js","sourceRoot":"","sources":["../../../src/data-card/data-card-field.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAA6B,WAAW,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AAG/F,IAAa,aAAa,GAA1B,MAAa,aAAc,SAAQ,UAAU;IAA7C;;QAwD8B,WAAM,GAAgB,WAAW,CAAA;QACjC,WAAM,GAAiB,WAAW,CAAA;QAClC,aAAQ,GAAW,CAAC,CAAC,CAAA;IAkBnD,CAAC;IAfC,MAAM;QACJ,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAA;QAE9C,IAAI,EACF,KAAK,EACL,MAAM,EAAE,EAAE,QAAQ,EAAE,cAAc,EAAE,EACrC,GAAG,MAAM,CAAA;QAEV,IAAI,OAAO,KAAK,IAAI,QAAQ,EAAE;YAC5B,IAAI,EAAE,QAAQ,EAAE,aAAa,EAAE,GAAG,KAAK,CAAA;YACvC,OAAO,IAAI,CAAA,UAAU,aAAa,EAAE,WAAW,cAAc,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,CAAC,EAAE,CAAA;SACvG;aAAM;YACL,OAAO,IAAI,CAAA,GAAG,cAAc,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,CAAC,EAAE,CAAA;SACtE;IACH,CAAC;CACF,CAAA;AA3EQ,oBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAkDF;CACF,CAAA;AAE8B;IAA9B,QAAQ,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;4CAAe;AACjB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAkC;AACjC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAmC;AAClC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAAsB;AACrB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAe;AA3D/B,aAAa;IADzB,aAAa,CAAC,eAAe,CAAC;GAClB,aAAa,CA4EzB;SA5EY,aAAa","sourcesContent":["import { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { ColumnConfig, GristRecord, ZERO_COLUMN, ZERO_RECORD } from '../configure/config-types'\n\n@customElement('ox-card-field')\nexport class DataCardField extends LitElement {\n  static styles = [\n    css`\n      :host {\n        display: flex;\n        align-items: center;\n        justify-content: flex-start;\n        position: relative;\n\n        white-space: normal;\n        overflow: hidden;\n        padding: 1px 7px 1px 0;\n\n        font: inherit;\n      }\n\n      * {\n        flex: 1;\n        margin: 0;\n        text-align: left;\n      }\n\n      *[center] {\n        flex: none;\n        margin: 0 auto;\n      }\n      :host([name]) {\n        display: block;\n      }\n      :host([name]) label {\n        display: block;\n        font: var(--data-card-item-name-label-font);\n        color: var(--data-card-item-name-label-color);\n      }\n      label {\n        flex: none;\n        width: 33%;\n        padding-bottom: 2px;\n        font: var(--data-card-item-etc-label-font);\n        text-transform: capitalize;\n      }\n\n      input[type='checkbox'],\n      input[type='radio'] {\n        zoom: var(--grist-input-zoom);\n      }\n\n      @media only screen and (max-width: 460px) {\n        *[center] {\n          margin: initial;\n        }\n      }\n    `\n  ]\n\n  @property({ attribute: true }) align?: string\n  @property({ type: Object }) record: GristRecord = ZERO_RECORD\n  @property({ type: Object }) column: ColumnConfig = ZERO_COLUMN\n  @property({ type: Number }) rowIndex: number = -1\n  @property({ type: Object }) value?: object\n\n  render() {\n    var { value, column, record, rowIndex } = this\n\n    var {\n      label,\n      record: { renderer: recordRenderer }\n    } = column\n\n    if (typeof label == 'object') {\n      let { renderer: labelRenderer } = label\n      return html`<label>${labelRenderer()}</label>${recordRenderer(value, column, record, rowIndex, this)}`\n    } else {\n      return html`${recordRenderer(value, column, record, rowIndex, this)}`\n    }\n  }\n}\n"]}
+{"version":3,"file":"data-card-field.js","sourceRoot":"","sources":["../../../src/data-card/data-card-field.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AACpE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAG3D,IAAa,aAAa,GAA1B,MAAa,aAAc,SAAQ,UAAU;IAA7C;;QAwD8B,WAAM,GAAgB,WAAW,CAAA;QACjC,WAAM,GAAiB,WAAW,CAAA;QAClC,aAAQ,GAAW,CAAC,CAAC,CAAA;IAkBnD,CAAC;IAfC,MAAM;QACJ,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAA;QAE9C,IAAI,EACF,KAAK,EACL,MAAM,EAAE,EAAE,QAAQ,EAAE,cAAc,EAAE,EACrC,GAAG,MAAM,CAAA;QAEV,IAAI,OAAO,KAAK,IAAI,QAAQ,EAAE;YAC5B,IAAI,EAAE,QAAQ,EAAE,aAAa,EAAE,GAAG,KAAK,CAAA;YACvC,OAAO,IAAI,CAAA,UAAU,aAAa,EAAE,WAAW,cAAc,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,CAAC,EAAE,CAAA;SACvG;aAAM;YACL,OAAO,IAAI,CAAA,GAAG,cAAc,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,CAAC,EAAE,CAAA;SACtE;IACH,CAAC;CACF,CAAA;AA3EQ,oBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAkDF;CACF,CAAA;AAE8B;IAA9B,QAAQ,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;4CAAe;AACjB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAkC;AACjC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAmC;AAClC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAAsB;AACrB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAe;AA3D/B,aAAa;IADzB,aAAa,CAAC,eAAe,CAAC;GAClB,aAAa,CA4EzB;SA5EY,aAAa","sourcesContent":["import { LitElement, css, html } from 'lit'\nimport { ZERO_COLUMN, ZERO_RECORD } from '../configure/config-types'\nimport { customElement, property } from 'lit/decorators.js'\n\n@customElement('ox-card-field')\nexport class DataCardField extends LitElement {\n  static styles = [\n    css`\n      :host {\n        display: flex;\n        align-items: center;\n        justify-content: flex-start;\n        position: relative;\n\n        white-space: normal;\n        overflow: hidden;\n        padding: 1px 7px 1px 0;\n\n        font: inherit;\n      }\n\n      * {\n        flex: 1;\n        margin: 0;\n        text-align: left;\n      }\n\n      *[center] {\n        flex: none;\n        margin: 0 auto;\n      }\n      :host([name]) {\n        display: block;\n      }\n      :host([name]) label {\n        display: block;\n        font: var(--data-card-item-name-label-font);\n        color: var(--data-card-item-name-label-color);\n      }\n      label {\n        flex: none;\n        width: 33%;\n        padding-bottom: 2px;\n        font: var(--data-card-item-etc-label-font);\n        text-transform: capitalize;\n      }\n\n      input[type='checkbox'],\n      input[type='radio'] {\n        zoom: var(--grist-input-zoom);\n      }\n\n      @media only screen and (max-width: 460px) {\n        *[center] {\n          margin: initial;\n        }\n      }\n    `\n  ]\n\n  @property({ attribute: true }) align?: string\n  @property({ type: Object }) record: GristRecord = ZERO_RECORD\n  @property({ type: Object }) column: ColumnConfig = ZERO_COLUMN\n  @property({ type: Number }) rowIndex: number = -1\n  @property({ type: Object }) value?: object\n\n  render() {\n    var { value, column, record, rowIndex } = this\n\n    var {\n      label,\n      record: { renderer: recordRenderer }\n    } = column\n\n    if (typeof label == 'object') {\n      let { renderer: labelRenderer } = label\n      return html`<label>${labelRenderer()}</label>${recordRenderer(value, column, record, rowIndex, this)}`\n    } else {\n      return html`${recordRenderer(value, column, record, rowIndex, this)}`\n    }\n  }\n}\n"]}

package/dist/src/data-card/data-card-gutter-menu.js

@@ -1,7 +1,7 @@
 import { __decorate } from "tslib";
 import '@material/mwc-icon';
 import './data-card-gutter';
-import { css, html, LitElement } from 'lit';
+import { LitElement, css, html } from 'lit';
 import { customElement, property, query } from 'lit/decorators.js';
 import { PopupMenu } from '@operato/popup';
 let DataCardGutterMenu = class DataCardGutterMenu extends LitElement {

package/dist/src/data-card/data-card-gutter-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-card-gutter-menu.js","sourceRoot":"","sources":["../../../src/data-card/data-card-gutter-menu.ts"],"names":[],"mappings":";AAAA,OAAO,oBAAoB,CAAA;AAC3B,OAAO,oBAAoB,CAAA;AAE3B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAElE,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAK1C,IAAM,kBAAkB,GAAxB,MAAM,kBAAmB,SAAQ,UAAU;IAiBzC,MAAM;QACJ,OAAO,IAAI,CAAA;yBACU,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE;;KAE7C,CAAA;IACH,CAAC;IAED,UAAU;QACR,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,OAAO,CAAC,GAAG,CAChB,MAAM,CAAC,EAAE,CAAC,IAAI,CAAA;;wBAEE,IAAI,CAAC,QAAQ;sBACf,MAAM;sBACN,IAAI,CAAC,MAAM;qBACZ,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC;;;;SAIpC,CACF;KACF,CAAA;IACH,CAAC;IAED,IAAI;QACF,MAAM,GAAG,GAAG,CAAC,CAAA;QACb,MAAM,IAAI,GAAI,IAAI,CAAC,IAAoB,CAAC,WAAW,CAAA;QACnD,MAAM,MAAM,GAAG,IAAI,CAAA;QAEnB,SAAS,CAAC,IAAI,CAAC;YACb,QAAQ,EAAE,IAAI,CAAC,UAAU,EAAE;YAC3B,GAAG;YACH,IAAI;YACJ,MAAM;SACP,CAAC,CAAA;IACJ,CAAC;CACF,CAAA;AApDQ,yBAAM,GAAG,GAAG,CAAA;;;;;;;;GAQlB,CAAA;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDAAyB;AACxB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oDAAkB;AACjB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAAqB;AAE7B;IAAlB,KAAK,CAAC,UAAU,CAAC;gDAAe;AAf7B,kBAAkB;IADvB,aAAa,CAAC,qBAAqB,CAAC;GAC/B,kBAAkB,CAqDvB","sourcesContent":["import '@material/mwc-icon'\nimport './data-card-gutter'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { PopupMenu } from '@operato/popup'\n\nimport { ColumnConfig, GristRecord } from '../configure/config-types'\n\n@customElement('ox-card-gutter-menu')\nclass DataCardGutterMenu extends LitElement {\n  static styles = css`\n    :host {\n      position: relative;\n    }\n\n    mwc-icon {\n      cursor: pointer;\n    }\n  `\n\n  @property({ type: Object }) gutters!: ColumnConfig[]\n  @property({ type: Number }) rowIndex!: number\n  @property({ type: Object }) record!: GristRecord\n\n  @query('mwc-icon') icon!: Element\n\n  render() {\n    return html`\n      <mwc-icon @click=${(e: Event) => this.open()}>more_horiz</mwc-icon>\n      <slot></slot>\n    `\n  }\n\n  menuRender() {\n    return html`\n      ${this.gutters.map(\n        gutter => html`\n          <ox-card-gutter\n            .rowIndex=${this.rowIndex}\n            .column=${gutter}\n            .record=${this.record}\n            .value=${this.record[gutter.name]}\n            menu\n            alive-on-select\n          ></ox-card-gutter>\n        `\n      )}\n    `\n  }\n\n  open() {\n    const top = 0\n    const left = (this.icon as HTMLElement).offsetWidth\n    const parent = this\n\n    PopupMenu.open({\n      template: this.menuRender(),\n      top,\n      left,\n      parent\n    })\n  }\n}\n"]}
+{"version":3,"file":"data-card-gutter-menu.js","sourceRoot":"","sources":["../../../src/data-card/data-card-gutter-menu.ts"],"names":[],"mappings":";AAAA,OAAO,oBAAoB,CAAA;AAC3B,OAAO,oBAAoB,CAAA;AAE3B,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAElE,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAG1C,IAAM,kBAAkB,GAAxB,MAAM,kBAAmB,SAAQ,UAAU;IAiBzC,MAAM;QACJ,OAAO,IAAI,CAAA;yBACU,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE;;KAE7C,CAAA;IACH,CAAC;IAED,UAAU;QACR,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,OAAO,CAAC,GAAG,CAChB,MAAM,CAAC,EAAE,CAAC,IAAI,CAAA;;wBAEE,IAAI,CAAC,QAAQ;sBACf,MAAM;sBACN,IAAI,CAAC,MAAM;qBACZ,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC;;;;SAIpC,CACF;KACF,CAAA;IACH,CAAC;IAED,IAAI;QACF,MAAM,GAAG,GAAG,CAAC,CAAA;QACb,MAAM,IAAI,GAAI,IAAI,CAAC,IAAoB,CAAC,WAAW,CAAA;QACnD,MAAM,MAAM,GAAG,IAAI,CAAA;QAEnB,SAAS,CAAC,IAAI,CAAC;YACb,QAAQ,EAAE,IAAI,CAAC,UAAU,EAAE;YAC3B,GAAG;YACH,IAAI;YACJ,MAAM;SACP,CAAC,CAAA;IACJ,CAAC;CACF,CAAA;AApDQ,yBAAM,GAAG,GAAG,CAAA;;;;;;;;GAQlB,CAAA;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDAAyB;AACxB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oDAAkB;AACjB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAAqB;AAE7B;IAAlB,KAAK,CAAC,UAAU,CAAC;gDAAe;AAf7B,kBAAkB;IADvB,aAAa,CAAC,qBAAqB,CAAC;GAC/B,kBAAkB,CAqDvB","sourcesContent":["import '@material/mwc-icon'\nimport './data-card-gutter'\n\nimport { LitElement, css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { PopupMenu } from '@operato/popup'\n\n@customElement('ox-card-gutter-menu')\nclass DataCardGutterMenu extends LitElement {\n  static styles = css`\n    :host {\n      position: relative;\n    }\n\n    mwc-icon {\n      cursor: pointer;\n    }\n  `\n\n  @property({ type: Object }) gutters!: ColumnConfig[]\n  @property({ type: Number }) rowIndex!: number\n  @property({ type: Object }) record!: GristRecord\n\n  @query('mwc-icon') icon!: Element\n\n  render() {\n    return html`\n      <mwc-icon @click=${(e: Event) => this.open()}>more_horiz</mwc-icon>\n      <slot></slot>\n    `\n  }\n\n  menuRender() {\n    return html`\n      ${this.gutters.map(\n        gutter => html`\n          <ox-card-gutter\n            .rowIndex=${this.rowIndex}\n            .column=${gutter}\n            .record=${this.record}\n            .value=${this.record[gutter.name]}\n            menu\n            alive-on-select\n          ></ox-card-gutter>\n        `\n      )}\n    `\n  }\n\n  open() {\n    const top = 0\n    const left = (this.icon as HTMLElement).offsetWidth\n    const parent = this\n\n    PopupMenu.open({\n      template: this.menuRender(),\n      top,\n      left,\n      parent\n    })\n  }\n}\n"]}

package/dist/src/data-card/data-card-gutter.js

@@ -1,7 +1,7 @@
 import { __decorate } from "tslib";
-import { css, html, LitElement } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
+import { LitElement, css, html } from 'lit';
 import { ZERO_COLUMN, ZERO_RECORD } from '../configure/config-types';
+import { customElement, property } from 'lit/decorators.js';
 const DEFAULT_TEXT_ALIGN = 'left';
 let DataCardGutter = class DataCardGutter extends LitElement {
     constructor() {

package/dist/src/data-card/data-card-gutter.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-card-gutter.js","sourceRoot":"","sources":["../../../src/data-card/data-card-gutter.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAA;AAC3D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAA6B,WAAW,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AAE/F,MAAM,kBAAkB,GAAG,MAAM,CAAA;AAGjC,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,UAAU;IAAvC;;QAgC8B,WAAM,GAAgB,WAAW,CAAA;QACjC,WAAM,GAAiB,WAAW,CAAA;QAClC,aAAQ,GAAW,CAAC,CAAC,CAAA;IAiCnD,CAAC;IA9BC,IAAI,SAAS;QACX,OAAO,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,CAAA;IACrC,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE;YAChB,OAAO,IAAI,CAAA,EAAE,CAAA;SACd;QAED,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAA;QAC9C,IAAI,EAAE,QAAQ,EAAE,GAAG,MAAM,CAAC,MAAM,CAAA;QAEhC,oEAAoE;QACpE,OAAO,IAAI,CAAA,IAAI,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,CAAC,GAAG,CAAA;IACnE,CAAC;IAED,OAAO,CAAC,OAA6B;QACnC,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE;YACzB,IAAI,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,IAAI,kBAAkB,CAAA;YAC1D,IAAI,KAAK,IAAI,kBAAkB,EAAE;gBAC/B,IAAI,OAAO,GAAG,QAAQ,CAAA;gBACtB,QAAQ,KAAK,EAAE;oBACb,KAAK,OAAO;wBACV,OAAO,GAAG,UAAU,CAAA;wBACpB,MAAK;iBACR;gBACD,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,oCAAoC,EAAE,OAAO,CAAC,CAAA;aACtE;SACF;IACH,CAAC;CACF,CAAA;AAlEQ,qBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;KA0BF;CACF,CAAA;AAE8B;IAA9B,QAAQ,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;6CAAe;AACjB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAkC;AACjC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAmC;AAClC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDAAsB;AACrB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAe;AAnCtC,cAAc;IADnB,aAAa,CAAC,gBAAgB,CAAC;GAC1B,cAAc,CAmEnB","sourcesContent":["import { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { ColumnConfig, GristRecord, ZERO_COLUMN, ZERO_RECORD } from '../configure/config-types'\n\nconst DEFAULT_TEXT_ALIGN = 'left'\n\n@customElement('ox-card-gutter')\nclass DataCardGutter extends LitElement {\n  static styles = [\n    css`\n      :host {\n        background-color: transparent;\n\n        font-size: var(--grid-record-wide-fontsize);\n        text-overflow: ellipsis;\n        color: var(--grid-record-color);\n      }\n\n      * {\n        flex: 1;\n        margin: 0;\n        margin-bottom: 1px;\n        border: var(--data-card-item-btn-border);\n        border-radius: var(--data-card-item-btn-border-radius);\n        padding: var(--data-card-item-btn-padding);\n      }\n      *:hover {\n        color: var(--grid-record-color-hover);\n        cursor: pointer;\n      }\n\n      *[center] {\n        flex: none;\n        margin: 0 auto;\n      }\n    `\n  ]\n\n  @property({ attribute: true }) align?: string\n  @property({ type: Object }) record: GristRecord = ZERO_RECORD\n  @property({ type: Object }) column: ColumnConfig = ZERO_COLUMN\n  @property({ type: Number }) rowIndex: number = -1\n  @property({ type: Object }) value?: object\n\n  get isEditing() {\n    return this.hasAttribute('editing')\n  }\n\n  render() {\n    if (!this.column) {\n      return html``\n    }\n\n    var { value, column, record, rowIndex } = this\n    var { renderer } = column.record\n\n    /* renderer가 html template이 아니고 단순한 값인 경우가 있으므로, html 템플릿으로 감싸준다. */\n    return html` ${renderer(value, column, record, rowIndex, this)} `\n  }\n\n  updated(changes: PropertyValues<this>) {\n    if (changes.has('column')) {\n      var align = this.column.record.align || DEFAULT_TEXT_ALIGN\n      if (align != DEFAULT_TEXT_ALIGN) {\n        let justify = 'center'\n        switch (align) {\n          case 'right':\n            justify = 'flex-end'\n            break\n        }\n        this.style.setProperty('--data-card-gutter-justify-content', justify)\n      }\n    }\n  }\n}\n"]}
+{"version":3,"file":"data-card-gutter.js","sourceRoot":"","sources":["../../../src/data-card/data-card-gutter.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAkB,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC3D,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAA;AACpE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,MAAM,kBAAkB,GAAG,MAAM,CAAA;AAGjC,IAAM,cAAc,GAApB,MAAM,cAAe,SAAQ,UAAU;IAAvC;;QAgC8B,WAAM,GAAgB,WAAW,CAAA;QACjC,WAAM,GAAiB,WAAW,CAAA;QAClC,aAAQ,GAAW,CAAC,CAAC,CAAA;IAiCnD,CAAC;IA9BC,IAAI,SAAS;QACX,OAAO,IAAI,CAAC,YAAY,CAAC,SAAS,CAAC,CAAA;IACrC,CAAC;IAED,MAAM;QACJ,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE;YAChB,OAAO,IAAI,CAAA,EAAE,CAAA;SACd;QAED,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAA;QAC9C,IAAI,EAAE,QAAQ,EAAE,GAAG,MAAM,CAAC,MAAM,CAAA;QAEhC,oEAAoE;QACpE,OAAO,IAAI,CAAA,IAAI,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,CAAC,GAAG,CAAA;IACnE,CAAC;IAED,OAAO,CAAC,OAA6B;QACnC,IAAI,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE;YACzB,IAAI,KAAK,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,IAAI,kBAAkB,CAAA;YAC1D,IAAI,KAAK,IAAI,kBAAkB,EAAE;gBAC/B,IAAI,OAAO,GAAG,QAAQ,CAAA;gBACtB,QAAQ,KAAK,EAAE;oBACb,KAAK,OAAO;wBACV,OAAO,GAAG,UAAU,CAAA;wBACpB,MAAK;iBACR;gBACD,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,oCAAoC,EAAE,OAAO,CAAC,CAAA;aACtE;SACF;IACH,CAAC;CACF,CAAA;AAlEQ,qBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;KA0BF;CACF,CAAA;AAE8B;IAA9B,QAAQ,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;6CAAe;AACjB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAkC;AACjC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAmC;AAClC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDAAsB;AACrB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAe;AAnCtC,cAAc;IADnB,aAAa,CAAC,gBAAgB,CAAC;GAC1B,cAAc,CAmEnB","sourcesContent":["import { LitElement, PropertyValues, css, html } from 'lit'\nimport { ZERO_COLUMN, ZERO_RECORD } from '../configure/config-types'\nimport { customElement, property } from 'lit/decorators.js'\n\nconst DEFAULT_TEXT_ALIGN = 'left'\n\n@customElement('ox-card-gutter')\nclass DataCardGutter extends LitElement {\n  static styles = [\n    css`\n      :host {\n        background-color: transparent;\n\n        font-size: var(--grid-record-wide-fontsize);\n        text-overflow: ellipsis;\n        color: var(--grid-record-color);\n      }\n\n      * {\n        flex: 1;\n        margin: 0;\n        margin-bottom: 1px;\n        border: var(--data-card-item-btn-border);\n        border-radius: var(--data-card-item-btn-border-radius);\n        padding: var(--data-card-item-btn-padding);\n      }\n      *:hover {\n        color: var(--grid-record-color-hover);\n        cursor: pointer;\n      }\n\n      *[center] {\n        flex: none;\n        margin: 0 auto;\n      }\n    `\n  ]\n\n  @property({ attribute: true }) align?: string\n  @property({ type: Object }) record: GristRecord = ZERO_RECORD\n  @property({ type: Object }) column: ColumnConfig = ZERO_COLUMN\n  @property({ type: Number }) rowIndex: number = -1\n  @property({ type: Object }) value?: object\n\n  get isEditing() {\n    return this.hasAttribute('editing')\n  }\n\n  render() {\n    if (!this.column) {\n      return html``\n    }\n\n    var { value, column, record, rowIndex } = this\n    var { renderer } = column.record\n\n    /* renderer가 html template이 아니고 단순한 값인 경우가 있으므로, html 템플릿으로 감싸준다. */\n    return html` ${renderer(value, column, record, rowIndex, this)} `\n  }\n\n  updated(changes: PropertyValues<this>) {\n    if (changes.has('column')) {\n      var align = this.column.record.align || DEFAULT_TEXT_ALIGN\n      if (align != DEFAULT_TEXT_ALIGN) {\n        let justify = 'center'\n        switch (align) {\n          case 'right':\n            justify = 'flex-end'\n            break\n        }\n        this.style.setProperty('--data-card-gutter-justify-content', justify)\n      }\n    }\n  }\n}\n"]}

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

@@ -1,7 +1,6 @@
 import '@material/mwc-icon';
 import './record-card';
 import { LitElement, PropertyValues } from 'lit';
-import { ColumnConfig, GristConfig, GristData, GristRecord } from '../configure/config-types';
 export declare class DataCard extends LitElement {
     static styles: import("lit").CSSResult[];
     config: GristConfig;

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

@@ -1,9 +1,9 @@
 import { __decorate } from "tslib";
 import '@material/mwc-icon';
 import './record-card';
-import { css, html, LitElement } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
+import { LitElement, css, html } from 'lit';
 import { ZERO_CONFIG, ZERO_DATA } from '../configure/config-types';
+import { customElement, property } from 'lit/decorators.js';
 import { dataCardClickHandler } from './event-handlers/data-card-click-handler';
 import { dataCardDblclickHandler } from './event-handlers/data-card-dblclick-handler';
 let DataCard = class DataCard extends LitElement {

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

@@ -1 +1 @@
-{"version":3,"file":"data-card.js","sourceRoot":"","sources":["../../../src/data-card/data-card.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/mwc-icon'\nimport './record-card'\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { ColumnConfig, GristConfig, GristData, GristRecord, ZERO_CONFIG, ZERO_DATA } from '../configure/config-types'\nimport { dataCardClickHandler } from './event-handlers/data-card-click-handler'\nimport { dataCardDblclickHandler } from './event-handlers/data-card-dblclick-handler'\n\n@customElement('ox-card')\nexport class DataCard extends LitElement {\n  static styles = [\n    css`\n      :host {\n        background-color: var(--data-card-background-color);\n        overflow-y: auto;\n        padding: var(--padding-wide);\n\n        display: grid;\n        grid-template-columns: var(--data-card-template);\n        grid-template-rows: min-content;\n        grid-gap: var(--margin-wide);\n      }\n\n      ox-record-card {\n        align-items: stretch;\n        background-color: var(--data-card-record-card-background-color);\n        border: var(--data-card-record-card-border);\n        border-radius: var(--data-card-record-card-border-radius);\n      }\n      ox-record-card:hover {\n        border: var(--data-card-record-card-border-hover);\n        box-shadow: var(--data-card-record-card-boxshadow-hover);\n      }\n\n      [selected-row] {\n        background-color: var(--data-card-record-card-selected-border);\n      }\n\n      #upward {\n        --mdc-icon-size: 26px;\n        position: absolute;\n        top: var(--data-card-fab-position-vertical);\n        right: var(--data-card-fab-position-horizontal);\n        background-color: rgba(255, 255, 255, 0.7);\n        border-radius: 20px;\n        color: var(--data-card-fab-color);\n        box-shadow: var(--data-card-fab-shadow);\n        padding: 7px;\n      }\n\n      slot {\n        width: 100%;\n      }\n\n      slot[name='headroom'] {\n        display: flex;\n        position: absolute;\n        top: 0;\n      }\n\n      @media screen and (max-width: 460px) {\n        #setting {\n          grid-template-columns: 1fr;\n          grid-template-rows: 1fr 1fr;\n        }\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    this.renderRoot.addEventListener('click', dataCardClickHandler.bind(this) as EventListener)\n    this.renderRoot.addEventListener('dblclick', dataCardDblclickHandler.bind(this) as EventListener)\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\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    return html`\n      ${records.map(\n        (record, rowIndex) => html`\n          <ox-record-card\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-card>\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-card.js","sourceRoot":"","sources":["../../../src/data-card/data-card.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/mwc-icon'\nimport './record-card'\n\nimport { LitElement, PropertyValues, css, html } from 'lit'\nimport { ZERO_CONFIG, ZERO_DATA } from '../configure/config-types'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { dataCardClickHandler } from './event-handlers/data-card-click-handler'\nimport { dataCardDblclickHandler } from './event-handlers/data-card-dblclick-handler'\n\n@customElement('ox-card')\nexport class DataCard extends LitElement {\n  static styles = [\n    css`\n      :host {\n        background-color: var(--data-card-background-color);\n        overflow-y: auto;\n        padding: var(--padding-wide);\n\n        display: grid;\n        grid-template-columns: var(--data-card-template);\n        grid-template-rows: min-content;\n        grid-gap: var(--margin-wide);\n      }\n\n      ox-record-card {\n        align-items: stretch;\n        background-color: var(--data-card-record-card-background-color);\n        border: var(--data-card-record-card-border);\n        border-radius: var(--data-card-record-card-border-radius);\n      }\n      ox-record-card:hover {\n        border: var(--data-card-record-card-border-hover);\n        box-shadow: var(--data-card-record-card-boxshadow-hover);\n      }\n\n      [selected-row] {\n        background-color: var(--data-card-record-card-selected-border);\n      }\n\n      #upward {\n        --mdc-icon-size: 26px;\n        position: absolute;\n        top: var(--data-card-fab-position-vertical);\n        right: var(--data-card-fab-position-horizontal);\n        background-color: rgba(255, 255, 255, 0.7);\n        border-radius: 20px;\n        color: var(--data-card-fab-color);\n        box-shadow: var(--data-card-fab-shadow);\n        padding: 7px;\n      }\n\n      slot {\n        width: 100%;\n      }\n\n      slot[name='headroom'] {\n        display: flex;\n        position: absolute;\n        top: 0;\n      }\n\n      @media screen and (max-width: 460px) {\n        #setting {\n          grid-template-columns: 1fr;\n          grid-template-rows: 1fr 1fr;\n        }\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    this.renderRoot.addEventListener('click', dataCardClickHandler.bind(this) as EventListener)\n    this.renderRoot.addEventListener('dblclick', dataCardDblclickHandler.bind(this) as EventListener)\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\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    return html`\n      ${records.map(\n        (record, rowIndex) => html`\n          <ox-record-card\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-card>\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-card/event-handlers/record-card-click-handler.js.map

@@ -1 +1 @@
-{"version":3,"file":"record-card-click-handler.js","sourceRoot":"","sources":["../../../../src/data-card/event-handlers/record-card-click-handler.ts"],"names":[],"mappings":"AAGA;;;;GAIG;AACH,MAAM,UAAU,sBAAsB,CAAmB,CAAa;IACpE,CAAC,CAAC,eAAe,EAAE,CAAA;IAEnB,4DAA4D;IAC5D,IAAI,MAAM,GAAG,CAAC,CAAC,MAAa,CAAA;IAC5B,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,GAAG,MAK/C,CAAA;IAED,IAAI,MAAM,IAAI,MAAM,CAAC,IAAI,IAAI,QAAQ,EAAE;QACrC,oBAAoB;QACpB,6BAA6B;QAC7B,IAAI,EAAE,KAAK,EAAE,GAAG,MAAM,CAAC,QAAQ,CAAA;QAC/B,KAAK,IAAI,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAA;QAEhF,OAAM;KACP;SAAM;QACL,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAA;QACpD,IAAI,SAAS,EAAE;YACb,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAA;SAC5E;aAAM;YACL,uCAAuC;YACvC,IAAI,CAAC,eAAe,EAAE,CAAA;SACvB;KACF;AACH,CAAC","sourcesContent":["import { ColumnConfig, GristRecord } from '../../configure/config-types'\nimport { RecordCard } from '../record-card'\n\n/**\n * ox-record-card 의 click handler\n *\n * - handler의 this 는 ox-record-card임.\n */\nexport function recordCardClickHandler(this: RecordCard, e: MouseEvent): void {\n  e.stopPropagation()\n\n  /* current-target should be [content] or 'ox-card-gutter' */\n  var target = e.target as any\n  var { column, record, rowIndex, columnIndex } = target as {\n    column: ColumnConfig\n    record: GristRecord\n    rowIndex: number\n    columnIndex: number\n  }\n\n  if (column && column.type == 'gutter') {\n    /* Gutter가 클릭된 경우 */\n    /* do column click handler */\n    var { click } = column.handlers\n    click && click(this.config.columns, this.data, column, record, rowIndex, target)\n\n    return\n  } else {\n    var { click: rowsClick } = this.config.rows.handlers\n    if (rowsClick) {\n      rowsClick(this.config.columns, this.data, column, record, rowIndex, target)\n    } else {\n      /* content 가 클릭된 경우 - 레코드뷰 팝업을 실행한다. */\n      this.popupRecordView()\n    }\n  }\n}\n"]}
+{"version":3,"file":"record-card-click-handler.js","sourceRoot":"","sources":["../../../../src/data-card/event-handlers/record-card-click-handler.ts"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,MAAM,UAAU,sBAAsB,CAAmB,CAAa;IACpE,CAAC,CAAC,eAAe,EAAE,CAAA;IAEnB,4DAA4D;IAC5D,IAAI,MAAM,GAAG,CAAC,CAAC,MAAa,CAAA;IAC5B,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,GAAG,MAK/C,CAAA;IAED,IAAI,MAAM,IAAI,MAAM,CAAC,IAAI,IAAI,QAAQ,EAAE;QACrC,oBAAoB;QACpB,6BAA6B;QAC7B,IAAI,EAAE,KAAK,EAAE,GAAG,MAAM,CAAC,QAAQ,CAAA;QAC/B,KAAK,IAAI,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAA;QAEhF,OAAM;KACP;SAAM;QACL,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAA;QACpD,IAAI,SAAS,EAAE;YACb,SAAS,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAA;SAC5E;aAAM;YACL,uCAAuC;YACvC,IAAI,CAAC,eAAe,EAAE,CAAA;SACvB;KACF;AACH,CAAC","sourcesContent":["import { RecordCard } from '../record-card'\n\n/**\n * ox-record-card 의 click handler\n *\n * - handler의 this 는 ox-record-card임.\n */\nexport function recordCardClickHandler(this: RecordCard, e: MouseEvent): void {\n  e.stopPropagation()\n\n  /* current-target should be [content] or 'ox-card-gutter' */\n  var target = e.target as any\n  var { column, record, rowIndex, columnIndex } = target as {\n    column: ColumnConfig\n    record: GristRecord\n    rowIndex: number\n    columnIndex: number\n  }\n\n  if (column && column.type == 'gutter') {\n    /* Gutter가 클릭된 경우 */\n    /* do column click handler */\n    var { click } = column.handlers\n    click && click(this.config.columns, this.data, column, record, rowIndex, target)\n\n    return\n  } else {\n    var { click: rowsClick } = this.config.rows.handlers\n    if (rowsClick) {\n      rowsClick(this.config.columns, this.data, column, record, rowIndex, target)\n    } else {\n      /* content 가 클릭된 경우 - 레코드뷰 팝업을 실행한다. */\n      this.popupRecordView()\n    }\n  }\n}\n"]}

package/dist/src/data-card/event-handlers/record-card-dblclick-handler.js.map

@@ -1 +1 @@
-{"version":3,"file":"record-card-dblclick-handler.js","sourceRoot":"","sources":["../../../../src/data-card/event-handlers/record-card-dblclick-handler.ts"],"names":[],"mappings":"AAGA;;;;GAIG;AACH,MAAM,UAAU,yBAAyB,CAAmB,CAAa;IACvE,CAAC,CAAC,eAAe,EAAE,CAAA;IAEnB,4DAA4D;IAC5D,IAAI,MAAM,GAAG,CAAC,CAAC,MAAa,CAAA;IAC5B,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,GAAG,MAK/C,CAAA;IAED,IAAI,MAAM,IAAI,MAAM,CAAC,IAAI,IAAI,QAAQ,EAAE;QACrC;;;;WAIG;QACH,6BAA6B;QAC7B,qCAAqC;QACrC,kFAAkF;QAClF,SAAS;KACV;SAAM;QACL,IAAI,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAA;QAC1D,IAAI,YAAY,EAAE;YAChB,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAA;SAC/E;KACF;AACH,CAAC","sourcesContent":["import { ColumnConfig, GristRecord } from '../../configure/config-types'\nimport { RecordCard } from '../record-card'\n\n/**\n * ox-record-card 의 dblclick handler\n *\n * - handler의 this 는 ox-record-card임.\n */\nexport function recordCardDblClickHandler(this: RecordCard, e: MouseEvent): void {\n  e.stopPropagation()\n\n  /* current-target should be [content] or 'ox-card-gutter' */\n  var target = e.target as any\n  var { column, record, rowIndex, columnIndex } = target as {\n    column: ColumnConfig\n    record: GristRecord\n    rowIndex: number\n    columnIndex: number\n  }\n\n  if (column && column.type == 'gutter') {\n    /*\n     * Gutter가 클릭된 경우\n     * TODO ox-record-card의 dblclick handling의 성능을 확인하고,\n     * gutter에 dblclick를 적용할 수 있는 지 확인한 후에 활성화하자.\n     */\n    /* do column click handler */\n    // var { dblclick } = column.handlers\n    // dblclick && dblclick(this.columns, this.data, column, record, rowIndex, target)\n    // return\n  } else {\n    var { dblclick: rowsDblClick } = this.config.rows.handlers\n    if (rowsDblClick) {\n      rowsDblClick(this.config.columns, this.data, column, record, rowIndex, target)\n    }\n  }\n}\n"]}
+{"version":3,"file":"record-card-dblclick-handler.js","sourceRoot":"","sources":["../../../../src/data-card/event-handlers/record-card-dblclick-handler.ts"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,MAAM,UAAU,yBAAyB,CAAmB,CAAa;IACvE,CAAC,CAAC,eAAe,EAAE,CAAA;IAEnB,4DAA4D;IAC5D,IAAI,MAAM,GAAG,CAAC,CAAC,MAAa,CAAA;IAC5B,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,GAAG,MAK/C,CAAA;IAED,IAAI,MAAM,IAAI,MAAM,CAAC,IAAI,IAAI,QAAQ,EAAE;QACrC;;;;WAIG;QACH,6BAA6B;QAC7B,qCAAqC;QACrC,kFAAkF;QAClF,SAAS;KACV;SAAM;QACL,IAAI,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAA;QAC1D,IAAI,YAAY,EAAE;YAChB,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAA;SAC/E;KACF;AACH,CAAC","sourcesContent":["import { RecordCard } from '../record-card'\n\n/**\n * ox-record-card 의 dblclick handler\n *\n * - handler의 this 는 ox-record-card임.\n */\nexport function recordCardDblClickHandler(this: RecordCard, e: MouseEvent): void {\n  e.stopPropagation()\n\n  /* current-target should be [content] or 'ox-card-gutter' */\n  var target = e.target as any\n  var { column, record, rowIndex, columnIndex } = target as {\n    column: ColumnConfig\n    record: GristRecord\n    rowIndex: number\n    columnIndex: number\n  }\n\n  if (column && column.type == 'gutter') {\n    /*\n     * Gutter가 클릭된 경우\n     * TODO ox-record-card의 dblclick handling의 성능을 확인하고,\n     * gutter에 dblclick를 적용할 수 있는 지 확인한 후에 활성화하자.\n     */\n    /* do column click handler */\n    // var { dblclick } = column.handlers\n    // dblclick && dblclick(this.columns, this.data, column, record, rowIndex, target)\n    // return\n  } else {\n    var { dblclick: rowsDblClick } = this.config.rows.handlers\n    if (rowsDblClick) {\n      rowsDblClick(this.config.columns, this.data, column, record, rowIndex, target)\n    }\n  }\n}\n"]}

package/dist/src/data-card/record-card.d.ts

@@ -3,7 +3,6 @@ import './data-card-field';
 import '../record-view';
 import './data-card-gutter';
 import { LitElement, PropertyValues } from 'lit';
-import { GristConfig, GristData, GristRecord } from '../configure/config-types';
 export declare class RecordCard extends LitElement {
     static styles: import("lit").CSSResult[];
     config: GristConfig;

package/dist/src/data-card/record-card.js

@@ -3,9 +3,9 @@ import '@material/mwc-icon';
 import './data-card-field';
 import '../record-view';
 import './data-card-gutter';
-import { css, html, LitElement } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
+import { LitElement, css, html } from 'lit';
 import { ZERO_CONFIG, ZERO_DATA, ZERO_RECORD } from '../configure/config-types';
+import { customElement, property } from 'lit/decorators.js';
 import { recordCardClickHandler } from './event-handlers/record-card-click-handler';
 import { recordCardDblClickHandler } from './event-handlers/record-card-dblclick-handler';
 // TODO 로케일 설정에 따라서 포맷이 바뀌도록 해야한다.

package/dist/src/data-card/record-card.js.map

@@ -1 +1 @@
-{"version":3,"file":"record-card.js","sourceRoot":"","sources":["../../../src/data-card/record-card.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/mwc-icon'\nimport './data-card-field'\nimport '../record-view'\nimport './data-card-gutter'\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { GristConfig, GristData, GristRecord, ZERO_CONFIG, ZERO_DATA, ZERO_RECORD } from '../configure/config-types'\nimport { recordCardClickHandler } from './event-handlers/record-card-click-handler'\nimport { recordCardDblClickHandler } from './event-handlers/record-card-dblclick-handler'\n\n// TODO 로케일 설정에 따라서 포맷이 바뀌도록 해야한다.\nconst OPTIONS: Intl.DateTimeFormatOptions = {\n  year: 'numeric',\n  month: 'numeric',\n  day: 'numeric',\n  hour: 'numeric',\n  minute: 'numeric',\n  second: 'numeric',\n  hour12: false\n  // timeZone: 'America/Los_Angeles'\n}\n\nconst formatter = new Intl.DateTimeFormat(navigator.language, OPTIONS)\n\n@customElement('ox-record-card')\nexport class RecordCard extends LitElement {\n  static styles = [\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        position: relative;\n      }\n\n      :host([dirty])::before {\n        content: '';\n        position: absolute;\n        left: 0;\n        top: 0;\n\n        width: 0px;\n        height: 0px;\n        border-top: var(--grid-record-dirty-border-top);\n        border-right: var(--grid-record-dirty-border-left);\n      }\n\n      [dirty] {\n        position: absolute;\n        margin: 0;\n        height: 20px;\n        font: var(--grid-record-dirty-icon-font);\n        text-indent: 1px;\n        left: 0;\n        top: 0;\n        color: var(--grid-record-dirty-color);\n      }\n\n      [thumbnail] {\n        width: 100%;\n        max-height: var(--data-card-thumbnail-height);\n        border-top-left-radius: var(--data-card-record-card-border-radius);\n        border-top-right-radius: var(--data-card-record-card-border-radius);\n        border-bottom: var(--data-card-thumbnail-border-bottom);\n        overflow: hidden;\n      }\n\n      [content] {\n        display: grid;\n        grid-template:\n          'brief gutters'\n          'detail detail';\n        grid-template-columns: 1fr 35px;\n        margin: var(--data-card-item-margin);\n      }\n\n      [gutters] {\n        width: 50px;\n        grid-area: gutters;\n\n        display: flex;\n        flex-direction: column;\n        justify-content: space-evenly;\n\n        position: relative;\n      }\n      [brief] {\n        grid-area: brief;\n      }\n      [detail] {\n        grid-area: detail;\n      }\n\n      ox-card-gutter {\n        flex: 0 0 14px;\n      }\n\n      ox-card-field {\n        padding-top: 2px;\n        font: var(--data-card-item-etc-font);\n        color: var(--data-card-item-etc-color);\n      }\n\n      ox-card-field[name] {\n        font: var(--data-card-item-name-font);\n        color: var(--data-card-item-name-color);\n      }\n\n      ox-card-field[desc] {\n        font: var(--data-card-item-disc-font);\n        color: var(--data-card-item-disc-color);\n      }\n\n      .update-info {\n        font: var(--data-card-item-etc-font);\n        color: var(--data-card-item-etc-color);\n      }\n\n      .update-info mwc-icon {\n        vertical-align: middle;\n        font-size: 1em;\n      }\n    `\n  ]\n\n  @property({ type: Object }) config: GristConfig = ZERO_CONFIG\n  @property({ type: Object }) data: GristData = ZERO_DATA\n  @property({ type: Object }) record: GristRecord = ZERO_RECORD\n  @property({ type: Number }) rowIndex: number = -1\n  /*\n   * row-selector를 사용자가 변경할 때, record-card의 update를 유도하기 위해 selected-row attribute를 property에 추가함.\n   * (이를 해주지 않으면, 리스트 refresh 경우에 selected-row checkbox가 클리어되지 않는 현상이 발생함.)\n   */\n  @property({ type: Boolean, attribute: 'selected-row' }) selectedRow: boolean = false\n\n  private _recordView: any\n\n  attributeChangedCallback(name: string, oldval: any, newval: any) {\n    super.attributeChangedCallback(name, oldval, newval)\n  }\n\n  onFieldChange(e: Event) {\n    /* record-view의 이벤트를 부모에게로 전달한다. */\n    this.dispatchEvent(\n      new CustomEvent('field-change', {\n        bubbles: true,\n        composed: true,\n        detail: (e as any).detail\n      })\n    )\n  }\n\n  get recordView() {\n    if (!this._recordView) {\n      this._recordView = document.createElement('ox-record-view')\n      this._recordView.addEventListener('field-change', (e: CustomEvent) => this.onFieldChange(e))\n    }\n\n    var columns = this.config.columns\n\n    this._recordView.columns = columns\n    this._recordView.record = this.record\n    this._recordView.rowIndex = this.rowIndex\n\n    return this._recordView\n  }\n\n  firstUpdated() {\n    /*\n      long-press\n      TODO. performance를 확인한 후에 활성화하자.\n    */\n    // longpressable(this.renderRoot.querySelector('[content]'))\n    // this.renderRoot.addEventListener('long-press', recordPartialLongPressHandler.bind(this))\n    this.renderRoot.addEventListener('click', recordCardClickHandler.bind(this) as EventListener)\n    this.renderRoot.addEventListener('dblclick', recordCardDblClickHandler.bind(this) as EventListener)\n  }\n\n  updated(changes: PropertyValues<this>) {\n    if (changes.has('record') && this._recordView) {\n      this._recordView.record = this.record\n    }\n  }\n\n  render() {\n    var record = this.record\n    var rowIndex = this.rowIndex\n    var { columns, list } = this.config\n    var { thumbnail, fields, details } = list || {}\n\n    var briefFields = fields.map(field => columns.find(column => column.name == field)).filter(column => column) || []\n    var detailFields = details.map(field => columns.find(column => column.name == field)).filter(column => column) || []\n\n    var thumbnailTemplate = thumbnail.call(this, record, rowIndex)\n\n    var gutters = (columns || []).filter(column => column.type == 'gutter' && column.forList)\n    var firstGutter = gutters[0]\n\n    if (this.hasAttribute('dirty')) {\n      var dirtyIcon\n\n      switch (this.record['__dirty__']) {\n        case 'M':\n          dirtyIcon = 'done'\n          break\n        case '+':\n          dirtyIcon = 'add'\n          break\n        case '-':\n          dirtyIcon = 'remove'\n          break\n      }\n    }\n\n    return html`\n      ${dirtyIcon ? html` <mwc-icon dirty>${dirtyIcon}</mwc-icon> ` : html``}\n\n      <div thumbnail>${thumbnailTemplate}</div>\n\n      <div content>\n        <div gutters>\n          ${firstGutter\n            ? html`\n                <ox-card-gutter\n                  .rowIndex=${rowIndex}\n                  .column=${firstGutter}\n                  .record=${record}\n                  .value=${record[firstGutter.name]}\n                ></ox-card-gutter>\n              `\n            : html``}\n          ${gutters.length === 2\n            ? html`\n                <ox-card-gutter\n                  .rowIndex=${rowIndex}\n                  .column=${gutters[1]}\n                  .record=${record}\n                  .value=${record[gutters[1].name]}\n                ></ox-card-gutter>\n              `\n            : gutters.length > 2\n            ? html`\n                <ox-card-gutter-menu .gutters=${gutters} .rowIndex=${rowIndex} .record=${record}></ox-card-gutter-menu>\n              `\n            : html``}\n        </div>\n\n        <div brief>\n          ${briefFields.map(\n            (column, idx) =>\n              html`\n                <ox-card-field\n                  .rowIndex=${rowIndex}\n                  .column=${column}\n                  .record=${record}\n                  .value=${record[column?.name || '']}\n                  ?name=${idx == 0}\n                  ?desc=${idx == 1}\n                ></ox-card-field>\n              `\n          )}\n        </div>\n        ${detailFields.length > 0\n          ? html`\n              <div detail>\n                ${detailFields.map(\n                  (column, idx) =>\n                    html`\n                      <ox-card-field\n                        .rowIndex=${rowIndex}\n                        .column=${column}\n                        .record=${record}\n                        .value=${record[column?.name || '']}\n                      ></ox-card-field>\n                    `\n                )}\n              </div>\n            `\n          : html``}\n      </div>\n    `\n  }\n\n  popupRecordView() {\n    var titleField = this.config.list.fields[0] || 'name'\n    var title = this.record[titleField]\n\n    /* field가 오브젝트형인 경우에는 렌더러를 타이틀로 사용한다. */\n    if (typeof title == 'object') {\n      var column = this.config.columns.find(column => column.name == titleField)\n      title = column?.record.renderer(title, column, this.record, this.rowIndex, this /* cautious */)\n    }\n\n    document.dispatchEvent(\n      new CustomEvent('open-popup', {\n        detail: {\n          template: this.recordView,\n          options: {\n            backdrop: true,\n            size: 'large',\n            title\n          },\n          callback: (popup: any) => {\n            this.recordView.addEventListener('reset', () => {\n              this.dispatchEvent(\n                new CustomEvent('record-reset', {\n                  bubbles: true,\n                  composed: true,\n                  detail: {\n                    record: this.record,\n                    row: this.rowIndex\n                  }\n                })\n              )\n            })\n\n            this.recordView.addEventListener('cancel', () => {\n              this.dispatchEvent(\n                new CustomEvent('record-reset', {\n                  bubbles: true,\n                  composed: true,\n                  detail: {\n                    record: this.record,\n                    row: this.rowIndex\n                  }\n                })\n              )\n              popup.close()\n            })\n\n            this.recordView.addEventListener('ok', () => {\n              popup.close()\n            })\n\n            popup.onclosed = () => {\n              delete this._recordView\n            }\n          }\n        }\n      })\n    )\n  }\n}\n"]}
+{"version":3,"file":"record-card.js","sourceRoot":"","sources":["../../../src/data-card/record-card.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/mwc-icon'\nimport './data-card-field'\nimport '../record-view'\nimport './data-card-gutter'\n\nimport { LitElement, PropertyValues, css, html } from 'lit'\nimport { ZERO_CONFIG, ZERO_DATA, ZERO_RECORD } from '../configure/config-types'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { recordCardClickHandler } from './event-handlers/record-card-click-handler'\nimport { recordCardDblClickHandler } from './event-handlers/record-card-dblclick-handler'\n\n// TODO 로케일 설정에 따라서 포맷이 바뀌도록 해야한다.\nconst OPTIONS: Intl.DateTimeFormatOptions = {\n  year: 'numeric',\n  month: 'numeric',\n  day: 'numeric',\n  hour: 'numeric',\n  minute: 'numeric',\n  second: 'numeric',\n  hour12: false\n  // timeZone: 'America/Los_Angeles'\n}\n\nconst formatter = new Intl.DateTimeFormat(navigator.language, OPTIONS)\n\n@customElement('ox-record-card')\nexport class RecordCard extends LitElement {\n  static styles = [\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n        align-items: center;\n        position: relative;\n      }\n\n      :host([dirty])::before {\n        content: '';\n        position: absolute;\n        left: 0;\n        top: 0;\n\n        width: 0px;\n        height: 0px;\n        border-top: var(--grid-record-dirty-border-top);\n        border-right: var(--grid-record-dirty-border-left);\n      }\n\n      [dirty] {\n        position: absolute;\n        margin: 0;\n        height: 20px;\n        font: var(--grid-record-dirty-icon-font);\n        text-indent: 1px;\n        left: 0;\n        top: 0;\n        color: var(--grid-record-dirty-color);\n      }\n\n      [thumbnail] {\n        width: 100%;\n        max-height: var(--data-card-thumbnail-height);\n        border-top-left-radius: var(--data-card-record-card-border-radius);\n        border-top-right-radius: var(--data-card-record-card-border-radius);\n        border-bottom: var(--data-card-thumbnail-border-bottom);\n        overflow: hidden;\n      }\n\n      [content] {\n        display: grid;\n        grid-template:\n          'brief gutters'\n          'detail detail';\n        grid-template-columns: 1fr 35px;\n        margin: var(--data-card-item-margin);\n      }\n\n      [gutters] {\n        width: 50px;\n        grid-area: gutters;\n\n        display: flex;\n        flex-direction: column;\n        justify-content: space-evenly;\n\n        position: relative;\n      }\n      [brief] {\n        grid-area: brief;\n      }\n      [detail] {\n        grid-area: detail;\n      }\n\n      ox-card-gutter {\n        flex: 0 0 14px;\n      }\n\n      ox-card-field {\n        padding-top: 2px;\n        font: var(--data-card-item-etc-font);\n        color: var(--data-card-item-etc-color);\n      }\n\n      ox-card-field[name] {\n        font: var(--data-card-item-name-font);\n        color: var(--data-card-item-name-color);\n      }\n\n      ox-card-field[desc] {\n        font: var(--data-card-item-disc-font);\n        color: var(--data-card-item-disc-color);\n      }\n\n      .update-info {\n        font: var(--data-card-item-etc-font);\n        color: var(--data-card-item-etc-color);\n      }\n\n      .update-info mwc-icon {\n        vertical-align: middle;\n        font-size: 1em;\n      }\n    `\n  ]\n\n  @property({ type: Object }) config: GristConfig = ZERO_CONFIG\n  @property({ type: Object }) data: GristData = ZERO_DATA\n  @property({ type: Object }) record: GristRecord = ZERO_RECORD\n  @property({ type: Number }) rowIndex: number = -1\n  /*\n   * row-selector를 사용자가 변경할 때, record-card의 update를 유도하기 위해 selected-row attribute를 property에 추가함.\n   * (이를 해주지 않으면, 리스트 refresh 경우에 selected-row checkbox가 클리어되지 않는 현상이 발생함.)\n   */\n  @property({ type: Boolean, attribute: 'selected-row' }) selectedRow: boolean = false\n\n  private _recordView: any\n\n  attributeChangedCallback(name: string, oldval: any, newval: any) {\n    super.attributeChangedCallback(name, oldval, newval)\n  }\n\n  onFieldChange(e: Event) {\n    /* record-view의 이벤트를 부모에게로 전달한다. */\n    this.dispatchEvent(\n      new CustomEvent('field-change', {\n        bubbles: true,\n        composed: true,\n        detail: (e as any).detail\n      })\n    )\n  }\n\n  get recordView() {\n    if (!this._recordView) {\n      this._recordView = document.createElement('ox-record-view')\n      this._recordView.addEventListener('field-change', (e: CustomEvent) => this.onFieldChange(e))\n    }\n\n    var columns = this.config.columns\n\n    this._recordView.columns = columns\n    this._recordView.record = this.record\n    this._recordView.rowIndex = this.rowIndex\n\n    return this._recordView\n  }\n\n  firstUpdated() {\n    /*\n      long-press\n      TODO. performance를 확인한 후에 활성화하자.\n    */\n    // longpressable(this.renderRoot.querySelector('[content]'))\n    // this.renderRoot.addEventListener('long-press', recordPartialLongPressHandler.bind(this))\n    this.renderRoot.addEventListener('click', recordCardClickHandler.bind(this) as EventListener)\n    this.renderRoot.addEventListener('dblclick', recordCardDblClickHandler.bind(this) as EventListener)\n  }\n\n  updated(changes: PropertyValues<this>) {\n    if (changes.has('record') && this._recordView) {\n      this._recordView.record = this.record\n    }\n  }\n\n  render() {\n    var record = this.record\n    var rowIndex = this.rowIndex\n    var { columns, list } = this.config\n    var { thumbnail, fields, details } = list || {}\n\n    var briefFields = fields.map(field => columns.find(column => column.name == field)).filter(column => column) || []\n    var detailFields = details.map(field => columns.find(column => column.name == field)).filter(column => column) || []\n\n    var thumbnailTemplate = thumbnail.call(this, record, rowIndex)\n\n    var gutters = (columns || []).filter(column => column.type == 'gutter' && column.forList)\n    var firstGutter = gutters[0]\n\n    if (this.hasAttribute('dirty')) {\n      var dirtyIcon\n\n      switch (this.record['__dirty__']) {\n        case 'M':\n          dirtyIcon = 'done'\n          break\n        case '+':\n          dirtyIcon = 'add'\n          break\n        case '-':\n          dirtyIcon = 'remove'\n          break\n      }\n    }\n\n    return html`\n      ${dirtyIcon ? html` <mwc-icon dirty>${dirtyIcon}</mwc-icon> ` : html``}\n\n      <div thumbnail>${thumbnailTemplate}</div>\n\n      <div content>\n        <div gutters>\n          ${firstGutter\n            ? html`\n                <ox-card-gutter\n                  .rowIndex=${rowIndex}\n                  .column=${firstGutter}\n                  .record=${record}\n                  .value=${record[firstGutter.name]}\n                ></ox-card-gutter>\n              `\n            : html``}\n          ${gutters.length === 2\n            ? html`\n                <ox-card-gutter\n                  .rowIndex=${rowIndex}\n                  .column=${gutters[1]}\n                  .record=${record}\n                  .value=${record[gutters[1].name]}\n                ></ox-card-gutter>\n              `\n            : gutters.length > 2\n            ? html`\n                <ox-card-gutter-menu .gutters=${gutters} .rowIndex=${rowIndex} .record=${record}></ox-card-gutter-menu>\n              `\n            : html``}\n        </div>\n\n        <div brief>\n          ${briefFields.map(\n            (column, idx) =>\n              html`\n                <ox-card-field\n                  .rowIndex=${rowIndex}\n                  .column=${column}\n                  .record=${record}\n                  .value=${record[column?.name || '']}\n                  ?name=${idx == 0}\n                  ?desc=${idx == 1}\n                ></ox-card-field>\n              `\n          )}\n        </div>\n        ${detailFields.length > 0\n          ? html`\n              <div detail>\n                ${detailFields.map(\n                  (column, idx) =>\n                    html`\n                      <ox-card-field\n                        .rowIndex=${rowIndex}\n                        .column=${column}\n                        .record=${record}\n                        .value=${record[column?.name || '']}\n                      ></ox-card-field>\n                    `\n                )}\n              </div>\n            `\n          : html``}\n      </div>\n    `\n  }\n\n  popupRecordView() {\n    var titleField = this.config.list.fields[0] || 'name'\n    var title = this.record[titleField]\n\n    /* field가 오브젝트형인 경우에는 렌더러를 타이틀로 사용한다. */\n    if (typeof title == 'object') {\n      var column = this.config.columns.find(column => column.name == titleField)\n      title = column?.record.renderer(title, column, this.record, this.rowIndex, this /* cautious */)\n    }\n\n    document.dispatchEvent(\n      new CustomEvent('open-popup', {\n        detail: {\n          template: this.recordView,\n          options: {\n            backdrop: true,\n            size: 'large',\n            title\n          },\n          callback: (popup: any) => {\n            this.recordView.addEventListener('reset', () => {\n              this.dispatchEvent(\n                new CustomEvent('record-reset', {\n                  bubbles: true,\n                  composed: true,\n                  detail: {\n                    record: this.record,\n                    row: this.rowIndex\n                  }\n                })\n              )\n            })\n\n            this.recordView.addEventListener('cancel', () => {\n              this.dispatchEvent(\n                new CustomEvent('record-reset', {\n                  bubbles: true,\n                  composed: true,\n                  detail: {\n                    record: this.record,\n                    row: this.rowIndex\n                  }\n                })\n              )\n              popup.close()\n            })\n\n            this.recordView.addEventListener('ok', () => {\n              popup.close()\n            })\n\n            popup.onclosed = () => {\n              delete this._recordView\n            }\n          }\n        }\n      })\n    )\n  }\n}\n"]}

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

@@ -1,4 +1,3 @@
-import { GristData } from './configure/config-types';
 export declare type FetchHandler = (param?: {
     page?: number;
     limit?: number;