@scalar/api-client 3.21.1 → 3.21.2

package/dist/v2/components/layout/collapsible-section-heading-level.d.ts

@@ -0,0 +1,13 @@
+import type { InjectionKey, MaybeRefOrGetter } from 'vue';
+/** Heading levels a collapsible section title may use. */
+export type CollapsibleSectionHeadingLevel = 2 | 3 | 4 | 5 | 6;
+/**
+ * Heading level for the title of a CollapsibleSection.
+ *
+ * A section assumes it sits directly below the page title and renders an `h2`.
+ * A parent that renders a title of its own above its sections provides a
+ * deeper level, so screen reader users hear the sections as subsections of
+ * that title rather than as its siblings.
+ */
+export declare const COLLAPSIBLE_SECTION_HEADING_LEVEL: InjectionKey<MaybeRefOrGetter<CollapsibleSectionHeadingLevel>>;
+//# sourceMappingURL=collapsible-section-heading-level.d.ts.map

package/dist/v2/components/layout/collapsible-section-heading-level.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible-section-heading-level.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/layout/collapsible-section-heading-level.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,gBAAgB,EAAE,MAAM,KAAK,CAAA;AAEzD,0DAA0D;AAC1D,MAAM,MAAM,8BAA8B,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;AAE9D;;;;;;;GAOG;AACH,eAAO,MAAM,iCAAiC,EAAE,YAAY,CAAC,gBAAgB,CAAC,8BAA8B,CAAC,CAE5G,CAAA"}

package/dist/v2/components/layout/collapsible-section-heading-level.js

@@ -0,0 +1,14 @@
+//#region src/v2/components/layout/collapsible-section-heading-level.ts
+/**
+* Heading level for the title of a CollapsibleSection.
+*
+* A section assumes it sits directly below the page title and renders an `h2`.
+* A parent that renders a title of its own above its sections provides a
+* deeper level, so screen reader users hear the sections as subsections of
+* that title rather than as its siblings.
+*/
+var COLLAPSIBLE_SECTION_HEADING_LEVEL = Symbol("collapsible-section-heading-level");
+//#endregion
+export { COLLAPSIBLE_SECTION_HEADING_LEVEL };
+
+//# sourceMappingURL=collapsible-section-heading-level.js.map

package/dist/v2/components/layout/collapsible-section-heading-level.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible-section-heading-level.js","names":[],"sources":["../../../../src/v2/components/layout/collapsible-section-heading-level.ts"],"sourcesContent":["import type { InjectionKey, MaybeRefOrGetter } from 'vue'\n\n/** Heading levels a collapsible section title may use. */\nexport type CollapsibleSectionHeadingLevel = 2 | 3 | 4 | 5 | 6\n\n/**\n * Heading level for the title of a CollapsibleSection.\n *\n * A section assumes it sits directly below the page title and renders an `h2`.\n * A parent that renders a title of its own above its sections provides a\n * deeper level, so screen reader users hear the sections as subsections of\n * that title rather than as its siblings.\n */\nexport const COLLAPSIBLE_SECTION_HEADING_LEVEL: InjectionKey<MaybeRefOrGetter<CollapsibleSectionHeadingLevel>> = Symbol(\n  'collapsible-section-heading-level',\n)\n"],"mappings":";;;;;;;;;AAaA,IAAa,oCAAoG,OAC/G,mCACF"}

package/dist/v2/components/layout/index.d.ts

@@ -1,2 +1,3 @@
 export { default as CollapsibleSection } from './CollapsibleSection.vue.js';
+export { COLLAPSIBLE_SECTION_HEADING_LEVEL, type CollapsibleSectionHeadingLevel, } from './collapsible-section-heading-level.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/v2/components/layout/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/layout/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,0BAA0B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/layout/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,0BAA0B,CAAA;AACxE,OAAO,EACL,iCAAiC,EACjC,KAAK,8BAA8B,GACpC,MAAM,qCAAqC,CAAA"}

package/dist/v2/components/layout/index.js

@@ -1,2 +1,3 @@
+import { COLLAPSIBLE_SECTION_HEADING_LEVEL } from "./collapsible-section-heading-level.js";
 import CollapsibleSection_default from "./CollapsibleSection.vue.js";
-export { CollapsibleSection_default as CollapsibleSection };
+export { COLLAPSIBLE_SECTION_HEADING_LEVEL, CollapsibleSection_default as CollapsibleSection };

package/dist/v2/components/modals/ModalClientContainer.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModalClientContainer.vue.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/modals/ModalClientContainer.vue"],"names":[],"mappings":"AA8KA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAO1D,KAAK,WAAW,GAAG;IAAE,UAAU,EAAE,UAAU,CAAA;CAAE,CAAC;AAoI9C,QAAA,IAAI,OAAO,IAAW,CAAE;AACxB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAO/C,QAAA,MAAM,UAAU;;;;;;kFAGd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
+{"version":3,"file":"ModalClientContainer.vue.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/modals/ModalClientContainer.vue"],"names":[],"mappings":"AAyLA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAO1D,KAAK,WAAW,GAAG;IAAE,UAAU,EAAE,UAAU,CAAA;CAAE,CAAC;AA+I9C,QAAA,IAAI,OAAO,IAAW,CAAE;AACxB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAO/C,QAAA,MAAM,UAAU;;;;;;kFAGd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/v2/components/modals/ModalClientContainer.vue.js

@@ -2,7 +2,7 @@ import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_exp
 import ModalClientContainer_vue_vue_type_script_setup_true_lang_default from "./ModalClientContainer.vue.script.js";
 /* empty css                                   */
 //#region src/v2/components/modals/ModalClientContainer.vue
