@uipath/apollo-wind 2.72.2 → 2.73.0

package/dist/components/ui/disclosure-tree.js

@@ -0,0 +1,235 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ChevronRight } from "lucide-react";
+import { createContext, forwardRef, useCallback, useContext, useId, useMemo, useRef, useState } from "react";
+import { Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger } from "./tooltip.js";
+import { cn } from "../../lib/index.js";
+import { disclosureRowClassName } from "../../lib/disclosure-row.js";
+const TreeContext = /*#__PURE__*/ createContext(null);
+const isExpandable = (item)=>'function' == typeof item.children ? !!item.expandable : !!item.children?.length;
+const DisclosureTree = /*#__PURE__*/ forwardRef(({ items, expanded, onExpandedChange, className, onKeyDown, ...props }, ref)=>{
+    const [overrides, setOverrides] = useState(new Map());
+    const [activeId, setActiveId] = useState();
+    const rows = useRef(new Map());
+    const built = useRef(new WeakMap());
+    const childrenOf = useCallback((item)=>{
+        if ('function' != typeof item.children) return item.children ?? [];
+        let children = built.current.get(item);
+        if (!children) {
+            children = item.children();
+            built.current.set(item, children);
+        }
+        return children;
+    }, []);
+    const isExpanded = useCallback((item)=>isExpandable(item) && (expanded ? expanded.includes(item.id) : overrides.get(item.id) ?? item.defaultExpanded ?? false), [
+        expanded,
+        overrides
+    ]);
+    const setExpanded = useCallback((item, next)=>{
+        if (!isExpandable(item) || isExpanded(item) === next) return;
+        if (!expanded) setOverrides((previous)=>new Map(previous).set(item.id, next));
+        onExpandedChange?.(item.id, next);
+    }, [
+        expanded,
+        isExpanded,
+        onExpandedChange
+    ]);
+    const visible = useMemo(()=>{
+        const list = [];
+        const walk = (level, parentId)=>{
+            for (const item of level){
+                const expandable = isExpandable(item);
+                list.push({
+                    item,
+                    parentId,
+                    expandable
+                });
+                if (expandable && isExpanded(item)) walk(childrenOf(item), item.id);
+            }
+        };
+        walk(items, void 0);
+        return list;
+    }, [
+        items,
+        isExpanded,
+        childrenOf
+    ]);
+    const tabbableId = visible.some((row)=>row.item.id === activeId) ? activeId : visible[0]?.item.id;
+    const focusRow = (id)=>{
+        if (void 0 === id) return;
+        setActiveId(id);
+        rows.current.get(id)?.focus();
+    };
+    const handleKeyDown = (event)=>{
+        onKeyDown?.(event);
+        if (event.defaultPrevented) return;
+        const id = event.target.dataset.treeItemId;
+        const index = visible.findIndex((row)=>row.item.id === id);
+        if (index < 0) return;
+        const row = visible[index];
+        const open = row.expandable && isExpanded(row.item);
+        switch(event.key){
+            case 'ArrowDown':
+                focusRow(visible[index + 1]?.item.id);
+                break;
+            case 'ArrowUp':
+                focusRow(visible[index - 1]?.item.id);
+                break;
+            case 'Home':
+                focusRow(visible[0]?.item.id);
+                break;
+            case 'End':
+                focusRow(visible[visible.length - 1]?.item.id);
+                break;
+            case 'ArrowRight':
+                if (!row.expandable) return;
+                if (open) {
+                    if (visible[index + 1]?.parentId === row.item.id) focusRow(visible[index + 1].item.id);
+                } else setExpanded(row.item, true);
+                break;
+            case 'ArrowLeft':
+                if (open) setExpanded(row.item, false);
+                else focusRow(row.parentId);
+                break;
+            case 'Enter':
+            case ' ':
+                if (!row.expandable) return;
+                setExpanded(row.item, !open);
+                break;
+            default:
+                return;
+        }
+        event.preventDefault();
+    };
+    const context = useMemo(()=>({
+            isExpanded,
+            toggle: (item)=>setExpanded(item, !isExpanded(item)),
+            childrenOf,
+            tabbableId,
+            setActiveId,
+            registerRow: (id, node)=>{
+                if (node) rows.current.set(id, node);
+                else rows.current.delete(id);
+            }
+        }), [
+        isExpanded,
+        setExpanded,
+        childrenOf,
+        tabbableId
+    ]);
+    return /*#__PURE__*/ jsx(TreeContext.Provider, {
+        value: context,
+        children: /*#__PURE__*/ jsx(TooltipProvider, {
+            delayDuration: 300,
+            children: /*#__PURE__*/ jsx("div", {
+                ref: ref,
+                role: "tree",
+                "data-slot": "disclosure-tree",
+                className: cn('flex min-w-0 flex-col', className),
+                onKeyDown: handleKeyDown,
+                ...props,
+                children: items.map((item, index)=>/*#__PURE__*/ jsx(DisclosureTreeRow, {
+                        item: item,
+                        level: 1,
+                        position: index + 1,
+                        setSize: items.length
+                    }, item.id))
+            })
+        })
+    });
+});
+DisclosureTree.displayName = 'DisclosureTree';
+function DisclosureTreeRow({ item, level, position, setSize }) {
+    const tree = useContext(TreeContext);
+    if (!tree) throw new Error('DisclosureTreeRow must be used within DisclosureTree');
+    const id = useId();
+    const [tooltipOpen, setTooltipOpen] = useState(false);
+    const expandable = isExpandable(item);
+    const open = tree.isExpanded(item);
+    const children = open ? tree.childrenOf(item) : [];
+    const labelId = `${id}-label`;
+    const descriptionId = `${id}-description`;
+    const row = /*#__PURE__*/ jsxs("div", {
+        "data-slot": "disclosure-tree-row",
+        onClick: expandable ? ()=>tree.toggle(item) : void 0,
+        className: cn(disclosureRowClassName, expandable && 'cursor-pointer hover:text-foreground'),
+        children: [
+            /*#__PURE__*/ jsx(ChevronRight, {
+                "aria-hidden": "true",
+                className: cn('size-4 shrink-0 transition-transform motion-reduce:transition-none', open && 'rotate-90', !expandable && 'invisible')
+            }),
+            null != item.icon && /*#__PURE__*/ jsx("span", {
+                "data-slot": "disclosure-tree-icon",
+                className: "flex size-4 shrink-0 items-center justify-center [&_svg]:size-4",
+                children: item.icon
+            }),
+            /*#__PURE__*/ jsx("span", {
+                id: labelId,
+                "data-slot": "disclosure-tree-label",
+                className: "min-w-0 truncate",
+                children: item.label
+            }),
+            null != item.trailing && /*#__PURE__*/ jsx("span", {
+                "data-slot": "disclosure-tree-trailing",
+                className: "ml-auto shrink-0 pl-2 text-muted-foreground",
+                children: item.trailing
+            })
+        ]
+    });
+    return /*#__PURE__*/ jsxs("div", {
+        ref: (node)=>tree.registerRow(item.id, node),
+        role: "treeitem",
+        "data-slot": "disclosure-tree-item",
+        "data-tree-item-id": item.id,
+        "aria-level": level,
+        "aria-posinset": position,
+        "aria-setsize": setSize,
+        "aria-expanded": expandable ? open : void 0,
+        "aria-labelledby": labelId,
+        "aria-describedby": item.description ? descriptionId : void 0,
+        tabIndex: tree.tabbableId === item.id ? 0 : -1,
+        onFocus: (event)=>{
+            if (event.target !== event.currentTarget) return;
+            tree.setActiveId(item.id);
+            if (item.description) setTooltipOpen(true);
+        },
+        onBlur: (event)=>{
+            if (event.target === event.currentTarget) setTooltipOpen(false);
+        },
+        className: "min-w-0 outline-hidden [&:focus-visible>[data-slot=disclosure-tree-row]]:ring-2 [&:focus-visible>[data-slot=disclosure-tree-row]]:ring-ring",
+        children: [
+            item.description ? /*#__PURE__*/ jsxs(Tooltip, {
+                open: tooltipOpen,
+                onOpenChange: setTooltipOpen,
+                children: [
+                    /*#__PURE__*/ jsx(TooltipTrigger, {
+                        asChild: true,
+                        children: row
+                    }),
+                    /*#__PURE__*/ jsx(TooltipPortal, {
+                        children: /*#__PURE__*/ jsx(TooltipContent, {
+                            align: "start",
+                            children: item.description
+                        })
+                    })
+                ]
+            }) : row,
+            item.description && /*#__PURE__*/ jsx("span", {
+                id: descriptionId,
+                hidden: true,
+                children: item.description
+            }),
+            children.length > 0 && /*#__PURE__*/ jsx("div", {
+                role: "group",
+                className: "ml-7 flex min-w-0 flex-col",
+                children: children.map((child, index)=>/*#__PURE__*/ jsx(DisclosureTreeRow, {
+                        item: child,
+                        level: level + 1,
+                        position: index + 1,
+                        setSize: children.length
+                    }, child.id))
+            })
+        ]
+    });
+}
+export { DisclosureTree };

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

