@fluentui/web-components 3.0.0-beta.55 → 3.0.0-beta.57

package/CHANGELOG.md

@@ -1,12 +1,31 @@
 # Change Log - @fluentui/web-components
 
-This log was last generated on Thu, 08 Aug 2024 04:07:05 GMT and should not be manually modified.
+This log was last generated on Fri, 16 Aug 2024 04:08:08 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [3.0.0-beta.57](https://github.com/microsoft/fluentui/tree/@fluentui/web-components_v3.0.0-beta.57)
+
+Fri, 16 Aug 2024 04:08:08 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/web-components_v3.0.0-beta.56..@fluentui/web-components_v3.0.0-beta.57)
+
+### Changes
+
+- export BaseCheckbox class ([PR #32302](https://github.com/microsoft/fluentui/pull/32302) by rupertdavid@microsoft.com)
+
+## [3.0.0-beta.56](https://github.com/microsoft/fluentui/tree/@fluentui/web-components_v3.0.0-beta.56)
+
+Wed, 14 Aug 2024 04:07:35 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/web-components_v3.0.0-beta.55..@fluentui/web-components_v3.0.0-beta.56)
+
+### Changes
+
+- feat(web-components): add fluent-textarea component ([PR #32037](https://github.com/microsoft/fluentui/pull/32037) by machi@microsoft.com)
+- export BaseAnchor class ([PR #32295](https://github.com/microsoft/fluentui/pull/32295) by rupertdavid@microsoft.com)
+
 ## [3.0.0-beta.55](https://github.com/microsoft/fluentui/tree/@fluentui/web-components_v3.0.0-beta.55)
 
-Thu, 08 Aug 2024 04:07:05 GMT 
+Thu, 08 Aug 2024 04:07:16 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/web-components_v3.0.0-beta.54..@fluentui/web-components_v3.0.0-beta.55)
 
 ### Changes

package/dist/dts/anchor-button/index.d.ts

@@ -1,5 +1,5 @@
 export { definition as AnchorButtonDefinition } from './anchor-button.definition.js';
-export { AnchorButton } from './anchor-button.js';
+export { BaseAnchor, AnchorButton } from './anchor-button.js';
 export { AnchorButtonAppearance, AnchorButtonShape, AnchorButtonSize, AnchorTarget } from './anchor-button.options.js';
 export type { AnchorButtonOptions } from './anchor-button.options.js';
 export { template as AnchorButtonTemplate } from './anchor-button.template.js';

package/dist/dts/checkbox/index.d.ts

@@ -1,5 +1,5 @@
 export { definition as CheckboxDefinition } from './checkbox.definition.js';
-export { Checkbox } from './checkbox.js';
+export { BaseCheckbox, Checkbox } from './checkbox.js';
 export { CheckboxShape, CheckboxSize } from './checkbox.options.js';
 export type { CheckboxOptions } from './checkbox.options.js';
 export { styles as CheckboxStyles } from './checkbox.styles.js';

package/dist/dts/helpers.tests.d.ts

@@ -1,3 +1,4 @@
+import { type ExpectMatcherState, type Locator } from '@playwright/test';
 /**
  * Returns a formatted URL for a given Storybook fixture.
  *
@@ -6,3 +7,24 @@
  * @returns - the local URL for the Storybook fixture iframe
  */
 export declare function fixtureURL(id?: string, args?: Record<string, any>): string;
+/**
+ * Evaluate whether an element has the given state or not on its `elementInternals` property.
+ *
+ * @param locator - The Playwright locator for the element.
+ * @param state - The name of the state.
+ * @param expected - Whether the given state is expected to exist.
+ * @param has - Whether the element is expected to have or not have the given state, defaults to `true`.
+ */
+declare function toHaveCustomState(this: ExpectMatcherState, locator: Locator, state: string, options?: {
+    timeout?: number;
+}): Promise<{
+    name: string;
+    message: () => string;
+    pass: boolean;
+    expected: boolean;
+    actual: any;
+}>;
+export declare const expect: import("@playwright/test").Expect<{
+    toHaveCustomState: typeof toHaveCustomState;
+}>;
+export {};

package/dist/dts/index-rollup.d.ts

@@ -32,6 +32,7 @@ import './tab-panel/define.js';
 import './tab/define.js';
 import './tabs/define.js';
 import './tablist/define.js';
+import './textarea/define.js';
 import './text-input/define.js';
 import './text/define.js';
 import './toggle-button/define.js';

package/dist/dts/index.d.ts

@@ -6,7 +6,7 @@ export { Avatar, AvatarActive, AvatarAppearance, AvatarColor, AvatarDefinition,
 export { Badge, BadgeAppearance, BadgeColor, BadgeDefinition, BadgeShape, BadgeSize, BadgeStyles, BadgeTemplate, } from './badge/index.js';
 export { BaseButton, Button, ButtonAppearance, ButtonDefinition, ButtonFormTarget, ButtonShape, ButtonSize, ButtonStyles, ButtonTemplate, ButtonType, } from './button/index.js';
 export type { ButtonOptions } from './button/index.js';
-export { Checkbox, CheckboxDefinition, CheckboxShape, CheckboxSize, CheckboxStyles, CheckboxTemplate, } from './checkbox/index.js';
+export { BaseCheckbox, Checkbox, CheckboxDefinition, CheckboxShape, CheckboxSize, CheckboxStyles, CheckboxTemplate, } from './checkbox/index.js';
 export type { CheckboxOptions } from './checkbox/index.js';
 export { CompoundButton, CompoundButtonAppearance, CompoundButtonDefinition, CompoundButtonShape, CompoundButtonSize, CompoundButtonStyles, CompoundButtonTemplate, } from './compound-button/index.js';
 export { CounterBadge, CounterBadgeAppearance, CounterBadgeColor, CounterBadgeDefinition, CounterBadgeShape, CounterBadgeSize, CounterBadgeStyles, CounterBadgeTemplate, } from './counter-badge/index.js';
@@ -20,7 +20,7 @@ export type { SlottableInput } from './field/index.js';
 export { FluentDesignSystem } from './fluent-design-system.js';
 export { Image, ImageDefinition, ImageFit, ImageShape, ImageStyles, ImageTemplate } from './image/index.js';
 export { Label, LabelDefinition, LabelSize, LabelStyles, LabelTemplate, LabelWeight } from './label/index.js';
-export { AnchorButton, AnchorButtonAppearance, AnchorButtonDefinition, AnchorButtonShape, AnchorButtonSize, AnchorButtonTemplate, AnchorTarget, } from './anchor-button/index.js';
+export { BaseAnchor, AnchorButton, AnchorButtonAppearance, AnchorButtonDefinition, AnchorButtonShape, AnchorButtonSize, AnchorButtonTemplate, AnchorTarget, } from './anchor-button/index.js';
 export { MenuButton, MenuButtonAppearance, MenuButtonDefinition, MenuButtonShape, MenuButtonSize, MenuButtonStyles, MenuButtonTemplate, } from './menu-button/index.js';
 export type { MenuButtonOptions } from './menu-button/index.js';
 export { MenuItem, MenuItemDefinition, MenuItemRole, MenuItemStyles, MenuItemTemplate, roleForMenuItem, } from './menu-item/index.js';
@@ -46,6 +46,7 @@ export type { TabOptions } from './tab/index.js';
 export { Tabs, TabsAppearance, TabsDefinition, TabsOrientation, TabsSize, TabsStyles, TabsTemplate, } from './tabs/index.js';
 export { BaseTablist, Tablist, TablistAppearance, TablistDefinition, TablistOrientation, TablistSize, TablistStyles, TablistTemplate, } from './tablist/index.js';
 export type { TabsOptions } from './tabs/index.js';
+export { BaseTextArea, TextArea, TextAreaAppearance, TextAreaAutocomplete, TextAreaDefinition, TextAreaResize, TextAreaSize, TextAreaStyles, TextAreaTemplate, } from './textarea/index.js';
 export { BaseTextInput, TextInput, TextInputAppearance, TextInputControlSize, TextInputDefinition, TextInputStyles, TextInputTemplate, TextInputType, } from './text-input/index.js';
 export type { TextInputOptions } from './text-input/index.js';
 export { Text, TextAlign, TextDefinition, TextFont, TextSize, TextStyles, TextTemplate, TextWeight, } from './text/index.js';

package/dist/dts/menu/menu.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="web" />
 import { FASTElement } from '@microsoft/fast-element';
 import { MenuList } from '../menu-list/menu-list.js';
 /**
@@ -135,7 +134,7 @@ export declare class Menu extends FASTElement {
      * @param e - the event
      * @returns void
      */
-    toggleHandler: (e: Event | ToggleEvent) => void;
+    toggleHandler: (e: Event) => void;
     /**
      * Called whenever the 'openOnHover' property changes.
      * Adds or removes a 'mouseover' event listener to the trigger based on the new value.

package/dist/dts/menu-item/menu-item.d.ts

@@ -1,8 +1,7 @@
-/// <reference types="web" />
 import { ElementsFilter, FASTElement } from '@microsoft/fast-element';
-import type { StaticallyComposableHTML } from '../utils/template-helpers.js';
 import type { StartEndOptions } from '../patterns/start-end.js';
 import { StartEnd } from '../patterns/start-end.js';
+import type { StaticallyComposableHTML } from '../utils/template-helpers.js';
 import { MenuItemRole, roleForMenuItem } from './menu-item.options.js';
 export type MenuItemColumnCount = 0 | 1 | 2;
 export { MenuItemRole, roleForMenuItem };
@@ -128,7 +127,7 @@ export declare class MenuItem extends FASTElement {
      * Setup required ARIA on open/close
      * @internal
      */
-    toggleHandler: (e: ToggleEvent | Event) => void;
+    toggleHandler: (e: Event) => void;
     /**
      * @internal
      */

package/dist/dts/slider/slider.d.ts

@@ -7,7 +7,7 @@ import { SliderConfiguration, SliderMode, SliderSize } from './slider.options.js
  * @slot thumb - The slot for a custom thumb element.
  * @csspart thumb-container - The container element of the thumb.
  * @csspart track-container - The container element of the track.
- * @fire change - Fires a custom 'change' event when the value changes.
+ * @fires change - Fires a custom 'change' event when the value changes.
  *
  * @public
  */

package/dist/dts/styles/states/index.d.ts

@@ -218,3 +218,39 @@ export declare const expandedState: import("@microsoft/fast-element").CSSDirecti
  * @public
  */
 export declare const blockState: import("@microsoft/fast-element").CSSDirective;
+/**
+ * Selector for the `resize` state. This indicates the element is resizable.
+ * @public
+ */
+export declare const resizeState: import("@microsoft/fast-element").CSSDirective;
+/**
+ * Selector for the `resize-horizontal` state.
+ * @public
+ */
+export declare const resizeHorizontalState: import("@microsoft/fast-element").CSSDirective;
+/**
+ * Selector for the `resize-vertical` state.
+ * @public
+ */
+export declare const resizeVerticalState: import("@microsoft/fast-element").CSSDirective;
+/**
+ * Selector for the `resize-both` state.
+ * @public
+ */
+export declare const resizeBothState: import("@microsoft/fast-element").CSSDirective;
+/**
+ * Selector for the `auto-resize` state.
+ * @public
+ */
+export declare const autoResizeState: import("@microsoft/fast-element").CSSDirective;
+/**
+ * Selector for the `display-shadow` state.
+ * @public
+ */
+export declare const displayShadowState: import("@microsoft/fast-element").CSSDirective;
+export declare const userInvalidState: import("@microsoft/fast-element").CSSDirective;
+/**
+ * Selector for the `user-valid` state.
+ * @public
+ */
+export declare const userValidState: import("@microsoft/fast-element").CSSDirective;

package/dist/dts/textarea/define.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/dts/textarea/index.d.ts

@@ -0,0 +1,5 @@
+export { definition as TextAreaDefinition } from './textarea.definition.js';
+export { BaseTextArea, TextArea } from './textarea.js';
+export { TextAreaAppearance, TextAreaAppearancesForDisplayShadow, TextAreaAutocomplete, TextAreaResizableResize, TextAreaHorizontallyResizableResize, TextAreaVerticallyResizableResize, TextAreaResize, TextAreaSize, } from './textarea.options.js';
+export { styles as TextAreaStyles } from './textarea.styles.js';
+export { template as TextAreaTemplate } from './textarea.template.js';

package/dist/dts/textarea/textarea.bench.d.ts

@@ -0,0 +1,3 @@
+declare const itemRenderer: () => HTMLElement;
+export default itemRenderer;
+export { tests } from '../utils/benchmark-wrapper.js';

package/dist/dts/textarea/textarea.d.ts

@@ -0,0 +1,390 @@
+import { FASTElement } from '@microsoft/fast-element';
+import type { Label } from '../label/label.js';
+import { TextAreaAppearance, TextAreaAutocomplete, TextAreaResize, TextAreaSize } from './textarea.options.js';
+/**
+ * A Text Area Custom HTML Element.
+ * Based largely on the {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea | `<textarea>`} element.
+ *
+ * @slot - The default content/value of the component.
+ * @slot label - The content for the `<label>`, it should be a `<fluent-label>` element.
+ * @csspart label - The `<label>` element.
+ * @csspart root - The container element of the `<textarea>` element.
+ * @csspart control - The internal `<textarea>` element.
+ * @fires change - Fires after the control loses focus, if the content has changed.
+ * @fires select - Fires when the `select()` method is called.
+ *
+ * @public
+ */
+export declare class BaseTextArea extends FASTElement {
+    /**
+     * The form-associated flag.
+     * @see {@link https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements-face-example | Form-associated custom elements}
+     *
+     * @public
+     */
+    static readonly formAssociated = true;
+    /**
+     * The internal {@link https://developer.mozilla.org/docs/Web/API/ElementInternals | `ElementInternals`} instance for the component.
+     *
+     * @internal
+     */
+    elementInternals: ElementInternals;
+    /**
+     * The `<label>` element.
+     * @internal
+     */
+    labelEl: HTMLLabelElement;
+    /**
+     * The `<textarea>` element.
+     * @internal
+     */
+    controlEl: HTMLTextAreaElement;
+    /**
+     * @internal
+     */
+    autoSizerEl?: HTMLDivElement;
+    /**
+     * The list of nodes that are assigned to the default slot.
+     * @internal
+     */
+    defaultSlottedNodes: Node[];
+    protected defaultSlottedNodesChanged(): void;
+    /**
+     * The list of nodes that are assigned to the `label` slot.
+     * @internal
+     */
+    labelSlottedNodes: Label[];
+    protected labelSlottedNodesChanged(): void;
+    private userInteracted;
+    private autoSizerObserver?;
+    private controlElAttrObserver;
+    private preConnectControlEl;
+    /**
+     * Indicates the element's autocomplete state.
+     * @see The {@link https://developer.mozilla.org/docs/Web/HTML/Attributes/autocomplete | `autocomplete`} attribute
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `autocomplete`
+     */
+    autocomplete?: TextAreaAutocomplete;
+    /**
+     * Indicates whether the element’s block size (height) should be automatically changed based on the content.
+     * Note: When this property’s value is set to be `true`, the element should not have a fixed block-size
+     * defined in CSS. Instead, use `min-height` or `min-block-size`.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `auto-resize`
+     */
+    autoResize: boolean;
+    protected autoResizeChanged(): void;
+    /**
+     * Sets the name of the value directionality to be submitted with form data.
+     * @see The {@link https://developer.mozilla.org/docs/Web/HTML/Attributes/dirname | `dirname`} attribute
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `dirname`
+     */
+    dirName?: string;
+    /**
+     * Sets the element's disabled state.
+     * @see The {@link https://developer.mozilla.org/docs/Web/HTML/Attributes/disabled | `disabled`} attribute
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `disabled`
+     */
+    disabled: boolean;
+    protected disabledChanged(): void;
+    /**
+     * Indicates whether the element displays a box shadow. This only has effect when `appearance` is set to be `filled-darker` or `filled-lighter`.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `display-shadow`
+     */
+    displayShadow: boolean;
+    /**
+     * The id of a form to associate the element to.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `form`
+     */
+    initialForm?: string;
+    /**
+     * The form element that’s associated to the element, or `null` if no form is associated.
+     *
+     * @public
+     */
+    get form(): HTMLFormElement | null;
+    /**
+     * A `NodeList` of `<label>` element associated with the element.
+     * @see The {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLTextAreaElement/labels | `labels`} property
+     *
+     * @public
+     */
+    get labels(): NodeList;
+    /**
+     * The maximum number of characters a user can enter.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `maxlength`
+     */
+    maxLength?: number;
+    /**
+     * The minimum number of characters a user can enter.
+     * @see The {@link https://developer.mozilla.org/docs/Web/HTML/Attributes/minlength | `minlength`} attribute
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `minlength`
+     */
+    minLength?: number;
+    /**
+     * The name of the element. This element's value will be surfaced during form submission under the provided name.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `name`
+     */
+    name: string;
+    /**
+     * Sets the placeholder value of the element, generally used to provide a hint to the user.
+     * @see The {@link https://developer.mozilla.org/docs/Web/HTML/Attributes/placeholder | `placeholder`} attribute
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `placeholder`
+     * This attribute is not a valid substitute for a label.
+     */
+    placeholder?: string;
+    /**
+     * When true, the control will be immutable by user interaction.
+     * @see The {@link https://developer.mozilla.org/docs/Web/HTML/Attributes/readonly | `readonly`} attribute
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `readonly`
+     */
+    readOnly: boolean;
+    protected readOnlyChanged(): void;
+    /**
+     * The element's required attribute.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `required`
+     */
+    required: boolean;
+    protected requiredChanged(): void;
+    /**
+     * Indicates whether the element can be resized by end users.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `resize`
+     */
+    resize: TextAreaResize;
+    protected resizeChanged(prev: TextAreaResize | undefined, next: TextAreaResize | undefined): void;
+    /**
+     * Controls whether or not to enable spell checking for the input field, or if the default spell checking configuration should be used.
+     * @see The {@link https://developer.mozilla.org/docs/Web/HTML/Global_attributes/spellcheck | `spellcheck`} attribute
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `spellcheck`
+     */
+    spellcheck: boolean;
+    /**
+     * The length of the current value.
+     * @see The {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLTextAreaElement#textLength | 'textLength'} property
+     *
+     * @public
+     */
+    get textLength(): number;
+    /**
+     * The type of the element, which is always "textarea".
+     * @see The {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLTextAreaElement/type | `type`} property
+     *
+     * @public
+     */
+    get type(): 'textarea';
+    /**
+     * The element's validity state.
+     *
+     * @public
+     * @remarks
+     * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/validity | `ElementInternals.validity`} property.
+     */
+    get validity(): ValidityState;
+    /**
+     * The validation message.
+     *
+     * @public
+     * @remarks
+     * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/validationMessage | `ElementInternals.validationMessage`} property.
+     */
+    get validationMessage(): string;
+    /**
+     * Determines if the control can be submitted for constraint validation.
+     *
+     * @public
+     * @remarks
+     * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/willValidate | `ElementInternals.willValidate`} property.
+     */
+    get willValidate(): boolean;
+    /**
+     * The text content of the element before user interaction.
+     * @see The {@link https://developer.mozilla.org/en-US/docs/Web/API/HTMLTextAreaElement#defaultvalue | `defaultValue`} property
+     *
+     * @public
+     * @remarks
+     * In order to set the initial/default value, an author should either add the default value in the HTML as the children
+     * of the component, or setting this property in JavaScript. Setting `innerHTML`, `innerText`, or `textContent` on this
+     * component will not change the default value or the content displayed inside the component.
+     */
+    get defaultValue(): string;
+    set defaultValue(next: string);
+    /**
+     * The value of the element.
+     *
+     * @public
+     * @remarks
+     * Reflects the `value` property.
+     */
+    get value(): string;
+    set value(next: string);
+    constructor();
+    /**
+     * @internal
+     */
+    connectedCallback(): void;
+    /**
+     * @internal
+     */
+    disconnectedCallback(): void;
+    /**
+     * Resets the value to its initial value when the form is reset.
+     *
+     * @internal
+     */
+    formResetCallback(): void;
+    /**
+     * @internal
+     */
+    formDisabledCallback(disabled: boolean): void;
+    /**
+     * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/setFormValue | `ElementInternals.setFormValue()`} method.
+     *
+     * @internal
+     */
+    setFormValue(value: File | string | FormData | null, state?: File | string | FormData | null): void;
+    /**
+     * Checks the validity of the element and returns the result.
+     *
+     * @public
+     * @remarks
+     * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/checkValidity | `HTMLInputElement.checkValidity()`} method.
+     */
+    checkValidity(): boolean;
+    /**
+     * Reports the validity of the element.
+     *
+     * @public
+     * @remarks
+     * Reflects the {@link https://developer.mozilla.org/docs/Web/API/ElementInternals/reportValidity | `HTMLInputElement.reportValidity()`} method.
+     */
+    reportValidity(): boolean;
+    /**
+     * Sets the custom validity message.
+     * @param message - The message to set
+     *
+     * @public
+     */
+    setCustomValidity(message: string | null): void;
+    /**
+     * Sets the validity of the control.
+     *
+     * @param flags - Validity flags. If not provided, the control's `validity` will be used.
+     * @param message - Optional message to supply. If not provided, the control's `validationMessage` will be used. If the control does not have a `validationMessage`, the message will be empty.
+     * @param anchor - Optional anchor to use for the validation message. If not provided, the control will be used.
+     *
+     * @internal
+     */
+    setValidity(flags?: Partial<ValidityState>, message?: string, anchor?: HTMLElement): void;
+    /**
+     * Selects the content in the element.
+     *
+     * @public
+     */
+    select(): void;
+    private setDefaultValue;
+    private bindEvents;
+    /**
+     * Gets the content inside the light DOM, if any HTML element is present, use its `outerHTML` value.
+     */
+    private getContent;
+    private observeControlElAttrs;
+    private setDisabledSideEffect;
+    private toggleUserValidityState;
+    private maybeCreateAutoSizerEl;
+    /**
+     * @internal
+     */
+    handleControlInput(): void;
+    /**
+     * @internal
+     */
+    handleControlChange(): void;
+    /**
+     * @internal
+     */
+    handleControlSelect(): void;
+}
+export declare class TextArea extends BaseTextArea {
+    protected labelSlottedNodesChanged(): void;
+    /**
+     * Indicates the visual appearance of the element.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `appearance`
+     */
+    appearance: TextAreaAppearance;
+    protected appearanceChanged(prev: TextAreaAppearance | undefined, next: TextAreaAppearance | undefined): void;
+    /**
+     * Indicates whether the textarea should be a block-level element.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `block`
+     */
+    block: boolean;
+    protected blockChanged(): void;
+    /**
+     * Sets the size of the control.
+     *
+     * @public
+     * @remarks
+     * HTML Attribute: `size`
+     */
+    size?: TextAreaSize;
+    protected sizeChanged(prev: TextAreaSize | undefined, next: TextAreaSize | undefined): void;
+    /**
+     * @internal
+     */
+    handleChange(_: any, propertyName: string): void;
+    /**
+     * @internal
+     */
+    connectedCallback(): void;
+    /**
+     * @internal
+     */
+    disconnectedCallback(): void;
+    private maybeDisplayShadow;
+}

package/dist/dts/textarea/textarea.definition.d.ts

@@ -0,0 +1,9 @@
+import { TextArea } from './textarea.js';
+/**
+ * The Fluent Textarea Element definition.
+ *
+ * @public
+ * @remarks
+ * HTML Element: `<fluent-textarea>`
+ */
+export declare const definition: import("@microsoft/fast-element").FASTElementDefinition<typeof TextArea>;

package/dist/dts/textarea/textarea.options.d.ts

@@ -0,0 +1,47 @@
+import type { ValuesOf } from '../utils/typings.js';
+/**
+ * Values for the `size` attribute on TextArea elements.
+ *
+ * @public
+ */
+export declare const TextAreaSize: {
+    readonly small: "small";
+    readonly medium: "medium";
+    readonly large: "large";
+};
+export type TextAreaSize = ValuesOf<typeof TextAreaSize>;
+/**
+ * Values for the `appearance` attribute on TextArea elements.
+ *
+ * @public
+ */
+export declare const TextAreaAppearance: {
+    readonly outline: "outline";
+    readonly filledLighter: "filled-lighter";
+    readonly filledDarker: "filled-darker";
+};
+export type TextAreaAppearance = ValuesOf<typeof TextAreaAppearance>;
+export declare const TextAreaAppearancesForDisplayShadow: Partial<TextAreaAppearance[]>;
+/**
+ * Values for the `autocomplete` attribute on TextArea elements.
+ *
+ * @public
+ */
+export declare const TextAreaAutocomplete: {
+    readonly on: "on";
+    readonly off: "off";
+};
+export type TextAreaAutocomplete = ValuesOf<typeof TextAreaAutocomplete>;
+/**
+ * Values for the `resize` attribute on TextArea elements.
+ */
+export declare const TextAreaResize: {
+    readonly none: "none";
+    readonly both: "both";
+    readonly horizontal: "horizontal";
+    readonly vertical: "vertical";
+};
+export type TextAreaResize = ValuesOf<typeof TextAreaResize>;
+export declare const TextAreaResizableResize: Partial<TextAreaResize[]>;
+export declare const TextAreaVerticallyResizableResize: Partial<TextAreaResize[]>;
+export declare const TextAreaHorizontallyResizableResize: Partial<TextAreaResize[]>;

package/dist/dts/textarea/textarea.styles.d.ts

@@ -0,0 +1,7 @@
+import type { ElementStyles } from '@microsoft/fast-element';
+/**
+ * Styles for the TextArea component.
+ *
+ * @public
+ */
+export declare const styles: ElementStyles;