import { jsx, jsxs } from "react/jsx-runtime";
import { CanvasIcon } from "../../utils/index.js";
function hasButtonAction(props) {
    return Boolean(props.actionLabel && !props.actionHref && props.onAction);
}
function AddNodePanelEmptyMessage(props) {
    const { icon, message } = props;
    const actionClassName = 'rounded-md border border-solid px-3 py-1.5 text-xs font-medium no-underline';
    const actionStyle = {
        borderColor: 'var(--canvas-border)',
        color: 'var(--canvas-foreground-emp)',
        backgroundColor: 'var(--canvas-background)'
    };
    return /*#__PURE__*/ jsxs("output", {
        className: "flex min-h-[250px] flex-1 flex-col items-center justify-center gap-4 px-6 py-8 text-center",
        "aria-live": "polite",
        children: [
            /*#__PURE__*/ jsx("div", {
                className: "flex h-10 w-10 items-center justify-center rounded-lg",
                style: {
                    backgroundColor: 'var(--canvas-background-hover)',
                    color: 'var(--canvas-foreground-de-emp)'
                },
                children: /*#__PURE__*/ jsx(CanvasIcon, {
                    icon: icon,
                    size: 22
                })
            }),
            /*#__PURE__*/ jsx("p", {
                className: "m-0 max-w-[240px] text-sm leading-5 text-foreground-muted",
                children: message
            }),
            props.actionLabel && props.actionHref && /*#__PURE__*/ jsx("a", {
                href: props.actionHref,
                className: actionClassName,
                style: actionStyle,
                onClick: props.onAction,
                children: props.actionLabel
            }),
            hasButtonAction(props) && /*#__PURE__*/ jsx("button", {
                type: "button",
                className: actionClassName,
                style: actionStyle,
                onClick: props.onAction,
                children: props.actionLabel
            })
        ]
    });
}
export { AddNodePanelEmptyMessage };