@@ -107,7 +107,7 @@ DropdownMenuSubTrigger.displayName = react_dropdown_menu_namespaceObject.SubTrig
 const DropdownMenuSubContent = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_dropdown_menu_namespaceObject.SubContent, {
         ref: ref,
         "data-slot": "dropdown-menu-sub-content",
-        className: (0, index_cjs_namespaceObject.cn)('z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg 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),
+        className: (0, index_cjs_namespaceObject.cn)('z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg 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
     }));
 DropdownMenuSubContent.displayName = react_dropdown_menu_namespaceObject.SubContent.displayName;
@@ -121,7 +121,7 @@ const DropdownMenuContent = /*#__PURE__*/ external_react_namespaceObject.forward
                 ref: ref,
                 "data-slot": "dropdown-menu-content",
                 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),
+                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
             })
         })

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

@@ -65,7 +65,7 @@ DropdownMenuSubTrigger.displayName = SubTrigger.displayName;
 const DropdownMenuSubContent = /*#__PURE__*/ forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ jsx(SubContent, {
         ref: ref,
         "data-slot": "dropdown-menu-sub-content",
-        className: cn('z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg 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),
+        className: cn('z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg 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
     }));
 DropdownMenuSubContent.displayName = SubContent.displayName;
@@ -79,7 +79,7 @@ const DropdownMenuContent = /*#__PURE__*/ forwardRef(({ className, sideOffset =
                 ref: ref,
                 "data-slot": "dropdown-menu-content",
                 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),
+                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
             })
         })

