@things-factory/integration-ui 6.1.66 → 6.1.69

package/client/viewparts/scenarios-monitor.ts

@@ -0,0 +1,147 @@
+import '@operato/data-grist'
+import '@material/mwc-icon-button'
+import './scenario-monitor'
+
+import { css, html, LitElement } from 'lit'
+import { customElement, property, query } from 'lit/decorators.js'
+
+import { i18next, localize } from '@operato/i18n'
+import { ScrollbarStyles } from '@operato/styles'
+
+function IS_SCENARIO_RUNNING(state) {
+  return state && state !== 'UNLOADED'
+}
+
+@customElement('scenarios-monitor')
+export class ScenariosMonitor extends localize(i18next)(LitElement) {
+  static styles = [
+    ScrollbarStyles,
+    css`
+      :host {
+        display: flex;
+        flex-direction: column;
+
+        overflow: hidden;
+      }
+
+      [info] {
+        display: flex;
+        margin-bottom: var(--margin-default);
+        padding: var(--padding-narrow) 0;
+        flex-direction: row;
+        align-items: center;
+        border-bottom: 2px solid var(--secondary-color);
+      }
+      [info] h2 {
+        margin: 0;
+        font: var(--subtitle-font);
+        color: var(--secondary-color);
+        text-transform: capitalize;
+      }
+
+      [info] > span {
+        display: flex;
+        margin-left: auto;
+      }
+      [info] input {
+        margin: var(--input-margin);
+        padding: var(--padding-narrow);
+        border: var(--border-dark-color);
+        border-radius: var(--border-radius);
+        font: var(--input-font);
+      }
+      [info] mwc-icon {
+        margin-left: var(--margin-narrow);
+        color: rgba(var(--secondary-color-rgb), 0.6);
+        line-height: 34px;
+        cursor: pointer;
+      }
+      [info] mwc-icon[active] {
+        color: var(--primary-color);
+      }
+
+      [content] {
+        flex: 1;
+
+        display: flex;
+        flex-direction: row;
+
+        overflow: hidden;
+      }
+
+      pending-q-monitor {
+        width: 100px;
+      }
+
+      [scenarios] {
+        flex: 1;
+
+        overflow: auto;
+        display: flex;
+        flex-direction: column;
+      }
+
+      [scenarios] [flowbox] {
+        display: flex;
+        flex-direction: column;
+        min-height: min-content;
+      }
+
+      [scenarios][mode='brief'] [flowbox] {
+        flex-flow: row wrap;
+        align-self: start;
+      }
+
+      scenario-monitor {
+        flex: none;
+        height: fit-content;
+      }
+
+      @media screen and (max-width: 480px) {
+        pending-q-monitor {
+          width: 80px;
+        }
+      }
+    `
+  ]
+
+  @property({ type: Array }) scenarios: any
+  @property({ type: String }) mode?: string
+  @property({ type: String }) filter?: string
+  @property({ type: Array }) pendings: any
+  @property({ type: Object }) colorIndex: any
+  @property({ type: Boolean }) running: boolean = false
+
+  render() {
+    var scenarios = this.scenarios || []
+    const mode = this.mode || 'brief'
+    const filter = this.filter || ''
+
+    return html`
+      <div info>
+        <h2>scenarios</h2>
+        <span>
+          <input .value=${filter} @change=${e => (this.filter = e.target.value)} placeholder="search" />
+          <mwc-icon @click=${e => (this.mode = 'brief')} ?active=${mode == 'brief'}>view_comfy</mwc-icon>
+          <mwc-icon @click=${e => (this.mode = 'detail')} ?active=${mode == 'detail'}>dehaze</mwc-icon>
+        </span>
+      </div>
+
+      <div content>
+        <pending-q-monitor
+          .pendings=${this.pendings}
+          .colorIndex=${this.colorIndex || {}}
+          .running=${this.running}
+        ></pending-q-monitor>
+
+        <div scenarios mode=${mode}>
+          <div flowbox>
+            ${scenarios
+              .filter(scenario => scenario.name.indexOf(filter) == 0)
+              .map(scenario => html`<scenario-monitor .scenario=${scenario} mode=${mode}></scenario-monitor>`)}
+          </div>
+        </div>
+      </div>
+    `
+  }
+}

package/dist-client/bootstrap.d.ts

@@ -0,0 +1,4 @@
+import '@material/mwc-icon';
+import './editors/entity-editor';
+import './editors/property-editor';
+export default function bootstrap(): void;