-var ModalClientContainer_default = /*#__PURE__*/ _plugin_vue_export_helper_default(ModalClientContainer_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-0eebddf5"]]);
+var ModalClientContainer_default = /*#__PURE__*/ _plugin_vue_export_helper_default(ModalClientContainer_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-44c68ca5"]]);
 //#endregion
 export { ModalClientContainer_default as default };
 

package/dist/v2/components/modals/ModalClientContainer.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalClientContainer.vue.js","names":[],"sources":["../../../../src/v2/components/modals/ModalClientContainer.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { addScalarClassesToHeadless } from '@scalar/components/helpers'\nimport type { ModalState } from '@scalar/components/modal'\nimport { ScalarTeleportRoot } from '@scalar/components/teleport'\nimport { useFocusTrap } from '@vueuse/integrations/useFocusTrap'\nimport { nextTick, onBeforeMount, onBeforeUnmount, ref, watch } from 'vue'\n\nimport { useLocalization } from '@/v2/features/localization'\n\nconst props = defineProps<{ modalState: ModalState }>()\n\nconst emit = defineEmits<{\n  (e: 'open'): void\n  (e: 'close'): void\n}>()\n\nconst { translate } = useLocalization()\n\nconst client = ref<HTMLElement | null>(null)\n\nconst { activate: activateFocusTrap, deactivate: deactivateFocusTrap } =\n  useFocusTrap(client, {\n    allowOutsideClick: true,\n    fallbackFocus: () => client.value as HTMLElement,\n  })\n\n// ensure scalar classes exist on headless-ui root\nonBeforeMount(() => addScalarClassesToHeadless())\n\n// manage the focus trap and emit lifecycle events\nwatch(\n  () => props.modalState.open,\n  async (open) => {\n    if (open) {\n      await nextTick()\n      activateFocusTrap()\n      emit('open')\n    } else {\n      deactivateFocusTrap()\n      emit('close')\n    }\n  },\n  { immediate: false },\n)\n\n// best-effort cleanup on unmount\nonBeforeUnmount(() => {\n  deactivateFocusTrap()\n})\n</script>\n\n<template>\n  <div class=\"scalar scalar-app z-overlay relative\">\n    <div\n      class=\"scalar-container\"\n      :class=\"{ 'scalar-client--open': modalState.open }\">\n      <div\n        ref=\"client\"\n        :aria-label=\"translate('apiClient.modalClientContainer.label')\"\n        aria-modal=\"true\"\n        v-bind=\"$attrs\"\n        class=\"scalar-app-layout scalar-client\"\n        role=\"dialog\"\n        tabindex=\"-1\">\n        <ScalarTeleportRoot>\n          <slot />\n        </ScalarTeleportRoot>\n      </div>\n\n      <!-- overlay / exit area -->\n      <div\n        class=\"scalar-app-exit\"\n        @click=\"modalState.hide()\" />\n    </div>\n  </div>\n</template>\n\n<style scoped>\n@reference \"@/style.css\";\n\n.scalar .scalar-app-layout {\n  background: var(--scalar-background-1);\n  height: calc(100% - 120px);\n  max-width: 1390px;\n  width: 100%;\n  margin: auto;\n  position: relative;\n  overflow: hidden;\n  border-radius: 8px;\n  border: var(--scalar-border-width) solid var(--scalar-border-color);\n}\n/**\n * Allow the modal to fill more space on\n * very short (or very zoomed in) screens\n */\n@variant zoomed {\n  .scalar .scalar-app-layout {\n    height: 100%;\n    max-height: 90svh;\n  }\n}\n\n.scalar .scalar-app-exit {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  background: #00000038;\n  cursor: pointer;\n  z-index: -1;\n}\n\n.dark-mode .scalar .scalar-app-exit {\n  background: rgba(0, 0, 0, 0.45);\n}\n\n.scalar .scalar-app-exit:before {\n  font-family: sans-serif;\n  position: absolute;\n  top: 0;\n  right: 12px;\n  font-size: 30px;\n  font-weight: 100;\n  line-height: 50px;\n  text-align: center;\n  color: white;\n  opacity: 0.6;\n}\n\n.scalar .scalar-app-exit:hover:before {\n  opacity: 1;\n}\n\n/* container */\n.scalar-container {\n  overflow: hidden;\n  visibility: hidden;\n  position: fixed;\n  bottom: 0;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  opacity: 0;\n  pointer-events: none;\n  will-change: opacity;\n  transition:\n    opacity 0.35s ease,\n    visibility 0s linear 0.35s;\n}\n\n.scalar-container.scalar-client--open {\n  opacity: 1;\n  visibility: visible;\n  pointer-events: auto;\n  transition: opacity 0.35s ease;\n}\n\n.scalar .url-form-input {\n  min-height: auto !important;\n}\n\n.scalar .scalar-container {\n  line-height: normal;\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"ModalClientContainer.vue.js","names":[],"sources":["../../../../src/v2/components/modals/ModalClientContainer.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { addScalarClassesToHeadless } from '@scalar/components/helpers'\nimport type { ModalState } from '@scalar/components/modal'\nimport { ScalarTeleportRoot } from '@scalar/components/teleport'\nimport { useFocusTrap } from '@vueuse/integrations/useFocusTrap'\nimport { nextTick, onBeforeMount, onBeforeUnmount, ref, watch } from 'vue'\n\nimport { useLocalization } from '@/v2/features/localization'\n\nconst props = defineProps<{ modalState: ModalState }>()\n\nconst emit = defineEmits<{\n  (e: 'open'): void\n  (e: 'close'): void\n}>()\n\nconst { translate } = useLocalization()\n\nconst client = ref<HTMLElement | null>(null)\n\nconst { activate: activateFocusTrap, deactivate: deactivateFocusTrap } =\n  useFocusTrap(client, {\n    allowOutsideClick: true,\n    fallbackFocus: () => client.value as HTMLElement,\n    /**\n     * Put initial focus on the close button so assistive technology users hear\n     * the way out of the dialog before anything else. Returning `undefined`\n     * (no marked element, e.g. a layout without a close button) keeps\n     * focus-trap's default of the first tabbable element. Never return `null`\n     * here: focus-trap throws on a non-node return value. The lookup is scoped\n     * to the dialog so a host page element can never be picked up.\n     */\n    initialFocus: () =>\n      client.value?.querySelector<HTMLElement>('[data-modal-initial-focus]') ??\n      undefined,\n  })\n\n// ensure scalar classes exist on headless-ui root\nonBeforeMount(() => addScalarClassesToHeadless())\n\n// manage the focus trap and emit lifecycle events\nwatch(\n  () => props.modalState.open,\n  async (open) => {\n    if (open) {\n      await nextTick()\n      activateFocusTrap()\n      emit('open')\n    } else {\n      deactivateFocusTrap()\n      emit('close')\n    }\n  },\n  { immediate: false },\n)\n\n// best-effort cleanup on unmount\nonBeforeUnmount(() => {\n  deactivateFocusTrap()\n})\n</script>\n\n<template>\n  <div class=\"scalar scalar-app z-overlay relative\">\n    <div\n      class=\"scalar-container\"\n      :class=\"{ 'scalar-client--open': modalState.open }\">\n      <div\n        ref=\"client\"\n        :aria-label=\"translate('apiClient.modalClientContainer.label')\"\n        aria-modal=\"true\"\n        v-bind=\"$attrs\"\n        class=\"scalar-app-layout scalar-client\"\n        role=\"dialog\"\n        tabindex=\"-1\">\n        <ScalarTeleportRoot>\n          <slot />\n        </ScalarTeleportRoot>\n      </div>\n\n      <!-- overlay / exit area -->\n      <div\n        class=\"scalar-app-exit\"\n        @click=\"modalState.hide()\" />\n    </div>\n  </div>\n</template>\n\n<style scoped>\n@reference \"@/style.css\";\n\n.scalar .scalar-app-layout {\n  background: var(--scalar-background-1);\n  height: calc(100% - 120px);\n  max-width: 1390px;\n  width: 100%;\n  margin: auto;\n  position: relative;\n  overflow: hidden;\n  border-radius: 8px;\n  border: var(--scalar-border-width) solid var(--scalar-border-color);\n}\n/**\n * Allow the modal to fill more space on\n * very short (or very zoomed in) screens\n */\n@variant zoomed {\n  .scalar .scalar-app-layout {\n    height: 100%;\n    max-height: 90svh;\n  }\n}\n\n.scalar .scalar-app-exit {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  background: #00000038;\n  cursor: pointer;\n  z-index: -1;\n}\n\n.dark-mode .scalar .scalar-app-exit {\n  background: rgba(0, 0, 0, 0.45);\n}\n\n.scalar .scalar-app-exit:before {\n  font-family: sans-serif;\n  position: absolute;\n  top: 0;\n  right: 12px;\n  font-size: 30px;\n  font-weight: 100;\n  line-height: 50px;\n  text-align: center;\n  color: white;\n  opacity: 0.6;\n}\n\n.scalar .scalar-app-exit:hover:before {\n  opacity: 1;\n}\n\n/* container */\n.scalar-container {\n  overflow: hidden;\n  visibility: hidden;\n  position: fixed;\n  bottom: 0;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  opacity: 0;\n  pointer-events: none;\n  will-change: opacity;\n  transition:\n    opacity 0.35s ease,\n    visibility 0s linear 0.35s;\n}\n\n.scalar-container.scalar-client--open {\n  opacity: 1;\n  visibility: visible;\n  pointer-events: auto;\n  transition: opacity 0.35s ease;\n}\n\n.scalar .url-form-input {\n  min-height: auto !important;\n}\n\n.scalar .scalar-container {\n  line-height: normal;\n}\n</style>\n"],"mappings":""}

package/dist/v2/components/modals/ModalClientContainer.vue.script.js

@@ -17,7 +17,16 @@ var ModalClientContainer_vue_vue_type_script_setup_true_lang_default = /*@__PURE
 		const client = ref(null);
 		const { activate: activateFocusTrap, deactivate: deactivateFocusTrap } = useFocusTrap(client, {
 			allowOutsideClick: true,
-			fallbackFocus: () => client.value
+			fallbackFocus: () => client.value,
+			/**
+			* Put initial focus on the close button so assistive technology users hear
+			* the way out of the dialog before anything else. Returning `undefined`
+			* (no marked element, e.g. a layout without a close button) keeps
+			* focus-trap's default of the first tabbable element. Never return `null`
+			* here: focus-trap throws on a non-node return value. The lookup is scoped
+			* to the dialog so a host page element can never be picked up.
+			*/
+			initialFocus: () => client.value?.querySelector("[data-modal-initial-focus]") ?? void 0
 		});
 		onBeforeMount(() => addScalarClassesToHeadless());
 		watch(() => props.modalState.open, async (open) => {

package/dist/v2/components/modals/ModalClientContainer.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalClientContainer.vue.script.js","names":["$attrs"],"sources":["../../../../src/v2/components/modals/ModalClientContainer.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { addScalarClassesToHeadless } from '@scalar/components/helpers'\nimport type { ModalState } from '@scalar/components/modal'\nimport { ScalarTeleportRoot } from '@scalar/components/teleport'\nimport { useFocusTrap } from '@vueuse/integrations/useFocusTrap'\nimport { nextTick, onBeforeMount, onBeforeUnmount, ref, watch } from 'vue'\n\nimport { useLocalization } from '@/v2/features/localization'\n\nconst props = defineProps<{ modalState: ModalState }>()\n\nconst emit = defineEmits<{\n  (e: 'open'): void\n  (e: 'close'): void\n}>()\n\nconst { translate } = useLocalization()\n\nconst client = ref<HTMLElement | null>(null)\n\nconst { activate: activateFocusTrap, deactivate: deactivateFocusTrap } =\n  useFocusTrap(client, {\n    allowOutsideClick: true,\n    fallbackFocus: () => client.value as HTMLElement,\n  })\n\n// ensure scalar classes exist on headless-ui root\nonBeforeMount(() => addScalarClassesToHeadless())\n\n// manage the focus trap and emit lifecycle events\nwatch(\n  () => props.modalState.open,\n  async (open) => {\n    if (open) {\n      await nextTick()\n      activateFocusTrap()\n      emit('open')\n    } else {\n      deactivateFocusTrap()\n      emit('close')\n    }\n  },\n  { immediate: false },\n)\n\n// best-effort cleanup on unmount\nonBeforeUnmount(() => {\n  deactivateFocusTrap()\n})\n</script>\n\n<template>\n  <div class=\"scalar scalar-app z-overlay relative\">\n    <div\n      class=\"scalar-container\"\n      :class=\"{ 'scalar-client--open': modalState.open }\">\n      <div\n        ref=\"client\"\n        :aria-label=\"translate('apiClient.modalClientContainer.label')\"\n        aria-modal=\"true\"\n        v-bind=\"$attrs\"\n        class=\"scalar-app-layout scalar-client\"\n        role=\"dialog\"\n        tabindex=\"-1\">\n        <ScalarTeleportRoot>\n          <slot />\n        </ScalarTeleportRoot>\n      </div>\n\n      <!-- overlay / exit area -->\n      <div\n        class=\"scalar-app-exit\"\n        @click=\"modalState.hide()\" />\n    </div>\n  </div>\n</template>\n\n<style scoped>\n@reference \"@/style.css\";\n\n.scalar .scalar-app-layout {\n  background: var(--scalar-background-1);\n  height: calc(100% - 120px);\n  max-width: 1390px;\n  width: 100%;\n  margin: auto;\n  position: relative;\n  overflow: hidden;\n  border-radius: 8px;\n  border: var(--scalar-border-width) solid var(--scalar-border-color);\n}\n/**\n * Allow the modal to fill more space on\n * very short (or very zoomed in) screens\n */\n@variant zoomed {\n  .scalar .scalar-app-layout {\n    height: 100%;\n    max-height: 90svh;\n  }\n}\n\n.scalar .scalar-app-exit {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  background: #00000038;\n  cursor: pointer;\n  z-index: -1;\n}\n\n.dark-mode .scalar .scalar-app-exit {\n  background: rgba(0, 0, 0, 0.45);\n}\n\n.scalar .scalar-app-exit:before {\n  font-family: sans-serif;\n  position: absolute;\n  top: 0;\n  right: 12px;\n  font-size: 30px;\n  font-weight: 100;\n  line-height: 50px;\n  text-align: center;\n  color: white;\n  opacity: 0.6;\n}\n\n.scalar .scalar-app-exit:hover:before {\n  opacity: 1;\n}\n\n/* container */\n.scalar-container {\n  overflow: hidden;\n  visibility: hidden;\n  position: fixed;\n  bottom: 0;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  opacity: 0;\n  pointer-events: none;\n  will-change: opacity;\n  transition:\n    opacity 0.35s ease,\n    visibility 0s linear 0.35s;\n}\n\n.scalar-container.scalar-client--open {\n  opacity: 1;\n  visibility: visible;\n  pointer-events: auto;\n  transition: opacity 0.35s ease;\n}\n\n.scalar .url-form-input {\n  min-height: auto !important;\n}\n\n.scalar .scalar-container {\n  line-height: normal;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;EASA,MAAM,QAAQ;EAEd,MAAM,OAAO;EAKb,MAAM,EAAE,cAAc,gBAAgB;EAEtC,MAAM,SAAS,IAAwB,IAAI;EAE3C,MAAM,EAAE,UAAU,mBAAmB,YAAY,wBAC/C,aAAa,QAAQ;GACnB,mBAAmB;GACnB,qBAAqB,OAAO;EAC9B,CAAC;EAGH,oBAAoB,2BAA2B,CAAC;EAGhD,YACQ,MAAM,WAAW,MACvB,OAAO,SAAS;GACd,IAAI,MAAM;IACR,MAAM,SAAS;IACf,kBAAkB;IAClB,KAAK,MAAM;GACb,OAAO;IACL,oBAAoB;IACpB,KAAK,OAAO;GACd;EACF,GACA,EAAE,WAAW,MAAM,CACrB;EAGA,sBAAsB;GACpB,oBAAoB;EACtB,CAAC;;uBAIC,mBAsBM,OAtBN,YAsBM,CArBJ,mBAoBM,OAAA,EAnBJ,OAAK,eAAA,CAAC,oBAAkB,EAAA,uBACS,QAAA,WAAW,KAAI,CAAA,CAAA,EAAA,GAAA,CAChD,mBAWM,OAXN,WAWM;aAVA;IAAJ,KAAI;IACH,cAAY,MAAA,SAAA,CAAS,CAAA,sCAAA;IACtB,cAAW;MACHA,KAAAA,QAAM;IACd,OAAM;IACN,MAAK;IACL,UAAS;QACT,YAEqB,MAAA,kBAAA,GAAA,MAAA;2BADX,CAAR,WAAQ,KAAA,QAAA,WAAA,CAAA,GAAA,KAAA,GAAA,IAAA,CAAA,CAAA;;yBAKZ,mBAE+B,OAAA;IAD7B,OAAM;IACL,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,QAAA,WAAW,KAAI"}
+{"version":3,"file":"ModalClientContainer.vue.script.js","names":["$attrs"],"sources":["../../../../src/v2/components/modals/ModalClientContainer.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { addScalarClassesToHeadless } from '@scalar/components/helpers'\nimport type { ModalState } from '@scalar/components/modal'\nimport { ScalarTeleportRoot } from '@scalar/components/teleport'\nimport { useFocusTrap } from '@vueuse/integrations/useFocusTrap'\nimport { nextTick, onBeforeMount, onBeforeUnmount, ref, watch } from 'vue'\n\nimport { useLocalization } from '@/v2/features/localization'\n\nconst props = defineProps<{ modalState: ModalState }>()\n\nconst emit = defineEmits<{\n  (e: 'open'): void\n  (e: 'close'): void\n}>()\n\nconst { translate } = useLocalization()\n\nconst client = ref<HTMLElement | null>(null)\n\nconst { activate: activateFocusTrap, deactivate: deactivateFocusTrap } =\n  useFocusTrap(client, {\n    allowOutsideClick: true,\n    fallbackFocus: () => client.value as HTMLElement,\n    /**\n     * Put initial focus on the close button so assistive technology users hear\n     * the way out of the dialog before anything else. Returning `undefined`\n     * (no marked element, e.g. a layout without a close button) keeps\n     * focus-trap's default of the first tabbable element. Never return `null`\n     * here: focus-trap throws on a non-node return value. The lookup is scoped\n     * to the dialog so a host page element can never be picked up.\n     */\n    initialFocus: () =>\n      client.value?.querySelector<HTMLElement>('[data-modal-initial-focus]') ??\n      undefined,\n  })\n\n// ensure scalar classes exist on headless-ui root\nonBeforeMount(() => addScalarClassesToHeadless())\n\n// manage the focus trap and emit lifecycle events\nwatch(\n  () => props.modalState.open,\n  async (open) => {\n    if (open) {\n      await nextTick()\n      activateFocusTrap()\n      emit('open')\n    } else {\n      deactivateFocusTrap()\n      emit('close')\n    }\n  },\n  { immediate: false },\n)\n\n// best-effort cleanup on unmount\nonBeforeUnmount(() => {\n  deactivateFocusTrap()\n})\n</script>\n\n<template>\n  <div class=\"scalar scalar-app z-overlay relative\">\n    <div\n      class=\"scalar-container\"\n      :class=\"{ 'scalar-client--open': modalState.open }\">\n      <div\n        ref=\"client\"\n        :aria-label=\"translate('apiClient.modalClientContainer.label')\"\n        aria-modal=\"true\"\n        v-bind=\"$attrs\"\n        class=\"scalar-app-layout scalar-client\"\n        role=\"dialog\"\n        tabindex=\"-1\">\n        <ScalarTeleportRoot>\n          <slot />\n        </ScalarTeleportRoot>\n      </div>\n\n      <!-- overlay / exit area -->\n      <div\n        class=\"scalar-app-exit\"\n        @click=\"modalState.hide()\" />\n    </div>\n  </div>\n</template>\n\n<style scoped>\n@reference \"@/style.css\";\n\n.scalar .scalar-app-layout {\n  background: var(--scalar-background-1);\n  height: calc(100% - 120px);\n  max-width: 1390px;\n  width: 100%;\n  margin: auto;\n  position: relative;\n  overflow: hidden;\n  border-radius: 8px;\n  border: var(--scalar-border-width) solid var(--scalar-border-color);\n}\n/**\n * Allow the modal to fill more space on\n * very short (or very zoomed in) screens\n */\n@variant zoomed {\n  .scalar .scalar-app-layout {\n    height: 100%;\n    max-height: 90svh;\n  }\n}\n\n.scalar .scalar-app-exit {\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100vw;\n  height: 100vh;\n  background: #00000038;\n  cursor: pointer;\n  z-index: -1;\n}\n\n.dark-mode .scalar .scalar-app-exit {\n  background: rgba(0, 0, 0, 0.45);\n}\n\n.scalar .scalar-app-exit:before {\n  font-family: sans-serif;\n  position: absolute;\n  top: 0;\n  right: 12px;\n  font-size: 30px;\n  font-weight: 100;\n  line-height: 50px;\n  text-align: center;\n  color: white;\n  opacity: 0.6;\n}\n\n.scalar .scalar-app-exit:hover:before {\n  opacity: 1;\n}\n\n/* container */\n.scalar-container {\n  overflow: hidden;\n  visibility: hidden;\n  position: fixed;\n  bottom: 0;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  opacity: 0;\n  pointer-events: none;\n  will-change: opacity;\n  transition:\n    opacity 0.35s ease,\n    visibility 0s linear 0.35s;\n}\n\n.scalar-container.scalar-client--open {\n  opacity: 1;\n  visibility: visible;\n  pointer-events: auto;\n  transition: opacity 0.35s ease;\n}\n\n.scalar .url-form-input {\n  min-height: auto !important;\n}\n\n.scalar .scalar-container {\n  line-height: normal;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;EASA,MAAM,QAAQ;EAEd,MAAM,OAAO;EAKb,MAAM,EAAE,cAAc,gBAAgB;EAEtC,MAAM,SAAS,IAAwB,IAAI;EAE3C,MAAM,EAAE,UAAU,mBAAmB,YAAY,wBAC/C,aAAa,QAAQ;GACnB,mBAAmB;GACnB,qBAAqB,OAAO;;;;;;;;;GAS5B,oBACE,OAAO,OAAO,cAA2B,4BAA4B,KACrE,KAAA;EACJ,CAAC;EAGH,oBAAoB,2BAA2B,CAAC;EAGhD,YACQ,MAAM,WAAW,MACvB,OAAO,SAAS;GACd,IAAI,MAAM;IACR,MAAM,SAAS;IACf,kBAAkB;IAClB,KAAK,MAAM;GACb,OAAO;IACL,oBAAoB;IACpB,KAAK,OAAO;GACd;EACF,GACA,EAAE,WAAW,MAAM,CACrB;EAGA,sBAAsB;GACpB,oBAAoB;EACtB,CAAC;;uBAIC,mBAsBM,OAtBN,YAsBM,CArBJ,mBAoBM,OAAA,EAnBJ,OAAK,eAAA,CAAC,oBAAkB,EAAA,uBACS,QAAA,WAAW,KAAI,CAAA,CAAA,EAAA,GAAA,CAChD,mBAWM,OAXN,WAWM;aAVA;IAAJ,KAAI;IACH,cAAY,MAAA,SAAA,CAAS,CAAA,sCAAA;IACtB,cAAW;MACHA,KAAAA,QAAM;IACd,OAAM;IACN,MAAK;IACL,UAAS;QACT,YAEqB,MAAA,kBAAA,GAAA,MAAA;2BADX,CAAR,WAAQ,KAAA,QAAA,WAAA,CAAA,GAAA,KAAA,GAAA,IAAA,CAAA,CAAA;;yBAKZ,mBAE+B,OAAA;IAD7B,OAAM;IACL,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,QAAA,WAAW,KAAI"}

package/dist/v2/components/sidebar/SidebarToggle.vue.d.ts

@@ -1,9 +1,22 @@
+type __VLS_Props = {
+    /**
+     * How the toggle is drawn.
+     *
+     * `default` is a flat button that sits inside a panel. `overlay` is the
+     * modal's treatment: the same flat button while the panel header has room
+     * for it, and a circular control on the dimmed backdrop once the viewport is
+     * narrow enough that the sidebar covers the panel, where it mirrors the
+     * close button in the opposite corner.
+     */
+    variant?: 'default' | 'overlay';
+};
 type __VLS_ModelProps = {
     modelValue: boolean;
 };
-declare const __VLS_export: import("vue").DefineComponent<__VLS_ModelProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:modelValue": (value: boolean) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_ModelProps> & Readonly<{
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;

package/dist/v2/components/sidebar/SidebarToggle.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarToggle.vue.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/sidebar/SidebarToggle.vue"],"names":[],"mappings":"AA4DA,KAAK,gBAAgB,GAAG;IACxB,UAAU,EAAE,OAAO,CAAC;CACnB,CAAC;AAuFF,QAAA,MAAM,YAAY;;;;kFAGhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
+{"version":3,"file":"SidebarToggle.vue.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/sidebar/SidebarToggle.vue"],"names":[],"mappings":"AAkHA,KAAK,WAAW,GAAG;IACjB;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,CAAA;CAChC,CAAC;AAWF,KAAK,gBAAgB,GAAG;IACxB,UAAU,EAAE,OAAO,CAAC;CACnB,CAAC;AAKF,KAAK,iBAAiB,GAAG,WAAW,GAAG,gBAAgB,CAAC;AAwFxD,QAAA,MAAM,YAAY;;;;kFAGhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/v2/components/sidebar/SidebarToggle.vue.js

@@ -1,6 +1,8 @@
+import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.js";
 import SidebarToggle_vue_vue_type_script_setup_true_lang_default from "./SidebarToggle.vue.script.js";
+/* empty css                            */
 //#region src/v2/components/sidebar/SidebarToggle.vue
-var SidebarToggle_default = SidebarToggle_vue_vue_type_script_setup_true_lang_default;
+var SidebarToggle_default = /*#__PURE__*/ _plugin_vue_export_helper_default(SidebarToggle_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-4a35414a"]]);
 //#endregion
 export { SidebarToggle_default as default };
 

package/dist/v2/components/sidebar/SidebarToggle.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarToggle.vue.js","names":[],"sources":["../../../../src/v2/components/sidebar/SidebarToggle.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useLocalization } from '@/v2/features/localization'\n\nconst { translate } = useLocalization()\n\nconst isSidebarOpen = defineModel<boolean>({\n  required: true,\n})\n</script>\n<template>\n  <button\n    :aria-pressed=\"isSidebarOpen\"\n    class=\"scalar-sidebar-toggle text-c-3 hover:bg-b-2 active:text-c-1 rounded p-2\"\n    type=\"button\"\n    @click=\"isSidebarOpen = !isSidebarOpen\">\n    <span class=\"sr-only\">{{\n      isSidebarOpen\n        ? translate('apiClient.sidebarToggle.hide')\n        : translate('apiClient.sidebarToggle.show')\n    }}</span>\n    <svg\n      class=\"size-4\"\n      fill=\"none\"\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\">\n      <defs>\n        <clipPath id=\"mask\">\n          <path\n            clip-rule=\"evenodd\"\n            d=\"M9 3.2H4c-1.7 0-3 1.3-3 3v11.5c0 1.7 1.3 3 3 3h5V3.2z\" />\n        </clipPath>\n      </defs>\n      <g clip-path=\"url(#mask)\">\n        <path\n          class=\"transition-transform duration-300\"\n          :class=\"isSidebarOpen ? 'translate-x-0' : '-translate-x-1/2'\"\n          d=\"M1 3.2h8v17.5H1z\"\n          fill=\"currentColor\" />\n      </g>\n      <path\n        d=\"M20 20.8H4c-1.7 0-3-1.3-3-3V6.2c0-1.7 1.3-3 3-3h16c1.7 0 3 1.3 3 3v11.5c0 1.7-1.3 3-3 3zM9 3.2v17.5\"\n        stroke=\"currentColor\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        stroke-width=\"2\" />\n    </svg>\n  </button>\n</template>\n"],"mappings":""}
+{"version":3,"file":"SidebarToggle.vue.js","names":[],"sources":["../../../../src/v2/components/sidebar/SidebarToggle.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useLocalization } from '@/v2/features/localization'\n\nconst { variant = 'default' } = defineProps<{\n  /**\n   * How the toggle is drawn.\n   *\n   * `default` is a flat button that sits inside a panel. `overlay` is the\n   * modal's treatment: the same flat button while the panel header has room\n   * for it, and a circular control on the dimmed backdrop once the viewport is\n   * narrow enough that the sidebar covers the panel, where it mirrors the\n   * close button in the opposite corner.\n   */\n  variant?: 'default' | 'overlay'\n}>()\n\nconst { translate } = useLocalization()\n\nconst isSidebarOpen = defineModel<boolean>({\n  required: true,\n})\n</script>\n<template>\n  <button\n    :aria-pressed=\"isSidebarOpen\"\n    class=\"scalar-sidebar-toggle\"\n    :class=\"\n      variant === 'overlay'\n        ? 'scalar-sidebar-toggle--overlay'\n        : 'text-c-3 hover:bg-b-2 active:text-c-1 rounded p-2'\n    \"\n    type=\"button\"\n    @click=\"isSidebarOpen = !isSidebarOpen\">\n    <span class=\"sr-only\">{{\n      isSidebarOpen\n        ? translate('apiClient.sidebarToggle.hide')\n        : translate('apiClient.sidebarToggle.show')\n    }}</span>\n    <svg\n      class=\"size-4\"\n      fill=\"none\"\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\">\n      <defs>\n        <clipPath id=\"mask\">\n          <path\n            clip-rule=\"evenodd\"\n            d=\"M9 3.2H4c-1.7 0-3 1.3-3 3v11.5c0 1.7 1.3 3 3 3h5V3.2z\" />\n        </clipPath>\n      </defs>\n      <g clip-path=\"url(#mask)\">\n        <path\n          class=\"transition-transform duration-300\"\n          :class=\"isSidebarOpen ? 'translate-x-0' : '-translate-x-1/2'\"\n          d=\"M1 3.2h8v17.5H1z\"\n          fill=\"currentColor\" />\n      </g>\n      <path\n        d=\"M20 20.8H4c-1.7 0-3-1.3-3-3V6.2c0-1.7 1.3-3 3-3h16c1.7 0 3 1.3 3 3v11.5c0 1.7-1.3 3-3 3zM9 3.2v17.5\"\n        stroke=\"currentColor\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        stroke-width=\"2\" />\n    </svg>\n  </button>\n</template>\n\n<style scoped>\n/**\n * The wide state is the default variant written out in plain CSS. Spelling it\n * out here rather than reusing the utility classes keeps the narrow state below\n * from having to outrank a utility of the same specificity.\n */\n.scalar-sidebar-toggle--overlay {\n  color: var(--scalar-color-3);\n  border-radius: var(--scalar-radius-md);\n  padding: 8px;\n}\n.scalar-sidebar-toggle--overlay:hover {\n  background: var(--scalar-background-2);\n}\n.scalar-sidebar-toggle--overlay:active {\n  color: var(--scalar-color-1);\n}\n\n/**\n * Below the `lg` breakpoint (1000px) the toggle moves onto the dimmed backdrop\n * and matches the close button in the opposite corner: white on a translucent\n * fill, in a 36px circle. The padding is literal rather than a utility class so\n * that circle matches that button even when this component is consumed from a\n * build that generates its own utilities.\n *\n * The breakpoint is where the address bar stops being able to centre itself.\n * The bar caps at 768px, so once the panel is narrower than roughly 870px the\n * bar's left edge slides under a toggle sitting inside the panel and clips the\n * method chip. `lg` clears that crossover with room to spare.\n */\n@media (width < 1000px) {\n  .scalar-sidebar-toggle--overlay {\n    color: white;\n    background: rgba(0, 0, 0, 0.1);\n    border-radius: var(--scalar-radius-full);\n    padding: 10px;\n  }\n  .scalar-sidebar-toggle--overlay:hover {\n    background: rgba(255, 255, 255, 0.1);\n  }\n}\n</style>\n"],"mappings":""}

package/dist/v2/components/sidebar/SidebarToggle.vue.script.js

@@ -1,5 +1,5 @@
 import { useLocalization } from "../../features/localization/index.js";
-import { createElementBlock, createElementVNode, defineComponent, normalizeClass, openBlock, toDisplayString, unref, useModel } from "vue";
+import { createElementBlock, createElementVNode, defineComponent, mergeModels, normalizeClass, openBlock, toDisplayString, unref, useModel } from "vue";
 //#region src/v2/components/sidebar/SidebarToggle.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["aria-pressed"];
 var _hoisted_2 = { class: "sr-only" };
@@ -12,13 +12,13 @@ var _hoisted_3 = {
 var _hoisted_4 = { "clip-path": "url(#mask)" };
 var SidebarToggle_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	__name: "SidebarToggle",
-	props: {
+	props: /*@__PURE__*/ mergeModels({ variant: { default: "default" } }, {
 		"modelValue": {
 			type: Boolean,
 			required: true
 		},
 		"modelModifiers": {}
-	},
+	}),
 	emits: ["update:modelValue"],
 	setup(__props) {
 		const { translate } = useLocalization();
@@ -26,7 +26,7 @@ var SidebarToggle_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("button", {
 				"aria-pressed": isSidebarOpen.value,
-				class: "scalar-sidebar-toggle text-c-3 hover:bg-b-2 active:text-c-1 rounded p-2",
+				class: normalizeClass(["scalar-sidebar-toggle", __props.variant === "overlay" ? "scalar-sidebar-toggle--overlay" : "text-c-3 hover:bg-b-2 active:text-c-1 rounded p-2"]),
 				type: "button",
 				onClick: _cache[0] || (_cache[0] = ($event) => isSidebarOpen.value = !isSidebarOpen.value)
 			}, [createElementVNode("span", _hoisted_2, toDisplayString(isSidebarOpen.value ? unref(translate)("apiClient.sidebarToggle.hide") : unref(translate)("apiClient.sidebarToggle.show")), 1), (openBlock(), createElementBlock("svg", _hoisted_3, [
@@ -46,7 +46,7 @@ var SidebarToggle_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 					"stroke-linejoin": "round",
 					"stroke-width": "2"
 				}, null, -1))
-			]))], 8, _hoisted_1);
+			]))], 10, _hoisted_1);
 		};
 	}
 });

