font

color_theme

Desktop UI

Input

Preview

HTML

clear

default with placeholder

default

disabled

clear clearer

textured

round

round lightFocus

round lightFocus semiTransparent

star

starclear

check

API `<dui-input>`(source)

clear

This component is compatible with Angular Forms. You can use [(ngModel)] or formControlName with it.

@Input() auto-focus?: boolean

Focuses this element once created (AfterViewInit).

@Input() clearer?: boolean

@Input() disabled?: boolean

@Input() icon?: string

@Input() iconSize?: number

@Input() lightFocus?: boolean

Uses a more decent focus border.

@Input() max?: number

@Input() maxLength?: number

@Input() min?: number

@Input() minLength?: number

@Input() name?: string

@Input() noControls?: boolean

Disables input controls (like for type=number the arrow buttons)

@Input() placeholder?: string

@Input() readonly?: boolean

@Input() required?: boolean

@Input() round?: boolean

@Input() semiTransparent?: boolean

Appears a little bit transparent. Perfect for blurry background.

@Input() step?: number

@Input() textured?: boolean

@Input() type?: string

@Input() value?: any

@Output() blur?: FocusEvent

@Output() disabledChange?: boolean

@Output() enter?: KeyboardEvent

@Output() esc?: KeyboardEvent

@Output() focus?: FocusEvent

@Output() keydown?: KeyboardEvent

@Output() keyup?: KeyboardEvent

@Output() valueChange?: any

error: boolean

input: Signal<ElementRef<any>>

isFocused: Signal<boolean>

valid: boolean

clear(): void

focusInput(): void

setValue(value: any): void