package/dist-client/bootstrap.js

@@ -0,0 +1,29 @@
+import '@material/mwc-icon';
+import './editors/entity-editor';
+import './editors/property-editor';
+import { OxGristEditorJson } from '@operato/app/grist-editor/ox-grist-editor-json.js';
+import { OxGristRendererCrontab } from '@operato/app/grist-editor/ox-grist-renderer-crontab.js';
+import { registerEditor as registerGristEditor, registerRenderer as registerGristRenderer } from '@operato/data-grist';
+import { OxGristEditorCrontab } from '@operato/grist-editor/ox-grist-editor-crontab.js';
+import { OxGristEditorParameters } from '@operato/grist-editor/ox-grist-editor-parameters.js';
+import { OxPropertyEditor } from '@operato/property-editor';
+import { ConnectionSelector } from './grist/connection-selector';
+import { ConnectorSelector } from './grist/connector-selector';
+import { TaskTypeSelector } from './grist/task-type-selector';
+export default function bootstrap() {
+    registerGristEditor('task-type', TaskTypeSelector);
+    registerGristEditor('connector', ConnectorSelector);
+    registerGristEditor('connection', ConnectionSelector);
+    registerGristEditor('json', OxGristEditorJson);
+    registerGristEditor('parameters', OxGristEditorParameters);
+    registerGristEditor('crontab', OxGristEditorCrontab);
+    registerGristRenderer('crontab', OxGristRendererCrontab);
+    OxPropertyEditor.register({
+        'http-headers': 'property-editor-http-headers',
+        'http-parameters': 'property-editor-http-parameters',
+        'http-body': 'property-editor-http-body',
+        'entity-selector': 'property-editor-entity-selector',
+        'scenario-step-input': 'property-editor-scenario-step-input'
+    });
+}
+//# sourceMappingURL=bootstrap.js.map

package/dist-client/bootstrap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bootstrap.js","sourceRoot":"","sources":["../client/bootstrap.ts"],"names":[],"mappings":"AAAA,OAAO,oBAAoB,CAAA;AAC3B,OAAO,yBAAyB,CAAA;AAChC,OAAO,2BAA2B,CAAA;AAElC,OAAO,EAAE,iBAAiB,EAAE,MAAM,mDAAmD,CAAA;AACrF,OAAO,EAAE,sBAAsB,EAAE,MAAM,wDAAwD,CAAA;AAC/F,OAAO,EAAE,cAAc,IAAI,mBAAmB,EAAE,gBAAgB,IAAI,qBAAqB,EAAE,MAAM,qBAAqB,CAAA;AACtH,OAAO,EAAE,oBAAoB,EAAE,MAAM,kDAAkD,CAAA;AACvF,OAAO,EAAE,uBAAuB,EAAE,MAAM,qDAAqD,CAAA;AAC7F,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAA;AAE3D,OAAO,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAA;AAChE,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAA;AAC9D,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAA;AAE7D,MAAM,CAAC,OAAO,UAAU,SAAS;IAC/B,mBAAmB,CAAC,WAAW,EAAE,gBAAgB,CAAC,CAAA;IAClD,mBAAmB,CAAC,WAAW,EAAE,iBAAiB,CAAC,CAAA;IACnD,mBAAmB,CAAC,YAAY,EAAE,kBAAkB,CAAC,CAAA;IACrD,mBAAmB,CAAC,MAAM,EAAE,iBAAiB,CAAC,CAAA;IAC9C,mBAAmB,CAAC,YAAY,EAAE,uBAAuB,CAAC,CAAA;IAC1D,mBAAmB,CAAC,SAAS,EAAE,oBAAoB,CAAC,CAAA;IAEpD,qBAAqB,CAAC,SAAS,EAAE,sBAAsB,CAAC,CAAA;IAExD,gBAAgB,CAAC,QAAQ,CAAC;QACxB,cAAc,EAAE,8BAA8B;QAC9C,iBAAiB,EAAE,iCAAiC;QACpD,WAAW,EAAE,2BAA2B;QACxC,iBAAiB,EAAE,iCAAiC;QACpD,qBAAqB,EAAE,qCAAqC;KAC7D,CAAC,CAAA;AACJ,CAAC","sourcesContent":["import '@material/mwc-icon'\nimport './editors/entity-editor'\nimport './editors/property-editor'\n\nimport { OxGristEditorJson } from '@operato/app/grist-editor/ox-grist-editor-json.js'\nimport { OxGristRendererCrontab } from '@operato/app/grist-editor/ox-grist-renderer-crontab.js'\nimport { registerEditor as registerGristEditor, registerRenderer as registerGristRenderer } from '@operato/data-grist'\nimport { OxGristEditorCrontab } from '@operato/grist-editor/ox-grist-editor-crontab.js'\nimport { OxGristEditorParameters } from '@operato/grist-editor/ox-grist-editor-parameters.js'\nimport { OxPropertyEditor } from '@operato/property-editor'\n\nimport { ConnectionSelector } from './grist/connection-selector'\nimport { ConnectorSelector } from './grist/connector-selector'\nimport { TaskTypeSelector } from './grist/task-type-selector'\n\nexport default function bootstrap() {\n  registerGristEditor('task-type', TaskTypeSelector)\n  registerGristEditor('connector', ConnectorSelector)\n  registerGristEditor('connection', ConnectionSelector)\n  registerGristEditor('json', OxGristEditorJson)\n  registerGristEditor('parameters', OxGristEditorParameters)\n  registerGristEditor('crontab', OxGristEditorCrontab)\n\n  registerGristRenderer('crontab', OxGristRendererCrontab)\n\n  OxPropertyEditor.register({\n    'http-headers': 'property-editor-http-headers',\n    'http-parameters': 'property-editor-http-parameters',\n    'http-body': 'property-editor-http-body',\n    'entity-selector': 'property-editor-entity-selector',\n    'scenario-step-input': 'property-editor-scenario-step-input'\n  })\n}\n"]}

