@scalar/api-client 2.0.29 → 2.0.31

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @scalar/api-client
 
+## 2.0.31
+
+### Patch Changes
+
+- 240a618: feat: allow multiple api-clients on single page
+- Updated dependencies [240a618]
+  - @scalar/object-utils@1.1.5
+
+## 2.0.30
+
+### Patch Changes
+
+- b4199e9: fix: api client app clean up (font sizes, spacing, etc)
+- Updated dependencies [a5f3a84]
+- Updated dependencies [9a08f46]
+  - @scalar/components@0.12.19
+  - @scalar/themes@0.9.16
+  - @scalar/oas-utils@0.2.17
+
 ## 2.0.29
 
 ### Patch Changes

package/dist/components/AddressBar/AddressBar.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AddressBar.vue.d.ts","sourceRoot":"","sources":["../../../src/components/AddressBar/AddressBar.vue"],"names":[],"mappings":";AAwkBA,wBAKG"}
+{"version":3,"file":"AddressBar.vue.d.ts","sourceRoot":"","sources":["../../../src/components/AddressBar/AddressBar.vue"],"names":[],"mappings":";AAykBA,wBAKG"}

package/dist/components/AddressBar/AddressBar.vue.js

@@ -1,7 +1,7 @@
 import o from "./AddressBar.vue2.js";
 /* empty css                */
 import r from "../../_virtual/_plugin-vue_export-helper.js";
-const e = /* @__PURE__ */ r(o, [["__scopeId", "data-v-231a70ec"]]);
+const f = /* @__PURE__ */ r(o, [["__scopeId", "data-v-48f9b777"]]);
 export {
-  e as default
+  f as default
 };

package/dist/components/AddressBar/AddressBar.vue2.js

@@ -1,4 +1,4 @@
-import { defineComponent as q, ref as m, watch as V, unref as l, openBlock as B, createElementBlock as I, createElementVNode as o, createVNode as r, withCtx as _, normalizeClass as b, normalizeStyle as R, createCommentVNode as z, pushScopeId as M, popScopeId as U } from "vue";
+import { defineComponent as q, ref as c, watch as V, unref as l, openBlock as B, createElementBlock as I, createElementVNode as o, createVNode as s, withCtx as _, normalizeClass as b, normalizeStyle as R, createCommentVNode as z, pushScopeId as M, popScopeId as U } from "vue";
 import $ from "../CodeInput/CodeInput.vue.js";
 import { useWorkspace as O } from "../../store/workspace.js";
 import { Listbox as H } from "@headlessui/vue";
@@ -8,11 +8,11 @@ import { isMacOS as A } from "@scalar/use-tooltip";
 import { useMagicKeys as D, whenever as K } from "@vueuse/core";
 import Q from "../HttpMethod/HttpMethod.vue.js";
 import W from "./AddressBarHistory.vue.js";
