npm - @scalar/api-client - Versions diffs - 3.13.7 → 3.15.0 - Mend

@scalar/api-client 3.13.7 → 3.15.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 (385) hide show

package/dist/v2/blocks/request-block/components/RequestBody.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RequestBody.vue.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestBody.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton } from '@scalar/components/button'\nimport { ScalarIcon } from '@scalar/components/icon'\nimport { ScalarListbox } from '@scalar/components/listbox'\nimport { CONTENT_TYPES } from '@scalar/helpers/http/content-types'\nimport { parseMimeType } from '@scalar/helpers/http/mime-type'\nimport { objectEntries } from '@scalar/helpers/object/object-entries'\nimport type { ApiReferenceEvents } from '@scalar/workspace-store/events'\nimport { unpackProxyObject } from '@scalar/workspace-store/helpers/unpack-proxy'\nimport {\n getExampleFromBody,\n getSelectedBodyContentType,\n} from '@scalar/workspace-store/request-example'\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type {\n RequestBodyObject,\n SchemaObject,\n} from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { computed } from 'vue'\n\nimport { useFileDialog } from '@/hooks/use-file-dialog'\nimport RequestBodyForm from '@/v2/blocks/request-block/components/RequestBodyForm.vue'\nimport { getFileName } from '@/v2/blocks/request-block/helpers/files'\nimport { CodeInput } from '@/v2/components/code-input'\nimport {\n DataTable,\n DataTableHeader,\n DataTableRow,\n} from '@/v2/components/data-table'\nimport { CollapsibleSection } from '@/v2/components/layout'\n\nconst {\n requestBody,\n exampleKey,\n environment,\n requestBodyCompositionSelection,\n title,\n} = defineProps<{\n /** Request body /\n requestBody?: RequestBodyObject\n /* Currently selected example key for the current operation /\n exampleKey: string\n /* Display title /\n title: string\n /* Selected environment /\n environment: XScalarEnvironment\n /* Selected anyOf/oneOf request-body variants keyed by schema path /\n requestBodyCompositionSelection?: Record<string, number>\n}>()\n\nconst emits = defineEmits<{\n (e: 'update:contentType', payload: { value: string }): void\n /* We use this event to update raw values /\n (\n e: 'update:value',\n payload: Pick<\n ApiReferenceEvents['operation:update:requestBody:value'],\n 'payload' \| 'contentType'\n >,\n ): void\n /* We use this event when updating form data only /\n (\n e: 'update:formValue',\n payload: Pick<\n ApiReferenceEvents['operation:update:requestBody:formValue'],\n 'payload' \| 'contentType'\n >,\n ): void\n}>()\n\n// Map a content type to a language for the code editor\nconst contentTypeToLanguageMap = {\n 'application/json': 'json',\n 'application/xml': 'xml',\n 'application/yaml': 'yaml',\n} as const\n\n/* Selected content type with default /\nconst selectedContentType = computed(\n () => getSelectedBodyContentType(requestBody, exampleKey) ?? 'none',\n)\n\n/\n Strips MIME parameters (such as `charset=utf-8`) for dropdown labels, aligned with how we treat\n * media types elsewhere (see api-reference `normalizeMimeType` / WHATWG essence).\n /\nconst contentTypeLabel = (raw: string): string => parseMimeType(raw).essence\n\n/\n Build the dropdown options for the content type selector.\n \n The list is composed of two groups:\n * 1. The built-in content types we ship friendly labels for (JSON, XML, Multipart Form, etc.).\n * 2. Any additional content types defined on the OpenAPI request body that are not in the built-in list\n * (for example `text/csv`, `application/pdf`, vendor types like `application/vnd.api+json`, ...).\n \n The OpenAPI-defined extras are appended at the bottom so the well-known options stay on top, and\n * users can always pick the exact content type the operation actually accepts.\n /\nconst contentTypeOptions = computed<{ id: string; label: string }[]>(() => {\n const builtIn = objectEntries(CONTENT_TYPES).map(([id, label]) => ({\n id,\n label,\n }))\n\n const extras = Object.keys(requestBody?.content ?? {})\n .filter((type) => {\n if (type in CONTENT_TYPES) {\n return false\n }\n // Same essence as a built-in (e.g. `application/json; charset=utf-8`) — do not duplicate the row.\n return !(contentTypeLabel(type) in CONTENT_TYPES)\n })\n .map((type) => ({ id: type, label: contentTypeLabel(type) }))\n\n return [...builtIn, ...extras]\n})\n\nconst selectedContentTypeModel = computed<{ id: string; label: string }>({\n get: () => {\n const found = contentTypeOptions.value.find(\n (it) => it.id === selectedContentType.value,\n )\n if (found) {\n return found\n }\n\n const essence = contentTypeLabel(selectedContentType.value)\n const friendly =\n CONTENT_TYPES[essence as keyof typeof CONTENT_TYPES] ?? essence\n\n return {\n id: selectedContentType.value,\n label: friendly,\n }\n },\n set: (v) => {\n emits('update:contentType', { value: v.id })\n },\n})\n\nfunction handleFileUpload(callback: (file: File) => void) {\n const { open } = useFileDialog({\n onChange: (files) => {\n const file = files?.[0]\n if (file) {\n callback(file)\n }\n },\n multiple: false,\n accept: '/',\n })\n open()\n}\n\n/* Dereferenced example /\nconst example = computed(\n () =>\n requestBody &&\n getExampleFromBody(\n requestBody,\n selectedContentType.value,\n exampleKey,\n requestBodyCompositionSelection,\n ),\n)\n\n/* Convert the example value to a string for the code editor /\nconst bodyValue = computed(() => {\n if (!example.value) {\n return ''\n }\n\n const value = example.value.value\n if (typeof value === 'string') {\n return value\n }\n\n return JSON.stringify(value, null, 2)\n})\n\n/* Resolved schema for the request body */\nconst bodySchema = computed<SchemaObject \| undefined>(() => {\n return resolve.schema(\n requestBody?.content?.[selectedContentType.value]?.schema,\n )\n})\n</script>\n<template>\n <CollapsibleSection>\n <template #title>{{ title }}</template>\n <DataTable\n :columns=\"['']\"\n presentational>\n <DataTableHeader\n class=\"relative col-span-full flex h-8 cursor-pointer items-center justify-between border-r-0 !p-0\">\n <ScalarListbox\n v-model=\"selectedContentTypeModel\"\n :options=\"contentTypeOptions\"\n teleport>\n <ScalarButton\n class=\"text-c-2 hover:text-c-1 flex h-full w-fit gap-1.5 px-3 font-normal\"\n fullWidth\n variant=\"ghost\">\n <span>{{ selectedContentTypeModel.label }}</span>\n <ScalarIcon\n icon=\"ChevronDown\"\n size=\"md\" />\n </ScalarButton>\n </ScalarListbox>\n </DataTableHeader>\n <DataTableRow>\n <!-- No Body -->\n <template v-if=\"selectedContentType === 'none'\">\n <div\n class=\"text-c-3 flex min-h-10 w-full items-center justify-center border-t p-2 text-sm\">\n <span>No Body</span>\n </div>\n </template>\n\n <!-- Binary File -->\n <template\n v-else-if=\"selectedContentType === 'application/octet-stream'\">\n <div\n class=\"flex items-center justify-center overflow-hidden border-t p-1.5\">\n <template\n v-if=\"\n getFileName(unpackProxyObject(example?.value)) !== undefined\n \">\n <span\n class=\"text-c-2 w-full max-w-full overflow-hidden rounded border px-1.5 py-1 text-xs whitespace-nowrap\">\n {{ getFileName(unpackProxyObject(example?.value)) }}\n </span>\n <ScalarButton\n class=\"bg-b-2 hover:bg-b-3 text-c-2 ml-1 border-0 shadow-none\"\n size=\"sm\"\n variant=\"outlined\"\n @click=\"\n emits('update:value', {\n payload: undefined,\n contentType: selectedContentType,\n })\n \">\n Delete\n </ScalarButton>\n </template>\n <template v-else>\n <ScalarButton\n class=\"bg-b-2 hover:bg-b-3 text-c-2 border-0 shadow-none\"\n size=\"sm\"\n variant=\"outlined\"\n @click=\"\n () =>\n handleFileUpload((file) =>\n emits('update:value', {\n payload: file,\n contentType: selectedContentType,\n }),\n )\n \">\n <span>Select File</span>\n <ScalarIcon\n class=\"ml-1\"\n icon=\"Upload\"\n size=\"xs\"\n thickness=\"2.5\" />\n </ScalarButton>\n </template>\n </div>\n </template>\n\n <!-- Form Data / URL Encoded -->\n <template\n v-else-if=\"\n selectedContentType === 'multipart/form-data' \|\|\n selectedContentType === 'application/x-www-form-urlencoded'\n \">\n <RequestBodyForm\n :bodySchema\n :environment\n :example\n :selectedContentType\n @update:formValue=\"\n (payload) =>\n emits('update:formValue', {\n payload,\n contentType: selectedContentType,\n })\n \" />\n </template>\n\n <!-- Code/Other -->\n <template v-else>\n <CodeInput\n class=\"border-t px-3\"\n content=\"\"\n :environment=\"environment\"\n :language=\"\n contentTypeToLanguageMap[\n selectedContentType as keyof typeof contentTypeToLanguageMap\n ] ?? 'plaintext'\n \"\n lineNumbers\n lint\n :modelValue=\"bodyValue\"\n withFakeData\n @update:modelValue=\"\n (value) =>\n emits('update:value', {\n payload: value,\n contentType: selectedContentType,\n })\n \" />\n </template>\n </DataTableRow>\n </DataTable>\n </CollapsibleSection>\n</template>\n<style scoped>\n:deep(.cm-content) {\n font-size: var(--scalar-small);\n}\n</style>\n"],"mappings":""}
1	+ {"version":3,"file":"RequestBody.vue.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestBody.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton } from '@scalar/components/button'\nimport { ScalarIcon } from '@scalar/components/icon'\nimport { ScalarListbox } from '@scalar/components/listbox'\nimport { CONTENT_TYPES } from '@scalar/helpers/http/content-types'\nimport { parseMimeType } from '@scalar/helpers/http/mime-type'\nimport { isObject } from '@scalar/helpers/object/is-object'\nimport { objectEntries } from '@scalar/helpers/object/object-entries'\nimport type { ApiReferenceEvents } from '@scalar/workspace-store/events'\nimport { unpackProxyObject } from '@scalar/workspace-store/helpers/unpack-proxy'\nimport {\n getExampleFromBody,\n getSelectedBodyContentType,\n} from '@scalar/workspace-store/request-example'\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type {\n RequestBodyObject,\n SchemaObject,\n} from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { isObjectSchema } from '@scalar/workspace-store/schemas/v3.1/strict/type-guards'\nimport { computed, ref, watch } from 'vue'\n\nimport { useFileDialog } from '@/hooks/use-file-dialog'\nimport RequestBodyForm from '@/v2/blocks/request-block/components/RequestBodyForm.vue'\nimport RequestBodyStructured from '@/v2/blocks/request-block/components/RequestBodyStructured.vue'\nimport RequestBodyViewToggle from '@/v2/blocks/request-block/components/RequestBodyViewToggle.vue'\nimport { getFileName } from '@/v2/blocks/request-block/helpers/files'\nimport { getStructuredBodyCodec } from '@/v2/blocks/request-block/helpers/structured-body-codec'\nimport { CodeInput } from '@/v2/components/code-input'\nimport {\n DataTable,\n DataTableHeader,\n DataTableRow,\n} from '@/v2/components/data-table'\nimport { CollapsibleSection } from '@/v2/components/layout'\n\nconst {\n requestBody,\n exampleKey,\n environment,\n requestBodyCompositionSelection,\n title,\n} = defineProps<{\n /** Request body /\n requestBody?: RequestBodyObject\n /* Currently selected example key for the current operation /\n exampleKey: string\n /* Display title /\n title: string\n /* Selected environment /\n environment: XScalarEnvironment\n /* Selected anyOf/oneOf request-body variants keyed by schema path /\n requestBodyCompositionSelection?: Record<string, number>\n}>()\n\nconst emits = defineEmits<{\n (e: 'update:contentType', payload: { value: string }): void\n /* We use this event to update raw values /\n (\n e: 'update:value',\n payload: Pick<\n ApiReferenceEvents['operation:update:requestBody:value'],\n 'payload' \| 'contentType'\n >,\n ): void\n /* We use this event when updating form data only /\n (\n e: 'update:formValue',\n payload: Pick<\n ApiReferenceEvents['operation:update:requestBody:formValue'],\n 'payload' \| 'contentType'\n >,\n ): void\n}>()\n\n// Map a content type to a language for the code editor\nconst contentTypeToLanguageMap = {\n 'application/json': 'json',\n 'application/xml': 'xml',\n 'application/yaml': 'yaml',\n} as const\n\n/* Selected content type with default /\nconst selectedContentType = computed(\n () => getSelectedBodyContentType(requestBody, exampleKey) ?? 'none',\n)\n\n/\n Strips MIME parameters (such as `charset=utf-8`) for dropdown labels, aligned with how we treat\n * media types elsewhere (see api-reference `normalizeMimeType` / WHATWG essence).\n /\nconst contentTypeLabel = (raw: string): string => parseMimeType(raw).essence\n\n/\n Build the dropdown options for the content type selector.\n \n The list is composed of two groups:\n * 1. The built-in content types we ship friendly labels for (JSON, XML, Multipart Form, etc.).\n * 2. Any additional content types defined on the OpenAPI request body that are not in the built-in list\n * (for example `text/csv`, `application/pdf`, vendor types like `application/vnd.api+json`, ...).\n \n The OpenAPI-defined extras are appended at the bottom so the well-known options stay on top, and\n * users can always pick the exact content type the operation actually accepts.\n /\nconst contentTypeOptions = computed<{ id: string; label: string }[]>(() => {\n const builtIn = objectEntries(CONTENT_TYPES).map(([id, label]) => ({\n id,\n label,\n }))\n\n const extras = Object.keys(requestBody?.content ?? {})\n .filter((type) => {\n if (type in CONTENT_TYPES) {\n return false\n }\n // Same essence as a built-in (e.g. `application/json; charset=utf-8`) — do not duplicate the row.\n return !(contentTypeLabel(type) in CONTENT_TYPES)\n })\n .map((type) => ({ id: type, label: contentTypeLabel(type) }))\n\n return [...builtIn, ...extras]\n})\n\nconst selectedContentTypeModel = computed<{ id: string; label: string }>({\n get: () => {\n const found = contentTypeOptions.value.find(\n (it) => it.id === selectedContentType.value,\n )\n if (found) {\n return found\n }\n\n const essence = contentTypeLabel(selectedContentType.value)\n const friendly =\n CONTENT_TYPES[essence as keyof typeof CONTENT_TYPES] ?? essence\n\n return {\n id: selectedContentType.value,\n label: friendly,\n }\n },\n set: (v) => {\n emits('update:contentType', { value: v.id })\n },\n})\n\nfunction handleFileUpload(callback: (file: File) => void) {\n const { open } = useFileDialog({\n onChange: (files) => {\n const file = files?.[0]\n if (file) {\n callback(file)\n }\n },\n multiple: false,\n accept: '/',\n })\n open()\n}\n\n/* Dereferenced example /\nconst example = computed(\n () =>\n requestBody &&\n getExampleFromBody(\n requestBody,\n selectedContentType.value,\n exampleKey,\n requestBodyCompositionSelection,\n ),\n)\n\n/* Convert the example value to a string for the code editor /\nconst bodyValue = computed(() => {\n if (!example.value) {\n return ''\n }\n\n const value = example.value.value\n if (typeof value === 'string') {\n return value\n }\n\n return JSON.stringify(value, null, 2)\n})\n\n/* Resolved schema for the request body /\nconst bodySchema = computed<SchemaObject \| undefined>(() => {\n return resolve.schema(\n requestBody?.content?.[selectedContentType.value]?.schema,\n )\n})\n\n/* Codec for structured (JSON/YAML) bodies, undefined for everything else /\nconst structuredCodec = computed(() =>\n selectedContentType.value === 'none'\n ? undefined\n : getStructuredBodyCodec(selectedContentType.value),\n)\n\n/* Parsed body value for the form view — `ok: false` when the raw text is not parseable /\nconst parsedBody = computed<{ ok: boolean; value?: unknown }>(() => {\n const codec = structuredCodec.value\n if (!codec) {\n return { ok: false }\n }\n\n const raw = example.value?.value\n // An empty body is still form-editable: rows come from the schema.\n if (raw === undefined \|\| raw === null \|\| raw === '') {\n return { ok: true, value: {} }\n }\n if (typeof raw === 'string') {\n try {\n return { ok: true, value: codec.parse(raw) }\n } catch {\n return { ok: false }\n }\n }\n // Spec-provided examples can be stored as objects directly.\n return { ok: true, value: raw }\n})\n\n/* The form view only works on an object-shaped body root /\nconst isFormViewAvailable = computed(\n () => parsedBody.value.ok && isObject(parsedBody.value.value),\n)\n\n/\n Show the Form/Raw toggle for structured bodies that are (or per schema should be)\n * an object at the root. Non-object roots (arrays, primitives) stay raw-only.\n /\nconst showBodyViewToggle = computed(\n () =>\n Boolean(structuredCodec.value) &&\n (isFormViewAvailable.value \|\|\n Boolean(bodySchema.value && isObjectSchema(bodySchema.value))),\n)\n\n/* Selected body view, raw by default so existing behavior is unchanged */\nconst bodyView = ref<'form' \| 'raw'>('raw')\n\n// Fall back to raw when the form view stops being available (e.g. the content type\n// changed to a non-structured one, or an external edit made the body unparseable).\nwatch(isFormViewAvailable, (ok) => {\n if (!ok) {\n bodyView.value = 'raw'\n }\n})\n</script>\n<template>\n <CollapsibleSection>\n <template #title>{{ title }}</template>\n <DataTable\n :columns=\"['']\"\n presentational>\n <DataTableHeader\n class=\"relative col-span-full flex h-8 cursor-pointer items-center justify-between border-r-0 !p-0\">\n <ScalarListbox\n v-model=\"selectedContentTypeModel\"\n :options=\"contentTypeOptions\"\n teleport>\n <ScalarButton\n class=\"text-c-2 hover:text-c-1 flex h-full w-fit gap-1.5 px-3 font-normal\"\n fullWidth\n variant=\"ghost\">\n <span>{{ selectedContentTypeModel.label }}</span>\n <ScalarIcon\n icon=\"ChevronDown\"\n size=\"md\" />\n </ScalarButton>\n </ScalarListbox>\n <RequestBodyViewToggle\n v-if=\"showBodyViewToggle\"\n :disabled=\"!isFormViewAvailable\"\n :modelValue=\"bodyView\"\n @update:modelValue=\"(v) => (bodyView = v)\" />\n </DataTableHeader>\n <DataTableRow>\n <!-- No Body -->\n <template v-if=\"selectedContentType === 'none'\">\n <div\n class=\"text-c-3 flex min-h-10 w-full items-center justify-center border-t p-2 text-sm\">\n <span>No Body</span>\n </div>\n </template>\n\n <!-- Binary File -->\n <template\n v-else-if=\"selectedContentType === 'application/octet-stream'\">\n <div\n class=\"flex items-center justify-center overflow-hidden border-t p-1.5\">\n <template\n v-if=\"\n getFileName(unpackProxyObject(example?.value)) !== undefined\n \">\n <span\n class=\"text-c-2 w-full max-w-full overflow-hidden rounded border px-1.5 py-1 text-xs whitespace-nowrap\">\n {{ getFileName(unpackProxyObject(example?.value)) }}\n </span>\n <ScalarButton\n class=\"bg-b-2 hover:bg-b-3 text-c-2 ml-1 border-0 shadow-none\"\n size=\"sm\"\n variant=\"outlined\"\n @click=\"\n emits('update:value', {\n payload: undefined,\n contentType: selectedContentType,\n })\n \">\n Delete\n </ScalarButton>\n </template>\n <template v-else>\n <ScalarButton\n class=\"bg-b-2 hover:bg-b-3 text-c-2 border-0 shadow-none\"\n size=\"sm\"\n variant=\"outlined\"\n @click=\"\n () =>\n handleFileUpload((file) =>\n emits('update:value', {\n payload: file,\n contentType: selectedContentType,\n }),\n )\n \">\n <span>Select File</span>\n <ScalarIcon\n class=\"ml-1\"\n icon=\"Upload\"\n size=\"xs\"\n thickness=\"2.5\" />\n </ScalarButton>\n </template>\n </div>\n </template>\n\n <!-- Form Data / URL Encoded -->\n <template\n v-else-if=\"\n selectedContentType === 'multipart/form-data' \|\|\n selectedContentType === 'application/x-www-form-urlencoded'\n \">\n <RequestBodyForm\n :bodySchema\n :environment\n :example\n :selectedContentType\n @update:formValue=\"\n (payload) =>\n emits('update:formValue', {\n payload,\n contentType: selectedContentType,\n })\n \" />\n </template>\n\n <!-- Code/Other -->\n <template v-else>\n <!-- Schema-driven form view for structured (JSON/YAML) bodies -->\n <RequestBodyStructured\n v-if=\"bodyView === 'form' && isFormViewAvailable\"\n :bodySchema\n :contentType=\"selectedContentType\"\n :environment\n :parsedValue=\"parsedBody.value\"\n @update:value=\"\n (value) =>\n emits('update:value', {\n payload: value,\n contentType: selectedContentType,\n })\n \" />\n <CodeInput\n v-else\n class=\"border-t px-3\"\n content=\"\"\n :environment=\"environment\"\n :language=\"\n contentTypeToLanguageMap[\n selectedContentType as keyof typeof contentTypeToLanguageMap\n ] ?? 'plaintext'\n \"\n lineNumbers\n lint\n :modelValue=\"bodyValue\"\n withFakeData\n @update:modelValue=\"\n (value) =>\n emits('update:value', {\n payload: value,\n contentType: selectedContentType,\n })\n \" />\n </template>\n </DataTableRow>\n </DataTable>\n </CollapsibleSection>\n</template>\n<style scoped>\n:deep(.cm-content) {\n font-size: var(--scalar-small);\n}\n</style>\n"],"mappings":""}

