import { escape } from "./astro_n_html-escaper.js";
import { n as createWindowElement, r as synchronizePlacementOnUpdate, t as closeOnOutsideClick } from "./window-DH1eA2cl.js";
import { i as positionHighlight, n as createHighlight, r as getElementsPositionInDocument, t as attachTooltipToHighlight } from "./highlight-CpHMw7-c.js";
//#region node_modules/astro/dist/runtime/client/dev-toolbar/apps/xray.js
var xray_default = {
id: "astro:xray",
name: "Inspect",
icon: "",
init(canvas, eventTarget) {
let islandsOverlays = [];
addIslandsOverlay();
document.addEventListener("astro:after-swap", addIslandsOverlay);
document.addEventListener("astro:page-load", refreshIslandsOverlayPositions);
closeOnOutsideClick(eventTarget);
synchronizePlacementOnUpdate(eventTarget, canvas);
function addIslandsOverlay() {
islandsOverlays.forEach(({ highlightElement }) => {
highlightElement.remove();
});
islandsOverlays = [];
const islands = document.querySelectorAll("astro-island");
if (islands.length === 0) {
const window2 = createWindowElement(`
It looks like there are no interactive component islands on this page. Did you forget to add a client directive to your interactive UI component?
`); canvas.append(window2); return; } islands.forEach((island) => { const computedStyle = window.getComputedStyle(island); const islandElement = island.children[0] || island; if (islandElement.offsetParent === null || computedStyle.display === "none") return; const highlight = createHighlight(islandElement.getBoundingClientRect()); const tooltip = buildIslandTooltip(island); const { isFixed } = getElementsPositionInDocument(islandElement); if (isFixed) tooltip.style.position = highlight.style.position = "fixed"; attachTooltipToHighlight(highlight, tooltip, islandElement); canvas.append(highlight); islandsOverlays.push({ highlightElement: highlight, island: islandElement }); }); ["scroll", "resize"].forEach((event) => { window.addEventListener(event, refreshIslandsOverlayPositions); }); } function refreshIslandsOverlayPositions() { islandsOverlays.forEach(({ highlightElement, island: islandElement }) => { positionHighlight(highlightElement, islandElement.getBoundingClientRect()); }); } function buildIslandTooltip(island) { const tooltip = document.createElement("astro-dev-toolbar-tooltip"); tooltip.sections = []; const islandProps = island.getAttribute("props") ? JSON.parse(island.getAttribute("props")) : {}; const islandClientDirective = island.getAttribute("client"); if (islandClientDirective) tooltip.sections.push({ title: "Client directive", inlineTitle: `client:${islandClientDirective}`
});
const islandPropsEntries = Object.entries(islandProps).filter((prop) => !prop[0].startsWith("data-astro-cid-"));
if (islandPropsEntries.length > 0) {
const stringifiedProps = JSON.stringify(Object.fromEntries(islandPropsEntries.map((prop) => [prop[0], prop[1][1]])), void 0, 2);
tooltip.sections.push({
title: "Props",
content: `${escape(stringifiedProps)}`
});
}
const islandComponentPath = island.getAttribute("component-url");
if (islandComponentPath) tooltip.sections.push({
content: islandComponentPath,
clickDescription: "Click to go to file",
async clickAction() {
await fetch("/__open-in-editor?file=" + encodeURIComponent(window.__astro_dev_toolbar__.root + islandComponentPath.slice(1)));
}
});
return tooltip;
}
}
};
//#endregion
export { xray_default as default };