@scalar/api-client 2.43.0 → 3.1.0

package/dist/views/Request/RequestSection/RequestAuth/helpers/restore-auth-from-local-storage.js

@@ -1,39 +0,0 @@
-import { CLIENT_LS_KEYS, safeLocalStorage } from "@scalar/helpers/object/local-storage";
-import { isDefined } from "@scalar/helpers/array/is-defined";
-//#region src/views/Request/RequestSection/RequestAuth/helpers/restore-auth-from-local-storage.ts
-/**
-* Manually restore the auth from local storage
-*
-* Only use this if you need to restore auth manually, in the client web + app we load the whole store from
-* local storage so it isn't needed there.
-*/
-var restoreAuthFromLocalStorage = (store, collectionUid) => {
-	try {
-		const { collectionMutators, securitySchemes, securitySchemeMutators } = store;
-		const auth = JSON.parse(safeLocalStorage().getItem(CLIENT_LS_KEYS.AUTH) ?? "{}");
-		/** Map the security scheme name key to the uid */
-		const dict = Object.keys(securitySchemes).reduce((acc, key) => {
-			const scheme = securitySchemes[key];
-			if (scheme) acc[scheme.nameKey] = scheme.uid;
-			return acc;
-		}, {});
-		/** Now we can use the dict to restore the auth from local storage */
-		Object.entries(auth).forEach(([key, entry]) => {
-			const uid = dict[key];
-			if (uid) Object.entries(entry).forEach(([path, value]) => {
-				securitySchemeMutators.edit(uid, path, value);
-			});
-		});
-		const uids = JSON.parse(safeLocalStorage().getItem(CLIENT_LS_KEYS.SELECTED_SECURITY_SCHEMES) ?? "[]").map((nameKeys) => {
-			if (Array.isArray(nameKeys)) return nameKeys.map((key) => dict[key]).filter(isDefined);
-			return dict[nameKeys];
-		}).filter(isDefined);
-		collectionMutators.edit(collectionUid, "selectedSecuritySchemeUids", uids);
-	} catch (e) {
-		console.error(e);
-	}
-};
-//#endregion
-export { restoreAuthFromLocalStorage };
-
-//# sourceMappingURL=restore-auth-from-local-storage.js.map

package/dist/views/Request/RequestSection/RequestAuth/helpers/restore-auth-from-local-storage.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"restore-auth-from-local-storage.js","names":[],"sources":["../../../../../../src/views/Request/RequestSection/RequestAuth/helpers/restore-auth-from-local-storage.ts"],"sourcesContent":["import { isDefined } from '@scalar/helpers/array/is-defined'\nimport { CLIENT_LS_KEYS, safeLocalStorage } from '@scalar/helpers/object/local-storage'\nimport type { Collection, SecurityScheme } from '@scalar/oas-utils/entities/spec'\nimport type { Path } from '@scalar/object-utils/nested'\nimport type { Entries } from 'type-fest'\n\nimport type { WorkspaceStore } from '@/store/store'\nimport type { Auth } from '@/views/Request/RequestSection/helpers/update-scheme'\n\n/**\n * Manually restore the auth from local storage\n *\n * Only use this if you need to restore auth manually, in the client web + app we load the whole store from\n * local storage so it isn't needed there.\n */\nexport const restoreAuthFromLocalStorage = (store: WorkspaceStore, collectionUid: string) => {\n  try {\n    const { collectionMutators, securitySchemes, securitySchemeMutators } = store\n    const auth: Auth<Path<SecurityScheme>> = JSON.parse(safeLocalStorage().getItem(CLIENT_LS_KEYS.AUTH) ?? '{}')\n\n    /** Map the security scheme name key to the uid */\n    const dict = Object.keys(securitySchemes).reduce(\n      (acc, key) => {\n        const scheme = securitySchemes[key]\n        if (scheme) {\n          acc[scheme.nameKey] = scheme.uid\n        }\n        return acc\n      },\n      {} as Record<string, SecurityScheme['uid']>,\n    )\n\n    /** Now we can use the dict to restore the auth from local storage */\n    Object.entries(auth).forEach(([key, entry]) => {\n      const uid = dict[key]\n      if (uid) {\n        const entries = Object.entries(entry) as Entries<typeof entry>\n        entries.forEach(([path, value]) => {\n          securitySchemeMutators.edit(uid, path, value)\n        })\n      }\n    })\n\n    /** Restore the selected security scheme uids */\n    const selectedSchemeUids: (string | string[])[] = JSON.parse(\n      safeLocalStorage().getItem(CLIENT_LS_KEYS.SELECTED_SECURITY_SCHEMES) ?? '[]',\n    )\n\n    // Convert back to uids\n    const uids = selectedSchemeUids\n      .map((nameKeys) => {\n        if (Array.isArray(nameKeys)) {\n          return nameKeys.map((key) => dict[key]).filter(isDefined)\n        }\n        return dict[nameKeys]\n      })\n      .filter(isDefined)\n\n    collectionMutators.edit(collectionUid as Collection['uid'], 'selectedSecuritySchemeUids', uids)\n  } catch (e) {\n    // Nothing to restore\n    console.error(e)\n  }\n}\n"],"mappings":";;;;;;;;;AAeA,IAAa,+BAA+B,OAAuB,kBAA0B;AAC3F,KAAI;EACF,MAAM,EAAE,oBAAoB,iBAAiB,2BAA2B;EACxE,MAAM,OAAmC,KAAK,MAAM,kBAAkB,CAAC,QAAQ,eAAe,KAAK,IAAI,KAAK;;EAG5G,MAAM,OAAO,OAAO,KAAK,gBAAgB,CAAC,QACvC,KAAK,QAAQ;GACZ,MAAM,SAAS,gBAAgB;AAC/B,OAAI,OACF,KAAI,OAAO,WAAW,OAAO;AAE/B,UAAO;KAET,EAAE,CACH;;AAGD,SAAO,QAAQ,KAAK,CAAC,SAAS,CAAC,KAAK,WAAW;GAC7C,MAAM,MAAM,KAAK;AACjB,OAAI,IACc,QAAO,QAAQ,MAAM,CAC7B,SAAS,CAAC,MAAM,WAAW;AACjC,2BAAuB,KAAK,KAAK,MAAM,MAAM;KAC7C;IAEJ;EAQF,MAAM,OAL4C,KAAK,MACrD,kBAAkB,CAAC,QAAQ,eAAe,0BAA0B,IAAI,KACzE,CAIE,KAAK,aAAa;AACjB,OAAI,MAAM,QAAQ,SAAS,CACzB,QAAO,SAAS,KAAK,QAAQ,KAAK,KAAK,CAAC,OAAO,UAAU;AAE3D,UAAO,KAAK;IACZ,CACD,OAAO,UAAU;AAEpB,qBAAmB,KAAK,eAAoC,8BAA8B,KAAK;UACxF,GAAG;AAEV,UAAQ,MAAM,EAAE"}

