@uipath/apollo-wind 2.27.1 → 2.29.0

package/dist/components/ui/index.cjs

@@ -15,7 +15,7 @@ var __webpack_modules__ = {
     "./avatar" (module) {
         module.exports = require("./avatar.cjs");
     },
-    "@/components/ui/badge" (module) {
+    "./badge" (module) {
         module.exports = require("./badge.cjs");
     },
     "./breadcrumb" (module) {
@@ -27,16 +27,16 @@ var __webpack_modules__ = {
     "@/components/ui/button" (module) {
         module.exports = require("./button.cjs");
     },
-    "@/components/ui/calendar" (module) {
+    "./calendar" (module) {
         module.exports = require("./calendar.cjs");
     },
     "./card" (module) {
         module.exports = require("./card.cjs");
     },
-    "@/components/ui/checkbox" (module) {
+    "./checkbox" (module) {
         module.exports = require("./checkbox.cjs");
     },
-    "@/components/ui/collapsible" (module) {
+    "./collapsible" (module) {
         module.exports = require("./collapsible.cjs");
     },
     "./combobox" (module) {
@@ -60,7 +60,7 @@ var __webpack_modules__ = {
     "./dialog" (module) {
         module.exports = require("./dialog.cjs");
     },
-    "@/components/ui/dropdown-menu" (module) {
+    "./dropdown-menu" (module) {
         module.exports = require("./dropdown-menu.cjs");
     },
     "./editable-cell" (module) {
@@ -78,10 +78,10 @@ var __webpack_modules__ = {
     "@/components/ui/input-group" (module) {
         module.exports = require("./input-group.cjs");
     },
-    "@/components/ui/input" (module) {
+    "./input" (module) {
         module.exports = require("./input.cjs");
     },
-    "@/components/ui/label" (module) {
+    "./label" (module) {
         module.exports = require("./label.cjs");
     },
     "./layout" (module) {
@@ -156,7 +156,7 @@ var __webpack_modules__ = {
     "./toggle-group" (module) {
         module.exports = require("./toggle-group.cjs");
     },
-    "./toggle" (module) {
+    "@/components/ui/toggle" (module) {
         module.exports = require("./toggle.cjs");
     },
     "./tooltip" (module) {
@@ -247,7 +247,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_avatar__rspack_import_4[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _badge__rspack_import_5 = __webpack_require__("@/components/ui/badge");
+    var _badge__rspack_import_5 = __webpack_require__("./badge");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _badge__rspack_import_5)if ([
         "TreeView",
@@ -275,7 +275,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_button_group__rspack_import_8[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _calendar__rspack_import_9 = __webpack_require__("@/components/ui/calendar");
+    var _calendar__rspack_import_9 = __webpack_require__("./calendar");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _calendar__rspack_import_9)if ([
         "TreeView",
@@ -289,14 +289,14 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_card__rspack_import_10[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _checkbox__rspack_import_11 = __webpack_require__("@/components/ui/checkbox");
+    var _checkbox__rspack_import_11 = __webpack_require__("./checkbox");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _checkbox__rspack_import_11)if ([
         "TreeView",
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_checkbox__rspack_import_11[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _collapsible__rspack_import_12 = __webpack_require__("@/components/ui/collapsible");
+    var _collapsible__rspack_import_12 = __webpack_require__("./collapsible");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _collapsible__rspack_import_12)if ([
         "TreeView",
@@ -352,7 +352,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_dialog__rspack_import_19[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _dropdown_menu__rspack_import_20 = __webpack_require__("@/components/ui/dropdown-menu");
+    var _dropdown_menu__rspack_import_20 = __webpack_require__("./dropdown-menu");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _dropdown_menu__rspack_import_20)if ([
         "TreeView",
@@ -387,7 +387,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_hover_card__rspack_import_24[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _input__rspack_import_25 = __webpack_require__("@/components/ui/input");
+    var _input__rspack_import_25 = __webpack_require__("./input");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _input__rspack_import_25)if ([
         "TreeView",
@@ -401,7 +401,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_input_group__rspack_import_26[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _label__rspack_import_27 = __webpack_require__("@/components/ui/label");
+    var _label__rspack_import_27 = __webpack_require__("./label");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _label__rspack_import_27)if ([
         "TreeView",
@@ -569,7 +569,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_textarea__rspack_import_50[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _toggle__rspack_import_51 = __webpack_require__("./toggle");
+    var _toggle__rspack_import_51 = __webpack_require__("@/components/ui/toggle");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _toggle__rspack_import_51)if ([
         "TreeView",

package/dist/components/ui/spinner.cjs

@@ -28,24 +28,30 @@ __webpack_require__.d(__webpack_exports__, {
     Spinner: ()=>Spinner
 });
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
-const external_react_namespaceObject = require("react");
 const external_class_variance_authority_namespaceObject = require("class-variance-authority");
 const external_lucide_react_namespaceObject = require("lucide-react");
+const external_react_namespaceObject = require("react");
 const index_cjs_namespaceObject = require("../../lib/index.cjs");
-const spinnerVariants = (0, external_class_variance_authority_namespaceObject.cva)('animate-spin text-muted-foreground', {
+const spinnerVariants = (0, external_class_variance_authority_namespaceObject.cva)('animate-spin', {
     variants: {
         size: {
             sm: 'h-4 w-4',
             default: 'h-6 w-6',
             lg: 'h-8 w-8',
             xl: 'h-12 w-12'
+        },
+        variant: {
+            default: 'text-muted-foreground',
+            primary: 'text-primary',
+            foreground: 'text-foreground'
         }
     },
     defaultVariants: {
-        size: 'default'
+        size: 'default',
+        variant: 'default'
     }
 });
-const Spinner = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, size, label = 'Loading', showLabel = false, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+const Spinner = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, size, variant, label = 'Loading', showLabel = false, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
         ref: ref,
         role: "status",
         "aria-label": label,
@@ -54,7 +60,8 @@ const Spinner = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ class
         children: [
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Loader2, {
                 className: (0, index_cjs_namespaceObject.cn)(spinnerVariants({
-                    size
+                    size,
+                    variant
                 }))
             }),
             showLabel ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {

package/dist/components/ui/spinner.d.ts

@@ -1,7 +1,8 @@
-import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';
+import * as React from 'react';
 declare const spinnerVariants: (props?: ({
     size?: "default" | "lg" | "sm" | "xl" | null | undefined;
+    variant?: "default" | "primary" | "foreground" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export interface SpinnerProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof spinnerVariants> {
     label?: string;

package/dist/components/ui/spinner.js

@@ -1,22 +1,28 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
 import { cva } from "class-variance-authority";
 import { Loader2 } from "lucide-react";
+import { forwardRef } from "react";
 import { cn } from "../../lib/index.js";
-const spinnerVariants = cva('animate-spin text-muted-foreground', {
+const spinnerVariants = cva('animate-spin', {
     variants: {
         size: {
             sm: 'h-4 w-4',
             default: 'h-6 w-6',
             lg: 'h-8 w-8',
             xl: 'h-12 w-12'
+        },
+        variant: {
+            default: 'text-muted-foreground',
+            primary: 'text-primary',
+            foreground: 'text-foreground'
         }
     },
     defaultVariants: {
-        size: 'default'
+        size: 'default',
+        variant: 'default'
     }
 });
-const Spinner = /*#__PURE__*/ forwardRef(({ className, size, label = 'Loading', showLabel = false, ...props }, ref)=>/*#__PURE__*/ jsxs("div", {
+const Spinner = /*#__PURE__*/ forwardRef(({ className, size, variant, label = 'Loading', showLabel = false, ...props }, ref)=>/*#__PURE__*/ jsxs("div", {
         ref: ref,
         role: "status",
         "aria-label": label,
@@ -25,7 +31,8 @@ const Spinner = /*#__PURE__*/ forwardRef(({ className, size, label = 'Loading',
         children: [
             /*#__PURE__*/ jsx(Loader2, {
                 className: cn(spinnerVariants({
-                    size
+                    size,
+                    variant
                 }))
             }),
             showLabel ? /*#__PURE__*/ jsx("span", {

package/dist/components/ui/textarea.cjs

@@ -29,11 +29,135 @@ __webpack_require__.d(__webpack_exports__, {
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const external_react_namespaceObject = require("react");
 const index_cjs_namespaceObject = require("../../lib/index.cjs");
-const Textarea = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("textarea", {
-        className: (0, index_cjs_namespaceObject.cn)('flex min-h-[80px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-base transition-colors placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm', 'future:rounded-xl future:border-0 future:bg-surface-overlay future:text-sm future:placeholder:text-foreground-muted future:placeholder:font-normal future:focus-visible:ring-offset-2 future:focus-visible:ring-offset-background', className),
-        ref: ref,
+function normalizeRows(value) {
+    if (void 0 === value || !Number.isFinite(value)) return;
+    return Math.max(1, Math.floor(value));
+}
+function measureRowMetrics(el) {
+    const styles = window.getComputedStyle(el);
+    const lineHeight = parseFloat(styles.lineHeight) || 1.2 * parseFloat(styles.fontSize) || 20;
+    const padding = parseFloat(styles.paddingTop) + parseFloat(styles.paddingBottom) || 0;
+    const border = parseFloat(styles.borderTopWidth) + parseFloat(styles.borderBottomWidth) || 0;
+    return {
+        lineHeight,
+        padding,
+        border,
+        borderBox: 'border-box' === styles.boxSizing
+    };
+}
+function cssLength(value) {
+    if (null == value) return '';
+    return 'number' == typeof value ? `${value}px` : String(value);
+}
+const Textarea = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, minRows, maxRows, onChange, style, ...props }, ref)=>{
+    const { effMinRows, effMaxRows } = external_react_namespaceObject.useMemo(()=>{
+        const nMin = normalizeRows(minRows);
+        const nMax = normalizeRows(maxRows);
+        return {
+            effMinRows: void 0 !== nMin && void 0 !== nMax ? Math.min(nMin, nMax) : nMin,
+            effMaxRows: nMax
+        };
+    }, [
+        minRows,
+        maxRows
+    ]);
+    const managed = void 0 !== effMinRows || void 0 !== effMaxRows;
+    const innerRef = external_react_namespaceObject.useRef(null);
+    const manuallyResized = external_react_namespaceObject.useRef(false);
+    const styleRef = external_react_namespaceObject.useRef(style);
+    styleRef.current = style;
+    const setRef = external_react_namespaceObject.useCallback((node)=>{
+        innerRef.current = node;
+        if ('function' == typeof ref) ref(node);
+        else if (ref) ref.current = node;
+    }, [
+        ref
+    ]);
+    const restoreOwnedStyles = external_react_namespaceObject.useCallback((el)=>{
+        const consumer = styleRef.current;
+        el.style.height = cssLength(consumer?.height);
+        el.style.minHeight = cssLength(consumer?.minHeight);
+        el.style.overflowY = cssLength(consumer?.overflowY);
+    }, []);
+    const resize = external_react_namespaceObject.useCallback(()=>{
+        const el = innerRef.current;
+        if (!el || !managed) return;
+        const { lineHeight, padding, border, borderBox } = measureRowMetrics(el);
+        const extra = borderBox ? padding + border : 0;
+        const minHeight = void 0 !== effMinRows ? effMinRows * lineHeight + extra : 0;
+        el.style.minHeight = void 0 !== effMinRows ? `${minHeight}px` : cssLength(styleRef.current?.minHeight);
+        if (void 0 === effMaxRows || manuallyResized.current) return;
+        const maxHeight = effMaxRows * lineHeight + extra;
+        el.style.height = 'auto';
+        const contentNeeded = borderBox ? el.scrollHeight + border : Math.max(0, el.scrollHeight - padding);
+        const target = Math.min(Math.max(contentNeeded, minHeight), maxHeight);
+        el.style.height = `${target}px`;
+        el.style.overflowY = contentNeeded > maxHeight ? 'auto' : 'hidden';
+    }, [
+        managed,
+        effMinRows,
+        effMaxRows
+    ]);
+    external_react_namespaceObject.useLayoutEffect(()=>{
+        resize();
+    }, [
+        resize,
+        props.value,
+        props.defaultValue
+    ]);
+    external_react_namespaceObject.useLayoutEffect(()=>{
+        manuallyResized.current = false;
+        const el = innerRef.current;
+        if (!el) return;
+        if (!managed) return void restoreOwnedStyles(el);
+        if (void 0 === effMaxRows) {
+            el.style.height = cssLength(styleRef.current?.height);
+            el.style.overflowY = cssLength(styleRef.current?.overflowY);
+        }
+        resize();
+    }, [
+        managed,
+        effMaxRows,
+        resize,
+        restoreOwnedStyles
+    ]);
+    external_react_namespaceObject.useLayoutEffect(()=>{
+        const el = innerRef.current;
+        if (!el || !managed || "u" < typeof ResizeObserver) return;
+        let lastWidth = el.clientWidth;
+        const observer = new ResizeObserver(()=>{
+            const width = el.clientWidth;
+            if (width !== lastWidth) {
+                lastWidth = width;
+                resize();
+                return;
+            }
+            if (void 0 === effMaxRows || manuallyResized.current) return;
+            const { lineHeight, padding, border, borderBox } = measureRowMetrics(el);
+            const maxHeight = effMaxRows * lineHeight + (borderBox ? padding + border : 0);
+            if (el.offsetHeight > maxHeight + 1) {
+                manuallyResized.current = true;
+                el.style.overflowY = cssLength(styleRef.current?.overflowY) || 'auto';
+            }
+        });
+        observer.observe(el);
+        return ()=>observer.disconnect();
+    }, [
+        managed,
+        effMaxRows,
+        resize
+    ]);
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("textarea", {
+        className: (0, index_cjs_namespaceObject.cn)('flex w-full rounded-md border border-input bg-transparent px-3 py-2 text-base transition-colors placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm', 'future:rounded-xl future:border-0 future:bg-surface-overlay future:text-sm future:placeholder:text-foreground-muted future:placeholder:font-normal future:focus-visible:ring-offset-2 future:focus-visible:ring-offset-background', !managed && 'min-h-[80px]', managed && 'resize-y', className),
+        ref: setRef,
+        style: style,
+        onChange: (event)=>{
+            onChange?.(event);
+            resize();
+        },
         ...props
-    }));
+    });
+});
 Textarea.displayName = 'Textarea';
 exports.Textarea = __webpack_exports__.Textarea;
 for(var __rspack_i in __webpack_exports__)if (-1 === [

package/dist/components/ui/textarea.d.ts

@@ -1,4 +1,14 @@
 import * as React from 'react';
-export type TextareaProps = React.ComponentProps<'textarea'>;
-declare const Textarea: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
+export type TextareaProps = React.ComponentProps<'textarea'> & {
+    /**
+     * Minimum number of visible rows.
+     */
+    minRows?: number;
+    /**
+     * Enables auto-grow and sets the ceiling, in rows. The field grows with its content
+     * up to `maxRows`, then scrolls.
+     */
+    maxRows?: number;
+};
+declare const Textarea: React.ForwardRefExoticComponent<Omit<TextareaProps, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
 export { Textarea };

package/dist/components/ui/textarea.js

@@ -1,10 +1,134 @@
 import { jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
+import { forwardRef, useCallback, useLayoutEffect, useMemo, useRef } from "react";
 import { cn } from "../../lib/index.js";
-const Textarea = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx("textarea", {
-        className: cn('flex min-h-[80px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-base transition-colors placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm', 'future:rounded-xl future:border-0 future:bg-surface-overlay future:text-sm future:placeholder:text-foreground-muted future:placeholder:font-normal future:focus-visible:ring-offset-2 future:focus-visible:ring-offset-background', className),
-        ref: ref,
+function normalizeRows(value) {
+    if (void 0 === value || !Number.isFinite(value)) return;
+    return Math.max(1, Math.floor(value));
+}
+function measureRowMetrics(el) {
+    const styles = window.getComputedStyle(el);
+    const lineHeight = parseFloat(styles.lineHeight) || 1.2 * parseFloat(styles.fontSize) || 20;
+    const padding = parseFloat(styles.paddingTop) + parseFloat(styles.paddingBottom) || 0;
+    const border = parseFloat(styles.borderTopWidth) + parseFloat(styles.borderBottomWidth) || 0;
+    return {
+        lineHeight,
+        padding,
+        border,
+        borderBox: 'border-box' === styles.boxSizing
+    };
+}
+function cssLength(value) {
+    if (null == value) return '';
+    return 'number' == typeof value ? `${value}px` : String(value);
+}
+const Textarea = /*#__PURE__*/ forwardRef(({ className, minRows, maxRows, onChange, style, ...props }, ref)=>{
+    const { effMinRows, effMaxRows } = useMemo(()=>{
+        const nMin = normalizeRows(minRows);
+        const nMax = normalizeRows(maxRows);
+        return {
+            effMinRows: void 0 !== nMin && void 0 !== nMax ? Math.min(nMin, nMax) : nMin,
+            effMaxRows: nMax
+        };
+    }, [
+        minRows,
+        maxRows
+    ]);
+    const managed = void 0 !== effMinRows || void 0 !== effMaxRows;
+    const innerRef = useRef(null);
+    const manuallyResized = useRef(false);
+    const styleRef = useRef(style);
+    styleRef.current = style;
+    const setRef = useCallback((node)=>{
+        innerRef.current = node;
+        if ('function' == typeof ref) ref(node);
+        else if (ref) ref.current = node;
+    }, [
+        ref
+    ]);
+    const restoreOwnedStyles = useCallback((el)=>{
+        const consumer = styleRef.current;
+        el.style.height = cssLength(consumer?.height);
+        el.style.minHeight = cssLength(consumer?.minHeight);
+        el.style.overflowY = cssLength(consumer?.overflowY);
+    }, []);
+    const resize = useCallback(()=>{
+        const el = innerRef.current;
+        if (!el || !managed) return;
+        const { lineHeight, padding, border, borderBox } = measureRowMetrics(el);
+        const extra = borderBox ? padding + border : 0;
+        const minHeight = void 0 !== effMinRows ? effMinRows * lineHeight + extra : 0;
+        el.style.minHeight = void 0 !== effMinRows ? `${minHeight}px` : cssLength(styleRef.current?.minHeight);
+        if (void 0 === effMaxRows || manuallyResized.current) return;
+        const maxHeight = effMaxRows * lineHeight + extra;
+        el.style.height = 'auto';
+        const contentNeeded = borderBox ? el.scrollHeight + border : Math.max(0, el.scrollHeight - padding);
+        const target = Math.min(Math.max(contentNeeded, minHeight), maxHeight);
+        el.style.height = `${target}px`;
+        el.style.overflowY = contentNeeded > maxHeight ? 'auto' : 'hidden';
+    }, [
+        managed,
+        effMinRows,
+        effMaxRows
+    ]);
+    useLayoutEffect(()=>{
+        resize();
+    }, [
+        resize,
+        props.value,
+        props.defaultValue
+    ]);
+    useLayoutEffect(()=>{
+        manuallyResized.current = false;
+        const el = innerRef.current;
+        if (!el) return;
+        if (!managed) return void restoreOwnedStyles(el);
+        if (void 0 === effMaxRows) {
+            el.style.height = cssLength(styleRef.current?.height);
+            el.style.overflowY = cssLength(styleRef.current?.overflowY);
+        }
+        resize();
+    }, [
+        managed,
+        effMaxRows,
+        resize,
+        restoreOwnedStyles
+    ]);
+    useLayoutEffect(()=>{
+        const el = innerRef.current;
+        if (!el || !managed || "u" < typeof ResizeObserver) return;
+        let lastWidth = el.clientWidth;
+        const observer = new ResizeObserver(()=>{
+            const width = el.clientWidth;
+            if (width !== lastWidth) {
+                lastWidth = width;
+                resize();
+                return;
+            }
+            if (void 0 === effMaxRows || manuallyResized.current) return;
+            const { lineHeight, padding, border, borderBox } = measureRowMetrics(el);
+            const maxHeight = effMaxRows * lineHeight + (borderBox ? padding + border : 0);
+            if (el.offsetHeight > maxHeight + 1) {
+                manuallyResized.current = true;
+                el.style.overflowY = cssLength(styleRef.current?.overflowY) || 'auto';
+            }
+        });
+        observer.observe(el);
+        return ()=>observer.disconnect();
+    }, [
+        managed,
+        effMaxRows,
+        resize
+    ]);
+    return /*#__PURE__*/ jsx("textarea", {
+        className: cn('flex w-full rounded-md border border-input bg-transparent px-3 py-2 text-base transition-colors placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm', 'future:rounded-xl future:border-0 future:bg-surface-overlay future:text-sm future:placeholder:text-foreground-muted future:placeholder:font-normal future:focus-visible:ring-offset-2 future:focus-visible:ring-offset-background', !managed && 'min-h-[80px]', managed && 'resize-y', className),
+        ref: setRef,
+        style: style,
+        onChange: (event)=>{
+            onChange?.(event);
+            resize();
+        },
         ...props
-    }));
+    });
+});
 Textarea.displayName = 'Textarea';
 export { Textarea };

package/dist/styles.css

@@ -1051,6 +1051,9 @@
   .h-72 {
     height: calc(var(--spacing) * 72);
   }
+  .h-75 {
+    height: calc(var(--spacing) * 75);
+  }
   .h-96 {
     height: calc(var(--spacing) * 96);
   }
@@ -1662,6 +1665,9 @@
   .resize-none {
     resize: none;
   }
+  .resize-y {
+    resize: vertical;
+  }
   .list-inside {
     list-style-position: inside;
   }
@@ -4201,6 +4207,10 @@
     --tw-blur: blur(8px);
     filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
   }
+  .invert {
+    --tw-invert: invert(100%);
+    filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
+  }
   .filter {
     filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uipath/apollo-wind",
-  "version": "2.27.1",
+  "version": "2.29.0",
   "description": "UiPath wind design system - A Tailwind CSS based React component library",
   "type": "module",
   "main": "./dist/index.js",