@scalar/api-client 2.2.37 → 2.2.39

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

@@ -1,29 +1,29 @@
-import { defineComponent as _, useAttrs as J, ref as i, toRef as s, watch as L, computed as Q, openBlock as n, createElementBlock as u, Fragment as G, createElementVNode as h, toDisplayString as H, createBlock as w, mergeProps as X, unref as a, withKeys as V, withModifiers as $, createVNode as Y, createCommentVNode as c, renderSlot as q } from "vue";
-import { useCodeMirror as Z, useDropdown as ee, colorPicker as oe } from "@scalar/use-codemirror";
+import { defineComponent as W, useAttrs as J, ref as d, toRef as s, watch as Q, computed as G, openBlock as n, createElementBlock as i, Fragment as H, createElementVNode as w, toDisplayString as X, createBlock as f, mergeProps as Y, unref as a, withKeys as V, withModifiers as $, createVNode as Z, createCommentVNode as c, renderSlot as q } from "vue";
+import { useCodeMirror as _, useDropdown as ee, colorPicker as oe } from "@scalar/use-codemirror";
 import { nanoid as le } from "nanoid";
-import R from "../DataTable/DataTableInputSelect.vue.js";
+import g from "../DataTable/DataTableInputSelect.vue.js";
 import { pillPlugin as te, backspaceCommand as ne } from "./codeVariableWidget.js";
 import ae from "../../views/Environment/EnvironmentVariableDropdown.vue.js";
 import { useClipboard as re } from "@scalar/use-hooks/useClipboard";
 import { ScalarIcon as se } from "@scalar/components";
