@scalar/api-client 3.6.1 → 3.8.0

package/dist/v2/blocks/response-block/components/ResponseBodyRaw.vue.script.js

@@ -1,18 +1,22 @@
-import { createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, openBlock, ref, toRef, unref, useId } from "vue";
+import { prettifyJsoncString } from "../helpers/prettify-jsonc-string.js";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, openBlock, ref, toRef, unref, useId } from "vue";
 import { ScalarCodeBlockCopy } from "@scalar/components";
 import { useCodeMirror } from "@scalar/use-codemirror";
-import { prettyPrintJson } from "@scalar/helpers/json/pretty-print-json";
 //#region src/v2/blocks/response-block/components/ResponseBodyRaw.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = { class: "scalar-code-block group/code-block body-raw relative grid min-h-0 overflow-hidden p-px outline-none has-focus-visible:outline" };
+var _hoisted_1 = {
+	class: "scalar-code-block group/code-block relative grid min-h-0 overflow-hidden p-px outline-none has-focus-visible:outline",
+	"data-testid": "response-body-raw"
+};
 var _hoisted_2 = {
-	class: "body-raw-scroller custom-scroll relative pr-1",
+	class: "custom-scroll relative pr-1",
 	tabindex: "0"
 };
 var ResponseBodyRaw_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	__name: "ResponseBodyRaw",
 	props: {
 		content: {},
-		language: {}
+		language: {},
+		prettyPrintJson: { type: Boolean }
 	},
 	setup(__props) {
 		const props = __props;
@@ -23,7 +27,15 @@ var ResponseBodyRaw_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ *
 			codeMirrorRef,
 			readOnly: true,
 			lineNumbers: true,
-			content: toRef(() => prettyPrintJson(props.content)),
+			content: toRef(computed(() => {
+				const { content, language, prettyPrintJson = false } = props;
+				if (typeof content !== "string") {
+					if (content == null) return "";
+					return String(content);
+				}
+				if (prettyPrintJson && language === "json") return prettifyJsoncString(content);
+				return content;
+			})),
 			language: toRef(() => props.language),
 			forceFoldGutter: true
 		});
@@ -36,10 +48,10 @@ var ResponseBodyRaw_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ *
 				ref: codeMirrorRef
 			}, null, 512)]), getCurrentContent() ? (openBlock(), createBlock(unref(ScalarCodeBlockCopy), {
 				key: 0,
+				"aria-controls": unref(id),
 				class: "absolute top-2 right-2",
-				content: getCurrentContent(),
-				"aria-controls": unref(id)
-			}, null, 8, ["content", "aria-controls"])) : createCommentVNode("", true)]);
+				content: getCurrentContent()
+			}, null, 8, ["aria-controls", "content"])) : createCommentVNode("", true)]);
 		};
 	}
 });

package/dist/v2/blocks/response-block/components/ResponseBodyRaw.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ResponseBodyRaw.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/response-block/components/ResponseBodyRaw.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ScalarCodeBlockCopy } from '@scalar/components'\nimport { prettyPrintJson } from '@scalar/helpers/json/pretty-print-json'\nimport { useCodeMirror, type CodeMirrorLanguage } from '@scalar/use-codemirror'\nimport { ref, toRef, useId } from 'vue'\n\nconst props = defineProps<{\n  content: any\n  language: CodeMirrorLanguage | undefined\n}>()\n\nconst codeMirrorRef = ref<HTMLDivElement | null>(null)\n/** Base id for the code block */\nconst id = useId()\n\nconst { codeMirror } = useCodeMirror({\n  codeMirrorRef,\n  readOnly: true,\n  lineNumbers: true,\n  content: toRef(() => prettyPrintJson(props.content)),\n  language: toRef(() => props.language),\n  forceFoldGutter: true,\n})\n\n// Function to get current content\nconst getCurrentContent = () => {\n  return codeMirror.value?.state.doc.toString() || ''\n}\n</script>\n<template>\n  <div\n    class=\"scalar-code-block group/code-block body-raw relative grid min-h-0 overflow-hidden p-px outline-none has-focus-visible:outline\">\n    <div\n      class=\"body-raw-scroller custom-scroll relative pr-1\"\n      tabindex=\"0\">\n      <!-- CodeMirror container -->\n      <div ref=\"codeMirrorRef\" />\n    </div>\n    <!-- Copy button -->\n    <ScalarCodeBlockCopy\n      v-if=\"getCurrentContent()\"\n      class=\"absolute top-2 right-2\"\n      :content=\"getCurrentContent()\"\n      :aria-controls=\"id\" />\n  </div>\n</template>\n<style scoped>\n:deep(.cm-editor) {\n  background-color: transparent;\n  font-size: var(--scalar-small);\n  outline: none;\n}\n\n:deep(.cm-gutters) {\n  background-color: var(--scalar-background-1);\n  border-radius: var(--scalar-radius) 0 0 var(--scalar-radius);\n}\n\n.body-raw :deep(.cm-scroller) {\n  overflow: auto;\n  min-width: 100%;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAKd,MAAM,gBAAgB,IAA2B,KAAI;;EAErD,MAAM,KAAK,OAAM;EAEjB,MAAM,EAAE,eAAe,cAAc;GACnC;GACA,UAAU;GACV,aAAa;GACb,SAAS,YAAY,gBAAgB,MAAM,QAAQ,CAAC;GACpD,UAAU,YAAY,MAAM,SAAS;GACrC,iBAAiB;GAClB,CAAA;EAGD,MAAM,0BAA0B;AAC9B,UAAO,WAAW,OAAO,MAAM,IAAI,UAAU,IAAI;;;uBAIjD,mBAcM,OAdN,YAcM,CAZJ,mBAKM,OALN,YAKM,CADJ,mBAA2B,OAAA;aAAlB;IAAJ,KAAI;oBAIH,mBAAiB,IAAA,WAAA,EADzB,YAIwB,MAAA,oBAAA,EAAA;;IAFtB,OAAM;IACL,SAAS,mBAAiB;IAC1B,iBAAe,MAAA,GAAE"}
+{"version":3,"file":"ResponseBodyRaw.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/response-block/components/ResponseBodyRaw.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { ScalarCodeBlockCopy } from '@scalar/components'\nimport { useCodeMirror, type CodeMirrorLanguage } from '@scalar/use-codemirror'\nimport { computed, ref, toRef, useId } from 'vue'\n\nimport { prettifyJsoncString } from '@/v2/blocks/response-block/helpers/prettify-jsonc-string'\n\nconst props = defineProps<{\n  content: unknown\n  language: CodeMirrorLanguage | undefined\n  /** When true, JSON/JSONC strings are pretty-printed for the Preview tab (wire bytes stay unchanged in Raw). */\n  prettyPrintJson?: boolean\n}>()\n\nconst codeMirrorRef = ref<HTMLDivElement | null>(null)\n/** Base id for the code block */\nconst id = useId()\n\nconst displayContent = computed((): string => {\n  const { content, language, prettyPrintJson = false } = props\n  if (typeof content !== 'string') {\n    if (content == null) {\n      return ''\n    }\n    return String(content)\n  }\n  if (prettyPrintJson && language === 'json') {\n    return prettifyJsoncString(content)\n  }\n  return content\n})\n\nconst { codeMirror } = useCodeMirror({\n  codeMirrorRef,\n  readOnly: true,\n  lineNumbers: true,\n  content: toRef(displayContent),\n  language: toRef(() => props.language),\n  forceFoldGutter: true,\n})\n\n// Function to get current content\nconst getCurrentContent = () => {\n  return codeMirror.value?.state.doc.toString() || ''\n}\n</script>\n<template>\n  <div\n    class=\"scalar-code-block group/code-block relative grid min-h-0 overflow-hidden p-px outline-none has-focus-visible:outline\"\n    data-testid=\"response-body-raw\">\n    <div\n      class=\"custom-scroll relative pr-1\"\n      tabindex=\"0\">\n      <!-- CodeMirror container -->\n      <div ref=\"codeMirrorRef\" />\n    </div>\n    <!-- Copy button -->\n    <ScalarCodeBlockCopy\n      v-if=\"getCurrentContent()\"\n      :aria-controls=\"id\"\n      class=\"absolute top-2 right-2\"\n      :content=\"getCurrentContent()\" />\n  </div>\n</template>\n<style scoped>\n:deep(.cm-editor) {\n  background-color: transparent;\n  font-size: var(--scalar-small);\n  outline: none;\n}\n\n:deep(.cm-gutters) {\n  background-color: var(--scalar-background-1);\n  border-radius: var(--scalar-radius) 0 0 var(--scalar-radius);\n}\n\n:deep(.cm-scroller) {\n  overflow: auto;\n  min-width: 100%;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;EAOA,MAAM,QAAQ;EAOd,MAAM,gBAAgB,IAA2B,KAAI;;EAErD,MAAM,KAAK,OAAM;EAgBjB,MAAM,EAAE,eAAe,cAAc;GACnC;GACA,UAAU;GACV,aAAa;GACb,SAAS,MAlBY,eAAuB;IAC5C,MAAM,EAAE,SAAS,UAAU,kBAAkB,UAAU;AACvD,QAAI,OAAO,YAAY,UAAU;AAC/B,SAAI,WAAW,KACb,QAAO;AAET,YAAO,OAAO,QAAO;;AAEvB,QAAI,mBAAmB,aAAa,OAClC,QAAO,oBAAoB,QAAO;AAEpC,WAAO;KACR,CAM+B;GAC9B,UAAU,YAAY,MAAM,SAAS;GACrC,iBAAiB;GAClB,CAAA;EAGD,MAAM,0BAA0B;AAC9B,UAAO,WAAW,OAAO,MAAM,IAAI,UAAU,IAAI;;;uBAIjD,mBAeM,OAfN,YAeM,CAZJ,mBAKM,OALN,YAKM,CADJ,mBAA2B,OAAA;aAAlB;IAAJ,KAAI;oBAIH,mBAAiB,IAAA,WAAA,EADzB,YAImC,MAAA,oBAAA,EAAA;;IAFhC,iBAAe,MAAA,GAAE;IAClB,OAAM;IACL,SAAS,mBAAiB"}

package/dist/v2/blocks/response-block/components/ResponseEmpty.vue.d.ts

@@ -8,13 +8,13 @@ type __VLS_Props = {
     appVersion: string;
 };
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    openCommandPalette: () => any;
     addRequest: () => any;
     sendRequest: () => any;
+    openCommandPalette: () => any;
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onOpenCommandPalette?: (() => any) | undefined;
     onAddRequest?: (() => any) | undefined;
     onSendRequest?: (() => any) | undefined;
