igniteui-webcomponents
Version:
Ignite UI for Web Components is a complete library of UI components, giving you the ability to build modern web applications using encapsulation and the concept of reusable components in a dependency-free approach.
204 lines (203 loc) • 7.94 kB
TypeScript
import { LitElement, type TemplateResult, nothing } from 'lit';
import type { Constructor } from '../common/mixins/constructor.js';
import { type FormValue } from '../common/mixins/forms/form-value.js';
import type { RangeTextSelectMode, SelectionRangeDirection } from '../types.js';
export interface IgcTextareaComponentEventMap {
igcInput: CustomEvent<string>;
igcChange: CustomEvent<string>;
focus: FocusEvent;
blur: FocusEvent;
}
declare const IgcTextareaComponent_base: Constructor<import("../common/mixins/forms/types.js").FormRequiredInterface & import("../common/mixins/forms/types.js").FormAssociatedElementInterface> & Constructor<import("../common/mixins/event-emitter.js").EventEmitterInterface<IgcTextareaComponentEventMap>> & Constructor<LitElement>;
/**
* This element represents a multi-line plain-text editing control,
* useful when you want to allow users to enter a sizeable amount of free-form text,
* for example a comment on a review or feedback form.
*
* @element igc-textarea
*
* @slot - Text content from the default slot will be used as the value of the component.
* @slot prefix - Renders content before the input.
* @slot suffix - Renders content after input.
* @slot helper-text - Renders content below the input.
* @slot value-missing - Renders content when the required validation fails.
* @slot too-long - Renders content when the maxlength validation fails.
* @slot too-short - Renders content when the minlength validation fails.
* @slot custom-error - Renders content when setCustomValidity(message) is set.
* @slot invalid - Renders content when the component is in invalid state (validity.valid = false).
*
* @fires igcInput - Emitted when the control receives user input.
* @fires igcChange - Emitted when the a change to the control value is committed by the user.
*
* @csspart container - The main wrapper that holds all main input elements of the textarea.
* @csspart input - The native input element of the igc-textarea.
* @csspart label - The native label element of the igc-textarea.
* @csspart prefix - The prefix wrapper of the igc-textarea.
* @csspart suffix - The suffix wrapper of the igc-textarea.
* @csspart helper-text - The helper text wrapper of the igc-textarea.
*/
export default class IgcTextareaComponent extends IgcTextareaComponent_base {
static readonly tagName = "igc-textarea";
static styles: import("lit").CSSResult[];
static register(): void;
protected static shadowRootOptions: {
delegatesFocus: boolean;
mode: ShadowRootMode;
serializable?: boolean;
slotAssignment?: SlotAssignmentMode;
};
private static readonly increment;
protected get __validators(): import("../common/validators.js").Validator<IgcTextareaComponent>[];
protected _formValue: FormValue<string>;
protected inputId: string;
private observer;
private projected;
protected prefixes: Array<HTMLElement>;
protected suffixes: Array<HTMLElement>;
private input;
private get resizeStyles();
protected get _isMaterial(): boolean;
/**
* Specifies what if any permission the browser has to provide for automated assistance in filling out form field values,
* as well as guidance to the browser as to the type of information expected in the field.
* Refer to [this page](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) for additional information.
*
* @attr
*/
autocomplete: string;
/**
* Controls whether and how text input is automatically capitalized as it is entered/edited by the user.
*
* [MDN documentation](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autocapitalize).
*
* @attr
*/
autocapitalize: 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters';
/**
* Hints at the type of data that might be entered by the user while editing the element or its contents.
* This allows a browser to display an appropriate virtual keyboard.
*
* [MDN documentation](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode)
*
* @attr inputmode
*/
inputMode: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
/**
* The label for the control.
*
* @attr
*/
label: string;
/**
* The maximum number of characters (UTF-16 code units) that the user can enter.
* If this value isn't specified, the user can enter an unlimited number of characters.
*
* @attr maxlength
*/
maxLength: number;
/**
* The minimum number of characters (UTF-16 code units) required that the user should enter.
*
* @attr minlength
*/
minLength: number;
/**
* Whether the control will have outlined appearance.
* @attr
*/
outlined: boolean;
/**
* The placeholder attribute of the control.
*
* @attr
*/
placeholder: string;
/**
* Makes the control a readonly field.
*
* @attr readonly
*/
readOnly: boolean;
/**
* Controls whether the control can be resized.
* When `auto` is set, the control will try to expand and fit its content.
*
* @attr
*/
resize: 'auto' | 'vertical' | 'none';
/**
* The number of visible text lines for the control. If it is specified, it must be a positive integer.
* If it is not specified, the default value is 2.
*
* @attr
*/
rows: number;
/**
* The value of the component
*
* @attr
*/
set value(value: string);
get value(): string;
/**
* Controls whether the element may be checked for spelling errors.
*
* @attr
*/
spellcheck: boolean;
/**
* Indicates how the control should wrap the value for form submission.
* Refer to [this page on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attributes)
* for explanation of the available values.
*
* @attr
*/
wrap: 'hard' | 'soft' | 'off';
/**
* Enables validation rules to be evaluated without restricting user input. This applies to the `maxLength` property
* when it is defined.
*
* @attr validate-only
*/
validateOnly: boolean;
protected valueChanged(): Promise<void>;
protected setAreaHeight(): void;
constructor();
connectedCallback(): Promise<void>;
disconnectedCallback(): void;
/** Selects all text within the control. */
select(): void;
/** Sets the text selection range of the control */
setSelectionRange(start: number, end: number, direction?: SelectionRangeDirection): void;
/** Replaces the selected text in the control. */
setRangeText(replacement: string, start: number, end: number, selectMode?: RangeTextSelectMode): void;
scrollTo(options?: ScrollToOptions | undefined): void;
scrollTo(x: number, y: number): void;
protected resolvePartNames(): {
container: boolean;
prefixed: boolean;
suffixed: boolean;
filled: boolean;
};
private setAutoHeight;
protected handleInput(): void;
protected handleChange(): void;
protected handleFocus(): void;
protected handleBlur(): void;
protected valueSlotChange(): void;
protected renderValueSlot(): TemplateResult<1>;
protected renderValidationContainer(): TemplateResult;
protected renderPrefix(): TemplateResult<1>;
protected renderSuffix(): TemplateResult<1>;
protected renderLabel(): TemplateResult<1> | typeof nothing;
protected renderStandard(): TemplateResult<1>;
protected renderMaterial(): TemplateResult<1>;
protected renderInput(): TemplateResult<1>;
protected render(): TemplateResult<1>;
}
declare global {
interface HTMLElementTagNameMap {
'igc-textarea': IgcTextareaComponent;
}
}
export {};