@scalar/api-client 3.1.0 → 3.2.0

package/dist/v2/blocks/request-block/components/RequestTableRow.vue.js.map

@@ -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, ScalarIcon, ScalarIconButton } from '@scalar/components'\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.1/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 { CodeInput } from '@/v2/components/code-input'\nimport {\n  DataTableCell,\n  DataTableCheckbox,\n  DataTableRow,\n} from '@/v2/components/data-table'\n\nimport RequestTableTooltip from './RequestTableTooltip.vue'\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  /** OpenAPI schema object with type, validation rules, examples, etc. */\n  schema?: SchemaObject\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}\n\nconst {\n  data,\n  environment,\n  hasCheckboxDisabled,\n  invalidParams,\n  showUploadButton,\n} = defineProps<{\n  data: TableRow\n  hasCheckboxDisabled?: boolean\n  invalidParams?: Set<string>\n  label?: string\n  environment: XScalarEnvironment\n  showUploadButton?: boolean\n}>()\n\nconst emit = defineEmits<{\n  (\n    e: 'upsertRow',\n    payload: { name: string; value: string | File; isDisabled: boolean },\n  ): void\n  (e: 'deleteRow'): void\n  (e: 'uploadFile'): void\n  (e: 'removeFile'): void\n  (e: 'navigate', route: NonNullable<TableRow['globalRoute']>): void\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) => (name.value = newName ?? ''),\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 minimumValue = computed(() =>\n  data.schema && 'minimum' in data.schema ? data.schema.minimum : undefined,\n)\nconst maximumValue = computed(() =>\n  data.schema && 'maximum' in data.schema ? data.schema.maximum : undefined,\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): 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\n  // Is disabled should always be false unless you explicitly set it to true\n  isDisabled.value = payload.isDisabled ?? false\n\n  // Emit all of the local state\n  emit('upsertRow', {\n    name: name.value,\n    value: value.value,\n    isDisabled: isDisabled.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      class=\"!border-r\"\n      :disabled=\"hasCheckboxDisabled ?? false\"\n      :modelValue=\"!isDisabled\"\n      @update:modelValue=\"(v) => handleUpdateRow({ isDisabled: !v })\" />\n\n    <!-- Name -->\n    <DataTableCell>\n      <CodeInput\n        :aria-label=\"`${label} Key`\"\n        disableCloseBrackets\n        :disabled=\"data.isReadonly\"\n        disableEnter\n        disableTabIndent\n        :environment=\"environment\"\n        lineWrapping\n        :modelValue=\"name\"\n        placeholder=\"Key\"\n        :required=\"Boolean(data.isRequired)\"\n        @navigate=\"(route) => emit('navigate', route)\"\n        @selectVariable=\"(v: string) => handleUpdateRow({ name: v })\"\n        @update:modelValue=\"(v) => handleUpdateRow({ name: v })\" />\n    </DataTableCell>\n\n    <!-- Value -->\n    <DataTableCell>\n      <CodeInput\n        :aria-label=\"`${label} Value`\"\n        class=\"pr-6 group-hover:pr-10 group-has-[.cm-focused]:pr-10\"\n        :default=\"defaultValue\"\n        disableCloseBrackets\n        :disabled=\"data.isReadonly\"\n        disableEnter\n        disableTabIndent\n        :enum=\"enumValue\"\n        :environment=\"environment\"\n        :examples=\"\n          data.schema?.examples?.map((example) => String(example)) ?? []\n        \"\n        :linethrough=\"data.isOverridden\"\n        lineWrapping\n        :max=\"maximumValue\"\n        :min=\"minimumValue\"\n        :modelValue=\"displayValue\"\n        placeholder=\"Value\"\n        :type=\"typeValue\"\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            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-[.cm-focused]: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=\"Global cookies are shared across the whole workspace. Click to navigate.\"\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=\"This is a readonly property and you can not modify it! If you want to change it you have to override it or disable it using the checkbox\"\n            :value=\"null\" />\n          <RequestTableTooltip\n            v-else-if=\"data.schema\"\n            :description=\"data.description\"\n            :schema=\"data.schema\"\n            :value />\n        </template>\n      </CodeInput>\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 filemask flex w-full max-w-[100%] items-center justify-center overflow-hidden p-1\">\n          <span>{{ displayValue }}</span>\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          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>Select File</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":""}
+{"version":3,"file":"RequestTableRow.vue.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestTableRow.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton, ScalarIcon, ScalarIconButton } from '@scalar/components'\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.1/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 { CodeInput } from '@/v2/components/code-input'\nimport {\n  DataTableCell,\n  DataTableCheckbox,\n  DataTableRow,\n} from '@/v2/components/data-table'\n\nimport RequestTableTooltip from './RequestTableTooltip.vue'\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  /** OpenAPI schema object with type, validation rules, examples, etc. */\n  schema?: SchemaObject\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}\n\nconst {\n  data,\n  environment,\n  hasCheckboxDisabled,\n  invalidParams,\n  showUploadButton,\n} = defineProps<{\n  data: TableRow\n  hasCheckboxDisabled?: boolean\n  invalidParams?: Set<string>\n  label?: string\n  environment: XScalarEnvironment\n  showUploadButton?: boolean\n}>()\n\nconst emit = defineEmits<{\n  (\n    e: 'upsertRow',\n    payload: { name: string; value: string | File; isDisabled: boolean },\n  ): void\n  (e: 'deleteRow'): void\n  (e: 'uploadFile'): void\n  (e: 'removeFile'): void\n  (e: 'navigate', route: NonNullable<TableRow['globalRoute']>): void\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) => (name.value = newName ?? ''),\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 minimumValue = computed(() =>\n  data.schema && 'minimum' in data.schema ? data.schema.minimum : undefined,\n)\nconst maximumValue = computed(() =>\n  data.schema && 'maximum' in data.schema ? data.schema.maximum : undefined,\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): 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\n  // Is disabled should always be false unless you explicitly set it to true\n  isDisabled.value = payload.isDisabled ?? false\n\n  // Emit all of the local state\n  emit('upsertRow', {\n    name: name.value,\n    value: value.value,\n    isDisabled: isDisabled.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      class=\"!border-r\"\n      :disabled=\"hasCheckboxDisabled ?? false\"\n      :modelValue=\"!isDisabled\"\n      @update:modelValue=\"(v) => handleUpdateRow({ isDisabled: !v })\" />\n\n    <!-- Name -->\n    <DataTableCell>\n      <CodeInput\n        :aria-label=\"`${label} Key`\"\n        disableCloseBrackets\n        :disabled=\"data.isReadonly\"\n        disableEnter\n        disableTabIndent\n        :environment=\"environment\"\n        lineWrapping\n        :modelValue=\"name\"\n        placeholder=\"Key\"\n        :required=\"Boolean(data.isRequired)\"\n        @navigate=\"(route) => emit('navigate', route)\"\n        @selectVariable=\"(v: string) => handleUpdateRow({ name: v })\"\n        @update:modelValue=\"(v) => handleUpdateRow({ name: v })\" />\n    </DataTableCell>\n\n    <!-- Value -->\n    <DataTableCell>\n      <CodeInput\n        :aria-label=\"`${label} Value`\"\n        class=\"pr-6 group-hover:pr-10 group-has-[.cm-focused]:pr-10\"\n        :default=\"defaultValue\"\n        disableCloseBrackets\n        :disabled=\"data.isReadonly\"\n        disableEnter\n        disableTabIndent\n        :enum=\"enumValue\"\n        :environment=\"environment\"\n        :examples=\"\n          data.schema?.examples?.map((example) => String(example)) ?? []\n        \"\n        :linethrough=\"data.isOverridden\"\n        lineWrapping\n        :max=\"maximumValue\"\n        :min=\"minimumValue\"\n        :modelValue=\"displayValue\"\n        placeholder=\"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            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-[.cm-focused]: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=\"Global cookies are shared across the whole workspace. Click to navigate.\"\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=\"This is a readonly property and you can not modify it! If you want to change it you have to override it or disable it using the checkbox\"\n            :value=\"null\" />\n          <RequestTableTooltip\n            v-else-if=\"data.schema\"\n            :description=\"data.description\"\n            :schema=\"data.schema\"\n            :value />\n        </template>\n      </CodeInput>\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 filemask flex w-full max-w-[100%] items-center justify-center overflow-hidden p-1\">\n          <span>{{ displayValue }}</span>\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          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>Select File</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":""}

package/dist/v2/blocks/request-block/components/RequestTableRow.vue.script.js

@@ -137,6 +137,7 @@ var RequestTableRow_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ *
 							modelValue: displayValue.value,
 							placeholder: "Value",
 							type: typeValue.value,
+							withFakeData: "",
 							onNavigate: _cache[6] || (_cache[6] = (route) => emit("navigate", route)),
 							"onUpdate:modelValue": _cache[7] || (_cache[7] = (v) => handleUpdateRow({ value: v }))
 						}, {

package/dist/v2/blocks/request-block/components/RequestTableRow.vue.script.js.map

@@ -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, ScalarIcon, ScalarIconButton } from '@scalar/components'\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.1/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 { CodeInput } from '@/v2/components/code-input'\nimport {\n  DataTableCell,\n  DataTableCheckbox,\n  DataTableRow,\n} from '@/v2/components/data-table'\n\nimport RequestTableTooltip from './RequestTableTooltip.vue'\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  /** OpenAPI schema object with type, validation rules, examples, etc. */\n  schema?: SchemaObject\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}\n\nconst {\n  data,\n  environment,\n  hasCheckboxDisabled,\n  invalidParams,\n  showUploadButton,\n} = defineProps<{\n  data: TableRow\n  hasCheckboxDisabled?: boolean\n  invalidParams?: Set<string>\n  label?: string\n  environment: XScalarEnvironment\n  showUploadButton?: boolean\n}>()\n\nconst emit = defineEmits<{\n  (\n    e: 'upsertRow',\n    payload: { name: string; value: string | File; isDisabled: boolean },\n  ): void\n  (e: 'deleteRow'): void\n  (e: 'uploadFile'): void\n  (e: 'removeFile'): void\n  (e: 'navigate', route: NonNullable<TableRow['globalRoute']>): void\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) => (name.value = newName ?? ''),\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 minimumValue = computed(() =>\n  data.schema && 'minimum' in data.schema ? data.schema.minimum : undefined,\n)\nconst maximumValue = computed(() =>\n  data.schema && 'maximum' in data.schema ? data.schema.maximum : undefined,\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): 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\n  // Is disabled should always be false unless you explicitly set it to true\n  isDisabled.value = payload.isDisabled ?? false\n\n  // Emit all of the local state\n  emit('upsertRow', {\n    name: name.value,\n    value: value.value,\n    isDisabled: isDisabled.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      class=\"!border-r\"\n      :disabled=\"hasCheckboxDisabled ?? false\"\n      :modelValue=\"!isDisabled\"\n      @update:modelValue=\"(v) => handleUpdateRow({ isDisabled: !v })\" />\n\n    <!-- Name -->\n    <DataTableCell>\n      <CodeInput\n        :aria-label=\"`${label} Key`\"\n        disableCloseBrackets\n        :disabled=\"data.isReadonly\"\n        disableEnter\n        disableTabIndent\n        :environment=\"environment\"\n        lineWrapping\n        :modelValue=\"name\"\n        placeholder=\"Key\"\n        :required=\"Boolean(data.isRequired)\"\n        @navigate=\"(route) => emit('navigate', route)\"\n        @selectVariable=\"(v: string) => handleUpdateRow({ name: v })\"\n        @update:modelValue=\"(v) => handleUpdateRow({ name: v })\" />\n    </DataTableCell>\n\n    <!-- Value -->\n    <DataTableCell>\n      <CodeInput\n        :aria-label=\"`${label} Value`\"\n        class=\"pr-6 group-hover:pr-10 group-has-[.cm-focused]:pr-10\"\n        :default=\"defaultValue\"\n        disableCloseBrackets\n        :disabled=\"data.isReadonly\"\n        disableEnter\n        disableTabIndent\n        :enum=\"enumValue\"\n        :environment=\"environment\"\n        :examples=\"\n          data.schema?.examples?.map((example) => String(example)) ?? []\n        \"\n        :linethrough=\"data.isOverridden\"\n        lineWrapping\n        :max=\"maximumValue\"\n        :min=\"minimumValue\"\n        :modelValue=\"displayValue\"\n        placeholder=\"Value\"\n        :type=\"typeValue\"\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            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-[.cm-focused]: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=\"Global cookies are shared across the whole workspace. Click to navigate.\"\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=\"This is a readonly property and you can not modify it! If you want to change it you have to override it or disable it using the checkbox\"\n            :value=\"null\" />\n          <RequestTableTooltip\n            v-else-if=\"data.schema\"\n            :description=\"data.description\"\n            :schema=\"data.schema\"\n            :value />\n        </template>\n      </CodeInput>\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 filemask flex w-full max-w-[100%] items-center justify-center overflow-hidden p-1\">\n          <span>{{ displayValue }}</span>\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          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>Select File</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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"}
+{"version":3,"file":"RequestTableRow.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/request-block/components/RequestTableRow.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton, ScalarIcon, ScalarIconButton } from '@scalar/components'\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.1/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 { CodeInput } from '@/v2/components/code-input'\nimport {\n  DataTableCell,\n  DataTableCheckbox,\n  DataTableRow,\n} from '@/v2/components/data-table'\n\nimport RequestTableTooltip from './RequestTableTooltip.vue'\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  /** OpenAPI schema object with type, validation rules, examples, etc. */\n  schema?: SchemaObject\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}\n\nconst {\n  data,\n  environment,\n  hasCheckboxDisabled,\n  invalidParams,\n  showUploadButton,\n} = defineProps<{\n  data: TableRow\n  hasCheckboxDisabled?: boolean\n  invalidParams?: Set<string>\n  label?: string\n  environment: XScalarEnvironment\n  showUploadButton?: boolean\n}>()\n\nconst emit = defineEmits<{\n  (\n    e: 'upsertRow',\n    payload: { name: string; value: string | File; isDisabled: boolean },\n  ): void\n  (e: 'deleteRow'): void\n  (e: 'uploadFile'): void\n  (e: 'removeFile'): void\n  (e: 'navigate', route: NonNullable<TableRow['globalRoute']>): void\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) => (name.value = newName ?? ''),\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 minimumValue = computed(() =>\n  data.schema && 'minimum' in data.schema ? data.schema.minimum : undefined,\n)\nconst maximumValue = computed(() =>\n  data.schema && 'maximum' in data.schema ? data.schema.maximum : undefined,\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): 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\n  // Is disabled should always be false unless you explicitly set it to true\n  isDisabled.value = payload.isDisabled ?? false\n\n  // Emit all of the local state\n  emit('upsertRow', {\n    name: name.value,\n    value: value.value,\n    isDisabled: isDisabled.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      class=\"!border-r\"\n      :disabled=\"hasCheckboxDisabled ?? false\"\n      :modelValue=\"!isDisabled\"\n      @update:modelValue=\"(v) => handleUpdateRow({ isDisabled: !v })\" />\n\n    <!-- Name -->\n    <DataTableCell>\n      <CodeInput\n        :aria-label=\"`${label} Key`\"\n        disableCloseBrackets\n        :disabled=\"data.isReadonly\"\n        disableEnter\n        disableTabIndent\n        :environment=\"environment\"\n        lineWrapping\n        :modelValue=\"name\"\n        placeholder=\"Key\"\n        :required=\"Boolean(data.isRequired)\"\n        @navigate=\"(route) => emit('navigate', route)\"\n        @selectVariable=\"(v: string) => handleUpdateRow({ name: v })\"\n        @update:modelValue=\"(v) => handleUpdateRow({ name: v })\" />\n    </DataTableCell>\n\n    <!-- Value -->\n    <DataTableCell>\n      <CodeInput\n        :aria-label=\"`${label} Value`\"\n        class=\"pr-6 group-hover:pr-10 group-has-[.cm-focused]:pr-10\"\n        :default=\"defaultValue\"\n        disableCloseBrackets\n        :disabled=\"data.isReadonly\"\n        disableEnter\n        disableTabIndent\n        :enum=\"enumValue\"\n        :environment=\"environment\"\n        :examples=\"\n          data.schema?.examples?.map((example) => String(example)) ?? []\n        \"\n        :linethrough=\"data.isOverridden\"\n        lineWrapping\n        :max=\"maximumValue\"\n        :min=\"minimumValue\"\n        :modelValue=\"displayValue\"\n        placeholder=\"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            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-[.cm-focused]: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=\"Global cookies are shared across the whole workspace. Click to navigate.\"\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=\"This is a readonly property and you can not modify it! If you want to change it you have to override it or disable it using the checkbox\"\n            :value=\"null\" />\n          <RequestTableTooltip\n            v-else-if=\"data.schema\"\n            :description=\"data.description\"\n            :schema=\"data.schema\"\n            :value />\n        </template>\n      </CodeInput>\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 filemask flex w-full max-w-[100%] items-center justify-center overflow-hidden p-1\">\n          <span>{{ displayValue }}</span>\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          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>Select File</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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"}