+    onOpenCommandPalette?: (() => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/v2/blocks/response-block/components/ResponseEmpty.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ResponseEmpty.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/response-block/components/ResponseEmpty.vue"],"names":[],"mappings":"AA4HA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAErD,KAAK,WAAW,GAAG;IACjB,oBAAoB;IACpB,MAAM,EAAE,YAAY,CAAA;IACpB,yCAAyC;IACzC,sBAAsB,EAAE,MAAM,CAAA;IAC9B,0BAA0B;IAC1B,UAAU,EAAE,MAAM,CAAA;CACnB,CAAC;AAuLF,QAAA,MAAM,YAAY;;;;;;;;kFAGhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
+{"version":3,"file":"ResponseEmpty.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/response-block/components/ResponseEmpty.vue"],"names":[],"mappings":"AA4HA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAErD,KAAK,WAAW,GAAG;IACjB,oBAAoB;IACpB,MAAM,EAAE,YAAY,CAAA;IACpB,yCAAyC;IACzC,sBAAsB,EAAE,MAAM,CAAA;IAC9B,0BAA0B;IAC1B,UAAU,EAAE,MAAM,CAAA;CACnB,CAAC;AA0LF,QAAA,MAAM,YAAY;;;;;;;;kFAGhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/v2/blocks/response-block/components/ResponseEmpty.vue.js

@@ -2,7 +2,7 @@ import _plugin_vue_export_helper_default from "../../../../_virtual/_plugin-vue_
 import ResponseEmpty_vue_vue_type_script_setup_true_lang_default from "./ResponseEmpty.vue.script.js";
 /* empty css                            */
 //#region src/v2/blocks/response-block/components/ResponseEmpty.vue
-var ResponseEmpty_default = /* @__PURE__ */ _plugin_vue_export_helper_default(ResponseEmpty_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-eb46a498"]]);
+var ResponseEmpty_default = /* @__PURE__ */ _plugin_vue_export_helper_default(ResponseEmpty_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-ab8886a2"]]);
 //#endregion
 export { ResponseEmpty_default as default };
 

package/dist/v2/blocks/response-block/components/ResponseEmpty.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"ResponseEmpty.vue.js","names":[],"sources":["../../../../../src/v2/blocks/response-block/components/ResponseEmpty.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarHotkey } from '@scalar/components'\n\nimport Computer from '@/assets/computer.ascii?raw'\nimport ScalarAsciiArt from '@/components/ScalarAsciiArt.vue'\nimport type { ClientLayout } from '@/v2/types/layout'\n\nconst { totalPerformedRequests, layout, appVersion } = defineProps<{\n  /** Client layout */\n  layout: ClientLayout\n  /** Total number of performed requests */\n  totalPerformedRequests: number\n  /** Application version */\n  appVersion: string\n}>()\n\nconst emits = defineEmits<{\n  (e: 'addRequest'): void\n  (e: 'sendRequest'): void\n  (e: 'openCommandPalette'): void\n}>()\n</script>\n<template>\n  <div class=\"flex-center relative flex flex-1 flex-col gap-6 p-2 capitalize\">\n    <div\n      class=\"flex h-[calc(100%_-_50px)] flex-col items-center justify-center\"\n      :class=\"{\n        'hidden opacity-0': totalPerformedRequests > 0 && layout !== 'modal',\n      }\">\n      <div\n        v-if=\"layout !== 'modal'\"\n        class=\"scalar-version-number\">\n        Scalar App V{{ appVersion }} Beta\n        <div class=\"mt-2\">\n          <a\n            href=\"https://github.com/scalar/scalar/issues/2669\"\n            target=\"_blank\">\n            Roadmap\n          </a>\n        </div>\n      </div>\n      <a\n        class=\"gitbook-show scalar-version-number\"\n        href=\"https://www.scalar.com\"\n        target=\"_blank\">\n        Powered By Scalar.com\n      </a>\n      <ScalarAsciiArt\n        :art=\"Computer\"\n        class=\"text-c-3\" />\n    </div>\n\n    <div\n      class=\"text-c-3 right-4 mt-auto flex w-full flex-col items-end gap-2 text-sm\">\n      <button\n        v-if=\"layout !== 'modal'\"\n        class=\"flex items-center gap-1.5\"\n        type=\"button\"\n        @click=\"emits('openCommandPalette')\">\n        Get Started\n        <ScalarHotkey\n          hotkey=\"k\"\n          :modifier=\"['default']\" />\n      </button>\n      <button\n        v-if=\"layout === 'desktop'\"\n        class=\"flex items-center gap-1.5\"\n        type=\"button\"\n        @click=\"emits('addRequest')\">\n        New Request\n        <ScalarHotkey hotkey=\"N\" />\n      </button>\n      <button\n        class=\"flex items-center gap-1.5\"\n        type=\"button\"\n        @click=\"emits('sendRequest')\">\n        Send Request\n        <ScalarHotkey hotkey=\"↵\" />\n      </button>\n    </div>\n  </div>\n</template>\n<style scoped>\n.scalar-version-number {\n  transform: skew(0deg, 13deg);\n  width: 76px;\n  height: 76px;\n  position: absolute;\n  margin-left: -36px;\n  font-size: 8px;\n  font-family: var(--scalar-font-code);\n  line-height: 11px;\n  margin-top: -113px;\n  border-radius: 9px 9px 16px 12px;\n  box-shadow: inset 2px 0px 0 2px var(--scalar-background-2);\n  text-align: center;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  text-transform: initial;\n  text-decoration-color: var(--scalar-color-3);\n}\n.scalar-version-number a {\n  font-weight: bold;\n  font-weight: bold;\n  background: var(--scalar-background-2);\n  padding: 2px 4px;\n  border-radius: 3px;\n  text-decoration: none;\n  border: 0.5px solid var(--scalar-border-color);\n}\n\n.gitbook-show {\n  display: none;\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"ResponseEmpty.vue.js","names":[],"sources":["../../../../../src/v2/blocks/response-block/components/ResponseEmpty.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarHotkey } from '@scalar/components'\n\nimport Computer from '@/assets/computer.ascii?raw'\nimport { ScalarAsciiArt } from '@/components/ScalarAsciiArt'\nimport type { ClientLayout } from '@/v2/types/layout'\n\nconst { totalPerformedRequests, layout, appVersion } = defineProps<{\n  /** Client layout */\n  layout: ClientLayout\n  /** Total number of performed requests */\n  totalPerformedRequests: number\n  /** Application version */\n  appVersion: string\n}>()\n\nconst emits = defineEmits<{\n  (e: 'addRequest'): void\n  (e: 'sendRequest'): void\n  (e: 'openCommandPalette'): void\n}>()\n</script>\n<template>\n  <div class=\"flex-center relative flex flex-1 flex-col gap-6 p-2 capitalize\">\n    <div\n      class=\"flex h-[calc(100%_-_50px)] flex-col items-center justify-center\"\n      :class=\"{\n        'hidden opacity-0': totalPerformedRequests > 0 && layout !== 'modal',\n      }\">\n      <div\n        v-if=\"layout !== 'modal'\"\n        class=\"scalar-version-number\">\n        Scalar App V{{ appVersion }} Beta\n        <div class=\"mt-2\">\n          <a\n            href=\"https://github.com/scalar/scalar/issues/2669\"\n            target=\"_blank\">\n            Roadmap\n          </a>\n        </div>\n      </div>\n      <a\n        class=\"gitbook-show scalar-version-number\"\n        href=\"https://www.scalar.com\"\n        target=\"_blank\">\n        Powered By Scalar.com\n      </a>\n      <ScalarAsciiArt\n        :art=\"Computer\"\n        class=\"text-c-3\" />\n    </div>\n\n    <div\n      class=\"text-c-3 right-4 mt-auto flex w-full flex-col items-end gap-2 text-sm\">\n      <button\n        v-if=\"layout !== 'modal'\"\n        class=\"flex items-center gap-1.5\"\n        type=\"button\"\n        @click=\"emits('openCommandPalette')\">\n        Get Started\n        <ScalarHotkey\n          hotkey=\"k\"\n          :modifier=\"['default']\" />\n      </button>\n      <button\n        v-if=\"layout === 'desktop'\"\n        class=\"flex items-center gap-1.5\"\n        type=\"button\"\n        @click=\"emits('addRequest')\">\n        New Request\n        <ScalarHotkey hotkey=\"N\" />\n      </button>\n      <button\n        class=\"flex items-center gap-1.5\"\n        type=\"button\"\n        @click=\"emits('sendRequest')\">\n        Send Request\n        <ScalarHotkey hotkey=\"↵\" />\n      </button>\n    </div>\n  </div>\n</template>\n<style scoped>\n.scalar-version-number {\n  transform: skew(0deg, 13deg);\n  width: 76px;\n  height: 76px;\n  position: absolute;\n  margin-left: -36px;\n  font-size: 8px;\n  font-family: var(--scalar-font-code);\n  line-height: 11px;\n  margin-top: -113px;\n  border-radius: 9px 9px 16px 12px;\n  box-shadow: inset 2px 0px 0 2px var(--scalar-background-2);\n  text-align: center;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  text-transform: initial;\n  text-decoration-color: var(--scalar-color-3);\n}\n.scalar-version-number a {\n  font-weight: bold;\n  font-weight: bold;\n  background: var(--scalar-background-2);\n  padding: 2px 4px;\n  border-radius: 3px;\n  text-decoration: none;\n  border: 0.5px solid var(--scalar-border-color);\n}\n\n.gitbook-show {\n  display: none;\n}\n</style>\n"],"mappings":""}

package/dist/v2/blocks/response-block/components/ResponseEmpty.vue.script.js

@@ -1,5 +1,5 @@
+import ScalarAsciiArt_default from "../../../../components/ScalarAsciiArt/ScalarAsciiArt.vue.js";
 import computer_default from "../../../../assets/computer.ascii.virtual.js";
-import ScalarAsciiArt_default from "../../../../components/ScalarAsciiArt.vue.js";
 import { createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, toDisplayString, unref } from "vue";
 import { ScalarHotkey } from "@scalar/components";
 //#region src/v2/blocks/response-block/components/ResponseEmpty.vue?vue&type=script&setup=true&lang.ts
@@ -34,7 +34,7 @@ var ResponseEmpty_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 					href: "https://www.scalar.com",
 					target: "_blank"
 				}, " Powered By Scalar.com ", -1)),
-				createVNode(ScalarAsciiArt_default, {
+				createVNode(unref(ScalarAsciiArt_default), {
 					art: unref(computer_default),
 					class: "text-c-3"
 				}, null, 8, ["art"])

package/dist/v2/blocks/response-block/components/ResponseEmpty.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ResponseEmpty.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/response-block/components/ResponseEmpty.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarHotkey } from '@scalar/components'\n\nimport Computer from '@/assets/computer.ascii?raw'\nimport ScalarAsciiArt from '@/components/ScalarAsciiArt.vue'\nimport type { ClientLayout } from '@/v2/types/layout'\n\nconst { totalPerformedRequests, layout, appVersion } = defineProps<{\n  /** Client layout */\n  layout: ClientLayout\n  /** Total number of performed requests */\n  totalPerformedRequests: number\n  /** Application version */\n  appVersion: string\n}>()\n\nconst emits = defineEmits<{\n  (e: 'addRequest'): void\n  (e: 'sendRequest'): void\n  (e: 'openCommandPalette'): void\n}>()\n</script>\n<template>\n  <div class=\"flex-center relative flex flex-1 flex-col gap-6 p-2 capitalize\">\n    <div\n      class=\"flex h-[calc(100%_-_50px)] flex-col items-center justify-center\"\n      :class=\"{\n        'hidden opacity-0': totalPerformedRequests > 0 && layout !== 'modal',\n      }\">\n      <div\n        v-if=\"layout !== 'modal'\"\n        class=\"scalar-version-number\">\n        Scalar App V{{ appVersion }} Beta\n        <div class=\"mt-2\">\n          <a\n            href=\"https://github.com/scalar/scalar/issues/2669\"\n            target=\"_blank\">\n            Roadmap\n          </a>\n        </div>\n      </div>\n      <a\n        class=\"gitbook-show scalar-version-number\"\n        href=\"https://www.scalar.com\"\n        target=\"_blank\">\n        Powered By Scalar.com\n      </a>\n      <ScalarAsciiArt\n        :art=\"Computer\"\n        class=\"text-c-3\" />\n    </div>\n\n    <div\n      class=\"text-c-3 right-4 mt-auto flex w-full flex-col items-end gap-2 text-sm\">\n      <button\n        v-if=\"layout !== 'modal'\"\n        class=\"flex items-center gap-1.5\"\n        type=\"button\"\n        @click=\"emits('openCommandPalette')\">\n        Get Started\n        <ScalarHotkey\n          hotkey=\"k\"\n          :modifier=\"['default']\" />\n      </button>\n      <button\n        v-if=\"layout === 'desktop'\"\n        class=\"flex items-center gap-1.5\"\n        type=\"button\"\n        @click=\"emits('addRequest')\">\n        New Request\n        <ScalarHotkey hotkey=\"N\" />\n      </button>\n      <button\n        class=\"flex items-center gap-1.5\"\n        type=\"button\"\n        @click=\"emits('sendRequest')\">\n        Send Request\n        <ScalarHotkey hotkey=\"↵\" />\n      </button>\n    </div>\n  </div>\n</template>\n<style scoped>\n.scalar-version-number {\n  transform: skew(0deg, 13deg);\n  width: 76px;\n  height: 76px;\n  position: absolute;\n  margin-left: -36px;\n  font-size: 8px;\n  font-family: var(--scalar-font-code);\n  line-height: 11px;\n  margin-top: -113px;\n  border-radius: 9px 9px 16px 12px;\n  box-shadow: inset 2px 0px 0 2px var(--scalar-background-2);\n  text-align: center;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  text-transform: initial;\n  text-decoration-color: var(--scalar-color-3);\n}\n.scalar-version-number a {\n  font-weight: bold;\n  font-weight: bold;\n  background: var(--scalar-background-2);\n  padding: 2px 4px;\n  border-radius: 3px;\n  text-decoration: none;\n  border: 0.5px solid var(--scalar-border-color);\n}\n\n.gitbook-show {\n  display: none;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;EAgBA,MAAM,QAAQ;;uBAOZ,mBAyDM,OAzDN,YAyDM,CAxDJ,mBA0BM,OAAA,EAzBJ,OAAK,eAAA,CAAC,mEAAiE,EAAA,oBACjC,QAAA,yBAAsB,KAAQ,QAAA,WAAM,SAAA,CAAA,CAAA,EAAA,EAAA;IAIlE,QAAA,WAAM,WAAA,WAAA,EADd,mBAWM,OAXN,YAWM,CAAA,gBAT0B,kBAClB,gBAAG,QAAA,WAAU,GAAG,UAC5B,EAAA,EAAA,OAAA,OAAA,OAAA,KAAA,mBAMM,OAAA,EAND,OAAM,QAAM,EAAA,CACf,mBAII,KAAA;KAHF,MAAK;KACL,QAAO;OAAS,YAElB,CAAA,EAAA,GAAA,EAAA,CAAA,IAAA,mBAAA,IAAA,KAAA;8BAGJ,mBAKI,KAAA;KAJF,OAAM;KACN,MAAK;KACL,QAAO;OAAS,2BAElB,GAAA;IACA,YAEqB,wBAAA;KADlB,KAAK,MAAA,iBAAQ;KACd,OAAM;;UAGV,mBA2BM,OA3BN,YA2BM;IAxBI,QAAA,WAAM,WAAA,WAAA,EADd,mBASS,UAAA;;KAPP,OAAM;KACN,MAAK;KACJ,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,MAAK,qBAAA;kDAAwB,iBAErC,GAAA,GAAA,YAE4B,MAAA,aAAA,EAAA;KAD1B,QAAO;KACN,UAAU,CAAA,UAAW;;IAGlB,QAAA,WAAM,aAAA,WAAA,EADd,mBAOS,UAAA;;KALP,OAAM;KACN,MAAK;KACJ,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,MAAK,aAAA;kDAAgB,iBAE7B,GAAA,GAAA,YAA2B,MAAA,aAAA,EAAA,EAAb,QAAO,KAAG,CAAA,CAAA,CAAA,IAAA,mBAAA,IAAA,KAAA;IAE1B,mBAMS,UAAA;KALP,OAAM;KACN,MAAK;KACJ,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,MAAK,cAAA;kDAAiB,kBAE9B,GAAA,GAAA,YAA2B,MAAA,aAAA,EAAA,EAAb,QAAO,KAAG,CAAA,CAAA,CAAA"}
+{"version":3,"file":"ResponseEmpty.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/response-block/components/ResponseEmpty.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarHotkey } from '@scalar/components'\n\nimport Computer from '@/assets/computer.ascii?raw'\nimport { ScalarAsciiArt } from '@/components/ScalarAsciiArt'\nimport type { ClientLayout } from '@/v2/types/layout'\n\nconst { totalPerformedRequests, layout, appVersion } = defineProps<{\n  /** Client layout */\n  layout: ClientLayout\n  /** Total number of performed requests */\n  totalPerformedRequests: number\n  /** Application version */\n  appVersion: string\n}>()\n\nconst emits = defineEmits<{\n  (e: 'addRequest'): void\n  (e: 'sendRequest'): void\n  (e: 'openCommandPalette'): void\n}>()\n</script>\n<template>\n  <div class=\"flex-center relative flex flex-1 flex-col gap-6 p-2 capitalize\">\n    <div\n      class=\"flex h-[calc(100%_-_50px)] flex-col items-center justify-center\"\n      :class=\"{\n        'hidden opacity-0': totalPerformedRequests > 0 && layout !== 'modal',\n      }\">\n      <div\n        v-if=\"layout !== 'modal'\"\n        class=\"scalar-version-number\">\n        Scalar App V{{ appVersion }} Beta\n        <div class=\"mt-2\">\n          <a\n            href=\"https://github.com/scalar/scalar/issues/2669\"\n            target=\"_blank\">\n            Roadmap\n          </a>\n        </div>\n      </div>\n      <a\n        class=\"gitbook-show scalar-version-number\"\n        href=\"https://www.scalar.com\"\n        target=\"_blank\">\n        Powered By Scalar.com\n      </a>\n      <ScalarAsciiArt\n        :art=\"Computer\"\n        class=\"text-c-3\" />\n    </div>\n\n    <div\n      class=\"text-c-3 right-4 mt-auto flex w-full flex-col items-end gap-2 text-sm\">\n      <button\n        v-if=\"layout !== 'modal'\"\n        class=\"flex items-center gap-1.5\"\n        type=\"button\"\n        @click=\"emits('openCommandPalette')\">\n        Get Started\n        <ScalarHotkey\n          hotkey=\"k\"\n          :modifier=\"['default']\" />\n      </button>\n      <button\n        v-if=\"layout === 'desktop'\"\n        class=\"flex items-center gap-1.5\"\n        type=\"button\"\n        @click=\"emits('addRequest')\">\n        New Request\n        <ScalarHotkey hotkey=\"N\" />\n      </button>\n      <button\n        class=\"flex items-center gap-1.5\"\n        type=\"button\"\n        @click=\"emits('sendRequest')\">\n        Send Request\n        <ScalarHotkey hotkey=\"↵\" />\n      </button>\n    </div>\n  </div>\n</template>\n<style scoped>\n.scalar-version-number {\n  transform: skew(0deg, 13deg);\n  width: 76px;\n  height: 76px;\n  position: absolute;\n  margin-left: -36px;\n  font-size: 8px;\n  font-family: var(--scalar-font-code);\n  line-height: 11px;\n  margin-top: -113px;\n  border-radius: 9px 9px 16px 12px;\n  box-shadow: inset 2px 0px 0 2px var(--scalar-background-2);\n  text-align: center;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  text-transform: initial;\n  text-decoration-color: var(--scalar-color-3);\n}\n.scalar-version-number a {\n  font-weight: bold;\n  font-weight: bold;\n  background: var(--scalar-background-2);\n  padding: 2px 4px;\n  border-radius: 3px;\n  text-decoration: none;\n  border: 0.5px solid var(--scalar-border-color);\n}\n\n.gitbook-show {\n  display: none;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;EAgBA,MAAM,QAAQ;;uBAOZ,mBAyDM,OAzDN,YAyDM,CAxDJ,mBA0BM,OAAA,EAzBJ,OAAK,eAAA,CAAC,mEAAiE,EAAA,oBACjC,QAAA,yBAAsB,KAAQ,QAAA,WAAM,SAAA,CAAA,CAAA,EAAA,EAAA;IAIlE,QAAA,WAAM,WAAA,WAAA,EADd,mBAWM,OAXN,YAWM,CAAA,gBAT0B,kBAClB,gBAAG,QAAA,WAAU,GAAG,UAC5B,EAAA,EAAA,OAAA,OAAA,OAAA,KAAA,mBAMM,OAAA,EAND,OAAM,QAAM,EAAA,CACf,mBAII,KAAA;KAHF,MAAK;KACL,QAAO;OAAS,YAElB,CAAA,EAAA,GAAA,EAAA,CAAA,IAAA,mBAAA,IAAA,KAAA;8BAGJ,mBAKI,KAAA;KAJF,OAAM;KACN,MAAK;KACL,QAAO;OAAS,2BAElB,GAAA;IACA,YAEqB,MAAA,uBAAA,EAAA;KADlB,KAAK,MAAA,iBAAQ;KACd,OAAM;;UAGV,mBA2BM,OA3BN,YA2BM;IAxBI,QAAA,WAAM,WAAA,WAAA,EADd,mBASS,UAAA;;KAPP,OAAM;KACN,MAAK;KACJ,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,MAAK,qBAAA;kDAAwB,iBAErC,GAAA,GAAA,YAE4B,MAAA,aAAA,EAAA;KAD1B,QAAO;KACN,UAAU,CAAA,UAAW;;IAGlB,QAAA,WAAM,aAAA,WAAA,EADd,mBAOS,UAAA;;KALP,OAAM;KACN,MAAK;KACJ,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,MAAK,aAAA;kDAAgB,iBAE7B,GAAA,GAAA,YAA2B,MAAA,aAAA,EAAA,EAAb,QAAO,KAAG,CAAA,CAAA,CAAA,IAAA,mBAAA,IAAA,KAAA;IAE1B,mBAMS,UAAA;KALP,OAAM;KACN,MAAK;KACJ,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,MAAK,cAAA;kDAAiB,kBAE9B,GAAA,GAAA,YAA2B,MAAA,aAAA,EAAA,EAAb,QAAO,KAAG,CAAA,CAAA,CAAA"}

