@fluentui/react-textarea 9.6.16 → 9.7.0

package/CHANGELOG.md

@@ -1,17 +1,27 @@
 # Change Log - @fluentui/react-textarea
 
-This log was last generated on Wed, 11 Mar 2026 09:20:38 GMT and should not be manually modified.
+This log was last generated on Thu, 26 Mar 2026 08:10:43 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.7.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-textarea_v9.7.0)
+
+Thu, 26 Mar 2026 08:10:43 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-textarea_v9.6.16..@fluentui/react-textarea_v9.7.0)
+
+### Minor changes
+
+- feat: expose base hook and types for Textarea ([PR #35886](https://github.com/microsoft/fluentui/pull/35886) by dmytrokirpa@microsoft.com)
+- feat: add base hooks for Textarea ([PR #35822](https://github.com/microsoft/fluentui/pull/35822) by dmytrokirpa@microsoft.com)
+
 ## [9.6.16](https://github.com/microsoft/fluentui/tree/@fluentui/react-textarea_v9.6.16)
 
-Wed, 11 Mar 2026 09:20:38 GMT 
+Wed, 11 Mar 2026 09:22:22 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-textarea_v9.6.15..@fluentui/react-textarea_v9.6.16)
 
 ### Patches
 
-- Bump @fluentui/react-field to v9.4.16 ([PR #35854](https://github.com/microsoft/fluentui/pull/35854) by beachball)
+- Bump @fluentui/react-field to v9.4.16 ([PR #35859](https://github.com/microsoft/fluentui/pull/35859) by beachball)
 
 ## [9.6.15](https://github.com/microsoft/fluentui/tree/@fluentui/react-textarea_v9.6.15)
 

package/dist/index.d.ts

@@ -16,6 +16,17 @@ export declare const renderTextarea_unstable: (state: TextareaState) => JSXEleme
  */
 export declare const Textarea: ForwardRefComponent<TextareaProps>;
 
+/**
+ * Textarea base props, excluding design-related props like appearance and size.
+ * Note: resize is kept as it is a structural/behavioral prop.
+ */
+export declare type TextareaBaseProps = Omit<TextareaProps, 'appearance' | 'size'>;
+
+/**
+ * Textarea base state, excluding design-related state like appearance and size.
+ */
+export declare type TextareaBaseState = Omit<TextareaState, 'appearance' | 'size'>;
+
 export declare const textareaClassNames: SlotClassNames<TextareaSlots>;
 
 /**
@@ -93,6 +104,15 @@ export declare type TextareaState = ComponentState<TextareaSlots> & Required<Pic
  */
 export declare const useTextarea_unstable: (props: TextareaProps, ref: React_2.Ref<HTMLTextAreaElement>) => TextareaState;
 
+/**
+ * Base hook for Textarea component, which manages state related to slots structure and
+ * controlled/uncontrolled value state.
+ *
+ * @param props - User provided props to the Textarea component.
+ * @param ref - User provided ref to be passed to the Textarea component.
+ */
+export declare const useTextareaBase_unstable: (props: TextareaBaseProps, ref?: React_2.Ref<HTMLTextAreaElement>) => TextareaBaseState;
+
 /**
  * Apply styling to the Textarea slots based on the state
  */

package/lib/Textarea.js

@@ -1 +1 @@
-export { Textarea, renderTextarea_unstable, textareaClassNames, useTextareaStyles_unstable, useTextarea_unstable } from './components/Textarea/index';
+export { Textarea, renderTextarea_unstable, textareaClassNames, useTextareaStyles_unstable, useTextarea_unstable, useTextareaBase_unstable } from './components/Textarea/index';

package/lib/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/Textarea.ts"],"sourcesContent":["export type { TextareaOnChangeData, TextareaProps, TextareaSlots, TextareaState } from './components/Textarea/index';\nexport {\n  Textarea,\n  renderTextarea_unstable,\n  textareaClassNames,\n  useTextareaStyles_unstable,\n  useTextarea_unstable,\n} from './components/Textarea/index';\n"],"names":["Textarea","renderTextarea_unstable","textareaClassNames","useTextareaStyles_unstable","useTextarea_unstable"],"mappings":"AACA,SACEA,QAAQ,EACRC,uBAAuB,EACvBC,kBAAkB,EAClBC,0BAA0B,EAC1BC,oBAAoB,QACf,8BAA8B"}
+{"version":3,"sources":["../src/Textarea.ts"],"sourcesContent":["export type {\n  TextareaBaseProps,\n  TextareaBaseState,\n  TextareaOnChangeData,\n  TextareaProps,\n  TextareaSlots,\n  TextareaState,\n} from './components/Textarea/index';\nexport {\n  Textarea,\n  renderTextarea_unstable,\n  textareaClassNames,\n  useTextareaStyles_unstable,\n  useTextarea_unstable,\n  useTextareaBase_unstable,\n} from './components/Textarea/index';\n"],"names":["Textarea","renderTextarea_unstable","textareaClassNames","useTextareaStyles_unstable","useTextarea_unstable","useTextareaBase_unstable"],"mappings":"AAQA,SACEA,QAAQ,EACRC,uBAAuB,EACvBC,kBAAkB,EAClBC,0BAA0B,EAC1BC,oBAAoB,EACpBC,wBAAwB,QACnB,8BAA8B"}

package/lib/components/Textarea/Textarea.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Textarea/Textarea.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type TextareaSlots = {\n  /**\n   * Wrapper element used for displaying the borders for Textarea. This wrapper is needed due to the focus\n   * indicator border animation. For more information, see Spec.md\n   *\n   * The root only receives `className` and `style`. All other props are applied to the `textarea` slot.\n   */\n  root: NonNullable<Slot<'span'>>;\n\n  /**\n   * The `<textarea>` element. This is the primary slot, all native props and ref are applied to this slot.\n   */\n  textarea: NonNullable<Slot<'textarea'>>;\n};\n\n/**\n * Textarea Props\n */\nexport type TextareaProps = Omit<\n  ComponentProps<Partial<TextareaSlots>, 'textarea'>,\n  'defaultValue' | 'onChange' | 'size' | 'value'\n> & {\n  /**\n   * Styling the Textarea should use.\n   *\n   * @default outline\n   *\n   * Note: 'filled-darker-shadow' and 'filled-lighter-shadow' are deprecated and will be removed in the future.\n   */\n  appearance?: 'outline' | 'filled-darker' | 'filled-lighter' | 'filled-darker-shadow' | 'filled-lighter-shadow';\n\n  /**\n   * The default value of the Textarea.\n   */\n  defaultValue?: string;\n\n  /**\n   * Callback for when the user changes the value.\n   */\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n  onChange?: (ev: React.ChangeEvent<HTMLTextAreaElement>, data: TextareaOnChangeData) => void;\n\n  /**\n   * Which direction the Textarea is allowed to be resized.\n   *\n   * @default none\n   */\n  resize?: 'none' | 'horizontal' | 'vertical' | 'both';\n\n  /**\n   * Size of the Textarea.\n   *\n   * @default medium\n   */\n  size?: 'small' | 'medium' | 'large';\n\n  /**\n   * The value of the Textarea.\n   */\n  value?: string;\n};\n\n/**\n * State used in rendering Textarea\n */\nexport type TextareaState = ComponentState<TextareaSlots> &\n  Required<Pick<TextareaProps, 'appearance' | 'resize' | 'size'>>;\n\n/**\n * Data passed to the `onChange` callback when the textarea's value changes.\n */\nexport type TextareaOnChangeData = {\n  value: string;\n};\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
+{"version":3,"sources":["../src/components/Textarea/Textarea.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type TextareaSlots = {\n  /**\n   * Wrapper element used for displaying the borders for Textarea. This wrapper is needed due to the focus\n   * indicator border animation. For more information, see Spec.md\n   *\n   * The root only receives `className` and `style`. All other props are applied to the `textarea` slot.\n   */\n  root: NonNullable<Slot<'span'>>;\n\n  /**\n   * The `<textarea>` element. This is the primary slot, all native props and ref are applied to this slot.\n   */\n  textarea: NonNullable<Slot<'textarea'>>;\n};\n\n/**\n * Textarea Props\n */\nexport type TextareaProps = Omit<\n  ComponentProps<Partial<TextareaSlots>, 'textarea'>,\n  'defaultValue' | 'onChange' | 'size' | 'value'\n> & {\n  /**\n   * Styling the Textarea should use.\n   *\n   * @default outline\n   *\n   * Note: 'filled-darker-shadow' and 'filled-lighter-shadow' are deprecated and will be removed in the future.\n   */\n  appearance?: 'outline' | 'filled-darker' | 'filled-lighter' | 'filled-darker-shadow' | 'filled-lighter-shadow';\n\n  /**\n   * The default value of the Textarea.\n   */\n  defaultValue?: string;\n\n  /**\n   * Callback for when the user changes the value.\n   */\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n  onChange?: (ev: React.ChangeEvent<HTMLTextAreaElement>, data: TextareaOnChangeData) => void;\n\n  /**\n   * Which direction the Textarea is allowed to be resized.\n   *\n   * @default none\n   */\n  resize?: 'none' | 'horizontal' | 'vertical' | 'both';\n\n  /**\n   * Size of the Textarea.\n   *\n   * @default medium\n   */\n  size?: 'small' | 'medium' | 'large';\n\n  /**\n   * The value of the Textarea.\n   */\n  value?: string;\n};\n\n/**\n * Textarea base props, excluding design-related props like appearance and size.\n * Note: resize is kept as it is a structural/behavioral prop.\n */\nexport type TextareaBaseProps = Omit<TextareaProps, 'appearance' | 'size'>;\n\n/**\n * State used in rendering Textarea\n */\nexport type TextareaState = ComponentState<TextareaSlots> &\n  Required<Pick<TextareaProps, 'appearance' | 'resize' | 'size'>>;\n\n/**\n * Textarea base state, excluding design-related state like appearance and size.\n */\nexport type TextareaBaseState = Omit<TextareaState, 'appearance' | 'size'>;\n\n/**\n * Data passed to the `onChange` callback when the textarea's value changes.\n */\nexport type TextareaOnChangeData = {\n  value: string;\n};\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}

package/lib/components/Textarea/index.js

@@ -1,4 +1,4 @@
 export { Textarea } from './Textarea';
 export { renderTextarea_unstable } from './renderTextarea';
-export { useTextarea_unstable } from './useTextarea';
+export { useTextarea_unstable, useTextareaBase_unstable } from './useTextarea';
 export { textareaClassNames, useTextareaStyles_unstable } from './useTextareaStyles.styles';

package/lib/components/Textarea/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Textarea/index.ts"],"sourcesContent":["export { Textarea } from './Textarea';\nexport type { TextareaOnChangeData, TextareaProps, TextareaSlots, TextareaState } from './Textarea.types';\nexport { renderTextarea_unstable } from './renderTextarea';\nexport { useTextarea_unstable } from './useTextarea';\nexport { textareaClassNames, useTextareaStyles_unstable } from './useTextareaStyles.styles';\n"],"names":["Textarea","renderTextarea_unstable","useTextarea_unstable","textareaClassNames","useTextareaStyles_unstable"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,aAAa;AAEtC,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,kBAAkB,EAAEC,0BAA0B,QAAQ,6BAA6B"}
+{"version":3,"sources":["../src/components/Textarea/index.ts"],"sourcesContent":["export { Textarea } from './Textarea';\nexport type {\n  TextareaBaseProps,\n  TextareaBaseState,\n  TextareaOnChangeData,\n  TextareaProps,\n  TextareaSlots,\n  TextareaState,\n} from './Textarea.types';\nexport { renderTextarea_unstable } from './renderTextarea';\nexport { useTextarea_unstable, useTextareaBase_unstable } from './useTextarea';\nexport { textareaClassNames, useTextareaStyles_unstable } from './useTextareaStyles.styles';\n"],"names":["Textarea","renderTextarea_unstable","useTextarea_unstable","useTextareaBase_unstable","textareaClassNames","useTextareaStyles_unstable"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,aAAa;AAStC,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,oBAAoB,EAAEC,wBAAwB,QAAQ,gBAAgB;AAC/E,SAASC,kBAAkB,EAAEC,0BAA0B,QAAQ,6BAA6B"}

package/lib/components/Textarea/useTextarea.js

@@ -12,19 +12,34 @@ import { useOverrides_unstable as useOverrides } from '@fluentui/react-shared-co
  * @param props - props from this instance of Textarea
  * @param ref - reference to root HTMLElement of Textarea
  */ export const useTextarea_unstable = (props, ref)=>{
-    // Merge props from surrounding <Field>, if any
-    props = useFieldControlProps_unstable(props, {
-        supportsLabelFor: true,
-        supportsRequired: true,
-        supportsSize: true
-    });
     const overrides = useOverrides();
     var _overrides_inputDefaultAppearance;
-    const { size = 'medium', appearance = (_overrides_inputDefaultAppearance = overrides.inputDefaultAppearance) !== null && _overrides_inputDefaultAppearance !== void 0 ? _overrides_inputDefaultAppearance : 'outline', resize = 'none', onChange } = props;
+    const { size = 'medium', appearance = (_overrides_inputDefaultAppearance = overrides.inputDefaultAppearance) !== null && _overrides_inputDefaultAppearance !== void 0 ? _overrides_inputDefaultAppearance : 'outline', ...baseProps } = props;
     if (process.env.NODE_ENV !== 'production' && (appearance === 'filled-darker-shadow' || appearance === 'filled-lighter-shadow')) {
         // eslint-disable-next-line no-console
         console.error("The 'filled-darker-shadow' and 'filled-lighter-shadow' appearances are deprecated and will be removed in the" + ' future.');
     }
+    const baseState = useTextareaBase_unstable(baseProps, ref);
+    return {
+        ...baseState,
+        size,
+        appearance
+    };
+};
+/**
+ * Base hook for Textarea component, which manages state related to slots structure and
+ * controlled/uncontrolled value state.
+ *
+ * @param props - User provided props to the Textarea component.
+ * @param ref - User provided ref to be passed to the Textarea component.
+ */ export const useTextareaBase_unstable = (props, ref)=>{
+    // Merge props from surrounding <Field>, if any
+    props = useFieldControlProps_unstable(props, {
+        supportsLabelFor: true,
+        supportsRequired: true,
+        supportsSize: true
+    });
+    const { resize = 'none', onChange } = props;
     const [value, setValue] = useControllableState({
         state: props.value,
         defaultState: props.defaultValue,
@@ -40,8 +55,6 @@ import { useOverrides_unstable as useOverrides } from '@fluentui/react-shared-co
         ]
     });
     const state = {
-        size,
-        appearance,
         resize,
         components: {
             root: 'span',

package/lib/components/Textarea/useTextarea.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Textarea/useTextarea.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { getPartitionedNativeProps, useControllableState, useEventCallback, slot } from '@fluentui/react-utilities';\nimport type { TextareaProps, TextareaState } from './Textarea.types';\nimport { useOverrides_unstable as useOverrides } from '@fluentui/react-shared-contexts';\n\n/**\n * Create the state required to render Textarea.\n *\n * The returned state can be modified with hooks such as useTextareaStyles_unstable,\n * before being passed to renderTextarea_unstable.\n *\n * @param props - props from this instance of Textarea\n * @param ref - reference to root HTMLElement of Textarea\n */\nexport const useTextarea_unstable = (props: TextareaProps, ref: React.Ref<HTMLTextAreaElement>): TextareaState => {\n  // Merge props from surrounding <Field>, if any\n  props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true, supportsSize: true });\n\n  const overrides = useOverrides();\n\n  const {\n    size = 'medium',\n    appearance = overrides.inputDefaultAppearance ?? 'outline',\n    resize = 'none',\n    onChange,\n  } = props;\n\n  if (\n    process.env.NODE_ENV !== 'production' &&\n    (appearance === 'filled-darker-shadow' || appearance === 'filled-lighter-shadow')\n  ) {\n    // eslint-disable-next-line no-console\n    console.error(\n      \"The 'filled-darker-shadow' and 'filled-lighter-shadow' appearances are deprecated and will be removed in the\" +\n        ' future.',\n    );\n  }\n\n  const [value, setValue] = useControllableState({\n    state: props.value,\n    defaultState: props.defaultValue,\n    initialState: undefined,\n  });\n\n  const nativeProps = getPartitionedNativeProps({\n    props,\n    primarySlotTagName: 'textarea',\n    excludedPropNames: ['onChange', 'value', 'defaultValue'],\n  });\n\n  const state: TextareaState = {\n    size,\n    appearance,\n    resize,\n    components: {\n      root: 'span',\n      textarea: 'textarea',\n    },\n    textarea: slot.always(props.textarea, {\n      defaultProps: {\n        ref,\n        ...nativeProps.primary,\n      },\n      elementType: 'textarea',\n    }),\n    root: slot.always(props.root, {\n      defaultProps: nativeProps.root,\n      elementType: 'span',\n    }),\n  };\n\n  state.textarea.value = value;\n  state.textarea.onChange = useEventCallback(ev => {\n    const newValue = ev.target.value;\n    onChange?.(ev, { value: newValue });\n    setValue(newValue);\n  });\n\n  return state;\n};\n"],"names":["React","useFieldControlProps_unstable","getPartitionedNativeProps","useControllableState","useEventCallback","slot","useOverrides_unstable","useOverrides","useTextarea_unstable","props","ref","supportsLabelFor","supportsRequired","supportsSize","overrides","size","appearance","inputDefaultAppearance","resize","onChange","process","env","NODE_ENV","console","error","value","setValue","state","defaultState","defaultValue","initialState","undefined","nativeProps","primarySlotTagName","excludedPropNames","components","root","textarea","always","defaultProps","primary","elementType","ev","newValue","target"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,6BAA6B,QAAQ,wBAAwB;AACtE,SAASC,yBAAyB,EAAEC,oBAAoB,EAAEC,gBAAgB,EAAEC,IAAI,QAAQ,4BAA4B;AAEpH,SAASC,yBAAyBC,YAAY,QAAQ,kCAAkC;AAExF;;;;;;;;CAQC,GACD,OAAO,MAAMC,uBAAuB,CAACC,OAAsBC;IACzD,+CAA+C;IAC/CD,QAAQR,8BAA8BQ,OAAO;QAAEE,kBAAkB;QAAMC,kBAAkB;QAAMC,cAAc;IAAK;IAElH,MAAMC,YAAYP;QAIHO;IAFf,MAAM,EACJC,OAAO,QAAQ,EACfC,aAAaF,CAAAA,oCAAAA,UAAUG,sBAAsB,cAAhCH,+CAAAA,oCAAoC,SAAS,EAC1DI,SAAS,MAAM,EACfC,QAAQ,EACT,GAAGV;IAEJ,IACEW,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBACxBN,CAAAA,eAAe,0BAA0BA,eAAe,uBAAsB,GAC/E;QACA,sCAAsC;QACtCO,QAAQC,KAAK,CACX,iHACE;IAEN;IAEA,MAAM,CAACC,OAAOC,SAAS,GAAGvB,qBAAqB;QAC7CwB,OAAOlB,MAAMgB,KAAK;QAClBG,cAAcnB,MAAMoB,YAAY;QAChCC,cAAcC;IAChB;IAEA,MAAMC,cAAc9B,0BAA0B;QAC5CO;QACAwB,oBAAoB;QACpBC,mBAAmB;YAAC;YAAY;YAAS;SAAe;IAC1D;IAEA,MAAMP,QAAuB;QAC3BZ;QACAC;QACAE;QACAiB,YAAY;YACVC,MAAM;YACNC,UAAU;QACZ;QACAA,UAAUhC,KAAKiC,MAAM,CAAC7B,MAAM4B,QAAQ,EAAE;YACpCE,cAAc;gBACZ7B;gBACA,GAAGsB,YAAYQ,OAAO;YACxB;YACAC,aAAa;QACf;QACAL,MAAM/B,KAAKiC,MAAM,CAAC7B,MAAM2B,IAAI,EAAE;YAC5BG,cAAcP,YAAYI,IAAI;YAC9BK,aAAa;QACf;IACF;IAEAd,MAAMU,QAAQ,CAACZ,KAAK,GAAGA;IACvBE,MAAMU,QAAQ,CAAClB,QAAQ,GAAGf,iBAAiBsC,CAAAA;QACzC,MAAMC,WAAWD,GAAGE,MAAM,CAACnB,KAAK;QAChCN,qBAAAA,+BAAAA,SAAWuB,IAAI;YAAEjB,OAAOkB;QAAS;QACjCjB,SAASiB;IACX;IAEA,OAAOhB;AACT,EAAE"}
+{"version":3,"sources":["../src/components/Textarea/useTextarea.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { getPartitionedNativeProps, useControllableState, useEventCallback, slot } from '@fluentui/react-utilities';\nimport type { TextareaBaseProps, TextareaBaseState, TextareaProps, TextareaState } from './Textarea.types';\nimport { useOverrides_unstable as useOverrides } from '@fluentui/react-shared-contexts';\n\n/**\n * Create the state required to render Textarea.\n *\n * The returned state can be modified with hooks such as useTextareaStyles_unstable,\n * before being passed to renderTextarea_unstable.\n *\n * @param props - props from this instance of Textarea\n * @param ref - reference to root HTMLElement of Textarea\n */\nexport const useTextarea_unstable = (props: TextareaProps, ref: React.Ref<HTMLTextAreaElement>): TextareaState => {\n  const overrides = useOverrides();\n\n  const { size = 'medium', appearance = overrides.inputDefaultAppearance ?? 'outline', ...baseProps } = props;\n\n  if (\n    process.env.NODE_ENV !== 'production' &&\n    (appearance === 'filled-darker-shadow' || appearance === 'filled-lighter-shadow')\n  ) {\n    // eslint-disable-next-line no-console\n    console.error(\n      \"The 'filled-darker-shadow' and 'filled-lighter-shadow' appearances are deprecated and will be removed in the\" +\n        ' future.',\n    );\n  }\n\n  const baseState = useTextareaBase_unstable(baseProps, ref);\n\n  return {\n    ...baseState,\n    size,\n    appearance,\n  };\n};\n\n/**\n * Base hook for Textarea component, which manages state related to slots structure and\n * controlled/uncontrolled value state.\n *\n * @param props - User provided props to the Textarea component.\n * @param ref - User provided ref to be passed to the Textarea component.\n */\nexport const useTextareaBase_unstable = (\n  props: TextareaBaseProps,\n  ref?: React.Ref<HTMLTextAreaElement>,\n): TextareaBaseState => {\n  // Merge props from surrounding <Field>, if any\n  props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true, supportsSize: true });\n\n  const { resize = 'none', onChange } = props;\n\n  const [value, setValue] = useControllableState({\n    state: props.value,\n    defaultState: props.defaultValue,\n    initialState: undefined,\n  });\n\n  const nativeProps = getPartitionedNativeProps({\n    props,\n    primarySlotTagName: 'textarea',\n    excludedPropNames: ['onChange', 'value', 'defaultValue'],\n  });\n\n  const state: TextareaBaseState = {\n    resize,\n    components: {\n      root: 'span',\n      textarea: 'textarea',\n    },\n    textarea: slot.always(props.textarea, {\n      defaultProps: {\n        ref,\n        ...nativeProps.primary,\n      },\n      elementType: 'textarea',\n    }),\n    root: slot.always(props.root, {\n      defaultProps: nativeProps.root,\n      elementType: 'span',\n    }),\n  };\n\n  state.textarea.value = value;\n  state.textarea.onChange = useEventCallback(ev => {\n    const newValue = ev.target.value;\n    onChange?.(ev, { value: newValue });\n    setValue(newValue);\n  });\n\n  return state;\n};\n"],"names":["React","useFieldControlProps_unstable","getPartitionedNativeProps","useControllableState","useEventCallback","slot","useOverrides_unstable","useOverrides","useTextarea_unstable","props","ref","overrides","size","appearance","inputDefaultAppearance","baseProps","process","env","NODE_ENV","console","error","baseState","useTextareaBase_unstable","supportsLabelFor","supportsRequired","supportsSize","resize","onChange","value","setValue","state","defaultState","defaultValue","initialState","undefined","nativeProps","primarySlotTagName","excludedPropNames","components","root","textarea","always","defaultProps","primary","elementType","ev","newValue","target"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,6BAA6B,QAAQ,wBAAwB;AACtE,SAASC,yBAAyB,EAAEC,oBAAoB,EAAEC,gBAAgB,EAAEC,IAAI,QAAQ,4BAA4B;AAEpH,SAASC,yBAAyBC,YAAY,QAAQ,kCAAkC;AAExF;;;;;;;;CAQC,GACD,OAAO,MAAMC,uBAAuB,CAACC,OAAsBC;IACzD,MAAMC,YAAYJ;QAEoBI;IAAtC,MAAM,EAAEC,OAAO,QAAQ,EAAEC,aAAaF,CAAAA,oCAAAA,UAAUG,sBAAsB,cAAhCH,+CAAAA,oCAAoC,SAAS,EAAE,GAAGI,WAAW,GAAGN;IAEtG,IACEO,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBACxBL,CAAAA,eAAe,0BAA0BA,eAAe,uBAAsB,GAC/E;QACA,sCAAsC;QACtCM,QAAQC,KAAK,CACX,iHACE;IAEN;IAEA,MAAMC,YAAYC,yBAAyBP,WAAWL;IAEtD,OAAO;QACL,GAAGW,SAAS;QACZT;QACAC;IACF;AACF,EAAE;AAEF;;;;;;CAMC,GACD,OAAO,MAAMS,2BAA2B,CACtCb,OACAC;IAEA,+CAA+C;IAC/CD,QAAQR,8BAA8BQ,OAAO;QAAEc,kBAAkB;QAAMC,kBAAkB;QAAMC,cAAc;IAAK;IAElH,MAAM,EAAEC,SAAS,MAAM,EAAEC,QAAQ,EAAE,GAAGlB;IAEtC,MAAM,CAACmB,OAAOC,SAAS,GAAG1B,qBAAqB;QAC7C2B,OAAOrB,MAAMmB,KAAK;QAClBG,cAActB,MAAMuB,YAAY;QAChCC,cAAcC;IAChB;IAEA,MAAMC,cAAcjC,0BAA0B;QAC5CO;QACA2B,oBAAoB;QACpBC,mBAAmB;YAAC;YAAY;YAAS;SAAe;IAC1D;IAEA,MAAMP,QAA2B;QAC/BJ;QACAY,YAAY;YACVC,MAAM;YACNC,UAAU;QACZ;QACAA,UAAUnC,KAAKoC,MAAM,CAAChC,MAAM+B,QAAQ,EAAE;YACpCE,cAAc;gBACZhC;gBACA,GAAGyB,YAAYQ,OAAO;YACxB;YACAC,aAAa;QACf;QACAL,MAAMlC,KAAKoC,MAAM,CAAChC,MAAM8B,IAAI,EAAE;YAC5BG,cAAcP,YAAYI,IAAI;YAC9BK,aAAa;QACf;IACF;IAEAd,MAAMU,QAAQ,CAACZ,KAAK,GAAGA;IACvBE,MAAMU,QAAQ,CAACb,QAAQ,GAAGvB,iBAAiByC,CAAAA;QACzC,MAAMC,WAAWD,GAAGE,MAAM,CAACnB,KAAK;QAChCD,qBAAAA,+BAAAA,SAAWkB,IAAI;YAAEjB,OAAOkB;QAAS;QACjCjB,SAASiB;IACX;IAEA,OAAOhB;AACT,EAAE"}

package/lib/index.js

@@ -1 +1 @@
-export { Textarea, renderTextarea_unstable, textareaClassNames, useTextareaStyles_unstable, useTextarea_unstable } from './Textarea';
+export { Textarea, renderTextarea_unstable, textareaClassNames, useTextareaStyles_unstable, useTextarea_unstable, useTextareaBase_unstable } from './Textarea';

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Textarea,\n  renderTextarea_unstable,\n  textareaClassNames,\n  useTextareaStyles_unstable,\n  useTextarea_unstable,\n} from './Textarea';\nexport type { TextareaOnChangeData, TextareaProps, TextareaSlots, TextareaState } from './Textarea';\n"],"names":["Textarea","renderTextarea_unstable","textareaClassNames","useTextareaStyles_unstable","useTextarea_unstable"],"mappings":"AAAA,SACEA,QAAQ,EACRC,uBAAuB,EACvBC,kBAAkB,EAClBC,0BAA0B,EAC1BC,oBAAoB,QACf,aAAa"}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Textarea,\n  renderTextarea_unstable,\n  textareaClassNames,\n  useTextareaStyles_unstable,\n  useTextarea_unstable,\n  useTextareaBase_unstable,\n} from './Textarea';\nexport type {\n  TextareaOnChangeData,\n  TextareaProps,\n  TextareaSlots,\n  TextareaState,\n  TextareaBaseProps,\n  TextareaBaseState,\n} from './Textarea';\n"],"names":["Textarea","renderTextarea_unstable","textareaClassNames","useTextareaStyles_unstable","useTextarea_unstable","useTextareaBase_unstable"],"mappings":"AAAA,SACEA,QAAQ,EACRC,uBAAuB,EACvBC,kBAAkB,EAClBC,0BAA0B,EAC1BC,oBAAoB,EACpBC,wBAAwB,QACnB,aAAa"}

package/lib-commonjs/Textarea.js

@@ -18,6 +18,9 @@ _export(exports, {
     textareaClassNames: function() {
         return _index.textareaClassNames;
     },
+    useTextareaBase_unstable: function() {
+        return _index.useTextareaBase_unstable;
+    },
     useTextareaStyles_unstable: function() {
         return _index.useTextareaStyles_unstable;
     },

package/lib-commonjs/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/Textarea.ts"],"sourcesContent":["export type { TextareaOnChangeData, TextareaProps, TextareaSlots, TextareaState } from './components/Textarea/index';\nexport {\n  Textarea,\n  renderTextarea_unstable,\n  textareaClassNames,\n  useTextareaStyles_unstable,\n  useTextarea_unstable,\n} from './components/Textarea/index';\n"],"names":["Textarea","renderTextarea_unstable","textareaClassNames","useTextareaStyles_unstable","useTextarea_unstable"],"mappings":";;;;;;;;;;;;eAEEA,eAAQ;;;eACRC,8BAAuB;;;eACvBC,yBAAkB;;;eAClBC,iCAA0B;;;eAC1BC,2BAAoB;;;uBACf,8BAA8B"}
+{"version":3,"sources":["../src/Textarea.ts"],"sourcesContent":["export type {\n  TextareaBaseProps,\n  TextareaBaseState,\n  TextareaOnChangeData,\n  TextareaProps,\n  TextareaSlots,\n  TextareaState,\n} from './components/Textarea/index';\nexport {\n  Textarea,\n  renderTextarea_unstable,\n  textareaClassNames,\n  useTextareaStyles_unstable,\n  useTextarea_unstable,\n  useTextareaBase_unstable,\n} from './components/Textarea/index';\n"],"names":["Textarea","renderTextarea_unstable","textareaClassNames","useTextareaStyles_unstable","useTextarea_unstable","useTextareaBase_unstable"],"mappings":";;;;;;;;;;;;eASEA,eAAQ;;;eACRC,8BAAuB;;;eACvBC,yBAAkB;;;eAGlBG,+BAAwB;;;eAFxBF,iCAA0B;;;eAC1BC,2BAAoB;;;uBAEf,8BAA8B"}

package/lib-commonjs/components/Textarea/Textarea.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Textarea/Textarea.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type TextareaSlots = {\n  /**\n   * Wrapper element used for displaying the borders for Textarea. This wrapper is needed due to the focus\n   * indicator border animation. For more information, see Spec.md\n   *\n   * The root only receives `className` and `style`. All other props are applied to the `textarea` slot.\n   */\n  root: NonNullable<Slot<'span'>>;\n\n  /**\n   * The `<textarea>` element. This is the primary slot, all native props and ref are applied to this slot.\n   */\n  textarea: NonNullable<Slot<'textarea'>>;\n};\n\n/**\n * Textarea Props\n */\nexport type TextareaProps = Omit<\n  ComponentProps<Partial<TextareaSlots>, 'textarea'>,\n  'defaultValue' | 'onChange' | 'size' | 'value'\n> & {\n  /**\n   * Styling the Textarea should use.\n   *\n   * @default outline\n   *\n   * Note: 'filled-darker-shadow' and 'filled-lighter-shadow' are deprecated and will be removed in the future.\n   */\n  appearance?: 'outline' | 'filled-darker' | 'filled-lighter' | 'filled-darker-shadow' | 'filled-lighter-shadow';\n\n  /**\n   * The default value of the Textarea.\n   */\n  defaultValue?: string;\n\n  /**\n   * Callback for when the user changes the value.\n   */\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n  onChange?: (ev: React.ChangeEvent<HTMLTextAreaElement>, data: TextareaOnChangeData) => void;\n\n  /**\n   * Which direction the Textarea is allowed to be resized.\n   *\n   * @default none\n   */\n  resize?: 'none' | 'horizontal' | 'vertical' | 'both';\n\n  /**\n   * Size of the Textarea.\n   *\n   * @default medium\n   */\n  size?: 'small' | 'medium' | 'large';\n\n  /**\n   * The value of the Textarea.\n   */\n  value?: string;\n};\n\n/**\n * State used in rendering Textarea\n */\nexport type TextareaState = ComponentState<TextareaSlots> &\n  Required<Pick<TextareaProps, 'appearance' | 'resize' | 'size'>>;\n\n/**\n * Data passed to the `onChange` callback when the textarea's value changes.\n */\nexport type TextareaOnChangeData = {\n  value: string;\n};\n"],"names":["React"],"mappings":";;;;;iEAAuB,QAAQ"}
+{"version":3,"sources":["../src/components/Textarea/Textarea.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type TextareaSlots = {\n  /**\n   * Wrapper element used for displaying the borders for Textarea. This wrapper is needed due to the focus\n   * indicator border animation. For more information, see Spec.md\n   *\n   * The root only receives `className` and `style`. All other props are applied to the `textarea` slot.\n   */\n  root: NonNullable<Slot<'span'>>;\n\n  /**\n   * The `<textarea>` element. This is the primary slot, all native props and ref are applied to this slot.\n   */\n  textarea: NonNullable<Slot<'textarea'>>;\n};\n\n/**\n * Textarea Props\n */\nexport type TextareaProps = Omit<\n  ComponentProps<Partial<TextareaSlots>, 'textarea'>,\n  'defaultValue' | 'onChange' | 'size' | 'value'\n> & {\n  /**\n   * Styling the Textarea should use.\n   *\n   * @default outline\n   *\n   * Note: 'filled-darker-shadow' and 'filled-lighter-shadow' are deprecated and will be removed in the future.\n   */\n  appearance?: 'outline' | 'filled-darker' | 'filled-lighter' | 'filled-darker-shadow' | 'filled-lighter-shadow';\n\n  /**\n   * The default value of the Textarea.\n   */\n  defaultValue?: string;\n\n  /**\n   * Callback for when the user changes the value.\n   */\n  // eslint-disable-next-line @nx/workspace-consistent-callback-type -- can't change type of existing callback\n  onChange?: (ev: React.ChangeEvent<HTMLTextAreaElement>, data: TextareaOnChangeData) => void;\n\n  /**\n   * Which direction the Textarea is allowed to be resized.\n   *\n   * @default none\n   */\n  resize?: 'none' | 'horizontal' | 'vertical' | 'both';\n\n  /**\n   * Size of the Textarea.\n   *\n   * @default medium\n   */\n  size?: 'small' | 'medium' | 'large';\n\n  /**\n   * The value of the Textarea.\n   */\n  value?: string;\n};\n\n/**\n * Textarea base props, excluding design-related props like appearance and size.\n * Note: resize is kept as it is a structural/behavioral prop.\n */\nexport type TextareaBaseProps = Omit<TextareaProps, 'appearance' | 'size'>;\n\n/**\n * State used in rendering Textarea\n */\nexport type TextareaState = ComponentState<TextareaSlots> &\n  Required<Pick<TextareaProps, 'appearance' | 'resize' | 'size'>>;\n\n/**\n * Textarea base state, excluding design-related state like appearance and size.\n */\nexport type TextareaBaseState = Omit<TextareaState, 'appearance' | 'size'>;\n\n/**\n * Data passed to the `onChange` callback when the textarea's value changes.\n */\nexport type TextareaOnChangeData = {\n  value: string;\n};\n"],"names":["React"],"mappings":";;;;;iEAAuB,QAAQ"}

package/lib-commonjs/components/Textarea/index.js

@@ -18,6 +18,9 @@ _export(exports, {
     textareaClassNames: function() {
         return _useTextareaStylesstyles.textareaClassNames;
     },
+    useTextareaBase_unstable: function() {
+        return _useTextarea.useTextareaBase_unstable;
+    },
     useTextareaStyles_unstable: function() {
         return _useTextareaStylesstyles.useTextareaStyles_unstable;
     },

package/lib-commonjs/components/Textarea/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Textarea/index.ts"],"sourcesContent":["export { Textarea } from './Textarea';\nexport type { TextareaOnChangeData, TextareaProps, TextareaSlots, TextareaState } from './Textarea.types';\nexport { renderTextarea_unstable } from './renderTextarea';\nexport { useTextarea_unstable } from './useTextarea';\nexport { textareaClassNames, useTextareaStyles_unstable } from './useTextareaStyles.styles';\n"],"names":["Textarea","renderTextarea_unstable","useTextarea_unstable","textareaClassNames","useTextareaStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,kBAAQ;;;eAERC,uCAAuB;;;eAEvBE,2CAAkB;;;eAAEC,mDAA0B;;;eAD9CF,iCAAoB;;;0BAHJ,aAAa;gCAEE,mBAAmB;6BACtB,gBAAgB;yCACU,6BAA6B"}
+{"version":3,"sources":["../src/components/Textarea/index.ts"],"sourcesContent":["export { Textarea } from './Textarea';\nexport type {\n  TextareaBaseProps,\n  TextareaBaseState,\n  TextareaOnChangeData,\n  TextareaProps,\n  TextareaSlots,\n  TextareaState,\n} from './Textarea.types';\nexport { renderTextarea_unstable } from './renderTextarea';\nexport { useTextarea_unstable, useTextareaBase_unstable } from './useTextarea';\nexport { textareaClassNames, useTextareaStyles_unstable } from './useTextareaStyles.styles';\n"],"names":["Textarea","renderTextarea_unstable","useTextarea_unstable","useTextareaBase_unstable","textareaClassNames","useTextareaStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,kBAAQ;;;eASRC,uCAAuB;;;eAEvBG,2CAAkB;;;eADID,qCAAwB;;;eAC1BE,mDAA0B;;;eAD9CH,iCAAoB;;;0BAVJ,aAAa;gCASE,mBAAmB;6BACI,gBAAgB;yCAChB,6BAA6B"}

package/lib-commonjs/components/Textarea/useTextarea.js

@@ -3,9 +3,17 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-Object.defineProperty(exports, "useTextarea_unstable", {
-    enumerable: true,
-    get: function() {
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    useTextareaBase_unstable: function() {
+        return useTextareaBase_unstable;
+    },
+    useTextarea_unstable: function() {
         return useTextarea_unstable;
     }
 });
@@ -15,19 +23,28 @@ const _reactfield = require("@fluentui/react-field");
 const _reactutilities = require("@fluentui/react-utilities");
 const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
 const useTextarea_unstable = (props, ref)=>{
-    // Merge props from surrounding <Field>, if any
-    props = (0, _reactfield.useFieldControlProps_unstable)(props, {
-        supportsLabelFor: true,
-        supportsRequired: true,
-        supportsSize: true
-    });
     const overrides = (0, _reactsharedcontexts.useOverrides_unstable)();
     var _overrides_inputDefaultAppearance;
-    const { size = 'medium', appearance = (_overrides_inputDefaultAppearance = overrides.inputDefaultAppearance) !== null && _overrides_inputDefaultAppearance !== void 0 ? _overrides_inputDefaultAppearance : 'outline', resize = 'none', onChange } = props;
+    const { size = 'medium', appearance = (_overrides_inputDefaultAppearance = overrides.inputDefaultAppearance) !== null && _overrides_inputDefaultAppearance !== void 0 ? _overrides_inputDefaultAppearance : 'outline', ...baseProps } = props;
     if (process.env.NODE_ENV !== 'production' && (appearance === 'filled-darker-shadow' || appearance === 'filled-lighter-shadow')) {
         // eslint-disable-next-line no-console
         console.error("The 'filled-darker-shadow' and 'filled-lighter-shadow' appearances are deprecated and will be removed in the" + ' future.');
     }
+    const baseState = useTextareaBase_unstable(baseProps, ref);
+    return {
+        ...baseState,
+        size,
+        appearance
+    };
+};
+const useTextareaBase_unstable = (props, ref)=>{
+    // Merge props from surrounding <Field>, if any
+    props = (0, _reactfield.useFieldControlProps_unstable)(props, {
+        supportsLabelFor: true,
+        supportsRequired: true,
+        supportsSize: true
+    });
+    const { resize = 'none', onChange } = props;
     const [value, setValue] = (0, _reactutilities.useControllableState)({
         state: props.value,
         defaultState: props.defaultValue,
@@ -43,8 +60,6 @@ const useTextarea_unstable = (props, ref)=>{
         ]
     });
     const state = {
-        size,
-        appearance,
         resize,
         components: {
             root: 'span',

package/lib-commonjs/components/Textarea/useTextarea.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Textarea/useTextarea.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { getPartitionedNativeProps, useControllableState, useEventCallback, slot } from '@fluentui/react-utilities';\nimport type { TextareaProps, TextareaState } from './Textarea.types';\nimport { useOverrides_unstable as useOverrides } from '@fluentui/react-shared-contexts';\n\n/**\n * Create the state required to render Textarea.\n *\n * The returned state can be modified with hooks such as useTextareaStyles_unstable,\n * before being passed to renderTextarea_unstable.\n *\n * @param props - props from this instance of Textarea\n * @param ref - reference to root HTMLElement of Textarea\n */\nexport const useTextarea_unstable = (props: TextareaProps, ref: React.Ref<HTMLTextAreaElement>): TextareaState => {\n  // Merge props from surrounding <Field>, if any\n  props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true, supportsSize: true });\n\n  const overrides = useOverrides();\n\n  const {\n    size = 'medium',\n    appearance = overrides.inputDefaultAppearance ?? 'outline',\n    resize = 'none',\n    onChange,\n  } = props;\n\n  if (\n    process.env.NODE_ENV !== 'production' &&\n    (appearance === 'filled-darker-shadow' || appearance === 'filled-lighter-shadow')\n  ) {\n    // eslint-disable-next-line no-console\n    console.error(\n      \"The 'filled-darker-shadow' and 'filled-lighter-shadow' appearances are deprecated and will be removed in the\" +\n        ' future.',\n    );\n  }\n\n  const [value, setValue] = useControllableState({\n    state: props.value,\n    defaultState: props.defaultValue,\n    initialState: undefined,\n  });\n\n  const nativeProps = getPartitionedNativeProps({\n    props,\n    primarySlotTagName: 'textarea',\n    excludedPropNames: ['onChange', 'value', 'defaultValue'],\n  });\n\n  const state: TextareaState = {\n    size,\n    appearance,\n    resize,\n    components: {\n      root: 'span',\n      textarea: 'textarea',\n    },\n    textarea: slot.always(props.textarea, {\n      defaultProps: {\n        ref,\n        ...nativeProps.primary,\n      },\n      elementType: 'textarea',\n    }),\n    root: slot.always(props.root, {\n      defaultProps: nativeProps.root,\n      elementType: 'span',\n    }),\n  };\n\n  state.textarea.value = value;\n  state.textarea.onChange = useEventCallback(ev => {\n    const newValue = ev.target.value;\n    onChange?.(ev, { value: newValue });\n    setValue(newValue);\n  });\n\n  return state;\n};\n"],"names":["React","useFieldControlProps_unstable","getPartitionedNativeProps","useControllableState","useEventCallback","slot","useOverrides_unstable","useOverrides","useTextarea_unstable","props","ref","supportsLabelFor","supportsRequired","supportsSize","overrides","size","appearance","inputDefaultAppearance","resize","onChange","process","env","NODE_ENV","console","error","value","setValue","state","defaultState","defaultValue","initialState","undefined","nativeProps","primarySlotTagName","excludedPropNames","components","root","textarea","always","defaultProps","primary","elementType","ev","newValue","target"],"mappings":"AAAA;;;;;+BAiBaQ;;;;;;;iEAfU,QAAQ;4BACe,wBAAwB;gCACkB,4BAA4B;qCAE9D,kCAAkC;AAWjF,6BAA6B,CAACC,OAAsBC;IACzD,+CAA+C;IAC/CD,YAAQR,yCAAAA,EAA8BQ,OAAO;QAAEE,kBAAkB;QAAMC,kBAAkB;QAAMC,cAAc;IAAK;IAElH,MAAMC,YAAYP,8CAAAA;QAIHO;IAFf,MAAM,EACJC,OAAO,QAAQ,EACfC,aAAaF,CAAAA,oCAAAA,UAAUG,sBAAAA,AAAsB,MAAA,QAAhCH,sCAAAA,KAAAA,IAAAA,oCAAoC,SAAS,EAC1DI,SAAS,MAAM,EACfC,QAAQ,EACT,GAAGV;IAEJ,IACEW,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBACxBN,CAAAA,eAAe,0BAA0BA,eAAe,uBAAA,CAAsB,EAC/E;QACA,sCAAsC;QACtCO,QAAQC,KAAK,CACX,iHACE;IAEN;IAEA,MAAM,CAACC,OAAOC,SAAS,GAAGvB,wCAAAA,EAAqB;QAC7CwB,OAAOlB,MAAMgB,KAAK;QAClBG,cAAcnB,MAAMoB,YAAY;QAChCC,cAAcC;IAChB;IAEA,MAAMC,kBAAc9B,yCAAAA,EAA0B;QAC5CO;QACAwB,oBAAoB;QACpBC,mBAAmB;YAAC;YAAY;YAAS;SAAe;IAC1D;IAEA,MAAMP,QAAuB;QAC3BZ;QACAC;QACAE;QACAiB,YAAY;YACVC,MAAM;YACNC,UAAU;QACZ;QACAA,UAAUhC,oBAAAA,CAAKiC,MAAM,CAAC7B,MAAM4B,QAAQ,EAAE;YACpCE,cAAc;gBACZ7B;gBACA,GAAGsB,YAAYQ,OAAO;YACxB;YACAC,aAAa;QACf;QACAL,MAAM/B,oBAAAA,CAAKiC,MAAM,CAAC7B,MAAM2B,IAAI,EAAE;YAC5BG,cAAcP,YAAYI,IAAI;YAC9BK,aAAa;QACf;IACF;IAEAd,MAAMU,QAAQ,CAACZ,KAAK,GAAGA;IACvBE,MAAMU,QAAQ,CAAClB,QAAQ,OAAGf,gCAAAA,EAAiBsC,CAAAA;QACzC,MAAMC,WAAWD,GAAGE,MAAM,CAACnB,KAAK;QAChCN,aAAAA,QAAAA,aAAAA,KAAAA,IAAAA,KAAAA,IAAAA,SAAWuB,IAAI;YAAEjB,OAAOkB;QAAS;QACjCjB,SAASiB;IACX;IAEA,OAAOhB;AACT,EAAE"}
+{"version":3,"sources":["../src/components/Textarea/useTextarea.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useFieldControlProps_unstable } from '@fluentui/react-field';\nimport { getPartitionedNativeProps, useControllableState, useEventCallback, slot } from '@fluentui/react-utilities';\nimport type { TextareaBaseProps, TextareaBaseState, TextareaProps, TextareaState } from './Textarea.types';\nimport { useOverrides_unstable as useOverrides } from '@fluentui/react-shared-contexts';\n\n/**\n * Create the state required to render Textarea.\n *\n * The returned state can be modified with hooks such as useTextareaStyles_unstable,\n * before being passed to renderTextarea_unstable.\n *\n * @param props - props from this instance of Textarea\n * @param ref - reference to root HTMLElement of Textarea\n */\nexport const useTextarea_unstable = (props: TextareaProps, ref: React.Ref<HTMLTextAreaElement>): TextareaState => {\n  const overrides = useOverrides();\n\n  const { size = 'medium', appearance = overrides.inputDefaultAppearance ?? 'outline', ...baseProps } = props;\n\n  if (\n    process.env.NODE_ENV !== 'production' &&\n    (appearance === 'filled-darker-shadow' || appearance === 'filled-lighter-shadow')\n  ) {\n    // eslint-disable-next-line no-console\n    console.error(\n      \"The 'filled-darker-shadow' and 'filled-lighter-shadow' appearances are deprecated and will be removed in the\" +\n        ' future.',\n    );\n  }\n\n  const baseState = useTextareaBase_unstable(baseProps, ref);\n\n  return {\n    ...baseState,\n    size,\n    appearance,\n  };\n};\n\n/**\n * Base hook for Textarea component, which manages state related to slots structure and\n * controlled/uncontrolled value state.\n *\n * @param props - User provided props to the Textarea component.\n * @param ref - User provided ref to be passed to the Textarea component.\n */\nexport const useTextareaBase_unstable = (\n  props: TextareaBaseProps,\n  ref?: React.Ref<HTMLTextAreaElement>,\n): TextareaBaseState => {\n  // Merge props from surrounding <Field>, if any\n  props = useFieldControlProps_unstable(props, { supportsLabelFor: true, supportsRequired: true, supportsSize: true });\n\n  const { resize = 'none', onChange } = props;\n\n  const [value, setValue] = useControllableState({\n    state: props.value,\n    defaultState: props.defaultValue,\n    initialState: undefined,\n  });\n\n  const nativeProps = getPartitionedNativeProps({\n    props,\n    primarySlotTagName: 'textarea',\n    excludedPropNames: ['onChange', 'value', 'defaultValue'],\n  });\n\n  const state: TextareaBaseState = {\n    resize,\n    components: {\n      root: 'span',\n      textarea: 'textarea',\n    },\n    textarea: slot.always(props.textarea, {\n      defaultProps: {\n        ref,\n        ...nativeProps.primary,\n      },\n      elementType: 'textarea',\n    }),\n    root: slot.always(props.root, {\n      defaultProps: nativeProps.root,\n      elementType: 'span',\n    }),\n  };\n\n  state.textarea.value = value;\n  state.textarea.onChange = useEventCallback(ev => {\n    const newValue = ev.target.value;\n    onChange?.(ev, { value: newValue });\n    setValue(newValue);\n  });\n\n  return state;\n};\n"],"names":["React","useFieldControlProps_unstable","getPartitionedNativeProps","useControllableState","useEventCallback","slot","useOverrides_unstable","useOverrides","useTextarea_unstable","props","ref","overrides","size","appearance","inputDefaultAppearance","baseProps","process","env","NODE_ENV","console","error","baseState","useTextareaBase_unstable","supportsLabelFor","supportsRequired","supportsSize","resize","onChange","value","setValue","state","defaultState","defaultValue","initialState","undefined","nativeProps","primarySlotTagName","excludedPropNames","components","root","textarea","always","defaultProps","primary","elementType","ev","newValue","target"],"mappings":"AAAA;;;;;;;;;;;;4BAiDasB;eAAAA;;IAhCAd,oBAAAA;;;;;iEAfU,QAAQ;4BACe,wBAAwB;gCACkB,4BAA4B;qCAE9D,kCAAkC;AAWjF,6BAA6B,CAACC,OAAsBC;IACzD,MAAMC,gBAAYJ,0CAAAA;QAEoBI;IAAtC,MAAM,EAAEC,OAAO,QAAQ,EAAEC,aAAaF,CAAAA,oCAAAA,UAAUG,sBAAAA,AAAsB,MAAA,QAAhCH,sCAAAA,KAAAA,IAAAA,oCAAoC,SAAS,EAAE,GAAGI,WAAW,GAAGN;IAEtG,IACEO,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBACxBL,CAAAA,eAAe,0BAA0BA,eAAe,uBAAA,CAAsB,EAC/E;QACA,sCAAsC;QACtCM,QAAQC,KAAK,CACX,iHACE;IAEN;IAEA,MAAMC,YAAYC,yBAAyBP,WAAWL;IAEtD,OAAO;QACL,GAAGW,SAAS;QACZT;QACAC;IACF;AACF,EAAE;AASK,iCAAiC,CACtCJ,OACAC;IAEA,+CAA+C;IAC/CD,YAAQR,yCAAAA,EAA8BQ,OAAO;QAAEc,kBAAkB;QAAMC,kBAAkB;QAAMC,cAAc;IAAK;IAElH,MAAM,EAAEC,SAAS,MAAM,EAAEC,QAAQ,EAAE,GAAGlB;IAEtC,MAAM,CAACmB,OAAOC,SAAS,OAAG1B,oCAAAA,EAAqB;QAC7C2B,OAAOrB,MAAMmB,KAAK;QAClBG,cAActB,MAAMuB,YAAY;QAChCC,cAAcC;IAChB;IAEA,MAAMC,kBAAcjC,yCAAAA,EAA0B;QAC5CO;QACA2B,oBAAoB;QACpBC,mBAAmB;YAAC;YAAY;YAAS;SAAe;IAC1D;IAEA,MAAMP,QAA2B;QAC/BJ;QACAY,YAAY;YACVC,MAAM;YACNC,UAAU;QACZ;QACAA,UAAUnC,oBAAAA,CAAKoC,MAAM,CAAChC,MAAM+B,QAAQ,EAAE;YACpCE,cAAc;gBACZhC;gBACA,GAAGyB,YAAYQ,OAAO;YACxB;YACAC,aAAa;QACf;QACAL,MAAMlC,oBAAAA,CAAKoC,MAAM,CAAChC,MAAM8B,IAAI,EAAE;YAC5BG,cAAcP,YAAYI,IAAI;YAC9BK,aAAa;QACf;IACF;IAEAd,MAAMU,QAAQ,CAACZ,KAAK,GAAGA;IACvBE,MAAMU,QAAQ,CAACb,QAAQ,OAAGvB,gCAAAA,EAAiByC,CAAAA;QACzC,MAAMC,WAAWD,GAAGE,MAAM,CAACnB,KAAK;QAChCD,aAAAA,QAAAA,aAAAA,KAAAA,IAAAA,KAAAA,IAAAA,SAAWkB,IAAI;YAAEjB,OAAOkB;QAAS;QACjCjB,SAASiB;IACX;IAEA,OAAOhB;AACT,EAAE"}

package/lib-commonjs/index.js

@@ -18,6 +18,9 @@ _export(exports, {
     textareaClassNames: function() {
         return _Textarea.textareaClassNames;
     },
+    useTextareaBase_unstable: function() {
+        return _Textarea.useTextareaBase_unstable;
+    },
     useTextareaStyles_unstable: function() {
         return _Textarea.useTextareaStyles_unstable;
     },

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Textarea,\n  renderTextarea_unstable,\n  textareaClassNames,\n  useTextareaStyles_unstable,\n  useTextarea_unstable,\n} from './Textarea';\nexport type { TextareaOnChangeData, TextareaProps, TextareaSlots, TextareaState } from './Textarea';\n"],"names":["Textarea","renderTextarea_unstable","textareaClassNames","useTextareaStyles_unstable","useTextarea_unstable"],"mappings":";;;;;;;;;;;;eACEA,kBAAQ;;;eACRC,iCAAuB;;;eACvBC,4BAAkB;;;eAClBC,oCAA0B;;;eAC1BC,8BAAoB;;;0BACf,aAAa"}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Textarea,\n  renderTextarea_unstable,\n  textareaClassNames,\n  useTextareaStyles_unstable,\n  useTextarea_unstable,\n  useTextareaBase_unstable,\n} from './Textarea';\nexport type {\n  TextareaOnChangeData,\n  TextareaProps,\n  TextareaSlots,\n  TextareaState,\n  TextareaBaseProps,\n  TextareaBaseState,\n} from './Textarea';\n"],"names":["Textarea","renderTextarea_unstable","textareaClassNames","useTextareaStyles_unstable","useTextarea_unstable","useTextareaBase_unstable"],"mappings":";;;;;;;;;;;;eACEA,kBAAQ;;;eACRC,iCAAuB;;;eACvBC,4BAAkB;;;eAGlBG,kCAAwB;;;eAFxBF,oCAA0B;;;eAC1BC,8BAAoB;;;0BAEf,aAAa"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-textarea",
-  "version": "9.6.16",
+  "version": "9.7.0",
   "description": "Fluent UI TextArea component",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",