@scalar/api-client 3.3.1 → 3.5.0

package/dist/v2/blocks/operation-block/components/Header.vue.d.ts

@@ -22,6 +22,10 @@ export type HeaderProps = {
     hideClientButton?: boolean;
     /** Client integration  */
     integration?: string | null;
+    /** Openapi document slug */
+    documentSlug: string;
+    /** Currently selected example key for the current operation */
+    exampleKey: string;
     /** Openapi document url for `modal` mode to open the client app */
     documentUrl?: string;
     /** Client source */

package/dist/v2/blocks/operation-block/components/Header.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Header.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/operation-block/components/Header.vue"],"names":[],"mappings":"AAiMA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAA;AAEnE,OAAO,KAAK,EACV,UAAU,EACV,iBAAiB,EAClB,MAAM,gCAAgC,CAAA;AACvC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2EAA2E,CAAA;AACnH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,8DAA8D,CAAA;AAEhG,OAAO,EAAc,KAAK,OAAO,EAAE,MAAM,sCAAsC,CAAA;AAE/E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAKrD;;;;;;GAMG;AACH,MAAM,MAAM,WAAW,GAAG;IACxB,2BAA2B;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ,6BAA6B;IAC7B,MAAM,EAAE,UAAU,CAAA;IAClB,oBAAoB;IACpB,MAAM,EAAE,YAAY,CAAA;IACpB,4CAA4C;IAC5C,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,0BAA0B;IAC1B,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B,mEAAmE;IACnE,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,oBAAoB;IACpB,MAAM,CAAC,EAAE,SAAS,GAAG,eAAe,CAAA;IACpC,gCAAgC;IAChC,MAAM,EAAE,YAAY,GAAG,IAAI,CAAA;IAC3B,mDAAmD;IACnD,OAAO,EAAE,YAAY,EAAE,CAAA;IACvB,8BAA8B;IAC9B,OAAO,EAAE,OAAO,EAAE,CAAA;IAClB,gBAAgB;IAChB,QAAQ,EAAE,iBAAiB,CAAA;IAC3B,uBAAuB;IACvB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAA;IACvB,qCAAqC;IACrC,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,4BAA4B;IAC5B,WAAW,EAAE,kBAAkB,CAAA;IAC/B,sCAAsC;IACtC,UAAU,EAAE,UAAU,CAAA;CACvB,CAAA;wBACoB,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;;;eAS6B,MAAM;;;;;;;eAAN,MAAM;;;;kFA+SjD,CAAC"}
+{"version":3,"file":"Header.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/operation-block/components/Header.vue"],"names":[],"mappings":"AA4MA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAA;AAEnE,OAAO,KAAK,EACV,UAAU,EACV,iBAAiB,EAClB,MAAM,gCAAgC,CAAA;AACvC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2EAA2E,CAAA;AACnH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,8DAA8D,CAAA;AAEhG,OAAO,EAAc,KAAK,OAAO,EAAE,MAAM,sCAAsC,CAAA;AAE/E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAKrD;;;;;;GAMG;AACH,MAAM,MAAM,WAAW,GAAG;IACxB,2BAA2B;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ,6BAA6B;IAC7B,MAAM,EAAE,UAAU,CAAA;IAClB,oBAAoB;IACpB,MAAM,EAAE,YAAY,CAAA;IACpB,4CAA4C;IAC5C,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,0BAA0B;IAC1B,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC3B,4BAA4B;IAC5B,YAAY,EAAE,MAAM,CAAA;IACpB,+DAA+D;IAC/D,UAAU,EAAE,MAAM,CAAA;IAClB,mEAAmE;IACnE,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,oBAAoB;IACpB,MAAM,CAAC,EAAE,SAAS,GAAG,eAAe,CAAA;IACpC,gCAAgC;IAChC,MAAM,EAAE,YAAY,GAAG,IAAI,CAAA;IAC3B,mDAAmD;IACnD,OAAO,EAAE,YAAY,EAAE,CAAA;IACvB,8BAA8B;IAC9B,OAAO,EAAE,OAAO,EAAE,CAAA;IAClB,gBAAgB;IAChB,QAAQ,EAAE,iBAAiB,CAAA;IAC3B,uBAAuB;IACvB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAA;IACvB,qCAAqC;IACrC,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,4BAA4B;IAC5B,WAAW,EAAE,kBAAkB,CAAA;IAC/B,sCAAsC;IACtC,UAAU,EAAE,UAAU,CAAA;CACvB,CAAA;wBACoB,OAAO,YAAY;AAAxC,wBAAyC;AACzC,QAAA,MAAM,YAAY;;;eAc6B,MAAM;;;;;;;eAAN,MAAM;;;;kFAmTjD,CAAC"}

package/dist/v2/blocks/operation-block/components/Header.vue.js

@@ -2,7 +2,7 @@ import _plugin_vue_export_helper_default from "../../../../_virtual/_plugin-vue_
 import Header_vue_vue_type_script_setup_true_lang_default from "./Header.vue.script.js";
 /* empty css                     */
 //#region src/v2/blocks/operation-block/components/Header.vue
-var Header_default = /* @__PURE__ */ _plugin_vue_export_helper_default(Header_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-1c2b0dae"]]);
+var Header_default = /* @__PURE__ */ _plugin_vue_export_helper_default(Header_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-09019679"]]);
 //#endregion
 export { Header_default as default };
 

package/dist/v2/blocks/operation-block/components/Header.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.vue.js","names":[],"sources":["../../../../../src/v2/blocks/operation-block/components/Header.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n  Operation block header: address bar, environment selector, and modal controls.\n\n  Renders the top bar for the API client operation view: URL/method (AddressBar),\n  optional environment selector, optional \"Open API Client\" button in modal layout,\n  and close button for modal. Layout and visibility depend on `layout` and `source` props.\n */\nexport type HeaderProps = {\n  /** Current request path */\n  path: string\n  /** Current request method */\n  method: HttpMethod\n  /** Client layout */\n  layout: ClientLayout\n  /** Hides the client button on the header */\n  hideClientButton?: boolean\n  /** Client integration  */\n  integration?: string | null\n  /** Openapi document url for `modal` mode to open the client app */\n  documentUrl?: string\n  /** Client source */\n  source?: 'gitbook' | 'api-reference'\n  /** Currently selected server */\n  server: ServerObject | null\n  /** Server list available for operation/document */\n  servers: ServerObject[]\n  /** List of request history */\n  history: History[]\n  /** Event bus */\n  eventBus: WorkspaceEventBus\n  /** Environment list */\n  environments?: string[]\n  /** Currently selected environment */\n  activeEnvironment?: string\n  /** Environment variables */\n  environment: XScalarEnvironment\n  /** Meta information for the server */\n  serverMeta: ServerMeta\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ScalarIcon, ScalarIconButton } from '@scalar/components'\nimport type { HttpMethod } from '@scalar/helpers/http/http-methods'\nimport { ScalarIconGearSix } from '@scalar/icons'\nimport type {\n  ServerMeta,\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'\n\nimport { AddressBar, type History } from '@/v2/blocks/scalar-address-bar-block'\nimport EnvironmentSelector from '@/v2/blocks/scalar-address-bar-block/components/EnvironmentSelector.vue'\nimport type { ClientLayout } from '@/v2/types/layout'\n\nimport OpenApiClientButton from './OpenApiClientButton.vue'\n\nconst { hideClientButton = false, eventBus } = defineProps<HeaderProps>()\n\nconst emit = defineEmits<{\n  /** Execute the current operation example */\n  (e: 'execute'): void\n  /** Select a request history item by index */\n  (e: 'select:history:item', payload: { index: number }): void\n  /** Add a new environment */\n  (e: 'add:environment'): void\n  /** Navigate to the settings page for the current entity */\n  (e: 'navigate:settings'): void\n}>()\n\nconst handleSelectEnvironment = (environmentName: string) => {\n  eventBus.emit('workspace:update:active-environment', environmentName)\n}\n\nconst handleAddEnvironment = () => {\n  eventBus.emit('ui:navigate', { page: 'document', path: 'environment' })\n}\n</script>\n\n<template>\n  <div\n    class=\"lg:min-h-header t-app__top-container flex w-full flex-wrap items-center justify-center p-2 pt-2 lg:p-1 lg:pt-1\">\n    <div\n      class=\"mb-2 flex w-1/2 flex-row items-center gap-1 lg:mb-0 lg:flex-1 lg:px-1\">\n      <!--\n          Holds space for the sidebar toggle\n\n          Hidden for `modal` layout\n      -->\n      <div class=\"size-8\"></div>\n    </div>\n    <AddressBar\n      :activeEnvironment\n      :environment\n      :environments\n      :eventBus\n      :history\n      :layout\n      :method\n      :path\n      :server\n      :serverMeta\n      :servers\n      @add:environment=\"emit('add:environment')\"\n      @execute=\"emit('execute')\"\n      @select:history:item=\"\n        (payload) => emit('select:history:item', payload)\n      \" />\n\n    <div\n      class=\"mb-2 flex w-1/2 flex-row items-center justify-end gap-2 lg:mb-0 lg:flex-1 lg:px-2.5\">\n      <!--\n        Environment Selector\n        Hidden for `modal` layout\n      -->\n      <EnvironmentSelector\n        v-if=\"layout !== 'modal'\"\n        :activeEnvironment=\"activeEnvironment\"\n        :environments=\"environments\"\n        @add:environment=\"handleAddEnvironment\"\n        @select:environment=\"handleSelectEnvironment\" />\n      <!-- Operation settings -->\n      <ScalarIconButton\n        v-if=\"layout !== 'modal'\"\n        :icon=\"ScalarIconGearSix\"\n        label=\"Operation settings\"\n        size=\"sm\"\n        weight=\"bold\"\n        @click=\"emit('navigate:settings')\" />\n      <!--\n          Open API Client Button\n\n          Only shown in `modal` layout\n      -->\n      <OpenApiClientButton\n        v-if=\"layout === 'modal' && documentUrl && !hideClientButton\"\n        buttonSource=\"modal\"\n        class=\"!w-fit lg:-mr-1\"\n        :integration=\"integration ?? null\"\n        :source=\"source ?? 'api-reference'\"\n        :url=\"documentUrl\" />\n\n      <!--\n          Close Button\n\n          Only shown in `modal` layout and hidden for GitBook Integration\n      -->\n      <button\n        v-if=\"layout === 'modal' && source !== 'gitbook'\"\n        class=\"app-exit-button zoomed:static zoomed:p-1 fixed top-2 right-2 rounded-full p-2\"\n        type=\"button\"\n        @click=\"eventBus.emit('ui:close:client-modal')\">\n        <ScalarIcon\n          icon=\"Close\"\n          size=\"lg\"\n          thickness=\"2\" />\n        <span class=\"sr-only\">Close Client</span>\n      </button>\n\n      <!--\n          Close Button for GitBook Integration\n\n          Hidden by default and visible for GitBook Integration in `modal` layout\n      -->\n      <button\n        v-if=\"layout === 'modal' && source === 'gitbook'\"\n        class=\"text-c-1 hover:bg-b-2 active:text-c-1 -mr-1.5 rounded p-2\"\n        type=\"button\"\n        @click=\"eventBus.emit('ui:close:client-modal')\">\n        <ScalarIcon\n          icon=\"Close\"\n          size=\"md\"\n          thickness=\"1.75\" />\n        <span class=\"sr-only\">Close Client</span>\n      </button>\n    </div>\n  </div>\n</template>\n<style scoped>\n.app-exit-button {\n  color: white;\n  background: rgba(0, 0, 0, 0.1);\n}\n.app-exit-button:hover {\n  background: rgba(255, 255, 255, 0.1);\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"Header.vue.js","names":[],"sources":["../../../../../src/v2/blocks/operation-block/components/Header.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n  Operation block header: address bar, environment selector, and modal controls.\n\n  Renders the top bar for the API client operation view: URL/method (AddressBar),\n  optional environment selector, optional \"Open API Client\" button in modal layout,\n  and close button for modal. Layout and visibility depend on `layout` and `source` props.\n */\nexport type HeaderProps = {\n  /** Current request path */\n  path: string\n  /** Current request method */\n  method: HttpMethod\n  /** Client layout */\n  layout: ClientLayout\n  /** Hides the client button on the header */\n  hideClientButton?: boolean\n  /** Client integration  */\n  integration?: string | null\n  /** Openapi document slug */\n  documentSlug: string\n  /** Currently selected example key for the current operation */\n  exampleKey: string\n  /** Openapi document url for `modal` mode to open the client app */\n  documentUrl?: string\n  /** Client source */\n  source?: 'gitbook' | 'api-reference'\n  /** Currently selected server */\n  server: ServerObject | null\n  /** Server list available for operation/document */\n  servers: ServerObject[]\n  /** List of request history */\n  history: History[]\n  /** Event bus */\n  eventBus: WorkspaceEventBus\n  /** Environment list */\n  environments?: string[]\n  /** Currently selected environment */\n  activeEnvironment?: string\n  /** Environment variables */\n  environment: XScalarEnvironment\n  /** Meta information for the server */\n  serverMeta: ServerMeta\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ScalarIcon, ScalarIconButton } from '@scalar/components'\nimport type { HttpMethod } from '@scalar/helpers/http/http-methods'\nimport { ScalarIconGearSix } from '@scalar/icons'\nimport type {\n  ServerMeta,\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'\n\nimport { AddressBar, type History } from '@/v2/blocks/scalar-address-bar-block'\nimport EnvironmentSelector from '@/v2/blocks/scalar-address-bar-block/components/EnvironmentSelector.vue'\nimport type { ClientLayout } from '@/v2/types/layout'\n\nimport OpenApiClientButton from './OpenApiClientButton.vue'\n\nconst {\n  hideClientButton = false,\n  eventBus,\n  exampleKey,\n  documentSlug,\n} = defineProps<HeaderProps>()\n\nconst emit = defineEmits<{\n  /** Execute the current operation example */\n  (e: 'execute'): void\n  /** Select a request history item by index */\n  (e: 'select:history:item', payload: { index: number }): void\n  /** Add a new environment */\n  (e: 'add:environment'): void\n  /** Navigate to the settings page for the current entity */\n  (e: 'navigate:settings'): void\n}>()\n\nconst handleSelectEnvironment = (environmentName: string) => {\n  eventBus.emit('workspace:update:active-environment', environmentName)\n}\n\nconst handleAddEnvironment = () => {\n  eventBus.emit('ui:navigate', { page: 'document', path: 'environment' })\n}\n</script>\n\n<template>\n  <div\n    class=\"lg:min-h-header t-app__top-container flex w-full flex-wrap items-center justify-center p-2 pt-2 lg:p-1 lg:pt-1\">\n    <div\n      class=\"mb-2 flex w-1/2 flex-row items-center gap-1 lg:mb-0 lg:flex-1 lg:px-1\">\n      <!--\n          Holds space for the sidebar toggle\n\n          Hidden for `modal` layout\n      -->\n      <div class=\"size-8\"></div>\n    </div>\n    <AddressBar\n      :activeEnvironment\n      :documentSlug\n      :environment\n      :environments\n      :eventBus\n      :exampleKey\n      :history\n      :layout\n      :method\n      :path\n      :server\n      :serverMeta\n      :servers\n      @add:environment=\"emit('add:environment')\"\n      @execute=\"emit('execute')\"\n      @select:history:item=\"\n        (payload) => emit('select:history:item', payload)\n      \" />\n\n    <div\n      class=\"mb-2 flex w-1/2 flex-row items-center justify-end gap-2 lg:mb-0 lg:flex-1 lg:px-2.5\">\n      <!--\n        Environment Selector\n        Hidden for `modal` layout\n      -->\n      <EnvironmentSelector\n        v-if=\"layout !== 'modal'\"\n        :activeEnvironment=\"activeEnvironment\"\n        :environments=\"environments\"\n        @add:environment=\"handleAddEnvironment\"\n        @select:environment=\"handleSelectEnvironment\" />\n      <!-- Operation settings -->\n      <ScalarIconButton\n        v-if=\"layout !== 'modal'\"\n        :icon=\"ScalarIconGearSix\"\n        label=\"Operation settings\"\n        size=\"sm\"\n        weight=\"bold\"\n        @click=\"emit('navigate:settings')\" />\n      <!--\n          Open API Client Button\n\n          Only shown in `modal` layout\n      -->\n      <OpenApiClientButton\n        v-if=\"layout === 'modal' && documentUrl && !hideClientButton\"\n        buttonSource=\"modal\"\n        class=\"!w-fit lg:-mr-1\"\n        :integration=\"integration ?? null\"\n        :source=\"source ?? 'api-reference'\"\n        :url=\"documentUrl\" />\n\n      <!--\n          Close Button\n\n          Only shown in `modal` layout and hidden for GitBook Integration\n      -->\n      <button\n        v-if=\"layout === 'modal' && source !== 'gitbook'\"\n        class=\"app-exit-button zoomed:static zoomed:p-1 fixed top-2 right-2 rounded-full p-2\"\n        type=\"button\"\n        @click=\"eventBus.emit('ui:close:client-modal')\">\n        <ScalarIcon\n          icon=\"Close\"\n          size=\"lg\"\n          thickness=\"2\" />\n        <span class=\"sr-only\">Close Client</span>\n      </button>\n\n      <!--\n          Close Button for GitBook Integration\n\n          Hidden by default and visible for GitBook Integration in `modal` layout\n      -->\n      <button\n        v-if=\"layout === 'modal' && source === 'gitbook'\"\n        class=\"text-c-1 hover:bg-b-2 active:text-c-1 -mr-1.5 rounded p-2\"\n        type=\"button\"\n        @click=\"eventBus.emit('ui:close:client-modal')\">\n        <ScalarIcon\n          icon=\"Close\"\n          size=\"md\"\n          thickness=\"1.75\" />\n        <span class=\"sr-only\">Close Client</span>\n      </button>\n    </div>\n  </div>\n</template>\n<style scoped>\n.app-exit-button {\n  color: white;\n  background: rgba(0, 0, 0, 0.1);\n}\n.app-exit-button:hover {\n  background: rgba(255, 255, 255, 0.1);\n}\n</style>\n"],"mappings":""}

