graphiql/dist/ui/activity-bar.js

An graphical interactive in-browser GraphQL IDE.

import { ShortKeys } from "./short-keys.js";
import { c } from "react-compiler-runtime";
import { useEffect, useRef, useState } from "react";
import { ActivityRail, Dialog, SettingsDialog, VisuallyHidden, isMacOs } from "@graphiql/react";
import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
// src/ui/activity-bar.tsx
var ActivityBar = (t0) => {
	const $ = c(22);
	const { forcedTheme, showPersistHeadersSettings, setHiddenElement } = t0;
	const [showDialog, setShowDialog] = useState(null);
	const settingsButtonRef = useRef(null);
	let t1;
	let t2;
	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
		t1 = () => {
			const openSettings = function openSettings(event) {
				if ((isMacOs ? event.metaKey : event.ctrlKey) && event.key === ",") {
					event.preventDefault();
					setShowDialog(_temp);
				}
			};
			window.addEventListener("keydown", openSettings);
			return () => {
				window.removeEventListener("keydown", openSettings);
			};
		};
		t2 = [];
		$[0] = t1;
		$[1] = t2;
	} else {
		t1 = $[0];
		t2 = $[1];
	}
	useEffect(t1, t2);
	let t3;
	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
		t3 = function handleOpenSettingsDialog(isOpen) {
			if (!isOpen) setShowDialog(null);
		};
		$[2] = t3;
	} else t3 = $[2];
	const handleOpenSettingsDialog = t3;
	let t4;
	if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
		t4 = function handleOpenShortKeysDialog(isOpen_0) {
			if (!isOpen_0) setShowDialog(null);
		};
		$[3] = t4;
	} else t4 = $[3];
	const handleOpenShortKeysDialog = t4;
	let t5;
	if ($[4] !== setHiddenElement) {
		t5 = function handlePluginToggle(nextPlugin) {
			if (nextPlugin === null) setHiddenElement("first");
			else setHiddenElement(null);
		};
		$[4] = setHiddenElement;
		$[5] = t5;
	} else t5 = $[5];
	const handlePluginToggle = t5;
	let t6;
	if ($[6] === Symbol.for("react.memo_cache_sentinel")) {
		t6 = () => setShowDialog("settings");
		$[6] = t6;
	} else t6 = $[6];
	let t7;
	if ($[7] !== handlePluginToggle) {
		t7 = /* @__PURE__ */ jsx(ActivityRail, {
			onPluginToggle: handlePluginToggle,
			onSettingsClick: t6,
			settingsButtonRef
		});
		$[7] = handlePluginToggle;
		$[8] = t7;
	} else t7 = $[8];
	const t8 = showDialog === "short-keys";
	let t9;
	if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
		t9 = /* @__PURE__ */ jsx(Dialog.Title, {
			className: "graphiql-dialog-title",
			children: "Short Keys"
		});
		$[9] = t9;
	} else t9 = $[9];
	let t10;
	if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
		t10 = /* @__PURE__ */ jsxs("div", {
			className: "graphiql-dialog-header",
			children: [
				t9,
				/* @__PURE__ */ jsx(VisuallyHidden, { children: /* @__PURE__ */ jsx(Dialog.Description, { children: "This modal provides a list of available keyboard shortcuts and their functions." }) }),
				/* @__PURE__ */ jsx(Dialog.Close, {})
			]
		});
		$[10] = t10;
	} else t10 = $[10];
	let t11;
	if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
		t11 = /* @__PURE__ */ jsx("div", {
			className: "graphiql-dialog-section",
			children: /* @__PURE__ */ jsx(ShortKeys, {})
		});
		$[11] = t11;
	} else t11 = $[11];
	let t12;
	if ($[12] !== t8) {
		t12 = /* @__PURE__ */ jsxs(Dialog, {
			open: t8,
			onOpenChange: handleOpenShortKeysDialog,
			children: [t10, t11]
		});
		$[12] = t8;
		$[13] = t12;
	} else t12 = $[13];
	const t13 = showDialog === "settings";
	let t14;
	if ($[14] !== forcedTheme || $[15] !== showPersistHeadersSettings || $[16] !== t13) {
		t14 = /* @__PURE__ */ jsx(SettingsDialog, {
			open: t13,
			onOpenChange: handleOpenSettingsDialog,
			forcedTheme,
			showPersistHeadersSettings,
			restoreFocusRef: settingsButtonRef
		});
		$[14] = forcedTheme;
		$[15] = showPersistHeadersSettings;
		$[16] = t13;
		$[17] = t14;
	} else t14 = $[17];
	let t15;
	if ($[18] !== t12 || $[19] !== t14 || $[20] !== t7) {
		t15 = /* @__PURE__ */ jsxs(Fragment$1, { children: [
			t7,
			t12,
			t14
		] });
		$[18] = t12;
		$[19] = t14;
		$[20] = t7;
		$[21] = t15;
	} else t15 = $[21];
	return t15;
};
function _temp(prev) {
	return prev === "settings" ? null : "settings";
}
export { ActivityBar };

//# sourceMappingURL=activity-bar.js.map