Page MenuHomeSealhub
Files F8922020

simple-input.ts
No OneTemporary
Actions

simple-input.ts
View Options

import { Context } from "koa";
import { FlatTemplatable } from "tempstream";
import { attribute } from "../../sanitize";
import { getRequiredClass, inputWrapper } from "../../utils/input-wrapper";
import { FormField } from "../fields/field";
import { FormDataValue } from "../form";
import { FormFieldControl } from "./controls";
export class SimpleInput extends FormFieldControl {
constructor(
public field: FormField,
public options: {
id?: string;
label?: string;
autocomplete?: boolean;
hide_errors?: boolean;
type?:
| "color"
| "date"
| "email"
| "file"
| "month"
| "number"
| "password"
| "search"
| "tel"
| "text"
| "time"
| "url"
| "week";
value?: string;
placeholder?: string;
readonly?: boolean;
step?: number;
} = {}
) {
super([field]);
}
async render<Fields extends Record<string, FormField>>(
ctx: Context,
data: Record<string, FormDataValue>,
_: unknown[],
field_prefix: string,
form_id: string
): Promise<FlatTemplatable> {
const id = this.options.id || this.field.name;
const label = this.options.label || this.field.name;
const type = this.options.type || "text";
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
const { parsed, raw, valid, message } = await this.field.getValue(
ctx,
data
);
// eslint-disable-next-line @typescript-eslint/consistent-type-assertions
const placeholder = this.options.placeholder || type;
const readonly = this.options.readonly || false;
const required = this.field.required;
return /* HTML */ inputWrapper(
[id, type, getRequiredClass(required)],
`
<label for="${id}">${label}</label>
<input
id="${id}"
type="${type}"
name="${field_prefix}${this.field.name}"
value="${attribute(
!valid && raw
? raw.toString()
: parsed !== undefined && parsed !== null
? // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access
((parsed as any)?.toString() as string) || ""
: ""
)}"
${form_id ? `form="${form_id}"` : ""}
placeholder="${placeholder}"
${readonly ? "readonly" : ""}
${required ? "required" : ""}
${!this.options.autocomplete ? `autocomplete="off"` : ""}
${this.options.step ? `step="${this.options.step}"` : ""}
/>
${
~valid && !this.options.hide_errors
? `<div class="input__error">${message}</div>`
: ""
}
`
);
}
}

File Metadata

Mime Type
text/x-java
Expires
Sat, Sep 20, 14:10 (1 d, 16 h)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
931120
Default Alt Text
simple-input.ts (2 KB)

Event Timeline