package/dist/v2/components/sidebar/SidebarToggle.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"SidebarToggle.vue.script.js","names":[],"sources":["../../../../src/v2/components/sidebar/SidebarToggle.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useLocalization } from '@/v2/features/localization'\n\nconst { translate } = useLocalization()\n\nconst isSidebarOpen = defineModel<boolean>({\n  required: true,\n})\n</script>\n<template>\n  <button\n    :aria-pressed=\"isSidebarOpen\"\n    class=\"scalar-sidebar-toggle text-c-3 hover:bg-b-2 active:text-c-1 rounded p-2\"\n    type=\"button\"\n    @click=\"isSidebarOpen = !isSidebarOpen\">\n    <span class=\"sr-only\">{{\n      isSidebarOpen\n        ? translate('apiClient.sidebarToggle.hide')\n        : translate('apiClient.sidebarToggle.show')\n    }}</span>\n    <svg\n      class=\"size-4\"\n      fill=\"none\"\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\">\n      <defs>\n        <clipPath id=\"mask\">\n          <path\n            clip-rule=\"evenodd\"\n            d=\"M9 3.2H4c-1.7 0-3 1.3-3 3v11.5c0 1.7 1.3 3 3 3h5V3.2z\" />\n        </clipPath>\n      </defs>\n      <g clip-path=\"url(#mask)\">\n        <path\n          class=\"transition-transform duration-300\"\n          :class=\"isSidebarOpen ? 'translate-x-0' : '-translate-x-1/2'\"\n          d=\"M1 3.2h8v17.5H1z\"\n          fill=\"currentColor\" />\n      </g>\n      <path\n        d=\"M20 20.8H4c-1.7 0-3-1.3-3-3V6.2c0-1.7 1.3-3 3-3h16c1.7 0 3 1.3 3 3v11.5c0 1.7-1.3 3-3 3zM9 3.2v17.5\"\n        stroke=\"currentColor\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        stroke-width=\"2\" />\n    </svg>\n  </button>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;EAGA,MAAM,EAAE,cAAc,gBAAgB;EAEtC,MAAM,gBAAgB,SAAoB,SAAA,YAEzC;;uBAGC,mBAoCS,UAAA;IAnCN,gBAAc,cAAA;IACf,OAAM;IACN,MAAK;IACJ,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,cAAA,QAAa,CAAI,cAAA;OACzB,mBAIS,QAJT,YAIS,gBAHP,cAAA,QAAwB,MAAA,SAAA,CAAS,CAAA,8BAAA,IAA2C,MAAA,SAAA,CAAS,CAAA,8BAAA,CAAA,GAAA,CAAA,IAAA,UAAA,GAIvF,mBAyBM,OAzBN,YAyBM;8BApBJ,mBAMO,QAAA,MAAA,CALL,mBAIW,YAAA,EAJD,IAAG,OAAM,GAAA,CACjB,mBAE8D,QAAA;KAD5D,aAAU;KACV,GAAE;;IAGR,mBAMI,KANJ,YAMI,CALF,mBAIwB,QAAA;KAHtB,OAAK,eAAA,CAAC,qCACE,cAAA,QAAa,kBAAA,kBAAA,CAAA;KACrB,GAAE;KACF,MAAK;;8BAET,mBAKqB,QAAA;KAJnB,GAAE;KACF,QAAO;KACP,kBAAe;KACf,mBAAgB;KAChB,gBAAa"}
+{"version":3,"file":"SidebarToggle.vue.script.js","names":[],"sources":["../../../../src/v2/components/sidebar/SidebarToggle.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useLocalization } from '@/v2/features/localization'\n\nconst { variant = 'default' } = defineProps<{\n  /**\n   * How the toggle is drawn.\n   *\n   * `default` is a flat button that sits inside a panel. `overlay` is the\n   * modal's treatment: the same flat button while the panel header has room\n   * for it, and a circular control on the dimmed backdrop once the viewport is\n   * narrow enough that the sidebar covers the panel, where it mirrors the\n   * close button in the opposite corner.\n   */\n  variant?: 'default' | 'overlay'\n}>()\n\nconst { translate } = useLocalization()\n\nconst isSidebarOpen = defineModel<boolean>({\n  required: true,\n})\n</script>\n<template>\n  <button\n    :aria-pressed=\"isSidebarOpen\"\n    class=\"scalar-sidebar-toggle\"\n    :class=\"\n      variant === 'overlay'\n        ? 'scalar-sidebar-toggle--overlay'\n        : 'text-c-3 hover:bg-b-2 active:text-c-1 rounded p-2'\n    \"\n    type=\"button\"\n    @click=\"isSidebarOpen = !isSidebarOpen\">\n    <span class=\"sr-only\">{{\n      isSidebarOpen\n        ? translate('apiClient.sidebarToggle.hide')\n        : translate('apiClient.sidebarToggle.show')\n    }}</span>\n    <svg\n      class=\"size-4\"\n      fill=\"none\"\n      viewBox=\"0 0 24 24\"\n      xmlns=\"http://www.w3.org/2000/svg\">\n      <defs>\n        <clipPath id=\"mask\">\n          <path\n            clip-rule=\"evenodd\"\n            d=\"M9 3.2H4c-1.7 0-3 1.3-3 3v11.5c0 1.7 1.3 3 3 3h5V3.2z\" />\n        </clipPath>\n      </defs>\n      <g clip-path=\"url(#mask)\">\n        <path\n          class=\"transition-transform duration-300\"\n          :class=\"isSidebarOpen ? 'translate-x-0' : '-translate-x-1/2'\"\n          d=\"M1 3.2h8v17.5H1z\"\n          fill=\"currentColor\" />\n      </g>\n      <path\n        d=\"M20 20.8H4c-1.7 0-3-1.3-3-3V6.2c0-1.7 1.3-3 3-3h16c1.7 0 3 1.3 3 3v11.5c0 1.7-1.3 3-3 3zM9 3.2v17.5\"\n        stroke=\"currentColor\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        stroke-width=\"2\" />\n    </svg>\n  </button>\n</template>\n\n<style scoped>\n/**\n * The wide state is the default variant written out in plain CSS. Spelling it\n * out here rather than reusing the utility classes keeps the narrow state below\n * from having to outrank a utility of the same specificity.\n */\n.scalar-sidebar-toggle--overlay {\n  color: var(--scalar-color-3);\n  border-radius: var(--scalar-radius-md);\n  padding: 8px;\n}\n.scalar-sidebar-toggle--overlay:hover {\n  background: var(--scalar-background-2);\n}\n.scalar-sidebar-toggle--overlay:active {\n  color: var(--scalar-color-1);\n}\n\n/**\n * Below the `lg` breakpoint (1000px) the toggle moves onto the dimmed backdrop\n * and matches the close button in the opposite corner: white on a translucent\n * fill, in a 36px circle. The padding is literal rather than a utility class so\n * that circle matches that button even when this component is consumed from a\n * build that generates its own utilities.\n *\n * The breakpoint is where the address bar stops being able to centre itself.\n * The bar caps at 768px, so once the panel is narrower than roughly 870px the\n * bar's left edge slides under a toggle sitting inside the panel and clips the\n * method chip. `lg` clears that crossover with room to spare.\n */\n@media (width < 1000px) {\n  .scalar-sidebar-toggle--overlay {\n    color: white;\n    background: rgba(0, 0, 0, 0.1);\n    border-radius: var(--scalar-radius-full);\n    padding: 10px;\n  }\n  .scalar-sidebar-toggle--overlay:hover {\n    background: rgba(255, 255, 255, 0.1);\n  }\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;EAgBA,MAAM,EAAE,cAAc,gBAAgB;EAEtC,MAAM,gBAAgB,SAAoB,SAAA,YAEzC;;uBAGC,mBAyCS,UAAA;IAxCN,gBAAc,cAAA;IACf,OAAK,eAAA,CAAC,yBACS,QAAA,YAAO,YAAA,mCAAA,mDAAA,CAAA;IAKtB,MAAK;IACJ,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,cAAA,QAAa,CAAI,cAAA;OACzB,mBAIS,QAJT,YAIS,gBAHP,cAAA,QAAwB,MAAA,SAAA,CAAS,CAAA,8BAAA,IAA2C,MAAA,SAAA,CAAS,CAAA,8BAAA,CAAA,GAAA,CAAA,IAAA,UAAA,GAIvF,mBAyBM,OAzBN,YAyBM;8BApBJ,mBAMO,QAAA,MAAA,CALL,mBAIW,YAAA,EAJD,IAAG,OAAM,GAAA,CACjB,mBAE8D,QAAA;KAD5D,aAAU;KACV,GAAE;;IAGR,mBAMI,KANJ,YAMI,CALF,mBAIwB,QAAA;KAHtB,OAAK,eAAA,CAAC,qCACE,cAAA,QAAa,kBAAA,kBAAA,CAAA;KACrB,GAAE;KACF,MAAK;;8BAET,mBAKqB,QAAA;KAJnB,GAAE;KACF,QAAO;KACP,kBAAe;KACf,mBAAgB;KAChB,gBAAa"}

package/dist/v2/constants.js

@@ -1,6 +1,6 @@
 //#region src/v2/constants.ts
 /** The version number taken from the package.json. Consumers can override at build time via define (e.g. OVERRIDE_PACKAGE_VERSION: JSON.stringify('1.2.3')). */
-var APP_VERSION = typeof OVERRIDE_PACKAGE_VERSION !== "undefined" ? OVERRIDE_PACKAGE_VERSION : "3.21.1";
+var APP_VERSION = typeof OVERRIDE_PACKAGE_VERSION !== "undefined" ? OVERRIDE_PACKAGE_VERSION : "3.21.2";
 //#endregion
 export { APP_VERSION };
 

package/dist/v2/features/modal/Modal.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.vue.d.ts","sourceRoot":"","sources":["../../../../src/v2/features/modal/Modal.vue"],"names":[],"mappings":"AA2NA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAC1D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAA;AAE7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAA;AACpE,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAEvE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,8DAA8D,CAAA;AACnG,OAAO,EAKL,KAAK,WAAW,EAChB,KAAK,gBAAgB,EACrB,KAAK,GAAG,EACT,MAAM,KAAK,CAAA;AAKZ,OAAO,EAAE,KAAK,qBAAqB,EAAE,MAAM,6CAA6C,CAAA;AAKxF,OAAO,KAAK,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAA;AAG/E,MAAM,MAAM,UAAU,GAAG;IACvB,4DAA4D;IAC5D,cAAc,EAAE,cAAc,CAAA;IAC9B,qGAAqG;IACrG,QAAQ,EAAE,WAAW,CAAC,eAAe,GAAG,IAAI,CAAC,CAAA;IAC7C,iDAAiD;IACjD,IAAI,EAAE,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IACrC,4CAA4C;IAC5C,QAAQ,EAAE,iBAAiB,CAAA;IAC3B,mDAAmD;IACnD,MAAM,EAAE,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IACvC,yDAAyD;IACzD,WAAW,EAAE,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IAC5C,kEAAkE;IAClE,SAAS,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;IAC/B,sEAAsE;IACtE,+BAA+B,EAAE,GAAG,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAA;IAC5D,2CAA2C;IAC3C,UAAU,EAAE,UAAU,CAAA;IACtB,0DAA0D;IAC1D,YAAY,EAAE,qBAAqB,CAAA;IACnC,iDAAiD;IACjD,OAAO,EAAE,YAAY,EAAE,CAAA;IACvB,wDAAwD;IACxD,OAAO,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAA;CAC5C,CAAA;AAED;;;;GAIG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY;aAC0C,mBAAmB;;;;;aAAnB,mBAAmB;iGA8R3E,CAAC"}
+{"version":3,"file":"Modal.vue.d.ts","sourceRoot":"","sources":["../../../../src/v2/features/modal/Modal.vue"],"names":[],"mappings":"AAmOA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAC1D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAA;AAE7D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAA;AACpE,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,gCAAgC,CAAA;AAEvE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,8DAA8D,CAAA;AACnG,OAAO,EAKL,KAAK,WAAW,EAChB,KAAK,gBAAgB,EACrB,KAAK,GAAG,EACT,MAAM,KAAK,CAAA;AAKZ,OAAO,EAAE,KAAK,qBAAqB,EAAE,MAAM,6CAA6C,CAAA;AAKxF,OAAO,KAAK,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAA;AAG/E,MAAM,MAAM,UAAU,GAAG;IACvB,4DAA4D;IAC5D,cAAc,EAAE,cAAc,CAAA;IAC9B,qGAAqG;IACrG,QAAQ,EAAE,WAAW,CAAC,eAAe,GAAG,IAAI,CAAC,CAAA;IAC7C,iDAAiD;IACjD,IAAI,EAAE,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IACrC,4CAA4C;IAC5C,QAAQ,EAAE,iBAAiB,CAAA;IAC3B,mDAAmD;IACnD,MAAM,EAAE,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IACvC,yDAAyD;IACzD,WAAW,EAAE,WAAW,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IAC5C,kEAAkE;IAClE,SAAS,EAAE,WAAW,CAAC,OAAO,CAAC,CAAA;IAC/B,sEAAsE;IACtE,+BAA+B,EAAE,GAAG,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAA;IAC5D,2CAA2C;IAC3C,UAAU,EAAE,UAAU,CAAA;IACtB,0DAA0D;IAC1D,YAAY,EAAE,qBAAqB,CAAA;IACnC,iDAAiD;IACjD,OAAO,EAAE,YAAY,EAAE,CAAA;IACvB,wDAAwD;IACxD,OAAO,EAAE,gBAAgB,CAAC,gBAAgB,CAAC,CAAA;CAC5C,CAAA;AAED;;;;GAIG;wBACkB,OAAO,YAAY;AAAxC,wBAAyC;AAGzC,QAAA,MAAM,YAAY;aAC0C,mBAAmB;;;;;aAAnB,mBAAmB;iGAkS3E,CAAC"}

package/dist/v2/features/modal/Modal.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.vue.js","names":[],"sources":["../../../../src/v2/features/modal/Modal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type ModalProps = {\n  /** The workspace store must be initialized and passed in */\n  workspaceStore: WorkspaceStore\n  /** The document must be initialized and passed in. OpenAPI-only — the modal has no AsyncAPI path. */\n  document: ComputedRef<OpenApiDocument | null>\n  /** The path must be initialized and passed in */\n  path: ComputedRef<string | undefined>\n  /** The event bus for handling all events */\n  eventBus: WorkspaceEventBus\n  /** The method must be initialized and passed in */\n  method: ComputedRef<string | undefined>\n  /** The example name must be initialized and passed in */\n  exampleName: ComputedRef<string | undefined>\n  /** Whether the active route resolves from `document.webhooks`. */\n  isWebhook: ComputedRef<boolean>\n  /** Selected anyOf/oneOf request-body variants keyed by schema path */\n  requestBodyCompositionSelection: Ref<Record<string, number>>\n  /** Controls the visibility of the modal */\n  modalState: ModalState\n  /** The sidebar state must be initialized and passed in */\n  sidebarState: UseModalSidebarReturn\n  /** Api client plugins to include in the modal */\n  plugins: ClientPlugin[]\n  /** Subset of the configuration options for the modal */\n  options: MaybeRefOrGetter<ApiClientOptions>\n}\n\n/**\n * Scalar Api Client Modal\n *\n * This component is used to render the API Client Modal\n */\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport type { ScalarListboxOption } from '@scalar/components/listbox'\nimport type { ModalState } from '@scalar/components/modal'\nimport type { ClientPlugin } from '@scalar/oas-utils/helpers'\nimport { ScalarToasts } from '@scalar/use-toasts'\nimport type { WorkspaceStore } from '@scalar/workspace-store/client'\nimport { type WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport { getActiveEnvironment } from '@scalar/workspace-store/request-example'\nimport type { OpenApiDocument } from '@scalar/workspace-store/schemas/v3.2/strict/openapi-document'\nimport {\n  computed,\n  onBeforeUnmount,\n  ref,\n  watch,\n  type ComputedRef,\n  type MaybeRefOrGetter,\n  type Ref,\n} from 'vue'\n\nimport ModalClientContainer from '@/v2/components/modals/ModalClientContainer.vue'\nimport { Sidebar, SidebarToggle } from '@/v2/components/sidebar'\nimport { provideLocalization } from '@/v2/features/localization'\nimport { type UseModalSidebarReturn } from '@/v2/features/modal/hooks/use-modal-sidebar'\nimport { initializeModalEvents } from '@/v2/features/modal/modal-events'\nimport Operation from '@/v2/features/operation/Operation.vue'\nimport { useGlobalHotKeys } from '@/v2/hooks/use-global-hot-keys'\nimport { useScrollLock } from '@/v2/hooks/use-scroll-lock'\nimport type { ApiClientOptions, ApiClientOptionsRef } from '@/v2/types/options'\n\nconst {\n  document,\n  eventBus,\n  modalState,\n  options,\n  plugins,\n  requestBodyCompositionSelection,\n  sidebarState,\n  workspaceStore,\n} = defineProps<\n  Omit<ModalProps, 'options'> & { options: ApiClientOptionsRef }\n>()\n\nconst { translate, locale, direction } = provideLocalization(\n  () => options.value.localization,\n)\n\nconst activeWorkspace: ScalarListboxOption = {\n  label: 'default',\n  id: 'default',\n}\n\n/** Controls the visibility of the sidebar. */\nconst isSidebarOpen = ref(false)\n\n/** Initialize modal events */\ninitializeModalEvents({\n  eventBus,\n  isSidebarOpen,\n  requestBodyCompositionSelection,\n  sidebarState,\n  modalState,\n  store: workspaceStore,\n})\n\n/** Register global hotkeys for the app, passing the workspace event bus and layout state */\nuseGlobalHotKeys(eventBus, 'modal', () => !modalState.open)\n\n/** Clean up on close */\nconst cleanUp = () => {\n  eventBus.emit('operation:cancel:request')\n}\n\nconst isLocked = useScrollLock(() => {\n  if (typeof window !== 'undefined') {\n    return window.document.body\n  }\n  return null\n})\n\nwatch(\n  () => modalState.open,\n  (open) => {\n    // Make sure scrolling is locked or unlocked when the modal is opened or closed\n    isLocked.value = open\n\n    if (!open) {\n      cleanUp()\n    }\n  },\n)\n\n// Ensure we add our scalar wrapper class to the headless ui root\nonBeforeUnmount(() => cleanUp())\n\n/** Default sidebar width in pixels. */\nconst DEFAULT_SIDEBAR_WIDTH = 288\n\n/** Width of the sidebar, with fallback to default. */\nconst sidebarWidth = computed(\n  () =>\n    workspaceStore?.workspace?.['x-scalar-sidebar-width'] ??\n    DEFAULT_SIDEBAR_WIDTH,\n)\n\n/** Handler for sidebar width changes. */\nconst handleSidebarWidthUpdate = (width: number) =>\n  workspaceStore?.update('x-scalar-sidebar-width', width)\n\n/**\n * Merged environment variables from workspace and document levels.\n * Variables from both sources are combined, with document variables\n * taking precedence in case of naming conflicts.\n */\nconst environment = computed(\n  () => getActiveEnvironment(workspaceStore, document.value).environment,\n)\n\ndefineExpose({\n  sidebarWidth,\n  environment,\n})\n</script>\n\n<template>\n  <ModalClientContainer\n    :dir=\"direction\"\n    :lang=\"locale\"\n    :modalState>\n    <!-- Toasts -->\n    <ScalarToasts />\n\n    <!-- If we have a document, path and method, render the operation -->\n    <main\n      v-if=\"document.value && path?.value && method?.value\"\n      class=\"relative flex h-full min-h-0 w-full flex-1\">\n      <SidebarToggle\n        v-model=\"isSidebarOpen\"\n        class=\"absolute top-2 left-4 z-10 max-md:top-4\" />\n      <Sidebar\n        v-show=\"isSidebarOpen\"\n        v-model:sidebarWidth=\"sidebarWidth\"\n        :activeWorkspace=\"activeWorkspace\"\n        class=\"h-full max-md:absolute! max-md:z-5 max-md:w-full!\"\n        :documents=\"[document.value]\"\n        :eventBus\n        :isDroppable=\"() => false\"\n        layout=\"modal\"\n        :sidebarState=\"sidebarState.state\"\n        :workspaces=\"[]\"\n        @selectItem=\"sidebarState.handleSelectItem\"\n        @update:sidebarWidth=\"handleSidebarWidthUpdate\" />\n      <Operation\n        :activeWorkspace=\"activeWorkspace\"\n        class=\"flex-1\"\n        :document=\"document.value\"\n        :documentSlug=\"document.value['x-scalar-navigation']?.name ?? ''\"\n        :environment\n        :eventBus\n        :exampleName=\"exampleName?.value\"\n        :isActive=\"modalState.open\"\n        :isWebhook=\"isWebhook.value\"\n        layout=\"modal\"\n        :method=\"method?.value\"\n        :options\n        :path=\"path?.value\"\n        :plugins\n        :requestBodyCompositionSelection=\"requestBodyCompositionSelection.value\"\n        :workspaceStore />\n    </main>\n    <!-- Empty state -->\n    <div\n      v-else\n      class=\"flex h-full w-full items-center justify-center\">\n      <span class=\"text-c-3\">{{\n        translate('apiClient.modal.noDocumentSelected')\n      }}</span>\n    </div>\n  </ModalClientContainer>\n</template>\n"],"mappings":""}
+{"version":3,"file":"Modal.vue.js","names":[],"sources":["../../../../src/v2/features/modal/Modal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type ModalProps = {\n  /** The workspace store must be initialized and passed in */\n  workspaceStore: WorkspaceStore\n  /** The document must be initialized and passed in. OpenAPI-only — the modal has no AsyncAPI path. */\n  document: ComputedRef<OpenApiDocument | null>\n  /** The path must be initialized and passed in */\n  path: ComputedRef<string | undefined>\n  /** The event bus for handling all events */\n  eventBus: WorkspaceEventBus\n  /** The method must be initialized and passed in */\n  method: ComputedRef<string | undefined>\n  /** The example name must be initialized and passed in */\n  exampleName: ComputedRef<string | undefined>\n  /** Whether the active route resolves from `document.webhooks`. */\n  isWebhook: ComputedRef<boolean>\n  /** Selected anyOf/oneOf request-body variants keyed by schema path */\n  requestBodyCompositionSelection: Ref<Record<string, number>>\n  /** Controls the visibility of the modal */\n  modalState: ModalState\n  /** The sidebar state must be initialized and passed in */\n  sidebarState: UseModalSidebarReturn\n  /** Api client plugins to include in the modal */\n  plugins: ClientPlugin[]\n  /** Subset of the configuration options for the modal */\n  options: MaybeRefOrGetter<ApiClientOptions>\n}\n\n/**\n * Scalar Api Client Modal\n *\n * This component is used to render the API Client Modal\n */\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport type { ScalarListboxOption } from '@scalar/components/listbox'\nimport type { ModalState } from '@scalar/components/modal'\nimport type { ClientPlugin } from '@scalar/oas-utils/helpers'\nimport { ScalarToasts } from '@scalar/use-toasts'\nimport type { WorkspaceStore } from '@scalar/workspace-store/client'\nimport { type WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport { getActiveEnvironment } from '@scalar/workspace-store/request-example'\nimport type { OpenApiDocument } from '@scalar/workspace-store/schemas/v3.2/strict/openapi-document'\nimport {\n  computed,\n  onBeforeUnmount,\n  ref,\n  watch,\n  type ComputedRef,\n  type MaybeRefOrGetter,\n  type Ref,\n} from 'vue'\n\nimport ModalClientContainer from '@/v2/components/modals/ModalClientContainer.vue'\nimport { Sidebar, SidebarToggle } from '@/v2/components/sidebar'\nimport { provideLocalization } from '@/v2/features/localization'\nimport { type UseModalSidebarReturn } from '@/v2/features/modal/hooks/use-modal-sidebar'\nimport { initializeModalEvents } from '@/v2/features/modal/modal-events'\nimport Operation from '@/v2/features/operation/Operation.vue'\nimport { useGlobalHotKeys } from '@/v2/hooks/use-global-hot-keys'\nimport { useScrollLock } from '@/v2/hooks/use-scroll-lock'\nimport type { ApiClientOptions, ApiClientOptionsRef } from '@/v2/types/options'\n\nconst {\n  document,\n  eventBus,\n  modalState,\n  options,\n  plugins,\n  requestBodyCompositionSelection,\n  sidebarState,\n  workspaceStore,\n} = defineProps<\n  Omit<ModalProps, 'options'> & { options: ApiClientOptionsRef }\n>()\n\nconst { translate, locale, direction } = provideLocalization(\n  () => options.value.localization,\n)\n\nconst activeWorkspace: ScalarListboxOption = {\n  label: 'default',\n  id: 'default',\n}\n\n/** Controls the visibility of the sidebar. */\nconst isSidebarOpen = ref(false)\n\n/** Initialize modal events */\ninitializeModalEvents({\n  eventBus,\n  isSidebarOpen,\n  requestBodyCompositionSelection,\n  sidebarState,\n  modalState,\n  store: workspaceStore,\n})\n\n/** Register global hotkeys for the app, passing the workspace event bus and layout state */\nuseGlobalHotKeys(eventBus, 'modal', () => !modalState.open)\n\n/** Clean up on close */\nconst cleanUp = () => {\n  eventBus.emit('operation:cancel:request')\n}\n\nconst isLocked = useScrollLock(() => {\n  if (typeof window !== 'undefined') {\n    return window.document.body\n  }\n  return null\n})\n\nwatch(\n  () => modalState.open,\n  (open) => {\n    // Make sure scrolling is locked or unlocked when the modal is opened or closed\n    isLocked.value = open\n\n    if (!open) {\n      cleanUp()\n    }\n  },\n)\n\n// Ensure we add our scalar wrapper class to the headless ui root\nonBeforeUnmount(() => cleanUp())\n\n/** Default sidebar width in pixels. */\nconst DEFAULT_SIDEBAR_WIDTH = 288\n\n/** Width of the sidebar, with fallback to default. */\nconst sidebarWidth = computed(\n  () =>\n    workspaceStore?.workspace?.['x-scalar-sidebar-width'] ??\n    DEFAULT_SIDEBAR_WIDTH,\n)\n\n/** Handler for sidebar width changes. */\nconst handleSidebarWidthUpdate = (width: number) =>\n  workspaceStore?.update('x-scalar-sidebar-width', width)\n\n/**\n * Merged environment variables from workspace and document levels.\n * Variables from both sources are combined, with document variables\n * taking precedence in case of naming conflicts.\n */\nconst environment = computed(\n  () => getActiveEnvironment(workspaceStore, document.value).environment,\n)\n\ndefineExpose({\n  sidebarWidth,\n  environment,\n})\n</script>\n\n<template>\n  <ModalClientContainer\n    :dir=\"direction\"\n    :lang=\"locale\"\n    :modalState>\n    <!-- Toasts -->\n    <ScalarToasts />\n\n    <!-- If we have a document, path and method, render the operation -->\n    <main\n      v-if=\"document.value && path?.value && method?.value\"\n      class=\"relative flex h-full min-h-0 w-full flex-1\">\n      <!--\n        The toggle keeps its place inside the panel while the header row is wide\n        enough for the address bar to centre itself clear of it. Below `lg` the\n        bar fills the row and its method chip reaches the panel edge, so the\n        toggle moves onto the backdrop and mirrors the close button in the\n        opposite corner, leaving the whole row to the bar.\n      -->\n      <SidebarToggle\n        v-model=\"isSidebarOpen\"\n        class=\"absolute top-2 left-4 z-10 max-lg:fixed max-lg:top-2 max-lg:left-2\"\n        variant=\"overlay\" />\n      <Sidebar\n        v-show=\"isSidebarOpen\"\n        v-model:sidebarWidth=\"sidebarWidth\"\n        :activeWorkspace=\"activeWorkspace\"\n        class=\"h-full max-md:absolute! max-md:z-5 max-md:w-full!\"\n        :documents=\"[document.value]\"\n        :eventBus\n        :isDroppable=\"() => false\"\n        layout=\"modal\"\n        :sidebarState=\"sidebarState.state\"\n        :workspaces=\"[]\"\n        @selectItem=\"sidebarState.handleSelectItem\"\n        @update:sidebarWidth=\"handleSidebarWidthUpdate\" />\n      <Operation\n        :activeWorkspace=\"activeWorkspace\"\n        class=\"flex-1\"\n        :document=\"document.value\"\n        :documentSlug=\"document.value['x-scalar-navigation']?.name ?? ''\"\n        :environment\n        :eventBus\n        :exampleName=\"exampleName?.value\"\n        :isActive=\"modalState.open\"\n        :isWebhook=\"isWebhook.value\"\n        layout=\"modal\"\n        :method=\"method?.value\"\n        :options\n        :path=\"path?.value\"\n        :plugins\n        :requestBodyCompositionSelection=\"requestBodyCompositionSelection.value\"\n        :workspaceStore />\n    </main>\n    <!-- Empty state -->\n    <div\n      v-else\n      class=\"flex h-full w-full items-center justify-center\">\n      <span class=\"text-c-3\">{{\n        translate('apiClient.modal.noDocumentSelected')\n      }}</span>\n    </div>\n  </ModalClientContainer>\n</template>\n"],"mappings":""}

package/dist/v2/features/modal/Modal.vue.script.js

@@ -93,7 +93,8 @@ var Modal_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComp
 					createVNode(unref(SidebarToggle_default), {
 						modelValue: isSidebarOpen.value,
 						"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isSidebarOpen.value = $event),
-						class: "absolute top-2 left-4 z-10 max-md:top-4"
+						class: "absolute top-2 left-4 z-10 max-lg:fixed max-lg:top-2 max-lg:left-2",
+						variant: "overlay"
 					}, null, 8, ["modelValue"]),
 					withDirectives(createVNode(unref(Sidebar_default), {
 						sidebarWidth: sidebarWidth.value,

package/dist/v2/features/modal/Modal.vue.script.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.vue.script.js","names":[],"sources":["../../../../src/v2/features/modal/Modal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type ModalProps = {\n  /** The workspace store must be initialized and passed in */\n  workspaceStore: WorkspaceStore\n  /** The document must be initialized and passed in. OpenAPI-only — the modal has no AsyncAPI path. */\n  document: ComputedRef<OpenApiDocument | null>\n  /** The path must be initialized and passed in */\n  path: ComputedRef<string | undefined>\n  /** The event bus for handling all events */\n  eventBus: WorkspaceEventBus\n  /** The method must be initialized and passed in */\n  method: ComputedRef<string | undefined>\n  /** The example name must be initialized and passed in */\n  exampleName: ComputedRef<string | undefined>\n  /** Whether the active route resolves from `document.webhooks`. */\n  isWebhook: ComputedRef<boolean>\n  /** Selected anyOf/oneOf request-body variants keyed by schema path */\n  requestBodyCompositionSelection: Ref<Record<string, number>>\n  /** Controls the visibility of the modal */\n  modalState: ModalState\n  /** The sidebar state must be initialized and passed in */\n  sidebarState: UseModalSidebarReturn\n  /** Api client plugins to include in the modal */\n  plugins: ClientPlugin[]\n  /** Subset of the configuration options for the modal */\n  options: MaybeRefOrGetter<ApiClientOptions>\n}\n\n/**\n * Scalar Api Client Modal\n *\n * This component is used to render the API Client Modal\n */\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport type { ScalarListboxOption } from '@scalar/components/listbox'\nimport type { ModalState } from '@scalar/components/modal'\nimport type { ClientPlugin } from '@scalar/oas-utils/helpers'\nimport { ScalarToasts } from '@scalar/use-toasts'\nimport type { WorkspaceStore } from '@scalar/workspace-store/client'\nimport { type WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport { getActiveEnvironment } from '@scalar/workspace-store/request-example'\nimport type { OpenApiDocument } from '@scalar/workspace-store/schemas/v3.2/strict/openapi-document'\nimport {\n  computed,\n  onBeforeUnmount,\n  ref,\n  watch,\n  type ComputedRef,\n  type MaybeRefOrGetter,\n  type Ref,\n} from 'vue'\n\nimport ModalClientContainer from '@/v2/components/modals/ModalClientContainer.vue'\nimport { Sidebar, SidebarToggle } from '@/v2/components/sidebar'\nimport { provideLocalization } from '@/v2/features/localization'\nimport { type UseModalSidebarReturn } from '@/v2/features/modal/hooks/use-modal-sidebar'\nimport { initializeModalEvents } from '@/v2/features/modal/modal-events'\nimport Operation from '@/v2/features/operation/Operation.vue'\nimport { useGlobalHotKeys } from '@/v2/hooks/use-global-hot-keys'\nimport { useScrollLock } from '@/v2/hooks/use-scroll-lock'\nimport type { ApiClientOptions, ApiClientOptionsRef } from '@/v2/types/options'\n\nconst {\n  document,\n  eventBus,\n  modalState,\n  options,\n  plugins,\n  requestBodyCompositionSelection,\n  sidebarState,\n  workspaceStore,\n} = defineProps<\n  Omit<ModalProps, 'options'> & { options: ApiClientOptionsRef }\n>()\n\nconst { translate, locale, direction } = provideLocalization(\n  () => options.value.localization,\n)\n\nconst activeWorkspace: ScalarListboxOption = {\n  label: 'default',\n  id: 'default',\n}\n\n/** Controls the visibility of the sidebar. */\nconst isSidebarOpen = ref(false)\n\n/** Initialize modal events */\ninitializeModalEvents({\n  eventBus,\n  isSidebarOpen,\n  requestBodyCompositionSelection,\n  sidebarState,\n  modalState,\n  store: workspaceStore,\n})\n\n/** Register global hotkeys for the app, passing the workspace event bus and layout state */\nuseGlobalHotKeys(eventBus, 'modal', () => !modalState.open)\n\n/** Clean up on close */\nconst cleanUp = () => {\n  eventBus.emit('operation:cancel:request')\n}\n\nconst isLocked = useScrollLock(() => {\n  if (typeof window !== 'undefined') {\n    return window.document.body\n  }\n  return null\n})\n\nwatch(\n  () => modalState.open,\n  (open) => {\n    // Make sure scrolling is locked or unlocked when the modal is opened or closed\n    isLocked.value = open\n\n    if (!open) {\n      cleanUp()\n    }\n  },\n)\n\n// Ensure we add our scalar wrapper class to the headless ui root\nonBeforeUnmount(() => cleanUp())\n\n/** Default sidebar width in pixels. */\nconst DEFAULT_SIDEBAR_WIDTH = 288\n\n/** Width of the sidebar, with fallback to default. */\nconst sidebarWidth = computed(\n  () =>\n    workspaceStore?.workspace?.['x-scalar-sidebar-width'] ??\n    DEFAULT_SIDEBAR_WIDTH,\n)\n\n/** Handler for sidebar width changes. */\nconst handleSidebarWidthUpdate = (width: number) =>\n  workspaceStore?.update('x-scalar-sidebar-width', width)\n\n/**\n * Merged environment variables from workspace and document levels.\n * Variables from both sources are combined, with document variables\n * taking precedence in case of naming conflicts.\n */\nconst environment = computed(\n  () => getActiveEnvironment(workspaceStore, document.value).environment,\n)\n\ndefineExpose({\n  sidebarWidth,\n  environment,\n})\n</script>\n\n<template>\n  <ModalClientContainer\n    :dir=\"direction\"\n    :lang=\"locale\"\n    :modalState>\n    <!-- Toasts -->\n    <ScalarToasts />\n\n    <!-- If we have a document, path and method, render the operation -->\n    <main\n      v-if=\"document.value && path?.value && method?.value\"\n      class=\"relative flex h-full min-h-0 w-full flex-1\">\n      <SidebarToggle\n        v-model=\"isSidebarOpen\"\n        class=\"absolute top-2 left-4 z-10 max-md:top-4\" />\n      <Sidebar\n        v-show=\"isSidebarOpen\"\n        v-model:sidebarWidth=\"sidebarWidth\"\n        :activeWorkspace=\"activeWorkspace\"\n        class=\"h-full max-md:absolute! max-md:z-5 max-md:w-full!\"\n        :documents=\"[document.value]\"\n        :eventBus\n        :isDroppable=\"() => false\"\n        layout=\"modal\"\n        :sidebarState=\"sidebarState.state\"\n        :workspaces=\"[]\"\n        @selectItem=\"sidebarState.handleSelectItem\"\n        @update:sidebarWidth=\"handleSidebarWidthUpdate\" />\n      <Operation\n        :activeWorkspace=\"activeWorkspace\"\n        class=\"flex-1\"\n        :document=\"document.value\"\n        :documentSlug=\"document.value['x-scalar-navigation']?.name ?? ''\"\n        :environment\n        :eventBus\n        :exampleName=\"exampleName?.value\"\n        :isActive=\"modalState.open\"\n        :isWebhook=\"isWebhook.value\"\n        layout=\"modal\"\n        :method=\"method?.value\"\n        :options\n        :path=\"path?.value\"\n        :plugins\n        :requestBodyCompositionSelection=\"requestBodyCompositionSelection.value\"\n        :workspaceStore />\n    </main>\n    <!-- Empty state -->\n    <div\n      v-else\n      class=\"flex h-full w-full items-center justify-center\">\n      <span class=\"text-c-3\">{{\n        translate('apiClient.modal.noDocumentSelected')\n      }}</span>\n    </div>\n  </ModalClientContainer>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8EA,MAAM,EAAE,WAAW,QAAQ,cAAc,0BACjC,QAAA,QAAQ,MAAM,YACtB;EAEA,MAAM,kBAAuC;GAC3C,OAAO;GACP,IAAI;EACN;;EAGA,MAAM,gBAAgB,IAAI,KAAK;;EAG/B,sBAAsB;GACpB,UAAO,QAAA;GACP;GACA,iCAA8B,QAAA;GAC9B,cAAW,QAAA;GACX,YAAS,QAAA;GACT,OAAO,QAAA;EACT,CAAC;;EAGD,iBAAiB,QAAA,UAAU,eAAe,CAAC,QAAA,WAAW,IAAI;;EAG1D,MAAM,gBAAgB;GACpB,QAAA,SAAS,KAAK,0BAA0B;EAC1C;EAEA,MAAM,WAAW,oBAAoB;GACnC,IAAI,OAAO,WAAW,aACpB,OAAO,OAAO,SAAS;GAEzB,OAAO;EACT,CAAC;EAED,YACQ,QAAA,WAAW,OAChB,SAAS;GAER,SAAS,QAAQ;GAEjB,IAAI,CAAC,MACH,QAAQ;EAEZ,CACF;EAGA,sBAAsB,QAAQ,CAAC;;EAG/B,MAAM,wBAAwB;;EAG9B,MAAM,eAAe,eAEjB,QAAA,gBAAgB,YAAY,6BAC5B,qBACJ;;EAGA,MAAM,4BAA4B,UAChC,QAAA,gBAAgB,OAAO,0BAA0B,KAAK;;;;;;EAOxD,MAAM,cAAc,eACZ,qBAAqB,QAAA,gBAAgB,QAAA,SAAS,KAAK,CAAC,CAAC,WAC7D;EAEA,SAAa;GACX;GACA;EACF,CAAC;;uBAIC,YAqDuB,8BAAA;IApDpB,KAAK,MAAA,SAAA;IACL,MAAM,MAAA,MAAA;IACN,YAAA,QAAA;;2BAEe,CAAhB,YAAgB,MAAA,YAAA,CAAA,GAIR,QAAA,SAAS,SAAS,QAAA,MAAM,SAAS,QAAA,QAAQ,SAAA,UAAA,GADjD,mBAoCO,QApCP,YAoCO;KAjCL,YAEoD,MAAA,qBAAA,GAAA;kBADzC,cAAA;iFAAa,QAAA;MACtB,OAAM;;oBACR,YAYoD,MAAA,eAAA,GAAA;MAV1C,cAAc,aAAA;mFAAY,QAAA,SAUZ,wBAAA;MATJ;MAClB,OAAM;MACL,WAAS,CAAG,QAAA,SAAS,KAAK;MAC1B,UAAA,QAAA;MACA,mBAAa;MACd,QAAO;MACN,cAAc,QAAA,aAAa;MAC3B,YAAY,CAAA;MACZ,cAAY,QAAA,aAAa;;;;;;;kBAVlB,cAAA,KAAa,CAAA,CAAA;KAYvB,YAgBoB,mBAAA;MAfA;MAClB,OAAM;MACL,UAAU,QAAA,SAAS;MACnB,cAAc,QAAA,SAAS,MAAK,sBAAA,EAAyB,QAAI;MACzD,aAAA,YAAA;MACA,UAAA,QAAA;MACA,aAAa,QAAA,aAAa;MAC1B,UAAU,QAAA,WAAW;MACrB,WAAW,QAAA,UAAU;MACtB,QAAO;MACN,QAAQ,QAAA,QAAQ;MAChB,SAAA,QAAA;MACA,MAAM,QAAA,MAAM;MACZ,SAAA,QAAA;MACA,iCAAiC,QAAA,gCAAgC;MACjE,gBAAA,QAAA;;;;;;;;;;;;;;;;wBAGL,mBAMM,OANN,YAMM,CAHJ,mBAES,QAFT,YAES,gBADP,MAAA,SAAA,CAAS,CAAA,oCAAA,CAAA,GAAA,CAAA,CAAA,CAAA,EAAA,CAAA"}
+{"version":3,"file":"Modal.vue.script.js","names":[],"sources":["../../../../src/v2/features/modal/Modal.vue"],"sourcesContent":["<script lang=\"ts\">\nexport type ModalProps = {\n  /** The workspace store must be initialized and passed in */\n  workspaceStore: WorkspaceStore\n  /** The document must be initialized and passed in. OpenAPI-only — the modal has no AsyncAPI path. */\n  document: ComputedRef<OpenApiDocument | null>\n  /** The path must be initialized and passed in */\n  path: ComputedRef<string | undefined>\n  /** The event bus for handling all events */\n  eventBus: WorkspaceEventBus\n  /** The method must be initialized and passed in */\n  method: ComputedRef<string | undefined>\n  /** The example name must be initialized and passed in */\n  exampleName: ComputedRef<string | undefined>\n  /** Whether the active route resolves from `document.webhooks`. */\n  isWebhook: ComputedRef<boolean>\n  /** Selected anyOf/oneOf request-body variants keyed by schema path */\n  requestBodyCompositionSelection: Ref<Record<string, number>>\n  /** Controls the visibility of the modal */\n  modalState: ModalState\n  /** The sidebar state must be initialized and passed in */\n  sidebarState: UseModalSidebarReturn\n  /** Api client plugins to include in the modal */\n  plugins: ClientPlugin[]\n  /** Subset of the configuration options for the modal */\n  options: MaybeRefOrGetter<ApiClientOptions>\n}\n\n/**\n * Scalar Api Client Modal\n *\n * This component is used to render the API Client Modal\n */\nexport default {}\n</script>\n\n<script setup lang=\"ts\">\nimport type { ScalarListboxOption } from '@scalar/components/listbox'\nimport type { ModalState } from '@scalar/components/modal'\nimport type { ClientPlugin } from '@scalar/oas-utils/helpers'\nimport { ScalarToasts } from '@scalar/use-toasts'\nimport type { WorkspaceStore } from '@scalar/workspace-store/client'\nimport { type WorkspaceEventBus } from '@scalar/workspace-store/events'\nimport { getActiveEnvironment } from '@scalar/workspace-store/request-example'\nimport type { OpenApiDocument } from '@scalar/workspace-store/schemas/v3.2/strict/openapi-document'\nimport {\n  computed,\n  onBeforeUnmount,\n  ref,\n  watch,\n  type ComputedRef,\n  type MaybeRefOrGetter,\n  type Ref,\n} from 'vue'\n\nimport ModalClientContainer from '@/v2/components/modals/ModalClientContainer.vue'\nimport { Sidebar, SidebarToggle } from '@/v2/components/sidebar'\nimport { provideLocalization } from '@/v2/features/localization'\nimport { type UseModalSidebarReturn } from '@/v2/features/modal/hooks/use-modal-sidebar'\nimport { initializeModalEvents } from '@/v2/features/modal/modal-events'\nimport Operation from '@/v2/features/operation/Operation.vue'\nimport { useGlobalHotKeys } from '@/v2/hooks/use-global-hot-keys'\nimport { useScrollLock } from '@/v2/hooks/use-scroll-lock'\nimport type { ApiClientOptions, ApiClientOptionsRef } from '@/v2/types/options'\n\nconst {\n  document,\n  eventBus,\n  modalState,\n  options,\n  plugins,\n  requestBodyCompositionSelection,\n  sidebarState,\n  workspaceStore,\n} = defineProps<\n  Omit<ModalProps, 'options'> & { options: ApiClientOptionsRef }\n>()\n\nconst { translate, locale, direction } = provideLocalization(\n  () => options.value.localization,\n)\n\nconst activeWorkspace: ScalarListboxOption = {\n  label: 'default',\n  id: 'default',\n}\n\n/** Controls the visibility of the sidebar. */\nconst isSidebarOpen = ref(false)\n\n/** Initialize modal events */\ninitializeModalEvents({\n  eventBus,\n  isSidebarOpen,\n  requestBodyCompositionSelection,\n  sidebarState,\n  modalState,\n  store: workspaceStore,\n})\n\n/** Register global hotkeys for the app, passing the workspace event bus and layout state */\nuseGlobalHotKeys(eventBus, 'modal', () => !modalState.open)\n\n/** Clean up on close */\nconst cleanUp = () => {\n  eventBus.emit('operation:cancel:request')\n}\n\nconst isLocked = useScrollLock(() => {\n  if (typeof window !== 'undefined') {\n    return window.document.body\n  }\n  return null\n})\n\nwatch(\n  () => modalState.open,\n  (open) => {\n    // Make sure scrolling is locked or unlocked when the modal is opened or closed\n    isLocked.value = open\n\n    if (!open) {\n      cleanUp()\n    }\n  },\n)\n\n// Ensure we add our scalar wrapper class to the headless ui root\nonBeforeUnmount(() => cleanUp())\n\n/** Default sidebar width in pixels. */\nconst DEFAULT_SIDEBAR_WIDTH = 288\n\n/** Width of the sidebar, with fallback to default. */\nconst sidebarWidth = computed(\n  () =>\n    workspaceStore?.workspace?.['x-scalar-sidebar-width'] ??\n    DEFAULT_SIDEBAR_WIDTH,\n)\n\n/** Handler for sidebar width changes. */\nconst handleSidebarWidthUpdate = (width: number) =>\n  workspaceStore?.update('x-scalar-sidebar-width', width)\n\n/**\n * Merged environment variables from workspace and document levels.\n * Variables from both sources are combined, with document variables\n * taking precedence in case of naming conflicts.\n */\nconst environment = computed(\n  () => getActiveEnvironment(workspaceStore, document.value).environment,\n)\n\ndefineExpose({\n  sidebarWidth,\n  environment,\n})\n</script>\n\n<template>\n  <ModalClientContainer\n    :dir=\"direction\"\n    :lang=\"locale\"\n    :modalState>\n    <!-- Toasts -->\n    <ScalarToasts />\n\n    <!-- If we have a document, path and method, render the operation -->\n    <main\n      v-if=\"document.value && path?.value && method?.value\"\n      class=\"relative flex h-full min-h-0 w-full flex-1\">\n      <!--\n        The toggle keeps its place inside the panel while the header row is wide\n        enough for the address bar to centre itself clear of it. Below `lg` the\n        bar fills the row and its method chip reaches the panel edge, so the\n        toggle moves onto the backdrop and mirrors the close button in the\n        opposite corner, leaving the whole row to the bar.\n      -->\n      <SidebarToggle\n        v-model=\"isSidebarOpen\"\n        class=\"absolute top-2 left-4 z-10 max-lg:fixed max-lg:top-2 max-lg:left-2\"\n        variant=\"overlay\" />\n      <Sidebar\n        v-show=\"isSidebarOpen\"\n        v-model:sidebarWidth=\"sidebarWidth\"\n        :activeWorkspace=\"activeWorkspace\"\n        class=\"h-full max-md:absolute! max-md:z-5 max-md:w-full!\"\n        :documents=\"[document.value]\"\n        :eventBus\n        :isDroppable=\"() => false\"\n        layout=\"modal\"\n        :sidebarState=\"sidebarState.state\"\n        :workspaces=\"[]\"\n        @selectItem=\"sidebarState.handleSelectItem\"\n        @update:sidebarWidth=\"handleSidebarWidthUpdate\" />\n      <Operation\n        :activeWorkspace=\"activeWorkspace\"\n        class=\"flex-1\"\n        :document=\"document.value\"\n        :documentSlug=\"document.value['x-scalar-navigation']?.name ?? ''\"\n        :environment\n        :eventBus\n        :exampleName=\"exampleName?.value\"\n        :isActive=\"modalState.open\"\n        :isWebhook=\"isWebhook.value\"\n        layout=\"modal\"\n        :method=\"method?.value\"\n        :options\n        :path=\"path?.value\"\n        :plugins\n        :requestBodyCompositionSelection=\"requestBodyCompositionSelection.value\"\n        :workspaceStore />\n    </main>\n    <!-- Empty state -->\n    <div\n      v-else\n      class=\"flex h-full w-full items-center justify-center\">\n      <span class=\"text-c-3\">{{\n        translate('apiClient.modal.noDocumentSelected')\n      }}</span>\n    </div>\n  </ModalClientContainer>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8EA,MAAM,EAAE,WAAW,QAAQ,cAAc,0BACjC,QAAA,QAAQ,MAAM,YACtB;EAEA,MAAM,kBAAuC;GAC3C,OAAO;GACP,IAAI;EACN;;EAGA,MAAM,gBAAgB,IAAI,KAAK;;EAG/B,sBAAsB;GACpB,UAAO,QAAA;GACP;GACA,iCAA8B,QAAA;GAC9B,cAAW,QAAA;GACX,YAAS,QAAA;GACT,OAAO,QAAA;EACT,CAAC;;EAGD,iBAAiB,QAAA,UAAU,eAAe,CAAC,QAAA,WAAW,IAAI;;EAG1D,MAAM,gBAAgB;GACpB,QAAA,SAAS,KAAK,0BAA0B;EAC1C;EAEA,MAAM,WAAW,oBAAoB;GACnC,IAAI,OAAO,WAAW,aACpB,OAAO,OAAO,SAAS;GAEzB,OAAO;EACT,CAAC;EAED,YACQ,QAAA,WAAW,OAChB,SAAS;GAER,SAAS,QAAQ;GAEjB,IAAI,CAAC,MACH,QAAQ;EAEZ,CACF;EAGA,sBAAsB,QAAQ,CAAC;;EAG/B,MAAM,wBAAwB;;EAG9B,MAAM,eAAe,eAEjB,QAAA,gBAAgB,YAAY,6BAC5B,qBACJ;;EAGA,MAAM,4BAA4B,UAChC,QAAA,gBAAgB,OAAO,0BAA0B,KAAK;;;;;;EAOxD,MAAM,cAAc,eACZ,qBAAqB,QAAA,gBAAgB,QAAA,SAAS,KAAK,CAAC,CAAC,WAC7D;EAEA,SAAa;GACX;GACA;EACF,CAAC;;uBAIC,YA6DuB,8BAAA;IA5DpB,KAAK,MAAA,SAAA;IACL,MAAM,MAAA,MAAA;IACN,YAAA,QAAA;;2BAEe,CAAhB,YAAgB,MAAA,YAAA,CAAA,GAIR,QAAA,SAAS,SAAS,QAAA,MAAM,SAAS,QAAA,QAAQ,SAAA,UAAA,GADjD,mBA4CO,QA5CP,YA4CO;KAlCL,YAGsB,MAAA,qBAAA,GAAA;kBAFX,cAAA;iFAAa,QAAA;MACtB,OAAM;MACN,SAAQ;;oBACV,YAYoD,MAAA,eAAA,GAAA;MAV1C,cAAc,aAAA;mFAAY,QAAA,SAUZ,wBAAA;MATJ;MAClB,OAAM;MACL,WAAS,CAAG,QAAA,SAAS,KAAK;MAC1B,UAAA,QAAA;MACA,mBAAa;MACd,QAAO;MACN,cAAc,QAAA,aAAa;MAC3B,YAAY,CAAA;MACZ,cAAY,QAAA,aAAa;;;;;;;kBAVlB,cAAA,KAAa,CAAA,CAAA;KAYvB,YAgBoB,mBAAA;MAfA;MAClB,OAAM;MACL,UAAU,QAAA,SAAS;MACnB,cAAc,QAAA,SAAS,MAAK,sBAAA,EAAyB,QAAI;MACzD,aAAA,YAAA;MACA,UAAA,QAAA;MACA,aAAa,QAAA,aAAa;MAC1B,UAAU,QAAA,WAAW;MACrB,WAAW,QAAA,UAAU;MACtB,QAAO;MACN,QAAQ,QAAA,QAAQ;MAChB,SAAA,QAAA;MACA,MAAM,QAAA,MAAM;MACZ,SAAA,QAAA;MACA,iCAAiC,QAAA,gCAAgC;MACjE,gBAAA,QAAA;;;;;;;;;;;;;;;;wBAGL,mBAMM,OANN,YAMM,CAHJ,mBAES,QAFT,YAES,gBADP,MAAA,SAAA,CAAS,CAAA,oCAAA,CAAA,GAAA,CAAA,CAAA,CAAA,EAAA,CAAA"}