@aws-amplify/ui-react 6.2.2 → 6.3.1

package/dist/{Field-d47a49dc.js → Field-4b189104.js}

@@ -834,6 +834,16 @@ const IconStar = (props) => {
             React__namespace.createElement("path", { d: "M12 17.27L18.18 21L16.54 13.97L22 9.24L14.81 8.63L12 2L9.19 8.63L2 9.24L7.46 13.97L5.82 21L12 17.27Z", fill: "currentColor" }))));
 };
 
+/**
+ * @internal For internal Amplify UI use only. May be removed in a future release.
+ */
+const IconUser = (props) => {
+    const { className, ...rest } = props;
+    return (React__namespace.createElement(View, { as: "span", width: "1em", height: "1em", className: ui.classNames(ui.ComponentClassName.Icon, className), ...rest },
+        React__namespace.createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            React__namespace.createElement("path", { d: "M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z", fill: "currentColor" }))));
+};
+
 /**
  * @internal For internal Amplify UI use only. May be removed in a future release.
  */
@@ -1162,6 +1172,7 @@ exports.IconMenu = IconMenu;
 exports.IconRemove = IconRemove;
 exports.IconSearch = IconSearch;
 exports.IconStar = IconStar;
+exports.IconUser = IconUser;
 exports.IconVisibility = IconVisibility;
 exports.IconVisibilityOff = IconVisibilityOff;
 exports.IconWarning = IconWarning;

package/dist/esm/PrimitiveCatalog.mjs

@@ -641,6 +641,268 @@ const PrimitiveCatalog = {
             }
         }
     },
