@operato/form 1.0.0-beta.9 → 1.0.6

package/CHANGELOG.md

@@ -3,6 +3,410 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+### [1.0.6](https://github.com/hatiolab/operato/compare/v1.0.5...v1.0.6) (2022-07-31)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+### [1.0.5](https://github.com/hatiolab/operato/compare/v1.0.4...v1.0.5) (2022-07-31)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+### [1.0.4](https://github.com/hatiolab/operato/compare/v1.0.3...v1.0.4) (2022-07-31)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+### [1.0.3](https://github.com/hatiolab/operato/compare/v1.0.2...v1.0.3) (2022-07-31)
+
+
+### :bug: Bug Fix
+
+* exports types ([ff5dc11](https://github.com/hatiolab/operato/commit/ff5dc119acbbf5a93459115f3929ba4a6720f9bb))
+
+
+
+### [1.0.1](https://github.com/hatiolab/operato/compare/v1.0.0...v1.0.1) (2022-07-25)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0](https://github.com/hatiolab/operato/compare/v1.0.0-beta.51...v1.0.0) (2022-07-24)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.51](https://github.com/hatiolab/operato/compare/v1.0.0-beta.50...v1.0.0-beta.51) (2022-07-22)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.50](https://github.com/hatiolab/operato/compare/v1.0.0-beta.49...v1.0.0-beta.50) (2022-07-18)
+
+
+### :bug: Bug Fix
+
+* autofocus for ox-search-form ([a9d394b](https://github.com/hatiolab/operato/commit/a9d394b0d404ab7e71d943cad69decfa9a369a06))
+
+
+
+## [1.0.0-beta.49](https://github.com/hatiolab/operato/compare/v1.0.0-beta.48...v1.0.0-beta.49) (2022-07-17)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.48](https://github.com/hatiolab/operato/compare/v1.0.0-beta.47...v1.0.0-beta.48) (2022-07-17)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.47](https://github.com/hatiolab/operato/compare/v1.0.0-beta.46...v1.0.0-beta.47) (2022-07-15)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.46](https://github.com/hatiolab/operato/compare/v1.0.0-beta.45...v1.0.0-beta.46) (2022-07-11)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.45](https://github.com/hatiolab/operato/compare/v1.0.0-beta.44...v1.0.0-beta.45) (2022-07-09)
+
+
+### :bug: Bug Fix
+
+* upgrade dependencies ([4986392](https://github.com/hatiolab/operato/commit/4986392e64524b5602cc9a144def239e85524bee))
+
+
+
+## [1.0.0-beta.44](https://github.com/hatiolab/operato/compare/v1.0.0-beta.43...v1.0.0-beta.44) (2022-07-07)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.43](https://github.com/hatiolab/operato/compare/v1.0.0-beta.42...v1.0.0-beta.43) (2022-07-03)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.42](https://github.com/hatiolab/operato/compare/v1.0.0-beta.41...v1.0.0-beta.42) (2022-07-03)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.41](https://github.com/hatiolab/operato/compare/v1.0.0-beta.40...v1.0.0-beta.41) (2022-06-30)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.40](https://github.com/hatiolab/operato/compare/v1.0.0-beta.39...v1.0.0-beta.40) (2022-06-29)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.39](https://github.com/hatiolab/operato/compare/v1.0.0-beta.38...v1.0.0-beta.39) (2022-06-22)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.38](https://github.com/hatiolab/operato/compare/v1.0.0-beta.37...v1.0.0-beta.38) (2022-06-20)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.37](https://github.com/hatiolab/operato/compare/v1.0.0-beta.36...v1.0.0-beta.37) (2022-06-20)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.36](https://github.com/hatiolab/operato/compare/v1.0.0-beta.35...v1.0.0-beta.36) (2022-06-16)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.35](https://github.com/hatiolab/operato/compare/v1.0.0-beta.34...v1.0.0-beta.35) (2022-06-16)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.34](https://github.com/hatiolab/operato/compare/v1.0.0-beta.33...v1.0.0-beta.34) (2022-06-16)
+
+
+### :bug: Bug Fix
+
+* apply english-only option to filter-input ([aa81f5e](https://github.com/hatiolab/operato/commit/aa81f5ebfe2a332f93968a28c63d7947e2f7dce3))
+
+
+
+## [1.0.0-beta.33](https://github.com/hatiolab/operato/compare/v1.0.0-beta.32...v1.0.0-beta.33) (2022-06-16)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.32](https://github.com/hatiolab/operato/compare/v1.0.0-beta.31...v1.0.0-beta.32) (2022-06-15)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.31](https://github.com/hatiolab/operato/compare/v1.0.0-beta.30...v1.0.0-beta.31) (2022-06-15)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.30](https://github.com/hatiolab/operato/compare/v1.0.0-beta.29...v1.0.0-beta.30) (2022-06-13)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.29](https://github.com/hatiolab/operato/compare/v1.0.0-beta.28...v1.0.0-beta.29) (2022-06-10)
+
+
+### :rocket: New Features
+
+* support 'barcode' type for filters-form in data-grist ([79f8e84](https://github.com/hatiolab/operato/commit/79f8e84151537ee9b27351a75de2c6bdf8049c91))
+* support 'barcode' type for filters-form-base in form module ([799f374](https://github.com/hatiolab/operato/commit/799f37403e477a1050a9077bfe0311c8852f109c))
+
+
+
+## [1.0.0-beta.28](https://github.com/hatiolab/operato/compare/v1.0.0-beta.27...v1.0.0-beta.28) (2022-06-10)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.27](https://github.com/hatiolab/operato/compare/v1.0.0-beta.26...v1.0.0-beta.27) (2022-06-09)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.26](https://github.com/hatiolab/operato/compare/v1.0.0-beta.25...v1.0.0-beta.26) (2022-06-04)
+
+
+### :bug: Bug Fix
+
+* form, input style ([b94efe5](https://github.com/hatiolab/operato/commit/b94efe5bb844f2a410918d4a464c2a1e6530d4cd))
+
+
+
+## [1.0.0-beta.25](https://github.com/hatiolab/operato/compare/v1.0.0-beta.24...v1.0.0-beta.25) (2022-06-02)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.24](https://github.com/hatiolab/operato/compare/v1.0.0-beta.23...v1.0.0-beta.24) (2022-06-02)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.23](https://github.com/hatiolab/operato/compare/v1.0.0-beta.22...v1.0.0-beta.23) (2022-06-02)
+
+
+### :bug: Bug Fix
+
+* grid margin style ([2c19634](https://github.com/hatiolab/operato/commit/2c19634d97f4ad06e95c776b22b03a212af40b9a))
+
+
+
+## [1.0.0-beta.22](https://github.com/hatiolab/operato/compare/v1.0.0-beta.21...v1.0.0-beta.22) (2022-05-31)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.21](https://github.com/hatiolab/operato/compare/v1.0.0-beta.20...v1.0.0-beta.21) (2022-05-31)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.20](https://github.com/hatiolab/operato/compare/v1.0.0-beta.19...v1.0.0-beta.20) (2022-05-30)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.19](https://github.com/hatiolab/operato/compare/v1.0.0-beta.18...v1.0.0-beta.19) (2022-05-29)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.18](https://github.com/hatiolab/operato/compare/v1.0.0-beta.17...v1.0.0-beta.18) (2022-05-27)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.17](https://github.com/hatiolab/operato/compare/v1.0.0-beta.16...v1.0.0-beta.17) (2022-05-25)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.16](https://github.com/hatiolab/operato/compare/v1.0.0-beta.15...v1.0.0-beta.16) (2022-05-23)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.15](https://github.com/hatiolab/operato/compare/v1.0.0-beta.14...v1.0.0-beta.15) (2022-05-20)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.14](https://github.com/hatiolab/operato/compare/v1.0.0-beta.13...v1.0.0-beta.14) (2022-05-19)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [1.0.0-beta.13](https://github.com/hatiolab/operato/compare/v1.0.0-beta.12...v1.0.0-beta.13) (2022-05-19)
+
+
+### :bug: Bug Fix
+
+* incorrect package.json scripts for storybooks ([8c8c405](https://github.com/hatiolab/operato/commit/8c8c405443247108b9c411b8161c008d9b6a2261))
+* record-view ([ffcb397](https://github.com/hatiolab/operato/commit/ffcb397748efb64ce4e515f733b50f088ea1a093))
+* storybook for data-grist ([ae0ad52](https://github.com/hatiolab/operato/commit/ae0ad52d642454c70a4e27f262b8811f7e53f420))
+
+
+
+## [1.0.0-beta.12](https://github.com/hatiolab/operato/compare/v1.0.0-beta.11...v1.0.0-beta.12) (2022-05-13)
+
+
+### :rocket: New Features
+
+* storybook started ([90c08c9](https://github.com/hatiolab/operato/commit/90c08c9a15e5fe554baaa1becca07793e8434799))
+
+
+
+## [1.0.0-beta.11](https://github.com/hatiolab/operato/compare/v1.0.0-beta.10...v1.0.0-beta.11) (2022-05-01)
+
+
+### :rocket: New Features
+
+* separated filter-form from data-grist ([513a498](https://github.com/hatiolab/operato/commit/513a49830be87053568d69fb68f1544586c3345b))
+* separated filter-form from data-grist ([21e27f7](https://github.com/hatiolab/operato/commit/21e27f74d3e66d782da4aa75801c39a037627f62))
+
+
+### :bug: Bug Fix
+
+* export filters-form functions ([bb84681](https://github.com/hatiolab/operato/commit/bb84681e0c61af344a3756332be722ffafbcfb0b))
+* filters-form style ([e32b875](https://github.com/hatiolab/operato/commit/e32b8759dddad7be2b7f9dae0fd257064eb31043))
+
+
+
+## [1.0.0-beta.10](https://github.com/hatiolab/operato/compare/v1.0.0-beta.9...v1.0.0-beta.10) (2022-04-28)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
 ## [1.0.0-beta.9](https://github.com/hatiolab/operato/compare/v1.0.0-beta.8...v1.0.0-beta.9) (2022-04-28)
 
 **Note:** Version bump only for package @operato/form

package/demo/index.html

@@ -2,6 +2,8 @@
 <html lang="en-GB">
   <head>
     <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+
     <style>
       body {
         background: #fafafa;
@@ -17,6 +19,9 @@
     </style>
     <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
     <link href="https://fonts.googleapis.com/css?family=Material+Icons&display=block" rel="stylesheet" />
+
+    <link href="/themes/app-theme.css" rel="stylesheet" />
+    <link href="/themes/form-theme.css" rel="stylesheet" />
   </head>
   <body>
     <div id="demo"></div>
@@ -24,10 +29,71 @@
     <script type="module">
       import { html, render } from 'lit'
       import '@material/mwc-icon'
+      import '../dist/src/filters/ox-filters-form-base.js'
+
+      const form = document.querySelector('#demo')
 
-      const parent = document.querySelector('#demo')
+      const filters = [
+        {
+          name: 'test',
+          type: 'string',
+          label: 'name',
+          operator: 'eq'
+        },
+        {
+          name: 'active',
+          type: 'boolean',
+          label: 'active',
+          operator: 'eq'
+        },
+        {
+          name: 'sss',
+          type: 'select',
+          label: 'sss',
+          operator: 'eq',
+          options: () => {
+            return [
+              {
+                display: '',
+                value: ''
+              },
+              {
+                display: 'ABC',
+                value: 'ABC'
+              },
+              {
+                display: 'DEF',
+                value: 'DEF'
+              }
+            ]
+          }
+        },
+        {
+          name: 'range',
+          type: 'number',
+          label: 'range',
+          operator: 'between'
+        },
+        {
+          name: 'date-range',
+          type: 'datetime',
+          label: 'date',
+          operator: 'between'
+        }
+      ]
 
-      render(html``, parent)
+      render(
+        html`
+          <ox-filters-form-base
+            .filters=${filters}
+            @filters-change=${e => {
+              console.log('filters changed', e.detail)
+            }}
+            url-params-sensitive
+          ></ox-filters-form-base>
+        `,
+        form
+      )
     </script>
   </body>
 </html>

package/dist/src/components/ox-search-form.d.ts

@@ -27,7 +27,9 @@ export declare class SearchForm extends LitElement {
         };
     }[];
     hideSearchButton: boolean;
+    autofocus: boolean;
     form: HTMLFormElement;
+    autofocused?: HTMLInputElement;
     formFields: ((HTMLInputElement | HTMLSelectElement) & {
         field: string;
         _value: any;

package/dist/src/components/ox-search-form.js

@@ -2,17 +2,19 @@ import { __decorate } from "tslib";
 import '@material/mwc-icon';
 import './ox-custom-input.js';
 import './ox-custom-select.js';
-import { LitElement, css, html } from 'lit';
-import { buildArgs, client } from '@operato/graphql';
+import gql from 'graphql-tag';
+import { css, html, LitElement } from 'lit';
 import { customElement, property, query, queryAll } from 'lit/decorators.js';
+import { buildArgs, client } from '@operato/graphql';
 import { SearchFormStyles } from '../styles/search-form-styles.js';
-import gql from 'graphql-tag';
 let SearchForm = class SearchForm extends LitElement {
     constructor() {
         super(...arguments);
         this.hideSearchButton = false;
+        this.autofocus = false;
     }
     render() {
+        var autofocusConsumed = 0;
         return html `
       <form
         class="search-form"
@@ -76,6 +78,7 @@ let SearchForm = class SearchForm extends LitElement {
                     .field=${field.field}
                     .queryName=${field.queryName}
                     ?hidden=${field.hidden}
+                    ?autofocus=${!field.hidden && 0 === autofocusConsumed++}
                   />
                 `
                     : html `
@@ -84,8 +87,9 @@ let SearchForm = class SearchForm extends LitElement {
                     .type=${field.type}
                     .value=${field.value || ''}
                     .name=${field.name}
-                    ?hidden=${field.hidden}
                     .placeholder=${field.placeholder || ''}
+                    ?hidden=${field.hidden}
+                    ?autofocus=${!field.hidden && 0 === autofocusConsumed++}
                   />
                 `}
           `)}
@@ -96,6 +100,7 @@ let SearchForm = class SearchForm extends LitElement {
     `;
     }
     async updated(changes) {
+        var _a;
         if (changes.has('fields')) {
             this._checkInputValidity();
             var formFields = Array.from(this.formFields);
@@ -126,6 +131,10 @@ let SearchForm = class SearchForm extends LitElement {
                         }
                     }
                 });
+            if (this.autofocus) {
+                await this.requestUpdate();
+                (_a = this.autofocused) === null || _a === void 0 ? void 0 : _a.focus();
+            }
         }
     }
     _checkInputValidity() {
@@ -267,9 +276,15 @@ __decorate([
 __decorate([
     property({ type: Boolean })
 ], SearchForm.prototype, "hideSearchButton", void 0);
+__decorate([
+    property({ type: Boolean, attribute: true })
+], SearchForm.prototype, "autofocus", void 0);
 __decorate([
     query('form')
 ], SearchForm.prototype, "form", void 0);
+__decorate([
+    query('input[autofocus]')
+], SearchForm.prototype, "autofocused", void 0);
 __decorate([
     queryAll('input, select')
 ], SearchForm.prototype, "formFields", void 0);

package/dist/src/components/ox-search-form.js.map

@@ -1 +1 @@
-{"version":3,"file":"ox-search-form.js","sourceRoot":"","sources":["../../../src/components/ox-search-form.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/mwc-icon'\nimport './ox-custom-input.js'\nimport './ox-custom-select.js'\n\nimport { LitElement, PropertyValues, css, html } from 'lit'\nimport { buildArgs, client } from '@operato/graphql'\nimport { customElement, property, query, queryAll } from 'lit/decorators.js'\n\nimport { SearchFormStyles } from '../styles/search-form-styles.js'\nimport gql from 'graphql-tag'\n\n@customElement('ox-search-form')\nexport class SearchForm extends LitElement {\n  static styles = [\n    SearchFormStyles,\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n\n        position: relative;\n      }\n\n      ::placeholder {\n        text-transform: capitalize;\n        color: var(--theme-white-color);\n      }\n    `\n  ]\n\n  @property({ type: Array }) fields?: {\n    type: string\n    hidden: boolean\n    name: string\n    id: string\n    label: string\n    placeholder: string\n    value: any\n    field: string\n    queryName: string\n    props: { [prop: string]: string }\n    attrs: string[]\n    options: { name: string; value: string }[]\n    handlers: { [event: string]: EventListener }\n  }[]\n  @property({ type: Boolean }) hideSearchButton: boolean = false\n\n  @query('form') form!: HTMLFormElement\n  @queryAll('input, select') formFields!: ((HTMLInputElement | HTMLSelectElement) & { field: string; _value: any })[]\n\n  render() {\n    return html`\n      <form\n        class=\"search-form\"\n        @keypress=${(e: KeyboardEvent) => {\n          if (e.key === 'Enter') {\n            e.preventDefault()\n            this.submit()\n          }\n        }}\n      >\n        ${(this.fields || []).map(\n          field => html`\n            ${field.type === 'select'\n              ? html`\n                  <label ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>\n                  <select .value=${field.value} .name=${field.name} ?hidden=${field.hidden}>\n                    ${(field.options || []).map(\n                      (option: { name: string; value: string }) => html`\n                        <option ?selected=${option.value == field.value} value=${option.value}>${option.name}</option>\n                      `\n                    )}\n                  </select>\n                `\n              : field.type === 'checkbox'\n              ? html`\n                  <input\n                    id=\"ckbx_${field.name}\"\n                    type=\"checkbox\"\n                    ?checked=\"${field.value}\"\n                    .name=${field.name}\n                    ?hidden=${field.hidden}\n                    @click=${(e: MouseEvent) => {\n                      const checkbox = e.currentTarget as HTMLInputElement & { _value: any }\n                      if (checkbox.hasAttribute('indeterminate')) {\n                        const values = [undefined, 'on', 'off']\n                        const currentValue = checkbox._value\n                        const newValue =\n                          values.indexOf(currentValue) + 1 > values.length - 1\n                            ? values[0]\n                            : values[values.indexOf(currentValue) + 1]\n\n                        if (newValue === 'on') {\n                          checkbox.checked = true\n                        } else if (newValue === 'off') {\n                          checkbox.checked = false\n                        } else {\n                          checkbox.indeterminate = true\n                        }\n                        checkbox._value = newValue\n                      }\n                    }}\n                  />\n                  <label for=\"ckbx_${field.name}\" ?hidden=${field.hidden}\n                    >${field.label || field.name || field.id}</label\n                  >\n                `\n              : field.type === 'object'\n              ? html`\n                  <label ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>\n                  <input\n                    .type=${field.type}\n                    .value=${field.value || ''}\n                    .name=${field.name}\n                    .field=${field.field}\n                    .queryName=${field.queryName}\n                    ?hidden=${field.hidden}\n                  />\n                `\n              : html`\n                  <label ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>\n                  <input\n                    .type=${field.type}\n                    .value=${field.value || ''}\n                    .name=${field.name}\n                    ?hidden=${field.hidden}\n                    .placeholder=${field.placeholder || ''}\n                  />\n                `}\n          `\n        )}\n        ${this.hideSearchButton || false\n          ? ``\n          : html`<mwc-icon @click=${(e: MouseEvent) => this.submit()} search>search</mwc-icon>`}\n      </form>\n    `\n  }\n\n  async updated(changes: PropertyValues<this>) {\n    if (changes.has('fields')) {\n      this._checkInputValidity()\n\n      var formFields = Array.from(this.formFields)\n      this.fields &&\n        this.fields.forEach(field => {\n          var formField = formFields.find(f => f.name == field.name)\n          if (field.props instanceof Object && !Array.isArray(field.props)) {\n            for (let prop in field.props) {\n              if (field.props[prop]) {\n                formField!.setAttribute(prop, field.props[prop])\n              }\n            }\n          }\n\n          if (field.attrs && Array.isArray(field.attrs)) {\n            field.attrs.forEach(attr => {\n              if (attr === 'indeterminate') {\n                ;(formField as HTMLInputElement).indeterminate = true\n              } else {\n                formField!.setAttribute(attr, '')\n              }\n            })\n          }\n\n          if (field.handlers instanceof Object && !Array.isArray(field.handlers)) {\n            for (let eventName in field.handlers) {\n              formField!.addEventListener(eventName, field.handlers[eventName])\n            }\n          }\n        })\n    }\n  }\n\n  _checkInputValidity() {\n    const names = this.fields?.map(i => i.name) || []\n    const result = names.every(name => {\n      return names.indexOf(name) === names.lastIndexOf(name)\n    })\n    if (!result) {\n      throw new Error('Field name is duplicated.')\n    }\n  }\n\n  get searchParams() {\n    let searchParam = new URLSearchParams()\n    const fields = Array.from(this.formFields)\n    fields.forEach(field => searchParam.append(field.name, field.value))\n\n    return decodeURI(searchParam.toString())\n  }\n\n  get queryFilters() {\n    return Array.from(this.formFields)\n      .filter(\n        field =>\n          (field.type !== 'checkbox' && field.value && field.value !== '') ||\n          (field.type === 'checkbox' && !field.hasAttribute('indeterminate')) ||\n          (field.type === 'checkbox' && field.hasAttribute('indeterminate') && field._value)\n      )\n      .map(field => {\n        const operator = field.getAttribute('searchOper') || ''\n        let value = operator.indexOf('like') >= 0 ? `%${field.value}%` : field.value\n        return {\n          name: field.name,\n          value:\n            field.type === 'text'\n              ? value\n              : field.type === 'checkbox'\n              ? field.hasAttribute('indeterminate')\n                ? field._value === 'on'\n                  ? true\n                  : false\n                : (field as HTMLInputElement).checked\n              : field.type === 'number'\n              ? parseFloat(value)\n              : value,\n          operator\n        }\n      })\n  }\n\n  public async getQueryFilters() {\n    return await Promise.all(\n      Array.from(this.formFields)\n        .filter(\n          field =>\n            (field.type !== 'checkbox' && field.value && field.value !== '') ||\n            (field.type === 'checkbox' && !field.hasAttribute('indeterminate')) ||\n            (field.type === 'checkbox' && field.hasAttribute('indeterminate') && field._value)\n        )\n        .map(async field => {\n          const name = field.name\n          const operator = (field.type === 'text' && field.field ? 'in' : field.getAttribute('searchOper')) || ''\n          const value = operator.indexOf('like') >= 0 ? `%${field.value}%` : field.value\n          const filter = {\n            name,\n            operator,\n            value:\n              field.type === 'text' && field.getAttribute('type') === 'object'\n                ? await this._getResourceIds(field)\n                : field.type === 'text'\n                ? value\n                : field.type === 'checkbox'\n                ? field.hasAttribute('indeterminate')\n                  ? field._value === 'on'\n                    ? true\n                    : false\n                  : (field as HTMLInputElement).checked\n                : field.type === 'number'\n                ? parseFloat(value)\n                : value,\n            relation: field.type === 'text' && field.getAttribute('type') === 'object'\n          }\n          return filter\n        })\n    )\n  }\n\n  private async _getResourceIds(inputField: HTMLInputElement | HTMLSelectElement) {\n    const {\n      field = 'name',\n      value,\n      queryName\n    } = inputField as (HTMLInputElement | HTMLSelectElement) & { field: string; queryName: string }\n\n    const response = await client.query({\n      query: gql`\n        query {\n          fetch: ${queryName}(${buildArgs({\n        filters: [\n          {\n            name: field,\n            operator: 'i_like',\n            value: `%${value}%`\n          }\n        ]\n      })}) {\n            items {\n              id\n            }\n          }\n        }\n      `\n    })\n\n    if (!response.errors) {\n      const items = response.data.fetch.items as { id: string }[]\n      return (items && items.map(item => item.id)) || []\n    }\n  }\n\n  serialize() {\n    let data: { [name: string]: any } = {}\n\n    Array.from(this.formFields).forEach(field => {\n      const name = field.name\n      if (field.type === 'number') {\n        data[name] = parseFloat(field.value)\n      } else if (field.type === 'checkbox') {\n        data[name] = (field as HTMLInputElement).checked\n      } else {\n        data[name] = field.value\n      }\n    })\n\n    return data\n  }\n\n  submit() {\n    this.dispatchEvent(new CustomEvent('submit'))\n  }\n}\n"]}
+{"version":3,"file":"ox-search-form.js","sourceRoot":"","sources":["../../../src/components/ox-search-form.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/mwc-icon'\nimport './ox-custom-input.js'\nimport './ox-custom-select.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { customElement, property, query, queryAll } from 'lit/decorators.js'\n\nimport { buildArgs, client } from '@operato/graphql'\n\nimport { SearchFormStyles } from '../styles/search-form-styles.js'\n\n@customElement('ox-search-form')\nexport class SearchForm extends LitElement {\n  static styles = [\n    SearchFormStyles,\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n\n        position: relative;\n      }\n\n      ::placeholder {\n        text-transform: capitalize;\n        color: var(--theme-white-color);\n      }\n    `\n  ]\n\n  @property({ type: Array }) fields?: {\n    type: string\n    hidden: boolean\n    name: string\n    id: string\n    label: string\n    placeholder: string\n    value: any\n    field: string\n    queryName: string\n    props: { [prop: string]: string }\n    attrs: string[]\n    options: { name: string; value: string }[]\n    handlers: { [event: string]: EventListener }\n  }[]\n  @property({ type: Boolean }) hideSearchButton: boolean = false\n  @property({ type: Boolean, attribute: true }) autofocus: boolean = false\n\n  @query('form') form!: HTMLFormElement\n  @query('input[autofocus]') autofocused?: HTMLInputElement\n  @queryAll('input, select') formFields!: ((HTMLInputElement | HTMLSelectElement) & { field: string; _value: any })[]\n\n  render() {\n    var autofocusConsumed = 0\n\n    return html`\n      <form\n        class=\"search-form\"\n        @keypress=${(e: KeyboardEvent) => {\n          if (e.key === 'Enter') {\n            e.preventDefault()\n            this.submit()\n          }\n        }}\n      >\n        ${(this.fields || []).map(\n          field => html`\n            ${field.type === 'select'\n              ? html`\n                  <label ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>\n                  <select .value=${field.value} .name=${field.name} ?hidden=${field.hidden}>\n                    ${(field.options || []).map(\n                      (option: { name: string; value: string }) => html`\n                        <option ?selected=${option.value == field.value} value=${option.value}>${option.name}</option>\n                      `\n                    )}\n                  </select>\n                `\n              : field.type === 'checkbox'\n              ? html`\n                  <input\n                    id=\"ckbx_${field.name}\"\n                    type=\"checkbox\"\n                    ?checked=\"${field.value}\"\n                    .name=${field.name}\n                    ?hidden=${field.hidden}\n                    @click=${(e: MouseEvent) => {\n                      const checkbox = e.currentTarget as HTMLInputElement & { _value: any }\n                      if (checkbox.hasAttribute('indeterminate')) {\n                        const values = [undefined, 'on', 'off']\n                        const currentValue = checkbox._value\n                        const newValue =\n                          values.indexOf(currentValue) + 1 > values.length - 1\n                            ? values[0]\n                            : values[values.indexOf(currentValue) + 1]\n\n                        if (newValue === 'on') {\n                          checkbox.checked = true\n                        } else if (newValue === 'off') {\n                          checkbox.checked = false\n                        } else {\n                          checkbox.indeterminate = true\n                        }\n                        checkbox._value = newValue\n                      }\n                    }}\n                  />\n                  <label for=\"ckbx_${field.name}\" ?hidden=${field.hidden}\n                    >${field.label || field.name || field.id}</label\n                  >\n                `\n              : field.type === 'object'\n              ? html`\n                  <label ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>\n                  <input\n                    .type=${field.type}\n                    .value=${field.value || ''}\n                    .name=${field.name}\n                    .field=${field.field}\n                    .queryName=${field.queryName}\n                    ?hidden=${field.hidden}\n                    ?autofocus=${!field.hidden && 0 === autofocusConsumed++}\n                  />\n                `\n              : html`\n                  <label ?hidden=${field.hidden}>${field.label || field.name || field.id}</label>\n                  <input\n                    .type=${field.type}\n                    .value=${field.value || ''}\n                    .name=${field.name}\n                    .placeholder=${field.placeholder || ''}\n                    ?hidden=${field.hidden}\n                    ?autofocus=${!field.hidden && 0 === autofocusConsumed++}\n                  />\n                `}\n          `\n        )}\n        ${this.hideSearchButton || false\n          ? ``\n          : html`<mwc-icon @click=${(e: MouseEvent) => this.submit()} search>search</mwc-icon>`}\n      </form>\n    `\n  }\n\n  async updated(changes: PropertyValues<this>) {\n    if (changes.has('fields')) {\n      this._checkInputValidity()\n\n      var formFields = Array.from(this.formFields)\n      this.fields &&\n        this.fields.forEach(field => {\n          var formField = formFields.find(f => f.name == field.name)\n          if (field.props instanceof Object && !Array.isArray(field.props)) {\n            for (let prop in field.props) {\n              if (field.props[prop]) {\n                formField!.setAttribute(prop, field.props[prop])\n              }\n            }\n          }\n\n          if (field.attrs && Array.isArray(field.attrs)) {\n            field.attrs.forEach(attr => {\n              if (attr === 'indeterminate') {\n                ;(formField as HTMLInputElement).indeterminate = true\n              } else {\n                formField!.setAttribute(attr, '')\n              }\n            })\n          }\n\n          if (field.handlers instanceof Object && !Array.isArray(field.handlers)) {\n            for (let eventName in field.handlers) {\n              formField!.addEventListener(eventName, field.handlers[eventName])\n            }\n          }\n        })\n\n      if (this.autofocus) {\n        await this.requestUpdate()\n        this.autofocused?.focus()\n      }\n    }\n  }\n\n  _checkInputValidity() {\n    const names = this.fields?.map(i => i.name) || []\n    const result = names.every(name => {\n      return names.indexOf(name) === names.lastIndexOf(name)\n    })\n    if (!result) {\n      throw new Error('Field name is duplicated.')\n    }\n  }\n\n  get searchParams() {\n    let searchParam = new URLSearchParams()\n    const fields = Array.from(this.formFields)\n    fields.forEach(field => searchParam.append(field.name, field.value))\n\n    return decodeURI(searchParam.toString())\n  }\n\n  get queryFilters() {\n    return Array.from(this.formFields)\n      .filter(\n        field =>\n          (field.type !== 'checkbox' && field.value && field.value !== '') ||\n          (field.type === 'checkbox' && !field.hasAttribute('indeterminate')) ||\n          (field.type === 'checkbox' && field.hasAttribute('indeterminate') && field._value)\n      )\n      .map(field => {\n        const operator = field.getAttribute('searchOper') || ''\n        let value = operator.indexOf('like') >= 0 ? `%${field.value}%` : field.value\n        return {\n          name: field.name,\n          value:\n            field.type === 'text'\n              ? value\n              : field.type === 'checkbox'\n              ? field.hasAttribute('indeterminate')\n                ? field._value === 'on'\n                  ? true\n                  : false\n                : (field as HTMLInputElement).checked\n              : field.type === 'number'\n              ? parseFloat(value)\n              : value,\n          operator\n        }\n      })\n  }\n\n  public async getQueryFilters() {\n    return await Promise.all(\n      Array.from(this.formFields)\n        .filter(\n          field =>\n            (field.type !== 'checkbox' && field.value && field.value !== '') ||\n            (field.type === 'checkbox' && !field.hasAttribute('indeterminate')) ||\n            (field.type === 'checkbox' && field.hasAttribute('indeterminate') && field._value)\n        )\n        .map(async field => {\n          const name = field.name\n          const operator = (field.type === 'text' && field.field ? 'in' : field.getAttribute('searchOper')) || ''\n          const value = operator.indexOf('like') >= 0 ? `%${field.value}%` : field.value\n          const filter = {\n            name,\n            operator,\n            value:\n              field.type === 'text' && field.getAttribute('type') === 'object'\n                ? await this._getResourceIds(field)\n                : field.type === 'text'\n                ? value\n                : field.type === 'checkbox'\n                ? field.hasAttribute('indeterminate')\n                  ? field._value === 'on'\n                    ? true\n                    : false\n                  : (field as HTMLInputElement).checked\n                : field.type === 'number'\n                ? parseFloat(value)\n                : value,\n            relation: field.type === 'text' && field.getAttribute('type') === 'object'\n          }\n          return filter\n        })\n    )\n  }\n\n  private async _getResourceIds(inputField: HTMLInputElement | HTMLSelectElement) {\n    const {\n      field = 'name',\n      value,\n      queryName\n    } = inputField as (HTMLInputElement | HTMLSelectElement) & { field: string; queryName: string }\n\n    const response = await client.query({\n      query: gql`\n        query {\n          fetch: ${queryName}(${buildArgs({\n        filters: [\n          {\n            name: field,\n            operator: 'i_like',\n            value: `%${value}%`\n          }\n        ]\n      })}) {\n            items {\n              id\n            }\n          }\n        }\n      `\n    })\n\n    if (!response.errors) {\n      const items = response.data.fetch.items as { id: string }[]\n      return (items && items.map(item => item.id)) || []\n    }\n  }\n\n  serialize() {\n    let data: { [name: string]: any } = {}\n\n    Array.from(this.formFields).forEach(field => {\n      const name = field.name\n      if (field.type === 'number') {\n        data[name] = parseFloat(field.value)\n      } else if (field.type === 'checkbox') {\n        data[name] = (field as HTMLInputElement).checked\n      } else {\n        data[name] = field.value\n      }\n    })\n\n    return data\n  }\n\n  submit() {\n    this.dispatchEvent(new CustomEvent('submit'))\n  }\n}\n"]}