package/dist/v2/blocks/response-block/components/ResponseLoadingOverlay.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ResponseLoadingOverlay.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/response-block/components/ResponseLoadingOverlay.vue"],"names":[],"mappings":"AAwEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAGvE,KAAK,WAAW,GAAG;IACjB,0BAA0B;IAC1B,QAAQ,EAAE,iBAAiB,CAAA;CAC5B,CAAC;AAyHF,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
+{"version":3,"file":"ResponseLoadingOverlay.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/response-block/components/ResponseLoadingOverlay.vue"],"names":[],"mappings":"AA4EA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAGvE,KAAK,WAAW,GAAG;IACjB,0BAA0B;IAC1B,QAAQ,EAAE,iBAAiB,CAAA;CAC5B,CAAC;AA6HF,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/v2/blocks/response-block/components/ResponseLoadingOverlay.vue.js

@@ -2,7 +2,7 @@ import _plugin_vue_export_helper_default from "../../../../_virtual/_plugin-vue_
 import ResponseLoadingOverlay_vue_vue_type_script_setup_true_lang_default from "./ResponseLoadingOverlay.vue.script.js";
 /* empty css                                     */
 //#region src/v2/blocks/response-block/components/ResponseLoadingOverlay.vue
-var ResponseLoadingOverlay_default = /* @__PURE__ */ _plugin_vue_export_helper_default(ResponseLoadingOverlay_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-1f35725e"]]);
+var ResponseLoadingOverlay_default = /* @__PURE__ */ _plugin_vue_export_helper_default(ResponseLoadingOverlay_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-21dc7abd"]]);
 //#endregion
 export { ResponseLoadingOverlay_default as default };
 

package/dist/v2/blocks/response-block/components/ResponseLoadingOverlay.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"ResponseLoadingOverlay.vue.js","names":[],"sources":["../../../../../src/v2/blocks/response-block/components/ResponseLoadingOverlay.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarLoading,\n  useLoadingState,\n} from '@scalar/components'\nimport type { WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport { onBeforeUnmount, onMounted, ref } from 'vue'\n\nconst { eventBus } = defineProps<{\n  /** Workspace event bus */\n  eventBus: WorkspaceEventBus\n}>()\n\nconst loader = useLoadingState()\nconst timeout = ref<ReturnType<typeof setTimeout>>()\n\nconst startLoading = () => {\n  timeout.value = setTimeout(() => loader.start(), 1000)\n}\n\nconst stopLoading = () => {\n  clearTimeout(timeout.value)\n  timeout.value = undefined\n  void loader.clear()\n}\n\nonMounted(() => {\n  eventBus.on('hooks:on:request:sent', startLoading)\n  eventBus.on('hooks:on:request:complete', stopLoading)\n})\n\nonBeforeUnmount(() => {\n  eventBus.off('hooks:on:request:sent', startLoading)\n  eventBus.off('hooks:on:request:complete', stopLoading)\n  stopLoading()\n})\n</script>\n<template>\n  <Transition>\n    <div\n      v-if=\"loader.isActive\"\n      class=\"bg-b-1 z-overlay absolute inset-0 flex flex-col items-center justify-center gap-6\">\n      <ScalarLoading\n        class=\"text-c-3\"\n        :loader\n        size=\"3xl\" />\n      <ScalarButton\n        variant=\"ghost\"\n        @click=\"eventBus.emit('operation:cancel:request')\">\n        Cancel\n      </ScalarButton>\n    </div>\n  </Transition>\n</template>\n<style scoped>\n.v-enter-active {\n  transition: opacity 0.5s ease;\n}\n\n.v-enter-from {\n  opacity: 0;\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"ResponseLoadingOverlay.vue.js","names":[],"sources":["../../../../../src/v2/blocks/response-block/components/ResponseLoadingOverlay.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarLoading,\n  useLoadingState,\n} from '@scalar/components'\nimport type { WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport { onBeforeUnmount, onMounted, ref } from 'vue'\n\nconst { eventBus } = defineProps<{\n  /** Workspace event bus */\n  eventBus: WorkspaceEventBus\n}>()\n\nconst loader = useLoadingState()\nconst timeout = ref<ReturnType<typeof setTimeout>>()\n\nconst startLoading = () => {\n  // Replace any pending delayed start so overlapping `hooks:on:request:sent` events\n  // (rapid send, navigation, double submit) cannot leave an orphaned timer that\n  // calls `loader.start()` after the matching request already completed.\n  clearTimeout(timeout.value)\n  timeout.value = setTimeout(() => loader.start(), 1000)\n}\n\nconst stopLoading = () => {\n  clearTimeout(timeout.value)\n  timeout.value = undefined\n  void loader.clear()\n}\n\nonMounted(() => {\n  eventBus.on('hooks:on:request:sent', startLoading)\n  eventBus.on('hooks:on:request:complete', stopLoading)\n})\n\nonBeforeUnmount(() => {\n  eventBus.off('hooks:on:request:sent', startLoading)\n  eventBus.off('hooks:on:request:complete', stopLoading)\n  stopLoading()\n})\n</script>\n<template>\n  <Transition>\n    <div\n      v-if=\"loader.isActive\"\n      class=\"bg-b-1 z-overlay absolute inset-0 flex flex-col items-center justify-center gap-6\">\n      <ScalarLoading\n        class=\"text-c-3\"\n        :loader\n        size=\"3xl\" />\n      <ScalarButton\n        variant=\"ghost\"\n        @click=\"eventBus.emit('operation:cancel:request')\">\n        Cancel\n      </ScalarButton>\n    </div>\n  </Transition>\n</template>\n<style scoped>\n.v-enter-active {\n  transition: opacity 0.5s ease;\n}\n\n.v-enter-from {\n  opacity: 0;\n}\n</style>\n"],"mappings":""}

package/dist/v2/blocks/response-block/components/ResponseLoadingOverlay.vue.script.js

@@ -12,6 +12,7 @@ var ResponseLoadingOverlay_vue_vue_type_script_setup_true_lang_default = /* @__P
 		const loader = useLoadingState();
 		const timeout = ref();
 		const startLoading = () => {
+			clearTimeout(timeout.value);
 			timeout.value = setTimeout(() => loader.start(), 1e3);
 		};
 		const stopLoading = () => {

package/dist/v2/blocks/response-block/components/ResponseLoadingOverlay.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ResponseLoadingOverlay.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/response-block/components/ResponseLoadingOverlay.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarLoading,\n  useLoadingState,\n} from '@scalar/components'\nimport type { WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport { onBeforeUnmount, onMounted, ref } from 'vue'\n\nconst { eventBus } = defineProps<{\n  /** Workspace event bus */\n  eventBus: WorkspaceEventBus\n}>()\n\nconst loader = useLoadingState()\nconst timeout = ref<ReturnType<typeof setTimeout>>()\n\nconst startLoading = () => {\n  timeout.value = setTimeout(() => loader.start(), 1000)\n}\n\nconst stopLoading = () => {\n  clearTimeout(timeout.value)\n  timeout.value = undefined\n  void loader.clear()\n}\n\nonMounted(() => {\n  eventBus.on('hooks:on:request:sent', startLoading)\n  eventBus.on('hooks:on:request:complete', stopLoading)\n})\n\nonBeforeUnmount(() => {\n  eventBus.off('hooks:on:request:sent', startLoading)\n  eventBus.off('hooks:on:request:complete', stopLoading)\n  stopLoading()\n})\n</script>\n<template>\n  <Transition>\n    <div\n      v-if=\"loader.isActive\"\n      class=\"bg-b-1 z-overlay absolute inset-0 flex flex-col items-center justify-center gap-6\">\n      <ScalarLoading\n        class=\"text-c-3\"\n        :loader\n        size=\"3xl\" />\n      <ScalarButton\n        variant=\"ghost\"\n        @click=\"eventBus.emit('operation:cancel:request')\">\n        Cancel\n      </ScalarButton>\n    </div>\n  </Transition>\n</template>\n<style scoped>\n.v-enter-active {\n  transition: opacity 0.5s ease;\n}\n\n.v-enter-from {\n  opacity: 0;\n}\n</style>\n"],"mappings":";;;;;;;;;;;EAcA,MAAM,SAAS,iBAAgB;EAC/B,MAAM,UAAU,KAAmC;EAEnD,MAAM,qBAAqB;AACzB,WAAQ,QAAQ,iBAAiB,OAAO,OAAO,EAAE,IAAI;;EAGvD,MAAM,oBAAoB;AACxB,gBAAa,QAAQ,MAAK;AAC1B,WAAQ,QAAQ,KAAA;AACX,UAAO,OAAM;;AAGpB,kBAAgB;AACd,WAAA,SAAS,GAAG,yBAAyB,aAAY;AACjD,WAAA,SAAS,GAAG,6BAA6B,YAAW;IACrD;AAED,wBAAsB;AACpB,WAAA,SAAS,IAAI,yBAAyB,aAAY;AAClD,WAAA,SAAS,IAAI,6BAA6B,YAAW;AACrD,gBAAY;IACb;;uBAGC,YAca,YAAA,MAAA;2BADL,CAXE,MAAA,OAAM,CAAC,YAAA,WAAA,EADf,mBAYM,OAZN,YAYM,CATJ,YAGe,MAAA,cAAA,EAAA;KAFb,OAAM;KACL,QAAA,MAAA,OAAM;KACP,MAAK;6BACP,YAIe,MAAA,aAAA,EAAA;KAHb,SAAQ;KACP,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,QAAA,SAAS,KAAI,2BAAA;;4BAEvB,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA,CAAA,gBAFqD,YAErD,GAAA,CAAA,EAAA,CAAA"}
+{"version":3,"file":"ResponseLoadingOverlay.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/response-block/components/ResponseLoadingOverlay.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarLoading,\n  useLoadingState,\n} from '@scalar/components'\nimport type { WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport { onBeforeUnmount, onMounted, ref } from 'vue'\n\nconst { eventBus } = defineProps<{\n  /** Workspace event bus */\n  eventBus: WorkspaceEventBus\n}>()\n\nconst loader = useLoadingState()\nconst timeout = ref<ReturnType<typeof setTimeout>>()\n\nconst startLoading = () => {\n  // Replace any pending delayed start so overlapping `hooks:on:request:sent` events\n  // (rapid send, navigation, double submit) cannot leave an orphaned timer that\n  // calls `loader.start()` after the matching request already completed.\n  clearTimeout(timeout.value)\n  timeout.value = setTimeout(() => loader.start(), 1000)\n}\n\nconst stopLoading = () => {\n  clearTimeout(timeout.value)\n  timeout.value = undefined\n  void loader.clear()\n}\n\nonMounted(() => {\n  eventBus.on('hooks:on:request:sent', startLoading)\n  eventBus.on('hooks:on:request:complete', stopLoading)\n})\n\nonBeforeUnmount(() => {\n  eventBus.off('hooks:on:request:sent', startLoading)\n  eventBus.off('hooks:on:request:complete', stopLoading)\n  stopLoading()\n})\n</script>\n<template>\n  <Transition>\n    <div\n      v-if=\"loader.isActive\"\n      class=\"bg-b-1 z-overlay absolute inset-0 flex flex-col items-center justify-center gap-6\">\n      <ScalarLoading\n        class=\"text-c-3\"\n        :loader\n        size=\"3xl\" />\n      <ScalarButton\n        variant=\"ghost\"\n        @click=\"eventBus.emit('operation:cancel:request')\">\n        Cancel\n      </ScalarButton>\n    </div>\n  </Transition>\n</template>\n<style scoped>\n.v-enter-active {\n  transition: opacity 0.5s ease;\n}\n\n.v-enter-from {\n  opacity: 0;\n}\n</style>\n"],"mappings":";;;;;;;;;;;EAcA,MAAM,SAAS,iBAAgB;EAC/B,MAAM,UAAU,KAAmC;EAEnD,MAAM,qBAAqB;AAIzB,gBAAa,QAAQ,MAAK;AAC1B,WAAQ,QAAQ,iBAAiB,OAAO,OAAO,EAAE,IAAI;;EAGvD,MAAM,oBAAoB;AACxB,gBAAa,QAAQ,MAAK;AAC1B,WAAQ,QAAQ,KAAA;AACX,UAAO,OAAM;;AAGpB,kBAAgB;AACd,WAAA,SAAS,GAAG,yBAAyB,aAAY;AACjD,WAAA,SAAS,GAAG,6BAA6B,YAAW;IACrD;AAED,wBAAsB;AACpB,WAAA,SAAS,IAAI,yBAAyB,aAAY;AAClD,WAAA,SAAS,IAAI,6BAA6B,YAAW;AACrD,gBAAY;IACb;;uBAGC,YAca,YAAA,MAAA;2BADL,CAXE,MAAA,OAAM,CAAC,YAAA,WAAA,EADf,mBAYM,OAZN,YAYM,CATJ,YAGe,MAAA,cAAA,EAAA;KAFb,OAAM;KACL,QAAA,MAAA,OAAM;KACP,MAAK;6BACP,YAIe,MAAA,aAAA,EAAA;KAHb,SAAQ;KACP,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,QAAA,SAAS,KAAI,2BAAA;;4BAEvB,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA,CAAA,gBAFqD,YAErD,GAAA,CAAA,EAAA,CAAA"}