package/dist/views/Request/RequestSection/RequestAuth/index.d.ts

@@ -1,4 +0,0 @@
-export { restoreAuthFromLocalStorage } from './helpers/restore-auth-from-local-storage.js';
-export { default as RequestAuth } from './RequestAuth.vue.js';
-export { default as RequestAuthDataTable } from './RequestAuthDataTable.vue.js';
-//# sourceMappingURL=index.d.ts.map

package/dist/views/Request/RequestSection/RequestAuth/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/views/Request/RequestSection/RequestAuth/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,2BAA2B,EAAE,MAAM,2CAA2C,CAAA;AACvF,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAC1D,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,4BAA4B,CAAA"}

package/dist/views/Request/RequestSection/RequestAuth/index.js

@@ -1,4 +0,0 @@
-import { restoreAuthFromLocalStorage } from "./helpers/restore-auth-from-local-storage.js";
-import RequestAuthDataTable_default from "./RequestAuthDataTable.vue.js";
-import RequestAuth_default from "./RequestAuth.vue.js";
-export { RequestAuth_default as RequestAuth, RequestAuthDataTable_default as RequestAuthDataTable, restoreAuthFromLocalStorage };

package/dist/views/Request/RequestSection/RequestBody.vue.d.ts

@@ -1,16 +0,0 @@
-import type { Environment } from '@scalar/oas-utils/entities/environment';
-import { type Operation, type RequestExample } from '@scalar/oas-utils/entities/spec';
-import type { Workspace } from '@scalar/oas-utils/entities/workspace';
-import type { EnvVariable } from '../../../store/active-entities.js';
-type __VLS_Props = {
-    example: RequestExample;
-    operation: Operation;
-    environment: Environment;
-    envVariables: EnvVariable[];
-    workspace: Workspace;
-    title: string;
-};
-declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: typeof __VLS_export;
-export default _default;
-//# sourceMappingURL=RequestBody.vue.d.ts.map

package/dist/views/Request/RequestSection/RequestBody.vue.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"RequestBody.vue.d.ts","sourceRoot":"","sources":["../../../../src/views/Request/RequestSection/RequestBody.vue"],"names":[],"mappings":"AA+oBA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAA;AACzE,OAAO,EAEL,KAAK,SAAS,EACd,KAAK,cAAc,EACpB,MAAM,iCAAiC,CAAA;AACxC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sCAAsC,CAAA;AAarE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAA;AAI1D,KAAK,WAAW,GAAG;IACf,OAAO,EAAE,cAAc,CAAA;IACvB,SAAS,EAAE,SAAS,CAAA;IACpB,WAAW,EAAE,WAAW,CAAA;IACxB,YAAY,EAAE,WAAW,EAAE,CAAA;IAC3B,SAAS,EAAE,SAAS,CAAA;IACpB,KAAK,EAAE,MAAM,CAAA;CACd,CAAC;AA4+BJ,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/views/Request/RequestSection/RequestBody.vue.js

