npm - @scalar/api-client - Versions diffs - 2.43.0 → 3.0.0 - Mend

@scalar/api-client 2.43.0 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1485) hide show

package/dist/v2/features/environments/components/EnvironmentVariablesDropdown.vue.script.js CHANGED Viewed

@@ -1,6 +1,7 @@
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, normalizeStyle, onMounted, openBlock, ref, renderList, toDisplayString, unref, withCtx } from "vue";
 import { ScalarButton, ScalarTeleport } from "@scalar/components";
 import { ScalarIconPlus } from "@scalar/icons";
+import { POPULAR_CONTEXT_FUNCTION_KEYS } from "@scalar/workspace-store/request-example";
 import { onClickOutside } from "@vueuse/core";
 import Fuse from "fuse.js";
 //#region src/v2/features/environments/components/EnvironmentVariablesDropdown.vue?vue&type=script&setup=true&lang.ts
@@ -10,13 +11,19 @@ var _hoisted_1 = {
 };
 var _hoisted_2 = ["onClick"];
 var _hoisted_3 = { class: "flex items-center gap-2 whitespace-nowrap" };
-var _hoisted_4 = { class: "w-20 overflow-hidden text-right text-ellipsis whitespace-nowrap" };
+var _hoisted_4 = {
+	key: 1,
+	class: "text-c-3 bg-b-3 flex h-4.5 min-w-4.5 items-center justify-center rounded px-0.5 font-sans text-[9px] font-semibold"
+};
+var _hoisted_5 = { class: "max-w-[9rem] overflow-hidden text-right text-ellipsis whitespace-nowrap" };
+var DROPDOWN_LIMIT = 12;
 var EnvironmentVariablesDropdown_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	__name: "EnvironmentVariablesDropdown",
 	props: {
 		query: {},
 		environment: {},
-		dropdownPosition: {}
+		dropdownPosition: {},
+		contextFunctionItems: { default: () => [] }
 	},
 	emits: ["select", "redirect"],
 	setup(__props, { expose: __expose, emit: __emit }) {
@@ -33,15 +40,64 @@ var EnvironmentVariablesDropdown_vue_vue_type_script_setup_true_lang_default = /
 			key: v.name,
 			value: typeof v.value === "string" ? v.value : v.value.default
 		})));
