@scalar/api-client 2.38.4 → 2.39.1

package/dist/v2/blocks/scalar-address-bar-block/components/httpStatusCodeColors.js

@@ -0,0 +1,20 @@
+//#region src/v2/blocks/scalar-address-bar-block/components/httpStatusCodeColors.ts
+var STATUS_CODES_COLORS = {
+	100: { color: "text-yellow" },
+	200: { color: "text-green" },
+	202: { color: "text-green" },
+	300: { color: "text-blue" },
+	304: { color: "text-blue" },
+	400: { color: "text-red" },
+	401: { color: "text-orange" },
+	422: { color: "text-yellow" },
+	423: { color: "text-purple" },
+	505: { color: "text-orange" }
+};
+var getStatusCodeColor = (statusCode) => {
+	return STATUS_CODES_COLORS[statusCode] || { color: "text-grey" };
+};
+//#endregion
+export { getStatusCodeColor };
+
+//# sourceMappingURL=httpStatusCodeColors.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"httpStatusCodeColors.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-address-bar-block/components/httpStatusCodeColors.ts"],"sourcesContent":["const STATUS_CODES_COLORS = {\n  100: {\n    color: 'text-yellow',\n  },\n  200: {\n    color: 'text-green',\n  },\n  202: {\n    color: 'text-green',\n  },\n  300: {\n    color: 'text-blue',\n  },\n  304: {\n    color: 'text-blue',\n  },\n  400: {\n    color: 'text-red',\n  },\n  401: {\n    color: 'text-orange',\n  },\n  422: {\n    color: 'text-yellow',\n  },\n  423: {\n    color: 'text-purple',\n  },\n  505: {\n    color: 'text-orange',\n  },\n} as const\n\ntype StatusCode = keyof typeof STATUS_CODES_COLORS\n\nexport const getStatusCodeColor = (statusCode: number) => {\n  const code = statusCode as StatusCode\n  return (\n    STATUS_CODES_COLORS[code] || {\n      /** default color */\n      color: 'text-grey',\n    }\n  )\n}\n"],"mappings":";AAAA,IAAM,sBAAsB;CAC1B,KAAK,EACH,OAAO,eACR;CACD,KAAK,EACH,OAAO,cACR;CACD,KAAK,EACH,OAAO,cACR;CACD,KAAK,EACH,OAAO,aACR;CACD,KAAK,EACH,OAAO,aACR;CACD,KAAK,EACH,OAAO,YACR;CACD,KAAK,EACH,OAAO,eACR;CACD,KAAK,EACH,OAAO,eACR;CACD,KAAK,EACH,OAAO,eACR;CACD,KAAK,EACH,OAAO,eACR;CACF;AAID,IAAa,sBAAsB,eAAuB;AAExD,QACE,oBAFW,eAEkB,EAE3B,OAAO,aACR"}

package/dist/v2/blocks/scalar-address-bar-block/hooks/use-loading-animation.js

