@uipath/apollo-react 4.18.3 → 4.20.0-pr644.8243dcd

package/dist/canvas/components/StickyNoteNode/StickyNoteNode.js

@@ -19,9 +19,9 @@ import { useMarkdownShortcuts } from "./useMarkdownShortcuts.js";
 import { useScrollCapture } from "./useScrollCapture.js";
 const minWidth = 8 * GRID_SPACING;
 const minHeight = 8 * GRID_SPACING;
-const StickyNoteNodeComponent = ({ id, data, selected, dragging, placeholder = 'Add text', renderPlaceholderOnSelect = false, onContentChange, onColorChange, onResize })=>{
+const StickyNoteNodeComponent = ({ id, data, selected, dragging, placeholder = 'Add text', renderPlaceholderOnSelect = false, readOnly = false, onContentChange, onColorChange, onResize })=>{
     const { updateNodeData, deleteElements } = useReactFlow();
-    const [isEditing, setIsEditing] = useState(data.autoFocus ?? false);
+    const [isEditing, setIsEditing] = useState(!readOnly && (data.autoFocus ?? false));
     const [isResizing, setIsResizing] = useState(false);
     const [isColorPickerOpen, setIsColorPickerOpen] = useState(false);
     const [localContent, setLocalContent] = useState(data.content || '');
@@ -48,14 +48,15 @@ const StickyNoteNodeComponent = ({ id, data, selected, dragging, placeholder = '
             textAreaRef.current.focus();
             textAreaRef.current.select();
         }
-        if (data.autoFocus) updateNodeData(id, {
+        if (!readOnly && data.autoFocus) updateNodeData(id, {
             autoFocus: false
         });
     }, [
         isEditing,
         data.autoFocus,
         id,
-        updateNodeData
+        updateNodeData,
+        readOnly
     ]);
     useEffect(()=>{
         if (!selected || isResizing) setIsColorPickerOpen(false);
@@ -63,8 +64,17 @@ const StickyNoteNodeComponent = ({ id, data, selected, dragging, placeholder = '
         selected,
         isResizing
     ]);
+    useEffect(()=>{
+        if (readOnly) {
+            setIsEditing(false);
+            setLocalContent(data.content || '');
+        }
+    }, [
+        readOnly,
+        data.content
+    ]);
     const handleDoubleClick = useCallback(()=>{
-        if (isEditing) return;
+        if (readOnly || isEditing) return;
         setIsEditing(true);
         setTimeout(()=>{
             if (textAreaRef.current) {
@@ -73,10 +83,12 @@ const StickyNoteNodeComponent = ({ id, data, selected, dragging, placeholder = '
             }
         }, 0);
     }, [
-        isEditing
+        isEditing,
+        readOnly
     ]);
     const handleBlur = useCallback(()=>{
         setIsEditing(false);
+        if (readOnly) return;
         if (localContent !== data.content) {
             onContentChange?.(localContent);
             updateNodeData(id, {
@@ -88,7 +100,8 @@ const StickyNoteNodeComponent = ({ id, data, selected, dragging, placeholder = '
         localContent,
         data.content,
         updateNodeData,
-        onContentChange
+        onContentChange,
+        readOnly
     ]);
     const handleChange = useCallback((e)=>{
         setLocalContent(e.target.value);
@@ -165,6 +178,7 @@ const StickyNoteNodeComponent = ({ id, data, selected, dragging, placeholder = '
         setIsColorPickerOpen((prev)=>!prev);
     }, []);
     const handleEditClick = useCallback(()=>{
+        if (readOnly) return;
         setIsEditing(true);
         setTimeout(()=>{
             if (textAreaRef.current) {
@@ -172,7 +186,9 @@ const StickyNoteNodeComponent = ({ id, data, selected, dragging, placeholder = '
                 textAreaRef.current.select();
             }
         }, 0);
-    }, []);
+    }, [
+        readOnly
+    ]);
     const handleDelete = useCallback(()=>{
         deleteElements({
             nodes: [
@@ -259,69 +275,73 @@ const StickyNoteNodeComponent = ({ id, data, selected, dragging, placeholder = '
             }),
             /*#__PURE__*/ jsxs(StickyNoteWrapper, {
                 children: [
-                    /*#__PURE__*/ jsx(NodeResizeControl, {
-                        style: {
-                            background: 'transparent',
-                            border: 'none',
-                            zIndex: RESIZE_CONTROL_Z_INDEX
-                        },
-                        position: "top-left",
-                        minWidth: minWidth,
-                        minHeight: minHeight,
-                        onResizeStart: handleResizeStart,
-                        onResizeEnd: handleResizeEnd,
-                        children: /*#__PURE__*/ jsx(ResizeHandle, {
-                            selected: selected,
-                            cursor: "nwse-resize"
-                        })
-                    }),
-                    /*#__PURE__*/ jsx(NodeResizeControl, {
-                        style: {
-                            background: 'transparent',
-                            border: 'none',
-                            zIndex: RESIZE_CONTROL_Z_INDEX
-                        },
-                        position: "top-right",
-                        minWidth: minWidth,
-                        minHeight: minHeight,
-                        onResizeStart: handleResizeStart,
-                        onResizeEnd: handleResizeEnd,
-                        children: /*#__PURE__*/ jsx(ResizeHandle, {
-                            selected: selected,
-                            cursor: "nesw-resize"
-                        })
-                    }),
-                    /*#__PURE__*/ jsx(NodeResizeControl, {
-                        style: {
-                            background: 'transparent',
-                            border: 'none',
-                            zIndex: RESIZE_CONTROL_Z_INDEX
-                        },
-                        position: "bottom-left",
-                        minWidth: minWidth,
-                        minHeight: minHeight,
-                        onResizeStart: handleResizeStart,
-                        onResizeEnd: handleResizeEnd,
-                        children: /*#__PURE__*/ jsx(ResizeHandle, {
-                            selected: selected,
-                            cursor: "nesw-resize"
-                        })
-                    }),
-                    /*#__PURE__*/ jsx(NodeResizeControl, {
-                        style: {
-                            background: 'transparent',
-                            border: 'none',
-                            zIndex: RESIZE_CONTROL_Z_INDEX
-                        },
-                        position: "bottom-right",
-                        minWidth: minWidth,
-                        minHeight: minHeight,
-                        onResizeStart: handleResizeStart,
-                        onResizeEnd: handleResizeEnd,
-                        children: /*#__PURE__*/ jsx(ResizeHandle, {
-                            selected: selected,
-                            cursor: "nwse-resize"
-                        })
+                    !readOnly && /*#__PURE__*/ jsxs(Fragment, {
+                        children: [
+                            /*#__PURE__*/ jsx(NodeResizeControl, {
+                                style: {
+                                    background: 'transparent',
+                                    border: 'none',
+                                    zIndex: RESIZE_CONTROL_Z_INDEX
+                                },
+                                position: "top-left",
+                                minWidth: minWidth,
+                                minHeight: minHeight,
+                                onResizeStart: handleResizeStart,
+                                onResizeEnd: handleResizeEnd,
+                                children: /*#__PURE__*/ jsx(ResizeHandle, {
+                                    selected: selected,
+                                    cursor: "nwse-resize"
+                                })
+                            }),
+                            /*#__PURE__*/ jsx(NodeResizeControl, {
+                                style: {
+                                    background: 'transparent',
+                                    border: 'none',
+                                    zIndex: RESIZE_CONTROL_Z_INDEX
+                                },
+                                position: "top-right",
+                                minWidth: minWidth,
+                                minHeight: minHeight,
+                                onResizeStart: handleResizeStart,
+                                onResizeEnd: handleResizeEnd,
+                                children: /*#__PURE__*/ jsx(ResizeHandle, {
+                                    selected: selected,
+                                    cursor: "nesw-resize"
+                                })
+                            }),
+                            /*#__PURE__*/ jsx(NodeResizeControl, {
+                                style: {
+                                    background: 'transparent',
+                                    border: 'none',
+                                    zIndex: RESIZE_CONTROL_Z_INDEX
+                                },
+                                position: "bottom-left",
+                                minWidth: minWidth,
+                                minHeight: minHeight,
+                                onResizeStart: handleResizeStart,
+                                onResizeEnd: handleResizeEnd,
+                                children: /*#__PURE__*/ jsx(ResizeHandle, {
+                                    selected: selected,
+                                    cursor: "nesw-resize"
+                                })
+                            }),
+                            /*#__PURE__*/ jsx(NodeResizeControl, {
+                                style: {
+                                    background: 'transparent',
+                                    border: 'none',
+                                    zIndex: RESIZE_CONTROL_Z_INDEX
+                                },
+                                position: "bottom-right",
+                                minWidth: minWidth,
+                                minHeight: minHeight,
+                                onResizeStart: handleResizeStart,
+                                onResizeEnd: handleResizeEnd,
+                                children: /*#__PURE__*/ jsx(ResizeHandle, {
+                                    selected: selected,
+                                    cursor: "nwse-resize"
+                                })
+                            })
+                        ]
                     }),
                     /*#__PURE__*/ jsxs(StickyNoteContainer, {
                         backgroundColor: colorWithAlpha,
@@ -331,10 +351,10 @@ const StickyNoteNodeComponent = ({ id, data, selected, dragging, placeholder = '
                         onDoubleClick: handleDoubleClick,
                         children: [
                             /*#__PURE__*/ jsx(TopCornerIndicators, {
-                                selected: selected
+                                visible: selected && !readOnly
                             }),
                             /*#__PURE__*/ jsx(BottomCornerIndicators, {
-                                selected: selected
+                                visible: selected && !readOnly
                             }),
                             isEditing ? /*#__PURE__*/ jsxs(ApI18nProvider, {
                                 component: "canvas",
@@ -379,13 +399,13 @@ const StickyNoteNodeComponent = ({ id, data, selected, dragging, placeholder = '
                             })
                         ]
                     }),
-                    selected && !dragging && !isResizing && /*#__PURE__*/ jsx(NodeToolbar, {
+                    !readOnly && selected && !dragging && !isResizing && /*#__PURE__*/ jsx(NodeToolbar, {
                         nodeId: id,
                         config: toolbarConfig,
                         expanded: true
                     }),
                     /*#__PURE__*/ jsx(AnimatePresence, {
-                        children: selected && !dragging && !isResizing && isColorPickerOpen && /*#__PURE__*/ jsx("div", {
+                        children: !readOnly && selected && !dragging && !isResizing && isColorPickerOpen && /*#__PURE__*/ jsx("div", {
                             style: {
                                 position: 'absolute',
                                 top: -40,

package/dist/canvas/components/StickyNoteNode/StickyNoteNode.styles.cjs

@@ -281,7 +281,7 @@ const TopCornerIndicators = styled_default().div`
   position: absolute;
   inset: 0;
   pointer-events: none;
-  opacity: ${(props)=>props.selected ? 1 : 0};
+  opacity: ${(props)=>props.visible ? 1 : 0};
 
   /* Top-left corner */
   &::before {
@@ -313,7 +313,7 @@ const BottomCornerIndicators = styled_default().div`
   position: absolute;
   inset: 0;
   pointer-events: none;
-  opacity: ${(props)=>props.selected ? 1 : 0};
+  opacity: ${(props)=>props.visible ? 1 : 0};
 
   /* Bottom-left corner */
   &::before {

package/dist/canvas/components/StickyNoteNode/StickyNoteNode.styles.d.ts

@@ -35,13 +35,13 @@ export declare const TopCornerIndicators: import("@emotion/styled").StyledCompon
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    selected?: boolean;
+    visible?: boolean;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const BottomCornerIndicators: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    selected?: boolean;
+    visible?: boolean;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const ColorPickerPanel: import("@emotion/styled").StyledComponent<Omit<import("motion/react").HTMLMotionProps<"div">, "ref"> & import("react").RefAttributes<HTMLDivElement> & {
     theme?: import("@emotion/react").Theme;

package/dist/canvas/components/StickyNoteNode/StickyNoteNode.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StickyNoteNode.styles.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StickyNoteNode/StickyNoteNode.styles.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,8BAA8B,MAAM,CAAC;AA4BlD,eAAO,MAAM,sBAAsB,MAAM,CAAC;AAE1C,eAAO,MAAM,sBAAsB,2CAUlC,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;yGAI7B,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;iBACjB,MAAM;qBACF,MAAM;eACZ,OAAO;eACP,OAAO;yGAuBnB,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;;eAAgC,OAAO;2HAsBrE,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;yGA8H9B,CAAC;AAEF,eAAO,MAAM,YAAY;;;;eAA2B,OAAO;aAAW,MAAM;yGAW3E,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;eAA2B,OAAO;yGA+BjE,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;;eAA2B,OAAO;yGA+BpE,CAAC;AAEF,eAAO,MAAM,gBAAgB;;UAa5B,CAAC;AAEF,eAAO,MAAM,WAAW;;;;WAA0B,MAAM;gBAAc,OAAO;qHAkB5E,CAAC;AAEF,eAAO,MAAM,0BAA0B;;;;iBAA6B,MAAM;yGAQzE,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;cAA6B,OAAO;qHAoBhE,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;yGAK5B,CAAC"}
+{"version":3,"file":"StickyNoteNode.styles.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StickyNoteNode/StickyNoteNode.styles.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,8BAA8B,MAAM,CAAC;AA4BlD,eAAO,MAAM,sBAAsB,MAAM,CAAC;AAE1C,eAAO,MAAM,sBAAsB,2CAUlC,CAAC;AAEF,eAAO,MAAM,iBAAiB;;;yGAI7B,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;iBACjB,MAAM;qBACF,MAAM;eACZ,OAAO;eACP,OAAO;yGAuBnB,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;;eAAgC,OAAO;2HAsBrE,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;yGA8H9B,CAAC;AAEF,eAAO,MAAM,YAAY;;;;eAA2B,OAAO;aAAW,MAAM;yGAW3E,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;cAA0B,OAAO;yGA+BhE,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;;cAA0B,OAAO;yGA+BnE,CAAC;AAEF,eAAO,MAAM,gBAAgB;;UAa5B,CAAC;AAEF,eAAO,MAAM,WAAW;;;;WAA0B,MAAM;gBAAc,OAAO;qHAkB5E,CAAC;AAEF,eAAO,MAAM,0BAA0B;;;;iBAA6B,MAAM;yGAQzE,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;cAA6B,OAAO;qHAoBhE,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;yGAK5B,CAAC"}

package/dist/canvas/components/StickyNoteNode/StickyNoteNode.styles.js

@@ -229,7 +229,7 @@ const TopCornerIndicators = styled.div`
   position: absolute;
   inset: 0;
   pointer-events: none;
-  opacity: ${(props)=>props.selected ? 1 : 0};
+  opacity: ${(props)=>props.visible ? 1 : 0};
 
   /* Top-left corner */
   &::before {
@@ -261,7 +261,7 @@ const BottomCornerIndicators = styled.div`
   position: absolute;
   inset: 0;
   pointer-events: none;
-  opacity: ${(props)=>props.selected ? 1 : 0};
+  opacity: ${(props)=>props.visible ? 1 : 0};
 
   /* Bottom-left corner */
   &::before {

package/dist/canvas/components/Toolbox/ListView.cjs

@@ -34,6 +34,7 @@ const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
 const external_react_namespaceObject = require("react");
 const CanvasThemeContext_cjs_namespaceObject = require("../BaseCanvas/CanvasThemeContext.cjs");
 const external_CanvasTooltip_cjs_namespaceObject = require("../CanvasTooltip.cjs");
+const InitialsBadge_cjs_namespaceObject = require("../shared/InitialsBadge.cjs");
 const external_ListView_styles_cjs_namespaceObject = require("./ListView.styles.cjs");
 const DEFAULT_SKELETON_COUNT = 3;
 function buildRenderedItems(items, enableSections, loadingSkeleton) {
@@ -162,7 +163,11 @@ const ListViewRow = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ in
                         icon: item.icon.name,
                         size: 24
                     }),
-                    item.icon?.Component && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(item.icon.Component, {})
+                    item.icon?.Component && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(item.icon.Component, {}),
+                    !item.icon?.url && !item.icon?.name && !item.icon?.Component && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(InitialsBadge_cjs_namespaceObject.InitialsBadge, {
+                        name: item.name,
+                        "data-testid": "list-item-initials-badge"
+                    })
                 ]
             }),
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Column, {
@@ -219,7 +224,7 @@ const ListItemSkeleton = ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)
             })
         ]
     });
-const ListViewInner = /*#__PURE__*/ (0, external_react_namespaceObject.forwardRef)(function({ items, activeIndex = -1, listRef, onItemClick, onItemHover, onScroll, emptyStateMessage = 'No items found', emptyStateIcon = 'search-x', isLoading = false, enableSections = true, loadingSkeleton }, ref) {
+const ListViewInner = /*#__PURE__*/ (0, external_react_namespaceObject.forwardRef)(function({ items, activeIndex = -1, listRef, onItemClick, onItemHover, onScroll, emptyStateMessage = 'No items found', emptyStateIcon = 'search-x', renderEmptyState, isLoading = false, enableSections = true, loadingSkeleton }, ref) {
     const { isDarkMode } = (0, CanvasThemeContext_cjs_namespaceObject.useCanvasTheme)();
     const activeSkeleton = loadingSkeleton ?? (isLoading && 0 === items.length ? true : void 0);
     const renderedItems = (0, external_react_namespaceObject.useMemo)(()=>buildRenderedItems(items, enableSections, activeSkeleton), [
@@ -247,26 +252,29 @@ const ListViewInner = /*#__PURE__*/ (0, external_react_namespaceObject.forwardRe
         onItemClick,
         onItemHover
     ]);
-    if (0 === renderedItems.length) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Column, {
-        align: "center",
-        justify: "center",
-        flex: 1,
-        gap: 10,
-        style: {
-            minHeight: '250px'
-        },
-        children: [
-            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_utils_index_cjs_namespaceObject.CanvasIcon, {
-                icon: emptyStateIcon,
-                size: 48,
-                color: "var(--canvas-foreground-de-emp)"
-            }),
-            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
-                className: "text-xs text-foreground-muted",
-                children: emptyStateMessage
-            })
-        ]
-    });
+    if (0 === renderedItems.length) {
+        if (renderEmptyState) return renderEmptyState();
+        return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Column, {
+            align: "center",
+            justify: "center",
+            flex: 1,
+            gap: 10,
+            style: {
+                minHeight: '250px'
+            },
+            children: [
+                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_utils_index_cjs_namespaceObject.CanvasIcon, {
+                    icon: emptyStateIcon,
+                    size: 48,
+                    color: "var(--canvas-foreground-de-emp)"
+                }),
+                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                    className: "text-xs text-foreground-muted",
+                    children: emptyStateMessage
+                })
+            ]
+        });
+    }
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_ListView_styles_cjs_namespaceObject.StyledList, {
         id: "toolbox-listbox",
         role: "listbox",

package/dist/canvas/components/Toolbox/ListView.d.ts

@@ -53,6 +53,7 @@ interface ListViewProps<T extends ListItem> {
     onScroll?: React.UIEventHandler<HTMLDivElement>;
     emptyStateMessage?: string;
     emptyStateIcon?: string;
+    renderEmptyState?: () => React.ReactElement | null;
     isLoading?: boolean;
     enableSections?: boolean;
     loadingSkeleton?: boolean | ChildrenLoadingSpec;

package/dist/canvas/components/Toolbox/ListView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListView.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/Toolbox/ListView.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ListView.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/Toolbox/ListView.tsx"],"names":[],"mappings":"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"}

package/dist/canvas/components/Toolbox/ListView.js

@@ -5,6 +5,7 @@ import { Skeleton } from "@uipath/apollo-wind";
 import { forwardRef, memo, useCallback, useImperativeHandle, useMemo } from "react";
 import { useCanvasTheme } from "../BaseCanvas/CanvasThemeContext.js";
 import { CanvasTooltip } from "../CanvasTooltip.js";
+import { InitialsBadge } from "../shared/InitialsBadge.js";
 import { IconContainer, ListItemButton, SectionHeader, StyledList } from "./ListView.styles.js";
 const DEFAULT_SKELETON_COUNT = 3;
 function buildRenderedItems(items, enableSections, loadingSkeleton) {
@@ -133,7 +134,11 @@ const ListViewRow = /*#__PURE__*/ memo(({ index, style, ariaAttributes, rendered
                         icon: item.icon.name,
                         size: 24
                     }),
-                    item.icon?.Component && /*#__PURE__*/ jsx(item.icon.Component, {})
+                    item.icon?.Component && /*#__PURE__*/ jsx(item.icon.Component, {}),
+                    !item.icon?.url && !item.icon?.name && !item.icon?.Component && /*#__PURE__*/ jsx(InitialsBadge, {
+                        name: item.name,
+                        "data-testid": "list-item-initials-badge"
+                    })
                 ]
             }),
             /*#__PURE__*/ jsxs(Column, {
@@ -190,7 +195,7 @@ const ListItemSkeleton = ()=>/*#__PURE__*/ jsxs("div", {
             })
         ]
     });
-const ListViewInner = /*#__PURE__*/ forwardRef(function({ items, activeIndex = -1, listRef, onItemClick, onItemHover, onScroll, emptyStateMessage = 'No items found', emptyStateIcon = 'search-x', isLoading = false, enableSections = true, loadingSkeleton }, ref) {
+const ListViewInner = /*#__PURE__*/ forwardRef(function({ items, activeIndex = -1, listRef, onItemClick, onItemHover, onScroll, emptyStateMessage = 'No items found', emptyStateIcon = 'search-x', renderEmptyState, isLoading = false, enableSections = true, loadingSkeleton }, ref) {
     const { isDarkMode } = useCanvasTheme();
     const activeSkeleton = loadingSkeleton ?? (isLoading && 0 === items.length ? true : void 0);
     const renderedItems = useMemo(()=>buildRenderedItems(items, enableSections, activeSkeleton), [
@@ -218,26 +223,29 @@ const ListViewInner = /*#__PURE__*/ forwardRef(function({ items, activeIndex = -
         onItemClick,
         onItemHover
     ]);
-    if (0 === renderedItems.length) return /*#__PURE__*/ jsxs(Column, {
-        align: "center",
-        justify: "center",
-        flex: 1,
-        gap: 10,
-        style: {
-            minHeight: '250px'
-        },
-        children: [
-            /*#__PURE__*/ jsx(CanvasIcon, {
-                icon: emptyStateIcon,
-                size: 48,
-                color: "var(--canvas-foreground-de-emp)"
-            }),
-            /*#__PURE__*/ jsx("span", {
-                className: "text-xs text-foreground-muted",
-                children: emptyStateMessage
-            })
-        ]
-    });
+    if (0 === renderedItems.length) {
+        if (renderEmptyState) return renderEmptyState();
+        return /*#__PURE__*/ jsxs(Column, {
+            align: "center",
+            justify: "center",
+            flex: 1,
+            gap: 10,
+            style: {
+                minHeight: '250px'
+            },
+            children: [
+                /*#__PURE__*/ jsx(CanvasIcon, {
+                    icon: emptyStateIcon,
+                    size: 48,
+                    color: "var(--canvas-foreground-de-emp)"
+                }),
+                /*#__PURE__*/ jsx("span", {
+                    className: "text-xs text-foreground-muted",
+                    children: emptyStateMessage
+                })
+            ]
+        });
+    }
     return /*#__PURE__*/ jsx(StyledList, {
         id: "toolbox-listbox",
         role: "listbox",

package/dist/canvas/components/Toolbox/QuickActionsRow.cjs

@@ -0,0 +1,84 @@
+"use strict";
+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__, {
+    QuickActionsRow: ()=>QuickActionsRow_QuickActionsRow
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
+const external_react_namespaceObject = require("react");
+const external_constants_cjs_namespaceObject = require("../../constants.cjs");
+const external_CanvasTooltip_cjs_namespaceObject = require("../CanvasTooltip.cjs");
+function QuickActionButton({ action, wide }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
+        content: action.title,
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Button, {
+            type: "button",
+            variant: "ghost",
+            size: "icon",
+            className: wide ? 'h-9 w-14 aspect-auto [&_svg]:size-6' : 'h-9 w-9 [&_svg]:size-6',
+            "aria-label": action.title,
+            disabled: action.disabled,
+            onClick: action.onClick,
+            onMouseEnter: action.onMouseEnter,
+            onMouseLeave: action.onMouseLeave,
+            "data-testid": `toolbox-quick-action-${action.id}`,
+            children: action.icon
+        })
+    });
+}
+const QuickActionsRow_QuickActionsRow = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(function({ actions }) {
+    if (!actions.length) return null;
+    const leading = actions.filter((a)=>!a.trailing);
+    const trailing = actions.filter((a)=>a.trailing);
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+        className: "flex items-center justify-center gap-3 min-h-11 pb-2 border-b border-border shrink-0",
+        style: {
+            paddingInline: external_constants_cjs_namespaceObject.TOOLBOX_PADDING_X,
+            marginInline: -external_constants_cjs_namespaceObject.TOOLBOX_PADDING_X
+        },
+        "data-testid": "toolbox-quick-actions",
+        children: [
+            leading.map((action)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(QuickActionButton, {
+                    action: action
+                }, action.id)),
+            trailing.length > 0 && leading.length > 0 && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                className: "w-px self-stretch mx-1 bg-border shrink-0",
+                "data-testid": "toolbox-quick-actions-separator"
+            }),
+            trailing.map((action)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(QuickActionButton, {
+                    action: action,
+                    wide: true
+                }, action.id))
+        ]
+    });
+});
+exports.QuickActionsRow = __webpack_exports__.QuickActionsRow;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "QuickActionsRow"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/canvas/components/Toolbox/QuickActionsRow.d.ts

@@ -0,0 +1,17 @@
+import { type MouseEvent, type ReactNode } from 'react';
+export type ToolboxQuickAction = {
+    id: string;
+    title: string;
+    icon: ReactNode;
+    onClick?: (e: MouseEvent<HTMLButtonElement>) => void;
+    onMouseEnter?: () => void;
+    onMouseLeave?: () => void;
+    trailing?: boolean;
+    disabled?: boolean;
+};
+interface QuickActionsRowProps {
+    actions: ToolboxQuickAction[];
+}
+export declare const QuickActionsRow: import("react").NamedExoticComponent<QuickActionsRowProps>;
+export {};
+//# sourceMappingURL=QuickActionsRow.d.ts.map

package/dist/canvas/components/Toolbox/QuickActionsRow.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"QuickActionsRow.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/Toolbox/QuickActionsRow.tsx"],"names":[],"mappings":"AACA,OAAO,EAAQ,KAAK,UAAU,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAI9D,MAAM,MAAM,kBAAkB,GAAG;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,SAAS,CAAC;IAChB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACrD,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,UAAU,oBAAoB;IAC5B,OAAO,EAAE,kBAAkB,EAAE,CAAC;CAC/B;AAuBD,eAAO,MAAM,eAAe,4DA0B1B,CAAC"}