package/dist/components/ui/dropzone-overlay.cjs

@@ -34,8 +34,16 @@ const external_react_namespaceObject = require("react");
 const index_cjs_namespaceObject = require("../../lib/index.cjs");
 const external_file_validation_cjs_namespaceObject = require("./file-validation.cjs");
 const DEFAULT_DROPZONE_OVERLAY_STRINGS = {
-    dropHint: 'Drop files to attach'
+    dropHint: 'Drop files to attach',
+    typesHint: '',
+    sizeHint: '',
+    countHint: ''
 };
+const LIMITS = [
+    'types',
+    'size',
+    'count'
+];
 function hasFiles(dataTransfer) {
     return Array.from(dataTransfer?.types ?? []).includes('Files');
 }
@@ -63,13 +71,14 @@ const DropzoneOverlay = /*#__PURE__*/ external_react_namespaceObject.forwardRef(
         disabled
     ]);
     const deliver = (files)=>{
-        if (0 === files.length) return;
+        if (0 === files.length) return 0;
         const { accepted, rejected } = (0, external_file_validation_cjs_namespaceObject.validateFiles)(files, {
             accept,
             maxSize,
             maxFiles
         });
         onFiles?.(accepted, rejected);
+        return accepted.length;
     };
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
         ref: ref,
@@ -108,8 +117,9 @@ const DropzoneOverlay = /*#__PURE__*/ external_react_namespaceObject.forwardRef(
             if (disabled || !enablePaste || event.defaultPrevented) return;
             const files = filesFrom(event.clipboardData);
             if (0 === files.length) return;
-            event.preventDefault();
-            deliver(files);
+            const accepted = deliver(files);
+            const hasText = Array.from(event.clipboardData?.types ?? []).includes('text/plain');
+            if (accepted > 0 || !hasText) event.preventDefault();
         },
         ...props,
         children: [
@@ -124,7 +134,13 @@ const DropzoneOverlay = /*#__PURE__*/ external_react_namespaceObject.forwardRef(
                     }),
                     /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
                         children: text.dropHint
-                    })
+                    }),
+                    LIMITS.filter((limit)=>text[`${limit}Hint`]).map((limit)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                            "data-slot": "dropzone-overlay-limit",
+                            "data-limit": limit,
+                            className: "text-xs font-normal text-muted-foreground",
+                            children: text[`${limit}Hint`]
+                        }, limit))
                 ]
             })
         ]

package/dist/components/ui/dropzone-overlay.d.ts