@@ -0,0 +1,84 @@
+import { ref } from "vue";
+//#region src/v2/blocks/scalar-address-bar-block/hooks/use-loading-animation.ts
+/**
+* Constants for the loading animation behavior.
+* These control how the progress bar animates during and after requests.
+*/
+var TICK_INTERVAL_MS = 20;
+var MAX_PERCENTAGE = 100;
+var MIN_PERCENTAGE = 0;
+var ASYMPTOTIC_LIMIT = 15;
+var ASYMPTOTIC_DIVISOR = 60;
+var FINISH_ANIMATION_STEPS = 400 / TICK_INTERVAL_MS;
+/**
+* Manages the loading animation for the address bar.
+*
+* The animation has two phases:
+* 1. While requesting: Animates asymptotically toward 85% to indicate ongoing work
+* 2. After request completes: Animates linearly to 100% over 400ms for smooth completion
+*
+* This creates a natural feel where the bar does not instantly jump to 100%,
+* making the loading experience more predictable and less jarring.
+*
+* @returns An object with methods to control the loading animation and the current percentage
+*/
+var useLoadingAnimation = () => {
+	/** The current loading percentage from 100 (not started) to 0 (complete) */
+	const percentage = ref(MAX_PERCENTAGE);
+	/** Tracks how much percentage was remaining when the request completed */
+	const remaining = ref(0);
+	/** Indicates whether a request is currently in progress */
+	const isRequesting = ref(false);
+	/** The interval timer that drives the animation */
+	const interval = ref();
+	/**
+	* Resets the animation state to initial values.
+	* This is called when the animation completes.
+	*/
+	const resetAnimation = () => {
+		clearInterval(interval.value);
+		interval.value = void 0;
+		percentage.value = MAX_PERCENTAGE;
+		isRequesting.value = false;
+	};
+	/**
+	* Advances the loading animation by one tick.
+	* Uses different animation strategies based on whether a request is active.
+	*/
+	const load = () => {
+		if (isRequesting.value) percentage.value -= (percentage.value - ASYMPTOTIC_LIMIT) / ASYMPTOTIC_DIVISOR;
+		else percentage.value -= remaining.value / FINISH_ANIMATION_STEPS;
+		if (percentage.value <= MIN_PERCENTAGE) resetAnimation();
+	};
+	/**
+	* Starts the loading animation.
+	* If called while the finishing animation is running, it switches back to requesting mode.
+	* This handles the case where a new request starts before the previous animation completes.
+	*/
+	const startLoading = () => {
+		if (interval.value) {
+			isRequesting.value = true;
+			return;
+		}
+		isRequesting.value = true;
+		interval.value = setInterval(load, TICK_INTERVAL_MS);
+	};
+	/**
+	* Marks the request as complete and begins the finish animation.
+	* The animation will continue until it reaches 100% to provide visual feedback.
+	*/
+	const stopLoading = () => {
+		remaining.value = percentage.value;
+		isRequesting.value = false;
+	};
+	return {
+		startLoading,
+		stopLoading,
+		percentage,
+		isLoading: isRequesting
+	};
+};
+//#endregion
+export { useLoadingAnimation };
+
+//# sourceMappingURL=use-loading-animation.js.map

