@scalar/api-client 2.38.3 → 2.39.0

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

@@ -0,0 +1 @@
+{"version":3,"file":"OpenIDConnect.vue.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-auth-selector-block/components/OpenIDConnect.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton, useLoadingState } from '@scalar/components'\nimport { useToasts } from '@scalar/use-toasts'\nimport type { WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport { type OpenIdConnectObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\n\nimport { DataTableRow } from '@/components/DataTable'\nimport { fetchOpenIDConnectDiscovery } from '@/v2/blocks/scalar-auth-selector-block/helpers/fetch-openid-connect-discovery'\nimport { openIDDiscoveryToFlows } from '@/v2/blocks/scalar-auth-selector-block/helpers/openid-discovery-to-flows'\n\nimport RequestAuthDataTableInput from './RequestAuthDataTableInput.vue'\n\nconst { environment, eventBus, getStaticBorderClass, name, scheme, proxyUrl } =\n  defineProps<{\n    /** Current environment configuration */\n    environment: XScalarEnvironment\n    /** Event bus for authentication updates */\n    eventBus: WorkspaceEventBus\n    /** Get the static border class */\n    getStaticBorderClass: () => string | false\n    /** Name of the security scheme */\n    name: string\n    /** Proxy URL */\n    proxyUrl: string\n    /** OpenID Connect scheme */\n    scheme: OpenIdConnectObject\n  }>()\n\nconst loader = useLoadingState()\nconst { toast } = useToasts()\n\n/**\n * Fetches the OpenID Connect discovery document and triggers authorization\n */\nconst handleOpenIdConnect = async (): Promise<void> => {\n  if (loader.isLoading || !scheme.openIdConnectUrl) {\n    return\n  }\n\n  loader.start()\n  const [error, _discovery] = await fetchOpenIDConnectDiscovery(\n    scheme.openIdConnectUrl,\n    proxyUrl,\n  )\n  await loader.clear()\n\n  // Toast for error\n  if (error) {\n    console.error(error)\n    toast(\n      error?.message ?? 'Failed to fetch OpenID Connect configuration',\n      'error',\n    )\n    return\n  }\n\n  /** Set the newly discovered params in the secret store */\n  const openIdConnect = openIDDiscoveryToFlows(_discovery)\n  eventBus.emit('auth:update:security-scheme-secrets', {\n    payload: openIdConnect,\n    name,\n    overwrite: true,\n  })\n}\n\nconst handleUpdateOpenIdConnectUrl = (value: string): void =>\n  eventBus.emit('auth:update:security-scheme', {\n    payload: {\n      type: 'openIdConnect',\n      openIdConnectUrl: value,\n    },\n    name,\n  })\n</script>\n\n<template>\n  <DataTableRow>\n    <RequestAuthDataTableInput\n      :containerClass=\"getStaticBorderClass()\"\n      :environment\n      :modelValue=\"scheme.openIdConnectUrl\"\n      placeholder=\"https://example.com/.well-known/openid-configuration\"\n      required\n      @update:modelValue=\"handleUpdateOpenIdConnectUrl\">\n      Discovery URL\n    </RequestAuthDataTableInput>\n  </DataTableRow>\n\n  <DataTableRow class=\"min-w-full\">\n    <div class=\"flex h-8 w-full items-center justify-end border-t\">\n      <ScalarButton\n        class=\"mr-0.75 p-0 px-2 py-0.5\"\n        :disabled=\"!scheme.openIdConnectUrl\"\n        :loader\n        size=\"sm\"\n        variant=\"outlined\"\n        @click=\"handleOpenIdConnect\">\n        Fetch Configuration\n      </ScalarButton>\n    </div>\n  </DataTableRow>\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,89 @@
+import DataTableRow_default from "../../../../components/DataTable/DataTableRow.vue.js";
+import RequestAuthDataTableInput_default from "./RequestAuthDataTableInput.vue.js";
+import { fetchOpenIDConnectDiscovery } from "../helpers/fetch-openid-connect-discovery.js";
+import { openIDDiscoveryToFlows } from "../helpers/openid-discovery-to-flows.js";
+import { Fragment, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, openBlock, unref, withCtx } from "vue";
+import { ScalarButton, useLoadingState } from "@scalar/components";
+import { useToasts } from "@scalar/use-toasts";
+//#region src/v2/blocks/scalar-auth-selector-block/components/OpenIDConnect.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "flex h-8 w-full items-center justify-end border-t" };
+var OpenIDConnect_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "OpenIDConnect",
+	props: {
+		environment: {},
+		eventBus: {},
+		getStaticBorderClass: { type: Function },
+		name: {},
+		proxyUrl: {},
+		scheme: {}
+	},
+	setup(__props) {
+		const loader = useLoadingState();
+		const { toast } = useToasts();
+		/**
+		* Fetches the OpenID Connect discovery document and triggers authorization
+		*/
+		const handleOpenIdConnect = async () => {
+			if (loader.isLoading || !__props.scheme.openIdConnectUrl) return;
+			loader.start();
+			const [error, _discovery] = await fetchOpenIDConnectDiscovery(__props.scheme.openIdConnectUrl, __props.proxyUrl);
+			await loader.clear();
+			if (error) {
+				console.error(error);
+				toast(error?.message ?? "Failed to fetch OpenID Connect configuration", "error");
+				return;
+			}
+			/** Set the newly discovered params in the secret store */
+			const openIdConnect = openIDDiscoveryToFlows(_discovery);
+			__props.eventBus.emit("auth:update:security-scheme-secrets", {
+				payload: openIdConnect,
+				name: __props.name,
+				overwrite: true
+			});
+		};
+		const handleUpdateOpenIdConnectUrl = (value) => __props.eventBus.emit("auth:update:security-scheme", {
+			payload: {
+				type: "openIdConnect",
+				openIdConnectUrl: value
+			},
+			name: __props.name
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock(Fragment, null, [createVNode(unref(DataTableRow_default), null, {
+				default: withCtx(() => [createVNode(RequestAuthDataTableInput_default, {
+					containerClass: __props.getStaticBorderClass(),
+					environment: __props.environment,
+					modelValue: __props.scheme.openIdConnectUrl,
+					placeholder: "https://example.com/.well-known/openid-configuration",
+					required: "",
+					"onUpdate:modelValue": handleUpdateOpenIdConnectUrl
+				}, {
+					default: withCtx(() => [..._cache[0] || (_cache[0] = [createTextVNode(" Discovery URL ", -1)])]),
+					_: 1
+				}, 8, [
+					"containerClass",
+					"environment",
+					"modelValue"
+				])]),
+				_: 1
+			}), createVNode(unref(DataTableRow_default), { class: "min-w-full" }, {
+				default: withCtx(() => [createElementVNode("div", _hoisted_1, [createVNode(unref(ScalarButton), {
+					class: "mr-0.75 p-0 px-2 py-0.5",
+					disabled: !__props.scheme.openIdConnectUrl,
+					loader: unref(loader),
+					size: "sm",
+					variant: "outlined",
+					onClick: handleOpenIdConnect
+				}, {
+					default: withCtx(() => [..._cache[1] || (_cache[1] = [createTextVNode(" Fetch Configuration ", -1)])]),
+					_: 1
+				}, 8, ["disabled", "loader"])])]),
+				_: 1
+			})], 64);
+		};
+	}
+});
+//#endregion
+export { OpenIDConnect_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=OpenIDConnect.vue.script.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"OpenIDConnect.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-auth-selector-block/components/OpenIDConnect.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton, useLoadingState } from '@scalar/components'\nimport { useToasts } from '@scalar/use-toasts'\nimport type { WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport { type OpenIdConnectObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\n\nimport { DataTableRow } from '@/components/DataTable'\nimport { fetchOpenIDConnectDiscovery } from '@/v2/blocks/scalar-auth-selector-block/helpers/fetch-openid-connect-discovery'\nimport { openIDDiscoveryToFlows } from '@/v2/blocks/scalar-auth-selector-block/helpers/openid-discovery-to-flows'\n\nimport RequestAuthDataTableInput from './RequestAuthDataTableInput.vue'\n\nconst { environment, eventBus, getStaticBorderClass, name, scheme, proxyUrl } =\n  defineProps<{\n    /** Current environment configuration */\n    environment: XScalarEnvironment\n    /** Event bus for authentication updates */\n    eventBus: WorkspaceEventBus\n    /** Get the static border class */\n    getStaticBorderClass: () => string | false\n    /** Name of the security scheme */\n    name: string\n    /** Proxy URL */\n    proxyUrl: string\n    /** OpenID Connect scheme */\n    scheme: OpenIdConnectObject\n  }>()\n\nconst loader = useLoadingState()\nconst { toast } = useToasts()\n\n/**\n * Fetches the OpenID Connect discovery document and triggers authorization\n */\nconst handleOpenIdConnect = async (): Promise<void> => {\n  if (loader.isLoading || !scheme.openIdConnectUrl) {\n    return\n  }\n\n  loader.start()\n  const [error, _discovery] = await fetchOpenIDConnectDiscovery(\n    scheme.openIdConnectUrl,\n    proxyUrl,\n  )\n  await loader.clear()\n\n  // Toast for error\n  if (error) {\n    console.error(error)\n    toast(\n      error?.message ?? 'Failed to fetch OpenID Connect configuration',\n      'error',\n    )\n    return\n  }\n\n  /** Set the newly discovered params in the secret store */\n  const openIdConnect = openIDDiscoveryToFlows(_discovery)\n  eventBus.emit('auth:update:security-scheme-secrets', {\n    payload: openIdConnect,\n    name,\n    overwrite: true,\n  })\n}\n\nconst handleUpdateOpenIdConnectUrl = (value: string): void =>\n  eventBus.emit('auth:update:security-scheme', {\n    payload: {\n      type: 'openIdConnect',\n      openIdConnectUrl: value,\n    },\n    name,\n  })\n</script>\n\n<template>\n  <DataTableRow>\n    <RequestAuthDataTableInput\n      :containerClass=\"getStaticBorderClass()\"\n      :environment\n      :modelValue=\"scheme.openIdConnectUrl\"\n      placeholder=\"https://example.com/.well-known/openid-configuration\"\n      required\n      @update:modelValue=\"handleUpdateOpenIdConnectUrl\">\n      Discovery URL\n    </RequestAuthDataTableInput>\n  </DataTableRow>\n\n  <DataTableRow class=\"min-w-full\">\n    <div class=\"flex h-8 w-full items-center justify-end border-t\">\n      <ScalarButton\n        class=\"mr-0.75 p-0 px-2 py-0.5\"\n        :disabled=\"!scheme.openIdConnectUrl\"\n        :loader\n        size=\"sm\"\n        variant=\"outlined\"\n        @click=\"handleOpenIdConnect\">\n        Fetch Configuration\n      </ScalarButton>\n    </div>\n  </DataTableRow>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;EA6BA,MAAM,SAAS,iBAAgB;EAC/B,MAAM,EAAE,UAAU,WAAU;;;;EAK5B,MAAM,sBAAsB,YAA2B;AACrD,OAAI,OAAO,aAAa,CAAC,QAAA,OAAO,iBAC9B;AAGF,UAAO,OAAM;GACb,MAAM,CAAC,OAAO,cAAc,MAAM,4BAChC,QAAA,OAAO,kBACP,QAAA,SACF;AACA,SAAM,OAAO,OAAM;AAGnB,OAAI,OAAO;AACT,YAAQ,MAAM,MAAK;AACnB,UACE,OAAO,WAAW,gDAClB,QACF;AACA;;;GAIF,MAAM,gBAAgB,uBAAuB,WAAU;AACvD,WAAA,SAAS,KAAK,uCAAuC;IACnD,SAAS;IACT,MAAG,QAAA;IACH,WAAW;IACZ,CAAA;;EAGH,MAAM,gCAAgC,UACpC,QAAA,SAAS,KAAK,+BAA+B;GAC3C,SAAS;IACP,MAAM;IACN,kBAAkB;IACnB;GACD,MAAG,QAAA;GACJ,CAAA;;2DAID,YAUe,MAAA,qBAAA,EAAA,MAAA;2BADe,CAR5B,YAQ4B,mCAAA;KAPzB,gBAAgB,QAAA,sBAAoB;KACpC,aAAA,QAAA;KACA,YAAY,QAAA,OAAO;KACpB,aAAY;KACZ,UAAA;KACC,uBAAmB;;4BAEtB,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA,CAAA,gBAFoD,mBAEpD,GAAA,CAAA,EAAA,CAAA;;;;;;;;OAGF,YAYe,MAAA,qBAAA,EAAA,EAZD,OAAM,cAAY,EAAA;2BAWxB,CAVN,mBAUM,OAVN,YAUM,CATJ,YAQe,MAAA,aAAA,EAAA;KAPb,OAAM;KACL,UAAQ,CAAG,QAAA,OAAO;KAClB,QAAA,MAAA,OAAM;KACP,MAAK;KACL,SAAQ;KACP,SAAO;;4BAEV,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA,CAAA,gBAF+B,yBAE/B,GAAA,CAAA,EAAA,CAAA"}

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