@@ -1,9 +0,0 @@
-import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.js";
-import RequestBody_vue_vue_type_script_setup_true_lang_default from "./RequestBody.vue.script.js";
-/* empty css                          */
-//#region src/views/Request/RequestSection/RequestBody.vue
-var RequestBody_default = /* @__PURE__ */ _plugin_vue_export_helper_default(RequestBody_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-9aa4b63a"]]);
-//#endregion
-export { RequestBody_default as default };
-
-//# sourceMappingURL=RequestBody.vue.js.map

package/dist/views/Request/RequestSection/RequestBody.vue.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"RequestBody.vue.js","names":[],"sources":["../../../../src/views/Request/RequestSection/RequestBody.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton, ScalarIcon, ScalarListbox } from '@scalar/components'\nimport type { Environment } from '@scalar/oas-utils/entities/environment'\nimport {\n  requestExampleParametersSchema,\n  type Operation,\n  type RequestExample,\n} from '@scalar/oas-utils/entities/spec'\nimport type { Workspace } from '@scalar/oas-utils/entities/workspace'\nimport { canMethodHaveBody } from '@scalar/oas-utils/helpers'\nimport type { CodeMirrorLanguage } from '@scalar/use-codemirror'\nimport type { Entries } from 'type-fest'\nimport { computed, nextTick, ref, watch } from 'vue'\n\nimport CodeInput from '@/components/CodeInput/CodeInput.vue'\nimport DataTable from '@/components/DataTable/DataTable.vue'\nimport DataTableHeader from '@/components/DataTable/DataTableHeader.vue'\nimport DataTableRow from '@/components/DataTable/DataTableRow.vue'\nimport ViewLayoutCollapse from '@/components/ViewLayout/ViewLayoutCollapse.vue'\nimport { useFileDialog } from '@/hooks'\nimport { useWorkspace } from '@/store'\nimport type { EnvVariable } from '@/store/active-entities'\n\nimport RequestTable from './RequestTable.vue'\n\nconst { example, operation, environment, envVariables, workspace, title } =\n  defineProps<{\n    example: RequestExample\n    operation: Operation\n    environment: Environment\n    envVariables: EnvVariable[]\n    workspace: Workspace\n    title: string\n  }>()\n\nconst { requestExampleMutators } = useWorkspace()\n\n/** use-codemirror package to be updated accordingly */\nconst contentTypeToLanguageMap = {\n  json: 'json',\n  xml: 'xml',\n  yaml: 'yaml',\n  edn: 'edn',\n  other: 'html',\n} as const\n\nconst contentTypes = {\n  multipartForm: 'Multipart Form',\n  formUrlEncoded: 'Form URL Encoded',\n  binaryFile: 'Binary File',\n  json: 'JSON',\n  xml: 'XML',\n  yaml: 'YAML',\n  edn: 'EDN',\n  other: 'Other',\n  none: 'None',\n} as const\ntype ContentType = keyof typeof contentTypes\n\n/** Convert content types to options for the dropdown */\nconst contentTypeOptions = (\n  Object.entries(contentTypes) as Entries<typeof contentTypes>\n).map(([id, label]) => ({\n  id,\n  label,\n}))\n\n/** Match the activeBody to the contentTypeOptions */\nconst activeExampleContentType = computed(() => {\n  const { activeBody, formData, raw } = example.body\n\n  // Form\n  if (activeBody === 'formData') {\n    return formData?.encoding === 'urlencoded'\n      ? 'formUrlEncoded'\n      : 'multipartForm'\n  }\n  // Binary\n  if (activeBody === 'binary') {\n    return 'binaryFile'\n  }\n  // Raw\n  if (activeBody === 'raw' && raw?.encoding) {\n    if (raw.encoding === 'html' || raw.encoding === 'text') {\n      return 'other'\n    }\n    return raw.encoding\n  }\n\n  // Set content type from request if present\n  const contentType = Object.keys(operation.requestBody?.content || {})[0]\n\n  return contentType || 'none'\n})\n/** Selected ref from options above */\nconst selectedContentType = computed({\n  get: () =>\n    contentTypeOptions.find(\n      (opt) => opt.id === activeExampleContentType.value,\n    ) ??\n    contentTypeOptions[contentTypeOptions.length - 1] ??\n    contentTypeOptions[0],\n  set: (opt) => {\n    if (opt?.id) {\n      updateActiveBody(opt.id)\n    }\n  },\n})\nconst tableWrapperRef = ref<HTMLInputElement | null>(null)\n\nconst codeInputLanguage = computed(() => {\n  const type = selectedContentType.value\n    ?.id as keyof typeof contentTypeToLanguageMap\n  return contentTypeToLanguageMap[type] ?? 'plaintext'\n})\n\nconst deleteRow = (rowIdx: number) => {\n  const currentParams = formParams.value\n  if (currentParams.length > rowIdx) {\n    const updatedParams = [...currentParams]\n    updatedParams.splice(rowIdx, 1)\n\n    requestExampleMutators.edit(\n      example.uid,\n      'body.formData.value',\n      updatedParams,\n    )\n  }\n}\n\n/** Update a field in a parameter row */\nconst updateRow = (rowIdx: number, field: 'key' | 'value', value: string) => {\n  const currentParams = formParams.value\n\n  if (currentParams.length > rowIdx) {\n    const updatedParams = [...currentParams]\n    updatedParams[rowIdx] = {\n      ...updatedParams[rowIdx],\n      value: updatedParams[rowIdx]?.value || '',\n      key: updatedParams[rowIdx]?.key || '',\n      enabled: updatedParams[rowIdx]?.enabled ?? false,\n      [field]: value || '',\n    }\n\n    /** enable row key or value is filled */\n    if (\n      updatedParams[rowIdx]?.key !== '' ||\n      updatedParams[rowIdx]?.value !== ''\n    ) {\n      updatedParams[rowIdx].enabled = true\n    }\n\n    /** check key and value input state */\n    if (\n      updatedParams[rowIdx]?.key === '' &&\n      updatedParams[rowIdx]?.value === ''\n    ) {\n      /** remove if empty */\n      updatedParams.splice(rowIdx, 1)\n    }\n\n    requestExampleMutators.edit(\n      example.uid,\n      'body.formData.value',\n      updatedParams,\n    )\n  } else {\n    /** if there is no row at the index, add a new one */\n    const payload = [requestExampleParametersSchema.parse({ [field]: value })]\n\n    requestExampleMutators.edit(example.uid, 'body.formData.value', payload)\n\n    /** focus the new row */\n    nextTick(() => {\n      if (!tableWrapperRef.value) {\n        return\n      }\n      const inputs = tableWrapperRef.value.querySelectorAll('input')\n      const inputsIndex = field === 'key' ? 0 : 1\n      inputs[inputsIndex]?.focus()\n    })\n  }\n\n  // Add a new row if the updated row is the last one\n  if (rowIdx === currentParams.length - 1) {\n    addRow()\n  }\n}\n\nconst formParams = computed(() => example.body.formData?.value ?? [])\n\n/** ensure one empty row by default */\nconst defaultRow = () => {\n  const lastParam = formParams.value[formParams.value.length - 1]\n  if (!lastParam || lastParam.key !== '' || lastParam.value !== '') {\n    addRow()\n  }\n}\n\n/** Add a new row to a given parameter list */\nconst addRow = () => {\n  /** Create a new parameter instance with 'enabled' set to false */\n  const newParam = requestExampleParametersSchema.parse({\n    enabled: false,\n  })\n  const newParams = [...formParams.value, newParam]\n\n  // Ensure we have formData\n  if (example.body.formData) {\n    requestExampleMutators.edit(example.uid, 'body.formData.value', newParams)\n  } else {\n    requestExampleMutators.edit(example.uid, 'body.formData', {\n      value: newParams,\n      encoding: 'form-data',\n    })\n  }\n}\n\n/** Enable and disables the row */\nconst toggleRow = (rowIdx: number, enabled: boolean) => {\n  const currentParams = formParams.value\n  if (currentParams.length > rowIdx) {\n    const updatedParams = [...currentParams]\n    if (updatedParams[rowIdx]) {\n      updatedParams[rowIdx].enabled = enabled\n    }\n\n    requestExampleMutators.edit(\n      example.uid,\n      'body.formData.value',\n      updatedParams,\n    )\n  }\n}\n\nconst updateRequestBody = (value: string) =>\n  requestExampleMutators.edit(example.uid, 'body.raw.value', value)\n\n/** Take the select option and return bodyType with encoding and header */\nconst getBodyType = (type: ContentType) => {\n  if (type === 'multipartForm') {\n    return {\n      activeBody: 'formData',\n      encoding: 'form-data',\n      header: 'multipart/form-data',\n    } as const\n  }\n  if (type === 'formUrlEncoded') {\n    return {\n      activeBody: 'formData',\n      encoding: 'urlencoded',\n      header: 'application/x-www-form-urlencoded',\n    } as const\n  }\n  if (type === 'binaryFile') {\n    return {\n      activeBody: 'binary',\n      encoding: undefined,\n      header: 'application/octet-stream',\n    } as const\n  }\n  if (type === 'json') {\n    const contentTypes = Object.keys(operation.requestBody?.content ?? {})\n\n    // Gets json content types including vendor specific ones\n    const jsonContentType =\n      contentTypes.find((t) => t.includes('json') || t.endsWith('+json')) ||\n      'application/json'\n\n    return {\n      activeBody: 'raw',\n      encoding: 'json',\n      header: jsonContentType,\n    } as const\n  }\n  if (type === 'xml') {\n    return {\n      activeBody: 'raw',\n      encoding: 'xml',\n      header: 'application/xml',\n    } as const\n  }\n  if (type === 'yaml') {\n    return {\n      activeBody: 'raw',\n      encoding: 'yaml',\n      header: 'application/yaml',\n    } as const\n  }\n  if (type === 'edn') {\n    return {\n      activeBody: 'raw',\n      encoding: 'edn',\n      header: 'application/edn',\n    } as const\n  }\n  if (type === 'other') {\n    const opContentTypes = Object.keys(operation.requestBody?.content ?? {})\n    const textContentType = opContentTypes.find((t) => t.startsWith('text/'))\n\n    return {\n      activeBody: 'raw',\n      encoding: textContentType ? 'text' : 'html',\n      header: textContentType ?? 'application/html',\n    } as const\n  }\n\n  return { activeBody: 'raw', encoding: undefined, header: undefined } as const\n}\n\n/** Set active body AND encoding */\nconst updateActiveBody = (type: ContentType) => {\n  const { activeBody, encoding, header } = getBodyType(type)\n  requestExampleMutators.edit(example.uid, 'body.activeBody', activeBody)\n\n  // Set encoding safely\n  if (encoding && activeBody === 'raw') {\n    requestExampleMutators.edit(example.uid, 'body.raw', {\n      encoding,\n      value: example.body.raw?.value ?? '',\n    })\n  } else if (encoding && activeBody === 'formData') {\n    requestExampleMutators.edit(example.uid, 'body.formData', {\n      encoding,\n      value: example.body.formData?.value ?? [],\n    })\n  }\n  // Remove raw if no encoding and not binary\n  else if (!encoding && activeBody !== 'binary') {\n    const { raw: deleteMe, ...body } = example.body\n    requestExampleMutators.edit(example.uid, 'body', body)\n  }\n\n  // Handle headers\n  const headers = [...example.parameters.headers]\n  const contentTypeIdx = headers.findIndex(\n    (h) => h.key.toLowerCase() === 'content-type',\n  )\n\n  if (contentTypeIdx >= 0) {\n    // Update header if exists\n    if (header && headers[contentTypeIdx]) {\n      headers[contentTypeIdx].value = header\n    }\n    // Remove header if we don't want one\n    else if (\n      headers[contentTypeIdx] &&\n      (activeBody !== 'raw' || type === 'none')\n    ) {\n      headers.splice(contentTypeIdx, 1)\n    }\n  }\n  // Add header if doesn't have one\n  else if (header) {\n    const lastHeader = headers[headers.length - 1]\n    // Add header before last if empty to prevent empty row duplication\n    if (lastHeader && lastHeader.key === '' && lastHeader.value === '') {\n      headers.splice(headers.length - 1, 0, {\n        key: 'Content-Type',\n        value: header,\n        enabled: true,\n      })\n    } else {\n      headers.push({\n        key: 'Content-Type',\n        value: header,\n        enabled: true,\n      })\n    }\n  }\n\n  requestExampleMutators.edit(example.uid, 'parameters.headers', headers)\n}\n\nconst handleFileUploadFormData = (rowIdx: number) => {\n  const { open } = useFileDialog({\n    onChange: (files) => {\n      const file = files?.[0]\n      if (file) {\n        const currentParams = formParams.value\n        const updatedParams = [...currentParams]\n        updatedParams[rowIdx] = {\n          ...updatedParams[rowIdx],\n          file,\n          value: updatedParams[rowIdx]?.value || file.name,\n          key: updatedParams[rowIdx]?.key || file.name,\n          enabled: true,\n        }\n        requestExampleMutators.edit(\n          example.uid,\n          'body.formData.value',\n          updatedParams,\n        )\n\n        defaultRow()\n      }\n    },\n    multiple: false,\n    accept: '*/*',\n  })\n  open()\n}\n\nconst removeBinaryFile = () =>\n  requestExampleMutators.edit(example.uid, 'body.binary', undefined)\n\nfunction handleRemoveFileFormData(rowIdx: number) {\n  const currentParams = formParams.value\n  const updatedParams = [...currentParams]\n  const param = currentParams[rowIdx]\n  const file = param?.file as File | undefined\n\n  // Empty key value or non updated file name then remove the row\n  if (\n    currentParams.length > 1 &&\n    ((!param?.key && !param?.value) ||\n      (file && param?.key === file.name && param?.value === file.name))\n  ) {\n    updatedParams.splice(rowIdx, 1)\n  } else {\n    // File name updated then remove file only\n    if (updatedParams[rowIdx]) {\n      updatedParams[rowIdx].file = undefined\n    }\n  }\n  requestExampleMutators.edit(example.uid, 'body.formData.value', updatedParams)\n}\n\nfunction handleFileUpload() {\n  const { open } = useFileDialog({\n    onChange: (files) => {\n      const file = files?.[0]\n      if (file) {\n        requestExampleMutators.edit(example.uid, 'body.binary', file)\n      }\n    },\n    multiple: false,\n    accept: '*/*',\n  })\n  open()\n}\n\n// we always add an empty row if its empty :)\nwatch(\n  selectedContentType,\n  (val) => {\n    if (['multipartForm', 'formUrlEncoded'].includes(val?.id || '')) {\n      defaultRow()\n    }\n  },\n  { immediate: true },\n)\n\nwatch(\n  () => example.uid,\n  () => {\n    operation.method &&\n      canMethodHaveBody(operation.method) &&\n      updateActiveBody(activeExampleContentType.value as ContentType)\n\n    // Add extra row on page route change as well\n    if (\n      ['multipartForm', 'formUrlEncoded'].includes(\n        activeExampleContentType.value as ContentType,\n      )\n    ) {\n      defaultRow()\n    }\n  },\n  { immediate: true },\n)\n\nconst exampleOptions = computed(() => {\n  const contentType = selectedContentType.value?.id\n  const { header } = getBodyType(contentType as ContentType)\n  const content = operation.requestBody?.content || {}\n  const examples = header ? content[header]?.examples || {} : {}\n  return Object.entries(examples).map(([key, value]) => ({\n    id: key,\n    label: key,\n    value,\n  }))\n})\n\nconst selectedExample = computed({\n  get: () => {\n    const rawValue = example.body.raw?.value ?? '{}'\n    try {\n      const parsedValue = JSON.parse(rawValue)\n      const getExample = exampleOptions.value.find((e) => {\n        const exampleValue = e.value as {\n          value: Record<string, string>\n        }\n        return (\n          JSON.stringify(exampleValue.value) === JSON.stringify(parsedValue)\n        )\n      })\n      return getExample ?? exampleOptions.value[0]\n    } catch {\n      return exampleOptions.value[0]\n    }\n  },\n  set: (opt) => {\n    if (opt?.id) {\n      const exampleOption = exampleOptions.value.find((e) => e.id === opt.id)\n      if (exampleOption) {\n        const exampleValue = exampleOption.value as {\n          value: Record<string, string>\n        }\n        updateRequestBody(JSON.stringify(exampleValue.value, null, 2))\n      }\n    }\n  },\n})\n</script>\n<template>\n  <ViewLayoutCollapse>\n    <template #title>{{ title }}</template>\n    <DataTable\n      :columns=\"['']\"\n      presentational>\n      <DataTableRow>\n        <DataTableHeader\n          class=\"relative col-span-full flex h-8 cursor-pointer items-center justify-between !p-0\">\n          <ScalarListbox\n            v-model=\"selectedContentType\"\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              variant=\"ghost\">\n              <span>{{ selectedContentType?.label }}</span>\n              <ScalarIcon\n                icon=\"ChevronDown\"\n                size=\"md\" />\n            </ScalarButton>\n          </ScalarListbox>\n          <ScalarListbox\n            v-if=\"exampleOptions.length > 0\"\n            v-model=\"selectedExample\"\n            :options=\"exampleOptions\"\n            side=\"left\"\n            teleport>\n            <ScalarButton\n              class=\"text-c-2 hover:text-c-1 flex h-full w-fit gap-1.5 px-2 font-normal\"\n              fullWidth\n              variant=\"ghost\">\n              <span>{{ selectedExample?.label }}</span>\n              <ScalarIcon\n                icon=\"ChevronDown\"\n                size=\"md\" />\n            </ScalarButton>\n          </ScalarListbox>\n        </DataTableHeader>\n      </DataTableRow>\n      <DataTableRow>\n        <template v-if=\"selectedContentType?.id === '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        <template v-else-if=\"selectedContentType?.id === 'binaryFile'\">\n          <div\n            class=\"flex items-center justify-center overflow-hidden border-t p-1.5\">\n            <template v-if=\"example.body.binary\">\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                {{ (example.body.binary as File).name }}\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=\"removeBinaryFile\">\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=\"handleFileUpload\">\n                <span>Upload 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        <template v-else-if=\"selectedContentType?.id == 'multipartForm'\">\n          <RequestTable\n            ref=\"tableWrapperRef\"\n            class=\"!m-0 rounded-t-none border-t-0 border-r-0 border-b-0 border-l-0 shadow-none\"\n            :columns=\"['32px', '', '', '104px']\"\n            :envVariables=\"envVariables\"\n            :environment=\"environment\"\n            :items=\"formParams\"\n            showUploadButton\n            :workspace=\"workspace\"\n            @deleteRow=\"deleteRow\"\n            @removeFile=\"handleRemoveFileFormData\"\n            @toggleRow=\"toggleRow\"\n            @updateRow=\"updateRow\"\n            @uploadFile=\"handleFileUploadFormData\" />\n        </template>\n        <template v-else-if=\"selectedContentType?.id == 'formUrlEncoded'\">\n          <RequestTable\n            ref=\"tableWrapperRef\"\n            class=\"!m-0 rounded-t-none border-t-0 border-r-0 border-b-0 border-l-0 shadow-none\"\n            :columns=\"['32px', '', '', '104px']\"\n            :envVariables=\"envVariables\"\n            :environment=\"environment\"\n            :items=\"formParams\"\n            showUploadButton\n            :workspace=\"workspace\"\n            @deleteRow=\"deleteRow\"\n            @removeFile=\"handleRemoveFileFormData\"\n            @toggleRow=\"toggleRow\"\n            @updateRow=\"updateRow\"\n            @uploadFile=\"handleFileUploadFormData\" />\n        </template>\n        <template v-else>\n          <!-- TODO: remove this as type hack when we add syntax highlighting -->\n          <CodeInput\n            class=\"border-t px-3\"\n            content=\"\"\n            :envVariables=\"envVariables\"\n            :environment=\"environment\"\n            :language=\"codeInputLanguage as CodeMirrorLanguage\"\n            lineNumbers\n            lint\n            :modelValue=\"example.body?.raw?.value ?? ''\"\n            :workspace=\"workspace\"\n            @update:modelValue=\"updateRequestBody\" />\n        </template>\n      </DataTableRow>\n      <!-- Hacky... but effective, extra table row to trick the last group -->\n      <DataTableRow />\n    </DataTable>\n  </ViewLayoutCollapse>\n</template>\n<style scoped>\n:deep(.cm-content) {\n  font-size: var(--scalar-small);\n}\n</style>\n"],"mappings":""}