package/dist/v2/blocks/scalar-address-bar-block/hooks/use-loading-animation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-loading-animation.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-address-bar-block/hooks/use-loading-animation.ts"],"sourcesContent":["import type { Ref } from 'vue'\nimport { ref } from 'vue'\n\n/**\n * Constants for the loading animation behavior.\n * These control how the progress bar animates during and after requests.\n */\nconst TICK_INTERVAL_MS = 20\nconst MAX_PERCENTAGE = 100\nconst MIN_PERCENTAGE = 0\nconst ASYMPTOTIC_LIMIT = 15 // Stops at 85% (100 - 15) to show ongoing progress\nconst ASYMPTOTIC_DIVISOR = 60 // Controls the speed of asymptotic approach\nconst FINISH_ANIMATION_DURATION_MS = 400\nconst FINISH_ANIMATION_STEPS = FINISH_ANIMATION_DURATION_MS / TICK_INTERVAL_MS\n\n/**\n * Manages the loading animation for the address bar.\n *\n * The animation has two phases:\n * 1. While requesting: Animates asymptotically toward 85% to indicate ongoing work\n * 2. After request completes: Animates linearly to 100% over 400ms for smooth completion\n *\n * This creates a natural feel where the bar does not instantly jump to 100%,\n * making the loading experience more predictable and less jarring.\n *\n * @returns An object with methods to control the loading animation and the current percentage\n */\nexport const useLoadingAnimation = (): {\n  startLoading: () => void\n  stopLoading: () => void\n  percentage: Ref<number>\n  isLoading: Ref<boolean>\n} => {\n  /** The current loading percentage from 100 (not started) to 0 (complete) */\n  const percentage = ref(MAX_PERCENTAGE)\n  /** Tracks how much percentage was remaining when the request completed */\n  const remaining = ref(0)\n  /** Indicates whether a request is currently in progress */\n  const isRequesting = ref(false)\n  /** The interval timer that drives the animation */\n  const interval = ref<ReturnType<typeof setInterval>>()\n\n  /**\n   * Resets the animation state to initial values.\n   * This is called when the animation completes.\n   */\n  const resetAnimation = (): void => {\n    clearInterval(interval.value)\n    interval.value = undefined\n    percentage.value = MAX_PERCENTAGE\n    isRequesting.value = false\n  }\n\n  /**\n   * Advances the loading animation by one tick.\n   * Uses different animation strategies based on whether a request is active.\n   */\n  const load = (): void => {\n    if (isRequesting.value) {\n      // Asymptotic approach: Slows down as it nears 85% to indicate ongoing work\n      // without reaching 100% until the request actually completes\n      percentage.value -= (percentage.value - ASYMPTOTIC_LIMIT) / ASYMPTOTIC_DIVISOR\n    } else {\n      // Linear finish: Complete the remaining percentage smoothly over a fixed duration\n      // to avoid jarring jumps when the request completes\n      percentage.value -= remaining.value / FINISH_ANIMATION_STEPS\n    }\n\n    if (percentage.value <= MIN_PERCENTAGE) {\n      resetAnimation()\n    }\n  }\n\n  /**\n   * Starts the loading animation.\n   * If called while the finishing animation is running, it switches back to requesting mode.\n   * This handles the case where a new request starts before the previous animation completes.\n   */\n  const startLoading = (): void => {\n    if (interval.value) {\n      // Switch back to requesting mode if we are in finishing mode.\n      // This prevents the animation from completing while a new request is active.\n      isRequesting.value = true\n      return\n    }\n    isRequesting.value = true\n    interval.value = setInterval(load, TICK_INTERVAL_MS)\n  }\n\n  /**\n   * Marks the request as complete and begins the finish animation.\n   * The animation will continue until it reaches 100% to provide visual feedback.\n   */\n  const stopLoading = (): void => {\n    remaining.value = percentage.value\n    isRequesting.value = false\n  }\n\n  return {\n    startLoading,\n    stopLoading,\n    percentage,\n    isLoading: isRequesting,\n  }\n}\n"],"mappings":";;;;;;AAOA,IAAM,mBAAmB;AACzB,IAAM,iBAAiB;AACvB,IAAM,iBAAiB;AACvB,IAAM,mBAAmB;AACzB,IAAM,qBAAqB;AAE3B,IAAM,yBAD+B,MACyB;;;;;;;;;;;;;AAc9D,IAAa,4BAKR;;CAEH,MAAM,aAAa,IAAI,eAAe;;CAEtC,MAAM,YAAY,IAAI,EAAE;;CAExB,MAAM,eAAe,IAAI,MAAM;;CAE/B,MAAM,WAAW,KAAqC;;;;;CAMtD,MAAM,uBAA6B;AACjC,gBAAc,SAAS,MAAM;AAC7B,WAAS,QAAQ,KAAA;AACjB,aAAW,QAAQ;AACnB,eAAa,QAAQ;;;;;;CAOvB,MAAM,aAAmB;AACvB,MAAI,aAAa,MAGf,YAAW,UAAU,WAAW,QAAQ,oBAAoB;MAI5D,YAAW,SAAS,UAAU,QAAQ;AAGxC,MAAI,WAAW,SAAS,eACtB,iBAAgB;;;;;;;CASpB,MAAM,qBAA2B;AAC/B,MAAI,SAAS,OAAO;AAGlB,gBAAa,QAAQ;AACrB;;AAEF,eAAa,QAAQ;AACrB,WAAS,QAAQ,YAAY,MAAM,iBAAiB;;;;;;CAOtD,MAAM,oBAA0B;AAC9B,YAAU,QAAQ,WAAW;AAC7B,eAAa,QAAQ;;AAGvB,QAAO;EACL;EACA;EACA;EACA,WAAW;EACZ"}

package/dist/v2/blocks/scalar-address-bar-block/index.d.ts

@@ -1,3 +1,3 @@
-export { default as AddressBar } from './components/AddressBar.vue';
-export type { History } from './components/AddressBarHistory.vue';
+export { default as AddressBar } from './components/AddressBar.vue.js';
+export type { History } from './components/AddressBarHistory.vue.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/v2/blocks/scalar-address-bar-block/index.js

