@uipath/apollo-wind 2.60.1 → 2.61.0

package/dist/components/ui/json-tree-view/JsonTreeToolbar.cjs

@@ -0,0 +1,209 @@
+"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__, {
+    JsonTreeToolbar: ()=>JsonTreeToolbar
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const external_button_cjs_namespaceObject = require("../button.cjs");
+const index_cjs_namespaceObject = require("../../../lib/index.cjs");
+const external_dropdown_menu_cjs_namespaceObject = require("../dropdown-menu.cjs");
+const external_input_cjs_namespaceObject = require("../input.cjs");
+const external_lucide_react_namespaceObject = require("lucide-react");
+const external_react_namespaceObject = require("react");
+const external_strings_cjs_namespaceObject = require("./strings.cjs");
+const external_JsonTreeTooltip_cjs_namespaceObject = require("./JsonTreeTooltip.cjs");
+const ALL_FILTER_VALUE = '__all__';
+function JsonTreeToolbar({ strings, tooltipContentClassName, ...props }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_strings_cjs_namespaceObject.JsonTreeViewProvider, {
+        strings: strings,
+        tooltipContentClassName: tooltipContentClassName,
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(JsonTreeToolbarContent, {
+            ...props
+        })
+    });
+}
+function JsonTreeToolbarContent({ query, onQueryChange, searchPlaceholder, filters, activeFilterId = null, onFilterChange, allCollapsed = false, onToggleAll, leading, controlsHidden = false, className }) {
+    const strings = (0, external_strings_cjs_namespaceObject.useJsonTreeViewStrings)();
+    const [searchOpen, setSearchOpen] = (0, external_react_namespaceObject.useState)(false);
+    const activeFilter = filters?.find((f)=>f.id === activeFilterId);
+    const resolvedSearchPlaceholder = searchPlaceholder ?? strings.searchFields;
+    const filterLabel = activeFilter ? strings.filterActive(activeFilter.label) : strings.filter;
+    const searchActionLabel = strings.searchFieldsAction;
+    const toggleAllLabel = allCollapsed ? strings.expandAll : strings.collapseAll;
+    const closeSearch = ()=>{
+        onQueryChange('');
+        setSearchOpen(false);
+    };
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+        className: (0, index_cjs_namespaceObject.cn)('flex items-center gap-1.5', className),
+        children: [
+            leading,
+            !controlsHidden && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
+                children: [
+                    searchOpen ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                        className: "relative flex min-w-0 flex-1 items-center overflow-hidden",
+                        children: [
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Search, {
+                                size: 13,
+                                className: "pointer-events-none absolute left-2 text-foreground-subtle"
+                            }),
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_input_cjs_namespaceObject.Input, {
+                                autoFocus: true,
+                                type: "text",
+                                variant: "ghost",
+                                size: "xs",
+                                value: query,
+                                onChange: (e)=>onQueryChange(e.target.value),
+                                onKeyDown: (e)=>{
+                                    if ('Escape' === e.key) closeSearch();
+                                },
+                                "aria-label": resolvedSearchPlaceholder,
+                                placeholder: resolvedSearchPlaceholder,
+                                style: {
+                                    paddingLeft: '1.75rem',
+                                    paddingRight: '1.5rem'
+                                },
+                                className: "h-6 w-full text-foreground placeholder:text-foreground-subtle focus-visible:ring-0"
+                            }),
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
+                                type: "button",
+                                onClick: closeSearch,
+                                "aria-label": strings.clearSearch,
+                                className: "absolute right-1.5 grid size-4 place-items-center text-foreground-subtle transition hover:text-foreground",
+                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.X, {
+                                    size: 12
+                                })
+                            })
+                        ]
+                    }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
+                        children: [
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                                className: "flex-1"
+                            }),
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_JsonTreeTooltip_cjs_namespaceObject.JsonTreeTooltip, {
+                                content: searchActionLabel,
+                                placement: "top",
+                                delay: true,
+                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_button_cjs_namespaceObject.Button, {
+                                    variant: "ghost",
+                                    size: "3xs",
+                                    icon: true,
+                                    onClick: ()=>setSearchOpen(true),
+                                    "aria-label": searchActionLabel,
+                                    className: "rounded text-foreground-subtle hover:bg-surface-overlay hover:text-foreground",
+                                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Search, {
+                                        size: 14
+                                    })
+                                })
+                            })
+                        ]
+                    }),
+                    !!filters?.length && onFilterChange && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_dropdown_menu_cjs_namespaceObject.DropdownMenu, {
+                        children: [
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_JsonTreeTooltip_cjs_namespaceObject.JsonTreeTooltip, {
+                                content: filterLabel,
+                                placement: "top",
+                                delay: true,
+                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_dropdown_menu_cjs_namespaceObject.DropdownMenuTrigger, {
+                                    asChild: true,
+                                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_button_cjs_namespaceObject.Button, {
+                                        variant: "ghost",
+                                        size: "3xs",
+                                        icon: true,
+                                        "aria-label": filterLabel,
+                                        className: "relative rounded text-foreground-subtle hover:bg-surface-overlay hover:text-foreground",
+                                        children: [
+                                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Filter, {
+                                                size: 14
+                                            }),
+                                            activeFilter && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                                                className: "absolute right-0.5 top-0.5 size-1.5 rounded-full bg-primary ring-1 ring-surface"
+                                            })
+                                        ]
+                                    })
+                                })
+                            }),
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_dropdown_menu_cjs_namespaceObject.DropdownMenuContent, {
+                                align: "end",
+                                className: "w-52",
+                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_dropdown_menu_cjs_namespaceObject.DropdownMenuRadioGroup, {
+                                    value: activeFilterId ?? ALL_FILTER_VALUE,
+                                    onValueChange: (value)=>onFilterChange(value === ALL_FILTER_VALUE ? null : value),
+                                    children: [
+                                        /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_dropdown_menu_cjs_namespaceObject.DropdownMenuRadioItem, {
+                                            value: ALL_FILTER_VALUE,
+                                            className: "text-[11px] [&>span:first-child]:text-foreground-accent",
+                                            children: strings.filterAll
+                                        }),
+                                        filters.map((filter)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_dropdown_menu_cjs_namespaceObject.DropdownMenuRadioItem, {
+                                                value: filter.id,
+                                                className: "text-[11px] [&>span:first-child]:text-foreground-accent",
+                                                children: [
+                                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                                                        className: "flex-1 truncate",
+                                                        children: filter.label
+                                                    }),
+                                                    void 0 !== filter.count && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                                                        className: "ml-3 rounded bg-surface-overlay px-1.5 py-0.5 font-mono text-[10px] font-medium leading-none text-foreground-muted",
+                                                        children: filter.count
+                                                    })
+                                                ]
+                                            }, filter.id))
+                                    ]
+                                })
+                            })
+                        ]
+                    }),
+                    onToggleAll && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_JsonTreeTooltip_cjs_namespaceObject.JsonTreeTooltip, {
+                        content: toggleAllLabel,
+                        placement: "top",
+                        delay: true,
+                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_button_cjs_namespaceObject.Button, {
+                            variant: "ghost",
+                            size: "3xs",
+                            icon: true,
+                            onClick: onToggleAll,
+                            "aria-label": toggleAllLabel,
+                            className: "rounded text-foreground-subtle hover:bg-surface-overlay hover:text-foreground",
+                            children: allCollapsed ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ChevronsUpDown, {
+                                size: 14
+                            }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.ChevronsDownUp, {
+                                size: 14
+                            })
+                        })
+                    })
+                ]
+            })
+        ]
+    });
+}
+exports.JsonTreeToolbar = __webpack_exports__.JsonTreeToolbar;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "JsonTreeToolbar"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/ui/json-tree-view/JsonTreeToolbar.d.ts