@@ -8,6 +8,13 @@ import { type FileRejection, type FileValidationOptions } from './file-validatio
 export interface DropzoneOverlayStrings {
     /** Shown on the overlay while files are dragged over the region. */
     dropHint: string;
+    /**
+     * Lines under the hint describing the limits, such as "Allowed file types: PDF, PNG". They carry
+     * values the host formats, so they are empty, and not shown, unless given.
+     */
+    typesHint: string;
+    sizeHint: string;
+    countHint: string;
 }
 export declare const DEFAULT_DROPZONE_OVERLAY_STRINGS: DropzoneOverlayStrings;
 export interface DropzoneOverlayProps extends React.HTMLAttributes<HTMLDivElement>, FileValidationOptions {
@@ -18,7 +25,11 @@ export interface DropzoneOverlayProps extends React.HTMLAttributes<HTMLDivElemen
     onFiles?: (accepted: File[], rejected: FileRejection[]) => void;
     /** Ignores drags, drops and pastes. */
     disabled?: boolean;
-    /** Also takes files pasted anywhere inside the region. Pastes without files are left alone. */
+    /**
+     * Also takes files pasted anywhere inside the region. A paste with files is kept from the field
+     * unless none was accepted and it also carries text, so that text still lands. Pastes without
+     * files are left alone.
+     */
     enablePaste?: boolean;
     /** Overrides for any subset of the English strings. */
     strings?: Partial<DropzoneOverlayStrings>;

package/dist/components/ui/dropzone-overlay.js

@@ -5,8 +5,16 @@ import { forwardRef, useEffect, useMemo, useRef, useState } from "react";
 import { cn } from "../../lib/index.js";
 import { validateFiles } from "./file-validation.js";
 const DEFAULT_DROPZONE_OVERLAY_STRINGS = {
-    dropHint: 'Drop files to attach'
+    dropHint: 'Drop files to attach',
+    typesHint: '',
+    sizeHint: '',
+    countHint: ''
 };
+const LIMITS = [
+    'types',
+    'size',
+    'count'
+];
 function hasFiles(dataTransfer) {
     return Array.from(dataTransfer?.types ?? []).includes('Files');
 }
@@ -34,13 +42,14 @@ const DropzoneOverlay = /*#__PURE__*/ forwardRef(({ className, children, onFiles
         disabled
     ]);
     const deliver = (files)=>{
-        if (0 === files.length) return;
+        if (0 === files.length) return 0;
         const { accepted, rejected } = validateFiles(files, {
             accept,
             maxSize,
             maxFiles
         });
         onFiles?.(accepted, rejected);
+        return accepted.length;
     };
     return /*#__PURE__*/ jsxs("div", {
         ref: ref,
@@ -79,8 +88,9 @@ const DropzoneOverlay = /*#__PURE__*/ forwardRef(({ className, children, onFiles
             if (disabled || !enablePaste || event.defaultPrevented) return;
             const files = filesFrom(event.clipboardData);
             if (0 === files.length) return;
-            event.preventDefault();
-            deliver(files);
+            const accepted = deliver(files);
+            const hasText = Array.from(event.clipboardData?.types ?? []).includes('text/plain');
+            if (accepted > 0 || !hasText) event.preventDefault();
         },
         ...props,
         children: [
@@ -95,7 +105,13 @@ const DropzoneOverlay = /*#__PURE__*/ forwardRef(({ className, children, onFiles
                     }),
                     /*#__PURE__*/ jsx("span", {
                         children: text.dropHint
-                    })
+                    }),
+                    LIMITS.filter((limit)=>text[`${limit}Hint`]).map((limit)=>/*#__PURE__*/ jsx("span", {
+                            "data-slot": "dropzone-overlay-limit",
+                            "data-limit": limit,
+                            className: "text-xs font-normal text-muted-foreground",
+                            children: text[`${limit}Hint`]
+                        }, limit))
                 ]
             })
         ]

package/dist/components/ui/empty-state.cjs

@@ -30,38 +30,56 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const external_react_namespaceObject = require("react");
 const external_button_cjs_namespaceObject = require("./button.cjs");
 const index_cjs_namespaceObject = require("../../lib/index.cjs");
-const EmptyState = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ icon, code, title, description, action, secondaryAction, className, children, ...props }, ref)=>{
+const use_ancestor_density_cjs_namespaceObject = require("../../lib/use-ancestor-density.cjs");
+const EmptyState = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ icon, code, title, description, action, secondaryAction, size, className, children, ...props }, ref)=>{
+    const local = external_react_namespaceObject.useRef(null);
+    const setRef = external_react_namespaceObject.useMemo(()=>(0, index_cjs_namespaceObject.composeRefs)(ref, local), [
+        ref
+    ]);
+    const ancestorDensity = (0, use_ancestor_density_cjs_namespaceObject.useAncestorDensity)(local, null == size);
     const hasSimpleActions = !children && (action || secondaryAction);
+    const compact = (size ?? ancestorDensity) === 'compact';
+    const buttonSize = compact ? 'sm' : void 0;
+    const actionsClassName = compact ? 'mt-4 flex flex-wrap items-center justify-center gap-2' : 'mt-6 flex flex-wrap items-center justify-center gap-2';
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
-        ref: ref,
+        ref: setRef,
         "data-slot": "empty-state",
-        className: (0, index_cjs_namespaceObject.cn)('flex flex-col items-center justify-center p-8 text-center', className),
+        "data-size": compact ? 'compact' : void 0,
+        className: (0, index_cjs_namespaceObject.cn)(compact ? 'flex flex-col items-center justify-center px-4 py-8 text-center' : 'flex flex-col items-center justify-center p-8 text-center', className),
         ...props,
         children: [
             icon && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-                className: "mb-6 flex items-center justify-center",
+                className: compact ? 'mb-3 flex items-center justify-center' : 'mb-6 flex items-center justify-center',
                 children: icon
             }),