package/dist/v2/blocks/operation-block/components/Header.vue.script.js

@@ -18,6 +18,8 @@ var Header_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineC
 			default: false
 		},
 		integration: {},
+		documentSlug: {},
+		exampleKey: {},
 		documentUrl: {},
 		source: {},
 		server: {},
@@ -51,9 +53,11 @@ var Header_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineC
 				_cache[8] || (_cache[8] = createElementVNode("div", { class: "mb-2 flex w-1/2 flex-row items-center gap-1 lg:mb-0 lg:flex-1 lg:px-1" }, [createElementVNode("div", { class: "size-8" })], -1)),
 				createVNode(unref(AddressBar_default), {
 					activeEnvironment: __props.activeEnvironment,
+					documentSlug: __props.documentSlug,
 					environment: __props.environment,
 					environments: __props.environments,
 					eventBus: __props.eventBus,
+					exampleKey: __props.exampleKey,
 					history: __props.history,
 					layout: __props.layout,
 					method: __props.method,
@@ -66,9 +70,11 @@ var Header_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineC
 					"onSelect:history:item": _cache[2] || (_cache[2] = (payload) => emit("select:history:item", payload))
 				}, null, 8, [
 					"activeEnvironment",
+					"documentSlug",
 					"environment",
 					"environments",
 					"eventBus",
+					"exampleKey",
 					"history",
 					"layout",
 					"method",

package/dist/v2/blocks/operation-block/components/Header.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/operation-block/components/Header.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n  Operation block header: address bar, environment selector, and modal controls.\n\n  Renders the top bar for the API client operation view: URL/method (AddressBar),\n  optional environment selector, optional \"Open API Client\" button in modal layout,\n  and close button for modal. Layout and visibility depend on `layout` and `source` props.\n */\nexport type HeaderProps = {\n  /** Current request path */\n  path: string\n  /** Current request method */\n  method: HttpMethod\n  /** Client layout */\n  layout: ClientLayout\n  /** Hides the client button on the header */\n  hideClientButton?: boolean\n  /** Client integration  */\n  integration?: string | null\n  /** Openapi document url for `modal` mode to open the client app */\n  documentUrl?: string\n  /** Client source */\n  source?: 'gitbook' | 'api-reference'\n  /** Currently selected server */\n  server: ServerObject | null\n  /** Server list available for operation/document */\n  servers: ServerObject[]\n  /** List of request history */\n  history: History[]\n  /** Event bus */\n  eventBus: WorkspaceEventBus\n  /** Environment list */\n  environments?: string[]\n  /** Currently selected environment */\n  activeEnvironment?: string\n  /** Environment variables */\n  environment: XScalarEnvironment\n  /** Meta information for the server */\n  serverMeta: ServerMeta\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ScalarIcon, ScalarIconButton } from '@scalar/components'\nimport type { HttpMethod } from '@scalar/helpers/http/http-methods'\nimport { ScalarIconGearSix } from '@scalar/icons'\nimport type {\n  ServerMeta,\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'\n\nimport { AddressBar, type History } from '@/v2/blocks/scalar-address-bar-block'\nimport EnvironmentSelector from '@/v2/blocks/scalar-address-bar-block/components/EnvironmentSelector.vue'\nimport type { ClientLayout } from '@/v2/types/layout'\n\nimport OpenApiClientButton from './OpenApiClientButton.vue'\n\nconst { hideClientButton = false, eventBus } = defineProps<HeaderProps>()\n\nconst emit = defineEmits<{\n  /** Execute the current operation example */\n  (e: 'execute'): void\n  /** Select a request history item by index */\n  (e: 'select:history:item', payload: { index: number }): void\n  /** Add a new environment */\n  (e: 'add:environment'): void\n  /** Navigate to the settings page for the current entity */\n  (e: 'navigate:settings'): void\n}>()\n\nconst handleSelectEnvironment = (environmentName: string) => {\n  eventBus.emit('workspace:update:active-environment', environmentName)\n}\n\nconst handleAddEnvironment = () => {\n  eventBus.emit('ui:navigate', { page: 'document', path: 'environment' })\n}\n</script>\n\n<template>\n  <div\n    class=\"lg:min-h-header t-app__top-container flex w-full flex-wrap items-center justify-center p-2 pt-2 lg:p-1 lg:pt-1\">\n    <div\n      class=\"mb-2 flex w-1/2 flex-row items-center gap-1 lg:mb-0 lg:flex-1 lg:px-1\">\n      <!--\n          Holds space for the sidebar toggle\n\n          Hidden for `modal` layout\n      -->\n      <div class=\"size-8\"></div>\n    </div>\n    <AddressBar\n      :activeEnvironment\n      :environment\n      :environments\n      :eventBus\n      :history\n      :layout\n      :method\n      :path\n      :server\n      :serverMeta\n      :servers\n      @add:environment=\"emit('add:environment')\"\n      @execute=\"emit('execute')\"\n      @select:history:item=\"\n        (payload) => emit('select:history:item', payload)\n      \" />\n\n    <div\n      class=\"mb-2 flex w-1/2 flex-row items-center justify-end gap-2 lg:mb-0 lg:flex-1 lg:px-2.5\">\n      <!--\n        Environment Selector\n        Hidden for `modal` layout\n      -->\n      <EnvironmentSelector\n        v-if=\"layout !== 'modal'\"\n        :activeEnvironment=\"activeEnvironment\"\n        :environments=\"environments\"\n        @add:environment=\"handleAddEnvironment\"\n        @select:environment=\"handleSelectEnvironment\" />\n      <!-- Operation settings -->\n      <ScalarIconButton\n        v-if=\"layout !== 'modal'\"\n        :icon=\"ScalarIconGearSix\"\n        label=\"Operation settings\"\n        size=\"sm\"\n        weight=\"bold\"\n        @click=\"emit('navigate:settings')\" />\n      <!--\n          Open API Client Button\n\n          Only shown in `modal` layout\n      -->\n      <OpenApiClientButton\n        v-if=\"layout === 'modal' && documentUrl && !hideClientButton\"\n        buttonSource=\"modal\"\n        class=\"!w-fit lg:-mr-1\"\n        :integration=\"integration ?? null\"\n        :source=\"source ?? 'api-reference'\"\n        :url=\"documentUrl\" />\n\n      <!--\n          Close Button\n\n          Only shown in `modal` layout and hidden for GitBook Integration\n      -->\n      <button\n        v-if=\"layout === 'modal' && source !== 'gitbook'\"\n        class=\"app-exit-button zoomed:static zoomed:p-1 fixed top-2 right-2 rounded-full p-2\"\n        type=\"button\"\n        @click=\"eventBus.emit('ui:close:client-modal')\">\n        <ScalarIcon\n          icon=\"Close\"\n          size=\"lg\"\n          thickness=\"2\" />\n        <span class=\"sr-only\">Close Client</span>\n      </button>\n\n      <!--\n          Close Button for GitBook Integration\n\n          Hidden by default and visible for GitBook Integration in `modal` layout\n      -->\n      <button\n        v-if=\"layout === 'modal' && source === 'gitbook'\"\n        class=\"text-c-1 hover:bg-b-2 active:text-c-1 -mr-1.5 rounded p-2\"\n        type=\"button\"\n        @click=\"eventBus.emit('ui:close:client-modal')\">\n        <ScalarIcon\n          icon=\"Close\"\n          size=\"md\"\n          thickness=\"1.75\" />\n        <span class=\"sr-only\">Close Client</span>\n      </button>\n    </div>\n  </div>\n</template>\n<style scoped>\n.app-exit-button {\n  color: white;\n  background: rgba(0, 0, 0, 0.1);\n}\n.app-exit-button:hover {\n  background: rgba(255, 255, 255, 0.1);\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA6DA,MAAM,OAAO;EAWb,MAAM,2BAA2B,oBAA4B;AAC3D,WAAA,SAAS,KAAK,uCAAuC,gBAAe;;EAGtE,MAAM,6BAA6B;AACjC,WAAA,SAAS,KAAK,eAAe;IAAE,MAAM;IAAY,MAAM;IAAe,CAAA;;;uBAKtE,mBAgGM,OAhGN,YAgGM;8BA9FJ,mBAQM,OAAA,EAPJ,OAAM,yEAAuE,EAAA,CAM7E,mBAA0B,OAAA,EAArB,OAAM,UAAQ,CAAA,CAAA,EAAA,GAAA;IAErB,YAgBM,MAAA,mBAAA,EAAA;KAfH,mBAAA,QAAA;KACA,aAAA,QAAA;KACA,cAAA,QAAA;KACA,UAAA,QAAA;KACA,SAAA,QAAA;KACA,QAAA,QAAA;KACA,QAAA,QAAA;KACA,MAAA,QAAA;KACA,QAAA,QAAA;KACA,YAAA,QAAA;KACA,SAAA,QAAA;KACA,qBAAe,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,kBAAA;KACrB,WAAO,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,UAAA;KACb,yBAAmB,OAAA,OAAA,OAAA,MAAY,YAAY,KAAI,uBAAwB,QAAO;;;;;;;;;;;;;;IAIjF,mBAkEM,OAlEN,YAkEM;KA3DI,QAAA,WAAM,WAAA,WAAA,EADd,YAKkD,6BAAA;;MAH/C,mBAAmB,QAAA;MACnB,cAAc,QAAA;MACd,qBAAiB;MACjB,wBAAoB;;KAGf,QAAA,WAAM,WAAA,WAAA,EADd,YAMuC,MAAA,iBAAA,EAAA;;MAJpC,MAAM,MAAA,kBAAiB;MACxB,OAAM;MACN,MAAK;MACL,QAAO;MACN,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,oBAAA;;KAON,QAAA,WAAM,WAAgB,QAAA,eAAW,CAAK,QAAA,oBAAA,WAAA,EAD9C,YAMuB,6BAAA;;MAJrB,cAAa;MACb,OAAM;MACL,aAAa,QAAA,eAAW;MACxB,QAAQ,QAAA,UAAM;MACd,KAAK,QAAA;;;;;;KAQA,QAAA,WAAM,WAAgB,QAAA,WAAM,aAAA,WAAA,EADpC,mBAUS,UAAA;;MARP,OAAM;MACN,MAAK;MACJ,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,QAAA,SAAS,KAAI,wBAAA;SACrB,YAGkB,MAAA,WAAA,EAAA;MAFhB,MAAK;MACL,MAAK;MACL,WAAU;mCACZ,mBAAyC,QAAA,EAAnC,OAAM,WAAS,EAAC,gBAAY,GAAA,EAAA,CAAA,IAAA,mBAAA,IAAA,KAAA;KAS5B,QAAA,WAAM,WAAgB,QAAA,WAAM,aAAA,WAAA,EADpC,mBAUS,UAAA;;MARP,OAAM;MACN,MAAK;MACJ,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,QAAA,SAAS,KAAI,wBAAA;SACrB,YAGqB,MAAA,WAAA,EAAA;MAFnB,MAAK;MACL,MAAK;MACL,WAAU;mCACZ,mBAAyC,QAAA,EAAnC,OAAM,WAAS,EAAC,gBAAY,GAAA,EAAA,CAAA,IAAA,mBAAA,IAAA,KAAA"}
+{"version":3,"file":"Header.vue.script.js","names":[],"sources":["../../../../../src/v2/blocks/operation-block/components/Header.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n  Operation block header: address bar, environment selector, and modal controls.\n\n  Renders the top bar for the API client operation view: URL/method (AddressBar),\n  optional environment selector, optional \"Open API Client\" button in modal layout,\n  and close button for modal. Layout and visibility depend on `layout` and `source` props.\n */\nexport type HeaderProps = {\n  /** Current request path */\n  path: string\n  /** Current request method */\n  method: HttpMethod\n  /** Client layout */\n  layout: ClientLayout\n  /** Hides the client button on the header */\n  hideClientButton?: boolean\n  /** Client integration  */\n  integration?: string | null\n  /** Openapi document slug */\n  documentSlug: string\n  /** Currently selected example key for the current operation */\n  exampleKey: string\n  /** Openapi document url for `modal` mode to open the client app */\n  documentUrl?: string\n  /** Client source */\n  source?: 'gitbook' | 'api-reference'\n  /** Currently selected server */\n  server: ServerObject | null\n  /** Server list available for operation/document */\n  servers: ServerObject[]\n  /** List of request history */\n  history: History[]\n  /** Event bus */\n  eventBus: WorkspaceEventBus\n  /** Environment list */\n  environments?: string[]\n  /** Currently selected environment */\n  activeEnvironment?: string\n  /** Environment variables */\n  environment: XScalarEnvironment\n  /** Meta information for the server */\n  serverMeta: ServerMeta\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ScalarIcon, ScalarIconButton } from '@scalar/components'\nimport type { HttpMethod } from '@scalar/helpers/http/http-methods'\nimport { ScalarIconGearSix } from '@scalar/icons'\nimport type {\n  ServerMeta,\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'\n\nimport { AddressBar, type History } from '@/v2/blocks/scalar-address-bar-block'\nimport EnvironmentSelector from '@/v2/blocks/scalar-address-bar-block/components/EnvironmentSelector.vue'\nimport type { ClientLayout } from '@/v2/types/layout'\n\nimport OpenApiClientButton from './OpenApiClientButton.vue'\n\nconst {\n  hideClientButton = false,\n  eventBus,\n  exampleKey,\n  documentSlug,\n} = defineProps<HeaderProps>()\n\nconst emit = defineEmits<{\n  /** Execute the current operation example */\n  (e: 'execute'): void\n  /** Select a request history item by index */\n  (e: 'select:history:item', payload: { index: number }): void\n  /** Add a new environment */\n  (e: 'add:environment'): void\n  /** Navigate to the settings page for the current entity */\n  (e: 'navigate:settings'): void\n}>()\n\nconst handleSelectEnvironment = (environmentName: string) => {\n  eventBus.emit('workspace:update:active-environment', environmentName)\n}\n\nconst handleAddEnvironment = () => {\n  eventBus.emit('ui:navigate', { page: 'document', path: 'environment' })\n}\n</script>\n\n<template>\n  <div\n    class=\"lg:min-h-header t-app__top-container flex w-full flex-wrap items-center justify-center p-2 pt-2 lg:p-1 lg:pt-1\">\n    <div\n      class=\"mb-2 flex w-1/2 flex-row items-center gap-1 lg:mb-0 lg:flex-1 lg:px-1\">\n      <!--\n          Holds space for the sidebar toggle\n\n          Hidden for `modal` layout\n      -->\n      <div class=\"size-8\"></div>\n    </div>\n    <AddressBar\n      :activeEnvironment\n      :documentSlug\n      :environment\n      :environments\n      :eventBus\n      :exampleKey\n      :history\n      :layout\n      :method\n      :path\n      :server\n      :serverMeta\n      :servers\n      @add:environment=\"emit('add:environment')\"\n      @execute=\"emit('execute')\"\n      @select:history:item=\"\n        (payload) => emit('select:history:item', payload)\n      \" />\n\n    <div\n      class=\"mb-2 flex w-1/2 flex-row items-center justify-end gap-2 lg:mb-0 lg:flex-1 lg:px-2.5\">\n      <!--\n        Environment Selector\n        Hidden for `modal` layout\n      -->\n      <EnvironmentSelector\n        v-if=\"layout !== 'modal'\"\n        :activeEnvironment=\"activeEnvironment\"\n        :environments=\"environments\"\n        @add:environment=\"handleAddEnvironment\"\n        @select:environment=\"handleSelectEnvironment\" />\n      <!-- Operation settings -->\n      <ScalarIconButton\n        v-if=\"layout !== 'modal'\"\n        :icon=\"ScalarIconGearSix\"\n        label=\"Operation settings\"\n        size=\"sm\"\n        weight=\"bold\"\n        @click=\"emit('navigate:settings')\" />\n      <!--\n          Open API Client Button\n\n          Only shown in `modal` layout\n      -->\n      <OpenApiClientButton\n        v-if=\"layout === 'modal' && documentUrl && !hideClientButton\"\n        buttonSource=\"modal\"\n        class=\"!w-fit lg:-mr-1\"\n        :integration=\"integration ?? null\"\n        :source=\"source ?? 'api-reference'\"\n        :url=\"documentUrl\" />\n\n      <!--\n          Close Button\n\n          Only shown in `modal` layout and hidden for GitBook Integration\n      -->\n      <button\n        v-if=\"layout === 'modal' && source !== 'gitbook'\"\n        class=\"app-exit-button zoomed:static zoomed:p-1 fixed top-2 right-2 rounded-full p-2\"\n        type=\"button\"\n        @click=\"eventBus.emit('ui:close:client-modal')\">\n        <ScalarIcon\n          icon=\"Close\"\n          size=\"lg\"\n          thickness=\"2\" />\n        <span class=\"sr-only\">Close Client</span>\n      </button>\n\n      <!--\n          Close Button for GitBook Integration\n\n          Hidden by default and visible for GitBook Integration in `modal` layout\n      -->\n      <button\n        v-if=\"layout === 'modal' && source === 'gitbook'\"\n        class=\"text-c-1 hover:bg-b-2 active:text-c-1 -mr-1.5 rounded p-2\"\n        type=\"button\"\n        @click=\"eventBus.emit('ui:close:client-modal')\">\n        <ScalarIcon\n          icon=\"Close\"\n          size=\"md\"\n          thickness=\"1.75\" />\n        <span class=\"sr-only\">Close Client</span>\n      </button>\n    </div>\n  </div>\n</template>\n<style scoped>\n.app-exit-button {\n  color: white;\n  background: rgba(0, 0, 0, 0.1);\n}\n.app-exit-button:hover {\n  background: rgba(255, 255, 255, 0.1);\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsEA,MAAM,OAAO;EAWb,MAAM,2BAA2B,oBAA4B;AAC3D,WAAA,SAAS,KAAK,uCAAuC,gBAAe;;EAGtE,MAAM,6BAA6B;AACjC,WAAA,SAAS,KAAK,eAAe;IAAE,MAAM;IAAY,MAAM;IAAe,CAAA;;;uBAKtE,mBAkGM,OAlGN,YAkGM;8BAhGJ,mBAQM,OAAA,EAPJ,OAAM,yEAAuE,EAAA,CAM7E,mBAA0B,OAAA,EAArB,OAAM,UAAQ,CAAA,CAAA,EAAA,GAAA;IAErB,YAkBM,MAAA,mBAAA,EAAA;KAjBH,mBAAA,QAAA;KACA,cAAA,QAAA;KACA,aAAA,QAAA;KACA,cAAA,QAAA;KACA,UAAA,QAAA;KACA,YAAA,QAAA;KACA,SAAA,QAAA;KACA,QAAA,QAAA;KACA,QAAA,QAAA;KACA,MAAA,QAAA;KACA,QAAA,QAAA;KACA,YAAA,QAAA;KACA,SAAA,QAAA;KACA,qBAAe,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,kBAAA;KACrB,WAAO,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,UAAA;KACb,yBAAmB,OAAA,OAAA,OAAA,MAAY,YAAY,KAAI,uBAAwB,QAAO;;;;;;;;;;;;;;;;IAIjF,mBAkEM,OAlEN,YAkEM;KA3DI,QAAA,WAAM,WAAA,WAAA,EADd,YAKkD,6BAAA;;MAH/C,mBAAmB,QAAA;MACnB,cAAc,QAAA;MACd,qBAAiB;MACjB,wBAAoB;;KAGf,QAAA,WAAM,WAAA,WAAA,EADd,YAMuC,MAAA,iBAAA,EAAA;;MAJpC,MAAM,MAAA,kBAAiB;MACxB,OAAM;MACN,MAAK;MACL,QAAO;MACN,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,oBAAA;;KAON,QAAA,WAAM,WAAgB,QAAA,eAAW,CAAK,QAAA,oBAAA,WAAA,EAD9C,YAMuB,6BAAA;;MAJrB,cAAa;MACb,OAAM;MACL,aAAa,QAAA,eAAW;MACxB,QAAQ,QAAA,UAAM;MACd,KAAK,QAAA;;;;;;KAQA,QAAA,WAAM,WAAgB,QAAA,WAAM,aAAA,WAAA,EADpC,mBAUS,UAAA;;MARP,OAAM;MACN,MAAK;MACJ,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,QAAA,SAAS,KAAI,wBAAA;SACrB,YAGkB,MAAA,WAAA,EAAA;MAFhB,MAAK;MACL,MAAK;MACL,WAAU;mCACZ,mBAAyC,QAAA,EAAnC,OAAM,WAAS,EAAC,gBAAY,GAAA,EAAA,CAAA,IAAA,mBAAA,IAAA,KAAA;KAS5B,QAAA,WAAM,WAAgB,QAAA,WAAM,aAAA,WAAA,EADpC,mBAUS,UAAA;;MARP,OAAM;MACN,MAAK;MACJ,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,QAAA,SAAS,KAAI,wBAAA;SACrB,YAGqB,MAAA,WAAA,EAAA;MAFnB,MAAK;MACL,MAAK;MACL,WAAU;mCACZ,mBAAyC,QAAA,EAAnC,OAAM,WAAS,EAAC,gBAAY,GAAA,EAAA,CAAA,IAAA,mBAAA,IAAA,KAAA"}

package/dist/v2/blocks/operation-block/helpers/response-cache.d.ts

@@ -17,9 +17,10 @@ export declare const responseCache: Map<string, {
  * @param method - HTTP method (e.g., "GET", "POST")
  * @param path - The request path (e.g., "/pets")
  * @param exampleKey - A unique key identifying the example/request variant
+ * @param documentSlug - Optionally add the document slug to the key
  * @returns The constructed cache key string
  */
-export declare function getOperationExampleKey(method: string, path: string, exampleKey: string): string;
+export declare function getOperationExampleKey(method: string, path: string, exampleKey: string, documentSlug?: string): string;
 /**
  * Determines if a response is a streaming response (e.g., server-sent events).
  * Assumes streaming responses include a 'reader' property.

package/dist/v2/blocks/operation-block/helpers/response-cache.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"response-cache.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/operation-block/helpers/response-cache.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,yCAAyC,CAAA;AAE7E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kDAAkD,CAAA;AAExF;;;;GAIG;AACH,eAAO,MAAM,aAAa;cAA+B,gBAAgB;oBAAkB,cAAc;EAAK,CAAA;AAE9G;;;;;;;;;GASG;AACH,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,GAAG,MAAM,CAE/F;AAED;;;;;;GAMG;AACH,wBAAgB,mBAAmB,CAAC,QAAQ,EAAE,gBAAgB,GAAG,OAAO,CAEvE"}
+{"version":3,"file":"response-cache.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/operation-block/helpers/response-cache.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,yCAAyC,CAAA;AAE7E,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kDAAkD,CAAA;AAExF;;;;GAIG;AACH,eAAO,MAAM,aAAa;cAA+B,gBAAgB;oBAAkB,cAAc;EAAK,CAAA;AAE9G;;;;;;;;;;GAUG;AACH,wBAAgB,sBAAsB,CACpC,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,MAAM,EACZ,UAAU,EAAE,MAAM,EAClB,YAAY,CAAC,EAAE,MAAM,GACpB,MAAM,CAER;AAED;;;;;;GAMG;AACH,wBAAgB,mBAAmB,CAAC,QAAQ,EAAE,gBAAgB,GAAG,OAAO,CAEvE"}

package/dist/v2/blocks/operation-block/helpers/response-cache.js

@@ -1,3 +1,4 @@
+import { isDefined } from "@scalar/helpers/array/is-defined";
 //#region src/v2/blocks/operation-block/helpers/response-cache.ts
 /**
 * In-memory cache of operation example id → { response, request }.
@@ -13,10 +14,16 @@ var responseCache = /* @__PURE__ */ new Map();
 * @param method - HTTP method (e.g., "GET", "POST")
 * @param path - The request path (e.g., "/pets")
 * @param exampleKey - A unique key identifying the example/request variant
+* @param documentSlug - Optionally add the document slug to the key
 * @returns The constructed cache key string
 */
-function getOperationExampleKey(method, path, exampleKey) {
-	return `${method}|${path}|${exampleKey}`;
+function getOperationExampleKey(method, path, exampleKey, documentSlug) {
+	return [
+		documentSlug,
+		method,
+		path,
+		exampleKey
+	].filter(isDefined).join("|");
 }
 /**
 * Determines if a response is a streaming response (e.g., server-sent events).

package/dist/v2/blocks/operation-block/helpers/response-cache.js.map

@@ -1 +1 @@
-{"version":3,"file":"response-cache.js","names":[],"sources":["../../../../../src/v2/blocks/operation-block/helpers/response-cache.ts"],"sourcesContent":["import type { RequestPayload } from '@scalar/workspace-store/request-example'\n\nimport type { ResponseInstance } from '@/v2/blocks/operation-block/helpers/send-request'\n\n/**\n * In-memory cache of operation example id → { response, request }.\n * Restores the last response when navigating back to an operation until\n * the user refreshes the page or makes a new request.\n */\nexport const responseCache = new Map<string, { response: ResponseInstance; requestPayload: RequestPayload }>()\n\n/**\n * Constructs a unique cache key for a specific operation/example.\n * The key is composed of the HTTP method, request path, and the example key,\n * delimited by \"|\", e.g. \"GET|/pets|123\".\n *\n * @param method - HTTP method (e.g., \"GET\", \"POST\")\n * @param path - The request path (e.g., \"/pets\")\n * @param exampleKey - A unique key identifying the example/request variant\n * @returns The constructed cache key string\n */\nexport function getOperationExampleKey(method: string, path: string, exampleKey: string): string {\n  return `${method}|${path}|${exampleKey}`\n}\n\n/**\n * Determines if a response is a streaming response (e.g., server-sent events).\n * Assumes streaming responses include a 'reader' property.\n *\n * @param response - The response instance to check\n * @returns True if response is streaming, otherwise false\n */\nexport function isStreamingResponse(response: ResponseInstance): boolean {\n  return 'reader' in response\n}\n"],"mappings":";;;;;;AASA,IAAa,gCAAgB,IAAI,KAA6E;;;;;;;;;;;AAY9G,SAAgB,uBAAuB,QAAgB,MAAc,YAA4B;AAC/F,QAAO,GAAG,OAAO,GAAG,KAAK,GAAG;;;;;;;;;AAU9B,SAAgB,oBAAoB,UAAqC;AACvE,QAAO,YAAY"}
+{"version":3,"file":"response-cache.js","names":[],"sources":["../../../../../src/v2/blocks/operation-block/helpers/response-cache.ts"],"sourcesContent":["import { isDefined } from '@scalar/helpers/array/is-defined'\nimport type { RequestPayload } from '@scalar/workspace-store/request-example'\n\nimport type { ResponseInstance } from '@/v2/blocks/operation-block/helpers/send-request'\n\n/**\n * In-memory cache of operation example id → { response, request }.\n * Restores the last response when navigating back to an operation until\n * the user refreshes the page or makes a new request.\n */\nexport const responseCache = new Map<string, { response: ResponseInstance; requestPayload: RequestPayload }>()\n\n/**\n * Constructs a unique cache key for a specific operation/example.\n * The key is composed of the HTTP method, request path, and the example key,\n * delimited by \"|\", e.g. \"GET|/pets|123\".\n *\n * @param method - HTTP method (e.g., \"GET\", \"POST\")\n * @param path - The request path (e.g., \"/pets\")\n * @param exampleKey - A unique key identifying the example/request variant\n * @param documentSlug - Optionally add the document slug to the key\n * @returns The constructed cache key string\n */\nexport function getOperationExampleKey(\n  method: string,\n  path: string,\n  exampleKey: string,\n  documentSlug?: string,\n): string {\n  return [documentSlug, method, path, exampleKey].filter(isDefined).join('|')\n}\n\n/**\n * Determines if a response is a streaming response (e.g., server-sent events).\n * Assumes streaming responses include a 'reader' property.\n *\n * @param response - The response instance to check\n * @returns True if response is streaming, otherwise false\n */\nexport function isStreamingResponse(response: ResponseInstance): boolean {\n  return 'reader' in response\n}\n"],"mappings":";;;;;;;AAUA,IAAa,gCAAgB,IAAI,KAA6E;;;;;;;;;;;;AAa9G,SAAgB,uBACd,QACA,MACA,YACA,cACQ;AACR,QAAO;EAAC;EAAc;EAAQ;EAAM;EAAW,CAAC,OAAO,UAAU,CAAC,KAAK,IAAI;;;;;;;;;AAU7E,SAAgB,oBAAoB,UAAqC;AACvE,QAAO,YAAY"}

package/dist/v2/blocks/request-block/components/RequestTable.vue.d.ts

@@ -13,7 +13,7 @@ type __VLS_Props = {
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     navigate: (route: NonNullable<({
         replace?: boolean;
-        namespace?: string;
+        teamSlug?: string;
         workspaceSlug?: string;
         callback?: (status: "success" | "error") => void;
     } & ({
@@ -47,7 +47,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onNavigate?: ((route: NonNullable<({
         replace?: boolean;
-        namespace?: string;
+        teamSlug?: string;
         workspaceSlug?: string;
         callback?: (status: "success" | "error") => void;
     } & ({

package/dist/v2/blocks/request-block/components/RequestTableRow.vue.d.ts

@@ -37,7 +37,7 @@ type __VLS_Props = {
 declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     navigate: (route: NonNullable<({
         replace?: boolean;
-        namespace?: string;
+        teamSlug?: string;
         workspaceSlug?: string;
         callback?: (status: "success" | "error") => void;
     } & ({
@@ -71,7 +71,7 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {
 }, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
     onNavigate?: ((route: NonNullable<({
         replace?: boolean;
-        namespace?: string;
+        teamSlug?: string;
         workspaceSlug?: string;
         callback?: (status: "success" | "error") => void;
     } & ({

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

@@ -16,6 +16,10 @@ export type AddressBarProps = {
     path: string;
     /** Current request method */
     method: HttpMethodType;
+    /** Openapi document slug */
+    documentSlug: string;
+    /** Currently selected example key for the current operation */
+    exampleKey: string;
     /** Currently selected server */
     server: ServerObject | null;
     /** Server list available for operation/document */

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

@@ -1 +1 @@
-{"version":3,"file":"AddressBar.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/scalar-address-bar-block/components/AddressBar.vue"],"names":[],"mappings":"AAumBA,OAAO,KAAK,EAAE,UAAU,IAAI,cAAc,EAAE,MAAM,mCAAmC,CAAA;AAMrF,OAAO,KAAK,EAEV,UAAU,EACV,iBAAiB,EAClB,MAAM,gCAAgC,CAAA;AAKvC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2EAA2E,CAAA;AACnH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,8DAA8D,CAAA;AAehG,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAErD,OAA0B,EAAE,KAAK,OAAO,EAAE,MAAM,yBAAyB,CAAA;AAGzE;;;;GAIG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAKzC,MAAM,MAAM,eAAe,GAAG;IAC5B,2BAA2B;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ,6BAA6B;IAC7B,MAAM,EAAE,cAAc,CAAA;IACtB,gCAAgC;IAChC,MAAM,EAAE,YAAY,GAAG,IAAI,CAAA;IAC3B,mDAAmD;IACnD,OAAO,EAAE,YAAY,EAAE,CAAA;IACvB,8BAA8B;IAC9B,OAAO,EAAE,OAAO,EAAE,CAAA;IAClB,oBAAoB;IACpB,MAAM,EAAE,YAAY,CAAA;IACpB,gBAAgB;IAChB,QAAQ,EAAE,iBAAiB,CAAA;IAC3B,kBAAkB;IAClB,WAAW,EAAE,kBAAkB,CAAA;IAC/B,sCAAsC;IACtC,UAAU,EAAE,UAAU,CAAA;CACvB,CAAA;AACD,QAAA,MAAM,YAAY;;;;;;eAmB6B,MAAM;;;;;eAAN,MAAM;;kFA2wBjD,CAAC"}
+{"version":3,"file":"AddressBar.vue.d.ts","sourceRoot":"","sources":["../../../../../src/v2/blocks/scalar-address-bar-block/components/AddressBar.vue"],"names":[],"mappings":"AAkpBA,OAAO,KAAK,EAAE,UAAU,IAAI,cAAc,EAAE,MAAM,mCAAmC,CAAA;AAMrF,OAAO,KAAK,EAEV,UAAU,EACV,iBAAiB,EAClB,MAAM,gCAAgC,CAAA;AAKvC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2EAA2E,CAAA;AACnH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,8DAA8D,CAAA;AAoBhG,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAErD,OAA0B,EAAE,KAAK,OAAO,EAAE,MAAM,yBAAyB,CAAA;AAGzE;;;;GAIG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAKzC,MAAM,MAAM,eAAe,GAAG;IAC5B,2BAA2B;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ,6BAA6B;IAC7B,MAAM,EAAE,cAAc,CAAA;IACtB,4BAA4B;IAC5B,YAAY,EAAE,MAAM,CAAA;IACpB,+DAA+D;IAC/D,UAAU,EAAE,MAAM,CAAA;IAClB,gCAAgC;IAChC,MAAM,EAAE,YAAY,GAAG,IAAI,CAAA;IAC3B,mDAAmD;IACnD,OAAO,EAAE,YAAY,EAAE,CAAA;IACvB,8BAA8B;IAC9B,OAAO,EAAE,OAAO,EAAE,CAAA;IAClB,oBAAoB;IACpB,MAAM,EAAE,YAAY,CAAA;IACpB,gBAAgB;IAChB,QAAQ,EAAE,iBAAiB,CAAA;IAC3B,kBAAkB;IAClB,WAAW,EAAE,kBAAkB,CAAA;IAC/B,sCAAsC;IACtC,UAAU,EAAE,UAAU,CAAA;CACvB,CAAA;AACD,QAAA,MAAM,YAAY;;;;;;eAoB6B,MAAM;;;;;eAAN,MAAM;;kFA6yBjD,CAAC"}

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

@@ -2,7 +2,7 @@ import _plugin_vue_export_helper_default from "../../../../_virtual/_plugin-vue_
 import AddressBar_vue_vue_type_script_setup_true_lang_default from "./AddressBar.vue.script.js";
 /* empty css                         */
 //#region src/v2/blocks/scalar-address-bar-block/components/AddressBar.vue
-var AddressBar_default = /* @__PURE__ */ _plugin_vue_export_helper_default(AddressBar_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-bc1b7459"]]);
+var AddressBar_default = /* @__PURE__ */ _plugin_vue_export_helper_default(AddressBar_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-dc314812"]]);
 //#endregion
 export { AddressBar_default as default };
 

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

@@ -1 +1 @@
-{"version":3,"file":"AddressBar.vue.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-address-bar-block/components/AddressBar.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * AddressBar component\n * This component is used to display the address bar for the operation block\n * It is used to display the path, method, server, and history for the operation\n */\nexport default {\n  name: 'AddressBar',\n}\nexport type AddressBarProps = {\n  /** Current request path */\n  path: string\n  /** Current request method */\n  method: HttpMethodType\n  /** Currently selected server */\n  server: ServerObject | null\n  /** Server list available for operation/document */\n  servers: ServerObject[]\n  /** List of request history */\n  history: History[]\n  /** Client layout */\n  layout: ClientLayout\n  /** Event bus */\n  eventBus: WorkspaceEventBus\n  /** Environment */\n  environment: XScalarEnvironment\n  /** Meta information for the server */\n  serverMeta: ServerMeta\n}\n</script>\n<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarIcon,\n  ScalarWrappingText,\n} from '@scalar/components'\nimport { getSelector } from '@scalar/helpers/dom/get-selector'\nimport { REQUEST_METHODS } from '@scalar/helpers/http/http-info'\nimport type { HttpMethod as HttpMethodType } from '@scalar/helpers/http/http-methods'\nimport { replaceEnvVariables } from '@scalar/helpers/regex/replace-variables'\nimport { extractServerFromPath } from '@scalar/helpers/url/extract-server-from-path'\nimport { ScalarIconCopy, ScalarIconWarningCircle } from '@scalar/icons'\nimport { EditorView } from '@scalar/use-codemirror'\nimport { useClipboard } from '@scalar/use-hooks/useClipboard'\nimport type {\n  ApiReferenceEvents,\n  ServerMeta,\n  WorkspaceEventBus,\n} from '@scalar/workspace-store/events'\nimport {\n  getEnvironmentVariables,\n  getResolvedUrl,\n} from '@scalar/workspace-store/request-example'\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 {\n  computed,\n  onBeforeUnmount,\n  onMounted,\n  ref,\n  useId,\n  useTemplateRef,\n  watch,\n} from 'vue'\n\nimport { HttpMethod } from '@/components/HttpMethod'\nimport { useLoadingAnimation } from '@/v2/blocks/scalar-address-bar-block/hooks/use-loading-animation'\nimport { CodeInput } from '@/v2/components/code-input'\nimport { ServerDropdown } from '@/v2/components/server'\nimport type { ClientLayout } from '@/v2/types/layout'\n\nimport AddressBarHistory, { type History } from './AddressBarHistory.vue'\n\nconst {\n  path,\n  method,\n  layout,\n  eventBus,\n  history,\n  server,\n  servers,\n  environment,\n  serverMeta,\n} = defineProps<AddressBarProps>()\n\nconst emit = defineEmits<{\n  /** Execute the current operation example */\n  (e: 'execute'): void\n  /** Select a request history item by index */\n  (e: 'select:history:item', payload: { index: number }): void\n}>()\n\nconst id = useId()\nconst { percentage, startLoading, stopLoading, isLoading } =\n  useLoadingAnimation()\n\n/** Calculate the style for the address bar */\nconst style = computed(() => ({\n  backgroundColor: `color-mix(in srgb, transparent 90%, ${REQUEST_METHODS[method].colorVar})`,\n  transform: `translate3d(-${percentage.value}%,0,0)`,\n}))\n\n/** Keeps the cursor visible past the fade-right overlay while typing */\nconst addressBarScrollMargins = EditorView.scrollMargins.of(() => ({\n  right: 24,\n}))\n\nconst pathConflict = ref<string | null>(null)\nconst methodConflict = ref<HttpMethodType | null>(null)\n\n/** Whether there is a path or method conflict */\nconst hasConflict = computed(() => methodConflict.value || pathConflict.value)\n\n/** Clear conflict state when switching to a different operation */\nwatch(\n  () => [path, method],\n  () => {\n    pathConflict.value = null\n    methodConflict.value = null\n  },\n)\n\n/** Check if the path contains a server URL, extract it, and select or add the server */\nconst checkForServer = (targetPath: string) => {\n  const extracted = extractServerFromPath(targetPath)\n  if (!extracted) {\n    return targetPath\n  }\n\n  const [url, newPath] = extracted\n\n  // Server is already selected — nothing to change\n  if (url === server?.url) {\n    return newPath\n  }\n\n  const matchingServer = servers.find((s) => s.url === url)\n\n  // Select the server if it already exists in the list\n  if (matchingServer) {\n    eventBus.emit('server:update:selected', {\n      url,\n      meta: serverMeta,\n    })\n  }\n  // Otherwise add it as a new operation-level server\n  else {\n    eventBus.emit('server:add:server', {\n      url,\n      select: true,\n      meta: {\n        type: 'operation',\n        path,\n        method,\n      },\n    })\n  }\n\n  return newPath\n}\n\n/** Emit the path/method update event with conflict handling */\nconst emitPathMethodUpdate = (\n  targetMethod: HttpMethodType,\n  targetPath: string,\n  blurTargetSelector: string | null = null,\n): void => {\n  const newPath = checkForServer(targetPath)\n  const normalizedPath = newPath.startsWith('/') ? newPath : `/${newPath}`\n\n  // Update the local state of codemirror so we don't have werid path on conflict\n  addressBarRef.value?.setCodeMirrorContent(normalizedPath)\n\n  eventBus.emit('operation:update:pathMethod', {\n    meta: { method, path },\n    blurTargetSelector,\n    payload: { method: targetMethod, path: normalizedPath },\n    callback: (status, blurTargetSelector) => {\n      // Clear conflicts if the operation was successful or no change was made\n      if (status === 'success' || status === 'no-change') {\n        methodConflict.value = null\n        pathConflict.value = null\n      }\n      // Otherwise set the conflict if needed\n      else if (status === 'conflict') {\n        if (targetMethod !== method) {\n          methodConflict.value = targetMethod\n        }\n        if (normalizedPath !== path) {\n          pathConflict.value = normalizedPath\n        }\n      }\n\n      // Edge case: pasting a full URL extracts the server but leaves the path unchanged.\n      // The CodeMirror DOM still shows the full URL, so we force it back to just the path.\n      if (\n        status === 'no-change' &&\n        addressBarRef.value?.codeMirrorRef?.textContent &&\n        addressBarRef.value.codeMirrorRef.textContent !== newPath\n      ) {\n        addressBarRef.value.setCodeMirrorContent(newPath)\n      }\n\n      // Re-trigger the click or focus event if we have a blur target selector\n      if (blurTargetSelector) {\n        const element = document.querySelector(blurTargetSelector)\n\n        // Re-trigger clicks on buttons\n        if (element instanceof HTMLButtonElement) {\n          element.click()\n        }\n\n        // Re-trigger focus on inputs and codeInputs\n        else if (\n          element instanceof HTMLInputElement ||\n          element instanceof HTMLTextAreaElement ||\n          (element instanceof HTMLElement &&\n            element.getAttribute('contenteditable') === 'true')\n        ) {\n          element.focus()\n        }\n      }\n    },\n  })\n}\n\n/** Update the operation's HTTP method, handling conflicts */\nconst handleMethodChange = (newMethod: HttpMethodType): void =>\n  emitPathMethodUpdate(newMethod, pathConflict.value ?? path)\n\n/**\n * Update the operation's path, handling conflicts also we extract the blur target selector to re-trigger click events\n *\n * We have special handling for the tab key to prevent it from triggering a click on the focused button\n */\nconst handlePathBlur = (newPath: string, event: FocusEvent): void => {\n  const relatedTarget = event.relatedTarget as Element | null\n  const blurTargetSelector = tabbedOut.value ? null : getSelector(relatedTarget)\n\n  tabbedOut.value = false\n\n  emitPathMethodUpdate(\n    methodConflict.value ?? method,\n    newPath,\n    blurTargetSelector,\n  )\n}\n\n/** Lets unset the server when backspace is pressed and the path is empty */\nconst handlePathBackspace = (event: KeyboardEvent): void => {\n  if ((event.target as HTMLElement)?.innerText === '\\n') {\n    eventBus.emit('server:update:selected', {\n      url: '',\n      meta: serverMeta,\n    })\n  }\n}\n\n/** Handle path submit (Enter key) — saves the path and triggers execution via blurTargetSelector */\nconst handlePathSubmit = (\n  newPath: string,\n  event: KeyboardEvent | FocusEvent,\n): void => {\n  // Prevent the global hotkey listener\n  event.stopPropagation()\n\n  emitPathMethodUpdate(\n    methodConflict.value ?? method,\n    newPath,\n    '[data-addressbar-action=\"send\"]',\n  )\n}\n\n/** Handle focus events */\nconst sendButtonRef = useTemplateRef('sendButtonRef')\nconst addressBarRef = useTemplateRef('addressBarRef')\nconst tabbedOut = ref(false)\nconst handleFocusSendButton = () => sendButtonRef.value?.$el?.focus()\n\nconst handleFocusAddressBar = (\n  payload: ApiReferenceEvents['ui:focus:address-bar'],\n) => {\n  // If it already has focus we just propagate native behavior which should focus the browser address bar\n  if (addressBarRef.value?.isFocused && layout !== 'desktop') {\n    return\n  }\n\n  addressBarRef.value?.focus('end')\n\n  if (payload && 'clear' in payload && payload.clear) {\n    addressBarRef.value?.setCodeMirrorContent('/')\n  }\n\n  if (payload && 'event' in payload) {\n    payload.event.preventDefault()\n  }\n}\n\nonMounted(() => {\n  eventBus.on('ui:focus:address-bar', handleFocusAddressBar)\n  eventBus.on('ui:focus:send-button', handleFocusSendButton)\n  eventBus.on('copy-url:address-bar', copyUrl)\n  eventBus.on('hooks:on:request:sent', startLoading)\n  eventBus.on('hooks:on:request:complete', stopLoading)\n})\n\nonBeforeUnmount(() => {\n  eventBus.off('ui:focus:address-bar', handleFocusAddressBar)\n  eventBus.off('ui:focus:send-button', handleFocusSendButton)\n  eventBus.off('copy-url:address-bar', copyUrl)\n  eventBus.off('hooks:on:request:sent', startLoading)\n  eventBus.off('hooks:on:request:complete', stopLoading)\n\n  // Stop the animation when the component is unmounted\n  // This is to prevent the animation from continuing after the component is unmounted\n  stopLoading()\n})\n\nconst { copyToClipboard } = useClipboard()\n\n/** Copy the resolved URL with the environment variables to the clipboard */\nconst copyUrl = async () => {\n  const resolvedUrl = getResolvedUrl({ server, path })\n  const environmentVariables = getEnvironmentVariables(environment)\n  const resolvedUrlWithEnvVars = replaceEnvVariables(\n    resolvedUrl,\n    environmentVariables,\n  )\n  await copyToClipboard(resolvedUrlWithEnvVars)\n}\n\nconst isServerDropdownOpen = ref(false)\nconst isHistoryDropdownOpen = ref(false)\n\n/** Whether either dropdown is open */\nconst isDropdownOpen = computed(\n  () => isServerDropdownOpen.value || isHistoryDropdownOpen.value,\n)\n\nconst navigateToServersPage = () => {\n  if (serverMeta.type === 'operation') {\n    return eventBus.emit('ui:navigate', {\n      page: 'operation',\n      path: 'servers',\n      operationPath: serverMeta.path,\n      method: serverMeta.method,\n    })\n  }\n  return eventBus.emit('ui:navigate', {\n    page: 'document',\n    path: 'servers',\n  })\n}\n\ndefineExpose({\n  methodConflict,\n  pathConflict,\n})\n</script>\n<template>\n  <div\n    :id=\"id\"\n    class=\"scalar-address-bar order-last flex h-(--scalar-address-bar-height) w-full [--scalar-address-bar-height:32px] lg:order-0 lg:w-auto\">\n    <!-- Address Bar -->\n    <div\n      class=\"address-bar-bg-states text-xxs group relative order-last flex w-full max-w-[calc(100dvw-24px)] flex-1 flex-row items-stretch rounded-lg p-0.75 lg:order-none lg:max-w-[580px] lg:min-w-[580px] xl:max-w-[720px] xl:min-w-[720px]\"\n      :class=\"{\n        'outline-c-danger outline': hasConflict,\n        'rounded-b-none': isDropdownOpen,\n      }\">\n      <div\n        class=\"pointer-events-none absolute top-0 left-0 block h-full w-full overflow-hidden rounded-lg border\"\n        :class=\"{\n          'rounded-b-none': isDropdownOpen,\n        }\">\n        <div\n          class=\"absolute top-0 left-0 h-full w-full\"\n          :style />\n      </div>\n      <div class=\"flex gap-1\">\n        <HttpMethod\n          :isEditable=\"layout !== 'modal'\"\n          isSquare\n          :method=\"methodConflict ?? method\"\n          teleport\n          @change=\"handleMethodChange\" />\n      </div>\n\n      <div\n        class=\"scroll-timeline-x scroll-timeline-x-hidden relative flex w-full bg-blend-normal\">\n        <!-- Servers -->\n        <ServerDropdown\n          v-if=\"servers.length\"\n          :layout=\"layout\"\n          :meta=\"serverMeta\"\n          :server=\"server\"\n          :servers=\"servers\"\n          :target=\"id\"\n          @update:open=\"(value) => (isServerDropdownOpen = value)\"\n          @update:selectedServer=\"\n            (payload) => eventBus.emit('server:update:selected', payload)\n          \"\n          @update:servers=\"navigateToServersPage\"\n          @update:variable=\"\n            (payload) => eventBus.emit('server:update:variables', payload)\n          \" />\n\n        <div class=\"fade-left\" />\n        <!-- Path + URL + env vars -->\n        <CodeInput\n          ref=\"addressBarRef\"\n          alwaysEmitChange\n          aria-label=\"Path\"\n          class=\"min-w-fit outline-none\"\n          disableCloseBrackets\n          :disabled=\"layout === 'modal'\"\n          disableEnter\n          disableTabIndent\n          :emitOnBlur=\"false\"\n          :environment=\"environment\"\n          :extensions=\"[addressBarScrollMargins]\"\n          importCurl\n          :layout=\"layout\"\n          :modelValue=\"path\"\n          :placeholder=\"server ? '' : 'Enter a URL'\"\n          server\n          @blur=\"handlePathBlur\"\n          @keydown.delete=\"handlePathBackspace\"\n          @keydown.tab=\"tabbedOut = true\"\n          @submit=\"handlePathSubmit\" />\n        <div class=\"fade-right\" />\n      </div>\n\n      <!-- Copy url button -->\n      <ScalarButton\n        class=\"hover:bg-b-3 mx-1\"\n        size=\"xs\"\n        variant=\"ghost\"\n        @click=\"copyUrl\">\n        <ScalarIconCopy />\n        <span class=\"sr-only\">Copy URL</span>\n      </ScalarButton>\n\n      <AddressBarHistory\n        :history=\"history\"\n        :target=\"id\"\n        @select:history:item=\"(payload) => emit('select:history:item', payload)\"\n        @update:open=\"(value) => (isHistoryDropdownOpen = value)\" />\n      <!-- Error message -->\n      <div\n        v-if=\"hasConflict\"\n        class=\"z-context absolute inset-x-0 top-[calc(100%+4px)] flex flex-col items-center rounded px-6\">\n        <div\n          class=\"text-c-danger bg-b-danger border-c-danger flex items-center gap-1 rounded border p-1\">\n          <ScalarIconWarningCircle size=\"sm\" />\n          <div class=\"min-w-0 flex-1\">\n            A\n            <em>{{ methodConflict?.toUpperCase() ?? method.toUpperCase() }}</em>\n            request to\n            <ScalarWrappingText :text=\"pathConflict ?? path\" />\n            already exists in this document\n          </div>\n        </div>\n      </div>\n\n      <ScalarButton\n        ref=\"sendButtonRef\"\n        class=\"relative h-auto shrink-0 overflow-hidden py-1 pr-2.5 pl-2 font-bold\"\n        data-addressbar-action=\"send\"\n        :disabled=\"isLoading\"\n        @click=\"emit('execute')\">\n        <span\n          aria-hidden=\"true\"\n          class=\"inline-flex items-center gap-1\">\n          <ScalarIcon\n            class=\"relative shrink-0 fill-current\"\n            icon=\"Play\"\n            size=\"xs\" />\n          <span class=\"text-xxs hidden lg:flex\">Send</span>\n        </span>\n        <span class=\"sr-only\">\n          Send {{ method }} request to {{ server?.url ?? '' }}{{ path }}\n        </span>\n      </ScalarButton>\n    </div>\n  </div>\n</template>\n<style scoped>\n:deep(.cm-editor) {\n  height: 100%;\n  outline: none;\n  width: 100%;\n}\n:deep(.cm-line) {\n  padding: 0;\n}\n:deep(.cm-content) {\n  padding: 0;\n  display: flex;\n  align-items: center;\n  font-size: var(--scalar-small);\n}\n.scroll-timeline-x {\n  scroll-timeline: --scroll-timeline x;\n  /* Firefox supports */\n  scroll-timeline: --scroll-timeline horizontal;\n  -ms-overflow-style: none; /* IE and Edge */\n}\n.scroll-timeline-x-hidden {\n  overflow-x: auto;\n}\n.scroll-timeline-x-hidden :deep(.cm-scroller) {\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n  padding-right: 20px;\n  overflow: auto;\n}\n.scroll-timeline-x-hidden::-webkit-scrollbar {\n  width: 0;\n  height: 0;\n  display: none;\n}\n.scroll-timeline-x-hidden :deep(.cm-scroller::-webkit-scrollbar) {\n  width: 0;\n  height: 0;\n  display: none;\n}\n.scroll-timeline-x-address {\n  line-height: 27px;\n  scrollbar-width: none; /* Firefox */\n}\n/* make clickable are to left of send button */\n.scroll-timeline-x-address:after {\n  content: '';\n  position: absolute;\n  height: 100%;\n  width: 24px;\n  right: 0;\n  cursor: text;\n}\n.scroll-timeline-x-address:empty:before {\n  content: 'Enter URL or cURL request';\n  color: var(--scalar-color-3);\n  pointer-events: none;\n}\n.fade-left,\n.fade-right {\n  content: '';\n  position: sticky;\n  height: 100%;\n  animation-name: fadein;\n  animation-duration: 1ms;\n  animation-direction: reverse;\n  animation-timeline: --scroll-timeline;\n  pointer-events: none;\n  z-index: 1;\n}\n.fade-left {\n  background: linear-gradient(\n    -90deg,\n    color-mix(in srgb, var(--scalar-address-bar-bg), transparent 100%) 0%,\n    color-mix(in srgb, var(--scalar-address-bar-bg), transparent 20%) 30%,\n    var(--scalar-address-bar-bg) 100%\n  );\n  left: -1px;\n  min-width: 6px;\n  animation-direction: normal;\n}\n.fade-right {\n  background: linear-gradient(\n    90deg,\n    color-mix(in srgb, var(--scalar-address-bar-bg), transparent 100%) 0%,\n    color-mix(in srgb, var(--scalar-address-bar-bg), transparent 20%) 30%,\n    var(--scalar-address-bar-bg) 100%\n  );\n  right: -1px;\n  min-width: 24px;\n}\n@keyframes fadein {\n  0% {\n    opacity: 0;\n  }\n  1% {\n    opacity: 1;\n  }\n}\n.address-bar-bg-states {\n  --scalar-address-bar-bg: color-mix(\n    in srgb,\n    var(--scalar-background-1),\n    var(--scalar-background-2)\n  );\n  background: var(--scalar-address-bar-bg);\n}\n.address-bar-bg-states:has(.cm-focused) {\n  --scalar-address-bar-bg: var(--scalar-background-1);\n  border-color: var(--scalar-border-color);\n  outline-width: 1px;\n  outline-style: solid;\n}\n.address-bar-bg-states:has(.cm-focused) .fade-left,\n.address-bar-bg-states:has(.cm-focused) .fade-right {\n  --scalar-address-bar-bg: var(--scalar-background-1);\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"AddressBar.vue.js","names":[],"sources":["../../../../../src/v2/blocks/scalar-address-bar-block/components/AddressBar.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * AddressBar component\n * This component is used to display the address bar for the operation block\n * It is used to display the path, method, server, and history for the operation\n */\nexport default {\n  name: 'AddressBar',\n}\nexport type AddressBarProps = {\n  /** Current request path */\n  path: string\n  /** Current request method */\n  method: HttpMethodType\n  /** Openapi document slug */\n  documentSlug: string\n  /** Currently selected example key for the current operation */\n  exampleKey: string\n  /** Currently selected server */\n  server: ServerObject | null\n  /** Server list available for operation/document */\n  servers: ServerObject[]\n  /** List of request history */\n  history: History[]\n  /** Client layout */\n  layout: ClientLayout\n  /** Event bus */\n  eventBus: WorkspaceEventBus\n  /** Environment */\n  environment: XScalarEnvironment\n  /** Meta information for the server */\n  serverMeta: ServerMeta\n}\n</script>\n<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarIcon,\n  ScalarWrappingText,\n} from '@scalar/components'\nimport { getSelector } from '@scalar/helpers/dom/get-selector'\nimport { REQUEST_METHODS } from '@scalar/helpers/http/http-info'\nimport type { HttpMethod as HttpMethodType } from '@scalar/helpers/http/http-methods'\nimport { replaceEnvVariables } from '@scalar/helpers/regex/replace-variables'\nimport { extractServerFromPath } from '@scalar/helpers/url/extract-server-from-path'\nimport { ScalarIconCopy, ScalarIconWarningCircle } from '@scalar/icons'\nimport { EditorView } from '@scalar/use-codemirror'\nimport { useClipboard } from '@scalar/use-hooks/useClipboard'\nimport type {\n  ApiReferenceEvents,\n  ServerMeta,\n  WorkspaceEventBus,\n} from '@scalar/workspace-store/events'\nimport {\n  getEnvironmentVariables,\n  getResolvedUrl,\n} from '@scalar/workspace-store/request-example'\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 {\n  computed,\n  nextTick,\n  onBeforeUnmount,\n  onMounted,\n  ref,\n  useId,\n  useTemplateRef,\n  watch,\n} from 'vue'\n\nimport { HttpMethod } from '@/components/HttpMethod'\nimport { getOperationExampleKey } from '@/v2/blocks/operation-block/helpers/response-cache'\nimport { isPlaceholderPath } from '@/v2/blocks/scalar-address-bar-block/helpers/is-placeholder-path'\nimport { refocusBlurTarget } from '@/v2/blocks/scalar-address-bar-block/helpers/refocus-blur-target'\nimport { useLoadingAnimation } from '@/v2/blocks/scalar-address-bar-block/hooks/use-loading-animation'\nimport { usePathMasking } from '@/v2/blocks/scalar-address-bar-block/hooks/use-path-masking'\nimport { CodeInput } from '@/v2/components/code-input'\nimport { ServerDropdown } from '@/v2/components/server'\nimport type { ClientLayout } from '@/v2/types/layout'\n\nimport AddressBarHistory, { type History } from './AddressBarHistory.vue'\n\nconst {\n  path,\n  method,\n  layout,\n  eventBus,\n  exampleKey,\n  documentSlug,\n  server,\n  servers,\n  environment,\n  serverMeta,\n} = defineProps<AddressBarProps>()\n\nconst emit = defineEmits<{\n  /** Execute the current operation example */\n  (e: 'execute'): void\n  /** Select a request history item by index */\n  (e: 'select:history:item', payload: { index: number }): void\n}>()\n\n// ───────────────────────────────────────────────────────────────────\n// Template refs & reactive state\n// ───────────────────────────────────────────────────────────────────\n\nconst id = useId()\nconst sendButtonRef = useTemplateRef('sendButtonRef')\nconst addressBarRef = useTemplateRef('addressBarRef')\n\nconst { percentage, startLoading, stopLoading, isLoading } =\n  useLoadingAnimation()\n\nconst pathConflict = ref<string | null>(null)\nconst methodConflict = ref<HttpMethodType | null>(null)\nconst tabbedOut = ref(false)\nconst isServerDropdownOpen = ref(false)\nconst isHistoryDropdownOpen = ref(false)\n\n// ───────────────────────────────────────────────────────────────────\n// Derived state\n// ───────────────────────────────────────────────────────────────────\n\n/** Keeps the cursor visible past the fade-right overlay while typing */\nconst addressBarScrollMargins = EditorView.scrollMargins.of(() => ({\n  right: 24,\n}))\n\n/** Animated background transform for the loading indicator */\nconst style = computed(() => ({\n  backgroundColor: `color-mix(in srgb, transparent 90%, ${REQUEST_METHODS[method].colorVar})`,\n  transform: `translate3d(-${percentage.value}%,0,0)`,\n}))\n\n/** Whether there is a path or method conflict */\nconst hasConflict = computed(() => methodConflict.value || pathConflict.value)\n\n/** Whether either dropdown (server or history) is open */\nconst isDropdownOpen = computed(\n  () => isServerDropdownOpen.value || isHistoryDropdownOpen.value,\n)\n\n/** Uniquely identifies the currently selected operation + example */\nconst uniqueKey = computed(() =>\n  getOperationExampleKey(method, path, exampleKey, documentSlug),\n)\n\n/** Clear conflict state when switching to a different operation */\nwatch(uniqueKey, () => {\n  pathConflict.value = null\n  methodConflict.value = null\n})\n\n// ───────────────────────────────────────────────────────────────────\n// Focus helpers\n// ───────────────────────────────────────────────────────────────────\n\nconst handleFocusSendButton = (): void => sendButtonRef.value?.$el?.focus()\n\nconst handleFocusAddressBar = (\n  payload: ApiReferenceEvents['ui:focus:address-bar'],\n): void => {\n  // On non-desktop layouts, if already focused we let the browser handle the\n  // native behavior (e.g. selecting the browser's own address bar).\n  if (addressBarRef.value?.isFocused && layout !== 'desktop') {\n    return\n  }\n\n  addressBarRef.value?.focus('end')\n\n  if (payload && 'clear' in payload && payload.clear) {\n    addressBarRef.value?.setCodeMirrorContent('')\n  }\n\n  if (payload && 'event' in payload) {\n    payload.event.preventDefault()\n  }\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Path masking\n//\n// Drafts on `/` and auto-generated `/_scalar_temp...` paths are internal\n// placeholders — the address bar focuses and clears on mount and on\n// navigation so the user sees a blank prompt instead of the internal\n// path. The deferred mask only clears when CodeMirror still contains that\n// placeholder path, so a user edit that lands before the frame is preserved.\n// ───────────────────────────────────────────────────────────────────\n\nusePathMasking({\n  isReady: () => addressBarRef.value?.codeMirror,\n  operationKey: () => uniqueKey.value,\n  shouldMask: () => isPlaceholderPath(path, documentSlug),\n  // Defer to the next frame so focus() runs after click-handler side\n  // effects that move focus (e.g. a dropdown refocusing its trigger),\n  // which would otherwise blur our input and emit a spurious path\n  // update against the now-empty value.\n  onMask: () =>\n    requestAnimationFrame(() => {\n      const editorContent =\n        addressBarRef.value?.codeMirror?.state.doc.toString()\n\n      if (editorContent && editorContent !== path) {\n        return\n      }\n\n      handleFocusAddressBar({ clear: true })\n    }),\n})\n\n// ───────────────────────────────────────────────────────────────────\n// Server extraction\n// ───────────────────────────────────────────────────────────────────\n\n/** If the path contains a server URL, extract it and select or add that server */\nconst extractAndSelectServer = (targetPath: string): string => {\n  const extracted = extractServerFromPath(targetPath)\n  if (!extracted) {\n    return targetPath\n  }\n\n  const [url, remainingPath] = extracted\n\n  // Server is already selected — nothing to do\n  if (url === server?.url) {\n    return remainingPath\n  }\n\n  const matchingServer = servers.find((s) => s.url === url)\n  if (matchingServer) {\n    eventBus.emit('server:update:selected', { url, meta: serverMeta })\n  } else {\n    eventBus.emit('server:add:server', {\n      url,\n      select: true,\n      meta: { type: 'operation', path, method },\n    })\n  }\n\n  return remainingPath\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Path / method updates\n// ───────────────────────────────────────────────────────────────────\n\nconst normalizePath = (value: string): string =>\n  value.startsWith('/') ? value : `/${value}`\n\n/** Emit a path/method update and reconcile conflicts + cursor state on the result */\nconst emitPathMethodUpdate = (\n  targetMethod: HttpMethodType,\n  targetPath: string,\n  blurTargetSelector: string | null = null,\n): void => {\n  const extractedPath = extractAndSelectServer(targetPath)\n  const normalizedPath = normalizePath(extractedPath)\n\n  // Keep CodeMirror in sync so a conflict does not leave a stale value on screen\n  addressBarRef.value?.setCodeMirrorContent(normalizedPath)\n\n  eventBus.emit('operation:update:pathMethod', {\n    meta: { method, path },\n    blurTargetSelector,\n    payload: { method: targetMethod, path: normalizedPath },\n    callback: (status, returnedSelector) => {\n      if (status === 'success' || status === 'no-change') {\n        methodConflict.value = null\n        pathConflict.value = null\n      } else if (status === 'conflict') {\n        if (targetMethod !== method) {\n          methodConflict.value = targetMethod\n        }\n        if (normalizedPath !== path) {\n          pathConflict.value = normalizedPath\n        }\n\n        return\n      }\n\n      // Edge case: pasting a full URL extracts the server but leaves the path\n      // unchanged. CodeMirror still shows the full URL, so force it back to\n      // just the path.\n      const mirrorContent = addressBarRef.value?.codeMirrorRef?.textContent\n      if (\n        status === 'no-change' &&\n        mirrorContent &&\n        mirrorContent !== extractedPath\n      ) {\n        addressBarRef.value?.setCodeMirrorContent(extractedPath)\n      }\n\n      nextTick(() => refocusBlurTarget(returnedSelector))\n    },\n  })\n}\n\n/** Change the operation's method, preferring the conflicting path if present */\nconst handleMethodChange = (newMethod: HttpMethodType): void =>\n  emitPathMethodUpdate(newMethod, pathConflict.value ?? path)\n\n/**\n * Save the path on blur and replay the click that caused the blur (so e.g. a\n * click on the Send button still fires after the async update resolves).\n * Tab-outs explicitly do not replay — tabbing to a button should not trigger\n * its click.\n */\nconst handlePathBlur = (newPath: string, event: FocusEvent): void => {\n  const relatedTarget = event.relatedTarget as Element | null\n  const blurTargetSelector = tabbedOut.value ? null : getSelector(relatedTarget)\n  tabbedOut.value = false\n\n  emitPathMethodUpdate(\n    methodConflict.value ?? method,\n    newPath,\n    blurTargetSelector,\n  )\n}\n\n/** Save the path on Enter and trigger the Send button after the update resolves */\nconst handlePathSubmit = (\n  newPath: string,\n  event: KeyboardEvent | FocusEvent,\n): void => {\n  // Prevent the global hotkey listener from also handling this Enter press\n  event.stopPropagation()\n\n  emitPathMethodUpdate(\n    methodConflict.value ?? method,\n    newPath,\n    '[data-addressbar-action=\"send\"]',\n  )\n}\n\n/** Unset the server when backspace is pressed on an empty path */\nconst handlePathBackspace = (event: KeyboardEvent): void => {\n  if ((event.target as HTMLElement)?.innerText === '\\n') {\n    eventBus.emit('server:update:selected', { url: '', meta: serverMeta })\n  }\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Clipboard\n// ───────────────────────────────────────────────────────────────────\n\nconst { copyToClipboard } = useClipboard()\n\n/** Copy the fully resolved URL (with environment variables applied) */\nconst copyUrl = async (): Promise<void> => {\n  const resolvedUrl = getResolvedUrl({ server, path })\n  const variables = getEnvironmentVariables(environment)\n  await copyToClipboard(replaceEnvVariables(resolvedUrl, variables))\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Navigation\n// ───────────────────────────────────────────────────────────────────\n\nconst navigateToServersPage = (): void => {\n  if (serverMeta.type === 'operation') {\n    eventBus.emit('ui:navigate', {\n      page: 'operation',\n      path: 'servers',\n      operationPath: serverMeta.path,\n      method: serverMeta.method,\n    })\n    return\n  }\n\n  eventBus.emit('ui:navigate', { page: 'document', path: 'servers' })\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Lifecycle\n// ───────────────────────────────────────────────────────────────────\n\nconst unsubscribes: Array<() => void> = []\n\nonMounted(() => {\n  unsubscribes.push(\n    eventBus.on('ui:focus:address-bar', handleFocusAddressBar),\n    eventBus.on('ui:focus:send-button', handleFocusSendButton),\n    eventBus.on('copy-url:address-bar', copyUrl),\n    eventBus.on('hooks:on:request:sent', startLoading),\n    eventBus.on('hooks:on:request:complete', stopLoading),\n  )\n})\n\nonBeforeUnmount(() => {\n  for (const unsubscribe of unsubscribes) {\n    unsubscribe()\n  }\n\n  // Prevents the loading animation from continuing after unmount\n  stopLoading()\n})\n\ndefineExpose({\n  methodConflict,\n  pathConflict,\n})\n</script>\n<template>\n  <div\n    :id=\"id\"\n    class=\"scalar-address-bar order-last flex h-(--scalar-address-bar-height) w-full [--scalar-address-bar-height:32px] lg:order-0 lg:w-auto\">\n    <!-- Address Bar -->\n    <div\n      class=\"address-bar-bg-states text-xxs group relative order-last flex w-full max-w-[calc(100dvw-24px)] flex-1 flex-row items-stretch rounded-lg p-0.75 lg:order-none lg:max-w-[580px] lg:min-w-[580px] xl:max-w-[720px] xl:min-w-[720px]\"\n      :class=\"{\n        'outline-c-danger outline': hasConflict,\n        'rounded-b-none': isDropdownOpen,\n      }\">\n      <div\n        class=\"pointer-events-none absolute top-0 left-0 block h-full w-full overflow-hidden rounded-lg border\"\n        :class=\"{\n          'rounded-b-none': isDropdownOpen,\n        }\">\n        <div\n          class=\"absolute top-0 left-0 h-full w-full\"\n          :style />\n      </div>\n      <div class=\"flex gap-1\">\n        <HttpMethod\n          :isEditable=\"layout !== 'modal'\"\n          isSquare\n          :method=\"methodConflict ?? method\"\n          teleport\n          @change=\"handleMethodChange\" />\n      </div>\n\n      <div\n        class=\"scroll-timeline-x scroll-timeline-x-hidden relative flex w-full bg-blend-normal\">\n        <!-- Servers -->\n        <ServerDropdown\n          v-if=\"servers.length\"\n          :layout=\"layout\"\n          :meta=\"serverMeta\"\n          :server=\"server\"\n          :servers=\"servers\"\n          :target=\"id\"\n          @update:open=\"(value) => (isServerDropdownOpen = value)\"\n          @update:selectedServer=\"\n            (payload) => eventBus.emit('server:update:selected', payload)\n          \"\n          @update:servers=\"navigateToServersPage\"\n          @update:variable=\"\n            (payload) => eventBus.emit('server:update:variables', payload)\n          \" />\n\n        <div class=\"fade-left\" />\n        <!-- Path + URL + env vars -->\n        <CodeInput\n          ref=\"addressBarRef\"\n          alwaysEmitChange\n          aria-label=\"Path\"\n          class=\"min-w-fit pl-px outline-none\"\n          disableCloseBrackets\n          :disabled=\"layout === 'modal'\"\n          disableEnter\n          disableTabIndent\n          :emitOnBlur=\"false\"\n          :environment=\"environment\"\n          :extensions=\"[addressBarScrollMargins]\"\n          importCurl\n          :layout=\"layout\"\n          :modelValue=\"path\"\n          :placeholder=\"server ? '' : 'Enter a URL'\"\n          server\n          @blur=\"handlePathBlur\"\n          @keydown.delete=\"handlePathBackspace\"\n          @keydown.tab=\"tabbedOut = true\"\n          @submit=\"handlePathSubmit\" />\n        <div class=\"fade-right\" />\n      </div>\n\n      <!-- Copy url button -->\n      <ScalarButton\n        class=\"hover:bg-b-3 mx-1\"\n        size=\"xs\"\n        variant=\"ghost\"\n        @click=\"copyUrl\">\n        <ScalarIconCopy />\n        <span class=\"sr-only\">Copy URL</span>\n      </ScalarButton>\n\n      <AddressBarHistory\n        :history=\"history\"\n        :target=\"id\"\n        @select:history:item=\"(payload) => emit('select:history:item', payload)\"\n        @update:open=\"(value) => (isHistoryDropdownOpen = value)\" />\n      <!-- Error message -->\n      <div\n        v-if=\"hasConflict\"\n        class=\"z-context absolute inset-x-0 top-[calc(100%+4px)] flex flex-col items-center rounded px-6\">\n        <div\n          class=\"text-c-danger bg-b-danger border-c-danger flex items-center gap-1 rounded border p-1\">\n          <ScalarIconWarningCircle size=\"sm\" />\n          <div class=\"min-w-0 flex-1\">\n            A\n            <em>{{ methodConflict?.toUpperCase() ?? method.toUpperCase() }}</em>\n            request to\n            <ScalarWrappingText :text=\"pathConflict ?? path\" />\n            already exists in this document\n          </div>\n        </div>\n      </div>\n\n      <ScalarButton\n        ref=\"sendButtonRef\"\n        class=\"relative h-auto shrink-0 overflow-hidden py-1 pr-2.5 pl-2 font-bold\"\n        data-addressbar-action=\"send\"\n        :disabled=\"isLoading\"\n        @click=\"emit('execute')\">\n        <span\n          aria-hidden=\"true\"\n          class=\"inline-flex items-center gap-1\">\n          <ScalarIcon\n            class=\"relative shrink-0 fill-current\"\n            icon=\"Play\"\n            size=\"xs\" />\n          <span class=\"text-xxs hidden lg:flex\">Send</span>\n        </span>\n        <span class=\"sr-only\">\n          Send {{ method }} request to {{ server?.url ?? '' }}{{ path }}\n        </span>\n      </ScalarButton>\n    </div>\n  </div>\n</template>\n<style scoped>\n:deep(.cm-editor) {\n  height: 100%;\n  outline: none;\n  width: 100%;\n}\n:deep(.cm-line) {\n  padding: 0;\n}\n:deep(.cm-content) {\n  padding: 0;\n  display: flex;\n  align-items: center;\n  font-size: var(--scalar-small);\n}\n.scroll-timeline-x {\n  scroll-timeline: --scroll-timeline x;\n  /* Firefox supports */\n  scroll-timeline: --scroll-timeline horizontal;\n  -ms-overflow-style: none; /* IE and Edge */\n}\n.scroll-timeline-x-hidden {\n  overflow-x: auto;\n}\n.scroll-timeline-x-hidden :deep(.cm-scroller) {\n  scrollbar-width: none;\n  -ms-overflow-style: none;\n  padding-right: 20px;\n  overflow: auto;\n}\n.scroll-timeline-x-hidden::-webkit-scrollbar {\n  width: 0;\n  height: 0;\n  display: none;\n}\n.scroll-timeline-x-hidden :deep(.cm-scroller::-webkit-scrollbar) {\n  width: 0;\n  height: 0;\n  display: none;\n}\n.scroll-timeline-x-address {\n  line-height: 27px;\n  scrollbar-width: none; /* Firefox */\n}\n/* make clickable are to left of send button */\n.scroll-timeline-x-address:after {\n  content: '';\n  position: absolute;\n  height: 100%;\n  width: 24px;\n  right: 0;\n  cursor: text;\n}\n.scroll-timeline-x-address:empty:before {\n  content: 'Enter URL or cURL request';\n  color: var(--scalar-color-3);\n  pointer-events: none;\n}\n.fade-left,\n.fade-right {\n  content: '';\n  position: sticky;\n  height: 100%;\n  animation-name: fadein;\n  animation-duration: 1ms;\n  animation-direction: reverse;\n  animation-timeline: --scroll-timeline;\n  pointer-events: none;\n  z-index: 1;\n}\n.fade-left {\n  background: linear-gradient(\n    -90deg,\n    color-mix(in srgb, var(--scalar-address-bar-bg), transparent 100%) 0%,\n    color-mix(in srgb, var(--scalar-address-bar-bg), transparent 20%) 30%,\n    var(--scalar-address-bar-bg) 100%\n  );\n  left: -1px;\n  min-width: 6px;\n  animation-direction: normal;\n}\n.fade-right {\n  background: linear-gradient(\n    90deg,\n    color-mix(in srgb, var(--scalar-address-bar-bg), transparent 100%) 0%,\n    color-mix(in srgb, var(--scalar-address-bar-bg), transparent 20%) 30%,\n    var(--scalar-address-bar-bg) 100%\n  );\n  right: -1px;\n  min-width: 24px;\n}\n@keyframes fadein {\n  0% {\n    opacity: 0;\n  }\n  1% {\n    opacity: 1;\n  }\n}\n.address-bar-bg-states {\n  --scalar-address-bar-bg: color-mix(\n    in srgb,\n    var(--scalar-background-1),\n    var(--scalar-background-2)\n  );\n  background: var(--scalar-address-bar-bg);\n}\n.address-bar-bg-states:has(.cm-focused) {\n  --scalar-address-bar-bg: var(--scalar-background-1);\n  border-color: var(--scalar-border-color);\n  outline-width: 1px;\n  outline-style: solid;\n}\n.address-bar-bg-states:has(.cm-focused) .fade-left,\n.address-bar-bg-states:has(.cm-focused) .fade-right {\n  --scalar-address-bar-bg: var(--scalar-background-1);\n}\n</style>\n"],"mappings":""}