@@ -1,5 +1,2 @@
-import "../../../HttpMethod-rnWEgC3T.js";
-import "../../../code-input-iq-moLxi.js";
-import { t as AddressBar_default } from "../../../scalar-address-bar-block-BbysOhkE.js";
-import "../../../server-tcI-OCyx.js";
+import AddressBar_default from "./components/AddressBar.vue.js";
 export { AddressBar_default as AddressBar };

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

@@ -3,8 +3,8 @@ import type { SelectedSecurity } from '@scalar/workspace-store/entities/auth';
 import type { AuthMeta, WorkspaceEventBus } from '@scalar/workspace-store/events';
 import type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments';
 import type { OpenApiDocument, ServerObject } from '@scalar/workspace-store/schemas/v3.1/strict/openapi-document';
-import type { MergedSecuritySchemes } from '../../../../v2/blocks/scalar-auth-selector-block/helpers/merge-security';
-import { type SecuritySchemeOption } from '../../../../v2/blocks/scalar-auth-selector-block/helpers/security-scheme';
+import type { MergedSecuritySchemes } from '../../../../v2/blocks/scalar-auth-selector-block/helpers/merge-security.js';
+import { type SecuritySchemeOption } from '../../../../v2/blocks/scalar-auth-selector-block/helpers/security-scheme.js';
 type __VLS_Props = {
     environment: XScalarEnvironment;
     eventBus: WorkspaceEventBus;
@@ -28,7 +28,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {
         text: string;
     } | null>;
     selectedSchemeOptions: import("vue").ComputedRef<SecuritySchemeOption[]>;
-    schemeOptions: import("vue").ComputedRef<SecuritySchemeOption[] | import("../../../../v2/blocks/scalar-auth-selector-block/helpers/security-scheme").SecuritySchemeGroup[]>;
+    schemeOptions: import("vue").ComputedRef<SecuritySchemeOption[] | import("../../../../v2/blocks/scalar-auth-selector-block/helpers/security-scheme.js").SecuritySchemeGroup[]>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"AuthSelector.vue.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 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 { isAuthOptional } from '@/v2/blocks/scalar-auth-selector-block/helpers/is-auth-optional'\nimport type { MergedSecuritySchemes } from '@/v2/blocks/scalar-auth-selector-block/helpers/merge-security'\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} = 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}>()\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      :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":""}

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

