@operato/data-grist 1.0.0-beta.9 → 1.0.0

package/dist/src/record-view/record-view-body.js

@@ -12,7 +12,6 @@ let RecordViewBody = class RecordViewBody extends LitElement {
         this.columns = [];
         this.record = ZERO_RECORD;
         this.rowIndex = -1;
-        this.onlyForEdit = false;
     }
     connectedCallback() {
         super.connectedCallback();
@@ -38,7 +37,6 @@ let RecordViewBody = class RecordViewBody extends LitElement {
             .record=${record}
             .value=${record[column.name]}
             ?dirty=${!!dirtyFields[column.name]}
-            ?editing=${this.onlyForEdit}
           ></ox-grid-field>
         `;
         })}
@@ -109,9 +107,6 @@ __decorate([
 __decorate([
     property({ type: Number })
 ], RecordViewBody.prototype, "rowIndex", void 0);
-__decorate([
-    property({ type: Boolean, attribute: 'only-for-edit' })
-], RecordViewBody.prototype, "onlyForEdit", void 0);
 RecordViewBody = __decorate([
     customElement('ox-record-view-body')
 ], RecordViewBody);

package/dist/src/record-view/record-view-body.js.map

@@ -1 +1 @@
-{"version":3,"file":"record-view-body.js","sourceRoot":"","sources":["../../../src/record-view/record-view-body.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/mwc-icon'\nimport '../data-grid/data-grid-field'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { ZERO_RECORD } from '../configure/zero-config'\nimport { ColumnConfig, GristRecord } from '../types'\nimport { recordViewBodyClickHandler } from './event-handlers/record-view-body-click-handler'\nimport { recordViewBodyKeydownHandler } from './event-handlers/record-view-body-keydown-handler'\n\n@customElement('ox-record-view-body')\nexport class RecordViewBody extends LitElement {\n  static styles = [\n    css`\n      :host {\n        display: grid;\n        grid-template-columns: 1fr 2fr;\n        grid-auto-rows: min-content;\n        grid-gap: var(--record-view-gap);\n        padding: var(--record-view-padding);\n      }\n\n      label {\n        display: flex;\n        align-items: center;\n        position: relative;\n        text-transform: capitalize;\n\n        padding: var(--record-view-item-padding);\n        border-bottom: var(--record-view-border-bottom);\n        font: var(--record-view-label-font);\n        color: var(--record-view-label-color);\n      }\n\n      label mwc-icon {\n        display: none;\n      }\n\n      label[editable] mwc-icon {\n        display: inline-block;\n        font-size: var(--record-view-label-icon-size);\n        opacity: 0.5;\n      }\n\n      ox-grid-field {\n        border-top: none;\n        border-bottom: var(--record-view-border-bottom);\n        font: var(--record-view-font);\n        color: var(--record-view-color);\n        background-color: transparent;\n      }\n\n      ox-grid-field[editing='true'] {\n        border-bottom: var(--record-view-edit-border-bottom);\n      }\n\n      :first-child + ox-grid-field {\n        color: var(--record-view-focus-color);\n        font-weight: bold;\n      }\n    `\n  ]\n\n  @property({ type: Array }) columns: ColumnConfig[] = []\n  @property({ type: Object }) record: GristRecord = ZERO_RECORD\n  @property({ type: Number }) rowIndex: number = -1\n  @property({ type: Boolean, attribute: 'only-for-edit' }) onlyForEdit: boolean = false\n\n  public currentTarget: any\n\n  connectedCallback() {\n    super.connectedCallback()\n\n    this.setAttribute('tabindex', '0')\n\n    this.renderRoot.addEventListener('keydown', recordViewBodyKeydownHandler.bind(this))\n    this.renderRoot.addEventListener('click', recordViewBodyClickHandler.bind(this))\n  }\n\n  render() {\n    var columns = this.columns.filter(column => !column.hidden && column.type !== 'gutter')\n    var record = this.record\n    var rowIndex = this.rowIndex\n\n    return html`\n      ${columns.map(column => {\n        let { editable, mandatory } = column.record\n        let dirtyFields = record['__dirtyfields__'] || {}\n\n        return html`\n          <label ?editable=${editable}\n            ><span>${mandatory ? '*' : ''}${this._renderLabel(column)}</span> <mwc-icon>edit</mwc-icon></label\n          >\n          <ox-grid-field\n            .rowIndex=${rowIndex}\n            .column=${column}\n            .record=${record}\n            .value=${record[column.name]}\n            ?dirty=${!!dirtyFields[column.name]}\n            ?editing=${this.onlyForEdit}\n          ></ox-grid-field>\n        `\n      })}\n    `\n  }\n\n  _renderLabel(column: ColumnConfig) {\n    var { renderer } = column.header\n    var title = renderer.call(this, column)\n\n    return html` ${title} `\n  }\n}\n"]}
+{"version":3,"file":"record-view-body.js","sourceRoot":"","sources":["../../../src/record-view/record-view-body.ts"],"names":[],"mappings":";AAAA,OAAO,oBAAoB,CAAA;AAC3B,OAAO,8BAA8B,CAAA;AAErC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAEtD,OAAO,EAAE,0BAA0B,EAAE,MAAM,iDAAiD,CAAA;AAC5F,OAAO,EAAE,4BAA4B,EAAE,MAAM,mDAAmD,CAAA;AAGhG,IAAa,cAAc,GAA3B,MAAa,cAAe,SAAQ,UAAU;IAA9C;;QAoD6B,YAAO,GAAmB,EAAE,CAAA;QAC3B,WAAM,GAAgB,WAAW,CAAA;QACjC,aAAQ,GAAW,CAAC,CAAC,CAAA;IA6CnD,CAAC;IAzCC,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAA;QAEzB,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,GAAG,CAAC,CAAA;QAElC,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,SAAS,EAAE,4BAA4B,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;QACpF,IAAI,CAAC,UAAU,CAAC,gBAAgB,CAAC,OAAO,EAAE,0BAA0B,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;IAClF,CAAC;IAED,MAAM;QACJ,IAAI,OAAO,GAAG,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,MAAM,IAAI,MAAM,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAA;QACvF,IAAI,MAAM,GAAG,IAAI,CAAC,MAAM,CAAA;QACxB,IAAI,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAA;QAE5B,OAAO,IAAI,CAAA;QACP,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;YACrB,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,MAAM,CAAA;YAC3C,IAAI,WAAW,GAAG,MAAM,CAAC,iBAAiB,CAAC,IAAI,EAAE,CAAA;YAEjD,OAAO,IAAI,CAAA;6BACU,QAAQ;qBAChB,SAAS,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC;;;wBAG7C,QAAQ;sBACV,MAAM;sBACN,MAAM;qBACP,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC;qBACnB,CAAC,CAAC,WAAW,CAAC,MAAM,CAAC,IAAI,CAAC;;SAEtC,CAAA;QACH,CAAC,CAAC;KACH,CAAA;IACH,CAAC;IAED,YAAY,CAAC,MAAoB;QAC/B,IAAI,EAAE,QAAQ,EAAE,GAAG,MAAM,CAAC,MAAM,CAAA;QAChC,IAAI,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,IAAI,EAAE,MAAM,CAAC,CAAA;QAEvC,OAAO,IAAI,CAAA,IAAI,KAAK,GAAG,CAAA;IACzB,CAAC;CACF,CAAA;AAlGQ,qBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA+CF;CACF,CAAA;AAE0B;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;+CAA6B;AAC3B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAkC;AACjC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDAAsB;AAtDtC,cAAc;IAD1B,aAAa,CAAC,qBAAqB,CAAC;GACxB,cAAc,CAmG1B;SAnGY,cAAc","sourcesContent":["import '@material/mwc-icon'\nimport '../data-grid/data-grid-field'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { ZERO_RECORD } from '../configure/zero-config'\nimport { ColumnConfig, GristRecord } from '../types'\nimport { recordViewBodyClickHandler } from './event-handlers/record-view-body-click-handler'\nimport { recordViewBodyKeydownHandler } from './event-handlers/record-view-body-keydown-handler'\n\n@customElement('ox-record-view-body')\nexport class RecordViewBody extends LitElement {\n  static styles = [\n    css`\n      :host {\n        display: grid;\n        grid-template-columns: 1fr 2fr;\n        grid-auto-rows: min-content;\n        grid-gap: var(--record-view-gap);\n        padding: var(--record-view-padding);\n      }\n\n      label {\n        display: flex;\n        align-items: center;\n        position: relative;\n        text-transform: capitalize;\n\n        padding: var(--record-view-item-padding);\n        border-bottom: var(--record-view-border-bottom);\n        font: var(--record-view-label-font);\n        color: var(--record-view-label-color);\n      }\n\n      label mwc-icon {\n        display: none;\n      }\n\n      label[editable] mwc-icon {\n        display: inline-block;\n        font-size: var(--record-view-label-icon-size);\n        opacity: 0.5;\n      }\n\n      ox-grid-field {\n        border-top: none;\n        border-bottom: var(--record-view-border-bottom);\n        font: var(--record-view-font);\n        color: var(--record-view-color);\n        background-color: transparent;\n      }\n\n      ox-grid-field[editing='true'] {\n        border-bottom: var(--record-view-edit-border-bottom);\n      }\n\n      :first-child + ox-grid-field {\n        color: var(--record-view-focus-color);\n        font-weight: bold;\n      }\n    `\n  ]\n\n  @property({ type: Array }) columns: ColumnConfig[] = []\n  @property({ type: Object }) record: GristRecord = ZERO_RECORD\n  @property({ type: Number }) rowIndex: number = -1\n\n  public currentTarget: any\n\n  connectedCallback() {\n    super.connectedCallback()\n\n    this.setAttribute('tabindex', '0')\n\n    this.renderRoot.addEventListener('keydown', recordViewBodyKeydownHandler.bind(this))\n    this.renderRoot.addEventListener('click', recordViewBodyClickHandler.bind(this))\n  }\n\n  render() {\n    var columns = this.columns.filter(column => !column.hidden && column.type !== 'gutter')\n    var record = this.record\n    var rowIndex = this.rowIndex\n\n    return html`\n      ${columns.map(column => {\n        let { editable, mandatory } = column.record\n        let dirtyFields = record['__dirtyfields__'] || {}\n\n        return html`\n          <label ?editable=${editable}\n            ><span>${mandatory ? '*' : ''}${this._renderLabel(column)}</span> <mwc-icon>edit</mwc-icon></label\n          >\n          <ox-grid-field\n            .rowIndex=${rowIndex}\n            .column=${column}\n            .record=${record}\n            .value=${record[column.name]}\n            ?dirty=${!!dirtyFields[column.name]}\n          ></ox-grid-field>\n        `\n      })}\n    `\n  }\n\n  _renderLabel(column: ColumnConfig) {\n    var { renderer } = column.header\n    var title = renderer.call(this, column)\n\n    return html` ${title} `\n  }\n}\n"]}

package/dist/src/record-view/record-view-handler.d.ts

@@ -6,4 +6,4 @@ import { RecordView } from '../record-view/record-view';
 import { ColumnConfig, GristRecord } from '../types';
 export declare const RecordViewHandler: (columns: ColumnConfig[], record: GristRecord, rowIndex: number, field: DataGridField | RecordCard | RecordPartial | DataGridBody, popupOptions: {
     [key: string]: any;
-}, closeCallback?: (() => void) | undefined) => RecordView;
+}, closeCallback?: () => void) => RecordView;

package/dist/src/record-view/record-view.d.ts

@@ -9,7 +9,6 @@ export declare class RecordView extends LitElement {
     columns: ColumnConfig[];
     record: GristRecord;
     rowIndex: number;
-    onlyForEdit: boolean;
     render(): import("lit-html").TemplateResult<1>;
     firstUpdated(): void;
     onReset(): void;

package/dist/src/record-view/record-view.js

@@ -13,16 +13,10 @@ let RecordView = class RecordView extends LitElement {
         this.columns = [];
         this.record = ZERO_RECORD;
         this.rowIndex = -1;
-        this.onlyForEdit = false;
     }
     render() {
         return html `
-      <ox-record-view-body
-        .columns=${this.columns}
-        .record=${this.record}
-        .rowIndex=${this.rowIndex}
-        ?only-for-edit=${this.onlyForEdit}
-      >
+      <ox-record-view-body .columns=${this.columns} .record=${this.record} .rowIndex=${this.rowIndex}>
       </ox-record-view-body>
       <div footer>
         <button @click=${this.onReset.bind(this)}><mwc-icon>refresh</mwc-icon>Reset</button>
@@ -108,9 +102,6 @@ __decorate([
 __decorate([
     property({ type: Number })
 ], RecordView.prototype, "rowIndex", void 0);
-__decorate([
-    property({ type: Boolean, attribute: 'only-for-edit' })
-], RecordView.prototype, "onlyForEdit", void 0);
 RecordView = __decorate([
     customElement('ox-record-view')
 ], RecordView);

package/dist/src/record-view/record-view.js.map

@@ -1 +1 @@
-{"version":3,"file":"record-view.js","sourceRoot":"","sources":["../../../src/record-view/record-view.ts"],"names":[],"mappings":";AAAA,OAAO,oBAAoB,CAAA;AAC3B,OAAO,oBAAoB,CAAA;AAC3B,OAAO,iCAAiC,CAAA;AACxC,OAAO,8BAA8B,CAAA;AAErC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAEjD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAItD,IAAa,UAAU,GAAvB,MAAa,UAAW,SAAQ,UAAU;IAA1C;;QAgD6B,YAAO,GAAmB,EAAE,CAAA;QAC3B,WAAM,GAAgB,WAAW,CAAA;QACjC,aAAQ,GAAW,CAAC,CAAC,CAAA;QACQ,gBAAW,GAAY,KAAK,CAAA;IAoDvF,CAAC;IAlDC,MAAM;QACJ,OAAO,IAAI,CAAA;;mBAEI,IAAI,CAAC,OAAO;kBACb,IAAI,CAAC,MAAM;oBACT,IAAI,CAAC,QAAQ;yBACR,IAAI,CAAC,WAAW;;;;yBAIhB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC;yBACvB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;yBACxB,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;;KAExC,CAAA;IACH,CAAC;IAED,YAAY;QACV,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,GAAG,CAAC,CAAA;IACpC,CAAC;IAED,OAAO;QACL,IAAI,CAAC,KAAK,EAAE,CAAA;QAEZ,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,OAAO,EAAE;YACvB,MAAM,EAAE,IAAI,CAAC,MAAM;SACpB,CAAC,CACH,CAAA;IACH,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,KAAK,EAAE,CAAA;QAEZ,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,QAAQ,EAAE;YACxB,MAAM,EAAE,IAAI,CAAC,MAAM;SACpB,CAAC,CACH,CAAA;IACH,CAAC;IAED,IAAI;QACF,IAAI,CAAC,KAAK,EAAE,CAAA;QAEZ,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,IAAI,EAAE;YACpB,MAAM,EAAE,IAAI,CAAC,MAAM;SACpB,CAAC,CACH,CAAA;IACH,CAAC;CACF,CAAA;AAtGQ,iBAAM,GAAG;IACd,eAAe;IACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA0CF;CACF,CAAA;AAE0B;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;2CAA6B;AAC3B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAkC;AACjC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAsB;AACQ;IAAxD,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,CAAC;+CAA6B;AAnD1E,UAAU;IADtB,aAAa,CAAC,gBAAgB,CAAC;GACnB,UAAU,CAuGtB;SAvGY,UAAU","sourcesContent":["import '@material/mwc-icon'\nimport './record-view-body'\nimport '@operato/input/ox-input-file.js'\nimport '../data-grid/data-grid-field'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { ScrollbarStyles } from '@operato/styles'\n\nimport { ZERO_RECORD } from '../configure/zero-config'\nimport { ColumnConfig, GristRecord } from '../types'\n\n@customElement('ox-record-view')\nexport class RecordView extends LitElement {\n  static styles = [\n    ScrollbarStyles,\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n        background-color: var(--record-view-background-color);\n      }\n\n      ox-record-view-body {\n        flex: 1;\n        overflow-y: auto;\n      }\n\n      [footer] {\n        display: flex;\n        text-align: right;\n        background-color: var(--record-view-footer-background);\n        box-shadow: var(--context-toolbar-shadow-line);\n      }\n\n      [footer] button {\n        flex: 1;\n        background-color: transparent;\n        border: var(--record-view-footer-button-border);\n        border-width: var(--record-view-footer-button-border-width);\n        color: var(--record-view-footer-button-color);\n        font-size: var(--record-view-footer-button-font);\n        line-height: 3;\n      }\n\n      [footer] button * {\n        vertical-align: middle;\n      }\n\n      [footer] button mwc-icon {\n        margin-top: -3px;\n        margin-right: 5px;\n        font-size: var(--record-view-footer-iconbutton-size);\n      }\n\n      [footer] button[ok] {\n        background-color: var(--record-view-footer-focus-background);\n      }\n    `\n  ]\n\n  @property({ type: Array }) columns: ColumnConfig[] = []\n  @property({ type: Object }) record: GristRecord = ZERO_RECORD\n  @property({ type: Number }) rowIndex: number = -1\n  @property({ type: Boolean, attribute: 'only-for-edit' }) onlyForEdit: boolean = false\n\n  render() {\n    return html`\n      <ox-record-view-body\n        .columns=${this.columns}\n        .record=${this.record}\n        .rowIndex=${this.rowIndex}\n        ?only-for-edit=${this.onlyForEdit}\n      >\n      </ox-record-view-body>\n      <div footer>\n        <button @click=${this.onReset.bind(this)}><mwc-icon>refresh</mwc-icon>Reset</button>\n        <button @click=${this.onCancel.bind(this)}><mwc-icon>clear</mwc-icon>Cancel</button>\n        <button @click=${this.onOK.bind(this)} ok><mwc-icon>radio_button_unchecked</mwc-icon>OK</button>\n      </div>\n    `\n  }\n\n  firstUpdated() {\n    this.setAttribute('tabindex', '0')\n  }\n\n  onReset() {\n    this.focus()\n\n    this.dispatchEvent(\n      new CustomEvent('reset', {\n        detail: this.record\n      })\n    )\n  }\n\n  onCancel() {\n    this.focus()\n\n    this.dispatchEvent(\n      new CustomEvent('cancel', {\n        detail: this.record\n      })\n    )\n  }\n\n  onOK() {\n    this.focus()\n\n    this.dispatchEvent(\n      new CustomEvent('ok', {\n        detail: this.record\n      })\n    )\n  }\n}\n"]}
+{"version":3,"file":"record-view.js","sourceRoot":"","sources":["../../../src/record-view/record-view.ts"],"names":[],"mappings":";AAAA,OAAO,oBAAoB,CAAA;AAC3B,OAAO,oBAAoB,CAAA;AAC3B,OAAO,iCAAiC,CAAA;AACxC,OAAO,8BAA8B,CAAA;AAErC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAEjD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAItD,IAAa,UAAU,GAAvB,MAAa,UAAW,SAAQ,UAAU;IAA1C;;QAgD6B,YAAO,GAAmB,EAAE,CAAA;QAC3B,WAAM,GAAgB,WAAW,CAAA;QACjC,aAAQ,GAAW,CAAC,CAAC,CAAA;IA+CnD,CAAC;IA7CC,MAAM;QACJ,OAAO,IAAI,CAAA;sCACuB,IAAI,CAAC,OAAO,YAAY,IAAI,CAAC,MAAM,cAAc,IAAI,CAAC,QAAQ;;;yBAG3E,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC;yBACvB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;yBACxB,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC;;KAExC,CAAA;IACH,CAAC;IAED,YAAY;QACV,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,GAAG,CAAC,CAAA;IACpC,CAAC;IAED,OAAO;QACL,IAAI,CAAC,KAAK,EAAE,CAAA;QAEZ,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,OAAO,EAAE;YACvB,MAAM,EAAE,IAAI,CAAC,MAAM;SACpB,CAAC,CACH,CAAA;IACH,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,KAAK,EAAE,CAAA;QAEZ,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,QAAQ,EAAE;YACxB,MAAM,EAAE,IAAI,CAAC,MAAM;SACpB,CAAC,CACH,CAAA;IACH,CAAC;IAED,IAAI;QACF,IAAI,CAAC,KAAK,EAAE,CAAA;QAEZ,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,IAAI,EAAE;YACpB,MAAM,EAAE,IAAI,CAAC,MAAM;SACpB,CAAC,CACH,CAAA;IACH,CAAC;CACF,CAAA;AAhGQ,iBAAM,GAAG;IACd,eAAe;IACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA0CF;CACF,CAAA;AAE0B;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;2CAA6B;AAC3B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAAkC;AACjC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAsB;AAlDtC,UAAU;IADtB,aAAa,CAAC,gBAAgB,CAAC;GACnB,UAAU,CAiGtB;SAjGY,UAAU","sourcesContent":["import '@material/mwc-icon'\nimport './record-view-body'\nimport '@operato/input/ox-input-file.js'\nimport '../data-grid/data-grid-field'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { ScrollbarStyles } from '@operato/styles'\n\nimport { ZERO_RECORD } from '../configure/zero-config'\nimport { ColumnConfig, GristRecord } from '../types'\n\n@customElement('ox-record-view')\nexport class RecordView extends LitElement {\n  static styles = [\n    ScrollbarStyles,\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n        background-color: var(--record-view-background-color);\n      }\n\n      ox-record-view-body {\n        flex: 1;\n        overflow-y: auto;\n      }\n\n      [footer] {\n        display: flex;\n        text-align: right;\n        background-color: var(--record-view-footer-background);\n        box-shadow: var(--context-toolbar-shadow-line);\n      }\n\n      [footer] button {\n        flex: 1;\n        background-color: transparent;\n        border: var(--record-view-footer-button-border);\n        border-width: var(--record-view-footer-button-border-width);\n        color: var(--record-view-footer-button-color);\n        font-size: var(--record-view-footer-button-font);\n        line-height: 3;\n      }\n\n      [footer] button * {\n        vertical-align: middle;\n      }\n\n      [footer] button mwc-icon {\n        margin-top: -3px;\n        margin-right: 5px;\n        font-size: var(--record-view-footer-iconbutton-size);\n      }\n\n      [footer] button[ok] {\n        background-color: var(--record-view-footer-focus-background);\n      }\n    `\n  ]\n\n  @property({ type: Array }) columns: ColumnConfig[] = []\n  @property({ type: Object }) record: GristRecord = ZERO_RECORD\n  @property({ type: Number }) rowIndex: number = -1\n\n  render() {\n    return html`\n      <ox-record-view-body .columns=${this.columns} .record=${this.record} .rowIndex=${this.rowIndex}>\n      </ox-record-view-body>\n      <div footer>\n        <button @click=${this.onReset.bind(this)}><mwc-icon>refresh</mwc-icon>Reset</button>\n        <button @click=${this.onCancel.bind(this)}><mwc-icon>clear</mwc-icon>Cancel</button>\n        <button @click=${this.onOK.bind(this)} ok><mwc-icon>radio_button_unchecked</mwc-icon>OK</button>\n      </div>\n    `\n  }\n\n  firstUpdated() {\n    this.setAttribute('tabindex', '0')\n  }\n\n  onReset() {\n    this.focus()\n\n    this.dispatchEvent(\n      new CustomEvent('reset', {\n        detail: this.record\n      })\n    )\n  }\n\n  onCancel() {\n    this.focus()\n\n    this.dispatchEvent(\n      new CustomEvent('cancel', {\n        detail: this.record\n      })\n    )\n  }\n\n  onOK() {\n    this.focus()\n\n    this.dispatchEvent(\n      new CustomEvent('ok', {\n        detail: this.record\n      })\n    )\n  }\n}\n"]}

package/dist/src/renderers/ox-grist-renderer-color.js

@@ -1,6 +1,6 @@
 import { html } from 'lit';
 export const OxGristRendererColor = (value, column, record, rowIndex, field) => {
-    value = value === undefined ? '#000' : value;
+    value = value == null ? '#000' : value;
     return html `
     <div
       style="display:flex;align-items:center;justify-content:center;width:100%;height:100%;background-color:${value};"

package/dist/src/renderers/ox-grist-renderer-color.js.map

@@ -1 +1 @@
-{"version":3,"file":"ox-grist-renderer-color.js","sourceRoot":"","sources":["../../../src/renderers/ox-grist-renderer-color.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAE1B,MAAM,CAAC,MAAM,oBAAoB,GAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE;IAC5F,KAAK,GAAG,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAA;IAE5C,OAAO,IAAI,CAAA;;8GAEiG,KAAK;;WAExG,KAAK;;GAEb,CAAA;AACH,CAAC,CAAA","sourcesContent":["import { FieldRenderer } from '../types'\nimport { html } from 'lit'\n\nexport const OxGristRendererColor: FieldRenderer = (value, column, record, rowIndex, field) => {\n  value = value === undefined ? '#000' : value\n\n  return html`\n    <div\n      style=\"display:flex;align-items:center;justify-content:center;width:100%;height:100%;background-color:${value};\"\n    >\n      <p>${value}</p>\n    </div>\n  `\n}\n"]}
+{"version":3,"file":"ox-grist-renderer-color.js","sourceRoot":"","sources":["../../../src/renderers/ox-grist-renderer-color.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAI1B,MAAM,CAAC,MAAM,oBAAoB,GAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE;IAC5F,KAAK,GAAG,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAA;IAEtC,OAAO,IAAI,CAAA;;8GAEiG,KAAK;;WAExG,KAAK;;GAEb,CAAA;AACH,CAAC,CAAA","sourcesContent":["import { html } from 'lit'\n\nimport { FieldRenderer } from '../types'\n\nexport const OxGristRendererColor: FieldRenderer = (value, column, record, rowIndex, field) => {\n  value = value == null ? '#000' : value\n\n  return html`\n    <div\n      style=\"display:flex;align-items:center;justify-content:center;width:100%;height:100%;background-color:${value};\"\n    >\n      <p>${value}</p>\n    </div>\n  `\n}\n"]}

package/dist/src/renderers/ox-grist-renderer-json5.js

@@ -21,7 +21,7 @@ export const OxGristRendererJson5 = (value, column, record, rowIndex, field) =>
         }
         catch (_a) { }
     }
-    const text = parsed === undefined || parsed === null ? '' : JSON5.stringify(parsed);
+    const text = parsed == null ? '' : JSON5.stringify(parsed);
     return html `<pre @mouseover=${onmouseover} @mouseout=${onmouseout}>${text}</pre>`;
 };
 //# sourceMappingURL=ox-grist-renderer-json5.js.map

package/dist/src/renderers/ox-grist-renderer-json5.js.map

@@ -1 +1 @@
-{"version":3,"file":"ox-grist-renderer-json5.js","sourceRoot":"","sources":["../../../src/renderers/ox-grist-renderer-json5.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAE1B,SAAS,WAAW,CAAC,CAAQ;IAC3B,MAAM,OAAO,GAAG,CAAC,CAAC,MAAwB,CAAA;IAC1C,IAAI,MAAM,CAAA;IACV,IAAI;QACF,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,WAAY,CAAC,CAAA;KAC3C;IAAC,WAAM,GAAE;IAEV,OAAO,CAAC,YAAY,CAAC,cAAc,EAAE,KAAK,CAAC,SAAS,CAAC,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAA;AACxE,CAAC;AAED,SAAS,UAAU,CAAC,CAAQ;IAC1B,MAAM,OAAO,GAAG,CAAC,CAAC,MAAwB,CAAA;IAC1C,OAAO,CAAC,eAAe,CAAC,cAAc,CAAC,CAAA;AACzC,CAAC;AAED,MAAM,CAAC,MAAM,oBAAoB,GAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE;IAC5F,IAAI,MAAM,GAAQ,KAAK,CAAA;IAEvB,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;QAC7B,IAAI;YACF,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;SAC5B;QAAC,WAAM,GAAE;KACX;IAED,MAAM,IAAI,GAAG,MAAM,KAAK,SAAS,IAAI,MAAM,KAAK,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,CAAA;IACnF,OAAO,IAAI,CAAA,mBAAmB,WAAW,cAAc,UAAU,IAAI,IAAI,QAAQ,CAAA;AACnF,CAAC,CAAA","sourcesContent":["import { FieldRenderer } from '../types'\nimport JSON5 from 'json5'\nimport { html } from 'lit'\n\nfunction onmouseover(e: Event) {\n  const element = e.target as HTMLPreElement\n  var parsed\n  try {\n    parsed = JSON5.parse(element.textContent!)\n  } catch {}\n\n  element.setAttribute('data-tooltip', JSON5.stringify(parsed, null, 2))\n}\n\nfunction onmouseout(e: Event) {\n  const element = e.target as HTMLPreElement\n  element.removeAttribute('data-tooltip')\n}\n\nexport const OxGristRendererJson5: FieldRenderer = (value, column, record, rowIndex, field) => {\n  var parsed: any = value\n\n  if (typeof value === 'string') {\n    try {\n      parsed = JSON5.parse(value)\n    } catch {}\n  }\n\n  const text = parsed === undefined || parsed === null ? '' : JSON5.stringify(parsed)\n  return html`<pre @mouseover=${onmouseover} @mouseout=${onmouseout}>${text}</pre>`\n}\n"]}
+{"version":3,"file":"ox-grist-renderer-json5.js","sourceRoot":"","sources":["../../../src/renderers/ox-grist-renderer-json5.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAI1B,SAAS,WAAW,CAAC,CAAQ;IAC3B,MAAM,OAAO,GAAG,CAAC,CAAC,MAAwB,CAAA;IAC1C,IAAI,MAAM,CAAA;IACV,IAAI;QACF,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,WAAY,CAAC,CAAA;KAC3C;IAAC,WAAM,GAAE;IAEV,OAAO,CAAC,YAAY,CAAC,cAAc,EAAE,KAAK,CAAC,SAAS,CAAC,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,CAAA;AACxE,CAAC;AAED,SAAS,UAAU,CAAC,CAAQ;IAC1B,MAAM,OAAO,GAAG,CAAC,CAAC,MAAwB,CAAA;IAC1C,OAAO,CAAC,eAAe,CAAC,cAAc,CAAC,CAAA;AACzC,CAAC;AAED,MAAM,CAAC,MAAM,oBAAoB,GAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE;IAC5F,IAAI,MAAM,GAAQ,KAAK,CAAA;IAEvB,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;QAC7B,IAAI;YACF,MAAM,GAAG,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;SAC5B;QAAC,WAAM,GAAE;KACX;IAED,MAAM,IAAI,GAAG,MAAM,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,CAAA;IAC1D,OAAO,IAAI,CAAA,mBAAmB,WAAW,cAAc,UAAU,IAAI,IAAI,QAAQ,CAAA;AACnF,CAAC,CAAA","sourcesContent":["import JSON5 from 'json5'\nimport { html } from 'lit'\n\nimport { FieldRenderer } from '../types'\n\nfunction onmouseover(e: Event) {\n  const element = e.target as HTMLPreElement\n  var parsed\n  try {\n    parsed = JSON5.parse(element.textContent!)\n  } catch {}\n\n  element.setAttribute('data-tooltip', JSON5.stringify(parsed, null, 2))\n}\n\nfunction onmouseout(e: Event) {\n  const element = e.target as HTMLPreElement\n  element.removeAttribute('data-tooltip')\n}\n\nexport const OxGristRendererJson5: FieldRenderer = (value, column, record, rowIndex, field) => {\n  var parsed: any = value\n\n  if (typeof value === 'string') {\n    try {\n      parsed = JSON5.parse(value)\n    } catch {}\n  }\n\n  const text = parsed == null ? '' : JSON5.stringify(parsed)\n  return html`<pre @mouseover=${onmouseover} @mouseout=${onmouseout}>${text}</pre>`\n}\n"]}

package/dist/src/renderers/ox-grist-renderer-link.js

@@ -1,7 +1,7 @@
 import { html } from 'lit';
 export const OxGristRendererLink = (value, column, record, rowIndex, field) => {
     var { href, target } = column.record.options || {};
-    value = value === undefined ? '' : value;
+    value = value == null ? '' : value;
     if (typeof href == 'function') {
         href = href(value, column, record, rowIndex, field);
     }

package/dist/src/renderers/ox-grist-renderer-link.js.map

@@ -1 +1 @@
-{"version":3,"file":"ox-grist-renderer-link.js","sourceRoot":"","sources":["../../../src/renderers/ox-grist-renderer-link.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAE1B,MAAM,CAAC,MAAM,mBAAmB,GAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE;IAC3F,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,CAAC,OAAO,IAAI,EAAE,CAAA;IAElD,KAAK,GAAG,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAA;IAExC,IAAI,OAAO,IAAI,IAAI,UAAU,EAAE;QAC7B,IAAI,GAAG,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAA;KACpD;IAED,OAAO,MAAM;QACX,CAAC,CAAC,IAAI,CAAA,uDAAuD,IAAI,IAAI,KAAK,WAAW,MAAM,IAAI,KAAK,OAAO;QAC3G,CAAC,CAAC,IAAI,CAAA,uDAAuD,IAAI,IAAI,KAAK,IAAI,KAAK,OAAO,CAAA;AAC9F,CAAC,CAAA","sourcesContent":["import { FieldRenderer } from '../types'\nimport { html } from 'lit'\n\nexport const OxGristRendererLink: FieldRenderer = (value, column, record, rowIndex, field) => {\n  var { href, target } = column.record.options || {}\n\n  value = value === undefined ? '' : value\n\n  if (typeof href == 'function') {\n    href = href(value, column, record, rowIndex, field)\n  }\n\n  return target\n    ? html` <a style=\"text-decoration:none;color:inherit\" href=${href || value} target=${target}>${value}</a> `\n    : html` <a style=\"text-decoration:none;color:inherit\" href=${href || value}>${value}</a> `\n}\n"]}
+{"version":3,"file":"ox-grist-renderer-link.js","sourceRoot":"","sources":["../../../src/renderers/ox-grist-renderer-link.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAI1B,MAAM,CAAC,MAAM,mBAAmB,GAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE;IAC3F,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,CAAC,OAAO,IAAI,EAAE,CAAA;IAElD,KAAK,GAAG,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAA;IAElC,IAAI,OAAO,IAAI,IAAI,UAAU,EAAE;QAC7B,IAAI,GAAG,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAA;KACpD;IAED,OAAO,MAAM;QACX,CAAC,CAAC,IAAI,CAAA,uDAAuD,IAAI,IAAI,KAAK,WAAW,MAAM,IAAI,KAAK,OAAO;QAC3G,CAAC,CAAC,IAAI,CAAA,uDAAuD,IAAI,IAAI,KAAK,IAAI,KAAK,OAAO,CAAA;AAC9F,CAAC,CAAA","sourcesContent":["import { html } from 'lit'\n\nimport { FieldRenderer } from '../types'\n\nexport const OxGristRendererLink: FieldRenderer = (value, column, record, rowIndex, field) => {\n  var { href, target } = column.record.options || {}\n\n  value = value == null ? '' : value\n\n  if (typeof href == 'function') {\n    href = href(value, column, record, rowIndex, field)\n  }\n\n  return target\n    ? html` <a style=\"text-decoration:none;color:inherit\" href=${href || value} target=${target}>${value}</a> `\n    : html` <a style=\"text-decoration:none;color:inherit\" href=${href || value}>${value}</a> `\n}\n"]}

package/dist/src/renderers/ox-grist-renderer-select.js

@@ -1,6 +1,6 @@
 import { html } from 'lit';
 export const OxGristRendererSelect = (value, column, record, rowIndex, field) => {
-    if (!value) {
+    if (value == null) {
         return '';
     }
     var rowOptionField = column.record.rowOptionField && record[column.record.rowOptionField];
@@ -11,7 +11,7 @@ export const OxGristRendererSelect = (value, column, record, rowIndex, field) =>
     else if (typeof options == 'function') {
         options = options.call(null, value, column, record, rowIndex, field);
     }
-    var res = options ? options.filter((option) => option.value == value) : [];
+    var res = options ? options.filter((option) => option.value == String(value == null ? '' : value)) : [];
     if (res.length) {
         return html `<span>${res[0].display}</span>`;
     }

package/dist/src/renderers/ox-grist-renderer-select.js.map

@@ -1 +1 @@
-{"version":3,"file":"ox-grist-renderer-select.js","sourceRoot":"","sources":["../../../src/renderers/ox-grist-renderer-select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAI1B,MAAM,CAAC,MAAM,qBAAqB,GAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE;IAC7F,IAAI,CAAC,KAAK,EAAE;QACV,OAAO,EAAE,CAAA;KACV;IACD,IAAI,cAAc,GAAG,MAAM,CAAC,MAAM,CAAC,cAAc,IAAI,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,cAAc,CAAC,CAAA;IACzF,IAAI,OAAO,GAAG,CAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,OAAO,EAAC,CAAC,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAA;IAEtF,IAAI,CAAC,OAAO,EAAE;QACZ,OAAO,CAAC,KAAK,CAAC,6BAA6B,MAAM,CAAC,IAAI,wBAAwB,CAAC,CAAA;KAChF;SAAM,IAAI,OAAO,OAAO,IAAI,UAAU,EAAE;QACvC,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAA;KACrE;IAED,IAAI,GAAG,GAAG,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,MAAW,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAA;IAC/E,IAAI,GAAG,CAAC,MAAM,EAAE;QACd,OAAO,IAAI,CAAA,SAAS,GAAG,CAAC,CAAC,CAAC,CAAC,OAAO,SAAS,CAAA;KAC5C;IACD,OAAO,IAAI,CAAA,SAAS,KAAK,SAAS,CAAA;AACpC,CAAC,CAAA","sourcesContent":["import { html } from 'lit'\n\nimport { FieldRenderer } from '../types'\n\nexport const OxGristRendererSelect: FieldRenderer = (value, column, record, rowIndex, field) => {\n  if (!value) {\n    return ''\n  }\n  var rowOptionField = column.record.rowOptionField && record[column.record.rowOptionField]\n  var options = rowOptionField?.options ? rowOptionField.options : column.record.options\n\n  if (!options) {\n    console.error(`options value for select '${column.name}' column is mandatory.`)\n  } else if (typeof options == 'function') {\n    options = options.call(null, value, column, record, rowIndex, field)\n  }\n\n  var res = options ? options.filter((option: any) => option.value == value) : []\n  if (res.length) {\n    return html`<span>${res[0].display}</span>`\n  }\n  return html`<span>${value}</span>`\n}\n"]}
+{"version":3,"file":"ox-grist-renderer-select.js","sourceRoot":"","sources":["../../../src/renderers/ox-grist-renderer-select.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAI1B,MAAM,CAAC,MAAM,qBAAqB,GAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE;IAC7F,IAAI,KAAK,IAAI,IAAI,EAAE;QACjB,OAAO,EAAE,CAAA;KACV;IACD,IAAI,cAAc,GAAG,MAAM,CAAC,MAAM,CAAC,cAAc,IAAI,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,cAAc,CAAC,CAAA;IACzF,IAAI,OAAO,GAAG,CAAA,cAAc,aAAd,cAAc,uBAAd,cAAc,CAAE,OAAO,EAAC,CAAC,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAA;IAEtF,IAAI,CAAC,OAAO,EAAE;QACZ,OAAO,CAAC,KAAK,CAAC,6BAA6B,MAAM,CAAC,IAAI,wBAAwB,CAAC,CAAA;KAChF;SAAM,IAAI,OAAO,OAAO,IAAI,UAAU,EAAE;QACvC,OAAO,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAA;KACrE;IAED,IAAI,GAAG,GAAG,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,MAAW,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,IAAI,MAAM,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAA;IAC5G,IAAI,GAAG,CAAC,MAAM,EAAE;QACd,OAAO,IAAI,CAAA,SAAS,GAAG,CAAC,CAAC,CAAC,CAAC,OAAO,SAAS,CAAA;KAC5C;IACD,OAAO,IAAI,CAAA,SAAS,KAAK,SAAS,CAAA;AACpC,CAAC,CAAA","sourcesContent":["import { html } from 'lit'\n\nimport { FieldRenderer } from '../types'\n\nexport const OxGristRendererSelect: FieldRenderer = (value, column, record, rowIndex, field) => {\n  if (value == null) {\n    return ''\n  }\n  var rowOptionField = column.record.rowOptionField && record[column.record.rowOptionField]\n  var options = rowOptionField?.options ? rowOptionField.options : column.record.options\n\n  if (!options) {\n    console.error(`options value for select '${column.name}' column is mandatory.`)\n  } else if (typeof options == 'function') {\n    options = options.call(null, value, column, record, rowIndex, field)\n  }\n\n  var res = options ? options.filter((option: any) => option.value == String(value == null ? '' : value)) : []\n  if (res.length) {\n    return html`<span>${res[0].display}</span>`\n  }\n  return html`<span>${value}</span>`\n}\n"]}

package/dist/src/renderers/ox-grist-renderer-text.js

@@ -1,5 +1,5 @@
 import { html } from 'lit';
-import { detectOverflow } from '@operato/utils';
+import { detectOverflow, format as formatter } from '@operato/utils';
 function onmouseover(e) {
     const element = e.target;
     if (detectOverflow(element)) {
@@ -11,7 +11,11 @@ function onmouseout(e) {
     element.removeAttribute('data-tooltip');
 }
 export const OxGristRendererText = (value, column, record, rowIndex, field) => {
-    const text = value === undefined ? '' : value;
+    var { format } = column.record || {};
+    var text = value == null ? '' : value;
+    if (format) {
+        text = formatter(format, text);
+    }
     return html `<span @mouseover=${onmouseover} @mouseout=${onmouseout}>${text}</span>`;
 };
 //# sourceMappingURL=ox-grist-renderer-text.js.map

package/dist/src/renderers/ox-grist-renderer-text.js.map

@@ -1 +1 @@
-{"version":3,"file":"ox-grist-renderer-text.js","sourceRoot":"","sources":["../../../src/renderers/ox-grist-renderer-text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAI/C,SAAS,WAAW,CAAC,CAAQ;IAC3B,MAAM,OAAO,GAAG,CAAC,CAAC,MAAyB,CAAA;IAC3C,IAAI,cAAc,CAAC,OAAO,CAAC,EAAE;QAC3B,OAAO,CAAC,YAAY,CAAC,cAAc,EAAE,OAAO,CAAC,WAAY,CAAC,CAAA;KAC3D;AACH,CAAC;AAED,SAAS,UAAU,CAAC,CAAQ;IAC1B,MAAM,OAAO,GAAG,CAAC,CAAC,MAAyB,CAAA;IAC3C,OAAO,CAAC,eAAe,CAAC,cAAc,CAAC,CAAA;AACzC,CAAC;AAED,MAAM,CAAC,MAAM,mBAAmB,GAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE;IAC3F,MAAM,IAAI,GAAG,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAA;IAC7C,OAAO,IAAI,CAAA,oBAAoB,WAAW,cAAc,UAAU,IAAI,IAAI,SAAS,CAAA;AACrF,CAAC,CAAA","sourcesContent":["import { html } from 'lit'\n\nimport { detectOverflow } from '@operato/utils'\n\nimport { FieldRenderer } from '../types'\n\nfunction onmouseover(e: Event) {\n  const element = e.target as HTMLSpanElement\n  if (detectOverflow(element)) {\n    element.setAttribute('data-tooltip', element.textContent!)\n  }\n}\n\nfunction onmouseout(e: Event) {\n  const element = e.target as HTMLSpanElement\n  element.removeAttribute('data-tooltip')\n}\n\nexport const OxGristRendererText: FieldRenderer = (value, column, record, rowIndex, field) => {\n  const text = value === undefined ? '' : value\n  return html`<span @mouseover=${onmouseover} @mouseout=${onmouseout}>${text}</span>`\n}\n"]}
+{"version":3,"file":"ox-grist-renderer-text.js","sourceRoot":"","sources":["../../../src/renderers/ox-grist-renderer-text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,IAAI,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAIpE,SAAS,WAAW,CAAC,CAAQ;IAC3B,MAAM,OAAO,GAAG,CAAC,CAAC,MAAyB,CAAA;IAC3C,IAAI,cAAc,CAAC,OAAO,CAAC,EAAE;QAC3B,OAAO,CAAC,YAAY,CAAC,cAAc,EAAE,OAAO,CAAC,WAAY,CAAC,CAAA;KAC3D;AACH,CAAC;AAED,SAAS,UAAU,CAAC,CAAQ;IAC1B,MAAM,OAAO,GAAG,CAAC,CAAC,MAAyB,CAAA;IAC3C,OAAO,CAAC,eAAe,CAAC,cAAc,CAAC,CAAA;AACzC,CAAC;AAED,MAAM,CAAC,MAAM,mBAAmB,GAAkB,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE;IAC3F,IAAI,EAAE,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,IAAI,EAAE,CAAA;IAEpC,IAAI,IAAI,GAAG,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAA;IACrC,IAAI,MAAM,EAAE;QACV,IAAI,GAAG,SAAS,CAAC,MAAM,EAAE,IAAI,CAAC,CAAA;KAC/B;IAED,OAAO,IAAI,CAAA,oBAAoB,WAAW,cAAc,UAAU,IAAI,IAAI,SAAS,CAAA;AACrF,CAAC,CAAA","sourcesContent":["import { html } from 'lit'\n\nimport { detectOverflow, format as formatter } from '@operato/utils'\n\nimport { FieldRenderer } from '../types'\n\nfunction onmouseover(e: Event) {\n  const element = e.target as HTMLSpanElement\n  if (detectOverflow(element)) {\n    element.setAttribute('data-tooltip', element.textContent!)\n  }\n}\n\nfunction onmouseout(e: Event) {\n  const element = e.target as HTMLSpanElement\n  element.removeAttribute('data-tooltip')\n}\n\nexport const OxGristRendererText: FieldRenderer = (value, column, record, rowIndex, field) => {\n  var { format } = column.record || {}\n\n  var text = value == null ? '' : value\n  if (format) {\n    text = formatter(format, text)\n  }\n\n  return html`<span @mouseover=${onmouseover} @mouseout=${onmouseout}>${text}</span>`\n}\n"]}

package/dist/src/sorters/sorters-control.d.ts

@@ -1,5 +1,5 @@
-import { ColumnConfig, GristConfig, SorterConfig } from '../types';
 import { LitElement, PropertyValues, TemplateResult } from 'lit';
+import { ColumnConfig, GristConfig, SorterConfig } from '../types';
 export declare class SortersControl extends LitElement {
     static styles: import("lit").CSSResult[];
     config: GristConfig;

package/dist/src/sorters/sorters-control.js

@@ -1,5 +1,5 @@
 import { __decorate } from "tslib";
-import { LitElement, css, html } from 'lit';
+import { css, html, LitElement } from 'lit';
 import { customElement, state } from 'lit/decorators.js';
 let SortersControl = class SortersControl extends LitElement {
     constructor() {
@@ -15,19 +15,17 @@ let SortersControl = class SortersControl extends LitElement {
             grist.addEventListener('config-change', (e) => {
                 this.config = e.detail;
             });
-            grist.addEventListener('sorters-change', e => {
+            grist.addEventListener('fetch-params-change', e => {
                 const { sorters, from } = e.detail || {};
                 if (from === 'sorters-control') {
                     return;
                 }
-                this.sorters = sorters;
+                sorters && (this.sorters = sorters);
             });
         }
     }
     updated(changes) {
-        // TODO config 에 의한 sorters 설정은 제거해야 한다.
         if (changes.has('config')) {
-            const sorters = this.config.sorters || [];
             this.columns = this.config.columns.filter(column => column.sortable);
             this.sorters = this.sorters || this.config.sorters || [];
         }
@@ -54,7 +52,7 @@ let SortersControl = class SortersControl extends LitElement {
             ${desc === null
                 ? html ``
                 : html `
-                  <mwc-icon>${desc ? 'keyboard_arrow_up' : 'keyboard_arrow_down'}</mwc-icon>
+                  <mwc-icon>${desc ? 'keyboard_arrow_down' : 'keyboard_arrow_up'}</mwc-icon>
                   ${rank === 0 ? html `` : html `<sub>${rank}</sub>`}
                 `}
           </div>
@@ -81,7 +79,7 @@ let SortersControl = class SortersControl extends LitElement {
             sorters.push(sorter);
         }
         this.sorters = sorters;
-        this.dispatchEvent(new CustomEvent('sorters-change', {
+        this.dispatchEvent(new CustomEvent('fetch-params-change', {
             bubbles: true,
             composed: true,
             detail: {

package/dist/src/sorters/sorters-control.js.map

@@ -1 +1 @@
-{"version":3,"file":"sorters-control.js","sourceRoot":"","sources":["../../../src/sorters/sorters-control.ts"],"names":[],"mappings":"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","sourcesContent":["import { ColumnConfig, GristConfig, SorterConfig } from '../types'\nimport { LitElement, PropertyValues, TemplateResult, css, html } from 'lit'\nimport { customElement, state } from 'lit/decorators.js'\n\nimport { DataGrist } from '../data-grist'\n\n@customElement('ox-sorters-control')\nexport class SortersControl extends LitElement {\n  static styles = [\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n        white-space: nowrap;\n      }\n\n      [option] {\n        flex: 1;\n\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        border-bottom: 1px solid rgba(0, 0, 0, 0.05);\n        padding: 3px var(--padding-narrow);\n      }\n\n      [option] > span {\n        margin-right: auto;\n        text-transform: capitalize;\n        user-select: none;\n      }\n      [option] mwc-icon {\n        margin-left: var(--margin-default);\n        --mdc-icon-size: var(--fontsize-large);\n        color: var(--primary-color);\n      }\n      [option] sub {\n        color: var(--primary-color);\n      }\n    `\n  ]\n\n  @state() config!: GristConfig\n  @state() columns: ColumnConfig[] = []\n  @state() sorters: SorterConfig[] = []\n\n  connectedCallback(): void {\n    super.connectedCallback()\n\n    const grist = this.closest('ox-grist') as DataGrist\n\n    if (grist) {\n      this.config = grist.compiledConfig\n      grist.addEventListener('config-change', (e: Event) => {\n        this.config = (e as CustomEvent).detail\n      })\n\n      grist.addEventListener('sorters-change', e => {\n        const { sorters, from } = (e as CustomEvent).detail || {}\n        if (from === 'sorters-control') {\n          return\n        }\n\n        this.sorters = sorters\n      })\n    }\n  }\n\n  updated(changes: PropertyValues<this>) {\n    // TODO config 에 의한 sorters 설정은 제거해야 한다.\n    if (changes.has('config')) {\n      const sorters = this.config.sorters || []\n\n      this.columns = this.config.columns.filter(column => column.sortable)\n      this.sorters = this.sorters || this.config.sorters || []\n    }\n  }\n\n  render(): TemplateResult {\n    const columns = this.columns\n\n    const current = this.sorters || []\n\n    return html`\n      ${columns.map(column => {\n        const { name } = column\n        var rank = current.findIndex(sorter => sorter.name === name) + 1\n        var desc = rank !== 0 ? current[rank - 1].desc : null\n\n        if (current.length <= 1) {\n          rank = 0\n        }\n\n        return html`\n          <div\n            option\n            @click=${(e: MouseEvent) => {\n              this.onChangeSort(name)\n            }}\n          >\n            <span>${column.header.renderer.call(this, column)}</span>\n            ${desc === null\n              ? html``\n              : html`\n                  <mwc-icon>${desc ? 'keyboard_arrow_up' : 'keyboard_arrow_down'}</mwc-icon>\n                  ${rank === 0 ? html`` : html`<sub>${rank}</sub>`}\n                `}\n          </div>\n        `\n      })}\n    `\n  }\n\n  onChangeSort(name: string) {\n    var sorters = [...this.sorters]\n\n    var idx = sorters.findIndex(sorter => sorter.name == name)\n    if (idx !== -1) {\n      let sorter = sorters[idx]\n      if (sorter.desc) {\n        sorters.splice(idx, 1)\n      } else {\n        sorter.desc = true\n      }\n    } else {\n      var sorter = {\n        name\n      }\n\n      sorters.push(sorter)\n    }\n\n    this.sorters = sorters\n\n    this.dispatchEvent(\n      new CustomEvent('sorters-change', {\n        bubbles: true,\n        composed: true,\n        detail: {\n          sorters: this.sorters,\n          from: 'sorters-control'\n        }\n      })\n    )\n  }\n}\n"]}
+{"version":3,"file":"sorters-control.js","sourceRoot":"","sources":["../../../src/sorters/sorters-control.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, PropertyValues, TemplateResult } from 'lit'\nimport { customElement, state } from 'lit/decorators.js'\n\nimport { DataGrist } from '../data-grist'\nimport { ColumnConfig, GristConfig, SorterConfig } from '../types'\n\n@customElement('ox-sorters-control')\nexport class SortersControl extends LitElement {\n  static styles = [\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n        white-space: nowrap;\n      }\n\n      [option] {\n        flex: 1;\n\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        border-bottom: 1px solid rgba(0, 0, 0, 0.05);\n        padding: 3px var(--padding-narrow);\n      }\n\n      [option] > span {\n        margin-right: auto;\n        text-transform: capitalize;\n        user-select: none;\n      }\n      [option] mwc-icon {\n        margin-left: var(--margin-default);\n        --mdc-icon-size: var(--fontsize-large);\n        color: var(--primary-color);\n      }\n      [option] sub {\n        color: var(--primary-color);\n      }\n    `\n  ]\n\n  @state() config!: GristConfig\n  @state() columns: ColumnConfig[] = []\n  @state() sorters: SorterConfig[] = []\n\n  connectedCallback(): void {\n    super.connectedCallback()\n\n    const grist = this.closest('ox-grist') as DataGrist\n\n    if (grist) {\n      this.config = grist.compiledConfig\n      grist.addEventListener('config-change', (e: Event) => {\n        this.config = (e as CustomEvent).detail\n      })\n\n      grist.addEventListener('fetch-params-change', e => {\n        const { sorters, from } = (e as CustomEvent).detail || {}\n        if (from === 'sorters-control') {\n          return\n        }\n\n        sorters && (this.sorters = sorters)\n      })\n    }\n  }\n\n  updated(changes: PropertyValues<this>) {\n    if (changes.has('config')) {\n      this.columns = this.config.columns.filter(column => column.sortable)\n      this.sorters = this.sorters || this.config.sorters || []\n    }\n  }\n\n  render(): TemplateResult {\n    const columns = this.columns\n\n    const current = this.sorters || []\n\n    return html`\n      ${columns.map(column => {\n        const { name } = column\n        var rank = current.findIndex(sorter => sorter.name === name) + 1\n        var desc = rank !== 0 ? current[rank - 1].desc : null\n\n        if (current.length <= 1) {\n          rank = 0\n        }\n\n        return html`\n          <div\n            option\n            @click=${(e: MouseEvent) => {\n              this.onChangeSort(name)\n            }}\n          >\n            <span>${column.header.renderer.call(this, column)}</span>\n            ${desc === null\n              ? html``\n              : html`\n                  <mwc-icon>${desc ? 'keyboard_arrow_down' : 'keyboard_arrow_up'}</mwc-icon>\n                  ${rank === 0 ? html`` : html`<sub>${rank}</sub>`}\n                `}\n          </div>\n        `\n      })}\n    `\n  }\n\n  onChangeSort(name: string) {\n    var sorters = [...this.sorters]\n\n    var idx = sorters.findIndex(sorter => sorter.name == name)\n    if (idx !== -1) {\n      let sorter = sorters[idx]\n      if (sorter.desc) {\n        sorters.splice(idx, 1)\n      } else {\n        sorter.desc = true\n      }\n    } else {\n      var sorter = {\n        name\n      }\n\n      sorters.push(sorter)\n    }\n\n    this.sorters = sorters\n\n    this.dispatchEvent(\n      new CustomEvent('fetch-params-change', {\n        bubbles: true,\n        composed: true,\n        detail: {\n          sorters: this.sorters,\n          from: 'sorters-control'\n        }\n      })\n    )\n  }\n}\n"]}

package/dist/src/types.d.ts

@@ -1,14 +1,15 @@
+import { TemplateResult } from 'lit-html';
 import { DataCardField } from './data-card/data-card-field';
 import { DataCardGutter } from './data-card/data-card-gutter';
+import { RecordCard } from './data-card/record-card';
 import { DataGridField } from './data-grid/data-grid-field';
 import { DataListField } from './data-list/data-list-field';
 import { DataListGutter } from './data-list/data-list-gutter';
+import { RecordPartial } from './data-list/record-partial';
 import { DataReportField } from './data-report/data-report-field';
 import { OxGristEditor } from './editors';
+import { QueryFilter } from './filters';
 import { OxGristRenderer } from './renderers/ox-grist-renderer';
-import { RecordCard } from './data-card/record-card';
-import { RecordPartial } from './data-list/record-partial';
-import { TemplateResult } from 'lit-html';
 export declare type GristConfig = {
     columns: ColumnConfig[];
     rows: RowsConfig;
@@ -28,6 +29,7 @@ export declare type FilterConfigObject = {
     options?: {
         [key: string]: any;
     };
+    value?: string | number | boolean | string[] | number[] | undefined;
 };
 export declare type FilterConfig = FilterConfigObject | FilterOperator | boolean;
 export declare type FilterValue = {
@@ -45,7 +47,8 @@ export declare type FetchOption = {
     page?: number;
     limit?: number;
     sorters?: SortersConfig;
-    filters?: FilterConfigObject[];
+    sortings?: SortersConfig;
+    filters?: QueryFilter[];
     options?: object;
 };
 export declare type FetchResult = {

package/dist/src/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"","sourcesContent":["import { DataCardField } from './data-card/data-card-field'\nimport { DataCardGutter } from './data-card/data-card-gutter'\nimport { DataGridField } from './data-grid/data-grid-field'\nimport { DataListField } from './data-list/data-list-field'\nimport { DataListGutter } from './data-list/data-list-gutter'\nimport { DataReportField } from './data-report/data-report-field'\nimport { OxGristEditor } from './editors'\nimport { OxGristRenderer } from './renderers/ox-grist-renderer'\nimport { RecordCard } from './data-card/record-card'\nimport { RecordPartial } from './data-list/record-partial'\nimport { TemplateResult } from 'lit-html'\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[]\nexport type FilterOperator =\n  | 'search'\n  | 'eq'\n  | 'between'\n  | 'gte'\n  | 'lte'\n  | 'is_not_true'\n  | 'in'\n  | 'like'\n  | 'i_like'\n  | 'noteq'\n  | 'is_empty_num_id'\n  | 'is_blank'\n  | 'is_present'\n  | 'is_not_false'\n  | 'is_true'\n  | 'is_false'\n  | 'is_not_null'\n  | 'is_null'\n  | 'notin_with_null'\n  | 'notin'\n  | 'gt'\n  | 'lt'\n  | 'i_nlike'\n  | 'nlike'\n\nexport type FilterConfigObject = {\n  type: string\n  operator?: FilterOperator\n  options?: { [key: string]: any }\n}\nexport type FilterConfig = FilterConfigObject | FilterOperator | boolean\n\nexport type FilterValue = {\n  name: string\n  operator: FilterOperator\n  value: string | number | boolean | string[] | number[] | undefined\n}\n\nexport type PaginationConfig = {\n  page?: number\n  limit?: number\n  pages?: number[]\n  infinite?: boolean\n}\n\nexport type FetchOption = {\n  page?: number\n  limit?: number\n  sorters?: SortersConfig\n  filters?: FilterConfigObject[]\n  options?: object\n}\nexport type FetchResult = {\n  page?: number\n  limit?: number\n  total: number\n  records: GristRecord[]\n} | void\nexport type FetchHandler = (param: FetchOption) => Promise<FetchResult>\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  filter?: FilterConfig\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  mandatory?: boolean\n  classifier: GristClassifier\n  align?: 'left' | 'right' | 'center'\n  options: { [key: string]: any }\n  rowOptionField?: string\n  [extended: string]: any\n}\n\nexport type FieldRenderer = (\n  value: any,\n  column: ColumnConfig,\n  record: GristRecord,\n  rowIndex: number,\n  owner:\n    | DataGridField\n    | RecordCard\n    | DataCardGutter\n    | DataCardField\n    | DataListGutter\n    | DataListField\n    | RecordPartial\n    | DataReportField\n    | Element\n) => OxGristRenderer | TemplateResult | string | void\nexport type FieldEditor = (\n  value: any,\n  column: ColumnConfig,\n  record: GristRecord,\n  rowIndex: number,\n  field: DataGridField\n) => OxGristEditor\n\nexport type FilterSelectRenderer = (\n  column: ColumnConfig,\n  value: string | number | boolean | string[] | number[] | any | undefined,\n  owner: Element\n) => TemplateResult | string | void\n\nexport type GristEventHandlerSet = {\n  click?: GristEventHandler\n  dblclick?: GristEventHandler\n}\n\nexport type ListConfig = {\n  thumbnail?: string\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\nexport type GristSelectFunction = (record: GristRecord) => boolean\n"]}
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/types.ts"],"names":[],"mappings":"","sourcesContent":["import { TemplateResult } from 'lit-html'\n\nimport { DataCardField } from './data-card/data-card-field'\nimport { DataCardGutter } from './data-card/data-card-gutter'\nimport { RecordCard } from './data-card/record-card'\nimport { DataGridField } from './data-grid/data-grid-field'\nimport { DataListField } from './data-list/data-list-field'\nimport { DataListGutter } from './data-list/data-list-gutter'\nimport { RecordPartial } from './data-list/record-partial'\nimport { DataReportField } from './data-report/data-report-field'\nimport { OxGristEditor } from './editors'\nimport { QueryFilter } from './filters'\nimport { OxGristRenderer } from './renderers/ox-grist-renderer'\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[]\nexport type FilterOperator =\n  | 'search'\n  | 'eq'\n  | 'between'\n  | 'gte'\n  | 'lte'\n  | 'is_not_true'\n  | 'in'\n  | 'like'\n  | 'i_like'\n  | 'noteq'\n  | 'is_empty_num_id'\n  | 'is_blank'\n  | 'is_present'\n  | 'is_not_false'\n  | 'is_true'\n  | 'is_false'\n  | 'is_not_null'\n  | 'is_null'\n  | 'notin_with_null'\n  | 'notin'\n  | 'gt'\n  | 'lt'\n  | 'i_nlike'\n  | 'nlike'\n\nexport type FilterConfigObject = {\n  type: string\n  operator?: FilterOperator\n  options?: { [key: string]: any }\n  value?: string | number | boolean | string[] | number[] | undefined\n}\nexport type FilterConfig = FilterConfigObject | FilterOperator | boolean\n\nexport type FilterValue = {\n  name: string\n  operator: FilterOperator\n  value: string | number | boolean | string[] | number[] | undefined\n}\n\nexport type PaginationConfig = {\n  page?: number\n  limit?: number\n  pages?: number[]\n  infinite?: boolean\n}\n\nexport type FetchOption = {\n  page?: number\n  limit?: number\n  sorters?: SortersConfig\n  sortings?: SortersConfig\n  filters?: QueryFilter[]\n  options?: object\n}\nexport type FetchResult = {\n  page?: number\n  limit?: number\n  total: number\n  records: GristRecord[]\n} | void\nexport type FetchHandler = (param: FetchOption) => Promise<FetchResult>\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  filter?: FilterConfig\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  mandatory?: boolean\n  classifier: GristClassifier\n  align?: 'left' | 'right' | 'center'\n  options: { [key: string]: any }\n  rowOptionField?: string\n  [extended: string]: any\n}\n\nexport type FieldRenderer = (\n  value: any,\n  column: ColumnConfig,\n  record: GristRecord,\n  rowIndex: number,\n  owner:\n    | DataGridField\n    | RecordCard\n    | DataCardGutter\n    | DataCardField\n    | DataListGutter\n    | DataListField\n    | RecordPartial\n    | DataReportField\n    | Element\n) => OxGristRenderer | TemplateResult | string | void\nexport type FieldEditor = (\n  value: any,\n  column: ColumnConfig,\n  record: GristRecord,\n  rowIndex: number,\n  field: DataGridField\n) => OxGristEditor\n\nexport type FilterSelectRenderer = (\n  column: ColumnConfig,\n  value: string | number | boolean | string[] | number[] | any | undefined,\n  owner: Element\n) => TemplateResult | string | void\n\nexport type GristEventHandlerSet = {\n  click?: GristEventHandler\n  dblclick?: GristEventHandler\n}\n\nexport type ListConfig = {\n  thumbnail?: string\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\nexport type GristSelectFunction = (record: GristRecord) => boolean\n"]}

package/dist/stories/{index.stories.d.ts → barcode-input-filter.stories.d.ts}

@@ -1,16 +1,17 @@
-import '../index.js';
+import '../src/index.js';
+import '../src/filters/filters-form.js';
+import '../src/sorters/sorters-control.js';
+import '@operato/popup/ox-popup-list.js';
+import '@material/mwc-icon';
 import { TemplateResult } from 'lit';
 declare const _default: {
     title: string;
     component: string;
     argTypes: {
-        title: {
+        englishOnly: {
             control: string;
         };
-        counter: {
-            control: string;
-        };
-        textColor: {
+        selectAfterChange: {
             control: string;
         };
     };
@@ -22,12 +23,7 @@ interface Story<T> {
     argTypes?: Record<string, unknown>;
 }
 interface ArgTypes {
-    title?: string;
-    counter?: number;
-    textColor?: string;
-    slot?: TemplateResult;
+    englishOnly: boolean;
+    selectAfterChange: boolean;
 }
 export declare const Regular: Story<ArgTypes>;
-export declare const CustomTitle: Story<ArgTypes>;
-export declare const CustomCounter: Story<ArgTypes>;
-export declare const SlottedContent: Story<ArgTypes>;