@scalar/api-client 2.38.4 → 2.39.1

package/dist/v2/features/collection/WorkspaceCollection.vue.script.js

@@ -0,0 +1,73 @@
+import LabelInput_default from "./components/LabelInput.vue.js";
+import Tabs_default from "./components/Tabs.vue.js";
+import { createElementBlock, createElementVNode, createVNode, defineComponent, mergeProps, openBlock, ref, unref, watch } from "vue";
+import { RouterView } from "vue-router";
+//#region src/v2/features/collection/WorkspaceCollection.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "custom-scroll h-full" };
+var _hoisted_2 = { class: "w-full px-3 md:mx-auto md:max-w-180" };
+var _hoisted_3 = ["aria-label"];
+var _hoisted_4 = { class: "group relative ml-1.25" };
+var _hoisted_5 = { class: "px-1.5 py-8" };
+var WorkspaceCollection_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "WorkspaceCollection",
+	props: {
+		documentSlug: {},
+		document: {},
+		eventBus: {},
+		layout: {},
+		path: {},
+		method: {},
+		exampleName: {},
+		environment: {},
+		securitySchemes: {},
+		workspaceStore: {},
+		activeWorkspace: {},
+		plugins: {},
+		customThemes: {},
+		currentTheme: {},
+		isDarkMode: { type: Boolean },
+		fetchRegistryDocument: { type: Function },
+		telemetry: { type: Boolean },
+		onUpdateTelemetry: { type: Function }
+	},
+	setup(__props) {
+		const props = __props;
+		/**
+		* Local copy of the label so we can reset on empty-blur rejection and stay in
+		* sync when Vue Router reuses this component across workspace navigations.
+		*/
+		const workspaceTitle = ref(props.activeWorkspace.label);
+		watch(() => props.activeWorkspace.label, (newLabel) => {
+			workspaceTitle.value = newLabel;
+		});
+		/** Emits the rename event on blur, or resets the input if the title is blank. */
+		const handleUpdateWorkspaceTitle = (title) => {
+			if (title.trim() === "") {
+				workspaceTitle.value = props.activeWorkspace.label;
+				return;
+			}
+			props.eventBus.emit("workspace:update:name", title);
+		};
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", _hoisted_1, [createElementVNode("div", _hoisted_2, [
+				createElementVNode("div", {
+					"aria-label": `title: ${__props.activeWorkspace.label}`,
+					class: "mx-auto flex h-fit w-full flex-row items-center gap-2 pt-14 pb-3 md:max-w-180 md:pt-6"
+				}, [createElementVNode("div", _hoisted_4, [createVNode(LabelInput_default, {
+					modelValue: workspaceTitle.value,
+					"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => workspaceTitle.value = $event),
+					class: "text-xl font-bold",
+					inputId: "workspaceName",
+					placeholder: "Untitled Workspace",
+					onBlur: handleUpdateWorkspaceTitle
+				}, null, 8, ["modelValue"])])], 8, _hoisted_3),
+				createVNode(Tabs_default, { type: "workspace" }),
+				createElementVNode("div", _hoisted_5, [createVNode(unref(RouterView), mergeProps(props, { collectionType: "workspace" }), null, 16)])
+			])]);
+		};
+	}
+});
+//#endregion
+export { WorkspaceCollection_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=WorkspaceCollection.vue.script.js.map

package/dist/v2/features/collection/WorkspaceCollection.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WorkspaceCollection.vue.script.js","names":[],"sources":["../../../../src/v2/features/collection/WorkspaceCollection.vue"],"sourcesContent":["<script lang=\"ts\">\n/** Document collection page — tabs for Overview, Servers, Auth, Environment, Cookies, and Settings. */\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, watch } from 'vue'\nimport { RouterView } from 'vue-router'\n\nimport type { RouteProps } from '@/v2/features/app/helpers/routes'\nimport LabelInput from '@/v2/features/collection/components/LabelInput.vue'\n\nimport Tabs from './components/Tabs.vue'\n\nconst props = defineProps<RouteProps>()\n\n/**\n * Local copy of the label so we can reset on empty-blur rejection and stay in\n * sync when Vue Router reuses this component across workspace navigations.\n */\nconst workspaceTitle = ref(props.activeWorkspace.label)\n\nwatch(\n  () => props.activeWorkspace.label,\n  (newLabel) => {\n    workspaceTitle.value = newLabel\n  },\n)\n\n/** Emits the rename event on blur, or resets the input if the title is blank. */\nconst handleUpdateWorkspaceTitle = (title: string) => {\n  if (title.trim() === '') {\n    // Force defineModel inside LabelInput to re-sync to the original value.\n    workspaceTitle.value = props.activeWorkspace.label\n    return\n  }\n  props.eventBus.emit('workspace:update:name', title)\n}\n</script>\n\n<template>\n  <div class=\"custom-scroll h-full\">\n    <div class=\"w-full px-3 md:mx-auto md:max-w-180\">\n      <!-- Header -->\n      <div\n        :aria-label=\"`title: ${activeWorkspace.label}`\"\n        class=\"mx-auto flex h-fit w-full flex-row items-center gap-2 pt-14 pb-3 md:max-w-180 md:pt-6\">\n        <div class=\"group relative ml-1.25\">\n          <LabelInput\n            v-model=\"workspaceTitle\"\n            class=\"text-xl font-bold\"\n            inputId=\"workspaceName\"\n            placeholder=\"Untitled Workspace\"\n            @blur=\"handleUpdateWorkspaceTitle\" />\n        </div>\n      </div>\n\n      <!-- Tabs -->\n      <Tabs type=\"workspace\" />\n\n      <!-- Router views -->\n      <div class=\"px-1.5 py-8\">\n        <RouterView\n          v-bind=\"props\"\n          collectionType=\"workspace\" />\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAcA,MAAM,QAAQ;;;;;EAMd,MAAM,iBAAiB,IAAI,MAAM,gBAAgB,MAAK;AAEtD,cACQ,MAAM,gBAAgB,QAC3B,aAAa;AACZ,kBAAe,QAAQ;IAE3B;;EAGA,MAAM,8BAA8B,UAAkB;AACpD,OAAI,MAAM,MAAM,KAAK,IAAI;AAEvB,mBAAe,QAAQ,MAAM,gBAAgB;AAC7C;;AAEF,SAAM,SAAS,KAAK,yBAAyB,MAAK;;;uBAKlD,mBA0BM,OA1BN,YA0BM,CAzBJ,mBAwBM,OAxBN,YAwBM;IAtBJ,mBAWM,OAAA;KAVH,cAAU,UAAY,QAAA,gBAAgB;KACvC,OAAM;QACN,mBAOM,OAPN,YAOM,CANJ,YAKuC,oBAAA;iBAJ5B,eAAA;iFAAc,QAAA;KACvB,OAAM;KACN,SAAQ;KACR,aAAY;KACX,QAAM;;IAKb,YAAyB,cAAA,EAAnB,MAAK,aAAW,CAAA;IAGtB,mBAIM,OAJN,YAIM,CAHJ,YAE+B,MAAA,WAAA,EAF/B,WACU,OAAK,EACb,gBAAe,aAAW,CAAA,EAAA,MAAA,GAAA,CAAA,CAAA"}

package/dist/v2/features/collection/components/Authentication.vue.d.ts