@@ -1,8 +1,8 @@
 import type { AuthMeta, WorkspaceEventBus } from '@scalar/workspace-store/events';
 import type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments';
 import type { ServerObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document';
-import type { MergedSecuritySchemes } from '@/v2/blocks/scalar-auth-selector-block';
-import type { SecuritySchemeOption } from '@/v2/blocks/scalar-auth-selector-block/helpers/security-scheme';
+import type { MergedSecuritySchemes } from '../../../../v2/blocks/scalar-auth-selector-block/index.js';
+import type { SecuritySchemeOption } from '../../../../v2/blocks/scalar-auth-selector-block/helpers/security-scheme.js';
 type __VLS_Props = {
     /** The current environment configuration */
     environment: XScalarEnvironment;

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

@@ -0,0 +1,7 @@
+import RequestAuthDataTable_vue_vue_type_script_setup_true_lang_default from "./RequestAuthDataTable.vue.script.js";
+//#region src/v2/blocks/scalar-auth-selector-block/components/RequestAuthDataTable.vue
+var RequestAuthDataTable_default = RequestAuthDataTable_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { RequestAuthDataTable_default as default };
+
+//# sourceMappingURL=RequestAuthDataTable.vue.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RequestAuthDataTable.vue.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-auth-selector-block/components/RequestAuthDataTable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type {\n  ApiReferenceEvents,\n  AuthMeta,\n  WorkspaceEventBus,\n} from '@scalar/workspace-store/events'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type { ServerObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { computed } from 'vue'\n\nimport type { MergedSecuritySchemes } from '@/v2/blocks/scalar-auth-selector-block'\nimport type { SecuritySchemeOption } from '@/v2/blocks/scalar-auth-selector-block/helpers/security-scheme'\nimport { DataTable } from '@/v2/components/data-table'\n\nimport RequestAuthTab from './RequestAuthTab.vue'\n\nconst {\n  environment,\n  isStatic,\n  selectedSchemeOptions,\n  activeAuthIndex,\n  securitySchemes = {},\n  server,\n  eventBus,\n  meta,\n} = defineProps<{\n  /** The current environment configuration */\n  environment: XScalarEnvironment\n  /** Controls border display for static (non-collapsible) layouts */\n  isStatic: boolean\n  /** Available authentication scheme options */\n  selectedSchemeOptions: SecuritySchemeOption[]\n  /** Index of the currently active authentication tab */\n  activeAuthIndex: number\n  /** Proxy URL */\n  proxyUrl: string\n  /** OpenAPI security scheme definitions */\n  securitySchemes: MergedSecuritySchemes\n  /** Current server configuration */\n  server: ServerObject | null\n  /** Event bus for authentication updates */\n  eventBus: WorkspaceEventBus\n  /** Metadata for authentication context */\n  meta: AuthMeta\n}>()\n\n/** Currently selected authentication scheme based on the active tab index */\nconst activeScheme = computed<SecuritySchemeOption | undefined>(\n  () => selectedSchemeOptions[activeAuthIndex],\n)\n\n/**\n * Whether to display multiple authentication tabs.\n * Only shows tabs when there are 2 or more schemes available.\n */\nconst shouldShowTabs = computed<boolean>(() => selectedSchemeOptions.length > 1)\n\n/** Handles authentication tab selection */\nconst handleTabChange = (index: number) =>\n  eventBus.emit('auth:update:active-index', {\n    index,\n    meta,\n  })\n\n/** Handles updates to OAuth scope selection */\nconst handleScopesUpdate = (\n  params: Omit<ApiReferenceEvents['auth:update:selected-scopes'], 'meta'>,\n): void =>\n  eventBus.emit('auth:update:selected-scopes', {\n    ...params,\n    meta,\n  })\n\n/** Determines if a tab is currently active */\nconst isTabActive = (index: number): boolean => activeAuthIndex === index\n\n/** Expose the active scheme for parent component access */\ndefineExpose({\n  activeScheme,\n})\n</script>\n\n<template>\n  <form @submit.prevent>\n    <!-- Authentication Tabs -->\n    <div\n      v-if=\"shouldShowTabs\"\n      class=\"box-content flex flex-wrap gap-x-2.5 overflow-hidden border border-b-0 px-3\"\n      :class=\"{ 'border-x-0': !isStatic }\"\n      data-testid=\"auth-tabs\">\n      <div\n        v-for=\"(option, index) in selectedSchemeOptions\"\n        :key=\"option.id\"\n        class=\"relative z-1 -mb-[var(--scalar-border-width)] flex h-8\">\n        <button\n          class=\"floating-bg relative cursor-pointer border-b border-transparent py-1 text-sm font-medium transition-colors\"\n          :class=\"isTabActive(index) ? 'text-c-1' : 'text-c-3'\"\n          type=\"button\"\n          @click=\"handleTabChange(index)\">\n          <span class=\"relative z-10 font-medium whitespace-nowrap\">\n            {{ option.label }}\n          </span>\n        </button>\n\n        <!-- Active Tab Indicator -->\n        <div\n          v-if=\"isTabActive(index)\"\n          class=\"absolute inset-x-1 bottom-[var(--scalar-border-width)] left-1/2 z-1 h-px w-full -translate-x-1/2 bg-current\" />\n      </div>\n    </div>\n\n    <!-- Active Authentication Scheme Content -->\n    <DataTable\n      v-if=\"activeScheme\"\n      class=\"flex-1\"\n      :class=\"{ 'bg-b-1 rounded-b-lg border border-t-0': isStatic }\"\n      :columns=\"['']\"\n      presentational>\n      <RequestAuthTab\n        :environment\n        :eventBus\n        :isStatic\n        :proxyUrl\n        :securitySchemes\n        :selectedSecuritySchemas=\"activeScheme.value\"\n        :server\n        @update:selectedScopes=\"handleScopesUpdate\" />\n    </DataTable>\n\n    <!-- Empty State -->\n    <div\n      v-else\n      class=\"bg-b-1 text-c-3 flex min-h-16 items-center justify-center border-t px-4 text-sm\"\n      :class=\"{ 'min-h-[calc(4rem+0.5px)] rounded-b-lg border': isStatic }\">\n      No authentication selected\n    </div>\n  </form>\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,95 @@
+import DataTable_default from "../../../components/data-table/DataTable.vue.js";
+import RequestAuthTab_default from "./RequestAuthTab.vue.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, normalizeClass, openBlock, renderList, toDisplayString, unref, withCtx, withModifiers } from "vue";
+//#region src/v2/blocks/scalar-auth-selector-block/components/RequestAuthDataTable.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["onClick"];
+var _hoisted_2 = { class: "relative z-10 font-medium whitespace-nowrap" };
+var _hoisted_3 = {
+	key: 0,
+	class: "absolute inset-x-1 bottom-[var(--scalar-border-width)] left-1/2 z-1 h-px w-full -translate-x-1/2 bg-current"
+};
+var RequestAuthDataTable_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "RequestAuthDataTable",
+	props: {
+		environment: {},
+		isStatic: { type: Boolean },
+		selectedSchemeOptions: {},
+		activeAuthIndex: {},
+		proxyUrl: {},
+		securitySchemes: { default: () => ({}) },
+		server: {},
+		eventBus: {},
+		meta: {}
+	},
+	setup(__props, { expose: __expose }) {
+		/** Currently selected authentication scheme based on the active tab index */
+		const activeScheme = computed(() => __props.selectedSchemeOptions[__props.activeAuthIndex]);
+		/**
+		* Whether to display multiple authentication tabs.
+		* Only shows tabs when there are 2 or more schemes available.
+		*/
+		const shouldShowTabs = computed(() => __props.selectedSchemeOptions.length > 1);
+		/** Handles authentication tab selection */
+		const handleTabChange = (index) => __props.eventBus.emit("auth:update:active-index", {
+			index,
+			meta: __props.meta
+		});
+		/** Handles updates to OAuth scope selection */
+		const handleScopesUpdate = (params) => __props.eventBus.emit("auth:update:selected-scopes", {
+			...params,
+			meta: __props.meta
+		});
+		/** Determines if a tab is currently active */
+		const isTabActive = (index) => __props.activeAuthIndex === index;
+		/** Expose the active scheme for parent component access */
+		__expose({ activeScheme });
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("form", { onSubmit: _cache[0] || (_cache[0] = withModifiers(() => {}, ["prevent"])) }, [shouldShowTabs.value ? (openBlock(), createElementBlock("div", {
+				key: 0,
+				class: normalizeClass(["box-content flex flex-wrap gap-x-2.5 overflow-hidden border border-b-0 px-3", { "border-x-0": !__props.isStatic }]),
+				"data-testid": "auth-tabs"
+			}, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.selectedSchemeOptions, (option, index) => {
+				return openBlock(), createElementBlock("div", {
+					key: option.id,
+					class: "relative z-1 -mb-[var(--scalar-border-width)] flex h-8"
+				}, [createElementVNode("button", {
+					class: normalizeClass(["floating-bg relative cursor-pointer border-b border-transparent py-1 text-sm font-medium transition-colors", isTabActive(index) ? "text-c-1" : "text-c-3"]),
+					type: "button",
+					onClick: ($event) => handleTabChange(index)
+				}, [createElementVNode("span", _hoisted_2, toDisplayString(option.label), 1)], 10, _hoisted_1), isTabActive(index) ? (openBlock(), createElementBlock("div", _hoisted_3)) : createCommentVNode("", true)]);
+			}), 128))], 2)) : createCommentVNode("", true), activeScheme.value ? (openBlock(), createBlock(unref(DataTable_default), {
+				key: 1,
+				class: normalizeClass(["flex-1", { "bg-b-1 rounded-b-lg border border-t-0": __props.isStatic }]),
+				columns: [""],
+				presentational: ""
+			}, {
+				default: withCtx(() => [createVNode(RequestAuthTab_default, {
+					environment: __props.environment,
+					eventBus: __props.eventBus,
+					isStatic: __props.isStatic,
+					proxyUrl: __props.proxyUrl,
+					securitySchemes: __props.securitySchemes,
+					selectedSecuritySchemas: activeScheme.value.value,
+					server: __props.server,
+					"onUpdate:selectedScopes": handleScopesUpdate
+				}, null, 8, [
+					"environment",
+					"eventBus",
+					"isStatic",
+					"proxyUrl",
+					"securitySchemes",
+					"selectedSecuritySchemas",
+					"server"
+				])]),
+				_: 1
+			}, 8, ["class"])) : (openBlock(), createElementBlock("div", {
+				key: 2,
+				class: normalizeClass(["bg-b-1 text-c-3 flex min-h-16 items-center justify-center border-t px-4 text-sm", { "min-h-[calc(4rem+0.5px)] rounded-b-lg border": __props.isStatic }])
+			}, " No authentication selected ", 2))], 32);
+		};
+	}
+});
+//#endregion
+export { RequestAuthDataTable_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=RequestAuthDataTable.vue.script.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RequestAuthDataTable.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-auth-selector-block/components/RequestAuthDataTable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type {\n  ApiReferenceEvents,\n  AuthMeta,\n  WorkspaceEventBus,\n} from '@scalar/workspace-store/events'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type { ServerObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { computed } from 'vue'\n\nimport type { MergedSecuritySchemes } from '@/v2/blocks/scalar-auth-selector-block'\nimport type { SecuritySchemeOption } from '@/v2/blocks/scalar-auth-selector-block/helpers/security-scheme'\nimport { DataTable } from '@/v2/components/data-table'\n\nimport RequestAuthTab from './RequestAuthTab.vue'\n\nconst {\n  environment,\n  isStatic,\n  selectedSchemeOptions,\n  activeAuthIndex,\n  securitySchemes = {},\n  server,\n  eventBus,\n  meta,\n} = defineProps<{\n  /** The current environment configuration */\n  environment: XScalarEnvironment\n  /** Controls border display for static (non-collapsible) layouts */\n  isStatic: boolean\n  /** Available authentication scheme options */\n  selectedSchemeOptions: SecuritySchemeOption[]\n  /** Index of the currently active authentication tab */\n  activeAuthIndex: number\n  /** Proxy URL */\n  proxyUrl: string\n  /** OpenAPI security scheme definitions */\n  securitySchemes: MergedSecuritySchemes\n  /** Current server configuration */\n  server: ServerObject | null\n  /** Event bus for authentication updates */\n  eventBus: WorkspaceEventBus\n  /** Metadata for authentication context */\n  meta: AuthMeta\n}>()\n\n/** Currently selected authentication scheme based on the active tab index */\nconst activeScheme = computed<SecuritySchemeOption | undefined>(\n  () => selectedSchemeOptions[activeAuthIndex],\n)\n\n/**\n * Whether to display multiple authentication tabs.\n * Only shows tabs when there are 2 or more schemes available.\n */\nconst shouldShowTabs = computed<boolean>(() => selectedSchemeOptions.length > 1)\n\n/** Handles authentication tab selection */\nconst handleTabChange = (index: number) =>\n  eventBus.emit('auth:update:active-index', {\n    index,\n    meta,\n  })\n\n/** Handles updates to OAuth scope selection */\nconst handleScopesUpdate = (\n  params: Omit<ApiReferenceEvents['auth:update:selected-scopes'], 'meta'>,\n): void =>\n  eventBus.emit('auth:update:selected-scopes', {\n    ...params,\n    meta,\n  })\n\n/** Determines if a tab is currently active */\nconst isTabActive = (index: number): boolean => activeAuthIndex === index\n\n/** Expose the active scheme for parent component access */\ndefineExpose({\n  activeScheme,\n})\n</script>\n\n<template>\n  <form @submit.prevent>\n    <!-- Authentication Tabs -->\n    <div\n      v-if=\"shouldShowTabs\"\n      class=\"box-content flex flex-wrap gap-x-2.5 overflow-hidden border border-b-0 px-3\"\n      :class=\"{ 'border-x-0': !isStatic }\"\n      data-testid=\"auth-tabs\">\n      <div\n        v-for=\"(option, index) in selectedSchemeOptions\"\n        :key=\"option.id\"\n        class=\"relative z-1 -mb-[var(--scalar-border-width)] flex h-8\">\n        <button\n          class=\"floating-bg relative cursor-pointer border-b border-transparent py-1 text-sm font-medium transition-colors\"\n          :class=\"isTabActive(index) ? 'text-c-1' : 'text-c-3'\"\n          type=\"button\"\n          @click=\"handleTabChange(index)\">\n          <span class=\"relative z-10 font-medium whitespace-nowrap\">\n            {{ option.label }}\n          </span>\n        </button>\n\n        <!-- Active Tab Indicator -->\n        <div\n          v-if=\"isTabActive(index)\"\n          class=\"absolute inset-x-1 bottom-[var(--scalar-border-width)] left-1/2 z-1 h-px w-full -translate-x-1/2 bg-current\" />\n      </div>\n    </div>\n\n    <!-- Active Authentication Scheme Content -->\n    <DataTable\n      v-if=\"activeScheme\"\n      class=\"flex-1\"\n      :class=\"{ 'bg-b-1 rounded-b-lg border border-t-0': isStatic }\"\n      :columns=\"['']\"\n      presentational>\n      <RequestAuthTab\n        :environment\n        :eventBus\n        :isStatic\n        :proxyUrl\n        :securitySchemes\n        :selectedSecuritySchemas=\"activeScheme.value\"\n        :server\n        @update:selectedScopes=\"handleScopesUpdate\" />\n    </DataTable>\n\n    <!-- Empty State -->\n    <div\n      v-else\n      class=\"bg-b-1 text-c-3 flex min-h-16 items-center justify-center border-t px-4 text-sm\"\n      :class=\"{ 'min-h-[calc(4rem+0.5px)] rounded-b-lg border': isStatic }\">\n      No authentication selected\n    </div>\n  </form>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;EA+CA,MAAM,eAAe,eACb,QAAA,sBAAsB,QAAA,iBAC9B;;;;;EAMA,MAAM,iBAAiB,eAAwB,QAAA,sBAAsB,SAAS,EAAC;;EAG/E,MAAM,mBAAmB,UACvB,QAAA,SAAS,KAAK,4BAA4B;GACxC;GACA,MAAG,QAAA;GACJ,CAAA;;EAGH,MAAM,sBACJ,WAEA,QAAA,SAAS,KAAK,+BAA+B;GAC3C,GAAG;GACH,MAAG,QAAA;GACJ,CAAA;;EAGH,MAAM,eAAe,UAA2B,QAAA,oBAAoB;;AAGpE,WAAa,EACX,cACD,CAAA;;uBAIC,mBAqDO,QAAA,EArDA,UAAM,OAAA,OAAA,OAAA,KAAA,oBAAP,IAAe,CAAA,UAAA,CAAA,GAAA,EAAA,CAGX,eAAA,SAAA,WAAA,EADR,mBAwBM,OAAA;;IAtBJ,OAAK,eAAA,CAAC,+EAA6E,EAAA,cAAA,CAC1D,QAAA,UAAQ,CAAA,CAAA;IACjC,eAAY;yBACZ,mBAkBM,UAAA,MAAA,WAjBsB,QAAA,wBAAlB,QAAQ,UAAK;wBADvB,mBAkBM,OAAA;KAhBH,KAAK,OAAO;KACb,OAAM;QACN,mBAQS,UAAA;KAPP,OAAK,eAAA,CAAC,8GACE,YAAY,MAAK,GAAA,aAAA,WAAA,CAAA;KACzB,MAAK;KACJ,UAAK,WAAE,gBAAgB,MAAK;QAC7B,mBAEO,QAFP,YAEO,gBADF,OAAO,MAAK,EAAA,EAAA,CAAA,EAAA,IAAA,WAAA,EAMX,YAAY,MAAK,IAAA,WAAA,EADzB,mBAEwH,OAFxH,WAEwH,IAAA,mBAAA,IAAA,KAAA,CAAA,CAAA;mDAMpH,aAAA,SAAA,WAAA,EADR,YAeY,MAAA,kBAAA,EAAA;;IAbV,OAAK,eAAA,CAAC,UAAQ,EAAA,yCACqC,QAAA,UAAQ,CAAA,CAAA;IAC1D,SAAS,CAAA,GAAI;IACd,gBAAA;;2BASgD,CARhD,YAQgD,wBAAA;KAP7C,aAAA,QAAA;KACA,UAAA,QAAA;KACA,UAAA,QAAA;KACA,UAAA,QAAA;KACA,iBAAA,QAAA;KACA,yBAAyB,aAAA,MAAa;KACtC,QAAA,QAAA;KACA,2BAAuB;;;;;;;;;;;qCAI5B,mBAKM,OAAA;;IAHJ,OAAK,eAAA,CAAC,mFAAiF,EAAA,gDAC7B,QAAA,UAAQ,CAAA,CAAA;MAAI,gCAExE,EAAA,EAAA,EAAA,GAAA"}

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

@@ -1,5 +1,5 @@
 import type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments';
-import type { VueClassProp } from '@/types/vue';
+import type { VueClassProp } from '../../../../types/vue';
 type __VLS_Props = {
     containerClass?: VueClassProp;
     environment: XScalarEnvironment;

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

@@ -0,0 +1,7 @@
+import RequestAuthDataTableInput_vue_vue_type_script_setup_true_lang_default from "./RequestAuthDataTableInput.vue.script.js";
+//#region src/v2/blocks/scalar-auth-selector-block/components/RequestAuthDataTableInput.vue
+var RequestAuthDataTableInput_default = RequestAuthDataTableInput_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { RequestAuthDataTableInput_default as default };
+
+//# sourceMappingURL=RequestAuthDataTableInput.vue.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RequestAuthDataTableInput.vue.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-auth-selector-block/components/RequestAuthDataTableInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport { useId } from 'vue'\n\nimport type { VueClassProp } from '@/types/vue'\nimport { DataTableInput } from '@/v2/components/data-table'\n\nconst {\n  containerClass,\n  environment,\n  readOnly = false,\n  required = false,\n  type,\n} = defineProps<{\n  containerClass?: VueClassProp\n  environment: XScalarEnvironment\n  readOnly?: boolean\n  required?: boolean\n  type?: string\n}>()\n\nconst emit = defineEmits<{\n  (e: 'inputFocus'): void\n  (e: 'inputBlur'): void\n  (e: 'selectVariable', value: string): void\n}>()\n\nconst modelValue = defineModel<string>({ default: '', required: true })\nconst id = useId()\n</script>\n<template>\n  <DataTableInput\n    :id=\"id\"\n    v-bind=\"$attrs\"\n    v-model=\"modelValue\"\n    :canAddCustomEnumValue=\"!readOnly\"\n    :containerClass=\"containerClass\"\n    :environment=\"environment\"\n    lineWrapping\n    :readOnly=\"readOnly\"\n    :required=\"required\"\n    :type=\"type\"\n    @inputBlur=\"emit('inputBlur')\"\n    @inputFocus=\"emit('inputFocus')\"\n    @selectVariable=\"emit('selectVariable', $event)\">\n    <template #default>\n      <label :for=\"id\">\n        <slot />\n      </label>\n    </template>\n    <template #icon>\n      <slot name=\"icon\" />\n    </template>\n  </DataTableInput>\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,69 @@
+import DataTableInput_default from "../../../components/data-table/DataTableInput.vue.js";
+import { createBlock, createElementVNode, defineComponent, mergeModels, mergeProps, openBlock, renderSlot, unref, useId, useModel, withCtx } from "vue";
+//#region src/v2/blocks/scalar-auth-selector-block/components/RequestAuthDataTableInput.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["for"];
+var RequestAuthDataTableInput_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "RequestAuthDataTableInput",
+	props: /* @__PURE__ */ mergeModels({
+		containerClass: {},
+		environment: {},
+		readOnly: {
+			type: Boolean,
+			default: false
+		},
+		required: {
+			type: Boolean,
+			default: false
+		},
+		type: {}
+	}, {
+		"modelValue": {
+			default: "",
+			required: true
+		},
+		"modelModifiers": {}
+	}),
+	emits: /* @__PURE__ */ mergeModels([
+		"inputFocus",
+		"inputBlur",
+		"selectVariable"
+	], ["update:modelValue"]),
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		const modelValue = useModel(__props, "modelValue");
+		const id = useId();
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(DataTableInput_default), mergeProps({ id: unref(id) }, _ctx.$attrs, {
+				modelValue: modelValue.value,
+				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event),
+				canAddCustomEnumValue: !__props.readOnly,
+				containerClass: __props.containerClass,
+				environment: __props.environment,
+				lineWrapping: "",
+				readOnly: __props.readOnly,
+				required: __props.required,
+				type: __props.type,
+				onInputBlur: _cache[1] || (_cache[1] = ($event) => emit("inputBlur")),
+				onInputFocus: _cache[2] || (_cache[2] = ($event) => emit("inputFocus")),
+				onSelectVariable: _cache[3] || (_cache[3] = ($event) => emit("selectVariable", $event))
+			}), {
+				default: withCtx(() => [createElementVNode("label", { for: unref(id) }, [renderSlot(_ctx.$slots, "default")], 8, _hoisted_1)]),
+				icon: withCtx(() => [renderSlot(_ctx.$slots, "icon")]),
+				_: 3
+			}, 16, [
+				"id",
+				"modelValue",
+				"canAddCustomEnumValue",
+				"containerClass",
+				"environment",
+				"readOnly",
+				"required",
+				"type"
+			]);
+		};
+	}
+});
+//#endregion
+export { RequestAuthDataTableInput_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=RequestAuthDataTableInput.vue.script.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RequestAuthDataTableInput.vue.script.js","names":["$attrs"],"sources":["../../../../../src/v2/blocks/scalar-auth-selector-block/components/RequestAuthDataTableInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport { useId } from 'vue'\n\nimport type { VueClassProp } from '@/types/vue'\nimport { DataTableInput } from '@/v2/components/data-table'\n\nconst {\n  containerClass,\n  environment,\n  readOnly = false,\n  required = false,\n  type,\n} = defineProps<{\n  containerClass?: VueClassProp\n  environment: XScalarEnvironment\n  readOnly?: boolean\n  required?: boolean\n  type?: string\n}>()\n\nconst emit = defineEmits<{\n  (e: 'inputFocus'): void\n  (e: 'inputBlur'): void\n  (e: 'selectVariable', value: string): void\n}>()\n\nconst modelValue = defineModel<string>({ default: '', required: true })\nconst id = useId()\n</script>\n<template>\n  <DataTableInput\n    :id=\"id\"\n    v-bind=\"$attrs\"\n    v-model=\"modelValue\"\n    :canAddCustomEnumValue=\"!readOnly\"\n    :containerClass=\"containerClass\"\n    :environment=\"environment\"\n    lineWrapping\n    :readOnly=\"readOnly\"\n    :required=\"required\"\n    :type=\"type\"\n    @inputBlur=\"emit('inputBlur')\"\n    @inputFocus=\"emit('inputFocus')\"\n    @selectVariable=\"emit('selectVariable', $event)\">\n    <template #default>\n      <label :for=\"id\">\n        <slot />\n      </label>\n    </template>\n    <template #icon>\n      <slot name=\"icon\" />\n    </template>\n  </DataTableInput>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqBA,MAAM,OAAO;EAMb,MAAM,aAAa,SAAmB,SAAA,aAAgC;EACtE,MAAM,KAAK,OAAM;;uBAGf,YAsBiB,MAAA,uBAAA,EAtBjB,WAsBiB,EArBd,IAAI,MAAA,GAAE,EAAA,EACCA,KAAAA,QAAM;gBACL,WAAA;4EAAU,QAAA;IAClB,uBAAqB,CAAG,QAAA;IACxB,gBAAgB,QAAA;IAChB,aAAa,QAAA;IACd,cAAA;IACC,UAAU,QAAA;IACV,UAAU,QAAA;IACV,MAAM,QAAA;IACN,aAAS,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,YAAA;IACf,cAAU,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,aAAA;IAChB,kBAAc,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,kBAAmB,OAAM;;IACnC,SAAO,cAGR,CAFR,mBAEQ,SAAA,EAFA,KAAK,MAAA,GAAE,EAAA,EAAA,CACb,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,GAAA,WAAA,CAAA,CAAA;IAGD,MAAI,cACO,CAApB,WAAoB,KAAA,QAAA,OAAA,CAAA,CAAA"}

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