package/dist/v2/blocks/response-block/helpers/media-types.d.ts

@@ -1,5 +1,5 @@
 import type { CodeMirrorLanguage } from '@scalar/use-codemirror';
-export type MediaPreview = 'object' | 'image' | 'video' | 'audio';
+export type MediaPreview = 'object' | 'image' | 'video' | 'audio' | 'json';
 type MediaConfig = {
     preview?: MediaPreview;
     alpha?: boolean;

package/dist/v2/blocks/response-block/helpers/media-types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"media-types.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/response-block/helpers/media-types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAEhE,MAAM,MAAM,YAAY,GAAG,QAAQ,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,CAAA;AAEjE,KAAK,WAAW,GAAG;IACjB,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,GAAG,CAAC,EAAE,OAAO,CAAA;IACb,QAAQ,CAAC,EAAE,kBAAkB,CAAA;IAC7B,SAAS,EAAE,MAAM,CAAA;CAClB,CAAA;AAoHD,iEAAiE;AACjE,eAAO,MAAM,cAAc,EAAE,MAAM,EAEX,CAAA;AAExB,sCAAsC;AACtC,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,MAAM,GAAG,WAAW,GAAG,SAAS,CAgBxE;AAED,8DAA8D;AAC9D,wBAAgB,eAAe,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO,CAErD"}
+{"version":3,"file":"media-types.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/response-block/helpers/media-types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AAEhE,MAAM,MAAM,YAAY,GAAG,QAAQ,GAAG,OAAO,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAA;AAE1E,KAAK,WAAW,GAAG;IACjB,OAAO,CAAC,EAAE,YAAY,CAAA;IACtB,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,GAAG,CAAC,EAAE,OAAO,CAAA;IACb,QAAQ,CAAC,EAAE,kBAAkB,CAAA;IAC7B,SAAS,EAAE,MAAM,CAAA;CAClB,CAAA;AA8ID,iEAAiE;AACjE,eAAO,MAAM,cAAc,EAAE,MAAM,EAEX,CAAA;AAExB,sCAAsC;AACtC,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,MAAM,GAAG,WAAW,GAAG,SAAS,CAiBxE;AAED,8DAA8D;AAC9D,wBAAgB,eAAe,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO,CAErD"}

package/dist/v2/blocks/response-block/helpers/media-types.js

@@ -11,27 +11,32 @@ var mediaTypes = {
 	"application/json": {
 		extension: ".json",
 		raw: true,
-		language: "json"
+		language: "json",
+		preview: "json"
 	},
 	"application/ld+json": {
 		extension: ".jsonld",
 		raw: true,
-		language: "json"
+		language: "json",
+		preview: "json"
 	},
 	"application/problem+json": {
 		extension: ".json",
 		raw: true,
-		language: "json"
+		language: "json",
+		preview: "json"
 	},
 	"application/vnd.api+json": {
 		extension: ".json",
 		raw: true,
-		language: "json"
+		language: "json",
+		preview: "json"
 	},
 	"application/dns-json": {
 		extension: ".json",
 		raw: true,
-		language: "json"
+		language: "json",
+		preview: "json"
 	},
 	"application/msword": { extension: ".doc" },
 	"application/octet-stream": { extension: ".bin" },
@@ -181,7 +186,8 @@ var mediaTypes = {
 	"text/json": {
 		extension: ".json",
 		raw: true,
-		language: "json"
+		language: "json",
+		preview: "json"
 	},
 	"text/plain": {
 		extension: ".txt",
@@ -223,7 +229,8 @@ function getMediaTypeConfig(type) {
 	if (type.endsWith("+json")) return {
 		extension: ".json",
 		raw: true,
-		language: "json"
+		language: "json",
+		preview: "json"
 	};
 }
 /** Check if a media type that can be displayed as raw text */

package/dist/v2/blocks/response-block/helpers/media-types.js.map

@@ -1 +1 @@
-{"version":3,"file":"media-types.js","names":[],"sources":["../../../../../src/v2/blocks/response-block/helpers/media-types.ts"],"sourcesContent":["import type { CodeMirrorLanguage } from '@scalar/use-codemirror'\n\nexport type MediaPreview = 'object' | 'image' | 'video' | 'audio'\n\ntype MediaConfig = {\n  preview?: MediaPreview\n  alpha?: boolean\n  raw?: boolean\n  language?: CodeMirrorLanguage\n  extension: string\n}\n\n/** Media Type (MIME Type) Definitions */\nconst mediaTypes: { [type: string]: MediaConfig | undefined } = {\n  'application/epub+zip': { extension: '.epub' },\n  'application/gzip': { extension: '.gz' },\n  'application/java-archive': { extension: '.jar' },\n  'application/javascript': { extension: '.js', raw: true },\n  'application/json': { extension: '.json', raw: true, language: 'json' },\n  'application/ld+json': { extension: '.jsonld', raw: true, language: 'json' },\n  'application/problem+json': {\n    extension: '.json',\n    raw: true,\n    language: 'json',\n  },\n  'application/vnd.api+json': { extension: '.json', raw: true, language: 'json' },\n  'application/dns-json': { extension: '.json', raw: true, language: 'json' },\n  'application/msword': { extension: '.doc' },\n  'application/octet-stream': { extension: '.bin' },\n  'application/ogg': { extension: '.ogx' },\n  'application/pdf': { extension: '.pdf', preview: 'object' },\n  'application/rtf': { extension: '.rtf', raw: true },\n  'application/vnd.amazon.ebook': { extension: '.azw' },\n  'application/vnd.apple.installer+xml': {\n    extension: '.mpkg',\n    raw: true,\n    language: 'xml',\n  },\n  'application/vnd.mozilla.xul+xml': {\n    extension: '.xul',\n    raw: true,\n    language: 'xml',\n  },\n  'application/vnd.ms-excel': { extension: '.xls' },\n  'application/vnd.ms-fontobject': { extension: '.eot' },\n  'application/vnd.ms-powerpoint': { extension: '.ppt' },\n  'application/vnd.oasis.opendocument.presentation': { extension: '.odp' },\n  'application/vnd.oasis.opendocument.spreadsheet': { extension: '.ods' },\n  'application/vnd.oasis.opendocument.text': { extension: '.odt' },\n  'application/vnd.openxmlformats-officedocument.presentationml.presentation': {\n    extension: '.pptx',\n  },\n  'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': {\n    extension: '.xlsx',\n  },\n  'application/vnd.openxmlformats-officedocument.wordprocessingml.document': {\n    extension: '.docx',\n  },\n  'application/vnd.rar': { extension: '.rar' },\n  'application/vnd.visio': { extension: '.vsd' },\n  'application/x-7z-compressed': { extension: '.7z' },\n  'application/x-abiword': { extension: '.abw' },\n  'application/x-bzip': { extension: '.bz' },\n  'application/x-bzip2': { extension: '.bz2' },\n  'application/x-cdf': { extension: '.cda' },\n  'application/x-csh': { extension: '.csh' },\n  'application/x-freearc': { extension: '.arc' },\n  'application/x-httpd-php': { extension: '.php', raw: true },\n  'application/x-sh': { extension: '.sh', raw: true },\n  'application/x-tar': { extension: '.tar' },\n  'application/xhtml+xml': { extension: '.xhtml', raw: true, language: 'html' },\n  'application/xml': { extension: '.xml', raw: true, language: 'xml' },\n  'application/yaml': { extension: '.yaml', raw: true, language: 'yaml' },\n  'application/zip': { extension: '.zip' },\n  'audio/aac': { extension: '.aac' },\n  'audio/midi': { extension: '.midi' },\n  'audio/mpeg': { extension: '.mp3', preview: 'audio' },\n  'audio/ogg': { extension: '.oga' },\n  'audio/wav': { extension: '.wav' },\n  'audio/webm': { extension: '.weba' },\n  'font/otf': { extension: '.otf' },\n  'font/ttf': { extension: '.ttf' },\n  'font/woff': { extension: '.woff' },\n  'font/woff2': { extension: '.woff2' },\n  'image/apng': { extension: '.apng', preview: 'image', alpha: true },\n  'image/avif': { extension: '.avif', preview: 'image' },\n  'image/bmp': { extension: '.bmp', preview: 'image' },\n  'image/gif': { extension: '.gif', preview: 'image', alpha: true },\n  'image/jpeg': { extension: '.jpg', preview: 'image' },\n  'image/png': { extension: '.png', preview: 'image', alpha: true },\n  'image/svg+xml': {\n    extension: '.svg',\n    raw: true,\n    language: 'xml',\n    preview: 'image',\n    alpha: true,\n  },\n  'image/tiff': { extension: '.tiff' },\n  'image/vnd.microsoft.icon': { extension: '.ico', preview: 'image' },\n  'image/webp': { extension: '.webp', preview: 'image', alpha: true },\n  'text/calendar': { extension: '.ics', raw: true },\n  'text/css': { extension: '.css', raw: true, language: 'css' },\n  'text/csv': { extension: '.csv', raw: true },\n  'text/html': {\n    extension: '.html',\n    raw: true,\n    language: 'html',\n    preview: 'object',\n  },\n  'text/javascript': { extension: '.js', raw: true },\n  'text/json': { extension: '.json', raw: true, language: 'json' },\n  'text/plain': { extension: '.txt', raw: true },\n  'text/xml': { extension: '.xml', raw: true, language: 'xml' },\n  'text/yaml': { extension: '.yaml', raw: true, language: 'yaml' },\n  'video/3gpp': { extension: '.3gp' },\n  'audio/3gpp': { extension: '.3gp' },\n  'video/3gpp2': { extension: '.3g2' },\n  'audio/3gpp2': { extension: '.3g2' },\n  'video/mp2t': { extension: '.ts' },\n  'video/mp4': { extension: '.mp4', preview: 'video' },\n  'video/mpeg': { extension: '.mpeg' },\n  'video/ogg': { extension: '.ogv' },\n  'video/webm': { extension: '.webm', preview: 'video' },\n  'video/x-msvideo': { extension: '.avi' },\n}\n\n/** Media Types (MIME Types) that can be displayed as raw text */\nexport const textMediaTypes: string[] = Object.entries(mediaTypes)\n  .filter(([, config]) => config?.raw)\n  .map(([type]) => type)\n\n/** Get the config for a media type */\nexport function getMediaTypeConfig(type: string): MediaConfig | undefined {\n  const config = mediaTypes[type]\n  if (config) {\n    return config\n  }\n\n  // Fallback for +json types\n  if (type.endsWith('+json')) {\n    return {\n      extension: '.json',\n      raw: true,\n      language: 'json',\n    }\n  }\n\n  return undefined\n}\n\n/** Check if a media type that can be displayed as raw text */\nexport function isTextMediaType(type: string): boolean {\n  return !!getMediaTypeConfig(type)?.raw\n}\n"],"mappings":"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"}
+{"version":3,"file":"media-types.js","names":[],"sources":["../../../../../src/v2/blocks/response-block/helpers/media-types.ts"],"sourcesContent":["import type { CodeMirrorLanguage } from '@scalar/use-codemirror'\n\nexport type MediaPreview = 'object' | 'image' | 'video' | 'audio' | 'json'\n\ntype MediaConfig = {\n  preview?: MediaPreview\n  alpha?: boolean\n  raw?: boolean\n  language?: CodeMirrorLanguage\n  extension: string\n}\n\n/** Media Type (MIME Type) Definitions */\nconst mediaTypes: { [type: string]: MediaConfig | undefined } = {\n  'application/epub+zip': { extension: '.epub' },\n  'application/gzip': { extension: '.gz' },\n  'application/java-archive': { extension: '.jar' },\n  'application/javascript': { extension: '.js', raw: true },\n  'application/json': {\n    extension: '.json',\n    raw: true,\n    language: 'json',\n    preview: 'json',\n  },\n  'application/ld+json': {\n    extension: '.jsonld',\n    raw: true,\n    language: 'json',\n    preview: 'json',\n  },\n  'application/problem+json': {\n    extension: '.json',\n    raw: true,\n    language: 'json',\n    preview: 'json',\n  },\n  'application/vnd.api+json': {\n    extension: '.json',\n    raw: true,\n    language: 'json',\n    preview: 'json',\n  },\n  'application/dns-json': {\n    extension: '.json',\n    raw: true,\n    language: 'json',\n    preview: 'json',\n  },\n  'application/msword': { extension: '.doc' },\n  'application/octet-stream': { extension: '.bin' },\n  'application/ogg': { extension: '.ogx' },\n  'application/pdf': { extension: '.pdf', preview: 'object' },\n  'application/rtf': { extension: '.rtf', raw: true },\n  'application/vnd.amazon.ebook': { extension: '.azw' },\n  'application/vnd.apple.installer+xml': {\n    extension: '.mpkg',\n    raw: true,\n    language: 'xml',\n  },\n  'application/vnd.mozilla.xul+xml': {\n    extension: '.xul',\n    raw: true,\n    language: 'xml',\n  },\n  'application/vnd.ms-excel': { extension: '.xls' },\n  'application/vnd.ms-fontobject': { extension: '.eot' },\n  'application/vnd.ms-powerpoint': { extension: '.ppt' },\n  'application/vnd.oasis.opendocument.presentation': { extension: '.odp' },\n  'application/vnd.oasis.opendocument.spreadsheet': { extension: '.ods' },\n  'application/vnd.oasis.opendocument.text': { extension: '.odt' },\n  'application/vnd.openxmlformats-officedocument.presentationml.presentation': {\n    extension: '.pptx',\n  },\n  'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': {\n    extension: '.xlsx',\n  },\n  'application/vnd.openxmlformats-officedocument.wordprocessingml.document': {\n    extension: '.docx',\n  },\n  'application/vnd.rar': { extension: '.rar' },\n  'application/vnd.visio': { extension: '.vsd' },\n  'application/x-7z-compressed': { extension: '.7z' },\n  'application/x-abiword': { extension: '.abw' },\n  'application/x-bzip': { extension: '.bz' },\n  'application/x-bzip2': { extension: '.bz2' },\n  'application/x-cdf': { extension: '.cda' },\n  'application/x-csh': { extension: '.csh' },\n  'application/x-freearc': { extension: '.arc' },\n  'application/x-httpd-php': { extension: '.php', raw: true },\n  'application/x-sh': { extension: '.sh', raw: true },\n  'application/x-tar': { extension: '.tar' },\n  'application/xhtml+xml': { extension: '.xhtml', raw: true, language: 'html' },\n  'application/xml': { extension: '.xml', raw: true, language: 'xml' },\n  'application/yaml': { extension: '.yaml', raw: true, language: 'yaml' },\n  'application/zip': { extension: '.zip' },\n  'audio/aac': { extension: '.aac' },\n  'audio/midi': { extension: '.midi' },\n  'audio/mpeg': { extension: '.mp3', preview: 'audio' },\n  'audio/ogg': { extension: '.oga' },\n  'audio/wav': { extension: '.wav' },\n  'audio/webm': { extension: '.weba' },\n  'font/otf': { extension: '.otf' },\n  'font/ttf': { extension: '.ttf' },\n  'font/woff': { extension: '.woff' },\n  'font/woff2': { extension: '.woff2' },\n  'image/apng': { extension: '.apng', preview: 'image', alpha: true },\n  'image/avif': { extension: '.avif', preview: 'image' },\n  'image/bmp': { extension: '.bmp', preview: 'image' },\n  'image/gif': { extension: '.gif', preview: 'image', alpha: true },\n  'image/jpeg': { extension: '.jpg', preview: 'image' },\n  'image/png': { extension: '.png', preview: 'image', alpha: true },\n  'image/svg+xml': {\n    extension: '.svg',\n    raw: true,\n    language: 'xml',\n    preview: 'image',\n    alpha: true,\n  },\n  'image/tiff': { extension: '.tiff' },\n  'image/vnd.microsoft.icon': { extension: '.ico', preview: 'image' },\n  'image/webp': { extension: '.webp', preview: 'image', alpha: true },\n  'text/calendar': { extension: '.ics', raw: true },\n  'text/css': { extension: '.css', raw: true, language: 'css' },\n  'text/csv': { extension: '.csv', raw: true },\n  'text/html': {\n    extension: '.html',\n    raw: true,\n    language: 'html',\n    preview: 'object',\n  },\n  'text/javascript': { extension: '.js', raw: true },\n  'text/json': {\n    extension: '.json',\n    raw: true,\n    language: 'json',\n    preview: 'json',\n  },\n  'text/plain': { extension: '.txt', raw: true },\n  'text/xml': { extension: '.xml', raw: true, language: 'xml' },\n  'text/yaml': { extension: '.yaml', raw: true, language: 'yaml' },\n  'video/3gpp': { extension: '.3gp' },\n  'audio/3gpp': { extension: '.3gp' },\n  'video/3gpp2': { extension: '.3g2' },\n  'audio/3gpp2': { extension: '.3g2' },\n  'video/mp2t': { extension: '.ts' },\n  'video/mp4': { extension: '.mp4', preview: 'video' },\n  'video/mpeg': { extension: '.mpeg' },\n  'video/ogg': { extension: '.ogv' },\n  'video/webm': { extension: '.webm', preview: 'video' },\n  'video/x-msvideo': { extension: '.avi' },\n}\n\n/** Media Types (MIME Types) that can be displayed as raw text */\nexport const textMediaTypes: string[] = Object.entries(mediaTypes)\n  .filter(([, config]) => config?.raw)\n  .map(([type]) => type)\n\n/** Get the config for a media type */\nexport function getMediaTypeConfig(type: string): MediaConfig | undefined {\n  const config = mediaTypes[type]\n  if (config) {\n    return config\n  }\n\n  // Fallback for +json types\n  if (type.endsWith('+json')) {\n    return {\n      extension: '.json',\n      raw: true,\n      language: 'json',\n      preview: 'json',\n    }\n  }\n\n  return undefined\n}\n\n/** Check if a media type that can be displayed as raw text */\nexport function isTextMediaType(type: string): boolean {\n  return !!getMediaTypeConfig(type)?.raw\n}\n"],"mappings":"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"}

package/dist/v2/blocks/response-block/helpers/prettify-jsonc-string.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Pretty-print JSON/JSONC for preview without round-tripping through JSON.parse,
+ * so digit sequences in large integers stay exact in the string.
+ */
+export declare function prettifyJsoncString(content: string): string;
+//# sourceMappingURL=prettify-jsonc-string.d.ts.map

package/dist/v2/blocks/response-block/helpers/prettify-jsonc-string.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"prettify-jsonc-string.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/response-block/helpers/prettify-jsonc-string.ts"],"names":[],"mappings":"AAQA;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,CAU3D"}

package/dist/v2/blocks/response-block/helpers/prettify-jsonc-string.js

@@ -0,0 +1,22 @@
+import { applyEdits, format } from "jsonc-parser";
+//#region src/v2/blocks/response-block/helpers/prettify-jsonc-string.ts
+var jsoncFormatOptions = {
+	tabSize: 2,
+	insertSpaces: true,
+	eol: "\n"
+};
+/**
+* Pretty-print JSON/JSONC for preview without round-tripping through JSON.parse,
+* so digit sequences in large integers stay exact in the string.
+*/
+function prettifyJsoncString(content) {
+	try {
+		const edits = format(content, void 0, jsoncFormatOptions);
+		if (edits.length > 0) return applyEdits(content, edits);
+	} catch {}
+	return content;
+}
+//#endregion
+export { prettifyJsoncString };
+
+//# sourceMappingURL=prettify-jsonc-string.js.map

package/dist/v2/blocks/response-block/helpers/prettify-jsonc-string.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"prettify-jsonc-string.js","names":[],"sources":["../../../../../src/v2/blocks/response-block/helpers/prettify-jsonc-string.ts"],"sourcesContent":["import { applyEdits, format } from 'jsonc-parser'\n\nconst jsoncFormatOptions = {\n  tabSize: 2,\n  insertSpaces: true,\n  eol: '\\n',\n} as const\n\n/**\n * Pretty-print JSON/JSONC for preview without round-tripping through JSON.parse,\n * so digit sequences in large integers stay exact in the string.\n */\nexport function prettifyJsoncString(content: string): string {\n  try {\n    const edits = format(content, undefined, jsoncFormatOptions)\n    if (edits.length > 0) {\n      return applyEdits(content, edits)\n    }\n  } catch {\n    // applyEdits can throw on malformed edit sequences\n  }\n  return content\n}\n"],"mappings":";;AAEA,IAAM,qBAAqB;CACzB,SAAS;CACT,cAAc;CACd,KAAK;CACN;;;;;AAMD,SAAgB,oBAAoB,SAAyB;AAC3D,KAAI;EACF,MAAM,QAAQ,OAAO,SAAS,KAAA,GAAW,mBAAmB;AAC5D,MAAI,MAAM,SAAS,EACjB,QAAO,WAAW,SAAS,MAAM;SAE7B;AAGR,QAAO"}