@@ -0,0 +1,35 @@
+import { type ReactNode } from 'react';
+import { type JsonTreeViewStrings } from './strings';
+import type { JsonTreeFilterOption } from './JsonTree.types';
+export interface JsonTreeToolbarProps {
+    /** Current search query (controlled). */
+    query: string;
+    onQueryChange: (query: string) => void;
+    searchPlaceholder?: string;
+    /** Consumer-provided filter options. Omit or pass empty to hide the filter control. */
+    filters?: JsonTreeFilterOption[];
+    /** Id of the active filter, or null for "All". */
+    activeFilterId?: string | null;
+    onFilterChange?: (id: string | null) => void;
+    /** Collapse-all toggle state. Omit `onToggleAll` to hide the control. */
+    allCollapsed?: boolean;
+    onToggleAll?: () => void;
+    /**
+     * Content rendered at the start of the row, before the flexible spacer (e.g.
+     * a tab switcher). The tree controls (search / filter / collapse) stay pinned
+     * to the end.
+     */
+    leading?: ReactNode;
+    /**
+     * Hides the search / filter / collapse controls, keeping only `leading`.
+     * Use when a non-tree tab is active and the controls would be inert.
+     */
+    controlsHidden?: boolean;
+    /** String overrides; see `JsonTreeViewProps.strings`. */
+    strings?: Partial<JsonTreeViewStrings>;
+    /** Extra classes for every tooltip panel (e.g. a z-index above a host's overlays). */
+    tooltipContentClassName?: string;
+    className?: string;
+}
+/** Leading slot + search, filter, and collapse-all controls for a `JsonTreeView`. */
+export declare function JsonTreeToolbar({ strings, tooltipContentClassName, ...props }: JsonTreeToolbarProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/json-tree-view/JsonTreeToolbar.js

@@ -0,0 +1,175 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Button } from "../button.js";
+import { cn } from "../../../lib/index.js";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuTrigger } from "../dropdown-menu.js";
+import { Input } from "../input.js";
+import { ChevronsDownUp, ChevronsUpDown, Filter, Search, X } from "lucide-react";
+import { useState } from "react";
+import { JsonTreeViewProvider, useJsonTreeViewStrings } from "./strings.js";
+import { JsonTreeTooltip } from "./JsonTreeTooltip.js";
+const ALL_FILTER_VALUE = '__all__';
+function JsonTreeToolbar({ strings, tooltipContentClassName, ...props }) {
+    return /*#__PURE__*/ jsx(JsonTreeViewProvider, {
+        strings: strings,
+        tooltipContentClassName: tooltipContentClassName,
+        children: /*#__PURE__*/ jsx(JsonTreeToolbarContent, {
+            ...props
+        })
+    });
+}
+function JsonTreeToolbarContent({ query, onQueryChange, searchPlaceholder, filters, activeFilterId = null, onFilterChange, allCollapsed = false, onToggleAll, leading, controlsHidden = false, className }) {
+    const strings = useJsonTreeViewStrings();
+    const [searchOpen, setSearchOpen] = useState(false);
+    const activeFilter = filters?.find((f)=>f.id === activeFilterId);
+    const resolvedSearchPlaceholder = searchPlaceholder ?? strings.searchFields;
+    const filterLabel = activeFilter ? strings.filterActive(activeFilter.label) : strings.filter;
+    const searchActionLabel = strings.searchFieldsAction;
+    const toggleAllLabel = allCollapsed ? strings.expandAll : strings.collapseAll;
+    const closeSearch = ()=>{
+        onQueryChange('');
+        setSearchOpen(false);
+    };
+    return /*#__PURE__*/ jsxs("div", {
+        className: cn('flex items-center gap-1.5', className),
+        children: [
+            leading,
+            !controlsHidden && /*#__PURE__*/ jsxs(Fragment, {
+                children: [
+                    searchOpen ? /*#__PURE__*/ jsxs("div", {
+                        className: "relative flex min-w-0 flex-1 items-center overflow-hidden",
+                        children: [
+                            /*#__PURE__*/ jsx(Search, {
+                                size: 13,
+                                className: "pointer-events-none absolute left-2 text-foreground-subtle"
+                            }),
+                            /*#__PURE__*/ jsx(Input, {
+                                autoFocus: true,
+                                type: "text",
+                                variant: "ghost",
+                                size: "xs",
+                                value: query,
+                                onChange: (e)=>onQueryChange(e.target.value),
+                                onKeyDown: (e)=>{
+                                    if ('Escape' === e.key) closeSearch();
+                                },
+                                "aria-label": resolvedSearchPlaceholder,
+                                placeholder: resolvedSearchPlaceholder,
+                                style: {
+                                    paddingLeft: '1.75rem',
+                                    paddingRight: '1.5rem'
+                                },
+                                className: "h-6 w-full text-foreground placeholder:text-foreground-subtle focus-visible:ring-0"
+                            }),
+                            /*#__PURE__*/ jsx("button", {
+                                type: "button",
+                                onClick: closeSearch,
+                                "aria-label": strings.clearSearch,
+                                className: "absolute right-1.5 grid size-4 place-items-center text-foreground-subtle transition hover:text-foreground",
+                                children: /*#__PURE__*/ jsx(X, {
+                                    size: 12
+                                })
+                            })
+                        ]
+                    }) : /*#__PURE__*/ jsxs(Fragment, {
+                        children: [
+                            /*#__PURE__*/ jsx("div", {
+                                className: "flex-1"
+                            }),
+                            /*#__PURE__*/ jsx(JsonTreeTooltip, {
+                                content: searchActionLabel,
+                                placement: "top",
+                                delay: true,
+                                children: /*#__PURE__*/ jsx(Button, {
+                                    variant: "ghost",
+                                    size: "3xs",
+                                    icon: true,
+                                    onClick: ()=>setSearchOpen(true),
+                                    "aria-label": searchActionLabel,
+                                    className: "rounded text-foreground-subtle hover:bg-surface-overlay hover:text-foreground",
+                                    children: /*#__PURE__*/ jsx(Search, {
+                                        size: 14
+                                    })
+                                })
+                            })
+                        ]
+                    }),
+                    !!filters?.length && onFilterChange && /*#__PURE__*/ jsxs(DropdownMenu, {
+                        children: [
+                            /*#__PURE__*/ jsx(JsonTreeTooltip, {
+                                content: filterLabel,
+                                placement: "top",
+                                delay: true,
+                                children: /*#__PURE__*/ jsx(DropdownMenuTrigger, {
+                                    asChild: true,
+                                    children: /*#__PURE__*/ jsxs(Button, {
+                                        variant: "ghost",
+                                        size: "3xs",
+                                        icon: true,
+                                        "aria-label": filterLabel,
+                                        className: "relative rounded text-foreground-subtle hover:bg-surface-overlay hover:text-foreground",
+                                        children: [
+                                            /*#__PURE__*/ jsx(Filter, {
+                                                size: 14
+                                            }),
+                                            activeFilter && /*#__PURE__*/ jsx("span", {
+                                                className: "absolute right-0.5 top-0.5 size-1.5 rounded-full bg-primary ring-1 ring-surface"
+                                            })
+                                        ]
+                                    })
+                                })
+                            }),
+                            /*#__PURE__*/ jsx(DropdownMenuContent, {
+                                align: "end",
+                                className: "w-52",
+                                children: /*#__PURE__*/ jsxs(DropdownMenuRadioGroup, {
+                                    value: activeFilterId ?? ALL_FILTER_VALUE,
+                                    onValueChange: (value)=>onFilterChange(value === ALL_FILTER_VALUE ? null : value),
+                                    children: [
+                                        /*#__PURE__*/ jsx(DropdownMenuRadioItem, {
+                                            value: ALL_FILTER_VALUE,
+                                            className: "text-[11px] [&>span:first-child]:text-foreground-accent",
+                                            children: strings.filterAll
+                                        }),
+                                        filters.map((filter)=>/*#__PURE__*/ jsxs(DropdownMenuRadioItem, {
+                                                value: filter.id,
+                                                className: "text-[11px] [&>span:first-child]:text-foreground-accent",
+                                                children: [
+                                                    /*#__PURE__*/ jsx("span", {
+                                                        className: "flex-1 truncate",
+                                                        children: filter.label
+                                                    }),
+                                                    void 0 !== filter.count && /*#__PURE__*/ jsx("span", {
+                                                        className: "ml-3 rounded bg-surface-overlay px-1.5 py-0.5 font-mono text-[10px] font-medium leading-none text-foreground-muted",
+                                                        children: filter.count
+                                                    })
+                                                ]
+                                            }, filter.id))
+                                    ]
+                                })
+                            })
+                        ]
+                    }),
+                    onToggleAll && /*#__PURE__*/ jsx(JsonTreeTooltip, {
+                        content: toggleAllLabel,
+                        placement: "top",
+                        delay: true,
+                        children: /*#__PURE__*/ jsx(Button, {
+                            variant: "ghost",
+                            size: "3xs",
+                            icon: true,
+                            onClick: onToggleAll,
+                            "aria-label": toggleAllLabel,
+                            className: "rounded text-foreground-subtle hover:bg-surface-overlay hover:text-foreground",
+                            children: allCollapsed ? /*#__PURE__*/ jsx(ChevronsUpDown, {
+                                size: 14
+                            }) : /*#__PURE__*/ jsx(ChevronsDownUp, {
+                                size: 14
+                            })
+                        })
+                    })
+                ]
+            })
+        ]
+    });
+}
+export { JsonTreeToolbar };

