@operato/form 2.0.0-alpha.0 → 2.0.0-alpha.103

package/CHANGELOG.md

@@ -3,6 +3,170 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.0.0-alpha.103](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.102...v2.0.0-alpha.103) (2024-04-26)
+
+
+### :bug: Bug Fix
+
+* ox-filter-form과 ox-search-form에서 필터들간에 연관 기능 지원 ([bc081f8](https://github.com/hatiolab/operato/commit/bc081f8dfbb303f8aa219f0b776aa0cc4b18e9cd))
+
+
+
+## [2.0.0-alpha.94](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.93...v2.0.0-alpha.94) (2024-04-20)
+
+
+### :bug: Bug Fix
+
+* support 'checkbox' type in ox-filters-form-base ([1ffe0e5](https://github.com/hatiolab/operato/commit/1ffe0e5fc16480240c8c5accf57d247bb3299867))
+
+
+
+## [2.0.0-alpha.92](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.91...v2.0.0-alpha.92) (2024-04-19)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [2.0.0-alpha.91](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.90...v2.0.0-alpha.91) (2024-04-19)
+
+
+### :bug: Bug Fix
+
+* style fix ([6d442cd](https://github.com/hatiolab/operato/commit/6d442cdc7a4c5da0803fe8e7fcc4c0ec1de45b3f))
+
+
+
+## [2.0.0-alpha.86](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.85...v2.0.0-alpha.86) (2024-04-16)
+
+
+### :bug: Bug Fix
+
+* tweak filters-form style ([79e1f68](https://github.com/hatiolab/operato/commit/79e1f68f224770c8ad97d87e3f79327743a3d84d))
+
+
+
+## [2.0.0-alpha.85](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.84...v2.0.0-alpha.85) (2024-04-16)
+
+
+### :bug: Bug Fix
+
+* tweak filters-form style ([6fb293d](https://github.com/hatiolab/operato/commit/6fb293d7d34ea7b01b3011264f554158beb62621))
+
+
+
+## [2.0.0-alpha.68](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.67...v2.0.0-alpha.68) (2024-04-13)
+
+
+### :bug: Bug Fix
+
+* mwc=>md for context ([2bc13f2](https://github.com/hatiolab/operato/commit/2bc13f285f257782f73e5d7b5d1ddd197df85393))
+
+
+
+## [2.0.0-alpha.57](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.56...v2.0.0-alpha.57) (2024-04-07)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [2.0.0-alpha.51](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.50...v2.0.0-alpha.51) (2024-03-29)
+
+
+### :bug: Bug Fix
+
+* upgrade lit ([e661c33](https://github.com/hatiolab/operato/commit/e661c333d2bb97f784b5ac2c0e365714ee5e80ff))
+
+
+
+## [2.0.0-alpha.47](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.46...v2.0.0-alpha.47) (2024-03-27)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [2.0.0-alpha.44](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.43...v2.0.0-alpha.44) (2024-03-24)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [2.0.0-alpha.43](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.42...v2.0.0-alpha.43) (2024-03-24)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [2.0.0-alpha.35](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.34...v2.0.0-alpha.35) (2024-03-13)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
+## [2.0.0-alpha.28](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.27...v2.0.0-alpha.28) (2024-02-20)
+
+
+### :bug: Bug Fix
+
+* upgrade devDependencies for webcomponents ([1489b8b](https://github.com/hatiolab/operato/commit/1489b8b790d9bcee779a070a630697f25c01728f))
+
+
+
+## [2.0.0-alpha.25](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.24...v2.0.0-alpha.25) (2024-02-12)
+
+
+### :bug: Bug Fix
+
+* ox-filters-form-base for @operato/form ([1d2026d](https://github.com/hatiolab/operato/commit/1d2026d238a3ecf6198bd9cad9a54629e5ddf9fb))
+
+
+
+## [2.0.0-alpha.24](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.23...v2.0.0-alpha.24) (2024-02-11)
+
+
+### :bug: Bug Fix
+
+* ox-filters-form-base for @operato/form ([fd0ec03](https://github.com/hatiolab/operato/commit/fd0ec033585ce0fe46f24276db91238abbbfdc05))
+
+
+
+## [2.0.0-alpha.23](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.22...v2.0.0-alpha.23) (2024-02-10)
+
+
+### :bug: Bug Fix
+
+* time-calculator relativeDate(s) => relativeDays ([1ad965e](https://github.com/hatiolab/operato/commit/1ad965e59232bdfe5d90938b95e1085a5e28a527))
+
+
+
+## [2.0.0-alpha.22](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.21...v2.0.0-alpha.22) (2024-02-10)
+
+
+### :bug: Bug Fix
+
+* add time-calculator module for data-grist and form ([4d26d22](https://github.com/hatiolab/operato/commit/4d26d22b89e2c34cffe15eb0cc8520962644e8a1))
+
+
+
+## [2.0.0-alpha.8](https://github.com/hatiolab/operato/compare/v2.0.0-alpha.7...v2.0.0-alpha.8) (2024-01-20)
+
+**Note:** Version bump only for package @operato/form
+
+
+
+
+
 ## [2.0.0-alpha.0](https://github.com/hatiolab/operato/compare/v1.13.1...v2.0.0-alpha.0) (2024-01-05)
 
 **Note:** Version bump only for package @operato/form

package/demo/index.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en-GB">
   <head>
     <meta charset="utf-8" />
@@ -18,7 +18,18 @@
       }
     </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="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
+      rel="stylesheet"
+    />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
+      rel="stylesheet"
+    />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
+      rel="stylesheet"
+    />
 
     <link href="/themes/app-theme.css" rel="stylesheet" />
     <link href="/themes/form-theme.css" rel="stylesheet" />
@@ -28,7 +39,7 @@
 
     <script type="module">
       import { html, render } from 'lit'
-      import '@material/mwc-icon'
+      import '@material/web/icon/icon.js'
       import '../dist/src/filters/ox-filters-form-base.js'
 
       const form = document.querySelector('#demo')

package/dist/src/components/ox-custom-input.d.ts

@@ -10,7 +10,7 @@ export declare class CustomInput extends LitElement {
     value: any;
     autofocus: boolean;
     input: HTMLInputElement;
-    render(): import("lit").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1>;
     get checked(): boolean;
     set checked(checked: boolean);
     firstUpdated(): void;

package/dist/src/components/ox-custom-select.d.ts

@@ -11,7 +11,7 @@ export declare class CustomSelect extends LitElement {
     value: any;
     autofocus: boolean;
     select: HTMLInputElement;
-    render(): import("lit").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1>;
     firstUpdated(): void;
     updated(changes: PropertyValues<this>): void;
     _isObject(v: any): boolean;

package/dist/src/components/ox-file-uploader.d.ts

@@ -6,7 +6,7 @@ export declare class FileUploader extends LitElement {
     label?: string;
     _files: File[];
     fileInput: HTMLInputElement;
-    render(): import("lit").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1>;
     firstUpdated(): void;
     get files(): File[];
     reset(): void;

package/dist/src/components/ox-file-uploader.js

@@ -12,7 +12,7 @@ let FileUploader = class FileUploader extends LitElement {
     render() {
         var _a;
         return html `
-      <mwc-icon>post_add</mwc-icon>
+      <md-icon>post_add</md-icon>
       <span>add file or drop files here!</span>
       <input
         id="input-file"
@@ -53,12 +53,12 @@ let FileUploader = class FileUploader extends LitElement {
             ${this._files.map(file => html `
                 <li>
                   - ${file.name}
-                  <mwc-icon
+                  <md-icon
                     @click=${(e) => {
                 this._files.splice(this._files.indexOf(file), 1);
                 this.requestUpdate();
             }}
-                    >delete_outline</mwc-icon
+                    >delete_outline</md-icon
                   >
                 </li>
               `)}
@@ -96,7 +96,7 @@ FileUploader.styles = [
         font: var(--file-uploader-font) !important;
         color: var(--file-uploader-color);
       }
-      :host > mwc-icon {
+      :host > md-icon {
         color: var(--file-uploader-icon-color);
       }
 
@@ -132,14 +132,14 @@ FileUploader.styles = [
         padding: var(--file-uploader-li-padding);
         border-bottom: var(--file-uploader-li-border-bottom);
       }
-      li mwc-icon {
+      li md-icon {
         float: right;
         cursor: pointer;
         font: var(--file-uploader-li-icon-font);
         margin: var(--file-uploader-li-icon-margin);
       }
-      li mwc-icon:hover,
-      li mwc-icon:active {
+      li md-icon:hover,
+      li md-icon:active {
         color: var(--file-uploader-li-icon-focus-color);
       }
     `

package/dist/src/components/ox-file-uploader.js.map

@@ -1 +1 @@
-{"version":3,"file":"ox-file-uploader.js","sourceRoot":"","sources":["../../../src/components/ox-file-uploader.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { FileDropHelper } from '@operato/utils'\n\n@customElement('ox-file-uploader')\nexport class FileUploader extends LitElement {\n  static styles = [\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n        border-radius: var(--border-radius);\n        text-align: center;\n        padding-bottom: 5px !important;\n        text-transform: capitalize;\n\n        border: var(--file-uploader-border);\n        background-color: var(--main-section-background-color);\n        font: var(--file-uploader-font) !important;\n        color: var(--file-uploader-color);\n      }\n      :host > mwc-icon {\n        color: var(--file-uploader-icon-color);\n      }\n\n      :host(.candrop) {\n        background-color: var(--file-uploader-candrop-background-color);\n      }\n\n      #input-file {\n        display: none;\n      }\n\n      label {\n        position: relative;\n        width: auto;\n        border: none;\n        text-transform: capitalize;\n\n        padding: var(--file-uploader-label-padding);\n        border-radius: var(--file-uploader-label-border-radius);\n        background-color: var(--file-uploader-label-background-color);\n        color: var(--file-uploader-label-color);\n        font: var(--file-uploader-label-font) !important;\n      }\n\n      ul {\n        max-width: 500px;\n        list-style: none;\n        padding: 0;\n      }\n      li {\n        text-align: left;\n\n        padding: var(--file-uploader-li-padding);\n        border-bottom: var(--file-uploader-li-border-bottom);\n      }\n      li mwc-icon {\n        float: right;\n        cursor: pointer;\n        font: var(--file-uploader-li-icon-font);\n        margin: var(--file-uploader-li-icon-margin);\n      }\n      li mwc-icon:hover,\n      li mwc-icon:active {\n        color: var(--file-uploader-li-icon-focus-color);\n      }\n    `\n  ]\n\n  @property({ type: Boolean }) multiple: boolean = false\n  @property({ type: String }) accept: string = '*/*'\n  @property({ type: String }) label?: string\n\n  @property({ type: Array }) _files: File[] = []\n\n  @query('#input-file') fileInput!: HTMLInputElement\n\n  render() {\n    return html`\n      <mwc-icon>post_add</mwc-icon>\n      <span>add file or drop files here!</span>\n      <input\n        id=\"input-file\"\n        type=\"file\"\n        accept=${this.accept}\n        ?multiple=${this.multiple}\n        hidden\n        @change=${(e: Event) => {\n          const fileInput = e.currentTarget as HTMLInputElement\n          const files = fileInput.files as FileList\n          //// Temporary Validation preventing file size more than 10mb to be uploaded\n          for (let index = 0; index < files.length; index++) {\n            if (files[index].size > 9999999) {\n              document.dispatchEvent(\n                new CustomEvent('notify', {\n                  detail: {\n                    type: 'error',\n                    message: 'File size must be less than 10 MB.'\n                  }\n                })\n              )\n              throw new Error('File size must be less than 10 MB.')\n            }\n          }\n\n          this._files = [...this._files, ...Array.from(files)]\n\n          this.dispatchEvent(\n            new CustomEvent('files-change', {\n              bubbles: true,\n              composed: true,\n              detail: {\n                files: files\n              }\n            })\n          )\n\n          fileInput.value = ''\n        }}\n      />\n      <label for=\"input-file\">${this.label || 'select file'}</label>\n\n      ${this._files?.length\n        ? html` <ul>\n            ${this._files.map(\n              file => html`\n                <li>\n                  - ${file.name}\n                  <mwc-icon\n                    @click=${(e: Event) => {\n                      this._files.splice(this._files.indexOf(file), 1)\n                      this.requestUpdate()\n                    }}\n                    >delete_outline</mwc-icon\n                  >\n                </li>\n              `\n            )}\n          </ul>`\n        : ''}\n    `\n  }\n\n  firstUpdated() {\n    FileDropHelper.set(this)\n\n    this.addEventListener('file-drop', (e: Event) => {\n      const de = e as any\n      this._files = this.multiple ? de.detail : de.detail[0] ? [de.detail[0]] : []\n    })\n  }\n\n  get files() {\n    return this._files\n  }\n\n  reset() {\n    this.fileInput.value = ''\n    this._files = []\n  }\n}\n"]}
+{"version":3,"file":"ox-file-uploader.js","sourceRoot":"","sources":["../../../src/components/ox-file-uploader.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { FileDropHelper } from '@operato/utils'\n\n@customElement('ox-file-uploader')\nexport class FileUploader extends LitElement {\n  static styles = [\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n        border-radius: var(--border-radius);\n        text-align: center;\n        padding-bottom: 5px !important;\n        text-transform: capitalize;\n\n        border: var(--file-uploader-border);\n        background-color: var(--main-section-background-color);\n        font: var(--file-uploader-font) !important;\n        color: var(--file-uploader-color);\n      }\n      :host > md-icon {\n        color: var(--file-uploader-icon-color);\n      }\n\n      :host(.candrop) {\n        background-color: var(--file-uploader-candrop-background-color);\n      }\n\n      #input-file {\n        display: none;\n      }\n\n      label {\n        position: relative;\n        width: auto;\n        border: none;\n        text-transform: capitalize;\n\n        padding: var(--file-uploader-label-padding);\n        border-radius: var(--file-uploader-label-border-radius);\n        background-color: var(--file-uploader-label-background-color);\n        color: var(--file-uploader-label-color);\n        font: var(--file-uploader-label-font) !important;\n      }\n\n      ul {\n        max-width: 500px;\n        list-style: none;\n        padding: 0;\n      }\n      li {\n        text-align: left;\n\n        padding: var(--file-uploader-li-padding);\n        border-bottom: var(--file-uploader-li-border-bottom);\n      }\n      li md-icon {\n        float: right;\n        cursor: pointer;\n        font: var(--file-uploader-li-icon-font);\n        margin: var(--file-uploader-li-icon-margin);\n      }\n      li md-icon:hover,\n      li md-icon:active {\n        color: var(--file-uploader-li-icon-focus-color);\n      }\n    `\n  ]\n\n  @property({ type: Boolean }) multiple: boolean = false\n  @property({ type: String }) accept: string = '*/*'\n  @property({ type: String }) label?: string\n\n  @property({ type: Array }) _files: File[] = []\n\n  @query('#input-file') fileInput!: HTMLInputElement\n\n  render() {\n    return html`\n      <md-icon>post_add</md-icon>\n      <span>add file or drop files here!</span>\n      <input\n        id=\"input-file\"\n        type=\"file\"\n        accept=${this.accept}\n        ?multiple=${this.multiple}\n        hidden\n        @change=${(e: Event) => {\n          const fileInput = e.currentTarget as HTMLInputElement\n          const files = fileInput.files as FileList\n          //// Temporary Validation preventing file size more than 10mb to be uploaded\n          for (let index = 0; index < files.length; index++) {\n            if (files[index].size > 9999999) {\n              document.dispatchEvent(\n                new CustomEvent('notify', {\n                  detail: {\n                    type: 'error',\n                    message: 'File size must be less than 10 MB.'\n                  }\n                })\n              )\n              throw new Error('File size must be less than 10 MB.')\n            }\n          }\n\n          this._files = [...this._files, ...Array.from(files)]\n\n          this.dispatchEvent(\n            new CustomEvent('files-change', {\n              bubbles: true,\n              composed: true,\n              detail: {\n                files: files\n              }\n            })\n          )\n\n          fileInput.value = ''\n        }}\n      />\n      <label for=\"input-file\">${this.label || 'select file'}</label>\n\n      ${this._files?.length\n        ? html` <ul>\n            ${this._files.map(\n              file => html`\n                <li>\n                  - ${file.name}\n                  <md-icon\n                    @click=${(e: Event) => {\n                      this._files.splice(this._files.indexOf(file), 1)\n                      this.requestUpdate()\n                    }}\n                    >delete_outline</md-icon\n                  >\n                </li>\n              `\n            )}\n          </ul>`\n        : ''}\n    `\n  }\n\n  firstUpdated() {\n    FileDropHelper.set(this)\n\n    this.addEventListener('file-drop', (e: Event) => {\n      const de = e as any\n      this._files = this.multiple ? de.detail : de.detail[0] ? [de.detail[0]] : []\n    })\n  }\n\n  get files() {\n    return this._files\n  }\n\n  reset() {\n    this.fileInput.value = ''\n    this._files = []\n  }\n}\n"]}

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

@@ -4,6 +4,6 @@ export declare class FormPaginator extends LitElement {
     pageCount: number;
     selectors: number[];
     currentPage: number;
-    render(): import("lit").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1>;
     updated(changes: PropertyValues<this>): void;
 }

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

@@ -1,31 +1,11 @@
-import '@material/mwc-icon';
+import '@material/web/icon/icon.js';
 import './ox-custom-input.js';
 import './ox-custom-select.js';
 import { LitElement, PropertyValues } from 'lit';
-export declare class SearchForm extends LitElement {
+import { SearchFormField } from '../types.js';
+export declare class OxSearchForm extends LitElement {
     static styles: import("lit").CSSResult[];
-    fields?: {
-        type: string;
-        hidden: boolean;
-        name: string;
-        id: string;
-        label: string;
-        placeholder: string;
-        value: any;
-        field: string;
-        queryName: string;
-        props: {
-            [prop: string]: string;
-        };
-        attrs: string[];
-        options: {
-            name: string;
-            value: string;
-        }[];
-        handlers: {
-            [event: string]: EventListener;
-        };
-    }[];
+    fields?: SearchFormField[];
     hideSearchButton: boolean;
     autofocus: boolean;
     form: HTMLFormElement;
@@ -34,7 +14,12 @@ export declare class SearchForm extends LitElement {
         field: string;
         _value: any;
     })[];
-    render(): import("lit").TemplateResult<1>;
+    private autoUpdateTargetsOnChange;
+    render(): import("lit-html").TemplateResult<1>;
+    renderSelect(field: SearchFormField): import("lit-html").TemplateResult<1>;
+    renderCheckbox(field: SearchFormField): import("lit-html").TemplateResult<1>;
+    renderObject(field: SearchFormField, autofocusConsumed: number): import("lit-html").TemplateResult<1>;
+    renderElse(field: SearchFormField, autofocusConsumed: number): import("lit-html").TemplateResult<1>;
     updated(changes: PropertyValues<this>): Promise<void>;
     _checkInputValidity(): void;
     get searchParams(): string;