@scalar/api-client 3.21.0 → 3.21.2
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.
- package/CHANGELOG.md +59 -0
- package/dist/components/SectionFilter.vue.d.ts +0 -2
- package/dist/components/SectionFilter.vue.d.ts.map +1 -1
- package/dist/components/SectionFilter.vue.js +1 -1
- package/dist/components/SectionFilter.vue.js.map +1 -1
- package/dist/components/SectionFilter.vue.script.js +2 -8
- package/dist/components/SectionFilter.vue.script.js.map +1 -1
- package/dist/components/SectionFilterButton.vue.d.ts +0 -1
- package/dist/components/SectionFilterButton.vue.d.ts.map +1 -1
- package/dist/components/SectionFilterButton.vue.js.map +1 -1
- package/dist/components/SectionFilterButton.vue.script.js +2 -10
- package/dist/components/SectionFilterButton.vue.script.js.map +1 -1
- package/dist/style.css +156 -85
- package/dist/v2/blocks/operation-block/OperationBlock.vue.d.ts.map +1 -1
- package/dist/v2/blocks/operation-block/OperationBlock.vue.js.map +1 -1
- package/dist/v2/blocks/operation-block/OperationBlock.vue.script.js +4 -0
- package/dist/v2/blocks/operation-block/OperationBlock.vue.script.js.map +1 -1
- package/dist/v2/blocks/operation-block/components/Header.vue.d.ts.map +1 -1
- package/dist/v2/blocks/operation-block/components/Header.vue.js +1 -1
- package/dist/v2/blocks/operation-block/components/Header.vue.js.map +1 -1
- package/dist/v2/blocks/operation-block/components/Header.vue.script.js +2 -0
- package/dist/v2/blocks/operation-block/components/Header.vue.script.js.map +1 -1
- package/dist/v2/blocks/request-block/RequestBlock.vue.d.ts +2 -0
- package/dist/v2/blocks/request-block/RequestBlock.vue.d.ts.map +1 -1
- package/dist/v2/blocks/request-block/RequestBlock.vue.js +1 -1
- package/dist/v2/blocks/request-block/RequestBlock.vue.js.map +1 -1
- package/dist/v2/blocks/request-block/RequestBlock.vue.script.js +24 -6
- package/dist/v2/blocks/request-block/RequestBlock.vue.script.js.map +1 -1
- package/dist/v2/blocks/request-block/components/RequestBody.vue.d.ts +4 -0
- package/dist/v2/blocks/request-block/components/RequestBody.vue.d.ts.map +1 -1
- package/dist/v2/blocks/request-block/components/RequestBody.vue.js +1 -1
- package/dist/v2/blocks/request-block/components/RequestBody.vue.js.map +1 -1
- package/dist/v2/blocks/request-block/components/RequestBody.vue.script.js +8 -5
- package/dist/v2/blocks/request-block/components/RequestBody.vue.script.js.map +1 -1
- package/dist/v2/blocks/request-block/components/RequestBodyForm.vue.d.ts +2 -0
- package/dist/v2/blocks/request-block/components/RequestBodyForm.vue.d.ts.map +1 -1
- package/dist/v2/blocks/request-block/components/RequestBodyForm.vue.js.map +1 -1
- package/dist/v2/blocks/request-block/components/RequestBodyForm.vue.script.js +12 -4
- package/dist/v2/blocks/request-block/components/RequestBodyForm.vue.script.js.map +1 -1
- package/dist/v2/blocks/request-block/components/RequestCodeSnippet.vue.d.ts.map +1 -1
- package/dist/v2/blocks/request-block/components/RequestCodeSnippet.vue.js.map +1 -1
- package/dist/v2/blocks/request-block/components/RequestCodeSnippet.vue.script.js +5 -0
- package/dist/v2/blocks/request-block/components/RequestCodeSnippet.vue.script.js.map +1 -1
- package/dist/v2/blocks/request-block/components/RequestTable.vue.d.ts.map +1 -1
- package/dist/v2/blocks/request-block/components/RequestTable.vue.js +1 -1
- package/dist/v2/blocks/request-block/components/RequestTable.vue.js.map +1 -1
- package/dist/v2/blocks/request-block/components/RequestTable.vue.script.js +1 -0
- package/dist/v2/blocks/request-block/components/RequestTable.vue.script.js.map +1 -1
- package/dist/v2/blocks/request-block/components/RequestTableRow.vue.js.map +1 -1
- package/dist/v2/blocks/request-block/components/RequestTableRow.vue.script.js +2 -2
- package/dist/v2/blocks/request-block/components/RequestTableRow.vue.script.js.map +1 -1
- package/dist/v2/blocks/request-block/helpers/get-form-body-rows.d.ts.map +1 -1
- package/dist/v2/blocks/request-block/helpers/get-form-body-rows.js +5 -3
- package/dist/v2/blocks/request-block/helpers/get-form-body-rows.js.map +1 -1
- package/dist/v2/blocks/response-block/ResponseBlock.vue.d.ts.map +1 -1
- package/dist/v2/blocks/response-block/ResponseBlock.vue.js +1 -1
- package/dist/v2/blocks/response-block/ResponseBlock.vue.js.map +1 -1
- package/dist/v2/blocks/response-block/ResponseBlock.vue.script.js +4 -3
- package/dist/v2/blocks/response-block/ResponseBlock.vue.script.js.map +1 -1
- package/dist/v2/blocks/scalar-address-bar-block/components/AddressBar.vue.d.ts.map +1 -1
- package/dist/v2/blocks/scalar-address-bar-block/components/AddressBar.vue.js +1 -1
- package/dist/v2/blocks/scalar-address-bar-block/components/AddressBar.vue.js.map +1 -1
- package/dist/v2/blocks/scalar-address-bar-block/components/AddressBar.vue.script.js +23 -43
- package/dist/v2/blocks/scalar-address-bar-block/components/AddressBar.vue.script.js.map +1 -1
- package/dist/v2/blocks/scalar-auth-selector-block/components/AuthSelector.vue.d.ts +7 -0
- package/dist/v2/blocks/scalar-auth-selector-block/components/AuthSelector.vue.d.ts.map +1 -1
- package/dist/v2/blocks/scalar-auth-selector-block/components/AuthSelector.vue.js.map +1 -1
- package/dist/v2/blocks/scalar-auth-selector-block/components/AuthSelector.vue.script.js +6 -0
- package/dist/v2/blocks/scalar-auth-selector-block/components/AuthSelector.vue.script.js.map +1 -1
- package/dist/v2/blocks/scalar-auth-selector-block/components/OAuth2.vue.d.ts.map +1 -1
- package/dist/v2/blocks/scalar-auth-selector-block/components/OAuth2.vue.js.map +1 -1
- package/dist/v2/blocks/scalar-auth-selector-block/components/OAuth2.vue.script.js +5 -5
- package/dist/v2/blocks/scalar-auth-selector-block/components/OAuth2.vue.script.js.map +1 -1
- package/dist/v2/blocks/scalar-auth-selector-block/components/RequestAuthDataTableInput.vue.d.ts.map +1 -1
- package/dist/v2/blocks/scalar-auth-selector-block/components/RequestAuthDataTableInput.vue.js.map +1 -1
- package/dist/v2/blocks/scalar-auth-selector-block/components/RequestAuthDataTableInput.vue.script.js +11 -1
- package/dist/v2/blocks/scalar-auth-selector-block/components/RequestAuthDataTableInput.vue.script.js.map +1 -1
- package/dist/v2/blocks/scalar-auth-selector-block/helpers/security-scheme.d.ts.map +1 -1
- package/dist/v2/blocks/scalar-auth-selector-block/helpers/security-scheme.js +1 -1
- package/dist/v2/blocks/scalar-auth-selector-block/helpers/security-scheme.js.map +1 -1
- package/dist/v2/components/code-input/CodeInputLite.vue.d.ts.map +1 -1
- package/dist/v2/components/code-input/CodeInputLite.vue.js +1 -1
- package/dist/v2/components/code-input/CodeInputLite.vue.js.map +1 -1
- package/dist/v2/components/code-input/CodeInputLite.vue.script.js +13 -1
- package/dist/v2/components/code-input/CodeInputLite.vue.script.js.map +1 -1
- package/dist/v2/components/data-table/DataTableInput.vue.d.ts.map +1 -1
- package/dist/v2/components/data-table/DataTableInput.vue.js +1 -1
- package/dist/v2/components/data-table/DataTableInput.vue.js.map +1 -1
- package/dist/v2/components/data-table/DataTableInput.vue.script.js +7 -2
- package/dist/v2/components/data-table/DataTableInput.vue.script.js.map +1 -1
- package/dist/v2/components/layout/CollapsibleSection.vue.d.ts +20 -0
- package/dist/v2/components/layout/CollapsibleSection.vue.d.ts.map +1 -1
- package/dist/v2/components/layout/CollapsibleSection.vue.js.map +1 -1
- package/dist/v2/components/layout/CollapsibleSection.vue.script.js +36 -16
- package/dist/v2/components/layout/CollapsibleSection.vue.script.js.map +1 -1
- package/dist/v2/components/layout/collapsible-section-heading-level.d.ts +13 -0
- package/dist/v2/components/layout/collapsible-section-heading-level.d.ts.map +1 -0
- package/dist/v2/components/layout/collapsible-section-heading-level.js +14 -0
- package/dist/v2/components/layout/collapsible-section-heading-level.js.map +1 -0
- package/dist/v2/components/layout/index.d.ts +1 -0
- package/dist/v2/components/layout/index.d.ts.map +1 -1
- package/dist/v2/components/layout/index.js +2 -1
- package/dist/v2/components/modals/ModalClientContainer.vue.d.ts.map +1 -1
- package/dist/v2/components/modals/ModalClientContainer.vue.js +1 -1
- package/dist/v2/components/modals/ModalClientContainer.vue.js.map +1 -1
- package/dist/v2/components/modals/ModalClientContainer.vue.script.js +10 -1
- package/dist/v2/components/modals/ModalClientContainer.vue.script.js.map +1 -1
- package/dist/v2/components/sidebar/SidebarToggle.vue.d.ts +15 -2
- package/dist/v2/components/sidebar/SidebarToggle.vue.d.ts.map +1 -1
- package/dist/v2/components/sidebar/SidebarToggle.vue.js +3 -1
- package/dist/v2/components/sidebar/SidebarToggle.vue.js.map +1 -1
- package/dist/v2/components/sidebar/SidebarToggle.vue.script.js +5 -5
- package/dist/v2/components/sidebar/SidebarToggle.vue.script.js.map +1 -1
- package/dist/v2/constants.js +1 -1
- package/dist/v2/features/modal/Modal.vue.d.ts.map +1 -1
- package/dist/v2/features/modal/Modal.vue.js.map +1 -1
- package/dist/v2/features/modal/Modal.vue.script.js +2 -1
- package/dist/v2/features/modal/Modal.vue.script.js.map +1 -1
- package/dist/vue-styles.css +118 -77
- package/package.json +12 -12
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RequestTable.vue.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestTable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport { computed } from 'vue'\n\nimport RequestTableRow, {\n type TableRow,\n type TableRowUpsertPayload,\n} from '@/v2/blocks/request-block/components/RequestTableRow.vue'\nimport {\n DataTable,\n DataTableHeader,\n DataTableRow,\n} from '@/v2/components/data-table'\nimport { useLocalization } from '@/v2/features/localization'\n\nconst {\n data,\n hasCheckboxDisabled,\n deferKeyUpdates,\n showUploadButton,\n showAddRowPlaceholder = true,\n environment,\n} = defineProps<{\n data: TableRow[]\n /** Save key edits on blur so changing a body name does not replace the focused row. */\n deferKeyUpdates?: boolean\n /** Hide the enabled column */\n hasCheckboxDisabled?: boolean\n invalidParams?: Set<string>\n label?: string\n showUploadButton?: boolean\n showAddRowPlaceholder?: boolean\n environment: XScalarEnvironment\n}>()\n\n/**\n * Make this component more generic that can be used also for the operation body\n */\nconst emit = defineEmits<{\n (e: 'upsertRow', index: number, payload: TableRowUpsertPayload): void\n (e: 'deleteRow', index: number): void\n\n /**\n * File upload events\n *\n * Each row has its own upload button, so we need to know which row to update\n * when the file is selected.\n */\n (e: 'uploadFile', index: number): void\n (e: 'removeFile', index: number): void\n (e: 'navigate', route: NonNullable<TableRow['globalRoute']>): void\n /** Select a value for a grouped global cookie preset at the given row index. */\n (e: 'selectPreset', index: number, value: string): void\n}>()\n\nconst { translate } = useLocalization()\n\nconst columns = computed(() => {\n if (showUploadButton) {\n return ['36px', '', '', 'minmax(0, 1fr)']\n }\n return ['36px', '', '']\n})\n\n/** Add the last empty row (for ui purposes only) */\nconst displayData = computed(() => {\n if (!showAddRowPlaceholder) {\n return data\n }\n\n const last = data.at(-1)\n\n if (!last || last.name !== '' || last.value !== '') {\n return [...data, { name: '', value: '', isDisabled: true }]\n }\n\n return data\n})\n\n/**\n * Stable identity key for each row so Vue never reuses a RequestTableRow instance for a different\n * parameter or the appended placeholder row. Parameter rows are keyed by their parameter identity —\n * the name plus the value path for expanded object parameters. The parts are combined through\n * JSON.stringify so the name/path boundary is unambiguous (for example `ab` + `['c']` never\n * collides with `a` + `['bc']`). Form rows use the name and its occurrence so repeated\n * multipart fields remain distinct while unrelated rows can move without losing their identity.\n */\nconst getRowKey = (row: TableRow, index: number): string => {\n if (row.originalParameter) {\n return JSON.stringify([\n row.originalParameter.name,\n ...(row.sourceParameterValuePath ?? []),\n ])\n }\n\n const occurrence = displayData.value\n .slice(0, index)\n .filter(\n (other) => !other.originalParameter && other.name === row.name,\n ).length\n return `row:${JSON.stringify([row.name, occurrence])}`\n}\n\n/** Keep an edited row mounted when saving it changes its parameter identity. */\ntype DisplayRow = {\n data: TableRow\n identity: string\n key: symbol\n}\n\nconst pendingUpdates = new Map<symbol, TableRowUpsertPayload>()\n\nconst matchesPendingUpdate = (key: symbol, row: TableRow): boolean => {\n const update = pendingUpdates.get(key)\n return update?.name === row.name && update.value === row.value\n}\n\n// A saved parameter inherits the editor's key. The next placeholder gets a fresh key,\n// so it cannot retain the previous placeholder's text or focused input.\nconst keyedRows = computed<DisplayRow[]>((previous = []) => {\n const available = new Set(previous)\n // Reserve identities still present in the store before transferring an edited key.\n // The appended placeholder is excluded so a newly saved row can inherit its editor.\n const savedIdentities = new Set(data.map(getRowKey))\n const rows = displayData.value.map((row, index) => {\n const identity = getRowKey(row, index)\n const existing = [...available].find((entry) => entry.identity === identity)\n const pending = [...available].find(\n (entry) =>\n !savedIdentities.has(entry.identity) &&\n !entry.data.sourceParameterValuePath &&\n matchesPendingUpdate(entry.key, row),\n )\n const match = existing ?? pending\n\n if (match) {\n available.delete(match)\n if (matchesPendingUpdate(match.key, row)) {\n pendingUpdates.delete(match.key)\n }\n }\n\n return { data: row, identity, key: match?.key ?? Symbol() }\n })\n\n for (const removed of available) {\n pendingUpdates.delete(removed.key)\n }\n\n return rows\n})\n\nconst handleUpsertRow = (\n row: DisplayRow,\n index: number,\n payload: TableRowUpsertPayload,\n): void => {\n // The store may debounce the save. Transfer this key only when the saved row arrives.\n pendingUpdates.set(row.key, payload)\n emit('upsertRow', index, payload)\n}\n</script>\n<template>\n <DataTable\n class=\"group/table flex-1\"\n :columns=\"columns\">\n <DataTableRow class=\"sr-only !block\">\n <DataTableHeader>\n {{ label }}\n {{ translate('apiClient.requestTable.enabled') }}\n </DataTableHeader>\n <DataTableHeader>\n {{ label }}\n {{ translate('apiClient.requestTable.key') }}\n </DataTableHeader>\n <DataTableHeader>\n {{ label }}\n {{ translate('apiClient.requestTable.value') }}\n </DataTableHeader>\n </DataTableRow>\n\n <RequestTableRow\n v-for=\"(row, index) in keyedRows\"\n :key=\"row.key\"\n :data=\"row.data\"\n :deferKeyUpdates=\"deferKeyUpdates\"\n :environment=\"environment\"\n :hasCheckboxDisabled=\"hasCheckboxDisabled\"\n :invalidParams=\"invalidParams\"\n :label=\"label\"\n :showUploadButton=\"showUploadButton\"\n @deleteRow=\"emit('deleteRow', index)\"\n @navigate=\"(route) => emit('navigate', route)\"\n @removeFile=\"emit('removeFile', index)\"\n @selectPreset=\"(value) => emit('selectPreset', index, value)\"\n @uploadFile=\"emit('uploadFile', index)\"\n @upsertRow=\"(payload) => handleUpsertRow(row, index, payload)\" />\n </DataTable>\n</template>\n<style scoped>\n:deep(.code-input-lite__editor) {\n background-color: transparent;\n font-family: var(--scalar-font);\n font-size: var(--scalar-small);\n padding: 5px 8px;\n}\n:deep(.scalar-pill:not(:last-of-type)) {\n margin-right: 0.15em;\n}\n:deep(.scalar-pill:not(:first-of-type)) {\n margin-left: 0.5px;\n}\n</style>\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"RequestTable.vue.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestTable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport { computed } from 'vue'\n\nimport RequestTableRow, {\n type TableRow,\n type TableRowUpsertPayload,\n} from '@/v2/blocks/request-block/components/RequestTableRow.vue'\nimport {\n DataTable,\n DataTableHeader,\n DataTableRow,\n} from '@/v2/components/data-table'\nimport { useLocalization } from '@/v2/features/localization'\n\nconst {\n data,\n hasCheckboxDisabled,\n deferKeyUpdates,\n showUploadButton,\n showAddRowPlaceholder = true,\n environment,\n} = defineProps<{\n data: TableRow[]\n /** Save key edits on blur so changing a body name does not replace the focused row. */\n deferKeyUpdates?: boolean\n /** Hide the enabled column */\n hasCheckboxDisabled?: boolean\n invalidParams?: Set<string>\n label?: string\n showUploadButton?: boolean\n showAddRowPlaceholder?: boolean\n environment: XScalarEnvironment\n}>()\n\n/**\n * Make this component more generic that can be used also for the operation body\n */\nconst emit = defineEmits<{\n (e: 'upsertRow', index: number, payload: TableRowUpsertPayload): void\n (e: 'deleteRow', index: number): void\n\n /**\n * File upload events\n *\n * Each row has its own upload button, so we need to know which row to update\n * when the file is selected.\n */\n (e: 'uploadFile', index: number): void\n (e: 'removeFile', index: number): void\n (e: 'navigate', route: NonNullable<TableRow['globalRoute']>): void\n /** Select a value for a grouped global cookie preset at the given row index. */\n (e: 'selectPreset', index: number, value: string): void\n}>()\n\nconst { translate } = useLocalization()\n\nconst columns = computed(() => {\n if (showUploadButton) {\n return ['36px', '', '', 'minmax(0, 1fr)']\n }\n return ['36px', '', '']\n})\n\n/** Add the last empty row (for ui purposes only) */\nconst displayData = computed(() => {\n if (!showAddRowPlaceholder) {\n return data\n }\n\n const last = data.at(-1)\n\n if (!last || last.name !== '' || last.value !== '') {\n return [...data, { name: '', value: '', isDisabled: true }]\n }\n\n return data\n})\n\n/**\n * Stable identity key for each row so Vue never reuses a RequestTableRow instance for a different\n * parameter or the appended placeholder row. Parameter rows are keyed by their parameter identity —\n * the name plus the value path for expanded object parameters. The parts are combined through\n * JSON.stringify so the name/path boundary is unambiguous (for example `ab` + `['c']` never\n * collides with `a` + `['bc']`). Form rows use the name and its occurrence so repeated\n * multipart fields remain distinct while unrelated rows can move without losing their identity.\n */\nconst getRowKey = (row: TableRow, index: number): string => {\n // Body edits retain their row when blur commits a rename after focus moves into the value.\n if (deferKeyUpdates) {\n return `body:${index}`\n }\n if (row.originalParameter) {\n return JSON.stringify([\n row.originalParameter.name,\n ...(row.sourceParameterValuePath ?? []),\n ])\n }\n\n const occurrence = displayData.value\n .slice(0, index)\n .filter(\n (other) => !other.originalParameter && other.name === row.name,\n ).length\n return `row:${JSON.stringify([row.name, occurrence])}`\n}\n\n/** Keep an edited row mounted when saving it changes its parameter identity. */\ntype DisplayRow = {\n data: TableRow\n identity: string\n key: symbol\n}\n\nconst pendingUpdates = new Map<symbol, TableRowUpsertPayload>()\n\nconst matchesPendingUpdate = (key: symbol, row: TableRow): boolean => {\n const update = pendingUpdates.get(key)\n return update?.name === row.name && update.value === row.value\n}\n\n// A saved parameter inherits the editor's key. The next placeholder gets a fresh key,\n// so it cannot retain the previous placeholder's text or focused input.\nconst keyedRows = computed<DisplayRow[]>((previous = []) => {\n const available = new Set(previous)\n // Reserve identities still present in the store before transferring an edited key.\n // The appended placeholder is excluded so a newly saved row can inherit its editor.\n const savedIdentities = new Set(data.map(getRowKey))\n const rows = displayData.value.map((row, index) => {\n const identity = getRowKey(row, index)\n const existing = [...available].find((entry) => entry.identity === identity)\n const pending = [...available].find(\n (entry) =>\n !savedIdentities.has(entry.identity) &&\n !entry.data.sourceParameterValuePath &&\n matchesPendingUpdate(entry.key, row),\n )\n const match = existing ?? pending\n\n if (match) {\n available.delete(match)\n if (matchesPendingUpdate(match.key, row)) {\n pendingUpdates.delete(match.key)\n }\n }\n\n return { data: row, identity, key: match?.key ?? Symbol() }\n })\n\n for (const removed of available) {\n pendingUpdates.delete(removed.key)\n }\n\n return rows\n})\n\nconst handleUpsertRow = (\n row: DisplayRow,\n index: number,\n payload: TableRowUpsertPayload,\n): void => {\n // The store may debounce the save. Transfer this key only when the saved row arrives.\n pendingUpdates.set(row.key, payload)\n emit('upsertRow', index, payload)\n}\n</script>\n<template>\n <DataTable\n class=\"group/table flex-1\"\n :columns=\"columns\">\n <DataTableRow class=\"sr-only !block\">\n <DataTableHeader>\n {{ label }}\n {{ translate('apiClient.requestTable.enabled') }}\n </DataTableHeader>\n <DataTableHeader>\n {{ label }}\n {{ translate('apiClient.requestTable.key') }}\n </DataTableHeader>\n <DataTableHeader>\n {{ label }}\n {{ translate('apiClient.requestTable.value') }}\n </DataTableHeader>\n </DataTableRow>\n\n <RequestTableRow\n v-for=\"(row, index) in keyedRows\"\n :key=\"row.key\"\n :data=\"row.data\"\n :deferKeyUpdates=\"deferKeyUpdates\"\n :environment=\"environment\"\n :hasCheckboxDisabled=\"hasCheckboxDisabled\"\n :invalidParams=\"invalidParams\"\n :label=\"label\"\n :showUploadButton=\"showUploadButton\"\n @deleteRow=\"emit('deleteRow', index)\"\n @navigate=\"(route) => emit('navigate', route)\"\n @removeFile=\"emit('removeFile', index)\"\n @selectPreset=\"(value) => emit('selectPreset', index, value)\"\n @uploadFile=\"emit('uploadFile', index)\"\n @upsertRow=\"(payload) => handleUpsertRow(row, index, payload)\" />\n </DataTable>\n</template>\n<style scoped>\n:deep(.code-input-lite__editor) {\n background-color: transparent;\n font-family: var(--scalar-font);\n font-size: var(--scalar-small);\n padding: 5px 8px;\n}\n:deep(.scalar-pill:not(:last-of-type)) {\n margin-right: 0.15em;\n}\n:deep(.scalar-pill:not(:first-of-type)) {\n margin-left: 0.5px;\n}\n</style>\n"],"mappings":""}
|
|
@@ -67,6 +67,7 @@ var RequestTable_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
|
|
|
67
67
|
* multipart fields remain distinct while unrelated rows can move without losing their identity.
|
|
68
68
|
*/
|
|
69
69
|
const getRowKey = (row, index) => {
|
|
70
|
+
if (__props.deferKeyUpdates) return `body:${index}`;
|
|
70
71
|
if (row.originalParameter) return JSON.stringify([row.originalParameter.name, ...row.sourceParameterValuePath ?? []]);
|
|
71
72
|
const occurrence = displayData.value.slice(0, index).filter((other) => !other.originalParameter && other.name === row.name).length;
|
|
72
73
|
return `row:${JSON.stringify([row.name, occurrence])}`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RequestTable.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestTable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport { computed } from 'vue'\n\nimport RequestTableRow, {\n type TableRow,\n type TableRowUpsertPayload,\n} from '@/v2/blocks/request-block/components/RequestTableRow.vue'\nimport {\n DataTable,\n DataTableHeader,\n DataTableRow,\n} from '@/v2/components/data-table'\nimport { useLocalization } from '@/v2/features/localization'\n\nconst {\n data,\n hasCheckboxDisabled,\n deferKeyUpdates,\n showUploadButton,\n showAddRowPlaceholder = true,\n environment,\n} = defineProps<{\n data: TableRow[]\n /** Save key edits on blur so changing a body name does not replace the focused row. */\n deferKeyUpdates?: boolean\n /** Hide the enabled column */\n hasCheckboxDisabled?: boolean\n invalidParams?: Set<string>\n label?: string\n showUploadButton?: boolean\n showAddRowPlaceholder?: boolean\n environment: XScalarEnvironment\n}>()\n\n/**\n * Make this component more generic that can be used also for the operation body\n */\nconst emit = defineEmits<{\n (e: 'upsertRow', index: number, payload: TableRowUpsertPayload): void\n (e: 'deleteRow', index: number): void\n\n /**\n * File upload events\n *\n * Each row has its own upload button, so we need to know which row to update\n * when the file is selected.\n */\n (e: 'uploadFile', index: number): void\n (e: 'removeFile', index: number): void\n (e: 'navigate', route: NonNullable<TableRow['globalRoute']>): void\n /** Select a value for a grouped global cookie preset at the given row index. */\n (e: 'selectPreset', index: number, value: string): void\n}>()\n\nconst { translate } = useLocalization()\n\nconst columns = computed(() => {\n if (showUploadButton) {\n return ['36px', '', '', 'minmax(0, 1fr)']\n }\n return ['36px', '', '']\n})\n\n/** Add the last empty row (for ui purposes only) */\nconst displayData = computed(() => {\n if (!showAddRowPlaceholder) {\n return data\n }\n\n const last = data.at(-1)\n\n if (!last || last.name !== '' || last.value !== '') {\n return [...data, { name: '', value: '', isDisabled: true }]\n }\n\n return data\n})\n\n/**\n * Stable identity key for each row so Vue never reuses a RequestTableRow instance for a different\n * parameter or the appended placeholder row. Parameter rows are keyed by their parameter identity —\n * the name plus the value path for expanded object parameters. The parts are combined through\n * JSON.stringify so the name/path boundary is unambiguous (for example `ab` + `['c']` never\n * collides with `a` + `['bc']`). Form rows use the name and its occurrence so repeated\n * multipart fields remain distinct while unrelated rows can move without losing their identity.\n */\nconst getRowKey = (row: TableRow, index: number): string => {\n if (row.originalParameter) {\n return JSON.stringify([\n row.originalParameter.name,\n ...(row.sourceParameterValuePath ?? []),\n ])\n }\n\n const occurrence = displayData.value\n .slice(0, index)\n .filter(\n (other) => !other.originalParameter && other.name === row.name,\n ).length\n return `row:${JSON.stringify([row.name, occurrence])}`\n}\n\n/** Keep an edited row mounted when saving it changes its parameter identity. */\ntype DisplayRow = {\n data: TableRow\n identity: string\n key: symbol\n}\n\nconst pendingUpdates = new Map<symbol, TableRowUpsertPayload>()\n\nconst matchesPendingUpdate = (key: symbol, row: TableRow): boolean => {\n const update = pendingUpdates.get(key)\n return update?.name === row.name && update.value === row.value\n}\n\n// A saved parameter inherits the editor's key. The next placeholder gets a fresh key,\n// so it cannot retain the previous placeholder's text or focused input.\nconst keyedRows = computed<DisplayRow[]>((previous = []) => {\n const available = new Set(previous)\n // Reserve identities still present in the store before transferring an edited key.\n // The appended placeholder is excluded so a newly saved row can inherit its editor.\n const savedIdentities = new Set(data.map(getRowKey))\n const rows = displayData.value.map((row, index) => {\n const identity = getRowKey(row, index)\n const existing = [...available].find((entry) => entry.identity === identity)\n const pending = [...available].find(\n (entry) =>\n !savedIdentities.has(entry.identity) &&\n !entry.data.sourceParameterValuePath &&\n matchesPendingUpdate(entry.key, row),\n )\n const match = existing ?? pending\n\n if (match) {\n available.delete(match)\n if (matchesPendingUpdate(match.key, row)) {\n pendingUpdates.delete(match.key)\n }\n }\n\n return { data: row, identity, key: match?.key ?? Symbol() }\n })\n\n for (const removed of available) {\n pendingUpdates.delete(removed.key)\n }\n\n return rows\n})\n\nconst handleUpsertRow = (\n row: DisplayRow,\n index: number,\n payload: TableRowUpsertPayload,\n): void => {\n // The store may debounce the save. Transfer this key only when the saved row arrives.\n pendingUpdates.set(row.key, payload)\n emit('upsertRow', index, payload)\n}\n</script>\n<template>\n <DataTable\n class=\"group/table flex-1\"\n :columns=\"columns\">\n <DataTableRow class=\"sr-only !block\">\n <DataTableHeader>\n {{ label }}\n {{ translate('apiClient.requestTable.enabled') }}\n </DataTableHeader>\n <DataTableHeader>\n {{ label }}\n {{ translate('apiClient.requestTable.key') }}\n </DataTableHeader>\n <DataTableHeader>\n {{ label }}\n {{ translate('apiClient.requestTable.value') }}\n </DataTableHeader>\n </DataTableRow>\n\n <RequestTableRow\n v-for=\"(row, index) in keyedRows\"\n :key=\"row.key\"\n :data=\"row.data\"\n :deferKeyUpdates=\"deferKeyUpdates\"\n :environment=\"environment\"\n :hasCheckboxDisabled=\"hasCheckboxDisabled\"\n :invalidParams=\"invalidParams\"\n :label=\"label\"\n :showUploadButton=\"showUploadButton\"\n @deleteRow=\"emit('deleteRow', index)\"\n @navigate=\"(route) => emit('navigate', route)\"\n @removeFile=\"emit('removeFile', index)\"\n @selectPreset=\"(value) => emit('selectPreset', index, value)\"\n @uploadFile=\"emit('uploadFile', index)\"\n @upsertRow=\"(payload) => handleUpsertRow(row, index, payload)\" />\n </DataTable>\n</template>\n<style scoped>\n:deep(.code-input-lite__editor) {\n background-color: transparent;\n font-family: var(--scalar-font);\n font-size: var(--scalar-small);\n padding: 5px 8px;\n}\n:deep(.scalar-pill:not(:last-of-type)) {\n margin-right: 0.15em;\n}\n:deep(.scalar-pill:not(:first-of-type)) {\n margin-left: 0.5px;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsCA,MAAM,OAAO;EAiBb,MAAM,EAAE,cAAc,gBAAgB;EAEtC,MAAM,UAAU,eAAe;GAC7B,IAAI,QAAA,kBACF,OAAO;IAAC;IAAQ;IAAI;IAAI;GAAgB;GAE1C,OAAO;IAAC;IAAQ;IAAI;GAAE;EACxB,CAAC;;EAGD,MAAM,cAAc,eAAe;GACjC,IAAI,CAAC,QAAA,uBACH,OAAO,QAAA;GAGT,MAAM,OAAO,QAAA,KAAK,GAAG,EAAE;GAEvB,IAAI,CAAC,QAAQ,KAAK,SAAS,MAAM,KAAK,UAAU,IAC9C,OAAO,CAAC,GAAG,QAAA,MAAM;IAAE,MAAM;IAAI,OAAO;IAAI,YAAY;GAAK,CAAC;GAG5D,OAAO,QAAA;EACT,CAAC;;;;;;;;;EAUD,MAAM,aAAa,KAAe,UAA0B;
|
|
1
|
+
{"version":3,"file":"RequestTable.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestTable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport { computed } from 'vue'\n\nimport RequestTableRow, {\n type TableRow,\n type TableRowUpsertPayload,\n} from '@/v2/blocks/request-block/components/RequestTableRow.vue'\nimport {\n DataTable,\n DataTableHeader,\n DataTableRow,\n} from '@/v2/components/data-table'\nimport { useLocalization } from '@/v2/features/localization'\n\nconst {\n data,\n hasCheckboxDisabled,\n deferKeyUpdates,\n showUploadButton,\n showAddRowPlaceholder = true,\n environment,\n} = defineProps<{\n data: TableRow[]\n /** Save key edits on blur so changing a body name does not replace the focused row. */\n deferKeyUpdates?: boolean\n /** Hide the enabled column */\n hasCheckboxDisabled?: boolean\n invalidParams?: Set<string>\n label?: string\n showUploadButton?: boolean\n showAddRowPlaceholder?: boolean\n environment: XScalarEnvironment\n}>()\n\n/**\n * Make this component more generic that can be used also for the operation body\n */\nconst emit = defineEmits<{\n (e: 'upsertRow', index: number, payload: TableRowUpsertPayload): void\n (e: 'deleteRow', index: number): void\n\n /**\n * File upload events\n *\n * Each row has its own upload button, so we need to know which row to update\n * when the file is selected.\n */\n (e: 'uploadFile', index: number): void\n (e: 'removeFile', index: number): void\n (e: 'navigate', route: NonNullable<TableRow['globalRoute']>): void\n /** Select a value for a grouped global cookie preset at the given row index. */\n (e: 'selectPreset', index: number, value: string): void\n}>()\n\nconst { translate } = useLocalization()\n\nconst columns = computed(() => {\n if (showUploadButton) {\n return ['36px', '', '', 'minmax(0, 1fr)']\n }\n return ['36px', '', '']\n})\n\n/** Add the last empty row (for ui purposes only) */\nconst displayData = computed(() => {\n if (!showAddRowPlaceholder) {\n return data\n }\n\n const last = data.at(-1)\n\n if (!last || last.name !== '' || last.value !== '') {\n return [...data, { name: '', value: '', isDisabled: true }]\n }\n\n return data\n})\n\n/**\n * Stable identity key for each row so Vue never reuses a RequestTableRow instance for a different\n * parameter or the appended placeholder row. Parameter rows are keyed by their parameter identity —\n * the name plus the value path for expanded object parameters. The parts are combined through\n * JSON.stringify so the name/path boundary is unambiguous (for example `ab` + `['c']` never\n * collides with `a` + `['bc']`). Form rows use the name and its occurrence so repeated\n * multipart fields remain distinct while unrelated rows can move without losing their identity.\n */\nconst getRowKey = (row: TableRow, index: number): string => {\n // Body edits retain their row when blur commits a rename after focus moves into the value.\n if (deferKeyUpdates) {\n return `body:${index}`\n }\n if (row.originalParameter) {\n return JSON.stringify([\n row.originalParameter.name,\n ...(row.sourceParameterValuePath ?? []),\n ])\n }\n\n const occurrence = displayData.value\n .slice(0, index)\n .filter(\n (other) => !other.originalParameter && other.name === row.name,\n ).length\n return `row:${JSON.stringify([row.name, occurrence])}`\n}\n\n/** Keep an edited row mounted when saving it changes its parameter identity. */\ntype DisplayRow = {\n data: TableRow\n identity: string\n key: symbol\n}\n\nconst pendingUpdates = new Map<symbol, TableRowUpsertPayload>()\n\nconst matchesPendingUpdate = (key: symbol, row: TableRow): boolean => {\n const update = pendingUpdates.get(key)\n return update?.name === row.name && update.value === row.value\n}\n\n// A saved parameter inherits the editor's key. The next placeholder gets a fresh key,\n// so it cannot retain the previous placeholder's text or focused input.\nconst keyedRows = computed<DisplayRow[]>((previous = []) => {\n const available = new Set(previous)\n // Reserve identities still present in the store before transferring an edited key.\n // The appended placeholder is excluded so a newly saved row can inherit its editor.\n const savedIdentities = new Set(data.map(getRowKey))\n const rows = displayData.value.map((row, index) => {\n const identity = getRowKey(row, index)\n const existing = [...available].find((entry) => entry.identity === identity)\n const pending = [...available].find(\n (entry) =>\n !savedIdentities.has(entry.identity) &&\n !entry.data.sourceParameterValuePath &&\n matchesPendingUpdate(entry.key, row),\n )\n const match = existing ?? pending\n\n if (match) {\n available.delete(match)\n if (matchesPendingUpdate(match.key, row)) {\n pendingUpdates.delete(match.key)\n }\n }\n\n return { data: row, identity, key: match?.key ?? Symbol() }\n })\n\n for (const removed of available) {\n pendingUpdates.delete(removed.key)\n }\n\n return rows\n})\n\nconst handleUpsertRow = (\n row: DisplayRow,\n index: number,\n payload: TableRowUpsertPayload,\n): void => {\n // The store may debounce the save. Transfer this key only when the saved row arrives.\n pendingUpdates.set(row.key, payload)\n emit('upsertRow', index, payload)\n}\n</script>\n<template>\n <DataTable\n class=\"group/table flex-1\"\n :columns=\"columns\">\n <DataTableRow class=\"sr-only !block\">\n <DataTableHeader>\n {{ label }}\n {{ translate('apiClient.requestTable.enabled') }}\n </DataTableHeader>\n <DataTableHeader>\n {{ label }}\n {{ translate('apiClient.requestTable.key') }}\n </DataTableHeader>\n <DataTableHeader>\n {{ label }}\n {{ translate('apiClient.requestTable.value') }}\n </DataTableHeader>\n </DataTableRow>\n\n <RequestTableRow\n v-for=\"(row, index) in keyedRows\"\n :key=\"row.key\"\n :data=\"row.data\"\n :deferKeyUpdates=\"deferKeyUpdates\"\n :environment=\"environment\"\n :hasCheckboxDisabled=\"hasCheckboxDisabled\"\n :invalidParams=\"invalidParams\"\n :label=\"label\"\n :showUploadButton=\"showUploadButton\"\n @deleteRow=\"emit('deleteRow', index)\"\n @navigate=\"(route) => emit('navigate', route)\"\n @removeFile=\"emit('removeFile', index)\"\n @selectPreset=\"(value) => emit('selectPreset', index, value)\"\n @uploadFile=\"emit('uploadFile', index)\"\n @upsertRow=\"(payload) => handleUpsertRow(row, index, payload)\" />\n </DataTable>\n</template>\n<style scoped>\n:deep(.code-input-lite__editor) {\n background-color: transparent;\n font-family: var(--scalar-font);\n font-size: var(--scalar-small);\n padding: 5px 8px;\n}\n:deep(.scalar-pill:not(:last-of-type)) {\n margin-right: 0.15em;\n}\n:deep(.scalar-pill:not(:first-of-type)) {\n margin-left: 0.5px;\n}\n</style>\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RequestTableRow.vue.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestTableRow.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton } from '@scalar/components/button'\nimport { ScalarIcon } from '@scalar/components/icon'\nimport { ScalarIconButton } from '@scalar/components/icon-button'\nimport { ScalarIconGlobe, ScalarIconTrash } from '@scalar/icons'\nimport type { ApiReferenceEvents } from '@scalar/workspace-store/events'\nimport { unpackProxyObject } from '@scalar/workspace-store/helpers/unpack-proxy'\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type {\n ParameterObject,\n SchemaObject,\n} from '@scalar/workspace-store/schemas/v3.2/strict/openapi-document'\nimport { computed, ref, watch } from 'vue'\n\nimport { getFileName } from '@/v2/blocks/request-block/helpers/files'\nimport { validateParameter } from '@/v2/blocks/request-block/helpers/validate-parameter'\nimport { CodeInputLite } from '@/v2/components/code-input'\nimport {\n DataTableCell,\n DataTableCheckbox,\n DataTableInputSelect,\n DataTableRow,\n} from '@/v2/components/data-table'\nimport { useLocalization } from '@/v2/features/localization'\n\nimport RequestTableTooltip from './RequestTableTooltip.vue'\n\nconst {\n data,\n environment,\n hasCheckboxDisabled,\n deferKeyUpdates,\n invalidParams,\n showUploadButton,\n} = defineProps<{\n data: TableRow\n /** Keep key edits local until blur when the row identity depends on its name. */\n deferKeyUpdates?: boolean\n hasCheckboxDisabled?: boolean\n invalidParams?: Set<string>\n label?: string\n environment: XScalarEnvironment\n showUploadButton?: boolean\n}>()\n\nconst emit = defineEmits<{\n (e: 'upsertRow', payload: TableRowUpsertPayload): void\n (e: 'deleteRow'): void\n (e: 'uploadFile'): void\n (e: 'removeFile'): void\n (e: 'navigate', route: NonNullable<TableRow['globalRoute']>): void\n /** Select a value for a grouped global cookie preset. */\n (e: 'selectPreset', value: string): void\n}>()\n\nconst { translate } = useLocalization()\n\nexport type TableRow = {\n /** The parameter or field name/key */\n name: string\n /** The parameter value, can be a string, file, or null */\n value: string | File | null\n /** Optional description for the parameter */\n description?: string\n /** Optional route for global parameters (e.g., cookies shared across workspace) */\n globalRoute?: ApiReferenceEvents['ui:navigate']\n /** Whether the parameter is disabled/inactive */\n isDisabled?: boolean\n /** Whether an optional parameter is disabled because it has no explicit x-disabled value */\n isDisabledByDefault?: boolean\n /** OpenAPI schema object with type, validation rules, examples, etc. */\n schema?: SchemaObject\n /** Preserve array values even while their JSON text is temporarily invalid. */\n isArray?: boolean\n /** Whether the parameter is required */\n isRequired?: boolean\n /**\n * Whether the parameter is readonly and can not be modifies directly\n * User can still override the parameter which is going to show up with the linethrough style\n */\n isReadonly?: boolean\n /** Whether the parameter is overridden later on */\n isOverridden?: boolean\n /** Track the original parameter so we can update it */\n originalParameter?: ParameterObject\n /** Path to a value inside the original parameter example for expanded object parameters */\n sourceParameterValuePath?: string[]\n /**\n * Selectable values for a grouped global cookie preset. When set, the value cell renders a\n * dropdown to switch between predefined values (for example a `Culture` cookie with `PL`/`EN`)\n * instead of an editable input.\n */\n presetOptions?: string[]\n}\n\nexport type TableRowUpsertPayload = {\n name: string\n value: string | File\n isDisabled: boolean\n shouldRenameExpandedRow?: boolean\n}\n\n/**\n * Track local state for the row\n *\n * Now this is required because of the way we get default values from the schema.\n * If we have a default value in data.value, then we update isDisabled to true. We lose the default value since now\n * we have an example where value: ''. This is why we need to track the local state and update all of the params at the\n * same time.\n */\nconst name = ref<string>(data.name ?? '')\nconst value = ref<string | File>(unpackProxyObject(data.value) ?? '')\nconst isDisabled = ref<boolean>(data.isDisabled ?? false)\n\n// Keep the above state synced with the data prop\nwatch(\n () => data.name,\n (newName) => {\n // Do not overwrite a valid local name with an empty incoming prop — this\n // can happen when the placeholder row (appended by displayData) is briefly\n // mapped onto this component instance before Vue re-keys the list.\n if (!newName && name.value) return\n name.value = newName ?? ''\n },\n)\nwatch(\n () => data.value,\n (newValue) => (value.value = unpackProxyObject(newValue) ?? ''),\n)\nwatch(\n () => data.isDisabled,\n (newIsDisabled) => (isDisabled.value = newIsDisabled ?? false),\n)\n\n/** Check if the value is a File instance */\nconst isFile = computed(() => value.value instanceof File)\n\n/** Display value handles File instances and shows filename instead */\nconst displayValue = computed(\n () =>\n (isFile.value\n ? getFileName(value.value as File)\n : (value.value as string)) ?? '',\n)\n\nconst defaultValue = computed(() => data.schema?.default as string)\n\n/** See if we can extract enum values from the schema */\nconst enumValue = computed<string[]>(() => {\n if (!data.schema) {\n return []\n }\n\n // Grab the enum from the schema\n if (data.schema.enum) {\n return data.schema.enum.map((item) => String(item))\n }\n\n // Grab the enum from the items schema\n if ('items' in data.schema) {\n const resolved = resolve.schema(data.schema.items)\n if (resolved?.enum) {\n return resolved.enum.map((item) => String(item))\n }\n }\n\n return []\n})\n\nconst typeValue = computed(() =>\n data.schema && 'type' in data.schema ? data.schema.type : undefined,\n)\n\nconst validationResult = computed(() =>\n validateParameter(data.schema, value.value),\n)\n\n/** Handle row updates while preserving existing properties */\nconst handleUpdateRow = (\n payload: Partial<{ name: string; value: string; isDisabled: boolean }>,\n options: { shouldRenameExpandedRow?: boolean; commitKey?: boolean } = {},\n): void => {\n // Update our local state\n if (payload.name !== undefined) {\n name.value = payload.name\n }\n if (payload.value !== undefined) {\n value.value = payload.value\n\n // Optional parameters start unchecked, but entering a value expresses intent to send it.\n // Explicit x-disabled values stay unchanged so a deliberate opt-out is preserved.\n if (data.isDisabledByDefault) {\n isDisabled.value = false\n }\n }\n\n // Is disabled should only be updated when explicitly provided in the payload\n if (payload.isDisabled !== undefined) {\n isDisabled.value = payload.isDisabled\n }\n\n if (\n payload.name !== undefined &&\n (deferKeyUpdates || data.sourceParameterValuePath) &&\n !options.shouldRenameExpandedRow &&\n !options.commitKey\n ) {\n return\n }\n\n // Emit all of the local state\n emit('upsertRow', {\n name: name.value,\n value: value.value,\n isDisabled: isDisabled.value,\n ...(options.shouldRenameExpandedRow\n ? { shouldRenameExpandedRow: true }\n : {}),\n })\n}\n\n/**\n * Commit a key edit when the input loses focus. Body and expanded-object rows defer their rename to blur (see\n * handleUpdateRow), so we only emit when the key actually changed. Focusing and blurring the field\n * without typing should not re-emit the row or silently reset its disabled state. The current\n * disabled state is passed through so a renamed row keeps it.\n */\nconst handleKeyBlur = (newName: string): void => {\n if (newName === data.name) {\n return\n }\n // Do not emit an update that would blank the parameter name — this can fire\n // when CodeInputLite blurs before it has rendered its initial value.\n if (!newName && data.name) {\n return\n }\n\n handleUpdateRow(\n { name: newName, isDisabled: isDisabled.value },\n {\n shouldRenameExpandedRow: Boolean(data.sourceParameterValuePath),\n commitKey: true,\n },\n )\n}\n\n/** Save a pending body key before the send shortcut reaches the request handler. */\nconst handleKeydown = (event: KeyboardEvent): void => {\n if (\n deferKeyUpdates &&\n event.key === 'Enter' &&\n (event.metaKey || event.ctrlKey)\n ) {\n handleKeyBlur(name.value)\n }\n}\n</script>\n\n<template>\n <DataTableRow\n :id=\"data.name\"\n :class=\"{\n alert: validationResult.ok === false,\n error: validationResult.ok === false && invalidParams?.has(data.name),\n }\">\n <DataTableCheckbox\n :ariaLabel=\"\n translate('apiClient.requestTableRow.include', {\n name: data.name || translate('apiClient.requestTableRow.row'),\n })\n \"\n class=\"!border-r\"\n :disabled=\"hasCheckboxDisabled ?? false\"\n :modelValue=\"!isDisabled\"\n @update:modelValue=\"(v) => handleUpdateRow({ isDisabled: !v })\" />\n\n <!-- Name -->\n <DataTableCell>\n <CodeInputLite\n :aria-label=\"\n translate('apiClient.requestTableRow.keyLabel', { name: label ?? '' })\n \"\n :disabled=\"data.isReadonly\"\n :environment=\"environment\"\n :modelValue=\"name\"\n :placeholder=\"translate('apiClient.requestTableRow.key')\"\n :required=\"Boolean(data.isRequired)\"\n @blur=\"(v) => handleKeyBlur(v)\"\n @keydown.capture=\"handleKeydown\"\n @navigate=\"(route) => emit('navigate', route)\"\n @update:modelValue=\"(v) => handleUpdateRow({ name: v })\" />\n </DataTableCell>\n\n <!-- Value -->\n <DataTableCell>\n <!-- Preset switcher for grouped global cookies that share a name -->\n <DataTableInputSelect\n v-if=\"data.presetOptions?.length\"\n :canAddCustomValue=\"false\"\n :modelValue=\"displayValue\"\n :value=\"data.presetOptions\"\n @update:modelValue=\"(v) => emit('selectPreset', v)\" />\n <CodeInputLite\n v-else\n :aria-label=\"\n translate('apiClient.requestTableRow.valueLabel', {\n name: label ?? '',\n })\n \"\n class=\"pr-6 group-hover:pr-10 group-has-[.code-input-lite__editor:focus]:pr-10\"\n :default=\"defaultValue\"\n :disabled=\"data.isReadonly\"\n :enum=\"enumValue\"\n :environment=\"environment\"\n :examples=\"\n data.schema?.examples?.map((example) => String(example)) ?? []\n \"\n :linethrough=\"data.isOverridden\"\n :modelValue=\"displayValue\"\n :placeholder=\"translate('apiClient.requestTableRow.value')\"\n :type=\"typeValue\"\n withFakeData\n @navigate=\"(route) => emit('navigate', route)\"\n @update:modelValue=\"(v) => handleUpdateRow({ value: v })\">\n <template #icon>\n <ScalarButton\n v-if=\"\n Boolean(data.name || value) &&\n !data.isRequired &&\n data.isReadonly !== true\n \"\n :aria-label=\"\n translate('apiClient.requestTableRow.deleteRow', {\n name: data.name || translate('apiClient.requestTableRow.row'),\n })\n \"\n class=\"text-c-2 hover:text-c-1 hover:bg-b-2 z-context -mr-0.5 hidden h-fit rounded p-1 group-hover:flex group-has-[.code-input-lite__editor:focus]:flex\"\n size=\"sm\"\n variant=\"ghost\"\n @click=\"emit('deleteRow')\">\n <ScalarIconTrash class=\"size-3.5\" />\n </ScalarButton>\n\n <ScalarIconButton\n v-if=\"data.globalRoute !== undefined\"\n class=\"text-c-2 hover:text-c-1 hover:bg-b-2 z-context -mr-0.5 h-fit\"\n :icon=\"ScalarIconGlobe\"\n :label=\"translate('apiClient.requestTableRow.globalCookieHint')\"\n size=\"xs\"\n tooltip=\"top\"\n variant=\"ghost\"\n @click=\"emit('navigate', data.globalRoute)\" />\n\n <RequestTableTooltip\n v-if=\"data.isReadonly\"\n :description=\"translate('apiClient.requestTableRow.readOnlyHint')\"\n :value=\"null\" />\n <RequestTableTooltip\n v-else-if=\"data.schema\"\n :description=\"data.description\"\n :schema=\"data.schema\"\n :value />\n </template>\n </CodeInputLite>\n </DataTableCell>\n\n <!-- File upload -->\n <DataTableCell\n v-if=\"showUploadButton\"\n class=\"group/upload flex items-center justify-center whitespace-nowrap\">\n <template v-if=\"isFile\">\n <div\n class=\"text-c-2 flex w-full max-w-[100%] items-center justify-center overflow-hidden p-1\">\n <span\n class=\"truncate\"\n :title=\"displayValue\"\n >{{ displayValue }}</span\n >\n </div>\n <button\n class=\"bg-b-2 mt-1 block rounded p-0.5 text-center text-xs font-medium md:pointer-events-none md:absolute md:inset-x-1 md:top-1/2 md:mt-0 md:-translate-y-1/2 md:opacity-0 md:group-hover/upload:pointer-events-auto md:group-hover/upload:opacity-100\"\n type=\"button\"\n @click=\"emit('removeFile')\">\n {{ translate('apiClient.requestTableRow.delete') }}\n </button>\n </template>\n <template v-else>\n <div class=\"p-0.5\">\n <ScalarButton\n class=\"bg-b-2 hover:bg-b-3 text-c-2 h-fit border-0 py-px shadow-none\"\n size=\"sm\"\n variant=\"outlined\"\n @click=\"emit('uploadFile')\">\n <span>{{ translate('apiClient.requestTableRow.selectFile') }}</span>\n <ScalarIcon\n class=\"ml-1\"\n icon=\"Upload\"\n size=\"xs\"\n thickness=\"2.5\" />\n </ScalarButton>\n </div>\n </template>\n </DataTableCell>\n </DataTableRow>\n</template>\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"RequestTableRow.vue.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestTableRow.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton } from '@scalar/components/button'\nimport { ScalarIcon } from '@scalar/components/icon'\nimport { ScalarIconButton } from '@scalar/components/icon-button'\nimport { ScalarIconGlobe, ScalarIconTrash } from '@scalar/icons'\nimport type { ApiReferenceEvents } from '@scalar/workspace-store/events'\nimport { unpackProxyObject } from '@scalar/workspace-store/helpers/unpack-proxy'\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type {\n ParameterObject,\n SchemaObject,\n} from '@scalar/workspace-store/schemas/v3.2/strict/openapi-document'\nimport { computed, ref, watch } from 'vue'\n\nimport { getFileName } from '@/v2/blocks/request-block/helpers/files'\nimport { validateParameter } from '@/v2/blocks/request-block/helpers/validate-parameter'\nimport { CodeInputLite } from '@/v2/components/code-input'\nimport {\n DataTableCell,\n DataTableCheckbox,\n DataTableInputSelect,\n DataTableRow,\n} from '@/v2/components/data-table'\nimport { useLocalization } from '@/v2/features/localization'\n\nimport RequestTableTooltip from './RequestTableTooltip.vue'\n\nconst {\n data,\n environment,\n hasCheckboxDisabled,\n deferKeyUpdates,\n invalidParams,\n showUploadButton,\n} = defineProps<{\n data: TableRow\n /** Keep key edits local until blur when the row identity depends on its name. */\n deferKeyUpdates?: boolean\n hasCheckboxDisabled?: boolean\n invalidParams?: Set<string>\n label?: string\n environment: XScalarEnvironment\n showUploadButton?: boolean\n}>()\n\nconst emit = defineEmits<{\n (e: 'upsertRow', payload: TableRowUpsertPayload): void\n (e: 'deleteRow'): void\n (e: 'uploadFile'): void\n (e: 'removeFile'): void\n (e: 'navigate', route: NonNullable<TableRow['globalRoute']>): void\n /** Select a value for a grouped global cookie preset. */\n (e: 'selectPreset', value: string): void\n}>()\n\nconst { translate } = useLocalization()\n\nexport type TableRow = {\n /** The parameter or field name/key */\n name: string\n /** The parameter value, can be a string, file, or null */\n value: string | File | null\n /** Optional description for the parameter */\n description?: string\n /** Optional route for global parameters (e.g., cookies shared across workspace) */\n globalRoute?: ApiReferenceEvents['ui:navigate']\n /** Whether the parameter is disabled/inactive */\n isDisabled?: boolean\n /** Whether an optional parameter is disabled because it has no explicit x-disabled value */\n isDisabledByDefault?: boolean\n /** OpenAPI schema object with type, validation rules, examples, etc. */\n schema?: SchemaObject\n /** Preserve array values even while their JSON text is temporarily invalid. */\n isArray?: boolean\n /** Whether the parameter is required */\n isRequired?: boolean\n /**\n * Whether the parameter is readonly and can not be modifies directly\n * User can still override the parameter which is going to show up with the linethrough style\n */\n isReadonly?: boolean\n /** Whether the parameter is overridden later on */\n isOverridden?: boolean\n /** Track the original parameter so we can update it */\n originalParameter?: ParameterObject\n /** Path to a value inside the original parameter example for expanded object parameters */\n sourceParameterValuePath?: string[]\n /**\n * Selectable values for a grouped global cookie preset. When set, the value cell renders a\n * dropdown to switch between predefined values (for example a `Culture` cookie with `PL`/`EN`)\n * instead of an editable input.\n */\n presetOptions?: string[]\n}\n\nexport type TableRowUpsertPayload = {\n name: string\n value: string | File\n isDisabled: boolean\n shouldRenameExpandedRow?: boolean\n}\n\n/**\n * Track local state for the row\n *\n * Now this is required because of the way we get default values from the schema.\n * If we have a default value in data.value, then we update isDisabled to true. We lose the default value since now\n * we have an example where value: ''. This is why we need to track the local state and update all of the params at the\n * same time.\n */\nconst name = ref<string>(data.name ?? '')\nconst value = ref<string | File>(unpackProxyObject(data.value) ?? '')\nconst isDisabled = ref<boolean>(data.isDisabled ?? false)\n\n// Keep the above state synced with the data prop\nwatch(\n () => data.name,\n (newName) => {\n // Do not overwrite a valid local name with an empty incoming prop — this\n // can happen when the placeholder row (appended by displayData) is briefly\n // mapped onto this component instance before Vue re-keys the list.\n if (!newName && name.value && !deferKeyUpdates) return\n name.value = newName ?? ''\n },\n)\nwatch(\n () => data.value,\n (newValue) => (value.value = unpackProxyObject(newValue) ?? ''),\n)\nwatch(\n () => data.isDisabled,\n (newIsDisabled) => (isDisabled.value = newIsDisabled ?? false),\n)\n\n/** Check if the value is a File instance */\nconst isFile = computed(() => value.value instanceof File)\n\n/** Display value handles File instances and shows filename instead */\nconst displayValue = computed(\n () =>\n (isFile.value\n ? getFileName(value.value as File)\n : (value.value as string)) ?? '',\n)\n\nconst defaultValue = computed(() => data.schema?.default as string)\n\n/** See if we can extract enum values from the schema */\nconst enumValue = computed<string[]>(() => {\n if (!data.schema) {\n return []\n }\n\n // Grab the enum from the schema\n if (data.schema.enum) {\n return data.schema.enum.map((item) => String(item))\n }\n\n // Grab the enum from the items schema\n if ('items' in data.schema) {\n const resolved = resolve.schema(data.schema.items)\n if (resolved?.enum) {\n return resolved.enum.map((item) => String(item))\n }\n }\n\n return []\n})\n\nconst typeValue = computed(() =>\n data.schema && 'type' in data.schema ? data.schema.type : undefined,\n)\n\nconst validationResult = computed(() =>\n validateParameter(data.schema, value.value),\n)\n\n/** Handle row updates while preserving existing properties */\nconst handleUpdateRow = (\n payload: Partial<{ name: string; value: string; isDisabled: boolean }>,\n options: { shouldRenameExpandedRow?: boolean; commitKey?: boolean } = {},\n): void => {\n // Update our local state\n if (payload.name !== undefined) {\n name.value = payload.name\n }\n if (payload.value !== undefined) {\n value.value = payload.value\n\n // Optional parameters start unchecked, but entering a value expresses intent to send it.\n // Explicit x-disabled values stay unchanged so a deliberate opt-out is preserved.\n if (data.isDisabledByDefault) {\n isDisabled.value = false\n }\n }\n\n // Is disabled should only be updated when explicitly provided in the payload\n if (payload.isDisabled !== undefined) {\n isDisabled.value = payload.isDisabled\n }\n\n if (\n payload.name !== undefined &&\n (deferKeyUpdates || data.sourceParameterValuePath) &&\n !options.shouldRenameExpandedRow &&\n !options.commitKey\n ) {\n return\n }\n\n // Emit all of the local state\n emit('upsertRow', {\n name: name.value,\n value: value.value,\n isDisabled: isDisabled.value,\n ...(options.shouldRenameExpandedRow\n ? { shouldRenameExpandedRow: true }\n : {}),\n })\n}\n\n/**\n * Commit a key edit when the input loses focus. Body and expanded-object rows defer their rename to blur (see\n * handleUpdateRow), so we only emit when the key actually changed. Focusing and blurring the field\n * without typing should not re-emit the row or silently reset its disabled state. The current\n * disabled state is passed through so a renamed row keeps it.\n */\nconst handleKeyBlur = (newName: string): void => {\n if (newName === data.name) {\n return\n }\n // Do not emit an update that would blank the parameter name — this can fire\n // when CodeInputLite blurs before it has rendered its initial value.\n if (!newName && data.name && (!deferKeyUpdates || name.value !== '')) {\n return\n }\n\n handleUpdateRow(\n { name: newName, isDisabled: isDisabled.value },\n {\n shouldRenameExpandedRow: Boolean(data.sourceParameterValuePath),\n commitKey: true,\n },\n )\n}\n\n/** Save a pending body key before the send shortcut reaches the request handler. */\nconst handleKeydown = (event: KeyboardEvent): void => {\n if (\n deferKeyUpdates &&\n event.key === 'Enter' &&\n (event.metaKey || event.ctrlKey)\n ) {\n handleKeyBlur(name.value)\n }\n}\n</script>\n\n<template>\n <DataTableRow\n :id=\"data.name\"\n :class=\"{\n alert: validationResult.ok === false,\n error: validationResult.ok === false && invalidParams?.has(data.name),\n }\">\n <DataTableCheckbox\n :ariaLabel=\"\n translate('apiClient.requestTableRow.include', {\n name: data.name || translate('apiClient.requestTableRow.row'),\n })\n \"\n class=\"!border-r\"\n :disabled=\"hasCheckboxDisabled ?? false\"\n :modelValue=\"!isDisabled\"\n @update:modelValue=\"(v) => handleUpdateRow({ isDisabled: !v })\" />\n\n <!-- Name -->\n <DataTableCell>\n <CodeInputLite\n :aria-label=\"\n translate('apiClient.requestTableRow.keyLabel', { name: label ?? '' })\n \"\n :disabled=\"data.isReadonly\"\n :environment=\"environment\"\n :modelValue=\"name\"\n :placeholder=\"translate('apiClient.requestTableRow.key')\"\n :required=\"Boolean(data.isRequired)\"\n @blur=\"(v) => handleKeyBlur(v)\"\n @keydown.capture=\"handleKeydown\"\n @navigate=\"(route) => emit('navigate', route)\"\n @update:modelValue=\"(v) => handleUpdateRow({ name: v })\" />\n </DataTableCell>\n\n <!-- Value -->\n <DataTableCell>\n <!-- Preset switcher for grouped global cookies that share a name -->\n <DataTableInputSelect\n v-if=\"data.presetOptions?.length\"\n :canAddCustomValue=\"false\"\n :modelValue=\"displayValue\"\n :value=\"data.presetOptions\"\n @update:modelValue=\"(v) => emit('selectPreset', v)\" />\n <CodeInputLite\n v-else\n :aria-label=\"\n translate('apiClient.requestTableRow.valueLabel', {\n name: label ?? '',\n })\n \"\n class=\"pr-6 group-hover:pr-10 group-has-[.code-input-lite__editor:focus]:pr-10\"\n :default=\"defaultValue\"\n :disabled=\"data.isReadonly\"\n :enum=\"enumValue\"\n :environment=\"environment\"\n :examples=\"\n data.schema?.examples?.map((example) => String(example)) ?? []\n \"\n :linethrough=\"data.isOverridden\"\n :modelValue=\"displayValue\"\n :placeholder=\"translate('apiClient.requestTableRow.value')\"\n :type=\"typeValue\"\n withFakeData\n @navigate=\"(route) => emit('navigate', route)\"\n @update:modelValue=\"(v) => handleUpdateRow({ value: v })\">\n <template #icon>\n <ScalarButton\n v-if=\"\n Boolean(data.name || value) &&\n !data.isRequired &&\n data.isReadonly !== true\n \"\n :aria-label=\"\n translate('apiClient.requestTableRow.deleteRow', {\n name: data.name || translate('apiClient.requestTableRow.row'),\n })\n \"\n class=\"text-c-2 hover:text-c-1 hover:bg-b-2 z-context -mr-0.5 hidden h-fit rounded p-1 group-hover:flex group-has-[.code-input-lite__editor:focus]:flex\"\n size=\"sm\"\n variant=\"ghost\"\n @click=\"emit('deleteRow')\">\n <ScalarIconTrash class=\"size-3.5\" />\n </ScalarButton>\n\n <ScalarIconButton\n v-if=\"data.globalRoute !== undefined\"\n class=\"text-c-2 hover:text-c-1 hover:bg-b-2 z-context -mr-0.5 h-fit\"\n :icon=\"ScalarIconGlobe\"\n :label=\"translate('apiClient.requestTableRow.globalCookieHint')\"\n size=\"xs\"\n tooltip=\"top\"\n variant=\"ghost\"\n @click=\"emit('navigate', data.globalRoute)\" />\n\n <RequestTableTooltip\n v-if=\"data.isReadonly\"\n :description=\"translate('apiClient.requestTableRow.readOnlyHint')\"\n :value=\"null\" />\n <RequestTableTooltip\n v-else-if=\"data.schema\"\n :description=\"data.description\"\n :schema=\"data.schema\"\n :value />\n </template>\n </CodeInputLite>\n </DataTableCell>\n\n <!-- File upload -->\n <DataTableCell\n v-if=\"showUploadButton\"\n class=\"group/upload flex items-center justify-center whitespace-nowrap\">\n <template v-if=\"isFile\">\n <div\n class=\"text-c-2 flex w-full max-w-[100%] items-center justify-center overflow-hidden p-1\">\n <span\n class=\"truncate\"\n :title=\"displayValue\"\n >{{ displayValue }}</span\n >\n </div>\n <button\n class=\"bg-b-2 mt-1 block rounded p-0.5 text-center text-xs font-medium md:pointer-events-none md:absolute md:inset-x-1 md:top-1/2 md:mt-0 md:-translate-y-1/2 md:opacity-0 md:group-hover/upload:pointer-events-auto md:group-hover/upload:opacity-100\"\n type=\"button\"\n @click=\"emit('removeFile')\">\n {{ translate('apiClient.requestTableRow.delete') }}\n </button>\n </template>\n <template v-else>\n <div class=\"p-0.5\">\n <ScalarButton\n class=\"bg-b-2 hover:bg-b-3 text-c-2 h-fit border-0 py-px shadow-none\"\n size=\"sm\"\n variant=\"outlined\"\n @click=\"emit('uploadFile')\">\n <span>{{ translate('apiClient.requestTableRow.selectFile') }}</span>\n <ScalarIcon\n class=\"ml-1\"\n icon=\"Upload\"\n size=\"xs\"\n thickness=\"2.5\" />\n </ScalarButton>\n </div>\n </template>\n </DataTableCell>\n </DataTableRow>\n</template>\n"],"mappings":""}
|
|
@@ -55,7 +55,7 @@ var RequestTableRow_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
|
|
|
55
55
|
const value = ref(unpackProxyObject(__props.data.value) ?? "");
|
|
56
56
|
const isDisabled = ref(__props.data.isDisabled ?? false);
|
|
57
57
|
watch(() => __props.data.name, (newName) => {
|
|
58
|
-
if (!newName && name.value) return;
|
|
58
|
+
if (!newName && name.value && !__props.deferKeyUpdates) return;
|
|
59
59
|
name.value = newName ?? "";
|
|
60
60
|
});
|
|
61
61
|
watch(() => __props.data.value, (newValue) => value.value = unpackProxyObject(newValue) ?? "");
|
|
@@ -101,7 +101,7 @@ var RequestTableRow_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
|
|
|
101
101
|
*/
|
|
102
102
|
const handleKeyBlur = (newName) => {
|
|
103
103
|
if (newName === __props.data.name) return;
|
|
104
|
-
if (!newName && __props.data.name) return;
|
|
104
|
+
if (!newName && __props.data.name && (!__props.deferKeyUpdates || name.value !== "")) return;
|
|
105
105
|
handleUpdateRow({
|
|
106
106
|
name: newName,
|
|
107
107
|
isDisabled: isDisabled.value
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RequestTableRow.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestTableRow.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton } from '@scalar/components/button'\nimport { ScalarIcon } from '@scalar/components/icon'\nimport { ScalarIconButton } from '@scalar/components/icon-button'\nimport { ScalarIconGlobe, ScalarIconTrash } from '@scalar/icons'\nimport type { ApiReferenceEvents } from '@scalar/workspace-store/events'\nimport { unpackProxyObject } from '@scalar/workspace-store/helpers/unpack-proxy'\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type {\n ParameterObject,\n SchemaObject,\n} from '@scalar/workspace-store/schemas/v3.2/strict/openapi-document'\nimport { computed, ref, watch } from 'vue'\n\nimport { getFileName } from '@/v2/blocks/request-block/helpers/files'\nimport { validateParameter } from '@/v2/blocks/request-block/helpers/validate-parameter'\nimport { CodeInputLite } from '@/v2/components/code-input'\nimport {\n DataTableCell,\n DataTableCheckbox,\n DataTableInputSelect,\n DataTableRow,\n} from '@/v2/components/data-table'\nimport { useLocalization } from '@/v2/features/localization'\n\nimport RequestTableTooltip from './RequestTableTooltip.vue'\n\nconst {\n data,\n environment,\n hasCheckboxDisabled,\n deferKeyUpdates,\n invalidParams,\n showUploadButton,\n} = defineProps<{\n data: TableRow\n /** Keep key edits local until blur when the row identity depends on its name. */\n deferKeyUpdates?: boolean\n hasCheckboxDisabled?: boolean\n invalidParams?: Set<string>\n label?: string\n environment: XScalarEnvironment\n showUploadButton?: boolean\n}>()\n\nconst emit = defineEmits<{\n (e: 'upsertRow', payload: TableRowUpsertPayload): void\n (e: 'deleteRow'): void\n (e: 'uploadFile'): void\n (e: 'removeFile'): void\n (e: 'navigate', route: NonNullable<TableRow['globalRoute']>): void\n /** Select a value for a grouped global cookie preset. */\n (e: 'selectPreset', value: string): void\n}>()\n\nconst { translate } = useLocalization()\n\nexport type TableRow = {\n /** The parameter or field name/key */\n name: string\n /** The parameter value, can be a string, file, or null */\n value: string | File | null\n /** Optional description for the parameter */\n description?: string\n /** Optional route for global parameters (e.g., cookies shared across workspace) */\n globalRoute?: ApiReferenceEvents['ui:navigate']\n /** Whether the parameter is disabled/inactive */\n isDisabled?: boolean\n /** Whether an optional parameter is disabled because it has no explicit x-disabled value */\n isDisabledByDefault?: boolean\n /** OpenAPI schema object with type, validation rules, examples, etc. */\n schema?: SchemaObject\n /** Preserve array values even while their JSON text is temporarily invalid. */\n isArray?: boolean\n /** Whether the parameter is required */\n isRequired?: boolean\n /**\n * Whether the parameter is readonly and can not be modifies directly\n * User can still override the parameter which is going to show up with the linethrough style\n */\n isReadonly?: boolean\n /** Whether the parameter is overridden later on */\n isOverridden?: boolean\n /** Track the original parameter so we can update it */\n originalParameter?: ParameterObject\n /** Path to a value inside the original parameter example for expanded object parameters */\n sourceParameterValuePath?: string[]\n /**\n * Selectable values for a grouped global cookie preset. When set, the value cell renders a\n * dropdown to switch between predefined values (for example a `Culture` cookie with `PL`/`EN`)\n * instead of an editable input.\n */\n presetOptions?: string[]\n}\n\nexport type TableRowUpsertPayload = {\n name: string\n value: string | File\n isDisabled: boolean\n shouldRenameExpandedRow?: boolean\n}\n\n/**\n * Track local state for the row\n *\n * Now this is required because of the way we get default values from the schema.\n * If we have a default value in data.value, then we update isDisabled to true. We lose the default value since now\n * we have an example where value: ''. This is why we need to track the local state and update all of the params at the\n * same time.\n */\nconst name = ref<string>(data.name ?? '')\nconst value = ref<string | File>(unpackProxyObject(data.value) ?? '')\nconst isDisabled = ref<boolean>(data.isDisabled ?? false)\n\n// Keep the above state synced with the data prop\nwatch(\n () => data.name,\n (newName) => {\n // Do not overwrite a valid local name with an empty incoming prop — this\n // can happen when the placeholder row (appended by displayData) is briefly\n // mapped onto this component instance before Vue re-keys the list.\n if (!newName && name.value) return\n name.value = newName ?? ''\n },\n)\nwatch(\n () => data.value,\n (newValue) => (value.value = unpackProxyObject(newValue) ?? ''),\n)\nwatch(\n () => data.isDisabled,\n (newIsDisabled) => (isDisabled.value = newIsDisabled ?? false),\n)\n\n/** Check if the value is a File instance */\nconst isFile = computed(() => value.value instanceof File)\n\n/** Display value handles File instances and shows filename instead */\nconst displayValue = computed(\n () =>\n (isFile.value\n ? getFileName(value.value as File)\n : (value.value as string)) ?? '',\n)\n\nconst defaultValue = computed(() => data.schema?.default as string)\n\n/** See if we can extract enum values from the schema */\nconst enumValue = computed<string[]>(() => {\n if (!data.schema) {\n return []\n }\n\n // Grab the enum from the schema\n if (data.schema.enum) {\n return data.schema.enum.map((item) => String(item))\n }\n\n // Grab the enum from the items schema\n if ('items' in data.schema) {\n const resolved = resolve.schema(data.schema.items)\n if (resolved?.enum) {\n return resolved.enum.map((item) => String(item))\n }\n }\n\n return []\n})\n\nconst typeValue = computed(() =>\n data.schema && 'type' in data.schema ? data.schema.type : undefined,\n)\n\nconst validationResult = computed(() =>\n validateParameter(data.schema, value.value),\n)\n\n/** Handle row updates while preserving existing properties */\nconst handleUpdateRow = (\n payload: Partial<{ name: string; value: string; isDisabled: boolean }>,\n options: { shouldRenameExpandedRow?: boolean; commitKey?: boolean } = {},\n): void => {\n // Update our local state\n if (payload.name !== undefined) {\n name.value = payload.name\n }\n if (payload.value !== undefined) {\n value.value = payload.value\n\n // Optional parameters start unchecked, but entering a value expresses intent to send it.\n // Explicit x-disabled values stay unchanged so a deliberate opt-out is preserved.\n if (data.isDisabledByDefault) {\n isDisabled.value = false\n }\n }\n\n // Is disabled should only be updated when explicitly provided in the payload\n if (payload.isDisabled !== undefined) {\n isDisabled.value = payload.isDisabled\n }\n\n if (\n payload.name !== undefined &&\n (deferKeyUpdates || data.sourceParameterValuePath) &&\n !options.shouldRenameExpandedRow &&\n !options.commitKey\n ) {\n return\n }\n\n // Emit all of the local state\n emit('upsertRow', {\n name: name.value,\n value: value.value,\n isDisabled: isDisabled.value,\n ...(options.shouldRenameExpandedRow\n ? { shouldRenameExpandedRow: true }\n : {}),\n })\n}\n\n/**\n * Commit a key edit when the input loses focus. Body and expanded-object rows defer their rename to blur (see\n * handleUpdateRow), so we only emit when the key actually changed. Focusing and blurring the field\n * without typing should not re-emit the row or silently reset its disabled state. The current\n * disabled state is passed through so a renamed row keeps it.\n */\nconst handleKeyBlur = (newName: string): void => {\n if (newName === data.name) {\n return\n }\n // Do not emit an update that would blank the parameter name — this can fire\n // when CodeInputLite blurs before it has rendered its initial value.\n if (!newName && data.name) {\n return\n }\n\n handleUpdateRow(\n { name: newName, isDisabled: isDisabled.value },\n {\n shouldRenameExpandedRow: Boolean(data.sourceParameterValuePath),\n commitKey: true,\n },\n )\n}\n\n/** Save a pending body key before the send shortcut reaches the request handler. */\nconst handleKeydown = (event: KeyboardEvent): void => {\n if (\n deferKeyUpdates &&\n event.key === 'Enter' &&\n (event.metaKey || event.ctrlKey)\n ) {\n handleKeyBlur(name.value)\n }\n}\n</script>\n\n<template>\n <DataTableRow\n :id=\"data.name\"\n :class=\"{\n alert: validationResult.ok === false,\n error: validationResult.ok === false && invalidParams?.has(data.name),\n }\">\n <DataTableCheckbox\n :ariaLabel=\"\n translate('apiClient.requestTableRow.include', {\n name: data.name || translate('apiClient.requestTableRow.row'),\n })\n \"\n class=\"!border-r\"\n :disabled=\"hasCheckboxDisabled ?? false\"\n :modelValue=\"!isDisabled\"\n @update:modelValue=\"(v) => handleUpdateRow({ isDisabled: !v })\" />\n\n <!-- Name -->\n <DataTableCell>\n <CodeInputLite\n :aria-label=\"\n translate('apiClient.requestTableRow.keyLabel', { name: label ?? '' })\n \"\n :disabled=\"data.isReadonly\"\n :environment=\"environment\"\n :modelValue=\"name\"\n :placeholder=\"translate('apiClient.requestTableRow.key')\"\n :required=\"Boolean(data.isRequired)\"\n @blur=\"(v) => handleKeyBlur(v)\"\n @keydown.capture=\"handleKeydown\"\n @navigate=\"(route) => emit('navigate', route)\"\n @update:modelValue=\"(v) => handleUpdateRow({ name: v })\" />\n </DataTableCell>\n\n <!-- Value -->\n <DataTableCell>\n <!-- Preset switcher for grouped global cookies that share a name -->\n <DataTableInputSelect\n v-if=\"data.presetOptions?.length\"\n :canAddCustomValue=\"false\"\n :modelValue=\"displayValue\"\n :value=\"data.presetOptions\"\n @update:modelValue=\"(v) => emit('selectPreset', v)\" />\n <CodeInputLite\n v-else\n :aria-label=\"\n translate('apiClient.requestTableRow.valueLabel', {\n name: label ?? '',\n })\n \"\n class=\"pr-6 group-hover:pr-10 group-has-[.code-input-lite__editor:focus]:pr-10\"\n :default=\"defaultValue\"\n :disabled=\"data.isReadonly\"\n :enum=\"enumValue\"\n :environment=\"environment\"\n :examples=\"\n data.schema?.examples?.map((example) => String(example)) ?? []\n \"\n :linethrough=\"data.isOverridden\"\n :modelValue=\"displayValue\"\n :placeholder=\"translate('apiClient.requestTableRow.value')\"\n :type=\"typeValue\"\n withFakeData\n @navigate=\"(route) => emit('navigate', route)\"\n @update:modelValue=\"(v) => handleUpdateRow({ value: v })\">\n <template #icon>\n <ScalarButton\n v-if=\"\n Boolean(data.name || value) &&\n !data.isRequired &&\n data.isReadonly !== true\n \"\n :aria-label=\"\n translate('apiClient.requestTableRow.deleteRow', {\n name: data.name || translate('apiClient.requestTableRow.row'),\n })\n \"\n class=\"text-c-2 hover:text-c-1 hover:bg-b-2 z-context -mr-0.5 hidden h-fit rounded p-1 group-hover:flex group-has-[.code-input-lite__editor:focus]:flex\"\n size=\"sm\"\n variant=\"ghost\"\n @click=\"emit('deleteRow')\">\n <ScalarIconTrash class=\"size-3.5\" />\n </ScalarButton>\n\n <ScalarIconButton\n v-if=\"data.globalRoute !== undefined\"\n class=\"text-c-2 hover:text-c-1 hover:bg-b-2 z-context -mr-0.5 h-fit\"\n :icon=\"ScalarIconGlobe\"\n :label=\"translate('apiClient.requestTableRow.globalCookieHint')\"\n size=\"xs\"\n tooltip=\"top\"\n variant=\"ghost\"\n @click=\"emit('navigate', data.globalRoute)\" />\n\n <RequestTableTooltip\n v-if=\"data.isReadonly\"\n :description=\"translate('apiClient.requestTableRow.readOnlyHint')\"\n :value=\"null\" />\n <RequestTableTooltip\n v-else-if=\"data.schema\"\n :description=\"data.description\"\n :schema=\"data.schema\"\n :value />\n </template>\n </CodeInputLite>\n </DataTableCell>\n\n <!-- File upload -->\n <DataTableCell\n v-if=\"showUploadButton\"\n class=\"group/upload flex items-center justify-center whitespace-nowrap\">\n <template v-if=\"isFile\">\n <div\n class=\"text-c-2 flex w-full max-w-[100%] items-center justify-center overflow-hidden p-1\">\n <span\n class=\"truncate\"\n :title=\"displayValue\"\n >{{ displayValue }}</span\n >\n </div>\n <button\n class=\"bg-b-2 mt-1 block rounded p-0.5 text-center text-xs font-medium md:pointer-events-none md:absolute md:inset-x-1 md:top-1/2 md:mt-0 md:-translate-y-1/2 md:opacity-0 md:group-hover/upload:pointer-events-auto md:group-hover/upload:opacity-100\"\n type=\"button\"\n @click=\"emit('removeFile')\">\n {{ translate('apiClient.requestTableRow.delete') }}\n </button>\n </template>\n <template v-else>\n <div class=\"p-0.5\">\n <ScalarButton\n class=\"bg-b-2 hover:bg-b-3 text-c-2 h-fit border-0 py-px shadow-none\"\n size=\"sm\"\n variant=\"outlined\"\n @click=\"emit('uploadFile')\">\n <span>{{ translate('apiClient.requestTableRow.selectFile') }}</span>\n <ScalarIcon\n class=\"ml-1\"\n icon=\"Upload\"\n size=\"xs\"\n thickness=\"2.5\" />\n </ScalarButton>\n </div>\n </template>\n </DataTableCell>\n </DataTableRow>\n</template>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"RequestTableRow.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestTableRow.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton } from '@scalar/components/button'\nimport { ScalarIcon } from '@scalar/components/icon'\nimport { ScalarIconButton } from '@scalar/components/icon-button'\nimport { ScalarIconGlobe, ScalarIconTrash } from '@scalar/icons'\nimport type { ApiReferenceEvents } from '@scalar/workspace-store/events'\nimport { unpackProxyObject } from '@scalar/workspace-store/helpers/unpack-proxy'\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type {\n ParameterObject,\n SchemaObject,\n} from '@scalar/workspace-store/schemas/v3.2/strict/openapi-document'\nimport { computed, ref, watch } from 'vue'\n\nimport { getFileName } from '@/v2/blocks/request-block/helpers/files'\nimport { validateParameter } from '@/v2/blocks/request-block/helpers/validate-parameter'\nimport { CodeInputLite } from '@/v2/components/code-input'\nimport {\n DataTableCell,\n DataTableCheckbox,\n DataTableInputSelect,\n DataTableRow,\n} from '@/v2/components/data-table'\nimport { useLocalization } from '@/v2/features/localization'\n\nimport RequestTableTooltip from './RequestTableTooltip.vue'\n\nconst {\n data,\n environment,\n hasCheckboxDisabled,\n deferKeyUpdates,\n invalidParams,\n showUploadButton,\n} = defineProps<{\n data: TableRow\n /** Keep key edits local until blur when the row identity depends on its name. */\n deferKeyUpdates?: boolean\n hasCheckboxDisabled?: boolean\n invalidParams?: Set<string>\n label?: string\n environment: XScalarEnvironment\n showUploadButton?: boolean\n}>()\n\nconst emit = defineEmits<{\n (e: 'upsertRow', payload: TableRowUpsertPayload): void\n (e: 'deleteRow'): void\n (e: 'uploadFile'): void\n (e: 'removeFile'): void\n (e: 'navigate', route: NonNullable<TableRow['globalRoute']>): void\n /** Select a value for a grouped global cookie preset. */\n (e: 'selectPreset', value: string): void\n}>()\n\nconst { translate } = useLocalization()\n\nexport type TableRow = {\n /** The parameter or field name/key */\n name: string\n /** The parameter value, can be a string, file, or null */\n value: string | File | null\n /** Optional description for the parameter */\n description?: string\n /** Optional route for global parameters (e.g., cookies shared across workspace) */\n globalRoute?: ApiReferenceEvents['ui:navigate']\n /** Whether the parameter is disabled/inactive */\n isDisabled?: boolean\n /** Whether an optional parameter is disabled because it has no explicit x-disabled value */\n isDisabledByDefault?: boolean\n /** OpenAPI schema object with type, validation rules, examples, etc. */\n schema?: SchemaObject\n /** Preserve array values even while their JSON text is temporarily invalid. */\n isArray?: boolean\n /** Whether the parameter is required */\n isRequired?: boolean\n /**\n * Whether the parameter is readonly and can not be modifies directly\n * User can still override the parameter which is going to show up with the linethrough style\n */\n isReadonly?: boolean\n /** Whether the parameter is overridden later on */\n isOverridden?: boolean\n /** Track the original parameter so we can update it */\n originalParameter?: ParameterObject\n /** Path to a value inside the original parameter example for expanded object parameters */\n sourceParameterValuePath?: string[]\n /**\n * Selectable values for a grouped global cookie preset. When set, the value cell renders a\n * dropdown to switch between predefined values (for example a `Culture` cookie with `PL`/`EN`)\n * instead of an editable input.\n */\n presetOptions?: string[]\n}\n\nexport type TableRowUpsertPayload = {\n name: string\n value: string | File\n isDisabled: boolean\n shouldRenameExpandedRow?: boolean\n}\n\n/**\n * Track local state for the row\n *\n * Now this is required because of the way we get default values from the schema.\n * If we have a default value in data.value, then we update isDisabled to true. We lose the default value since now\n * we have an example where value: ''. This is why we need to track the local state and update all of the params at the\n * same time.\n */\nconst name = ref<string>(data.name ?? '')\nconst value = ref<string | File>(unpackProxyObject(data.value) ?? '')\nconst isDisabled = ref<boolean>(data.isDisabled ?? false)\n\n// Keep the above state synced with the data prop\nwatch(\n () => data.name,\n (newName) => {\n // Do not overwrite a valid local name with an empty incoming prop — this\n // can happen when the placeholder row (appended by displayData) is briefly\n // mapped onto this component instance before Vue re-keys the list.\n if (!newName && name.value && !deferKeyUpdates) return\n name.value = newName ?? ''\n },\n)\nwatch(\n () => data.value,\n (newValue) => (value.value = unpackProxyObject(newValue) ?? ''),\n)\nwatch(\n () => data.isDisabled,\n (newIsDisabled) => (isDisabled.value = newIsDisabled ?? false),\n)\n\n/** Check if the value is a File instance */\nconst isFile = computed(() => value.value instanceof File)\n\n/** Display value handles File instances and shows filename instead */\nconst displayValue = computed(\n () =>\n (isFile.value\n ? getFileName(value.value as File)\n : (value.value as string)) ?? '',\n)\n\nconst defaultValue = computed(() => data.schema?.default as string)\n\n/** See if we can extract enum values from the schema */\nconst enumValue = computed<string[]>(() => {\n if (!data.schema) {\n return []\n }\n\n // Grab the enum from the schema\n if (data.schema.enum) {\n return data.schema.enum.map((item) => String(item))\n }\n\n // Grab the enum from the items schema\n if ('items' in data.schema) {\n const resolved = resolve.schema(data.schema.items)\n if (resolved?.enum) {\n return resolved.enum.map((item) => String(item))\n }\n }\n\n return []\n})\n\nconst typeValue = computed(() =>\n data.schema && 'type' in data.schema ? data.schema.type : undefined,\n)\n\nconst validationResult = computed(() =>\n validateParameter(data.schema, value.value),\n)\n\n/** Handle row updates while preserving existing properties */\nconst handleUpdateRow = (\n payload: Partial<{ name: string; value: string; isDisabled: boolean }>,\n options: { shouldRenameExpandedRow?: boolean; commitKey?: boolean } = {},\n): void => {\n // Update our local state\n if (payload.name !== undefined) {\n name.value = payload.name\n }\n if (payload.value !== undefined) {\n value.value = payload.value\n\n // Optional parameters start unchecked, but entering a value expresses intent to send it.\n // Explicit x-disabled values stay unchanged so a deliberate opt-out is preserved.\n if (data.isDisabledByDefault) {\n isDisabled.value = false\n }\n }\n\n // Is disabled should only be updated when explicitly provided in the payload\n if (payload.isDisabled !== undefined) {\n isDisabled.value = payload.isDisabled\n }\n\n if (\n payload.name !== undefined &&\n (deferKeyUpdates || data.sourceParameterValuePath) &&\n !options.shouldRenameExpandedRow &&\n !options.commitKey\n ) {\n return\n }\n\n // Emit all of the local state\n emit('upsertRow', {\n name: name.value,\n value: value.value,\n isDisabled: isDisabled.value,\n ...(options.shouldRenameExpandedRow\n ? { shouldRenameExpandedRow: true }\n : {}),\n })\n}\n\n/**\n * Commit a key edit when the input loses focus. Body and expanded-object rows defer their rename to blur (see\n * handleUpdateRow), so we only emit when the key actually changed. Focusing and blurring the field\n * without typing should not re-emit the row or silently reset its disabled state. The current\n * disabled state is passed through so a renamed row keeps it.\n */\nconst handleKeyBlur = (newName: string): void => {\n if (newName === data.name) {\n return\n }\n // Do not emit an update that would blank the parameter name — this can fire\n // when CodeInputLite blurs before it has rendered its initial value.\n if (!newName && data.name && (!deferKeyUpdates || name.value !== '')) {\n return\n }\n\n handleUpdateRow(\n { name: newName, isDisabled: isDisabled.value },\n {\n shouldRenameExpandedRow: Boolean(data.sourceParameterValuePath),\n commitKey: true,\n },\n )\n}\n\n/** Save a pending body key before the send shortcut reaches the request handler. */\nconst handleKeydown = (event: KeyboardEvent): void => {\n if (\n deferKeyUpdates &&\n event.key === 'Enter' &&\n (event.metaKey || event.ctrlKey)\n ) {\n handleKeyBlur(name.value)\n }\n}\n</script>\n\n<template>\n <DataTableRow\n :id=\"data.name\"\n :class=\"{\n alert: validationResult.ok === false,\n error: validationResult.ok === false && invalidParams?.has(data.name),\n }\">\n <DataTableCheckbox\n :ariaLabel=\"\n translate('apiClient.requestTableRow.include', {\n name: data.name || translate('apiClient.requestTableRow.row'),\n })\n \"\n class=\"!border-r\"\n :disabled=\"hasCheckboxDisabled ?? false\"\n :modelValue=\"!isDisabled\"\n @update:modelValue=\"(v) => handleUpdateRow({ isDisabled: !v })\" />\n\n <!-- Name -->\n <DataTableCell>\n <CodeInputLite\n :aria-label=\"\n translate('apiClient.requestTableRow.keyLabel', { name: label ?? '' })\n \"\n :disabled=\"data.isReadonly\"\n :environment=\"environment\"\n :modelValue=\"name\"\n :placeholder=\"translate('apiClient.requestTableRow.key')\"\n :required=\"Boolean(data.isRequired)\"\n @blur=\"(v) => handleKeyBlur(v)\"\n @keydown.capture=\"handleKeydown\"\n @navigate=\"(route) => emit('navigate', route)\"\n @update:modelValue=\"(v) => handleUpdateRow({ name: v })\" />\n </DataTableCell>\n\n <!-- Value -->\n <DataTableCell>\n <!-- Preset switcher for grouped global cookies that share a name -->\n <DataTableInputSelect\n v-if=\"data.presetOptions?.length\"\n :canAddCustomValue=\"false\"\n :modelValue=\"displayValue\"\n :value=\"data.presetOptions\"\n @update:modelValue=\"(v) => emit('selectPreset', v)\" />\n <CodeInputLite\n v-else\n :aria-label=\"\n translate('apiClient.requestTableRow.valueLabel', {\n name: label ?? '',\n })\n \"\n class=\"pr-6 group-hover:pr-10 group-has-[.code-input-lite__editor:focus]:pr-10\"\n :default=\"defaultValue\"\n :disabled=\"data.isReadonly\"\n :enum=\"enumValue\"\n :environment=\"environment\"\n :examples=\"\n data.schema?.examples?.map((example) => String(example)) ?? []\n \"\n :linethrough=\"data.isOverridden\"\n :modelValue=\"displayValue\"\n :placeholder=\"translate('apiClient.requestTableRow.value')\"\n :type=\"typeValue\"\n withFakeData\n @navigate=\"(route) => emit('navigate', route)\"\n @update:modelValue=\"(v) => handleUpdateRow({ value: v })\">\n <template #icon>\n <ScalarButton\n v-if=\"\n Boolean(data.name || value) &&\n !data.isRequired &&\n data.isReadonly !== true\n \"\n :aria-label=\"\n translate('apiClient.requestTableRow.deleteRow', {\n name: data.name || translate('apiClient.requestTableRow.row'),\n })\n \"\n class=\"text-c-2 hover:text-c-1 hover:bg-b-2 z-context -mr-0.5 hidden h-fit rounded p-1 group-hover:flex group-has-[.code-input-lite__editor:focus]:flex\"\n size=\"sm\"\n variant=\"ghost\"\n @click=\"emit('deleteRow')\">\n <ScalarIconTrash class=\"size-3.5\" />\n </ScalarButton>\n\n <ScalarIconButton\n v-if=\"data.globalRoute !== undefined\"\n class=\"text-c-2 hover:text-c-1 hover:bg-b-2 z-context -mr-0.5 h-fit\"\n :icon=\"ScalarIconGlobe\"\n :label=\"translate('apiClient.requestTableRow.globalCookieHint')\"\n size=\"xs\"\n tooltip=\"top\"\n variant=\"ghost\"\n @click=\"emit('navigate', data.globalRoute)\" />\n\n <RequestTableTooltip\n v-if=\"data.isReadonly\"\n :description=\"translate('apiClient.requestTableRow.readOnlyHint')\"\n :value=\"null\" />\n <RequestTableTooltip\n v-else-if=\"data.schema\"\n :description=\"data.description\"\n :schema=\"data.schema\"\n :value />\n </template>\n </CodeInputLite>\n </DataTableCell>\n\n <!-- File upload -->\n <DataTableCell\n v-if=\"showUploadButton\"\n class=\"group/upload flex items-center justify-center whitespace-nowrap\">\n <template v-if=\"isFile\">\n <div\n class=\"text-c-2 flex w-full max-w-[100%] items-center justify-center overflow-hidden p-1\">\n <span\n class=\"truncate\"\n :title=\"displayValue\"\n >{{ displayValue }}</span\n >\n </div>\n <button\n class=\"bg-b-2 mt-1 block rounded p-0.5 text-center text-xs font-medium md:pointer-events-none md:absolute md:inset-x-1 md:top-1/2 md:mt-0 md:-translate-y-1/2 md:opacity-0 md:group-hover/upload:pointer-events-auto md:group-hover/upload:opacity-100\"\n type=\"button\"\n @click=\"emit('removeFile')\">\n {{ translate('apiClient.requestTableRow.delete') }}\n </button>\n </template>\n <template v-else>\n <div class=\"p-0.5\">\n <ScalarButton\n class=\"bg-b-2 hover:bg-b-3 text-c-2 h-fit border-0 py-px shadow-none\"\n size=\"sm\"\n variant=\"outlined\"\n @click=\"emit('uploadFile')\">\n <span>{{ translate('apiClient.requestTableRow.selectFile') }}</span>\n <ScalarIcon\n class=\"ml-1\"\n icon=\"Upload\"\n size=\"xs\"\n thickness=\"2.5\" />\n </ScalarButton>\n </div>\n </template>\n </DataTableCell>\n </DataTableRow>\n</template>\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-form-body-rows.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/request-block/helpers/get-form-body-rows.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,8DAA8D,CAAA;AAG/G,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,0DAA0D,CAAA;AAExF,eAAO,MAAM,cAAc,GAAI,OAAO,OAAO,WAQ5C,CAAA;AAED,MAAM,MAAM,OAAO,GAAG;IACpB,IAAI,EAAE,MAAM,EAAE,CAAA;IACd,MAAM,EAAE,YAAY,GAAG,SAAS,CAAA;IAChC,UAAU,EAAE,OAAO,CAAA;CACpB,CAAA;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,qBAAqB,GAChC,QAAQ,YAAY,EACpB,aAAY,MAAM,EAAO,EACzB,wBAAqB,KACpB,OAAO,EA6BT,CAAA;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,kBAAkB,GAC7B,SAAS,OAAO,EAChB,QAAQ,YAAY,GAAG,SAAS,EAChC,aAAY,MAAM,EAAO,KACxB;IAAE,IAAI,EAAE,MAAM,EAAE,CAAC;IAAC,KAAK,EAAE,OAAO,CAAA;CAAE,EAqCpC,CAAA;AAED,sFAAsF;AACtF,eAAO,MAAM,gBAAgB,GAAI,KAAK,QAAQ,KAAG,MAAM,GAAG,IAAI,GAAG,OAAO,EAAE,GAAG,SAG5E,CAAA;AAED,uGAAuG;AACvG,eAAO,MAAM,eAAe,GAC1B,SAAS,aAAa,GAAG,SAAS,GAAG,IAAI,EACzC,aAAa,MAAM,EACnB,iBAAiB,YAAY,KAC5B,QAAQ,
|
|
1
|
+
{"version":3,"file":"get-form-body-rows.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/request-block/helpers/get-form-body-rows.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,8DAA8D,CAAA;AAG/G,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,0DAA0D,CAAA;AAExF,eAAO,MAAM,cAAc,GAAI,OAAO,OAAO,WAQ5C,CAAA;AAED,MAAM,MAAM,OAAO,GAAG;IACpB,IAAI,EAAE,MAAM,EAAE,CAAA;IACd,MAAM,EAAE,YAAY,GAAG,SAAS,CAAA;IAChC,UAAU,EAAE,OAAO,CAAA;CACpB,CAAA;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,qBAAqB,GAChC,QAAQ,YAAY,EACpB,aAAY,MAAM,EAAO,EACzB,wBAAqB,KACpB,OAAO,EA6BT,CAAA;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,kBAAkB,GAC7B,SAAS,OAAO,EAChB,QAAQ,YAAY,GAAG,SAAS,EAChC,aAAY,MAAM,EAAO,KACxB;IAAE,IAAI,EAAE,MAAM,EAAE,CAAC;IAAC,KAAK,EAAE,OAAO,CAAA;CAAE,EAqCpC,CAAA;AAED,sFAAsF;AACtF,eAAO,MAAM,gBAAgB,GAAI,KAAK,QAAQ,KAAG,MAAM,GAAG,IAAI,GAAG,OAAO,EAAE,GAAG,SAG5E,CAAA;AAED,uGAAuG;AACvG,eAAO,MAAM,eAAe,GAC1B,SAAS,aAAa,GAAG,SAAS,GAAG,IAAI,EACzC,aAAa,MAAM,EACnB,iBAAiB,YAAY,KAC5B,QAAQ,EAyIV,CAAA"}
|
|
@@ -120,12 +120,14 @@ var getFormBodyRows = (example, contentType, formBodySchema) => {
|
|
|
120
120
|
if (Array.isArray(value)) return value.flatMap((exampleValue) => {
|
|
121
121
|
if (isObject(exampleValue)) {
|
|
122
122
|
const name = String(exampleValue.name);
|
|
123
|
-
|
|
123
|
+
return (contentType === "multipart/form-data" ? mapValue(name, exampleValue.value, Boolean(exampleValue.isDisabled), exampleValue.isArray === true) : [mapRow({
|
|
124
124
|
name,
|
|
125
125
|
value: exampleValue.value instanceof File ? exampleValue.value : String(exampleValue.value),
|
|
126
126
|
isDisabled: Boolean(exampleValue.isDisabled)
|
|
127
|
-
})
|
|
128
|
-
|
|
127
|
+
})]).map((row) => row.isDisabled && exampleValue.isDisabledByDefault === true ? {
|
|
128
|
+
...row,
|
|
129
|
+
isDisabledByDefault: true
|
|
130
|
+
} : row);
|
|
129
131
|
}
|
|
130
132
|
return {
|
|
131
133
|
name: "",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-form-body-rows.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/helpers/get-form-body-rows.ts"],"sourcesContent":["import { isObject } from '@scalar/helpers/object/is-object'\nimport { objectEntries } from '@scalar/helpers/object/object-entries'\nimport { coerceLeafValueToSchemaType } from '@scalar/workspace-store/request-example'\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type { ExampleObject, SchemaObject } from '@scalar/workspace-store/schemas/v3.2/strict/openapi-document'\nimport { isObjectSchema } from '@scalar/workspace-store/schemas/v3.2/strict/type-guards'\n\nimport type { TableRow } from '@/v2/blocks/request-block/components/RequestTableRow.vue'\n\nexport const stringifyValue = (value: unknown) => {\n if (value instanceof File) {\n return value.name\n }\n if (typeof value === 'object' && value !== null) {\n return JSON.stringify(value)\n }\n return String(value)\n}\n\nexport type LeafRow = {\n path: string[]\n schema: SchemaObject | undefined\n isRequired: boolean\n}\n\n/**\n * Walk a (possibly nested) object schema and collect one entry per leaf property.\n *\n * A \"leaf\" is any property whose resolved schema is not an `{ type: 'object' }` schema\n * with named `properties` — i.e. primitives, arrays, files, and `additionalProperties`\n * placeholders all stop the recursion. Object properties recurse, so the widget example\n * (`file` + `props.{name,description,created_at}`) yields four leaves.\n */\nexport const collectLeafProperties = (\n schema: SchemaObject,\n parentPath: string[] = [],\n parentRequired = true,\n): LeafRow[] => {\n // Nothing to walk if this is not an object schema or has no declared properties.\n if (!isObjectSchema(schema) || !schema.properties) {\n return []\n }\n\n // `required` is a list of property names on *this* schema, so build it once per level.\n const requiredSet = new Set(schema.required ?? [])\n const leaves: LeafRow[] = []\n\n for (const [key, rawChildSchema] of objectEntries(schema.properties)) {\n const childSchema = resolve.schema(rawChildSchema)\n const path = [...parentPath, String(key)]\n\n // A leaf is only required when *every* ancestor was also required — a non-required\n // parent makes the whole subtree optional regardless of inner `required` lists.\n const isRequired = parentRequired && requiredSet.has(String(key))\n\n // Nested objects with named properties recurse so each leaf gets its own row;\n // everything else (primitives, arrays, files, additionalProperties placeholders)\n // is treated as a leaf and stops the descent.\n if (childSchema && isObjectSchema(childSchema) && childSchema.properties) {\n leaves.push(...collectLeafProperties(childSchema, path, isRequired))\n } else {\n leaves.push({ path, schema: childSchema, isRequired })\n }\n }\n\n return leaves\n}\n\n/**\n * Walk a schema + example together and collect one row per leaf, including example-only\n * keys that the schema does not declare. Schema-declared properties come first in schema\n * order; extras present in the example follow in example order at each level.\n *\n * Unlike `collectLeafProperties` (which is schema-only and feeds the dotted-name index),\n * this walker drives what the user actually sees in the form: a row for every leaf the\n * example contains, even when the schema is partial or out of date.\n */\nexport const collectExampleRows = (\n example: unknown,\n schema: SchemaObject | undefined,\n parentPath: string[] = [],\n): { path: string[]; value: unknown }[] => {\n const rows: { path: string[]; value: unknown }[] = []\n const exampleEntries = isObject(example) ? objectEntries(example) : []\n const exampleByKey = new Map<string, unknown>(exampleEntries.map(([key, value]) => [String(key), value]))\n const declaredKeys = new Set<string>()\n const schemaProperties = schema && isObjectSchema(schema) ? (schema.properties ?? {}) : {}\n\n // Schema-declared properties first, in schema order. Nested object schemas recurse so\n // each leaf gets its own row; otherwise the schema-declared key is a leaf and uses the\n // matching example value (or `undefined` when the example does not provide one).\n for (const [key, rawChildSchema] of objectEntries(schemaProperties)) {\n const keyStr = String(key)\n declaredKeys.add(keyStr)\n const childSchema = resolve.schema(rawChildSchema)\n const path = [...parentPath, keyStr]\n const exampleSubvalue = exampleByKey.get(keyStr)\n\n if (childSchema && isObjectSchema(childSchema) && childSchema.properties) {\n rows.push(...collectExampleRows(exampleSubvalue, childSchema, path))\n } else {\n rows.push({ path, value: exampleSubvalue })\n }\n }\n\n // Example-only properties at this level (preserve example order). Their inner shape is\n // not descended into — without a schema saying \"this is a nested object\" we have no\n // signal to flatten, so an object value becomes a single JSON-stringified row, matching\n // the schema-less fallback below.\n for (const [key, value] of exampleEntries) {\n const keyStr = String(key)\n if (declaredKeys.has(keyStr)) {\n continue\n }\n rows.push({ path: [...parentPath, keyStr], value })\n }\n\n return rows\n}\n\n/** Restore array values after text editing without parsing ordinary string fields. */\nexport const getFormBodyValue = (row: TableRow): string | File | unknown[] | undefined => {\n const value = coerceLeafValueToSchemaType(row.value, row.isArray ? { type: 'array' } : row.schema)\n return Array.isArray(value) ? value : (row.value ?? undefined)\n}\n\n/** Build the table rows for the form data, optionally enriched with schema (e.g. enum) per property */\nexport const getFormBodyRows = (\n example: ExampleObject | undefined | null,\n contentType: string,\n formBodySchema?: SchemaObject,\n): TableRow[] => {\n // Forms use structured data even when the raw example also supplies wire text.\n const value = example?.dataValue !== undefined ? example.dataValue : example?.value\n // We only need the rows for formData\n if (!value || (contentType !== 'multipart/form-data' && contentType !== 'application/x-www-form-urlencoded')) {\n return []\n }\n\n // Get all the schema properties if the schema is an object schema\n const schemaWithProperties = formBodySchema && isObjectSchema(formBodySchema) ? formBodySchema : undefined\n // The request builder preserves composed fields because members can make them required.\n // Keep those fields checked so the initial form matches the body that will be sent.\n const isComposed = Boolean(schemaWithProperties?.allOf || schemaWithProperties?.oneOf || schemaWithProperties?.anyOf)\n const requiredSet = schemaWithProperties ? new Set(schemaWithProperties.required ?? []) : undefined\n\n // Pre-compute the leaf-by-dotted-name index up front so both the array and the\n // schema-driven branches can pull each row's leaf schema and required flag without\n // re-walking the schema. Without this, edited rows lose the per-leaf `Required`\n // badge because a top-level `properties[name]` lookup misses dotted names.\n const leafByDottedName = new Map<string, LeafRow>()\n if (schemaWithProperties) {\n for (const leaf of collectLeafProperties(schemaWithProperties)) {\n leafByDottedName.set(leaf.path.join('.'), leaf)\n }\n }\n\n const mapRow = ({\n name,\n value,\n isDisabled,\n }: {\n name: string\n value: string | File\n isDisabled?: boolean\n }): TableRow => {\n const row: TableRow = { name, value, isDisabled: isDisabled ?? false }\n if (!schemaWithProperties || !name) {\n return row\n }\n // Prefer the pre-resolved leaf (handles dotted names like `props.name`); fall back\n // to a top-level property lookup so user-added rows keep working.\n const leaf = leafByDottedName.get(name)\n const propSchema = leaf?.schema ?? resolve.schema(schemaWithProperties.properties?.[name])\n row.schema = propSchema\n row.description = propSchema?.description\n row.isRequired = leaf?.isRequired ?? requiredSet?.has(name) ?? false\n\n // Top-level optional properties default to disabled (unchecked), matching how optional\n // parameters behave. Scoped to top-level declared properties on purpose: the send side\n // (`build-request-body`) only drops top-level optional keys, so auto-disabling a nested\n // leaf (e.g. `props.name`) would leave it unchecked yet still transmitted. `Object.hasOwn`\n // (not `in`) keeps example-only keys named like `Object.prototype` members enabled. An\n // explicit `isDisabled` (from a stored form-row array) always wins.\n if (\n isDisabled === undefined &&\n !isComposed &&\n schemaWithProperties.properties &&\n Object.hasOwn(schemaWithProperties.properties, name)\n ) {\n row.isDisabled = !row.isRequired\n // Mark the row as disabled by default (no explicit `isDisabled` was stored) so typing a\n // value auto-enables it in `RequestTableRow`, matching how optional parameters behave. An\n // explicit `isDisabled` from a stored form-row array skips this branch and keeps winning.\n row.isDisabledByDefault = row.isDisabled\n }\n return row\n }\n\n const mapValue = (name: string, value: unknown, isDisabled?: boolean, isArray?: boolean): TableRow[] => {\n // Uploaded files must never pass through JSON.stringify, which discards their bytes.\n if (\n contentType === 'multipart/form-data' &&\n Array.isArray(value) &&\n value.length > 0 &&\n value.every((item) => item instanceof File)\n ) {\n return value.map((file) => mapRow({ name, value: file, isDisabled }))\n }\n const row = mapRow({\n name,\n value: value instanceof File ? value : value == null ? '' : stringifyValue(value),\n isDisabled,\n })\n if (contentType === 'multipart/form-data' && (Array.isArray(value) || isArray)) {\n // Example-only arrays also need their type to survive a form-table round trip.\n row.isArray = true\n }\n return [row]\n }\n\n // We have form data stored as an array\n if (Array.isArray(value)) {\n return value.flatMap((exampleValue) => {\n if (isObject(exampleValue)) {\n const name = String(exampleValue.name)\n if (contentType !== 'multipart/form-data') {\n return mapRow({\n name,\n value: exampleValue.value instanceof File ? exampleValue.value : String(exampleValue.value),\n isDisabled: Boolean(exampleValue.isDisabled),\n })\n }\n return mapValue(name, exampleValue.value, Boolean(exampleValue.isDisabled), exampleValue.isArray === true)\n }\n return { name: '', value: exampleValue, isDisabled: false }\n })\n }\n\n // Schema-driven path: when the form body schema describes nested objects, emit one row\n // per leaf so users can edit individual fields. The dotted name (`props.name`) is folded\n // back into a single JSON multipart part by `build-request-body.ts` before the request is\n // sent. Gated to `multipart/form-data` because urlencoded has no regrouping step on send,\n // so dotted leaves would otherwise reach the wire as separate `props.name`-style fields.\n //\n // We walk the example alongside the schema so example-only properties (top-level extras\n // or undeclared keys inside a nested object) are still visible and editable instead of\n // being silently dropped to whatever the schema happens to declare.\n if (contentType === 'multipart/form-data' && schemaWithProperties && typeof value === 'object') {\n return collectExampleRows(value, schemaWithProperties).flatMap(({ path, value }) => mapValue(path.join('.'), value))\n }\n\n // We got an object try to convert it to an array of rows\n if (typeof value === 'object' && value) {\n return objectEntries(value).flatMap(([key, value]) =>\n contentType === 'multipart/form-data'\n ? mapValue(String(key), value)\n : mapRow({ name: String(key), value: stringifyValue(value) }),\n )\n }\n\n return []\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"get-form-body-rows.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/helpers/get-form-body-rows.ts"],"sourcesContent":["import { isObject } from '@scalar/helpers/object/is-object'\nimport { objectEntries } from '@scalar/helpers/object/object-entries'\nimport { coerceLeafValueToSchemaType } from '@scalar/workspace-store/request-example'\nimport { resolve } from '@scalar/workspace-store/resolve'\nimport type { ExampleObject, SchemaObject } from '@scalar/workspace-store/schemas/v3.2/strict/openapi-document'\nimport { isObjectSchema } from '@scalar/workspace-store/schemas/v3.2/strict/type-guards'\n\nimport type { TableRow } from '@/v2/blocks/request-block/components/RequestTableRow.vue'\n\nexport const stringifyValue = (value: unknown) => {\n if (value instanceof File) {\n return value.name\n }\n if (typeof value === 'object' && value !== null) {\n return JSON.stringify(value)\n }\n return String(value)\n}\n\nexport type LeafRow = {\n path: string[]\n schema: SchemaObject | undefined\n isRequired: boolean\n}\n\n/**\n * Walk a (possibly nested) object schema and collect one entry per leaf property.\n *\n * A \"leaf\" is any property whose resolved schema is not an `{ type: 'object' }` schema\n * with named `properties` — i.e. primitives, arrays, files, and `additionalProperties`\n * placeholders all stop the recursion. Object properties recurse, so the widget example\n * (`file` + `props.{name,description,created_at}`) yields four leaves.\n */\nexport const collectLeafProperties = (\n schema: SchemaObject,\n parentPath: string[] = [],\n parentRequired = true,\n): LeafRow[] => {\n // Nothing to walk if this is not an object schema or has no declared properties.\n if (!isObjectSchema(schema) || !schema.properties) {\n return []\n }\n\n // `required` is a list of property names on *this* schema, so build it once per level.\n const requiredSet = new Set(schema.required ?? [])\n const leaves: LeafRow[] = []\n\n for (const [key, rawChildSchema] of objectEntries(schema.properties)) {\n const childSchema = resolve.schema(rawChildSchema)\n const path = [...parentPath, String(key)]\n\n // A leaf is only required when *every* ancestor was also required — a non-required\n // parent makes the whole subtree optional regardless of inner `required` lists.\n const isRequired = parentRequired && requiredSet.has(String(key))\n\n // Nested objects with named properties recurse so each leaf gets its own row;\n // everything else (primitives, arrays, files, additionalProperties placeholders)\n // is treated as a leaf and stops the descent.\n if (childSchema && isObjectSchema(childSchema) && childSchema.properties) {\n leaves.push(...collectLeafProperties(childSchema, path, isRequired))\n } else {\n leaves.push({ path, schema: childSchema, isRequired })\n }\n }\n\n return leaves\n}\n\n/**\n * Walk a schema + example together and collect one row per leaf, including example-only\n * keys that the schema does not declare. Schema-declared properties come first in schema\n * order; extras present in the example follow in example order at each level.\n *\n * Unlike `collectLeafProperties` (which is schema-only and feeds the dotted-name index),\n * this walker drives what the user actually sees in the form: a row for every leaf the\n * example contains, even when the schema is partial or out of date.\n */\nexport const collectExampleRows = (\n example: unknown,\n schema: SchemaObject | undefined,\n parentPath: string[] = [],\n): { path: string[]; value: unknown }[] => {\n const rows: { path: string[]; value: unknown }[] = []\n const exampleEntries = isObject(example) ? objectEntries(example) : []\n const exampleByKey = new Map<string, unknown>(exampleEntries.map(([key, value]) => [String(key), value]))\n const declaredKeys = new Set<string>()\n const schemaProperties = schema && isObjectSchema(schema) ? (schema.properties ?? {}) : {}\n\n // Schema-declared properties first, in schema order. Nested object schemas recurse so\n // each leaf gets its own row; otherwise the schema-declared key is a leaf and uses the\n // matching example value (or `undefined` when the example does not provide one).\n for (const [key, rawChildSchema] of objectEntries(schemaProperties)) {\n const keyStr = String(key)\n declaredKeys.add(keyStr)\n const childSchema = resolve.schema(rawChildSchema)\n const path = [...parentPath, keyStr]\n const exampleSubvalue = exampleByKey.get(keyStr)\n\n if (childSchema && isObjectSchema(childSchema) && childSchema.properties) {\n rows.push(...collectExampleRows(exampleSubvalue, childSchema, path))\n } else {\n rows.push({ path, value: exampleSubvalue })\n }\n }\n\n // Example-only properties at this level (preserve example order). Their inner shape is\n // not descended into — without a schema saying \"this is a nested object\" we have no\n // signal to flatten, so an object value becomes a single JSON-stringified row, matching\n // the schema-less fallback below.\n for (const [key, value] of exampleEntries) {\n const keyStr = String(key)\n if (declaredKeys.has(keyStr)) {\n continue\n }\n rows.push({ path: [...parentPath, keyStr], value })\n }\n\n return rows\n}\n\n/** Restore array values after text editing without parsing ordinary string fields. */\nexport const getFormBodyValue = (row: TableRow): string | File | unknown[] | undefined => {\n const value = coerceLeafValueToSchemaType(row.value, row.isArray ? { type: 'array' } : row.schema)\n return Array.isArray(value) ? value : (row.value ?? undefined)\n}\n\n/** Build the table rows for the form data, optionally enriched with schema (e.g. enum) per property */\nexport const getFormBodyRows = (\n example: ExampleObject | undefined | null,\n contentType: string,\n formBodySchema?: SchemaObject,\n): TableRow[] => {\n // Forms use structured data even when the raw example also supplies wire text.\n const value = example?.dataValue !== undefined ? example.dataValue : example?.value\n // We only need the rows for formData\n if (!value || (contentType !== 'multipart/form-data' && contentType !== 'application/x-www-form-urlencoded')) {\n return []\n }\n\n // Get all the schema properties if the schema is an object schema\n const schemaWithProperties = formBodySchema && isObjectSchema(formBodySchema) ? formBodySchema : undefined\n // The request builder preserves composed fields because members can make them required.\n // Keep those fields checked so the initial form matches the body that will be sent.\n const isComposed = Boolean(schemaWithProperties?.allOf || schemaWithProperties?.oneOf || schemaWithProperties?.anyOf)\n const requiredSet = schemaWithProperties ? new Set(schemaWithProperties.required ?? []) : undefined\n\n // Pre-compute the leaf-by-dotted-name index up front so both the array and the\n // schema-driven branches can pull each row's leaf schema and required flag without\n // re-walking the schema. Without this, edited rows lose the per-leaf `Required`\n // badge because a top-level `properties[name]` lookup misses dotted names.\n const leafByDottedName = new Map<string, LeafRow>()\n if (schemaWithProperties) {\n for (const leaf of collectLeafProperties(schemaWithProperties)) {\n leafByDottedName.set(leaf.path.join('.'), leaf)\n }\n }\n\n const mapRow = ({\n name,\n value,\n isDisabled,\n }: {\n name: string\n value: string | File\n isDisabled?: boolean\n }): TableRow => {\n const row: TableRow = { name, value, isDisabled: isDisabled ?? false }\n if (!schemaWithProperties || !name) {\n return row\n }\n // Prefer the pre-resolved leaf (handles dotted names like `props.name`); fall back\n // to a top-level property lookup so user-added rows keep working.\n const leaf = leafByDottedName.get(name)\n const propSchema = leaf?.schema ?? resolve.schema(schemaWithProperties.properties?.[name])\n row.schema = propSchema\n row.description = propSchema?.description\n row.isRequired = leaf?.isRequired ?? requiredSet?.has(name) ?? false\n\n // Top-level optional properties default to disabled (unchecked), matching how optional\n // parameters behave. Scoped to top-level declared properties on purpose: the send side\n // (`build-request-body`) only drops top-level optional keys, so auto-disabling a nested\n // leaf (e.g. `props.name`) would leave it unchecked yet still transmitted. `Object.hasOwn`\n // (not `in`) keeps example-only keys named like `Object.prototype` members enabled. An\n // explicit `isDisabled` (from a stored form-row array) always wins.\n if (\n isDisabled === undefined &&\n !isComposed &&\n schemaWithProperties.properties &&\n Object.hasOwn(schemaWithProperties.properties, name)\n ) {\n row.isDisabled = !row.isRequired\n // Mark the row as disabled by default (no explicit `isDisabled` was stored) so typing a\n // value auto-enables it in `RequestTableRow`, matching how optional parameters behave. An\n // explicit `isDisabled` from a stored form-row array skips this branch and keeps winning.\n row.isDisabledByDefault = row.isDisabled\n }\n return row\n }\n\n const mapValue = (name: string, value: unknown, isDisabled?: boolean, isArray?: boolean): TableRow[] => {\n // Uploaded files must never pass through JSON.stringify, which discards their bytes.\n if (\n contentType === 'multipart/form-data' &&\n Array.isArray(value) &&\n value.length > 0 &&\n value.every((item) => item instanceof File)\n ) {\n return value.map((file) => mapRow({ name, value: file, isDisabled }))\n }\n const row = mapRow({\n name,\n value: value instanceof File ? value : value == null ? '' : stringifyValue(value),\n isDisabled,\n })\n if (contentType === 'multipart/form-data' && (Array.isArray(value) || isArray)) {\n // Example-only arrays also need their type to survive a form-table round trip.\n row.isArray = true\n }\n return [row]\n }\n\n // We have form data stored as an array\n if (Array.isArray(value)) {\n return value.flatMap((exampleValue) => {\n if (isObject(exampleValue)) {\n const name = String(exampleValue.name)\n const rows =\n contentType === 'multipart/form-data'\n ? mapValue(name, exampleValue.value, Boolean(exampleValue.isDisabled), exampleValue.isArray === true)\n : [\n mapRow({\n name,\n value: exampleValue.value instanceof File ? exampleValue.value : String(exampleValue.value),\n isDisabled: Boolean(exampleValue.isDisabled),\n }),\n ]\n // An untouched optional row stays eligible for auto-enabling after another row is edited.\n return rows.map((row) =>\n row.isDisabled && exampleValue.isDisabledByDefault === true ? { ...row, isDisabledByDefault: true } : row,\n )\n }\n return { name: '', value: exampleValue, isDisabled: false }\n })\n }\n\n // Schema-driven path: when the form body schema describes nested objects, emit one row\n // per leaf so users can edit individual fields. The dotted name (`props.name`) is folded\n // back into a single JSON multipart part by `build-request-body.ts` before the request is\n // sent. Gated to `multipart/form-data` because urlencoded has no regrouping step on send,\n // so dotted leaves would otherwise reach the wire as separate `props.name`-style fields.\n //\n // We walk the example alongside the schema so example-only properties (top-level extras\n // or undeclared keys inside a nested object) are still visible and editable instead of\n // being silently dropped to whatever the schema happens to declare.\n if (contentType === 'multipart/form-data' && schemaWithProperties && typeof value === 'object') {\n return collectExampleRows(value, schemaWithProperties).flatMap(({ path, value }) => mapValue(path.join('.'), value))\n }\n\n // We got an object try to convert it to an array of rows\n if (typeof value === 'object' && value) {\n return objectEntries(value).flatMap(([key, value]) =>\n contentType === 'multipart/form-data'\n ? mapValue(String(key), value)\n : mapRow({ name: String(key), value: stringifyValue(value) }),\n )\n }\n\n return []\n}\n"],"mappings":";;;;;;AASA,IAAa,kBAAkB,UAAmB;CAChD,IAAI,iBAAiB,MACnB,OAAO,MAAM;CAEf,IAAI,OAAO,UAAU,YAAY,UAAU,MACzC,OAAO,KAAK,UAAU,KAAK;CAE7B,OAAO,OAAO,KAAK;AACrB;;;;;;;;;AAgBA,IAAa,yBACX,QACA,aAAuB,CAAC,GACxB,iBAAiB,SACH;CAEd,IAAI,CAAC,eAAe,MAAM,KAAK,CAAC,OAAO,YACrC,OAAO,CAAC;CAIV,MAAM,cAAc,IAAI,IAAI,OAAO,YAAY,CAAC,CAAC;CACjD,MAAM,SAAoB,CAAC;CAE3B,KAAK,MAAM,CAAC,KAAK,mBAAmB,cAAc,OAAO,UAAU,GAAG;EACpE,MAAM,cAAc,QAAQ,OAAO,cAAc;EACjD,MAAM,OAAO,CAAC,GAAG,YAAY,OAAO,GAAG,CAAC;EAIxC,MAAM,aAAa,kBAAkB,YAAY,IAAI,OAAO,GAAG,CAAC;EAKhE,IAAI,eAAe,eAAe,WAAW,KAAK,YAAY,YAC5D,OAAO,KAAK,GAAG,sBAAsB,aAAa,MAAM,UAAU,CAAC;OAEnE,OAAO,KAAK;GAAE;GAAM,QAAQ;GAAa;EAAW,CAAC;CAEzD;CAEA,OAAO;AACT;;;;;;;;;;AAWA,IAAa,sBACX,SACA,QACA,aAAuB,CAAC,MACiB;CACzC,MAAM,OAA6C,CAAC;CACpD,MAAM,iBAAiB,SAAS,OAAO,IAAI,cAAc,OAAO,IAAI,CAAC;CACrE,MAAM,eAAe,IAAI,IAAqB,eAAe,KAAK,CAAC,KAAK,WAAW,CAAC,OAAO,GAAG,GAAG,KAAK,CAAC,CAAC;CACxG,MAAM,+BAAe,IAAI,IAAY;CACrC,MAAM,mBAAmB,UAAU,eAAe,MAAM,IAAK,OAAO,cAAc,CAAC,IAAK,CAAC;CAKzF,KAAK,MAAM,CAAC,KAAK,mBAAmB,cAAc,gBAAgB,GAAG;EACnE,MAAM,SAAS,OAAO,GAAG;EACzB,aAAa,IAAI,MAAM;EACvB,MAAM,cAAc,QAAQ,OAAO,cAAc;EACjD,MAAM,OAAO,CAAC,GAAG,YAAY,MAAM;EACnC,MAAM,kBAAkB,aAAa,IAAI,MAAM;EAE/C,IAAI,eAAe,eAAe,WAAW,KAAK,YAAY,YAC5D,KAAK,KAAK,GAAG,mBAAmB,iBAAiB,aAAa,IAAI,CAAC;OAEnE,KAAK,KAAK;GAAE;GAAM,OAAO;EAAgB,CAAC;CAE9C;CAMA,KAAK,MAAM,CAAC,KAAK,UAAU,gBAAgB;EACzC,MAAM,SAAS,OAAO,GAAG;EACzB,IAAI,aAAa,IAAI,MAAM,GACzB;EAEF,KAAK,KAAK;GAAE,MAAM,CAAC,GAAG,YAAY,MAAM;GAAG;EAAM,CAAC;CACpD;CAEA,OAAO;AACT;;AAGA,IAAa,oBAAoB,QAAyD;CACxF,MAAM,QAAQ,4BAA4B,IAAI,OAAO,IAAI,UAAU,EAAE,MAAM,QAAQ,IAAI,IAAI,MAAM;CACjG,OAAO,MAAM,QAAQ,KAAK,IAAI,QAAS,IAAI,SAAS,KAAA;AACtD;;AAGA,IAAa,mBACX,SACA,aACA,mBACe;CAEf,MAAM,QAAQ,SAAS,cAAc,KAAA,IAAY,QAAQ,YAAY,SAAS;CAE9E,IAAI,CAAC,SAAU,gBAAgB,yBAAyB,gBAAgB,qCACtE,OAAO,CAAC;CAIV,MAAM,uBAAuB,kBAAkB,eAAe,cAAc,IAAI,iBAAiB,KAAA;CAGjG,MAAM,aAAa,QAAQ,sBAAsB,SAAS,sBAAsB,SAAS,sBAAsB,KAAK;CACpH,MAAM,cAAc,uBAAuB,IAAI,IAAI,qBAAqB,YAAY,CAAC,CAAC,IAAI,KAAA;CAM1F,MAAM,mCAAmB,IAAI,IAAqB;CAClD,IAAI,sBACF,KAAK,MAAM,QAAQ,sBAAsB,oBAAoB,GAC3D,iBAAiB,IAAI,KAAK,KAAK,KAAK,GAAG,GAAG,IAAI;CAIlD,MAAM,UAAU,EACd,MACA,OACA,iBAKc;EACd,MAAM,MAAgB;GAAE;GAAM;GAAO,YAAY,cAAc;EAAM;EACrE,IAAI,CAAC,wBAAwB,CAAC,MAC5B,OAAO;EAIT,MAAM,OAAO,iBAAiB,IAAI,IAAI;EACtC,MAAM,aAAa,MAAM,UAAU,QAAQ,OAAO,qBAAqB,aAAa,KAAK;EACzF,IAAI,SAAS;EACb,IAAI,cAAc,YAAY;EAC9B,IAAI,aAAa,MAAM,cAAc,aAAa,IAAI,IAAI,KAAK;EAQ/D,IACE,eAAe,KAAA,KACf,CAAC,cACD,qBAAqB,cACrB,OAAO,OAAO,qBAAqB,YAAY,IAAI,GACnD;GACA,IAAI,aAAa,CAAC,IAAI;GAItB,IAAI,sBAAsB,IAAI;EAChC;EACA,OAAO;CACT;CAEA,MAAM,YAAY,MAAc,OAAgB,YAAsB,YAAkC;EAEtG,IACE,gBAAgB,yBAChB,MAAM,QAAQ,KAAK,KACnB,MAAM,SAAS,KACf,MAAM,OAAO,SAAS,gBAAgB,IAAI,GAE1C,OAAO,MAAM,KAAK,SAAS,OAAO;GAAE;GAAM,OAAO;GAAM;EAAW,CAAC,CAAC;EAEtE,MAAM,MAAM,OAAO;GACjB;GACA,OAAO,iBAAiB,OAAO,QAAQ,SAAS,OAAO,KAAK,eAAe,KAAK;GAChF;EACF,CAAC;EACD,IAAI,gBAAgB,0BAA0B,MAAM,QAAQ,KAAK,KAAK,UAEpE,IAAI,UAAU;EAEhB,OAAO,CAAC,GAAG;CACb;CAGA,IAAI,MAAM,QAAQ,KAAK,GACrB,OAAO,MAAM,SAAS,iBAAiB;EACrC,IAAI,SAAS,YAAY,GAAG;GAC1B,MAAM,OAAO,OAAO,aAAa,IAAI;GAYrC,QAVE,gBAAgB,wBACZ,SAAS,MAAM,aAAa,OAAO,QAAQ,aAAa,UAAU,GAAG,aAAa,YAAY,IAAI,IAClG,CACE,OAAO;IACL;IACA,OAAO,aAAa,iBAAiB,OAAO,aAAa,QAAQ,OAAO,aAAa,KAAK;IAC1F,YAAY,QAAQ,aAAa,UAAU;GAC7C,CAAC,CACH,EAAA,CAEM,KAAK,QACf,IAAI,cAAc,aAAa,wBAAwB,OAAO;IAAE,GAAG;IAAK,qBAAqB;GAAK,IAAI,GACxG;EACF;EACA,OAAO;GAAE,MAAM;GAAI,OAAO;GAAc,YAAY;EAAM;CAC5D,CAAC;CAYH,IAAI,gBAAgB,yBAAyB,wBAAwB,OAAO,UAAU,UACpF,OAAO,mBAAmB,OAAO,oBAAoB,CAAC,CAAC,SAAS,EAAE,MAAM,YAAY,SAAS,KAAK,KAAK,GAAG,GAAG,KAAK,CAAC;CAIrH,IAAI,OAAO,UAAU,YAAY,OAC/B,OAAO,cAAc,KAAK,CAAC,CAAC,SAAS,CAAC,KAAK,WACzC,gBAAgB,wBACZ,SAAS,OAAO,GAAG,GAAG,KAAK,IAC3B,OAAO;EAAE,MAAM,OAAO,GAAG;EAAG,OAAO,eAAe,KAAK;CAAE,CAAC,CAChE;CAGF,OAAO,CAAC;AACV"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ResponseBlock.vue.d.ts","sourceRoot":"","sources":["../../../../src/v2/blocks/response-block/ResponseBlock.vue"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ResponseBlock.vue.d.ts","sourceRoot":"","sources":["../../../../src/v2/blocks/response-block/ResponseBlock.vue"],"names":[],"mappings":"AA0TA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAA;AAC7D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AACvE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,yCAAyC,CAAA;AAK7E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kDAAkD,CAAA;AAYxF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAErD,KAAK,WAAW,GAAG;IACf,qEAAqE;IACrE,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,4BAA4B;IAC5B,QAAQ,EAAE,gBAAgB,GAAG,IAAI,CAAA;IACjC,qDAAqD;IACrD,cAAc,EAAE,cAAc,GAAG,IAAI,CAAA;IACrC,oBAAoB;IACpB,MAAM,EAAE,YAAY,CAAA;IACpB,yCAAyC;IACzC,sBAAsB,EAAE,MAAM,CAAA;IAC9B,0BAA0B;IAC1B,UAAU,EAAE,MAAM,CAAA;IAClB,6BAA6B;IAC7B,OAAO,EAAE,YAAY,EAAE,CAAA;IACvB,0BAA0B;IAC1B,QAAQ,EAAE,iBAAiB,CAAA;CAC5B,CAAC;AA+BJ,QAAA,MAAM,gBAAgB,yCAA0C,CAAA;AAChE,KAAK,MAAM,GAAG,KAAK,GAAG,CAAC,OAAO,gBAAgB,CAAC,CAAC,MAAM,CAAC,CAAA;AAqbvD,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;oPAGhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
|
|
@@ -2,7 +2,7 @@ import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_exp
|
|
|
2
2
|
import ResponseBlock_vue_vue_type_script_setup_true_lang_default from "./ResponseBlock.vue.script.js";
|
|
3
3
|
/* empty css */
|
|
4
4
|
//#region src/v2/blocks/response-block/ResponseBlock.vue
|
|
5
|
-
var ResponseBlock_default = /*#__PURE__*/ _plugin_vue_export_helper_default(ResponseBlock_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-
|
|
5
|
+
var ResponseBlock_default = /*#__PURE__*/ _plugin_vue_export_helper_default(ResponseBlock_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-29000e66"]]);
|
|
6
6
|
//#endregion
|
|
7
7
|
export { ResponseBlock_default as default };
|
|
8
8
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ResponseBlock.vue.js","names":[],"sources":["../../../../src/v2/blocks/response-block/ResponseBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarErrorBoundary } from '@scalar/components/error-boundary'\nimport { isDefined } from '@scalar/helpers/array/is-defined'\nimport type { ClientPlugin } from '@scalar/oas-utils/helpers'\nimport type { WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport type { RequestPayload } from '@scalar/workspace-store/request-example'\nimport { computed, ref, useId } from 'vue'\n\nimport SectionFilter from '@/components/SectionFilter.vue'\nimport ViewLayoutSection from '@/components/ViewLayout/ViewLayoutSection.vue'\nimport type { ResponseInstance } from '@/v2/blocks/operation-block/helpers/send-request'\nimport HeadersComponent from '@/v2/blocks/response-block/components/Headers.vue'\nimport ResponseBody from '@/v2/blocks/response-block/components/ResponseBody.vue'\nimport ResponseBodyStreaming from '@/v2/blocks/response-block/components/ResponseBodyStreaming.vue'\nimport ResponseBodyVirtual from '@/v2/blocks/response-block/components/ResponseBodyVirtual.vue'\nimport ResponseCookies from '@/v2/blocks/response-block/components/ResponseCookies.vue'\nimport ResponseEmpty from '@/v2/blocks/response-block/components/ResponseEmpty.vue'\nimport ResponseLoadingOverlay from '@/v2/blocks/response-block/components/ResponseLoadingOverlay.vue'\nimport ResponseMetaInformation from '@/v2/blocks/response-block/components/ResponseMetaInformation.vue'\nimport { textMediaTypes } from '@/v2/blocks/response-block/helpers/media-types'\nimport { parseSetCookie } from '@/v2/blocks/response-block/helpers/parse-set-cookie'\nimport { useLocalization } from '@/v2/features/localization'\nimport type { ClientLayout } from '@/v2/types/layout'\n\nconst { layout, totalPerformedRequests, response, requestPayload } =\n defineProps<{\n /** Wait for the selected external request example before sending. */\n executionDisabled?: boolean\n /** Preprocessed response */\n response: ResponseInstance | null\n /** Original request as a [url, RequestInit] tuple */\n requestPayload: RequestPayload | null\n /** Client layout */\n layout: ClientLayout\n /** Total number of performed requests */\n totalPerformedRequests: number\n /** Application version */\n appVersion: string\n /** Registered app plugins */\n plugins: ClientPlugin[]\n /** Workspace event bus */\n eventBus: WorkspaceEventBus\n }>()\n\nconst { translate } = useLocalization()\n\n// Headers\nconst responseHeaders = computed(() => {\n const headers = response?.headers\n\n return headers\n ? Object.keys(headers).map((key) => ({\n name: key,\n value: headers[key] ?? '',\n }))\n : []\n})\n\nconst responseContentType = computed(\n () => response?.headers['content-type'] ?? response?.headers['Content-Type'],\n)\n\n// Cookies\nconst responseCookies = computed(\n () =>\n response?.cookieHeaderKeys\n .map((setCookieValue) => parseSetCookie(setCookieValue))\n .filter(isDefined) ?? [],\n)\n\nconst responseSections = ['Cookies', 'Headers', 'Body'] as const\ntype Filter = 'All' | (typeof responseSections)[number]\nconst activeFilter = ref<Filter>('All')\n\nconst filters = computed<Filter[]>(() => ['All', ...responseSections])\n\nconst filterIds = computed<Record<Filter, string>>(() => ({\n All: useId(),\n Cookies: useId(),\n Headers: useId(),\n Body: useId(),\n}))\n\n/** Threshold for virtualizing response bodies in bytes */\nconst VIRTUALIZATION_THRESHOLD = 200_000\nconst shouldVirtualize = computed(() => {\n if (!response || !('size' in response)) {\n return false\n }\n\n // Get content type from headers\n const contentType =\n response.headers?.['content-type'] || response.headers?.['Content-Type']\n\n // If no content type or response size is small, don't virtualize\n if (!contentType || (response.size ?? 0) <= VIRTUALIZATION_THRESHOLD) {\n return false\n }\n\n // Do not virtualize html\n if (contentType.includes('text/html')) {\n return false\n }\n\n // Check if content type matches any text-based type\n const isTextBased = textMediaTypes.some((type) => contentType.includes(type))\n\n return isTextBased && (response.size ?? 0) > VIRTUALIZATION_THRESHOLD\n})\n\nconst requestHeaders = computed(() => {\n const headers = requestPayload?.[1]?.headers\n if (!headers) {\n return []\n }\n\n // Normalise via the Headers constructor, and then spread\n return [...new Headers(headers)].map(([name, value]) => ({\n name,\n value,\n required: false,\n }))\n})\n\nconst isSectionVisible = (\n section: (typeof responseSections)[number] | 'All',\n) => {\n if (activeFilter.value === 'All' || activeFilter.value === section) {\n return true\n }\n return false\n}\n\ndefineExpose({\n responseHeaders,\n responseCookies,\n requestHeaders,\n shouldVirtualize,\n activeFilter,\n filters,\n})\n\nconst filterLabels = computed(() => ({\n All: translate('apiClient.sectionFilter.all'),\n Auth: translate('apiClient.sectionFilter.auth'),\n Variables: translate('apiClient.sectionFilter.variables'),\n Cookies: translate('apiClient.sectionFilter.cookies'),\n Headers: translate('apiClient.sectionFilter.headers'),\n Query: translate('apiClient.sectionFilter.query'),\n Body: translate('apiClient.sectionFilter.body'),\n}))\n</script>\n<template>\n <ViewLayoutSection\n :aria-label=\"translate('apiClient.responseBlock.response')\">\n <template #title>\n <div class=\"flex h-8 flex-1 items-center\">\n <div\n aria-live=\"polite\"\n class=\"flex items-center\"\n :class=\"{ 'animate-response-heading': response }\">\n <span class=\"response-heading pointer-events-none absolute\">{{\n translate('apiClient.responseBlock.response')\n }}</span>\n <ResponseMetaInformation\n v-if=\"response\"\n class=\"animate-response-children\"\n :eventBus=\"eventBus\"\n :response=\"response\" />\n </div>\n <SectionFilter\n v-model=\"activeFilter\"\n :filterIds=\"filterIds\"\n :filters=\"filters\"\n :labels=\"filterLabels\" />\n </div>\n </template>\n <div\n :id=\"filterIds.All\"\n class=\"custom-scroll response-section-content relative grid h-full justify-stretch\"\n :class=\"{\n 'content-start': response,\n }\"\n :role=\"activeFilter === 'All' && response ? 'tabpanel' : 'none'\">\n <template v-if=\"!response\">\n <ResponseEmpty\n :appVersion=\"appVersion\"\n :executionDisabled\n :layout=\"layout\"\n :totalPerformedRequests=\"totalPerformedRequests\"\n @addRequest=\"\n eventBus.emit('ui:open:command-palette', {\n action: 'create-request',\n payload: undefined,\n })\n \"\n @openCommandPalette=\"eventBus.emit('ui:open:command-palette')\"\n @sendRequest=\"eventBus.emit('operation:send:request:hotkey')\" />\n </template>\n <template v-else>\n <!-- Cookies section -->\n <ResponseCookies\n v-if=\"isSectionVisible('Cookies')\"\n :id=\"filterIds.Cookies\"\n class=\"response-section-content-cookies\"\n :cookies=\"responseCookies\"\n :role=\"activeFilter === 'All' ? 'none' : 'tabpanel'\" />\n <!-- Request headers section -->\n <HeadersComponent\n v-if=\"isSectionVisible('Headers')\"\n :id=\"filterIds.Headers\"\n class=\"response-section-content-headers\"\n :headers=\"requestHeaders\"\n :role=\"activeFilter === 'All' ? 'none' : 'tabpanel'\">\n <template #title>\n {{ translate('apiClient.responseBlock.requestHeaders') }}\n </template>\n </HeadersComponent>\n <!-- Response headers section -->\n <HeadersComponent\n v-if=\"isSectionVisible('Headers')\"\n :id=\"filterIds.Headers\"\n class=\"response-section-content-headers\"\n :headers=\"responseHeaders\"\n :role=\"activeFilter === 'All' ? 'none' : 'tabpanel'\">\n <template #title>\n {{ translate('apiClient.responseBlock.responseHeaders') }}\n </template>\n </HeadersComponent>\n\n <!-- Inject response section plugin components -->\n <ScalarErrorBoundary\n v-for=\"(plugin, index) in plugins\"\n :key=\"index\">\n <component\n :is=\"plugin.components.response.component\"\n v-if=\"plugin?.components?.response\"\n v-show=\"activeFilter === 'All'\"\n v-bind=\"plugin.components.response.additionalProps\" />\n </ScalarErrorBoundary>\n\n <template v-if=\"activeFilter === 'All' || activeFilter === 'Body'\">\n <!-- Streaming response body -->\n <ResponseBodyStreaming\n v-if=\"'reader' in response\"\n :id=\"filterIds.Body\"\n class=\"response-section-content-body\"\n :contentType=\"responseContentType\"\n :reader=\"response.reader\" />\n\n <!-- Virtualized Text for massive responses -->\n <ResponseBodyVirtual\n v-else-if=\"shouldVirtualize && typeof response?.data === 'string'\"\n :id=\"filterIds.Body\"\n :content=\"response!.data\"\n :data=\"response?.data\"\n :headers=\"responseHeaders\"\n :role=\"activeFilter === 'All' ? 'none' : 'tabpanel'\" />\n\n <!-- Regular response body -->\n <ResponseBody\n v-else\n :id=\"filterIds.Body\"\n :active=\"true\"\n class=\"response-section-content-body\"\n :data=\"response?.data\"\n :headers=\"responseHeaders\"\n layout=\"client\"\n :plugins=\"plugins\"\n :role=\"activeFilter === 'All' ? 'none' : 'tabpanel'\"\n :title=\"translate('apiClient.responseBlock.body')\" />\n </template>\n </template>\n <ResponseLoadingOverlay :eventBus=\"eventBus\" />\n </div>\n </ViewLayoutSection>\n</template>\n<style scoped>\n.animate-response-heading .response-heading {\n animation: push-response 0.2s ease-in-out forwards;\n opacity: 1;\n}\n@keyframes push-response {\n from {\n opacity: 1;\n transform: translateY(0);\n }\n to {\n opacity: 0;\n transform: translateY(-4px);\n }\n}\n.animate-response-heading .animate-response-children {\n animation: response-spans 0.2s ease-in-out forwards 0.05s;\n opacity: 0;\n}\n\n@keyframes response-spans {\n from {\n opacity: 0;\n transform: translateY(4px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n</style>\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"ResponseBlock.vue.js","names":[],"sources":["../../../../src/v2/blocks/response-block/ResponseBlock.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarErrorBoundary } from '@scalar/components/error-boundary'\nimport { isDefined } from '@scalar/helpers/array/is-defined'\nimport type { ClientPlugin } from '@scalar/oas-utils/helpers'\nimport type { WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport type { RequestPayload } from '@scalar/workspace-store/request-example'\nimport { computed, ref, useId } from 'vue'\n\nimport SectionFilter from '@/components/SectionFilter.vue'\nimport ViewLayoutSection from '@/components/ViewLayout/ViewLayoutSection.vue'\nimport type { ResponseInstance } from '@/v2/blocks/operation-block/helpers/send-request'\nimport HeadersComponent from '@/v2/blocks/response-block/components/Headers.vue'\nimport ResponseBody from '@/v2/blocks/response-block/components/ResponseBody.vue'\nimport ResponseBodyStreaming from '@/v2/blocks/response-block/components/ResponseBodyStreaming.vue'\nimport ResponseBodyVirtual from '@/v2/blocks/response-block/components/ResponseBodyVirtual.vue'\nimport ResponseCookies from '@/v2/blocks/response-block/components/ResponseCookies.vue'\nimport ResponseEmpty from '@/v2/blocks/response-block/components/ResponseEmpty.vue'\nimport ResponseLoadingOverlay from '@/v2/blocks/response-block/components/ResponseLoadingOverlay.vue'\nimport ResponseMetaInformation from '@/v2/blocks/response-block/components/ResponseMetaInformation.vue'\nimport { textMediaTypes } from '@/v2/blocks/response-block/helpers/media-types'\nimport { parseSetCookie } from '@/v2/blocks/response-block/helpers/parse-set-cookie'\nimport { useLocalization } from '@/v2/features/localization'\nimport type { ClientLayout } from '@/v2/types/layout'\n\nconst { layout, totalPerformedRequests, response, requestPayload } =\n defineProps<{\n /** Wait for the selected external request example before sending. */\n executionDisabled?: boolean\n /** Preprocessed response */\n response: ResponseInstance | null\n /** Original request as a [url, RequestInit] tuple */\n requestPayload: RequestPayload | null\n /** Client layout */\n layout: ClientLayout\n /** Total number of performed requests */\n totalPerformedRequests: number\n /** Application version */\n appVersion: string\n /** Registered app plugins */\n plugins: ClientPlugin[]\n /** Workspace event bus */\n eventBus: WorkspaceEventBus\n }>()\n\nconst { translate } = useLocalization()\n\n// Headers\nconst responseHeaders = computed(() => {\n const headers = response?.headers\n\n return headers\n ? Object.keys(headers).map((key) => ({\n name: key,\n value: headers[key] ?? '',\n }))\n : []\n})\n\nconst responseContentType = computed(\n () => response?.headers['content-type'] ?? response?.headers['Content-Type'],\n)\n\n// Cookies\nconst responseCookies = computed(\n () =>\n response?.cookieHeaderKeys\n .map((setCookieValue) => parseSetCookie(setCookieValue))\n .filter(isDefined) ?? [],\n)\n\nconst responseSections = ['Cookies', 'Headers', 'Body'] as const\ntype Filter = 'All' | (typeof responseSections)[number]\nconst activeFilter = ref<Filter>('All')\n\nconst filters = computed<Filter[]>(() => ['All', ...responseSections])\n\nconst filterIds = computed<Record<Filter, string>>(() => ({\n All: useId(),\n Cookies: useId(),\n Headers: useId(),\n Body: useId(),\n}))\n\n/** Threshold for virtualizing response bodies in bytes */\nconst VIRTUALIZATION_THRESHOLD = 200_000\nconst shouldVirtualize = computed(() => {\n if (!response || !('size' in response)) {\n return false\n }\n\n // Get content type from headers\n const contentType =\n response.headers?.['content-type'] || response.headers?.['Content-Type']\n\n // If no content type or response size is small, don't virtualize\n if (!contentType || (response.size ?? 0) <= VIRTUALIZATION_THRESHOLD) {\n return false\n }\n\n // Do not virtualize html\n if (contentType.includes('text/html')) {\n return false\n }\n\n // Check if content type matches any text-based type\n const isTextBased = textMediaTypes.some((type) => contentType.includes(type))\n\n return isTextBased && (response.size ?? 0) > VIRTUALIZATION_THRESHOLD\n})\n\nconst requestHeaders = computed(() => {\n const headers = requestPayload?.[1]?.headers\n if (!headers) {\n return []\n }\n\n // Normalise via the Headers constructor, and then spread\n return [...new Headers(headers)].map(([name, value]) => ({\n name,\n value,\n required: false,\n }))\n})\n\nconst isSectionVisible = (\n section: (typeof responseSections)[number] | 'All',\n) => {\n if (activeFilter.value === 'All' || activeFilter.value === section) {\n return true\n }\n return false\n}\n\ndefineExpose({\n responseHeaders,\n responseCookies,\n requestHeaders,\n shouldVirtualize,\n activeFilter,\n filters,\n})\n\nconst filterLabels = computed(() => ({\n All: translate('apiClient.sectionFilter.all'),\n Auth: translate('apiClient.sectionFilter.auth'),\n Variables: translate('apiClient.sectionFilter.variables'),\n Cookies: translate('apiClient.sectionFilter.cookies'),\n Headers: translate('apiClient.sectionFilter.headers'),\n Query: translate('apiClient.sectionFilter.query'),\n Body: translate('apiClient.sectionFilter.body'),\n}))\n</script>\n<template>\n <!-- Bound the stacked response section so long bodies keep their own scroll area. -->\n <ViewLayoutSection\n :aria-label=\"translate('apiClient.responseBlock.response')\"\n class=\"max-xl:max-h-full\">\n <template #title>\n <div class=\"flex h-8 flex-1 items-center\">\n <div\n aria-live=\"polite\"\n class=\"flex items-center\"\n :class=\"{ 'animate-response-heading': response }\">\n <span class=\"response-heading pointer-events-none absolute\">{{\n translate('apiClient.responseBlock.response')\n }}</span>\n <ResponseMetaInformation\n v-if=\"response\"\n class=\"animate-response-children\"\n :eventBus=\"eventBus\"\n :response=\"response\" />\n </div>\n <SectionFilter\n v-model=\"activeFilter\"\n :filters=\"filters\"\n :labels=\"filterLabels\" />\n </div>\n </template>\n <div\n :id=\"filterIds.All\"\n class=\"custom-scroll response-section-content relative grid h-full justify-stretch\"\n :class=\"{\n 'content-start': response,\n }\"\n :role=\"activeFilter === 'All' && response ? 'tabpanel' : 'none'\">\n <template v-if=\"!response\">\n <ResponseEmpty\n :appVersion=\"appVersion\"\n :executionDisabled\n :layout=\"layout\"\n :totalPerformedRequests=\"totalPerformedRequests\"\n @addRequest=\"\n eventBus.emit('ui:open:command-palette', {\n action: 'create-request',\n payload: undefined,\n })\n \"\n @openCommandPalette=\"eventBus.emit('ui:open:command-palette')\"\n @sendRequest=\"eventBus.emit('operation:send:request:hotkey')\" />\n </template>\n <template v-else>\n <!-- Cookies section -->\n <ResponseCookies\n v-if=\"isSectionVisible('Cookies')\"\n :id=\"filterIds.Cookies\"\n class=\"response-section-content-cookies\"\n :cookies=\"responseCookies\"\n :role=\"activeFilter === 'All' ? 'none' : 'tabpanel'\" />\n <!-- Request headers section -->\n <HeadersComponent\n v-if=\"isSectionVisible('Headers')\"\n :id=\"filterIds.Headers\"\n class=\"response-section-content-headers\"\n :headers=\"requestHeaders\"\n :role=\"activeFilter === 'All' ? 'none' : 'tabpanel'\">\n <template #title>\n {{ translate('apiClient.responseBlock.requestHeaders') }}\n </template>\n </HeadersComponent>\n <!-- Response headers section -->\n <HeadersComponent\n v-if=\"isSectionVisible('Headers')\"\n :id=\"filterIds.Headers\"\n class=\"response-section-content-headers\"\n :headers=\"responseHeaders\"\n :role=\"activeFilter === 'All' ? 'none' : 'tabpanel'\">\n <template #title>\n {{ translate('apiClient.responseBlock.responseHeaders') }}\n </template>\n </HeadersComponent>\n\n <!-- Inject response section plugin components -->\n <ScalarErrorBoundary\n v-for=\"(plugin, index) in plugins\"\n :key=\"index\">\n <component\n :is=\"plugin.components.response.component\"\n v-if=\"plugin?.components?.response\"\n v-show=\"activeFilter === 'All'\"\n v-bind=\"plugin.components.response.additionalProps\" />\n </ScalarErrorBoundary>\n\n <template v-if=\"activeFilter === 'All' || activeFilter === 'Body'\">\n <!-- Streaming response body -->\n <ResponseBodyStreaming\n v-if=\"'reader' in response\"\n :id=\"filterIds.Body\"\n class=\"response-section-content-body\"\n :contentType=\"responseContentType\"\n :reader=\"response.reader\" />\n\n <!-- Virtualized Text for massive responses -->\n <ResponseBodyVirtual\n v-else-if=\"shouldVirtualize && typeof response?.data === 'string'\"\n :id=\"filterIds.Body\"\n :content=\"response!.data\"\n :data=\"response?.data\"\n :headers=\"responseHeaders\"\n :role=\"activeFilter === 'All' ? 'none' : 'tabpanel'\" />\n\n <!-- Regular response body -->\n <ResponseBody\n v-else\n :id=\"filterIds.Body\"\n :active=\"true\"\n class=\"response-section-content-body\"\n :data=\"response?.data\"\n :headers=\"responseHeaders\"\n layout=\"client\"\n :plugins=\"plugins\"\n :role=\"activeFilter === 'All' ? 'none' : 'tabpanel'\"\n :title=\"translate('apiClient.responseBlock.body')\" />\n </template>\n </template>\n <ResponseLoadingOverlay :eventBus=\"eventBus\" />\n </div>\n </ViewLayoutSection>\n</template>\n<style scoped>\n.animate-response-heading .response-heading {\n animation: push-response 0.2s ease-in-out forwards;\n opacity: 1;\n}\n@keyframes push-response {\n from {\n opacity: 1;\n transform: translateY(0);\n }\n to {\n opacity: 0;\n transform: translateY(-4px);\n }\n}\n.animate-response-heading .animate-response-children {\n animation: response-spans 0.2s ease-in-out forwards 0.05s;\n opacity: 0;\n}\n\n@keyframes response-spans {\n from {\n opacity: 0;\n transform: translateY(4px);\n }\n to {\n opacity: 1;\n transform: translateY(0);\n }\n}\n</style>\n"],"mappings":""}
|
|
@@ -94,7 +94,10 @@ var ResponseBlock_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
|
|
|
94
94
|
Body: translate("apiClient.sectionFilter.body")
|
|
95
95
|
}));
|
|
96
96
|
return (_ctx, _cache) => {
|
|
97
|
-
return openBlock(), createBlock(ViewLayoutSection_default, {
|
|
97
|
+
return openBlock(), createBlock(ViewLayoutSection_default, {
|
|
98
|
+
"aria-label": unref(translate)("apiClient.responseBlock.response"),
|
|
99
|
+
class: "max-xl:max-h-full"
|
|
100
|
+
}, {
|
|
98
101
|
title: withCtx(() => [createElementVNode("div", _hoisted_1, [createElementVNode("div", {
|
|
99
102
|
"aria-live": "polite",
|
|
100
103
|
class: normalizeClass(["flex items-center", { "animate-response-heading": __props.response }])
|
|
@@ -106,12 +109,10 @@ var ResponseBlock_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
|
|
|
106
109
|
}, null, 8, ["eventBus", "response"])) : createCommentVNode("", true)], 2), createVNode(SectionFilter_default, {
|
|
107
110
|
modelValue: activeFilter.value,
|
|
108
111
|
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => activeFilter.value = $event),
|
|
109
|
-
filterIds: filterIds.value,
|
|
110
112
|
filters: filters.value,
|
|
111
113
|
labels: filterLabels.value
|
|
112
114
|
}, null, 8, [
|
|
113
115
|
"modelValue",
|
|
114
|
-
"filterIds",
|
|
115
116
|
"filters",
|
|
116
117
|
"labels"
|
|
117
118
|
])])]),
|