package/dist/v2/blocks/request-block/components/RequestBody.vue.script.js CHANGED Viewed

@@ -5,8 +5,11 @@ import DataTableHeader_default from "../../../components/data-table/DataTableHea
 import DataTableRow_default from "../../../components/data-table/DataTableRow.vue.js";
 import { getFileName } from "../helpers/files.js";
 import RequestBodyForm_default from "./RequestBodyForm.vue.js";
+import { getStructuredBodyCodec } from "../helpers/structured-body-codec.js";
+import RequestBodyStructured_default from "./RequestBodyStructured.vue.js";
+import RequestBodyViewToggle_default from "./RequestBodyViewToggle.vue.js";
 import CollapsibleSection_default from "../../../components/layout/CollapsibleSection.vue.js";
-import { Fragment, computed, createBlock, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, openBlock, toDisplayString, unref, withCtx } from "vue";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, openBlock, ref, toDisplayString, unref, watch, withCtx } from "vue";
 import { ScalarButton } from "@scalar/components/button";
 import { ScalarListbox } from "@scalar/components/listbox";
 import { objectEntries } from "@scalar/helpers/object/object-entries";
@@ -15,7 +18,9 @@ import { getExampleFromBody, getSelectedBodyContentType } from "@scalar/workspac
 import { parseMimeType } from "@scalar/helpers/http/mime-type";
 import { unpackProxyObject } from "@scalar/workspace-store/helpers/unpack-proxy";
 import { CONTENT_TYPES } from "@scalar/helpers/http/content-types";