package/dist-client/editors/entity-editor.d.ts

@@ -0,0 +1,10 @@
+import './things-editor-entity-selector';
+import { OxPropertyEditor } from '@operato/property-editor';
+export declare class PropertyEditorEntitySelector extends OxPropertyEditor {
+    static get styles(): import("lit").CSSResult[];
+    editorTemplate(value: any, spec: any): import("lit-html").TemplateResult<1>;
+    shouldUpdate(changedProperties: any): boolean;
+    get valueProperty(): string;
+    _computeLabelId(label: any): any;
+    _valueChanged(e: any): void;
+}

package/dist-client/editors/entity-editor.js

@@ -0,0 +1,47 @@
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ */
+import { __decorate } from "tslib";
+import './things-editor-entity-selector';
+import { html } from 'lit';
+import { customElement } from 'lit/decorators.js';
+import cloneDeep from 'lodash-es/cloneDeep';
+import { OxPropertyEditor } from '@operato/property-editor';
+let PropertyEditorEntitySelector = class PropertyEditorEntitySelector extends OxPropertyEditor {
+    static get styles() {
+        return [...OxPropertyEditor.styles];
+    }
+    editorTemplate(value, spec) {
+        return html `
+      <things-editor-entity-selector
+        id="editor"
+        .value=${value}
+        .properties=${spec.property}
+      ></things-editor-entity-selector>
+    `;
+    }
+    shouldUpdate(changedProperties) {
+        return true;
+    }
+    get valueProperty() {
+        return 'value';
+    }
+    _computeLabelId(label) {
+        if (label.indexOf('label.') >= 0)
+            return label;
+        return 'label.' + label;
+    }
+    _valueChanged(e) {
+        e.stopPropagation();
+        this.value = cloneDeep(e.target[this.valueProperty]);
+        this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }));
+        if (!this.observe)
+            return;
+        this.observe.call(this, this.value);
+    }
+};
+PropertyEditorEntitySelector = __decorate([
+    customElement('property-editor-entity-selector')
+], PropertyEditorEntitySelector);
+export { PropertyEditorEntitySelector };
+//# sourceMappingURL=entity-editor.js.map