-import { executeRequestBus as c } from "../../libs/eventBusses/executeRequestBus.js";
-const f = (n) => (M("data-v-231a70ec"), n = n(), U(), n), j = {
+import { executeRequestBus as m } from "../../libs/eventBusses/executeRequestBus.js";
+const f = (n) => (M("data-v-48f9b777"), n = n(), U(), n), j = {
   key: 0,
   class: "order-last lg:order-none lg:w-auto w-full"
-}, F = { class: "m-auto flex basis-1/2 flex-row items-center" }, G = { class: "pointer-events-none absolute left-0 top-0 z-10 block h-full w-full overflow-hidden" }, J = { class: "flex gap-1" }, P = { class: "scroll-timeline-x scroll-timeline-x-hidden relative flex w-full" }, X = /* @__PURE__ */ f(() => /* @__PURE__ */ o("div", { class: "fade-left" }, null, -1)), Y = /* @__PURE__ */ f(() => /* @__PURE__ */ o("div", { class: "fade-right" }, null, -1)), Z = /* @__PURE__ */ f(() => /* @__PURE__ */ o("span", { class: "text-xxs relative z-10 lg:flex hidden" }, "Send", -1)), me = /* @__PURE__ */ q({
+}, F = { class: "m-auto flex basis-1/2 flex-row items-center" }, G = { class: "pointer-events-none absolute left-0 top-0 z-10 block h-full w-full overflow-hidden" }, J = { class: "flex gap-1" }, P = { class: "scroll-timeline-x scroll-timeline-x-hidden relative flex w-full" }, X = /* @__PURE__ */ f(() => /* @__PURE__ */ o("div", { class: "fade-left" }, null, -1)), Y = /* @__PURE__ */ f(() => /* @__PURE__ */ o("div", { class: "fade-right" }, null, -1)), Z = /* @__PURE__ */ f(() => /* @__PURE__ */ o("span", { class: "text-xxs relative z-10 lg:flex hidden" }, "Send", -1)), ce = /* @__PURE__ */ q({
   __name: "AddressBar",
   setup(n) {
     const {
@@ -22,10 +22,10 @@ const f = (n) => (M("data-v-231a70ec"), n = n(), U(), n), j = {
       requestMutators: v,
       requestExampleMutators: g,
       requestsHistory: w
-    } = O(), x = m(w.value[0]), h = D();
+    } = O(), x = c(w.value[0]), h = D();
     K(
       A() ? h.meta_enter : h.ctrl_enter,
-      () => c.emit()
+      () => m.emit()
     );
     const k = (e) => {
       !t.value || t.value.path === e || v.edit(t.value.uid, "path", e);
@@ -39,8 +39,8 @@ const f = (n) => (M("data-v-231a70ec"), n = n(), U(), n), j = {
         t.value && k(e);
       }
     );
-    const d = m(100), u = m(!1);
-    c.on(() => {
+    const d = c(100), u = c(!1);
+    m.on(() => {
       if (u.value) return;
       u.value = !0;
       const e = setInterval(() => {
@@ -58,18 +58,18 @@ const f = (n) => (M("data-v-231a70ec"), n = n(), U(), n), j = {
     const y = (e) => {
       i.value && g.edit(i.value.uid, "url", e);
     };
-    return (e, a) => l(t) && l(i) ? (B(), I("div", j, [
+    return (e, r) => l(t) && l(i) ? (B(), I("div", j, [
       o("div", F, [
-        r(l(H), {
+        s(l(H), {
           modelValue: x.value,
-          "onUpdate:modelValue": a[2] || (a[2] = (s) => x.value = s)
+          "onUpdate:modelValue": r[2] || (r[2] = (a) => x.value = a)
         }, {
-          default: _(({ open: s }) => [
+          default: _(({ open: a }) => [
             o("div", {
               class: b([
                 "text-xxs bg-b-1 relative flex w-full lg:min-w-[720px] lg:max-w-[720px] order-last lg:order-none flex-1 flex-row items-stretch rounded border p-[3px]",
-                { "rounded-b-none": s },
-                { "border-transparent": s }
+                { "rounded-b-none": a },
+                { "border-transparent": a }
               ])
             }, [
               o("div", G, [
@@ -79,7 +79,7 @@ const f = (n) => (M("data-v-231a70ec"), n = n(), U(), n), j = {
                 }, null, 6)
               ]),
               o("div", J, [
-                r(Q, {
+                s(Q, {
                   class: "font-code text-xxs font-medium",
                   isEditable: !l(p),
                   isSquare: "",
@@ -89,7 +89,7 @@ const f = (n) => (M("data-v-231a70ec"), n = n(), U(), n), j = {
               ]),
               o("div", P, [
                 X,
-                r($, {
+                s($, {
                   disableCloseBrackets: "",
                   disabled: l(p),
                   disableEnter: "",
@@ -98,19 +98,19 @@ const f = (n) => (M("data-v-231a70ec"), n = n(), U(), n), j = {
                   modelValue: l(i).url,
                   placeholder: "Enter URL to get started",
                   server: "",
-                  onSubmit: a[0] || (a[0] = (C) => l(c).emit()),
+                  onSubmit: r[0] || (r[0] = (C) => l(m).emit()),
                   "onUpdate:modelValue": y
                 }, null, 8, ["disabled", "modelValue"]),
                 Y
               ]),
-              r(W, { open: s }, null, 8, ["open"]),
-              r(l(N), {
-                class: "relative h-auto shrink-0 gap-1 overflow-hidden pl-2 pr-2.5 py-1 z-[1]",
+              s(W, { open: a }, null, 8, ["open"]),
+              s(l(N), {
+                class: "relative h-auto shrink-0 gap-1 overflow-hidden pl-2 pr-2.5 py-1 z-[1] font-bold",
                 disabled: u.value,
-                onClick: a[1] || (a[1] = (C) => l(c).emit())
+                onClick: r[1] || (r[1] = (C) => l(m).emit())
               }, {
                 default: _(() => [
-                  r(l(T), {
+                  s(l(T), {
                     class: "relative z-10 shrink-0 fill-current",
                     icon: "Play",
                     size: "xs"
@@ -128,5 +128,5 @@ const f = (n) => (M("data-v-231a70ec"), n = n(), U(), n), j = {
   }
 });
 export {
-  me as default
+  ce as default
 };

package/dist/components/AddressBar/AddressBarHistory.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AddressBarHistory.vue.d.ts","sourceRoot":"","sources":["../../../src/components/AddressBar/AddressBarHistory.vue"],"names":[],"mappings":";UAkHQ,OAAO;;UAAP,OAAO;;AA4Of,wBAMG;AAOH,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AAC5D,KAAK,uBAAuB,CAAC,CAAC,IAAI;KAChC,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GACpC;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAC9D;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CACzD,CAAC"}
+{"version":3,"file":"AddressBarHistory.vue.d.ts","sourceRoot":"","sources":["../../../src/components/AddressBar/AddressBarHistory.vue"],"names":[],"mappings":";UA4GQ,OAAO;;UAAP,OAAO;;AAwOf,wBAMG;AAOH,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AAC5D,KAAK,uBAAuB,CAAC,CAAC,IAAI;KAChC,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GACpC;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAC9D;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CACzD,CAAC"}

package/dist/components/CodeInput/CodeInput.vue.d.ts

@@ -61,16 +61,16 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__
     withVariables: boolean;
     withServers: boolean;
 }>>> & {
-    onSubmit?: ((v: string) => any) | undefined;
     "onUpdate:modelValue"?: ((v: string) => any) | undefined;
+    onSubmit?: ((v: string) => any) | undefined;
 }, {
-    nullable: boolean;
     withServers: boolean;
     colorPicker: boolean;
     emitOnBlur: boolean;
     disableTabIndent: boolean;
     disableEnter: boolean;
     disableCloseBrackets: boolean;
+    nullable: boolean;
     withVariables: boolean;
 }, {}>, {
     warning?(_: {}): any;

package/dist/components/CodeInput/CodeInput.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CodeInput.vue.d.ts","sourceRoot":"","sources":["../../../src/components/CodeInput/CodeInput.vue"],"names":[],"mappings":"AAAA,OA6RO,EAGL,KAAK,kBAAkB,EAExB,MAAM,wBAAwB,CAAA;;kBAeb,OAAO;gBACT,MAAM,GAAG,MAAM;YACnB,OAAO;iBACF,OAAO;kBACN,OAAO;WACd,OAAO;uBACK,OAAO;eACf,kBAAkB;wBACT,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI;wBACnB,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI;kBACzB,MAAM;eACT,OAAO;mBACH,OAAO;2BACC,OAAO;WACvB,MAAM,EAAE;WACR,MAAM;eACF,OAAO;oBACF,OAAO;kBACT,OAAO;;;;;;;;;;;;;;kBAlBP,OAAO;gBACT,MAAM,GAAG,MAAM;YACnB,OAAO;iBACF,OAAO;kBACN,OAAO;WACd,OAAO;uBACK,OAAO;eACf,kBAAkB;wBACT,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI;wBACnB,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI;kBACzB,MAAM;eACT,OAAO;mBACH,OAAO;2BACC,OAAO;WACvB,MAAM,EAAE;WACR,MAAM;eACF,OAAO;oBACF,OAAO;kBACT,OAAO;;;;;;;;;;;;;;cAFV,OAAO;iBAEJ,OAAO;iBAlBP,OAAO;gBAGR,OAAO;sBAGD,OAAO;kBAMX,OAAO;0BACC,OAAO;mBAId,OAAO;;qBA8PG,GAAG;kBACN,GAAG;;AAnR9B,wBAsTC;AAMD,KAAK,kBAAkB,CAAC,CAAC,EAAE,CAAC,IAAI;KAC1B,CAAC,IAAI,MAAM,IAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,SAAS,MAAM,CAAC,GAC7C,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;QAAE,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;KAAC,CAAC,GACvC,CAAC,CAAC,CAAC,CAAC;CACP,CAAC;AAEN,KAAK,cAAc,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC;AAExD,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACpC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC;AAEN,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AAC5D,KAAK,uBAAuB,CAAC,CAAC,IAAI;KAChC,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GACpC;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAC9D;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CACzD,CAAC"}
+{"version":3,"file":"CodeInput.vue.d.ts","sourceRoot":"","sources":["../../../src/components/CodeInput/CodeInput.vue"],"names":[],"mappings":"AAAA,OA6SO,EAGL,KAAK,kBAAkB,EAExB,MAAM,wBAAwB,CAAA;;kBAeb,OAAO;gBACT,MAAM,GAAG,MAAM;YACnB,OAAO;iBACF,OAAO;kBACN,OAAO;WACd,OAAO;uBACK,OAAO;eACf,kBAAkB;wBACT,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI;wBACnB,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI;kBACzB,MAAM;eACT,OAAO;mBACH,OAAO;2BACC,OAAO;WACvB,MAAM,EAAE;WACR,MAAM;eACF,OAAO;oBACF,OAAO;kBACT,OAAO;;;;;;;;;;;;;;kBAlBP,OAAO;gBACT,MAAM,GAAG,MAAM;YACnB,OAAO;iBACF,OAAO;kBACN,OAAO;WACd,OAAO;uBACK,OAAO;eACf,kBAAkB;wBACT,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI;wBACnB,CAAC,CAAC,EAAE,MAAM,KAAK,IAAI;kBACzB,MAAM;eACT,OAAO;mBACH,OAAO;2BACC,OAAO;WACvB,MAAM,EAAE;WACR,MAAM;eACF,OAAO;oBACF,OAAO;kBACT,OAAO;;;;;;;;;;;;;;iBAAP,OAAO;iBAlBP,OAAO;gBAGR,OAAO;sBAGD,OAAO;kBAMX,OAAO;0BACC,OAAO;cAGnB,OAAO;mBACF,OAAO;;qBA+QG,GAAG;kBACN,GAAG;;AApS9B,wBAuUC;AAMD,KAAK,kBAAkB,CAAC,CAAC,EAAE,CAAC,IAAI;KAC1B,CAAC,IAAI,MAAM,IAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,SAAS,MAAM,CAAC,GAC7C,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;QAAE,OAAO,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;KAAC,CAAC,GACvC,CAAC,CAAC,CAAC,CAAC;CACP,CAAC;AAEN,KAAK,cAAc,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC;AAExD,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACpC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC;AAEN,KAAK,sBAAsB,CAAC,CAAC,IAAI,CAAC,SAAS,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;AAC5D,KAAK,uBAAuB,CAAC,CAAC,IAAI;KAChC,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,EAAE,SAAS,IAAI,CAAC,CAAC,EAAE,CAAC,CAAC,GACpC;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;KAAE,GAC9D;QAAE,IAAI,EAAE,OAAO,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QAAC,QAAQ,EAAE,IAAI,CAAA;KAAE;CACzD,CAAC"}

package/dist/components/CodeInput/CodeInput.vue.js

@@ -2,7 +2,7 @@ import o from "./CodeInput.vue2.js";
 /* empty css               */
 /* empty css               */
 import t from "../../_virtual/_plugin-vue_export-helper.js";
-const _ = /* @__PURE__ */ t(o, [["__scopeId", "data-v-a5840d90"]]);
+const f = /* @__PURE__ */ t(o, [["__scopeId", "data-v-5c73f0cd"]]);
 export {
-  _ as default
+  f as default
 };

package/dist/components/CodeInput/CodeInput.vue2.js

@@ -1,20 +1,20 @@
-import { defineComponent as S, useAttrs as P, ref as b, toRef as o, watch as O, computed as $, openBlock as t, createElementBlock as i, Fragment as R, createBlock as h, mergeProps as q, unref as E, renderSlot as y, createCommentVNode as g } from "vue";
-import { useCodeMirror as I, colorPicker as M } from "@scalar/use-codemirror";
-import { nanoid as N } from "nanoid";
-import B from "../DataTable/DataTableInputSelect.vue.js";
-import { dropdownPlugin as T } from "./codeDropdownWidget.js";
-import { pillPlugin as A, backspaceCommand as U } from "./codeVariableWidget.js";
-import { useWorkspace as W } from "../../store/workspace.js";
-const j = ["id"], z = {
+import { defineComponent as $, useAttrs as E, ref as y, toRef as o, watch as q, computed as I, openBlock as t, createElementBlock as s, Fragment as M, createBlock as g, mergeProps as N, unref as T, renderSlot as v, createCommentVNode as B } from "vue";
+import { useCodeMirror as A, colorPicker as U } from "@scalar/use-codemirror";
+import { nanoid as W } from "nanoid";
+import V from "../DataTable/DataTableInputSelect.vue.js";
+import { dropdownPlugin as j } from "./codeDropdownWidget.js";
+import { pillPlugin as z, backspaceCommand as D } from "./codeVariableWidget.js";
+import { useWorkspace as G } from "../../store/workspace.js";
+const H = ["id"], J = {
   key: 3,
   class: "absolute centered-y right-7 text-orange text-xs"
-}, D = {
+}, K = {
   key: 4,
-  class: "required absolute centered-y right-0 pt-px pr-2 text-xxs text-c-3 bg-b-1 shadow-[-8px_0_4px_var(--scalar-background-1)] opacity-100 duration-150 transition-opacity peer-has-[.cm-focused]:opacity-0"
-}, G = {
+  class: "required absolute centered-y right-0 pt-px pr-2 text-xxs text-c-3 bg-b-1 shadow-[-8px_0_4px_var(--scalar-background-1)] opacity-100 duration-150 transition-opacity peer-has-[.cm-focused]:opacity-0 pointer-events-none"
+}, L = {
   inheritAttrs: !1
-}, Z = /* @__PURE__ */ S({
-  ...G,
+}, te = /* @__PURE__ */ $({
+  ...L,
   __name: "CodeInput",
   props: {
     colorPicker: { type: Boolean, default: !1 },
@@ -38,76 +38,91 @@ const j = ["id"], z = {
     withServers: { type: Boolean, default: !1 }
   },
   emits: ["submit", "update:modelValue"],
-  setup(v, { emit: V }) {
-    var m;
-    const e = v, a = V, d = P(), k = d.id || `id-${N()}`, p = b(!1), { activeWorkspace: w } = W();
-    function C(l) {
-      return l === e.modelValue ? null : e.handleFieldChange ? e.handleFieldChange(l) : a("update:modelValue", l);
+  setup(k, { emit: w }) {
+    var b;
+    const e = k, n = w, d = E(), C = d.id || `id-${W()}`, p = y(!1), {
+      activeWorkspace: _,
+      activeParsedEnvironments: c,
+      isReadOnly: x,
+      environments: m,
+      router: F
+    } = G();
+    function S(l) {
+      return l === e.modelValue ? null : e.handleFieldChange ? e.handleFieldChange(l) : n("update:modelValue", l);
     }
-    function _(l) {
-      return e.handleFieldSubmit ? e.handleFieldSubmit(l) : a("submit", l);
+    function P(l) {
+      return e.handleFieldSubmit ? e.handleFieldSubmit(l) : n("submit", l);
     }
-    function x(l) {
-      p.value = !1, e.emitOnBlur && e.modelValue && _(l);
+    function O(l) {
+      p.value = !1, e.emitOnBlur && e.modelValue && P(l);
     }
-    const n = [];
-    e.colorPicker && n.push(M), e.withVariables && !w.value.isReadOnly && n.push(T({ withServers: e.withServers })), n.push(A, U);
-    const c = b(null), { codeMirror: r } = I({
+    const a = [];
+    e.colorPicker && a.push(U), e.withVariables && !_.value.isReadOnly && a.push(
+      j({
+        withServers: e.withServers,
+        activeParsedEnvironments: c,
+        environments: m,
+        router: F
+      })
+    ), a.push(
+      z({ environments: m, activeParsedEnvironments: c, isReadOnly: x })
+    ), a.push(D);
+    const f = y(null), { codeMirror: r } = A({
       content: o(
         () => e.modelValue !== void 0 ? String(e.modelValue) : ""
       ),
-      onChange: C,
+      onChange: S,
       onFocus: () => p.value = !0,
-      onBlur: (l) => x(l),
-      codeMirrorRef: c,
+      onBlur: (l) => O(l),
+      codeMirrorRef: f,
       disableTabIndent: o(() => e.disableTabIndent),
       disableEnter: o(() => e.disableEnter),
       disableCloseBrackets: o(() => e.disableCloseBrackets),
       lineNumbers: o(() => e.lineNumbers),
       language: o(() => e.language),
       lint: o(() => e.lint),
-      extensions: n,
+      extensions: a,
       placeholder: o(() => e.placeholder)
     });
-    (m = r.value) == null || m.focus(), O(r, () => {
+    (b = r.value) == null || b.focus(), q(r, () => {
       r.value && Object.prototype.hasOwnProperty.call(d, "autofocus") && r.value.focus();
     });
-    const F = $(() => {
+    const R = I(() => {
       var l;
       return e.type === "boolean" || (l = e.type) != null && l.includes("boolean") || e.nullable ? ["true", "false", "null"] : ["true", "false"];
     });
     return (l, u) => {
-      var f;
-      return t(), i(R, null, [
-        e.enum && e.enum.length ? (t(), h(B, {
+      var h;
+      return t(), s(M, null, [
+        e.enum && e.enum.length ? (t(), g(V, {
           key: 0,
           modelValue: e.modelValue,
           value: e.enum,
-          "onUpdate:modelValue": u[0] || (u[0] = (s) => a("update:modelValue", s))
-        }, null, 8, ["modelValue", "value"])) : e.type === "boolean" || (f = e.type) != null && f.includes("boolean") ? (t(), h(B, {
+          "onUpdate:modelValue": u[0] || (u[0] = (i) => n("update:modelValue", i))
+        }, null, 8, ["modelValue", "value"])) : e.type === "boolean" || (h = e.type) != null && h.includes("boolean") ? (t(), g(V, {
           key: 1,
           modelValue: e.modelValue,
-          value: F.value,
-          "onUpdate:modelValue": u[1] || (u[1] = (s) => a("update:modelValue", s))
-        }, null, 8, ["modelValue", "value"])) : (t(), i("div", q({
+          value: R.value,
+          "onUpdate:modelValue": u[1] || (u[1] = (i) => n("update:modelValue", i))
+        }, null, 8, ["modelValue", "value"])) : (t(), s("div", N({
           key: 2,
-          id: E(k)
+          id: T(C)
         }, l.$attrs, {
           ref_key: "codeMirrorRef",
-          ref: c,
+          ref: f,
           class: ["peer font-code w-full whitespace-nowrap text-xs leading-[1.44] relative", {
             "flow-code-input--error": l.error
           }]
-        }), null, 16, j)),
-        l.$slots.warning ? (t(), i("div", z, [
-          y(l.$slots, "warning", {}, void 0, !0)
-        ])) : g("", !0),
-        y(l.$slots, "icon", {}, void 0, !0),
-        l.required ? (t(), i("div", D, " Required ")) : g("", !0)
+        }), null, 16, H)),
+        l.$slots.warning ? (t(), s("div", J, [
+          v(l.$slots, "warning", {}, void 0, !0)
+        ])) : B("", !0),
+        v(l.$slots, "icon", {}, void 0, !0),
+        l.required ? (t(), s("div", K, " Required ")) : B("", !0)
       ], 64);
     };
   }
 });
 export {
-  Z as default
+  te as default
 };

package/dist/components/CodeInput/codeDropdownWidget.d.ts

@@ -1,10 +1,15 @@
+import type { WorkspaceStore } from '../../store/index.js';
 import { type DecorationSet, type EditorView, ViewPlugin, type ViewUpdate, WidgetType } from '@scalar/use-codemirror';
+import type { Router } from 'vue-router';
 declare class DropdownWidget extends WidgetType {
     private queryTerm;
     private onSelect;
     private dropdown;
     private withServers?;
-    constructor(queryTerm: string, onSelect: (item: string) => void, withServers?: boolean);
+    private activeParsedEnvironments;
+    private environments;
+    private router;
+    constructor(queryTerm: string, onSelect: (item: string) => void, activeParsedEnvironments: WorkspaceStore['activeParsedEnvironments'], environments: WorkspaceStore['environments'], router: Router, withServers?: boolean);
     updateQueryTerm(newQueryTerm: string): void;
     getQueryTerm(): string;
     toDOM(view: EditorView): HTMLSpanElement;
@@ -13,6 +18,9 @@ declare class DropdownWidget extends WidgetType {
 }
 export declare const dropdownPlugin: (props: {
     withServers?: boolean;
+    activeParsedEnvironments: WorkspaceStore["activeParsedEnvironments"];
+    environments: WorkspaceStore["environments"];
+    router: Router;
 }) => ViewPlugin<{
     decorations: DecorationSet;
     widget: DropdownWidget | null;

package/dist/components/CodeInput/codeDropdownWidget.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"codeDropdownWidget.d.ts","sourceRoot":"","sources":["../../../src/components/CodeInput/codeDropdownWidget.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,KAAK,aAAa,EAClB,KAAK,UAAU,EAEf,UAAU,EACV,KAAK,UAAU,EACf,UAAU,EACX,MAAM,wBAAwB,CAAA;AAK/B,cAAM,cAAe,SAAQ,UAAU;IACrC,OAAO,CAAC,SAAS,CAAQ;IACzB,OAAO,CAAC,QAAQ,CAAwB;IACxC,OAAO,CAAC,QAAQ,CAAY;IAC5B,OAAO,CAAC,WAAW,CAAC,CAAS;gBAG3B,SAAS,EAAE,MAAM,EACjB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,EAChC,WAAW,CAAC,EAAE,OAAO;IAQvB,eAAe,CAAC,YAAY,EAAE,MAAM;IAMpC,YAAY;IAIZ,KAAK,CAAC,IAAI,EAAE,UAAU;IAoCtB,OAAO;IAOP,EAAE,CAAC,KAAK,EAAE,UAAU;CAGrB;AAED,eAAO,MAAM,cAAc,UAAW;IAAE,WAAW,CAAC,EAAE,OAAO,CAAA;CAAE;iBAG5C,aAAa;YAClB,cAAc,GAAG,IAAI;UACvB,UAAU;+BAQW,MAAM;mBAqClB,UAAU;EAsC5B,CAAA"}
+{"version":3,"file":"codeDropdownWidget.d.ts","sourceRoot":"","sources":["../../../src/components/CodeInput/codeDropdownWidget.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAC7C,OAAO,EAEL,KAAK,aAAa,EAClB,KAAK,UAAU,EAEf,UAAU,EACV,KAAK,UAAU,EACf,UAAU,EACX,MAAM,wBAAwB,CAAA;AAE/B,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AAIxC,cAAM,cAAe,SAAQ,UAAU;IACrC,OAAO,CAAC,SAAS,CAAQ;IACzB,OAAO,CAAC,QAAQ,CAAwB;IACxC,OAAO,CAAC,QAAQ,CAAY;IAC5B,OAAO,CAAC,WAAW,CAAC,CAAS;IAC7B,OAAO,CAAC,wBAAwB,CAA4C;IAC5E,OAAO,CAAC,YAAY,CAAgC;IACpD,OAAO,CAAC,MAAM,CAAQ;gBAGpB,SAAS,EAAE,MAAM,EACjB,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,EAChC,wBAAwB,EAAE,cAAc,CAAC,0BAA0B,CAAC,EACpE,YAAY,EAAE,cAAc,CAAC,cAAc,CAAC,EAC5C,MAAM,EAAE,MAAM,EACd,WAAW,CAAC,EAAE,OAAO;IAWvB,eAAe,CAAC,YAAY,EAAE,MAAM;IAMpC,YAAY;IAIZ,KAAK,CAAC,IAAI,EAAE,UAAU;IAuCtB,OAAO;IAOP,EAAE,CAAC,KAAK,EAAE,UAAU;CAGrB;AAED,eAAO,MAAM,cAAc,UAAW;IACpC,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,wBAAwB,EAAE,cAAc,CAAC,0BAA0B,CAAC,CAAA;IACpE,YAAY,EAAE,cAAc,CAAC,cAAc,CAAC,CAAA;IAC5C,MAAM,EAAE,MAAM,CAAA;CACf;iBAGkB,aAAa;YAClB,cAAc,GAAG,IAAI;UACvB,UAAU;+BAQW,MAAM;mBAwClB,UAAU;EAyC5B,CAAA"}

package/dist/components/CodeInput/codeDropdownWidget.js

@@ -1,18 +1,20 @@
-var m = Object.defineProperty;
-var g = (d, t, e) => t in d ? m(d, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : d[t] = e;
-var n = (d, t, e) => g(d, typeof t != "symbol" ? t + "" : t, e);
-import { router as f } from "../../router.js";
-import { ViewPlugin as y, Decoration as h, StateEffect as T, WidgetType as S } from "@scalar/use-codemirror";
-import { createApp as q, h as p, Teleport as x } from "vue";
-import v from "../../views/Environment/EnvironmentVariableDropdown.vue.js";
-class u extends S {
-  constructor(e, s, o) {
+var g = Object.defineProperty;
+var f = (s, t, e) => t in s ? g(s, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : s[t] = e;
+var o = (s, t, e) => f(s, typeof t != "symbol" ? t + "" : t, e);
+import { ViewPlugin as p, Decoration as h, StateEffect as v, WidgetType as y } from "@scalar/use-codemirror";
+import { createApp as T, h as w, Teleport as S } from "vue";
+import q from "../../views/Environment/EnvironmentVariableDropdown.vue.js";
+class u extends y {
+  constructor(e, i, d, n, c, r) {
     super();
-    n(this, "queryTerm");
-    n(this, "onSelect");
-    n(this, "dropdown", null);
-    n(this, "withServers");
-    this.queryTerm = e, this.onSelect = s, this.withServers = o;
+    o(this, "queryTerm");
+    o(this, "onSelect");
+    o(this, "dropdown", null);
+    o(this, "withServers");
+    o(this, "activeParsedEnvironments");
+    o(this, "environments");
+    o(this, "router");
+    this.queryTerm = e, this.onSelect = i, this.withServers = r, this.activeParsedEnvironments = d, this.environments = n, this.router = c;
   }
   updateQueryTerm(e) {
     this.queryTerm !== e && (this.queryTerm = e);
@@ -21,28 +23,31 @@ class u extends S {
     return this.queryTerm;
   }
   toDOM(e) {
-    const s = document.createElement("span");
-    return s.style.position = "fixed", setTimeout(() => {
+    const i = document.createElement("span");
+    return i.style.position = "fixed", setTimeout(() => {
       var c;
-      const o = e.state.selection.main.head, i = e.coordsAtPos(o - this.queryTerm.length - 2);
-      if (i) {
+      const d = e.state.selection.main.head, n = e.coordsAtPos(d - this.queryTerm.length - 2);
+      if (n) {
         const r = (c = document.querySelector(".scalar-client")) == null ? void 0 : c.getBoundingClientRect();
-        r && (this.dropdown = q({
-          render: () => p(x, { to: ".scalar-client" }, [
-            p(v, {
+        r && (this.dropdown = T({
+          render: () => w(S, { to: ".scalar-client" }, [
+            w(q, {
               query: this.queryTerm,
               onSelect: this.onSelect,
               withServers: this.withServers,
+              activeParsedEnvironments: this.activeParsedEnvironments,
+              environments: this.environments,
+              router: this.router,
               style: {
                 position: "absolute",
-                left: `${i.left - r.left}px`,
-                top: `calc(${i.bottom - r.top}px + 6px)`
+                left: `${n.left - r.left}px`,
+                top: `calc(${n.bottom - r.top}px + 6px)`
               }
             })
           ])
-        })), this.dropdown.use(f), this.dropdown.mount(s);
+        })), this.dropdown.use(this.router), this.dropdown.mount(i);
       }
-    }, 0), s;
+    }, 0), i;
   }
   destroy() {
     this.dropdown && (this.dropdown.unmount(), this.dropdown = null);
@@ -51,54 +56,60 @@ class u extends S {
     return e instanceof u && this.queryTerm === e.queryTerm;
   }
 }
-const P = (d) => y.fromClass(
+const C = (s) => p.fromClass(
   class {
     constructor(t) {
-      n(this, "decorations");
-      n(this, "widget", null);
-      n(this, "view");
+      o(this, "decorations");
+      o(this, "widget", null);
+      o(this, "view");
       this.view = t, this.decorations = h.none, this.handleDropdownSelect = this.handleDropdownSelect.bind(this);
     }
     handleDropdownSelect(t) {
-      var w;
+      var m;
       if (!this.widget) return;
-      const { state: e, dispatch: s } = this.view, o = e.selection.main.head, i = Math.max(0, o - this.widget.getQueryTerm().length - 2), c = o, r = `{{${t}}}`;
-      s({
-        changes: { from: i, to: c, insert: r }
-      }), (w = this.widget) == null || w.destroy(), this.widget = null, this.decorations = h.none, this.view.dispatch({
-        effects: T.appendConfig.of([])
+      const { state: e, dispatch: i } = this.view, d = e.selection.main.head, n = Math.max(0, d - this.widget.getQueryTerm().length - 2), c = d, r = `{{${t}}}`;
+      i({
+        changes: { from: n, to: c, insert: r }
+      }), (m = this.widget) == null || m.destroy(), this.widget = null, this.decorations = h.none, this.view.dispatch({
+        effects: v.appendConfig.of([])
       });
-      const l = i + r.length, a = "";
+      const a = n + r.length, l = "";
       this.widget = new u(
-        a,
+        l,
         this.handleDropdownSelect,
-        d.withServers
+        s.activeParsedEnvironments,
+        s.environments,
+        s.router,
+        s.withServers
       ), this.decorations = h.set([
         h.widget({
           widget: this.widget,
           side: 1
-        }).range(l)
+        }).range(a)
       ]), this.view.dispatch({
-        selection: { anchor: l }
+        selection: { anchor: a }
       }), this.view.focus();
     }
     update(t) {
-      var r, l;
-      const e = t.state.selection.main.head, s = t.state.doc.sliceString(0, e), o = [], i = s.lastIndexOf("{{"), c = s.lastIndexOf("}}");
-      if (i > c) {
-        const a = s.slice(i + 2);
-        !this.widget || this.widget.getQueryTerm() !== a ? ((r = this.widget) == null || r.destroy(), this.widget = new u(
-          a,
-          this.handleDropdownSelect
-        )) : this.widget.updateQueryTerm(a), o.push(
+      var r, a;
+      const e = t.state.selection.main.head, i = t.state.doc.sliceString(0, e), d = [], n = i.lastIndexOf("{{"), c = i.lastIndexOf("}}");
+      if (n > c) {
+        const l = i.slice(n + 2);
+        !this.widget || this.widget.getQueryTerm() !== l ? ((r = this.widget) == null || r.destroy(), this.widget = new u(
+          l,
+          this.handleDropdownSelect,
+          s.activeParsedEnvironments,
+          s.environments,
+          s.router
+        )) : this.widget.updateQueryTerm(l), d.push(
           h.widget({
             widget: this.widget,
             side: 1
           }).range(e)
         );
       } else
-        (l = this.widget) == null || l.destroy(), this.widget = null;
-      this.decorations = h.set(o);
+        (a = this.widget) == null || a.destroy(), this.widget = null;
+      this.decorations = h.set(d);
     }
   },
   {
@@ -106,5 +117,5 @@ const P = (d) => y.fromClass(
   }
 );
 export {
-  P as dropdownPlugin
+  C as dropdownPlugin
 };

package/dist/components/CodeInput/codeVariableWidget.d.ts

@@ -1,8 +1,17 @@
+import type { WorkspaceStore } from '../../store/workspace.js';
+import type { Environment } from '@scalar/oas-utils/entities/workspace/environment';
 import { Decoration, type DecorationSet, EditorView, ViewPlugin, type ViewUpdate } from '@scalar/use-codemirror';
-export declare const pillPlugin: ViewPlugin<{
+type ActiveParsedEnvironments = WorkspaceStore['activeParsedEnvironments'];
+type IsReadOnly = WorkspaceStore['isReadOnly'];
+export declare const pillPlugin: (props: {
+    environments: Record<string, Environment>;
+    activeParsedEnvironments: ActiveParsedEnvironments;
+    isReadOnly: IsReadOnly;
+}) => ViewPlugin<{
     decorations: DecorationSet;
     update(update: ViewUpdate): void;
     buildDecorations(view: EditorView): import("@codemirror/state").RangeSet<Decoration>;
 }>;
 export declare const backspaceCommand: import("@codemirror/state").Extension;
+export {};
 //# sourceMappingURL=codeVariableWidget.d.ts.map

package/dist/components/CodeInput/codeVariableWidget.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"codeVariableWidget.d.ts","sourceRoot":"","sources":["../../../src/components/CodeInput/codeVariableWidget.ts"],"names":[],"mappings":"AAGA,OAAO,EACL,UAAU,EACV,KAAK,aAAa,EAClB,UAAU,EAEV,UAAU,EACV,KAAK,UAAU,EAEhB,MAAM,wBAAwB,CAAA;AAqH/B,eAAO,MAAM,UAAU;iBAEN,aAAa;mBAMX,UAAU;2BAMF,UAAU;EA6BpC,CAAA;AAED,eAAO,MAAM,gBAAgB,uCAmB3B,CAAA"}
+{"version":3,"file":"codeVariableWidget.d.ts","sourceRoot":"","sources":["../../../src/components/CodeInput/codeVariableWidget.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAEvD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,kDAAkD,CAAA;AACnF,OAAO,EACL,UAAU,EACV,KAAK,aAAa,EAClB,UAAU,EAEV,UAAU,EACV,KAAK,UAAU,EAEhB,MAAM,wBAAwB,CAAA;AAuB/B,KAAK,wBAAwB,GAAG,cAAc,CAAC,0BAA0B,CAAC,CAAA;AAC1E,KAAK,UAAU,GAAG,cAAc,CAAC,YAAY,CAAC,CAAA;AA2G9C,eAAO,MAAM,UAAU,UAAW;IAChC,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAA;IACzC,wBAAwB,EAAE,wBAAwB,CAAA;IAClD,UAAU,EAAE,UAAU,CAAA;CACvB;iBAGkB,aAAa;mBAMX,UAAU;2BAMF,UAAU;EAkCpC,CAAA;AAEH,eAAO,MAAM,gBAAgB,uCAmB3B,CAAA"}