+import { isObject } from "@scalar/helpers/object/is-object";
 import { resolve } from "@scalar/workspace-store/resolve";
+import { isObjectSchema } from "@scalar/workspace-store/schemas/v3.1/strict/type-guards";
 //#region src/v2/blocks/request-block/components/RequestBody.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = {
 	key: 0,
@@ -26,7 +31,7 @@ var _hoisted_2 = {
 	class: "flex items-center justify-center overflow-hidden border-t p-1.5"
 };
 var _hoisted_3 = { class: "text-c-2 w-full max-w-full overflow-hidden rounded border px-1.5 py-1 text-xs whitespace-nowrap" };
-var RequestBody_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var RequestBody_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	__name: "RequestBody",
 	props: {
 		requestBody: {},
@@ -118,6 +123,42 @@ var RequestBody_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 		const bodySchema = computed(() => {
 			return resolve.schema(__props.requestBody?.content?.[selectedContentType.value]?.schema);
 		});
+		/** Codec for structured (JSON/YAML) bodies, undefined for everything else */
+		const structuredCodec = computed(() => selectedContentType.value === "none" ? void 0 : getStructuredBodyCodec(selectedContentType.value));
+		/** Parsed body value for the form view — `ok: false` when the raw text is not parseable */
+		const parsedBody = computed(() => {
+			const codec = structuredCodec.value;
+			if (!codec) return { ok: false };
+			const raw = example.value?.value;
+			if (raw === void 0 || raw === null || raw === "") return {
+				ok: true,
+				value: {}
+			};
+			if (typeof raw === "string") try {
+				return {
+					ok: true,
+					value: codec.parse(raw)
+				};
+			} catch {
+				return { ok: false };
+			}
+			return {
+				ok: true,
+				value: raw
+			};
+		});
+		/** The form view only works on an object-shaped body root */
+		const isFormViewAvailable = computed(() => parsedBody.value.ok && isObject(parsedBody.value.value));
+		/**
+		* Show the Form/Raw toggle for structured bodies that are (or per schema should be)
+		* an object at the root. Non-object roots (arrays, primitives) stay raw-only.
+		*/
+		const showBodyViewToggle = computed(() => Boolean(structuredCodec.value) && (isFormViewAvailable.value || Boolean(bodySchema.value && isObjectSchema(bodySchema.value))));
+		/** Selected body view, raw by default so existing behavior is unchanged */
+		const bodyView = ref("raw");
+		watch(isFormViewAvailable, (ok) => {
+			if (!ok) bodyView.value = "raw";
+		});
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(CollapsibleSection_default), null, {
 				title: withCtx(() => [createTextVNode(toDisplayString(__props.title), 1)]),
@@ -144,31 +185,36 @@ var RequestBody_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 								_: 1
 							})]),
 							_: 1