package/dist/components/ui/json-tree-view/JsonTreeTooltip.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__, {
+    JsonTreeTooltip: ()=>JsonTreeTooltip,
+    JsonTreeTooltipProvider: ()=>JsonTreeTooltipProvider
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const external_react_namespaceObject = require("react");
+const external_tooltip_cjs_namespaceObject = require("../tooltip.cjs");
+const index_cjs_namespaceObject = require("../../../lib/index.cjs");
+const external_strings_cjs_namespaceObject = require("./strings.cjs");
+const HasTooltipProviderContext = /*#__PURE__*/ (0, external_react_namespaceObject.createContext)(false);
+function JsonTreeTooltipProvider({ children }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_tooltip_cjs_namespaceObject.TooltipProvider, {
+        delayDuration: 300,
+        skipDelayDuration: 100,
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(HasTooltipProviderContext.Provider, {
+            value: true,
+            children: children
+        })
+    });
+}
+function JsonTreeTooltip({ content, placement = 'top', delay = false, hide = false, children }) {
+    const [open, setOpen] = (0, external_react_namespaceObject.useState)(false);
+    const contentClassName = (0, external_strings_cjs_namespaceObject.useJsonTreeViewTooltipClassName)();
+    const hasProvider = (0, external_react_namespaceObject.useContext)(HasTooltipProviderContext);
+    const isEmpty = null == content || false === content || 'string' == typeof content && !content.trim();
+    const tooltip = /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_tooltip_cjs_namespaceObject.Tooltip, {
+        open: open && !hide && !isEmpty,
+        onOpenChange: setOpen,
+        delayDuration: delay ? 700 : 200,
+        children: [
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_tooltip_cjs_namespaceObject.TooltipTrigger, {
+                asChild: true,
+                children: children
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_tooltip_cjs_namespaceObject.TooltipPortal, {
+                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_tooltip_cjs_namespaceObject.TooltipContent, {
+                    side: placement,
+                    className: (0, index_cjs_namespaceObject.cn)('max-w-xs wrap-break-word', contentClassName),
+                    children: content
+                })
+            })
+        ]
+    });
+    if (hasProvider) return tooltip;
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_tooltip_cjs_namespaceObject.TooltipProvider, {
+        delayDuration: 200,
+        skipDelayDuration: 100,
+        children: tooltip
+    });
+}
+exports.JsonTreeTooltip = __webpack_exports__.JsonTreeTooltip;
+exports.JsonTreeTooltipProvider = __webpack_exports__.JsonTreeTooltipProvider;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "JsonTreeTooltip",
+    "JsonTreeTooltipProvider"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/ui/json-tree-view/JsonTreeTooltip.d.ts