package/dist/v2/blocks/scalar-address-bar-block/components/AddressBar.vue.d.ts

@@ -39,14 +39,14 @@ declare const __VLS_export: import("vue").DefineComponent<AddressBarProps, {
     methodConflict: import("vue").Ref<"head" | "delete" | "get" | "options" | "patch" | "post" | "put" | "trace" | null, "head" | "delete" | "get" | "options" | "patch" | "post" | "put" | "trace" | null>;
     pathConflict: import("vue").Ref<string | null, string | null>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    execute: () => any;
     "select:history:item": (payload: {
         index: number;
     }) => any;
+    execute: () => any;
 }, string, import("vue").PublicProps, Readonly<AddressBarProps> & Readonly<{
-    onExecute?: (() => any) | undefined;
     "onSelect:history:item"?: ((payload: {
         index: number;
     }) => any) | undefined;
+    onExecute?: (() => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 //# sourceMappingURL=AddressBar.vue.d.ts.map

package/dist/v2/blocks/scalar-address-bar-block/components/AddressBar.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AddressBar.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/scalar-address-bar-block/components/AddressBar.vue"],"names":[],"mappings":"AAkpBA,OAAO,KAAK,EAAE,UAAU,IAAI,cAAc,EAAE,MAAM,mCAAmC,CAAA;AAMrF,OAAO,KAAK,EAEV,UAAU,EACV,iBAAiB,EAClB,MAAM,gCAAgC,CAAA;AAKvC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2EAA2E,CAAA;AACnH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,8DAA8D,CAAA;AAoBhG,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAErD,OAA0B,EAAE,KAAK,OAAO,EAAE,MAAM,yBAAyB,CAAA;AAGzE;;;;GAIG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAKzC,MAAM,MAAM,eAAe,GAAG;IAC5B,2BAA2B;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ,6BAA6B;IAC7B,MAAM,EAAE,cAAc,CAAA;IACtB,4BAA4B;IAC5B,YAAY,EAAE,MAAM,CAAA;IACpB,+DAA+D;IAC/D,UAAU,EAAE,MAAM,CAAA;IAClB,gCAAgC;IAChC,MAAM,EAAE,YAAY,GAAG,IAAI,CAAA;IAC3B,mDAAmD;IACnD,OAAO,EAAE,YAAY,EAAE,CAAA;IACvB,8BAA8B;IAC9B,OAAO,EAAE,OAAO,EAAE,CAAA;IAClB,oBAAoB;IACpB,MAAM,EAAE,YAAY,CAAA;IACpB,gBAAgB;IAChB,QAAQ,EAAE,iBAAiB,CAAA;IAC3B,kBAAkB;IAClB,WAAW,EAAE,kBAAkB,CAAA;IAC/B,sCAAsC;IACtC,UAAU,EAAE,UAAU,CAAA;CACvB,CAAA;AACD,QAAA,MAAM,YAAY;;;;;;eAoB6B,MAAM;;;;;eAAN,MAAM;;kFA6yBjD,CAAC"}
+{"version":3,"file":"AddressBar.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/scalar-address-bar-block/components/AddressBar.vue"],"names":[],"mappings":"AAkqBA,OAAO,KAAK,EAAE,UAAU,IAAI,cAAc,EAAE,MAAM,mCAAmC,CAAA;AAIrF,OAAO,KAAK,EAEV,UAAU,EACV,iBAAiB,EAClB,MAAM,gCAAgC,CAAA;AACvC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2EAA2E,CAAA;AACnH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,8DAA8D,CAAA;AAoBhG,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAErD,OAA0B,EAAE,KAAK,OAAO,EAAE,MAAM,yBAAyB,CAAA;AAGzE;;;;GAIG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAKzC,MAAM,MAAM,eAAe,GAAG;IAC5B,2BAA2B;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ,6BAA6B;IAC7B,MAAM,EAAE,cAAc,CAAA;IACtB,4BAA4B;IAC5B,YAAY,EAAE,MAAM,CAAA;IACpB,+DAA+D;IAC/D,UAAU,EAAE,MAAM,CAAA;IAClB,gCAAgC;IAChC,MAAM,EAAE,YAAY,GAAG,IAAI,CAAA;IAC3B,mDAAmD;IACnD,OAAO,EAAE,YAAY,EAAE,CAAA;IACvB,8BAA8B;IAC9B,OAAO,EAAE,OAAO,EAAE,CAAA;IAClB,oBAAoB;IACpB,MAAM,EAAE,YAAY,CAAA;IACpB,gBAAgB;IAChB,QAAQ,EAAE,iBAAiB,CAAA;IAC3B,kBAAkB;IAClB,WAAW,EAAE,kBAAkB,CAAA;IAC/B,sCAAsC;IACtC,UAAU,EAAE,UAAU,CAAA;CACvB,CAAA;AACD,QAAA,MAAM,YAAY;;;;;eAoB6B,MAAM;;;;;eAAN,MAAM;;;kFAm7BjD,CAAC"}

package/dist/v2/blocks/scalar-address-bar-block/components/AddressBar.vue.js

@@ -2,7 +2,7 @@ import _plugin_vue_export_helper_default from "../../../../_virtual/_plugin-vue_
 import AddressBar_vue_vue_type_script_setup_true_lang_default from "./AddressBar.vue.script.js";
 /* empty css                         */
 //#region src/v2/blocks/scalar-address-bar-block/components/AddressBar.vue
-var AddressBar_default = /* @__PURE__ */ _plugin_vue_export_helper_default(AddressBar_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-dc314812"]]);
+var AddressBar_default = /* @__PURE__ */ _plugin_vue_export_helper_default(AddressBar_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-4d85ebb9"]]);
 //#endregion
 export { AddressBar_default as default };
 

package/dist/v2/blocks/scalar-address-bar-block/components/AddressBar.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"AddressBar.vue.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-address-bar-block/components/AddressBar.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * AddressBar component\n * This component is used to display the address bar for the operation block\n * It is used to display the path, method, server, and history for the operation\n */\nexport default {\n  name: 'AddressBar',\n}\nexport type AddressBarProps = {\n  /** Current request path */\n  path: string\n  /** Current request method */\n  method: HttpMethodType\n  /** Openapi document slug */\n  documentSlug: string\n  /** Currently selected example key for the current operation */\n  exampleKey: string\n  /** Currently selected server */\n  server: ServerObject | null\n  /** Server list available for operation/document */\n  servers: ServerObject[]\n  /** List of request history */\n  history: History[]\n  /** Client layout */\n  layout: ClientLayout\n  /** Event bus */\n  eventBus: WorkspaceEventBus\n  /** Environment */\n  environment: XScalarEnvironment\n  /** Meta information for the server */\n  serverMeta: ServerMeta\n}\n</script>\n<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarIcon,\n  ScalarWrappingText,\n} from '@scalar/components'\nimport { getSelector } from '@scalar/helpers/dom/get-selector'\nimport { REQUEST_METHODS } from '@scalar/helpers/http/http-info'\nimport type { HttpMethod as HttpMethodType } from '@scalar/helpers/http/http-methods'\nimport { replaceEnvVariables } from '@scalar/helpers/regex/replace-variables'\nimport { extractServerFromPath } from '@scalar/helpers/url/extract-server-from-path'\nimport { ScalarIconCopy, ScalarIconWarningCircle } from '@scalar/icons'\nimport { EditorView } from '@scalar/use-codemirror'\nimport { useClipboard } from '@scalar/use-hooks/useClipboard'\nimport type {\n  ApiReferenceEvents,\n  ServerMeta,\n  WorkspaceEventBus,\n} from '@scalar/workspace-store/events'\nimport {\n  getEnvironmentVariables,\n  getResolvedUrl,\n} from '@scalar/workspace-store/request-example'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type { ServerObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport {\n  computed,\n  nextTick,\n  onBeforeUnmount,\n  onMounted,\n  ref,\n  useId,\n  useTemplateRef,\n  watch,\n} from 'vue'\n\nimport { HttpMethod } from '@/components/HttpMethod'\nimport { getOperationExampleKey } from '@/v2/blocks/operation-block/helpers/response-cache'\nimport { isPlaceholderPath } from '@/v2/blocks/scalar-address-bar-block/helpers/is-placeholder-path'\nimport { refocusBlurTarget } from '@/v2/blocks/scalar-address-bar-block/helpers/refocus-blur-target'\nimport { useLoadingAnimation } from '@/v2/blocks/scalar-address-bar-block/hooks/use-loading-animation'\nimport { usePathMasking } from '@/v2/blocks/scalar-address-bar-block/hooks/use-path-masking'\nimport { CodeInput } from '@/v2/components/code-input'\nimport { ServerDropdown } from '@/v2/components/server'\nimport type { ClientLayout } from '@/v2/types/layout'\n\nimport AddressBarHistory, { type History } from './AddressBarHistory.vue'\n\nconst {\n  path,\n  method,\n  layout,\n  eventBus,\n  exampleKey,\n  documentSlug,\n  server,\n  servers,\n  environment,\n  serverMeta,\n} = defineProps<AddressBarProps>()\n\nconst emit = defineEmits<{\n  /** Execute the current operation example */\n  (e: 'execute'): void\n  /** Select a request history item by index */\n  (e: 'select:history:item', payload: { index: number }): void\n}>()\n\n// ───────────────────────────────────────────────────────────────────\n// Template refs & reactive state\n// ───────────────────────────────────────────────────────────────────\n\nconst id = useId()\nconst sendButtonRef = useTemplateRef('sendButtonRef')\nconst addressBarRef = useTemplateRef('addressBarRef')\n\nconst { percentage, startLoading, stopLoading, isLoading } =\n  useLoadingAnimation()\n\nconst pathConflict = ref<string | null>(null)\nconst methodConflict = ref<HttpMethodType | null>(null)\nconst tabbedOut = ref(false)\nconst isServerDropdownOpen = ref(false)\nconst isHistoryDropdownOpen = ref(false)\n\n// ───────────────────────────────────────────────────────────────────\n// Derived state\n// ───────────────────────────────────────────────────────────────────\n\n/** Keeps the cursor visible past the fade-right overlay while typing */\nconst addressBarScrollMargins = EditorView.scrollMargins.of(() => ({\n  right: 24,\n}))\n\n/** Animated background transform for the loading indicator */\nconst style = computed(() => ({\n  backgroundColor: `color-mix(in srgb, transparent 90%, ${REQUEST_METHODS[method].colorVar})`,\n  transform: `translate3d(-${percentage.value}%,0,0)`,\n}))\n\n/** Whether there is a path or method conflict */\nconst hasConflict = computed(() => methodConflict.value || pathConflict.value)\n\n/** Whether either dropdown (server or history) is open */\nconst isDropdownOpen = computed(\n  () => isServerDropdownOpen.value || isHistoryDropdownOpen.value,\n)\n\n/** Uniquely identifies the currently selected operation + example */\nconst uniqueKey = computed(() =>\n  getOperationExampleKey(method, path, exampleKey, documentSlug),\n)\n\n/** Clear conflict state when switching to a different operation */\nwatch(uniqueKey, () => {\n  pathConflict.value = null\n  methodConflict.value = null\n})\n\n// ───────────────────────────────────────────────────────────────────\n// Focus helpers\n// ───────────────────────────────────────────────────────────────────\n\nconst handleFocusSendButton = (): void => sendButtonRef.value?.$el?.focus()\n\nconst handleFocusAddressBar = (\n  payload: ApiReferenceEvents['ui:focus:address-bar'],\n): void => {\n  // On non-desktop layouts, if already focused we let the browser handle the\n  // native behavior (e.g. selecting the browser's own address bar).\n  if (addressBarRef.value?.isFocused && layout !== 'desktop') {\n    return\n  }\n\n  addressBarRef.value?.focus('end')\n\n  if (payload && 'clear' in payload && payload.clear) {\n    addressBarRef.value?.setCodeMirrorContent('')\n  }\n\n  if (payload && 'event' in payload) {\n    payload.event.preventDefault()\n  }\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Path masking\n//\n// Drafts on `/` and auto-generated `/_scalar_temp...` paths are internal\n// placeholders — the address bar focuses and clears on mount and on\n// navigation so the user sees a blank prompt instead of the internal\n// path. The deferred mask only clears when CodeMirror still contains that\n// placeholder path, so a user edit that lands before the frame is preserved.\n// ───────────────────────────────────────────────────────────────────\n\nusePathMasking({\n  isReady: () => addressBarRef.value?.codeMirror,\n  operationKey: () => uniqueKey.value,\n  shouldMask: () => isPlaceholderPath(path, documentSlug),\n  // Defer to the next frame so focus() runs after click-handler side\n  // effects that move focus (e.g. a dropdown refocusing its trigger),\n  // which would otherwise blur our input and emit a spurious path\n  // update against the now-empty value.\n  onMask: () =>\n    requestAnimationFrame(() => {\n      const editorContent =\n        addressBarRef.value?.codeMirror?.state.doc.toString()\n\n      if (editorContent && editorContent !== path) {\n        return\n      }\n\n      handleFocusAddressBar({ clear: true })\n    }),\n})\n\n// ───────────────────────────────────────────────────────────────────\n// Server extraction\n// ───────────────────────────────────────────────────────────────────\n\n/** If the path contains a server URL, extract it and select or add that server */\nconst extractAndSelectServer = (targetPath: string): string => {\n  const extracted = extractServerFromPath(targetPath)\n  if (!extracted) {\n    return targetPath\n  }\n\n  const [url, remainingPath] = extracted\n\n  // Server is already selected — nothing to do\n  if (url === server?.url) {\n    return remainingPath\n  }\n\n  const matchingServer = servers.find((s) => s.url === url)\n  if (matchingServer) {\n    eventBus.emit('server:update:selected', { url, meta: serverMeta })\n  } else {\n    eventBus.emit('server:add:server', {\n      url,\n      select: true,\n      meta: { type: 'operation', path, method },\n    })\n  }\n\n  return remainingPath\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Path / method updates\n// ───────────────────────────────────────────────────────────────────\n\nconst normalizePath = (value: string): string =>\n  value.startsWith('/') ? value : `/${value}`\n\n/** Emit a path/method update and reconcile conflicts + cursor state on the result */\nconst emitPathMethodUpdate = (\n  targetMethod: HttpMethodType,\n  targetPath: string,\n  blurTargetSelector: string | null = null,\n): void => {\n  const extractedPath = extractAndSelectServer(targetPath)\n  const normalizedPath = normalizePath(extractedPath)\n\n  // Keep CodeMirror in sync so a conflict does not leave a stale value on screen\n  addressBarRef.value?.setCodeMirrorContent(normalizedPath)\n\n  eventBus.emit('operation:update:pathMethod', {\n    meta: { method, path },\n    blurTargetSelector,\n    payload: { method: targetMethod, path: normalizedPath },\n    callback: (status, returnedSelector) => {\n      if (status === 'success' || status === 'no-change') {\n        methodConflict.value = null\n        pathConflict.value = null\n      } else if (status === 'conflict') {\n        if (targetMethod !== method) {\n          methodConflict.value = targetMethod\n        }\n        if (normalizedPath !== path) {\n          pathConflict.value = normalizedPath\n        }\n\n        return\n      }\n\n      // Edge case: pasting a full URL extracts the server but leaves the path\n      // unchanged. CodeMirror still shows the full URL, so force it back to\n      // just the path.\n      const mirrorContent = addressBarRef.value?.codeMirrorRef?.textContent\n      if (\n        status === 'no-change' &&\n        mirrorContent &&\n        mirrorContent !== extractedPath\n      ) {\n        addressBarRef.value?.setCodeMirrorContent(extractedPath)\n      }\n\n      nextTick(() => refocusBlurTarget(returnedSelector))\n    },\n  })\n}\n\n/** Change the operation's method, preferring the conflicting path if present */\nconst handleMethodChange = (newMethod: HttpMethodType): void =>\n  emitPathMethodUpdate(newMethod, pathConflict.value ?? path)\n\n/**\n * Save the path on blur and replay the click that caused the blur (so e.g. a\n * click on the Send button still fires after the async update resolves).\n * Tab-outs explicitly do not replay — tabbing to a button should not trigger\n * its click.\n */\nconst handlePathBlur = (newPath: string, event: FocusEvent): void => {\n  const relatedTarget = event.relatedTarget as Element | null\n  const blurTargetSelector = tabbedOut.value ? null : getSelector(relatedTarget)\n  tabbedOut.value = false\n\n  emitPathMethodUpdate(\n    methodConflict.value ?? method,\n    newPath,\n    blurTargetSelector,\n  )\n}\n\n/** Save the path on Enter and trigger the Send button after the update resolves */\nconst handlePathSubmit = (\n  newPath: string,\n  event: KeyboardEvent | FocusEvent,\n): void => {\n  // Prevent the global hotkey listener from also handling this Enter press\n  event.stopPropagation()\n\n  emitPathMethodUpdate(\n    methodConflict.value ?? method,\n    newPath,\n    '[data-addressbar-action=\"send\"]',\n  )\n}\n\n/** Unset the server when backspace is pressed on an empty path */\nconst handlePathBackspace = (event: KeyboardEvent): void => {\n  if ((event.target as HTMLElement)?.innerText === '\\n') {\n    eventBus.emit('server:update:selected', { url: '', meta: serverMeta })\n  }\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Clipboard\n// ───────────────────────────────────────────────────────────────────\n\nconst { copyToClipboard } = useClipboard()\n\n/** Copy the fully resolved URL (with environment variables applied) */\nconst copyUrl = async (): Promise<void> => {\n  const resolvedUrl = getResolvedUrl({ server, path })\n  const variables = getEnvironmentVariables(environment)\n  await copyToClipboard(replaceEnvVariables(resolvedUrl, variables))\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Navigation\n// ───────────────────────────────────────────────────────────────────\n\nconst navigateToServersPage = (): void => {\n  if (serverMeta.type === 'operation') {\n    eventBus.emit('ui:navigate', {\n      page: 'operation',\n      path: 'servers',\n      operationPath: serverMeta.path,\n      method: serverMeta.method,\n    })\n    return\n  }\n\n  eventBus.emit('ui:navigate', { page: 'document', path: 'servers' })\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Lifecycle\n// ───────────────────────────────────────────────────────────────────\n\nconst unsubscribes: Array<() => void> = []\n\nonMounted(() => {\n  unsubscribes.push(\n    eventBus.on('ui:focus:address-bar', handleFocusAddressBar),\n    eventBus.on('ui:focus:send-button', handleFocusSendButton),\n    eventBus.on('copy-url:address-bar', copyUrl),\n    eventBus.on('hooks:on:request:sent', startLoading),\n    eventBus.on('hooks:on:request:complete', stopLoading),\n  )\n})\n\nonBeforeUnmount(() => {\n  for (const unsubscribe of unsubscribes) {\n    unsubscribe()\n  }\n\n  // Prevents the loading animation from continuing after unmount\n  stopLoading()\n})\n\ndefineExpose({\n  methodConflict,\n  pathConflict,\n})\n</script>\n<template>\n  <div\n    :id=\"id\"\n    class=\"scalar-address-bar order-last flex h-(--scalar-address-bar-height) w-full [--scalar-address-bar-height:32px] lg:order-0 lg:w-auto\">\n    <!-- Address Bar -->\n    <div\n      class=\"address-bar-bg-states text-xxs group relative order-last flex w-full max-w-[calc(100dvw-24px)] flex-1 flex-row items-stretch rounded-lg p-0.75 lg:order-none lg:max-w-[580px] lg:min-w-[580px] xl:max-w-[720px] xl:min-w-[720px]\"\n      :class=\"{\n        'outline-c-danger outline': hasConflict,\n        'rounded-b-none': isDropdownOpen,\n      }\">\n      <div\n        class=\"pointer-events-none absolute top-0 left-0 block h-full w-full overflow-hidden rounded-lg border\"\n        :class=\"{\n          'rounded-b-none': isDropdownOpen,\n        }\">\n        <div\n          class=\"absolute top-0 left-0 h-full w-full\"\n          :style />\n      </div>\n      <div class=\"flex gap-1\">\n        <HttpMethod\n          :isEditable=\"layout !== 'modal'\"\n          isSquare\n          :method=\"methodConflict ?? method\"\n          teleport\n          @change=\"handleMethodChange\" />\n      </div>\n\n      <div\n        class=\"scroll-timeline-x scroll-timeline-x-hidden relative flex w-full bg-blend-normal\">\n        <!-- Servers -->\n        <ServerDropdown\n          v-if=\"servers.length\"\n          :layout=\"layout\"\n          :meta=\"serverMeta\"\n          :server=\"server\"\n          :servers=\"servers\"\n          :target=\"id\"\n          @update:open=\"(value) => (isServerDropdownOpen = value)\"\n          @update:selectedServer=\"\n            (payload) => eventBus.emit('server:update:selected', payload)\n          \"\n          @update:servers=\"navigateToServersPage\"\n          @update:variable=\"\n            (payload) => eventBus.emit('server:update:variables', payload)\n          \" />\n\n        <div class=\"fade-left\" />\n        <!-- Path + URL + env vars -->\n        <CodeInput\n          ref=\"addressBarRef\"\n          alwaysEmitChange\n          aria-label=\"Path\"\n          class=\"min-w-fit pl-px outline-none\"\n          disableCloseBrackets\n          :disabled=\"layout === 'modal'\"\n          disableEnter\n          disableTabIndent\n          :emitOnBlur=\"false\"\n          :environment=\"environment\"\n          :extensions=\"[addressBarScrollMargins]\"\n          importCurl\n          :layout=\"layout\"\n          :modelValue=\"path\"\n          :placeholder=\"server ? '' : 'Enter a URL'\"\n          server\n          @blur=\"handlePathBlur\"\n          @keydown.delete=\"handlePathBackspace\"\n          @keydown.tab=\"tabbedOut = true\"\n          @submit=\"handlePathSubmit\" />\n        <div class=\"fade-right\" />\n      </div>\n\n      <!-- Copy url button -->\n      <ScalarButton\n        class=\"hover:bg-b-3 mx-1\"\n        size=\"xs\"\n        variant=\"ghost\"\n        @click=\"copyUrl\">\n        <ScalarIconCopy />\n        <span class=\"sr-only\">Copy URL</span>\n      </ScalarButton>\n\n      <AddressBarHistory\n        :history=\"history\"\n        :target=\"id\"\n        @select:history:item=\"(payload) => emit('select:history:item', payload)\"\n        @update:open=\"(value) => (isHistoryDropdownOpen = value)\" />\n      <!-- Error message -->\n      <div\n        v-if=\"hasConflict\"\n        class=\"z-context absolute inset-x-0 top-[calc(100%+4px)] flex flex-col items-center rounded px-6\">\n        <div\n          class=\"text-c-danger bg-b-danger border-c-danger flex items-center gap-1 rounded border p-1\">\n          <ScalarIconWarningCircle size=\"sm\" />\n          <div class=\"min-w-0 flex-1\">\n            A\n            <em>{{ methodConflict?.toUpperCase() ?? method.toUpperCase() }}</em>\n            request to\n            <ScalarWrappingText :text=\"pathConflict ?? path\" />\n            already exists in this document\n          </div>\n        </div>\n      </div>\n\n      <ScalarButton\n        ref=\"sendButtonRef\"\n        class=\"relative h-auto shrink-0 overflow-hidden py-1 pr-2.5 pl-2 font-bold\"\n        data-addressbar-action=\"send\"\n        :disabled=\"isLoading\"\n        @click=\"emit('execute')\">\n        <span\n          aria-hidden=\"true\"\n          class=\"inline-flex items-center gap-1\">\n          <ScalarIcon\n            class=\"relative shrink-0 fill-current\"\n            icon=\"Play\"\n            size=\"xs\" />\n          <span class=\"text-xxs hidden lg:flex\">Send</span>\n        </span>\n        <span class=\"sr-only\">\n          Send {{ method }} request to {{ server?.url ?? '' }}{{ path }}\n        </span>\n      </ScalarButton>\n    </div>\n  </div>\n</template>\n<style scoped>\n:deep(.cm-editor) {\n  height: 100%;\n  outline: none;\n  width: 100%;\n}\n:deep(.cm-line) {\n  padding: 0;\n}\n:deep(.cm-content) {\n  padding: 0;\n  display: flex;\n  align-items: center;\n  font-size: var(--scalar-small);\n}\n.scroll-timeline-x {\n  scroll-timeline: --scroll-timeline x;\n  /* Firefox supports */\n  scroll-timeline: --scroll-timeline horizontal;\n  -ms-overflow-style: none; /* IE and Edge */\n}\n.scroll-timeline-x-hidden {\n  overflow-x: auto;\n}\n.scroll-timeline-x-hidden :deep(.cm-scroller) {\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n  padding-right: 20px;\n  overflow: auto;\n}\n.scroll-timeline-x-hidden::-webkit-scrollbar {\n  width: 0;\n  height: 0;\n  display: none;\n}\n.scroll-timeline-x-hidden :deep(.cm-scroller::-webkit-scrollbar) {\n  width: 0;\n  height: 0;\n  display: none;\n}\n.scroll-timeline-x-address {\n  line-height: 27px;\n  scrollbar-width: none; /* Firefox */\n}\n/* make clickable are to left of send button */\n.scroll-timeline-x-address:after {\n  content: '';\n  position: absolute;\n  height: 100%;\n  width: 24px;\n  right: 0;\n  cursor: text;\n}\n.scroll-timeline-x-address:empty:before {\n  content: 'Enter URL or cURL request';\n  color: var(--scalar-color-3);\n  pointer-events: none;\n}\n.fade-left,\n.fade-right {\n  content: '';\n  position: sticky;\n  height: 100%;\n  animation-name: fadein;\n  animation-duration: 1ms;\n  animation-direction: reverse;\n  animation-timeline: --scroll-timeline;\n  pointer-events: none;\n  z-index: 1;\n}\n.fade-left {\n  background: linear-gradient(\n    -90deg,\n    color-mix(in srgb, var(--scalar-address-bar-bg), transparent 100%) 0%,\n    color-mix(in srgb, var(--scalar-address-bar-bg), transparent 20%) 30%,\n    var(--scalar-address-bar-bg) 100%\n  );\n  left: -1px;\n  min-width: 6px;\n  animation-direction: normal;\n}\n.fade-right {\n  background: linear-gradient(\n    90deg,\n    color-mix(in srgb, var(--scalar-address-bar-bg), transparent 100%) 0%,\n    color-mix(in srgb, var(--scalar-address-bar-bg), transparent 20%) 30%,\n    var(--scalar-address-bar-bg) 100%\n  );\n  right: -1px;\n  min-width: 24px;\n}\n@keyframes fadein {\n  0% {\n    opacity: 0;\n  }\n  1% {\n    opacity: 1;\n  }\n}\n.address-bar-bg-states {\n  --scalar-address-bar-bg: color-mix(\n    in srgb,\n    var(--scalar-background-1),\n    var(--scalar-background-2)\n  );\n  background: var(--scalar-address-bar-bg);\n}\n.address-bar-bg-states:has(.cm-focused) {\n  --scalar-address-bar-bg: var(--scalar-background-1);\n  border-color: var(--scalar-border-color);\n  outline-width: 1px;\n  outline-style: solid;\n}\n.address-bar-bg-states:has(.cm-focused) .fade-left,\n.address-bar-bg-states:has(.cm-focused) .fade-right {\n  --scalar-address-bar-bg: var(--scalar-background-1);\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"AddressBar.vue.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-address-bar-block/components/AddressBar.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * AddressBar component\n * This component is used to display the address bar for the operation block\n * It is used to display the path, method, server, and history for the operation\n */\nexport default {\n  name: 'AddressBar',\n}\nexport type AddressBarProps = {\n  /** Current request path */\n  path: string\n  /** Current request method */\n  method: HttpMethodType\n  /** Openapi document slug */\n  documentSlug: string\n  /** Currently selected example key for the current operation */\n  exampleKey: string\n  /** Currently selected server */\n  server: ServerObject | null\n  /** Server list available for operation/document */\n  servers: ServerObject[]\n  /** List of request history */\n  history: History[]\n  /** Client layout */\n  layout: ClientLayout\n  /** Event bus */\n  eventBus: WorkspaceEventBus\n  /** Environment */\n  environment: XScalarEnvironment\n  /** Meta information for the server */\n  serverMeta: ServerMeta\n}\n</script>\n<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarIcon,\n  ScalarWrappingText,\n} from '@scalar/components'\nimport { getSelector } from '@scalar/helpers/dom/get-selector'\nimport { REQUEST_METHODS } from '@scalar/helpers/http/http-info'\nimport type { HttpMethod as HttpMethodType } from '@scalar/helpers/http/http-methods'\nimport { extractServerFromPath } from '@scalar/helpers/url/extract-server-from-path'\nimport { ScalarIconCopy, ScalarIconWarningCircle } from '@scalar/icons'\nimport { EditorView } from '@scalar/use-codemirror'\nimport type {\n  ApiReferenceEvents,\n  ServerMeta,\n  WorkspaceEventBus,\n} from '@scalar/workspace-store/events'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type { ServerObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport {\n  computed,\n  nextTick,\n  onBeforeUnmount,\n  onMounted,\n  ref,\n  useId,\n  useTemplateRef,\n  watch,\n} from 'vue'\n\nimport { HttpMethod } from '@/components/HttpMethod'\nimport { getOperationExampleKey } from '@/v2/blocks/operation-block/helpers/response-cache'\nimport { isPlaceholderPath } from '@/v2/blocks/scalar-address-bar-block/helpers/is-placeholder-path'\nimport { refocusBlurTarget } from '@/v2/blocks/scalar-address-bar-block/helpers/refocus-blur-target'\nimport { useLoadingAnimation } from '@/v2/blocks/scalar-address-bar-block/hooks/use-loading-animation'\nimport { usePathMasking } from '@/v2/blocks/scalar-address-bar-block/hooks/use-path-masking'\nimport { CodeInput } from '@/v2/components/code-input'\nimport { ServerDropdown } from '@/v2/components/server'\nimport type { ClientLayout } from '@/v2/types/layout'\n\nimport AddressBarHistory, { type History } from './AddressBarHistory.vue'\n\nconst {\n  path,\n  method,\n  layout,\n  eventBus,\n  exampleKey,\n  documentSlug,\n  server,\n  servers,\n  environment,\n  serverMeta,\n} = defineProps<AddressBarProps>()\n\nconst emit = defineEmits<{\n  /** Execute the current operation example */\n  (e: 'execute'): void\n  /** Select a request history item by index */\n  (e: 'select:history:item', payload: { index: number }): void\n}>()\n\n// ───────────────────────────────────────────────────────────────────\n// Template refs & reactive state\n// ───────────────────────────────────────────────────────────────────\n\nconst id = useId()\nconst sendButtonRef = useTemplateRef('sendButtonRef')\nconst mobileSendButtonRef = useTemplateRef('mobileSendButtonRef')\nconst addressBarRef = useTemplateRef('addressBarRef')\n\nconst { percentage, startLoading, stopLoading, isLoading } =\n  useLoadingAnimation()\n\nconst pathConflict = ref<string | null>(null)\nconst methodConflict = ref<HttpMethodType | null>(null)\nconst tabbedOut = ref(false)\nconst isServerDropdownOpen = ref(false)\nconst isHistoryDropdownOpen = ref(false)\n\n// ───────────────────────────────────────────────────────────────────\n// Derived state\n// ───────────────────────────────────────────────────────────────────\n\n/** Keeps the cursor visible past the fade-right overlay while typing */\nconst addressBarScrollMargins = EditorView.scrollMargins.of(() => ({\n  right: 24,\n}))\n\n/** Animated background transform for the loading indicator */\nconst style = computed(() => ({\n  backgroundColor: `color-mix(in srgb, transparent 90%, ${REQUEST_METHODS[method].colorVar})`,\n  transform: `translate3d(-${percentage.value}%,0,0)`,\n}))\n\n/** Whether there is a path or method conflict */\nconst hasConflict = computed(() => methodConflict.value || pathConflict.value)\n\n/** Whether either dropdown (server or history) is open */\nconst isDropdownOpen = computed(\n  () => isServerDropdownOpen.value || isHistoryDropdownOpen.value,\n)\n\n/** Uniquely identifies the currently selected operation + example */\nconst uniqueKey = computed(() =>\n  getOperationExampleKey(method, path, exampleKey, documentSlug),\n)\n\n/** Clear conflict state when switching to a different operation */\nwatch(uniqueKey, () => {\n  pathConflict.value = null\n  methodConflict.value = null\n})\n\n// ───────────────────────────────────────────────────────────────────\n// Focus helpers\n// ───────────────────────────────────────────────────────────────────\n\nconst handleFocusSendButton = (): void => {\n  const desktop = sendButtonRef.value?.$el\n  const mobile = mobileSendButtonRef.value?.$el\n\n  // Focus whichever send button is currently visible\n  if (desktop && desktop.offsetParent !== null) {\n    desktop.focus()\n  } else {\n    mobile?.focus()\n  }\n}\n\nconst handleFocusAddressBar = (\n  payload: ApiReferenceEvents['ui:focus:address-bar'],\n): void => {\n  // On non-desktop layouts, if already focused we let the browser handle the\n  // native behavior (e.g. selecting the browser's own address bar).\n  if (addressBarRef.value?.isFocused && layout !== 'desktop') {\n    return\n  }\n\n  addressBarRef.value?.focus('end')\n\n  if (payload && 'clear' in payload && payload.clear) {\n    addressBarRef.value?.setCodeMirrorContent('')\n  }\n\n  if (payload && 'event' in payload) {\n    payload.event.preventDefault()\n  }\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Path masking\n//\n// Drafts on `/` and auto-generated `/_scalar_temp...` paths are internal\n// placeholders — the address bar focuses and clears on mount and on\n// navigation so the user sees a blank prompt instead of the internal\n// path. The deferred mask only clears when CodeMirror still contains that\n// placeholder path, so a user edit that lands before the frame is preserved.\n// ───────────────────────────────────────────────────────────────────\n\nusePathMasking({\n  isReady: () => addressBarRef.value?.codeMirror,\n  operationKey: () => uniqueKey.value,\n  shouldMask: () => isPlaceholderPath(path, documentSlug),\n  // Defer to the next frame so focus() runs after click-handler side\n  // effects that move focus (e.g. a dropdown refocusing its trigger),\n  // which would otherwise blur our input and emit a spurious path\n  // update against the now-empty value.\n  onMask: () =>\n    requestAnimationFrame(() => {\n      const editorContent =\n        addressBarRef.value?.codeMirror?.state.doc.toString()\n\n      if (editorContent && editorContent !== path) {\n        return\n      }\n\n      handleFocusAddressBar({ clear: true })\n    }),\n})\n\n// ───────────────────────────────────────────────────────────────────\n// Server extraction\n// ───────────────────────────────────────────────────────────────────\n\n/** If the path contains a server URL, extract it and select or add that server */\nconst extractAndSelectServer = (targetPath: string): string => {\n  const extracted = extractServerFromPath(targetPath)\n  if (!extracted) {\n    return targetPath\n  }\n\n  const [url, remainingPath] = extracted\n\n  // Server is already selected — nothing to do\n  if (url === server?.url) {\n    return remainingPath\n  }\n\n  const matchingServer = servers.find((s) => s.url === url)\n  if (matchingServer) {\n    eventBus.emit('server:update:selected', { url, meta: serverMeta })\n  } else {\n    eventBus.emit('server:add:server', {\n      url,\n      select: true,\n      meta: { type: 'operation', path, method },\n    })\n  }\n\n  return remainingPath\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Path / method updates\n// ───────────────────────────────────────────────────────────────────\n\nconst normalizePath = (value: string): string =>\n  value.startsWith('/') ? value : `/${value}`\n\n/** Emit a path/method update and reconcile conflicts + cursor state on the result */\nconst emitPathMethodUpdate = (\n  targetMethod: HttpMethodType,\n  targetPath: string,\n  blurTargetSelector: string | null = null,\n): void => {\n  const extractedPath = extractAndSelectServer(targetPath)\n  const normalizedPath = normalizePath(extractedPath)\n\n  // Keep CodeMirror in sync so a conflict does not leave a stale value on screen\n  addressBarRef.value?.setCodeMirrorContent(normalizedPath)\n\n  eventBus.emit('operation:update:pathMethod', {\n    meta: { method, path },\n    blurTargetSelector,\n    payload: { method: targetMethod, path: normalizedPath },\n    callback: (status, returnedSelector) => {\n      if (status === 'success' || status === 'no-change') {\n        methodConflict.value = null\n        pathConflict.value = null\n      } else if (status === 'conflict') {\n        if (targetMethod !== method) {\n          methodConflict.value = targetMethod\n        }\n        if (normalizedPath !== path) {\n          pathConflict.value = normalizedPath\n        }\n\n        return\n      }\n\n      // Edge case: pasting a full URL extracts the server but leaves the path\n      // unchanged. CodeMirror still shows the full URL, so force it back to\n      // just the path.\n      const mirrorContent = addressBarRef.value?.codeMirrorRef?.textContent\n      if (\n        status === 'no-change' &&\n        mirrorContent &&\n        mirrorContent !== extractedPath\n      ) {\n        addressBarRef.value?.setCodeMirrorContent(extractedPath)\n      }\n\n      nextTick(() => refocusBlurTarget(returnedSelector))\n    },\n  })\n}\n\n/** Change the operation's method, preferring the conflicting path if present */\nconst handleMethodChange = (newMethod: HttpMethodType): void =>\n  emitPathMethodUpdate(newMethod, pathConflict.value ?? path)\n\n/**\n * Save the path on blur and replay the click that caused the blur (so e.g. a\n * click on the Send button still fires after the async update resolves).\n * Tab-outs explicitly do not replay — tabbing to a button should not trigger\n * its click.\n */\nconst handlePathBlur = (newPath: string, event: FocusEvent): void => {\n  const relatedTarget = event.relatedTarget as Element | null\n  const blurTargetSelector = tabbedOut.value ? null : getSelector(relatedTarget)\n  tabbedOut.value = false\n\n  emitPathMethodUpdate(\n    methodConflict.value ?? method,\n    newPath,\n    blurTargetSelector,\n  )\n}\n\n/** Save the path on Enter and trigger the Send button after the update resolves */\nconst handlePathSubmit = (\n  newPath: string,\n  event: KeyboardEvent | FocusEvent,\n): void => {\n  // Prevent the global hotkey listener from also handling this Enter press\n  event.stopPropagation()\n\n  emitPathMethodUpdate(\n    methodConflict.value ?? method,\n    newPath,\n    '[data-addressbar-action=\"send\"]',\n  )\n}\n\n/** Unset the server when backspace is pressed on an empty path */\nconst handlePathBackspace = (event: KeyboardEvent): void => {\n  if ((event.target as HTMLElement)?.innerText === '\\n') {\n    eventBus.emit('server:update:selected', { url: '', meta: serverMeta })\n  }\n}\n\n/** Address bar copy is handled in OperationBlock (same URL as Send). */\nconst requestCopyUrl = (): void => {\n  eventBus.emit('copy-url:address-bar')\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Navigation\n// ───────────────────────────────────────────────────────────────────\n\nconst navigateToServersPage = (): void => {\n  if (serverMeta.type === 'operation') {\n    eventBus.emit('ui:navigate', {\n      page: 'operation',\n      path: 'servers',\n      operationPath: serverMeta.path,\n      method: serverMeta.method,\n    })\n    return\n  }\n\n  eventBus.emit('ui:navigate', { page: 'document', path: 'servers' })\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Lifecycle\n// ───────────────────────────────────────────────────────────────────\n\nconst unsubscribes: Array<() => void> = []\n\nonMounted(() => {\n  unsubscribes.push(\n    eventBus.on('ui:focus:address-bar', handleFocusAddressBar),\n    eventBus.on('ui:focus:send-button', handleFocusSendButton),\n    eventBus.on('hooks:on:request:sent', startLoading),\n    eventBus.on('hooks:on:request:complete', stopLoading),\n  )\n})\n\nonBeforeUnmount(() => {\n  for (const unsubscribe of unsubscribes) {\n    unsubscribe()\n  }\n\n  // Prevents the loading animation from continuing after unmount\n  stopLoading()\n})\n\ndefineExpose({\n  methodConflict,\n  pathConflict,\n})\n</script>\n<template>\n  <!--\n    Address bar.\n\n    The wide-container layout matches the original single-row bar:\n    `[Method | URL | Copy | History | Send]`. When the surrounding\n    `@container` drops below `@3xl` the bar collapses to\n    `[URL | History]` and a second row appears beneath it with a\n    duplicate `Method`, `Copy`, and `Send` so the URL gets the full\n    container width while every action stays on the same line as the\n    send button.\n  -->\n  <div\n    class=\"order-last flex h-auto w-full max-w-3xl grow-3 flex-wrap items-stretch [--scalar-address-bar-height:32px] @3xl:order-0 @3xl:flex-nowrap\">\n    <!-- Address Bar -->\n    <div\n      :id=\"id\"\n      class=\"address-bar-bg-states text-xxs group relative flex h-(--scalar-address-bar-height) w-full flex-1 flex-row items-stretch rounded-lg p-0.75\"\n      :class=\"{\n        'outline-c-danger outline': hasConflict,\n        'rounded-b-none': isDropdownOpen,\n      }\">\n      <div\n        class=\"pointer-events-none absolute top-0 left-0 block h-full w-full overflow-hidden rounded-lg border\"\n        :class=\"{\n          'rounded-b-none': isDropdownOpen,\n        }\">\n        <div\n          class=\"absolute top-0 left-0 h-full w-full\"\n          :style />\n      </div>\n\n      <!--\n        Method, Copy, and Send are hidden in mobile mode (container\n        narrower than `@3xl`) and the duplicate buttons in the trailing\n        mobile actions row take over at that point.\n      -->\n      <div class=\"hidden @3xl:flex\">\n        <HttpMethod\n          :isEditable=\"layout !== 'modal'\"\n          isSquare\n          :method=\"methodConflict ?? method\"\n          teleport\n          @change=\"handleMethodChange\" />\n      </div>\n\n      <div\n        class=\"scroll-timeline-x scroll-timeline-x-hidden relative flex w-full bg-blend-normal\">\n        <!-- Servers -->\n        <ServerDropdown\n          v-if=\"servers.length\"\n          :layout=\"layout\"\n          :meta=\"serverMeta\"\n          :server=\"server\"\n          :servers=\"servers\"\n          :target=\"id\"\n          @update:open=\"(value) => (isServerDropdownOpen = value)\"\n          @update:selectedServer=\"\n            (payload) => eventBus.emit('server:update:selected', payload)\n          \"\n          @update:servers=\"navigateToServersPage\"\n          @update:variable=\"\n            (payload) => eventBus.emit('server:update:variables', payload)\n          \" />\n\n        <!-- Path + URL + env vars -->\n        <CodeInput\n          ref=\"addressBarRef\"\n          alwaysEmitChange\n          aria-label=\"Path\"\n          class=\"ml-1 min-w-fit pl-px outline-none\"\n          disableCloseBrackets\n          :disabled=\"layout === 'modal'\"\n          disableEnter\n          disableTabIndent\n          :emitOnBlur=\"false\"\n          :environment=\"environment\"\n          :extensions=\"[addressBarScrollMargins]\"\n          importCurl\n          :layout=\"layout\"\n          :modelValue=\"path\"\n          :placeholder=\"server ? '' : 'Enter a URL'\"\n          server\n          @blur=\"handlePathBlur\"\n          @keydown.delete=\"handlePathBackspace\"\n          @keydown.tab=\"tabbedOut = true\"\n          @submit=\"handlePathSubmit\" />\n      </div>\n\n      <!-- Copy url button -->\n      <ScalarButton\n        class=\"hover:bg-b-3 mx-1 hidden @3xl:flex\"\n        size=\"xs\"\n        variant=\"ghost\"\n        @click=\"requestCopyUrl\">\n        <ScalarIconCopy />\n        <span class=\"sr-only\">Copy URL</span>\n      </ScalarButton>\n\n      <AddressBarHistory\n        :history=\"history\"\n        :target=\"id\"\n        @select:history:item=\"(payload) => emit('select:history:item', payload)\"\n        @update:open=\"(value) => (isHistoryDropdownOpen = value)\" />\n      <!-- Error message -->\n      <div\n        v-if=\"hasConflict\"\n        class=\"z-context absolute inset-x-0 top-[calc(100%+4px)] flex flex-col items-center rounded px-6\">\n        <div\n          class=\"text-c-danger bg-b-danger border-c-danger flex items-center gap-1 rounded border p-1\">\n          <ScalarIconWarningCircle size=\"sm\" />\n          <div class=\"min-w-0 flex-1\">\n            A\n            <em>{{ methodConflict?.toUpperCase() ?? method.toUpperCase() }}</em>\n            request to\n            <ScalarWrappingText :text=\"pathConflict ?? path\" />\n            already exists in this document\n          </div>\n        </div>\n      </div>\n\n      <ScalarButton\n        ref=\"sendButtonRef\"\n        class=\"relative hidden h-auto shrink-0 overflow-hidden py-1 pr-2.5 pl-2 font-bold @3xl:flex\"\n        data-addressbar-action=\"send\"\n        :disabled=\"isLoading\"\n        @click=\"emit('execute')\">\n        <span\n          aria-hidden=\"true\"\n          class=\"inline-flex items-center gap-1\">\n          <ScalarIcon\n            class=\"relative shrink-0 fill-current\"\n            icon=\"Play\"\n            size=\"xs\" />\n          <span class=\"text-xxs flex\">Send</span>\n        </span>\n        <span class=\"sr-only\">\n          Send {{ method }} request to {{ server?.url ?? '' }}{{ path }}\n        </span>\n      </ScalarButton>\n    </div>\n\n    <!--\n      Mobile actions row. Visible by default and hidden once the\n      container reaches `@3xl`, where the duplicate Method / Copy /\n      Send buttons move back into the bar itself.\n    -->\n    <div\n      class=\"mt-2 flex h-(--scalar-address-bar-height) w-full items-stretch gap-1 @3xl:hidden\">\n      <HttpMethod\n        :isEditable=\"layout !== 'modal'\"\n        isSquare\n        :method=\"methodConflict ?? method\"\n        teleport\n        @change=\"handleMethodChange\" />\n      <ScalarButton\n        class=\"hover:bg-b-3 ml-auto\"\n        size=\"xs\"\n        variant=\"ghost\"\n        @click=\"requestCopyUrl\">\n        <ScalarIconCopy />\n        <span class=\"sr-only\">Copy URL</span>\n      </ScalarButton>\n      <ScalarButton\n        ref=\"mobileSendButtonRef\"\n        class=\"relative h-auto shrink-0 overflow-hidden py-1 pr-2.5 pl-2 font-bold\"\n        data-addressbar-action=\"send\"\n        :disabled=\"isLoading\"\n        @click=\"emit('execute')\">\n        <span\n          aria-hidden=\"true\"\n          class=\"inline-flex items-center gap-1\">\n          <ScalarIcon\n            class=\"relative shrink-0 fill-current\"\n            icon=\"Play\"\n            size=\"xs\" />\n          <span class=\"text-xxs\">Send</span>\n        </span>\n        <span class=\"sr-only\">\n          Send {{ method }} request to {{ server?.url ?? '' }}{{ path }}\n        </span>\n      </ScalarButton>\n    </div>\n  </div>\n</template>\n<style scoped>\n:deep(.cm-editor) {\n  height: 100%;\n  outline: none;\n  width: 100%;\n}\n:deep(.cm-line) {\n  padding: 0;\n}\n:deep(.cm-content) {\n  padding: 0;\n  display: flex;\n  align-items: center;\n  font-size: var(--scalar-small);\n}\n.scroll-timeline-x {\n  -ms-overflow-style: none;\n  /* Fade the URL at the viewport edges. Mask lives on the scrollport (this\n     element) rather than on `.cm-scroller`, whose width follows the URL's\n     full content and pushes the right edge off-screen when overflowing. */\n  mask-image: linear-gradient(\n    to right,\n    transparent 0,\n    black 6px,\n    black calc(100% - 24px),\n    transparent 100%\n  );\n}\n.scroll-timeline-x-hidden {\n  overflow-x: auto;\n}\n.scroll-timeline-x-hidden :deep(.cm-scroller) {\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n  padding-right: 20px;\n  overflow: auto;\n}\n.scroll-timeline-x-hidden::-webkit-scrollbar {\n  width: 0;\n  height: 0;\n  display: none;\n}\n.scroll-timeline-x-hidden :deep(.cm-scroller::-webkit-scrollbar) {\n  width: 0;\n  height: 0;\n  display: none;\n}\n.scroll-timeline-x-address {\n  line-height: 27px;\n  scrollbar-width: none; /* Firefox */\n}\n/* make clickable are to left of send button */\n.scroll-timeline-x-address:after {\n  content: '';\n  position: absolute;\n  height: 100%;\n  width: 24px;\n  right: 0;\n  cursor: text;\n}\n.scroll-timeline-x-address:empty:before {\n  content: 'Enter URL or cURL request';\n  color: var(--scalar-color-3);\n  pointer-events: none;\n}\n\n.address-bar-bg-states {\n  --scalar-address-bar-bg: color-mix(\n    in srgb,\n    var(--scalar-background-1),\n    var(--scalar-background-2)\n  );\n  background: var(--scalar-address-bar-bg);\n}\n.address-bar-bg-states:has(.cm-focused) {\n  --scalar-address-bar-bg: var(--scalar-background-1);\n  border-color: var(--scalar-border-color);\n  outline-width: 1px;\n  outline-style: solid;\n}\n</style>\n"],"mappings":""}