@uipath/apollo-wind 2.28.0 → 2.30.0

package/dist/components/ui/dropdown-menu.cjs

@@ -45,6 +45,7 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const react_dropdown_menu_namespaceObject = require("@radix-ui/react-dropdown-menu");
 const external_lucide_react_namespaceObject = require("lucide-react");
 const external_react_namespaceObject = require("react");
+const external_portal_container_cjs_namespaceObject = require("./portal-container.cjs");
 const index_cjs_namespaceObject = require("../../lib/index.cjs");
 const DropdownMenu = react_dropdown_menu_namespaceObject.Root;
 const DropdownMenuTrigger = react_dropdown_menu_namespaceObject.Trigger;
@@ -70,14 +71,18 @@ const DropdownMenuSubContent = /*#__PURE__*/ external_react_namespaceObject.forw
         ...props
     }));
 DropdownMenuSubContent.displayName = react_dropdown_menu_namespaceObject.SubContent.displayName;
-const DropdownMenuContent = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, sideOffset = 4, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_dropdown_menu_namespaceObject.Portal, {
+const DropdownMenuContent = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, sideOffset = 4, container, ...props }, ref)=>{
+    const resolvedContainer = (0, external_portal_container_cjs_namespaceObject.useResolvedPortalContainer)(container);
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_dropdown_menu_namespaceObject.Portal, {
+        container: resolvedContainer,
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_dropdown_menu_namespaceObject.Content, {
             ref: ref,
             sideOffset: sideOffset,
             className: (0, index_cjs_namespaceObject.cn)('z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md future:rounded-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin]', className),
             ...props
         })
-    }));
+    });
+});
 DropdownMenuContent.displayName = react_dropdown_menu_namespaceObject.Content.displayName;
 const DropdownMenuItem = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, inset, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_dropdown_menu_namespaceObject.Item, {
         ref: ref,

package/dist/components/ui/dropdown-menu.d.ts

@@ -1,5 +1,6 @@
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import * as React from 'react';
+import { type PortalContainerOverride } from './portal-container';
 declare const DropdownMenu: React.FC<DropdownMenuPrimitive.DropdownMenuProps>;
 declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
 declare const DropdownMenuGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & React.RefAttributes<HTMLDivElement>>;
@@ -10,7 +11,9 @@ declare const DropdownMenuSubTrigger: React.ForwardRefExoticComponent<Omit<Dropd
     inset?: boolean;
 } & React.RefAttributes<HTMLDivElement>>;
 declare const DropdownMenuSubContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const DropdownMenuContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    container?: PortalContainerOverride;
+} & React.RefAttributes<HTMLDivElement>>;
 declare const DropdownMenuItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
     inset?: boolean;
 } & React.RefAttributes<HTMLDivElement>>;

package/dist/components/ui/dropdown-menu.js

@@ -3,6 +3,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { CheckboxItem, Content, Group, Item, ItemIndicator, Label, Portal, RadioGroup, RadioItem, Root, Separator, Sub, SubContent, SubTrigger, Trigger } from "@radix-ui/react-dropdown-menu";
 import { Check, ChevronRight, Circle } from "lucide-react";
 import { forwardRef } from "react";
+import { useResolvedPortalContainer } from "./portal-container.js";
 import { cn } from "../../lib/index.js";
 const DropdownMenu = Root;
 const DropdownMenuTrigger = Trigger;
@@ -28,14 +29,18 @@ const DropdownMenuSubContent = /*#__PURE__*/ forwardRef(({ className, ...props }
         ...props
     }));
 DropdownMenuSubContent.displayName = SubContent.displayName;