-            code && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("h1", {
+            code && (compact ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("p", {
+                className: "mb-2 text-2xl font-bold leading-none",
+                children: code
+            }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("h1", {
                 className: "text-[40px] font-bold tracking-[-0.8px] leading-none mb-4",
                 children: code
-            }),
-            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("h3", {
+            })),
+            compact ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("p", {
+                className: "text-sm text-foreground",
+                children: title
+            }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("h3", {
                 className: "text-xl font-semibold tracking-tight",
                 children: title
             }),
             description && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("p", {
-                className: "mt-3 max-w-md text-sm text-muted-foreground leading-relaxed",
+                className: compact ? 'mt-1 max-w-md text-xs text-muted-foreground' : 'mt-3 max-w-md text-sm text-muted-foreground leading-relaxed',
                 children: description
             }),
             hasSimpleActions && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
-                className: "mt-6 flex flex-wrap items-center justify-center gap-2",
+                className: actionsClassName,
                 children: [
                     action && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_button_cjs_namespaceObject.Button, {
+                        size: buttonSize,
                         onClick: action.onClick,
                         children: action.label
                     }),
                     secondaryAction && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_button_cjs_namespaceObject.Button, {
+                        size: buttonSize,
                         variant: "outline",
                         onClick: secondaryAction.onClick,
                         children: secondaryAction.label
@@ -69,7 +87,7 @@ const EmptyState = /*#__PURE__*/ external_react_namespaceObject.forwardRef(({ ic
                 ]
             }),
             children && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-                className: "mt-6 flex flex-wrap items-center justify-center gap-2",
+                className: actionsClassName,
                 children: children
             })
         ]

package/dist/components/ui/empty-state.d.ts

@@ -18,6 +18,15 @@ export interface EmptyStateProps extends React.HTMLAttributes<HTMLDivElement> {
         label: string;
         onClick: () => void;
     };
+    /**
+     * `compact` fits inside a panel or list: smaller type and spacing. It renders no heading element
+     * (the title and any code are paragraphs): inside a panel the empty message is content of the
+     * panel's own section, and a heading there would add a stray entry to the page outline.
+     * Without a `size`, it is compact under an ancestor with `data-density="compact"` (a compact chat
+     * panel), like the other chat primitives. The heading changes element, which a CSS variant
+     * cannot do, so this is decided after mount; an explicit `size` always wins.
+     */
+    size?: 'default' | 'compact';
 }
 declare const EmptyState: React.ForwardRefExoticComponent<EmptyStateProps & React.RefAttributes<HTMLDivElement>>;
 export { EmptyState };

package/dist/components/ui/empty-state.js

@@ -1,39 +1,57 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { forwardRef } from "react";
+import { forwardRef, useMemo, useRef } from "react";
 import { Button } from "./button.js";
-import { cn } from "../../lib/index.js";
-const EmptyState = /*#__PURE__*/ forwardRef(({ icon, code, title, description, action, secondaryAction, className, children, ...props }, ref)=>{
+import { cn, composeRefs } from "../../lib/index.js";
+import { useAncestorDensity } from "../../lib/use-ancestor-density.js";
+const EmptyState = /*#__PURE__*/ forwardRef(({ icon, code, title, description, action, secondaryAction, size, className, children, ...props }, ref)=>{
+    const local = useRef(null);
+    const setRef = useMemo(()=>composeRefs(ref, local), [
+        ref
+    ]);
+    const ancestorDensity = useAncestorDensity(local, null == size);
     const hasSimpleActions = !children && (action || secondaryAction);
+    const compact = (size ?? ancestorDensity) === 'compact';
+    const buttonSize = compact ? 'sm' : void 0;
+    const actionsClassName = compact ? 'mt-4 flex flex-wrap items-center justify-center gap-2' : 'mt-6 flex flex-wrap items-center justify-center gap-2';
     return /*#__PURE__*/ jsxs("div", {
-        ref: ref,
+        ref: setRef,
         "data-slot": "empty-state",
-        className: cn('flex flex-col items-center justify-center p-8 text-center', className),
+        "data-size": compact ? 'compact' : void 0,
+        className: cn(compact ? 'flex flex-col items-center justify-center px-4 py-8 text-center' : 'flex flex-col items-center justify-center p-8 text-center', className),
         ...props,
         children: [
             icon && /*#__PURE__*/ jsx("div", {
-                className: "mb-6 flex items-center justify-center",
+                className: compact ? 'mb-3 flex items-center justify-center' : 'mb-6 flex items-center justify-center',
                 children: icon
             }),
-            code && /*#__PURE__*/ jsx("h1", {
+            code && (compact ? /*#__PURE__*/ jsx("p", {
+                className: "mb-2 text-2xl font-bold leading-none",
+                children: code
+            }) : /*#__PURE__*/ jsx("h1", {
                 className: "text-[40px] font-bold tracking-[-0.8px] leading-none mb-4",
                 children: code
-            }),
-            /*#__PURE__*/ jsx("h3", {
+            })),
+            compact ? /*#__PURE__*/ jsx("p", {
+                className: "text-sm text-foreground",
+                children: title
+            }) : /*#__PURE__*/ jsx("h3", {
                 className: "text-xl font-semibold tracking-tight",
                 children: title
             }),
             description && /*#__PURE__*/ jsx("p", {
-                className: "mt-3 max-w-md text-sm text-muted-foreground leading-relaxed",
+                className: compact ? 'mt-1 max-w-md text-xs text-muted-foreground' : 'mt-3 max-w-md text-sm text-muted-foreground leading-relaxed',
                 children: description
             }),
             hasSimpleActions && /*#__PURE__*/ jsxs("div", {
-                className: "mt-6 flex flex-wrap items-center justify-center gap-2",
+                className: actionsClassName,
                 children: [
                     action && /*#__PURE__*/ jsx(Button, {
+                        size: buttonSize,
                         onClick: action.onClick,
                         children: action.label
                     }),
                     secondaryAction && /*#__PURE__*/ jsx(Button, {
+                        size: buttonSize,
                         variant: "outline",
                         onClick: secondaryAction.onClick,
                         children: secondaryAction.label
@@ -41,7 +59,7 @@ const EmptyState = /*#__PURE__*/ forwardRef(({ icon, code, title, description, a
                 ]
             }),
             children && /*#__PURE__*/ jsx("div", {
-                className: "mt-6 flex flex-wrap items-center justify-center gap-2",
+                className: actionsClassName,
                 children: children
             })
         ]

package/dist/components/ui/hover-card.cjs

@@ -53,7 +53,7 @@ const HoverCardContent = /*#__PURE__*/ external_react_namespaceObject.forwardRef
             "data-slot": "hover-card-content",
             align: align,
             sideOffset: sideOffset,
-            className: (0, index_cjs_namespaceObject.cn)('z-50 w-64 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none 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-hover-card-content-transform-origin]', className),
+            className: (0, index_cjs_namespaceObject.cn)('z-50 w-64 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none 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-hover-card-content-transform-origin)', className),
             ...props
         })
     });

package/dist/components/ui/hover-card.js

@@ -23,7 +23,7 @@ const HoverCardContent = /*#__PURE__*/ forwardRef(({ className, align = 'center'
             "data-slot": "hover-card-content",
             align: align,
             sideOffset: sideOffset,
-            className: cn('z-50 w-64 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none 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-hover-card-content-transform-origin]', className),
+            className: cn('z-50 w-64 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none 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-hover-card-content-transform-origin)', className),
             ...props
         })
     });