package/dist/v2/blocks/scalar-address-bar-block/components/AddressBar.vue.d.ts

@@ -32,7 +32,7 @@ export type AddressBarProps = {
     serverMeta: ServerMeta;
 };
 declare const __VLS_export: import("vue").DefineComponent<AddressBarProps, {
-    methodConflict: import("vue").Ref<"delete" | "head" | "get" | "options" | "put" | "post" | "patch" | "trace" | null, "delete" | "head" | "get" | "options" | "put" | "post" | "patch" | "trace" | null>;
+    methodConflict: import("vue").Ref<"head" | "delete" | "get" | "options" | "patch" | "post" | "put" | "trace" | null, "head" | "delete" | "get" | "options" | "patch" | "post" | "put" | "trace" | null>;
     pathConflict: import("vue").Ref<string | null, string | null>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     execute: () => any;

package/dist/v2/blocks/scalar-address-bar-block/components/EnvironmentSelector.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"EnvironmentSelector.vue.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-address-bar-block/components/EnvironmentSelector.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarDropdown,\n  ScalarDropdownDivider,\n  ScalarDropdownItem,\n  ScalarIcon,\n} from '@scalar/components'\nimport { computed } from 'vue'\n\nconst { environments = [], activeEnvironment } = defineProps<{\n  /** List of available environments */\n  environments?: string[]\n  /** Currently selected environment */\n  activeEnvironment?: string\n}>()\n\nconst emit = defineEmits<{\n  /** Emitted when an environment is selected */\n  (e: 'select:environment', environmentName: string): void\n  /** Emitted when user wants to add a new environment */\n  (e: 'add:environment'): void\n}>()\n\n/** Whether an environment is currently active */\nconst hasActiveEnvironment = computed(() => !!activeEnvironment)\n\n/** Whether environments exist */\nconst hasEnvironments = computed(() => environments.length > 0)\n\n/** Whether the currently selected environment exists in the dropdown options */\nconst hasSelectedEnvironmentInOptions = computed(() => {\n  if (!activeEnvironment) {\n    return false\n  }\n\n  return environments.includes(activeEnvironment)\n})\n\n/** True when an environment is selected but unavailable in the current context */\nconst hasMissingActiveEnvironment = computed(\n  () => hasActiveEnvironment.value && !hasSelectedEnvironmentInOptions.value,\n)\n\n/** Display text for the button */\nconst displayText = computed(() => {\n  if (hasMissingActiveEnvironment.value) {\n    return `${activeEnvironment} (Unavailable)`\n  }\n\n  if (hasActiveEnvironment.value) {\n    return activeEnvironment\n  }\n  if (!hasEnvironments.value) {\n    return 'Add Environment'\n  }\n  return 'Select Environment'\n})\n\n/** Button styling based on state */\nconst buttonClass = computed(() => {\n  if (hasMissingActiveEnvironment.value) {\n    return 'hover:bg-b-2 text-c-2 border-transparent'\n  }\n\n  if (hasActiveEnvironment.value) {\n    return 'bg-c-accent/10 text-c-accent hover:bg-c-accent/20 border-c-accent/30'\n  }\n  if (!hasEnvironments.value) {\n    return 'hover:bg-b-2 text-c-3 border-transparent'\n  }\n  return 'hover:bg-b-2 text-c-2 border-transparent'\n})\n\nconst handleAddEnvironment = () => {\n  emit('add:environment')\n}\n\nconst handleSelectEnvironment = (environmentName: string) => {\n  emit('select:environment', environmentName)\n}\n</script>\n\n<template>\n  <div class=\"relative flex items-center\">\n    <!-- Environment indicator badge (only show when active) -->\n\n    <ScalarDropdown>\n      <ScalarButton\n        :aria-label=\"`Current environment: ${displayText}`\"\n        class=\"line-clamp-1 h-full w-fit justify-start border px-2 py-1 font-normal transition-colors\"\n        :class=\"buttonClass\"\n        size=\"sm\"\n        variant=\"ghost\">\n        <div class=\"flex max-w-[220px] min-w-0 items-center gap-1.5\">\n          <!-- Icon indicator -->\n          <ScalarIcon\n            class=\"shrink-0\"\n            :class=\"\n              hasActiveEnvironment && !hasMissingActiveEnvironment\n                ? 'text-c-accent'\n                : 'text-c-3'\n            \"\n            icon=\"Globe\"\n            size=\"sm\" />\n\n          <!-- Environment name -->\n          <span\n            class=\"text-xxs block max-w-[160px] min-w-0 truncate text-left font-medium\">\n            {{ displayText }}\n          </span>\n\n          <!-- Dropdown arrow -->\n          <ScalarIcon\n            class=\"shrink-0\"\n            icon=\"ChevronDown\"\n            size=\"xs\" />\n        </div>\n      </ScalarButton>\n\n      <template #items>\n        <!-- No environment option (clear selection) -->\n        <ScalarDropdownItem\n          v-if=\"hasActiveEnvironment\"\n          class=\"group/item flex w-full items-center gap-1.5\"\n          @click.stop=\"handleSelectEnvironment('')\">\n          <div\n            class=\"flex h-4 w-4 items-center justify-center rounded-full p-[3px]\"\n            :class=\"\n              !activeEnvironment\n                ? 'bg-c-accent text-b-1'\n                : 'shadow-border text-transparent'\n            \">\n            <ScalarIcon\n              class=\"size-2.5\"\n              icon=\"Checkmark\"\n              thickness=\"3\" />\n          </div>\n          <span class=\"text-c-2\">No Environment</span>\n        </ScalarDropdownItem>\n\n        <ScalarDropdownDivider v-if=\"hasActiveEnvironment && hasEnvironments\" />\n\n        <!-- Environment list -->\n        <ScalarDropdownItem\n          v-for=\"environmentName in environments\"\n          :key=\"environmentName\"\n          class=\"group/item flex w-full min-w-0 items-center gap-1.5 overflow-hidden text-ellipsis whitespace-nowrap\"\n          @click.stop=\"handleSelectEnvironment(environmentName)\">\n          <div\n            class=\"flex h-4 w-4 items-center justify-center rounded-full p-[3px]\"\n            :class=\"\n              activeEnvironment === environmentName\n                ? 'bg-c-accent text-b-1'\n                : 'shadow-border text-transparent'\n            \">\n            <ScalarIcon\n              class=\"size-2.5\"\n              icon=\"Checkmark\"\n              thickness=\"3\" />\n          </div>\n          <span class=\"min-w-0 flex-1 truncate\">{{ environmentName }}</span>\n        </ScalarDropdownItem>\n        <ScalarDropdownDivider v-if=\"hasMissingActiveEnvironment\" />\n\n        <ScalarDropdownItem\n          v-if=\"hasMissingActiveEnvironment\"\n          class=\"group/item flex h-auto w-full min-w-0 items-start gap-1.5 overflow-hidden\"\n          disabled>\n          <div\n            class=\"bg-c-accent text-b-1 mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded-full p-[3px]\">\n            <ScalarIcon\n              class=\"size-2.5\"\n              icon=\"Checkmark\"\n              thickness=\"3\" />\n          </div>\n          <div class=\"min-w-0 flex-1 text-left\">\n            <span class=\"block truncate\">\n              {{ activeEnvironment }}\n            </span>\n            <span class=\"text-c-3 block truncate text-xs\">\n              Not available in this context\n            </span>\n          </div>\n        </ScalarDropdownItem>\n\n        <ScalarDropdownDivider v-if=\"hasEnvironments\" />\n\n        <!-- Add new environment button -->\n        <ScalarDropdownItem\n          class=\"text-c-accent flex items-center gap-1.5\"\n          @click=\"handleAddEnvironment\">\n          <div class=\"flex h-4 w-4 items-center justify-center\">\n            <ScalarIcon\n              icon=\"Add\"\n              size=\"sm\" />\n          </div>\n          <span>{{\n            hasEnvironments ? 'New Environment' : 'Create Environment'\n          }}</span>\n        </ScalarDropdownItem>\n\n        <!-- Helper text for empty state -->\n        <div\n          v-if=\"!hasEnvironments && !hasActiveEnvironment\"\n          class=\"text-c-3 px-2 py-1.5 text-xs\">\n          <p class=\"mb-1\">\n            Environments let you manage variables like API keys and base URLs\n            across different contexts.\n          </p>\n        </div>\n      </template>\n    </ScalarDropdown>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"EnvironmentSelector.vue.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-address-bar-block/components/EnvironmentSelector.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarDropdown,\n  ScalarDropdownDivider,\n  ScalarDropdownItem,\n  ScalarIcon,\n} from '@scalar/components'\nimport { computed } from 'vue'\n\nconst { environments = [], activeEnvironment } = defineProps<{\n  /** List of available environments */\n  environments?: string[]\n  /** Currently selected environment */\n  activeEnvironment?: string\n}>()\n\nconst emit = defineEmits<{\n  /** Emitted when an environment is selected */\n  (e: 'select:environment', environmentName: string): void\n  /** Emitted when user wants to add a new environment */\n  (e: 'add:environment'): void\n}>()\n\n/** Whether an environment is currently active */\nconst hasActiveEnvironment = computed(() => !!activeEnvironment)\n\n/** Whether environments exist */\nconst hasEnvironments = computed(() => environments.length > 0)\n\n/** Whether the currently selected environment exists in the dropdown options */\nconst hasSelectedEnvironmentInOptions = computed(() => {\n  if (!activeEnvironment) {\n    return false\n  }\n\n  return environments.includes(activeEnvironment)\n})\n\n/** True when an environment is selected but unavailable in the current context */\nconst hasMissingActiveEnvironment = computed(\n  () => hasActiveEnvironment.value && !hasSelectedEnvironmentInOptions.value,\n)\n\n/** Display text for the button */\nconst displayText = computed(() => {\n  if (hasMissingActiveEnvironment.value) {\n    return `${activeEnvironment} (Unavailable)`\n  }\n\n  if (hasActiveEnvironment.value) {\n    return activeEnvironment\n  }\n  if (!hasEnvironments.value) {\n    return 'Add Environment'\n  }\n  return 'Select Environment'\n})\n\n/** Button styling based on state */\nconst buttonClass = computed(() => {\n  if (hasMissingActiveEnvironment.value) {\n    return 'hover:bg-b-2 text-c-2 border-transparent'\n  }\n\n  if (hasActiveEnvironment.value) {\n    return 'bg-c-accent/10 text-c-accent hover:bg-c-accent/20 border-c-accent/30'\n  }\n  if (!hasEnvironments.value) {\n    return 'hover:bg-b-2 text-c-3 border-transparent'\n  }\n  return 'hover:bg-b-2 text-c-2 border-transparent'\n})\n\nconst handleAddEnvironment = () => {\n  emit('add:environment')\n}\n\nconst handleSelectEnvironment = (environmentName: string) => {\n  emit('select:environment', environmentName)\n}\n</script>\n\n<template>\n  <div class=\"relative flex items-center\">\n    <!-- Environment indicator badge (only show when active) -->\n\n    <ScalarDropdown>\n      <ScalarButton\n        :aria-label=\"`Current environment: ${displayText}`\"\n        class=\"line-clamp-1 h-full w-fit justify-start border px-2 py-1 font-normal transition-colors\"\n        :class=\"buttonClass\"\n        size=\"sm\"\n        variant=\"ghost\">\n        <div class=\"flex max-w-[220px] min-w-0 items-center gap-1.5\">\n          <!-- Icon indicator -->\n          <ScalarIcon\n            class=\"shrink-0\"\n            :class=\"\n              hasActiveEnvironment && !hasMissingActiveEnvironment\n                ? 'text-c-accent'\n                : 'text-c-3'\n            \"\n            icon=\"Globe\"\n            size=\"sm\" />\n\n          <!-- Environment name -->\n          <span\n            class=\"text-xxs block max-w-[160px] min-w-0 truncate text-left font-medium\">\n            {{ displayText }}\n          </span>\n\n          <!-- Dropdown arrow -->\n          <ScalarIcon\n            class=\"shrink-0\"\n            icon=\"ChevronDown\"\n            size=\"xs\" />\n        </div>\n      </ScalarButton>\n\n      <template #items>\n        <!-- No environment option (clear selection) -->\n        <ScalarDropdownItem\n          v-if=\"hasActiveEnvironment\"\n          class=\"group/item flex w-full items-center gap-1.5\"\n          @click=\"handleSelectEnvironment('')\">\n          <div\n            class=\"flex h-4 w-4 items-center justify-center rounded-full p-[3px]\"\n            :class=\"\n              !activeEnvironment\n                ? 'bg-c-accent text-b-1'\n                : 'shadow-border text-transparent'\n            \">\n            <ScalarIcon\n              class=\"size-2.5\"\n              icon=\"Checkmark\"\n              thickness=\"3\" />\n          </div>\n          <span class=\"text-c-2\">No Environment</span>\n        </ScalarDropdownItem>\n\n        <ScalarDropdownDivider v-if=\"hasActiveEnvironment && hasEnvironments\" />\n\n        <!-- Environment list -->\n        <ScalarDropdownItem\n          v-for=\"environmentName in environments\"\n          :key=\"environmentName\"\n          class=\"group/item flex w-full min-w-0 items-center gap-1.5 overflow-hidden text-ellipsis whitespace-nowrap\"\n          @click=\"handleSelectEnvironment(environmentName)\">\n          <div\n            class=\"flex h-4 w-4 items-center justify-center rounded-full p-[3px]\"\n            :class=\"\n              activeEnvironment === environmentName\n                ? 'bg-c-accent text-b-1'\n                : 'shadow-border text-transparent'\n            \">\n            <ScalarIcon\n              class=\"size-2.5\"\n              icon=\"Checkmark\"\n              thickness=\"3\" />\n          </div>\n          <span class=\"min-w-0 flex-1 truncate\">{{ environmentName }}</span>\n        </ScalarDropdownItem>\n        <ScalarDropdownDivider v-if=\"hasMissingActiveEnvironment\" />\n\n        <ScalarDropdownItem\n          v-if=\"hasMissingActiveEnvironment\"\n          class=\"group/item flex h-auto w-full min-w-0 items-start gap-1.5 overflow-hidden\"\n          disabled>\n          <div\n            class=\"bg-c-accent text-b-1 mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded-full p-[3px]\">\n            <ScalarIcon\n              class=\"size-2.5\"\n              icon=\"Checkmark\"\n              thickness=\"3\" />\n          </div>\n          <div class=\"min-w-0 flex-1 text-left\">\n            <span class=\"block truncate\">\n              {{ activeEnvironment }}\n            </span>\n            <span class=\"text-c-3 block truncate text-xs\">\n              Not available in this context\n            </span>\n          </div>\n        </ScalarDropdownItem>\n\n        <ScalarDropdownDivider v-if=\"hasEnvironments\" />\n\n        <!-- Add new environment button -->\n        <ScalarDropdownItem\n          class=\"text-c-accent flex items-center gap-1.5\"\n          @click=\"handleAddEnvironment\">\n          <div class=\"flex h-4 w-4 items-center justify-center\">\n            <ScalarIcon\n              icon=\"Add\"\n              size=\"sm\" />\n          </div>\n          <span>{{\n            hasEnvironments ? 'New Environment' : 'Create Environment'\n          }}</span>\n        </ScalarDropdownItem>\n\n        <!-- Helper text for empty state -->\n        <div\n          v-if=\"!hasEnvironments && !hasActiveEnvironment\"\n          class=\"text-c-3 px-2 py-1.5 text-xs\">\n          <p class=\"mb-1\">\n            Environments let you manage variables like API keys and base URLs\n            across different contexts.\n          </p>\n        </div>\n      </template>\n    </ScalarDropdown>\n  </div>\n</template>\n"],"mappings":""}

