"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__, {
    NodeToolbar: ()=>NodeToolbar
});
const jsx_runtime_namespaceObject = require("react/jsx-runtime");
const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
const react_namespaceObject = require("motion/react");
const external_react_namespaceObject = require("react");
const icon_registry_cjs_namespaceObject = require("../../../utils/icon-registry.cjs");
const external_CanvasTooltip_cjs_namespaceObject = require("../../CanvasTooltip.cjs");
const external_NodeViewportOverlay_cjs_namespaceObject = require("../../NodeViewportOverlay.cjs");
const index_cjs_namespaceObject = require("../shared/index.cjs");
const external_NodeToolbar_utils_cjs_namespaceObject = require("./NodeToolbar.utils.cjs");
const external_useToolbarState_cjs_namespaceObject = require("./useToolbarState.cjs");
const POSITIONER_BASE_CLASS = 'absolute flex pointer-events-none z-10';
const POSITIONER_POSITION_CLASS = {
    top: 'top-[calc(-52px-var(--toolbar-offset,0px))] left-0 right-0 flex-row',
    bottom: 'bottom-[calc(-52px-var(--toolbar-offset,0px))] left-0 right-0 flex-row',
    left: 'left-[calc(-52px-var(--toolbar-offset,0px))] top-0 bottom-0 flex-col',
    right: 'right-[calc(-52px-var(--toolbar-offset,0px))] top-0 bottom-0 flex-col'
};
const TOOLBAR_OFFSET = 48;
const POSITIONER_ALIGN_CLASS = {
    start: 'justify-start',
    center: 'justify-center',
    end: 'justify-end'
};
const CONTAINER_BASE_CLASS = "flex items-center gap-1 p-1 min-h-10 min-w-10 shrink-0 bg-(--canvas-background-raised) border border-(--canvas-background-overlay) rounded-xl shadow-[0_2px_6px_rgba(0,0,0,0.08)] pointer-events-auto";
const CONTAINER_DIRECTION_CLASS = {
    top: 'flex-row',
    bottom: 'flex-row',
    left: 'flex-col',
    right: 'flex-col'
};
const SEPARATOR_BASE_CLASS = 'flex-[0_0_auto] bg-(--canvas-background-overlay) self-center';
const SEPARATOR_VERTICAL_CLASS = 'w-px h-5';
const SEPARATOR_HORIZONTAL_CLASS = 'w-full h-px';
const DROPDOWN_MENU_CLASS = "absolute top-[-2px] left-[calc(100%+4px)] min-w-[180px] bg-(--canvas-background-raised) border border-(--canvas-background-overlay) rounded-md shadow-[0_4px_12px_rgba(0,0,0,0.08),0_2px_4px_rgba(0,0,0,0.04)] p-1 pointer-events-auto";
const DROPDOWN_ITEM_BASE_CLASS = "flex items-center gap-3 w-full py-2 px-3 bg-transparent border-none rounded-[4px] text-sm text-(--canvas-foreground) text-left [transition:background_0.15s_ease] enabled:hover:bg-(--canvas-background-hover) future:enabled:hover:bg-(--canvas-background-overlay) [&>svg]:shrink-0 [&>svg]:text-(--canvas-foreground)";
const DROPDOWN_ITEM_DISABLED_CLASS = 'cursor-not-allowed opacity-40 pointer-events-none';
const DROPDOWN_ITEM_ENABLED_CLASS = 'cursor-pointer opacity-100';
const NodeToolbarComponent = ({ nodeId, config, expanded, hidden, offsetToolbar, portalToNodeOverlay })=>{
    const { isDropdownOpen, setIsDropdownOpen, dropdownRef, buttonRef, actionsToDisplay, displayState, shouldShowOverflow, overflowActionsToDisplay, separatorOrientation, toggleDropdown } = (0, external_useToolbarState_cjs_namespaceObject.useToolbarState)({
        config,
        expanded,
        nodeId,
        hidden
    });
    const position = config.position || 'top';
    const align = config.align || 'center';
    const positionerClassName = (0, external_react_namespaceObject.useMemo)(()=>(0, apollo_wind_namespaceObject.cn)(POSITIONER_BASE_CLASS, POSITIONER_POSITION_CLASS[position], POSITIONER_ALIGN_CLASS[align]), [
        position,
        align
    ]);
    const containerClassName = (0, external_react_namespaceObject.useMemo)(()=>(0, apollo_wind_namespaceObject.cn)(CONTAINER_BASE_CLASS, CONTAINER_DIRECTION_CLASS[position]), [
        position
    ]);
    const separatorClassName = (0, external_react_namespaceObject.useMemo)(()=>(0, apollo_wind_namespaceObject.cn)(SEPARATOR_BASE_CLASS, 'horizontal' === separatorOrientation ? SEPARATOR_HORIZONTAL_CLASS : SEPARATOR_VERTICAL_CLASS), [
        separatorOrientation
    ]);
    const offsetStyle = (0, external_react_namespaceObject.useMemo)(()=>{
        if (!offsetToolbar) return;
        return {
            '--toolbar-offset': `${TOOLBAR_OFFSET}px`
        };
    }, [
        offsetToolbar
    ]);
    const toolbarAnimationVariants = (0, external_react_namespaceObject.useMemo)(()=>{
        const offsetAxis = 'top' === position || 'bottom' === position ? 'y' : 'x';
        const offsetAmount = 'top' === position || 'left' === position ? -10 : 10;
        const offset = 'pinned' !== displayState ? {
            [offsetAxis]: offsetAmount
        } : {};
        const offsetAtRest = 'pinned' !== displayState ? {
            [offsetAxis]: 0
        } : {};
        return {
            initial: {
                opacity: 0,
                ...offset
            },
            animate: {
                opacity: 1,
                ...offsetAtRest
            },
            exit: {
                opacity: 0,
                ...offset
            }
        };
    }, [
        position,
        displayState
    ]);
    if (0 === config.actions.length && (!config.overflowActions || 0 === config.overflowActions.length)) return null;
    const toolbarContent = /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_namespaceObject.AnimatePresence, {
        children: 'hidden' !== displayState && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
            className: positionerClassName,
            style: offsetStyle,
            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(react_namespaceObject.motion.div, {
                layout: "position",
                className: containerClassName,
                initial: toolbarAnimationVariants.initial,
                animate: toolbarAnimationVariants.animate,
                exit: toolbarAnimationVariants.exit,
                transition: {
                    duration: 0.15,
                    ease: 'easeOut'
                },
                role: "toolbar",
                children: [
                    actionsToDisplay.map((item, i)=>(0, external_NodeToolbar_utils_cjs_namespaceObject.isSeparator)(item) ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
                            className: separatorClassName
                        }, `separator-${i}`) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.ToolbarButton, {
                            action: item,
                            layoutId: item.isPinned ? `toolbar-btn-${nodeId}-${item.id}` : void 0
                        }, item.id)),
                    shouldShowOverflow && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
                        children: [
                            actionsToDisplay.length > 0 && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
                                className: separatorClassName
                            }),
                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
                                className: "relative",
                                children: [
                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
                                        content: config.overflowLabel ?? 'More options',
                                        placement: "top",
                                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.ToolbarIconButton, {
                                            ref: buttonRef,
                                            type: "button",
                                            className: "nodrag nopan",
                                            onClick: toggleDropdown,
                                            "aria-label": config.overflowLabel ?? 'More options',
                                            "aria-expanded": isDropdownOpen,
                                            "aria-haspopup": "menu",
                                            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(icon_registry_cjs_namespaceObject.CanvasIcon, {
                                                icon: "ellipsis-vertical",
                                                size: 16
                                            })
                                        })
                                    }),
                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_namespaceObject.AnimatePresence, {
                                        children: isDropdownOpen && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_namespaceObject.motion.div, {
                                            ref: dropdownRef,
                                            className: DROPDOWN_MENU_CLASS,
                                            initial: {
                                                opacity: 0,
                                                x: -8
                                            },
                                            animate: {
                                                opacity: 1,
                                                x: 0
                                            },
                                            exit: {
                                                opacity: 0,
                                                x: -8
                                            },
                                            transition: {
                                                duration: 0.15
                                            },
                                            role: "menu",
                                            "aria-label": config.overflowLabel ?? 'More options',
                                            children: overflowActionsToDisplay.map((item, i)=>{
                                                if ((0, external_NodeToolbar_utils_cjs_namespaceObject.isSeparator)(item)) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
                                                    className: (0, apollo_wind_namespaceObject.cn)(SEPARATOR_BASE_CLASS, SEPARATOR_HORIZONTAL_CLASS)
                                                }, `separator-${i}`);
                                                return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("button", {
                                                    type: "button",
                                                    className: (0, apollo_wind_namespaceObject.cn)(DROPDOWN_ITEM_BASE_CLASS, item.disabled ? DROPDOWN_ITEM_DISABLED_CLASS : DROPDOWN_ITEM_ENABLED_CLASS, 'nodrag nopan'),
                                                    onClick: (e)=>{
                                                        e.stopPropagation();
                                                        e.preventDefault();
                                                        if (!item.disabled) {
                                                            item.onClick();
                                                            setIsDropdownOpen(false);
                                                        }
                                                    },
                                                    "aria-label": item.label,
                                                    "aria-disabled": item.disabled,
                                                    disabled: item.disabled,
                                                    role: "menuitem",
                                                    children: [
                                                        item.icon && 'string' == typeof item.icon && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
                                                            style: {
                                                                flex: 'unset',
                                                                display: 'inline-flex'
                                                            },
                                                            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(icon_registry_cjs_namespaceObject.CanvasIcon, {
                                                                icon: item.icon,
                                                                size: 16
                                                            })
                                                        }),
                                                        item.icon && 'string' != typeof item.icon && item.icon,
                                                        /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
                                                            className: "flex-1 text-(--canvas-foreground)",
                                                            children: item.label
                                                        })
                                                    ]
                                                }, item.id);
                                            })
                                        })
                                    })
                                ]
                            })
                        ]
                    })
                ]
            })
        })
    });
    if (portalToNodeOverlay) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_NodeViewportOverlay_cjs_namespaceObject.NodeViewportOverlay, {
        nodeId: nodeId,
        layer: "nodeToolbar",
        children: toolbarContent
    });
    return toolbarContent;
};
const NodeToolbar = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(NodeToolbarComponent);
exports.NodeToolbar = __webpack_exports__.NodeToolbar;
for(var __rspack_i in __webpack_exports__)if (-1 === [
    "NodeToolbar"
].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
Object.defineProperty(exports, '__esModule', {
    value: true
});