-		const fuse = new Fuse(normalizedVariables.value, { keys: ["key", "value"] });
+		const contextRows = computed(() => __props.contextFunctionItems.map((item) => ({
+			kind: "context",
+			key: item.key,
+			secondary: item.description
+		})));
+		const envRows = computed(() => normalizedVariables.value.filter(({ key, value }) => key !== "" || value !== "").map(({ key, value }) => ({
+			kind: "env",
+			key,
+			secondary: value
+		})));
+		const envFuseSource = computed(() => envRows.value.map((row) => ({
+			...row,
+			fuseText: `${row.key} ${row.secondary}`
+		})));
+		const contextFuseSource = computed(() => contextRows.value.map((row) => ({
+			...row,
+			fuseText: `${row.key} ${row.secondary}`
+		})));
+		const fuseEnv = computed(() => new Fuse(envFuseSource.value, {
+			keys: ["fuseText"],
+			threshold: .35
+		}));
+		const fuseContext = computed(() => new Fuse(contextFuseSource.value, {
+			keys: ["fuseText"],
+			threshold: .35
+		}));
+		const popularContextRows = computed(() => {
+			const byKey = new Map(__props.contextFunctionItems.map((c) => [c.key, c]));
+			return POPULAR_CONTEXT_FUNCTION_KEYS.flatMap((key) => {
+				const item = byKey.get(key);
+				return item ? [{
+					kind: "context",
+					key: item.key,
+					secondary: item.description
+				}] : [];
+			});
+		});
 		const filteredVariables = computed(() => {
-			if (!__props.query)
- /** return the last 4 environment variables on first display */
-			return normalizedVariables.value.slice(-4).filter(({ key, value }) => key !== "" || value !== "");
-			/** filter environment variables by name */
-			const result = fuse.search(__props.query, { limit: 10 });
-			if (result.length > 0) return result.map((res) => res.item).filter(({ key, value }) => key !== "" || value !== "");
-			return [];
+			if (!__props.query.trim()) return [...envRows.value.slice(-4), ...popularContextRows.value];
+			const q = __props.query.trim();
+			const envMatches = fuseEnv.value.search(q, { limit: DROPDOWN_LIMIT }).map((res) => {
+				const { kind, key, secondary } = res.item;
+				return {
+					kind,
+					key,
+					secondary
+				};
+			});
+			const remaining = DROPDOWN_LIMIT - envMatches.length;
+			const contextMatches = remaining > 0 ? fuseContext.value.search(q, { limit: remaining }).map((res) => {
+				const { kind, key, secondary } = res.item;
+				return {
+					kind,
+					key,
+					secondary
+				};
+			}) : [];
+			return [...envMatches, ...contextMatches];
 		});
 		const selectVariable = (variableKey) => {
 			emit("select", variableKey);
@@ -86,13 +142,14 @@ var EnvironmentVariablesDropdown_vue_vue_type_script_setup_true_lang_default = /
 					style: normalizeStyle(dropdownStyle.value)
 				}, [filteredVariables.value.length ? (openBlock(), createElementBlock("ul", _hoisted_1, [(openBlock(true), createElementBlock(Fragment, null, renderList(filteredVariables.value, (item, index) => {
 					return openBlock(), createElementBlock("li", {
-						key: item.key,
+						key: `${item.kind}-${item.key}`,
 						class: normalizeClass(["font-code text-xxs hover:bg-b-2 flex h-8 cursor-pointer items-center justify-between gap-1.5 rounded p-1.5 transition-colors duration-150", { "bg-b-2": index === selectedVariableIndex.value }]),
 						onClick: ($event) => selectVariable(item.key)
-					}, [createElementVNode("div", _hoisted_3, [createElementVNode("span", {
+					}, [createElementVNode("div", _hoisted_3, [item.kind === "env" ? (openBlock(), createElementBlock("span", {
+						key: 0,
 						class: "h-2.25 w-2.25 min-w-2.25 rounded-full",
 						style: normalizeStyle({ backgroundColor: __props.environment.color })
-					}, null, 4), createTextVNode(" " + toDisplayString(item.key), 1)]), createElementVNode("span", _hoisted_4, toDisplayString(item.value), 1)], 10, _hoisted_2);
+					}, null, 4)) : (openBlock(), createElementBlock("span", _hoisted_4, " fn ")), createTextVNode(" " + toDisplayString(item.key), 1)]), createElementVNode("span", _hoisted_5, toDisplayString(item.secondary), 1)], 10, _hoisted_2);
 				}), 128))])) : (openBlock(), createBlock(unref(ScalarButton), {
 					key: 1,
 					class: "font-code text-xxs bg-b-inherit hover:bg-b-2 flex h-8 w-full justify-start gap-2 px-1.5 transition-colors duration-150",

package/dist/v2/features/environments/components/EnvironmentVariablesDropdown.vue.script.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EnvironmentVariablesDropdown.vue.script.js","names":[],"sources":["../../../../../src/v2/features/environments/components/EnvironmentVariablesDropdown.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton, ScalarTeleport } from '@scalar/components'\nimport { ScalarIconPlus } from '@scalar/icons'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport { onClickOutside } from '@vueuse/core'\nimport Fuse from 'fuse.js'\nimport { computed, onMounted, ref, type CSSProperties } from 'vue'\n\nconst { query, environment, dropdownPosition } = defineProps<{\n query: string\n environment: XScalarEnvironment\n dropdownPosition?: { left: number; top: number }\n}>()\n\nconst emit = defineEmits<{\n (e: 'select', variable: string): void\n (e: 'redirect'): void\n}>()\n\nconst isOpen = ref(true)\nconst dropdownRef = ref<HTMLElement \| null>(null)\nconst selectedVariableIndex = ref(0)\n\nconst redirectToEnvironment = () => {\n emit('redirect')\n isOpen.value = false\n}\n\n/** Normalize the variables to have a name and value /\nconst normalizedVariables = computed(() =>\n environment.variables.map((v) => ({\n key: v.name,\n value: typeof v.value === 'string' ? v.value : v.value.default,\n })),\n)\n\nconst fuse = new Fuse(normalizedVariables.value, {\n keys: ['key', 'value'],\n})\n\nconst filteredVariables = computed(() => {\n if (!query) {\n /* return the last 4 environment variables on first display /\n return normalizedVariables.value\n .slice(-4)\n .filter(({ key, value }) => key !== '' \|\| value !== '')\n }\n\n /* filter environment variables by name */\n const result = fuse.search(query, { limit: 10 })\n if (result.length > 0) {\n return result\n .map((res) => res.item)\n .filter(({ key, value }) => key !== '' \|\| value !== '')\n }\n\n return []\n})\n\nconst selectVariable = (variableKey: string) => {\n emit('select', variableKey)\n}\n\nconst handleArrowKey = (direction: 'up' \| 'down') => {\n const offset = direction === 'up' ? -1 : 1\n const length = filteredVariables.value.length\n\n if (length === 0) {\n return\n }\n\n selectedVariableIndex.value =\n (selectedVariableIndex.value + offset + length) % length\n}\n\nconst handleSelect = () => {\n if (selectedVariableIndex.value >= 0) {\n const selectedVariable =\n filteredVariables.value[selectedVariableIndex.value]\n if (selectedVariable) {\n selectVariable(selectedVariable.key)\n }\n }\n}\n\ndefineExpose({\n handleArrowKey,\n handleSelect,\n})\n\nonMounted(() => {\n // Reset selected index to the first item when dropdown opens\n selectedVariableIndex.value = 0\n})\n\nconst dropdownStyle = computed<CSSProperties>(() => {\n return {\n left: (dropdownPosition?.left ?? 0) + 'px',\n // Add a 5px offset from the editor\n top: (dropdownPosition?.top ?? 0) + 5 + 'px',\n }\n})\n\nonClickOutside(\n dropdownRef,\n () => {\n isOpen.value = false\n },\n { ignore: [dropdownRef] },\n)\n</script>\n<template>\n <ScalarTeleport\n v-if=\"isOpen\"\n class=\"scalar-client\">\n <div\n ref=\"dropdownRef\"\n class=\"custom-scroll z-context fixed top-0 left-0 flex max-h-[60svh] w-56 flex-col rounded border p-0.75\"\n :style=\"dropdownStyle\">\n <ul\n v-if=\"filteredVariables.length\"\n class=\"gap-1/2 flex flex-col\">\n <template\n v-for=\"(item, index) in filteredVariables\"\n :key=\"item.key\">\n <li\n class=\"font-code text-xxs hover:bg-b-2 flex h-8 cursor-pointer items-center justify-between gap-1.5 rounded p-1.5 transition-colors duration-150\"\n :class=\"{ 'bg-b-2': index === selectedVariableIndex }\"\n @click=\"selectVariable(item.key)\">\n <div class=\"flex items-center gap-2 whitespace-nowrap\">\n <span\n class=\"h-2.25 w-2.25 min-w-2.25 rounded-full\"\n :style=\"{\n backgroundColor: environment.color,\n }\"></span>\n {{ item.key }}\n </div>\n <span\n class=\"w-20 overflow-hidden text-right text-ellipsis whitespace-nowrap\">\n {{ item.value }}\n </span>\n </li>\n </template>\n </ul>\n <ScalarButton\n v-else\n class=\"font-code text-xxs bg-b-inherit hover:bg-b-2 flex h-8 w-full justify-start gap-2 px-1.5 transition-colors duration-150\"\n variant=\"outlined\"\n @click=\"redirectToEnvironment\">\n <ScalarIconPlus class=\"size-3\" />\n Add Variable\n </ScalarButton>\n <!-- Backdrop for the dropdown -->\n <div\n class=\"bg-b-1 brightness-lifted absolute inset-0 -z-1 rounded shadow-lg\" />\n </div>\n </ScalarTeleport>\n</template>\n"],"mappings":"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"}
1	+ {"version":3,"file":"EnvironmentVariablesDropdown.vue.script.js","names":[],"sources":["../../../../../src/v2/features/environments/components/EnvironmentVariablesDropdown.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton, ScalarTeleport } from '@scalar/components'\nimport { ScalarIconPlus } from '@scalar/icons'\nimport { POPULAR_CONTEXT_FUNCTION_KEYS } from '@scalar/workspace-store/request-example'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport { onClickOutside } from '@vueuse/core'\nimport Fuse from 'fuse.js'\nimport { computed, onMounted, ref, type CSSProperties } from 'vue'\n\ntype DropdownRow =\n \| { kind: 'env'; key: string; secondary: string }\n \| { kind: 'context'; key: string; secondary: string }\n\nconst {\n query,\n environment,\n dropdownPosition,\n contextFunctionItems = [],\n} = defineProps<{\n query: string\n environment: XScalarEnvironment\n dropdownPosition?: { left: number; top: number }\n /** Runtime placeholders such as `{{$guid}}`, shown with environment variables /\n contextFunctionItems?: { key: string; description: string }[]\n}>()\n\nconst emit = defineEmits<{\n (e: 'select', variable: string): void\n (e: 'redirect'): void\n}>()\n\nconst isOpen = ref(true)\nconst dropdownRef = ref<HTMLElement \| null>(null)\nconst selectedVariableIndex = ref(0)\n\nconst redirectToEnvironment = () => {\n emit('redirect')\n isOpen.value = false\n}\n\n/* Normalize the variables to have a name and value */\nconst normalizedVariables = computed(() =>\n environment.variables.map((v) => ({\n key: v.name,\n value: typeof v.value === 'string' ? v.value : v.value.default,\n })),\n)\n\nconst contextRows = computed((): DropdownRow[] =>\n contextFunctionItems.map((item) => ({\n kind: 'context',\n key: item.key,\n secondary: item.description,\n })),\n)\n\nconst envRows = computed((): DropdownRow[] =>\n normalizedVariables.value\n .filter(({ key, value }) => key !== '' \|\| value !== '')\n .map(({ key, value }) => ({\n kind: 'env' as const,\n key,\n secondary: value,\n })),\n)\n\ntype FuseRow = DropdownRow & { fuseText: string }\n\nconst envFuseSource = computed((): FuseRow[] =>\n envRows.value.map((row) => ({\n ...row,\n fuseText: `${row.key} ${row.secondary}`,\n })),\n)\n\nconst contextFuseSource = computed((): FuseRow[] =>\n contextRows.value.map((row) => ({\n ...row,\n fuseText: `${row.key} ${row.secondary}`,\n })),\n)\n\nconst fuseEnv = computed(\n () =>\n new Fuse(envFuseSource.value, {\n keys: ['fuseText'],\n threshold: 0.35,\n }),\n)\n\nconst fuseContext = computed(\n () =>\n new Fuse(contextFuseSource.value, {\n keys: ['fuseText'],\n threshold: 0.35,\n }),\n)\n\nconst popularContextRows = computed((): DropdownRow[] => {\n const byKey = new Map(contextFunctionItems.map((c) => [c.key, c]))\n return POPULAR_CONTEXT_FUNCTION_KEYS.flatMap((key) => {\n const item = byKey.get(key)\n return item\n ? [\n {\n kind: 'context' as const,\n key: item.key,\n secondary: item.description,\n },\n ]\n : []\n })\n})\n\nconst DROPDOWN_LIMIT = 12\n\nconst filteredVariables = computed((): DropdownRow[] => {\n if (!query.trim()) {\n const envSlice = envRows.value.slice(-4)\n return [...envSlice, ...popularContextRows.value]\n }\n\n const q = query.trim()\n const envMatches = fuseEnv.value\n .search(q, { limit: DROPDOWN_LIMIT })\n .map((res) => {\n const { kind, key, secondary } = res.item\n return { kind, key, secondary }\n })\n\n const remaining = DROPDOWN_LIMIT - envMatches.length\n const contextMatches =\n remaining > 0\n ? fuseContext.value.search(q, { limit: remaining }).map((res) => {\n const { kind, key, secondary } = res.item\n return { kind, key, secondary }\n })\n : []\n\n return [...envMatches, ...contextMatches]\n})\n\nconst selectVariable = (variableKey: string): void => {\n emit('select', variableKey)\n}\n\nconst handleArrowKey = (direction: 'up' \| 'down') => {\n const offset = direction === 'up' ? -1 : 1\n const length = filteredVariables.value.length\n\n if (length === 0) {\n return\n }\n\n selectedVariableIndex.value =\n (selectedVariableIndex.value + offset + length) % length\n}\n\nconst handleSelect = () => {\n if (selectedVariableIndex.value >= 0) {\n const selectedVariable =\n filteredVariables.value[selectedVariableIndex.value]\n if (selectedVariable) {\n selectVariable(selectedVariable.key)\n }\n }\n}\n\ndefineExpose({\n handleArrowKey,\n handleSelect,\n})\n\nonMounted(() => {\n // Reset selected index to the first item when dropdown opens\n selectedVariableIndex.value = 0\n})\n\nconst dropdownStyle = computed<CSSProperties>(() => {\n return {\n left: (dropdownPosition?.left ?? 0) + 'px',\n // Add a 5px offset from the editor\n top: (dropdownPosition?.top ?? 0) + 5 + 'px',\n }\n})\n\nonClickOutside(\n dropdownRef,\n () => {\n isOpen.value = false\n },\n { ignore: [dropdownRef] },\n)\n</script>\n<template>\n <ScalarTeleport\n v-if=\"isOpen\"\n class=\"scalar-client\">\n <div\n ref=\"dropdownRef\"\n class=\"custom-scroll z-context fixed top-0 left-0 flex max-h-[60svh] w-56 flex-col rounded border p-0.75\"\n :style=\"dropdownStyle\">\n <ul\n v-if=\"filteredVariables.length\"\n class=\"gap-1/2 flex flex-col\">\n <template\n v-for=\"(item, index) in filteredVariables\"\n :key=\"`${item.kind}-${item.key}`\">\n <li\n class=\"font-code text-xxs hover:bg-b-2 flex h-8 cursor-pointer items-center justify-between gap-1.5 rounded p-1.5 transition-colors duration-150\"\n :class=\"{ 'bg-b-2': index === selectedVariableIndex }\"\n @click=\"selectVariable(item.key)\">\n <div class=\"flex items-center gap-2 whitespace-nowrap\">\n <span\n v-if=\"item.kind === 'env'\"\n class=\"h-2.25 w-2.25 min-w-2.25 rounded-full\"\n :style=\"{\n backgroundColor: environment.color,\n }\" />\n <span\n v-else\n class=\"text-c-3 bg-b-3 flex h-4.5 min-w-4.5 items-center justify-center rounded px-0.5 font-sans text-[9px] font-semibold\">\n fn\n </span>\n {{ item.key }}\n </div>\n <span\n class=\"max-w-[9rem] overflow-hidden text-right text-ellipsis whitespace-nowrap\">\n {{ item.secondary }}\n </span>\n </li>\n </template>\n </ul>\n <ScalarButton\n v-else\n class=\"font-code text-xxs bg-b-inherit hover:bg-b-2 flex h-8 w-full justify-start gap-2 px-1.5 transition-colors duration-150\"\n variant=\"outlined\"\n @click=\"redirectToEnvironment\">\n <ScalarIconPlus class=\"size-3\" />\n Add Variable\n </ScalarButton>\n <!-- Backdrop for the dropdown -->\n <div\n class=\"bg-b-1 brightness-lifted absolute inset-0 -z-1 rounded shadow-lg\" />\n </div>\n </ScalarTeleport>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;AAkHA,IAAM,iBAAiB;;;;;;;;;;;EAxFvB,MAAM,OAAO;EAKb,MAAM,SAAS,IAAI,KAAI;EACvB,MAAM,cAAc,IAAwB,KAAI;EAChD,MAAM,wBAAwB,IAAI,EAAC;EAEnC,MAAM,8BAA8B;AAClC,QAAK,WAAU;AACf,UAAO,QAAQ;;;EAIjB,MAAM,sBAAsB,eAC1B,QAAA,YAAY,UAAU,KAAK,OAAO;GAChC,KAAK,EAAE;GACP,OAAO,OAAO,EAAE,UAAU,WAAW,EAAE,QAAQ,EAAE,MAAM;GACxD,EAAE,CACL;EAEA,MAAM,cAAc,eAClB,QAAA,qBAAqB,KAAK,UAAU;GAClC,MAAM;GACN,KAAK,KAAK;GACV,WAAW,KAAK;GACjB,EAAE,CACL;EAEA,MAAM,UAAU,eACd,oBAAoB,MACjB,QAAQ,EAAE,KAAK,YAAY,QAAQ,MAAM,UAAU,GAAE,CACrD,KAAK,EAAE,KAAK,aAAa;GACxB,MAAM;GACN;GACA,WAAW;GACZ,EAAE,CACP;EAIA,MAAM,gBAAgB,eACpB,QAAQ,MAAM,KAAK,SAAS;GAC1B,GAAG;GACH,UAAU,GAAG,IAAI,IAAI,GAAG,IAAI;GAC7B,EAAE,CACL;EAEA,MAAM,oBAAoB,eACxB,YAAY,MAAM,KAAK,SAAS;GAC9B,GAAG;GACH,UAAU,GAAG,IAAI,IAAI,GAAG,IAAI;GAC7B,EAAE,CACL;EAEA,MAAM,UAAU,eAEZ,IAAI,KAAK,cAAc,OAAO;GAC5B,MAAM,CAAC,WAAW;GAClB,WAAW;GACZ,CAAC,CACN;EAEA,MAAM,cAAc,eAEhB,IAAI,KAAK,kBAAkB,OAAO;GAChC,MAAM,CAAC,WAAW;GAClB,WAAW;GACZ,CAAC,CACN;EAEA,MAAM,qBAAqB,eAA8B;GACvD,MAAM,QAAQ,IAAI,IAAI,QAAA,qBAAqB,KAAK,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC,CAAA;AACjE,UAAO,8BAA8B,SAAS,QAAQ;IACpD,MAAM,OAAO,MAAM,IAAI,IAAG;AAC1B,WAAO,OACH,CACE;KACE,MAAM;KACN,KAAK,KAAK;KACV,WAAW,KAAK;KACjB,CACH,GACA,EAAC;KACN;IACF;EAID,MAAM,oBAAoB,eAA8B;AACtD,OAAI,CAAC,QAAA,MAAM,MAAM,CAEf,QAAO,CAAC,GADS,QAAQ,MAAM,MAAM,GAAE,EAClB,GAAG,mBAAmB,MAAK;GAGlD,MAAM,IAAI,QAAA,MAAM,MAAK;GACrB,MAAM,aAAa,QAAQ,MACxB,OAAO,GAAG,EAAE,OAAO,gBAAgB,CAAA,CACnC,KAAK,QAAQ;IACZ,MAAM,EAAE,MAAM,KAAK,cAAc,IAAI;AACrC,WAAO;KAAE;KAAM;KAAK;KAAU;KAC/B;GAEH,MAAM,YAAY,iBAAiB,WAAW;GAC9C,MAAM,iBACJ,YAAY,IACR,YAAY,MAAM,OAAO,GAAG,EAAE,OAAO,WAAW,CAAC,CAAC,KAAK,QAAQ;IAC7D,MAAM,EAAE,MAAM,KAAK,cAAc,IAAI;AACrC,WAAO;KAAE;KAAM;KAAK;KAAU;KAC/B,GACD,EAAC;AAEP,UAAO,CAAC,GAAG,YAAY,GAAG,eAAc;IACzC;EAED,MAAM,kBAAkB,gBAA8B;AACpD,QAAK,UAAU,YAAW;;EAG5B,MAAM,kBAAkB,cAA6B;GACnD,MAAM,SAAS,cAAc,OAAO,KAAK;GACzC,MAAM,SAAS,kBAAkB,MAAM;AAEvC,OAAI,WAAW,EACb;AAGF,yBAAsB,SACnB,sBAAsB,QAAQ,SAAS,UAAU;;EAGtD,MAAM,qBAAqB;AACzB,OAAI,sBAAsB,SAAS,GAAG;IACpC,MAAM,mBACJ,kBAAkB,MAAM,sBAAsB;AAChD,QAAI,iBACF,gBAAe,iBAAiB,IAAG;;;AAKzC,WAAa;GACX;GACA;GACD,CAAA;AAED,kBAAgB;AAEd,yBAAsB,QAAQ;IAC/B;EAED,MAAM,gBAAgB,eAA8B;AAClD,UAAO;IACL,OAAO,QAAA,kBAAkB,QAAQ,KAAK;IAEtC,MAAM,QAAA,kBAAkB,OAAO,KAAK,IAAI;IAC1C;IACD;AAED,iBACE,mBACM;AACJ,UAAO,QAAQ;KAEjB,EAAE,QAAQ,CAAC,YAAY,EAAE,CAC3B;;UAIU,OAAA,SAAA,WAAA,EADR,YAkDiB,MAAA,eAAA,EAAA;;IAhDf,OAAM;;2BA+CA,CA9CN,mBA8CM,OAAA;cA7CA;KAAJ,KAAI;KACJ,OAAM;KACL,OAAK,eAAE,cAAA,MAAa;QAEb,kBAAA,MAAkB,UAAA,WAAA,EAD1B,mBA8BK,MA9BL,YA8BK,EAAA,UAAA,KAAA,EA3BH,mBA0BW,UAAA,MAAA,WAzBe,kBAAA,QAAhB,MAAM,UAAK;yBAEnB,mBAsBK,MAAA;cAvBI,KAAK,KAAI,GAAI,KAAK;MAEzB,OAAK,eAAA,CAAC,6IAA2I,EAAA,UAC7H,UAAU,sBAAA,OAAqB,CAAA,CAAA;MAClD,UAAK,WAAE,eAAe,KAAK,IAAG;SAC/B,mBAaM,OAbN,YAaM,CAXI,KAAK,SAAI,SAAA,WAAA,EADjB,mBAKO,QAAA;;MAHL,OAAM;MACL,OAAK,eAAA,EAAA,iBAAuC,QAAA,YAAY,OAAA,CAAA;kCAG3D,mBAIO,QAJP,YAE6H,OAE7H,GAAA,gBAAO,MACP,gBAAG,KAAK,IAAG,EAAA,EAAA,CAAA,CAAA,EAEb,mBAGO,QAHP,YAGO,gBADF,KAAK,UAAS,EAAA,EAAA,CAAA,EAAA,IAAA,WAAA;iCAKzB,YAOe,MAAA,aAAA,EAAA;;KALb,OAAM;KACN,SAAQ;KACP,SAAO;;4BACyB,CAAjC,YAAiC,MAAA,eAAA,EAAA,EAAjB,OAAM,UAAQ,CAAA,EAAA,OAAA,OAAA,OAAA,KAAA,gBAAG,kBAEnC,GAAA,EAAA,CAAA;;mCAEA,mBAC6E,OAAA,EAA3E,OAAM,oEAAkE,EAAA,MAAA,GAAA,EAAA,EAAA,EAAA,CAAA,CAAA"}

package/dist/v2/features/modal/Modal.vue.d.ts CHANGED Viewed

@@ -6,6 +6,7 @@ import type { WorkspaceStore } from '@scalar/workspace-store/client';
 import { type WorkspaceEventBus } from '@scalar/workspace-store/events';
 import type { WorkspaceDocument } from '@scalar/workspace-store/schemas';
 import { type ComputedRef, type MaybeRefOrGetter, type Ref } from 'vue';
+import type { ApiClientModalOptionsRef } from '../../../v2/features/modal/helpers/types';
 import { type UseModalSidebarReturn } from '../../../v2/features/modal/hooks/use-modal-sidebar.js';
 export type ModalProps = {
     /** The workspace store must be initialized and passed in */
@@ -29,7 +30,7 @@ export type ModalProps = {
     /** Api client plugins to include in the modal */
     plugins: ClientPlugin[];
     /** Subset of the configuration options for the modal */
-    options: MaybeRefOrGetter<Partial<Pick<ApiReferenceConfigurationRaw, 'authentication' | 'baseServerURL' | 'hideClientButton' | 'hiddenClients' | 'servers'>>>;
+    options: MaybeRefOrGetter<Partial<Pick<ApiReferenceConfigurationRaw, 'authentication' | 'baseServerURL' | 'hideClientButton' | 'hiddenClients' | 'oauth2RedirectUri' | 'servers'>>>;
 };
 /**
  * Scalar Api Client Modal
@@ -38,8 +39,12 @@ export type ModalProps = {
  */
 declare const _default: typeof __VLS_export;
 export default _default;
-declare const __VLS_export: import("vue").DefineComponent<ModalProps, {
+declare const __VLS_export: import("vue").DefineComponent<Omit<ModalProps, "options"> & {
+    options: ApiClientModalOptionsRef;
+}, {
     sidebarWidth: ComputedRef<number>;
     environment: ComputedRef<import("@scalar/workspace-store/schemas/extensions/document/x-scalar-environments").XScalarEnvironment>;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ModalProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<Omit<ModalProps, "options"> & {
+    options: ApiClientModalOptionsRef;
+}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 //# sourceMappingURL=Modal.vue.d.ts.map

package/dist/v2/features/modal/Modal.vue.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.vue.d.ts","sourceRoot":"","sources":["../../../../src/v2/features/modal/Modal.vue"],"names":[],"mappings":"~~AAqNA~~,OAAO,EAAE,KAAK,UAAU,EAA4B,MAAM,oBAAoB,CAAA;AAC9E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAA;AACnE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAA;AAC7D,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,6BAA6B,CAAA;AAE/E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAA;AACpE,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAEvE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAA;AACxE,OAAO,EAKL,KAAK,WAAW,EAChB,KAAK,gBAAgB,EACrB,KAAK,GAAG,EACT,MAAM,KAAK,CAAA;AAIZ,OAAO,EAAE,KAAK,qBAAqB,EAAE,MAAM,6CAA6C,CAAA;AAOxF,MAAM,MAAM,UAAU,GAAG;IACvB,4DAA4D;IAC5D,cAAc,EAAE,cAAc,CAAA;IAC9B,qDAAqD;IACrD,QAAQ,EAAE,WAAW,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAA;IAC/C,iDAAiD;IACjD,IAAI,EAAE,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IACrC,4CAA4C;IAC5C,QAAQ,EAAE,iBAAiB,CAAA;IAC3B,mDAAmD;IACnD,MAAM,EAAE,WAAW,CAAC,UAAU,GAAG,SAAS,CAAC,CAAA;IAC3C,yDAAyD;IACzD,WAAW,EAAE,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IAC5C,sEAAsE;IACtE,+BAA+B,EAAE,GAAG,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAA;IAC5D,2CAA2C;IAC3C,UAAU,EAAE,UAAU,CAAA;IACtB,0DAA0D;IAC1D,YAAY,EAAE,qBAAqB,CAAA;IACnC,iDAAiD;IACjD,OAAO,EAAE,YAAY,EAAE,CAAA;IACvB,wDAAwD;IACxD,OAAO,EAAE,gBAAgB,CACvB,OAAO,CACL,IAAI,CACF,4BAA4B,EAC1B,gBAAgB,GAChB,eAAe,GACf,kBAAkB,GAClB,eAAe,GACf,SAAS,CACZ,CACF,CACF,CAAA;CACF,CAAA;AAED;;;;GAIG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY~~;;;mPAuQd~~,CAAC"}
1	+ {"version":3,"file":"Modal.vue.d.ts","sourceRoot":"","sources":["../../../../src/v2/features/modal/Modal.vue"],"names":[],"mappings":"AAyNA,OAAO,EAAE,KAAK,UAAU,EAA4B,MAAM,oBAAoB,CAAA;AAC9E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAA;AACnE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAA;AAC7D,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,6BAA6B,CAAA;AAE/E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAA;AACpE,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAEvE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAA;AACxE,OAAO,EAKL,KAAK,WAAW,EAChB,KAAK,gBAAgB,EACrB,KAAK,GAAG,EACT,MAAM,KAAK,CAAA;AAIZ,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,mCAAmC,CAAA;AACjF,OAAO,EAAE,KAAK,qBAAqB,EAAE,MAAM,6CAA6C,CAAA;AAOxF,MAAM,MAAM,UAAU,GAAG;IACvB,4DAA4D;IAC5D,cAAc,EAAE,cAAc,CAAA;IAC9B,qDAAqD;IACrD,QAAQ,EAAE,WAAW,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAA;IAC/C,iDAAiD;IACjD,IAAI,EAAE,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IACrC,4CAA4C;IAC5C,QAAQ,EAAE,iBAAiB,CAAA;IAC3B,mDAAmD;IACnD,MAAM,EAAE,WAAW,CAAC,UAAU,GAAG,SAAS,CAAC,CAAA;IAC3C,yDAAyD;IACzD,WAAW,EAAE,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IAC5C,sEAAsE;IACtE,+BAA+B,EAAE,GAAG,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAA;IAC5D,2CAA2C;IAC3C,UAAU,EAAE,UAAU,CAAA;IACtB,0DAA0D;IAC1D,YAAY,EAAE,qBAAqB,CAAA;IACnC,iDAAiD;IACjD,OAAO,EAAE,YAAY,EAAE,CAAA;IACvB,wDAAwD;IACxD,OAAO,EAAE,gBAAgB,CACvB,OAAO,CACL,IAAI,CACF,4BAA4B,EAC1B,gBAAgB,GAChB,eAAe,GACf,kBAAkB,GAClB,eAAe,GACf,mBAAmB,GACnB,SAAS,CACZ,CACF,CACF,CAAA;CACF,CAAA;AAED;;;;GAIG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY;aAC0C,wBAAwB;;;;;aAAxB,wBAAwB;iGAwQhF,CAAC"}

package/dist/v2/features/modal/Modal.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.vue.js","names":[],"sources":["../../../../src/v2/features/modal/Modal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type ModalProps = {\n /** The workspace store must be initialized and passed in /\n workspaceStore: WorkspaceStore\n /* The document must be initialized and passed in /\n document: ComputedRef<WorkspaceDocument \| null>\n /* The path must be initialized and passed in /\n path: ComputedRef<string \| undefined>\n /* The event bus for handling all events /\n eventBus: WorkspaceEventBus\n /* The method must be initialized and passed in /\n method: ComputedRef<HttpMethod \| undefined>\n /* The example name must be initialized and passed in /\n exampleName: ComputedRef<string \| undefined>\n /* Selected anyOf/oneOf request-body variants keyed by schema path /\n requestBodyCompositionSelection: Ref<Record<string, number>>\n /* Controls the visibility of the modal /\n modalState: ModalState\n /* The sidebar state must be initialized and passed in /\n sidebarState: UseModalSidebarReturn\n /* Api client plugins to include in the modal /\n plugins: ClientPlugin[]\n /* Subset of the configuration options for the modal /\n options: MaybeRefOrGetter<\n Partial<\n Pick<\n ApiReferenceConfigurationRaw,\n \| 'authentication'\n \| 'baseServerURL'\n \| 'hideClientButton'\n \| 'hiddenClients'\n \| 'servers'\n >\n >\n >\n}\n\n/\n Scalar Api Client Modal\n \n This component is used to render the API Client Modal\n /\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport { type ModalState, type ScalarListboxOption } from '@scalar/components'\nimport type { HttpMethod } from '@scalar/helpers/http/http-methods'\nimport type { ClientPlugin } from '@scalar/oas-utils/helpers'\nimport type { ApiReferenceConfigurationRaw } from '@scalar/types/api-reference'\nimport { ScalarToasts } from '@scalar/use-toasts'\nimport type { WorkspaceStore } from '@scalar/workspace-store/client'\nimport { type WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport { getActiveEnvironment } from '@scalar/workspace-store/request-example'\nimport type { WorkspaceDocument } from '@scalar/workspace-store/schemas'\nimport {\n computed,\n onBeforeUnmount,\n ref,\n watch,\n type ComputedRef,\n type MaybeRefOrGetter,\n type Ref,\n} from 'vue'\n\nimport ModalClientContainer from '@/v2/components/modals/ModalClientContainer.vue'\nimport { Sidebar, SidebarToggle } from '@/v2/components/sidebar'\nimport { type UseModalSidebarReturn } from '@/v2/features/modal/hooks/use-modal-sidebar'\nimport { initializeModalEvents } from '@/v2/features/modal/modal-events'\nimport Operation from '@/v2/features/operation/Operation.vue'\nimport { useGlobalHotKeys } from '@/v2/hooks/use-global-hot-keys'\nimport { useScrollLock } from '@/v2/hooks/use-scroll-lock'\n\nconst {\n document,\n eventBus,\n modalState,\n options,\n plugins,\n requestBodyCompositionSelection,\n sidebarState,\n workspaceStore,\n} = defineProps<ModalProps>()\n\nconst activeWorkspace: ScalarListboxOption = {\n label: 'default',\n id: 'default',\n}\n\n/* Controls the visibility of the sidebar. /\nconst isSidebarOpen = ref(false)\n\n/* Initialize modal events /\ninitializeModalEvents({\n eventBus,\n isSidebarOpen,\n requestBodyCompositionSelection,\n sidebarState,\n modalState,\n store: workspaceStore,\n})\n\n/* Register global hotkeys for the app, passing the workspace event bus and layout state /\nuseGlobalHotKeys(eventBus, 'modal', () => !modalState.open)\n\n/* Clean up on close /\nconst cleanUp = () => {\n eventBus.emit('operation:cancel:request')\n}\n\nconst isLocked = useScrollLock(() => {\n if (typeof window !== 'undefined') {\n return window.document.body\n }\n return null\n})\n\nwatch(\n () => modalState.open,\n (open) => {\n // Make sure scrolling is locked or unlocked when the modal is opened or closed\n isLocked.value = open\n\n if (!open) {\n cleanUp()\n }\n },\n)\n\n// Ensure we add our scalar wrapper class to the headless ui root\nonBeforeUnmount(() => cleanUp())\n\n/* Default sidebar width in pixels. /\nconst DEFAULT_SIDEBAR_WIDTH = 288\n\n/* Width of the sidebar, with fallback to default. /\nconst sidebarWidth = computed(\n () =>\n workspaceStore?.workspace?.['x-scalar-sidebar-width'] ??\n DEFAULT_SIDEBAR_WIDTH,\n)\n\n/* Handler for sidebar width changes. /\nconst handleSidebarWidthUpdate = (width: number) =>\n workspaceStore?.update('x-scalar-sidebar-width', width)\n\n/\n Merged environment variables from workspace and document levels.\n * Variables from both sources are combined, with document variables\n * taking precedence in case of naming conflicts.\n */\nconst environment = computed(\n () => getActiveEnvironment(workspaceStore, document.value).environment,\n)\n\ndefineExpose({\n sidebarWidth,\n environment,\n})\n</script>\n\n<template>\n <ModalClientContainer :modalState>\n <!-- Toasts -->\n <ScalarToasts />\n\n <!-- If we have a document, path and method, render the operation -->\n <main\n v-if=\"document.value && path?.value && method?.value\"\n class=\"relative flex h-full min-h-0 w-full flex-1\">\n <SidebarToggle\n v-model=\"isSidebarOpen\"\n class=\"absolute top-2 left-3 z-2\" />\n <Sidebar\n v-show=\"isSidebarOpen\"\n v-model:sidebarWidth=\"sidebarWidth\"\n :activeWorkspace=\"activeWorkspace\"\n class=\"h-full max-md:absolute! max-md:w-full!\"\n :documents=\"[document.value]\"\n :eventBus\n :isDroppable=\"() => false\"\n layout=\"modal\"\n :sidebarState=\"sidebarState.state\"\n :workspaces=\"[]\"\n @selectItem=\"sidebarState.handleSelectItem\"\n @update:sidebarWidth=\"handleSidebarWidthUpdate\" />\n <Operation\n :activeWorkspace=\"activeWorkspace\"\n class=\"flex-1\"\n :document=\"document.value\"\n :documentSlug=\"document.value['x-scalar-navigation']?.id ?? ''\"\n :environment\n :eventBus\n :exampleName=\"exampleName?.value\"\n layout=\"modal\"\n :method=\"method?.value\"\n :options\n :path=\"path?.value\"\n :plugins\n :requestBodyCompositionSelection=\"requestBodyCompositionSelection.value\"\n :workspaceStore />\n </main>\n <!-- Empty state -->\n <div\n v-else\n class=\"flex h-full w-full items-center justify-center\">\n <span class=\"text-c-3\">No document selected</span>\n </div>\n </ModalClientContainer>\n</template>\n"],"mappings":""}
1	+ {"version":3,"file":"Modal.vue.js","names":[],"sources":["../../../../src/v2/features/modal/Modal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type ModalProps = {\n /** The workspace store must be initialized and passed in /\n workspaceStore: WorkspaceStore\n /* The document must be initialized and passed in /\n document: ComputedRef<WorkspaceDocument \| null>\n /* The path must be initialized and passed in /\n path: ComputedRef<string \| undefined>\n /* The event bus for handling all events /\n eventBus: WorkspaceEventBus\n /* The method must be initialized and passed in /\n method: ComputedRef<HttpMethod \| undefined>\n /* The example name must be initialized and passed in /\n exampleName: ComputedRef<string \| undefined>\n /* Selected anyOf/oneOf request-body variants keyed by schema path /\n requestBodyCompositionSelection: Ref<Record<string, number>>\n /* Controls the visibility of the modal /\n modalState: ModalState\n /* The sidebar state must be initialized and passed in /\n sidebarState: UseModalSidebarReturn\n /* Api client plugins to include in the modal /\n plugins: ClientPlugin[]\n /* Subset of the configuration options for the modal /\n options: MaybeRefOrGetter<\n Partial<\n Pick<\n ApiReferenceConfigurationRaw,\n \| 'authentication'\n \| 'baseServerURL'\n \| 'hideClientButton'\n \| 'hiddenClients'\n \| 'oauth2RedirectUri'\n \| 'servers'\n >\n >\n >\n}\n\n/\n Scalar Api Client Modal\n \n This component is used to render the API Client Modal\n /\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport { type ModalState, type ScalarListboxOption } from '@scalar/components'\nimport type { HttpMethod } from '@scalar/helpers/http/http-methods'\nimport type { ClientPlugin } from '@scalar/oas-utils/helpers'\nimport type { ApiReferenceConfigurationRaw } from '@scalar/types/api-reference'\nimport { ScalarToasts } from '@scalar/use-toasts'\nimport type { WorkspaceStore } from '@scalar/workspace-store/client'\nimport { type WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport { getActiveEnvironment } from '@scalar/workspace-store/request-example'\nimport type { WorkspaceDocument } from '@scalar/workspace-store/schemas'\nimport {\n computed,\n onBeforeUnmount,\n ref,\n watch,\n type ComputedRef,\n type MaybeRefOrGetter,\n type Ref,\n} from 'vue'\n\nimport ModalClientContainer from '@/v2/components/modals/ModalClientContainer.vue'\nimport { Sidebar, SidebarToggle } from '@/v2/components/sidebar'\nimport type { ApiClientModalOptionsRef } from '@/v2/features/modal/helpers/types'\nimport { type UseModalSidebarReturn } from '@/v2/features/modal/hooks/use-modal-sidebar'\nimport { initializeModalEvents } from '@/v2/features/modal/modal-events'\nimport Operation from '@/v2/features/operation/Operation.vue'\nimport { useGlobalHotKeys } from '@/v2/hooks/use-global-hot-keys'\nimport { useScrollLock } from '@/v2/hooks/use-scroll-lock'\n\nconst {\n document,\n eventBus,\n modalState,\n options,\n plugins,\n requestBodyCompositionSelection,\n sidebarState,\n workspaceStore,\n} = defineProps<\n Omit<ModalProps, 'options'> & { options: ApiClientModalOptionsRef }\n>()\n\nconst activeWorkspace: ScalarListboxOption = {\n label: 'default',\n id: 'default',\n}\n\n/* Controls the visibility of the sidebar. /\nconst isSidebarOpen = ref(false)\n\n/* Initialize modal events /\ninitializeModalEvents({\n eventBus,\n isSidebarOpen,\n requestBodyCompositionSelection,\n sidebarState,\n modalState,\n store: workspaceStore,\n})\n\n/* Register global hotkeys for the app, passing the workspace event bus and layout state /\nuseGlobalHotKeys(eventBus, 'modal', () => !modalState.open)\n\n/* Clean up on close /\nconst cleanUp = () => {\n eventBus.emit('operation:cancel:request')\n}\n\nconst isLocked = useScrollLock(() => {\n if (typeof window !== 'undefined') {\n return window.document.body\n }\n return null\n})\n\nwatch(\n () => modalState.open,\n (open) => {\n // Make sure scrolling is locked or unlocked when the modal is opened or closed\n isLocked.value = open\n\n if (!open) {\n cleanUp()\n }\n },\n)\n\n// Ensure we add our scalar wrapper class to the headless ui root\nonBeforeUnmount(() => cleanUp())\n\n/* Default sidebar width in pixels. /\nconst DEFAULT_SIDEBAR_WIDTH = 288\n\n/* Width of the sidebar, with fallback to default. /\nconst sidebarWidth = computed(\n () =>\n workspaceStore?.workspace?.['x-scalar-sidebar-width'] ??\n DEFAULT_SIDEBAR_WIDTH,\n)\n\n/* Handler for sidebar width changes. /\nconst handleSidebarWidthUpdate = (width: number) =>\n workspaceStore?.update('x-scalar-sidebar-width', width)\n\n/\n Merged environment variables from workspace and document levels.\n * Variables from both sources are combined, with document variables\n * taking precedence in case of naming conflicts.\n */\nconst environment = computed(\n () => getActiveEnvironment(workspaceStore, document.value).environment,\n)\n\ndefineExpose({\n sidebarWidth,\n environment,\n})\n</script>\n\n<template>\n <ModalClientContainer :modalState>\n <!-- Toasts -->\n <ScalarToasts />\n\n <!-- If we have a document, path and method, render the operation -->\n <main\n v-if=\"document.value && path?.value && method?.value\"\n class=\"relative flex h-full min-h-0 w-full flex-1\">\n <SidebarToggle\n v-model=\"isSidebarOpen\"\n class=\"absolute top-2 left-3 z-2\" />\n <Sidebar\n v-show=\"isSidebarOpen\"\n v-model:sidebarWidth=\"sidebarWidth\"\n :activeWorkspace=\"activeWorkspace\"\n class=\"h-full max-md:absolute! max-md:w-full!\"\n :documents=\"[document.value]\"\n :eventBus\n :isDroppable=\"() => false\"\n layout=\"modal\"\n :sidebarState=\"sidebarState.state\"\n :workspaces=\"[]\"\n @selectItem=\"sidebarState.handleSelectItem\"\n @update:sidebarWidth=\"handleSidebarWidthUpdate\" />\n <Operation\n :activeWorkspace=\"activeWorkspace\"\n class=\"flex-1\"\n :document=\"document.value\"\n :documentSlug=\"document.value['x-scalar-navigation']?.id ?? ''\"\n :environment\n :eventBus\n :exampleName=\"exampleName?.value\"\n layout=\"modal\"\n :method=\"method?.value\"\n :options\n :path=\"path?.value\"\n :plugins\n :requestBodyCompositionSelection=\"requestBodyCompositionSelection.value\"\n :workspaceStore />\n </main>\n <!-- Empty state -->\n <div\n v-else\n class=\"flex h-full w-full items-center justify-center\">\n <span class=\"text-c-3\">No document selected</span>\n </div>\n </ModalClientContainer>\n</template>\n"],"mappings":""}

package/dist/v2/features/modal/Modal.vue.script.js CHANGED Viewed

@@ -1,8 +1,8 @@
-import ModalClientContainer_default from "../../components/modals/ModalClientContainer.vue.js";
 import Sidebar_default from "../../components/sidebar/Sidebar.vue.js";
 import SidebarToggle_default from "../../components/sidebar/SidebarToggle.vue.js";
 import { useGlobalHotKeys } from "../../hooks/use-global-hot-keys.js";
 import Operation_default from "../operation/Operation.vue.js";
+import ModalClientContainer_default from "../../components/modals/ModalClientContainer.vue.js";
 import { initializeModalEvents } from "./modal-events.js";
 import { useScrollLock } from "../../hooks/use-scroll-lock.js";
 import { computed, createBlock, createElementBlock, createElementVNode, createVNode, defineComponent, onBeforeUnmount, openBlock, ref, unref, vShow, watch, withCtx, withDirectives } from "vue";

package/dist/v2/features/modal/Modal.vue.script.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.vue.script.js","names":[],"sources":["../../../../src/v2/features/modal/Modal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type ModalProps = {\n /** The workspace store must be initialized and passed in /\n workspaceStore: WorkspaceStore\n /* The document must be initialized and passed in /\n document: ComputedRef<WorkspaceDocument \| null>\n /* The path must be initialized and passed in /\n path: ComputedRef<string \| undefined>\n /* The event bus for handling all events /\n eventBus: WorkspaceEventBus\n /* The method must be initialized and passed in /\n method: ComputedRef<HttpMethod \| undefined>\n /* The example name must be initialized and passed in /\n exampleName: ComputedRef<string \| undefined>\n /* Selected anyOf/oneOf request-body variants keyed by schema path /\n requestBodyCompositionSelection: Ref<Record<string, number>>\n /* Controls the visibility of the modal /\n modalState: ModalState\n /* The sidebar state must be initialized and passed in /\n sidebarState: UseModalSidebarReturn\n /* Api client plugins to include in the modal /\n plugins: ClientPlugin[]\n /* Subset of the configuration options for the modal /\n options: MaybeRefOrGetter<\n Partial<\n Pick<\n ApiReferenceConfigurationRaw,\n \| 'authentication'\n \| 'baseServerURL'\n \| 'hideClientButton'\n \| 'hiddenClients'\n \| 'servers'\n >\n >\n >\n}\n\n/\n Scalar Api Client Modal\n \n This component is used to render the API Client Modal\n /\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport { type ModalState, type ScalarListboxOption } from '@scalar/components'\nimport type { HttpMethod } from '@scalar/helpers/http/http-methods'\nimport type { ClientPlugin } from '@scalar/oas-utils/helpers'\nimport type { ApiReferenceConfigurationRaw } from '@scalar/types/api-reference'\nimport { ScalarToasts } from '@scalar/use-toasts'\nimport type { WorkspaceStore } from '@scalar/workspace-store/client'\nimport { type WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport { getActiveEnvironment } from '@scalar/workspace-store/request-example'\nimport type { WorkspaceDocument } from '@scalar/workspace-store/schemas'\nimport {\n computed,\n onBeforeUnmount,\n ref,\n watch,\n type ComputedRef,\n type MaybeRefOrGetter,\n type Ref,\n} from 'vue'\n\nimport ModalClientContainer from '@/v2/components/modals/ModalClientContainer.vue'\nimport { Sidebar, SidebarToggle } from '@/v2/components/sidebar'\nimport { type UseModalSidebarReturn } from '@/v2/features/modal/hooks/use-modal-sidebar'\nimport { initializeModalEvents } from '@/v2/features/modal/modal-events'\nimport Operation from '@/v2/features/operation/Operation.vue'\nimport { useGlobalHotKeys } from '@/v2/hooks/use-global-hot-keys'\nimport { useScrollLock } from '@/v2/hooks/use-scroll-lock'\n\nconst {\n document,\n eventBus,\n modalState,\n options,\n plugins,\n requestBodyCompositionSelection,\n sidebarState,\n workspaceStore,\n} = defineProps<ModalProps>()\n\nconst activeWorkspace: ScalarListboxOption = {\n label: 'default',\n id: 'default',\n}\n\n/* Controls the visibility of the sidebar. /\nconst isSidebarOpen = ref(false)\n\n/* Initialize modal events /\ninitializeModalEvents({\n eventBus,\n isSidebarOpen,\n requestBodyCompositionSelection,\n sidebarState,\n modalState,\n store: workspaceStore,\n})\n\n/* Register global hotkeys for the app, passing the workspace event bus and layout state /\nuseGlobalHotKeys(eventBus, 'modal', () => !modalState.open)\n\n/* Clean up on close /\nconst cleanUp = () => {\n eventBus.emit('operation:cancel:request')\n}\n\nconst isLocked = useScrollLock(() => {\n if (typeof window !== 'undefined') {\n return window.document.body\n }\n return null\n})\n\nwatch(\n () => modalState.open,\n (open) => {\n // Make sure scrolling is locked or unlocked when the modal is opened or closed\n isLocked.value = open\n\n if (!open) {\n cleanUp()\n }\n },\n)\n\n// Ensure we add our scalar wrapper class to the headless ui root\nonBeforeUnmount(() => cleanUp())\n\n/* Default sidebar width in pixels. /\nconst DEFAULT_SIDEBAR_WIDTH = 288\n\n/* Width of the sidebar, with fallback to default. /\nconst sidebarWidth = computed(\n () =>\n workspaceStore?.workspace?.['x-scalar-sidebar-width'] ??\n DEFAULT_SIDEBAR_WIDTH,\n)\n\n/* Handler for sidebar width changes. /\nconst handleSidebarWidthUpdate = (width: number) =>\n workspaceStore?.update('x-scalar-sidebar-width', width)\n\n/\n Merged environment variables from workspace and document levels.\n * Variables from both sources are combined, with document variables\n * taking precedence in case of naming conflicts.\n */\nconst environment = computed(\n () => getActiveEnvironment(workspaceStore, document.value).environment,\n)\n\ndefineExpose({\n sidebarWidth,\n environment,\n})\n</script>\n\n<template>\n <ModalClientContainer :modalState>\n <!-- Toasts -->\n <ScalarToasts />\n\n <!-- If we have a document, path and method, render the operation -->\n <main\n v-if=\"document.value && path?.value && method?.value\"\n class=\"relative flex h-full min-h-0 w-full flex-1\">\n <SidebarToggle\n v-model=\"isSidebarOpen\"\n class=\"absolute top-2 left-3 z-2\" />\n <Sidebar\n v-show=\"isSidebarOpen\"\n v-model:sidebarWidth=\"sidebarWidth\"\n :activeWorkspace=\"activeWorkspace\"\n class=\"h-full max-md:absolute! max-md:w-full!\"\n :documents=\"[document.value]\"\n :eventBus\n :isDroppable=\"() => false\"\n layout=\"modal\"\n :sidebarState=\"sidebarState.state\"\n :workspaces=\"[]\"\n @selectItem=\"sidebarState.handleSelectItem\"\n @update:sidebarWidth=\"handleSidebarWidthUpdate\" />\n <Operation\n :activeWorkspace=\"activeWorkspace\"\n class=\"flex-1\"\n :document=\"document.value\"\n :documentSlug=\"document.value['x-scalar-navigation']?.id ?? ''\"\n :environment\n :eventBus\n :exampleName=\"exampleName?.value\"\n layout=\"modal\"\n :method=\"method?.value\"\n :options\n :path=\"path?.value\"\n :plugins\n :requestBodyCompositionSelection=\"requestBodyCompositionSelection.value\"\n :workspaceStore />\n </main>\n <!-- Empty state -->\n <div\n v-else\n class=\"flex h-full w-full items-center justify-center\">\n <span class=\"text-c-3\">No document selected</span>\n </div>\n </ModalClientContainer>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~EAoFA~~,MAAM,kBAAuC;GAC3C,OAAO;GACP,IAAI;GACN;;EAGA,MAAM,gBAAgB,IAAI,MAAK;;AAG/B,wBAAsB;GACpB,UAAO,QAAA;GACP;GACA,iCAA8B,QAAA;GAC9B,cAAW,QAAA;GACX,YAAS,QAAA;GACT,OAAO,QAAA;GACR,CAAA;;AAGD,mBAAiB,QAAA,UAAU,eAAe,CAAC,QAAA,WAAW,KAAI;;EAG1D,MAAM,gBAAgB;AACpB,WAAA,SAAS,KAAK,2BAA0B;;EAG1C,MAAM,WAAW,oBAAoB;AACnC,OAAI,OAAO,WAAW,YACpB,QAAO,OAAO,SAAS;AAEzB,UAAO;IACR;AAED,cACQ,QAAA,WAAW,OAChB,SAAS;AAER,YAAS,QAAQ;AAEjB,OAAI,CAAC,KACH,UAAQ;IAGd;AAGA,wBAAsB,SAAS,CAAA;;EAG/B,MAAM,wBAAwB;;EAG9B,MAAM,eAAe,eAEjB,QAAA,gBAAgB,YAAY,6BAC5B,sBACJ;;EAGA,MAAM,4BAA4B,UAChC,QAAA,gBAAgB,OAAO,0BAA0B,MAAK;;;;;;EAOxD,MAAM,cAAc,eACZ,qBAAqB,QAAA,gBAAgB,QAAA,SAAS,MAAM,CAAC,YAC7D;AAEA,WAAa;GACX;GACA;GACD,CAAA;;uBAIC,YA8CuB,8BAAA,EA9CA,YAAA,QAAA,YAAU,EAAA;2BAEf,CAAhB,YAAgB,MAAA,aAAA,CAAA,EAIR,QAAA,SAAS,SAAS,QAAA,MAAM,SAAS,QAAA,QAAQ,SAAA,WAAA,EADjD,mBAkCO,QAlCP,YAkCO;KA/BL,YAEsC,MAAA,sBAAA,EAAA;kBAD3B,cAAA;iFAAa,QAAA;MACtB,OAAM;;oBACR,YAYoD,MAAA,gBAAA,EAAA;MAV1C,cAAc,aAAA;mFAAY,QAAA,SAUZ,yBAAA;MATJ;MAClB,OAAM;MACL,WAAS,CAAG,QAAA,SAAS,MAAK;MAC1B,UAAA,QAAA;MACA,mBAAa;MACd,QAAO;MACN,cAAc,QAAA,aAAa;MAC3B,YAAY,EAAE;MACd,cAAY,QAAA,aAAa;;;;;;;kBAVlB,cAAA,MAAa,CAAA,CAAA;KAYvB,YAcoB,mBAAA;MAbA;MAClB,OAAM;MACL,UAAU,QAAA,SAAS;MACnB,cAAc,QAAA,SAAS,MAAK,wBAAyB,MAAE;MACvD,aAAA,YAAA;MACA,UAAA,QAAA;MACA,aAAa,QAAA,aAAa;MAC3B,QAAO;MACN,QAAQ,QAAA,QAAQ;MAChB,SAAA,QAAA;MACA,MAAM,QAAA,MAAM;MACZ,SAAA,QAAA;MACA,iCAAiC,QAAA,gCAAgC;MACjE,gBAAA,QAAA;;;;;;;;;;;;;;wBAGL,mBAIM,OAJN,YAIM,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA,CADJ,mBAAkD,QAAA,EAA5C,OAAM,YAAU,EAAC,wBAAoB,GAAA,CAAA,EAAA,CAAA,EAAA,CAAA"}
1	+ {"version":3,"file":"Modal.vue.script.js","names":[],"sources":["../../../../src/v2/features/modal/Modal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type ModalProps = {\n /** The workspace store must be initialized and passed in /\n workspaceStore: WorkspaceStore\n /* The document must be initialized and passed in /\n document: ComputedRef<WorkspaceDocument \| null>\n /* The path must be initialized and passed in /\n path: ComputedRef<string \| undefined>\n /* The event bus for handling all events /\n eventBus: WorkspaceEventBus\n /* The method must be initialized and passed in /\n method: ComputedRef<HttpMethod \| undefined>\n /* The example name must be initialized and passed in /\n exampleName: ComputedRef<string \| undefined>\n /* Selected anyOf/oneOf request-body variants keyed by schema path /\n requestBodyCompositionSelection: Ref<Record<string, number>>\n /* Controls the visibility of the modal /\n modalState: ModalState\n /* The sidebar state must be initialized and passed in /\n sidebarState: UseModalSidebarReturn\n /* Api client plugins to include in the modal /\n plugins: ClientPlugin[]\n /* Subset of the configuration options for the modal /\n options: MaybeRefOrGetter<\n Partial<\n Pick<\n ApiReferenceConfigurationRaw,\n \| 'authentication'\n \| 'baseServerURL'\n \| 'hideClientButton'\n \| 'hiddenClients'\n \| 'oauth2RedirectUri'\n \| 'servers'\n >\n >\n >\n}\n\n/\n Scalar Api Client Modal\n \n This component is used to render the API Client Modal\n /\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport { type ModalState, type ScalarListboxOption } from '@scalar/components'\nimport type { HttpMethod } from '@scalar/helpers/http/http-methods'\nimport type { ClientPlugin } from '@scalar/oas-utils/helpers'\nimport type { ApiReferenceConfigurationRaw } from '@scalar/types/api-reference'\nimport { ScalarToasts } from '@scalar/use-toasts'\nimport type { WorkspaceStore } from '@scalar/workspace-store/client'\nimport { type WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport { getActiveEnvironment } from '@scalar/workspace-store/request-example'\nimport type { WorkspaceDocument } from '@scalar/workspace-store/schemas'\nimport {\n computed,\n onBeforeUnmount,\n ref,\n watch,\n type ComputedRef,\n type MaybeRefOrGetter,\n type Ref,\n} from 'vue'\n\nimport ModalClientContainer from '@/v2/components/modals/ModalClientContainer.vue'\nimport { Sidebar, SidebarToggle } from '@/v2/components/sidebar'\nimport type { ApiClientModalOptionsRef } from '@/v2/features/modal/helpers/types'\nimport { type UseModalSidebarReturn } from '@/v2/features/modal/hooks/use-modal-sidebar'\nimport { initializeModalEvents } from '@/v2/features/modal/modal-events'\nimport Operation from '@/v2/features/operation/Operation.vue'\nimport { useGlobalHotKeys } from '@/v2/hooks/use-global-hot-keys'\nimport { useScrollLock } from '@/v2/hooks/use-scroll-lock'\n\nconst {\n document,\n eventBus,\n modalState,\n options,\n plugins,\n requestBodyCompositionSelection,\n sidebarState,\n workspaceStore,\n} = defineProps<\n Omit<ModalProps, 'options'> & { options: ApiClientModalOptionsRef }\n>()\n\nconst activeWorkspace: ScalarListboxOption = {\n label: 'default',\n id: 'default',\n}\n\n/* Controls the visibility of the sidebar. /\nconst isSidebarOpen = ref(false)\n\n/* Initialize modal events /\ninitializeModalEvents({\n eventBus,\n isSidebarOpen,\n requestBodyCompositionSelection,\n sidebarState,\n modalState,\n store: workspaceStore,\n})\n\n/* Register global hotkeys for the app, passing the workspace event bus and layout state /\nuseGlobalHotKeys(eventBus, 'modal', () => !modalState.open)\n\n/* Clean up on close /\nconst cleanUp = () => {\n eventBus.emit('operation:cancel:request')\n}\n\nconst isLocked = useScrollLock(() => {\n if (typeof window !== 'undefined') {\n return window.document.body\n }\n return null\n})\n\nwatch(\n () => modalState.open,\n (open) => {\n // Make sure scrolling is locked or unlocked when the modal is opened or closed\n isLocked.value = open\n\n if (!open) {\n cleanUp()\n }\n },\n)\n\n// Ensure we add our scalar wrapper class to the headless ui root\nonBeforeUnmount(() => cleanUp())\n\n/* Default sidebar width in pixels. /\nconst DEFAULT_SIDEBAR_WIDTH = 288\n\n/* Width of the sidebar, with fallback to default. /\nconst sidebarWidth = computed(\n () =>\n workspaceStore?.workspace?.['x-scalar-sidebar-width'] ??\n DEFAULT_SIDEBAR_WIDTH,\n)\n\n/* Handler for sidebar width changes. /\nconst handleSidebarWidthUpdate = (width: number) =>\n workspaceStore?.update('x-scalar-sidebar-width', width)\n\n/\n Merged environment variables from workspace and document levels.\n * Variables from both sources are combined, with document variables\n * taking precedence in case of naming conflicts.\n */\nconst environment = computed(\n () => getActiveEnvironment(workspaceStore, document.value).environment,\n)\n\ndefineExpose({\n sidebarWidth,\n environment,\n})\n</script>\n\n<template>\n <ModalClientContainer :modalState>\n <!-- Toasts -->\n <ScalarToasts />\n\n <!-- If we have a document, path and method, render the operation -->\n <main\n v-if=\"document.value && path?.value && method?.value\"\n class=\"relative flex h-full min-h-0 w-full flex-1\">\n <SidebarToggle\n v-model=\"isSidebarOpen\"\n class=\"absolute top-2 left-3 z-2\" />\n <Sidebar\n v-show=\"isSidebarOpen\"\n v-model:sidebarWidth=\"sidebarWidth\"\n :activeWorkspace=\"activeWorkspace\"\n class=\"h-full max-md:absolute! max-md:w-full!\"\n :documents=\"[document.value]\"\n :eventBus\n :isDroppable=\"() => false\"\n layout=\"modal\"\n :sidebarState=\"sidebarState.state\"\n :workspaces=\"[]\"\n @selectItem=\"sidebarState.handleSelectItem\"\n @update:sidebarWidth=\"handleSidebarWidthUpdate\" />\n <Operation\n :activeWorkspace=\"activeWorkspace\"\n class=\"flex-1\"\n :document=\"document.value\"\n :documentSlug=\"document.value['x-scalar-navigation']?.id ?? ''\"\n :environment\n :eventBus\n :exampleName=\"exampleName?.value\"\n layout=\"modal\"\n :method=\"method?.value\"\n :options\n :path=\"path?.value\"\n :plugins\n :requestBodyCompositionSelection=\"requestBodyCompositionSelection.value\"\n :workspaceStore />\n </main>\n <!-- Empty state -->\n <div\n v-else\n class=\"flex h-full w-full items-center justify-center\">\n <span class=\"text-c-3\">No document selected</span>\n </div>\n </ModalClientContainer>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAwFA,MAAM,kBAAuC;GAC3C,OAAO;GACP,IAAI;GACN;;EAGA,MAAM,gBAAgB,IAAI,MAAK;;AAG/B,wBAAsB;GACpB,UAAO,QAAA;GACP;GACA,iCAA8B,QAAA;GAC9B,cAAW,QAAA;GACX,YAAS,QAAA;GACT,OAAO,QAAA;GACR,CAAA;;AAGD,mBAAiB,QAAA,UAAU,eAAe,CAAC,QAAA,WAAW,KAAI;;EAG1D,MAAM,gBAAgB;AACpB,WAAA,SAAS,KAAK,2BAA0B;;EAG1C,MAAM,WAAW,oBAAoB;AACnC,OAAI,OAAO,WAAW,YACpB,QAAO,OAAO,SAAS;AAEzB,UAAO;IACR;AAED,cACQ,QAAA,WAAW,OAChB,SAAS;AAER,YAAS,QAAQ;AAEjB,OAAI,CAAC,KACH,UAAQ;IAGd;AAGA,wBAAsB,SAAS,CAAA;;EAG/B,MAAM,wBAAwB;;EAG9B,MAAM,eAAe,eAEjB,QAAA,gBAAgB,YAAY,6BAC5B,sBACJ;;EAGA,MAAM,4BAA4B,UAChC,QAAA,gBAAgB,OAAO,0BAA0B,MAAK;;;;;;EAOxD,MAAM,cAAc,eACZ,qBAAqB,QAAA,gBAAgB,QAAA,SAAS,MAAM,CAAC,YAC7D;AAEA,WAAa;GACX;GACA;GACD,CAAA;;uBAIC,YA8CuB,8BAAA,EA9CA,YAAA,QAAA,YAAU,EAAA;2BAEf,CAAhB,YAAgB,MAAA,aAAA,CAAA,EAIR,QAAA,SAAS,SAAS,QAAA,MAAM,SAAS,QAAA,QAAQ,SAAA,WAAA,EADjD,mBAkCO,QAlCP,YAkCO;KA/BL,YAEsC,MAAA,sBAAA,EAAA;kBAD3B,cAAA;iFAAa,QAAA;MACtB,OAAM;;oBACR,YAYoD,MAAA,gBAAA,EAAA;MAV1C,cAAc,aAAA;mFAAY,QAAA,SAUZ,yBAAA;MATJ;MAClB,OAAM;MACL,WAAS,CAAG,QAAA,SAAS,MAAK;MAC1B,UAAA,QAAA;MACA,mBAAa;MACd,QAAO;MACN,cAAc,QAAA,aAAa;MAC3B,YAAY,EAAE;MACd,cAAY,QAAA,aAAa;;;;;;;kBAVlB,cAAA,MAAa,CAAA,CAAA;KAYvB,YAcoB,mBAAA;MAbA;MAClB,OAAM;MACL,UAAU,QAAA,SAAS;MACnB,cAAc,QAAA,SAAS,MAAK,wBAAyB,MAAE;MACvD,aAAA,YAAA;MACA,UAAA,QAAA;MACA,aAAa,QAAA,aAAa;MAC3B,QAAO;MACN,QAAQ,QAAA,QAAQ;MAChB,SAAA,QAAA;MACA,MAAM,QAAA,MAAM;MACZ,SAAA,QAAA;MACA,iCAAiC,QAAA,gCAAgC;MACjE,gBAAA,QAAA;;;;;;;;;;;;;;wBAGL,mBAIM,OAJN,YAIM,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA,CADJ,mBAAkD,QAAA,EAA5C,OAAM,YAAU,EAAC,wBAAoB,GAAA,CAAA,EAAA,CAAA,EAAA,CAAA"}

package/dist/v2/features/modal/helpers/create-api-client-modal.d.ts CHANGED Viewed

@@ -2,9 +2,9 @@ import { type ModalState } from '@scalar/components';
 import type { ClientPlugin } from '@scalar/oas-utils/helpers';
 import type { WorkspaceStore } from '@scalar/workspace-store/client';
 import { type WorkspaceEventBus } from '@scalar/workspace-store/events';
-import { type App } from 'vue';
+import { type App, type MaybeRefOrGetter } from 'vue';
 import { type RoutePayload } from '../../../../v2/features/modal/helpers/resolve-route-parameters.js';
-import { type ModalProps } from '../../../../v2/features/modal/Modal.vue.js';
+import type { ApiClientModalOptions } from '../../../../v2/features/modal/helpers/types';
 type CreateApiClientModalOptions = {
     /** Element to mount the client modal to. */
     el: HTMLElement | null;
@@ -20,13 +20,14 @@ type CreateApiClientModalOptions = {
     /** Api client plugins to include in the modal */
     plugins?: ClientPlugin[];
     /** Subset of the configuration options for the modal, if you want it to be reactive ensure its a ref */
-    options?: ModalProps['options'];
+    options?: MaybeRefOrGetter<ApiClientModalOptions>;
 };
 export type ApiClientModal = {
     app: App;
     open: (payload?: RoutePayload) => void;
     mount: (mountingEl: HTMLElement | null) => void;
     route: (payload: RoutePayload) => void;
+    updateOptions: (nextOptions: ApiClientModalOptions, overwrite?: boolean) => void;
     modalState: ModalState;
 };
 /**

package/dist/v2/features/modal/helpers/create-api-client-modal.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"create-api-client-modal.d.ts","sourceRoot":"","sources":["../../../../../src/v2/features/modal/helpers/create-api-client-modal.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,UAAU,EAAY,MAAM,oBAAoB,CAAA;AAC9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAA;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAA;AACpE,OAAO,EAAE,KAAK,iBAAiB,EAA2B,MAAM,gCAAgC,CAAA;AAChG,OAAO,EAAE,KAAK,GAAG,~~EAA6C~~,MAAM,KAAK,CAAA;~~AAEzE~~,OAAO,EAEL,KAAK,YAAY,EAElB,MAAM,sDAAsD,CAAA;~~AAE7D~~,~~OAAc~~,EAAE,~~KAAK~~,~~UAAU~~,~~EAAE,~~MAAM~~,+BAA+B~~,CAAA;~~AAEtE~~,KAAK,2BAA2B,GAAG;IACjC,4CAA4C;IAC5C,EAAE,EAAE,WAAW,GAAG,IAAI,CAAA;IACtB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,kFAAkF;IAClF,QAAQ,CAAC,EAAE,iBAAiB,CAAA;IAC5B,6DAA6D;IAC7D,cAAc,EAAE,cAAc,CAAA;IAC9B,iDAAiD;IACjD,OAAO,CAAC,EAAE,YAAY,EAAE,CAAA;IACxB,wGAAwG;IACxG,OAAO,CAAC,EAAE,~~UAAU~~,CAAC,~~SAAS~~,CAAC,CAAA;~~CAChC~~,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;IAC3B,GAAG,EAAE,GAAG,CAAA;IACR,IAAI,EAAE,CAAC,OAAO,CAAC,EAAE,YAAY,KAAK,IAAI,CAAA;IACtC,KAAK,EAAE,CAAC,UAAU,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAA;IAC/C,KAAK,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAA;IACtC,UAAU,EAAE,UAAU,CAAA;CACvB,CAAA;AAED;;;;;GAKG;AACH,eAAO,MAAM,oBAAoB,GAAI,wEASlC,2BAA2B,KAAG,~~cAmGhC~~,CAAA"}
1	+ {"version":3,"file":"create-api-client-modal.d.ts","sourceRoot":"","sources":["../../../../../src/v2/features/modal/helpers/create-api-client-modal.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,UAAU,EAAY,MAAM,oBAAoB,CAAA;AAC9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAA;AAC7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAA;AACpE,OAAO,EAAE,KAAK,iBAAiB,EAA2B,MAAM,gCAAgC,CAAA;AAChG,OAAO,EAAE,KAAK,GAAG,EAAE,KAAK,gBAAgB,EAA6D,MAAM,KAAK,CAAA;AAEhH,OAAO,EAEL,KAAK,YAAY,EAElB,MAAM,sDAAsD,CAAA;AAC7D,OAAO,KAAK,EAAE,qBAAqB,EAA4B,MAAM,mCAAmC,CAAA;AAIxG,KAAK,2BAA2B,GAAG;IACjC,4CAA4C;IAC5C,EAAE,EAAE,WAAW,GAAG,IAAI,CAAA;IACtB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,kFAAkF;IAClF,QAAQ,CAAC,EAAE,iBAAiB,CAAA;IAC5B,6DAA6D;IAC7D,cAAc,EAAE,cAAc,CAAA;IAC9B,iDAAiD;IACjD,OAAO,CAAC,EAAE,YAAY,EAAE,CAAA;IACxB,wGAAwG;IACxG,OAAO,CAAC,EAAE,gBAAgB,CAAC,qBAAqB,CAAC,CAAA;CAClD,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;IAC3B,GAAG,EAAE,GAAG,CAAA;IACR,IAAI,EAAE,CAAC,OAAO,CAAC,EAAE,YAAY,KAAK,IAAI,CAAA;IACtC,KAAK,EAAE,CAAC,UAAU,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAA;IAC/C,KAAK,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAA;IACtC,aAAa,EAAE,CAAC,WAAW,EAAE,qBAAqB,EAAE,SAAS,CAAC,EAAE,OAAO,KAAK,IAAI,CAAA;IAChF,UAAU,EAAE,UAAU,CAAA;CACvB,CAAA;AAED;;;;;GAKG;AACH,eAAO,MAAM,oBAAoB,GAAI,wEASlC,2BAA2B,KAAG,cA2HhC,CAAA"}

package/dist/v2/features/modal/helpers/create-api-client-modal.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { resolveRouteParameters } from "./resolve-route-parameters.js";
 import { useModalSidebar } from "../hooks/use-modal-sidebar.js";
 import Modal_default from "../Modal.vue.js";
-import { computed, createApp, reactive, ref, watch } from "vue";
+import { computed, createApp, isRef, reactive, ref, toValue, watch } from "vue";
 import { useModal } from "@scalar/components";
 import { createWorkspaceEventBus } from "@scalar/workspace-store/events";
 //#region src/v2/features/modal/helpers/create-api-client-modal.ts
@@ -13,6 +13,8 @@ import { createWorkspaceEventBus } from "@scalar/workspace-store/events";
 */
 var createApiClientModal = ({ el, eventBus = createWorkspaceEventBus({ debug: false }), mountOnInitialize = true, plugins = [], workspaceStore, options = {} }) => {
 	const requestBodyCompositionSelection = ref({});
+	/** This is to ensure that the options are a ref if they are not already, useful for react */
+	const optionsRef = isRef(options) ? options : ref(toValue(options));
 	const defaultEntities = {
 		path: "default",
 		method: "default",
@@ -53,13 +55,14 @@ var createApiClientModal = ({ el, eventBus = createWorkspaceEventBus({ debug: fa
 		requestBodyCompositionSelection,
 		sidebarState,
 		workspaceStore,
-		options
+		options: optionsRef
 	});
 	/** Restore the workspace store when the modal is closed. */
 	const handleModalClose = () => {
 		requestBodyCompositionSelection.value = {};
 	};
 	watch(() => modalState.open, (open) => open ? null : handleModalClose());
+	watch(() => toValue(optionsRef).proxyUrl, (newProxyUrl) => workspaceStore.update("x-scalar-active-proxy", newProxyUrl), { immediate: true });
 	app.config.idPrefix = "scalar-client";
 	/** Mount the modal to a given element. */
 	const mount = (mountingEl = el) => {
@@ -78,7 +81,13 @@ var createApiClientModal = ({ el, eventBus = createWorkspaceEventBus({ debug: fa
 		},
 		mount,
 		route,
-		modalState
+		modalState,
+		updateOptions: (newOptions, overwrite = false) => {
+			optionsRef.value = overwrite ? newOptions : {
+				...optionsRef.value,
+				...newOptions
+			};
+		}
 	};
 };
 //#endregion

package/dist/v2/features/modal/helpers/create-api-client-modal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"create-api-client-modal.js","names":[],"sources":["../../../../../src/v2/features/modal/helpers/create-api-client-modal.ts"],"sourcesContent":["import { type ModalState, useModal } from '@scalar/components'\nimport type { ClientPlugin } from '@scalar/oas-utils/helpers'\nimport type { WorkspaceStore } from '@scalar/workspace-store/client'\nimport { type WorkspaceEventBus, createWorkspaceEventBus } from '@scalar/workspace-store/events'\nimport { type App, computed, createApp, reactive, ref, watch } from 'vue'\n\nimport {\n type DefaultEntities,\n type RoutePayload,\n resolveRouteParameters,\n} from '@/v2/features/modal/helpers/resolve-route-parameters'\nimport { useModalSidebar } from '@/v2/features/modal/hooks/use-modal-sidebar'\nimport Modal, { type ModalProps } from '@/v2/features/modal/Modal.vue'\n\ntype CreateApiClientModalOptions = {\n /** Element to mount the client modal to. /\n el: HTMLElement \| null\n /\n Will attempt to mount the references immediately.\n * For SSR this may need to be disabled and handled manually on the client side.\n /\n mountOnInitialize?: boolean\n /* You can pass in an event bus if you have one already, or we will create one /\n eventBus?: WorkspaceEventBus\n /* The workspace store must be initialized and passed in. /\n workspaceStore: WorkspaceStore\n /* Api client plugins to include in the modal /\n plugins?: ClientPlugin[]\n /* Subset of the configuration options for the modal, if you want it to be reactive ensure its a ref /\n options?: ~~ModalProps['options']\~~n}\n\nexport type ApiClientModal = {\n app: App\n open: (payload?: RoutePayload) => void\n mount: (mountingEl: HTMLElement \| null) => void\n route: (payload: RoutePayload) => void\n modalState: ModalState\n}\n\n/\n Creates the API Client Modal.\n \n The modal does not require a router. Instead, navigation is handled by setting\n * active entities directly through the returned `route` function.\n /\nexport const createApiClientModal = ({\n el,\n eventBus = createWorkspaceEventBus({\n debug: import.meta.env.DEV,\n }),\n mountOnInitialize = true,\n plugins = [],\n workspaceStore,\n options = {},\n}: CreateApiClientModalOptions): ApiClientModal => {\n const requestBodyCompositionSelection = ref<Record<string, number>>({})\n\n const defaultEntities: DefaultEntities = {\n path: 'default',\n method: 'default',\n example: 'default',\n documentSlug: workspaceStore.workspace['x-scalar-active-document'] \|\| 'default',\n }\n\n const parameters = reactive<DefaultEntities>({ ...defaultEntities })\n\n /* Navigate to the specified path, method, and example. /\n const route = (payload: RoutePayload): void => {\n Object.assign(parameters, defaultEntities, payload)\n }\n\n /* Resolved parameters from the workspace store. /\n const resolvedParameters = computed(() => resolveRouteParameters(workspaceStore, parameters))\n const documentSlug = computed(() => resolvedParameters.value.documentSlug)\n const path = computed(() => resolvedParameters.value.path)\n const method = computed(() => resolvedParameters.value.method)\n const exampleName = computed(() => resolvedParameters.value.example)\n /* The document from the workspace store. /\n const document = computed(() => workspaceStore.workspace.documents[documentSlug.value ?? ''] ?? null)\n\n /* Sidebar state and selection handling. /\n const sidebarState = useModalSidebar({\n workspaceStore,\n documentSlug: documentSlug,\n path: path,\n method: method,\n exampleName: exampleName,\n route,\n })\n\n const modalState = useModal()\n\n const app = createApp(Modal, {\n document,\n eventBus,\n exampleName,\n method,\n modalState,\n path,\n plugins,\n requestBodyCompositionSelection,\n sidebarState,\n workspaceStore,\n options,\n } satisfies ModalProps)\n\n /* Restore the workspace store when the modal is closed. /\n const handleModalClose = () => {\n requestBodyCompositionSelection.value = {}\n }\n\n watch(\n () => modalState.open,\n (open) => (open ? null : handleModalClose()),\n )\n\n // Use a unique id prefix to prevent collisions with other Vue apps on the page\n app.config.idPrefix = 'scalar-client'\n\n /* Mount the modal to a given element. /\n const mount = (mountingEl: HTMLElement \| null = el): void => {\n if (!mountingEl) {\n console.error(\n '[@scalar/api-client] Could not create the API client Modal.',\n 'Invalid HTML element provided.',\n 'Read more: https://github.com/scalar/scalar/tree/main/packages/api-client',\n )\n return\n }\n app.mount(mountingEl)\n }\n\n if (mountOnInitialize) {\n mount()\n }\n\n return {\n /* The Vue app instance for the modal. Use with caution. /\n app,\n /* Open the modal and optionally navigate to a specific route. /\n open: (payload?: RoutePayload): void => {\n modalState.open = true\n if (payload) {\n route(payload)\n }\n },\n /* Mount the modal to a given element. /\n mount,\n /* Navigate to the specified path, method, and example. /\n route,\n /* Controls the visibility of the modal. */\n modalState,\n }\n}\n"],"mappings":";;;;;;;;;;;;;~~AA8CA~~,IAAa,wBAAwB,EACnC,IACA,WAAW,wBAAwB,EACjC,OAAA,OACD,CAAC,EACF,oBAAoB,MACpB,UAAU,EAAE,EACZ,gBACA,UAAU,EAAE,OACqC;CACjD,MAAM,kCAAkC,IAA4B,EAAE,CAAC;~~CAEvE~~,MAAM,kBAAmC;EACvC,MAAM;EACN,QAAQ;EACR,SAAS;EACT,cAAc,eAAe,UAAU,+BAA+B;EACvE;CAED,MAAM,aAAa,SAA0B,EAAE,GAAG,iBAAiB,CAAC;;CAGpE,MAAM,SAAS,YAAgC;AAC7C,SAAO,OAAO,YAAY,iBAAiB,QAAQ;;;CAIrD,MAAM,qBAAqB,eAAe,uBAAuB,gBAAgB,WAAW,CAAC;CAC7F,MAAM,eAAe,eAAe,mBAAmB,MAAM,aAAa;CAC1E,MAAM,OAAO,eAAe,mBAAmB,MAAM,KAAK;CAC1D,MAAM,SAAS,eAAe,mBAAmB,MAAM,OAAO;CAC9D,MAAM,cAAc,eAAe,mBAAmB,MAAM,QAAQ;;CAEpE,MAAM,WAAW,eAAe,eAAe,UAAU,UAAU,aAAa,SAAS,OAAO,KAAK;;CAGrG,MAAM,eAAe,gBAAgB;EACnC;EACc;EACR;EACE;EACK;EACb;EACD,CAAC;CAEF,MAAM,aAAa,UAAU;CAE7B,MAAM,MAAM,UAAU,eAAO;EAC3B;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;~~EACD~~,CAAsB;;CAGvB,MAAM,yBAAyB;AAC7B,kCAAgC,QAAQ,EAAE;;AAG5C,aACQ,WAAW,OAChB,SAAU,OAAO,OAAO,kBAAkB,CAC5C;AAGD,KAAI,OAAO,WAAW;;CAGtB,MAAM,SAAS,aAAiC,OAAa;AAC3D,MAAI,CAAC,YAAY;AACf,WAAQ,MACN,+DACA,kCACA,4EACD;AACD;;AAEF,MAAI,MAAM,WAAW;;AAGvB,KAAI,kBACF,QAAO;AAGT,QAAO;EAEL;EAEA,OAAO,YAAiC;AACtC,cAAW,OAAO;AAClB,OAAI,QACF,OAAM,QAAQ;;EAIlB;EAEA;EAEA;~~EACD~~"}
1	+ {"version":3,"file":"create-api-client-modal.js","names":[],"sources":["../../../../../src/v2/features/modal/helpers/create-api-client-modal.ts"],"sourcesContent":["import { type ModalState, useModal } from '@scalar/components'\nimport type { ClientPlugin } from '@scalar/oas-utils/helpers'\nimport type { WorkspaceStore } from '@scalar/workspace-store/client'\nimport { type WorkspaceEventBus, createWorkspaceEventBus } from '@scalar/workspace-store/events'\nimport { type App, type MaybeRefOrGetter, computed, createApp, isRef, reactive, ref, toValue, watch } from 'vue'\n\nimport {\n type DefaultEntities,\n type RoutePayload,\n resolveRouteParameters,\n} from '@/v2/features/modal/helpers/resolve-route-parameters'\nimport type { ApiClientModalOptions, ApiClientModalOptionsRef } from '@/v2/features/modal/helpers/types'\nimport { useModalSidebar } from '@/v2/features/modal/hooks/use-modal-sidebar'\nimport Modal, { type ModalProps } from '@/v2/features/modal/Modal.vue'\n\ntype CreateApiClientModalOptions = {\n /** Element to mount the client modal to. /\n el: HTMLElement \| null\n /\n Will attempt to mount the references immediately.\n * For SSR this may need to be disabled and handled manually on the client side.\n /\n mountOnInitialize?: boolean\n /* You can pass in an event bus if you have one already, or we will create one /\n eventBus?: WorkspaceEventBus\n /* The workspace store must be initialized and passed in. /\n workspaceStore: WorkspaceStore\n /* Api client plugins to include in the modal /\n plugins?: ClientPlugin[]\n /* Subset of the configuration options for the modal, if you want it to be reactive ensure its a ref /\n options?: MaybeRefOrGetter<ApiClientModalOptions>\n}\n\nexport type ApiClientModal = {\n app: App\n open: (payload?: RoutePayload) => void\n mount: (mountingEl: HTMLElement \| null) => void\n route: (payload: RoutePayload) => void\n updateOptions: (nextOptions: ApiClientModalOptions, overwrite?: boolean) => void\n modalState: ModalState\n}\n\n/\n Creates the API Client Modal.\n \n The modal does not require a router. Instead, navigation is handled by setting\n * active entities directly through the returned `route` function.\n /\nexport const createApiClientModal = ({\n el,\n eventBus = createWorkspaceEventBus({\n debug: import.meta.env.DEV,\n }),\n mountOnInitialize = true,\n plugins = [],\n workspaceStore,\n options = {},\n}: CreateApiClientModalOptions): ApiClientModal => {\n const requestBodyCompositionSelection = ref<Record<string, number>>({})\n\n /* This is to ensure that the options are a ref if they are not already, useful for react /\n const optionsRef = (isRef(options) ? options : ref(toValue(options))) as ApiClientModalOptionsRef\n\n const defaultEntities: DefaultEntities = {\n path: 'default',\n method: 'default',\n example: 'default',\n documentSlug: workspaceStore.workspace['x-scalar-active-document'] \|\| 'default',\n }\n\n const parameters = reactive<DefaultEntities>({ ...defaultEntities })\n\n /* Navigate to the specified path, method, and example. /\n const route = (payload: RoutePayload): void => {\n Object.assign(parameters, defaultEntities, payload)\n }\n\n /* Resolved parameters from the workspace store. /\n const resolvedParameters = computed(() => resolveRouteParameters(workspaceStore, parameters))\n const documentSlug = computed(() => resolvedParameters.value.documentSlug)\n const path = computed(() => resolvedParameters.value.path)\n const method = computed(() => resolvedParameters.value.method)\n const exampleName = computed(() => resolvedParameters.value.example)\n /* The document from the workspace store. /\n const document = computed(() => workspaceStore.workspace.documents[documentSlug.value ?? ''] ?? null)\n\n /* Sidebar state and selection handling. /\n const sidebarState = useModalSidebar({\n workspaceStore,\n documentSlug: documentSlug,\n path: path,\n method: method,\n exampleName: exampleName,\n route,\n })\n\n const modalState = useModal()\n\n const app = createApp(Modal, {\n document,\n eventBus,\n exampleName,\n method,\n modalState,\n path,\n plugins,\n requestBodyCompositionSelection,\n sidebarState,\n workspaceStore,\n options: optionsRef,\n } satisfies ModalProps)\n\n /* Restore the workspace store when the modal is closed. /\n const handleModalClose = () => {\n requestBodyCompositionSelection.value = {}\n }\n\n watch(\n () => modalState.open,\n (open) => (open ? null : handleModalClose()),\n )\n\n // Update the active proxy when the proxyUrl changes\n watch(\n () => toValue(optionsRef).proxyUrl,\n (newProxyUrl) => workspaceStore.update('x-scalar-active-proxy', newProxyUrl),\n { immediate: true },\n )\n\n // Use a unique id prefix to prevent collisions with other Vue apps on the page\n app.config.idPrefix = 'scalar-client'\n\n /* Mount the modal to a given element. /\n const mount = (mountingEl: HTMLElement \| null = el): void => {\n if (!mountingEl) {\n console.error(\n '[@scalar/api-client] Could not create the API client Modal.',\n 'Invalid HTML element provided.',\n 'Read more: https://github.com/scalar/scalar/tree/main/packages/api-client',\n )\n return\n }\n app.mount(mountingEl)\n }\n\n if (mountOnInitialize) {\n mount()\n }\n\n return {\n /* The Vue app instance for the modal. Use with caution. /\n app,\n /* Open the modal and optionally navigate to a specific route. /\n open: (payload?: RoutePayload): void => {\n modalState.open = true\n if (payload) {\n route(payload)\n }\n },\n /* Mount the modal to a given element. /\n mount,\n /* Navigate to the specified path, method, and example. /\n route,\n /* Controls the visibility of the modal. /\n modalState,\n /\n Merge new options into the current modal options.\n \n @param newOptions - The new options to merge into the current modal options.\n * @param overwrite - Whether to overwrite the current modal options with the new options. If false, the new options will be merged with the current options.\n */\n updateOptions: (newOptions: ApiClientModalOptions, overwrite = false): void => {\n optionsRef.value = overwrite\n ? newOptions\n : {\n ...optionsRef.value,\n ...newOptions,\n }\n },\n }\n}\n"],"mappings":";;;;;;;;;;;;;AAgDA,IAAa,wBAAwB,EACnC,IACA,WAAW,wBAAwB,EACjC,OAAA,OACD,CAAC,EACF,oBAAoB,MACpB,UAAU,EAAE,EACZ,gBACA,UAAU,EAAE,OACqC;CACjD,MAAM,kCAAkC,IAA4B,EAAE,CAAC;;CAGvE,MAAM,aAAc,MAAM,QAAQ,GAAG,UAAU,IAAI,QAAQ,QAAQ,CAAC;CAEpE,MAAM,kBAAmC;EACvC,MAAM;EACN,QAAQ;EACR,SAAS;EACT,cAAc,eAAe,UAAU,+BAA+B;EACvE;CAED,MAAM,aAAa,SAA0B,EAAE,GAAG,iBAAiB,CAAC;;CAGpE,MAAM,SAAS,YAAgC;AAC7C,SAAO,OAAO,YAAY,iBAAiB,QAAQ;;;CAIrD,MAAM,qBAAqB,eAAe,uBAAuB,gBAAgB,WAAW,CAAC;CAC7F,MAAM,eAAe,eAAe,mBAAmB,MAAM,aAAa;CAC1E,MAAM,OAAO,eAAe,mBAAmB,MAAM,KAAK;CAC1D,MAAM,SAAS,eAAe,mBAAmB,MAAM,OAAO;CAC9D,MAAM,cAAc,eAAe,mBAAmB,MAAM,QAAQ;;CAEpE,MAAM,WAAW,eAAe,eAAe,UAAU,UAAU,aAAa,SAAS,OAAO,KAAK;;CAGrG,MAAM,eAAe,gBAAgB;EACnC;EACc;EACR;EACE;EACK;EACb;EACD,CAAC;CAEF,MAAM,aAAa,UAAU;CAE7B,MAAM,MAAM,UAAU,eAAO;EAC3B;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,SAAS;EACV,CAAsB;;CAGvB,MAAM,yBAAyB;AAC7B,kCAAgC,QAAQ,EAAE;;AAG5C,aACQ,WAAW,OAChB,SAAU,OAAO,OAAO,kBAAkB,CAC5C;AAGD,aACQ,QAAQ,WAAW,CAAC,WACzB,gBAAgB,eAAe,OAAO,yBAAyB,YAAY,EAC5E,EAAE,WAAW,MAAM,CACpB;AAGD,KAAI,OAAO,WAAW;;CAGtB,MAAM,SAAS,aAAiC,OAAa;AAC3D,MAAI,CAAC,YAAY;AACf,WAAQ,MACN,+DACA,kCACA,4EACD;AACD;;AAEF,MAAI,MAAM,WAAW;;AAGvB,KAAI,kBACF,QAAO;AAGT,QAAO;EAEL;EAEA,OAAO,YAAiC;AACtC,cAAW,OAAO;AAClB,OAAI,QACF,OAAM,QAAQ;;EAIlB;EAEA;EAEA;EAOA,gBAAgB,YAAmC,YAAY,UAAgB;AAC7E,cAAW,QAAQ,YACf,aACA;IACE,GAAG,WAAW;IACd,GAAG;IACJ;;EAER"}

package/dist/v2/features/modal/helpers/types.d.ts ADDED Viewed

@@ -0,0 +1,8 @@
+import type { ApiReferenceConfigurationRaw } from '@scalar/types/api-reference';
+import type { Ref } from 'vue';
+/**
+ * Configuration options supported by the API Client modal constructor.
+ */
+export type ApiClientModalOptions = Partial<Pick<ApiReferenceConfigurationRaw, 'authentication' | 'baseServerURL' | 'hideClientButton' | 'hiddenClients' | 'oauth2RedirectUri' | 'proxyUrl' | 'servers'>>;
+export type ApiClientModalOptionsRef = Ref<ApiClientModalOptions>;
+//# sourceMappingURL=types.d.ts.map

package/dist/v2/features/modal/helpers/types.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/v2/features/modal/helpers/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,6BAA6B,CAAA;AAC/E,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAE9B;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG,OAAO,CACzC,IAAI,CACF,4BAA4B,EAC1B,gBAAgB,GAChB,eAAe,GACf,kBAAkB,GAClB,eAAe,GACf,mBAAmB,GACnB,UAAU,GACV,SAAS,CACZ,CACF,CAAA;AAED,MAAM,MAAM,wBAAwB,GAAG,GAAG,CAAC,qBAAqB,CAAC,CAAA"}

package/dist/v2/features/modal/index.d.ts CHANGED Viewed

@@ -1,5 +1,6 @@
 export { type ApiClientModal, createApiClientModal } from './helpers/create-api-client-modal.js';
 export { mapHiddenClientsConfig } from './helpers/map-hidden-clients-config.js';
 export type { RoutePayload } from './helpers/resolve-route-parameters.js';
+export type { ApiClientModalOptions } from './helpers/types';
 export { initializeModalEvents } from './modal-events.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/v2/features/modal/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/v2/features/modal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAE,oBAAoB,EAAE,MAAM,mCAAmC,CAAA;AAC7F,OAAO,EAAE,sBAAsB,EAAE,MAAM,qCAAqC,CAAA;AAC5E,YAAY,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAA;AACtE,OAAO,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAA"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/v2/features/modal/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,cAAc,EAAE,oBAAoB,EAAE,MAAM,mCAAmC,CAAA;AAC7F,OAAO,EAAE,sBAAsB,EAAE,MAAM,qCAAqC,CAAA;AAC5E,YAAY,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAA;AACtE,YAAY,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAA;AAC5D,OAAO,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAA"}

package/dist/v2/features/operation/Operation.vue.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import type { RouteProps } from '../../../v2/features/app/helpers/routes.js';
-import type { ModalProps } from '../../../v2/features/modal/Modal.vue.js';
+import type { ApiClientModalOptionsRef } from '../../../v2/features/modal/helpers/types';
 /**
  * Operation example page
  *
@@ -12,12 +12,12 @@ declare const _default: typeof __VLS_export;
 export default _default;
 declare const __VLS_export: import("vue").DefineComponent<RouteProps & {
     /** Subset of config options for the modal */
-    options?: ModalProps["options"];
+    options?: ApiClientModalOptionsRef;
     /** Selected anyOf/oneOf request-body variants keyed by schema path */
     requestBodyCompositionSelection?: Record<string, number>;
 }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<RouteProps & {
     /** Subset of config options for the modal */
-    options?: ModalProps["options"];
+    options?: ApiClientModalOptionsRef;
     /** Selected anyOf/oneOf request-body variants keyed by schema path */
     requestBodyCompositionSelection?: Record<string, number>;
 }> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/v2/features/operation/Operation.vue.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Operation.vue.d.ts","sourceRoot":"","sources":["../../../../src/v2/features/operation/Operation.vue"],"names":[],"mappings":"~~AAmMA~~,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kCAAkC,CAAA;AAElE,OAAO,KAAK,EAAE,~~UAAU~~,EAAE,MAAM~~,+BAA+B~~,CAAA;~~AAG/D~~;;;;;;;GAOG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY;IAEd,6CAA6C;cACnC,~~UAAU,CAAC,SAAS,CAAC~~;~~IAC/B~~,sEAAsE;sCACpC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;;IAHxD,6CAA6C;cACnC,~~UAAU,CAAC,SAAS,CAAC~~;~~IAC/B~~,sEAAsE;sCACpC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;~~iGAuPxD~~,CAAC"}
1	+ {"version":3,"file":"Operation.vue.d.ts","sourceRoot":"","sources":["../../../../src/v2/features/operation/Operation.vue"],"names":[],"mappings":"AAoMA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,kCAAkC,CAAA;AAElE,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,mCAAmC,CAAA;AAGjF;;;;;;;GAOG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY;IAEd,6CAA6C;cACnC,wBAAwB;IAClC,sEAAsE;sCACpC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;;IAHxD,6CAA6C;cACnC,wBAAwB;IAClC,sEAAsE;sCACpC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC;iGAyPxD,CAAC"}

package/dist/v2/features/operation/Operation.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Operation.vue.js","names":[],"sources":["../../../../src/v2/features/operation/Operation.vue"],"sourcesContent":["<script lang=\"ts\">\n/*\n Operation example page\n \n Displays an operation with a specific example selected\n * - View example request data\n * - Modify example request data\n * - Send example request\n /\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport {\n getActiveProxyUrl,\n getRequestExampleContext,\n} from '@scalar/workspace-store/request-example'\nimport { computed, toValue } from 'vue'\n\nimport { ~~isElectron } from '@/libs/electron'\nimport {~~ OperationBlock } from '@/v2/blocks/operation-block'\nimport { APP_VERSION } from '@/v2/constants'\nimport type { RouteProps } from '@/v2/features/app/helpers/routes'\nimport { mapHiddenClientsConfig } from '@/v2/features/modal/helpers/map-hidden-clients-config'\nimport type { ~~ModalProps~~ } from '@/v2/features/modal/~~Modal.vue~~'\n\nconst {\n document,\n layout,\n eventBus,\n path,\n method,\n environment,\n exampleName,\n options,\n workspaceStore,\n plugins,\n documentSlug,\n} = defineProps<\n RouteProps & {\n /* Subset of config options for the modal /\n options?: ~~ModalProps['options']~~\n /* Selected anyOf/oneOf request-body variants keyed by schema path /\n requestBodyCompositionSelection?: Record<string, number>\n }\n>()\n\n/\n Shared request-example context (operation, servers, auth scope, cookies). Recomputed when any\n * underlying workspace or route input changes — same reactivity as the previous local computeds.\n /\nconst requestExample = computed(() => {\n if (!path \|\| !method \|\| !exampleName \|\| !document) {\n return null\n }\n\n const result = getRequestExampleContext(\n workspaceStore,\n documentSlug,\n { path, method, exampleName },\n {\n baseServerUrl: toValue(options)?.baseServerURL,\n fallbackDocument: document,\n isElectron: isElectron(),\n layout: layout === 'web' ? 'web' : 'other',\n servers: toValue(options)?.servers,\n appVersion: APP_VERSION,\n authentication: toValue(options)?.authentication,\n },\n )\n\n return result.ok ? result.data : null\n})\n\nconst operation = computed(() => requestExample.value?.operation ?? null)\nconst workspaceCookies = computed(\n () => requestExample.value?.cookies.workspace ?? [],\n)\nconst documentCookies = computed(\n () => requestExample.value?.cookies.document ?? [],\n)\nconst servers = computed(() => requestExample.value?.servers.list ?? [])\nconst selectedServer = computed(\n () => requestExample.value?.servers.selected ?? null,\n)\nconst serverMeta = computed(\n () => requestExample.value?.servers.meta ?? { type: 'document' as const },\n)\n\nconst securitySchemes = computed(\n () => requestExample.value?.security.schemes ?? {},\n)\n\nconst selectedSecurity = computed(\n () =>\n requestExample.value?.security.selected ?? {\n selectedIndex: -1,\n selectedSchemes: [],\n },\n)\nconst selectedSecuritySchemes = computed(\n () => requestExample.value?.security.selectedSchemes ?? [],\n)\nconst securityRequirements = computed(\n () => requestExample.value?.security.requirements ?? [],\n)\nconst authMeta = computed(\n () => requestExample.value?.security.meta ?? { type: 'document' as const },\n)\n\nconst defaultHeaders = computed(\n () => requestExample.value?.headers.default ?? {},\n)\n\n/* Combine environments from document and workspace into a unique array of environment names /\nconst environments = computed(() => {\n return Array.from(\n new Set(\n Object.keys({\n ...document?.['x-scalar-environments'],\n ...workspaceStore.workspace['x-scalar-environments'],\n }),\n ),\n )\n})\n\n/* Temporarily use the old config.hiddenClients until we migrate to the new httpClients config */\nconst httpClients = computed(() =>\n mapHiddenClientsConfig(toValue(options)?.hiddenClients),\n)\n</script>\n\n<template>\n <!-- Operation exists -->\n <template v-if=\"path && method && exampleName && operation && document\">\n <OperationBlock\n :activeEnvironment=\"\n workspaceStore.workspace['x-scalar-active-environment']\n \"\n :appVersion=\"APP_VERSION\"\n :authMeta\n :defaultHeaders\n :document\n :documentCookies\n :documentSecurity=\"document?.security ?? []\"\n :documentUrl=\"document?.['x-scalar-original-source-url']\"\n :environment\n :environments\n :eventBus\n :exampleKey=\"exampleName\"\n :hideClientButton=\"toValue(options)?.hideClientButton ?? false\"\n :history=\"workspaceStore.history.getHistory(documentSlug, path, method)\"\n :httpClients\n :layout\n :method\n :operation\n :path\n :plugins=\"plugins\"\n :proxyUrl=\"\n getActiveProxyUrl(\n workspaceStore.workspace['x-scalar-active-proxy'],\n layout === 'web' ? 'web' : 'other',\n ) ?? ''\n \"\n :requestBodyCompositionSelection\n :securityRequirements=\"securityRequirements\"\n :securitySchemes\n :selectedClient=\"workspaceStore.workspace['x-scalar-default-client']\"\n :selectedSecurity=\"selectedSecurity\"\n :selectedSecuritySchemes=\"selectedSecuritySchemes\"\n :server=\"selectedServer\"\n :serverMeta\n :servers\n :workspaceCookies />\n </template>\n\n <!-- Empty state -->\n <div\n v-else\n class=\"flex h-full w-full items-center justify-center\">\n <span class=\"text-c-3\">Select an operation to view details</span>\n </div>\n</template>\n"],"mappings":""}
1	+ {"version":3,"file":"Operation.vue.js","names":[],"sources":["../../../../src/v2/features/operation/Operation.vue"],"sourcesContent":["<script lang=\"ts\">\n/*\n Operation example page\n \n Displays an operation with a specific example selected\n * - View example request data\n * - Modify example request data\n * - Send example request\n /\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport { isElectron } from '@scalar/helpers/general/is-electron'\nimport {\n getActiveProxyUrl,\n getRequestExampleContext,\n} from '@scalar/workspace-store/request-example'\nimport { computed, toValue } from 'vue'\n\nimport { OperationBlock } from '@/v2/blocks/operation-block'\nimport { APP_VERSION } from '@/v2/constants'\nimport type { RouteProps } from '@/v2/features/app/helpers/routes'\nimport { mapHiddenClientsConfig } from '@/v2/features/modal/helpers/map-hidden-clients-config'\nimport type { ApiClientModalOptionsRef } from '@/v2/features/modal/helpers/types'\n\nconst {\n document,\n layout,\n eventBus,\n path,\n method,\n environment,\n exampleName,\n options,\n workspaceStore,\n plugins,\n documentSlug,\n} = defineProps<\n RouteProps & {\n /* Subset of config options for the modal /\n options?: ApiClientModalOptionsRef\n /* Selected anyOf/oneOf request-body variants keyed by schema path /\n requestBodyCompositionSelection?: Record<string, number>\n }\n>()\n\n/\n Shared request-example context (operation, servers, auth scope, cookies). Recomputed when any\n * underlying workspace or route input changes — same reactivity as the previous local computeds.\n /\nconst requestExample = computed(() => {\n if (!path \|\| !method \|\| !exampleName \|\| !document) {\n return null\n }\n\n const result = getRequestExampleContext(\n workspaceStore,\n documentSlug,\n { path, method, exampleName },\n {\n baseServerUrl: toValue(options)?.baseServerURL,\n fallbackDocument: document,\n isElectron: isElectron(),\n layout: layout === 'web' ? 'web' : 'other',\n servers: toValue(options)?.servers,\n appVersion: APP_VERSION,\n authentication: toValue(options)?.authentication,\n },\n )\n\n return result.ok ? result.data : null\n})\n\nconst operation = computed(() => requestExample.value?.operation ?? null)\nconst workspaceCookies = computed(\n () => requestExample.value?.cookies.workspace ?? [],\n)\nconst documentCookies = computed(\n () => requestExample.value?.cookies.document ?? [],\n)\nconst servers = computed(() => requestExample.value?.servers.list ?? [])\nconst selectedServer = computed(\n () => requestExample.value?.servers.selected ?? null,\n)\nconst serverMeta = computed(\n () => requestExample.value?.servers.meta ?? { type: 'document' as const },\n)\n\nconst securitySchemes = computed(\n () => requestExample.value?.security.schemes ?? {},\n)\n\nconst selectedSecurity = computed(\n () =>\n requestExample.value?.security.selected ?? {\n selectedIndex: -1,\n selectedSchemes: [],\n },\n)\nconst selectedSecuritySchemes = computed(\n () => requestExample.value?.security.selectedSchemes ?? [],\n)\nconst securityRequirements = computed(\n () => requestExample.value?.security.requirements ?? [],\n)\nconst authMeta = computed(\n () => requestExample.value?.security.meta ?? { type: 'document' as const },\n)\n\nconst defaultHeaders = computed(\n () => requestExample.value?.headers.default ?? {},\n)\n\n/* Combine environments from document and workspace into a unique array of environment names /\nconst environments = computed(() => {\n return Array.from(\n new Set(\n Object.keys({\n ...document?.['x-scalar-environments'],\n ...workspaceStore.workspace['x-scalar-environments'],\n }),\n ),\n )\n})\n\n/* Temporarily use the old config.hiddenClients until we migrate to the new httpClients config */\nconst httpClients = computed(() =>\n mapHiddenClientsConfig(toValue(options)?.hiddenClients),\n)\n</script>\n\n<template>\n <!-- Operation exists -->\n <template v-if=\"path && method && exampleName && operation && document\">\n <OperationBlock\n :activeEnvironment=\"\n workspaceStore.workspace['x-scalar-active-environment']\n \"\n :appVersion=\"APP_VERSION\"\n :authMeta\n :defaultHeaders\n :document\n :documentCookies\n :documentSecurity=\"document?.security ?? []\"\n :documentUrl=\"document?.['x-scalar-original-source-url']\"\n :environment\n :environments\n :eventBus\n :exampleKey=\"exampleName\"\n :hideClientButton=\"toValue(options)?.hideClientButton ?? false\"\n :history=\"workspaceStore.history.getHistory(documentSlug, path, method)\"\n :httpClients\n :layout\n :method\n :operation\n :options\n :path\n :plugins=\"plugins\"\n :proxyUrl=\"\n getActiveProxyUrl(\n workspaceStore.workspace['x-scalar-active-proxy'],\n layout === 'web' ? 'web' : 'other',\n ) ?? ''\n \"\n :requestBodyCompositionSelection\n :securityRequirements=\"securityRequirements\"\n :securitySchemes\n :selectedClient=\"workspaceStore.workspace['x-scalar-default-client']\"\n :selectedSecurity=\"selectedSecurity\"\n :selectedSecuritySchemes=\"selectedSecuritySchemes\"\n :server=\"selectedServer\"\n :serverMeta\n :servers\n :workspaceCookies />\n </template>\n\n <!-- Empty state -->\n <div\n v-else\n class=\"flex h-full w-full items-center justify-center\">\n <span class=\"text-c-3\">Select an operation to view details</span>\n </div>\n</template>\n"],"mappings":""}

package/dist/v2/features/operation/Operation.vue.script.js CHANGED Viewed

@@ -1,8 +1,8 @@
-import { isElectron } from "../../../libs/electron.js";
 import { APP_VERSION } from "../../constants.js";
 import OperationBlock_default from "../../blocks/operation-block/OperationBlock.vue.js";
 import { mapHiddenClientsConfig } from "../modal/helpers/map-hidden-clients-config.js";
 import { computed, createBlock, createElementBlock, createElementVNode, defineComponent, openBlock, toValue, unref } from "vue";
+import { isElectron } from "@scalar/helpers/general/is-electron";
 import { getActiveProxyUrl, getRequestExampleContext } from "@scalar/workspace-store/request-example";
 //#region src/v2/features/operation/Operation.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = {
@@ -99,6 +99,7 @@ var Operation_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
 				layout: __props.layout,
 				method: __props.method,
 				operation: operation.value,
+				options: __props.options,
 				path: __props.path,
 				plugins: __props.plugins,
 				proxyUrl: unref(getActiveProxyUrl)(__props.workspaceStore.workspace["x-scalar-active-proxy"], __props.layout === "web" ? "web" : "other") ?? "",
@@ -131,6 +132,7 @@ var Operation_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defi
 				"layout",
 				"method",
 				"operation",
+				"options",
 				"path",
 				"plugins",
 				"proxyUrl",

package/dist/v2/features/operation/Operation.vue.script.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Operation.vue.script.js","names":[],"sources":["../../../../src/v2/features/operation/Operation.vue"],"sourcesContent":["<script lang=\"ts\">\n/*\n Operation example page\n \n Displays an operation with a specific example selected\n * - View example request data\n * - Modify example request data\n * - Send example request\n /\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport {\n getActiveProxyUrl,\n getRequestExampleContext,\n} from '@scalar/workspace-store/request-example'\nimport { computed, toValue } from 'vue'\n\nimport { ~~isElectron } from '@/libs/electron'\nimport {~~ OperationBlock } from '@/v2/blocks/operation-block'\nimport { APP_VERSION } from '@/v2/constants'\nimport type { RouteProps } from '@/v2/features/app/helpers/routes'\nimport { mapHiddenClientsConfig } from '@/v2/features/modal/helpers/map-hidden-clients-config'\nimport type { ~~ModalProps~~ } from '@/v2/features/modal/~~Modal.vue~~'\n\nconst {\n document,\n layout,\n eventBus,\n path,\n method,\n environment,\n exampleName,\n options,\n workspaceStore,\n plugins,\n documentSlug,\n} = defineProps<\n RouteProps & {\n /* Subset of config options for the modal /\n options?: ~~ModalProps['options']~~\n /* Selected anyOf/oneOf request-body variants keyed by schema path /\n requestBodyCompositionSelection?: Record<string, number>\n }\n>()\n\n/\n Shared request-example context (operation, servers, auth scope, cookies). Recomputed when any\n * underlying workspace or route input changes — same reactivity as the previous local computeds.\n /\nconst requestExample = computed(() => {\n if (!path \|\| !method \|\| !exampleName \|\| !document) {\n return null\n }\n\n const result = getRequestExampleContext(\n workspaceStore,\n documentSlug,\n { path, method, exampleName },\n {\n baseServerUrl: toValue(options)?.baseServerURL,\n fallbackDocument: document,\n isElectron: isElectron(),\n layout: layout === 'web' ? 'web' : 'other',\n servers: toValue(options)?.servers,\n appVersion: APP_VERSION,\n authentication: toValue(options)?.authentication,\n },\n )\n\n return result.ok ? result.data : null\n})\n\nconst operation = computed(() => requestExample.value?.operation ?? null)\nconst workspaceCookies = computed(\n () => requestExample.value?.cookies.workspace ?? [],\n)\nconst documentCookies = computed(\n () => requestExample.value?.cookies.document ?? [],\n)\nconst servers = computed(() => requestExample.value?.servers.list ?? [])\nconst selectedServer = computed(\n () => requestExample.value?.servers.selected ?? null,\n)\nconst serverMeta = computed(\n () => requestExample.value?.servers.meta ?? { type: 'document' as const },\n)\n\nconst securitySchemes = computed(\n () => requestExample.value?.security.schemes ?? {},\n)\n\nconst selectedSecurity = computed(\n () =>\n requestExample.value?.security.selected ?? {\n selectedIndex: -1,\n selectedSchemes: [],\n },\n)\nconst selectedSecuritySchemes = computed(\n () => requestExample.value?.security.selectedSchemes ?? [],\n)\nconst securityRequirements = computed(\n () => requestExample.value?.security.requirements ?? [],\n)\nconst authMeta = computed(\n () => requestExample.value?.security.meta ?? { type: 'document' as const },\n)\n\nconst defaultHeaders = computed(\n () => requestExample.value?.headers.default ?? {},\n)\n\n/* Combine environments from document and workspace into a unique array of environment names /\nconst environments = computed(() => {\n return Array.from(\n new Set(\n Object.keys({\n ...document?.['x-scalar-environments'],\n ...workspaceStore.workspace['x-scalar-environments'],\n }),\n ),\n )\n})\n\n/* Temporarily use the old config.hiddenClients until we migrate to the new httpClients config */\nconst httpClients = computed(() =>\n mapHiddenClientsConfig(toValue(options)?.hiddenClients),\n)\n</script>\n\n<template>\n <!-- Operation exists -->\n <template v-if=\"path && method && exampleName && operation && document\">\n <OperationBlock\n :activeEnvironment=\"\n workspaceStore.workspace['x-scalar-active-environment']\n \"\n :appVersion=\"APP_VERSION\"\n :authMeta\n :defaultHeaders\n :document\n :documentCookies\n :documentSecurity=\"document?.security ?? []\"\n :documentUrl=\"document?.['x-scalar-original-source-url']\"\n :environment\n :environments\n :eventBus\n :exampleKey=\"exampleName\"\n :hideClientButton=\"toValue(options)?.hideClientButton ?? false\"\n :history=\"workspaceStore.history.getHistory(documentSlug, path, method)\"\n :httpClients\n :layout\n :method\n :operation\n :path\n :plugins=\"plugins\"\n :proxyUrl=\"\n getActiveProxyUrl(\n workspaceStore.workspace['x-scalar-active-proxy'],\n layout === 'web' ? 'web' : 'other',\n ) ?? ''\n \"\n :requestBodyCompositionSelection\n :securityRequirements=\"securityRequirements\"\n :securitySchemes\n :selectedClient=\"workspaceStore.workspace['x-scalar-default-client']\"\n :selectedSecurity=\"selectedSecurity\"\n :selectedSecuritySchemes=\"selectedSecuritySchemes\"\n :server=\"selectedServer\"\n :serverMeta\n :servers\n :workspaceCookies />\n </template>\n\n <!-- Empty state -->\n <div\n v-else\n class=\"flex h-full w-full items-center justify-center\">\n <span class=\"text-c-3\">Select an operation to view details</span>\n </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAmDA,MAAM,iBAAiB,eAAe;AACpC,OAAI,CAAC,QAAA,QAAQ,CAAC,QAAA,UAAU,CAAC,QAAA,eAAe,CAAC,QAAA,SACvC,QAAO;GAGT,MAAM,SAAS,yBACb,QAAA,gBACA,QAAA,cACA;IAAE,MAAG,QAAA;IAAG,QAAK,QAAA;IAAG,aAAU,QAAA;IAAG,EAC7B;IACE,eAAe,QAAQ,QAAA,QAAQ,EAAE;IACjC,kBAAkB,QAAA;IAClB,YAAY,YAAY;IACxB,QAAQ,QAAA,WAAW,QAAQ,QAAQ;IACnC,SAAS,QAAQ,QAAA,QAAQ,EAAE;IAC3B,YAAY;IACZ,gBAAgB,QAAQ,QAAA,QAAQ,EAAE;IACnC,CACH;AAEA,UAAO,OAAO,KAAK,OAAO,OAAO;IAClC;EAED,MAAM,YAAY,eAAe,eAAe,OAAO,aAAa,KAAI;EACxE,MAAM,mBAAmB,eACjB,eAAe,OAAO,QAAQ,aAAa,EAAE,CACrD;EACA,MAAM,kBAAkB,eAChB,eAAe,OAAO,QAAQ,YAAY,EAAE,CACpD;EACA,MAAM,UAAU,eAAe,eAAe,OAAO,QAAQ,QAAQ,EAAE,CAAA;EACvE,MAAM,iBAAiB,eACf,eAAe,OAAO,QAAQ,YAAY,KAClD;EACA,MAAM,aAAa,eACX,eAAe,OAAO,QAAQ,QAAQ,EAAE,MAAM,YAAqB,CAC3E;EAEA,MAAM,kBAAkB,eAChB,eAAe,OAAO,SAAS,WAAW,EAAE,CACpD;EAEA,MAAM,mBAAmB,eAErB,eAAe,OAAO,SAAS,YAAY;GACzC,eAAe;GACf,iBAAiB,EAAE;GACpB,CACL;EACA,MAAM,0BAA0B,eACxB,eAAe,OAAO,SAAS,mBAAmB,EAAE,CAC5D;EACA,MAAM,uBAAuB,eACrB,eAAe,OAAO,SAAS,gBAAgB,EAAE,CACzD;EACA,MAAM,WAAW,eACT,eAAe,OAAO,SAAS,QAAQ,EAAE,MAAM,YAAqB,CAC5E;EAEA,MAAM,iBAAiB,eACf,eAAe,OAAO,QAAQ,WAAW,EAAE,CACnD;;EAGA,MAAM,eAAe,eAAe;AAClC,UAAO,MAAM,KACX,IAAI,IACF,OAAO,KAAK;IACV,GAAG,QAAA,WAAW;IACd,GAAG,QAAA,eAAe,UAAU;IAC7B,CAAC,CACH,CACH;IACD;;EAGD,MAAM,cAAc,eAClB,uBAAuB,QAAQ,QAAA,QAAQ,EAAE,cAAc,CACzD;;UAKkB,QAAA,QAAQ,QAAA,UAAU,QAAA,eAAe,UAAA,SAAa,QAAA,YAAA,WAAA,EAC5D,~~YAsCsB~~,MAAA,uBAAA,EAAA;;~~IArCnB~~,mBAA4B,QAAA,eAAe,UAAS;IAGpD,YAAY,MAAA,YAAW;IACvB,UAAA,SAAA;IACA,gBAAA,eAAA;IACA,UAAA,QAAA;IACA,iBAAA,gBAAA;IACA,kBAAkB,QAAA,UAAU,YAAQ,EAAA;IACpC,aAAa,QAAA,WAAQ;IACrB,aAAA,QAAA;IACA,cAAA,aAAA;IACA,UAAA,QAAA;IACA,YAAY,QAAA;IACZ,kBAAkB,QAAQ,QAAA,QAAO,EAAG,oBAAgB;IACpD,SAAS,QAAA,eAAe,QAAQ,WAAW,QAAA,cAAc,QAAA,MAAM,QAAA,OAAM;IACrE,aAAA,YAAA;IACA,QAAA,QAAA;IACA,QAAA,QAAA;IACA,WAAA,UAAA;IACA,MAAA,QAAA;IACA,SAAS,QAAA;IACT,UAAmB,MAAA,kBAAiB,CAAY,QAAA,eAAe,UAAS,0BAAqC,QAAA,WAAM,QAAA,QAAA,QAAA,IAAA;IAMnH,iCAAA,QAAA;IACA,sBAAsB,qBAAA;IACtB,iBAAA,gBAAA;IACA,gBAAgB,QAAA,eAAe,UAAS;IACxC,kBAAkB,iBAAA;IAClB,yBAAyB,wBAAA;IACzB,QAAQ,eAAA;IACR,YAAA,WAAA;IACA,SAAA,QAAA;IACA,kBAAA,iBAAA~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~uBAIL,mBAIM,OAJN,YAIM,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA,CADJ,mBAAiE,QAAA,EAA3D,OAAM,YAAU,EAAC,uCAAmC,GAAA,CAAA,EAAA,CAAA"}
1	+ {"version":3,"file":"Operation.vue.script.js","names":[],"sources":["../../../../src/v2/features/operation/Operation.vue"],"sourcesContent":["<script lang=\"ts\">\n/*\n Operation example page\n \n Displays an operation with a specific example selected\n * - View example request data\n * - Modify example request data\n * - Send example request\n /\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport { isElectron } from '@scalar/helpers/general/is-electron'\nimport {\n getActiveProxyUrl,\n getRequestExampleContext,\n} from '@scalar/workspace-store/request-example'\nimport { computed, toValue } from 'vue'\n\nimport { OperationBlock } from '@/v2/blocks/operation-block'\nimport { APP_VERSION } from '@/v2/constants'\nimport type { RouteProps } from '@/v2/features/app/helpers/routes'\nimport { mapHiddenClientsConfig } from '@/v2/features/modal/helpers/map-hidden-clients-config'\nimport type { ApiClientModalOptionsRef } from '@/v2/features/modal/helpers/types'\n\nconst {\n document,\n layout,\n eventBus,\n path,\n method,\n environment,\n exampleName,\n options,\n workspaceStore,\n plugins,\n documentSlug,\n} = defineProps<\n RouteProps & {\n /* Subset of config options for the modal /\n options?: ApiClientModalOptionsRef\n /* Selected anyOf/oneOf request-body variants keyed by schema path /\n requestBodyCompositionSelection?: Record<string, number>\n }\n>()\n\n/\n Shared request-example context (operation, servers, auth scope, cookies). Recomputed when any\n * underlying workspace or route input changes — same reactivity as the previous local computeds.\n /\nconst requestExample = computed(() => {\n if (!path \|\| !method \|\| !exampleName \|\| !document) {\n return null\n }\n\n const result = getRequestExampleContext(\n workspaceStore,\n documentSlug,\n { path, method, exampleName },\n {\n baseServerUrl: toValue(options)?.baseServerURL,\n fallbackDocument: document,\n isElectron: isElectron(),\n layout: layout === 'web' ? 'web' : 'other',\n servers: toValue(options)?.servers,\n appVersion: APP_VERSION,\n authentication: toValue(options)?.authentication,\n },\n )\n\n return result.ok ? result.data : null\n})\n\nconst operation = computed(() => requestExample.value?.operation ?? null)\nconst workspaceCookies = computed(\n () => requestExample.value?.cookies.workspace ?? [],\n)\nconst documentCookies = computed(\n () => requestExample.value?.cookies.document ?? [],\n)\nconst servers = computed(() => requestExample.value?.servers.list ?? [])\nconst selectedServer = computed(\n () => requestExample.value?.servers.selected ?? null,\n)\nconst serverMeta = computed(\n () => requestExample.value?.servers.meta ?? { type: 'document' as const },\n)\n\nconst securitySchemes = computed(\n () => requestExample.value?.security.schemes ?? {},\n)\n\nconst selectedSecurity = computed(\n () =>\n requestExample.value?.security.selected ?? {\n selectedIndex: -1,\n selectedSchemes: [],\n },\n)\nconst selectedSecuritySchemes = computed(\n () => requestExample.value?.security.selectedSchemes ?? [],\n)\nconst securityRequirements = computed(\n () => requestExample.value?.security.requirements ?? [],\n)\nconst authMeta = computed(\n () => requestExample.value?.security.meta ?? { type: 'document' as const },\n)\n\nconst defaultHeaders = computed(\n () => requestExample.value?.headers.default ?? {},\n)\n\n/* Combine environments from document and workspace into a unique array of environment names /\nconst environments = computed(() => {\n return Array.from(\n new Set(\n Object.keys({\n ...document?.['x-scalar-environments'],\n ...workspaceStore.workspace['x-scalar-environments'],\n }),\n ),\n )\n})\n\n/* Temporarily use the old config.hiddenClients until we migrate to the new httpClients config */\nconst httpClients = computed(() =>\n mapHiddenClientsConfig(toValue(options)?.hiddenClients),\n)\n</script>\n\n<template>\n <!-- Operation exists -->\n <template v-if=\"path && method && exampleName && operation && document\">\n <OperationBlock\n :activeEnvironment=\"\n workspaceStore.workspace['x-scalar-active-environment']\n \"\n :appVersion=\"APP_VERSION\"\n :authMeta\n :defaultHeaders\n :document\n :documentCookies\n :documentSecurity=\"document?.security ?? []\"\n :documentUrl=\"document?.['x-scalar-original-source-url']\"\n :environment\n :environments\n :eventBus\n :exampleKey=\"exampleName\"\n :hideClientButton=\"toValue(options)?.hideClientButton ?? false\"\n :history=\"workspaceStore.history.getHistory(documentSlug, path, method)\"\n :httpClients\n :layout\n :method\n :operation\n :options\n :path\n :plugins=\"plugins\"\n :proxyUrl=\"\n getActiveProxyUrl(\n workspaceStore.workspace['x-scalar-active-proxy'],\n layout === 'web' ? 'web' : 'other',\n ) ?? ''\n \"\n :requestBodyCompositionSelection\n :securityRequirements=\"securityRequirements\"\n :securitySchemes\n :selectedClient=\"workspaceStore.workspace['x-scalar-default-client']\"\n :selectedSecurity=\"selectedSecurity\"\n :selectedSecuritySchemes=\"selectedSecuritySchemes\"\n :server=\"selectedServer\"\n :serverMeta\n :servers\n :workspaceCookies />\n </template>\n\n <!-- Empty state -->\n <div\n v-else\n class=\"flex h-full w-full items-center justify-center\">\n <span class=\"text-c-3\">Select an operation to view details</span>\n </div>\n</template>\n"],"mappings":"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"}