com.github.fluorumlabs.disconnect.vaadin.elements.TextFieldElement Maven / Gradle / Ivy

Go to download

Show more of this group Show more artifacts with this name
Show all versions of disconnect-vaadin Show documentation

Vaadin components bindings for Disconnect Zero

The newest version!

package com.github.fluorumlabs.disconnect.vaadin.elements;

import com.github.fluorumlabs.disconnect.core.annotations.Import;
import com.github.fluorumlabs.disconnect.core.annotations.NpmPackage;
import com.github.fluorumlabs.disconnect.vaadin.Vaadin;
import com.github.fluorumlabs.disconnect.vaadin.elements.mixins.TextFieldMixin;
import com.github.fluorumlabs.disconnect.vaadin.elements.mixins.ThemableMixin;
import js.web.dom.HTMLElement;
import org.teavm.jso.JSProperty;

import javax.annotation.Nullable;

/**
 * <vaadin-text-field> is a Web Component for text field control in forms.
 *
 * <vaadin-text-field label="First Name">
 * </vaadin-text-field>
 * 
 * Prefixes and suffixes
 * These are child elements of a <vaadin-text-field> that are displayed
 * inline with the input, before or after.
 * In order for an element to be considered as a prefix, it must have the slot
 * attribute set to prefix (and similarly for suffix).
 *
 * <vaadin-text-field label="Email address">
 *   <div slot="prefix">Sent to:</div>
 *   <div slot="suffix">@vaadin.com</div>
 * </vaadin-text-area>
 * 
 * Styling
 * The following custom properties are available for styling:
 *
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * Custom property Description Default
--vaadin-text-field-default-width Set the default width of the input
 * field 12em
 * The following shadow DOM parts are available for styling:
 *
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * Part name Description
label The label element
input-field The element that wraps prefix, value and suffix
value The text value element inside the input-field element
error-message The error message element
 * The following state attributes are available for styling:
 *
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * 
 * Attribute Description Part name
disabled Set to a disabled text field :host
has-value Set when the element has a value :host
has-label Set when the element has a label :host
invalid Set when the element is invalid :host
input-prevented Temporarily set when invalid input is prevented :host
focused Set when the element is focused :host
focus-ring Set when the element is keyboard focused :host
readonly Set to a readonly text field :host
 * See
 * ThemableMixin – how to apply styles for shadow parts
 */
@NpmPackage(
		name = "@vaadin/vaadin",
		version = Vaadin.VERSION
)
@Import(

		module = "@vaadin/vaadin-text-field/theme/lumo/vaadin-text-field.js"
)
public interface TextFieldElement extends HTMLElement, TextFieldMixin, ThemableMixin {
	static String TAGNAME() {
		return "vaadin-text-field";
	}

	/**
	 * Identifies a list of pre-defined options to suggest to the user.
	 * The value must be the id of a  element in the same document.
	 */
	@Nullable
	@JSProperty
	String getList();

	/**
	 * Identifies a list of pre-defined options to suggest to the user.
	 * The value must be the id of a  element in the same document.
	 */
	@JSProperty
	void setList(String list);

	/**
	 * A regular expression that the value is checked against.
	 * The pattern must match the entire value, not just some subset.
	 */
	@Nullable
	@JSProperty
	String getPattern();

	/**
	 * A regular expression that the value is checked against.
	 * The pattern must match the entire value, not just some subset.
	 */
	@JSProperty
	void setPattern(String pattern);
}

Part name	Description
`label`	The label element
`input-field`	The element that wraps prefix, value and suffix
`value`	The text value element inside the `input-field` element
`error-message`	The error message element

Attribute	Description	Part name
`disabled`	Set to a disabled text field	:host
`has-value`	Set when the element has a value	:host
`has-label`	Set when the element has a label	:host
`invalid`	Set when the element is invalid	:host
`input-prevented`	Temporarily set when invalid input is prevented	:host
`focused`	Set when the element is focused	:host
`focus-ring`	Set when the element is keyboard focused	:host
`readonly`	Set to a readonly text field	:host