package/dist/v2/blocks/scalar-address-bar-block/components/EnvironmentSelector.vue.script.js

@@ -1,4 +1,4 @@
-import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, normalizeClass, openBlock, renderList, toDisplayString, unref, withCtx, withModifiers } from "vue";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, normalizeClass, openBlock, renderList, toDisplayString, unref, withCtx } from "vue";
 import { ScalarButton, ScalarDropdown, ScalarDropdownDivider, ScalarDropdownItem, ScalarIcon } from "@scalar/components";
 //#region src/v2/blocks/scalar-address-bar-block/components/EnvironmentSelector.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = { class: "relative flex items-center" };
@@ -59,7 +59,7 @@ var EnvironmentSelector_vue_vue_type_script_setup_true_lang_default = /* @__PURE
 					hasActiveEnvironment.value ? (openBlock(), createBlock(unref(ScalarDropdownItem), {
 						key: 0,
 						class: "group/item flex w-full items-center gap-1.5",
-						onClick: _cache[0] || (_cache[0] = withModifiers(($event) => handleSelectEnvironment(""), ["stop"]))
+						onClick: _cache[0] || (_cache[0] = ($event) => handleSelectEnvironment(""))
 					}, {
 						default: withCtx(() => [createElementVNode("div", { class: normalizeClass(["flex h-4 w-4 items-center justify-center rounded-full p-[3px]", !__props.activeEnvironment ? "bg-c-accent text-b-1" : "shadow-border text-transparent"]) }, [createVNode(unref(ScalarIcon), {
 							class: "size-2.5",
@@ -73,7 +73,7 @@ var EnvironmentSelector_vue_vue_type_script_setup_true_lang_default = /* @__PURE
 						return openBlock(), createBlock(unref(ScalarDropdownItem), {
 							key: environmentName,
 							class: "group/item flex w-full min-w-0 items-center gap-1.5 overflow-hidden text-ellipsis whitespace-nowrap",
-							onClick: withModifiers(($event) => handleSelectEnvironment(environmentName), ["stop"])
+							onClick: ($event) => handleSelectEnvironment(environmentName)
 						}, {
 							default: withCtx(() => [createElementVNode("div", { class: normalizeClass(["flex h-4 w-4 items-center justify-center rounded-full p-[3px]", __props.activeEnvironment === environmentName ? "bg-c-accent text-b-1" : "shadow-border text-transparent"]) }, [createVNode(unref(ScalarIcon), {
 								class: "size-2.5",

package/dist/v2/blocks/scalar-address-bar-block/components/EnvironmentSelector.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"EnvironmentSelector.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-address-bar-block/components/EnvironmentSelector.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarDropdown,\n  ScalarDropdownDivider,\n  ScalarDropdownItem,\n  ScalarIcon,\n} from '@scalar/components'\nimport { computed } from 'vue'\n\nconst { environments = [], activeEnvironment } = defineProps<{\n  /** List of available environments */\n  environments?: string[]\n  /** Currently selected environment */\n  activeEnvironment?: string\n}>()\n\nconst emit = defineEmits<{\n  /** Emitted when an environment is selected */\n  (e: 'select:environment', environmentName: string): void\n  /** Emitted when user wants to add a new environment */\n  (e: 'add:environment'): void\n}>()\n\n/** Whether an environment is currently active */\nconst hasActiveEnvironment = computed(() => !!activeEnvironment)\n\n/** Whether environments exist */\nconst hasEnvironments = computed(() => environments.length > 0)\n\n/** Whether the currently selected environment exists in the dropdown options */\nconst hasSelectedEnvironmentInOptions = computed(() => {\n  if (!activeEnvironment) {\n    return false\n  }\n\n  return environments.includes(activeEnvironment)\n})\n\n/** True when an environment is selected but unavailable in the current context */\nconst hasMissingActiveEnvironment = computed(\n  () => hasActiveEnvironment.value && !hasSelectedEnvironmentInOptions.value,\n)\n\n/** Display text for the button */\nconst displayText = computed(() => {\n  if (hasMissingActiveEnvironment.value) {\n    return `${activeEnvironment} (Unavailable)`\n  }\n\n  if (hasActiveEnvironment.value) {\n    return activeEnvironment\n  }\n  if (!hasEnvironments.value) {\n    return 'Add Environment'\n  }\n  return 'Select Environment'\n})\n\n/** Button styling based on state */\nconst buttonClass = computed(() => {\n  if (hasMissingActiveEnvironment.value) {\n    return 'hover:bg-b-2 text-c-2 border-transparent'\n  }\n\n  if (hasActiveEnvironment.value) {\n    return 'bg-c-accent/10 text-c-accent hover:bg-c-accent/20 border-c-accent/30'\n  }\n  if (!hasEnvironments.value) {\n    return 'hover:bg-b-2 text-c-3 border-transparent'\n  }\n  return 'hover:bg-b-2 text-c-2 border-transparent'\n})\n\nconst handleAddEnvironment = () => {\n  emit('add:environment')\n}\n\nconst handleSelectEnvironment = (environmentName: string) => {\n  emit('select:environment', environmentName)\n}\n</script>\n\n<template>\n  <div class=\"relative flex items-center\">\n    <!-- Environment indicator badge (only show when active) -->\n\n    <ScalarDropdown>\n      <ScalarButton\n        :aria-label=\"`Current environment: ${displayText}`\"\n        class=\"line-clamp-1 h-full w-fit justify-start border px-2 py-1 font-normal transition-colors\"\n        :class=\"buttonClass\"\n        size=\"sm\"\n        variant=\"ghost\">\n        <div class=\"flex max-w-[220px] min-w-0 items-center gap-1.5\">\n          <!-- Icon indicator -->\n          <ScalarIcon\n            class=\"shrink-0\"\n            :class=\"\n              hasActiveEnvironment && !hasMissingActiveEnvironment\n                ? 'text-c-accent'\n                : 'text-c-3'\n            \"\n            icon=\"Globe\"\n            size=\"sm\" />\n\n          <!-- Environment name -->\n          <span\n            class=\"text-xxs block max-w-[160px] min-w-0 truncate text-left font-medium\">\n            {{ displayText }}\n          </span>\n\n          <!-- Dropdown arrow -->\n          <ScalarIcon\n            class=\"shrink-0\"\n            icon=\"ChevronDown\"\n            size=\"xs\" />\n        </div>\n      </ScalarButton>\n\n      <template #items>\n        <!-- No environment option (clear selection) -->\n        <ScalarDropdownItem\n          v-if=\"hasActiveEnvironment\"\n          class=\"group/item flex w-full items-center gap-1.5\"\n          @click.stop=\"handleSelectEnvironment('')\">\n          <div\n            class=\"flex h-4 w-4 items-center justify-center rounded-full p-[3px]\"\n            :class=\"\n              !activeEnvironment\n                ? 'bg-c-accent text-b-1'\n                : 'shadow-border text-transparent'\n            \">\n            <ScalarIcon\n              class=\"size-2.5\"\n              icon=\"Checkmark\"\n              thickness=\"3\" />\n          </div>\n          <span class=\"text-c-2\">No Environment</span>\n        </ScalarDropdownItem>\n\n        <ScalarDropdownDivider v-if=\"hasActiveEnvironment && hasEnvironments\" />\n\n        <!-- Environment list -->\n        <ScalarDropdownItem\n          v-for=\"environmentName in environments\"\n          :key=\"environmentName\"\n          class=\"group/item flex w-full min-w-0 items-center gap-1.5 overflow-hidden text-ellipsis whitespace-nowrap\"\n          @click.stop=\"handleSelectEnvironment(environmentName)\">\n          <div\n            class=\"flex h-4 w-4 items-center justify-center rounded-full p-[3px]\"\n            :class=\"\n              activeEnvironment === environmentName\n                ? 'bg-c-accent text-b-1'\n                : 'shadow-border text-transparent'\n            \">\n            <ScalarIcon\n              class=\"size-2.5\"\n              icon=\"Checkmark\"\n              thickness=\"3\" />\n          </div>\n          <span class=\"min-w-0 flex-1 truncate\">{{ environmentName }}</span>\n        </ScalarDropdownItem>\n        <ScalarDropdownDivider v-if=\"hasMissingActiveEnvironment\" />\n\n        <ScalarDropdownItem\n          v-if=\"hasMissingActiveEnvironment\"\n          class=\"group/item flex h-auto w-full min-w-0 items-start gap-1.5 overflow-hidden\"\n          disabled>\n          <div\n            class=\"bg-c-accent text-b-1 mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded-full p-[3px]\">\n            <ScalarIcon\n              class=\"size-2.5\"\n              icon=\"Checkmark\"\n              thickness=\"3\" />\n          </div>\n          <div class=\"min-w-0 flex-1 text-left\">\n            <span class=\"block truncate\">\n              {{ activeEnvironment }}\n            </span>\n            <span class=\"text-c-3 block truncate text-xs\">\n              Not available in this context\n            </span>\n          </div>\n        </ScalarDropdownItem>\n\n        <ScalarDropdownDivider v-if=\"hasEnvironments\" />\n\n        <!-- Add new environment button -->\n        <ScalarDropdownItem\n          class=\"text-c-accent flex items-center gap-1.5\"\n          @click=\"handleAddEnvironment\">\n          <div class=\"flex h-4 w-4 items-center justify-center\">\n            <ScalarIcon\n              icon=\"Add\"\n              size=\"sm\" />\n          </div>\n          <span>{{\n            hasEnvironments ? 'New Environment' : 'Create Environment'\n          }}</span>\n        </ScalarDropdownItem>\n\n        <!-- Helper text for empty state -->\n        <div\n          v-if=\"!hasEnvironments && !hasActiveEnvironment\"\n          class=\"text-c-3 px-2 py-1.5 text-xs\">\n          <p class=\"mb-1\">\n            Environments let you manage variables like API keys and base URLs\n            across different contexts.\n          </p>\n        </div>\n      </template>\n    </ScalarDropdown>\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"EnvironmentSelector.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-address-bar-block/components/EnvironmentSelector.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarDropdown,\n  ScalarDropdownDivider,\n  ScalarDropdownItem,\n  ScalarIcon,\n} from '@scalar/components'\nimport { computed } from 'vue'\n\nconst { environments = [], activeEnvironment } = defineProps<{\n  /** List of available environments */\n  environments?: string[]\n  /** Currently selected environment */\n  activeEnvironment?: string\n}>()\n\nconst emit = defineEmits<{\n  /** Emitted when an environment is selected */\n  (e: 'select:environment', environmentName: string): void\n  /** Emitted when user wants to add a new environment */\n  (e: 'add:environment'): void\n}>()\n\n/** Whether an environment is currently active */\nconst hasActiveEnvironment = computed(() => !!activeEnvironment)\n\n/** Whether environments exist */\nconst hasEnvironments = computed(() => environments.length > 0)\n\n/** Whether the currently selected environment exists in the dropdown options */\nconst hasSelectedEnvironmentInOptions = computed(() => {\n  if (!activeEnvironment) {\n    return false\n  }\n\n  return environments.includes(activeEnvironment)\n})\n\n/** True when an environment is selected but unavailable in the current context */\nconst hasMissingActiveEnvironment = computed(\n  () => hasActiveEnvironment.value && !hasSelectedEnvironmentInOptions.value,\n)\n\n/** Display text for the button */\nconst displayText = computed(() => {\n  if (hasMissingActiveEnvironment.value) {\n    return `${activeEnvironment} (Unavailable)`\n  }\n\n  if (hasActiveEnvironment.value) {\n    return activeEnvironment\n  }\n  if (!hasEnvironments.value) {\n    return 'Add Environment'\n  }\n  return 'Select Environment'\n})\n\n/** Button styling based on state */\nconst buttonClass = computed(() => {\n  if (hasMissingActiveEnvironment.value) {\n    return 'hover:bg-b-2 text-c-2 border-transparent'\n  }\n\n  if (hasActiveEnvironment.value) {\n    return 'bg-c-accent/10 text-c-accent hover:bg-c-accent/20 border-c-accent/30'\n  }\n  if (!hasEnvironments.value) {\n    return 'hover:bg-b-2 text-c-3 border-transparent'\n  }\n  return 'hover:bg-b-2 text-c-2 border-transparent'\n})\n\nconst handleAddEnvironment = () => {\n  emit('add:environment')\n}\n\nconst handleSelectEnvironment = (environmentName: string) => {\n  emit('select:environment', environmentName)\n}\n</script>\n\n<template>\n  <div class=\"relative flex items-center\">\n    <!-- Environment indicator badge (only show when active) -->\n\n    <ScalarDropdown>\n      <ScalarButton\n        :aria-label=\"`Current environment: ${displayText}`\"\n        class=\"line-clamp-1 h-full w-fit justify-start border px-2 py-1 font-normal transition-colors\"\n        :class=\"buttonClass\"\n        size=\"sm\"\n        variant=\"ghost\">\n        <div class=\"flex max-w-[220px] min-w-0 items-center gap-1.5\">\n          <!-- Icon indicator -->\n          <ScalarIcon\n            class=\"shrink-0\"\n            :class=\"\n              hasActiveEnvironment && !hasMissingActiveEnvironment\n                ? 'text-c-accent'\n                : 'text-c-3'\n            \"\n            icon=\"Globe\"\n            size=\"sm\" />\n\n          <!-- Environment name -->\n          <span\n            class=\"text-xxs block max-w-[160px] min-w-0 truncate text-left font-medium\">\n            {{ displayText }}\n          </span>\n\n          <!-- Dropdown arrow -->\n          <ScalarIcon\n            class=\"shrink-0\"\n            icon=\"ChevronDown\"\n            size=\"xs\" />\n        </div>\n      </ScalarButton>\n\n      <template #items>\n        <!-- No environment option (clear selection) -->\n        <ScalarDropdownItem\n          v-if=\"hasActiveEnvironment\"\n          class=\"group/item flex w-full items-center gap-1.5\"\n          @click=\"handleSelectEnvironment('')\">\n          <div\n            class=\"flex h-4 w-4 items-center justify-center rounded-full p-[3px]\"\n            :class=\"\n              !activeEnvironment\n                ? 'bg-c-accent text-b-1'\n                : 'shadow-border text-transparent'\n            \">\n            <ScalarIcon\n              class=\"size-2.5\"\n              icon=\"Checkmark\"\n              thickness=\"3\" />\n          </div>\n          <span class=\"text-c-2\">No Environment</span>\n        </ScalarDropdownItem>\n\n        <ScalarDropdownDivider v-if=\"hasActiveEnvironment && hasEnvironments\" />\n\n        <!-- Environment list -->\n        <ScalarDropdownItem\n          v-for=\"environmentName in environments\"\n          :key=\"environmentName\"\n          class=\"group/item flex w-full min-w-0 items-center gap-1.5 overflow-hidden text-ellipsis whitespace-nowrap\"\n          @click=\"handleSelectEnvironment(environmentName)\">\n          <div\n            class=\"flex h-4 w-4 items-center justify-center rounded-full p-[3px]\"\n            :class=\"\n              activeEnvironment === environmentName\n                ? 'bg-c-accent text-b-1'\n                : 'shadow-border text-transparent'\n            \">\n            <ScalarIcon\n              class=\"size-2.5\"\n              icon=\"Checkmark\"\n              thickness=\"3\" />\n          </div>\n          <span class=\"min-w-0 flex-1 truncate\">{{ environmentName }}</span>\n        </ScalarDropdownItem>\n        <ScalarDropdownDivider v-if=\"hasMissingActiveEnvironment\" />\n\n        <ScalarDropdownItem\n          v-if=\"hasMissingActiveEnvironment\"\n          class=\"group/item flex h-auto w-full min-w-0 items-start gap-1.5 overflow-hidden\"\n          disabled>\n          <div\n            class=\"bg-c-accent text-b-1 mt-0.5 flex h-4 w-4 shrink-0 items-center justify-center rounded-full p-[3px]\">\n            <ScalarIcon\n              class=\"size-2.5\"\n              icon=\"Checkmark\"\n              thickness=\"3\" />\n          </div>\n          <div class=\"min-w-0 flex-1 text-left\">\n            <span class=\"block truncate\">\n              {{ activeEnvironment }}\n            </span>\n            <span class=\"text-c-3 block truncate text-xs\">\n              Not available in this context\n            </span>\n          </div>\n        </ScalarDropdownItem>\n\n        <ScalarDropdownDivider v-if=\"hasEnvironments\" />\n\n        <!-- Add new environment button -->\n        <ScalarDropdownItem\n          class=\"text-c-accent flex items-center gap-1.5\"\n          @click=\"handleAddEnvironment\">\n          <div class=\"flex h-4 w-4 items-center justify-center\">\n            <ScalarIcon\n              icon=\"Add\"\n              size=\"sm\" />\n          </div>\n          <span>{{\n            hasEnvironments ? 'New Environment' : 'Create Environment'\n          }}</span>\n        </ScalarDropdownItem>\n\n        <!-- Helper text for empty state -->\n        <div\n          v-if=\"!hasEnvironments && !hasActiveEnvironment\"\n          class=\"text-c-3 px-2 py-1.5 text-xs\">\n          <p class=\"mb-1\">\n            Environments let you manage variables like API keys and base URLs\n            across different contexts.\n          </p>\n        </div>\n      </template>\n    </ScalarDropdown>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/v2/blocks/scalar-auth-selector-block/components/AuthSelector.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"AuthSelector.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-auth-selector-block/components/AuthSelector.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarComboboxMultiselect,\n  ScalarIconButton,\n  ScalarListboxCheckbox,\n  useModal,\n  type Icon,\n  type ScalarButton as ScalarButtonType,\n} from '@scalar/components'\nimport { ScalarIconCaretDown, ScalarIconTrash } from '@scalar/icons'\nimport type { SelectedSecurity } from '@scalar/workspace-store/entities/auth'\nimport type {\n  AuthMeta,\n  WorkspaceEventBus,\n} from '@scalar/workspace-store/events'\nimport { getResolvedRef } from '@scalar/workspace-store/helpers/get-resolved-ref'\nimport { unpackProxyObject } from '@scalar/workspace-store/helpers/unpack-proxy'\nimport {\n  isAuthOptional,\n  type MergedSecuritySchemes,\n} from '@scalar/workspace-store/request-example'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type {\n  OpenApiDocument,\n  SecurityRequirementObject,\n  ServerObject,\n} from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { computed, ref, useId } from 'vue'\n\nimport DeleteRequestAuthModal from '@/v2/blocks/scalar-auth-selector-block/components/DeleteRequestAuthModal.vue'\nimport type { OAuth2Options } from '@/v2/blocks/scalar-auth-selector-block/components/OAuth2.vue'\nimport {\n  formatComplexScheme,\n  formatScheme,\n  getSecuritySchemeOptions,\n  type SecuritySchemeOption,\n} from '@/v2/blocks/scalar-auth-selector-block/helpers/security-scheme'\nimport { CollapsibleSection } from '@/v2/components/layout'\n\nimport RequestAuthDataTable from './RequestAuthDataTable.vue'\n\nconst {\n  environment,\n  eventBus,\n  createAnySecurityScheme = false,\n  defaultOpen = true,\n  isStatic = false,\n  meta,\n  proxyUrl,\n  securityRequirements,\n  securitySchemes,\n  selectedSecurity,\n  server,\n  title,\n  options,\n} = defineProps<{\n  environment: XScalarEnvironment\n  eventBus: WorkspaceEventBus\n  /** Allows adding authentication which is not in the document */\n  createAnySecurityScheme?: boolean\n  /** Whether the authentication disclosure should start expanded */\n  defaultOpen?: boolean\n  /** Creates a static disclosure that cannot be collapsed */\n  isStatic?: boolean\n  meta: AuthMeta\n  proxyUrl: string\n  securityRequirements: OpenApiDocument['security']\n  securitySchemes: MergedSecuritySchemes\n  selectedSecurity: SelectedSecurity | undefined\n  server: ServerObject | null\n  title: string\n  /**  Any config options required for the OAuth2 flow */\n  options?: OAuth2Options\n}>()\n\nconst titleId = useId()\nconst comboboxButtonRef = ref<typeof ScalarButtonType | null>(null)\nconst isDisclosureOpen = ref(false)\n\nconst deleteModal = useModal()\nconst schemeToDelete = ref<{\n  label: string\n  payload: SecurityRequirementObject\n} | null>(null)\n\n/**\n * Determines if authentication is required or optional\n *\n * Auth is optional when there is an empty security requirement and no complex requirements.\n * Complex requirements have multiple auth schemes combined (e.g., API key + OAuth).\n */\nconst authIndicator = computed<{ icon: Icon; text: string } | null>(() => {\n  if (!securityRequirements?.length) {\n    return null\n  }\n\n  const isOptional = isAuthOptional(securityRequirements)\n\n  return {\n    icon: isOptional ? 'Unlock' : 'Lock',\n    text: isOptional ? 'Optional' : 'Required',\n  }\n})\n\n/** All available auth scheme options for the dropdown */\nconst availableSchemeOptions = computed(() =>\n  getSecuritySchemeOptions(\n    securityRequirements ?? [],\n    securitySchemes ?? {},\n    selectedSecurity?.selectedSchemes ?? [],\n    createAnySecurityScheme,\n  ),\n)\n\n/** Currently active auth schemes selected for this operation or collection */\nconst activeSchemeOptions = computed<SecuritySchemeOption[]>(() => {\n  const schemes = selectedSecurity?.selectedSchemes\n  if (!schemes?.length) {\n    return []\n  }\n\n  return schemes.flatMap((requirement) => {\n    const schemeNames = Object.keys(requirement)\n\n    if (schemeNames.length === 0) {\n      return []\n    }\n\n    // Complex auth requirement with multiple schemes\n    if (schemeNames.length > 1) {\n      return formatComplexScheme(requirement)\n    }\n\n    // Simple auth requirement with single scheme\n    const schemeName = schemeNames[0]\n    if (!schemeName) {\n      return []\n    }\n\n    const scheme = getResolvedRef(securitySchemes?.[schemeName])\n    if (!scheme) {\n      return []\n    }\n\n    return formatScheme({\n      name: schemeName,\n      value: requirement,\n    })\n  })\n})\n\n/**\n * Opens the combobox dropdown when clicking the auth indicator badge.\n * Prevents the disclosure from toggling if it is already open.\n */\nconst handleAuthIndicatorClick = (event: Event): void => {\n  if (isDisclosureOpen.value) {\n    event.stopPropagation()\n  }\n  comboboxButtonRef.value?.$el.click()\n}\n\n/**\n * Updates the selected auth schemes.\n * Separates existing schemes from newly created ones for the event payload.\n */\nconst handleSchemeSelection = (selected: SecuritySchemeOption[]): void => {\n  const existingSchemes = selected\n    .filter((option) => option.payload === undefined)\n    .map((option) => unpackProxyObject(option.value, { depth: 2 }))\n\n  const newSchemes = selected\n    .filter((option) => option.payload !== undefined)\n    .map((option) => ({\n      name: option.label,\n      scheme: option.payload!,\n    }))\n\n  eventBus.emit('auth:update:selected-security-schemes', {\n    selectedRequirements: existingSchemes,\n    newSchemes,\n    meta,\n  })\n}\n\n/** Shows the delete confirmation modal for the selected scheme */\nconst handleDeleteRequest = (option: {\n  label: string\n  value: SecurityRequirementObject\n}): void => {\n  schemeToDelete.value = { label: option.label, payload: option.value }\n  deleteModal.show()\n}\n\n/** Deletes the selected auth scheme after confirmation */\nconst handleDeleteConfirm = (): void => {\n  if (!schemeToDelete.value) {\n    return\n  }\n\n  eventBus.emit('auth:delete:security-scheme', {\n    names: Object.keys(schemeToDelete.value.payload),\n  })\n\n  schemeToDelete.value = null\n  deleteModal.hide()\n}\n\ndefineExpose({\n  authIndicator,\n  selectedSchemeOptions: activeSchemeOptions,\n  schemeOptions: availableSchemeOptions,\n})\n</script>\n<template>\n  <CollapsibleSection\n    class=\"group/params relative\"\n    :defaultOpen\n    :isStatic=\"isStatic\"\n    :itemCount=\"activeSchemeOptions.length\"\n    @update:modelValue=\"(open) => (isDisclosureOpen = open)\">\n    <template #title>\n      <div\n        :id=\"titleId\"\n        class=\"inline-flex items-center gap-0.5 leading-[20px]\">\n        <span>{{ title }}</span>\n\n        <span\n          v-if=\"authIndicator\"\n          class=\"text-c-3 hover:bg-b-3 hover:text-c-1 -my-0.5 -mr-1 cursor-pointer rounded px-1 py-0.5 leading-[normal] font-normal\"\n          :class=\"{ 'text-c-1': authIndicator.text === 'Required' }\"\n          data-testid=\"auth-indicator\"\n          @click=\"handleAuthIndicatorClick\">\n          {{ authIndicator.text }}\n        </span>\n      </div>\n    </template>\n\n    <!-- Auth Dropdown (hidden when only one scheme is available) -->\n    <template #actions>\n      <ScalarComboboxMultiselect\n        class=\"w-72 text-xs\"\n        :modelValue=\"activeSchemeOptions\"\n        multiple\n        :options=\"availableSchemeOptions\"\n        placement=\"bottom-end\"\n        teleport\n        @delete=\"handleDeleteRequest\"\n        @update:modelValue=\"handleSchemeSelection\">\n        <ScalarButton\n          ref=\"comboboxButtonRef\"\n          :aria-describedby=\"titleId\"\n          class=\"group/combobox-button hover:text-c-1 text-c-2 flex h-fit w-full items-center gap-1 px-0.75 py-0.25 text-base font-normal\"\n          variant=\"ghost\">\n          <!-- Single auth scheme selected -->\n          <template v-if=\"activeSchemeOptions.length === 1\">\n            <span class=\"sr-only\">Selected Auth Type:</span>\n            {{ activeSchemeOptions[0]?.label }}\n          </template>\n\n          <!-- Multiple auth schemes selected -->\n          <template v-else-if=\"activeSchemeOptions.length > 1\">\n            Multiple\n            <span class=\"sr-only\">Auth Types Selected</span>\n          </template>\n\n          <!-- No auth schemes selected -->\n          <template v-else>\n            <span class=\"sr-only\">Select</span>\n            Auth Type\n          </template>\n\n          <ScalarIconCaretDown\n            class=\"size-3 shrink-0 transition-transform duration-100 group-aria-expanded/combobox-button:rotate-180\"\n            weight=\"bold\" />\n        </ScalarButton>\n\n        <template #option=\"{ option, selected }\">\n          <ScalarListboxCheckbox\n            multiselect\n            :selected=\"selected\" />\n          <div class=\"min-w-0 flex-1 truncate\">\n            {{ option.label }}\n          </div>\n          <ScalarIconButton\n            v-if=\"option.isDeletable\"\n            class=\"-m-0.5 shrink-0 p-0.5 opacity-0 group-hover/item:opacity-100\"\n            :icon=\"ScalarIconTrash\"\n            :label=\"`Delete ${option.label}`\"\n            size=\"xs\"\n            @click.stop=\"handleDeleteRequest(option)\" />\n        </template>\n      </ScalarComboboxMultiselect>\n    </template>\n\n    <!-- Auth Table -->\n    <RequestAuthDataTable\n      :activeAuthIndex=\"selectedSecurity?.selectedIndex ?? 0\"\n      :environment\n      :eventBus\n      :isStatic\n      :meta\n      :options\n      :proxyUrl\n      :securitySchemes\n      :selectedSchemeOptions=\"activeSchemeOptions\"\n      :server />\n\n    <!-- Delete Auth Modal -->\n    <DeleteRequestAuthModal\n      v-if=\"schemeToDelete\"\n      :label=\"schemeToDelete.label\"\n      :scheme=\"schemeToDelete\"\n      :state=\"deleteModal\"\n      @close=\"deleteModal.hide()\"\n      @delete=\"handleDeleteConfirm\" />\n  </CollapsibleSection>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"AuthSelector.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-auth-selector-block/components/AuthSelector.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarComboboxMultiselect,\n  ScalarIconButton,\n  ScalarListboxCheckbox,\n  useModal,\n  type Icon,\n  type ScalarButton as ScalarButtonType,\n} from '@scalar/components'\nimport { ScalarIconCaretDown, ScalarIconTrash } from '@scalar/icons'\nimport type { SelectedSecurity } from '@scalar/workspace-store/entities/auth'\nimport type {\n  AuthMeta,\n  WorkspaceEventBus,\n} from '@scalar/workspace-store/events'\nimport { getResolvedRef } from '@scalar/workspace-store/helpers/get-resolved-ref'\nimport { unpackProxyObject } from '@scalar/workspace-store/helpers/unpack-proxy'\nimport {\n  isAuthOptional,\n  type MergedSecuritySchemes,\n} from '@scalar/workspace-store/request-example'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type {\n  OpenApiDocument,\n  SecurityRequirementObject,\n  ServerObject,\n} from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { computed, ref, useId } from 'vue'\n\nimport DeleteRequestAuthModal from '@/v2/blocks/scalar-auth-selector-block/components/DeleteRequestAuthModal.vue'\nimport type { OAuth2Options } from '@/v2/blocks/scalar-auth-selector-block/components/OAuth2.vue'\nimport {\n  formatComplexScheme,\n  formatScheme,\n  getSecuritySchemeOptions,\n  type SecuritySchemeOption,\n} from '@/v2/blocks/scalar-auth-selector-block/helpers/security-scheme'\nimport { CollapsibleSection } from '@/v2/components/layout'\n\nimport RequestAuthDataTable from './RequestAuthDataTable.vue'\n\nconst {\n  environment,\n  eventBus,\n  createAnySecurityScheme = false,\n  defaultOpen = true,\n  isStatic = false,\n  meta,\n  proxyUrl,\n  securityRequirements,\n  securitySchemes,\n  selectedSecurity,\n  server,\n  title,\n  options,\n} = defineProps<{\n  environment: XScalarEnvironment\n  eventBus: WorkspaceEventBus\n  /** Allows adding authentication which is not in the document */\n  createAnySecurityScheme?: boolean\n  /** Whether the authentication disclosure should start expanded */\n  defaultOpen?: boolean\n  /** Creates a static disclosure that cannot be collapsed */\n  isStatic?: boolean\n  meta: AuthMeta\n  proxyUrl: string\n  securityRequirements: OpenApiDocument['security']\n  securitySchemes: MergedSecuritySchemes\n  selectedSecurity: SelectedSecurity | undefined\n  server: ServerObject | null\n  title: string\n  /**  Any config options required for the OAuth2 flow */\n  options?: OAuth2Options\n}>()\n\nconst titleId = useId()\nconst comboboxButtonRef = ref<typeof ScalarButtonType | null>(null)\nconst isDisclosureOpen = ref(false)\n\nconst deleteModal = useModal()\nconst schemeToDelete = ref<{\n  label: string\n  payload: SecurityRequirementObject\n} | null>(null)\n\n/**\n * Determines if authentication is required or optional\n *\n * Auth is optional when there is an empty security requirement and no complex requirements.\n * Complex requirements have multiple auth schemes combined (e.g., API key + OAuth).\n */\nconst authIndicator = computed<{ icon: Icon; text: string } | null>(() => {\n  if (!securityRequirements?.length) {\n    return null\n  }\n\n  const isOptional = isAuthOptional(securityRequirements)\n\n  return {\n    icon: isOptional ? 'Unlock' : 'Lock',\n    text: isOptional ? 'Optional' : 'Required',\n  }\n})\n\n/** All available auth scheme options for the dropdown */\nconst availableSchemeOptions = computed(() =>\n  getSecuritySchemeOptions(\n    securityRequirements ?? [],\n    securitySchemes ?? {},\n    selectedSecurity?.selectedSchemes ?? [],\n    createAnySecurityScheme,\n  ),\n)\n\n/** Currently active auth schemes selected for this operation or collection */\nconst activeSchemeOptions = computed<SecuritySchemeOption[]>(() => {\n  const schemes = selectedSecurity?.selectedSchemes\n  if (!schemes?.length) {\n    return []\n  }\n\n  return schemes.flatMap((requirement) => {\n    const schemeNames = Object.keys(requirement)\n\n    if (schemeNames.length === 0) {\n      return []\n    }\n\n    // Complex auth requirement with multiple schemes\n    if (schemeNames.length > 1) {\n      return formatComplexScheme(requirement)\n    }\n\n    // Simple auth requirement with single scheme\n    const schemeName = schemeNames[0]\n    if (!schemeName) {\n      return []\n    }\n\n    const scheme = getResolvedRef(securitySchemes?.[schemeName])\n    if (!scheme) {\n      return []\n    }\n\n    return formatScheme({\n      name: schemeName,\n      value: requirement,\n    })\n  })\n})\n\n/**\n * Opens the combobox dropdown when clicking the auth indicator badge.\n * Prevents the disclosure from toggling if it is already open.\n */\nconst handleAuthIndicatorClick = (event: Event): void => {\n  if (isDisclosureOpen.value) {\n    event.stopPropagation()\n  }\n  comboboxButtonRef.value?.$el.click()\n}\n\n/**\n * Updates the selected auth schemes.\n * Separates existing schemes from newly created ones for the event payload.\n */\nconst handleSchemeSelection = (selected: SecuritySchemeOption[]): void => {\n  const existingSchemes = selected\n    .filter((option) => option.payload === undefined)\n    .map((option) => unpackProxyObject(option.value, { depth: 2 }))\n\n  const newSchemes = selected\n    .filter((option) => option.payload !== undefined)\n    .map((option) => ({\n      name: option.label,\n      scheme: option.payload!,\n    }))\n\n  eventBus.emit('auth:update:selected-security-schemes', {\n    selectedRequirements: existingSchemes,\n    newSchemes,\n    meta,\n  })\n}\n\n/** Shows the delete confirmation modal for the selected scheme */\nconst handleDeleteRequest = (option: {\n  label: string\n  value: SecurityRequirementObject\n}): void => {\n  schemeToDelete.value = { label: option.label, payload: option.value }\n  deleteModal.show()\n}\n\n/** Deletes the selected auth scheme after confirmation */\nconst handleDeleteConfirm = (): void => {\n  if (!schemeToDelete.value) {\n    return\n  }\n\n  eventBus.emit('auth:delete:security-scheme', {\n    names: Object.keys(schemeToDelete.value.payload),\n  })\n\n  schemeToDelete.value = null\n  deleteModal.hide()\n}\n\ndefineExpose({\n  authIndicator,\n  selectedSchemeOptions: activeSchemeOptions,\n  schemeOptions: availableSchemeOptions,\n})\n</script>\n<template>\n  <CollapsibleSection\n    class=\"group/params relative\"\n    :defaultOpen\n    :isStatic=\"isStatic\"\n    :itemCount=\"activeSchemeOptions.length\"\n    @update:modelValue=\"(open) => (isDisclosureOpen = open)\">\n    <template #title>\n      <div\n        :id=\"titleId\"\n        class=\"inline-flex items-center gap-0.5 leading-[20px]\">\n        <span>{{ title }}</span>\n\n        <span\n          v-if=\"authIndicator\"\n          class=\"text-c-3 hover:bg-b-3 hover:text-c-1 -my-0.5 -mr-1 cursor-pointer rounded px-1 py-0.5 leading-[normal] font-normal\"\n          :class=\"{ 'text-c-1': authIndicator.text === 'Required' }\"\n          data-testid=\"auth-indicator\"\n          @click=\"handleAuthIndicatorClick\">\n          {{ authIndicator.text }}\n        </span>\n      </div>\n    </template>\n\n    <!-- Auth Dropdown (hidden when only one scheme is available) -->\n    <template #actions>\n      <ScalarComboboxMultiselect\n        class=\"w-72 text-xs\"\n        :modelValue=\"activeSchemeOptions\"\n        multiple\n        :options=\"availableSchemeOptions\"\n        placement=\"bottom-end\"\n        teleport\n        @delete=\"handleDeleteRequest\"\n        @update:modelValue=\"handleSchemeSelection\">\n        <ScalarButton\n          ref=\"comboboxButtonRef\"\n          :aria-describedby=\"titleId\"\n          class=\"group/combobox-button hover:text-c-1 text-c-2 flex h-fit w-full items-center gap-1 px-0.75 py-0.25 text-base font-normal\"\n          variant=\"ghost\">\n          <!-- Single auth scheme selected -->\n          <template v-if=\"activeSchemeOptions.length === 1\">\n            <span class=\"sr-only\">Selected Auth Type:</span>\n            {{ activeSchemeOptions[0]?.label }}\n          </template>\n\n          <!-- Multiple auth schemes selected -->\n          <template v-else-if=\"activeSchemeOptions.length > 1\">\n            Multiple\n            <span class=\"sr-only\">Auth Types Selected</span>\n          </template>\n\n          <!-- No auth schemes selected -->\n          <template v-else>\n            <span class=\"sr-only\">Select</span>\n            Auth Type\n          </template>\n\n          <ScalarIconCaretDown\n            class=\"size-3 shrink-0 transition-transform duration-100 group-aria-expanded/combobox-button:rotate-180\"\n            weight=\"bold\" />\n        </ScalarButton>\n\n        <template #option=\"{ option, selected }\">\n          <ScalarListboxCheckbox\n            multiselect\n            :selected=\"selected\" />\n          <div class=\"min-w-0 flex-1 truncate\">\n            {{ option.label }}\n          </div>\n          <ScalarIconButton\n            v-if=\"option.isDeletable\"\n            class=\"-m-0.5 shrink-0 p-0.5 opacity-0 group-hover/item:opacity-100\"\n            :icon=\"ScalarIconTrash\"\n            :label=\"`Delete ${option.label}`\"\n            size=\"xs\"\n            @click.stop=\"handleDeleteRequest(option)\" />\n        </template>\n      </ScalarComboboxMultiselect>\n    </template>\n\n    <!-- Auth Table -->\n    <RequestAuthDataTable\n      :activeAuthIndex=\"selectedSecurity?.selectedIndex ?? 0\"\n      :environment\n      :eventBus\n      :isStatic\n      :meta\n      :options\n      :proxyUrl\n      :securitySchemes\n      :selectedSchemeOptions=\"activeSchemeOptions\"\n      :server />\n\n    <!-- Delete Auth Modal -->\n    <DeleteRequestAuthModal\n      v-if=\"schemeToDelete\"\n      :label=\"schemeToDelete.label\"\n      :scheme=\"schemeToDelete\"\n      :state=\"deleteModal\"\n      @close=\"deleteModal.hide()\"\n      @delete=\"handleDeleteConfirm\" />\n  </CollapsibleSection>\n</template>\n"],"mappings":"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"}

package/dist/v2/blocks/scalar-auth-selector-block/components/OAuth2.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"OAuth2.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/scalar-auth-selector-block/components/OAuth2.vue"],"names":[],"mappings":"AAyaA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAA;AAIzE,OAAO,KAAK,EAEV,iBAAiB,EAClB,MAAM,gCAAgC,CAAA;AACvC,OAAO,EAKL,KAAK,sBAAsB,EAC3B,KAAK,0BAA0B,EAChC,MAAM,yCAAyC,CAAA;AAChD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2EAA2E,CAAA;AAGnH,OAAO,KAAK,EAEV,YAAY,EACb,MAAM,8DAA8D,CAAA;AAWrE,uDAAuD;AACvD,MAAM,MAAM,aAAa,GAAG,IAAI,CAAC,sBAAsB,EAAE,mBAAmB,CAAC,CAAA;wBACxD,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAEhB,wCAAwC;iBAC3B,kBAAkB;IAC/B,kBAAkB;WACX,sBAAsB;IAC7B,6BAA6B;UACvB,MAAM,sBAAsB;IAClC,sBAAsB;oBACN,MAAM,EAAE;IACxB,sBAAsB;YACd,0BAA0B;IAClC,mCAAmC;YAC3B,YAAY,GAAG,IAAI;IAC3B,gBAAgB;cACN,MAAM;IAChB,kCAAkC;UAC5B,MAAM;IACZ,2CAA2C;cACjC,iBAAiB;IAC3B,uDAAuD;cAC7C,aAAa;;;;;;;;;;;;;;IAnBvB,wCAAwC;iBAC3B,kBAAkB;IAC/B,kBAAkB;WACX,sBAAsB;IAC7B,6BAA6B;UACvB,MAAM,sBAAsB;IAClC,sBAAsB;oBACN,MAAM,EAAE;IACxB,sBAAsB;YACd,0BAA0B;IAClC,mCAAmC;YAC3B,YAAY,GAAG,IAAI;IAC3B,gBAAgB;cACN,MAAM;IAChB,kCAAkC;UAC5B,MAAM;IACZ,2CAA2C;cACjC,iBAAiB;IAC3B,uDAAuD;cAC7C,aAAa;;;;;;;;;;;;;kFAmxBrB,CAAC"}
+{"version":3,"file":"OAuth2.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/scalar-auth-selector-block/components/OAuth2.vue"],"names":[],"mappings":"AAqhBA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAA;AAIzE,OAAO,KAAK,EAEV,iBAAiB,EAClB,MAAM,gCAAgC,CAAA;AACvC,OAAO,EAKL,KAAK,sBAAsB,EAC3B,KAAK,0BAA0B,EAChC,MAAM,yCAAyC,CAAA;AAChD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2EAA2E,CAAA;AAGnH,OAAO,KAAK,EAEV,YAAY,EACb,MAAM,8DAA8D,CAAA;AAcrE,uDAAuD;AACvD,MAAM,MAAM,aAAa,GAAG,IAAI,CAAC,sBAAsB,EAAE,mBAAmB,CAAC,CAAA;wBACxD,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;IAEhB,wCAAwC;iBAC3B,kBAAkB;IAC/B,kBAAkB;WACX,sBAAsB;IAC7B,6BAA6B;UACvB,MAAM,sBAAsB;IAClC,sBAAsB;oBACN,MAAM,EAAE;IACxB,sBAAsB;YACd,0BAA0B;IAClC,mCAAmC;YAC3B,YAAY,GAAG,IAAI;IAC3B,gBAAgB;cACN,MAAM;IAChB,kCAAkC;UAC5B,MAAM;IACZ,2CAA2C;cACjC,iBAAiB;IAC3B,uDAAuD;cAC7C,aAAa;;;;;;;;;;;;;;IAnBvB,wCAAwC;iBAC3B,kBAAkB;IAC/B,kBAAkB;WACX,sBAAsB;IAC7B,6BAA6B;UACvB,MAAM,sBAAsB;IAClC,sBAAsB;oBACN,MAAM,EAAE;IACxB,sBAAsB;YACd,0BAA0B;IAClC,mCAAmC;YAC3B,YAAY,GAAG,IAAI;IAC3B,gBAAgB;cACN,MAAM;IAChB,kCAAkC;UAC5B,MAAM;IACZ,2CAA2C;cACjC,iBAAiB;IAC3B,uDAAuD;cAC7C,aAAa;;;;;;;;;;;;;kFAq7BrB,CAAC"}

package/dist/v2/blocks/scalar-auth-selector-block/components/OAuth2.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"OAuth2.vue.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-auth-selector-block/components/OAuth2.vue"],"sourcesContent":["<script lang=\"ts\">\n/**  Any config options required for the OAuth2 flow */\nexport type OAuth2Options = Pick<ApiClientConfiguration, 'oauth2RedirectUri'>\n</script>\n\n<script setup lang=\"ts\">\nimport { ScalarButton, useLoadingState } from '@scalar/components'\nimport type { ApiClientConfiguration } from '@scalar/types/api-reference'\nimport { pkceOptions } from '@scalar/types/entities'\nimport { useToasts } from '@scalar/use-toasts'\nimport type { SecretsOAuthFlows } from '@scalar/workspace-store/entities/auth'\nimport type {\n  ApiReferenceEvents,\n  WorkspaceEventBus,\n} from '@scalar/workspace-store/events'\nimport {\n  getEnvironmentVariables,\n  type OAuthFlowAuthorizationCodeSecret,\n  type OAuthFlowClientCredentialsSecret,\n  type OAuthFlowPasswordSecret,\n  type OAuthFlowsObjectSecret,\n  type SecuritySchemeObjectSecret,\n} from '@scalar/workspace-store/request-example'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type { XScalarCredentialsLocation } from '@scalar/workspace-store/schemas/extensions/security/x-scalar-credentials-location'\nimport { type XusePkce } from '@scalar/workspace-store/schemas/extensions/security/x-use-pkce'\nimport type {\n  OAuthFlow,\n  ServerObject,\n} from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { computed, ref, watch } from 'vue'\n\nimport OAuthScopesInput from '@/v2/blocks/scalar-auth-selector-block/components/OAuthScopesInput.vue'\nimport { authorizeOauth2 } from '@/v2/blocks/scalar-auth-selector-block/helpers/oauth'\nimport { resolveDefaultOAuth2RedirectUri } from '@/v2/blocks/scalar-auth-selector-block/helpers/resolve-default-oauth2-redirect-url'\nimport { DataTableRow } from '@/v2/components/data-table'\n\nimport RequestAuthDataTableInput from './RequestAuthDataTableInput.vue'\n\nconst {\n  environment,\n  flows,\n  type,\n  scheme,\n  selectedScopes: selectedScopesProp,\n  server,\n  proxyUrl,\n  eventBus,\n  name,\n  options = {},\n} = defineProps<{\n  /** Current environment configuration */\n  environment: XScalarEnvironment\n  /** OAuth flows */\n  flows: OAuthFlowsObjectSecret\n  /** Type of the OAuth flow */\n  type: keyof OAuthFlowsObjectSecret\n  /** Selected scopes */\n  selectedScopes: string[]\n  /** Security scheme */\n  scheme: SecuritySchemeObjectSecret\n  /** Current server configuration */\n  server: ServerObject | null\n  /** Proxy URL */\n  proxyUrl: string\n  /** Name of the security scheme */\n  name: string\n  /** Event bus for authentication updates */\n  eventBus: WorkspaceEventBus\n  /**  Any config options required for the OAuth2 flow */\n  options?: OAuth2Options\n}>()\n\nconst emits = defineEmits<{\n  (\n    e: 'update:selectedScopes',\n    payload: Pick<\n      ApiReferenceEvents['auth:update:selected-scopes'],\n      'scopes' | 'newScopePayload'\n    >,\n  ): void\n}>()\n\nconst loader = useLoadingState()\nconst { toast } = useToasts()\n\n/** The current OAuth flow based on the selected type */\nconst flow = computed(() => flows[type]!)\ntype NonImplicitFlow =\n  | OAuthFlowPasswordSecret\n  | OAuthFlowClientCredentialsSecret\n  | OAuthFlowAuthorizationCodeSecret\n\n/** We filter selected scopes to only include scopes that are in this flow*/\nconst selectedScopes = computed(() =>\n  selectedScopesProp.filter((scope) => scope in (flow.value.scopes ?? {})),\n)\n\n/** Updates the security scheme base */\nconst handleOauth2Update = (\n  payload: Partial<OAuthFlow & XScalarCredentialsLocation>,\n): void => {\n  // OpenIdConnect uses the secrets update for all\n  if (scheme.type === 'openIdConnect') {\n    return handleOauth2SecretsUpdate(payload)\n  }\n\n  eventBus.emit('auth:update:security-scheme', {\n    payload: {\n      type: scheme.type,\n      flows: {\n        [type]: payload,\n      },\n    },\n    name,\n  })\n}\n\n/** Updates the flow secrets */\nconst handleOauth2SecretsUpdate = (\n  payload: Omit<Partial<SecretsOAuthFlows[keyof SecretsOAuthFlows]>, 'type'>,\n): void =>\n  eventBus.emit('auth:update:security-scheme-secrets', {\n    payload: {\n      type: scheme.type,\n      [type]: payload,\n    },\n    name,\n  })\n\n/** Clears the flow secrets */\nconst clearOauth2Secrets = (): void =>\n  eventBus.emit('auth:clear:security-scheme-secrets', {\n    name,\n  })\n\n/** Track if we have set the redirect uri */\nconst hasPrefilledRedirectUri = ref(false)\n\n/** Default the redirect-uri to the current origin if we have access to window */\nwatch(\n  () =>\n    (flow.value as OAuthFlowAuthorizationCodeSecret)[\n      'x-scalar-secret-redirect-uri'\n    ],\n  (newRedirectUri) => {\n    const defaultRedirectUri = resolveDefaultOAuth2RedirectUri(options)\n\n    if (\n      hasPrefilledRedirectUri.value ||\n      newRedirectUri ||\n      !defaultRedirectUri ||\n      !('x-scalar-secret-redirect-uri' in flow.value)\n    ) {\n      return\n    }\n    hasPrefilledRedirectUri.value = true\n    handleOauth2SecretsUpdate({\n      'x-scalar-secret-redirect-uri': defaultRedirectUri,\n    })\n  },\n  { immediate: true },\n)\n\n/**\n * Authorizes the user using the specified OAuth flow.\n * Opens the appropriate OAuth dialog and/or performs the token exchange.\n */\nconst handleAuthorize = async (): Promise<void> => {\n  if (loader.isLoading) {\n    return\n  }\n\n  loader.start()\n\n  const [error, tokens] = await authorizeOauth2(\n    flows,\n    type,\n    selectedScopes.value,\n    server,\n    proxyUrl,\n    getEnvironmentVariables(environment),\n  )\n\n  await loader.clear()\n\n  if (tokens?.accessToken) {\n    handleOauth2SecretsUpdate({\n      'x-scalar-secret-token': tokens.accessToken,\n      ...(tokens.refreshToken\n        ? { 'x-scalar-secret-refresh-token': tokens.refreshToken }\n        : {}),\n    })\n  } else {\n    console.error(error)\n    toast(error?.message ?? 'Failed to authorize', 'error')\n  }\n}\n\n/** Updates the secret location */\nconst handleSecretLocationUpdate = (value: string): void => {\n  const credentialsLocation = value === 'body' ? 'body' : 'header'\n\n  if (scheme.type !== 'openIdConnect') {\n    handleOauth2Update({\n      'x-scalar-credentials-location': credentialsLocation,\n    })\n  }\n\n  handleOauth2SecretsUpdate({\n    'x-scalar-credentials-location': credentialsLocation,\n  })\n}\n</script>\n\n<template>\n  <!-- Access Token Display: Shows when user is already authorized -->\n  <template v-if=\"Boolean(flow['x-scalar-secret-token'])\">\n    <DataTableRow>\n      <RequestAuthDataTableInput\n        class=\"border-r-transparent\"\n        :environment\n        :modelValue=\"flow['x-scalar-secret-token']\"\n        placeholder=\"QUxMIFlPVVIgQkFTRSBBUkUgQkVMT05HIFRPIFVT\"\n        type=\"password\"\n        @update:modelValue=\"\n          (v) => handleOauth2SecretsUpdate({ 'x-scalar-secret-token': v })\n        \">\n        Access Token\n      </RequestAuthDataTableInput>\n    </DataTableRow>\n\n    <DataTableRow class=\"min-w-full\">\n      <div class=\"flex h-8 items-center justify-end gap-2 border-t\">\n        <ScalarButton\n          class=\"mr-1 p-0 px-2 py-0.5\"\n          :loader\n          size=\"sm\"\n          variant=\"outlined\"\n          @click=\"\n            () =>\n              handleOauth2SecretsUpdate({\n                'x-scalar-secret-token': '',\n                'x-scalar-secret-refresh-token': '',\n              })\n          \">\n          Clear\n        </ScalarButton>\n      </div>\n    </DataTableRow>\n  </template>\n\n  <!-- Authorization Form: Shows when user needs to authorize -->\n  <template v-else>\n    <DataTableRow>\n      <RequestAuthDataTableInput\n        v-if=\"'authorizationUrl' in flow\"\n        containerClass=\"border-r-0\"\n        :environment\n        :modelValue=\"flow['x-scalar-secret-auth-url'] ?? ''\"\n        placeholder=\"https://galaxy.scalar.com/authorize\"\n        @update:modelValue=\"\n          (v) => {\n            handleOauth2SecretsUpdate({ 'x-scalar-secret-auth-url': v })\n            handleOauth2Update({ authorizationUrl: v })\n          }\n        \">\n        Auth URL\n      </RequestAuthDataTableInput>\n\n      <RequestAuthDataTableInput\n        v-if=\"'tokenUrl' in flow\"\n        :environment\n        :modelValue=\"flow['x-scalar-secret-token-url'] ?? ''\"\n        placeholder=\"https://galaxy.scalar.com/token\"\n        @update:modelValue=\"\n          (v) => {\n            handleOauth2SecretsUpdate({ 'x-scalar-secret-token-url': v })\n            handleOauth2Update({ tokenUrl: v })\n          }\n        \">\n        Token URL\n      </RequestAuthDataTableInput>\n    </DataTableRow>\n\n    <DataTableRow v-if=\"'x-scalar-secret-redirect-uri' in flow\">\n      <RequestAuthDataTableInput\n        :environment\n        :modelValue=\"flow['x-scalar-secret-redirect-uri']\"\n        placeholder=\"https://galaxy.scalar.com/callback\"\n        @update:modelValue=\"\n          (v) => {\n            handleOauth2SecretsUpdate({ 'x-scalar-secret-redirect-uri': v })\n          }\n        \">\n        Redirect URL\n      </RequestAuthDataTableInput>\n    </DataTableRow>\n\n    <template\n      v-if=\"\n        'x-scalar-secret-username' in flow && 'x-scalar-secret-password' in flow\n      \">\n      <DataTableRow>\n        <RequestAuthDataTableInput\n          class=\"text-c-2\"\n          :environment\n          :modelValue=\"flow['x-scalar-secret-username']\"\n          placeholder=\"janedoe\"\n          @update:modelValue=\"\n            (v) => handleOauth2SecretsUpdate({ 'x-scalar-secret-username': v })\n          \">\n          Username\n        </RequestAuthDataTableInput>\n      </DataTableRow>\n\n      <DataTableRow>\n        <RequestAuthDataTableInput\n          :environment\n          :modelValue=\"flow['x-scalar-secret-password']\"\n          placeholder=\"********\"\n          type=\"password\"\n          @update:modelValue=\"\n            (v) => handleOauth2SecretsUpdate({ 'x-scalar-secret-password': v })\n          \">\n          Password\n        </RequestAuthDataTableInput>\n      </DataTableRow>\n    </template>\n\n    <DataTableRow>\n      <RequestAuthDataTableInput\n        :environment\n        :modelValue=\"flow['x-scalar-secret-client-id']\"\n        placeholder=\"12345\"\n        @update:modelValue=\"\n          (v) => handleOauth2SecretsUpdate({ 'x-scalar-secret-client-id': v })\n        \">\n        Client ID\n      </RequestAuthDataTableInput>\n    </DataTableRow>\n\n    <DataTableRow v-if=\"'x-scalar-secret-client-secret' in flow\">\n      <RequestAuthDataTableInput\n        :environment\n        :modelValue=\"flow['x-scalar-secret-client-secret']\"\n        placeholder=\"XYZ123\"\n        type=\"password\"\n        @update:modelValue=\"\n          (v) =>\n            handleOauth2SecretsUpdate({ 'x-scalar-secret-client-secret': v })\n        \">\n        Client Secret\n      </RequestAuthDataTableInput>\n    </DataTableRow>\n\n    <DataTableRow v-if=\"'x-usePkce' in flow\">\n      <RequestAuthDataTableInput\n        :enum=\"pkceOptions\"\n        :environment\n        :modelValue=\"flow['x-usePkce']\"\n        readOnly\n        @update:modelValue=\"\n          (v) =>\n            handleOauth2Update({\n              'x-usePkce': v as XusePkce['x-usePkce'],\n            })\n        \">\n        Use PKCE\n      </RequestAuthDataTableInput>\n    </DataTableRow>\n\n    <!-- Credentials Location -->\n    <DataTableRow v-if=\"type !== 'implicit'\">\n      <RequestAuthDataTableInput\n        :enum=\"['header', 'body']\"\n        :environment\n        :modelValue=\"\n          (flow as NonImplicitFlow)['x-scalar-credentials-location'] || 'header'\n        \"\n        placeholder=\"header\"\n        readOnly\n        @update:modelValue=\"(v) => handleSecretLocationUpdate(v)\">\n        Credentials Location\n      </RequestAuthDataTableInput>\n    </DataTableRow>\n\n    <!-- Scopes -->\n    <DataTableRow>\n      <OAuthScopesInput\n        :flow\n        :flowType=\"type\"\n        :selectedScopes\n        @update:selectedScopes=\"(v) => emits('update:selectedScopes', v)\" />\n    </DataTableRow>\n\n    <DataTableRow class=\"min-w-full\">\n      <div class=\"flex h-8 w-full items-center justify-end border-t\">\n        <!-- Allow clearing the oauth section and going back to discovery -->\n        <ScalarButton\n          v-if=\"scheme.type === 'openIdConnect'\"\n          class=\"mr-1 p-0 px-2 py-0.5\"\n          :loader\n          size=\"sm\"\n          variant=\"outlined\"\n          @click=\"clearOauth2Secrets\">\n          Clear\n        </ScalarButton>\n\n        <ScalarButton\n          class=\"mr-0.75 p-0 px-2 py-0.5\"\n          :loader\n          size=\"sm\"\n          variant=\"outlined\"\n          @click=\"handleAuthorize\">\n          Authorize\n        </ScalarButton>\n      </div>\n    </DataTableRow>\n  </template>\n</template>\n"],"mappings":""}
+{"version":3,"file":"OAuth2.vue.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-auth-selector-block/components/OAuth2.vue"],"sourcesContent":["<script lang=\"ts\">\n/**  Any config options required for the OAuth2 flow */\nexport type OAuth2Options = Pick<ApiClientConfiguration, 'oauth2RedirectUri'>\n</script>\n\n<script setup lang=\"ts\">\nimport { ScalarButton, useLoadingState } from '@scalar/components'\nimport type { ApiClientConfiguration } from '@scalar/types/api-reference'\nimport { pkceOptions } from '@scalar/types/entities'\nimport { useToasts } from '@scalar/use-toasts'\nimport type { SecretsOAuthFlows } from '@scalar/workspace-store/entities/auth'\nimport type {\n  ApiReferenceEvents,\n  WorkspaceEventBus,\n} from '@scalar/workspace-store/events'\nimport {\n  getEnvironmentVariables,\n  type OAuthFlowAuthorizationCodeSecret,\n  type OAuthFlowClientCredentialsSecret,\n  type OAuthFlowPasswordSecret,\n  type OAuthFlowsObjectSecret,\n  type SecuritySchemeObjectSecret,\n} from '@scalar/workspace-store/request-example'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type { XScalarCredentialsLocation } from '@scalar/workspace-store/schemas/extensions/security/x-scalar-credentials-location'\nimport { type XusePkce } from '@scalar/workspace-store/schemas/extensions/security/x-use-pkce'\nimport type {\n  OAuthFlow,\n  ServerObject,\n} from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { computed, ref, watch } from 'vue'\n\nimport OAuthScopesInput from '@/v2/blocks/scalar-auth-selector-block/components/OAuthScopesInput.vue'\nimport {\n  authorizeOauth2,\n  refreshOauth2Token,\n} from '@/v2/blocks/scalar-auth-selector-block/helpers/oauth'\nimport { resolveDefaultOAuth2RedirectUri } from '@/v2/blocks/scalar-auth-selector-block/helpers/resolve-default-oauth2-redirect-url'\nimport { DataTableRow } from '@/v2/components/data-table'\n\nimport RequestAuthDataTableInput from './RequestAuthDataTableInput.vue'\n\nconst {\n  environment,\n  flows,\n  type,\n  scheme,\n  selectedScopes: selectedScopesProp,\n  server,\n  proxyUrl,\n  eventBus,\n  name,\n  options = {},\n} = defineProps<{\n  /** Current environment configuration */\n  environment: XScalarEnvironment\n  /** OAuth flows */\n  flows: OAuthFlowsObjectSecret\n  /** Type of the OAuth flow */\n  type: keyof OAuthFlowsObjectSecret\n  /** Selected scopes */\n  selectedScopes: string[]\n  /** Security scheme */\n  scheme: SecuritySchemeObjectSecret\n  /** Current server configuration */\n  server: ServerObject | null\n  /** Proxy URL */\n  proxyUrl: string\n  /** Name of the security scheme */\n  name: string\n  /** Event bus for authentication updates */\n  eventBus: WorkspaceEventBus\n  /**  Any config options required for the OAuth2 flow */\n  options?: OAuth2Options\n}>()\n\nconst emits = defineEmits<{\n  (\n    e: 'update:selectedScopes',\n    payload: Pick<\n      ApiReferenceEvents['auth:update:selected-scopes'],\n      'scopes' | 'newScopePayload'\n    >,\n  ): void\n}>()\n\nconst loader = useLoadingState()\nconst { toast } = useToasts()\n\n/** The current OAuth flow based on the selected type */\nconst flow = computed(() => flows[type]!)\ntype NonImplicitFlow =\n  | OAuthFlowPasswordSecret\n  | OAuthFlowClientCredentialsSecret\n  | OAuthFlowAuthorizationCodeSecret\n\n/** We filter selected scopes to only include scopes that are in this flow*/\nconst selectedScopes = computed(() =>\n  selectedScopesProp.filter((scope) => scope in (flow.value.scopes ?? {})),\n)\n\n/** Updates the security scheme base */\nconst handleOauth2Update = (\n  payload: Partial<OAuthFlow & XScalarCredentialsLocation>,\n): void => {\n  // OpenIdConnect uses the secrets update for all\n  if (scheme.type === 'openIdConnect') {\n    return handleOauth2SecretsUpdate(payload)\n  }\n\n  eventBus.emit('auth:update:security-scheme', {\n    payload: {\n      type: scheme.type,\n      flows: {\n        [type]: payload,\n      },\n    },\n    name,\n  })\n}\n\n/** Updates the flow secrets */\nconst handleOauth2SecretsUpdate = (\n  payload: Omit<Partial<SecretsOAuthFlows[keyof SecretsOAuthFlows]>, 'type'>,\n): void =>\n  eventBus.emit('auth:update:security-scheme-secrets', {\n    payload: {\n      type: scheme.type,\n      [type]: payload,\n    },\n    name,\n  })\n\n/** Clears the flow secrets */\nconst clearOauth2Secrets = (): void => {\n  if (loader.isLoading) {\n    return\n  }\n  eventBus.emit('auth:clear:security-scheme-secrets', {\n    name,\n  })\n}\n\n/** Clears stored access and refresh tokens (authorized state) */\nconst handleClearAccessTokens = (): void => {\n  if (loader.isLoading) {\n    return\n  }\n  handleOauth2SecretsUpdate({\n    'x-scalar-secret-token': '',\n    'x-scalar-secret-refresh-token': '',\n  })\n}\n\n/** Track redirect URI prefill per flow instance to support document switching */\nconst prefilledFlowIdentity = ref<string | null>(null)\nconst hasHandledRedirectPrefill = ref(false)\n\nconst resolveFlowIdentity = (\n  currentFlow: OAuthFlowsObjectSecret[keyof OAuthFlowsObjectSecret] | undefined,\n): string =>\n  JSON.stringify({\n    type,\n    authorizationUrl:\n      currentFlow && 'authorizationUrl' in currentFlow\n        ? currentFlow.authorizationUrl\n        : '',\n    tokenUrl:\n      currentFlow && 'tokenUrl' in currentFlow ? currentFlow.tokenUrl : '',\n    refreshUrl: currentFlow?.refreshUrl ?? '',\n    scopes: Object.keys(currentFlow?.scopes ?? {}),\n  })\n\n/** Default the redirect-uri to the current origin if we have access to window */\nwatch(\n  () => flow.value,\n  (currentFlow) => {\n    if (!currentFlow || !('x-scalar-secret-redirect-uri' in currentFlow)) {\n      return\n    }\n\n    const flowIdentity = resolveFlowIdentity(currentFlow)\n    if (prefilledFlowIdentity.value !== flowIdentity) {\n      prefilledFlowIdentity.value = flowIdentity\n      hasHandledRedirectPrefill.value = false\n    }\n\n    if (hasHandledRedirectPrefill.value) {\n      return\n    }\n\n    const newRedirectUri = (currentFlow as OAuthFlowAuthorizationCodeSecret)[\n      'x-scalar-secret-redirect-uri'\n    ]\n    const defaultRedirectUri = resolveDefaultOAuth2RedirectUri(options)\n\n    hasHandledRedirectPrefill.value = true\n\n    if (newRedirectUri || !defaultRedirectUri) {\n      return\n    }\n\n    handleOauth2SecretsUpdate({\n      'x-scalar-secret-redirect-uri': defaultRedirectUri,\n    })\n  },\n  { immediate: true },\n)\n\n/**\n * Authorizes the user using the specified OAuth flow.\n * Opens the appropriate OAuth dialog and/or performs the token exchange.\n */\nconst handleAuthorize = async (): Promise<void> => {\n  if (loader.isLoading) {\n    return\n  }\n\n  loader.start()\n\n  const [error, tokens] = await authorizeOauth2(\n    flows,\n    type,\n    selectedScopes.value,\n    server,\n    proxyUrl,\n    getEnvironmentVariables(environment),\n  )\n\n  await loader.clear()\n\n  if (tokens?.accessToken) {\n    handleOauth2SecretsUpdate({\n      'x-scalar-secret-token': tokens.accessToken,\n      ...(tokens.refreshToken\n        ? { 'x-scalar-secret-refresh-token': tokens.refreshToken }\n        : {}),\n    })\n  } else {\n    console.error(error)\n    toast(error?.message ?? 'Failed to authorize', 'error')\n  }\n}\n\n/** Whether the current flow supports refreshing the access token */\nconst supportsRefreshToken = computed(() => type !== 'implicit')\n\n/**\n * Refresh URL placeholder, shows tokenUrl as hint if refreshUrl is not specified.\n * This helps users understand that tokenUrl will be used as fallback.\n */\nconst refreshUrlPlaceholder = computed(() => {\n  if ('tokenUrl' in flow.value && flow.value.tokenUrl) {\n    return flow.value.tokenUrl\n  }\n  return 'https://galaxy.scalar.com/oauth/refresh'\n})\n\n/**\n * Uses the stored refresh token to obtain a new access token\n * via grant_type=refresh_token.\n */\nconst handleRefresh = async (): Promise<void> => {\n  if (loader.isLoading || type === 'implicit') {\n    return\n  }\n\n  loader.start()\n\n  const [error, tokens] = await refreshOauth2Token(\n    flows,\n    type,\n    proxyUrl,\n    server,\n    getEnvironmentVariables(environment),\n  )\n\n  await loader.clear()\n\n  if (tokens?.accessToken) {\n    handleOauth2SecretsUpdate({\n      'x-scalar-secret-token': tokens.accessToken,\n      ...(tokens.refreshToken\n        ? { 'x-scalar-secret-refresh-token': tokens.refreshToken }\n        : {}),\n    })\n  } else {\n    console.error(error)\n    toast(error?.message ?? 'Failed to refresh token', 'error')\n  }\n}\n\n/** Updates the secret location */\nconst handleSecretLocationUpdate = (value: string): void => {\n  const credentialsLocation = value === 'body' ? 'body' : 'header'\n\n  if (scheme.type !== 'openIdConnect') {\n    handleOauth2Update({\n      'x-scalar-credentials-location': credentialsLocation,\n    })\n  }\n\n  handleOauth2SecretsUpdate({\n    'x-scalar-credentials-location': credentialsLocation,\n  })\n}\n</script>\n\n<template>\n  <!-- Access Token Display: Shows when user is already authorized -->\n  <template v-if=\"Boolean(flow['x-scalar-secret-token'])\">\n    <DataTableRow>\n      <RequestAuthDataTableInput\n        class=\"border-r-transparent\"\n        :environment\n        :modelValue=\"flow['x-scalar-secret-token']\"\n        placeholder=\"QUxMIFlPVVIgQkFTRSBBUkUgQkVMT05HIFRPIFVT\"\n        type=\"password\"\n        @update:modelValue=\"\n          (v) => handleOauth2SecretsUpdate({ 'x-scalar-secret-token': v })\n        \">\n        Access Token\n      </RequestAuthDataTableInput>\n    </DataTableRow>\n\n    <DataTableRow v-if=\"supportsRefreshToken\">\n      <RequestAuthDataTableInput\n        class=\"border-r-transparent\"\n        :environment\n        :modelValue=\"flow.refreshUrl ?? ''\"\n        :placeholder=\"refreshUrlPlaceholder\"\n        @update:modelValue=\"(v) => handleOauth2Update({ refreshUrl: v })\">\n        Refresh URL\n      </RequestAuthDataTableInput>\n    </DataTableRow>\n\n    <DataTableRow class=\"min-w-full\">\n      <div class=\"flex h-8 items-center justify-end gap-2 border-t\">\n        <ScalarButton\n          v-if=\"supportsRefreshToken\"\n          class=\"p-0 px-2 py-0.5\"\n          :loader\n          size=\"sm\"\n          variant=\"outlined\"\n          @click=\"handleRefresh\">\n          Refresh\n        </ScalarButton>\n        <ScalarButton\n          class=\"mr-1 p-0 px-2 py-0.5\"\n          :disabled=\"loader.isLoading\"\n          size=\"sm\"\n          variant=\"outlined\"\n          @click=\"handleClearAccessTokens\">\n          Clear\n        </ScalarButton>\n      </div>\n    </DataTableRow>\n  </template>\n\n  <!-- Authorization Form: Shows when user needs to authorize -->\n  <template v-else>\n    <DataTableRow>\n      <RequestAuthDataTableInput\n        v-if=\"'authorizationUrl' in flow\"\n        containerClass=\"border-r-0\"\n        :environment\n        :modelValue=\"flow['x-scalar-secret-auth-url'] ?? ''\"\n        placeholder=\"https://galaxy.scalar.com/authorize\"\n        @update:modelValue=\"\n          (v) => {\n            handleOauth2SecretsUpdate({ 'x-scalar-secret-auth-url': v })\n            handleOauth2Update({ authorizationUrl: v })\n          }\n        \">\n        Auth URL\n      </RequestAuthDataTableInput>\n\n      <RequestAuthDataTableInput\n        v-if=\"'tokenUrl' in flow\"\n        :environment\n        :modelValue=\"flow['x-scalar-secret-token-url'] ?? ''\"\n        placeholder=\"https://galaxy.scalar.com/token\"\n        @update:modelValue=\"\n          (v) => {\n            handleOauth2SecretsUpdate({ 'x-scalar-secret-token-url': v })\n            handleOauth2Update({ tokenUrl: v })\n          }\n        \">\n        Token URL\n      </RequestAuthDataTableInput>\n    </DataTableRow>\n\n    <DataTableRow v-if=\"'x-scalar-secret-redirect-uri' in flow\">\n      <RequestAuthDataTableInput\n        :environment\n        :modelValue=\"flow['x-scalar-secret-redirect-uri']\"\n        placeholder=\"Optional redirect URL\"\n        @update:modelValue=\"\n          (v) => {\n            hasHandledRedirectPrefill = true\n            handleOauth2SecretsUpdate({ 'x-scalar-secret-redirect-uri': v })\n          }\n        \">\n        Redirect URL\n      </RequestAuthDataTableInput>\n    </DataTableRow>\n\n    <template\n      v-if=\"\n        'x-scalar-secret-username' in flow && 'x-scalar-secret-password' in flow\n      \">\n      <DataTableRow>\n        <RequestAuthDataTableInput\n          class=\"text-c-2\"\n          :environment\n          :modelValue=\"flow['x-scalar-secret-username']\"\n          placeholder=\"janedoe\"\n          @update:modelValue=\"\n            (v) => handleOauth2SecretsUpdate({ 'x-scalar-secret-username': v })\n          \">\n          Username\n        </RequestAuthDataTableInput>\n      </DataTableRow>\n\n      <DataTableRow>\n        <RequestAuthDataTableInput\n          :environment\n          :modelValue=\"flow['x-scalar-secret-password']\"\n          placeholder=\"********\"\n          type=\"password\"\n          @update:modelValue=\"\n            (v) => handleOauth2SecretsUpdate({ 'x-scalar-secret-password': v })\n          \">\n          Password\n        </RequestAuthDataTableInput>\n      </DataTableRow>\n    </template>\n\n    <DataTableRow>\n      <RequestAuthDataTableInput\n        :environment\n        :modelValue=\"flow['x-scalar-secret-client-id']\"\n        placeholder=\"12345\"\n        @update:modelValue=\"\n          (v) => handleOauth2SecretsUpdate({ 'x-scalar-secret-client-id': v })\n        \">\n        Client ID\n      </RequestAuthDataTableInput>\n    </DataTableRow>\n\n    <DataTableRow v-if=\"'x-scalar-secret-client-secret' in flow\">\n      <RequestAuthDataTableInput\n        :environment\n        :modelValue=\"flow['x-scalar-secret-client-secret']\"\n        placeholder=\"XYZ123\"\n        type=\"password\"\n        @update:modelValue=\"\n          (v) =>\n            handleOauth2SecretsUpdate({ 'x-scalar-secret-client-secret': v })\n        \">\n        Client Secret\n      </RequestAuthDataTableInput>\n    </DataTableRow>\n\n    <DataTableRow v-if=\"'x-usePkce' in flow\">\n      <RequestAuthDataTableInput\n        :enum=\"pkceOptions\"\n        :environment\n        :modelValue=\"flow['x-usePkce']\"\n        readOnly\n        @update:modelValue=\"\n          (v) =>\n            handleOauth2Update({\n              'x-usePkce': v as XusePkce['x-usePkce'],\n            })\n        \">\n        Use PKCE\n      </RequestAuthDataTableInput>\n    </DataTableRow>\n\n    <!-- Credentials Location -->\n    <DataTableRow v-if=\"type !== 'implicit'\">\n      <RequestAuthDataTableInput\n        :enum=\"['header', 'body']\"\n        :environment\n        :modelValue=\"\n          (flow as NonImplicitFlow)['x-scalar-credentials-location'] || 'header'\n        \"\n        placeholder=\"header\"\n        readOnly\n        @update:modelValue=\"(v) => handleSecretLocationUpdate(v)\">\n        Credentials Location\n      </RequestAuthDataTableInput>\n    </DataTableRow>\n\n    <!-- Scopes -->\n    <DataTableRow>\n      <OAuthScopesInput\n        :flow\n        :flowType=\"type\"\n        :selectedScopes\n        @update:selectedScopes=\"(v) => emits('update:selectedScopes', v)\" />\n    </DataTableRow>\n\n    <DataTableRow class=\"min-w-full\">\n      <div class=\"flex h-8 w-full items-center justify-end border-t\">\n        <!-- Allow clearing the oauth section and going back to discovery -->\n        <ScalarButton\n          v-if=\"scheme.type === 'openIdConnect'\"\n          class=\"mr-1 p-0 px-2 py-0.5\"\n          :disabled=\"loader.isLoading\"\n          size=\"sm\"\n          variant=\"outlined\"\n          @click=\"clearOauth2Secrets\">\n          Clear\n        </ScalarButton>\n\n        <ScalarButton\n          class=\"mr-0.75 p-0 px-2 py-0.5\"\n          :loader\n          size=\"sm\"\n          variant=\"outlined\"\n          @click=\"handleAuthorize\">\n          Authorize\n        </ScalarButton>\n      </div>\n    </DataTableRow>\n  </template>\n</template>\n"],"mappings":""}