+    "Avatar": {
+        "properties": {
+            "src": {
+                "type": "string"
+            },
+            "alt": {
+                "type": "string"
+            },
+            "variation": {
+                "type": "string"
+            },
+            "colorTheme": {
+                "type": "string"
+            },
+            "size": {
+                "type": "string"
+            },
+            "isDisabled": {
+                "type": "boolean"
+            },
+            "id": {
+                "type": "string"
+            },
+            "children": {
+                "type": "string"
+            },
+            "className": {
+                "type": "string"
+            },
+            "testId": {
+                "type": "string"
+            },
+            "inert": {
+                "type": "boolean"
+            },
+            "alignSelf": {
+                "type": "string"
+            },
+            "backgroundColor": {
+                "type": "string"
+            },
+            "backgroundImage": {
+                "type": "string"
+            },
+            "border": {
+                "type": "string"
+            },
+            "borderColor": {
+                "type": "string"
+            },
+            "borderWidth": {
+                "type": "string"
+            },
+            "borderStyle": {
+                "type": "string"
+            },
+            "borderRadius": {
+                "type": "string"
+            },
+            "bottom": {
+                "type": "string"
+            },
+            "boxShadow": {
+                "type": "string"
+            },
+            "color": {
+                "type": "string"
+            },
+            "display": {
+                "type": "string"
+            },
+            "fontFamily": {
+                "type": "string"
+            },
+            "fontSize": {
+                "type": "string"
+            },
+            "fontStyle": {
+                "type": "string"
+            },
+            "fontWeight": {
+                "type": "string"
+            },
+            "height": {
+                "type": "string"
+            },
+            "left": {
+                "type": "string"
+            },
+            "letterSpacing": {
+                "type": "string"
+            },
+            "lineHeight": {
+                "type": "string"
+            },
+            "margin": {
+                "type": "string"
+            },
+            "marginBlock": {
+                "type": "string"
+            },
+            "marginBlockEnd": {
+                "type": "string"
+            },
+            "marginBlockStart": {
+                "type": "string"
+            },
+            "marginBottom": {
+                "type": "string"
+            },
+            "marginInline": {
+                "type": "string"
+            },
+            "marginInlineEnd": {
+                "type": "string"
+            },
+            "marginInlineStart": {
+                "type": "string"
+            },
+            "marginLeft": {
+                "type": "string"
+            },
+            "marginRight": {
+                "type": "string"
+            },
+            "marginTop": {
+                "type": "string"
+            },
+            "maxHeight": {
+                "type": "string"
+            },
+            "maxWidth": {
+                "type": "string"
+            },
+            "minHeight": {
+                "type": "string"
+            },
+            "minWidth": {
+                "type": "string"
+            },
+            "opacity": {
+                "type": "string"
+            },
+            "overflow": {
+                "type": "string"
+            },
+            "padding": {
+                "type": "string"
+            },
+            "paddingBlock": {
+                "type": "string"
+            },
+            "paddingBlockEnd": {
+                "type": "string"
+            },
+            "paddingBlockStart": {
+                "type": "string"
+            },
+            "paddingBottom": {
+                "type": "string"
+            },
+            "paddingInline": {
+                "type": "string"
+            },
+            "paddingInlineEnd": {
+                "type": "string"
+            },
+            "paddingInlineStart": {
+                "type": "string"
+            },
+            "paddingLeft": {
+                "type": "string"
+            },
+            "paddingRight": {
+                "type": "string"
+            },
+            "paddingTop": {
+                "type": "string"
+            },
+            "position": {
+                "type": "string"
+            },
+            "right": {
+                "type": "string"
+            },
+            "textAlign": {
+                "type": "string"
+            },
+            "textDecoration": {
+                "type": "string"
+            },
+            "textTransform": {
+                "type": "string"
+            },
+            "top": {
+                "type": "string"
+            },
+            "transform": {
+                "type": "string"
+            },
+            "transformOrigin": {
+                "type": "string"
+            },
+            "width": {
+                "type": "string"
+            },
+            "whiteSpace": {
+                "type": "string"
+            },
+            "flex": {
+                "type": "string"
+            },
+            "order": {
+                "type": "string"
+            },
+            "grow": {
+                "type": "string"
+            },
+            "shrink": {
+                "type": "string"
+            },
+            "basis": {
+                "type": "string"
+            },
+            "area": {
+                "type": "string"
+            },
+            "column": {
+                "type": "string"
+            },
+            "columnEnd": {
+                "type": "string"
+            },
+            "columnSpan": {
+                "type": "string"
+            },
+            "columnStart": {
+                "type": "string"
+            },
+            "row": {
+                "type": "string"
+            },
+            "rowEnd": {
+                "type": "string"
+            },
+            "rowSpan": {
+                "type": "string"
+            },
+            "rowStart": {
+                "type": "string"
+            },
+            "ariaLabel": {
+                "type": "string"
+            },
+            "ariaValuetext": {
+                "type": "string"
+            },
+            "role": {
+                "type": "string"
+            }
+        }
+    },
     "Badge": {
         "properties": {
             "variation": {
@@ -1711,10 +1973,10 @@ const PrimitiveCatalog = {
             "rowGap": {
                 "type": "string"
             },
-            "size": {
+            "variation": {
                 "type": "string"
             },
-            "variation": {
+            "size": {
                 "type": "string"
             }
         }
@@ -3852,10 +4114,10 @@ const PrimitiveCatalog = {
             "type": {
                 "type": "string"
             },
-            "size": {
+            "variation": {
                 "type": "string"
             },
-            "variation": {
+            "size": {
                 "type": "string"
             }
         }
@@ -7348,10 +7610,10 @@ const PrimitiveCatalog = {
             "type": {
                 "type": "string"
             },
-            "size": {
+            "variation": {
                 "type": "string"
             },
-            "variation": {
+            "size": {
                 "type": "string"
             },
             "direction": {
@@ -7637,10 +7899,10 @@ const PrimitiveCatalog = {
             "type": {
                 "type": "string"
             },
-            "size": {
+            "variation": {
                 "type": "string"
             },
-            "variation": {
+            "size": {
                 "type": "string"
             },
             "direction": {
@@ -8867,13 +9129,13 @@ const PrimitiveCatalog = {
             "type": {
                 "type": "string"
             },
+            "variation": {
+                "type": "string"
+            },
             "size": {
                 "type": "string",
                 "priority": true
             },
-            "variation": {
-                "type": "string"
-            },
             "descriptiveText": {
                 "type": "string",
                 "priority": true
@@ -9252,10 +9514,10 @@ const PrimitiveCatalog = {
             "aria-valuenow": {
                 "type": "number"
             },
-            "alt": {
+            "src": {
                 "type": "string"
             },
-            "src": {
+            "alt": {
                 "type": "string"
             },
             "accept": {
@@ -10488,6 +10750,9 @@ const PrimitiveCatalog = {
             "orientation": {
                 "type": "string"
             },
+            "autoScroll": {
+                "type": "string"
+            },
             "isDisabled": {
                 "type": "boolean"
             },
@@ -13001,6 +13266,9 @@ const PrimitiveCatalog = {
     },
     "TextAreaField": {
         "properties": {
+            "autoResize": {
+                "type": "boolean"
+            },
             "descriptiveText": {
                 "type": "string",
                 "priority": true
@@ -13941,10 +14209,10 @@ const PrimitiveCatalog = {
             "type": {
                 "type": "string"
             },
-            "size": {
+            "variation": {
                 "type": "string"
             },
-            "variation": {
+            "size": {
                 "type": "string"
             },
             "direction": {
@@ -14254,10 +14522,10 @@ const PrimitiveCatalog = {
             "rowGap": {
                 "type": "string"
             },
-            "size": {
+            "variation": {
                 "type": "string"
             },
-            "variation": {
+            "size": {
                 "type": "string"
             }
         }

package/dist/esm/components/AccountSettings/ChangePassword/ChangePassword.mjs

@@ -14,6 +14,7 @@ import '../../../primitives/Field/FieldErrorMessage.mjs';
 import '../../../primitives/Field/Field.mjs';
 import '../../../primitives/Alert/Alert.mjs';
 import '../../../primitives/Autocomplete/Autocomplete.mjs';
+import '../../../primitives/Avatar/Avatar.mjs';
 import '../../../primitives/Badge/Badge.mjs';
 import '../../../primitives/Breadcrumbs/Breadcrumbs.mjs';
 import '../../../primitives/Button/Button.mjs';

package/dist/esm/components/AccountSettings/ChangePassword/defaults.mjs

@@ -1,6 +1,7 @@
 import React__default from 'react';
 import '../../../primitives/Alert/Alert.mjs';
 import '../../../primitives/Autocomplete/Autocomplete.mjs';
+import '../../../primitives/Avatar/Avatar.mjs';
 import '../../../primitives/Badge/Badge.mjs';
 import '../../../primitives/Breadcrumbs/Breadcrumbs.mjs';
 import { Button } from '../../../primitives/Button/Button.mjs';

package/dist/esm/components/AccountSettings/DeleteUser/DeleteUser.mjs

@@ -13,6 +13,7 @@ import '../../../primitives/Field/FieldErrorMessage.mjs';
 import '../../../primitives/Field/Field.mjs';
 import '../../../primitives/Alert/Alert.mjs';
 import '../../../primitives/Autocomplete/Autocomplete.mjs';
+import '../../../primitives/Avatar/Avatar.mjs';
 import '../../../primitives/Badge/Badge.mjs';
 import '../../../primitives/Breadcrumbs/Breadcrumbs.mjs';
 import '../../../primitives/Button/Button.mjs';

package/dist/esm/components/AccountSettings/DeleteUser/defaults.mjs

@@ -1,6 +1,7 @@
 import React__default from 'react';
 import '../../../primitives/Alert/Alert.mjs';
 import '../../../primitives/Autocomplete/Autocomplete.mjs';
+import '../../../primitives/Avatar/Avatar.mjs';
 import '../../../primitives/Badge/Badge.mjs';
 import '../../../primitives/Breadcrumbs/Breadcrumbs.mjs';
 import { Button } from '../../../primitives/Button/Button.mjs';

package/dist/esm/components/AccountSettings/shared/Defaults.mjs

@@ -1,6 +1,7 @@
 import React__default from 'react';
 import { Alert } from '../../../primitives/Alert/Alert.mjs';
 import '../../../primitives/Autocomplete/Autocomplete.mjs';
+import '../../../primitives/Avatar/Avatar.mjs';
 import '../../../primitives/Badge/Badge.mjs';
 import '../../../primitives/Breadcrumbs/Breadcrumbs.mjs';
 import '../../../primitives/Button/Button.mjs';

package/dist/esm/index.mjs

@@ -13,6 +13,7 @@ export { ThemeProvider } from './components/ThemeProvider/ThemeProvider.mjs';
 export { IconsProvider } from './primitives/Icon/context/IconsProvider.mjs';
 export { Alert } from './primitives/Alert/Alert.mjs';
 export { Autocomplete } from './primitives/Autocomplete/Autocomplete.mjs';
+export { Avatar } from './primitives/Avatar/Avatar.mjs';
 export { Badge } from './primitives/Badge/Badge.mjs';
 export { Breadcrumbs } from './primitives/Breadcrumbs/Breadcrumbs.mjs';
 export { Button } from './primitives/Button/Button.mjs';

package/dist/esm/internal.mjs

@@ -6,6 +6,8 @@ export { useColorMode } from './hooks/useTheme.mjs';
 export { FilterChildren } from './components/FilterChildren/FilterChildren.mjs';
 export { AlertIcon } from './primitives/Alert/AlertIcon.mjs';
 export { IconAdd } from './primitives/Icon/icons/IconAdd.mjs';
+export { IconAssistant } from './primitives/Icon/icons/IconAssistant.mjs';
+export { IconAttach } from './primitives/Icon/icons/IconAttach.mjs';
 export { IconCheckCircleOutline } from './primitives/Icon/icons/IconCheckCircleOutline.mjs';
 export { IconCheckCircle } from './primitives/Icon/icons/IconCheckCircle.mjs';
 export { IconCheck } from './primitives/Icon/icons/IconCheck.mjs';
@@ -21,8 +23,10 @@ export { IconInfo } from './primitives/Icon/icons/IconInfo.mjs';
 export { IconMenu } from './primitives/Icon/icons/IconMenu.mjs';
 export { IconRemove } from './primitives/Icon/icons/IconRemove.mjs';
 export { IconSearch } from './primitives/Icon/icons/IconSearch.mjs';
+export { IconSend } from './primitives/Icon/icons/IconSend.mjs';
 export { IconStar } from './primitives/Icon/icons/IconStar.mjs';
 export { IconUpload } from './primitives/Icon/icons/IconUpload.mjs';
+export { IconUser } from './primitives/Icon/icons/IconUser.mjs';
 export { IconVisibilityOff } from './primitives/Icon/icons/IconVisibilityOff.mjs';
 export { IconVisibility } from './primitives/Icon/icons/IconVisibility.mjs';
 export { IconWarning } from './primitives/Icon/icons/IconWarning.mjs';

package/dist/esm/primitives/Avatar/Avatar.mjs

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { classNames, ComponentClassName, classNameModifier } from '@aws-amplify/ui';
+import { primitiveWithForwardRef } from '../utils/primitiveWithForwardRef.mjs';
+import { View } from '../View/View.mjs';
+import '../Icon/Icon.mjs';
+import '../Icon/context/IconsContext.mjs';
+import { useIcons } from '../Icon/context/useIcons.mjs';
+import { IconUser } from '../Icon/icons/IconUser.mjs';
+import { Image } from '../Image/Image.mjs';
+
+const AvatarPrimitive = ({ className, children, variation, colorTheme, size, src, alt, ...rest }, ref) => {
+    const icons = useIcons('avatar');
+    const icon = icons?.user ?? React.createElement(IconUser, null);
+    const componentClasses = classNames(ComponentClassName.Avatar, className, classNameModifier(ComponentClassName.Avatar, variation), classNameModifier(ComponentClassName.Avatar, size), classNameModifier(ComponentClassName.Avatar, colorTheme));
+    return (React.createElement(View, { as: "span", className: componentClasses, ref: ref, ...rest }, src ? (React.createElement(Image, { className: ComponentClassName.AvatarImage, src: src, alt: alt })) : (children ?? (React.createElement(View, { as: "span", className: ComponentClassName.AvatarIcon, "aria-hidden": "true" }, icon)))));
+};
+/**
+ * [📖 Docs](https://ui.docs.amplify.aws/react/components/avatar)
+ */
+const Avatar = primitiveWithForwardRef(AvatarPrimitive);
+Avatar.displayName = 'Avatar';
+
+export { Avatar };

package/dist/esm/primitives/Icon/icons/IconAssistant.mjs

@@ -0,0 +1,15 @@
+import { classNames, ComponentClassName } from '@aws-amplify/ui';
+import * as React from 'react';
+import { View } from '../../View/View.mjs';
+
+/**
+ * @internal For internal Amplify UI use only. May be removed in a future release.
+ */
+const IconAssistant = (props) => {
+    const { className, ...rest } = props;
+    return (React.createElement(View, { as: "span", width: "1em", height: "1em", className: classNames(ComponentClassName.Icon, className), ...rest },
+        React.createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M13.8548 1.40981C12.693 0.801759 11.3069 0.801759 10.1451 1.40981L2.14518 5.59679C0.826447 6.28698 0 7.65232 0 9.14075V16.8593C0 18.3477 0.826447 19.713 2.14518 20.4032L10.1451 24.5902C11.3069 25.1982 12.693 25.1982 13.8548 24.5902L21.8547 20.4032C23.1735 19.713 23.9999 18.3477 23.9999 16.8592V9.14075C23.9999 7.65232 23.1735 6.28698 21.8547 5.59679L13.8548 1.40981ZM12.9258 6.05676C12.5872 5.22732 11.4127 5.22732 11.0741 6.05676L9.42869 10.0877C9.31871 10.3572 9.0968 10.5653 8.82088 10.6579L4.665 12.0519C3.7557 12.3569 3.7557 13.6431 4.665 13.9481L8.82088 15.3421C9.0968 15.4347 9.31871 15.6428 9.42869 15.9123L11.0741 19.9432C11.4127 20.7727 12.5872 20.7727 12.9258 19.9432L14.5712 15.9123C14.6812 15.6428 14.9031 15.4347 15.179 15.3421L19.3349 13.9481C20.2442 13.6431 20.2442 12.3569 19.3349 12.0519L15.179 10.6579C14.9031 10.5653 14.6812 10.3572 14.5712 10.0877L12.9258 6.05676Z", fill: "currentColor" }))));
+};
+
+export { IconAssistant };

package/dist/esm/primitives/Icon/icons/IconAttach.mjs

@@ -0,0 +1,15 @@
+import { classNames, ComponentClassName } from '@aws-amplify/ui';
+import * as React from 'react';
+import { View } from '../../View/View.mjs';
+
+/**
+ * @internal For internal Amplify UI use only. May be removed in a future release.
+ */
+const IconAttach = (props) => {
+    const { className, ...rest } = props;
+    return (React.createElement(View, { as: "span", width: "1em", height: "1em", className: classNames(ComponentClassName.Icon, className), ...rest },
+        React.createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M14.3928 1.93491L4.23565 11.8583C2.3257 13.7243 2.3257 16.7379 4.23565 18.6039C6.161 20.4849 9.29378 20.4849 11.2191 18.6039L21.2003 8.85257C22.3571 7.72235 22.3571 5.86149 21.2003 4.73128C20.0748 3.63171 18.2753 3.63857 17.1582 4.74668L7.17456 14.6503C6.86543 14.9523 6.8654 15.4303 7.17454 15.7323C7.49908 16.0494 8.03642 16.0494 8.36095 15.7323L18.338 5.98493L19.9926 7.67849L10.0155 17.4259C8.77102 18.6417 6.76446 18.6417 5.51997 17.4259C4.26127 16.1962 4.26007 14.1915 5.51637 12.9603L15.4908 3.06578C17.5259 1.04696 20.8044 1.03447 22.8548 3.03772C24.9625 5.09681 24.9625 8.48703 22.8548 10.5461L12.8737 20.2975C10.0284 23.0773 5.42639 23.0773 2.58108 20.2975C-0.279632 17.5026 -0.279632 12.9596 2.58108 10.1647L12.7383 0.241356L14.3928 1.93491Z", fill: "currentColor" }))));
+};
+
+export { IconAttach };

package/dist/esm/primitives/Icon/icons/IconSend.mjs

@@ -0,0 +1,15 @@
+import { classNames, ComponentClassName } from '@aws-amplify/ui';
+import * as React from 'react';
+import { View } from '../../View/View.mjs';
+
+/**
+ * @internal For internal Amplify UI use only. May be removed in a future release.
+ */
+const IconSend = (props) => {
+    const { className, ...rest } = props;
+    return (React.createElement(View, { as: "span", width: "1em", height: "1em", className: classNames(ComponentClassName.Icon, className), ...rest },
+        React.createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M1.34374 0.774436C1.72319 0.451324 2.26162 0.393083 2.70138 0.627584L23.173 11.544C23.5704 11.7559 23.8177 12.1704 23.8155 12.6207C23.8133 13.071 23.5618 13.4831 23.1624 13.691L2.69073 24.3477C2.24914 24.5776 1.71196 24.5144 1.33575 24.1884C0.959534 23.8624 0.820634 23.3396 0.98539 22.8698L4.58366 12.6099L0.982433 2.09133C0.821002 1.61982 0.964295 1.09755 1.34374 0.774436ZM6.72819 13.8281L4.29043 20.779L17.6432 13.8281H6.72819ZM17.7477 11.4013H6.735L4.27542 4.21725L17.7477 11.4013Z", fill: "currentColor" }))));
+};
+
+export { IconSend };

package/dist/esm/primitives/Icon/icons/IconUser.mjs

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import { classNames, ComponentClassName } from '@aws-amplify/ui';
+import { View } from '../../View/View.mjs';
+
+/**
+ * @internal For internal Amplify UI use only. May be removed in a future release.
+ */
+const IconUser = (props) => {
+    const { className, ...rest } = props;
+    return (React.createElement(View, { as: "span", width: "1em", height: "1em", className: classNames(ComponentClassName.Icon, className), ...rest },
+        React.createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+            React.createElement("path", { d: "M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z", fill: "currentColor" }))));
+};
+
+export { IconUser };

package/dist/esm/primitives/ScrollView/ScrollView.mjs

@@ -2,8 +2,28 @@ import * as React from 'react';
 import { classNames, ComponentClassName, classNameModifier } from '@aws-amplify/ui';
 import { View } from '../View/View.mjs';
 import { primitiveWithForwardRef } from '../utils/primitiveWithForwardRef.mjs';
+import { useComposeRefsCallback } from '../../hooks/useComposeRefsCallback.mjs';
 
-const ScrollViewPrimitive = ({ children, className, orientation, ...rest }, ref) => (React.createElement(View, { className: classNames(ComponentClassName.ScrollView, classNameModifier(ComponentClassName.ScrollView, orientation), className), ref: ref, ...rest }, children));
+const ScrollViewPrimitive = ({ children, className, orientation, autoScroll, ...rest }, externalRef) => {
+    const internalRef = React.useRef(null);
+    const composedRefs = useComposeRefsCallback({
+        externalRef,
+        internalRef,
+    });
+    React.useEffect(() => {
+        if (autoScroll) {
+            internalRef.current?.scrollTo({
+                top: internalRef.current?.scrollHeight,
+                left: internalRef.current?.scrollWidth,
+                behavior: autoScroll,
+            });
+        }
+    }, [
+        children,
+        autoScroll,
+    ]);
+    return (React.createElement(View, { className: classNames(ComponentClassName.ScrollView, classNameModifier(ComponentClassName.ScrollView, orientation), className), ref: composedRefs, ...rest }, children));
+};
 /**
  * [📖 Docs](https://ui.docs.amplify.aws/react/components/scrollview)
  */

package/dist/esm/primitives/TextArea/AutoresizeTextarea.mjs

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { primitiveWithForwardRef } from '../utils/primitiveWithForwardRef.mjs';
+import { TextArea } from './TextArea.mjs';
+import { useAutoresizeTextArea } from './useAutoresizeTextarea.mjs';
+import { useComposeRefsCallback } from '../../hooks/useComposeRefsCallback.mjs';
+
+const AutoresizeTextAreaPrimitive = ({ value, ...rest }, externalRef) => {
+    const internalRef = React.useRef(null);
+    useAutoresizeTextArea(internalRef.current, value);
+    const composedRef = useComposeRefsCallback({
+        externalRef,
+        internalRef,
+    });
+    return React.createElement(TextArea, { ...rest, ref: composedRef, value: value });
+};
+const AutoresizeTextArea = primitiveWithForwardRef(AutoresizeTextAreaPrimitive);
+AutoresizeTextArea.displayName = 'AutoresizeTextArea';
+
+export { AutoresizeTextArea };