-import { prettyPrintJson as ie } from "@scalar/oas-utils/helpers";
-import { useActiveEntities as ue } from "../../store/active-entities.js";
-import { useWorkspace as de } from "../../store/store.js";
+import { prettyPrintJson as ue } from "@scalar/oas-utils/helpers";
+import { useActiveEntities as de } from "../../store/active-entities.js";
+import { useLayout as ie } from "../../hooks/useLayout.js";
 const pe = {
   key: 0,
-  class: "flex items-center justify-center p-2"
-}, fe = { class: "text-c-2 text-sm" }, ce = ["id"], me = {
+  class: "flex items-center justify-center px-1"
+}, me = { class: "text-c-1 text-sm font-code" }, fe = ["id"], ce = {
   key: 0,
   class: "scalar-code-copy z-context"
 }, ye = {
-  key: 4,
+  key: 5,
   class: "absolute centered-y right-7 text-orange text-xs"
 }, be = {
-  key: 5,
+  key: 6,
   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"
 }, ve = {
   inheritAttrs: !1
-}, Ee = /* @__PURE__ */ _({
+}, Fe = /* @__PURE__ */ W({
   ...ve,
   __name: "CodeInput",
   props: {
@@ -43,6 +43,7 @@ const pe = {
     disableEnter: { type: Boolean, default: !1 },
     disableCloseBrackets: { type: Boolean, default: !1 },
     enum: {},
+    examples: {},
     type: {},
     nullable: { type: Boolean, default: !1 },
     withVariables: { type: Boolean, default: !0 },
@@ -51,44 +52,44 @@ const pe = {
     default: {}
   },
   emits: ["submit", "update:modelValue", "curl"],
-  setup(x, { expose: N, emit: O }) {
+  setup(R, { expose: N, emit: O }) {
     var F;
-    const o = x, d = O, g = J(), A = g.id || `id-${le()}`, B = i(!1), m = i(!1), k = i(""), C = i({ left: 0, top: 0 }), f = i(null), { activeEnvVariables: S, activeEnvironment: y, activeWorkspace: I } = ue(), { isReadOnly: P } = de(), { copyToClipboard: K } = re();
+    const o = R, u = O, B = J(), A = B.id || `id-${le()}`, k = d(!1), y = d(!1), C = d(""), S = d({ left: 0, top: 0 }), m = d(null), { activeEnvVariables: x, activeEnvironment: b, activeWorkspace: I } = de(), { layout: P } = ie(), { copyToClipboard: K } = re();
     function M(e) {
       var l;
-      return e === o.modelValue ? null : o.importCurl && e.trim().toLowerCase().startsWith("curl") ? (d("curl", e), (l = r.value) == null || l.dispatch({
+      return e === o.modelValue ? null : o.importCurl && e.trim().toLowerCase().startsWith("curl") ? (u("curl", e), (l = r.value) == null || l.dispatch({
         changes: {
           from: 0,
           to: r.value.state.doc.length,
           insert: String(o.modelValue)
         }
-      }), null) : o.handleFieldChange ? o.handleFieldChange(e) : d("update:modelValue", e);
+      }), null) : o.handleFieldChange ? o.handleFieldChange(e) : u("update:modelValue", e);
     }
     function T(e) {
-      return o.handleFieldSubmit ? o.handleFieldSubmit(e) : d("submit", e);
+      return o.handleFieldSubmit ? o.handleFieldSubmit(e) : u("submit", e);
     }
-    function W(e) {
-      B.value = !1, o.emitOnBlur && o.modelValue && T(e);
+    function U(e) {
+      k.value = !1, o.emitOnBlur && o.modelValue && T(e);
     }
-    const b = [];
-    o.colorPicker && b.push(oe), b.push(
+    const v = [];
+    o.colorPicker && v.push(oe), v.push(
       te({
-        environment: y.value,
-        envVariables: S.value,
+        environment: b.value,
+        envVariables: x.value,
         workspace: I.value,
-        isReadOnly: P
+        isReadOnly: P === "modal"
       }),
       ne
     );
-    const D = i(null), { codeMirror: r } = Z({
+    const D = d(null), { codeMirror: r } = _({
       content: s(
         () => o.modelValue !== void 0 ? String(o.modelValue) : ""
       ),
       onChange: (e) => {
         M(e), z();
       },
-      onFocus: () => B.value = !0,
-      onBlur: (e) => W(e),
+      onFocus: () => k.value = !0,
+      onBlur: (e) => U(e),
       codeMirrorRef: D,
       disableTabIndent: s(() => o.disableTabIndent),
       disableEnter: s(() => o.disableEnter),
@@ -96,18 +97,18 @@ const pe = {
       lineNumbers: s(() => o.lineNumbers),
       language: s(() => o.language),
       lint: s(() => o.lint),
-      extensions: b,
+      extensions: v,
       placeholder: s(() => o.placeholder)
     });
-    (F = r.value) == null || F.focus(), L(r, () => {
-      r.value && Object.prototype.hasOwnProperty.call(g, "autofocus") && r.value.focus();
+    (F = r.value) == null || F.focus(), Q(r, () => {
+      r.value && Object.prototype.hasOwnProperty.call(B, "autofocus") && r.value.focus();
     });
     const { handleDropdownSelect: j, updateDropdownVisibility: z } = ee({
       codeMirror: r,
-      query: k,
-      showDropdown: m,
-      dropdownPosition: C
-    }), U = Q(() => {
+      query: C,
+      showDropdown: y,
+      dropdownPosition: S
+    }), L = G(() => {
       var e;
       return o.type === "boolean" || (e = o.type) != null && e.includes("boolean") || o.nullable ? ["true", "false", "null"] : ["true", "false"];
     });
@@ -117,69 +118,76 @@ const pe = {
         (e = r.value) == null || e.focus();
       }
     });
-    const v = (e, l) => {
+    const h = (e, l) => {
       var p, t, E;
-      m.value && (e === "down" ? (l.preventDefault(), (p = f.value) == null || p.handleArrowKey("down")) : e === "up" ? (l.preventDefault(), (t = f.value) == null || t.handleArrowKey("up")) : e === "enter" && (l.preventDefault(), (E = f.value) == null || E.handleSelect()));
+      y.value && (e === "down" ? (l.preventDefault(), (p = m.value) == null || p.handleArrowKey("down")) : e === "up" ? (l.preventDefault(), (t = m.value) == null || t.handleArrowKey("up")) : e === "enter" && (l.preventDefault(), (E = m.value) == null || E.handleSelect()));
     };
     return (e, l) => {
       var p;
-      return n(), u(G, null, [
-        e.disabled ? (n(), u("div", pe, [
-          h("span", fe, H(e.modelValue), 1)
-        ])) : o.enum && o.enum.length ? (n(), w(R, {
+      return n(), i(H, null, [
+        e.disabled ? (n(), i("div", pe, [
+          w("span", me, X(e.modelValue), 1)
+        ])) : o.enum && o.enum.length ? (n(), f(g, {
           key: 1,
           default: o.default,
           modelValue: e.modelValue,
+          type: e.type,
           value: o.enum,
-          "onUpdate:modelValue": l[0] || (l[0] = (t) => d("update:modelValue", t))
-        }, null, 8, ["default", "modelValue", "value"])) : e.type === "boolean" || (p = e.type) != null && p.includes("boolean") ? (n(), w(R, {
+          "onUpdate:modelValue": l[0] || (l[0] = (t) => u("update:modelValue", t))
+        }, null, 8, ["default", "modelValue", "type", "value"])) : e.type === "boolean" || (p = e.type) != null && p.includes("boolean") ? (n(), f(g, {
           key: 2,
           default: o.default,
           modelValue: e.modelValue,
-          value: U.value,
-          "onUpdate:modelValue": l[1] || (l[1] = (t) => d("update:modelValue", t))
-        }, null, 8, ["default", "modelValue", "value"])) : (n(), u("div", X({
+          value: L.value,
+          "onUpdate:modelValue": l[1] || (l[1] = (t) => u("update:modelValue", t))
+        }, null, 8, ["default", "modelValue", "value"])) : o.examples && o.examples.length ? (n(), f(g, {
           key: 3,
+          default: o.default,
+          modelValue: o.modelValue,
+          value: o.examples,
+          "onUpdate:modelValue": l[2] || (l[2] = (t) => u("update:modelValue", t))
+        }, null, 8, ["default", "modelValue", "value"])) : (n(), i("div", Y({
+          key: 4,
           id: a(A)
         }, e.$attrs, {
           ref_key: "codeMirrorRef",
           ref: D,
-          class: ["peer font-code w-full whitespace-nowrap overflow-hidden text-xs leading-[1.44] relative has-[:focus-visible]:outline has-[:focus-visible]:rounded-[4px] -outline-offset-2", {
+          class: ["peer font-code w-full whitespace-nowrap overflow-hidden text-xs leading-[1.44] relative has-[:focus-visible]:outline has-[:focus-visible]:rounded-[4px] -outline-offset-1", {
             "flow-code-input--error": e.error
           }],
           onKeydown: [
-            l[3] || (l[3] = V($((t) => v("down", t), ["stop"]), ["down"])),
-            l[4] || (l[4] = V((t) => v("enter", t), ["enter"])),
-            l[5] || (l[5] = V($((t) => v("up", t), ["stop"]), ["up"]))
+            l[4] || (l[4] = V($((t) => h("down", t), ["stop"]), ["down"])),
+            l[5] || (l[5] = V((t) => h("enter", t), ["enter"])),
+            l[6] || (l[6] = V($((t) => h("up", t), ["stop"]), ["up"]))
           ]
         }), [
-          e.isCopyable ? (n(), u("div", me, [
-            h("button", {
+          e.isCopyable ? (n(), i("div", ce, [
+            w("button", {
               class: "copy-button",
               type: "button",
-              onClick: l[2] || (l[2] = (t) => a(K)(a(ie)(e.modelValue)))
+              onClick: l[3] || (l[3] = (t) => a(K)(a(ue)(e.modelValue)))
             }, [
-              l[6] || (l[6] = h("span", { class: "sr-only" }, "Copy content", -1)),
-              Y(a(se), {
+              l[7] || (l[7] = w("span", { class: "sr-only" }, "Copy content", -1)),
+              Z(a(se), {
                 icon: "Clipboard",
                 size: "md"
               })
             ])
           ])) : c("", !0)
-        ], 16, ce)),
-        e.$slots.warning ? (n(), u("div", ye, [
+        ], 16, fe)),
+        e.$slots.warning ? (n(), i("div", ye, [
           q(e.$slots, "warning", {}, void 0, !0)
         ])) : c("", !0),
         q(e.$slots, "icon", {}, void 0, !0),
-        e.required ? (n(), u("div", be, " Required ")) : c("", !0),
-        m.value && e.withVariables && !a(P) && a(y) ? (n(), w(ae, {
-          key: 6,
+        e.required ? (n(), i("div", be, " Required ")) : c("", !0),
+        y.value && e.withVariables && a(P) !== "modal" && a(b) ? (n(), f(ae, {
+          key: 7,
           ref_key: "dropdownRef",
-          ref: f,
-          dropdownPosition: C.value,
-          envVariables: a(S),
-          environment: a(y),
-          query: k.value,
+          ref: m,
+          dropdownPosition: S.value,
+          envVariables: a(x),
+          environment: a(b),
+          query: C.value,
           onSelect: a(j)
         }, null, 8, ["dropdownPosition", "envVariables", "environment", "query", "onSelect"])) : c("", !0)
       ], 64);
@@ -187,5 +195,5 @@ const pe = {
   }
 });
 export {
-  Ee as default
+  Fe as default
 };

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

@@ -1,9 +1,7 @@
 import { type EnvVariables } from '../../libs/env-helpers.js';
-import type { WorkspaceStore } from '../../store/index.js';
 import type { Environment } from '@scalar/oas-utils/entities/environment';
 import type { Workspace } from '@scalar/oas-utils/entities/workspace';
 import { Decoration, type DecorationSet, EditorView, ViewPlugin, type ViewUpdate } from '@scalar/use-codemirror';
-type IsReadOnly = WorkspaceStore['isReadOnly'];
 /**
  * Styles the active environment variable pill
  */
@@ -11,12 +9,11 @@ export declare const pillPlugin: (props: {
     environment?: Environment;
     envVariables?: EnvVariables;
     workspace?: Workspace;
-    isReadOnly?: IsReadOnly;
+    isReadOnly?: boolean;
 }) => 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":"AAEA,OAAO,EAAE,KAAK,YAAY,EAAe,MAAM,oBAAoB,CAAA;AACnE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAE7C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAA;AACzE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sCAAsC,CAAA;AAErE,OAAO,EACL,UAAU,EACV,KAAK,aAAa,EAClB,UAAU,EAEV,UAAU,EACV,KAAK,UAAU,EAEhB,MAAM,wBAAwB,CAAA;AAG/B,KAAK,UAAU,GAAG,cAAc,CAAC,YAAY,CAAC,CAAA;AAkI9C;;GAEG;AACH,eAAO,MAAM,UAAU,UAAW;IAChC,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB,YAAY,CAAC,EAAE,YAAY,CAAA;IAC3B,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,UAAU,CAAC,EAAE,UAAU,CAAA;CACxB;iBAGkB,aAAa;mBAMX,UAAU;2BASF,UAAU;EAkCpC,CAAA;AAEH,eAAO,MAAM,gBAAgB,uCA8B3B,CAAA"}
+{"version":3,"file":"codeVariableWidget.d.ts","sourceRoot":"","sources":["../../../src/components/CodeInput/codeVariableWidget.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,YAAY,EAAe,MAAM,oBAAoB,CAAA;AAEnE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAA;AACzE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sCAAsC,CAAA;AAErE,OAAO,EACL,UAAU,EACV,KAAK,aAAa,EAClB,UAAU,EAEV,UAAU,EACV,KAAK,UAAU,EAEhB,MAAM,wBAAwB,CAAA;AAmI/B;;GAEG;AACH,eAAO,MAAM,UAAU,UAAW;IAChC,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB,YAAY,CAAC,EAAE,YAAY,CAAA;IAC3B,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB;iBAGkB,aAAa;mBAMX,UAAU;2BASF,UAAU;EAkCpC,CAAA;AAEH,eAAO,MAAM,gBAAgB,uCA8B3B,CAAA"}

package/dist/components/DataTable/DataTableInputSelect.vue.d.ts

@@ -3,6 +3,7 @@ type __VLS_Props = {
     value?: string[];
     default?: string | number;
     canAddCustomValue?: boolean;
+    type?: string;
 };
 declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
     "update:modelValue": (v: string) => any;

package/dist/components/DataTable/DataTableInputSelect.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableInputSelect.vue.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/DataTableInputSelect.vue"],"names":[],"mappings":"AAmJA,KAAK,WAAW,GAAG;IACf,UAAU,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACzB,iBAAiB,CAAC,EAAE,OAAO,CAAA;CAC5B,CAAC;;;;;;uBADoB,OAAO;;AAqR/B,wBASG"}
+{"version":3,"file":"DataTableInputSelect.vue.d.ts","sourceRoot":"","sources":["../../../src/components/DataTable/DataTableInputSelect.vue"],"names":[],"mappings":"AA8LA,KAAK,WAAW,GAAG;IACf,UAAU,EAAE,MAAM,GAAG,MAAM,CAAA;IAC3B,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACzB,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAC3B,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAC;;;;;;uBAFoB,OAAO;;AAyW/B,wBASG"}

package/dist/components/DataTable/DataTableInputSelect.vue.js

@@ -1,103 +1,135 @@
-import { defineComponent as N, computed as k, ref as p, watch as y, nextTick as T, openBlock as n, createElementBlock as i, withDirectives as j, withKeys as I, vModelText as E, createBlock as f, unref as a, withCtx as r, Fragment as C, renderList as K, createElementVNode as c, normalizeClass as R, createVNode as d, createTextVNode as $, toDisplayString as g, createCommentVNode as S } from "vue";
-import { ScalarDropdown as F, ScalarDropdownItem as _, ScalarIcon as v, ScalarDropdownDivider as L, ScalarButton as M } from "@scalar/components";
-const U = { class: "w-full" }, W = { class: "text-c-1" }, q = { class: "flex items-center justify-center h-4 w-4" }, O = /* @__PURE__ */ N({
+import { defineComponent as O, computed as m, ref as y, watch as S, nextTick as E, openBlock as u, createElementBlock as f, createBlock as v, unref as a, withCtx as n, createVNode as s, createElementVNode as d, toDisplayString as w, withDirectives as K, withKeys as M, vModelText as R, Fragment as C, renderList as U, normalizeClass as W, createTextVNode as $, createCommentVNode as _ } from "vue";
+import { ScalarComboboxMultiselect as F, ScalarButton as b, ScalarIcon as h, ScalarDropdown as L, ScalarDropdownItem as D, ScalarDropdownDivider as q } from "@scalar/components";
+const G = { class: "pr-4 w-full has-[:focus-visible]:outline has-[:focus-visible]:rounded-[4px] -outline-offset-1" }, H = { class: "text-c-1 whitespace-nowrap" }, J = { class: "text-c-1" }, P = { class: "flex items-center justify-center h-4 w-4" }, Z = /* @__PURE__ */ O({
   __name: "DataTableInputSelect",
   props: {
     modelValue: {},
     value: {},
     default: {},
-    canAddCustomValue: { type: Boolean, default: !0 }
+    canAddCustomValue: { type: Boolean, default: !0 },
+    type: {}
   },
   emits: ["update:modelValue"],
-  setup(D, { emit: B }) {
-    const o = D, m = B, V = k(() => o.value ?? []), s = p(!1), u = p(""), x = p(null);
-    y(u, (e) => {
-      m("update:modelValue", e);
+  setup(B, { emit: j }) {
+    const r = B, c = j, p = m(() => r.value ?? []), i = y(!1), o = y(""), x = y(null);
+    S(o, (e) => {
+      c("update:modelValue", e);
     });
-    const h = (e) => {
-      m("update:modelValue", e), s.value = !1;
-    }, b = () => {
-      u.value.trim() && (h(u.value), u.value = "");
+    const k = (e) => {
+      c("update:modelValue", e), i.value = !1;
     }, z = () => {
-      u.value.trim() || (m("update:modelValue", ""), s.value = !1);
-    }, A = (e) => o.modelValue.toString() === e;
-    y(s, (e) => {
-      e && T(() => {
+      o.value.trim() && (k(o.value), o.value = "");
+    }, A = () => {
+      o.value.trim() || (c("update:modelValue", ""), i.value = !1);
+    }, N = (e) => r.modelValue.toString() === e;
+    S(i, (e) => {
+      e && E(() => {
         var t;
         (t = x.value) == null || t.focus();
       });
     });
-    const w = k(() => o.modelValue !== void 0 ? o.modelValue : o.default);
-    return (e, t) => (n(), i("div", U, [
-      s.value ? j((n(), i("input", {
+    const g = m(() => r.modelValue !== void 0 ? r.modelValue : r.default), V = m(() => {
+      const e = new Set(r.modelValue.toString().split(", "));
+      return p.value.filter((t) => e.has(t)).map((t) => ({ id: t, label: t, value: t }));
+    }), T = m(
+      () => p.value.map((e) => ({ id: e, label: e, value: e }))
+    ), I = (e) => {
+      const t = e.map((l) => l.value);
+      c("update:modelValue", t.join(", "));
+    };
+    return (e, t) => (u(), f("div", G, [
+      e.type === "array" ? (u(), v(a(F), {
         key: 0,
+        modelValue: V.value,
+        options: T.value,
+        "onUpdate:modelValue": I
+      }, {
+        default: n(() => [
+          s(a(b), {
+            class: "gap-1.5 font-normal h-full justify-start px-2 py-1.5 custom-scroll pr-6 outline-none",
+            fullWidth: "",
+            variant: "ghost"
+          }, {
+            default: n(() => [
+              d("span", H, w(V.value.length > 0 ? V.value.map((l) => l.label).join(", ") : "Select a value"), 1),
+              s(a(h), {
+                icon: "ChevronDown",
+                size: "md"
+              })
+            ]),
+            _: 1
+          })
+        ]),
+        _: 1
+      }, 8, ["modelValue", "options"])) : i.value ? K((u(), f("input", {
+        key: 1,
         ref_key: "inputRef",
         ref: x,
-        "onUpdate:modelValue": t[0] || (t[0] = (l) => u.value = l),
+        "onUpdate:modelValue": t[0] || (t[0] = (l) => o.value = l),
         class: "border-none text-c-1 min-w-0 w-full px-2 py-1.5 outline-none",
         placeholder: "Value",
         type: "text",
-        onBlur: z,
-        onKeyup: I(b, ["enter"])
+        onBlur: A,
+        onKeyup: M(z, ["enter"])
       }, null, 544)), [
-        [E, u.value]
-      ]) : (n(), f(a(F), {
-        key: 1,
+        [R, o.value]
+      ]) : (u(), v(a(L), {
+        key: 2,
         resize: "",
-        value: w.value
+        value: g.value
       }, {
-        items: r(() => [
-          (n(!0), i(C, null, K(V.value, (l) => (n(), f(a(_), {
+        items: n(() => [
+          (u(!0), f(C, null, U(p.value, (l) => (u(), v(a(D), {
             key: l,
             class: "flex gap-1.5 group/item items-center whitespace-nowrap text-ellipsis overflow-hidden",
             value: l,
-            onClick: (G) => h(l)
+            onClick: (Q) => k(l)
           }, {
-            default: r(() => [
-              c("div", {
-                class: R([
+            default: n(() => [
+              d("div", {
+                class: W([
                   "flex items-center justify-center rounded-full p-[3px] w-4 h-4",
-                  A(l) ? "bg-c-accent text-b-1" : "group-hover/item:shadow-border text-transparent"
+                  N(l) ? "bg-c-accent text-b-1" : "group-hover/item:shadow-border text-transparent"
                 ])
               }, [
-                d(a(v), {
+                s(a(h), {
                   class: "size-2.5",
                   icon: "Checkmark",
                   thickness: "3.5"
                 })
               ], 2),
-              $(" " + g(l), 1)
+              $(" " + w(l), 1)
             ]),
             _: 2
           }, 1032, ["value", "onClick"]))), 128)),
-          e.canAddCustomValue ? (n(), i(C, { key: 0 }, [
-            V.value.length ? (n(), f(a(L), { key: 0 })) : S("", !0),
-            d(a(_), {
+          e.canAddCustomValue ? (u(), f(C, { key: 0 }, [
+            p.value.length ? (u(), v(a(q), { key: 0 })) : _("", !0),
+            s(a(D), {
               class: "flex items-center gap-1.5",
-              onClick: t[1] || (t[1] = (l) => s.value = !0)
+              onClick: t[1] || (t[1] = (l) => i.value = !0)
             }, {
-              default: r(() => [
-                c("div", q, [
-                  d(a(v), {
+              default: n(() => [
+                d("div", P, [
+                  s(a(h), {
                     icon: "Add",
                     size: "sm"
                   })
                 ]),
-                t[2] || (t[2] = c("span", null, "Add value", -1))
+                t[2] || (t[2] = d("span", null, "Add value", -1))
               ]),
               _: 1
             })
-          ], 64)) : S("", !0)
+          ], 64)) : _("", !0)
         ]),
-        default: r(() => [
-          d(a(M), {
-            class: "gap-1.5 font-normal h-full justify-start px-2 py-1.5",
+        default: n(() => [
+          s(a(b), {
+            class: "gap-1.5 font-normal h-full justify-start px-2 py-1.5 outline-none",
             fullWidth: "",
             variant: "ghost"
           }, {
-            default: r(() => [
-              c("span", W, g(w.value || "Select a value"), 1),
-              d(a(v), {
+            default: n(() => [
+              d("span", J, w(g.value || "Select a value"), 1),
+              s(a(h), {
                 icon: "ChevronDown",
                 size: "md"
               })
@@ -111,5 +143,5 @@ const U = { class: "w-full" }, W = { class: "text-c-1" }, q = { class: "flex ite
   }
 });
 export {
-  O as default
+  Z as default
 };

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

@@ -1 +1 @@
-{"version":3,"file":"EnvironmentSelector.vue.d.ts","sourceRoot":"","sources":["../../../src/components/EnvironmentSelector/EnvironmentSelector.vue"],"names":[],"mappings":";AAgdA,wBAMG"}
+{"version":3,"file":"EnvironmentSelector.vue.d.ts","sourceRoot":"","sources":["../../../src/components/EnvironmentSelector/EnvironmentSelector.vue"],"names":[],"mappings":";AAodA,wBAMG"}

package/dist/components/EnvironmentSelector/EnvironmentSelector.vue.js

@@ -1,13 +1,14 @@
 import { defineComponent as I, computed as f, watch as B, onMounted as D, openBlock as c, createElementBlock as x, createVNode as s, unref as n, withCtx as l, Fragment as j, renderList as M, createBlock as h, withModifiers as w, createTextVNode as E, toDisplayString as k, createElementVNode as u, normalizeClass as V, createCommentVNode as z } from "vue";
-import { useActiveEntities as W } from "../../store/active-entities.js";
-import { ScalarDropdown as L, ScalarDropdownItem as v, ScalarListboxCheckbox as O, ScalarIcon as g, ScalarDropdownDivider as R, ScalarButton as $ } from "@scalar/components";
-import { useRouter as A } from "vue-router";
-import { useWorkspace as F } from "../../store/store.js";
-const T = { class: "font-medium m-0 flex gap-1.5 items-center whitespace-nowrap" }, q = { class: "flex items-center justify-center h-4 w-4" }, U = /* @__PURE__ */ I({
+import { useActiveEntities as L } from "../../store/active-entities.js";
+import { ScalarDropdown as W, ScalarDropdownItem as m, ScalarListboxCheckbox as $, ScalarIcon as g, ScalarDropdownDivider as A, ScalarButton as F } from "@scalar/components";
+import { useRouter as O } from "vue-router";
+import { useWorkspace as R } from "../../store/store.js";
+import { useLayout as T } from "../../hooks/useLayout.js";
+const q = { class: "font-medium m-0 flex gap-1.5 items-center whitespace-nowrap" }, G = { class: "flex items-center justify-center h-4 w-4" }, Y = /* @__PURE__ */ I({
   __name: "EnvironmentSelector",
-  setup(G) {
-    const { activeCollection: a, activeWorkspace: i, activeEnvironment: m } = W(), { isReadOnly: _, collectionMutators: b } = F(), C = A(), d = (e) => {
-      a.value && i.value && (b.edit(
+  setup(H) {
+    const { activeCollection: a, activeWorkspace: i, activeEnvironment: v } = L(), { collectionMutators: _ } = R(), { layout: b } = T(), C = O(), d = (e) => {
+      a.value && i.value && (_.edit(
         a.value.uid,
         "x-scalar-active-environment",
         e
@@ -21,7 +22,7 @@ const T = { class: "font-medium m-0 flex gap-1.5 items-center whitespace-nowrap"
         }
       });
     }, y = f(() => {
-      const { value: e } = m, { value: t } = a;
+      const { value: e } = v, { value: t } = a;
       return (e == null ? void 0 : e.uid) || (t == null ? void 0 : t["x-scalar-active-environment"]) || "No Environment";
     }), N = f(() => {
       const { value: e } = a, t = e == null ? void 0 : e["x-scalar-environments"];
@@ -40,9 +41,9 @@ const T = { class: "font-medium m-0 flex gap-1.5 items-center whitespace-nowrap"
     ), D(() => {
       a.value && p(a.value);
     }), (e, t) => (c(), x("div", null, [
-      s(n(L), { placement: "bottom-end" }, {
+      s(n(W), { placement: "bottom-end" }, {
         items: l(() => [
-          (c(!0), x(j, null, M(N.value, (o) => (c(), h(n(v), {
+          (c(!0), x(j, null, M(N.value, (o) => (c(), h(n(m), {
             key: o.uid,
             class: "flex gap-1.5 group/item items-center whitespace-nowrap text-ellipsis overflow-hidden",
             onClick: w((r) => d(o.uid), ["stop"])
@@ -50,7 +51,7 @@ const T = { class: "font-medium m-0 flex gap-1.5 items-center whitespace-nowrap"
             default: l(() => {
               var r;
               return [
-                s(n(O), {
+                s(n($), {
                   selected: ((r = n(a)) == null ? void 0 : r["x-scalar-active-environment"]) === o.uid
                 }, null, 8, ["selected"]),
                 E(" " + k(o.name), 1)
@@ -58,7 +59,7 @@ const T = { class: "font-medium m-0 flex gap-1.5 items-center whitespace-nowrap"
             }),
             _: 2
           }, 1032, ["onClick"]))), 128)),
-          s(n(v), {
+          s(n(m), {
             class: "flex gap-1.5 group/item items-center whitespace-nowrap text-ellipsis overflow-hidden",
             onClick: t[0] || (t[0] = w((o) => d(""), ["stop"]))
           }, {
@@ -68,7 +69,7 @@ const T = { class: "font-medium m-0 flex gap-1.5 items-center whitespace-nowrap"
                 u("div", {
                   class: V([
                     "flex items-center justify-center rounded-full p-[3px] w-4 h-4",
-                    ((o = n(m)) == null ? void 0 : o.uid) === "" && ((r = n(a)) == null ? void 0 : r["x-scalar-active-environment"]) === "" ? "bg-c-accent text-b-1" : "group-hover/item:shadow-border text-transparent"
+                    ((o = n(v)) == null ? void 0 : o.uid) === "" && ((r = n(a)) == null ? void 0 : r["x-scalar-active-environment"]) === "" ? "bg-c-accent text-b-1" : "group-hover/item:shadow-border text-transparent"
                   ])
                 }, [
                   s(n(g), {
@@ -82,14 +83,14 @@ const T = { class: "font-medium m-0 flex gap-1.5 items-center whitespace-nowrap"
             }),
             _: 1
           }),
-          s(n(R)),
-          n(_) ? z("", !0) : (c(), h(n(v), {
+          s(n(A)),
+          n(b) !== "modal" ? (c(), h(n(m), {
             key: 0,
             class: "flex items-center gap-1.5",
             onClick: S
           }, {
             default: l(() => [
-              u("div", q, [
+              u("div", G, [
                 s(n(g), {
                   icon: "Brackets",
                   size: "sm"
@@ -98,16 +99,16 @@ const T = { class: "font-medium m-0 flex gap-1.5 items-center whitespace-nowrap"
               t[2] || (t[2] = u("span", { class: "leading-none" }, "Manage Environments", -1))
             ]),
             _: 1
-          }))
+          })) : z("", !0)
         ]),
         default: l(() => [
-          s(n($), {
+          s(n(F), {
             class: "font-normal h-auto justify-start py-1.5 px-1.5 pl-2 text-c-1 hover:bg-b-2 w-fit",
             fullWidth: "",
             variant: "ghost"
           }, {
             default: l(() => [
-              u("h2", T, k(y.value), 1)
+              u("h2", q, k(y.value), 1)
             ]),
             _: 1
           })
@@ -118,5 +119,5 @@ const T = { class: "font-medium m-0 flex gap-1.5 items-center whitespace-nowrap"
   }
 });
 export {
-  U as default
+  Y as default
 };

package/dist/components/Server/ServerVariablesForm.vue.d.ts

@@ -0,0 +1,14 @@
+import type { ServerVariableValues, ServerVariables } from '../../components/Server/types';
+type __VLS_Props = {
+    variables?: ServerVariables;
+    values?: ServerVariableValues;
+    /** The ID of the input controlled by the variables form */
+    controls?: string;
+};
+declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
+    "update:variable": (name: string, value: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:variable"?: ((name: string, value: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+export default _default;
+//# sourceMappingURL=ServerVariablesForm.vue.d.ts.map

package/dist/components/Server/ServerVariablesForm.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ServerVariablesForm.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Server/ServerVariablesForm.vue"],"names":[],"mappings":"AA+DA,OAAO,KAAK,EACV,oBAAoB,EACpB,eAAe,EAChB,MAAM,2BAA2B,CAAA;AAIlC,KAAK,WAAW,GAAG;IACjB,SAAS,CAAC,EAAE,eAAe,CAAA;IAC3B,MAAM,CAAC,EAAE,oBAAoB,CAAA;IAC7B,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,CAAC;;;;;;AA0IF,wBAOG"}