@@ -0,0 +1,227 @@
+import CollapsibleSection_default from "../../../components/layout/CollapsibleSection.vue.js";
+import DeleteRequestAuthModal_default from "./DeleteRequestAuthModal.vue.js";
+import { isAuthOptional } from "../helpers/is-auth-optional.js";
+import { formatComplexScheme, formatScheme, getSecuritySchemeOptions } from "../helpers/security-scheme.js";
+import RequestAuthDataTable_default from "./RequestAuthDataTable.vue.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, ref, toDisplayString, unref, useId, withCtx, withModifiers } from "vue";
+import { ScalarButton, ScalarComboboxMultiselect, ScalarIconButton, ScalarListboxCheckbox, useModal } from "@scalar/components";
+import { ScalarIconCaretDown, ScalarIconTrash } from "@scalar/icons";
+import { getResolvedRef } from "@scalar/workspace-store/helpers/get-resolved-ref";
+import { unpackProxyObject } from "@scalar/workspace-store/helpers/unpack-proxy";
+//#region src/v2/blocks/scalar-auth-selector-block/components/AuthSelector.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["id"];
+var _hoisted_2 = { class: "min-w-0 flex-1 truncate" };
+var AuthSelector_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "AuthSelector",
+	props: {
+		environment: {},
+		eventBus: {},
+		createAnySecurityScheme: {
+			type: Boolean,
+			default: false
+		},
+		defaultOpen: {
+			type: Boolean,
+			default: true
+		},
+		isStatic: {
+			type: Boolean,
+			default: false
+		},
+		meta: {},
+		proxyUrl: {},
+		securityRequirements: {},
+		securitySchemes: {},
+		selectedSecurity: {},
+		server: {},
+		title: {}
+	},
+	setup(__props, { expose: __expose }) {
+		const titleId = useId();
+		const comboboxButtonRef = ref(null);
+		const isDisclosureOpen = ref(false);
+		const deleteModal = useModal();
+		const schemeToDelete = ref(null);
+		/**
+		* Determines if authentication is required or optional
+		*
+		* Auth is optional when there is an empty security requirement and no complex requirements.
+		* Complex requirements have multiple auth schemes combined (e.g., API key + OAuth).
+		*/
+		const authIndicator = computed(() => {
+			if (!__props.securityRequirements?.length) return null;
+			const isOptional = isAuthOptional(__props.securityRequirements);
+			return {
+				icon: isOptional ? "Unlock" : "Lock",
+				text: isOptional ? "Optional" : "Required"
+			};
+		});
+		/** All available auth scheme options for the dropdown */
+		const availableSchemeOptions = computed(() => getSecuritySchemeOptions(__props.securityRequirements ?? [], __props.securitySchemes ?? {}, __props.selectedSecurity?.selectedSchemes ?? [], __props.createAnySecurityScheme));
+		/** Currently active auth schemes selected for this operation or collection */
+		const activeSchemeOptions = computed(() => {
+			const schemes = __props.selectedSecurity?.selectedSchemes;
+			if (!schemes?.length) return [];
+			return schemes.flatMap((requirement) => {
+				const schemeNames = Object.keys(requirement);
+				if (schemeNames.length === 0) return [];
+				if (schemeNames.length > 1) return formatComplexScheme(requirement);
+				const schemeName = schemeNames[0];
+				if (!schemeName) return [];
+				if (!getResolvedRef(__props.securitySchemes?.[schemeName])) return [];
+				return formatScheme({
+					name: schemeName,
+					value: requirement
+				});
+			});
+		});
+		/**
+		* Opens the combobox dropdown when clicking the auth indicator badge.
+		* Prevents the disclosure from toggling if it is already open.
+		*/
+		const handleAuthIndicatorClick = (event) => {
+			if (isDisclosureOpen.value) event.stopPropagation();
+			comboboxButtonRef.value?.$el.click();
+		};
+		/**
+		* Updates the selected auth schemes.
+		* Separates existing schemes from newly created ones for the event payload.
+		*/
+		const handleSchemeSelection = (selected) => {
+			const existingSchemes = selected.filter((option) => option.payload === void 0).map((option) => unpackProxyObject(option.value, { depth: 2 }));
+			const newSchemes = selected.filter((option) => option.payload !== void 0).map((option) => ({
+				name: option.label,
+				scheme: option.payload
+			}));
+			__props.eventBus.emit("auth:update:selected-security-schemes", {
+				selectedRequirements: existingSchemes,
+				newSchemes,
+				meta: __props.meta
+			});
+		};
+		/** Shows the delete confirmation modal for the selected scheme */
+		const handleDeleteRequest = (option) => {
+			schemeToDelete.value = {
+				label: option.label,
+				payload: option.value
+			};
+			deleteModal.show();
+		};
+		/** Deletes the selected auth scheme after confirmation */
+		const handleDeleteConfirm = () => {
+			if (!schemeToDelete.value) return;
+			__props.eventBus.emit("auth:delete:security-scheme", { names: Object.keys(schemeToDelete.value.payload) });
+			schemeToDelete.value = null;
+			deleteModal.hide();
+		};
+		__expose({
+			authIndicator,
+			selectedSchemeOptions: activeSchemeOptions,
+			schemeOptions: availableSchemeOptions
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(CollapsibleSection_default), {
+				class: "group/params relative",
+				defaultOpen: __props.defaultOpen,
+				isStatic: __props.isStatic,
+				itemCount: activeSchemeOptions.value.length,
+				"onUpdate:modelValue": _cache[1] || (_cache[1] = (open) => isDisclosureOpen.value = open)
+			}, {
+				title: withCtx(() => [createElementVNode("div", {
+					id: unref(titleId),
+					class: "inline-flex items-center gap-0.5 leading-[20px]"
+				}, [createElementVNode("span", null, toDisplayString(__props.title), 1), authIndicator.value ? (openBlock(), createElementBlock("span", {
+					key: 0,
+					class: normalizeClass(["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", { "text-c-1": authIndicator.value.text === "Required" }]),
+					"data-testid": "auth-indicator",
+					onClick: handleAuthIndicatorClick
+				}, toDisplayString(authIndicator.value.text), 3)) : createCommentVNode("", true)], 8, _hoisted_1)]),
+				actions: withCtx(() => [createVNode(unref(ScalarComboboxMultiselect), {
+					class: "w-72 text-xs",
+					modelValue: activeSchemeOptions.value,
+					multiple: "",
+					options: availableSchemeOptions.value,
+					placement: "bottom-end",
+					teleport: "",
+					onDelete: handleDeleteRequest,
+					"onUpdate:modelValue": handleSchemeSelection
+				}, {
+					option: withCtx(({ option, selected }) => [
+						createVNode(unref(ScalarListboxCheckbox), {
+							multiselect: "",
+							selected
+						}, null, 8, ["selected"]),
+						createElementVNode("div", _hoisted_2, toDisplayString(option.label), 1),
+						option.isDeletable ? (openBlock(), createBlock(unref(ScalarIconButton), {
+							key: 0,
+							class: "-m-0.5 shrink-0 p-0.5 opacity-0 group-hover/item:opacity-100",
+							icon: unref(ScalarIconTrash),
+							label: `Delete ${option.label}`,
+							size: "xs",
+							onClick: withModifiers(($event) => handleDeleteRequest(option), ["stop"])
+						}, null, 8, [
+							"icon",
+							"label",
+							"onClick"
+						])) : createCommentVNode("", true)
+					]),
+					default: withCtx(() => [createVNode(unref(ScalarButton), {
+						ref_key: "comboboxButtonRef",
+						ref: comboboxButtonRef,
+						"aria-describedby": unref(titleId),
+						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",
+						variant: "ghost"
+					}, {
+						default: withCtx(() => [activeSchemeOptions.value.length === 1 ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [_cache[2] || (_cache[2] = createElementVNode("span", { class: "sr-only" }, "Selected Auth Type:", -1)), createTextVNode(" " + toDisplayString(activeSchemeOptions.value[0]?.label), 1)], 64)) : activeSchemeOptions.value.length > 1 ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [_cache[3] || (_cache[3] = createTextVNode(" Multiple ", -1)), _cache[4] || (_cache[4] = createElementVNode("span", { class: "sr-only" }, "Auth Types Selected", -1))], 64)) : (openBlock(), createElementBlock(Fragment, { key: 2 }, [_cache[5] || (_cache[5] = createElementVNode("span", { class: "sr-only" }, "Select", -1)), _cache[6] || (_cache[6] = createTextVNode(" Auth Type ", -1))], 64)), createVNode(unref(ScalarIconCaretDown), {
+							class: "size-3 shrink-0 transition-transform duration-100 group-aria-expanded/combobox-button:rotate-180",
+							weight: "bold"
+						})]),
+						_: 1
+					}, 8, ["aria-describedby"])]),
+					_: 1
+				}, 8, ["modelValue", "options"])]),
+				default: withCtx(() => [createVNode(RequestAuthDataTable_default, {
+					activeAuthIndex: __props.selectedSecurity?.selectedIndex ?? 0,
+					environment: __props.environment,
+					eventBus: __props.eventBus,
+					isStatic: __props.isStatic,
+					meta: __props.meta,
+					proxyUrl: __props.proxyUrl,
+					securitySchemes: __props.securitySchemes,
+					selectedSchemeOptions: activeSchemeOptions.value,
+					server: __props.server
+				}, null, 8, [
+					"activeAuthIndex",
+					"environment",
+					"eventBus",
+					"isStatic",
+					"meta",
+					"proxyUrl",
+					"securitySchemes",
+					"selectedSchemeOptions",
+					"server"
+				]), schemeToDelete.value ? (openBlock(), createBlock(DeleteRequestAuthModal_default, {
+					key: 0,
+					label: schemeToDelete.value.label,
+					scheme: schemeToDelete.value,
+					state: unref(deleteModal),
+					onClose: _cache[0] || (_cache[0] = ($event) => unref(deleteModal).hide()),
+					onDelete: handleDeleteConfirm
+				}, null, 8, [
+					"label",
+					"scheme",
+					"state"
+				])) : createCommentVNode("", true)]),
+				_: 1
+			}, 8, [
+				"defaultOpen",
+				"isStatic",
+				"itemCount"
+			]);
+		};
+	}
+});
+//#endregion
+export { AuthSelector_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=AuthSelector.vue.script.js.map

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

@@ -0,0 +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 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 { isAuthOptional } from '@/v2/blocks/scalar-auth-selector-block/helpers/is-auth-optional'\nimport type { MergedSecuritySchemes } from '@/v2/blocks/scalar-auth-selector-block/helpers/merge-security'\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} = 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}>()\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      :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/DeleteRequestAuthModal.vue.js

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"DeleteRequestAuthModal.vue.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-auth-selector-block/components/DeleteRequestAuthModal.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton, ScalarModal } from '@scalar/components'\n\ndefineProps<{\n  state: { open: boolean; show: () => void; hide: () => void }\n  label: string\n}>()\n\nconst emit = defineEmits<{\n  (e: 'close'): void\n  (e: 'delete'): void\n}>()\n\nconst deleteScheme = () => {\n  emit('delete')\n}\n</script>\n<template>\n  <ScalarModal\n    size=\"xxs\"\n    :state=\"state\"\n    title=\"Delete Security Scheme\">\n    <p class=\"text-c-2 mb-4 text-sm leading-normal\">\n      This cannot be undone. You're about to delete the\n      {{ label }} security scheme from the collection.\n    </p>\n    <div class=\"flex justify-between gap-2\">\n      <ScalarButton\n        class=\"flex h-8 cursor-pointer items-center gap-1.5 px-3 shadow-none focus:outline-none\"\n        type=\"button\"\n        variant=\"outlined\"\n        @click=\"emit('close')\">\n        Cancel\n      </ScalarButton>\n      <ScalarButton\n        class=\"flex h-8 cursor-pointer items-center gap-1.5 px-3 shadow-none focus:outline-none\"\n        type=\"submit\"\n        @click=\"deleteScheme\">\n        Delete {{ label }}\n      </ScalarButton>\n    </div>\n  </ScalarModal>\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,48 @@
+import { createBlock, createElementVNode, createTextVNode, createVNode, defineComponent, openBlock, toDisplayString, unref, withCtx } from "vue";
+import { ScalarButton, ScalarModal } from "@scalar/components";
+//#region src/v2/blocks/scalar-auth-selector-block/components/DeleteRequestAuthModal.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "text-c-2 mb-4 text-sm leading-normal" };
+var _hoisted_2 = { class: "flex justify-between gap-2" };
+var DeleteRequestAuthModal_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "DeleteRequestAuthModal",
+	props: {
+		state: {},
+		label: {}
+	},
+	emits: ["close", "delete"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		const deleteScheme = () => {
+			emit("delete");
+		};
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(ScalarModal), {
+				size: "xxs",
+				state: __props.state,
+				title: "Delete Security Scheme"
+			}, {
+				default: withCtx(() => [createElementVNode("p", _hoisted_1, " This cannot be undone. You're about to delete the " + toDisplayString(__props.label) + " security scheme from the collection. ", 1), createElementVNode("div", _hoisted_2, [createVNode(unref(ScalarButton), {
+					class: "flex h-8 cursor-pointer items-center gap-1.5 px-3 shadow-none focus:outline-none",
+					type: "button",
+					variant: "outlined",
+					onClick: _cache[0] || (_cache[0] = ($event) => emit("close"))
+				}, {
+					default: withCtx(() => [..._cache[1] || (_cache[1] = [createTextVNode(" Cancel ", -1)])]),
+					_: 1
+				}), createVNode(unref(ScalarButton), {
+					class: "flex h-8 cursor-pointer items-center gap-1.5 px-3 shadow-none focus:outline-none",
+					type: "submit",
+					onClick: deleteScheme
+				}, {
+					default: withCtx(() => [createTextVNode(" Delete " + toDisplayString(__props.label), 1)]),
+					_: 1
+				})])]),
+				_: 1
+			}, 8, ["state"]);
+		};
+	}
+});
+//#endregion
+export { DeleteRequestAuthModal_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=DeleteRequestAuthModal.vue.script.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DeleteRequestAuthModal.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-auth-selector-block/components/DeleteRequestAuthModal.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton, ScalarModal } from '@scalar/components'\n\ndefineProps<{\n  state: { open: boolean; show: () => void; hide: () => void }\n  label: string\n}>()\n\nconst emit = defineEmits<{\n  (e: 'close'): void\n  (e: 'delete'): void\n}>()\n\nconst deleteScheme = () => {\n  emit('delete')\n}\n</script>\n<template>\n  <ScalarModal\n    size=\"xxs\"\n    :state=\"state\"\n    title=\"Delete Security Scheme\">\n    <p class=\"text-c-2 mb-4 text-sm leading-normal\">\n      This cannot be undone. You're about to delete the\n      {{ label }} security scheme from the collection.\n    </p>\n    <div class=\"flex justify-between gap-2\">\n      <ScalarButton\n        class=\"flex h-8 cursor-pointer items-center gap-1.5 px-3 shadow-none focus:outline-none\"\n        type=\"button\"\n        variant=\"outlined\"\n        @click=\"emit('close')\">\n        Cancel\n      </ScalarButton>\n      <ScalarButton\n        class=\"flex h-8 cursor-pointer items-center gap-1.5 px-3 shadow-none focus:outline-none\"\n        type=\"submit\"\n        @click=\"deleteScheme\">\n        Delete {{ label }}\n      </ScalarButton>\n    </div>\n  </ScalarModal>\n</template>\n"],"mappings":";;;;;;;;;;;;;EAQA,MAAM,OAAO;EAKb,MAAM,qBAAqB;AACzB,QAAK,SAAQ;;;uBAIb,YAuBc,MAAA,YAAA,EAAA;IAtBZ,MAAK;IACJ,OAAO,QAAA;IACR,OAAM;;2BAIF,CAHJ,mBAGI,KAHJ,YAAgD,wDAE9C,gBAAG,QAAA,MAAK,GAAG,0CACb,EAAA,EACA,mBAcM,OAdN,YAcM,CAbJ,YAMe,MAAA,aAAA,EAAA;KALb,OAAM;KACN,MAAK;KACL,SAAQ;KACP,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,QAAA;;4BAEd,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA,CAAA,gBAFyB,YAEzB,GAAA,CAAA,EAAA,CAAA;;QACA,YAKe,MAAA,aAAA,EAAA;KAJb,OAAM;KACN,MAAK;KACJ,SAAO;;4BACD,CAAA,gBADe,aACf,gBAAG,QAAA,MAAK,EAAA,EAAA,CAAA,CAAA"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"OAuth2.vue.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-auth-selector-block/components/OAuth2.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton, useLoadingState } from '@scalar/components'\nimport { pkceOptions } from '@scalar/oas-utils/entities/spec'\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 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 { DataTableRow } from '@/components/DataTable'\nimport { getEnvironmentVariables } from '@/v2/blocks/operation-block/helpers/get-environment-variables'\nimport OAuthScopesInput from '@/v2/blocks/scalar-auth-selector-block/components/OAuthScopesInput.vue'\nimport { authorizeOauth2 } from '@/v2/blocks/scalar-auth-selector-block/helpers/oauth'\nimport type {\n  OAuthFlowAuthorizationCodeSecret,\n  OAuthFlowClientCredentialsSecret,\n  OAuthFlowPasswordSecret,\n  OAuthFlowsObjectSecret,\n  SecuritySchemeObjectSecret,\n} from '@/v2/blocks/scalar-auth-selector-block/helpers/secret-types'\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} = 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}>()\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    if (\n      hasPrefilledRedirectUri.value ||\n      newRedirectUri ||\n      typeof window === 'undefined' ||\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':\n        window.location.origin + window.location.pathname,\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":""}