-const DropdownMenuContent = /*#__PURE__*/ forwardRef(({ className, sideOffset = 4, ...props }, ref)=>/*#__PURE__*/ jsx(Portal, {
+const DropdownMenuContent = /*#__PURE__*/ forwardRef(({ className, sideOffset = 4, container, ...props }, ref)=>{
+    const resolvedContainer = useResolvedPortalContainer(container);
+    return /*#__PURE__*/ jsx(Portal, {
+        container: resolvedContainer,
         children: /*#__PURE__*/ jsx(Content, {
             ref: ref,
             sideOffset: sideOffset,
             className: cn('z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md future:rounded-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin]', className),
             ...props
         })
-    }));
+    });
+});
 DropdownMenuContent.displayName = Content.displayName;
 const DropdownMenuItem = /*#__PURE__*/ forwardRef(({ className, inset, ...props }, ref)=>/*#__PURE__*/ jsx(Item, {
         ref: ref,

package/dist/components/ui/index.cjs

@@ -27,7 +27,7 @@ var __webpack_modules__ = {
     "@/components/ui/button" (module) {
         module.exports = require("./button.cjs");
     },
-    "./calendar" (module) {
+    "@/components/ui/calendar" (module) {
         module.exports = require("./calendar.cjs");
     },
     "@/components/ui/card" (module) {
@@ -75,7 +75,7 @@ var __webpack_modules__ = {
     "@/components/ui/hover-card" (module) {
         module.exports = require("./hover-card.cjs");
     },
-    "@/components/ui/input-group" (module) {
+    "./input-group" (module) {
         module.exports = require("./input-group.cjs");
     },
     "@/components/ui/input" (module) {
@@ -144,13 +144,13 @@ var __webpack_modules__ = {
     "./switch" (module) {
         module.exports = require("./switch.cjs");
     },
-    "./table" (module) {
+    "@/components/ui/table" (module) {
         module.exports = require("./table.cjs");
     },
     "./tabs" (module) {
         module.exports = require("./tabs.cjs");
     },
-    "./textarea" (module) {
+    "@/components/ui/textarea" (module) {
         module.exports = require("./textarea.cjs");
     },
     "./toggle-group" (module) {
@@ -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__("./calendar");
+    var _calendar__rspack_import_9 = __webpack_require__("@/components/ui/calendar");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _calendar__rspack_import_9)if ([
         "TreeView",
@@ -394,7 +394,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_input__rspack_import_25[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _input_group__rspack_import_26 = __webpack_require__("@/components/ui/input-group");
+    var _input_group__rspack_import_26 = __webpack_require__("./input-group");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _input_group__rspack_import_26)if ([
         "TreeView",
@@ -548,7 +548,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_switch__rspack_import_47[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _table__rspack_import_48 = __webpack_require__("./table");
+    var _table__rspack_import_48 = __webpack_require__("@/components/ui/table");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _table__rspack_import_48)if ([
         "TreeView",
@@ -562,7 +562,7 @@ var __webpack_exports__ = {};
         "default"
     ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_tabs__rspack_import_49[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _textarea__rspack_import_50 = __webpack_require__("./textarea");
+    var _textarea__rspack_import_50 = __webpack_require__("@/components/ui/textarea");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _textarea__rspack_import_50)if ([
         "TreeView",

package/dist/components/ui/popover.cjs

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __webpack_require__ = {};
 (()=>{
     __webpack_require__.d = (exports1, definition)=>{
@@ -32,11 +33,15 @@ __webpack_require__.d(__webpack_exports__, {
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const react_popover_namespaceObject = require("@radix-ui/react-popover");
 const external_react_namespaceObject = require("react");
+const external_portal_container_cjs_namespaceObject = require("./portal-container.cjs");
 const index_cjs_namespaceObject = require("../../lib/index.cjs");
 const Popover = react_popover_namespaceObject.Root;
 const PopoverTrigger = react_popover_namespaceObject.Trigger;
 const PopoverAnchor = react_popover_namespaceObject.Anchor;
-const PopoverContent = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, align = 'center', sideOffset = 4, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_popover_namespaceObject.Portal, {
+const PopoverContent = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, align = 'center', sideOffset = 4, container, ...props }, ref)=>{
+    const resolvedContainer = (0, external_portal_container_cjs_namespaceObject.useResolvedPortalContainer)(container);
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_popover_namespaceObject.Portal, {
+        container: resolvedContainer,
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_popover_namespaceObject.Content, {
             ref: ref,
             align: align,
@@ -44,7 +49,8 @@ const PopoverContent = /*#__PURE__*/ external_react_namespaceObject.forwardRef((
             className: (0, index_cjs_namespaceObject.cn)('z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none future:rounded-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-popover-content-transform-origin]', className),
             ...props
         })
-    }));
+    });
+});
 PopoverContent.displayName = react_popover_namespaceObject.Content.displayName;
 exports.Popover = __webpack_exports__.Popover;
 exports.PopoverAnchor = __webpack_exports__.PopoverAnchor;

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

@@ -1,7 +1,10 @@
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 import * as React from 'react';
+import { type PortalContainerOverride } from './portal-container';
 declare const Popover: React.FC<PopoverPrimitive.PopoverProps>;
 declare const PopoverTrigger: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & React.RefAttributes<HTMLButtonElement>>;
 declare const PopoverAnchor: React.ForwardRefExoticComponent<PopoverPrimitive.PopoverAnchorProps & React.RefAttributes<HTMLDivElement>>;
-declare const PopoverContent: React.ForwardRefExoticComponent<Omit<PopoverPrimitive.PopoverContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const PopoverContent: React.ForwardRefExoticComponent<Omit<PopoverPrimitive.PopoverContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    container?: PortalContainerOverride;
+} & React.RefAttributes<HTMLDivElement>>;
 export { Popover, PopoverTrigger, PopoverAnchor, PopoverContent };

package/dist/components/ui/popover.js

@@ -1,11 +1,16 @@
+"use client";
 import { jsx } from "react/jsx-runtime";
 import { Anchor, Content, Portal, Root, Trigger } from "@radix-ui/react-popover";
 import { forwardRef } from "react";
+import { useResolvedPortalContainer } from "./portal-container.js";
 import { cn } from "../../lib/index.js";
 const Popover = Root;
 const PopoverTrigger = Trigger;
 const PopoverAnchor = Anchor;
-const PopoverContent = /*#__PURE__*/ forwardRef(({ className, align = 'center', sideOffset = 4, ...props }, ref)=>/*#__PURE__*/ jsx(Portal, {
+const PopoverContent = /*#__PURE__*/ forwardRef(({ className, align = 'center', sideOffset = 4, container, ...props }, ref)=>{
+    const resolvedContainer = useResolvedPortalContainer(container);
+    return /*#__PURE__*/ jsx(Portal, {
+        container: resolvedContainer,
         children: /*#__PURE__*/ jsx(Content, {
             ref: ref,
             align: align,
@@ -13,6 +18,7 @@ const PopoverContent = /*#__PURE__*/ forwardRef(({ className, align = 'center',
             className: cn('z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none future:rounded-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-popover-content-transform-origin]', className),
             ...props
         })
-    }));
+    });
+});
 PopoverContent.displayName = Content.displayName;
 export { Popover, PopoverAnchor, PopoverContent, PopoverTrigger };

package/dist/components/ui/portal-container.cjs

@@ -0,0 +1,62 @@
+"use strict";
+"use client";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    PortalContainerProvider: ()=>PortalContainerProvider,
+    useResolvedPortalContainer: ()=>useResolvedPortalContainer
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const external_react_namespaceObject = require("react");
+const PortalContainerContext = /*#__PURE__*/ external_react_namespaceObject.createContext(null);
+const usePortalContainer = ()=>external_react_namespaceObject.useContext(PortalContainerContext);
+function useResolvedPortalContainer(container) {
+    const portalContainer = usePortalContainer();
+    if ('body' === container) return;
+    return container ?? portalContainer ?? void 0;
+}
+function PortalContainerProvider({ children, container }) {
+    const [boundary, setBoundary] = external_react_namespaceObject.useState(null);
+    const value = container ?? boundary;
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(PortalContainerContext.Provider, {
+        value: value,
+        children: [
+            children,
+            null == container && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                ref: setBoundary,
+                className: "contents"
+            })
+        ]
+    });
+}
+exports.PortalContainerProvider = __webpack_exports__.PortalContainerProvider;
+exports.useResolvedPortalContainer = __webpack_exports__.useResolvedPortalContainer;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "PortalContainerProvider",
+    "useResolvedPortalContainer"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/ui/portal-container.d.ts

@@ -0,0 +1,31 @@
+import * as React from 'react';
+/**
+ * Per-overlay portal target: `undefined`/`null` inherit the nearest
+ * {@link PortalContainerProvider} (or `document.body` if none), `'body'` forces
+ * `document.body`, an element portals into it. `null` inherits rather than
+ * forcing body so `container={ref.current}` is safe before the ref attaches.
+ */
+export type PortalContainerOverride = HTMLElement | 'body' | null;
+/**
+ * Resolves an overlay's portal target from its `container` and the ambient
+ * provider, shared so the behavior stays identical across overlays. `undefined`
+ * is Radix's default (`document.body`) and keeps SSR clear of `document`.
+ */
+export declare function useResolvedPortalContainer(container?: PortalContainerOverride): HTMLElement | undefined;
+export interface PortalContainerProviderProps {
+    children: React.ReactNode;
+    /** Node to portal into; omit (or pass a not-yet-attached ref, i.e. `null`) for an auto in-tree boundary. */
+    container?: HTMLElement | null;
+}
+/**
+ * Portals Popover/Select/DropdownMenu content (and Combobox/MultiSelect built on
+ * them) into its own subtree instead of `document.body`, keeping overlays in the
+ * trigger's DOM root and focus boundary. Without it they break under shadow-DOM
+ * or focus-trapped hosts, where body-level content escapes the root. Mount one
+ * per React root.
+ *
+ * Known limitation: an overlay open *on mount* portals to `document.body` for
+ * the first commit (the boundary ref hasn't attached yet) then remounts; pass a
+ * stable `container` you own for that case.
+ */
+export declare function PortalContainerProvider({ children, container }: PortalContainerProviderProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/portal-container.js

@@ -0,0 +1,25 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { createContext, useContext, useState } from "react";
+const PortalContainerContext = /*#__PURE__*/ createContext(null);
+const usePortalContainer = ()=>useContext(PortalContainerContext);
+function useResolvedPortalContainer(container) {
+    const portalContainer = usePortalContainer();
+    if ('body' === container) return;
+    return container ?? portalContainer ?? void 0;
+}
+function PortalContainerProvider({ children, container }) {
+    const [boundary, setBoundary] = useState(null);
+    const value = container ?? boundary;
+    return /*#__PURE__*/ jsxs(PortalContainerContext.Provider, {
+        value: value,
+        children: [
+            children,
+            null == container && /*#__PURE__*/ jsx("div", {
+                ref: setBoundary,
+                className: "contents"
+            })
+        ]
+    });
+}
+export { PortalContainerProvider, useResolvedPortalContainer };

package/dist/components/ui/select.cjs

@@ -1,4 +1,5 @@
 "use strict";
+"use client";
 var __webpack_require__ = {};
 (()=>{
     __webpack_require__.d = (exports1, definition)=>{
@@ -39,6 +40,7 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const react_select_namespaceObject = require("@radix-ui/react-select");
 const external_lucide_react_namespaceObject = require("lucide-react");
 const external_react_namespaceObject = require("react");
+const external_portal_container_cjs_namespaceObject = require("./portal-container.cjs");
 const index_cjs_namespaceObject = require("../../lib/index.cjs");
 const Select = react_select_namespaceObject.Root;
 const SelectGroup = react_select_namespaceObject.Group;
@@ -76,7 +78,10 @@ const SelectScrollDownButton = /*#__PURE__*/ external_react_namespaceObject.forw
         })
     }));
 SelectScrollDownButton.displayName = react_select_namespaceObject.ScrollDownButton.displayName;
-const SelectContent = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, children, position = 'popper', ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_select_namespaceObject.Portal, {
+const SelectContent = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, children, position = 'popper', container, ...props }, ref)=>{
+    const resolvedContainer = (0, external_portal_container_cjs_namespaceObject.useResolvedPortalContainer)(container);
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_select_namespaceObject.Portal, {
+        container: resolvedContainer,
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(react_select_namespaceObject.Content, {
             ref: ref,
             className: (0, index_cjs_namespaceObject.cn)('relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover text-popover-foreground shadow-md future:rounded-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-select-content-transform-origin]', 'popper' === position && 'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1', className),
@@ -91,7 +96,8 @@ const SelectContent = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({
                 /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(SelectScrollDownButton, {})
             ]
         })
-    }));
+    });
+});
 SelectContent.displayName = react_select_namespaceObject.Content.displayName;
 const SelectLabel = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_select_namespaceObject.Label, {
         ref: ref,

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

@@ -1,12 +1,15 @@
 import * as SelectPrimitive from '@radix-ui/react-select';
 import * as React from 'react';
+import { type PortalContainerOverride } from './portal-container';
 declare const Select: React.FC<SelectPrimitive.SelectProps>;
 declare const SelectGroup: React.ForwardRefExoticComponent<SelectPrimitive.SelectGroupProps & React.RefAttributes<HTMLDivElement>>;
 declare const SelectValue: React.ForwardRefExoticComponent<SelectPrimitive.SelectValueProps & React.RefAttributes<HTMLSpanElement>>;
 declare const SelectTrigger: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
 declare const SelectScrollUpButton: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectScrollUpButtonProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const SelectScrollDownButton: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectScrollDownButtonProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
-declare const SelectContent: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SelectContent: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    container?: PortalContainerOverride;
+} & React.RefAttributes<HTMLDivElement>>;
 declare const SelectLabel: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const SelectItem: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
 declare const SelectSeparator: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/dist/components/ui/select.js

@@ -1,7 +1,9 @@
+"use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Content, Group, Icon, Item, ItemIndicator, ItemText, Label, Portal, Root, ScrollDownButton, ScrollUpButton, Separator, Trigger, Value, Viewport } from "@radix-ui/react-select";
 import { Check, ChevronDown, ChevronUp } from "lucide-react";
 import { forwardRef } from "react";
+import { useResolvedPortalContainer } from "./portal-container.js";
 import { cn } from "../../lib/index.js";
 const Select = Root;
 const SelectGroup = Group;
@@ -39,7 +41,10 @@ const SelectScrollDownButton = /*#__PURE__*/ forwardRef(({ className, ...props }
         })
     }));
 SelectScrollDownButton.displayName = ScrollDownButton.displayName;
-const SelectContent = /*#__PURE__*/ forwardRef(({ className, children, position = 'popper', ...props }, ref)=>/*#__PURE__*/ jsx(Portal, {
+const SelectContent = /*#__PURE__*/ forwardRef(({ className, children, position = 'popper', container, ...props }, ref)=>{
+    const resolvedContainer = useResolvedPortalContainer(container);
+    return /*#__PURE__*/ jsx(Portal, {
+        container: resolvedContainer,
         children: /*#__PURE__*/ jsxs(Content, {
             ref: ref,
             className: cn('relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border bg-popover text-popover-foreground shadow-md future:rounded-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-select-content-transform-origin]', 'popper' === position && 'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1', className),
@@ -54,7 +59,8 @@ const SelectContent = /*#__PURE__*/ forwardRef(({ className, children, position
                 /*#__PURE__*/ jsx(SelectScrollDownButton, {})
             ]
         })
-    }));
+    });
+});
 SelectContent.displayName = Content.displayName;
 const SelectLabel = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(Label, {
         ref: ref,

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/index.cjs

@@ -33,6 +33,7 @@ var __webpack_require__ = {};
 var __webpack_exports__ = {};
 __webpack_require__.r(__webpack_exports__);
 __webpack_require__.d(__webpack_exports__, {
+    autoSavePlugin: ()=>form_plugins_cjs_namespaceObject.autoSavePlugin,
     PaginationLink: ()=>pagination_cjs_namespaceObject.PaginationLink,
     ContextMenuCheckboxItem: ()=>context_menu_cjs_namespaceObject.ContextMenuCheckboxItem,
     AlertDialogContent: ()=>alert_dialog_cjs_namespaceObject.AlertDialogContent,
@@ -246,13 +247,13 @@ __webpack_require__.d(__webpack_exports__, {
     Breadcrumb: ()=>breadcrumb_cjs_namespaceObject.Breadcrumb,
     ContextMenuShortcut: ()=>context_menu_cjs_namespaceObject.ContextMenuShortcut,
     HoverCardTrigger: ()=>hover_card_cjs_namespaceObject.HoverCardTrigger,
-    ResizablePanelGroup: ()=>resizable_cjs_namespaceObject.ResizablePanelGroup,
+    PortalContainerProvider: ()=>portal_container_cjs_namespaceObject.PortalContainerProvider,
     CardHeader: ()=>card_cjs_namespaceObject.CardHeader,
     HoverCardContent: ()=>hover_card_cjs_namespaceObject.HoverCardContent,
-    ScrollBar: ()=>scroll_area_cjs_namespaceObject.ScrollBar,
+    ResizablePanelGroup: ()=>resizable_cjs_namespaceObject.ResizablePanelGroup,
     FileUpload: ()=>file_upload_cjs_namespaceObject.FileUpload,
     InputGroupInput: ()=>input_group_cjs_namespaceObject.InputGroupInput,
-    autoSavePlugin: ()=>form_plugins_cjs_namespaceObject.autoSavePlugin
+    ScrollBar: ()=>scroll_area_cjs_namespaceObject.ScrollBar
 });
 const utils_cjs_namespaceObject = require("./lib/utils.cjs");
 const row_cjs_namespaceObject = require("./components/ui/layout/row.cjs");
@@ -296,6 +297,7 @@ const dialog_cjs_namespaceObject = require("./components/ui/dialog.cjs");
 const alert_dialog_cjs_namespaceObject = require("./components/ui/alert-dialog.cjs");
 const sheet_cjs_namespaceObject = require("./components/ui/sheet.cjs");
 const popover_cjs_namespaceObject = require("./components/ui/popover.cjs");
+const portal_container_cjs_namespaceObject = require("./components/ui/portal-container.cjs");
 const tooltip_cjs_namespaceObject = require("./components/ui/tooltip.cjs");
 const hover_card_cjs_namespaceObject = require("./components/ui/hover-card.cjs");
 const alert_cjs_namespaceObject = require("./components/ui/alert.cjs");
@@ -458,6 +460,7 @@ exports.Popover = __webpack_exports__.Popover;
 exports.PopoverAnchor = __webpack_exports__.PopoverAnchor;
 exports.PopoverContent = __webpack_exports__.PopoverContent;
 exports.PopoverTrigger = __webpack_exports__.PopoverTrigger;
+exports.PortalContainerProvider = __webpack_exports__.PortalContainerProvider;
 exports.Progress = __webpack_exports__.Progress;
 exports.PromptEditor = __webpack_exports__.PromptEditor;
 exports.RadioGroup = __webpack_exports__.RadioGroup;
@@ -679,6 +682,7 @@ for(var __rspack_i in __webpack_exports__)if (-1 === [
     "PopoverAnchor",
     "PopoverContent",
     "PopoverTrigger",
+    "PortalContainerProvider",
     "Progress",
     "PromptEditor",
     "RadioGroup",

package/dist/index.d.ts

@@ -59,6 +59,8 @@ export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, Di
 export { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, } from './components/ui/alert-dialog';
 export { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, } from './components/ui/sheet';
 export { Popover, PopoverAnchor, PopoverContent, PopoverTrigger, } from './components/ui/popover';
+export { PortalContainerProvider } from './components/ui/portal-container';
+export type { PortalContainerProviderProps } from './components/ui/portal-container';
 export { Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, } from './components/ui/tooltip';
 export { HoverCard, HoverCardContent, HoverCardTrigger, } from './components/ui/hover-card';
 export { Alert, AlertDescription, AlertTitle } from './components/ui/alert';

package/dist/index.js

@@ -39,6 +39,7 @@ import { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, Di
 import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger } from "./components/ui/alert-dialog.js";
 import { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger } from "./components/ui/sheet.js";
 import { Popover, PopoverAnchor, PopoverContent, PopoverTrigger } from "./components/ui/popover.js";
+import { PortalContainerProvider } from "./components/ui/portal-container.js";
 import { Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger } from "./components/ui/tooltip.js";
 import { HoverCard, HoverCardContent, HoverCardTrigger } from "./components/ui/hover-card.js";
 import { Alert, AlertDescription, AlertTitle } from "./components/ui/alert.js";
@@ -64,4 +65,4 @@ import { ExpressionBuilder, RuleBuilder, RulesEngine } from "./components/forms/
 import { DataFetcher, DataSourceBuilder, DataTransformers, FetchAdapter } from "./components/forms/data-fetcher.js";
 import { analyticsPlugin, auditPlugin, autoSavePlugin, formattingPlugin, validationPlugin, workflowPlugin } from "./components/forms/form-plugins.js";
 import { hasMinMaxStep, hasOptions, isCustomField, isFileField } from "./components/forms/form-schema.js";
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Column, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, DataFetcher, DataSourceBuilder, DataTable, DataTableColumnHeader, DataTableSelectColumn, DataTransformers, DatePicker, DateTimePicker, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EditableCell, EmptyState, ExpressionBuilder, FetchAdapter, FileUpload, FormDesigner, FormFieldRenderer, FormStateViewer, Grid, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, Label, MetadataForm, MultiSelect, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, PromptEditor, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, Row, RuleBuilder, RulesEngine, ScrollArea, ScrollBar, ScrollableTabsList, Search, SearchWithSuggestions, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, Slider, Spinner, StatsCard, Stepper, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, tree_view as TreeView, VARIABLE_DRAG_MIME, analyticsPlugin, auditPlugin, autoSavePlugin, badgeVariants, buttonVariants, cn, createEditableColumn, formattingPlugin, hasMinMaxStep, hasOptions, isCustomField, isFileField, spinnerVariants, toast, toggleVariants, validationPlugin, workflowPlugin };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AspectRatio, Avatar, AvatarFallback, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, ButtonGroup, ButtonGroupSeparator, ButtonGroupText, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Column, Combobox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, DataFetcher, DataSourceBuilder, DataTable, DataTableColumnHeader, DataTableSelectColumn, DataTransformers, DatePicker, DateTimePicker, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, EditableCell, EmptyState, ExpressionBuilder, FetchAdapter, FileUpload, FormDesigner, FormFieldRenderer, FormStateViewer, Grid, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, Label, MetadataForm, MultiSelect, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PortalContainerProvider, Progress, PromptEditor, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, Row, RuleBuilder, RulesEngine, ScrollArea, ScrollBar, ScrollableTabsList, Search, SearchWithSuggestions, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, Slider, Spinner, StatsCard, Stepper, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, tree_view as TreeView, VARIABLE_DRAG_MIME, analyticsPlugin, auditPlugin, autoSavePlugin, badgeVariants, buttonVariants, cn, createEditableColumn, formattingPlugin, hasMinMaxStep, hasOptions, isCustomField, isFileField, spinnerVariants, toast, toggleVariants, validationPlugin, workflowPlugin };

package/dist/styles.css

@@ -1665,6 +1665,9 @@
   .resize-none {
     resize: none;
   }
+  .resize-y {
+    resize: vertical;
+  }
   .list-inside {
     list-style-position: inside;
   }
@@ -6844,7 +6847,7 @@
     }
   }
 }
-:root {
+:root, :host {
   --color-orange-100: #fee3dc;
   --color-orange-200: #fda891;
   --color-orange-300: #ff8f70;
@@ -7861,6 +7864,18 @@
   --color-gradient-human-end-dark-hc: #2b5372;
   --color-gradient-human-end-future-dark: #2b5372;
   --color-gradient-human-end-future-light: #d8eeff;
+  --color-canvas-background-light: #f4f5f7;
+  --color-canvas-background-light-hc: #f4f5f7;
+  --color-canvas-background-dark: #10151a;
+  --color-canvas-background-dark-hc: #10151a;
+  --color-canvas-background-future-dark: #09090b;
+  --color-canvas-background-future-light: #fafafa;
+  --color-dot-grid-light: #dce5eb;
+  --color-dot-grid-light-hc: #dce5eb;
+  --color-dot-grid-dark: #2f3133;
+  --color-dot-grid-dark-hc: #2f3133;
+  --color-dot-grid-future-dark: #27272a;
+  --color-dot-grid-future-light: #e4e4e7;
   --color-background-overlay-light: #f4f5f7;
   --color-background-overlay-light-hc: #f4f5f7;
   --color-background-overlay-dark: #374652;
@@ -8307,6 +8322,8 @@ body.light, .apollo-design.light, :where(.light:not(.react-flow)) {
   --color-gradient-invoked-end: #daf3ff;
   --color-gradient-human-start: #f6faff;
   --color-gradient-human-end: #d8eeff;
+  --color-canvas-background: #f4f5f7;
+  --color-dot-grid: #dce5eb;
   --color-background-overlay: #f4f5f7;
   --color-foreground-secondary: #182027;
   --color-foreground-hover: #526069;
@@ -8439,6 +8456,8 @@ body.light-hc, .apollo-design.light-hc, :where(.light-hc) {
   --color-gradient-invoked-end: #daf3ff;
   --color-gradient-human-start: #f6faff;
   --color-gradient-human-end: #d8eeff;
+  --color-canvas-background: #f4f5f7;
+  --color-dot-grid: #dce5eb;
   --color-background-overlay: #f4f5f7;
   --color-foreground-secondary: #182027;
   --color-foreground-hover: #374652;
@@ -8571,6 +8590,8 @@ body.dark, .apollo-design.dark, :where(.dark:not(.react-flow)) {
   --color-gradient-invoked-end: #35667d;
   --color-gradient-human-start: #6885ab;
   --color-gradient-human-end: #2b5372;
+  --color-canvas-background: #10151a;
+  --color-dot-grid: #2f3133;
   --color-background-overlay: #374652;
   --color-foreground-secondary: #f8f9fa;
   --color-foreground-hover: #cfd8dd;
@@ -8703,6 +8724,8 @@ body.dark-hc, .apollo-design.dark-hc, :where(.dark-hc) {
   --color-gradient-invoked-end: #35667d;
   --color-gradient-human-start: #6885ab;
   --color-gradient-human-end: #2b5372;
+  --color-canvas-background: #10151a;
+  --color-dot-grid: #2f3133;
   --color-background-overlay: #374652;
   --color-foreground-secondary: #f8f9fa;
   --color-foreground-hover: #cfd8dd;
@@ -8835,6 +8858,8 @@ body.future-dark, .future-dark {
   --color-gradient-invoked-end: #35667d;
   --color-gradient-human-start: #6885ab;
   --color-gradient-human-end: #2b5372;
+  --color-canvas-background: #09090b;
+  --color-dot-grid: #27272a;
   --color-background-overlay: #27272a;
   --color-foreground-secondary: #f4f4f5;
   --color-foreground-hover: #d4d4d8;
@@ -8967,6 +8992,8 @@ body.future-light, .future-light {
   --color-gradient-invoked-end: #daf3ff;
   --color-gradient-human-start: #f6faff;
   --color-gradient-human-end: #d8eeff;
+  --color-canvas-background: #fafafa;
+  --color-dot-grid: #e4e4e7;
   --color-background-overlay: #e4e4e7;
   --color-foreground-secondary: #18181b;
   --color-foreground-hover: #52525c;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uipath/apollo-wind",
-  "version": "2.28.0",
+  "version": "2.30.0",
   "description": "UiPath wind design system - A Tailwind CSS based React component library",
   "type": "module",
   "main": "./dist/index.js",
@@ -124,7 +124,7 @@
     "tailwindcss": "^4.1.17",
     "vaul": "^1.1.2",
     "zod": "^4.3.5",
-    "@uipath/apollo-core": "5.10.0"
+    "@uipath/apollo-core": "5.11.1"
   },
   "devDependencies": {
     "@codemirror/lang-javascript": "^6.2.5",