@esportsplus/ui 0.18.1 → 0.19.0

package/build/components/field/input.d.ts

@@ -1,364 +1,34 @@
 import { type Attributes, type Renderable } from '@esportsplus/template';
 declare const file: {
-    (content: unknown): Renderable;
-    (attributes: Attributes, content: unknown): Renderable;
+    (): Renderable<unknown>;
+    (content: Renderable<unknown>): Renderable<unknown>;
+    (attributes: Attributes, content: Renderable<unknown>): Renderable<unknown>;
 };
 declare const text: {
-    (content: unknown): Renderable;
-    (attributes: Attributes, content: unknown): Renderable;
+    (): Renderable<unknown>;
+    (content: Renderable<unknown>): Renderable<unknown>;
+    (attributes: Attributes, content: Renderable<unknown>): Renderable<unknown>;
 };
 declare const textarea: {
-    (content: unknown): Renderable;
-    (attributes: Attributes, content: unknown): Renderable;
+    (): Renderable<unknown>;
+    (content: Renderable<unknown>): Renderable<unknown>;
+    (attributes: Attributes, content: Renderable<unknown>): Renderable<unknown>;
 };
 declare const _default: {
     file: {
-        (content: (mask: typeof file | typeof text | typeof textarea) => Renderable): Renderable;
-        (attributes: {
-            class?: string | (string | (() => unknown))[];
-            style?: string | (string | (() => unknown))[];
-        } & {
-            onabort?: ((event: UIEvent) => void) | undefined;
-            onanimationcancel?: ((event: AnimationEvent) => void) | undefined;
-            onanimationend?: ((event: AnimationEvent) => void) | undefined;
-            onanimationiteration?: ((event: AnimationEvent) => void) | undefined;
-            onanimationstart?: ((event: AnimationEvent) => void) | undefined;
-            onauxclick?: ((event: MouseEvent) => void) | undefined;
-            onbeforeinput?: ((event: InputEvent) => void) | undefined;
-            onbeforetoggle?: ((event: Event) => void) | undefined;
-            onblur?: ((event: FocusEvent) => void) | undefined;
-            oncancel?: ((event: Event) => void) | undefined;
-            oncanplay?: ((event: Event) => void) | undefined;
-            oncanplaythrough?: ((event: Event) => void) | undefined;
-            onchange?: ((event: Event) => void) | undefined;
-            onclick?: ((event: MouseEvent) => void) | undefined;
-            onclose?: ((event: Event) => void) | undefined;
-            oncompositionend?: ((event: CompositionEvent) => void) | undefined;
-            oncompositionstart?: ((event: CompositionEvent) => void) | undefined;
-            oncompositionupdate?: ((event: CompositionEvent) => void) | undefined;
-            oncontextlost?: ((event: Event) => void) | undefined;
-            oncontextmenu?: ((event: MouseEvent) => void) | undefined;
-            oncontextrestored?: ((event: Event) => void) | undefined;
-            oncopy?: ((event: ClipboardEvent) => void) | undefined;
-            oncuechange?: ((event: Event) => void) | undefined;
-            oncut?: ((event: ClipboardEvent) => void) | undefined;
-            ondblclick?: ((event: MouseEvent) => void) | undefined;
-            ondrag?: ((event: DragEvent) => void) | undefined;
-            ondragend?: ((event: DragEvent) => void) | undefined;
-            ondragenter?: ((event: DragEvent) => void) | undefined;
-            ondragleave?: ((event: DragEvent) => void) | undefined;
-            ondragover?: ((event: DragEvent) => void) | undefined;
-            ondragstart?: ((event: DragEvent) => void) | undefined;
-            ondrop?: ((event: DragEvent) => void) | undefined;
-            ondurationchange?: ((event: Event) => void) | undefined;
-            onemptied?: ((event: Event) => void) | undefined;
-            onended?: ((event: Event) => void) | undefined;
-            onerror?: ((event: ErrorEvent) => void) | undefined;
-            onfocus?: ((event: FocusEvent) => void) | undefined;
-            onfocusin?: ((event: FocusEvent) => void) | undefined;
-            onfocusout?: ((event: FocusEvent) => void) | undefined;
-            onformdata?: ((event: FormDataEvent) => void) | undefined;
-            ongotpointercapture?: ((event: PointerEvent) => void) | undefined;
-            oninput?: ((event: Event) => void) | undefined;
-            oninvalid?: ((event: Event) => void) | undefined;
-            onkeydown?: ((event: KeyboardEvent) => void) | undefined;
-            onkeypress?: ((event: KeyboardEvent) => void) | undefined;
-            onkeyup?: ((event: KeyboardEvent) => void) | undefined;
-            onload?: ((event: Event) => void) | undefined;
-            onloadeddata?: ((event: Event) => void) | undefined;
-            onloadedmetadata?: ((event: Event) => void) | undefined;
-            onloadstart?: ((event: Event) => void) | undefined;
-            onlostpointercapture?: ((event: PointerEvent) => void) | undefined;
-            onmousedown?: ((event: MouseEvent) => void) | undefined;
-            onmouseenter?: ((event: MouseEvent) => void) | undefined;
-            onmouseleave?: ((event: MouseEvent) => void) | undefined;
-            onmousemove?: ((event: MouseEvent) => void) | undefined;
-            onmouseout?: ((event: MouseEvent) => void) | undefined;
-            onmouseover?: ((event: MouseEvent) => void) | undefined;
-            onmouseup?: ((event: MouseEvent) => void) | undefined;
-            onpaste?: ((event: ClipboardEvent) => void) | undefined;
-            onpause?: ((event: Event) => void) | undefined;
-            onplay?: ((event: Event) => void) | undefined;
-            onplaying?: ((event: Event) => void) | undefined;
-            onpointercancel?: ((event: PointerEvent) => void) | undefined;
-            onpointerdown?: ((event: PointerEvent) => void) | undefined;
-            onpointerenter?: ((event: PointerEvent) => void) | undefined;
-            onpointerleave?: ((event: PointerEvent) => void) | undefined;
-            onpointermove?: ((event: PointerEvent) => void) | undefined;
-            onpointerout?: ((event: PointerEvent) => void) | undefined;
-            onpointerover?: ((event: PointerEvent) => void) | undefined;
-            onpointerup?: ((event: PointerEvent) => void) | undefined;
-            onprogress?: ((event: ProgressEvent<EventTarget>) => void) | undefined;
-            onratechange?: ((event: Event) => void) | undefined;
-            onreset?: ((event: Event) => void) | undefined;
-            onresize?: ((event: UIEvent) => void) | undefined;
-            onscroll?: ((event: Event) => void) | undefined;
-            onscrollend?: ((event: Event) => void) | undefined;
-            onsecuritypolicyviolation?: ((event: SecurityPolicyViolationEvent) => void) | undefined;
-            onseeked?: ((event: Event) => void) | undefined;
-            onseeking?: ((event: Event) => void) | undefined;
-            onselect?: ((event: Event) => void) | undefined;
-            onselectionchange?: ((event: Event) => void) | undefined;
-            onselectstart?: ((event: Event) => void) | undefined;
-            onslotchange?: ((event: Event) => void) | undefined;
-            onstalled?: ((event: Event) => void) | undefined;
-            onsubmit?: ((event: SubmitEvent) => void) | undefined;
-            onsuspend?: ((event: Event) => void) | undefined;
-            ontimeupdate?: ((event: Event) => void) | undefined;
-            ontoggle?: ((event: Event) => void) | undefined;
-            ontouchcancel?: ((event: TouchEvent) => void) | undefined;
-            ontouchend?: ((event: TouchEvent) => void) | undefined;
-            ontouchmove?: ((event: TouchEvent) => void) | undefined;
-            ontouchstart?: ((event: TouchEvent) => void) | undefined;
-            ontransitioncancel?: ((event: TransitionEvent) => void) | undefined;
-            ontransitionend?: ((event: TransitionEvent) => void) | undefined;
-            ontransitionrun?: ((event: TransitionEvent) => void) | undefined;
-            ontransitionstart?: ((event: TransitionEvent) => void) | undefined;
-            onvolumechange?: ((event: Event) => void) | undefined;
-            onwaiting?: ((event: Event) => void) | undefined;
-            onwebkitanimationend?: ((event: Event) => void) | undefined;
-            onwebkitanimationiteration?: ((event: Event) => void) | undefined;
-            onwebkitanimationstart?: ((event: Event) => void) | undefined;
-            onwebkittransitionend?: ((event: Event) => void) | undefined;
-            onwheel?: ((event: WheelEvent) => void) | undefined;
-        } & Record<PropertyKey, unknown> & {
-            state?: {
-                active: boolean;
-                error: string;
-            };
-        }, content: (mask: typeof file | typeof text | typeof textarea) => Renderable): Renderable;
+        (): Renderable<unknown>;
+        (content: (mask: typeof file | typeof text | typeof textarea) => Renderable<unknown>): Renderable<unknown>;
+        (attributes: Attributes, content: (mask: typeof file | typeof text | typeof textarea) => Renderable<unknown>): Renderable<unknown>;
     };
     text: {
-        (content: (mask: typeof file | typeof text | typeof textarea) => Renderable): Renderable;
-        (attributes: {
-            class?: string | (string | (() => unknown))[];
-            style?: string | (string | (() => unknown))[];
-        } & {
-            onabort?: ((event: UIEvent) => void) | undefined;
-            onanimationcancel?: ((event: AnimationEvent) => void) | undefined;
-            onanimationend?: ((event: AnimationEvent) => void) | undefined;
-            onanimationiteration?: ((event: AnimationEvent) => void) | undefined;
-            onanimationstart?: ((event: AnimationEvent) => void) | undefined;
-            onauxclick?: ((event: MouseEvent) => void) | undefined;
-            onbeforeinput?: ((event: InputEvent) => void) | undefined;
-            onbeforetoggle?: ((event: Event) => void) | undefined;
-            onblur?: ((event: FocusEvent) => void) | undefined;
-            oncancel?: ((event: Event) => void) | undefined;
-            oncanplay?: ((event: Event) => void) | undefined;
-            oncanplaythrough?: ((event: Event) => void) | undefined;
-            onchange?: ((event: Event) => void) | undefined;
-            onclick?: ((event: MouseEvent) => void) | undefined;
-            onclose?: ((event: Event) => void) | undefined;
-            oncompositionend?: ((event: CompositionEvent) => void) | undefined;
-            oncompositionstart?: ((event: CompositionEvent) => void) | undefined;
-            oncompositionupdate?: ((event: CompositionEvent) => void) | undefined;
-            oncontextlost?: ((event: Event) => void) | undefined;
-            oncontextmenu?: ((event: MouseEvent) => void) | undefined;
-            oncontextrestored?: ((event: Event) => void) | undefined;
-            oncopy?: ((event: ClipboardEvent) => void) | undefined;
-            oncuechange?: ((event: Event) => void) | undefined;
-            oncut?: ((event: ClipboardEvent) => void) | undefined;
-            ondblclick?: ((event: MouseEvent) => void) | undefined;
-            ondrag?: ((event: DragEvent) => void) | undefined;
-            ondragend?: ((event: DragEvent) => void) | undefined;
-            ondragenter?: ((event: DragEvent) => void) | undefined;
-            ondragleave?: ((event: DragEvent) => void) | undefined;
-            ondragover?: ((event: DragEvent) => void) | undefined;
-            ondragstart?: ((event: DragEvent) => void) | undefined;
-            ondrop?: ((event: DragEvent) => void) | undefined;
-            ondurationchange?: ((event: Event) => void) | undefined;
-            onemptied?: ((event: Event) => void) | undefined;
-            onended?: ((event: Event) => void) | undefined;
-            onerror?: ((event: ErrorEvent) => void) | undefined;
-            onfocus?: ((event: FocusEvent) => void) | undefined;
-            onfocusin?: ((event: FocusEvent) => void) | undefined;
-            onfocusout?: ((event: FocusEvent) => void) | undefined;
-            onformdata?: ((event: FormDataEvent) => void) | undefined;
-            ongotpointercapture?: ((event: PointerEvent) => void) | undefined;
-            oninput?: ((event: Event) => void) | undefined;
-            oninvalid?: ((event: Event) => void) | undefined;
-            onkeydown?: ((event: KeyboardEvent) => void) | undefined;
-            onkeypress?: ((event: KeyboardEvent) => void) | undefined;
-            onkeyup?: ((event: KeyboardEvent) => void) | undefined;
-            onload?: ((event: Event) => void) | undefined;
-            onloadeddata?: ((event: Event) => void) | undefined;
-            onloadedmetadata?: ((event: Event) => void) | undefined;
-            onloadstart?: ((event: Event) => void) | undefined;
-            onlostpointercapture?: ((event: PointerEvent) => void) | undefined;
-            onmousedown?: ((event: MouseEvent) => void) | undefined;
-            onmouseenter?: ((event: MouseEvent) => void) | undefined;
-            onmouseleave?: ((event: MouseEvent) => void) | undefined;
-            onmousemove?: ((event: MouseEvent) => void) | undefined;
-            onmouseout?: ((event: MouseEvent) => void) | undefined;
-            onmouseover?: ((event: MouseEvent) => void) | undefined;
-            onmouseup?: ((event: MouseEvent) => void) | undefined;
-            onpaste?: ((event: ClipboardEvent) => void) | undefined;
-            onpause?: ((event: Event) => void) | undefined;
-            onplay?: ((event: Event) => void) | undefined;
-            onplaying?: ((event: Event) => void) | undefined;
-            onpointercancel?: ((event: PointerEvent) => void) | undefined;
-            onpointerdown?: ((event: PointerEvent) => void) | undefined;
-            onpointerenter?: ((event: PointerEvent) => void) | undefined;
-            onpointerleave?: ((event: PointerEvent) => void) | undefined;
-            onpointermove?: ((event: PointerEvent) => void) | undefined;
-            onpointerout?: ((event: PointerEvent) => void) | undefined;
-            onpointerover?: ((event: PointerEvent) => void) | undefined;
-            onpointerup?: ((event: PointerEvent) => void) | undefined;
-            onprogress?: ((event: ProgressEvent<EventTarget>) => void) | undefined;
-            onratechange?: ((event: Event) => void) | undefined;
-            onreset?: ((event: Event) => void) | undefined;
-            onresize?: ((event: UIEvent) => void) | undefined;
-            onscroll?: ((event: Event) => void) | undefined;
-            onscrollend?: ((event: Event) => void) | undefined;
-            onsecuritypolicyviolation?: ((event: SecurityPolicyViolationEvent) => void) | undefined;
-            onseeked?: ((event: Event) => void) | undefined;
-            onseeking?: ((event: Event) => void) | undefined;
-            onselect?: ((event: Event) => void) | undefined;
-            onselectionchange?: ((event: Event) => void) | undefined;
-            onselectstart?: ((event: Event) => void) | undefined;
-            onslotchange?: ((event: Event) => void) | undefined;
-            onstalled?: ((event: Event) => void) | undefined;
-            onsubmit?: ((event: SubmitEvent) => void) | undefined;
-            onsuspend?: ((event: Event) => void) | undefined;
-            ontimeupdate?: ((event: Event) => void) | undefined;
-            ontoggle?: ((event: Event) => void) | undefined;
-            ontouchcancel?: ((event: TouchEvent) => void) | undefined;
-            ontouchend?: ((event: TouchEvent) => void) | undefined;
-            ontouchmove?: ((event: TouchEvent) => void) | undefined;
-            ontouchstart?: ((event: TouchEvent) => void) | undefined;
-            ontransitioncancel?: ((event: TransitionEvent) => void) | undefined;
-            ontransitionend?: ((event: TransitionEvent) => void) | undefined;
-            ontransitionrun?: ((event: TransitionEvent) => void) | undefined;
-            ontransitionstart?: ((event: TransitionEvent) => void) | undefined;
-            onvolumechange?: ((event: Event) => void) | undefined;
-            onwaiting?: ((event: Event) => void) | undefined;
-            onwebkitanimationend?: ((event: Event) => void) | undefined;
-            onwebkitanimationiteration?: ((event: Event) => void) | undefined;
-            onwebkitanimationstart?: ((event: Event) => void) | undefined;
-            onwebkittransitionend?: ((event: Event) => void) | undefined;
-            onwheel?: ((event: WheelEvent) => void) | undefined;
-        } & Record<PropertyKey, unknown> & {
-            state?: {
-                active: boolean;
-                error: string;
-            };
-        }, content: (mask: typeof file | typeof text | typeof textarea) => Renderable): Renderable;
+        (): Renderable<unknown>;
+        (content: (mask: typeof file | typeof text | typeof textarea) => Renderable<unknown>): Renderable<unknown>;
+        (attributes: Attributes, content: (mask: typeof file | typeof text | typeof textarea) => Renderable<unknown>): Renderable<unknown>;
     };
     textarea: {
-        (content: (mask: typeof file | typeof text | typeof textarea) => Renderable): Renderable;
-        (attributes: {
-            class?: string | (string | (() => unknown))[];
-            style?: string | (string | (() => unknown))[];
-        } & {
-            onabort?: ((event: UIEvent) => void) | undefined;
-            onanimationcancel?: ((event: AnimationEvent) => void) | undefined;
-            onanimationend?: ((event: AnimationEvent) => void) | undefined;
-            onanimationiteration?: ((event: AnimationEvent) => void) | undefined;
-            onanimationstart?: ((event: AnimationEvent) => void) | undefined;
-            onauxclick?: ((event: MouseEvent) => void) | undefined;
-            onbeforeinput?: ((event: InputEvent) => void) | undefined;
-            onbeforetoggle?: ((event: Event) => void) | undefined;
-            onblur?: ((event: FocusEvent) => void) | undefined;
-            oncancel?: ((event: Event) => void) | undefined;
-            oncanplay?: ((event: Event) => void) | undefined;
-            oncanplaythrough?: ((event: Event) => void) | undefined;
-            onchange?: ((event: Event) => void) | undefined;
-            onclick?: ((event: MouseEvent) => void) | undefined;
-            onclose?: ((event: Event) => void) | undefined;
-            oncompositionend?: ((event: CompositionEvent) => void) | undefined;
-            oncompositionstart?: ((event: CompositionEvent) => void) | undefined;
-            oncompositionupdate?: ((event: CompositionEvent) => void) | undefined;
-            oncontextlost?: ((event: Event) => void) | undefined;
-            oncontextmenu?: ((event: MouseEvent) => void) | undefined;
-            oncontextrestored?: ((event: Event) => void) | undefined;
-            oncopy?: ((event: ClipboardEvent) => void) | undefined;
-            oncuechange?: ((event: Event) => void) | undefined;
-            oncut?: ((event: ClipboardEvent) => void) | undefined;
-            ondblclick?: ((event: MouseEvent) => void) | undefined;
-            ondrag?: ((event: DragEvent) => void) | undefined;
-            ondragend?: ((event: DragEvent) => void) | undefined;
-            ondragenter?: ((event: DragEvent) => void) | undefined;
-            ondragleave?: ((event: DragEvent) => void) | undefined;
-            ondragover?: ((event: DragEvent) => void) | undefined;
-            ondragstart?: ((event: DragEvent) => void) | undefined;
-            ondrop?: ((event: DragEvent) => void) | undefined;
-            ondurationchange?: ((event: Event) => void) | undefined;
-            onemptied?: ((event: Event) => void) | undefined;
-            onended?: ((event: Event) => void) | undefined;
-            onerror?: ((event: ErrorEvent) => void) | undefined;
-            onfocus?: ((event: FocusEvent) => void) | undefined;
-            onfocusin?: ((event: FocusEvent) => void) | undefined;
-            onfocusout?: ((event: FocusEvent) => void) | undefined;
-            onformdata?: ((event: FormDataEvent) => void) | undefined;
-            ongotpointercapture?: ((event: PointerEvent) => void) | undefined;
-            oninput?: ((event: Event) => void) | undefined;
-            oninvalid?: ((event: Event) => void) | undefined;
-            onkeydown?: ((event: KeyboardEvent) => void) | undefined;
-            onkeypress?: ((event: KeyboardEvent) => void) | undefined;
-            onkeyup?: ((event: KeyboardEvent) => void) | undefined;
-            onload?: ((event: Event) => void) | undefined;
-            onloadeddata?: ((event: Event) => void) | undefined;
-            onloadedmetadata?: ((event: Event) => void) | undefined;
-            onloadstart?: ((event: Event) => void) | undefined;
-            onlostpointercapture?: ((event: PointerEvent) => void) | undefined;
-            onmousedown?: ((event: MouseEvent) => void) | undefined;
-            onmouseenter?: ((event: MouseEvent) => void) | undefined;
-            onmouseleave?: ((event: MouseEvent) => void) | undefined;
-            onmousemove?: ((event: MouseEvent) => void) | undefined;
-            onmouseout?: ((event: MouseEvent) => void) | undefined;
-            onmouseover?: ((event: MouseEvent) => void) | undefined;
-            onmouseup?: ((event: MouseEvent) => void) | undefined;
-            onpaste?: ((event: ClipboardEvent) => void) | undefined;
-            onpause?: ((event: Event) => void) | undefined;
-            onplay?: ((event: Event) => void) | undefined;
-            onplaying?: ((event: Event) => void) | undefined;
-            onpointercancel?: ((event: PointerEvent) => void) | undefined;
-            onpointerdown?: ((event: PointerEvent) => void) | undefined;
-            onpointerenter?: ((event: PointerEvent) => void) | undefined;
-            onpointerleave?: ((event: PointerEvent) => void) | undefined;
-            onpointermove?: ((event: PointerEvent) => void) | undefined;
-            onpointerout?: ((event: PointerEvent) => void) | undefined;
-            onpointerover?: ((event: PointerEvent) => void) | undefined;
-            onpointerup?: ((event: PointerEvent) => void) | undefined;
-            onprogress?: ((event: ProgressEvent<EventTarget>) => void) | undefined;
-            onratechange?: ((event: Event) => void) | undefined;
-            onreset?: ((event: Event) => void) | undefined;
-            onresize?: ((event: UIEvent) => void) | undefined;
-            onscroll?: ((event: Event) => void) | undefined;
-            onscrollend?: ((event: Event) => void) | undefined;
-            onsecuritypolicyviolation?: ((event: SecurityPolicyViolationEvent) => void) | undefined;
-            onseeked?: ((event: Event) => void) | undefined;
-            onseeking?: ((event: Event) => void) | undefined;
-            onselect?: ((event: Event) => void) | undefined;
-            onselectionchange?: ((event: Event) => void) | undefined;
-            onselectstart?: ((event: Event) => void) | undefined;
-            onslotchange?: ((event: Event) => void) | undefined;
-            onstalled?: ((event: Event) => void) | undefined;
-            onsubmit?: ((event: SubmitEvent) => void) | undefined;
-            onsuspend?: ((event: Event) => void) | undefined;
-            ontimeupdate?: ((event: Event) => void) | undefined;
-            ontoggle?: ((event: Event) => void) | undefined;
-            ontouchcancel?: ((event: TouchEvent) => void) | undefined;
-            ontouchend?: ((event: TouchEvent) => void) | undefined;
-            ontouchmove?: ((event: TouchEvent) => void) | undefined;
-            ontouchstart?: ((event: TouchEvent) => void) | undefined;
-            ontransitioncancel?: ((event: TransitionEvent) => void) | undefined;
-            ontransitionend?: ((event: TransitionEvent) => void) | undefined;
-            ontransitionrun?: ((event: TransitionEvent) => void) | undefined;
-            ontransitionstart?: ((event: TransitionEvent) => void) | undefined;
-            onvolumechange?: ((event: Event) => void) | undefined;
-            onwaiting?: ((event: Event) => void) | undefined;
-            onwebkitanimationend?: ((event: Event) => void) | undefined;
-            onwebkitanimationiteration?: ((event: Event) => void) | undefined;
-            onwebkitanimationstart?: ((event: Event) => void) | undefined;
-            onwebkittransitionend?: ((event: Event) => void) | undefined;
-            onwheel?: ((event: WheelEvent) => void) | undefined;
-        } & Record<PropertyKey, unknown> & {
-            state?: {
-                active: boolean;
-                error: string;
-            };
-        }, content: (mask: typeof file | typeof text | typeof textarea) => Renderable): Renderable;
+        (): Renderable<unknown>;
+        (content: (mask: typeof file | typeof text | typeof textarea) => Renderable<unknown>): Renderable<unknown>;
+        (attributes: Attributes, content: (mask: typeof file | typeof text | typeof textarea) => Renderable<unknown>): Renderable<unknown>;
     };
 };
 export default _default;

