import { jsx, jsxs } from "react/jsx-runtime";
import { c } from "react-compiler-runtime";
import { useEffect, useState, Children, useRef } from "react";
import { GraphiQLProvider, pick, useGraphiQL, useStorage, useThemeStore, useDragResize, cn, Dialog, VisuallyHidden, ButtonGroup, Button, ChevronUpIcon, ChevronDownIcon, UnStyledButton, Tab, Tooltip, KEY_MAP, ReloadIcon, KeyboardShortcutIcon, SettingsIcon, QueryEditor, ExecuteButton, VariableEditor, HeaderEditor, Tabs, PlusIcon, Spinner, ResponseEditor } from "@graphiql/react";
import { HISTORY_PLUGIN, HistoryStore } from "@graphiql/plugin-history";
import { DOC_EXPLORER_PLUGIN, DocExplorerStore } from "@graphiql/plugin-doc-explorer";
import { GraphiQLFooter } from "./ui/footer.js";
import { GraphiQLToolbar } from "./ui/toolbar.js";
import { GraphiQLLogo } from "./ui/logo.js";
import { ShortKeys } from "./ui/short-keys.js";
const GraphiQL_ = (t0) => {
  var _a, _b;
  const $ = c(45);
  let children;
  let className;
  let confirmCloseTab;
  let defaultEditorToolsVisibility;
  let forcedTheme;
  let isHeadersEditorEnabled;
  let maxHistoryLength;
  let onEditHeaders;
  let onEditQuery;
  let onEditVariables;
  let props;
  let readOnly;
  let responseTooltip;
  let showPersistHeadersSettings;
  let t1;
  let t2;
  if ($[0] !== t0) {
    ({
      maxHistoryLength,
      plugins: t1,
      referencePlugin: t2,
      readOnly,
      onEditQuery,
      onEditVariables,
      onEditHeaders,
      responseTooltip,
      defaultEditorToolsVisibility,
      isHeadersEditorEnabled,
      showPersistHeadersSettings,
      forcedTheme,
      confirmCloseTab,
      className,
      children,
      ...props
    } = t0);
    $[0] = t0;
    $[1] = children;
    $[2] = className;
    $[3] = confirmCloseTab;
    $[4] = defaultEditorToolsVisibility;
    $[5] = forcedTheme;
    $[6] = isHeadersEditorEnabled;
    $[7] = maxHistoryLength;
    $[8] = onEditHeaders;
    $[9] = onEditQuery;
    $[10] = onEditVariables;
    $[11] = props;
    $[12] = readOnly;
    $[13] = responseTooltip;
    $[14] = showPersistHeadersSettings;
    $[15] = t1;
    $[16] = t2;
  } else {
    children = $[1];
    className = $[2];
    confirmCloseTab = $[3];
    defaultEditorToolsVisibility = $[4];
    forcedTheme = $[5];
    isHeadersEditorEnabled = $[6];
    maxHistoryLength = $[7];
    onEditHeaders = $[8];
    onEditQuery = $[9];
    onEditVariables = $[10];
    props = $[11];
    readOnly = $[12];
    responseTooltip = $[13];
    showPersistHeadersSettings = $[14];
    t1 = $[15];
    t2 = $[16];
  }
  let t3;
  if ($[17] !== t1) {
    t3 = t1 === void 0 ? [HISTORY_PLUGIN] : t1;
    $[17] = t1;
    $[18] = t3;
  } else {
    t3 = $[18];
  }
  const plugins = t3;
  const referencePlugin = t2 === void 0 ? DOC_EXPLORER_PLUGIN : t2;
  if ((_a = props.toolbar) == null ? void 0 : _a.additionalContent) {
    throw new TypeError("`toolbar.additionalContent` was removed. Use render props on `GraphiQL.Toolbar` component instead.");
  }
  if ((_b = props.toolbar) == null ? void 0 : _b.additionalComponent) {
    throw new TypeError("`toolbar.additionalComponent` was removed. Use render props on `GraphiQL.Toolbar` component instead.");
  }
  if (props.keyMap) {
    throw new TypeError("`keyMap` was removed. To use Vim or Emacs keybindings in Monaco, you can use community plugins. Monaco Vim: https://github.com/brijeshb42/monaco-vim. Monaco Emacs: https://github.com/aioutecism/monaco-emacs");
  }
  const t4 = showPersistHeadersSettings ?? props.shouldPersistHeaders !== false;
  const t5 = forcedTheme && THEMES.includes(forcedTheme) ? forcedTheme : void 0;
  let t6;
  if ($[19] !== className || $[20] !== confirmCloseTab || $[21] !== defaultEditorToolsVisibility || $[22] !== isHeadersEditorEnabled || $[23] !== onEditHeaders || $[24] !== onEditQuery || $[25] !== onEditVariables || $[26] !== readOnly || $[27] !== responseTooltip || $[28] !== t4 || $[29] !== t5) {
    t6 = {
      showPersistHeadersSettings: t4,
      readOnly,
      onEditQuery,
      onEditVariables,
      onEditHeaders,
      responseTooltip,
      defaultEditorToolsVisibility,
      isHeadersEditorEnabled,
      forcedTheme: t5,
      confirmCloseTab,
      className
    };
    $[19] = className;
    $[20] = confirmCloseTab;
    $[21] = defaultEditorToolsVisibility;
    $[22] = isHeadersEditorEnabled;
    $[23] = onEditHeaders;
    $[24] = onEditQuery;
    $[25] = onEditVariables;
    $[26] = readOnly;
    $[27] = responseTooltip;
    $[28] = t4;
    $[29] = t5;
    $[30] = t6;
  } else {
    t6 = $[30];
  }
  const interfaceProps = t6;
  let t7;
  if ($[31] !== plugins || $[32] !== referencePlugin) {
    t7 = [referencePlugin, ...plugins];
    $[31] = plugins;
    $[32] = referencePlugin;
    $[33] = t7;
  } else {
    t7 = $[33];
  }
  let t8;
  if ($[34] !== children || $[35] !== interfaceProps) {
    t8 = /* @__PURE__ */ jsx(DocExplorerStore, { children: /* @__PURE__ */ jsx(GraphiQLInterface, { ...interfaceProps, children }) });
    $[34] = children;
    $[35] = interfaceProps;
    $[36] = t8;
  } else {
    t8 = $[36];
  }
  let t9;
  if ($[37] !== maxHistoryLength || $[38] !== t8) {
    t9 = /* @__PURE__ */ jsx(HistoryStore, { maxHistoryLength, children: t8 });
    $[37] = maxHistoryLength;
    $[38] = t8;
    $[39] = t9;
  } else {
    t9 = $[39];
  }
  let t10;
  if ($[40] !== props || $[41] !== referencePlugin || $[42] !== t7 || $[43] !== t9) {
    t10 = /* @__PURE__ */ jsx(GraphiQLProvider, { plugins: t7, referencePlugin, ...props, children: t9 });
    $[40] = props;
    $[41] = referencePlugin;
    $[42] = t7;
    $[43] = t9;
    $[44] = t10;
  } else {
    t10 = $[44];
  }
  return t10;
};
const THEMES = ["light", "dark", "system"];
const TAB_CLASS_PREFIX = "graphiql-session-tab-";
const LABEL = {
  refetchSchema: `Re-fetch GraphQL schema (${KEY_MAP.refetchSchema.key})`,
  shortCutDialog: "Open short keys dialog",
  settingsDialogs: "Open settings dialog",
  newTab: "New tab"
};
const GraphiQLInterface = (t0) => {
  const $ = c(214);
  const {
    forcedTheme,
    isHeadersEditorEnabled: t1,
    defaultEditorToolsVisibility,
    children: $children,
    confirmCloseTab,
    className,
    onEditQuery,
    readOnly,
    onEditVariables,
    onEditHeaders,
    responseTooltip,
    showPersistHeadersSettings
  } = t0;
  const isHeadersEditorEnabled = t1 === void 0 ? true : t1;
  let t2;
  if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
    t2 = pick("initialVariables", "initialHeaders", "setShouldPersistHeaders", "addTab", "moveTab", "closeTab", "changeTab", "shouldPersistHeaders", "tabs", "activeTabIndex", "isFetching", "isIntrospecting", "introspect", "visiblePlugin", "setVisiblePlugin", "plugins");
    $[0] = t2;
  } else {
    t2 = $[0];
  }
  const {
    initialVariables,
    initialHeaders,
    setShouldPersistHeaders,
    addTab,
    moveTab,
    closeTab,
    changeTab,
    shouldPersistHeaders,
    tabs,
    activeTabIndex,
    isFetching,
    isIntrospecting,
    introspect,
    visiblePlugin,
    setVisiblePlugin,
    plugins
  } = useGraphiQL(t2);
  const storageContext = useStorage();
  const {
    theme,
    setTheme
  } = useThemeStore();
  let t3;
  let t4;
  if ($[1] !== forcedTheme || $[2] !== setTheme) {
    t3 = () => {
      if (forcedTheme === "system") {
        setTheme(null);
      } else {
        if (forcedTheme === "light" || forcedTheme === "dark") {
          setTheme(forcedTheme);
        }
      }
    };
    t4 = [forcedTheme, setTheme];
    $[1] = forcedTheme;
    $[2] = setTheme;
    $[3] = t3;
    $[4] = t4;
  } else {
    t3 = $[3];
    t4 = $[4];
  }
  useEffect(t3, t4);
  const PluginContent = visiblePlugin == null ? void 0 : visiblePlugin.content;
  const t5 = visiblePlugin ? void 0 : "first";
  let t6;
  if ($[5] !== setVisiblePlugin || $[6] !== t5) {
    t6 = {
      defaultSizeRelation: 0.3333333333333333,
      direction: "horizontal",
      initiallyHidden: t5,
      onHiddenElementChange(resizableElement) {
        if (resizableElement === "first") {
          setVisiblePlugin(null);
        }
      },
      sizeThresholdSecond: 200,
      storageKey: "docExplorerFlex"
    };
    $[5] = setVisiblePlugin;
    $[6] = t5;
    $[7] = t6;
  } else {
    t6 = $[7];
  }
  const pluginResize = useDragResize(t6);
  let t7;
  if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
    t7 = {
      direction: "horizontal",
      storageKey: "editorFlex"
    };
    $[8] = t7;
  } else {
    t7 = $[8];
  }
  const editorResize = useDragResize(t7);
  let t8;
  if ($[9] !== initialHeaders || $[10] !== initialVariables) {
    t8 = (d) => {
      if (d === "variables" || d === "headers") {
        return;
      }
      if (typeof d === "boolean") {
        return d ? void 0 : "second";
      }
      return initialVariables || initialHeaders ? void 0 : "second";
    };
    $[9] = initialHeaders;
    $[10] = initialVariables;
    $[11] = t8;
  } else {
    t8 = $[11];
  }
  let t9;
  if ($[12] !== defaultEditorToolsVisibility || $[13] !== t8) {
    t9 = t8(defaultEditorToolsVisibility);
    $[12] = defaultEditorToolsVisibility;
    $[13] = t8;
    $[14] = t9;
  } else {
    t9 = $[14];
  }
  let t10;
  if ($[15] !== t9) {
    t10 = {
      defaultSizeRelation: 3,
      direction: "vertical",
      initiallyHidden: t9,
      sizeThresholdSecond: 60,
      storageKey: "secondaryEditorFlex"
    };
    $[15] = t9;
    $[16] = t10;
  } else {
    t10 = $[16];
  }
  const editorToolsResize = useDragResize(t10);
  let t11;
  if ($[17] !== defaultEditorToolsVisibility || $[18] !== initialHeaders || $[19] !== initialVariables || $[20] !== isHeadersEditorEnabled) {
    t11 = () => {
      if (defaultEditorToolsVisibility === "variables" || defaultEditorToolsVisibility === "headers") {
        return defaultEditorToolsVisibility;
      }
      return !initialVariables && initialHeaders && isHeadersEditorEnabled ? "headers" : "variables";
    };
    $[17] = defaultEditorToolsVisibility;
    $[18] = initialHeaders;
    $[19] = initialVariables;
    $[20] = isHeadersEditorEnabled;
    $[21] = t11;
  } else {
    t11 = $[21];
  }
  const [activeSecondaryEditor, setActiveSecondaryEditor] = useState(t11);
  const [showDialog, setShowDialog] = useState(null);
  const [clearStorageStatus, setClearStorageStatus] = useState();
  let t12;
  if ($[22] !== $children) {
    let t132;
    let t142;
    if ($[24] === Symbol.for("react.memo_cache_sentinel")) {
      t132 = /* @__PURE__ */ jsx(GraphiQL.Logo, {});
      t142 = /* @__PURE__ */ jsx(GraphiQL.Toolbar, {});
      $[24] = t132;
      $[25] = t142;
    } else {
      t132 = $[24];
      t142 = $[25];
    }
    t12 = Children.toArray($children).reduce(_temp, {
      logo: t132,
      toolbar: t142,
      children: []
    });
    $[22] = $children;
    $[23] = t12;
  } else {
    t12 = $[23];
  }
  const {
    logo,
    toolbar,
    footer,
    children
  } = t12;
  let t13;
  if ($[26] !== pluginResize) {
    t13 = function onClickReference2() {
      if (pluginResize.hiddenElement === "first") {
        pluginResize.setHiddenElement(null);
      }
    };
    $[26] = pluginResize;
    $[27] = t13;
  } else {
    t13 = $[27];
  }
  const onClickReference = t13;
  let t14;
  if ($[28] !== storageContext) {
    t14 = function handleClearData2() {
      try {
        storageContext.clear();
        setClearStorageStatus("success");
      } catch {
        setClearStorageStatus("error");
      }
    };
    $[28] = storageContext;
    $[29] = t14;
  } else {
    t14 = $[29];
  }
  const handleClearData = t14;
  let t15;
  if ($[30] !== setShouldPersistHeaders) {
    t15 = (event) => {
      setShouldPersistHeaders(event.currentTarget.dataset.value === "true");
    };
    $[30] = setShouldPersistHeaders;
    $[31] = t15;
  } else {
    t15 = $[31];
  }
  const handlePersistHeaders = t15;
  let t16;
  if ($[32] !== setTheme) {
    t16 = (event_0) => {
      const selectedTheme = event_0.currentTarget.dataset.theme;
      setTheme(selectedTheme || null);
    };
    $[32] = setTheme;
    $[33] = t16;
  } else {
    t16 = $[33];
  }
  const handleChangeTheme = t16;
  let t17;
  if ($[34] === Symbol.for("react.memo_cache_sentinel")) {
    t17 = (event_1) => {
      setShowDialog(event_1.currentTarget.dataset.value);
    };
    $[34] = t17;
  } else {
    t17 = $[34];
  }
  const handleShowDialog = t17;
  let t18;
  if ($[35] !== pluginResize || $[36] !== plugins || $[37] !== setVisiblePlugin || $[38] !== visiblePlugin) {
    t18 = (event_2) => {
      const pluginIndex = Number(event_2.currentTarget.dataset.index);
      const plugin = plugins.find((_, index) => pluginIndex === index);
      const isVisible = plugin === visiblePlugin;
      if (isVisible) {
        setVisiblePlugin(null);
        pluginResize.setHiddenElement("first");
      } else {
        setVisiblePlugin(plugin);
        pluginResize.setHiddenElement(null);
      }
    };
    $[35] = pluginResize;
    $[36] = plugins;
    $[37] = setVisiblePlugin;
    $[38] = visiblePlugin;
    $[39] = t18;
  } else {
    t18 = $[39];
  }
  const handlePluginClick = t18;
  let t19;
  if ($[40] !== editorToolsResize) {
    t19 = (event_3) => {
      if (editorToolsResize.hiddenElement === "second") {
        editorToolsResize.setHiddenElement(null);
      }
      const tabName = event_3.currentTarget.dataset.name;
      setActiveSecondaryEditor(tabName);
    };
    $[40] = editorToolsResize;
    $[41] = t19;
  } else {
    t19 = $[41];
  }
  const handleToolsTabClick = t19;
  let t20;
  if ($[42] !== editorToolsResize) {
    t20 = () => {
      editorToolsResize.setHiddenElement(editorToolsResize.hiddenElement === "second" ? null : "second");
    };
    $[42] = editorToolsResize;
    $[43] = t20;
  } else {
    t20 = $[43];
  }
  const toggleEditorTools = t20;
  let t21;
  if ($[44] === Symbol.for("react.memo_cache_sentinel")) {
    t21 = function handleOpenShortKeysDialog2(isOpen) {
      if (!isOpen) {
        setShowDialog(null);
      }
    };
    $[44] = t21;
  } else {
    t21 = $[44];
  }
  const handleOpenShortKeysDialog = t21;
  let t22;
  if ($[45] === Symbol.for("react.memo_cache_sentinel")) {
    t22 = function handleOpenSettingsDialog2(isOpen_0) {
      if (!isOpen_0) {
        setShowDialog(null);
        setClearStorageStatus(void 0);
      }
    };
    $[45] = t22;
  } else {
    t22 = $[45];
  }
  const handleOpenSettingsDialog = t22;
  let t23;
  if ($[46] !== closeTab || $[47] !== confirmCloseTab) {
    t23 = async (event_4) => {
      const tabButton = event_4.currentTarget.previousSibling;
      const index_0 = Number(tabButton.id.replace(TAB_CLASS_PREFIX, ""));
      const shouldCloseTab = confirmCloseTab ? await confirmCloseTab(index_0) : true;
      if (!shouldCloseTab) {
        return;
      }
      closeTab(index_0);
    };
    $[46] = closeTab;
    $[47] = confirmCloseTab;
    $[48] = t23;
  } else {
    t23 = $[48];
  }
  const handleTabClose = t23;
  let t24;
  if ($[49] !== changeTab) {
    t24 = (event_5) => {
      const index_1 = Number(event_5.currentTarget.id.replace(TAB_CLASS_PREFIX, ""));
      changeTab(index_1);
    };
    $[49] = changeTab;
    $[50] = t24;
  } else {
    t24 = $[50];
  }
  const handleTabClick = t24;
  let t25;
  if ($[51] !== handlePluginClick || $[52] !== plugins || $[53] !== visiblePlugin) {
    let t262;
    if ($[55] !== handlePluginClick || $[56] !== visiblePlugin) {
      t262 = (plugin_0, index_2) => {
        const isVisible_0 = plugin_0 === visiblePlugin;
        const label = `${isVisible_0 ? "Hide" : "Show"} ${plugin_0.title}`;
        return /* @__PURE__ */ jsx(Tooltip, { label, children: /* @__PURE__ */ jsx(UnStyledButton, { type: "button", className: cn(isVisible_0 && "active"), onClick: handlePluginClick, "data-index": index_2, "aria-label": label, children: /* @__PURE__ */ jsx(plugin_0.icon, { "aria-hidden": "true" }) }) }, plugin_0.title);
      };
      $[55] = handlePluginClick;
      $[56] = visiblePlugin;
      $[57] = t262;
    } else {
      t262 = $[57];
    }
    t25 = plugins.map(t262);
    $[51] = handlePluginClick;
    $[52] = plugins;
    $[53] = visiblePlugin;
    $[54] = t25;
  } else {
    t25 = $[54];
  }
  let t26;
  if ($[58] === Symbol.for("react.memo_cache_sentinel")) {
    t26 = {
      marginTop: "auto"
    };
    $[58] = t26;
  } else {
    t26 = $[58];
  }
  const t27 = isIntrospecting && "graphiql-spin";
  let t28;
  if ($[59] !== t27) {
    t28 = cn(t27);
    $[59] = t27;
    $[60] = t28;
  } else {
    t28 = $[60];
  }
  let t29;
  if ($[61] !== t28) {
    t29 = /* @__PURE__ */ jsx(ReloadIcon, { className: t28, "aria-hidden": "true" });
    $[61] = t28;
    $[62] = t29;
  } else {
    t29 = $[62];
  }
  let t30;
  if ($[63] !== introspect || $[64] !== isIntrospecting || $[65] !== t29) {
    t30 = /* @__PURE__ */ jsx(Tooltip, { label: LABEL.refetchSchema, children: /* @__PURE__ */ jsx(UnStyledButton, { type: "button", disabled: isIntrospecting, onClick: introspect, "aria-label": LABEL.refetchSchema, style: t26, children: t29 }) });
    $[63] = introspect;
    $[64] = isIntrospecting;
    $[65] = t29;
    $[66] = t30;
  } else {
    t30 = $[66];
  }
  let t31;
  if ($[67] === Symbol.for("react.memo_cache_sentinel")) {
    t31 = /* @__PURE__ */ jsx(Tooltip, { label: LABEL.shortCutDialog, children: /* @__PURE__ */ jsx(UnStyledButton, { type: "button", "data-value": "short-keys", onClick: handleShowDialog, "aria-label": LABEL.shortCutDialog, children: /* @__PURE__ */ jsx(KeyboardShortcutIcon, { "aria-hidden": "true" }) }) });
    $[67] = t31;
  } else {
    t31 = $[67];
  }
  let t32;
  if ($[68] === Symbol.for("react.memo_cache_sentinel")) {
    t32 = /* @__PURE__ */ jsx(Tooltip, { label: LABEL.settingsDialogs, children: /* @__PURE__ */ jsx(UnStyledButton, { type: "button", "data-value": "settings", onClick: handleShowDialog, "aria-label": LABEL.settingsDialogs, children: /* @__PURE__ */ jsx(SettingsIcon, { "aria-hidden": "true" }) }) });
    $[68] = t32;
  } else {
    t32 = $[68];
  }
  const t33 = showDialog === "short-keys";
  let t34;
  if ($[69] === Symbol.for("react.memo_cache_sentinel")) {
    t34 = /* @__PURE__ */ jsx(Dialog.Title, { className: "graphiql-dialog-title", children: "Short Keys" });
    $[69] = t34;
  } else {
    t34 = $[69];
  }
  let t35;
  if ($[70] === Symbol.for("react.memo_cache_sentinel")) {
    t35 = /* @__PURE__ */ jsxs("div", { className: "graphiql-dialog-header", children: [
      t34,
      /* @__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, {})
    ] });
    $[70] = t35;
  } else {
    t35 = $[70];
  }
  let t36;
  if ($[71] === Symbol.for("react.memo_cache_sentinel")) {
    t36 = /* @__PURE__ */ jsx("div", { className: "graphiql-dialog-section", children: /* @__PURE__ */ jsx(ShortKeys, {}) });
    $[71] = t36;
  } else {
    t36 = $[71];
  }
  let t37;
  if ($[72] !== t33) {
    t37 = /* @__PURE__ */ jsxs(Dialog, { open: t33, onOpenChange: handleOpenShortKeysDialog, children: [
      t35,
      t36
    ] });
    $[72] = t33;
    $[73] = t37;
  } else {
    t37 = $[73];
  }
  const t38 = showDialog === "settings";
  let t39;
  if ($[74] === Symbol.for("react.memo_cache_sentinel")) {
    t39 = /* @__PURE__ */ jsx(Dialog.Title, { className: "graphiql-dialog-title", children: "Settings" });
    $[74] = t39;
  } else {
    t39 = $[74];
  }
  let t40;
  if ($[75] === Symbol.for("react.memo_cache_sentinel")) {
    t40 = /* @__PURE__ */ jsxs("div", { className: "graphiql-dialog-header", children: [
      t39,
      /* @__PURE__ */ jsx(VisuallyHidden, { children: /* @__PURE__ */ jsx(Dialog.Description, { children: "This modal lets you adjust header persistence, interface theme, and clear local storage." }) }),
      /* @__PURE__ */ jsx(Dialog.Close, {})
    ] });
    $[75] = t40;
  } else {
    t40 = $[75];
  }
  let t41;
  if ($[76] !== handlePersistHeaders || $[77] !== shouldPersistHeaders || $[78] !== showPersistHeadersSettings) {
    t41 = showPersistHeadersSettings ? /* @__PURE__ */ jsxs("div", { className: "graphiql-dialog-section", children: [
      /* @__PURE__ */ jsxs("div", { children: [
        /* @__PURE__ */ jsx("div", { className: "graphiql-dialog-section-title", children: "Persist headers" }),
        /* @__PURE__ */ jsxs("div", { className: "graphiql-dialog-section-caption", children: [
          "Save headers upon reloading.",
          " ",
          /* @__PURE__ */ jsx("span", { className: "graphiql-warning-text", children: "Only enable if you trust this device." })
        ] })
      ] }),
      /* @__PURE__ */ jsxs(ButtonGroup, { children: [
        /* @__PURE__ */ jsx(Button, { type: "button", id: "enable-persist-headers", className: cn(shouldPersistHeaders && "active"), "data-value": "true", onClick: handlePersistHeaders, children: "On" }),
        /* @__PURE__ */ jsx(Button, { type: "button", id: "disable-persist-headers", className: cn(!shouldPersistHeaders && "active"), onClick: handlePersistHeaders, children: "Off" })
      ] })
    ] }) : null;
    $[76] = handlePersistHeaders;
    $[77] = shouldPersistHeaders;
    $[78] = showPersistHeadersSettings;
    $[79] = t41;
  } else {
    t41 = $[79];
  }
  let t42;
  if ($[80] !== forcedTheme || $[81] !== handleChangeTheme || $[82] !== theme) {
    t42 = !forcedTheme && /* @__PURE__ */ jsxs("div", { className: "graphiql-dialog-section", children: [
      /* @__PURE__ */ jsxs("div", { children: [
        /* @__PURE__ */ jsx("div", { className: "graphiql-dialog-section-title", children: "Theme" }),
        /* @__PURE__ */ jsx("div", { className: "graphiql-dialog-section-caption", children: "Adjust how the interface appears." })
      ] }),
      /* @__PURE__ */ jsxs(ButtonGroup, { children: [
        /* @__PURE__ */ jsx(Button, { type: "button", className: cn(theme === null && "active"), onClick: handleChangeTheme, children: "System" }),
        /* @__PURE__ */ jsx(Button, { type: "button", className: cn(theme === "light" && "active"), "data-theme": "light", onClick: handleChangeTheme, children: "Light" }),
        /* @__PURE__ */ jsx(Button, { type: "button", className: cn(theme === "dark" && "active"), "data-theme": "dark", onClick: handleChangeTheme, children: "Dark" })
      ] })
    ] });
    $[80] = forcedTheme;
    $[81] = handleChangeTheme;
    $[82] = theme;
    $[83] = t42;
  } else {
    t42 = $[83];
  }
  let t43;
  if ($[84] === Symbol.for("react.memo_cache_sentinel")) {
    t43 = /* @__PURE__ */ jsxs("div", { children: [
      /* @__PURE__ */ jsx("div", { className: "graphiql-dialog-section-title", children: "Clear storage" }),
      /* @__PURE__ */ jsx("div", { className: "graphiql-dialog-section-caption", children: "Remove all locally stored data and start fresh." })
    ] });
    $[84] = t43;
  } else {
    t43 = $[84];
  }
  const t44 = clearStorageStatus === "success";
  let t45;
  if ($[85] !== clearStorageStatus) {
    t45 = {
      success: "Cleared data",
      error: "Failed"
    }[clearStorageStatus] || "Clear data";
    $[85] = clearStorageStatus;
    $[86] = t45;
  } else {
    t45 = $[86];
  }
  let t46;
  if ($[87] !== clearStorageStatus || $[88] !== handleClearData || $[89] !== t44 || $[90] !== t45) {
    t46 = /* @__PURE__ */ jsxs("div", { className: "graphiql-dialog-section", children: [
      t43,
      /* @__PURE__ */ jsx(Button, { type: "button", state: clearStorageStatus, disabled: t44, onClick: handleClearData, children: t45 })
    ] });
    $[87] = clearStorageStatus;
    $[88] = handleClearData;
    $[89] = t44;
    $[90] = t45;
    $[91] = t46;
  } else {
    t46 = $[91];
  }
  let t47;
  if ($[92] !== t38 || $[93] !== t41 || $[94] !== t42 || $[95] !== t46) {
    t47 = /* @__PURE__ */ jsxs(Dialog, { open: t38, onOpenChange: handleOpenSettingsDialog, children: [
      t40,
      t41,
      t42,
      t46
    ] });
    $[92] = t38;
    $[93] = t41;
    $[94] = t42;
    $[95] = t46;
    $[96] = t47;
  } else {
    t47 = $[96];
  }
  let t48;
  if ($[97] !== t25 || $[98] !== t30 || $[99] !== t37 || $[100] !== t47) {
    t48 = /* @__PURE__ */ jsxs("div", { className: "graphiql-sidebar", children: [
      t25,
      t30,
      t31,
      t32,
      t37,
      t47
    ] });
    $[97] = t25;
    $[98] = t30;
    $[99] = t37;
    $[100] = t47;
    $[101] = t48;
  } else {
    t48 = $[101];
  }
  const sidebar = t48;
  const editorToolsText = `${editorToolsResize.hiddenElement === "second" ? "Show" : "Hide"} editor tools`;
  const EditorToolsIcon = editorToolsResize.hiddenElement === "second" ? ChevronUpIcon : ChevronDownIcon;
  const t49 = editorResize.firstRef;
  let t50;
  if ($[102] !== onClickReference || $[103] !== onEditQuery || $[104] !== readOnly) {
    t50 = /* @__PURE__ */ jsx(QueryEditor, { onClickReference, onEdit: onEditQuery, readOnly });
    $[102] = onClickReference;
    $[103] = onEditQuery;
    $[104] = readOnly;
    $[105] = t50;
  } else {
    t50 = $[105];
  }
  let t51;
  if ($[106] === Symbol.for("react.memo_cache_sentinel")) {
    t51 = /* @__PURE__ */ jsx(ExecuteButton, {});
    $[106] = t51;
  } else {
    t51 = $[106];
  }
  let t52;
  if ($[107] !== toolbar) {
    t52 = /* @__PURE__ */ jsxs("div", { className: "graphiql-toolbar", role: "toolbar", "aria-label": "Editor Commands", children: [
      t51,
      toolbar
    ] });
    $[107] = toolbar;
    $[108] = t52;
  } else {
    t52 = $[108];
  }
  let t53;
  if ($[109] !== editorToolsResize.firstRef || $[110] !== t50 || $[111] !== t52) {
    t53 = /* @__PURE__ */ jsxs("section", { className: "graphiql-query-editor", "aria-label": "Query Editor", ref: editorToolsResize.firstRef, children: [
      t50,
      t52
    ] });
    $[109] = editorToolsResize.firstRef;
    $[110] = t50;
    $[111] = t52;
    $[112] = t53;
  } else {
    t53 = $[112];
  }
  const t54 = editorToolsResize.dragBarRef;
  const t55 = activeSecondaryEditor === "variables" && editorToolsResize.hiddenElement !== "second" && "active";
  let t56;
  if ($[113] !== t55) {
    t56 = cn(t55);
    $[113] = t55;
    $[114] = t56;
  } else {
    t56 = $[114];
  }
  let t57;
  if ($[115] !== handleToolsTabClick || $[116] !== t56) {
    t57 = /* @__PURE__ */ jsx(UnStyledButton, { type: "button", className: t56, onClick: handleToolsTabClick, "data-name": "variables", children: "Variables" });
    $[115] = handleToolsTabClick;
    $[116] = t56;
    $[117] = t57;
  } else {
    t57 = $[117];
  }
  let t58;
  if ($[118] !== activeSecondaryEditor || $[119] !== editorToolsResize.hiddenElement || $[120] !== handleToolsTabClick || $[121] !== isHeadersEditorEnabled) {
    t58 = isHeadersEditorEnabled && /* @__PURE__ */ jsx(UnStyledButton, { type: "button", className: cn(activeSecondaryEditor === "headers" && editorToolsResize.hiddenElement !== "second" && "active"), onClick: handleToolsTabClick, "data-name": "headers", children: "Headers" });
    $[118] = activeSecondaryEditor;
    $[119] = editorToolsResize.hiddenElement;
    $[120] = handleToolsTabClick;
    $[121] = isHeadersEditorEnabled;
    $[122] = t58;
  } else {
    t58 = $[122];
  }
  let t59;
  if ($[123] !== EditorToolsIcon) {
    t59 = /* @__PURE__ */ jsx(EditorToolsIcon, { className: "graphiql-chevron-icon", "aria-hidden": "true" });
    $[123] = EditorToolsIcon;
    $[124] = t59;
  } else {
    t59 = $[124];
  }
  let t60;
  if ($[125] !== editorToolsText || $[126] !== t59 || $[127] !== toggleEditorTools) {
    t60 = /* @__PURE__ */ jsx(UnStyledButton, { type: "button", onClick: toggleEditorTools, "aria-label": editorToolsText, className: "graphiql-toggle-editor-tools", children: t59 });
    $[125] = editorToolsText;
    $[126] = t59;
    $[127] = toggleEditorTools;
    $[128] = t60;
  } else {
    t60 = $[128];
  }
  let t61;
  if ($[129] !== editorToolsText || $[130] !== t60) {
    t61 = /* @__PURE__ */ jsx(Tooltip, { label: editorToolsText, children: t60 });
    $[129] = editorToolsText;
    $[130] = t60;
    $[131] = t61;
  } else {
    t61 = $[131];
  }
  let t62;
  if ($[132] !== editorToolsResize.dragBarRef || $[133] !== t57 || $[134] !== t58 || $[135] !== t61) {
    t62 = /* @__PURE__ */ jsxs("div", { ref: t54, className: "graphiql-editor-tools", children: [
      t57,
      t58,
      t61
    ] });
    $[132] = editorToolsResize.dragBarRef;
    $[133] = t57;
    $[134] = t58;
    $[135] = t61;
    $[136] = t62;
  } else {
    t62 = $[136];
  }
  const t63 = activeSecondaryEditor === "variables" ? "Variables" : "Headers";
  const t64 = activeSecondaryEditor === "variables" ? "" : "hidden";
  let t65;
  if ($[137] !== onEditVariables || $[138] !== readOnly || $[139] !== t64) {
    t65 = /* @__PURE__ */ jsx(VariableEditor, { className: t64, onEdit: onEditVariables, readOnly });
    $[137] = onEditVariables;
    $[138] = readOnly;
    $[139] = t64;
    $[140] = t65;
  } else {
    t65 = $[140];
  }
  let t66;
  if ($[141] !== activeSecondaryEditor || $[142] !== isHeadersEditorEnabled || $[143] !== onEditHeaders || $[144] !== readOnly) {
    t66 = isHeadersEditorEnabled && /* @__PURE__ */ jsx(HeaderEditor, { className: activeSecondaryEditor === "headers" ? "" : "hidden", onEdit: onEditHeaders, readOnly });
    $[141] = activeSecondaryEditor;
    $[142] = isHeadersEditorEnabled;
    $[143] = onEditHeaders;
    $[144] = readOnly;
    $[145] = t66;
  } else {
    t66 = $[145];
  }
  let t67;
  if ($[146] !== editorToolsResize.secondRef || $[147] !== t63 || $[148] !== t65 || $[149] !== t66) {
    t67 = /* @__PURE__ */ jsxs("section", { className: "graphiql-editor-tool", "aria-label": t63, ref: editorToolsResize.secondRef, children: [
      t65,
      t66
    ] });
    $[146] = editorToolsResize.secondRef;
    $[147] = t63;
    $[148] = t65;
    $[149] = t66;
    $[150] = t67;
  } else {
    t67 = $[150];
  }
  let t68;
  if ($[151] !== editorResize.firstRef || $[152] !== t53 || $[153] !== t62 || $[154] !== t67) {
    t68 = /* @__PURE__ */ jsxs("div", { className: "graphiql-editors", ref: t49, children: [
      t53,
      t62,
      t67
    ] });
    $[151] = editorResize.firstRef;
    $[152] = t53;
    $[153] = t62;
    $[154] = t67;
    $[155] = t68;
  } else {
    t68 = $[155];
  }
  const editors = t68;
  const tabContainerRef = useRef(null);
  let t69;
  if ($[156] !== className) {
    t69 = cn("graphiql-container", className);
    $[156] = className;
    $[157] = t69;
  } else {
    t69 = $[157];
  }
  let t70;
  if ($[158] === Symbol.for("react.memo_cache_sentinel")) {
    t70 = {
      minWidth: "200px"
    };
    $[158] = t70;
  } else {
    t70 = $[158];
  }
  let t71;
  if ($[159] !== PluginContent) {
    t71 = PluginContent && /* @__PURE__ */ jsx(PluginContent, {});
    $[159] = PluginContent;
    $[160] = t71;
  } else {
    t71 = $[160];
  }
  let t72;
  if ($[161] !== pluginResize.firstRef || $[162] !== t71) {
    t72 = /* @__PURE__ */ jsx("div", { ref: pluginResize.firstRef, className: "graphiql-plugin", style: t70, children: t71 });
    $[161] = pluginResize.firstRef;
    $[162] = t71;
    $[163] = t72;
  } else {
    t72 = $[163];
  }
  let t73;
  if ($[164] !== pluginResize.dragBarRef || $[165] !== visiblePlugin) {
    t73 = visiblePlugin && /* @__PURE__ */ jsx("div", { className: "graphiql-horizontal-drag-bar", ref: pluginResize.dragBarRef });
    $[164] = pluginResize.dragBarRef;
    $[165] = visiblePlugin;
    $[166] = t73;
  } else {
    t73 = $[166];
  }
  const t74 = pluginResize.secondRef;
  let t75;
  if ($[167] !== activeTabIndex || $[168] !== handleTabClick || $[169] !== handleTabClose || $[170] !== tabs) {
    t75 = tabs.map((tab, index_3, arr) => /* @__PURE__ */ jsxs(Tab, { dragConstraints: tabContainerRef, value: tab, isActive: index_3 === activeTabIndex, children: [
      /* @__PURE__ */ jsx(Tab.Button, { "aria-controls": "graphiql-session", id: `graphiql-session-tab-${index_3}`, title: tab.title, onClick: handleTabClick, children: tab.title }),
      arr.length > 1 && /* @__PURE__ */ jsx(Tab.Close, { onClick: handleTabClose })
    ] }, tab.id));
    $[167] = activeTabIndex;
    $[168] = handleTabClick;
    $[169] = handleTabClose;
    $[170] = tabs;
    $[171] = t75;
  } else {
    t75 = $[171];
  }
  let t76;
  if ($[172] !== moveTab || $[173] !== t75 || $[174] !== tabs) {
    t76 = /* @__PURE__ */ jsx(Tabs, { ref: tabContainerRef, values: tabs, onReorder: moveTab, "aria-label": "Select active operation", className: "no-scrollbar", children: t75 });
    $[172] = moveTab;
    $[173] = t75;
    $[174] = tabs;
    $[175] = t76;
  } else {
    t76 = $[175];
  }
  let t77;
  if ($[176] === Symbol.for("react.memo_cache_sentinel")) {
    t77 = /* @__PURE__ */ jsx(PlusIcon, { "aria-hidden": "true" });
    $[176] = t77;
  } else {
    t77 = $[176];
  }
  let t78;
  if ($[177] !== addTab) {
    t78 = /* @__PURE__ */ jsx(Tooltip, { label: LABEL.newTab, children: /* @__PURE__ */ jsx(UnStyledButton, { type: "button", className: "graphiql-tab-add", onClick: addTab, "aria-label": LABEL.newTab, children: t77 }) });
    $[177] = addTab;
    $[178] = t78;
  } else {
    t78 = $[178];
  }
  let t79;
  if ($[179] !== logo || $[180] !== t76 || $[181] !== t78) {
    t79 = /* @__PURE__ */ jsxs("div", { className: "graphiql-session-header", children: [
      t76,
      t78,
      logo
    ] });
    $[179] = logo;
    $[180] = t76;
    $[181] = t78;
    $[182] = t79;
  } else {
    t79 = $[182];
  }
  const t80 = `${TAB_CLASS_PREFIX}${activeTabIndex}`;
  let t81;
  if ($[183] !== editorResize.dragBarRef) {
    t81 = /* @__PURE__ */ jsx("div", { className: "graphiql-horizontal-drag-bar", ref: editorResize.dragBarRef });
    $[183] = editorResize.dragBarRef;
    $[184] = t81;
  } else {
    t81 = $[184];
  }
  let t82;
  if ($[185] !== isFetching) {
    t82 = isFetching && /* @__PURE__ */ jsx(Spinner, {});
    $[185] = isFetching;
    $[186] = t82;
  } else {
    t82 = $[186];
  }
  let t83;
  if ($[187] !== responseTooltip) {
    t83 = /* @__PURE__ */ jsx(ResponseEditor, { responseTooltip });
    $[187] = responseTooltip;
    $[188] = t83;
  } else {
    t83 = $[188];
  }
  let t84;
  if ($[189] !== editorResize.secondRef || $[190] !== footer || $[191] !== t82 || $[192] !== t83) {
    t84 = /* @__PURE__ */ jsxs("div", { className: "graphiql-response", ref: editorResize.secondRef, children: [
      t82,
      t83,
      footer
    ] });
    $[189] = editorResize.secondRef;
    $[190] = footer;
    $[191] = t82;
    $[192] = t83;
    $[193] = t84;
  } else {
    t84 = $[193];
  }
  let t85;
  if ($[194] !== editors || $[195] !== t80 || $[196] !== t81 || $[197] !== t84) {
    t85 = /* @__PURE__ */ jsxs("div", { role: "tabpanel", id: "graphiql-session", "aria-labelledby": t80, children: [
      editors,
      t81,
      t84
    ] });
    $[194] = editors;
    $[195] = t80;
    $[196] = t81;
    $[197] = t84;
    $[198] = t85;
  } else {
    t85 = $[198];
  }
  let t86;
  if ($[199] !== pluginResize.secondRef || $[200] !== t79 || $[201] !== t85) {
    t86 = /* @__PURE__ */ jsxs("div", { ref: t74, className: "graphiql-sessions", children: [
      t79,
      t85
    ] });
    $[199] = pluginResize.secondRef;
    $[200] = t79;
    $[201] = t85;
    $[202] = t86;
  } else {
    t86 = $[202];
  }
  let t87;
  if ($[203] !== t72 || $[204] !== t73 || $[205] !== t86) {
    t87 = /* @__PURE__ */ jsxs("div", { className: "graphiql-main", children: [
      t72,
      t73,
      t86
    ] });
    $[203] = t72;
    $[204] = t73;
    $[205] = t86;
    $[206] = t87;
  } else {
    t87 = $[206];
  }
  let t88;
  if ($[207] !== sidebar || $[208] !== t69 || $[209] !== t87) {
    t88 = /* @__PURE__ */ jsxs("div", { className: t69, children: [
      sidebar,
      t87
    ] });
    $[207] = sidebar;
    $[208] = t69;
    $[209] = t87;
    $[210] = t88;
  } else {
    t88 = $[210];
  }
  let t89;
  if ($[211] !== children || $[212] !== t88) {
    t89 = /* @__PURE__ */ jsxs(Tooltip.Provider, { children: [
      t88,
      children
    ] });
    $[211] = children;
    $[212] = t88;
    $[213] = t89;
  } else {
    t89 = $[213];
  }
  return t89;
};
function getChildComponentType(child) {
  if (child && typeof child === "object" && "type" in child && typeof child.type === "function") {
    return child.type;
  }
}
const GraphiQL = Object.assign(GraphiQL_, {
  Logo: GraphiQLLogo,
  Toolbar: GraphiQLToolbar,
  Footer: GraphiQLFooter
});
function _temp(acc, curr) {
  bb72: switch (getChildComponentType(curr)) {
    case GraphiQL.Logo: {
      acc.logo = curr;
      break bb72;
    }
    case GraphiQL.Toolbar: {
      acc.toolbar = curr;
      break bb72;
    }
    case GraphiQL.Footer: {
      acc.footer = curr;
      break bb72;
    }
    default: {
      acc.children.push(curr);
    }
  }
  return acc;
}
export {
  GraphiQL
};
//# sourceMappingURL=GraphiQL.js.map
