@uipath/apollo-react 6.1.0 → 6.2.0

package/dist/canvas/components/JsonTree/JsonTreeToolbar.js

@@ -0,0 +1,190 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Button, DropdownMenu, DropdownMenuContent, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuTrigger, Input, cn } from "@uipath/apollo-wind";
+import { ChevronsDownUp, ChevronsUpDown, Filter, Search, X } from "lucide-react";
+import { useState } from "react";
+import { useSafeLingui } from "../../../i18n/index.js";
+import { CanvasTooltip } from "../CanvasTooltip.js";
+const ALL_FILTER_VALUE = '__all__';
+function JsonTreeToolbar({ query, onQueryChange, searchPlaceholder, filters, activeFilterId = null, onFilterChange, allCollapsed = false, onToggleAll, leading, controlsHidden = false, className }) {
+    const { _ } = useSafeLingui();
+    const [searchOpen, setSearchOpen] = useState(false);
+    const activeFilter = filters?.find((f)=>f.id === activeFilterId);
+    const resolvedSearchPlaceholder = searchPlaceholder ?? _({
+        id: 'canvas.json_value_panel.search_fields',
+        message: 'Search fields and values...'
+    });
+    const filterLabel = activeFilter ? _({
+        id: 'canvas.json_value_panel.filter_active',
+        message: 'Filter: {label}',
+        values: {
+            label: activeFilter.label
+        }
+    }) : _({
+        id: 'canvas.json_value_panel.filter',
+        message: 'Filter'
+    });
+    const searchActionLabel = _({
+        id: 'canvas.json_value_panel.search_fields_action',
+        message: 'Search fields and values'
+    });
+    const toggleAllLabel = allCollapsed ? _({
+        id: 'canvas.json_value_panel.expand_all',
+        message: 'Expand all'
+    }) : _({
+        id: 'canvas.json_value_panel.collapse_all',
+        message: 'Collapse all'
+    });
+    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": _({
+                                    id: 'canvas.json_value_panel.clear_search',
+                                    message: 'Clear search'
+                                }),
+                                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(CanvasTooltip, {
+                                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(CanvasTooltip, {
+                                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: _({
+                                                id: 'canvas.json_value_panel.filter_all',
+                                                message: 'All'
+                                            })
+                                        }),
+                                        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(CanvasTooltip, {
+                        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/canvas/components/JsonTree/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 apollo_wind_namespaceObject = require("@uipath/apollo-wind");
+const external_lucide_react_namespaceObject = require("lucide-react");
+const external_CanvasTooltip_cjs_namespaceObject = require("../CanvasTooltip.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_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
+        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, apollo_wind_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
+});

package/dist/canvas/components/JsonTree/JsonTypeBadge.d.ts

@@ -0,0 +1,10 @@
+import type { ReactNode } from 'react';
+import type { JsonTreeNodeType } from './JsonTree.types';
+export interface JsonTypeBadgeProps {
+    type: JsonTreeNodeType;
+    icon?: ReactNode;
+    className?: string;
+    tooltip?: ReactNode;
+}
+export declare function JsonTypeBadge({ type, icon, className, tooltip }: JsonTypeBadgeProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=JsonTypeBadge.d.ts.map

package/dist/canvas/components/JsonTree/JsonTypeBadge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"JsonTypeBadge.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/JsonTree/JsonTypeBadge.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAsBzD,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,gBAAgB,CAAC;IAEvB,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,OAAO,CAAC,EAAE,SAAS,CAAC;CACrB;AAOD,wBAAgB,aAAa,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE,EAAE,kBAAkB,2CAsBnF"}

package/dist/canvas/components/JsonTree/JsonTypeBadge.js

@@ -0,0 +1,36 @@
+import { jsx } from "react/jsx-runtime";
+import { cn } from "@uipath/apollo-wind";
+import { Braces, Brackets, CircleSlash2, Hash, ToggleLeft, Type } from "lucide-react";
+import { CanvasTooltip } from "../CanvasTooltip.js";
+const TYPE_ICON = {
+    string: Type,
+    number: Hash,
+    boolean: ToggleLeft,
+    object: Braces,
+    array: Brackets,
+    null: 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__*/ jsx(CanvasTooltip, {
+        content: /*#__PURE__*/ jsx("span", {
+            className: "break-all font-mono text-xs font-semibold leading-4",
+            children: tooltip ?? TYPE_LABEL[type]
+        }),
+        placement: "top",
+        delay: true,
+        children: /*#__PURE__*/ jsx("span", {
+            className: 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__*/ jsx(DefaultIcon, {})
+        })
+    });
+}
+export { JsonTypeBadge };

package/dist/canvas/components/JsonTree/NodeKey.cjs

@@ -0,0 +1,86 @@
+"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__, {
+    NodeKey: ()=>NodeKey
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
+const index_cjs_namespaceObject = require("../../../i18n/index.cjs");
+const external_CanvasTooltip_cjs_namespaceObject = require("../CanvasTooltip.cjs");
+function NodeKey({ node, label, displayPath, onCopyPath, className }) {
+    const { _ } = (0, index_cjs_namespaceObject.useSafeLingui)();
+    const text = label ?? node.key;
+    const copyPathText = displayPath ?? node.path;
+    const keyClass = (0, apollo_wind_namespaceObject.cn)('max-w-[45%] shrink-0 truncate text-xs text-foreground', null != label ? 'font-medium' : 'font-mono', void 0 === node.value && 'text-foreground-muted', className);
+    if (!onCopyPath) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+        className: keyClass,
+        children: text
+    });
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
+        placement: "top",
+        delay: true,
+        content: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+            className: "flex max-w-60 flex-col gap-1",
+            children: [
+                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                    className: "break-all font-mono text-xs font-semibold leading-4",
+                    children: copyPathText
+                }),
+                node.schema?.description && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                    className: "text-xs leading-4",
+                    children: node.schema.description
+                }),
+                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                    className: "text-[11px] leading-4 opacity-70",
+                    children: _({
+                        id: 'canvas.json_value_panel.copy_path_hint',
+                        message: 'Click to copy this path'
+                    })
+                })
+            ]
+        }),
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
+            type: "button",
+            onClick: ()=>onCopyPath(node),
+            "aria-label": _({
+                id: 'canvas.json_value_panel.copy_path_for',
+                message: 'Copy path for {path}',
+                values: {
+                    path: copyPathText
+                }
+            }),
+            className: (0, apollo_wind_namespaceObject.cn)(keyClass, 'cursor-pointer decoration-foreground-subtle underline-offset-2 hover:underline'),
+            children: text
+        })
+    });
+}
+exports.NodeKey = __webpack_exports__.NodeKey;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "NodeKey"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/canvas/components/JsonTree/NodeKey.d.ts