-						}, 8, ["modelValue", "options"])]),
+						}, 8, ["modelValue", "options"]), showBodyViewToggle.value ? (openBlock(), createBlock(RequestBodyViewToggle_default, {
+							key: 0,
+							disabled: !isFormViewAvailable.value,
+							modelValue: bodyView.value,
+							"onUpdate:modelValue": _cache[1] || (_cache[1] = (v) => bodyView.value = v)
+						}, null, 8, ["disabled", "modelValue"])) : createCommentVNode("", true)]),
 						_: 1
 					}), createVNode(unref(DataTableRow_default), null, {
-						default: withCtx(() => [selectedContentType.value === "none" ? (openBlock(), createElementBlock("div", _hoisted_1, [..._cache[5] || (_cache[5] = [createElementVNode("span", null, "No Body", -1)])])) : selectedContentType.value === "application/octet-stream" ? (openBlock(), createElementBlock("div", _hoisted_2, [unref(getFileName)(unref(unpackProxyObject)(example.value?.value)) !== void 0 ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createElementVNode("span", _hoisted_3, toDisplayString(unref(getFileName)(unref(unpackProxyObject)(example.value?.value))), 1), createVNode(unref(ScalarButton), {
+						default: withCtx(() => [selectedContentType.value === "none" ? (openBlock(), createElementBlock("div", _hoisted_1, [..._cache[7] || (_cache[7] = [createElementVNode("span", null, "No Body", -1)])])) : selectedContentType.value === "application/octet-stream" ? (openBlock(), createElementBlock("div", _hoisted_2, [unref(getFileName)(unref(unpackProxyObject)(example.value?.value)) !== void 0 ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createElementVNode("span", _hoisted_3, toDisplayString(unref(getFileName)(unref(unpackProxyObject)(example.value?.value))), 1), createVNode(unref(ScalarButton), {
 							class: "bg-b-2 hover:bg-b-3 text-c-2 ml-1 border-0 shadow-none",
 							size: "sm",
 							variant: "outlined",
-							onClick: _cache[1] || (_cache[1] = ($event) => emits("update:value", {
+							onClick: _cache[2] || (_cache[2] = ($event) => emits("update:value", {
 								payload: void 0,
 								contentType: selectedContentType.value
 							}))
 						}, {
-							default: withCtx(() => [..._cache[6] || (_cache[6] = [createTextVNode(" Delete ", -1)])]),
+							default: withCtx(() => [..._cache[8] || (_cache[8] = [createTextVNode(" Delete ", -1)])]),
 							_: 1
 						})], 64)) : (openBlock(), createBlock(unref(ScalarButton), {
 							key: 1,
 							class: "bg-b-2 hover:bg-b-3 text-c-2 border-0 shadow-none",
 							size: "sm",
 							variant: "outlined",
-							onClick: _cache[2] || (_cache[2] = () => handleFileUpload((file) => emits("update:value", {
+							onClick: _cache[3] || (_cache[3] = () => handleFileUpload((file) => emits("update:value", {
 								payload: file,
 								contentType: selectedContentType.value
 							})))
 						}, {
-							default: withCtx(() => [_cache[7] || (_cache[7] = createElementVNode("span", null, "Select File", -1)), createVNode(unref(ScalarIcon), {
+							default: withCtx(() => [_cache[9] || (_cache[9] = createElementVNode("span", null, "Select File", -1)), createVNode(unref(ScalarIcon), {
 								class: "ml-1",
 								icon: "Upload",
 								size: "xs",
@@ -181,7 +227,7 @@ var RequestBody_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 							environment: __props.environment,
 							example: example.value,
 							selectedContentType: selectedContentType.value,
-							"onUpdate:formValue": _cache[3] || (_cache[3] = (payload) => emits("update:formValue", {
+							"onUpdate:formValue": _cache[4] || (_cache[4] = (payload) => emits("update:formValue", {
 								payload,
 								contentType: selectedContentType.value
 							}))
@@ -190,8 +236,23 @@ var RequestBody_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 							"environment",
 							"example",
 							"selectedContentType"
+						])) : (openBlock(), createElementBlock(Fragment, { key: 3 }, [bodyView.value === "form" && isFormViewAvailable.value ? (openBlock(), createBlock(RequestBodyStructured_default, {
+							key: 0,
+							bodySchema: bodySchema.value,
+							contentType: selectedContentType.value,
+							environment: __props.environment,
+							parsedValue: parsedBody.value.value,
+							"onUpdate:value": _cache[5] || (_cache[5] = (value) => emits("update:value", {
+								payload: value,
+								contentType: selectedContentType.value
+							}))
+						}, null, 8, [
+							"bodySchema",
+							"contentType",
+							"environment",
+							"parsedValue"
 						])) : (openBlock(), createBlock(unref(CodeInput_default), {
-							key: 3,
+							key: 1,
 							class: "border-t px-3",
 							content: "",
 							environment: __props.environment,
@@ -200,7 +261,7 @@ var RequestBody_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 							lint: "",
 							modelValue: bodyValue.value,
 							withFakeData: "",
-							"onUpdate:modelValue": _cache[4] || (_cache[4] = (value) => emits("update:value", {
+							"onUpdate:modelValue": _cache[6] || (_cache[6] = (value) => emits("update:value", {
 								payload: value,
 								contentType: selectedContentType.value
 							}))
@@ -208,7 +269,7 @@ var RequestBody_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 							"environment",
 							"language",
 							"modelValue"
-						]))]),
+						]))], 64))]),
 						_: 1
 					})]),
 					_: 1

package/dist/v2/blocks/request-block/components/RequestBody.vue.script.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RequestBody.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestBody.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton } from '@scalar/components/button'\nimport { ScalarIcon } from '@scalar/components/icon'\nimport { ScalarListbox } from '@scalar/components/listbox'\nimport { CONTENT_TYPES } from '@scalar/helpers/http/content-types'\nimport { parseMimeType } from '@scalar/helpers/http/mime-type'\nimport { objectEntries } from '@scalar/helpers/object/object-entries'\nimport type { ApiReferenceEvents } from '@scalar/workspace-store/events'\nimport { unpackProxyObject } from '@scalar/workspace-store/helpers/unpack-proxy'\nimport {\n getExampleFromBody,\n getSelectedBodyContentType,\n} from '@scalar/workspace-store/request-example'\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type {\n RequestBodyObject,\n SchemaObject,\n} from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { computed } from 'vue'\n\nimport { useFileDialog } from '@/hooks/use-file-dialog'\nimport RequestBodyForm from '@/v2/blocks/request-block/components/RequestBodyForm.vue'\nimport { getFileName } from '@/v2/blocks/request-block/helpers/files'\nimport { CodeInput } from '@/v2/components/code-input'\nimport {\n DataTable,\n DataTableHeader,\n DataTableRow,\n} from '@/v2/components/data-table'\nimport { CollapsibleSection } from '@/v2/components/layout'\n\nconst {\n requestBody,\n exampleKey,\n environment,\n requestBodyCompositionSelection,\n title,\n} = defineProps<{\n /** Request body /\n requestBody?: RequestBodyObject\n /* Currently selected example key for the current operation /\n exampleKey: string\n /* Display title /\n title: string\n /* Selected environment /\n environment: XScalarEnvironment\n /* Selected anyOf/oneOf request-body variants keyed by schema path /\n requestBodyCompositionSelection?: Record<string, number>\n}>()\n\nconst emits = defineEmits<{\n (e: 'update:contentType', payload: { value: string }): void\n /* We use this event to update raw values /\n (\n e: 'update:value',\n payload: Pick<\n ApiReferenceEvents['operation:update:requestBody:value'],\n 'payload' \| 'contentType'\n >,\n ): void\n /* We use this event when updating form data only /\n (\n e: 'update:formValue',\n payload: Pick<\n ApiReferenceEvents['operation:update:requestBody:formValue'],\n 'payload' \| 'contentType'\n >,\n ): void\n}>()\n\n// Map a content type to a language for the code editor\nconst contentTypeToLanguageMap = {\n 'application/json': 'json',\n 'application/xml': 'xml',\n 'application/yaml': 'yaml',\n} as const\n\n/* Selected content type with default /\nconst selectedContentType = computed(\n () => getSelectedBodyContentType(requestBody, exampleKey) ?? 'none',\n)\n\n/\n Strips MIME parameters (such as `charset=utf-8`) for dropdown labels, aligned with how we treat\n * media types elsewhere (see api-reference `normalizeMimeType` / WHATWG essence).\n /\nconst contentTypeLabel = (raw: string): string => parseMimeType(raw).essence\n\n/\n Build the dropdown options for the content type selector.\n \n The list is composed of two groups:\n * 1. The built-in content types we ship friendly labels for (JSON, XML, Multipart Form, etc.).\n * 2. Any additional content types defined on the OpenAPI request body that are not in the built-in list\n * (for example `text/csv`, `application/pdf`, vendor types like `application/vnd.api+json`, ...).\n \n The OpenAPI-defined extras are appended at the bottom so the well-known options stay on top, and\n * users can always pick the exact content type the operation actually accepts.\n /\nconst contentTypeOptions = computed<{ id: string; label: string }[]>(() => {\n const builtIn = objectEntries(CONTENT_TYPES).map(([id, label]) => ({\n id,\n label,\n }))\n\n const extras = Object.keys(requestBody?.content ?? {})\n .filter((type) => {\n if (type in CONTENT_TYPES) {\n return false\n }\n // Same essence as a built-in (e.g. `application/json; charset=utf-8`) — do not duplicate the row.\n return !(contentTypeLabel(type) in CONTENT_TYPES)\n })\n .map((type) => ({ id: type, label: contentTypeLabel(type) }))\n\n return [...builtIn, ...extras]\n})\n\nconst selectedContentTypeModel = computed<{ id: string; label: string }>({\n get: () => {\n const found = contentTypeOptions.value.find(\n (it) => it.id === selectedContentType.value,\n )\n if (found) {\n return found\n }\n\n const essence = contentTypeLabel(selectedContentType.value)\n const friendly =\n CONTENT_TYPES[essence as keyof typeof CONTENT_TYPES] ?? essence\n\n return {\n id: selectedContentType.value,\n label: friendly,\n }\n },\n set: (v) => {\n emits('update:contentType', { value: v.id })\n },\n})\n\nfunction handleFileUpload(callback: (file: File) => void) {\n const { open } = useFileDialog({\n onChange: (files) => {\n const file = files?.[0]\n if (file) {\n callback(file)\n }\n },\n multiple: false,\n accept: '/',\n })\n open()\n}\n\n/* Dereferenced example /\nconst example = computed(\n () =>\n requestBody &&\n getExampleFromBody(\n requestBody,\n selectedContentType.value,\n exampleKey,\n requestBodyCompositionSelection,\n ),\n)\n\n/* Convert the example value to a string for the code editor /\nconst bodyValue = computed(() => {\n if (!example.value) {\n return ''\n }\n\n const value = example.value.value\n if (typeof value === 'string') {\n return value\n }\n\n return JSON.stringify(value, null, 2)\n})\n\n/* Resolved schema for the request body */\nconst bodySchema = computed<SchemaObject \| undefined>(() => {\n return resolve.schema(\n requestBody?.content?.[selectedContentType.value]?.schema,\n )\n})\n</script>\n<template>\n <CollapsibleSection>\n <template #title>{{ title }}</template>\n <DataTable\n :columns=\"['']\"\n presentational>\n <DataTableHeader\n class=\"relative col-span-full flex h-8 cursor-pointer items-center justify-between border-r-0 !p-0\">\n <ScalarListbox\n v-model=\"selectedContentTypeModel\"\n :options=\"contentTypeOptions\"\n teleport>\n <ScalarButton\n class=\"text-c-2 hover:text-c-1 flex h-full w-fit gap-1.5 px-3 font-normal\"\n fullWidth\n variant=\"ghost\">\n <span>{{ selectedContentTypeModel.label }}</span>\n <ScalarIcon\n icon=\"ChevronDown\"\n size=\"md\" />\n </ScalarButton>\n </ScalarListbox>\n </DataTableHeader>\n <DataTableRow>\n <!-- No Body -->\n <template v-if=\"selectedContentType === 'none'\">\n <div\n class=\"text-c-3 flex min-h-10 w-full items-center justify-center border-t p-2 text-sm\">\n <span>No Body</span>\n </div>\n </template>\n\n <!-- Binary File -->\n <template\n v-else-if=\"selectedContentType === 'application/octet-stream'\">\n <div\n class=\"flex items-center justify-center overflow-hidden border-t p-1.5\">\n <template\n v-if=\"\n getFileName(unpackProxyObject(example?.value)) !== undefined\n \">\n <span\n class=\"text-c-2 w-full max-w-full overflow-hidden rounded border px-1.5 py-1 text-xs whitespace-nowrap\">\n {{ getFileName(unpackProxyObject(example?.value)) }}\n </span>\n <ScalarButton\n class=\"bg-b-2 hover:bg-b-3 text-c-2 ml-1 border-0 shadow-none\"\n size=\"sm\"\n variant=\"outlined\"\n @click=\"\n emits('update:value', {\n payload: undefined,\n contentType: selectedContentType,\n })\n \">\n Delete\n </ScalarButton>\n </template>\n <template v-else>\n <ScalarButton\n class=\"bg-b-2 hover:bg-b-3 text-c-2 border-0 shadow-none\"\n size=\"sm\"\n variant=\"outlined\"\n @click=\"\n () =>\n handleFileUpload((file) =>\n emits('update:value', {\n payload: file,\n contentType: selectedContentType,\n }),\n )\n \">\n <span>Select File</span>\n <ScalarIcon\n class=\"ml-1\"\n icon=\"Upload\"\n size=\"xs\"\n thickness=\"2.5\" />\n </ScalarButton>\n </template>\n </div>\n </template>\n\n <!-- Form Data / URL Encoded -->\n <template\n v-else-if=\"\n selectedContentType === 'multipart/form-data' \|\|\n selectedContentType === 'application/x-www-form-urlencoded'\n \">\n <RequestBodyForm\n :bodySchema\n :environment\n :example\n :selectedContentType\n @update:formValue=\"\n (payload) =>\n emits('update:formValue', {\n payload,\n contentType: selectedContentType,\n })\n \" />\n </template>\n\n <!-- Code/Other -->\n <template v-else>\n <CodeInput\n class=\"border-t px-3\"\n content=\"\"\n :environment=\"environment\"\n :language=\"\n contentTypeToLanguageMap[\n selectedContentType as keyof typeof contentTypeToLanguageMap\n ] ?? 'plaintext'\n \"\n lineNumbers\n lint\n :modelValue=\"bodyValue\"\n withFakeData\n @update:modelValue=\"\n (value) =>\n emits('update:value', {\n payload: value,\n contentType: selectedContentType,\n })\n \" />\n </template>\n </DataTableRow>\n </DataTable>\n </CollapsibleSection>\n</template>\n<style scoped>\n:deep(.cm-content) {\n font-size: var(--scalar-small);\n}\n</style>\n"],"mappings":"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"}
1	+ {"version":3,"file":"RequestBody.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestBody.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton } from '@scalar/components/button'\nimport { ScalarIcon } from '@scalar/components/icon'\nimport { ScalarListbox } from '@scalar/components/listbox'\nimport { CONTENT_TYPES } from '@scalar/helpers/http/content-types'\nimport { parseMimeType } from '@scalar/helpers/http/mime-type'\nimport { isObject } from '@scalar/helpers/object/is-object'\nimport { objectEntries } from '@scalar/helpers/object/object-entries'\nimport type { ApiReferenceEvents } from '@scalar/workspace-store/events'\nimport { unpackProxyObject } from '@scalar/workspace-store/helpers/unpack-proxy'\nimport {\n getExampleFromBody,\n getSelectedBodyContentType,\n} from '@scalar/workspace-store/request-example'\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type {\n RequestBodyObject,\n SchemaObject,\n} from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { isObjectSchema } from '@scalar/workspace-store/schemas/v3.1/strict/type-guards'\nimport { computed, ref, watch } from 'vue'\n\nimport { useFileDialog } from '@/hooks/use-file-dialog'\nimport RequestBodyForm from '@/v2/blocks/request-block/components/RequestBodyForm.vue'\nimport RequestBodyStructured from '@/v2/blocks/request-block/components/RequestBodyStructured.vue'\nimport RequestBodyViewToggle from '@/v2/blocks/request-block/components/RequestBodyViewToggle.vue'\nimport { getFileName } from '@/v2/blocks/request-block/helpers/files'\nimport { getStructuredBodyCodec } from '@/v2/blocks/request-block/helpers/structured-body-codec'\nimport { CodeInput } from '@/v2/components/code-input'\nimport {\n DataTable,\n DataTableHeader,\n DataTableRow,\n} from '@/v2/components/data-table'\nimport { CollapsibleSection } from '@/v2/components/layout'\n\nconst {\n requestBody,\n exampleKey,\n environment,\n requestBodyCompositionSelection,\n title,\n} = defineProps<{\n /** Request body /\n requestBody?: RequestBodyObject\n /* Currently selected example key for the current operation /\n exampleKey: string\n /* Display title /\n title: string\n /* Selected environment /\n environment: XScalarEnvironment\n /* Selected anyOf/oneOf request-body variants keyed by schema path /\n requestBodyCompositionSelection?: Record<string, number>\n}>()\n\nconst emits = defineEmits<{\n (e: 'update:contentType', payload: { value: string }): void\n /* We use this event to update raw values /\n (\n e: 'update:value',\n payload: Pick<\n ApiReferenceEvents['operation:update:requestBody:value'],\n 'payload' \| 'contentType'\n >,\n ): void\n /* We use this event when updating form data only /\n (\n e: 'update:formValue',\n payload: Pick<\n ApiReferenceEvents['operation:update:requestBody:formValue'],\n 'payload' \| 'contentType'\n >,\n ): void\n}>()\n\n// Map a content type to a language for the code editor\nconst contentTypeToLanguageMap = {\n 'application/json': 'json',\n 'application/xml': 'xml',\n 'application/yaml': 'yaml',\n} as const\n\n/* Selected content type with default /\nconst selectedContentType = computed(\n () => getSelectedBodyContentType(requestBody, exampleKey) ?? 'none',\n)\n\n/\n Strips MIME parameters (such as `charset=utf-8`) for dropdown labels, aligned with how we treat\n * media types elsewhere (see api-reference `normalizeMimeType` / WHATWG essence).\n /\nconst contentTypeLabel = (raw: string): string => parseMimeType(raw).essence\n\n/\n Build the dropdown options for the content type selector.\n \n The list is composed of two groups:\n * 1. The built-in content types we ship friendly labels for (JSON, XML, Multipart Form, etc.).\n * 2. Any additional content types defined on the OpenAPI request body that are not in the built-in list\n * (for example `text/csv`, `application/pdf`, vendor types like `application/vnd.api+json`, ...).\n \n The OpenAPI-defined extras are appended at the bottom so the well-known options stay on top, and\n * users can always pick the exact content type the operation actually accepts.\n /\nconst contentTypeOptions = computed<{ id: string; label: string }[]>(() => {\n const builtIn = objectEntries(CONTENT_TYPES).map(([id, label]) => ({\n id,\n label,\n }))\n\n const extras = Object.keys(requestBody?.content ?? {})\n .filter((type) => {\n if (type in CONTENT_TYPES) {\n return false\n }\n // Same essence as a built-in (e.g. `application/json; charset=utf-8`) — do not duplicate the row.\n return !(contentTypeLabel(type) in CONTENT_TYPES)\n })\n .map((type) => ({ id: type, label: contentTypeLabel(type) }))\n\n return [...builtIn, ...extras]\n})\n\nconst selectedContentTypeModel = computed<{ id: string; label: string }>({\n get: () => {\n const found = contentTypeOptions.value.find(\n (it) => it.id === selectedContentType.value,\n )\n if (found) {\n return found\n }\n\n const essence = contentTypeLabel(selectedContentType.value)\n const friendly =\n CONTENT_TYPES[essence as keyof typeof CONTENT_TYPES] ?? essence\n\n return {\n id: selectedContentType.value,\n label: friendly,\n }\n },\n set: (v) => {\n emits('update:contentType', { value: v.id })\n },\n})\n\nfunction handleFileUpload(callback: (file: File) => void) {\n const { open } = useFileDialog({\n onChange: (files) => {\n const file = files?.[0]\n if (file) {\n callback(file)\n }\n },\n multiple: false,\n accept: '/',\n })\n open()\n}\n\n/* Dereferenced example /\nconst example = computed(\n () =>\n requestBody &&\n getExampleFromBody(\n requestBody,\n selectedContentType.value,\n exampleKey,\n requestBodyCompositionSelection,\n ),\n)\n\n/* Convert the example value to a string for the code editor /\nconst bodyValue = computed(() => {\n if (!example.value) {\n return ''\n }\n\n const value = example.value.value\n if (typeof value === 'string') {\n return value\n }\n\n return JSON.stringify(value, null, 2)\n})\n\n/* Resolved schema for the request body /\nconst bodySchema = computed<SchemaObject \| undefined>(() => {\n return resolve.schema(\n requestBody?.content?.[selectedContentType.value]?.schema,\n )\n})\n\n/* Codec for structured (JSON/YAML) bodies, undefined for everything else /\nconst structuredCodec = computed(() =>\n selectedContentType.value === 'none'\n ? undefined\n : getStructuredBodyCodec(selectedContentType.value),\n)\n\n/* Parsed body value for the form view — `ok: false` when the raw text is not parseable /\nconst parsedBody = computed<{ ok: boolean; value?: unknown }>(() => {\n const codec = structuredCodec.value\n if (!codec) {\n return { ok: false }\n }\n\n const raw = example.value?.value\n // An empty body is still form-editable: rows come from the schema.\n if (raw === undefined \|\| raw === null \|\| raw === '') {\n return { ok: true, value: {} }\n }\n if (typeof raw === 'string') {\n try {\n return { ok: true, value: codec.parse(raw) }\n } catch {\n return { ok: false }\n }\n }\n // Spec-provided examples can be stored as objects directly.\n return { ok: true, value: raw }\n})\n\n/* The form view only works on an object-shaped body root /\nconst isFormViewAvailable = computed(\n () => parsedBody.value.ok && isObject(parsedBody.value.value),\n)\n\n/\n Show the Form/Raw toggle for structured bodies that are (or per schema should be)\n * an object at the root. Non-object roots (arrays, primitives) stay raw-only.\n /\nconst showBodyViewToggle = computed(\n () =>\n Boolean(structuredCodec.value) &&\n (isFormViewAvailable.value \|\|\n Boolean(bodySchema.value && isObjectSchema(bodySchema.value))),\n)\n\n/* Selected body view, raw by default so existing behavior is unchanged */\nconst bodyView = ref<'form' \| 'raw'>('raw')\n\n// Fall back to raw when the form view stops being available (e.g. the content type\n// changed to a non-structured one, or an external edit made the body unparseable).\nwatch(isFormViewAvailable, (ok) => {\n if (!ok) {\n bodyView.value = 'raw'\n }\n})\n</script>\n<template>\n <CollapsibleSection>\n <template #title>{{ title }}</template>\n <DataTable\n :columns=\"['']\"\n presentational>\n <DataTableHeader\n class=\"relative col-span-full flex h-8 cursor-pointer items-center justify-between border-r-0 !p-0\">\n <ScalarListbox\n v-model=\"selectedContentTypeModel\"\n :options=\"contentTypeOptions\"\n teleport>\n <ScalarButton\n class=\"text-c-2 hover:text-c-1 flex h-full w-fit gap-1.5 px-3 font-normal\"\n fullWidth\n variant=\"ghost\">\n <span>{{ selectedContentTypeModel.label }}</span>\n <ScalarIcon\n icon=\"ChevronDown\"\n size=\"md\" />\n </ScalarButton>\n </ScalarListbox>\n <RequestBodyViewToggle\n v-if=\"showBodyViewToggle\"\n :disabled=\"!isFormViewAvailable\"\n :modelValue=\"bodyView\"\n @update:modelValue=\"(v) => (bodyView = v)\" />\n </DataTableHeader>\n <DataTableRow>\n <!-- No Body -->\n <template v-if=\"selectedContentType === 'none'\">\n <div\n class=\"text-c-3 flex min-h-10 w-full items-center justify-center border-t p-2 text-sm\">\n <span>No Body</span>\n </div>\n </template>\n\n <!-- Binary File -->\n <template\n v-else-if=\"selectedContentType === 'application/octet-stream'\">\n <div\n class=\"flex items-center justify-center overflow-hidden border-t p-1.5\">\n <template\n v-if=\"\n getFileName(unpackProxyObject(example?.value)) !== undefined\n \">\n <span\n class=\"text-c-2 w-full max-w-full overflow-hidden rounded border px-1.5 py-1 text-xs whitespace-nowrap\">\n {{ getFileName(unpackProxyObject(example?.value)) }}\n </span>\n <ScalarButton\n class=\"bg-b-2 hover:bg-b-3 text-c-2 ml-1 border-0 shadow-none\"\n size=\"sm\"\n variant=\"outlined\"\n @click=\"\n emits('update:value', {\n payload: undefined,\n contentType: selectedContentType,\n })\n \">\n Delete\n </ScalarButton>\n </template>\n <template v-else>\n <ScalarButton\n class=\"bg-b-2 hover:bg-b-3 text-c-2 border-0 shadow-none\"\n size=\"sm\"\n variant=\"outlined\"\n @click=\"\n () =>\n handleFileUpload((file) =>\n emits('update:value', {\n payload: file,\n contentType: selectedContentType,\n }),\n )\n \">\n <span>Select File</span>\n <ScalarIcon\n class=\"ml-1\"\n icon=\"Upload\"\n size=\"xs\"\n thickness=\"2.5\" />\n </ScalarButton>\n </template>\n </div>\n </template>\n\n <!-- Form Data / URL Encoded -->\n <template\n v-else-if=\"\n selectedContentType === 'multipart/form-data' \|\|\n selectedContentType === 'application/x-www-form-urlencoded'\n \">\n <RequestBodyForm\n :bodySchema\n :environment\n :example\n :selectedContentType\n @update:formValue=\"\n (payload) =>\n emits('update:formValue', {\n payload,\n contentType: selectedContentType,\n })\n \" />\n </template>\n\n <!-- Code/Other -->\n <template v-else>\n <!-- Schema-driven form view for structured (JSON/YAML) bodies -->\n <RequestBodyStructured\n v-if=\"bodyView === 'form' && isFormViewAvailable\"\n :bodySchema\n :contentType=\"selectedContentType\"\n :environment\n :parsedValue=\"parsedBody.value\"\n @update:value=\"\n (value) =>\n emits('update:value', {\n payload: value,\n contentType: selectedContentType,\n })\n \" />\n <CodeInput\n v-else\n class=\"border-t px-3\"\n content=\"\"\n :environment=\"environment\"\n :language=\"\n contentTypeToLanguageMap[\n selectedContentType as keyof typeof contentTypeToLanguageMap\n ] ?? 'plaintext'\n \"\n lineNumbers\n lint\n :modelValue=\"bodyValue\"\n withFakeData\n @update:modelValue=\"\n (value) =>\n emits('update:value', {\n payload: value,\n contentType: selectedContentType,\n })\n \" />\n </template>\n </DataTableRow>\n </DataTable>\n </CollapsibleSection>\n</template>\n<style scoped>\n:deep(.cm-content) {\n font-size: var(--scalar-small);\n}\n</style>\n"],"mappings":"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"}

package/dist/v2/blocks/request-block/components/RequestBodyForm.vue.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RequestBodyForm.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/request-block/components/RequestBodyForm.vue"],"names":[],"mappings":"AAoIA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2EAA2E,CAAA;AACnH,OAAO,KAAK,EACV,aAAa,EACb,YAAY,EACb,MAAM,8DAA8D,CAAA;AAQrE,KAAK,WAAW,GAAG;IACjB,OAAO,EAAE,aAAa,GAAG,SAAS,GAAG,IAAI,CAAA;IACzC,6FAA6F;IAC7F,UAAU,CAAC,EAAE,YAAY,CAAA;IACzB,mBAAmB,EAAE,MAAM,CAAA;IAC3B,WAAW,EAAE,kBAAkB,CAAA;CAChC,CAAC;~~AAmLF~~,QAAA,MAAM,YAAY;;;;;;;;;;;;kFAGhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
1	+ {"version":3,"file":"RequestBodyForm.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/request-block/components/RequestBodyForm.vue"],"names":[],"mappings":"AAoIA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2EAA2E,CAAA;AACnH,OAAO,KAAK,EACV,aAAa,EACb,YAAY,EACb,MAAM,8DAA8D,CAAA;AAQrE,KAAK,WAAW,GAAG;IACjB,OAAO,EAAE,aAAa,GAAG,SAAS,GAAG,IAAI,CAAA;IACzC,6FAA6F;IAC7F,UAAU,CAAC,EAAE,YAAY,CAAA;IACzB,mBAAmB,EAAE,MAAM,CAAA;IAC3B,WAAW,EAAE,kBAAkB,CAAA;CAChC,CAAC;AAyLF,QAAA,MAAM,YAAY;;;;;;;;;;;;kFAGhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/v2/blocks/request-block/components/RequestBodyForm.vue.script.js CHANGED Viewed

@@ -3,7 +3,7 @@ import RequestTable_default from "./RequestTable.vue.js";
 import { getFormBodyRows } from "../helpers/get-form-body-rows.js";
 import { createBlock, defineComponent, openBlock, ref, watch } from "vue";
 //#region src/v2/blocks/request-block/components/RequestBodyForm.vue?vue&type=script&setup=true&lang.ts
-var RequestBodyForm_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var RequestBodyForm_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	__name: "RequestBodyForm",
 	props: {
 		example: {},

package/dist/v2/blocks/request-block/components/RequestBodyForm.vue.script.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RequestBodyForm.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestBodyForm.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ApiReferenceEvents } from '@scalar/workspace-store/events'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type {\n ExampleObject,\n SchemaObject,\n} from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { ref, watch } from 'vue'\n\nimport { useFileDialog } from '@/hooks/use-file-dialog'\nimport RequestTable from '@/v2/blocks/request-block/components/RequestTable.vue'\nimport type { TableRow } from '@/v2/blocks/request-block/components/RequestTableRow.vue'\nimport { getFormBodyRows } from '@/v2/blocks/request-block/helpers/get-form-body-rows'\n\nconst { example, bodySchema, selectedContentType, environment } = defineProps<{\n example: ExampleObject \| undefined \| null\n /** Resolved schema for the form body so the table can show enums and validation per field /\n bodySchema?: SchemaObject\n selectedContentType: string\n environment: XScalarEnvironment\n}>()\n\nconst emit = defineEmits<{\n (\n e: 'update:formValue',\n payload: ApiReferenceEvents['operation:update:requestBody:formValue']['payload'],\n ): void\n}>()\n\n/* Local state for form body rows /\nconst localFormBodyRows = ref<TableRow[]>([])\n\n/* Sync the local form body rows with the example and schema /\nwatch(\n () => [example, bodySchema, selectedContentType] as const,\n ([newExample, schema, contentType]) => {\n localFormBodyRows.value = getFormBodyRows(newExample, contentType, schema)\n },\n { immediate: true },\n)\n\nconst handleUpdateFormValue = (rows: TableRow[]) => {\n emit(\n 'update:formValue',\n rows.map((row) => ({\n name: row.name,\n value: row.value as string \| File,\n isDisabled: row.isDisabled ?? false,\n })),\n )\n}\n\n/* Update a row in the table, combines with the previous data so we emit a whole row /\nconst handleUpsertRow = (\n index: number,\n payload: Partial<{\n name: string\n value: string \| File \| undefined\n isDisabled: boolean\n }>,\n) => {\n // Add new row\n if (index >= localFormBodyRows.value.length) {\n localFormBodyRows.value = [\n ...localFormBodyRows.value,\n { name: '', value: '', ...payload, isDisabled: false },\n ]\n handleUpdateFormValue(localFormBodyRows.value)\n return\n }\n\n localFormBodyRows.value = localFormBodyRows.value.map((row, i) =>\n i === index ? { ...row, ...payload } : row,\n )\n handleUpdateFormValue(localFormBodyRows.value)\n}\n\n/* Delete a row from the table /\nconst handleDeleteRow = (index: number) => {\n localFormBodyRows.value = localFormBodyRows.value.filter(\n (_, i) => i !== index,\n )\n handleUpdateFormValue(localFormBodyRows.value)\n}\n\n/* Handle file upload for a specific row index /\nconst handleFileUpload = (index: number) => {\n const { open } = useFileDialog({\n onChange: (files) => {\n const file = files?.[0]\n\n if (file) {\n const currentRow = localFormBodyRows.value[index]\n handleUpsertRow(index, {\n name: currentRow?.name \|\| file.name,\n value: file,\n })\n }\n },\n multiple: false,\n accept: '/*',\n })\n open()\n}\n</script>\n\n<template>\n <!-- Form Data -->\n <template v-if=\"selectedContentType === 'multipart/form-data'\">\n <RequestTable\n :data=\"localFormBodyRows\"\n :environment=\"environment\"\n showUploadButton\n @deleteRow=\"handleDeleteRow\"\n @removeFile=\"(index) => handleUpsertRow(index, { value: undefined })\"\n @uploadFile=\"handleFileUpload\"\n @upsertRow=\"handleUpsertRow\" />\n </template>\n\n <!-- Form URL Encoded -->\n <template v-else>\n <RequestTable\n :data=\"localFormBodyRows\"\n :environment=\"environment\"\n @deleteRow=\"handleDeleteRow\"\n @upsertRow=\"handleUpsertRow\" />\n </template>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;EAsBA,MAAM,OAAO;;EAQb,MAAM,oBAAoB,IAAgB,~~EAAE~~,~~CAAA~~;;~~AAG5C~~,~~cACQ~~;GAAC,QAAA;GAAS,QAAA;GAAY,QAAA;~~GAAoB~~,~~GAC/C~~,CAAC,YAAY,QAAQ,iBAAiB;~~AACrC~~,~~qBAAkB~~,QAAQ,gBAAgB,YAAY,aAAa,~~OAAM~~;~~KAE3E~~,EAAE,WAAW,~~MAAM~~,~~CACrB~~;EAEA,MAAM,yBAAyB,SAAqB;~~AAClD~~,~~QACE~~,oBACA,KAAK,KAAK,SAAS;IACjB,MAAM,IAAI;IACV,OAAO,IAAI;IACX,YAAY,IAAI,cAAc;~~IAC/B~~,EAAE,~~CACL;;;EAIF~~,MAAM,mBACJ,OACA,YAKG;~~AAEH~~,~~OAAI~~,SAAS,kBAAkB,MAAM,QAAQ;~~AAC3C~~,~~sBAAkB~~,QAAQ,CACxB,GAAG,kBAAkB,OACrB;KAAE,MAAM;KAAI,OAAO;KAAI,GAAG;KAAS,YAAY;~~KAAO~~,~~CACxD~~;~~AACA~~,~~0BAAsB~~,kBAAkB,~~MAAK~~;~~AAC7C;;AAGF~~,~~qBAAkB~~,QAAQ,kBAAkB,MAAM,KAAK,KAAK,MAC1D,MAAM,QAAQ;IAAE,GAAG;IAAK,GAAG;~~IAAS~~,~~GAAG~~,~~IACzC~~;~~AACA~~,~~yBAAsB~~,kBAAkB,~~MAAK;;;EAI~~/C,MAAM,mBAAmB,UAAkB;~~AACzC~~,~~qBAAkB~~,QAAQ,kBAAkB,MAAM,QAC/C,GAAG,MAAM,MAAM,~~MAClB~~;~~AACA~~,~~yBAAsB~~,kBAAkB,~~MAAK;;;EAI~~/C,MAAM,oBAAoB,UAAkB;GAC1C,MAAM,EAAE,SAAS,cAAc;IAC7B,WAAW,UAAU;KACnB,MAAM,OAAO,QAAQ;~~AAErB~~,~~SAAI~~,MAAM;MACR,MAAM,aAAa,kBAAkB,MAAM;~~AAC3C~~,~~sBAAgB~~,OAAO;OACrB,MAAM,YAAY,QAAQ,KAAK;OAC/B,OAAO;~~OACR~~,~~CAAA;;;IAGL~~,UAAU;IACV,QAAQ;~~IACT~~,~~CAAA~~;~~AACD~~,~~SAAK;;;UAMW~~,QAAA,wBAAmB,yBAAA,~~WAAA~~,~~EACjC~~,YAOiC,sBAAA;;IAN9B,MAAM,kBAAA;IACN,aAAa,QAAA;IACd,kBAAA;IACC,aAAW;IACX,cAAU,OAAA,OAAA,OAAA,MAAG,UAAU,gBAAgB,OAAK,EAAA,OAAW,KAAA,~~GAAS~~,CAAA;IAChE,cAAY;IACZ,aAAW;yDAKd,YAIiC,sBAAA;;IAH9B,MAAM,kBAAA;IACN,aAAa,QAAA;IACb,aAAW;IACX,aAAW"}
1	+ {"version":3,"file":"RequestBodyForm.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestBodyForm.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { ApiReferenceEvents } from '@scalar/workspace-store/events'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type {\n ExampleObject,\n SchemaObject,\n} from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { ref, watch } from 'vue'\n\nimport { useFileDialog } from '@/hooks/use-file-dialog'\nimport RequestTable from '@/v2/blocks/request-block/components/RequestTable.vue'\nimport type { TableRow } from '@/v2/blocks/request-block/components/RequestTableRow.vue'\nimport { getFormBodyRows } from '@/v2/blocks/request-block/helpers/get-form-body-rows'\n\nconst { example, bodySchema, selectedContentType, environment } = defineProps<{\n example: ExampleObject \| undefined \| null\n /** Resolved schema for the form body so the table can show enums and validation per field /\n bodySchema?: SchemaObject\n selectedContentType: string\n environment: XScalarEnvironment\n}>()\n\nconst emit = defineEmits<{\n (\n e: 'update:formValue',\n payload: ApiReferenceEvents['operation:update:requestBody:formValue']['payload'],\n ): void\n}>()\n\n/* Local state for form body rows /\nconst localFormBodyRows = ref<TableRow[]>([])\n\n/* Sync the local form body rows with the example and schema /\nwatch(\n () => [example, bodySchema, selectedContentType] as const,\n ([newExample, schema, contentType]) => {\n localFormBodyRows.value = getFormBodyRows(newExample, contentType, schema)\n },\n { immediate: true },\n)\n\nconst handleUpdateFormValue = (rows: TableRow[]) => {\n emit(\n 'update:formValue',\n rows.map((row) => ({\n name: row.name,\n value: row.value as string \| File,\n isDisabled: row.isDisabled ?? false,\n })),\n )\n}\n\n/* Update a row in the table, combines with the previous data so we emit a whole row /\nconst handleUpsertRow = (\n index: number,\n payload: Partial<{\n name: string\n value: string \| File \| undefined\n isDisabled: boolean\n }>,\n) => {\n // Add new row\n if (index >= localFormBodyRows.value.length) {\n localFormBodyRows.value = [\n ...localFormBodyRows.value,\n { name: '', value: '', ...payload, isDisabled: false },\n ]\n handleUpdateFormValue(localFormBodyRows.value)\n return\n }\n\n localFormBodyRows.value = localFormBodyRows.value.map((row, i) =>\n i === index ? { ...row, ...payload } : row,\n )\n handleUpdateFormValue(localFormBodyRows.value)\n}\n\n/* Delete a row from the table /\nconst handleDeleteRow = (index: number) => {\n localFormBodyRows.value = localFormBodyRows.value.filter(\n (_, i) => i !== index,\n )\n handleUpdateFormValue(localFormBodyRows.value)\n}\n\n/* Handle file upload for a specific row index /\nconst handleFileUpload = (index: number) => {\n const { open } = useFileDialog({\n onChange: (files) => {\n const file = files?.[0]\n\n if (file) {\n const currentRow = localFormBodyRows.value[index]\n handleUpsertRow(index, {\n name: currentRow?.name \|\| file.name,\n value: file,\n })\n }\n },\n multiple: false,\n accept: '/*',\n })\n open()\n}\n</script>\n\n<template>\n <!-- Form Data -->\n <template v-if=\"selectedContentType === 'multipart/form-data'\">\n <RequestTable\n :data=\"localFormBodyRows\"\n :environment=\"environment\"\n showUploadButton\n @deleteRow=\"handleDeleteRow\"\n @removeFile=\"(index) => handleUpsertRow(index, { value: undefined })\"\n @uploadFile=\"handleFileUpload\"\n @upsertRow=\"handleUpsertRow\" />\n </template>\n\n <!-- Form URL Encoded -->\n <template v-else>\n <RequestTable\n :data=\"localFormBodyRows\"\n :environment=\"environment\"\n @deleteRow=\"handleDeleteRow\"\n @upsertRow=\"handleUpsertRow\" />\n </template>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;EAsBA,MAAM,OAAO;;EAQb,MAAM,oBAAoB,IAAgB,CAAC,CAAC;;EAG5C,YACQ;GAAC,QAAA;GAAS,QAAA;GAAY,QAAA;EAAmB,IAC9C,CAAC,YAAY,QAAQ,iBAAiB;GACrC,kBAAkB,QAAQ,gBAAgB,YAAY,aAAa,MAAM;EAC3E,GACA,EAAE,WAAW,KAAK,CACpB;EAEA,MAAM,yBAAyB,SAAqB;GAClD,KACE,oBACA,KAAK,KAAK,SAAS;IACjB,MAAM,IAAI;IACV,OAAO,IAAI;IACX,YAAY,IAAI,cAAc;GAChC,EAAE,CACJ;EACF;;EAGA,MAAM,mBACJ,OACA,YAKG;GAEH,IAAI,SAAS,kBAAkB,MAAM,QAAQ;IAC3C,kBAAkB,QAAQ,CACxB,GAAG,kBAAkB,OACrB;KAAE,MAAM;KAAI,OAAO;KAAI,GAAG;KAAS,YAAY;IAAM,CACvD;IACA,sBAAsB,kBAAkB,KAAK;IAC7C;GACF;GAEA,kBAAkB,QAAQ,kBAAkB,MAAM,KAAK,KAAK,MAC1D,MAAM,QAAQ;IAAE,GAAG;IAAK,GAAG;GAAQ,IAAI,GACzC;GACA,sBAAsB,kBAAkB,KAAK;EAC/C;;EAGA,MAAM,mBAAmB,UAAkB;GACzC,kBAAkB,QAAQ,kBAAkB,MAAM,QAC/C,GAAG,MAAM,MAAM,KAClB;GACA,sBAAsB,kBAAkB,KAAK;EAC/C;;EAGA,MAAM,oBAAoB,UAAkB;GAC1C,MAAM,EAAE,SAAS,cAAc;IAC7B,WAAW,UAAU;KACnB,MAAM,OAAO,QAAQ;KAErB,IAAI,MAAM;MACR,MAAM,aAAa,kBAAkB,MAAM;MAC3C,gBAAgB,OAAO;OACrB,MAAM,YAAY,QAAQ,KAAK;OAC/B,OAAO;MACT,CAAC;KACH;IACF;IACA,UAAU;IACV,QAAQ;GACV,CAAC;GACD,KAAK;EACP;;UAKkB,QAAA,wBAAmB,yBAAA,UAAA,GACjC,YAOiC,sBAAA;;IAN9B,MAAM,kBAAA;IACN,aAAa,QAAA;IACd,kBAAA;IACC,aAAW;IACX,cAAU,OAAA,OAAA,OAAA,MAAG,UAAU,gBAAgB,OAAK,EAAA,OAAW,KAAA,EAAS,CAAA;IAChE,cAAY;IACZ,aAAW;yDAKd,YAIiC,sBAAA;;IAH9B,MAAM,kBAAA;IACN,aAAa,QAAA;IACb,aAAW;IACX,aAAW"}

package/dist/v2/blocks/request-block/components/RequestBodyStructured.vue.d.ts ADDED Viewed

@@ -0,0 +1,19 @@
+import type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments';
+import type { SchemaObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document';
+type __VLS_Props = {
+    /** The parsed (object) value of the structured body */
+    parsedValue: unknown;
+    /** Resolved schema for the body so the table can show enums and validation per field */
+    bodySchema?: SchemaObject;
+    /** The selected content type, decides how the folded body is serialized (JSON/YAML) */
+    contentType: string;
+    environment: XScalarEnvironment;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:value": (payload: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:value"?: ((payload: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=RequestBodyStructured.vue.d.ts.map

package/dist/v2/blocks/request-block/components/RequestBodyStructured.vue.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"RequestBodyStructured.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/request-block/components/RequestBodyStructured.vue"],"names":[],"mappings":"AA8GA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2EAA2E,CAAA;AACnH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,8DAA8D,CAAA;AAShG,KAAK,WAAW,GAAG;IACjB,uDAAuD;IACvD,WAAW,EAAE,OAAO,CAAA;IACpB,wFAAwF;IACxF,UAAU,CAAC,EAAE,YAAY,CAAA;IACzB,uFAAuF;IACvF,WAAW,EAAE,MAAM,CAAA;IACnB,WAAW,EAAE,kBAAkB,CAAA;CAChC,CAAC;AAuIF,QAAA,MAAM,YAAY;;;;kFAGhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/v2/blocks/request-block/components/RequestBodyStructured.vue.js ADDED Viewed

@@ -0,0 +1,7 @@
+import RequestBodyStructured_vue_vue_type_script_setup_true_lang_default from "./RequestBodyStructured.vue.script.js";
+//#region src/v2/blocks/request-block/components/RequestBodyStructured.vue
+var RequestBodyStructured_default = RequestBodyStructured_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { RequestBodyStructured_default as default };
+//# sourceMappingURL=RequestBodyStructured.vue.js.map

package/dist/v2/blocks/request-block/components/RequestBodyStructured.vue.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"RequestBodyStructured.vue.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestBodyStructured.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type { SchemaObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { computed, ref, watch } from 'vue'\n\nimport RequestTable from '@/v2/blocks/request-block/components/RequestTable.vue'\nimport type { TableRow } from '@/v2/blocks/request-block/components/RequestTableRow.vue'\nimport { foldStructuredBodyRows } from '@/v2/blocks/request-block/helpers/fold-structured-body-rows'\nimport { getStructuredBodyRows } from '@/v2/blocks/request-block/helpers/get-structured-body-rows'\nimport { getStructuredBodyCodec } from '@/v2/blocks/request-block/helpers/structured-body-codec'\n\nconst { parsedValue, bodySchema, contentType, environment } = defineProps<{\n /** The parsed (object) value of the structured body */\n parsedValue: unknown\n /** Resolved schema for the body so the table can show enums and validation per field */\n bodySchema?: SchemaObject\n /** The selected content type, decides how the folded body is serialized (JSON/YAML) */\n contentType: string\n environment: XScalarEnvironment\n}>()\n\nconst emit = defineEmits<{\n /** Serialized body text for the current content type */\n (e: 'update:value', payload: string): void\n}>()\n\nconst codec = computed(() => getStructuredBodyCodec(contentType))\n\n/** Local state for the body rows */\nconst localRows = ref<TableRow[]>([])\n\n/**\n * The serialized string we last emitted. Store updates triggered by our own emit come\n * back through the `parsedValue` prop — skip the row rebuild for those so typing does\n * not churn focus and a just-cleared row does not vanish mid-edit.\n */\nlet lastEmitted: string | undefined\n\nwatch(\n () => [parsedValue, bodySchema, contentType] as const,\n ([newValue, schema]) => {\n if (lastEmitted !== undefined && codec.value) {\n try {\n if (codec.value.stringify(newValue) === lastEmitted) {\n return\n }\n } catch {\n // Not serializable — treat as an external change and rebuild.\n }\n }\n lastEmitted = undefined\n localRows.value = getStructuredBodyRows(newValue, schema)\n },\n { immediate: true },\n)\n\nconst emitRows = () => {\n if (!codec.value) {\n return\n }\n const serialized = codec.value.stringify(\n foldStructuredBodyRows(localRows.value, bodySchema),\n )\n lastEmitted = serialized\n emit('update:value', serialized)\n}\n\n/** Update a row in the table, combines with the previous data so we emit the whole body */\nconst handleUpsertRow = (\n index: number,\n payload: Partial<{\n name: string\n value: string | File | undefined\n isDisabled: boolean\n }>,\n) => {\n // Add new row\n if (index >= localRows.value.length) {\n localRows.value = [\n ...localRows.value,\n { name: '', value: '', ...payload, isDisabled: false },\n ]\n emitRows()\n return\n }\n\n localRows.value = localRows.value.map((row, i) =>\n i === index ? { ...row, ...payload } : row,\n )\n emitRows()\n}\n\n/** Delete a row from the table */\nconst handleDeleteRow = (index: number) => {\n localRows.value = localRows.value.filter((_, i) => i !== index)\n emitRows()\n}\n</script>\n\n<template>\n <RequestTable\n :data=\"localRows\"\n :environment=\"environment\"\n label=\"Body\"\n @deleteRow=\"handleDeleteRow\"\n @upsertRow=\"handleUpsertRow\" />\n</template>\n"],"mappings":""}

package/dist/v2/blocks/request-block/components/RequestBodyStructured.vue.script.js ADDED Viewed

@@ -0,0 +1,81 @@
+import RequestTable_default from "./RequestTable.vue.js";
+import { foldStructuredBodyRows } from "../helpers/fold-structured-body-rows.js";
+import { getStructuredBodyRows } from "../helpers/get-structured-body-rows.js";
+import { getStructuredBodyCodec } from "../helpers/structured-body-codec.js";
+import { computed, createBlock, defineComponent, openBlock, ref, watch } from "vue";
+//#region src/v2/blocks/request-block/components/RequestBodyStructured.vue?vue&type=script&setup=true&lang.ts
+var RequestBodyStructured_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "RequestBodyStructured",
+	props: {
+		parsedValue: {},
+		bodySchema: {},
+		contentType: {},
+		environment: {}
+	},
+	emits: ["update:value"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		const codec = computed(() => getStructuredBodyCodec(__props.contentType));
+		/** Local state for the body rows */
+		const localRows = ref([]);
+		/**
+		* The serialized string we last emitted. Store updates triggered by our own emit come
+		* back through the `parsedValue` prop — skip the row rebuild for those so typing does
+		* not churn focus and a just-cleared row does not vanish mid-edit.
+		*/
+		let lastEmitted;
+		watch(() => [
+			__props.parsedValue,
+			__props.bodySchema,
+			__props.contentType
+		], ([newValue, schema]) => {
+			if (lastEmitted !== void 0 && codec.value) try {
+				if (codec.value.stringify(newValue) === lastEmitted) return;
+			} catch {}
+			lastEmitted = void 0;
+			localRows.value = getStructuredBodyRows(newValue, schema);
+		}, { immediate: true });
+		const emitRows = () => {
+			if (!codec.value) return;
+			const serialized = codec.value.stringify(foldStructuredBodyRows(localRows.value, __props.bodySchema));
+			lastEmitted = serialized;
+			emit("update:value", serialized);
+		};
+		/** Update a row in the table, combines with the previous data so we emit the whole body */
+		const handleUpsertRow = (index, payload) => {
+			if (index >= localRows.value.length) {
+				localRows.value = [...localRows.value, {
+					name: "",
+					value: "",
+					...payload,
+					isDisabled: false
+				}];
+				emitRows();
+				return;
+			}
+			localRows.value = localRows.value.map((row, i) => i === index ? {
+				...row,
+				...payload
+			} : row);
+			emitRows();
+		};
+		/** Delete a row from the table */
+		const handleDeleteRow = (index) => {
+			localRows.value = localRows.value.filter((_, i) => i !== index);
+			emitRows();
+		};
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(RequestTable_default, {
+				data: localRows.value,
+				environment: __props.environment,
+				label: "Body",
+				onDeleteRow: handleDeleteRow,
+				onUpsertRow: handleUpsertRow
+			}, null, 8, ["data", "environment"]);
+		};
+	}
+});
+//#endregion
+export { RequestBodyStructured_vue_vue_type_script_setup_true_lang_default as default };
+//# sourceMappingURL=RequestBodyStructured.vue.script.js.map

package/dist/v2/blocks/request-block/components/RequestBodyStructured.vue.script.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"RequestBodyStructured.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestBodyStructured.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type { SchemaObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { computed, ref, watch } from 'vue'\n\nimport RequestTable from '@/v2/blocks/request-block/components/RequestTable.vue'\nimport type { TableRow } from '@/v2/blocks/request-block/components/RequestTableRow.vue'\nimport { foldStructuredBodyRows } from '@/v2/blocks/request-block/helpers/fold-structured-body-rows'\nimport { getStructuredBodyRows } from '@/v2/blocks/request-block/helpers/get-structured-body-rows'\nimport { getStructuredBodyCodec } from '@/v2/blocks/request-block/helpers/structured-body-codec'\n\nconst { parsedValue, bodySchema, contentType, environment } = defineProps<{\n /** The parsed (object) value of the structured body */\n parsedValue: unknown\n /** Resolved schema for the body so the table can show enums and validation per field */\n bodySchema?: SchemaObject\n /** The selected content type, decides how the folded body is serialized (JSON/YAML) */\n contentType: string\n environment: XScalarEnvironment\n}>()\n\nconst emit = defineEmits<{\n /** Serialized body text for the current content type */\n (e: 'update:value', payload: string): void\n}>()\n\nconst codec = computed(() => getStructuredBodyCodec(contentType))\n\n/** Local state for the body rows */\nconst localRows = ref<TableRow[]>([])\n\n/**\n * The serialized string we last emitted. Store updates triggered by our own emit come\n * back through the `parsedValue` prop — skip the row rebuild for those so typing does\n * not churn focus and a just-cleared row does not vanish mid-edit.\n */\nlet lastEmitted: string | undefined\n\nwatch(\n () => [parsedValue, bodySchema, contentType] as const,\n ([newValue, schema]) => {\n if (lastEmitted !== undefined && codec.value) {\n try {\n if (codec.value.stringify(newValue) === lastEmitted) {\n return\n }\n } catch {\n // Not serializable — treat as an external change and rebuild.\n }\n }\n lastEmitted = undefined\n localRows.value = getStructuredBodyRows(newValue, schema)\n },\n { immediate: true },\n)\n\nconst emitRows = () => {\n if (!codec.value) {\n return\n }\n const serialized = codec.value.stringify(\n foldStructuredBodyRows(localRows.value, bodySchema),\n )\n lastEmitted = serialized\n emit('update:value', serialized)\n}\n\n/** Update a row in the table, combines with the previous data so we emit the whole body */\nconst handleUpsertRow = (\n index: number,\n payload: Partial<{\n name: string\n value: string | File | undefined\n isDisabled: boolean\n }>,\n) => {\n // Add new row\n if (index >= localRows.value.length) {\n localRows.value = [\n ...localRows.value,\n { name: '', value: '', ...payload, isDisabled: false },\n ]\n emitRows()\n return\n }\n\n localRows.value = localRows.value.map((row, i) =>\n i === index ? { ...row, ...payload } : row,\n )\n emitRows()\n}\n\n/** Delete a row from the table */\nconst handleDeleteRow = (index: number) => {\n localRows.value = localRows.value.filter((_, i) => i !== index)\n emitRows()\n}\n</script>\n\n<template>\n <RequestTable\n :data=\"localRows\"\n :environment=\"environment\"\n label=\"Body\"\n @deleteRow=\"handleDeleteRow\"\n @upsertRow=\"handleUpsertRow\" />\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;EAqBA,MAAM,OAAO;EAKb,MAAM,QAAQ,eAAe,uBAAuB,QAAA,WAAW,CAAC;;EAGhE,MAAM,YAAY,IAAgB,CAAC,CAAC;;;;;;EAOpC,IAAI;EAEJ,YACQ;GAAC,QAAA;GAAa,QAAA;GAAY,QAAA;EAAW,IAC1C,CAAC,UAAU,YAAY;GACtB,IAAI,gBAAgB,KAAA,KAAa,MAAM,OACrC,IAAI;IACF,IAAI,MAAM,MAAM,UAAU,QAAQ,MAAM,aACtC;GAEJ,QAAQ,CAER;GAEF,cAAc,KAAA;GACd,UAAU,QAAQ,sBAAsB,UAAU,MAAM;EAC1D,GACA,EAAE,WAAW,KAAK,CACpB;EAEA,MAAM,iBAAiB;GACrB,IAAI,CAAC,MAAM,OACT;GAEF,MAAM,aAAa,MAAM,MAAM,UAC7B,uBAAuB,UAAU,OAAO,QAAA,UAAU,CACpD;GACA,cAAc;GACd,KAAK,gBAAgB,UAAU;EACjC;;EAGA,MAAM,mBACJ,OACA,YAKG;GAEH,IAAI,SAAS,UAAU,MAAM,QAAQ;IACnC,UAAU,QAAQ,CAChB,GAAG,UAAU,OACb;KAAE,MAAM;KAAI,OAAO;KAAI,GAAG;KAAS,YAAY;IAAM,CACvD;IACA,SAAS;IACT;GACF;GAEA,UAAU,QAAQ,UAAU,MAAM,KAAK,KAAK,MAC1C,MAAM,QAAQ;IAAE,GAAG;IAAK,GAAG;GAAQ,IAAI,GACzC;GACA,SAAS;EACX;;EAGA,MAAM,mBAAmB,UAAkB;GACzC,UAAU,QAAQ,UAAU,MAAM,QAAQ,GAAG,MAAM,MAAM,KAAK;GAC9D,SAAS;EACX;;uBAIE,YAKiC,sBAAA;IAJ9B,MAAM,UAAA;IACN,aAAa,QAAA;IACd,OAAM;IACL,aAAW;IACX,aAAW"}

package/dist/v2/blocks/request-block/components/RequestBodyViewToggle.vue.d.ts ADDED Viewed

@@ -0,0 +1,13 @@
+type __VLS_Props = {
+    modelValue: 'form' | 'raw';
+    /** Disable switching to the form view (e.g. while the raw body is not parseable) */
+    disabled?: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:modelValue": (v: "form" | "raw") => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:modelValue"?: ((v: "form" | "raw") => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=RequestBodyViewToggle.vue.d.ts.map

package/dist/v2/blocks/request-block/components/RequestBodyViewToggle.vue.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"RequestBodyViewToggle.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/request-block/components/RequestBodyViewToggle.vue"],"names":[],"mappings":"AAAA,KAyCK,WAAW,GAAG;IACjB,UAAU,EAAE,MAAM,GAAG,KAAK,CAAA;IAC1B,oFAAoF;IACpF,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAC;AA2EF,QAAA,MAAM,YAAY;;;;kFAGhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/v2/blocks/request-block/components/RequestBodyViewToggle.vue.js ADDED Viewed

@@ -0,0 +1,7 @@
+import RequestBodyViewToggle_vue_vue_type_script_setup_true_lang_default from "./RequestBodyViewToggle.vue.script.js";
+//#region src/v2/blocks/request-block/components/RequestBodyViewToggle.vue
+var RequestBodyViewToggle_default = RequestBodyViewToggle_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { RequestBodyViewToggle_default as default };
+//# sourceMappingURL=RequestBodyViewToggle.vue.js.map

package/dist/v2/blocks/request-block/components/RequestBodyViewToggle.vue.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"RequestBodyViewToggle.vue.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestBodyViewToggle.vue"],"sourcesContent":["<script lang=\"ts\" setup>\ndefineProps<{\n modelValue: 'form' | 'raw'\n /** Disable switching to the form view (e.g. while the raw body is not parseable) */\n disabled?: boolean\n}>()\ndefineEmits<{\n (e: 'update:modelValue', v: 'form' | 'raw'): void\n}>()\n</script>\n<template>\n <div\n class=\"text-c-3 text-xxs -my-1 mr-2 flex justify-center gap-0.5 rounded p-0.5\">\n <button\n class=\"rounded px-1\"\n :class=\"\n disabled\n ? 'cursor-not-allowed opacity-50'\n : {\n 'bg-b-3 text-c-1 cursor-default': modelValue === 'form',\n 'hover:bg-b-3': modelValue !== 'form',\n }\n \"\n :disabled=\"disabled\"\n :title=\"disabled ? 'Fix the body to switch to the form view' : undefined\"\n type=\"button\"\n @click.stop=\"$emit('update:modelValue', 'form')\">\n Form\n </button>\n <button\n class=\"hover:bg-b-3 rounded px-1\"\n :class=\"{ 'bg-b-3 text-c-1 cursor-default': modelValue === 'raw' }\"\n type=\"button\"\n @click.stop=\"$emit('update:modelValue', 'raw')\">\n Raw\n </button>\n </div>\n</template>\n"],"mappings":""}

package/dist/v2/blocks/request-block/components/RequestBodyViewToggle.vue.script.js ADDED Viewed

@@ -0,0 +1,34 @@
+import { createElementBlock, createElementVNode, defineComponent, normalizeClass, openBlock, withModifiers } from "vue";
+//#region src/v2/blocks/request-block/components/RequestBodyViewToggle.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "text-c-3 text-xxs -my-1 mr-2 flex justify-center gap-0.5 rounded p-0.5" };
+var _hoisted_2 = ["disabled", "title"];
+var RequestBodyViewToggle_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "RequestBodyViewToggle",
+	props: {
+		modelValue: {},
+		disabled: { type: Boolean }
+	},
+	emits: ["update:modelValue"],
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", _hoisted_1, [createElementVNode("button", {
+				class: normalizeClass(["rounded px-1", __props.disabled ? "cursor-not-allowed opacity-50" : {
+					"bg-b-3 text-c-1 cursor-default": __props.modelValue === "form",
+					"hover:bg-b-3": __props.modelValue !== "form"
+				}]),
+				disabled: __props.disabled,
+				title: __props.disabled ? "Fix the body to switch to the form view" : void 0,
+				type: "button",
+				onClick: _cache[0] || (_cache[0] = withModifiers(($event) => _ctx.$emit("update:modelValue", "form"), ["stop"]))
+			}, " Form ", 10, _hoisted_2), createElementVNode("button", {
+				class: normalizeClass(["hover:bg-b-3 rounded px-1", { "bg-b-3 text-c-1 cursor-default": __props.modelValue === "raw" }]),
+				type: "button",
+				onClick: _cache[1] || (_cache[1] = withModifiers(($event) => _ctx.$emit("update:modelValue", "raw"), ["stop"]))
+			}, " Raw ", 2)]);
+		};
+	}
+});
+//#endregion
+export { RequestBodyViewToggle_vue_vue_type_script_setup_true_lang_default as default };
+//# sourceMappingURL=RequestBodyViewToggle.vue.script.js.map

package/dist/v2/blocks/request-block/components/RequestBodyViewToggle.vue.script.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"RequestBodyViewToggle.vue.script.js","names":["$emit"],"sources":["../../../../../src/v2/blocks/request-block/components/RequestBodyViewToggle.vue"],"sourcesContent":["<script lang=\"ts\" setup>\ndefineProps<{\n modelValue: 'form' | 'raw'\n /** Disable switching to the form view (e.g. while the raw body is not parseable) */\n disabled?: boolean\n}>()\ndefineEmits<{\n (e: 'update:modelValue', v: 'form' | 'raw'): void\n}>()\n</script>\n<template>\n <div\n class=\"text-c-3 text-xxs -my-1 mr-2 flex justify-center gap-0.5 rounded p-0.5\">\n <button\n class=\"rounded px-1\"\n :class=\"\n disabled\n ? 'cursor-not-allowed opacity-50'\n : {\n 'bg-b-3 text-c-1 cursor-default': modelValue === 'form',\n 'hover:bg-b-3': modelValue !== 'form',\n }\n \"\n :disabled=\"disabled\"\n :title=\"disabled ? 'Fix the body to switch to the form view' : undefined\"\n type=\"button\"\n @click.stop=\"$emit('update:modelValue', 'form')\">\n Form\n </button>\n <button\n class=\"hover:bg-b-3 rounded px-1\"\n :class=\"{ 'bg-b-3 text-c-1 cursor-default': modelValue === 'raw' }\"\n type=\"button\"\n @click.stop=\"$emit('update:modelValue', 'raw')\">\n Raw\n </button>\n </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;uBAWE,mBAyBM,OAzBN,YAyBM,CAvBJ,mBAeS,UAAA;IAdP,OAAK,eAAA,CAAC,gBACW,QAAA,WAAA,kCAAA;uCAAmH,QAAA,eAAU;qBAA2C,QAAA,eAAU;;IAQlM,UAAU,QAAA;IACV,OAAO,QAAA,WAAQ,4CAA+C,KAAA;IAC/D,MAAK;IACJ,SAAK,OAAA,OAAA,OAAA,KAAA,eAAA,WAAOA,KAAAA,MAAK,qBAAA,MAAA,GAAA,CAAA,MAAA,CAAA;MAA+B,UAEnD,IAAA,UAAA,GACA,mBAMS,UAAA;IALP,OAAK,eAAA,CAAC,6BAA2B,EAAA,kCACW,QAAA,eAAU,MAAA,CAAA,CAAA;IACtD,MAAK;IACJ,SAAK,OAAA,OAAA,OAAA,KAAA,eAAA,WAAOA,KAAAA,MAAK,qBAAA,KAAA,GAAA,CAAA,MAAA,CAAA;MAA8B,SAElD,CAAA,CAAA,CAAA"}

package/dist/v2/blocks/request-block/components/RequestCodeSnippet.vue.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RequestCodeSnippet.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/request-block/components/RequestCodeSnippet.vue"],"names":[],"mappings":"AAkKA,OAAO,EAOL,KAAK,gBAAgB,EAEtB,MAAM,6BAA6B,CAAA;AAMpC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAMvE,KAAK,WAAW,GAAG,gBAAgB,GAAG;IAAE,QAAQ,EAAE,iBAAiB,CAAA;CAAE,CAAC;~~AA2StE~~,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
1	+ {"version":3,"file":"RequestCodeSnippet.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/request-block/components/RequestCodeSnippet.vue"],"names":[],"mappings":"AAkKA,OAAO,EAOL,KAAK,gBAAgB,EAEtB,MAAM,6BAA6B,CAAA;AAMpC,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAMvE,KAAK,WAAW,GAAG,gBAAgB,GAAG;IAAE,QAAQ,EAAE,iBAAiB,CAAA;CAAE,CAAC;AA4StE,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/v2/blocks/request-block/components/RequestCodeSnippet.vue.script.js CHANGED Viewed

@@ -11,7 +11,7 @@ import { ScalarCodeBlock } from "@scalar/components/code-block";
 //#region src/v2/blocks/request-block/components/RequestCodeSnippet.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = { class: "flex flex-1" };
 var _hoisted_2 = { class: "overflow-hidden" };
-var RequestCodeSnippet_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+var RequestCodeSnippet_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	__name: "RequestCodeSnippet",
 	props: {
 		integration: {},