package/dist/views/Request/RequestSection/RequestBody.vue.script.js

@@ -1,477 +0,0 @@
-import { useWorkspace } from "../../../store/store.js";
-import { useFileDialog } from "../../../hooks/useFileDialog.js";
-import CodeInput_default from "../../../components/CodeInput/CodeInput.vue.js";
-import DataTable_default from "../../../components/DataTable/DataTable.vue.js";
-import DataTableHeader_default from "../../../components/DataTable/DataTableHeader.vue.js";
-import DataTableRow_default from "../../../components/DataTable/DataTableRow.vue.js";
-import ViewLayoutCollapse_default from "../../../components/ViewLayout/ViewLayoutCollapse.vue.js";
-import RequestTable_default from "./RequestTable.vue.js";
-import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, nextTick, openBlock, ref, toDisplayString, unref, watch, withCtx } from "vue";
-import { ScalarButton, ScalarIcon, ScalarListbox } from "@scalar/components";
-import { canMethodHaveBody } from "@scalar/oas-utils/helpers";
-import { requestExampleParametersSchema } from "@scalar/oas-utils/entities/spec";
-//#region src/views/Request/RequestSection/RequestBody.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = {
-	key: 0,
-	class: "text-c-3 flex min-h-10 w-full items-center justify-center border-t p-2 text-sm"
-};
-var _hoisted_2 = {
-	key: 1,
-	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" };
-/** Convert content types to options for the dropdown */
-var RequestBody_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
-	__name: "RequestBody",
-	props: {
-		example: {},
-		operation: {},
-		environment: {},
-		envVariables: {},
-		workspace: {},
-		title: {}
-	},
-	setup(__props) {
-		const { requestExampleMutators } = useWorkspace();
-		/** use-codemirror package to be updated accordingly */
-		const contentTypeToLanguageMap = {
-			json: "json",
-			xml: "xml",
-			yaml: "yaml",
-			edn: "edn",
-			other: "html"
-		};
-		const contentTypeOptions = Object.entries({
-			multipartForm: "Multipart Form",
-			formUrlEncoded: "Form URL Encoded",
-			binaryFile: "Binary File",
-			json: "JSON",
-			xml: "XML",
-			yaml: "YAML",
-			edn: "EDN",
-			other: "Other",
-			none: "None"
-		}).map(([id, label]) => ({
-			id,
-			label
-		}));
-		/** Match the activeBody to the contentTypeOptions */
-		const activeExampleContentType = computed(() => {
-			const { activeBody, formData, raw } = __props.example.body;
-			if (activeBody === "formData") return formData?.encoding === "urlencoded" ? "formUrlEncoded" : "multipartForm";
-			if (activeBody === "binary") return "binaryFile";
-			if (activeBody === "raw" && raw?.encoding) {
-				if (raw.encoding === "html" || raw.encoding === "text") return "other";
-				return raw.encoding;
-			}
-			return Object.keys(__props.operation.requestBody?.content || {})[0] || "none";
-		});
-		/** Selected ref from options above */
-		const selectedContentType = computed({
-			get: () => contentTypeOptions.find((opt) => opt.id === activeExampleContentType.value) ?? contentTypeOptions[contentTypeOptions.length - 1] ?? contentTypeOptions[0],
-			set: (opt) => {
-				if (opt?.id) updateActiveBody(opt.id);
-			}
-		});
-		const tableWrapperRef = ref(null);
-		const codeInputLanguage = computed(() => {
-			return contentTypeToLanguageMap[selectedContentType.value?.id] ?? "plaintext";
-		});
-		const deleteRow = (rowIdx) => {
-			const currentParams = formParams.value;
-			if (currentParams.length > rowIdx) {
-				const updatedParams = [...currentParams];
-				updatedParams.splice(rowIdx, 1);
-				requestExampleMutators.edit(__props.example.uid, "body.formData.value", updatedParams);
-			}
-		};
-		/** Update a field in a parameter row */
-		const updateRow = (rowIdx, field, value) => {
-			const currentParams = formParams.value;
-			if (currentParams.length > rowIdx) {
-				const updatedParams = [...currentParams];
-				updatedParams[rowIdx] = {
-					...updatedParams[rowIdx],
-					value: updatedParams[rowIdx]?.value || "",
-					key: updatedParams[rowIdx]?.key || "",
-					enabled: updatedParams[rowIdx]?.enabled ?? false,
-					[field]: value || ""
-				};
-				/** enable row key or value is filled */
-				if (updatedParams[rowIdx]?.key !== "" || updatedParams[rowIdx]?.value !== "") updatedParams[rowIdx].enabled = true;
-				/** check key and value input state */
-				if (updatedParams[rowIdx]?.key === "" && updatedParams[rowIdx]?.value === "")
- /** remove if empty */
-				updatedParams.splice(rowIdx, 1);
-				requestExampleMutators.edit(__props.example.uid, "body.formData.value", updatedParams);
-			} else {
-				/** if there is no row at the index, add a new one */
-				const payload = [requestExampleParametersSchema.parse({ [field]: value })];
-				requestExampleMutators.edit(__props.example.uid, "body.formData.value", payload);
-				/** focus the new row */
-				nextTick(() => {
-					if (!tableWrapperRef.value) return;
-					tableWrapperRef.value.querySelectorAll("input")[field === "key" ? 0 : 1]?.focus();
-				});
-			}
-			if (rowIdx === currentParams.length - 1) addRow();
-		};
-		const formParams = computed(() => __props.example.body.formData?.value ?? []);
-		/** ensure one empty row by default */
-		const defaultRow = () => {
-			const lastParam = formParams.value[formParams.value.length - 1];
-			if (!lastParam || lastParam.key !== "" || lastParam.value !== "") addRow();
-		};
-		/** Add a new row to a given parameter list */
-		const addRow = () => {
-			/** Create a new parameter instance with 'enabled' set to false */
-			const newParam = requestExampleParametersSchema.parse({ enabled: false });
-			const newParams = [...formParams.value, newParam];
-			if (__props.example.body.formData) requestExampleMutators.edit(__props.example.uid, "body.formData.value", newParams);
-			else requestExampleMutators.edit(__props.example.uid, "body.formData", {
-				value: newParams,
-				encoding: "form-data"
-			});
-		};
-		/** Enable and disables the row */
-		const toggleRow = (rowIdx, enabled) => {
-			const currentParams = formParams.value;
-			if (currentParams.length > rowIdx) {
-				const updatedParams = [...currentParams];
-				if (updatedParams[rowIdx]) updatedParams[rowIdx].enabled = enabled;
-				requestExampleMutators.edit(__props.example.uid, "body.formData.value", updatedParams);
-			}
-		};
-		const updateRequestBody = (value) => requestExampleMutators.edit(__props.example.uid, "body.raw.value", value);
-		/** Take the select option and return bodyType with encoding and header */
-		const getBodyType = (type) => {
-			if (type === "multipartForm") return {
-				activeBody: "formData",
-				encoding: "form-data",
-				header: "multipart/form-data"
-			};
-			if (type === "formUrlEncoded") return {
-				activeBody: "formData",
-				encoding: "urlencoded",
-				header: "application/x-www-form-urlencoded"
-			};
-			if (type === "binaryFile") return {
-				activeBody: "binary",
-				encoding: void 0,
-				header: "application/octet-stream"
-			};
-			if (type === "json") return {
-				activeBody: "raw",
-				encoding: "json",
-				header: Object.keys(__props.operation.requestBody?.content ?? {}).find((t) => t.includes("json") || t.endsWith("+json")) || "application/json"
-			};
-			if (type === "xml") return {
-				activeBody: "raw",
-				encoding: "xml",
-				header: "application/xml"
-			};
-			if (type === "yaml") return {
-				activeBody: "raw",
-				encoding: "yaml",
-				header: "application/yaml"
-			};
-			if (type === "edn") return {
-				activeBody: "raw",
-				encoding: "edn",
-				header: "application/edn"
-			};
-			if (type === "other") {
-				const textContentType = Object.keys(__props.operation.requestBody?.content ?? {}).find((t) => t.startsWith("text/"));
-				return {
-					activeBody: "raw",
-					encoding: textContentType ? "text" : "html",
-					header: textContentType ?? "application/html"
-				};
-			}
-			return {
-				activeBody: "raw",
-				encoding: void 0,
-				header: void 0
-			};
-		};
-		/** Set active body AND encoding */
-		const updateActiveBody = (type) => {
-			const { activeBody, encoding, header } = getBodyType(type);
-			requestExampleMutators.edit(__props.example.uid, "body.activeBody", activeBody);
-			if (encoding && activeBody === "raw") requestExampleMutators.edit(__props.example.uid, "body.raw", {
-				encoding,
-				value: __props.example.body.raw?.value ?? ""
-			});
-			else if (encoding && activeBody === "formData") requestExampleMutators.edit(__props.example.uid, "body.formData", {
-				encoding,
-				value: __props.example.body.formData?.value ?? []
-			});
-			else if (!encoding && activeBody !== "binary") {
-				const { raw: deleteMe, ...body } = __props.example.body;
-				requestExampleMutators.edit(__props.example.uid, "body", body);
-			}
-			const headers = [...__props.example.parameters.headers];
-			const contentTypeIdx = headers.findIndex((h) => h.key.toLowerCase() === "content-type");
-			if (contentTypeIdx >= 0) {
-				if (header && headers[contentTypeIdx]) headers[contentTypeIdx].value = header;
-				else if (headers[contentTypeIdx] && (activeBody !== "raw" || type === "none")) headers.splice(contentTypeIdx, 1);
-			} else if (header) {
-				const lastHeader = headers[headers.length - 1];
-				if (lastHeader && lastHeader.key === "" && lastHeader.value === "") headers.splice(headers.length - 1, 0, {
-					key: "Content-Type",
-					value: header,
-					enabled: true
-				});
-				else headers.push({
-					key: "Content-Type",
-					value: header,
-					enabled: true
-				});
-			}
-			requestExampleMutators.edit(__props.example.uid, "parameters.headers", headers);
-		};
-		const handleFileUploadFormData = (rowIdx) => {
-			const { open } = useFileDialog({
-				onChange: (files) => {
-					const file = files?.[0];
-					if (file) {
-						const updatedParams = [...formParams.value];
-						updatedParams[rowIdx] = {
-							...updatedParams[rowIdx],
-							file,
-							value: updatedParams[rowIdx]?.value || file.name,
-							key: updatedParams[rowIdx]?.key || file.name,
-							enabled: true
-						};
-						requestExampleMutators.edit(__props.example.uid, "body.formData.value", updatedParams);
-						defaultRow();
-					}
-				},
-				multiple: false,
-				accept: "*/*"
-			});
-			open();
-		};
-		const removeBinaryFile = () => requestExampleMutators.edit(__props.example.uid, "body.binary", void 0);
-		function handleRemoveFileFormData(rowIdx) {
-			const currentParams = formParams.value;
-			const updatedParams = [...currentParams];
-			const param = currentParams[rowIdx];
-			const file = param?.file;
-			if (currentParams.length > 1 && (!param?.key && !param?.value || file && param?.key === file.name && param?.value === file.name)) updatedParams.splice(rowIdx, 1);
-			else if (updatedParams[rowIdx]) updatedParams[rowIdx].file = void 0;
-			requestExampleMutators.edit(__props.example.uid, "body.formData.value", updatedParams);
-		}
-		function handleFileUpload() {
-			const { open } = useFileDialog({
-				onChange: (files) => {
-					const file = files?.[0];
-					if (file) requestExampleMutators.edit(__props.example.uid, "body.binary", file);
-				},
-				multiple: false,
-				accept: "*/*"
-			});
-			open();
-		}
-		watch(selectedContentType, (val) => {
-			if (["multipartForm", "formUrlEncoded"].includes(val?.id || "")) defaultRow();
-		}, { immediate: true });
-		watch(() => __props.example.uid, () => {
-			__props.operation.method && canMethodHaveBody(__props.operation.method) && updateActiveBody(activeExampleContentType.value);
-			if (["multipartForm", "formUrlEncoded"].includes(activeExampleContentType.value)) defaultRow();
-		}, { immediate: true });
-		const exampleOptions = computed(() => {
-			const contentType = selectedContentType.value?.id;
-			const { header } = getBodyType(contentType);
-			const content = __props.operation.requestBody?.content || {};
-			const examples = header ? content[header]?.examples || {} : {};
-			return Object.entries(examples).map(([key, value]) => ({
-				id: key,
-				label: key,
-				value
-			}));
-		});
-		const selectedExample = computed({
-			get: () => {
-				const rawValue = __props.example.body.raw?.value ?? "{}";
-				try {
-					const parsedValue = JSON.parse(rawValue);
-					return exampleOptions.value.find((e) => {
-						const exampleValue = e.value;
-						return JSON.stringify(exampleValue.value) === JSON.stringify(parsedValue);
-					}) ?? exampleOptions.value[0];
-				} catch {
-					return exampleOptions.value[0];
-				}
-			},
-			set: (opt) => {
-				if (opt?.id) {
-					const exampleOption = exampleOptions.value.find((e) => e.id === opt.id);
-					if (exampleOption) {
-						const exampleValue = exampleOption.value;
-						updateRequestBody(JSON.stringify(exampleValue.value, null, 2));
-					}
-				}
-			}
-		});
-		return (_ctx, _cache) => {
-			return openBlock(), createBlock(ViewLayoutCollapse_default, null, {
-				title: withCtx(() => [createTextVNode(toDisplayString(__props.title), 1)]),
-				default: withCtx(() => [createVNode(DataTable_default, {
-					columns: [""],
-					presentational: ""
-				}, {
-					default: withCtx(() => [
-						createVNode(DataTableRow_default, null, {
-							default: withCtx(() => [createVNode(DataTableHeader_default, { class: "relative col-span-full flex h-8 cursor-pointer items-center justify-between !p-0" }, {
-								default: withCtx(() => [createVNode(unref(ScalarListbox), {
-									modelValue: selectedContentType.value,
-									"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => selectedContentType.value = $event),
-									options: unref(contentTypeOptions),
-									teleport: ""
-								}, {
-									default: withCtx(() => [createVNode(unref(ScalarButton), {
-										class: "text-c-2 hover:text-c-1 flex h-full w-fit gap-1.5 px-3 font-normal",
-										variant: "ghost"
-									}, {
-										default: withCtx(() => [createElementVNode("span", null, toDisplayString(selectedContentType.value?.label), 1), createVNode(unref(ScalarIcon), {
-											icon: "ChevronDown",
-											size: "md"
-										})]),
-										_: 1
-									})]),
-									_: 1
-								}, 8, ["modelValue", "options"]), exampleOptions.value.length > 0 ? (openBlock(), createBlock(unref(ScalarListbox), {
-									key: 0,
-									modelValue: selectedExample.value,
-									"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => selectedExample.value = $event),
-									options: exampleOptions.value,
-									side: "left",
-									teleport: ""
-								}, {
-									default: withCtx(() => [createVNode(unref(ScalarButton), {
-										class: "text-c-2 hover:text-c-1 flex h-full w-fit gap-1.5 px-2 font-normal",
-										fullWidth: "",
-										variant: "ghost"
-									}, {
-										default: withCtx(() => [createElementVNode("span", null, toDisplayString(selectedExample.value?.label), 1), createVNode(unref(ScalarIcon), {
-											icon: "ChevronDown",
-											size: "md"
-										})]),
-										_: 1
-									})]),
-									_: 1
-								}, 8, ["modelValue", "options"])) : createCommentVNode("", true)]),
-								_: 1
-							})]),
-							_: 1
-						}),
-						createVNode(DataTableRow_default, null, {
-							default: withCtx(() => [selectedContentType.value?.id === "none" ? (openBlock(), createElementBlock("div", _hoisted_1, [..._cache[2] || (_cache[2] = [createElementVNode("span", null, "No Body", -1)])])) : selectedContentType.value?.id === "binaryFile" ? (openBlock(), createElementBlock("div", _hoisted_2, [__props.example.body.binary ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createElementVNode("span", _hoisted_3, toDisplayString(__props.example.body.binary.name), 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: removeBinaryFile
-							}, {
-								default: withCtx(() => [..._cache[3] || (_cache[3] = [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: handleFileUpload
-							}, {
-								default: withCtx(() => [_cache[4] || (_cache[4] = createElementVNode("span", null, "Upload File", -1)), createVNode(unref(ScalarIcon), {
-									class: "ml-1",
-									icon: "Upload",
-									size: "xs",
-									thickness: "2.5"
-								})]),
-								_: 1
-							}))])) : selectedContentType.value?.id == "multipartForm" ? (openBlock(), createBlock(RequestTable_default, {
-								key: 2,
-								ref_key: "tableWrapperRef",
-								ref: tableWrapperRef,
-								class: "!m-0 rounded-t-none border-t-0 border-r-0 border-b-0 border-l-0 shadow-none",
-								columns: [
-									"32px",
-									"",
-									"",
-									"104px"
-								],
-								envVariables: __props.envVariables,
-								environment: __props.environment,
-								items: formParams.value,
-								showUploadButton: "",
-								workspace: __props.workspace,
-								onDeleteRow: deleteRow,
-								onRemoveFile: handleRemoveFileFormData,
-								onToggleRow: toggleRow,
-								onUpdateRow: updateRow,
-								onUploadFile: handleFileUploadFormData
-							}, null, 8, [
-								"envVariables",
-								"environment",
-								"items",
-								"workspace"
-							])) : selectedContentType.value?.id == "formUrlEncoded" ? (openBlock(), createBlock(RequestTable_default, {
-								key: 3,
-								ref_key: "tableWrapperRef",
-								ref: tableWrapperRef,
-								class: "!m-0 rounded-t-none border-t-0 border-r-0 border-b-0 border-l-0 shadow-none",
-								columns: [
-									"32px",
-									"",
-									"",
-									"104px"
-								],
-								envVariables: __props.envVariables,
-								environment: __props.environment,
-								items: formParams.value,
-								showUploadButton: "",
-								workspace: __props.workspace,
-								onDeleteRow: deleteRow,
-								onRemoveFile: handleRemoveFileFormData,
-								onToggleRow: toggleRow,
-								onUpdateRow: updateRow,
-								onUploadFile: handleFileUploadFormData
-							}, null, 8, [
-								"envVariables",
-								"environment",
-								"items",
-								"workspace"
-							])) : (openBlock(), createBlock(CodeInput_default, {
-								key: 4,
-								class: "border-t px-3",
-								content: "",
-								envVariables: __props.envVariables,
-								environment: __props.environment,
-								language: codeInputLanguage.value,
-								lineNumbers: "",
-								lint: "",
-								modelValue: __props.example.body?.raw?.value ?? "",
-								workspace: __props.workspace,
-								"onUpdate:modelValue": updateRequestBody
-							}, null, 8, [
-								"envVariables",
-								"environment",
-								"language",
-								"modelValue",
-								"workspace"
-							]))]),
-							_: 1
-						}),
-						createVNode(DataTableRow_default)
-					]),
-					_: 1
-				})]),
-				_: 1
-			});
-		};
-	}
-});
-//#endregion
-export { RequestBody_vue_vue_type_script_setup_true_lang_default as default };
-
-//# sourceMappingURL=RequestBody.vue.script.js.map