@operato/form 1.0.0-alpha.9 → 1.0.0-beta.10

package/package.json

@@ -3,7 +3,7 @@
   "description": "WebApplication form supporting components following open-wc recommendations",
   "license": "MIT",
   "author": "heartyoh",
-  "version": "1.0.0-alpha.9",
+  "version": "1.0.0-beta.10",
   "main": "dist/src/index.js",
   "module": "dist/src/index.js",
   "exports": {
@@ -37,9 +37,9 @@
   },
   "dependencies": {
     "@material/mwc-icon": "^0.25.3",
-    "@operato/graphql": "^1.0.0-alpha.9",
-    "@operato/utils": "^1.0.0-alpha.9",
-    "lit": "^2.2.0"
+    "@operato/graphql": "^1.0.0-beta.10",
+    "@operato/utils": "^1.0.0-beta.10",
+    "lit": "^2.2.1"
   },
   "devDependencies": {
     "@custom-elements-manifest/analyzer": "^0.4.17",
@@ -73,5 +73,5 @@
       "prettier --write"
     ]
   },
-  "gitHead": "fb82c87ab8b869139076c4e74c46309460b67d35"
+  "gitHead": "90fef9c72ab5a9fec0c03bbfb0f49d31408ecb24"
 }

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

@@ -1,7 +1,7 @@
 import { LitElement, PropertyValues, css, html } from 'lit'
 import { customElement, property, query, state } from 'lit/decorators.js'
 
-@customElement('custom-input')
+@customElement('ox-custom-input')
 export class CustomInput extends LitElement {
   static styles = css`
     input {

package/src/components/ox-form-master.ts

@@ -67,7 +67,7 @@ class FormMaster extends LitElement {
     return html`
       <form
         @keypress=${(e: KeyboardEvent) => {
-          if (e.keyCode === 13) {
+          if (e.key === 'Enter') {
             this.submit()
           }
         }}

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

@@ -48,17 +48,12 @@ export class SearchForm extends LitElement {
   @query('form') form!: HTMLFormElement
   @queryAll('input, select') formFields!: ((HTMLInputElement | HTMLSelectElement) & { field: string; _value: any })[]
 
-  /* @deprecated */
-  getFields() {
-    return Array.from(this.form.querySelectorAll('input, select') || [])
-  }
-
   render() {
     return html`
       <form
         class="search-form"
         @keypress=${(e: KeyboardEvent) => {
-          if (e.keyCode === 13) {
+          if (e.key === 'Enter') {
             e.preventDefault()
             this.submit()
           }
@@ -145,7 +140,7 @@ export class SearchForm extends LitElement {
     if (changes.has('fields')) {
       this._checkInputValidity()
 
-      var formFields = this.formFields
+      var formFields = Array.from(this.formFields)
       this.fields &&
         this.fields.forEach(field => {
           var formField = formFields.find(f => f.name == field.name)
@@ -188,14 +183,14 @@ export class SearchForm extends LitElement {
 
   get searchParams() {
     let searchParam = new URLSearchParams()
-    const fields = this.formFields
+    const fields = Array.from(this.formFields)
     fields.forEach(field => searchParam.append(field.name, field.value))
 
     return decodeURI(searchParam.toString())
   }
 
   get queryFilters() {
-    return this.formFields
+    return Array.from(this.formFields)
       .filter(
         field =>
           (field.type !== 'checkbox' && field.value && field.value !== '') ||
@@ -226,7 +221,7 @@ export class SearchForm extends LitElement {
 
   public async getQueryFilters() {
     return await Promise.all(
-      this.formFields
+      Array.from(this.formFields)
         .filter(
           field =>
             (field.type !== 'checkbox' && field.value && field.value !== '') ||
@@ -297,7 +292,7 @@ export class SearchForm extends LitElement {
   serialize() {
     let data: { [name: string]: any } = {}
 
-    this.formFields.forEach(field => {
+    Array.from(this.formFields).forEach(field => {
       const name = field.name
       if (field.type === 'number') {
         data[name] = parseFloat(field.value)