@@ -0,0 +1,10 @@
+import type { JsonTreeNode } from './JsonTree.types';
+export interface NodeKeyProps {
+    node: JsonTreeNode;
+    label?: string;
+    displayPath?: string;
+    onCopyPath?: (node: JsonTreeNode) => void;
+    className?: string;
+}
+export declare function NodeKey({ node, label, displayPath, onCopyPath, className }: NodeKeyProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=NodeKey.d.ts.map

package/dist/canvas/components/JsonTree/NodeKey.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NodeKey.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/JsonTree/NodeKey.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAErD,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,YAAY,CAAC;IAEnB,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAOD,wBAAgB,OAAO,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,WAAW,EAAE,UAAU,EAAE,SAAS,EAAE,EAAE,YAAY,2CAuDxF"}

package/dist/canvas/components/JsonTree/NodeKey.js

@@ -0,0 +1,52 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "@uipath/apollo-wind";
+import { useSafeLingui } from "../../../i18n/index.js";
+import { CanvasTooltip } from "../CanvasTooltip.js";
+function NodeKey({ node, label, displayPath, onCopyPath, className }) {
+    const { _ } = useSafeLingui();
+    const text = label ?? node.key;
+    const copyPathText = displayPath ?? node.path;
+    const keyClass = cn('max-w-[45%] shrink-0 truncate text-xs text-foreground', null != label ? 'font-medium' : 'font-mono', void 0 === node.value && 'text-foreground-muted', className);
+    if (!onCopyPath) return /*#__PURE__*/ jsx("span", {
+        className: keyClass,
+        children: text
+    });
+    return /*#__PURE__*/ jsx(CanvasTooltip, {
+        placement: "top",
+        delay: true,
+        content: /*#__PURE__*/ jsxs("div", {
+            className: "flex max-w-60 flex-col gap-1",
+            children: [
+                /*#__PURE__*/ jsx("span", {
+                    className: "break-all font-mono text-xs font-semibold leading-4",
+                    children: copyPathText
+                }),
+                node.schema?.description && /*#__PURE__*/ jsx("span", {
+                    className: "text-xs leading-4",
+                    children: node.schema.description
+                }),
+                /*#__PURE__*/ jsx("span", {
+                    className: "text-[11px] leading-4 opacity-70",
+                    children: _({
+                        id: 'canvas.json_value_panel.copy_path_hint',
+                        message: 'Click to copy this path'
+                    })
+                })
+            ]
+        }),
+        children: /*#__PURE__*/ jsx("button", {
+            type: "button",
+            onClick: ()=>onCopyPath(node),
+            "aria-label": _({
+                id: 'canvas.json_value_panel.copy_path_for',
+                message: 'Copy path for {path}',
+                values: {
+                    path: copyPathText
+                }
+            }),
+            className: cn(keyClass, 'cursor-pointer decoration-foreground-subtle underline-offset-2 hover:underline'),
+            children: text
+        })
+    });
+}
+export { NodeKey };

package/dist/canvas/components/JsonTree/RowActions.cjs

@@ -0,0 +1,114 @@
+"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__, {
+    RowActions: ()=>RowActions
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
+const external_lucide_react_namespaceObject = require("lucide-react");
+const index_cjs_namespaceObject = require("../../../i18n/index.cjs");
+const external_CanvasTooltip_cjs_namespaceObject = require("../CanvasTooltip.cjs");
+const ACTION_BUTTON_CLASS = 'shrink-0 rounded text-foreground-subtle opacity-0 hover:text-foreground hover:bg-surface-raised group-hover:opacity-100 focus-visible:opacity-100';
+const ACTION_TONE_CLASS = {
+    neutral: '',
+    info: 'text-info hover:text-info',
+    warning: 'text-warning hover:text-warning',
+    error: 'text-error hover:text-error'
+};
+function RowActions({ node, actions, maxInline }) {
+    const { _ } = (0, index_cjs_namespaceObject.useSafeLingui)();
+    if (0 === actions.length) return null;
+    const overflowing = actions.length > maxInline;
+    const inline = overflowing ? actions.slice(0, maxInline - 1) : actions;
+    const overflow = overflowing ? actions.slice(maxInline - 1) : [];
+    const moreLabel = _({
+        id: 'canvas.json_value_panel.more_actions',
+        message: 'More actions'
+    });
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("span", {
+        className: "ml-auto flex shrink-0 items-center gap-0.5",
+        children: [
+            inline.map((action)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
+                    content: action.tooltip ?? action.label,
+                    placement: "top",
+                    delay: true,
+                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Button, {
+                        variant: "ghost",
+                        size: "4xs",
+                        icon: true,
+                        disabled: action.disabled,
+                        onClick: ()=>action.onSelect(node),
+                        "aria-label": action.label,
+                        className: (0, apollo_wind_namespaceObject.cn)(ACTION_BUTTON_CLASS, '[&_svg]:size-2.75', action.tone && ACTION_TONE_CLASS[action.tone], action.active && 'text-brand opacity-100 hover:text-brand'),
+                        children: action.icon
+                    })
+                }, action.id)),
+            overflow.length > 0 && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(apollo_wind_namespaceObject.DropdownMenu, {
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
+                        content: moreLabel,
+                        placement: "top",
+                        delay: true,
+                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.DropdownMenuTrigger, {
+                            asChild: true,
+                            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Button, {
+                                variant: "ghost",
+                                size: "4xs",
+                                icon: true,
+                                "aria-label": moreLabel,
+                                className: (0, apollo_wind_namespaceObject.cn)(ACTION_BUTTON_CLASS, '[&_svg]:size-2.75'),
+                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.MoreHorizontal, {})
+                            })
+                        })
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.DropdownMenuContent, {
+                        align: "end",
+                        className: "min-w-40",
+                        children: overflow.map((action)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(apollo_wind_namespaceObject.DropdownMenuItem, {
+                                disabled: action.disabled,
+                                onClick: ()=>action.onSelect(node),
+                                className: (0, apollo_wind_namespaceObject.cn)('gap-2 text-xs', 'error' === action.tone && 'text-error'),
+                                children: [
+                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                                        className: "grid size-3.5 shrink-0 place-items-center [&_svg]:size-3.5",
+                                        children: action.icon
+                                    }),
+                                    action.label
+                                ]
+                            }, action.id))
+                    })
+                ]
+            })
+        ]
+    });
+}
+exports.RowActions = __webpack_exports__.RowActions;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "RowActions"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/canvas/components/JsonTree/RowActions.d.ts

@@ -0,0 +1,8 @@
+import type { JsonTreeNode, NodeAction } from './JsonTree.types';
+export interface RowActionsProps {
+    node: JsonTreeNode;
+    actions: NodeAction[];
+    maxInline: number;
+}
+export declare function RowActions({ node, actions, maxInline }: RowActionsProps): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=RowActions.d.ts.map

package/dist/canvas/components/JsonTree/RowActions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RowActions.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/JsonTree/RowActions.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,YAAY,EAAE,UAAU,EAAsB,MAAM,kBAAkB,CAAC;AAYrF,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,YAAY,CAAC;IAEnB,OAAO,EAAE,UAAU,EAAE,CAAC;IAEtB,SAAS,EAAE,MAAM,CAAC;CACnB;AAQD,wBAAgB,UAAU,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,eAAe,kDA4EvE"}