@@ -0,0 +1,21 @@
+import { type ReactElement, type ReactNode } from 'react';
+/**
+ * One shared Radix provider for every tooltip below it, so each
+ * `JsonTreeTooltip` skips mounting its own fallback provider.
+ */
+export declare function JsonTreeTooltipProvider({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+interface JsonTreeTooltipProps {
+    content: ReactNode;
+    placement?: 'top' | 'bottom' | 'left' | 'right';
+    /** Waits the longer 700ms before opening, for dense controls. */
+    delay?: boolean;
+    /** Keeps the tooltip closed (e.g. while the trigger's own menu is open). */
+    hide?: boolean;
+    /** A single element; it becomes the trigger without an extra wrapper. */
+    children: ReactElement;
+}
+/** Hover tooltip for the tree's controls, built on apollo-wind's Tooltip. */
+export declare function JsonTreeTooltip({ content, placement, delay, hide, children, }: JsonTreeTooltipProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/ui/json-tree-view/JsonTreeTooltip.js

@@ -0,0 +1,47 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { createContext, useContext, useState } from "react";
+import { Tooltip, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger } from "../tooltip.js";
+import { cn } from "../../../lib/index.js";
+import { useJsonTreeViewTooltipClassName } from "./strings.js";
+const HasTooltipProviderContext = /*#__PURE__*/ createContext(false);
+function JsonTreeTooltipProvider({ children }) {
+    return /*#__PURE__*/ jsx(TooltipProvider, {
+        delayDuration: 300,
+        skipDelayDuration: 100,
+        children: /*#__PURE__*/ jsx(HasTooltipProviderContext.Provider, {
+            value: true,
+            children: children
+        })
+    });
+}
+function JsonTreeTooltip({ content, placement = 'top', delay = false, hide = false, children }) {
+    const [open, setOpen] = useState(false);
+    const contentClassName = useJsonTreeViewTooltipClassName();
+    const hasProvider = useContext(HasTooltipProviderContext);
+    const isEmpty = null == content || false === content || 'string' == typeof content && !content.trim();
+    const tooltip = /*#__PURE__*/ jsxs(Tooltip, {
+        open: open && !hide && !isEmpty,
+        onOpenChange: setOpen,
+        delayDuration: delay ? 700 : 200,
+        children: [
+            /*#__PURE__*/ jsx(TooltipTrigger, {
+                asChild: true,
+                children: children
+            }),
+            /*#__PURE__*/ jsx(TooltipPortal, {
+                children: /*#__PURE__*/ jsx(TooltipContent, {
+                    side: placement,
+                    className: cn('max-w-xs wrap-break-word', contentClassName),
+                    children: content
+                })
+            })
+        ]
+    });
+    if (hasProvider) return tooltip;
+    return /*#__PURE__*/ jsx(TooltipProvider, {
+        delayDuration: 200,
+        skipDelayDuration: 100,
+        children: tooltip
+    });
+}
+export { JsonTreeTooltip, JsonTreeTooltipProvider };

package/dist/components/ui/json-tree-view/JsonTypeBadge.cjs

@@ -0,0 +1,70 @@
+"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__, {
+    JsonTypeBadge: ()=>JsonTypeBadge
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const index_cjs_namespaceObject = require("../../../lib/index.cjs");
+const external_lucide_react_namespaceObject = require("lucide-react");
+const external_JsonTreeTooltip_cjs_namespaceObject = require("./JsonTreeTooltip.cjs");
+const TYPE_ICON = {
+    string: external_lucide_react_namespaceObject.Type,
+    number: external_lucide_react_namespaceObject.Hash,
+    boolean: external_lucide_react_namespaceObject.ToggleLeft,
+    object: external_lucide_react_namespaceObject.Braces,
+    array: external_lucide_react_namespaceObject.Brackets,
+    null: external_lucide_react_namespaceObject.CircleSlash2
+};
+const TYPE_LABEL = {
+    string: 'String',
+    number: 'Number',
+    boolean: 'Boolean',
+    object: 'Object',
+    array: 'Array',
+    null: 'Null'
+};
+function JsonTypeBadge({ type, icon, className, tooltip }) {
+    const DefaultIcon = TYPE_ICON[type];
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_JsonTreeTooltip_cjs_namespaceObject.JsonTreeTooltip, {
+        content: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+            className: "break-all font-mono text-xs font-semibold leading-4",
+            children: tooltip ?? TYPE_LABEL[type]
+        }),
+        placement: "top",
+        delay: true,
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+            className: (0, index_cjs_namespaceObject.cn)('inline-flex h-4.5 min-w-4.5 shrink-0 items-center justify-center rounded border border-border bg-surface-overlay px-0.5 text-foreground-muted [&_svg]:size-2.75', className),
+            children: icon ?? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(DefaultIcon, {})
+        })
+    });
+}
+exports.JsonTypeBadge = __webpack_exports__.JsonTypeBadge;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "JsonTypeBadge"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});