package/dist-client/editors/entity-editor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"entity-editor.js","sourceRoot":"","sources":["../../client/editors/entity-editor.ts"],"names":[],"mappings":"AAAA;;GAEG;;AAEH,OAAO,iCAAiC,CAAA;AAExC,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC1B,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AACjD,OAAO,SAAS,MAAM,qBAAqB,CAAA;AAE3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAA;AAGpD,IAAM,4BAA4B,GAAlC,MAAM,4BAA6B,SAAQ,gBAAgB;IAChE,MAAM,KAAK,MAAM;QACf,OAAO,CAAC,GAAG,gBAAgB,CAAC,MAAM,CAAC,CAAA;IACrC,CAAC;IAED,cAAc,CAAC,KAAK,EAAE,IAAI;QACxB,OAAO,IAAI,CAAA;;;iBAGE,KAAK;sBACA,IAAI,CAAC,QAAQ;;KAE9B,CAAA;IACH,CAAC;IAED,YAAY,CAAC,iBAAiB;QAC5B,OAAO,IAAI,CAAA;IACb,CAAC;IAED,IAAI,aAAa;QACf,OAAO,OAAO,CAAA;IAChB,CAAC;IAED,eAAe,CAAC,KAAK;QACnB,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAC;YAAE,OAAO,KAAK,CAAA;QAE9C,OAAO,QAAQ,GAAG,KAAK,CAAA;IACzB,CAAC;IAED,aAAa,CAAC,CAAC;QACb,CAAC,CAAC,eAAe,EAAE,CAAA;QAEnB,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAA;QAEpD,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;QAEhF,IAAI,CAAC,IAAI,CAAC,OAAO;YAAE,OAAM;QACzB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,CAAA;IACrC,CAAC;CACF,CAAA;AAvCY,4BAA4B;IADxC,aAAa,CAAC,iCAAiC,CAAC;GACpC,4BAA4B,CAuCxC;SAvCY,4BAA4B","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport './things-editor-entity-selector'\n\nimport { html } from 'lit'\nimport { customElement } from 'lit/decorators.js'\nimport cloneDeep from 'lodash-es/cloneDeep'\n\nimport { OxPropertyEditor } from '@operato/property-editor'\n\n@customElement('property-editor-entity-selector')\nexport class PropertyEditorEntitySelector extends OxPropertyEditor {\n  static get styles() {\n    return [...OxPropertyEditor.styles]\n  }\n\n  editorTemplate(value, spec) {\n    return html`\n      <things-editor-entity-selector\n        id=\"editor\"\n        .value=${value}\n        .properties=${spec.property}\n      ></things-editor-entity-selector>\n    `\n  }\n\n  shouldUpdate(changedProperties) {\n    return true\n  }\n\n  get valueProperty() {\n    return 'value'\n  }\n\n  _computeLabelId(label) {\n    if (label.indexOf('label.') >= 0) return label\n\n    return 'label.' + label\n  }\n\n  _valueChanged(e) {\n    e.stopPropagation()\n\n    this.value = cloneDeep(e.target[this.valueProperty])\n\n    this.dispatchEvent(new CustomEvent('change', { bubbles: true, composed: true }))\n\n    if (!this.observe) return\n    this.observe.call(this, this.value)\n  }\n}\n"]}

package/dist-client/editors/entity-selector.d.ts

@@ -0,0 +1,34 @@
+import '@operato/data-grist';
+import { LitElement } from 'lit';
+import { DataGrist } from '@operato/data-grist/ox-grist.js';
+export declare class EntitySelector extends LitElement {
+    static styles: any[];
+    value?: string;
+    searchFields: any;
+    config: any;
+    data: any;
+    queryName: string;
+    select: any;
+    list: any;
+    basicArgs: any;
+    selectedRecords: any;
+    grist: DataGrist;
+    searchForm: HTMLFormElement;
+    render(): import("lit-html").TemplateResult<1>;
+    onCancel(): void;
+    onConfirm(): void;
+    fetchHandler({ page, limit, sorters }: {
+        page: any;
+        limit: any;
+        sorters?: never[] | undefined;
+    }): Promise<{
+        records: any;
+        total: any;
+        limit: any;
+        page: any;
+    } | undefined>;
+    firstUpdated(): Promise<void>;
+    getSelectFields(): string;
+    _buildConditions(page: any, limit: any, sorters: any): Promise<any>;
+    get selected(): import("@operato/data-grist").GristRecord | undefined;
+}

package/dist-client/editors/entity-selector.js

