export const componentFrameBorderColorVariants = {
    shared: "border-component-shared",
    readonly: "border-border-default",
    layout: "border-highlight-100",
    default: "border-component-default",
    nonMovable: "border-feedback-red",
    suggestions: "border-component-suggestions",
};
export const componentFrameBgColorVariants = {
    shared: "bg-component-shared",
    readonly: "bg-neutral-grey-50",
    layout: "bg-highlight-100",
    default: "bg-component-default",
    nonMovable: "bg-feedback-red",
    suggestions: "bg-component-suggestions",
};
export const componentFrameBgHoverColorVariants = {
    shared: "hover:bg-[color-mix(in_srgb,var(--color-component-shared)_88%,black)]",
    readonly: "hover:bg-[color-mix(in_srgb,var(--color-neutral-grey-50)_88%,black)]",
    layout: "hover:bg-[color-mix(in_srgb,var(--color-highlight-100)_88%,black)]",
    default: "hover:bg-[color-mix(in_srgb,var(--color-component-default)_88%,black)]",
    nonMovable: "hover:bg-[color-mix(in_srgb,var(--color-feedback-red)_88%,black)]",
    suggestions: "hover:bg-[color-mix(in_srgb,var(--color-component-suggestions)_88%,black)]",
};
export function getPlaceholderDropZoneColor({ parentComponent, prevComponent, nextComponent, }) {
    const isLayout = !!prevComponent?.layoutId ||
        !!nextComponent?.layoutId ||
        hasComponentAncestor(parentComponent, "layout");
    if (isLayout)
        return "layout";
    const isShared = !!prevComponent?.isShared ||
        !!nextComponent?.isShared ||
        hasComponentAncestor(parentComponent, "shared");
    return isShared ? "shared" : "default";
}
function hasComponentAncestor(component, type) {
    let current = component;
    while (current) {
        if (type === "layout" && current.layoutId)
            return true;
        if (type === "shared" && current.isShared)
            return true;
        current = current.parentPlaceholder?.parentComponent;
    }
    return false;
}
//# sourceMappingURL=componentFrameColors.js.map