import { jsx, jsxs } from "react/jsx-runtime";
import { Row } from "../../layouts/index.js";
import { Position } from "../../xyflow/react.js";
import { cx } from "../../utils/CssUtil.js";
const LABEL_SHADOW_STYLE = {
    textShadow: '0 0 4px var(--canvas-background), 0 0 4px var(--canvas-background)'
};
const LABEL_POSITION = {
    [Position.Top]: 'bottom-[calc(100%+4px)] left-1/2 -translate-x-1/2',
    [Position.Bottom]: 'top-[calc(100%+4px)] left-1/2 -translate-x-1/2',
    [Position.Left]: 'right-[calc(100%+4px)] top-1/2 -translate-y-1/2',
    [Position.Right]: 'left-[calc(100%+4px)] top-1/2 -translate-y-1/2'
};
const HandleLabel = ({ position, backgroundColor, label, labelIcon, shouldTruncate, visible = true })=>/*#__PURE__*/ jsx("div", {
        "aria-hidden": visible ? void 0 : true,
        className: cx('absolute px-1.5 py-0.5 rounded-sm z-1 whitespace-nowrap select-none transition-opacity duration-250', visible ? 'opacity-100' : 'opacity-0 pointer-events-none', LABEL_POSITION[position], shouldTruncate && 'max-w-[50px] overflow-hidden'),
        style: backgroundColor ? {
            backgroundColor
        } : void 0,
        children: /*#__PURE__*/ jsxs(Row, {
            align: "center",
            gap: 4,
            children: [
                labelIcon,
                /*#__PURE__*/ jsx("span", {
                    className: cx('text-xs font-bold text-foreground-muted', shouldTruncate && 'overflow-hidden text-ellipsis whitespace-nowrap'),
                    style: backgroundColor ? void 0 : LABEL_SHADOW_STYLE,
                    children: label
                })
            ]
        })
    });
export { HandleLabel, LABEL_SHADOW_STYLE };