@@ -0,0 +1,305 @@
+import { __decorate, __metadata } from "tslib";
+import '@operato/data-grist';
+import gql from 'graphql-tag';
+import { css, html, LitElement } from 'lit';
+import { customElement, property, query } from 'lit/decorators.js';
+import { DataGrist } from '@operato/data-grist/ox-grist.js';
+import { buildArgs, client } from '@operato/graphql';
+import { i18next } from '@operato/i18n';
+import { isMobileDevice } from '@operato/utils';
+import { MultiColumnFormStyles } from '@things-factory/form-ui';
+let EntitySelector = class EntitySelector extends LitElement {
+    render() {
+        return html `
+      <search-form
+        id="search-form"
+        @keypress="${async (e) => {
+            if (e.keyCode === 13) {
+                this.data = await this.grist.fetch();
+            }
+        }}"
+        @submit="${async (e) => (this.data = await this.grist.fetch())}"
+        .fields="${this.searchFields}"
+      ></search-form>
+
+      <ox-grist
+        .mode=${isMobileDevice() ? 'LIST' : 'GRID'}
+        .config=${this.config}
+        .data=${this.data}
+        .fetchHandler="${this.fetchHandler.bind(this)}"
+      ></ox-grist>
+
+      <div class="button-container">
+        <mwc-button @click=${this.onCancel.bind(this)}>${i18next.t('button.cancel')}</mwc-button>
+        <mwc-button @click=${this.onConfirm.bind(this)}>${i18next.t('button.confirm')}</mwc-button>
+      </div>
+    `;
+    }
+    onCancel() {
+        history.back();
+    }
+    onConfirm() {
+        this.dispatchEvent(new CustomEvent('entity-selected', {
+            detail: {
+                entity: this.selected
+            }
+        }));
+    }
+    async fetchHandler({ page, limit, sorters = [] }) {
+        const response = await client.query({
+            query: gql `
+        query {
+          ${this.queryName} (${buildArgs(await this._buildConditions(page, limit, sorters))}) {
+            ${this.getSelectFields()}
+          }
+        }
+      `
+        });
+        if (!response.errors) {
+            const records = response.data[this.queryName].items.map(item => {
+                if (this.value === item.id) {
+                    this.selectedRecords = [item];
+                    item['__selected__'] = true;
+                }
+                return item;
+            });
+            const total = response.data[this.queryName].total;
+            return {
+                records,
+                total,
+                limit,
+                page
+            };
+        }
+    }
+    async firstUpdated() {
+        this.config = {
+            columns: [
+                {
+                    type: 'gutter',
+                    gutterName: 'sequence'
+                },
+                {
+                    type: 'gutter',
+                    gutterName: 'row-selector',
+                    multiple: false
+                }
+            ],
+            rows: {
+                selectable: {
+                    multiple: false
+                },
+                handlers: {
+                    click: 'select-row',
+                    dblclick: (columns, data, column, record, rowIndex, field) => {
+                        this.onConfirm();
+                    }
+                },
+                appendable: false
+            }
+        };
+        if (this.select && this.select.length > 0) {
+            let _searchFields = this.select.filter(selectField => !selectField.hidden);
+            if (this.list && this.list.fields && this.list.fields.length > 0) {
+                _searchFields = _searchFields.filter(searchField => this.list.fields.indexOf(searchField.name) >= 0);
+            }
+            else {
+                _searchFields = _searchFields.slice(0, 4);
+            }
+            this.searchFields = _searchFields.map(selectField => {
+                const fieldType = (selectField.type && selectField.type.toLowerCase()) || 'string';
+                const numberTypes = ['integer', 'float'];
+                return {
+                    label: selectField.header || i18next.t(`field.${selectField.name}`),
+                    name: selectField.name,
+                    type: fieldType === 'string'
+                        ? 'text'
+                        : numberTypes.indexOf(fieldType) >= 0
+                            ? 'number'
+                            : fieldType === 'boolean'
+                                ? 'checkbox'
+                                : fieldType,
+                    queryName: selectField.queryName,
+                    props: fieldType === 'string'
+                        ? { searchOper: 'i_like' }
+                        : fieldType === 'object'
+                            ? { searchOper: 'in' }
+                            : { searchOper: 'eq' },
+                    attrs: fieldType === 'boolean' ? ['indeterminated'] : []
+                };
+            });
+            this.config = Object.assign(Object.assign({}, this.config), { columns: [
+                    ...this.config.columns,
+                    ...this.select.map(selectField => {
+                        return Object.assign(Object.assign({}, selectField), { type: selectField.type || 'string', width: selectField.width || 160, header: selectField.header || i18next.t(`field.${selectField.name}`) });
+                    })
+                ] });
+        }
+        else {
+            this.searchFields = [
+                {
+                    label: i18next.t('field.name'),
+                    name: 'name',
+                    type: 'text',
+                    props: { searchOper: 'i_like' }
+                },
+                {
+                    label: i18next.t('field.description'),
+                    name: 'description',
+                    type: 'text',
+                    props: { searchOper: 'i_like' }
+                }
+            ];
+            this.config = Object.assign(Object.assign({}, this.config), { columns: [
+                    ...this.config.columns,
+                    {
+                        type: 'string',
+                        name: 'id',
+                        header: i18next.t('field.id'),
+                        hidden: true
+                    },
+                    {
+                        type: 'string',
+                        name: 'name',
+                        header: i18next.t('field.name'),
+                        record: {
+                            align: 'left'
+                        },
+                        sortable: true,
+                        width: 160
+                    },
+                    {
+                        type: 'string',
+                        name: 'description',
+                        header: i18next.t('field.description'),
+                        record: {
+                            align: 'left'
+                        },
+                        sortable: true,
+                        width: 300
+                    }
+                ] });
+        }
+        this.config = Object.assign(Object.assign({}, this.config), { list: Object.assign(Object.assign({}, this.list), { fields: this.list && this.list.fields && this.list.fields.length > 0
+                    ? this.list.fields
+                    : this.config.columns
+                        .filter(column => column.type !== 'gutter')
+                        .slice(0, 3)
+                        .map(column => column.name) }) });
+        await this.updateComplete;
+        this.grist && this.grist.focus();
+    }
+    getSelectFields() {
+        if (this.select && this.select.length > 0) {
+            return `items {
+        ${this.select.map(selectField => {
+                return selectField.type === 'object'
+                    ? `${selectField.name} { ${selectField.subFields && selectField.subFields.length > 0
+                        ? selectField.subFields.join(' ')
+                        : `id name description`} }`
+                    : `${selectField.name}`;
+            })}
+      }
+      total`;
+        }
+        else {
+            return `
+        items {
+          id
+          name
+          description
+        }
+        total
+      `;
+        }
+    }
+    async _buildConditions(page, limit, sorters) {
+        const queryConditions = Object.assign({ filters: [] }, this.basicArgs);
+        queryConditions.filters = [...queryConditions.filters, ...(await this.searchForm.getQueryFilters())];
+        queryConditions.pagination = { page, limit };
+        queryConditions.sortings = sorters;
+        return queryConditions;
+    }
+    get selected() {
+        var selected = this.grist.selected;
+        return selected && selected.length > 0 ? selected[0] : undefined;
+    }
+};
+EntitySelector.styles = [
+    MultiColumnFormStyles,
+    css `
+      :host {
+        display: flex;
+        flex-direction: column;
+
+        background-color: #fff;
+      }
+
+      ox-grist {
+        flex: 1;
+      }
+
+      .button-container {
+        display: flex;
+        margin-left: auto;
+      }
+
+      form {
+        position: relative;
+      }
+
+      [search] {
+        position: absolute;
+        right: 0;
+      }
+    `
+];
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", String)
+], EntitySelector.prototype, "value", void 0);
+__decorate([
+    property({ type: Array }),
+    __metadata("design:type", Object)
+], EntitySelector.prototype, "searchFields", void 0);
+__decorate([
+    property({ type: Object }),
+    __metadata("design:type", Object)
+], EntitySelector.prototype, "config", void 0);
+__decorate([
+    property({ type: Object }),
+    __metadata("design:type", Object)
+], EntitySelector.prototype, "data", void 0);
+__decorate([
+    property({ type: String }),
+    __metadata("design:type", String)
+], EntitySelector.prototype, "queryName", void 0);
+__decorate([
+    property({ type: Array }),
+    __metadata("design:type", Object)
+], EntitySelector.prototype, "select", void 0);
+__decorate([
+    property({ type: Object }),
+    __metadata("design:type", Object)
+], EntitySelector.prototype, "list", void 0);
+__decorate([
+    property({ type: Object }),
+    __metadata("design:type", Object)
+], EntitySelector.prototype, "basicArgs", void 0);
+__decorate([
+    property({ type: Array }),
+    __metadata("design:type", Object)
+], EntitySelector.prototype, "selectedRecords", void 0);
+__decorate([
+    query('ox-grist'),
+    __metadata("design:type", DataGrist)
+], EntitySelector.prototype, "grist", void 0);
+__decorate([
+    query('search-form'),
+    __metadata("design:type", HTMLFormElement)
+], EntitySelector.prototype, "searchForm", void 0);
+EntitySelector = __decorate([
+    customElement('entity-selector')
+], EntitySelector);
+export { EntitySelector };
+//# sourceMappingURL=entity-selector.js.map

