import { jsx as _jsx } from "react/jsx-runtime";
import { Globe } from "lucide-react";
import { useEditContext } from "../../client/editContext";
import { SimpleIconButton } from "../../ui/SimpleIconButton";
/**
 * Toggles the canvas between editing the per-version "final layout" (default)
 * and the cross-version "shared layout" (Sitecore's __Renderings field).
 *
 * Hidden unless the active page's component provider opts into shared layout
 * via componentsProviderSettings.supportsLanguageSharedLayout. The project's
 * custom (non-Sitecore-renderings) provider doesn't model this distinction
 * and will leave the flag unset.
 */
export function LayoutModeControls() {
    const editContext = useEditContext();
    if (!editContext)
        return null;
    if (editContext.mode === "preview")
        return null;
    const pageViewContext = editContext.getActiveSlotContext()?.primaryPageViewContext;
    const supportsLanguageSharedLayout = !!pageViewContext?.componentsProviderSettings?.supportsLanguageSharedLayout;
    if (!supportsLanguageSharedLayout)
        return null;
    const isShared = editContext.layoutMode === "shared";
    return (_jsx(SimpleIconButton, { icon: _jsx(Globe, { className: "h-6 w-6 p-1", strokeWidth: 1 }), label: isShared
            ? "Editing shared layout (visible across all language versions)"
            : "Edit shared layout", size: "large", "data-testid": "shared-layout-mode-button", selected: isShared, onClick: () => editContext.setLayoutMode(isShared ? "final" : "shared") }));
}
//# sourceMappingURL=LayoutModeControls.js.map