Textarea Table of Contents

• Props
• Events
• Slots
• CSS Variables

Propertiestype BreakpointCustomizable<T> = { base: T; xs?: T; s?: T; m?: T; l?: T; xl?: T; xxl?: T; };PropertyAttributeDescriptionTypeDefaultautoComplete auto-completeProvides a hint to the browser about what type of data the field expects, which can assist with autofill features (e.g., autocomplete='on').stringundefinedcompact compactA boolean value that, if present, renders the textarea as a compact version.booleanfalsecounter counterShow or hide the character counter.booleanfalsedescription descriptionSupplementary text providing more context or explanation for the textarea.string''disabled disabledA boolean value that, if present, makes the textarea unusable and unclickable. The value will not be submitted with the form.booleanfalseform formSpecifies the id of the

element that the textarea belongs to (useful if the textarea is not a direct descendant of the form).stringundefinedhideLabel 🛠hide-labelControls the visibility of the label.boolean
BreakpointCustomizable<boolean>falselabel labelText content for a user-facing label.string''maxLength max-lengthA non-negative integer specifying the maximum number of characters the user can enter into the textarea.numberundefinedmessage messageDynamic feedback text for validation or status.string''minLength min-lengthA non-negative integer specifying the minimum number of characters required for the textarea's value to be considered valid.numberundefinedname nameThe name of the textarea, used when submitting the form data.stringundefinedplaceholder placeholderA string that provides a brief hint to the user about what kind of information is expected in the field (e.g., placeholder='Write your message here...'). This text is displayed when the textarea is empty.string''readOnly read-onlyA boolean value that, if present, makes the textarea uneditable by the user, but its value will still be submitted with the form.booleanfalserequired requiredA boolean value that, if present, indicates that the textarea must be filled out before the form can be submitted.booleanfalseresize resizeControls whether the textarea is resizable and in which direction.type TextareaResize =
'none'
'both'
'horizontal'
'vertical'
'block'
'inline''vertical'rows rowsThe number of rows. Has no effect when field-sizing CSS Variable '--p-textarea-field-sizing' is set to 'content'.number7spellCheck spell-checkSpecifies whether the textarea should have its spelling and grammar checkedbooleanundefinedstate stateIndicates the validation or overall status of the textarea component.type TextareaState =
'none'
'error'
'success''none'theme themeControls the visual appearance of the component.type Theme =
'light'
'dark'
'auto''light'value valueThe textarea value.string''wrap wrapHandles wrapping behavior of elements.type TextareaWrap =
'hard'
'soft'
'off''soft'EventsEventDescriptionTypeblur Emitted when the textarea has lost focus.type TextareaBlurEventDetail = Event
CustomEvent<TextareaBlurEventDetail>change Emitted when the textarea loses focus after its value was changed.type TextareaChangeEventDetail = Event
CustomEvent<TextareaChangeEventDetail>input Emitted when the value has been changed as a direct result of a user action.type TextareaInputEventDetail = InputEvent
CustomEvent<TextareaInputEventDetail>SlotsSlotDescriptionisRequiredaltPropallowedTagNames<slot name="label"> Shows a label. Only [phrasing content](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content) is allowed.<slot name="label-after"> Places additional content after the label text (for content that should not be part of the label, e.g. external links or `p-popover`).<slot name="description"> Shows a description. Only [phrasing content](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content) is allowed.<slot name="message"> Shows a state message. Only [phrasing content](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content) is allowed.CSS VariablesCSS VariableDescriptiondefaultValue--p-hyphens Sets the CSS `hyphens` property for text elements, controlling whether words can break and hyphenate automatically.auto--p-textarea-field-sizing Controls CSS `field-sizing` for textarea.unset--p-textarea-min-width Minimum width of the textarea.52px--p-textarea-max-width Maximum width of the textarea.unset--p-textarea-min-height Minimum height of the textarea.unset--p-textarea-max-height Maximum height of the textarea.unset