import { TextArea as FluentTextArea } from "@fluentui/web-components";
/**
* TextArea
* @summary A Fabric UI TextArea component that extends Fluent UI's TextArea with custom styling and behavior.
*
* @example
* ```html
*
* Label
* Your text here...
*
* ```
*
* @attr {TextAreaAppearance | undefined} appearance - Indicates the visual appearance of the element.
* @attr {boolean | undefined} block - Indicates whether the textarea should be a block-level element.
* @attr {TextAreaSize | undefined} size - Sets the size of the control.
* @attr {TextAreaAutocomplete | undefined} autocomplete - Indicates the element's autocomplete state.
* @attr {boolean | undefined} auto-resize - Indicates whether the element’s block size (height) should be automatically changed based on the content.
* @attr {string | undefined} dirname - Sets the name of the value directionality to be submitted with form data.
* @attr {boolean | undefined} display-shadow - Indicates whether the element displays a box shadow.
* @attr {string | undefined} form - The id of a form to associate the element to.
* @attr {number | undefined} maxlength - The maximum number of characters a user can enter.
* @attr {number | undefined} minlength - The minimum number of characters a user can enter.
* @attr {string | undefined} name - The name of the element. This element's value will be surfaced during form submission under the provided name.
* @attr {string | undefined} placeholder - Sets the placeholder value of the element, generally used to provide a hint to the user.
* @attr {boolean | undefined} readonly - When true, the control will be immutable by user interaction.
* @attr {boolean | undefined} required - The element's required attribute.
*
* @prop {string} appearance - Indicates the visual appearance of the element.
* @prop {boolean} block - Indicates whether the textarea should be a block-level element.
* @prop {TextAreaSize} size - Sets the size of the control.
* @prop {TextAreaAutocomplete} autocomplete - Indicates the element's autocomplete state.
* @prop {boolean} autoResize - Indicates whether the element’s block size (height) should be automatically changed based on the content.
* @prop {string} dirname - Sets the name of the value directionality to be submitted with form data.
* @prop {boolean} displayShadow - Indicates whether the element displays a box shadow.
* @prop {string} form - The id of a form to associate the element to.
* @prop {number} maxlength - The maximum number of characters a user can enter.
* @prop {number} minlength - The minimum number of characters a user can enter.
* @prop {string} name - The name of the element. This element's value will be surfaced during form submission under the provided name.
* @prop {string} placeholder - Sets the placeholder value of the element, generally used to provide a hint to the user.
* @prop {boolean} readonly - When true, the control will be immutable by user interaction.
* @prop {boolean} required - The element's required attribute.
*
* @slot - The default content/value of the component.
* @slot label - The content for the `