@@ -1,13 +1,13 @@
-declare const __VLS_export: import("vue").DefineComponent<(import("../../../../v2/features/app/helpers/routes").RouteProps & {
+declare const __VLS_export: import("vue").DefineComponent<(import("../../../../v2/features/app/helpers/routes.js").RouteProps & {
     collectionType: "document" | "operation";
     document: import("@scalar/workspace-store/schemas").WorkspaceDocument;
-}) | (import("../../../../v2/features/app/helpers/routes").RouteProps & {
+}) | (import("../../../../v2/features/app/helpers/routes.js").RouteProps & {
     collectionType: "workspace";
     document: null;
-}), {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<(import("../../../../v2/features/app/helpers/routes").RouteProps & {
+}), {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<(import("../../../../v2/features/app/helpers/routes.js").RouteProps & {
     collectionType: "document" | "operation";
     document: import("@scalar/workspace-store/schemas").WorkspaceDocument;
-}) | (import("../../../../v2/features/app/helpers/routes").RouteProps & {
+}) | (import("../../../../v2/features/app/helpers/routes.js").RouteProps & {
     collectionType: "workspace";
     document: null;
 })> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/v2/features/collection/components/Authentication.vue.js

@@ -0,0 +1,9 @@
+import _plugin_vue_export_helper_default from "../../../../_virtual/_plugin-vue_export-helper.js";
+import Authentication_vue_vue_type_script_setup_true_lang_default from "./Authentication.vue.script.js";
+/* empty css                             */
+//#region src/v2/features/collection/components/Authentication.vue
+var Authentication_default = /* @__PURE__ */ _plugin_vue_export_helper_default(Authentication_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-e82ac4e8"]]);
+//#endregion
+export { Authentication_default as default };
+
+//# sourceMappingURL=Authentication.vue.js.map

package/dist/v2/features/collection/components/Authentication.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Authentication.vue.js","names":[],"sources":["../../../../../src/v2/features/collection/components/Authentication.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarToggle } from '@scalar/components'\nimport { isHttpMethod } from '@scalar/helpers/http/is-http-method'\nimport type { AuthMeta } from '@scalar/workspace-store/events'\nimport { getResolvedRef } from '@scalar/workspace-store/helpers/get-resolved-ref'\nimport { unpackProxyObject } from '@scalar/workspace-store/helpers/unpack-proxy'\nimport { computed, ref, watchEffect } from 'vue'\n\nimport { AuthSelector } from '@/v2/blocks/scalar-auth-selector-block'\nimport type { CollectionProps } from '@/v2/features/app/helpers/routes'\nimport { getDefaultOperationSecurityToggle } from '@/v2/features/collection/helpers/get-default-operation-security-toggle'\nimport { getSelectedSecurity } from '@/v2/features/operation'\nimport Section from '@/v2/features/settings/components/Section.vue'\nimport { getServers } from '@/v2/helpers'\nimport { getActiveProxyUrl } from '@/v2/helpers/get-active-proxy-url'\n\nconst {\n  document,\n  eventBus,\n  environment,\n  securitySchemes,\n  workspaceStore,\n  documentSlug,\n  path,\n  method,\n  collectionType,\n  layout,\n} = defineProps<CollectionProps>()\n\n/**\n * Compute the authentication metadata based on the current collection type.\n * If we're working with an operation, include its path and method; otherwise, use the document scope.\n */\nconst authMeta = computed<AuthMeta>(() => {\n  if (collectionType === 'operation') {\n    return {\n      type: 'operation',\n      path: path ?? '',\n      method: method ?? 'get',\n    }\n  }\n  return { type: 'document' }\n})\n\n/**\n * Compute the operation object based on the current collection type.\n */\nconst operation = computed(() => {\n  if (collectionType === 'operation') {\n    // Operation not found\n    if (!path || !isHttpMethod(method)) {\n      return null\n    }\n    // Operation found, return the servers\n    return getResolvedRef(document?.paths?.[path]?.[method])\n  }\n  return null\n})\n\n/**\n * If enabled we use/set the selected security schemes on the operation level\n */\nconst useOperationSecurity = ref(false)\nwatchEffect(() => {\n  useOperationSecurity.value = getDefaultOperationSecurityToggle({\n    authStore: workspaceStore.auth,\n    documentName: documentSlug,\n    ...authMeta.value,\n  })\n})\n\n/** Resolved selected security for the current collection (operation or document), with defaults applied */\nconst selectedSecurity = computed(() => {\n  if (collectionType === 'operation') {\n    const fromStore = workspaceStore.auth.getAuthSelectedSchemas({\n      type: 'operation',\n      documentName: documentSlug,\n      path: path ?? '',\n      method: method ?? 'get',\n    })\n    return getSelectedSecurity(\n      undefined,\n      fromStore,\n      operation.value?.security ?? [],\n      securitySchemes,\n    )\n  }\n  const fromStore = workspaceStore.auth.getAuthSelectedSchemas({\n    type: 'document',\n    documentName: documentSlug,\n  })\n  return getSelectedSecurity(\n    fromStore,\n    undefined,\n    document?.security ?? [],\n    securitySchemes,\n  )\n})\n\n/** Compute the security requirements for the operation or document based on the current collection type */\nconst securityRequirements = computed(() => {\n  if (collectionType === 'operation') {\n    return operation.value?.security ?? []\n  }\n  return document?.security ?? []\n})\n\n/** Compute the proxy URL for the current layout (for the electron we don't want to use the proxy by default) */\nconst proxyUrl = computed(\n  () =>\n    getActiveProxyUrl(\n      workspaceStore.workspace['x-scalar-active-proxy'],\n      layout,\n    ) ?? '',\n)\n\nconst servers = computed(() => {\n  return getServers(operation.value?.servers ?? document?.servers, {\n    documentUrl: document?.['x-scalar-original-source-url'],\n  })\n})\n\n/** Grab the currently selected server for relative auth URIs */\nconst server = computed(() => {\n  const documentServer = document?.['x-scalar-selected-server']\n  const operationServer = operation.value?.['x-scalar-selected-server']\n  const selectedServerUrl = operationServer ?? documentServer\n  return (\n    servers.value.find(({ url }) => url === selectedServerUrl) ??\n    servers.value[0] ??\n    null\n  )\n})\n\n/**\n * Handles toggling operation-level security authentication. (Only for operation collections)\n * When enabled (`value` is true), overrides document-level authentication for the current operation.\n * When disabled (`value` is false), reverts to using document-level authentication instead.\n */\nconst handleToggleOperationSecurity = (value: boolean) => {\n  if (authMeta.value.type !== 'operation') {\n    return\n  }\n\n  useOperationSecurity.value = value\n\n  if (value) {\n    // Use the same resolved selection as the UI; unpack so the event payload is plain objects\n    const { selectedSchemes } = selectedSecurity.value\n    return eventBus.emit('auth:update:selected-security-schemes', {\n      selectedRequirements: unpackProxyObject(selectedSchemes, { depth: 1 }),\n      newSchemes: [],\n      meta: authMeta.value,\n    })\n  }\n\n  // Clear the operation security so document level authentication is used\n  return eventBus.emit('auth:clear:selected-security-schemes', {\n    meta: authMeta.value,\n  })\n}\n</script>\n\n<template>\n  <Section>\n    <template #title>Authentication</template>\n    <template #description>\n      <template v-if=\"collectionType === 'operation'\">\n        <span class=\"block\">\n          Override authentication for this operation with the toggle.\n        </span>\n        <span class=\"mt-1 block\">\n          <strong>On</strong> — Authentication below applies only to this\n          operation.\n        </span>\n        <span class=\"mt-1 block\">\n          <strong>Off</strong> — This operation uses document-level\n          authentication from the OpenAPI spec.\n        </span>\n      </template>\n      <template v-else>\n        Configure authentication for this document. Selected authentication\n        applies to all operations unless overridden at the operation level.\n      </template>\n    </template>\n    <template\n      v-if=\"collectionType === 'operation'\"\n      #actions>\n      <div class=\"flex h-8 items-center\">\n        <ScalarToggle\n          class=\"w-4\"\n          :modelValue=\"useOperationSecurity\"\n          @update:modelValue=\"handleToggleOperationSecurity\" />\n      </div>\n    </template>\n\n    <!-- Auth Selector -->\n    <div\n      :class=\"\n        collectionType === 'operation' &&\n        !useOperationSecurity &&\n        'cursor-not-allowed'\n      \">\n      <AuthSelector\n        class=\"scalar-collection-auth border-none!\"\n        :class=\"\n          collectionType === 'operation' &&\n          !useOperationSecurity &&\n          'pointer-events-none opacity-50 mix-blend-luminosity'\n        \"\n        :createAnySecurityScheme=\"true\"\n        :environment\n        :eventBus=\"eventBus\"\n        isStatic\n        :meta=\"authMeta\"\n        :proxyUrl=\"proxyUrl\"\n        :securityRequirements=\"securityRequirements\"\n        :securitySchemes\n        :selectedSecurity=\"selectedSecurity\"\n        :server\n        title=\"Authentication\" />\n    </div>\n  </Section>\n</template>\n<style scoped>\n.scalar-collection-auth {\n  border: var(--scalar-border-width) solid var(--scalar-border-color);\n  border-radius: var(--scalar-radius-lg);\n  overflow: hidden;\n}\n</style>\n"],"mappings":""}

package/dist/v2/features/collection/components/Authentication.vue.script.js

@@ -0,0 +1,166 @@
+import AuthSelector_default from "../../../blocks/scalar-auth-selector-block/components/AuthSelector.vue.js";
+import { getSelectedSecurity } from "../../operation/helpers/get-selected-security.js";
+import { getActiveProxyUrl } from "../../../helpers/get-active-proxy-url.js";
+import { getServers } from "../../../helpers/get-servers.js";
+import { getDefaultOperationSecurityToggle } from "../helpers/get-default-operation-security-toggle.js";
+import Section_default from "../../settings/components/Section.vue.js";
+import { Fragment, computed, createBlock, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, ref, unref, watchEffect, withCtx } from "vue";
+import { ScalarToggle } from "@scalar/components";
+import { getResolvedRef } from "@scalar/workspace-store/helpers/get-resolved-ref";
+import { unpackProxyObject } from "@scalar/workspace-store/helpers/unpack-proxy";
+import { isHttpMethod } from "@scalar/helpers/http/is-http-method";
+//#region src/v2/features/collection/components/Authentication.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "flex h-8 items-center" };
+var Authentication_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "Authentication",
+	props: {
+		documentSlug: {},
+		document: {},
+		eventBus: {},
+		layout: {},
+		path: {},
+		method: {},
+		exampleName: {},
+		environment: {},
+		securitySchemes: {},
+		workspaceStore: {},
+		activeWorkspace: {},
+		plugins: {},
+		customThemes: {},
+		currentTheme: {},
+		isDarkMode: { type: Boolean },
+		fetchRegistryDocument: { type: Function },
+		telemetry: { type: Boolean },
+		onUpdateTelemetry: { type: Function },
+		collectionType: {}
+	},
+	setup(__props) {
+		/**
+		* Compute the authentication metadata based on the current collection type.
+		* If we're working with an operation, include its path and method; otherwise, use the document scope.
+		*/
+		const authMeta = computed(() => {
+			if (__props.collectionType === "operation") return {
+				type: "operation",
+				path: __props.path ?? "",
+				method: __props.method ?? "get"
+			};
+			return { type: "document" };
+		});
+		/**
+		* Compute the operation object based on the current collection type.
+		*/
+		const operation = computed(() => {
+			if (__props.collectionType === "operation") {
+				if (!__props.path || !isHttpMethod(__props.method)) return null;
+				return getResolvedRef(__props.document?.paths?.[__props.path]?.[__props.method]);
+			}
+			return null;
+		});
+		/**
+		* If enabled we use/set the selected security schemes on the operation level
+		*/
+		const useOperationSecurity = ref(false);
+		watchEffect(() => {
+			useOperationSecurity.value = getDefaultOperationSecurityToggle({
+				authStore: __props.workspaceStore.auth,
+				documentName: __props.documentSlug,
+				...authMeta.value
+			});
+		});
+		/** Resolved selected security for the current collection (operation or document), with defaults applied */
+		const selectedSecurity = computed(() => {
+			if (__props.collectionType === "operation") return getSelectedSecurity(void 0, __props.workspaceStore.auth.getAuthSelectedSchemas({
+				type: "operation",
+				documentName: __props.documentSlug,
+				path: __props.path ?? "",
+				method: __props.method ?? "get"
+			}), operation.value?.security ?? [], __props.securitySchemes);
+			return getSelectedSecurity(__props.workspaceStore.auth.getAuthSelectedSchemas({
+				type: "document",
+				documentName: __props.documentSlug
+			}), void 0, __props.document?.security ?? [], __props.securitySchemes);
+		});
+		/** Compute the security requirements for the operation or document based on the current collection type */
+		const securityRequirements = computed(() => {
+			if (__props.collectionType === "operation") return operation.value?.security ?? [];
+			return __props.document?.security ?? [];
+		});
+		/** Compute the proxy URL for the current layout (for the electron we don't want to use the proxy by default) */
+		const proxyUrl = computed(() => getActiveProxyUrl(__props.workspaceStore.workspace["x-scalar-active-proxy"], __props.layout) ?? "");
+		const servers = computed(() => {
+			return getServers(operation.value?.servers ?? __props.document?.servers, { documentUrl: __props.document?.["x-scalar-original-source-url"] });
+		});
+		/** Grab the currently selected server for relative auth URIs */
+		const server = computed(() => {
+			const documentServer = __props.document?.["x-scalar-selected-server"];
+			const selectedServerUrl = operation.value?.["x-scalar-selected-server"] ?? documentServer;
+			return servers.value.find(({ url }) => url === selectedServerUrl) ?? servers.value[0] ?? null;
+		});
+		/**
+		* Handles toggling operation-level security authentication. (Only for operation collections)
+		* When enabled (`value` is true), overrides document-level authentication for the current operation.
+		* When disabled (`value` is false), reverts to using document-level authentication instead.
+		*/
+		const handleToggleOperationSecurity = (value) => {
+			if (authMeta.value.type !== "operation") return;
+			useOperationSecurity.value = value;
+			if (value) {
+				const { selectedSchemes } = selectedSecurity.value;
+				return __props.eventBus.emit("auth:update:selected-security-schemes", {
+					selectedRequirements: unpackProxyObject(selectedSchemes, { depth: 1 }),
+					newSchemes: [],
+					meta: authMeta.value
+				});
+			}
+			return __props.eventBus.emit("auth:clear:selected-security-schemes", { meta: authMeta.value });
+		};
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(Section_default, null, createSlots({
+				title: withCtx(() => [_cache[0] || (_cache[0] = createTextVNode("Authentication", -1))]),
+				description: withCtx(() => [__props.collectionType === "operation" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+					_cache[1] || (_cache[1] = createElementVNode("span", { class: "block" }, " Override authentication for this operation with the toggle. ", -1)),
+					_cache[2] || (_cache[2] = createElementVNode("span", { class: "mt-1 block" }, [createElementVNode("strong", null, "On"), createTextVNode(" — Authentication below applies only to this operation. ")], -1)),
+					_cache[3] || (_cache[3] = createElementVNode("span", { class: "mt-1 block" }, [createElementVNode("strong", null, "Off"), createTextVNode(" — This operation uses document-level authentication from the OpenAPI spec. ")], -1))
+				], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createTextVNode(" Configure authentication for this document. Selected authentication applies to all operations unless overridden at the operation level. ")], 64))]),
+				default: withCtx(() => [createElementVNode("div", { class: normalizeClass(__props.collectionType === "operation" && !useOperationSecurity.value && "cursor-not-allowed") }, [createVNode(unref(AuthSelector_default), {
+					class: normalizeClass(["scalar-collection-auth border-none!", __props.collectionType === "operation" && !useOperationSecurity.value && "pointer-events-none opacity-50 mix-blend-luminosity"]),
+					createAnySecurityScheme: true,
+					environment: __props.environment,
+					eventBus: __props.eventBus,
+					isStatic: "",
+					meta: authMeta.value,
+					proxyUrl: proxyUrl.value,
+					securityRequirements: securityRequirements.value,
+					securitySchemes: __props.securitySchemes,
+					selectedSecurity: selectedSecurity.value,
+					server: server.value,
+					title: "Authentication"
+				}, null, 8, [
+					"class",
+					"environment",
+					"eventBus",
+					"meta",
+					"proxyUrl",
+					"securityRequirements",
+					"securitySchemes",
+					"selectedSecurity",
+					"server"
+				])], 2)]),
+				_: 2
+			}, [__props.collectionType === "operation" ? {
+				name: "actions",
+				fn: withCtx(() => [createElementVNode("div", _hoisted_1, [createVNode(unref(ScalarToggle), {
+					class: "w-4",
+					modelValue: useOperationSecurity.value,
+					"onUpdate:modelValue": handleToggleOperationSecurity
+				}, null, 8, ["modelValue"])])]),
+				key: "0"
+			} : void 0]), 1024);
+		};
+	}
+});
+//#endregion
+export { Authentication_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=Authentication.vue.script.js.map

package/dist/v2/features/collection/components/Authentication.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Authentication.vue.script.js","names":[],"sources":["../../../../../src/v2/features/collection/components/Authentication.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarToggle } from '@scalar/components'\nimport { isHttpMethod } from '@scalar/helpers/http/is-http-method'\nimport type { AuthMeta } from '@scalar/workspace-store/events'\nimport { getResolvedRef } from '@scalar/workspace-store/helpers/get-resolved-ref'\nimport { unpackProxyObject } from '@scalar/workspace-store/helpers/unpack-proxy'\nimport { computed, ref, watchEffect } from 'vue'\n\nimport { AuthSelector } from '@/v2/blocks/scalar-auth-selector-block'\nimport type { CollectionProps } from '@/v2/features/app/helpers/routes'\nimport { getDefaultOperationSecurityToggle } from '@/v2/features/collection/helpers/get-default-operation-security-toggle'\nimport { getSelectedSecurity } from '@/v2/features/operation'\nimport Section from '@/v2/features/settings/components/Section.vue'\nimport { getServers } from '@/v2/helpers'\nimport { getActiveProxyUrl } from '@/v2/helpers/get-active-proxy-url'\n\nconst {\n  document,\n  eventBus,\n  environment,\n  securitySchemes,\n  workspaceStore,\n  documentSlug,\n  path,\n  method,\n  collectionType,\n  layout,\n} = defineProps<CollectionProps>()\n\n/**\n * Compute the authentication metadata based on the current collection type.\n * If we're working with an operation, include its path and method; otherwise, use the document scope.\n */\nconst authMeta = computed<AuthMeta>(() => {\n  if (collectionType === 'operation') {\n    return {\n      type: 'operation',\n      path: path ?? '',\n      method: method ?? 'get',\n    }\n  }\n  return { type: 'document' }\n})\n\n/**\n * Compute the operation object based on the current collection type.\n */\nconst operation = computed(() => {\n  if (collectionType === 'operation') {\n    // Operation not found\n    if (!path || !isHttpMethod(method)) {\n      return null\n    }\n    // Operation found, return the servers\n    return getResolvedRef(document?.paths?.[path]?.[method])\n  }\n  return null\n})\n\n/**\n * If enabled we use/set the selected security schemes on the operation level\n */\nconst useOperationSecurity = ref(false)\nwatchEffect(() => {\n  useOperationSecurity.value = getDefaultOperationSecurityToggle({\n    authStore: workspaceStore.auth,\n    documentName: documentSlug,\n    ...authMeta.value,\n  })\n})\n\n/** Resolved selected security for the current collection (operation or document), with defaults applied */\nconst selectedSecurity = computed(() => {\n  if (collectionType === 'operation') {\n    const fromStore = workspaceStore.auth.getAuthSelectedSchemas({\n      type: 'operation',\n      documentName: documentSlug,\n      path: path ?? '',\n      method: method ?? 'get',\n    })\n    return getSelectedSecurity(\n      undefined,\n      fromStore,\n      operation.value?.security ?? [],\n      securitySchemes,\n    )\n  }\n  const fromStore = workspaceStore.auth.getAuthSelectedSchemas({\n    type: 'document',\n    documentName: documentSlug,\n  })\n  return getSelectedSecurity(\n    fromStore,\n    undefined,\n    document?.security ?? [],\n    securitySchemes,\n  )\n})\n\n/** Compute the security requirements for the operation or document based on the current collection type */\nconst securityRequirements = computed(() => {\n  if (collectionType === 'operation') {\n    return operation.value?.security ?? []\n  }\n  return document?.security ?? []\n})\n\n/** Compute the proxy URL for the current layout (for the electron we don't want to use the proxy by default) */\nconst proxyUrl = computed(\n  () =>\n    getActiveProxyUrl(\n      workspaceStore.workspace['x-scalar-active-proxy'],\n      layout,\n    ) ?? '',\n)\n\nconst servers = computed(() => {\n  return getServers(operation.value?.servers ?? document?.servers, {\n    documentUrl: document?.['x-scalar-original-source-url'],\n  })\n})\n\n/** Grab the currently selected server for relative auth URIs */\nconst server = computed(() => {\n  const documentServer = document?.['x-scalar-selected-server']\n  const operationServer = operation.value?.['x-scalar-selected-server']\n  const selectedServerUrl = operationServer ?? documentServer\n  return (\n    servers.value.find(({ url }) => url === selectedServerUrl) ??\n    servers.value[0] ??\n    null\n  )\n})\n\n/**\n * Handles toggling operation-level security authentication. (Only for operation collections)\n * When enabled (`value` is true), overrides document-level authentication for the current operation.\n * When disabled (`value` is false), reverts to using document-level authentication instead.\n */\nconst handleToggleOperationSecurity = (value: boolean) => {\n  if (authMeta.value.type !== 'operation') {\n    return\n  }\n\n  useOperationSecurity.value = value\n\n  if (value) {\n    // Use the same resolved selection as the UI; unpack so the event payload is plain objects\n    const { selectedSchemes } = selectedSecurity.value\n    return eventBus.emit('auth:update:selected-security-schemes', {\n      selectedRequirements: unpackProxyObject(selectedSchemes, { depth: 1 }),\n      newSchemes: [],\n      meta: authMeta.value,\n    })\n  }\n\n  // Clear the operation security so document level authentication is used\n  return eventBus.emit('auth:clear:selected-security-schemes', {\n    meta: authMeta.value,\n  })\n}\n</script>\n\n<template>\n  <Section>\n    <template #title>Authentication</template>\n    <template #description>\n      <template v-if=\"collectionType === 'operation'\">\n        <span class=\"block\">\n          Override authentication for this operation with the toggle.\n        </span>\n        <span class=\"mt-1 block\">\n          <strong>On</strong> — Authentication below applies only to this\n          operation.\n        </span>\n        <span class=\"mt-1 block\">\n          <strong>Off</strong> — This operation uses document-level\n          authentication from the OpenAPI spec.\n        </span>\n      </template>\n      <template v-else>\n        Configure authentication for this document. Selected authentication\n        applies to all operations unless overridden at the operation level.\n      </template>\n    </template>\n    <template\n      v-if=\"collectionType === 'operation'\"\n      #actions>\n      <div class=\"flex h-8 items-center\">\n        <ScalarToggle\n          class=\"w-4\"\n          :modelValue=\"useOperationSecurity\"\n          @update:modelValue=\"handleToggleOperationSecurity\" />\n      </div>\n    </template>\n\n    <!-- Auth Selector -->\n    <div\n      :class=\"\n        collectionType === 'operation' &&\n        !useOperationSecurity &&\n        'cursor-not-allowed'\n      \">\n      <AuthSelector\n        class=\"scalar-collection-auth border-none!\"\n        :class=\"\n          collectionType === 'operation' &&\n          !useOperationSecurity &&\n          'pointer-events-none opacity-50 mix-blend-luminosity'\n        \"\n        :createAnySecurityScheme=\"true\"\n        :environment\n        :eventBus=\"eventBus\"\n        isStatic\n        :meta=\"authMeta\"\n        :proxyUrl=\"proxyUrl\"\n        :securityRequirements=\"securityRequirements\"\n        :securitySchemes\n        :selectedSecurity=\"selectedSecurity\"\n        :server\n        title=\"Authentication\" />\n    </div>\n  </Section>\n</template>\n<style scoped>\n.scalar-collection-auth {\n  border: var(--scalar-border-width) solid var(--scalar-border-color);\n  border-radius: var(--scalar-radius-lg);\n  overflow: hidden;\n}\n</style>\n"],"mappings":"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"}

package/dist/v2/features/collection/components/Cookies.vue.d.ts

@@ -5,16 +5,16 @@
  */
 declare const _default: typeof __VLS_export;
 export default _default;
-declare const __VLS_export: import("vue").DefineComponent<(import("../../../../v2/features/app/helpers/routes").RouteProps & {
+declare const __VLS_export: import("vue").DefineComponent<(import("../../../../v2/features/app/helpers/routes.js").RouteProps & {
     collectionType: "document" | "operation";
     document: import("@scalar/workspace-store/schemas").WorkspaceDocument;
-}) | (import("../../../../v2/features/app/helpers/routes").RouteProps & {
+}) | (import("../../../../v2/features/app/helpers/routes.js").RouteProps & {
     collectionType: "workspace";
     document: null;
-}), {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<(import("../../../../v2/features/app/helpers/routes").RouteProps & {
+}), {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<(import("../../../../v2/features/app/helpers/routes.js").RouteProps & {
     collectionType: "document" | "operation";
     document: import("@scalar/workspace-store/schemas").WorkspaceDocument;
-}) | (import("../../../../v2/features/app/helpers/routes").RouteProps & {
+}) | (import("../../../../v2/features/app/helpers/routes.js").RouteProps & {
     collectionType: "workspace";
     document: null;
 })> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/v2/features/collection/components/Cookies.vue.js

@@ -0,0 +1,7 @@
+import Cookies_vue_vue_type_script_setup_true_lang_default from "./Cookies.vue.script.js";
+//#region src/v2/features/collection/components/Cookies.vue
+var Cookies_default = Cookies_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { Cookies_default as default };
+
+//# sourceMappingURL=Cookies.vue.js.map

package/dist/v2/features/collection/components/Cookies.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Cookies.vue.js","names":[],"sources":["../../../../../src/v2/features/collection/components/Cookies.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Cookies section for the collection.\n * Renders document or workspace cookies and lets users manage key-value data\n * sent with API requests (e.g. session tokens, auth, preferences).\n */\nexport default {\n  name: 'Cookies',\n}\n</script>\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nimport type { CollectionProps } from '@/v2/features/app/helpers/routes'\nimport { CookiesTable } from '@/v2/features/global-cookies'\nimport Section from '@/v2/features/settings/components/Section.vue'\n\nconst { collectionType, eventBus, document, workspaceStore } =\n  defineProps<CollectionProps>()\n\nconst cookies = computed(() => {\n  return (\n    (collectionType === 'document'\n      ? document['x-scalar-cookies']\n      : workspaceStore.workspace['x-scalar-cookies']) ?? []\n  )\n})\n</script>\n\n<template>\n  <Section v-if=\"collectionType !== 'operation'\">\n    <template #title>Cookies</template>\n    <template #description>\n      Manage your collection's cookies here.<br />Cookies allow you to store and\n      send key-value data with your API requests—often used for things like\n      session tokens, authentication, and saving user preferences.<br />\n    </template>\n    <CookiesTable\n      :collectionType=\"collectionType\"\n      :cookies=\"cookies\"\n      :eventBus=\"eventBus\" />\n  </Section>\n</template>\n"],"mappings":""}

package/dist/v2/features/collection/components/Cookies.vue.script.js

@@ -0,0 +1,57 @@
+import Section_default from "../../settings/components/Section.vue.js";
+import CookiesTable_default from "../../global-cookies/components/CookiesTable.vue.js";
+import { computed, createBlock, createCommentVNode, createElementVNode, createTextVNode, createVNode, defineComponent, openBlock, unref, withCtx } from "vue";
+var Cookies_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	name: "Cookies",
+	props: {
+		documentSlug: {},
+		document: {},
+		eventBus: {},
+		layout: {},
+		path: {},
+		method: {},
+		exampleName: {},
+		environment: {},
+		securitySchemes: {},
+		workspaceStore: {},
+		activeWorkspace: {},
+		plugins: {},
+		customThemes: {},
+		currentTheme: {},
+		isDarkMode: { type: Boolean },
+		fetchRegistryDocument: { type: Function },
+		telemetry: { type: Boolean },
+		onUpdateTelemetry: { type: Function },
+		collectionType: {}
+	},
+	setup(__props) {
+		const cookies = computed(() => {
+			return (__props.collectionType === "document" ? __props.document["x-scalar-cookies"] : __props.workspaceStore.workspace["x-scalar-cookies"]) ?? [];
+		});
+		return (_ctx, _cache) => {
+			return __props.collectionType !== "operation" ? (openBlock(), createBlock(Section_default, { key: 0 }, {
+				title: withCtx(() => [..._cache[0] || (_cache[0] = [createTextVNode("Cookies", -1)])]),
+				description: withCtx(() => [..._cache[1] || (_cache[1] = [
+					createTextVNode(" Manage your collection's cookies here.", -1),
+					createElementVNode("br", null, null, -1),
+					createTextVNode("Cookies allow you to store and send key-value data with your API requests—often used for things like session tokens, authentication, and saving user preferences.", -1),
+					createElementVNode("br", null, null, -1)
+				])]),
+				default: withCtx(() => [createVNode(unref(CookiesTable_default), {
+					collectionType: __props.collectionType,
+					cookies: cookies.value,
+					eventBus: __props.eventBus
+				}, null, 8, [
+					"collectionType",
+					"cookies",
+					"eventBus"
+				])]),
+				_: 1
+			})) : createCommentVNode("", true);
+		};
+	}
+});
+//#endregion
+export { Cookies_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=Cookies.vue.script.js.map

package/dist/v2/features/collection/components/Cookies.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Cookies.vue.script.js","names":[],"sources":["../../../../../src/v2/features/collection/components/Cookies.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Cookies section for the collection.\n * Renders document or workspace cookies and lets users manage key-value data\n * sent with API requests (e.g. session tokens, auth, preferences).\n */\nexport default {\n  name: 'Cookies',\n}\n</script>\n<script setup lang=\"ts\">\nimport { computed } from 'vue'\n\nimport type { CollectionProps } from '@/v2/features/app/helpers/routes'\nimport { CookiesTable } from '@/v2/features/global-cookies'\nimport Section from '@/v2/features/settings/components/Section.vue'\n\nconst { collectionType, eventBus, document, workspaceStore } =\n  defineProps<CollectionProps>()\n\nconst cookies = computed(() => {\n  return (\n    (collectionType === 'document'\n      ? document['x-scalar-cookies']\n      : workspaceStore.workspace['x-scalar-cookies']) ?? []\n  )\n})\n</script>\n\n<template>\n  <Section v-if=\"collectionType !== 'operation'\">\n    <template #title>Cookies</template>\n    <template #description>\n      Manage your collection's cookies here.<br />Cookies allow you to store and\n      send key-value data with your API requests—often used for things like\n      session tokens, authentication, and saving user preferences.<br />\n    </template>\n    <CookiesTable\n      :collectionType=\"collectionType\"\n      :cookies=\"cookies\"\n      :eventBus=\"eventBus\" />\n  </Section>\n</template>\n"],"mappings":";;;;CAOE,MAAM;;;;;;;;;;;;;;;;;;;;;;;EAaR,MAAM,UAAU,eAAe;AAC7B,WACG,QAAA,mBAAmB,aAChB,QAAA,SAAS,sBACT,QAAA,eAAe,UAAU,wBAAwB,EAAC;IAEzD;;UAIgB,QAAA,mBAAc,eAAA,WAAA,EAA7B,YAWU,iBAAA,EAAA,KAAA,GAAA,EAAA;IAVG,OAAK,cAAQ,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA,CAAA,gBAAP,WAAO,GAAA,CAAA,EAAA,CAAA;IACb,aAAW,cACkB,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA;qBADjB,2CACiB,GAAA;KAAA,mBAAM,MAAA,MAAA,MAAA,GAAA;qBAAA,qKAEgB,GAAA;KAAA,mBAAM,MAAA,MAAA,MAAA,GAAA;;2BAK3C,CAHzB,YAGyB,MAAA,qBAAA,EAAA;KAFtB,gBAAgB,QAAA;KAChB,SAAS,QAAA;KACT,UAAU,QAAA"}

package/dist/v2/features/collection/components/Editor/Editor.vue.d.ts

@@ -1,13 +1,13 @@
-declare const __VLS_export: import("vue").DefineComponent<(import("../../../../../v2/features/app/helpers/routes").RouteProps & {
+declare const __VLS_export: import("vue").DefineComponent<(import("../../../../../v2/features/app/helpers/routes.js").RouteProps & {
     collectionType: "document" | "operation";
     document: import("@scalar/workspace-store/schemas").WorkspaceDocument;
-}) | (import("../../../../../v2/features/app/helpers/routes").RouteProps & {
+}) | (import("../../../../../v2/features/app/helpers/routes.js").RouteProps & {
     collectionType: "workspace";
     document: null;
-}), {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<(import("../../../../../v2/features/app/helpers/routes").RouteProps & {
+}), {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<(import("../../../../../v2/features/app/helpers/routes.js").RouteProps & {
     collectionType: "document" | "operation";
     document: import("@scalar/workspace-store/schemas").WorkspaceDocument;
-}) | (import("../../../../../v2/features/app/helpers/routes").RouteProps & {
+}) | (import("../../../../../v2/features/app/helpers/routes.js").RouteProps & {
     collectionType: "workspace";
     document: null;
 })> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/v2/features/collection/components/Editor/Editor.vue.js

@@ -0,0 +1,9 @@
+import _plugin_vue_export_helper_default from "../../../../../_virtual/_plugin-vue_export-helper.js";
+import Editor_vue_vue_type_script_setup_true_lang_default from "./Editor.vue.script.js";
+/* empty css                     */
+//#region src/v2/features/collection/components/Editor/Editor.vue
+var Editor_default = /* @__PURE__ */ _plugin_vue_export_helper_default(Editor_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-850fff8f"]]);
+//#endregion
+export { Editor_default as default };
+
+//# sourceMappingURL=Editor.vue.js.map

package/dist/v2/features/collection/components/Editor/Editor.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Editor.vue.js","names":[],"sources":["../../../../../../src/v2/features/collection/components/Editor/Editor.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton, ScalarHotkey, useLoadingState } from '@scalar/components'\nimport { debounce } from '@scalar/helpers/general/debounce'\nimport { isObject } from '@scalar/helpers/object/is-object'\nimport { ScalarIconArrowsIn, ScalarIconArrowsOut } from '@scalar/icons'\nimport * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js'\nimport {\n  computed,\n  nextTick,\n  onBeforeUnmount,\n  onMounted,\n  ref,\n  shallowRef,\n  watch,\n} from 'vue'\n\nimport type { CollectionProps } from '@/v2/features/app/helpers/routes'\nimport { useEditor, useJsonPointerLinkSupport } from '@/v2/features/editor'\nimport { createJsonModel } from '@/v2/features/editor/helpers/json/create-json-model'\nimport { createYamlModel } from '@/v2/features/editor/helpers/yaml/create-yaml-model'\nimport { useEditorMarkers } from '@/v2/features/editor/hooks/use-editor-markers'\n\nimport EditorDiagnosticsPanel from './components/EditorDiagnosticsPanel.vue'\nimport EditorSavePanel from './components/EditorSavePanel.vue'\nimport { getDiagnosticCounts } from './helpers/get-diagnostic-counts'\nimport { getOperationContext } from './helpers/get-operation-context'\nimport { getVisibleDiagnostics } from './helpers/get-visible-diagnostics'\nimport { parseEditorObject } from './helpers/parse-editor-object'\nimport { stringifyDocument } from './helpers/stringify-document'\nimport { useEditorState } from './hooks/use-editor-state'\n\nconst { collectionType, documentSlug, method, path, workspaceStore } =\n  defineProps<CollectionProps>()\n\nconst MAX_VISIBLE_DIAGNOSTICS = 6\nconst EDITOR_PERSIST_DEBOUNCE_KEY = 'editor:replace-document'\n\nconst monacoEditorRef = ref<HTMLElement>()\nconst editorApi = shallowRef<ReturnType<typeof useEditor>>()\n\nconst saveLoader = useLoadingState()\nconst {\n  isAutoSaveEnabled,\n  isDirty,\n  editorLanguage,\n  isDiagnosticsPaneExpanded,\n  isEditorMaximized,\n  isYamlMode,\n  editorBottomPadding,\n  editorRootClass,\n  getLanguageToggleClass,\n  toggleEditorMaximized,\n} = useEditorState()\n\nconst jsonModel = createJsonModel()\nconst yamlModel = createYamlModel()\n\nconst selectedLanguage = ref<'json' | 'yaml'>('json')\n\nconst currentModel = computed(() => {\n  return selectedLanguage.value === 'json' ? jsonModel : yamlModel\n})\n\nconst monacoEditorInstance = computed(() => editorApi.value?.editor)\nconst { markers: diagnostics } = useEditorMarkers(monacoEditorInstance)\n\nconst syncEditorBottomPadding = () => {\n  editorApi.value?.editor.updateOptions({\n    padding: {\n      top: 0,\n      bottom: editorBottomPadding.value,\n    },\n  })\n}\n\nconst diagnosticCounts = computed(() => getDiagnosticCounts(diagnostics.value))\nconst visibleDiagnostics = computed(() =>\n  getVisibleDiagnostics(diagnostics.value, MAX_VISIBLE_DIAGNOSTICS),\n)\n\nconst focusDiagnostic = (marker: monaco.editor.IMarker) => {\n  const editor = editorApi.value?.editor\n  if (!editor) {\n    return\n  }\n  editor.setSelection({\n    startLineNumber: marker.startLineNumber,\n    startColumn: marker.startColumn,\n    endLineNumber: marker.endLineNumber,\n    endColumn: marker.endColumn,\n  })\n  editor.revealPositionInCenter({\n    lineNumber: marker.startLineNumber,\n    column: marker.startColumn,\n  })\n}\n\nconst getEditorValue = (): string | null => currentModel.value.model.getValue()\n\n/** Value from the editor for a specific language (use when switching to avoid reading the wrong model). */\nconst getEditorValueForLanguage = (language: 'json' | 'yaml'): string | null =>\n  (language === 'json' ? jsonModel : yamlModel).model.getValue()\n\nconst getDocumentValue = async (\n  language?: 'json' | 'yaml',\n): Promise<string> => {\n  const document = await workspaceStore.getEditableDocument(documentSlug)\n  return stringifyDocument(document, language ?? selectedLanguage.value)\n}\n\nconst debouncedPersist = debounce({ delay: 1500 })\n\nconst applyProgrammaticEditorValue = (value: string): void => {\n  // Cancel pending auto-save work so synthetic model updates do not persist stale data.\n  debouncedPersist.cleanup()\n  editorApi.value?.setValue(value, true)\n}\n\nconst loadDocumentIntoEditor = async () => {\n  applyProgrammaticEditorValue(await getDocumentValue())\n  isDirty.value = false\n  await focusOperation()\n}\n\nconst formatDocument = async () => {\n  await editorApi.value?.formatDocument()\n}\n\nconst focusOperation = async () => {\n  const operationContext = getOperationContext(path, method)\n  if (!operationContext) {\n    return\n  }\n\n  await editorApi.value?.focusPath([\n    'paths',\n    operationContext.path,\n    operationContext.method,\n  ])\n}\n\nconst persistEditorToWorkspace = async (value: string) => {\n  const parsed = parseEditorObject(value, editorLanguage.value)\n  if (!parsed) {\n    const firstError = diagnostics.value.find(\n      (m) => m.severity === monaco.MarkerSeverity.Error,\n    )\n    if (firstError) {\n      focusDiagnostic(firstError)\n    }\n    await saveLoader.invalidate()\n    return\n  }\n\n  saveLoader.start()\n  await workspaceStore.replaceDocument(documentSlug, parsed)\n  isDirty.value = false\n  await saveLoader.validate({ duration: 900 })\n}\n\nconst saveNow = async () => {\n  const value = getEditorValue()\n  if (!value) {\n    return\n  }\n  await persistEditorToWorkspace(value)\n}\n\nconst handleEditorChange = (value: string) => {\n  isDirty.value = true\n\n  if (!isAutoSaveEnabled.value) {\n    return\n  }\n\n  debouncedPersist.execute(EDITOR_PERSIST_DEBOUNCE_KEY, () =>\n    persistEditorToWorkspace(value),\n  )\n}\n\nconst focusOperationServers = async () => {\n  const operationContext = getOperationContext(path, method)\n  if (!operationContext) {\n    return\n  }\n\n  const value = getEditorValue()\n  if (!value) {\n    return\n  }\n\n  const parsed = parseEditorObject(value, editorLanguage.value)\n\n  if (!parsed || !isObject(parsed.paths)) {\n    return\n  }\n\n  const pathsObject = parsed.paths as Record<string, unknown>\n  const operationPathItem = pathsObject[operationContext.path]\n  if (!isObject(operationPathItem)) {\n    return\n  }\n\n  const operation = operationPathItem[operationContext.method]\n  if (!isObject(operation)) {\n    return\n  }\n\n  // Add default servers if not present\n  operation.servers ??= []\n\n  // Update the editor value\n  editorApi.value?.setValue(stringifyDocument(parsed, editorLanguage.value))\n  await editorApi.value?.focusPath([\n    'paths',\n    operationContext.path,\n    operationContext.method,\n    'servers',\n  ])\n}\n\nuseJsonPointerLinkSupport(editorApi, currentModel)\n\nonMounted(() => {\n  editorApi.value = useEditor({\n    element: monacoEditorRef.value ?? document.createElement('div'),\n    onChange: handleEditorChange,\n    model: currentModel,\n    actions: [\n      {\n        id: 'scalar.editor.focusOperation',\n        label: 'Focus Operation',\n        keybindings: [monaco.KeyMod.Alt | monaco.KeyCode.KeyO],\n        run: async () => {\n          await focusOperation()\n        },\n      },\n      {\n        id: 'scalar.editor.focusOperationServers',\n        label: 'Focus Operation Servers',\n        keybindings: [monaco.KeyMod.Alt | monaco.KeyCode.KeyS],\n        run: async () => {\n          await focusOperationServers()\n        },\n      },\n      {\n        id: 'scalar.editor.formatDocument',\n        label: 'Format Document',\n        keybindings: [\n          monaco.KeyMod.Alt | monaco.KeyMod.Shift | monaco.KeyCode.KeyF,\n        ],\n        run: async () => {\n          await formatDocument()\n        },\n      },\n    ],\n  })\n\n  syncEditorBottomPadding()\n  void loadDocumentIntoEditor()\n})\n\nonBeforeUnmount(() => {\n  debouncedPersist.cleanup()\n\n  // Persist if there is a pending save\n  if (isDirty.value && isAutoSaveEnabled.value) {\n    void saveNow()\n  }\n  editorApi.value?.dispose?.()\n  // Dispose models created at setup; useEditor only disposes the editor widget, not external models.\n  jsonModel.model.dispose()\n  yamlModel.model.dispose()\n})\n\nwatch(() => documentSlug, loadDocumentIntoEditor)\n\nwatch(\n  () => [path, method] as const,\n  async () => {\n    await focusOperation()\n  },\n)\n\nwatch(isDiagnosticsPaneExpanded, () => {\n  syncEditorBottomPadding()\n})\n\nwatch(editorLanguage, async (nextLanguage, previousLanguage) => {\n  const wasDirty = isDirty.value\n  // Read from the previous model before switching; getEditorValue() would use currentModel\n  // which changes with selectedLanguage, so we would read the (empty) new model otherwise.\n  const value = getEditorValueForLanguage(previousLanguage ?? 'json')\n  if (!value) {\n    selectedLanguage.value = nextLanguage\n    await nextTick()\n    await focusOperation()\n    return\n  }\n\n  const parsed = parseEditorObject(value, previousLanguage ?? 'json')\n  selectedLanguage.value = nextLanguage\n  await nextTick()\n  if (parsed) {\n    applyProgrammaticEditorValue(stringifyDocument(parsed, nextLanguage))\n    isDirty.value = wasDirty\n  }\n  await focusOperation()\n})\n\nwatch(\n  isAutoSaveEnabled,\n  (isEnabled) => {\n    if (!isEnabled) {\n      debouncedPersist.cleanup()\n      return\n    }\n\n    if (isDirty.value) {\n      const value = getEditorValue()\n      if (!value) {\n        return\n      }\n      debouncedPersist.execute(EDITOR_PERSIST_DEBOUNCE_KEY, () =>\n        persistEditorToWorkspace(value),\n      )\n    }\n  },\n  { flush: 'post' },\n)\n</script>\n\n<template>\n  <div\n    v-if=\"\n      collectionType === 'operation' &&\n      getOperationContext(path, method) !== null\n    \"\n    class=\"flex w-full min-w-0 flex-1 flex-col gap-2\"\n    :class=\"editorRootClass\">\n    <div\n      class=\"grid grid-cols-[minmax(0,1fr)_auto_minmax(0,1fr)] items-center gap-3\">\n      <div\n        class=\"flex min-w-0 items-center gap-1 overflow-x-auto whitespace-nowrap\">\n        <span class=\"text-c-2 text-xs font-medium whitespace-nowrap\">\n          Shortcuts\n        </span>\n\n        <ScalarButton\n          class=\"whitespace-nowrap\"\n          size=\"xs\"\n          variant=\"ghost\"\n          @click=\"focusOperation\">\n          <span>Operation</span>\n          <span class=\"text-c-3 ml-2 text-[11px]\">\n            <ScalarHotkey\n              hotkey=\"O\"\n              :modifier=\"['Alt']\" />\n          </span>\n        </ScalarButton>\n\n        <ScalarButton\n          class=\"whitespace-nowrap\"\n          size=\"xs\"\n          variant=\"ghost\"\n          @click=\"focusOperationServers\">\n          <span>Servers</span>\n          <span class=\"text-c-3 ml-2 text-[11px]\">\n            <ScalarHotkey\n              hotkey=\"S\"\n              :modifier=\"['Alt']\" />\n          </span>\n        </ScalarButton>\n      </div>\n\n      <div\n        aria-label=\"Editor language\"\n        class=\"bg-b-1 shadow-border flex items-center justify-self-center overflow-hidden rounded-lg p-0.5\"\n        role=\"tablist\">\n        <ScalarButton\n          :aria-selected=\"!isYamlMode\"\n          :class=\"getLanguageToggleClass(!isYamlMode)\"\n          role=\"tab\"\n          size=\"xs\"\n          type=\"button\"\n          variant=\"ghost\"\n          @click=\"editorLanguage = 'json'\">\n          JSON\n        </ScalarButton>\n        <ScalarButton\n          :aria-selected=\"isYamlMode\"\n          :class=\"getLanguageToggleClass(isYamlMode)\"\n          role=\"tab\"\n          size=\"xs\"\n          type=\"button\"\n          variant=\"ghost\"\n          @click=\"editorLanguage = 'yaml'\">\n          YAML\n        </ScalarButton>\n      </div>\n\n      <div class=\"flex min-w-0 shrink-0 items-center gap-2 justify-self-end\">\n        <ScalarButton\n          size=\"xs\"\n          variant=\"ghost\"\n          @click=\"formatDocument\">\n          <span>Format {{ isYamlMode ? 'YAML' : 'JSON' }}</span>\n          <span class=\"text-c-3 ml-2 text-[11px]\">\n            <ScalarHotkey\n              hotkey=\"F\"\n              :modifier=\"['Alt', 'Shift']\" />\n          </span>\n        </ScalarButton>\n        <ScalarButton\n          :aria-label=\"\n            isEditorMaximized ? 'Restore editor size' : 'Maximize editor'\n          \"\n          size=\"xs\"\n          variant=\"ghost\"\n          @click=\"toggleEditorMaximized\">\n          <span>{{ isEditorMaximized ? 'Restore' : 'Maximize' }}</span>\n          <span class=\"text-c-3 ml-2 text-[11px]\">\n            <ScalarIconArrowsIn\n              v-if=\"isEditorMaximized\"\n              class=\"size-3.5\" />\n            <ScalarIconArrowsOut\n              v-else\n              class=\"size-3.5\" />\n          </span>\n        </ScalarButton>\n      </div>\n    </div>\n\n    <div class=\"flex min-h-0 w-full min-w-0 flex-1 rounded-lg border\">\n      <div\n        class=\"relative w-full min-w-0 flex-1\"\n        :class=\"isEditorMaximized ? 'h-full min-h-0' : 'h-[500px]'\">\n        <div class=\"pointer-events-none absolute top-2 right-2 z-10\">\n          <EditorSavePanel\n            :isAutoSaveEnabled=\"isAutoSaveEnabled\"\n            :isDirty=\"isDirty\"\n            :saveLoader=\"saveLoader\"\n            @saveNow=\"saveNow\"\n            @update:isAutoSaveEnabled=\"isAutoSaveEnabled = $event\" />\n        </div>\n\n        <EditorDiagnosticsPanel\n          :diagnosticCounts=\"diagnosticCounts\"\n          :expanded=\"isDiagnosticsPaneExpanded\"\n          :visibleDiagnostics=\"visibleDiagnostics\"\n          @focusDiagnostic=\"focusDiagnostic\"\n          @toggle=\"isDiagnosticsPaneExpanded = !isDiagnosticsPaneExpanded\" />\n\n        <div\n          ref=\"monacoEditorRef\"\n          class=\"h-full w-full min-w-0 flex-1\" />\n      </div>\n    </div>\n  </div>\n  <div v-else>No operation context found</div>\n</template>\n<style scoped>\n.editor-container {\n  width: 100%;\n  height: 100%;\n}\n\n:deep(.json-path-highlight) {\n  background-color: rgba(255, 200, 0, 0.35);\n  border-radius: 4px;\n}\n\n:deep(.json-focus-highlight) {\n  background-color: color-mix(\n    in srgb,\n    var(--scalar-color-accent, #24b47e) 18%,\n    transparent\n  );\n  border-radius: 4px;\n}\n</style>\n"],"mappings":""}