package/build/components/field/input.js

@@ -4,8 +4,9 @@ import { omit, pick } from '@esportsplus/utilities';
 import form from '../../components/form/index.js';
 import template from '../../components/template/index.js';
 import error from './error.js';
-const FILE_TAG_KEYS = ['accept', 'disabled', 'name', 'required', 'value'];
-const TEXT_TAG_KEYS = [
+const FILE_TAG = ['accept', 'disabled', 'name', 'required', 'value'];
+const OMIT = ['state'];
+const TEXT_TAG = [
     'autocapitalize',
     'autocomplete',
     'autocorrect',
@@ -29,17 +30,17 @@ const field = template.factory(function (attributes, content) {
     });
     return html `
             <div
-                class='
-                    ${() => state.active && '--active'}
-                    field
-                '
-                onfocusin='${() => {
-        state.active = true;
-    }}'
-                onfocusout='${() => {
-        state.active = false;
-    }}'
-                ${omit(attributes, ['state'])}
+                class='field'
+                ${omit(attributes, OMIT)}
+                ${{
+        class: () => state.active && '--active',
+        onfocusin: () => {
+            state.active = true;
+        },
+        onfocusout: () => {
+            state.active = false;
+        }
+    }}
             >
                 ${content(((...args) => this.call(state, ...args)))}
                 ${error(state)}
@@ -50,13 +51,15 @@ const file = template.factory(function (attributes, content) {
     return html `
             <label
                 class='field-mask field-mask--file'
-                ${omit(attributes, FILE_TAG_KEYS)}
+                ${omit(attributes, FILE_TAG)}
             >
                 <input
                     class='field-mask-tag field-mask-tag--hidden'
-                    onrender='${form.input.onrender(this)}'
                     type='file'
-                    ${pick(attributes, FILE_TAG_KEYS)}
+                    ${pick(attributes, FILE_TAG)}
+                    ${{
+        onrender: form.input.onrender(this)
+    }}
                 >
 
                 ${content}
@@ -65,12 +68,14 @@ const file = template.factory(function (attributes, content) {
 });
 const text = template.factory(function (attributes, content) {
     return html `
-            <label class='field-mask field-mask--input' ${omit(attributes, TEXT_TAG_KEYS)}>
+            <label class='field-mask field-mask--input' ${omit(attributes, TEXT_TAG)}>
                 <input
                     class='field-mask-tag'
-                    onrender='${form.input.onrender(this)}'
-                    type='${attributes.type || 'text'}'
-                    ${pick(attributes, TEXT_TAG_KEYS)}
+                    ${pick(attributes, TEXT_TAG)}
+                    ${{
+        onrender: form.input.onrender(this),
+        type: attributes.type || 'text'
+    }}
                 >
                 ${content}
             </label>
@@ -78,11 +83,16 @@ const text = template.factory(function (attributes, content) {
 });
 const textarea = template.factory(function (attributes, content) {
     return html `
-            <label class='field-mask field-mask--textarea' ${omit(attributes, TEXT_TAG_KEYS)}>
+            <label
+                class='field-mask field-mask--textarea'
+                ${omit(attributes, TEXT_TAG)}
+            >
                 <textarea
                     class='field-mask-tag'
-                    onrender='${form.input.onrender(this)}'
-                    ${pick(attributes, TEXT_TAG_KEYS)}
+                    ${pick(attributes, TEXT_TAG)}
+                    ${{
+        onrender: form.input.onrender(this)
+    }}
                 >
                     ${attributes.value}
                 </textarea>