@@ -1,7 +1,7 @@
 import type { WorkspaceEventBus } from '@scalar/workspace-store/events';
 import type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments';
 import type { SecurityRequirementObject, ServerObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document';
-import type { MergedSecuritySchemes } from '@/v2/blocks/scalar-auth-selector-block';
+import type { MergedSecuritySchemes } from '../../../../v2/blocks/scalar-auth-selector-block/index.js';
 type __VLS_Props = {
     /** Current environment configuration */
     environment: XScalarEnvironment;

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

@@ -0,0 +1,7 @@
+import RequestAuthTab_vue_vue_type_script_setup_true_lang_default from "./RequestAuthTab.vue.script.js";
+//#region src/v2/blocks/scalar-auth-selector-block/components/RequestAuthTab.vue
+var RequestAuthTab_default = RequestAuthTab_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { RequestAuthTab_default as default };
+
+//# sourceMappingURL=RequestAuthTab.vue.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RequestAuthTab.vue.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-auth-selector-block/components/RequestAuthTab.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarMarkdownSummary } from '@scalar/components'\nimport type {\n  SecretsApiKey,\n  SecretsHttp,\n} from '@scalar/workspace-store/entities/auth'\nimport type {\n  ApiReferenceEvents,\n  WorkspaceEventBus,\n} from '@scalar/workspace-store/events'\nimport { getResolvedRef } from '@scalar/workspace-store/helpers/get-resolved-ref'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport type {\n  ApiKeyObject,\n  SecurityRequirementObject,\n  ServerObject,\n} from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document'\nimport { capitalize, computed, ref } from 'vue'\n\nimport type { MergedSecuritySchemes } from '@/v2/blocks/scalar-auth-selector-block'\nimport type { SecuritySchemeObjectSecret } from '@/v2/blocks/scalar-auth-selector-block/helpers/secret-types'\nimport { DataTableCell, DataTableRow } from '@/v2/components/data-table'\n\nimport OAuth2 from './OAuth2.vue'\nimport OpenIDConnect from './OpenIDConnect.vue'\nimport RequestAuthDataTableInput from './RequestAuthDataTableInput.vue'\n\ntype SecurityItem = {\n  scheme: SecuritySchemeObjectSecret | undefined\n  name: string\n  scopes: string[]\n}\n\nconst {\n  environment,\n  isStatic,\n  proxyUrl,\n  selectedSecuritySchemas,\n  securitySchemes,\n  server,\n  eventBus,\n} = defineProps<{\n  /** Current environment configuration */\n  environment: XScalarEnvironment\n  /** Controls the display of certain borders which are used when we are non-collapsible */\n  isStatic: boolean\n  /** Proxy URL */\n  proxyUrl: string\n  /** Selected security schemes*/\n  selectedSecuritySchemas: SecurityRequirementObject\n  /** Merged security schemes from the document and the config together with the auth store secrets */\n  securitySchemes: MergedSecuritySchemes\n  /** Current server configuration */\n  server: ServerObject | null\n  /** Event bus for authentication updates */\n  eventBus: WorkspaceEventBus\n}>()\n\nconst emits = defineEmits<{\n  (\n    e: 'update:selectedScopes',\n    payload: Omit<ApiReferenceEvents['auth:update:selected-scopes'], 'meta'>,\n  ): void\n}>()\n\n/**\n * Resolves security schemes from the OpenAPI document and combines them with their selected scopes.\n * Each item includes the scheme definition, name, and associated scopes.\n */\nconst security = computed<SecurityItem[]>(() =>\n  Object.entries(selectedSecuritySchemas).map(([name, scopes = []]) => ({\n    scheme: getResolvedRef(securitySchemes[name]),\n    name,\n    scopes,\n  })),\n)\n\n/** Tracks which OAuth2 flow is currently active when multiple flows are available. */\nconst activeFlow = ref<string>('')\n\n/** Keeps the selected flow in sync with currently available flow keys. */\nconst selectedFlow = computed<string>(() => {\n  const authFlowKeys = security.value.flatMap(({ scheme }) => {\n    if (scheme?.type !== 'oauth2' && scheme?.type !== 'openIdConnect') {\n      return []\n    }\n\n    return Object.keys(scheme.flows ?? {})\n  })\n\n  return authFlowKeys.includes(activeFlow.value) ? activeFlow.value : ''\n})\n\nconst setActiveFlow = (flow: string): void => {\n  activeFlow.value = flow\n}\n\n/** Determines if multiple auth schemes are configured, which affects the UI layout. */\nconst hasMultipleSchemes = computed<boolean>(() => security.value.length > 1)\n\n/**\n * Generates a human-readable label for the security scheme.\n * Intentionally omits the description here — it is rendered separately as\n * rich text via ScalarMarkdownSummary so markdown formatting is preserved.\n */\nconst generateLabel = (\n  name: string,\n  scheme: SecuritySchemeObjectSecret,\n): string => {\n  const capitalizedName = capitalize(name)\n\n  switch (scheme.type) {\n    case 'apiKey':\n      return `${capitalizedName}: ${scheme.in}`\n\n    case 'openIdConnect':\n    case 'oauth2': {\n      const firstFlow = Object.keys(scheme.flows ?? {})[0]\n      const currentFlow = selectedFlow.value || firstFlow\n      if (!currentFlow) {\n        return capitalizedName\n      }\n      return `${capitalizedName}: ${currentFlow}`\n    }\n\n    case 'http':\n      return `${capitalizedName}: ${scheme.scheme}`\n\n    default:\n      return capitalizedName\n  }\n}\n\n/**\n * Determines if an OAuth2 flow tab should be active.\n * The first flow is active by default if no flow is explicitly selected.\n */\nconst isFlowActive = (flowKey: string, index: number): boolean =>\n  selectedFlow.value === flowKey || (index === 0 && !selectedFlow.value)\n\n/** Computes the container class for static display mode. */\nconst getStaticBorderClass = (): string | false => isStatic && 'border-t'\n\nconst handleHttpSecretsUpdate = (\n  payload: Omit<Partial<SecretsHttp>, 'type'>,\n  name: string,\n): void =>\n  eventBus.emit('auth:update:security-scheme-secrets', {\n    payload: { type: 'http', ...payload },\n    name,\n  })\n\nconst handleApiKeySecretsUpdate = (\n  payload: Omit<Partial<SecretsApiKey>, 'type'>,\n  name: string,\n): void =>\n  eventBus.emit('auth:update:security-scheme-secrets', {\n    payload: { type: 'apiKey', ...payload },\n    name,\n  })\n\nconst handleApiKeySecuritySchemeUpdate = (\n  payload: Omit<Partial<ApiKeyObject>, 'type'>,\n  name: string,\n): void =>\n  eventBus.emit('auth:update:security-scheme', {\n    payload: { type: 'apiKey', ...payload },\n    name,\n  })\n\n/** Handles scope selection updates for OAuth2 */\nconst handleScopesUpdate = (\n  name: string,\n  event: { scopes: string[] },\n): void => {\n  emits('update:selectedScopes', {\n    id: Object.keys(selectedSecuritySchemas),\n    name,\n    ...event,\n  })\n}\n\n/**\n * Computes dynamic classes for OAuth2 flow tabs based on active state.\n */\nconst getFlowTabClasses = (flowKey: string, index: number): string => {\n  const baseClasses =\n    'floating-bg text-c-3 relative cursor-pointer border-b border-transparent py-1 text-base font-medium'\n  const activeClasses = '!text-c-1 !rounded-none border-b !border-current'\n\n  return isFlowActive(flowKey, index)\n    ? `${baseClasses} ${activeClasses} ${isStatic ? 'opacity-100' : ''}`\n    : baseClasses\n}\n</script>\n<template>\n  <template\n    v-for=\"{ scheme, name, scopes } in security\"\n    :key=\"name\">\n    <!--\n      Header row for AND'ed schemes: label (bold) and description (rich text) are\n      combined.\n    -->\n    <DataTableRow v-if=\"hasMultipleSchemes && scheme\">\n      <DataTableCell\n        :aria-label=\"generateLabel(name, scheme)\"\n        class=\"max-h-[auto]\">\n        <div class=\"bg-b-1 min-w-0 flex-1 px-3 py-1.25\">\n          <p class=\"text-c-1 leading-5.5 font-medium\">\n            {{ generateLabel(name, scheme) }}\n          </p>\n          <ScalarMarkdownSummary\n            v-if=\"scheme.description\"\n            class=\"auth-description text-c-2 w-full\"\n            :value=\"scheme.description\" />\n        </div>\n      </DataTableCell>\n    </DataTableRow>\n\n    <!-- Description: shown for single auth schemes with descriptions -->\n    <DataTableRow v-if=\"scheme?.description && !hasMultipleSchemes\">\n      <DataTableCell\n        :aria-label=\"scheme.description\"\n        class=\"max-h-[auto]\">\n        <ScalarMarkdownSummary\n          class=\"auth-description bg-b-1 text-c-2 min-w-0 flex-1 px-3 py-1.25\"\n          :value=\"scheme.description\" />\n      </DataTableCell>\n    </DataTableRow>\n\n    <!-- HTTP Authentication -->\n    <template v-if=\"scheme?.type === 'http'\">\n      <!-- Bearer Token -->\n      <DataTableRow v-if=\"scheme.scheme === 'bearer'\">\n        <RequestAuthDataTableInput\n          :containerClass=\"getStaticBorderClass()\"\n          :environment\n          :modelValue=\"scheme['x-scalar-secret-token']\"\n          placeholder=\"Token\"\n          type=\"password\"\n          @update:modelValue=\"\n            (v) => handleHttpSecretsUpdate({ 'x-scalar-secret-token': v }, name)\n          \">\n          Bearer Token\n        </RequestAuthDataTableInput>\n      </DataTableRow>\n\n      <!-- HTTP Basic Authentication -->\n      <template v-else-if=\"scheme?.scheme === 'basic'\">\n        <DataTableRow>\n          <RequestAuthDataTableInput\n            class=\"text-c-2\"\n            :environment\n            :modelValue=\"scheme['x-scalar-secret-username']\"\n            placeholder=\"janedoe\"\n            required\n            @update:modelValue=\"\n              (v) =>\n                handleHttpSecretsUpdate({ 'x-scalar-secret-username': v }, name)\n            \">\n            Username\n          </RequestAuthDataTableInput>\n        </DataTableRow>\n        <DataTableRow>\n          <RequestAuthDataTableInput\n            :environment\n            :modelValue=\"scheme['x-scalar-secret-password']\"\n            placeholder=\"********\"\n            type=\"password\"\n            @update:modelValue=\"\n              (v) =>\n                handleHttpSecretsUpdate({ 'x-scalar-secret-password': v }, name)\n            \">\n            Password\n          </RequestAuthDataTableInput>\n        </DataTableRow>\n      </template>\n    </template>\n\n    <!-- API Key Authentication -->\n    <template v-else-if=\"scheme?.type === 'apiKey'\">\n      <DataTableRow>\n        <RequestAuthDataTableInput\n          :containerClass=\"getStaticBorderClass()\"\n          :environment\n          :modelValue=\"scheme.name\"\n          placeholder=\"api-key\"\n          @update:modelValue=\"\n            (v) => handleApiKeySecuritySchemeUpdate({ name: v }, name)\n          \">\n          Name\n        </RequestAuthDataTableInput>\n      </DataTableRow>\n      <DataTableRow>\n        <RequestAuthDataTableInput\n          :environment\n          :modelValue=\"scheme['x-scalar-secret-token']\"\n          placeholder=\"QUxMIFlPVVIgQkFTRSBBUkUgQkVMT05HIFRPIFVT\"\n          type=\"password\"\n          @update:modelValue=\"\n            (v) =>\n              handleApiKeySecretsUpdate({ 'x-scalar-secret-token': v }, name)\n          \">\n          Value\n        </RequestAuthDataTableInput>\n      </DataTableRow>\n    </template>\n\n    <!-- OAuth 2.0  / OpenID Connect Authentication -->\n    <template\n      v-else-if=\"scheme?.type === 'oauth2' || scheme?.type === 'openIdConnect'\">\n      <!-- OpenID Connect -->\n      <OpenIDConnect\n        v-if=\"\n          scheme?.type === 'openIdConnect' &&\n          !Object.keys(scheme.flows ?? {}).length\n        \"\n        :environment\n        :eventBus\n        :getStaticBorderClass\n        :name\n        :proxyUrl\n        :scheme />\n\n      <!-- Flow selector tabs: shown when multiple flows are available -->\n      <DataTableRow v-if=\"Object.keys(scheme.flows ?? {}).length > 1\">\n        <div class=\"flex min-h-8 border-t text-base\">\n          <div class=\"flex h-8 max-w-full gap-2.5 overflow-x-auto px-3\">\n            <button\n              v-for=\"(_, key, ind) in scheme.flows\"\n              :key=\"key\"\n              :class=\"getFlowTabClasses(key, ind)\"\n              type=\"button\"\n              @click=\"setActiveFlow(key)\">\n              <span class=\"relative z-10\">{{ key }}</span>\n            </button>\n          </div>\n        </div>\n      </DataTableRow>\n\n      <!-- OAuth2 flow configuration -->\n      <template\n        v-for=\"(_flow, key, ind) in scheme.flows\"\n        :key=\"key\">\n        <OAuth2\n          v-if=\"scheme.flows && isFlowActive(key, ind)\"\n          :environment\n          :eventBus\n          :flows=\"scheme.flows\"\n          :name=\"name\"\n          :proxyUrl\n          :scheme\n          :selectedScopes=\"scopes\"\n          :server=\"server\"\n          :type=\"key\"\n          @update:selectedScopes=\"(event) => handleScopesUpdate(name, event)\" />\n      </template>\n    </template>\n\n    <!-- Scheme is missing type -->\n    <div\n      v-else\n      class=\"text-c-3 flex items-center justify-center border-t p-4 px-4 text-center text-xs text-balance\">\n      The security scheme is missing a type, please double check your OpenAPI\n      document or Authentication Configuration\n    </div>\n  </template>\n</template>\n"],"mappings":""}