package/dist-client/editors/entity-selector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"entity-selector.js","sourceRoot":"","sources":["../../client/editors/entity-selector.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/data-grist'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { DataGrist } from '@operato/data-grist/ox-grist.js'\nimport { buildArgs, client } from '@operato/graphql'\nimport { i18next } from '@operato/i18n'\nimport { isMobileDevice } from '@operato/utils'\nimport { MultiColumnFormStyles } from '@things-factory/form-ui'\n\n@customElement('entity-selector')\nexport class EntitySelector extends LitElement {\n  static styles = [\n    MultiColumnFormStyles,\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n\n        background-color: #fff;\n      }\n\n      ox-grist {\n        flex: 1;\n      }\n\n      .button-container {\n        display: flex;\n        margin-left: auto;\n      }\n\n      form {\n        position: relative;\n      }\n\n      [search] {\n        position: absolute;\n        right: 0;\n      }\n    `\n  ]\n\n  @property({ type: String }) value?: string\n  @property({ type: Array }) searchFields: any\n  @property({ type: Object }) config: any\n  @property({ type: Object }) data: any\n  @property({ type: String }) queryName!: string\n  @property({ type: Array }) select: any\n  @property({ type: Object }) list: any\n  @property({ type: Object }) basicArgs: any\n  @property({ type: Array }) selectedRecords: any\n\n  @query('ox-grist') grist!: DataGrist\n  @query('search-form') searchForm!: HTMLFormElement\n\n  render() {\n    return html`\n      <search-form\n        id=\"search-form\"\n        @keypress=\"${async e => {\n          if (e.keyCode === 13) {\n            this.data = await this.grist.fetch()\n          }\n        }}\"\n        @submit=\"${async e => (this.data = await this.grist.fetch())}\"\n        .fields=\"${this.searchFields}\"\n      ></search-form>\n\n      <ox-grist\n        .mode=${isMobileDevice() ? 'LIST' : 'GRID'}\n        .config=${this.config}\n        .data=${this.data}\n        .fetchHandler=\"${this.fetchHandler.bind(this)}\"\n      ></ox-grist>\n\n      <div class=\"button-container\">\n        <mwc-button @click=${this.onCancel.bind(this)}>${i18next.t('button.cancel')}</mwc-button>\n        <mwc-button @click=${this.onConfirm.bind(this)}>${i18next.t('button.confirm')}</mwc-button>\n      </div>\n    `\n  }\n\n  onCancel() {\n    history.back()\n  }\n\n  onConfirm() {\n    this.dispatchEvent(\n      new CustomEvent('entity-selected', {\n        detail: {\n          entity: this.selected\n        }\n      })\n    )\n  }\n\n  async fetchHandler({ page, limit, sorters = [] }) {\n    const response = await client.query({\n      query: gql`\n        query {\n          ${this.queryName} (${buildArgs(await this._buildConditions(page, limit, sorters))}) {\n            ${this.getSelectFields()}\n          }\n        }\n      `\n    })\n\n    if (!response.errors) {\n      const records = response.data[this.queryName].items.map(item => {\n        if (this.value === item.id) {\n          this.selectedRecords = [item]\n          item['__selected__'] = true\n        }\n\n        return item\n      })\n      const total = response.data[this.queryName].total\n\n      return {\n        records,\n        total,\n        limit,\n        page\n      }\n    }\n  }\n\n  async firstUpdated() {\n    this.config = {\n      columns: [\n        {\n          type: 'gutter',\n          gutterName: 'sequence'\n        },\n        {\n          type: 'gutter',\n          gutterName: 'row-selector',\n          multiple: false\n        }\n      ],\n      rows: {\n        selectable: {\n          multiple: false\n        },\n        handlers: {\n          click: 'select-row',\n          dblclick: (columns, data, column, record, rowIndex, field) => {\n            this.onConfirm()\n          }\n        },\n        appendable: false\n      }\n    }\n\n    if (this.select && this.select.length > 0) {\n      let _searchFields = this.select.filter(selectField => !selectField.hidden)\n      if (this.list && this.list.fields && this.list.fields.length > 0) {\n        _searchFields = _searchFields.filter(searchField => this.list.fields.indexOf(searchField.name) >= 0)\n      } else {\n        _searchFields = _searchFields.slice(0, 4)\n      }\n\n      this.searchFields = _searchFields.map(selectField => {\n        const fieldType = (selectField.type && selectField.type.toLowerCase()) || 'string'\n        const numberTypes = ['integer', 'float']\n        return {\n          label: selectField.header || i18next.t(`field.${selectField.name}`),\n          name: selectField.name,\n          type:\n            fieldType === 'string'\n              ? 'text'\n              : numberTypes.indexOf(fieldType) >= 0\n              ? 'number'\n              : fieldType === 'boolean'\n              ? 'checkbox'\n              : fieldType,\n          queryName: selectField.queryName,\n          props:\n            fieldType === 'string'\n              ? { searchOper: 'i_like' }\n              : fieldType === 'object'\n              ? { searchOper: 'in' }\n              : { searchOper: 'eq' },\n          attrs: fieldType === 'boolean' ? ['indeterminated'] : []\n        }\n      })\n      this.config = {\n        ...this.config,\n        columns: [\n          ...this.config.columns,\n          ...this.select.map(selectField => {\n            return {\n              ...selectField,\n              type: selectField.type || 'string',\n              width: selectField.width || 160,\n              header: selectField.header || i18next.t(`field.${selectField.name}`)\n            }\n          })\n        ]\n      }\n    } else {\n      this.searchFields = [\n        {\n          label: i18next.t('field.name'),\n          name: 'name',\n          type: 'text',\n          props: { searchOper: 'i_like' }\n        },\n        {\n          label: i18next.t('field.description'),\n          name: 'description',\n          type: 'text',\n          props: { searchOper: 'i_like' }\n        }\n      ]\n\n      this.config = {\n        ...this.config,\n        columns: [\n          ...this.config.columns,\n          {\n            type: 'string',\n            name: 'id',\n            header: i18next.t('field.id'),\n            hidden: true\n          },\n          {\n            type: 'string',\n            name: 'name',\n            header: i18next.t('field.name'),\n            record: {\n              align: 'left'\n            },\n            sortable: true,\n            width: 160\n          },\n          {\n            type: 'string',\n            name: 'description',\n            header: i18next.t('field.description'),\n            record: {\n              align: 'left'\n            },\n            sortable: true,\n            width: 300\n          }\n        ]\n      }\n    }\n\n    this.config = {\n      ...this.config,\n      list: {\n        ...this.list,\n        fields:\n          this.list && this.list.fields && this.list.fields.length > 0\n            ? this.list.fields\n            : this.config.columns\n                .filter(column => column.type !== 'gutter')\n                .slice(0, 3)\n                .map(column => column.name)\n      }\n    }\n\n    await this.updateComplete\n    this.grist && this.grist.focus()\n  }\n\n  getSelectFields() {\n    if (this.select && this.select.length > 0) {\n      return `items {\n        ${this.select.map(selectField => {\n          return selectField.type === 'object'\n            ? `${selectField.name} { ${\n                selectField.subFields && selectField.subFields.length > 0\n                  ? selectField.subFields.join(' ')\n                  : `id name description`\n              } }`\n            : `${selectField.name}`\n        })}\n      }\n      total`\n    } else {\n      return `\n        items {\n          id\n          name\n          description\n        }\n        total\n      `\n    }\n  }\n\n  async _buildConditions(page, limit, sorters) {\n    const queryConditions = {\n      filters: [],\n      ...this.basicArgs\n    }\n\n    queryConditions.filters = [...queryConditions.filters, ...(await this.searchForm.getQueryFilters())]\n    queryConditions.pagination = { page, limit }\n    queryConditions.sortings = sorters\n    return queryConditions\n  }\n\n  get selected() {\n    var selected = this.grist.selected\n\n    return selected && selected.length > 0 ? selected[0] : undefined\n  }\n}\n"]}

package/dist-client/editors/property-editor.d.ts

@@ -0,0 +1,20 @@
+import './things-editor-http-headers';
+import './things-editor-http-parameters';
+import './things-editor-http-body';
+import { OxPropertyEditor } from '@operato/property-editor';
+export declare class PropertyEditorScenarioStepInput extends OxPropertyEditor {
+    static get styles(): import("lit").CSSResult[];
+    editorTemplate(value: any, spec: any): import("lit-html").TemplateResult<1>;
+}
+export declare class PropertyEditorHttpHeaders extends OxPropertyEditor {
+    static get styles(): import("lit").CSSResult[];
+    editorTemplate(value: any, spec: any): import("lit-html").TemplateResult<1>;
+}
+export declare class PropertyEditorHttpParameters extends OxPropertyEditor {
+    static get styles(): import("lit").CSSResult[];
+    editorTemplate(value: any, spec: any): import("lit-html").TemplateResult<1>;
+}
+export declare class PropertyEditorHttpBody extends OxPropertyEditor {
+    static get styles(): import("lit").CSSResult[];
+    editorTemplate(value: any, spec: any): import("lit-html").TemplateResult<1>;
+}