@scalar/api-client 2.38.4 → 2.39.0

package/dist/views/Environment/Environment.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Environment.vue.js","names":[],"sources":["../../../src/views/Environment/Environment.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarIcon,\n  ScalarModal,\n  useModal,\n} from '@scalar/components'\nimport { LibraryIcon } from '@scalar/icons/library'\nimport type { Collection } from '@scalar/oas-utils/entities/spec'\nimport { useToasts } from '@scalar/use-toasts'\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'\nimport { useRoute, useRouter } from 'vue-router'\n\nimport CodeInput from '@/components/CodeInput/CodeInput.vue'\nimport EditSidebarListElement from '@/components/Sidebar/Actions/EditSidebarListElement.vue'\nimport Sidebar from '@/components/Sidebar/Sidebar.vue'\nimport SidebarButton from '@/components/Sidebar/SidebarButton.vue'\nimport SidebarList from '@/components/Sidebar/SidebarList.vue'\nimport SidebarListElement from '@/components/Sidebar/SidebarListElement.vue'\nimport ViewLayout from '@/components/ViewLayout/ViewLayout.vue'\nimport ViewLayoutContent from '@/components/ViewLayout/ViewLayoutContent.vue'\nimport ViewLayoutSection from '@/components/ViewLayout/ViewLayoutSection.vue'\nimport { useSidebar } from '@/hooks/useSidebar'\nimport type { HotKeyEvent } from '@/libs'\nimport type { EnvConfig } from '@/libs/env-helpers'\nimport { PathId } from '@/routes'\nimport { useWorkspace } from '@/store'\nimport { useActiveEntities } from '@/store/active-entities'\n\nimport EnvironmentColorModal from './EnvironmentColorModal.vue'\nimport EnvironmentModal from './EnvironmentModal.vue'\nimport { environmentDragHandlerFactory } from './handle-drag'\n\nconst router = useRouter()\nconst route = useRoute()\nconst {\n  activeWorkspace,\n  activeEnvironment,\n  activeWorkspaceCollections,\n  activeEnvVariables,\n} = useActiveEntities()\nconst { events, workspaceMutators, collectionMutators } = useWorkspace()\nconst { collapsedSidebarFolders, toggleSidebarFolder } = useSidebar()\nconst colorModal = useModal()\nconst environmentModal = useModal()\n\nconst editModal = useModal()\n\nconst colorModalEnvironment = ref<string | null>(null)\nconst currentEnvironmentId = ref('default')\nconst selectedColor = ref('')\nconst selectedCollectionId = ref<string | undefined>(undefined)\nconst selectedEnvironmentId = ref<string | undefined>(undefined)\nconst tempEnvironmentName = ref<string | undefined>(undefined)\n\nconst { toast } = useToasts()\n\nconst parseEnvironmentValue = (value: string): Record<string, string> =>\n  JSON.parse(value)\n\nfunction environmentNameToast(\n  environmentNameUsed: boolean,\n  collection: any,\n  collectionId: string | undefined,\n) {\n  if (environmentNameUsed) {\n    if (collection.uid === collectionId) {\n      toast(\n        `Environment name already used in ${collection.info?.title}`,\n        'error',\n      )\n    } else {\n      toast('Environment name already used in another collection', 'error')\n    }\n  }\n}\n\n// Returns non-draft collections only\nconst nonDraftWorkspaceCollections = computed(() => {\n  return activeWorkspaceCollections.value.filter(\n    (collection) => collection.info?.title !== 'Drafts',\n  )\n})\n\nfunction addEnvironment(environment: {\n  name: string\n  color: string\n  collectionId: Collection['uid'] | undefined\n}) {\n  const environmentNameUsed = nonDraftWorkspaceCollections.value.some(\n    (collection) => {\n      const enviromentName = Object.keys(\n        collection['x-scalar-environments'] || {},\n      ).includes(environment.name)\n      environmentNameToast(enviromentName, collection, environment.collectionId)\n      return enviromentName\n    },\n  )\n  if (environmentNameUsed) {\n    return\n  }\n  if (environment.collectionId) {\n    collectionMutators.addEnvironment(\n      environment.name,\n      {\n        variables: {},\n        color: environment.color,\n      },\n      environment.collectionId,\n    )\n    if (!collapsedSidebarFolders[environment.collectionId]) {\n      toggleSidebarFolder(environment.collectionId)\n    }\n    router.push({\n      name: 'environment.collection',\n      params: {\n        [PathId.Collection]: environment.collectionId,\n        [PathId.Environment]: environment.name,\n      },\n    })\n  }\n\n  environmentModal.hide()\n}\n\nfunction handleEnvironmentUpdate(raw: string) {\n  if (!activeEnvironment) {\n    return\n  }\n\n  const updatedValue = parseEnvironmentValue(raw)\n\n  if (currentEnvironmentId.value === 'default') {\n    workspaceMutators.edit(\n      activeWorkspace.value?.uid,\n      'environments',\n      updatedValue,\n    )\n  } else {\n    const collection = activeWorkspaceCollections.value.find(\n      (c) => c['x-scalar-environments']?.[currentEnvironmentId.value ?? ''],\n    )\n    if (\n      collection?.['x-scalar-environments']?.[currentEnvironmentId.value ?? '']\n    ) {\n      const environment =\n        collection['x-scalar-environments'][currentEnvironmentId.value ?? '']\n      if (environment) {\n        environment.variables = updatedValue\n        collectionMutators.edit(\n          collection.uid,\n          'x-scalar-environments',\n          collection['x-scalar-environments'],\n        )\n      }\n    }\n  }\n}\n\nconst openEnvironmentModal = (collectionId?: string) => {\n  selectedCollectionId.value = collectionId\n  environmentModal.show()\n}\n\nconst openRenameModal = (environmentId: string, collectionId: string) => {\n  selectedEnvironmentId.value = environmentId\n  selectedCollectionId.value = collectionId\n  tempEnvironmentName.value = environmentId\n  editModal.show()\n}\n\nconst handleOpenColorModal = (uid: string) => {\n  colorModalEnvironment.value = uid\n  selectedColor.value =\n    activeWorkspaceCollections.value.find(\n      (collection) => collection['x-scalar-environments']?.[uid],\n    )?.['x-scalar-environments']?.[uid]?.color ?? ''\n  colorModal.show()\n}\n\nconst submitColorChange = (color: string) => {\n  const environmentId = colorModalEnvironment.value\n  if (typeof environmentId === 'string') {\n    const isCollection = activeWorkspaceCollections.value.some(\n      (collection) => collection['x-scalar-environments']?.[environmentId],\n    )\n    if (isCollection) {\n      activeWorkspaceCollections.value.forEach((collection) => {\n        if (collection['x-scalar-environments']?.[environmentId]) {\n          collection['x-scalar-environments'][environmentId].color = color\n          collectionMutators.edit(\n            collection.uid,\n            'x-scalar-environments',\n            collection['x-scalar-environments'],\n          )\n        }\n      })\n    }\n    colorModal.hide()\n  }\n}\n\nfunction removeCollectionEnvironment(environmentName: string) {\n  nonDraftWorkspaceCollections.value.forEach((collection) => {\n    collectionMutators.removeEnvironment(environmentName, collection.uid)\n  })\n\n  // Redirect to last available environment\n  const remainingCollectionEnvironments =\n    nonDraftWorkspaceCollections.value.flatMap((collection) =>\n      Object.keys(collection['x-scalar-environments'] || {}),\n    )\n\n  if (remainingCollectionEnvironments.length > 0) {\n    const lastCollectionEnvironment =\n      remainingCollectionEnvironments[\n        remainingCollectionEnvironments.length - 1\n      ]\n\n    if (!lastCollectionEnvironment) {\n      return\n    }\n\n    const currentCollection = activeWorkspaceCollections.value.find(\n      (collection) =>\n        Object.keys(collection['x-scalar-environments'] || {}).includes(\n          lastCollectionEnvironment,\n        ),\n    )\n    currentEnvironmentId.value = lastCollectionEnvironment\n    router.push({\n      name: 'environment.collection',\n      params: {\n        [PathId.Collection]: currentCollection?.uid,\n        [PathId.Environment]: lastCollectionEnvironment,\n      },\n    })\n    if (currentCollection && !collapsedSidebarFolders[currentCollection.uid]) {\n      toggleSidebarFolder(currentCollection.uid)\n    }\n  } else {\n    currentEnvironmentId.value = 'default'\n    router.push({\n      name: 'environment.default',\n      params: {\n        [PathId.Workspace]: activeWorkspace.value?.uid,\n      },\n    })\n  }\n}\n\nconst getEnvironmentName = () => {\n  return currentEnvironmentId.value === 'default'\n    ? 'Global Environment'\n    : currentEnvironmentId.value\n}\n\nconst getEnvironmentValue = () => {\n  return currentEnvironmentId.value === 'default'\n    ? JSON.stringify(activeWorkspace.value?.environments, null, 2)\n    : JSON.stringify(\n        activeWorkspaceCollections.value.find(\n          (collection) =>\n            collection['x-scalar-environments']?.[\n              currentEnvironmentId.value ?? ''\n            ],\n        )?.['x-scalar-environments']?.[currentEnvironmentId.value ?? '']\n          ?.variables,\n        null,\n        2,\n      )\n}\n\nconst showChildren = (key: string) => {\n  return collapsedSidebarFolders[key]\n}\n\nconst handleHotKey = (event?: HotKeyEvent) => {\n  if (event?.createNew && route.name === 'environment') {\n    openEnvironmentModal()\n  }\n}\n\nwatch(\n  () => [route.params[PathId.Collection], route.params[PathId.Environment]],\n  ([newCollectionId, newEnvironmentId]) => {\n    if (newCollectionId) {\n      // Collection environment\n      currentEnvironmentId.value = newEnvironmentId as string\n    } else {\n      // Global environment\n      currentEnvironmentId.value = 'default'\n    }\n  },\n)\n\nonMounted(() => {\n  currentEnvironmentId.value =\n    (route.params[PathId.Environment] as string) || 'default'\n  events.hotKeys.on(handleHotKey)\n  const collectionId = route.params[PathId.Collection]\n  if (collectionId && !collapsedSidebarFolders[collectionId as string]) {\n    toggleSidebarFolder(collectionId as string)\n  }\n})\nonBeforeUnmount(() => events.hotKeys.off(handleHotKey))\n\nconst handleNavigation = (\n  event: MouseEvent,\n  uid: string,\n  collectionId?: string,\n) => {\n  const to = collectionId\n    ? {\n        name: 'environment.collection',\n        params: {\n          [PathId.Workspace]: activeWorkspace.value?.uid,\n          [PathId.Collection]: collectionId,\n          [PathId.Environment]: uid,\n        },\n      }\n    : {\n        name: 'environment.default',\n        params: {\n          [PathId.Workspace]: activeWorkspace.value?.uid,\n          [PathId.Environment]: uid,\n        },\n      }\n  if (event.metaKey) {\n    window.open(router.resolve(to).href, '_blank')\n  } else {\n    router.push(to)\n  }\n}\n\nfunction handleCancelRename() {\n  selectedEnvironmentId.value = undefined\n  selectedCollectionId.value = undefined\n  tempEnvironmentName.value = undefined\n  editModal.hide()\n}\n\nfunction handleRename(newName: string) {\n  const environmentNameUsed = nonDraftWorkspaceCollections.value.some(\n    (collection) => {\n      const enviromentName = Object.keys(\n        collection['x-scalar-environments'] || {},\n      ).includes(newName)\n      environmentNameToast(\n        enviromentName,\n        collection,\n        selectedCollectionId.value,\n      )\n      return enviromentName\n    },\n  )\n  if (environmentNameUsed) {\n    return\n  }\n  if (newName && selectedEnvironmentId.value !== 'default') {\n    activeWorkspaceCollections.value.forEach((collection) => {\n      if (\n        collection['x-scalar-environments']?.[selectedEnvironmentId.value ?? '']\n      ) {\n        const environments = collection['x-scalar-environments']\n        // Maintains order of environments in the sidebar as we use uid as the name\n        const orderedEnvs: Record<string, EnvConfig> = {}\n\n        // Preserve order by rebuilding the environments object\n        Object.keys(environments).forEach((key) => {\n          const environment = environments[key]\n\n          if (!environment) {\n            return\n          }\n\n          if (key === selectedEnvironmentId.value) {\n            orderedEnvs[newName] = environment\n          } else {\n            orderedEnvs[key] = environment\n          }\n        })\n\n        collection['x-scalar-environments'] = orderedEnvs\n        collectionMutators.edit(\n          collection.uid,\n          'x-scalar-environments',\n          collection['x-scalar-environments'],\n        )\n      }\n    })\n  }\n\n  if (newName && currentEnvironmentId.value === selectedEnvironmentId.value) {\n    currentEnvironmentId.value = newName\n  }\n\n  selectedEnvironmentId.value = undefined\n  selectedCollectionId.value = undefined\n  tempEnvironmentName.value = undefined\n  editModal.hide()\n}\n\n// Replace handleEnvironmentDragEnd with the factory\nconst { handleDragEnd, isDroppable } = environmentDragHandlerFactory(\n  activeWorkspaceCollections,\n  collectionMutators,\n)\n\nwatch(\n  () => route.query.openEnvironmentModal,\n  (newVal) => {\n    if (newVal === 'true') {\n      openEnvironmentModal()\n    }\n  },\n  { immediate: true },\n)\n</script>\n<template>\n  <ViewLayout>\n    <Sidebar title=\"Collections\">\n      <template #content>\n        <div class=\"flex-1\">\n          <SidebarList>\n            <SidebarListElement\n              :key=\"'default'\"\n              class=\"text-xs\"\n              :isCopyable=\"false\"\n              :to=\"{\n                name: 'environment',\n                params: {\n                  [PathId.Environment]: 'default',\n                },\n              }\"\n              type=\"environment\"\n              :variable=\"{\n                name: 'Global Environment',\n                uid: 'default',\n                icon: 'Globe',\n                isDefault: true,\n              }\" />\n            <li\n              v-for=\"collection in nonDraftWorkspaceCollections\"\n              :key=\"collection.uid\"\n              class=\"gap-1/2 flex flex-col\">\n              <button\n                class=\"hover:bg-b-2 group flex w-full items-center gap-1.5 rounded p-1.5 text-left text-sm font-medium break-words\"\n                type=\"button\"\n                @click=\"toggleSidebarFolder(collection.uid)\">\n                <span class=\"flex h-5 max-w-[14px] items-center justify-center\">\n                  <LibraryIcon\n                    class=\"text-sidebar-c-2 size-3.5 min-w-3.5 stroke-2 group-hover:hidden\"\n                    :src=\"\n                      collection['x-scalar-icon'] || 'interface-content-folder'\n                    \" />\n                  <div\n                    :class=\"{\n                      'rotate-90': collapsedSidebarFolders[collection.uid],\n                    }\">\n                    <ScalarIcon\n                      class=\"text-c-3 hover:text-c-1 hidden text-sm group-hover:block\"\n                      icon=\"ChevronRight\"\n                      size=\"md\" />\n                  </div>\n                </span>\n                {{ collection.info?.title ?? '' }}\n              </button>\n              <div\n                v-show=\"showChildren(collection.uid)\"\n                :class=\"{\n                  'before:bg-border relative mb-[.5px] before:pointer-events-none before:absolute before:top-0 before:left-3 before:z-1 before:h-[calc(100%_+_.5px)] before:w-[.5px] last:mb-0 last:before:h-full':\n                    Object.keys(collection['x-scalar-environments'] || {})\n                      .length > 0,\n                }\">\n                <SidebarListElement\n                  v-for=\"(environment, environmentName) in collection[\n                    'x-scalar-environments'\n                  ]\"\n                  :key=\"environmentName\"\n                  class=\"text-xs\"\n                  :collectionId=\"collection.uid\"\n                  :isCopyable=\"false\"\n                  :isDeletable=\"true\"\n                  :isRenameable=\"true\"\n                  :isDraggable=\"true\"\n                  :isDroppable=\"isDroppable\"\n                  :to=\"{\n                    name: 'environment.collection',\n                    params: {\n                      [PathId.Collection]: collection.uid,\n                      [PathId.Environment]: environmentName,\n                    },\n                  }\"\n                  type=\"environment\"\n                  :variable=\"{\n                    name: environmentName,\n                    uid: environmentName,\n                    color: environment.color ?? '#FFFFFF',\n                    isDefault: false,\n                  }\"\n                  :warningMessage=\"`Are you sure you want to delete this environment?`\"\n                  @click.prevent=\"\n                    handleNavigation($event, environmentName, collection.uid)\n                  \"\n                  @colorModal=\"handleOpenColorModal(environmentName)\"\n                  @delete=\"removeCollectionEnvironment(environmentName)\"\n                  @rename=\"openRenameModal(environmentName, collection.uid)\"\n                  @onDragEnd=\"handleDragEnd\" />\n                <ScalarButton\n                  v-if=\"\n                    Object.keys(collection['x-scalar-environments'] || {})\n                      .length === 0\n                  \"\n                  class=\"text-c-1 hover:bg-b-2 flex h-8 w-full justify-start gap-1.5 py-0 pl-6 text-xs\"\n                  variant=\"ghost\"\n                  @click=\"openEnvironmentModal(collection.uid)\">\n                  <ScalarIcon\n                    icon=\"Add\"\n                    size=\"sm\" />\n                  <span>Add Environment</span>\n                </ScalarButton>\n              </div>\n            </li>\n          </SidebarList>\n        </div>\n      </template>\n      <template #button>\n        <SidebarButton\n          :click=\"openEnvironmentModal\"\n          hotkey=\"N\">\n          <template #title> Add Environment </template>\n        </SidebarButton>\n      </template>\n    </Sidebar>\n    <ViewLayoutContent class=\"flex-1\">\n      <ViewLayoutSection>\n        <template\n          v-if=\"currentEnvironmentId\"\n          #title>\n          <span>\n            {{ getEnvironmentName() }}\n          </span>\n        </template>\n        <CodeInput\n          v-if=\"currentEnvironmentId && activeWorkspace\"\n          class=\"py-2 pr-2 pl-px md:px-4\"\n          :envVariables=\"activeEnvVariables\"\n          :environment=\"activeEnvironment\"\n          language=\"json\"\n          lineNumbers\n          lint\n          :modelValue=\"getEnvironmentValue()\"\n          :workspace=\"activeWorkspace\"\n          @update:modelValue=\"handleEnvironmentUpdate\" />\n      </ViewLayoutSection>\n    </ViewLayoutContent>\n    <EnvironmentColorModal\n      :selectedColor=\"selectedColor\"\n      :state=\"colorModal\"\n      @cancel=\"colorModal.hide()\"\n      @submit=\"submitColorChange\" />\n    <EnvironmentModal\n      :activeWorkspaceCollections=\"nonDraftWorkspaceCollections\"\n      :collectionId=\"selectedCollectionId\"\n      :state=\"environmentModal\"\n      @cancel=\"environmentModal.hide()\"\n      @submit=\"addEnvironment\" />\n\n    <ScalarModal\n      :size=\"'xxs'\"\n      :state=\"editModal\"\n      :title=\"`Edit ${selectedEnvironmentId}`\">\n      <EditSidebarListElement\n        :name=\"tempEnvironmentName ?? ''\"\n        @close=\"handleCancelRename\"\n        @edit=\"handleRename\" />\n    </ScalarModal>\n  </ViewLayout>\n</template>\n"],"mappings":""}

package/dist/views/Environment/Environment.vue.script.js

@@ -0,0 +1,384 @@
+import { PathId } from "../../routes.js";
+import { useActiveEntities } from "../../store/active-entities.js";
+import { useSidebar } from "../../hooks/useSidebar.js";
+import { useWorkspace } from "../../store/store.js";
+import CodeInput_default from "../../components/CodeInput/CodeInput.vue.js";
+import Sidebar_default from "../../components/Sidebar/Sidebar.vue.js";
+import ViewLayout_default from "../../components/ViewLayout/ViewLayout.vue.js";
+import ViewLayoutContent_default from "../../components/ViewLayout/ViewLayoutContent.vue.js";
+import ViewLayoutSection_default from "../../components/ViewLayout/ViewLayoutSection.vue.js";
+import EditSidebarListElement_default from "../../components/Sidebar/Actions/EditSidebarListElement.vue.js";
+import EnvironmentColorModal_default from "./EnvironmentColorModal.vue.js";
+import EnvironmentModal_default from "./EnvironmentModal.vue.js";
+import SidebarButton_default from "../../components/Sidebar/SidebarButton.vue.js";
+import SidebarList_default from "../../components/Sidebar/SidebarList.vue.js";
+import SidebarListElement_default from "../../components/Sidebar/SidebarListElement.vue.js";
+import { environmentDragHandlerFactory } from "./handle-drag.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, normalizeClass, onBeforeUnmount, onMounted, openBlock, ref, renderList, toDisplayString, unref, vShow, watch, withCtx, withDirectives, withModifiers } from "vue";
+import { ScalarButton, ScalarIcon, ScalarModal, useModal } from "@scalar/components";
+import { useToasts } from "@scalar/use-toasts";
+import { useRoute, useRouter } from "vue-router";
+import { LibraryIcon } from "@scalar/icons/library";
+//#region src/views/Environment/Environment.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "flex-1" };
+var _hoisted_2 = ["onClick"];
+var _hoisted_3 = { class: "flex h-5 max-w-[14px] items-center justify-center" };
+var Environment_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "Environment",
+	setup(__props) {
+		const router = useRouter();
+		const route = useRoute();
+		const { activeWorkspace, activeEnvironment, activeWorkspaceCollections, activeEnvVariables } = useActiveEntities();
+		const { events, workspaceMutators, collectionMutators } = useWorkspace();
+		const { collapsedSidebarFolders, toggleSidebarFolder } = useSidebar();
+		const colorModal = useModal();
+		const environmentModal = useModal();
+		const editModal = useModal();
+		const colorModalEnvironment = ref(null);
+		const currentEnvironmentId = ref("default");
+		const selectedColor = ref("");
+		const selectedCollectionId = ref(void 0);
+		const selectedEnvironmentId = ref(void 0);
+		const tempEnvironmentName = ref(void 0);
+		const { toast } = useToasts();
+		const parseEnvironmentValue = (value) => JSON.parse(value);
+		function environmentNameToast(environmentNameUsed, collection, collectionId) {
+			if (environmentNameUsed) if (collection.uid === collectionId) toast(`Environment name already used in ${collection.info?.title}`, "error");
+			else toast("Environment name already used in another collection", "error");
+		}
+		const nonDraftWorkspaceCollections = computed(() => {
+			return activeWorkspaceCollections.value.filter((collection) => collection.info?.title !== "Drafts");
+		});
+		function addEnvironment(environment) {
+			if (nonDraftWorkspaceCollections.value.some((collection) => {
+				const enviromentName = Object.keys(collection["x-scalar-environments"] || {}).includes(environment.name);
+				environmentNameToast(enviromentName, collection, environment.collectionId);
+				return enviromentName;
+			})) return;
+			if (environment.collectionId) {
+				collectionMutators.addEnvironment(environment.name, {
+					variables: {},
+					color: environment.color
+				}, environment.collectionId);
+				if (!collapsedSidebarFolders[environment.collectionId]) toggleSidebarFolder(environment.collectionId);
+				router.push({
+					name: "environment.collection",
+					params: {
+						[PathId.Collection]: environment.collectionId,
+						[PathId.Environment]: environment.name
+					}
+				});
+			}
+			environmentModal.hide();
+		}
+		function handleEnvironmentUpdate(raw) {
+			if (!activeEnvironment) return;
+			const updatedValue = parseEnvironmentValue(raw);
+			if (currentEnvironmentId.value === "default") workspaceMutators.edit(activeWorkspace.value?.uid, "environments", updatedValue);
+			else {
+				const collection = activeWorkspaceCollections.value.find((c) => c["x-scalar-environments"]?.[currentEnvironmentId.value ?? ""]);
+				if (collection?.["x-scalar-environments"]?.[currentEnvironmentId.value ?? ""]) {
+					const environment = collection["x-scalar-environments"][currentEnvironmentId.value ?? ""];
+					if (environment) {
+						environment.variables = updatedValue;
+						collectionMutators.edit(collection.uid, "x-scalar-environments", collection["x-scalar-environments"]);
+					}
+				}
+			}
+		}
+		const openEnvironmentModal = (collectionId) => {
+			selectedCollectionId.value = collectionId;
+			environmentModal.show();
+		};
+		const openRenameModal = (environmentId, collectionId) => {
+			selectedEnvironmentId.value = environmentId;
+			selectedCollectionId.value = collectionId;
+			tempEnvironmentName.value = environmentId;
+			editModal.show();
+		};
+		const handleOpenColorModal = (uid) => {
+			colorModalEnvironment.value = uid;
+			selectedColor.value = activeWorkspaceCollections.value.find((collection) => collection["x-scalar-environments"]?.[uid])?.["x-scalar-environments"]?.[uid]?.color ?? "";
+			colorModal.show();
+		};
+		const submitColorChange = (color) => {
+			const environmentId = colorModalEnvironment.value;
+			if (typeof environmentId === "string") {
+				if (activeWorkspaceCollections.value.some((collection) => collection["x-scalar-environments"]?.[environmentId])) activeWorkspaceCollections.value.forEach((collection) => {
+					if (collection["x-scalar-environments"]?.[environmentId]) {
+						collection["x-scalar-environments"][environmentId].color = color;
+						collectionMutators.edit(collection.uid, "x-scalar-environments", collection["x-scalar-environments"]);
+					}
+				});
+				colorModal.hide();
+			}
+		};
+		function removeCollectionEnvironment(environmentName) {
+			nonDraftWorkspaceCollections.value.forEach((collection) => {
+				collectionMutators.removeEnvironment(environmentName, collection.uid);
+			});
+			const remainingCollectionEnvironments = nonDraftWorkspaceCollections.value.flatMap((collection) => Object.keys(collection["x-scalar-environments"] || {}));
+			if (remainingCollectionEnvironments.length > 0) {
+				const lastCollectionEnvironment = remainingCollectionEnvironments[remainingCollectionEnvironments.length - 1];
+				if (!lastCollectionEnvironment) return;
+				const currentCollection = activeWorkspaceCollections.value.find((collection) => Object.keys(collection["x-scalar-environments"] || {}).includes(lastCollectionEnvironment));
+				currentEnvironmentId.value = lastCollectionEnvironment;
+				router.push({
+					name: "environment.collection",
+					params: {
+						[PathId.Collection]: currentCollection?.uid,
+						[PathId.Environment]: lastCollectionEnvironment
+					}
+				});
+				if (currentCollection && !collapsedSidebarFolders[currentCollection.uid]) toggleSidebarFolder(currentCollection.uid);
+			} else {
+				currentEnvironmentId.value = "default";
+				router.push({
+					name: "environment.default",
+					params: { [PathId.Workspace]: activeWorkspace.value?.uid }
+				});
+			}
+		}
+		const getEnvironmentName = () => {
+			return currentEnvironmentId.value === "default" ? "Global Environment" : currentEnvironmentId.value;
+		};
+		const getEnvironmentValue = () => {
+			return currentEnvironmentId.value === "default" ? JSON.stringify(activeWorkspace.value?.environments, null, 2) : JSON.stringify(activeWorkspaceCollections.value.find((collection) => collection["x-scalar-environments"]?.[currentEnvironmentId.value ?? ""])?.["x-scalar-environments"]?.[currentEnvironmentId.value ?? ""]?.variables, null, 2);
+		};
+		const showChildren = (key) => {
+			return collapsedSidebarFolders[key];
+		};
+		const handleHotKey = (event) => {
+			if (event?.createNew && route.name === "environment") openEnvironmentModal();
+		};
+		watch(() => [route.params[PathId.Collection], route.params[PathId.Environment]], ([newCollectionId, newEnvironmentId]) => {
+			if (newCollectionId) currentEnvironmentId.value = newEnvironmentId;
+			else currentEnvironmentId.value = "default";
+		});
+		onMounted(() => {
+			currentEnvironmentId.value = route.params[PathId.Environment] || "default";
+			events.hotKeys.on(handleHotKey);
+			const collectionId = route.params[PathId.Collection];
+			if (collectionId && !collapsedSidebarFolders[collectionId]) toggleSidebarFolder(collectionId);
+		});
+		onBeforeUnmount(() => events.hotKeys.off(handleHotKey));
+		const handleNavigation = (event, uid, collectionId) => {
+			const to = collectionId ? {
+				name: "environment.collection",
+				params: {
+					[PathId.Workspace]: activeWorkspace.value?.uid,
+					[PathId.Collection]: collectionId,
+					[PathId.Environment]: uid
+				}
+			} : {
+				name: "environment.default",
+				params: {
+					[PathId.Workspace]: activeWorkspace.value?.uid,
+					[PathId.Environment]: uid
+				}
+			};
+			if (event.metaKey) window.open(router.resolve(to).href, "_blank");
+			else router.push(to);
+		};
+		function handleCancelRename() {
+			selectedEnvironmentId.value = void 0;
+			selectedCollectionId.value = void 0;
+			tempEnvironmentName.value = void 0;
+			editModal.hide();
+		}
+		function handleRename(newName) {
+			if (nonDraftWorkspaceCollections.value.some((collection) => {
+				const enviromentName = Object.keys(collection["x-scalar-environments"] || {}).includes(newName);
+				environmentNameToast(enviromentName, collection, selectedCollectionId.value);
+				return enviromentName;
+			})) return;
+			if (newName && selectedEnvironmentId.value !== "default") activeWorkspaceCollections.value.forEach((collection) => {
+				if (collection["x-scalar-environments"]?.[selectedEnvironmentId.value ?? ""]) {
+					const environments = collection["x-scalar-environments"];
+					const orderedEnvs = {};
+					Object.keys(environments).forEach((key) => {
+						const environment = environments[key];
+						if (!environment) return;
+						if (key === selectedEnvironmentId.value) orderedEnvs[newName] = environment;
+						else orderedEnvs[key] = environment;
+					});
+					collection["x-scalar-environments"] = orderedEnvs;
+					collectionMutators.edit(collection.uid, "x-scalar-environments", collection["x-scalar-environments"]);
+				}
+			});
+			if (newName && currentEnvironmentId.value === selectedEnvironmentId.value) currentEnvironmentId.value = newName;
+			selectedEnvironmentId.value = void 0;
+			selectedCollectionId.value = void 0;
+			tempEnvironmentName.value = void 0;
+			editModal.hide();
+		}
+		const { handleDragEnd, isDroppable } = environmentDragHandlerFactory(activeWorkspaceCollections, collectionMutators);
+		watch(() => route.query.openEnvironmentModal, (newVal) => {
+			if (newVal === "true") openEnvironmentModal();
+		}, { immediate: true });
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(ViewLayout_default, null, {
+				default: withCtx(() => [
+					createVNode(Sidebar_default, { title: "Collections" }, {
+						content: withCtx(() => [createElementVNode("div", _hoisted_1, [createVNode(SidebarList_default, null, {
+							default: withCtx(() => [(openBlock(), createBlock(SidebarListElement_default, {
+								key: "default",
+								class: "text-xs",
+								isCopyable: false,
+								to: {
+									name: "environment",
+									params: { [unref(PathId).Environment]: "default" }
+								},
+								type: "environment",
+								variable: {
+									name: "Global Environment",
+									uid: "default",
+									icon: "Globe",
+									isDefault: true
+								}
+							}, null, 8, ["to"])), (openBlock(true), createElementBlock(Fragment, null, renderList(nonDraftWorkspaceCollections.value, (collection) => {
+								return openBlock(), createElementBlock("li", {
+									key: collection.uid,
+									class: "gap-1/2 flex flex-col"
+								}, [createElementVNode("button", {
+									class: "hover:bg-b-2 group flex w-full items-center gap-1.5 rounded p-1.5 text-left text-sm font-medium break-words",
+									type: "button",
+									onClick: ($event) => unref(toggleSidebarFolder)(collection.uid)
+								}, [createElementVNode("span", _hoisted_3, [createVNode(unref(LibraryIcon), {
+									class: "text-sidebar-c-2 size-3.5 min-w-3.5 stroke-2 group-hover:hidden",
+									src: collection["x-scalar-icon"] || "interface-content-folder"
+								}, null, 8, ["src"]), createElementVNode("div", { class: normalizeClass({ "rotate-90": unref(collapsedSidebarFolders)[collection.uid] }) }, [createVNode(unref(ScalarIcon), {
+									class: "text-c-3 hover:text-c-1 hidden text-sm group-hover:block",
+									icon: "ChevronRight",
+									size: "md"
+								})], 2)]), createTextVNode(" " + toDisplayString(collection.info?.title ?? ""), 1)], 8, _hoisted_2), withDirectives(createElementVNode("div", { class: normalizeClass({ "before:bg-border relative mb-[.5px] before:pointer-events-none before:absolute before:top-0 before:left-3 before:z-1 before:h-[calc(100%_+_.5px)] before:w-[.5px] last:mb-0 last:before:h-full": Object.keys(collection["x-scalar-environments"] || {}).length > 0 }) }, [(openBlock(true), createElementBlock(Fragment, null, renderList(collection["x-scalar-environments"], (environment, environmentName) => {
+									return openBlock(), createBlock(SidebarListElement_default, {
+										key: environmentName,
+										class: "text-xs",
+										collectionId: collection.uid,
+										isCopyable: false,
+										isDeletable: true,
+										isRenameable: true,
+										isDraggable: true,
+										isDroppable: unref(isDroppable),
+										to: {
+											name: "environment.collection",
+											params: {
+												[unref(PathId).Collection]: collection.uid,
+												[unref(PathId).Environment]: environmentName
+											}
+										},
+										type: "environment",
+										variable: {
+											name: environmentName,
+											uid: environmentName,
+											color: environment.color ?? "#FFFFFF",
+											isDefault: false
+										},
+										warningMessage: `Are you sure you want to delete this environment?`,
+										onClick: withModifiers(($event) => handleNavigation($event, environmentName, collection.uid), ["prevent"]),
+										onColorModal: ($event) => handleOpenColorModal(environmentName),
+										onDelete: ($event) => removeCollectionEnvironment(environmentName),
+										onRename: ($event) => openRenameModal(environmentName, collection.uid),
+										onOnDragEnd: unref(handleDragEnd)
+									}, null, 8, [
+										"collectionId",
+										"isDroppable",
+										"to",
+										"variable",
+										"onClick",
+										"onColorModal",
+										"onDelete",
+										"onRename",
+										"onOnDragEnd"
+									]);
+								}), 128)), Object.keys(collection["x-scalar-environments"] || {}).length === 0 ? (openBlock(), createBlock(unref(ScalarButton), {
+									key: 0,
+									class: "text-c-1 hover:bg-b-2 flex h-8 w-full justify-start gap-1.5 py-0 pl-6 text-xs",
+									variant: "ghost",
+									onClick: ($event) => openEnvironmentModal(collection.uid)
+								}, {
+									default: withCtx(() => [createVNode(unref(ScalarIcon), {
+										icon: "Add",
+										size: "sm"
+									}), _cache[2] || (_cache[2] = createElementVNode("span", null, "Add Environment", -1))]),
+									_: 1
+								}, 8, ["onClick"])) : createCommentVNode("", true)], 2), [[vShow, showChildren(collection.uid)]])]);
+							}), 128))]),
+							_: 1
+						})])]),
+						button: withCtx(() => [createVNode(SidebarButton_default, {
+							click: openEnvironmentModal,
+							hotkey: "N"
+						}, {
+							title: withCtx(() => [..._cache[3] || (_cache[3] = [createTextVNode(" Add Environment ", -1)])]),
+							_: 1
+						})]),
+						_: 1
+					}),
+					createVNode(ViewLayoutContent_default, { class: "flex-1" }, {
+						default: withCtx(() => [createVNode(ViewLayoutSection_default, null, createSlots({
+							default: withCtx(() => [currentEnvironmentId.value && unref(activeWorkspace) ? (openBlock(), createBlock(CodeInput_default, {
+								key: 0,
+								class: "py-2 pr-2 pl-px md:px-4",
+								envVariables: unref(activeEnvVariables),
+								environment: unref(activeEnvironment),
+								language: "json",
+								lineNumbers: "",
+								lint: "",
+								modelValue: getEnvironmentValue(),
+								workspace: unref(activeWorkspace),
+								"onUpdate:modelValue": handleEnvironmentUpdate
+							}, null, 8, [
+								"envVariables",
+								"environment",
+								"modelValue",
+								"workspace"
+							])) : createCommentVNode("", true)]),
+							_: 2
+						}, [currentEnvironmentId.value ? {
+							name: "title",
+							fn: withCtx(() => [createElementVNode("span", null, toDisplayString(getEnvironmentName()), 1)]),
+							key: "0"
+						} : void 0]), 1024)]),
+						_: 1
+					}),
+					createVNode(EnvironmentColorModal_default, {
+						selectedColor: selectedColor.value,
+						state: unref(colorModal),
+						onCancel: _cache[0] || (_cache[0] = ($event) => unref(colorModal).hide()),
+						onSubmit: submitColorChange
+					}, null, 8, ["selectedColor", "state"]),
+					createVNode(EnvironmentModal_default, {
+						activeWorkspaceCollections: nonDraftWorkspaceCollections.value,
+						collectionId: selectedCollectionId.value,
+						state: unref(environmentModal),
+						onCancel: _cache[1] || (_cache[1] = ($event) => unref(environmentModal).hide()),
+						onSubmit: addEnvironment
+					}, null, 8, [
+						"activeWorkspaceCollections",
+						"collectionId",
+						"state"
+					]),
+					createVNode(unref(ScalarModal), {
+						size: "xxs",
+						state: unref(editModal),
+						title: `Edit ${selectedEnvironmentId.value}`
+					}, {
+						default: withCtx(() => [createVNode(EditSidebarListElement_default, {
+							name: tempEnvironmentName.value ?? "",
+							onClose: handleCancelRename,
+							onEdit: handleRename
+						}, null, 8, ["name"])]),
+						_: 1
+					}, 8, ["state", "title"])
+				]),
+				_: 1
+			});
+		};
+	}
+});
+//#endregion
+export { Environment_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=Environment.vue.script.js.map

package/dist/views/Environment/Environment.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Environment.vue.script.js","names":[],"sources":["../../../src/views/Environment/Environment.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarIcon,\n  ScalarModal,\n  useModal,\n} from '@scalar/components'\nimport { LibraryIcon } from '@scalar/icons/library'\nimport type { Collection } from '@scalar/oas-utils/entities/spec'\nimport { useToasts } from '@scalar/use-toasts'\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue'\nimport { useRoute, useRouter } from 'vue-router'\n\nimport CodeInput from '@/components/CodeInput/CodeInput.vue'\nimport EditSidebarListElement from '@/components/Sidebar/Actions/EditSidebarListElement.vue'\nimport Sidebar from '@/components/Sidebar/Sidebar.vue'\nimport SidebarButton from '@/components/Sidebar/SidebarButton.vue'\nimport SidebarList from '@/components/Sidebar/SidebarList.vue'\nimport SidebarListElement from '@/components/Sidebar/SidebarListElement.vue'\nimport ViewLayout from '@/components/ViewLayout/ViewLayout.vue'\nimport ViewLayoutContent from '@/components/ViewLayout/ViewLayoutContent.vue'\nimport ViewLayoutSection from '@/components/ViewLayout/ViewLayoutSection.vue'\nimport { useSidebar } from '@/hooks/useSidebar'\nimport type { HotKeyEvent } from '@/libs'\nimport type { EnvConfig } from '@/libs/env-helpers'\nimport { PathId } from '@/routes'\nimport { useWorkspace } from '@/store'\nimport { useActiveEntities } from '@/store/active-entities'\n\nimport EnvironmentColorModal from './EnvironmentColorModal.vue'\nimport EnvironmentModal from './EnvironmentModal.vue'\nimport { environmentDragHandlerFactory } from './handle-drag'\n\nconst router = useRouter()\nconst route = useRoute()\nconst {\n  activeWorkspace,\n  activeEnvironment,\n  activeWorkspaceCollections,\n  activeEnvVariables,\n} = useActiveEntities()\nconst { events, workspaceMutators, collectionMutators } = useWorkspace()\nconst { collapsedSidebarFolders, toggleSidebarFolder } = useSidebar()\nconst colorModal = useModal()\nconst environmentModal = useModal()\n\nconst editModal = useModal()\n\nconst colorModalEnvironment = ref<string | null>(null)\nconst currentEnvironmentId = ref('default')\nconst selectedColor = ref('')\nconst selectedCollectionId = ref<string | undefined>(undefined)\nconst selectedEnvironmentId = ref<string | undefined>(undefined)\nconst tempEnvironmentName = ref<string | undefined>(undefined)\n\nconst { toast } = useToasts()\n\nconst parseEnvironmentValue = (value: string): Record<string, string> =>\n  JSON.parse(value)\n\nfunction environmentNameToast(\n  environmentNameUsed: boolean,\n  collection: any,\n  collectionId: string | undefined,\n) {\n  if (environmentNameUsed) {\n    if (collection.uid === collectionId) {\n      toast(\n        `Environment name already used in ${collection.info?.title}`,\n        'error',\n      )\n    } else {\n      toast('Environment name already used in another collection', 'error')\n    }\n  }\n}\n\n// Returns non-draft collections only\nconst nonDraftWorkspaceCollections = computed(() => {\n  return activeWorkspaceCollections.value.filter(\n    (collection) => collection.info?.title !== 'Drafts',\n  )\n})\n\nfunction addEnvironment(environment: {\n  name: string\n  color: string\n  collectionId: Collection['uid'] | undefined\n}) {\n  const environmentNameUsed = nonDraftWorkspaceCollections.value.some(\n    (collection) => {\n      const enviromentName = Object.keys(\n        collection['x-scalar-environments'] || {},\n      ).includes(environment.name)\n      environmentNameToast(enviromentName, collection, environment.collectionId)\n      return enviromentName\n    },\n  )\n  if (environmentNameUsed) {\n    return\n  }\n  if (environment.collectionId) {\n    collectionMutators.addEnvironment(\n      environment.name,\n      {\n        variables: {},\n        color: environment.color,\n      },\n      environment.collectionId,\n    )\n    if (!collapsedSidebarFolders[environment.collectionId]) {\n      toggleSidebarFolder(environment.collectionId)\n    }\n    router.push({\n      name: 'environment.collection',\n      params: {\n        [PathId.Collection]: environment.collectionId,\n        [PathId.Environment]: environment.name,\n      },\n    })\n  }\n\n  environmentModal.hide()\n}\n\nfunction handleEnvironmentUpdate(raw: string) {\n  if (!activeEnvironment) {\n    return\n  }\n\n  const updatedValue = parseEnvironmentValue(raw)\n\n  if (currentEnvironmentId.value === 'default') {\n    workspaceMutators.edit(\n      activeWorkspace.value?.uid,\n      'environments',\n      updatedValue,\n    )\n  } else {\n    const collection = activeWorkspaceCollections.value.find(\n      (c) => c['x-scalar-environments']?.[currentEnvironmentId.value ?? ''],\n    )\n    if (\n      collection?.['x-scalar-environments']?.[currentEnvironmentId.value ?? '']\n    ) {\n      const environment =\n        collection['x-scalar-environments'][currentEnvironmentId.value ?? '']\n      if (environment) {\n        environment.variables = updatedValue\n        collectionMutators.edit(\n          collection.uid,\n          'x-scalar-environments',\n          collection['x-scalar-environments'],\n        )\n      }\n    }\n  }\n}\n\nconst openEnvironmentModal = (collectionId?: string) => {\n  selectedCollectionId.value = collectionId\n  environmentModal.show()\n}\n\nconst openRenameModal = (environmentId: string, collectionId: string) => {\n  selectedEnvironmentId.value = environmentId\n  selectedCollectionId.value = collectionId\n  tempEnvironmentName.value = environmentId\n  editModal.show()\n}\n\nconst handleOpenColorModal = (uid: string) => {\n  colorModalEnvironment.value = uid\n  selectedColor.value =\n    activeWorkspaceCollections.value.find(\n      (collection) => collection['x-scalar-environments']?.[uid],\n    )?.['x-scalar-environments']?.[uid]?.color ?? ''\n  colorModal.show()\n}\n\nconst submitColorChange = (color: string) => {\n  const environmentId = colorModalEnvironment.value\n  if (typeof environmentId === 'string') {\n    const isCollection = activeWorkspaceCollections.value.some(\n      (collection) => collection['x-scalar-environments']?.[environmentId],\n    )\n    if (isCollection) {\n      activeWorkspaceCollections.value.forEach((collection) => {\n        if (collection['x-scalar-environments']?.[environmentId]) {\n          collection['x-scalar-environments'][environmentId].color = color\n          collectionMutators.edit(\n            collection.uid,\n            'x-scalar-environments',\n            collection['x-scalar-environments'],\n          )\n        }\n      })\n    }\n    colorModal.hide()\n  }\n}\n\nfunction removeCollectionEnvironment(environmentName: string) {\n  nonDraftWorkspaceCollections.value.forEach((collection) => {\n    collectionMutators.removeEnvironment(environmentName, collection.uid)\n  })\n\n  // Redirect to last available environment\n  const remainingCollectionEnvironments =\n    nonDraftWorkspaceCollections.value.flatMap((collection) =>\n      Object.keys(collection['x-scalar-environments'] || {}),\n    )\n\n  if (remainingCollectionEnvironments.length > 0) {\n    const lastCollectionEnvironment =\n      remainingCollectionEnvironments[\n        remainingCollectionEnvironments.length - 1\n      ]\n\n    if (!lastCollectionEnvironment) {\n      return\n    }\n\n    const currentCollection = activeWorkspaceCollections.value.find(\n      (collection) =>\n        Object.keys(collection['x-scalar-environments'] || {}).includes(\n          lastCollectionEnvironment,\n        ),\n    )\n    currentEnvironmentId.value = lastCollectionEnvironment\n    router.push({\n      name: 'environment.collection',\n      params: {\n        [PathId.Collection]: currentCollection?.uid,\n        [PathId.Environment]: lastCollectionEnvironment,\n      },\n    })\n    if (currentCollection && !collapsedSidebarFolders[currentCollection.uid]) {\n      toggleSidebarFolder(currentCollection.uid)\n    }\n  } else {\n    currentEnvironmentId.value = 'default'\n    router.push({\n      name: 'environment.default',\n      params: {\n        [PathId.Workspace]: activeWorkspace.value?.uid,\n      },\n    })\n  }\n}\n\nconst getEnvironmentName = () => {\n  return currentEnvironmentId.value === 'default'\n    ? 'Global Environment'\n    : currentEnvironmentId.value\n}\n\nconst getEnvironmentValue = () => {\n  return currentEnvironmentId.value === 'default'\n    ? JSON.stringify(activeWorkspace.value?.environments, null, 2)\n    : JSON.stringify(\n        activeWorkspaceCollections.value.find(\n          (collection) =>\n            collection['x-scalar-environments']?.[\n              currentEnvironmentId.value ?? ''\n            ],\n        )?.['x-scalar-environments']?.[currentEnvironmentId.value ?? '']\n          ?.variables,\n        null,\n        2,\n      )\n}\n\nconst showChildren = (key: string) => {\n  return collapsedSidebarFolders[key]\n}\n\nconst handleHotKey = (event?: HotKeyEvent) => {\n  if (event?.createNew && route.name === 'environment') {\n    openEnvironmentModal()\n  }\n}\n\nwatch(\n  () => [route.params[PathId.Collection], route.params[PathId.Environment]],\n  ([newCollectionId, newEnvironmentId]) => {\n    if (newCollectionId) {\n      // Collection environment\n      currentEnvironmentId.value = newEnvironmentId as string\n    } else {\n      // Global environment\n      currentEnvironmentId.value = 'default'\n    }\n  },\n)\n\nonMounted(() => {\n  currentEnvironmentId.value =\n    (route.params[PathId.Environment] as string) || 'default'\n  events.hotKeys.on(handleHotKey)\n  const collectionId = route.params[PathId.Collection]\n  if (collectionId && !collapsedSidebarFolders[collectionId as string]) {\n    toggleSidebarFolder(collectionId as string)\n  }\n})\nonBeforeUnmount(() => events.hotKeys.off(handleHotKey))\n\nconst handleNavigation = (\n  event: MouseEvent,\n  uid: string,\n  collectionId?: string,\n) => {\n  const to = collectionId\n    ? {\n        name: 'environment.collection',\n        params: {\n          [PathId.Workspace]: activeWorkspace.value?.uid,\n          [PathId.Collection]: collectionId,\n          [PathId.Environment]: uid,\n        },\n      }\n    : {\n        name: 'environment.default',\n        params: {\n          [PathId.Workspace]: activeWorkspace.value?.uid,\n          [PathId.Environment]: uid,\n        },\n      }\n  if (event.metaKey) {\n    window.open(router.resolve(to).href, '_blank')\n  } else {\n    router.push(to)\n  }\n}\n\nfunction handleCancelRename() {\n  selectedEnvironmentId.value = undefined\n  selectedCollectionId.value = undefined\n  tempEnvironmentName.value = undefined\n  editModal.hide()\n}\n\nfunction handleRename(newName: string) {\n  const environmentNameUsed = nonDraftWorkspaceCollections.value.some(\n    (collection) => {\n      const enviromentName = Object.keys(\n        collection['x-scalar-environments'] || {},\n      ).includes(newName)\n      environmentNameToast(\n        enviromentName,\n        collection,\n        selectedCollectionId.value,\n      )\n      return enviromentName\n    },\n  )\n  if (environmentNameUsed) {\n    return\n  }\n  if (newName && selectedEnvironmentId.value !== 'default') {\n    activeWorkspaceCollections.value.forEach((collection) => {\n      if (\n        collection['x-scalar-environments']?.[selectedEnvironmentId.value ?? '']\n      ) {\n        const environments = collection['x-scalar-environments']\n        // Maintains order of environments in the sidebar as we use uid as the name\n        const orderedEnvs: Record<string, EnvConfig> = {}\n\n        // Preserve order by rebuilding the environments object\n        Object.keys(environments).forEach((key) => {\n          const environment = environments[key]\n\n          if (!environment) {\n            return\n          }\n\n          if (key === selectedEnvironmentId.value) {\n            orderedEnvs[newName] = environment\n          } else {\n            orderedEnvs[key] = environment\n          }\n        })\n\n        collection['x-scalar-environments'] = orderedEnvs\n        collectionMutators.edit(\n          collection.uid,\n          'x-scalar-environments',\n          collection['x-scalar-environments'],\n        )\n      }\n    })\n  }\n\n  if (newName && currentEnvironmentId.value === selectedEnvironmentId.value) {\n    currentEnvironmentId.value = newName\n  }\n\n  selectedEnvironmentId.value = undefined\n  selectedCollectionId.value = undefined\n  tempEnvironmentName.value = undefined\n  editModal.hide()\n}\n\n// Replace handleEnvironmentDragEnd with the factory\nconst { handleDragEnd, isDroppable } = environmentDragHandlerFactory(\n  activeWorkspaceCollections,\n  collectionMutators,\n)\n\nwatch(\n  () => route.query.openEnvironmentModal,\n  (newVal) => {\n    if (newVal === 'true') {\n      openEnvironmentModal()\n    }\n  },\n  { immediate: true },\n)\n</script>\n<template>\n  <ViewLayout>\n    <Sidebar title=\"Collections\">\n      <template #content>\n        <div class=\"flex-1\">\n          <SidebarList>\n            <SidebarListElement\n              :key=\"'default'\"\n              class=\"text-xs\"\n              :isCopyable=\"false\"\n              :to=\"{\n                name: 'environment',\n                params: {\n                  [PathId.Environment]: 'default',\n                },\n              }\"\n              type=\"environment\"\n              :variable=\"{\n                name: 'Global Environment',\n                uid: 'default',\n                icon: 'Globe',\n                isDefault: true,\n              }\" />\n            <li\n              v-for=\"collection in nonDraftWorkspaceCollections\"\n              :key=\"collection.uid\"\n              class=\"gap-1/2 flex flex-col\">\n              <button\n                class=\"hover:bg-b-2 group flex w-full items-center gap-1.5 rounded p-1.5 text-left text-sm font-medium break-words\"\n                type=\"button\"\n                @click=\"toggleSidebarFolder(collection.uid)\">\n                <span class=\"flex h-5 max-w-[14px] items-center justify-center\">\n                  <LibraryIcon\n                    class=\"text-sidebar-c-2 size-3.5 min-w-3.5 stroke-2 group-hover:hidden\"\n                    :src=\"\n                      collection['x-scalar-icon'] || 'interface-content-folder'\n                    \" />\n                  <div\n                    :class=\"{\n                      'rotate-90': collapsedSidebarFolders[collection.uid],\n                    }\">\n                    <ScalarIcon\n                      class=\"text-c-3 hover:text-c-1 hidden text-sm group-hover:block\"\n                      icon=\"ChevronRight\"\n                      size=\"md\" />\n                  </div>\n                </span>\n                {{ collection.info?.title ?? '' }}\n              </button>\n              <div\n                v-show=\"showChildren(collection.uid)\"\n                :class=\"{\n                  'before:bg-border relative mb-[.5px] before:pointer-events-none before:absolute before:top-0 before:left-3 before:z-1 before:h-[calc(100%_+_.5px)] before:w-[.5px] last:mb-0 last:before:h-full':\n                    Object.keys(collection['x-scalar-environments'] || {})\n                      .length > 0,\n                }\">\n                <SidebarListElement\n                  v-for=\"(environment, environmentName) in collection[\n                    'x-scalar-environments'\n                  ]\"\n                  :key=\"environmentName\"\n                  class=\"text-xs\"\n                  :collectionId=\"collection.uid\"\n                  :isCopyable=\"false\"\n                  :isDeletable=\"true\"\n                  :isRenameable=\"true\"\n                  :isDraggable=\"true\"\n                  :isDroppable=\"isDroppable\"\n                  :to=\"{\n                    name: 'environment.collection',\n                    params: {\n                      [PathId.Collection]: collection.uid,\n                      [PathId.Environment]: environmentName,\n                    },\n                  }\"\n                  type=\"environment\"\n                  :variable=\"{\n                    name: environmentName,\n                    uid: environmentName,\n                    color: environment.color ?? '#FFFFFF',\n                    isDefault: false,\n                  }\"\n                  :warningMessage=\"`Are you sure you want to delete this environment?`\"\n                  @click.prevent=\"\n                    handleNavigation($event, environmentName, collection.uid)\n                  \"\n                  @colorModal=\"handleOpenColorModal(environmentName)\"\n                  @delete=\"removeCollectionEnvironment(environmentName)\"\n                  @rename=\"openRenameModal(environmentName, collection.uid)\"\n                  @onDragEnd=\"handleDragEnd\" />\n                <ScalarButton\n                  v-if=\"\n                    Object.keys(collection['x-scalar-environments'] || {})\n                      .length === 0\n                  \"\n                  class=\"text-c-1 hover:bg-b-2 flex h-8 w-full justify-start gap-1.5 py-0 pl-6 text-xs\"\n                  variant=\"ghost\"\n                  @click=\"openEnvironmentModal(collection.uid)\">\n                  <ScalarIcon\n                    icon=\"Add\"\n                    size=\"sm\" />\n                  <span>Add Environment</span>\n                </ScalarButton>\n              </div>\n            </li>\n          </SidebarList>\n        </div>\n      </template>\n      <template #button>\n        <SidebarButton\n          :click=\"openEnvironmentModal\"\n          hotkey=\"N\">\n          <template #title> Add Environment </template>\n        </SidebarButton>\n      </template>\n    </Sidebar>\n    <ViewLayoutContent class=\"flex-1\">\n      <ViewLayoutSection>\n        <template\n          v-if=\"currentEnvironmentId\"\n          #title>\n          <span>\n            {{ getEnvironmentName() }}\n          </span>\n        </template>\n        <CodeInput\n          v-if=\"currentEnvironmentId && activeWorkspace\"\n          class=\"py-2 pr-2 pl-px md:px-4\"\n          :envVariables=\"activeEnvVariables\"\n          :environment=\"activeEnvironment\"\n          language=\"json\"\n          lineNumbers\n          lint\n          :modelValue=\"getEnvironmentValue()\"\n          :workspace=\"activeWorkspace\"\n          @update:modelValue=\"handleEnvironmentUpdate\" />\n      </ViewLayoutSection>\n    </ViewLayoutContent>\n    <EnvironmentColorModal\n      :selectedColor=\"selectedColor\"\n      :state=\"colorModal\"\n      @cancel=\"colorModal.hide()\"\n      @submit=\"submitColorChange\" />\n    <EnvironmentModal\n      :activeWorkspaceCollections=\"nonDraftWorkspaceCollections\"\n      :collectionId=\"selectedCollectionId\"\n      :state=\"environmentModal\"\n      @cancel=\"environmentModal.hide()\"\n      @submit=\"addEnvironment\" />\n\n    <ScalarModal\n      :size=\"'xxs'\"\n      :state=\"editModal\"\n      :title=\"`Edit ${selectedEnvironmentId}`\">\n      <EditSidebarListElement\n        :name=\"tempEnvironmentName ?? ''\"\n        @close=\"handleCancelRename\"\n        @edit=\"handleRename\" />\n    </ScalarModal>\n  </ViewLayout>\n</template>\n"],"mappings":"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"}

package/dist/views/Environment/EnvironmentColorModal.vue.js

@@ -0,0 +1,7 @@
+import EnvironmentColorModal_vue_vue_type_script_setup_true_lang_default from "./EnvironmentColorModal.vue.script.js";
+//#region src/views/Environment/EnvironmentColorModal.vue
+var EnvironmentColorModal_default = EnvironmentColorModal_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { EnvironmentColorModal_default as default };
+
+//# sourceMappingURL=EnvironmentColorModal.vue.js.map

package/dist/views/Environment/EnvironmentColorModal.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EnvironmentColorModal.vue.js","names":[],"sources":["../../../src/views/Environment/EnvironmentColorModal.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarModal, type ModalState } from '@scalar/components'\nimport { ref } from 'vue'\n\nimport SidebarListElementForm from '@/components/Sidebar/Actions/SidebarListElementForm.vue'\n\nimport EnvironmentColors from './EnvironmentColors.vue'\n\nconst props = defineProps<{\n  state: ModalState\n  selectedColor: string\n}>()\n\nconst emit = defineEmits<{\n  (e: 'cancel'): void\n  (e: 'submit', color: string): void\n}>()\n\nconst newColor = ref('')\n\nconst handleColorSelect = (color: string) => {\n  newColor.value = color\n}\n\nconst handleSubmit = () => {\n  emit('submit', newColor.value)\n  newColor.value = ''\n}\n</script>\n<template>\n  <ScalarModal\n    size=\"xxs\"\n    :state=\"state\"\n    title=\"Edit Environment Color\">\n    <div class=\"flex flex-col gap-4\">\n      <EnvironmentColors\n        :activeColor=\"newColor || props.selectedColor\"\n        class=\"w-full p-1\"\n        @select=\"handleColorSelect\" />\n      <SidebarListElementForm\n        @cancel=\"emit('cancel')\"\n        @submit=\"handleSubmit\">\n      </SidebarListElementForm>\n    </div>\n  </ScalarModal>\n</template>\n"],"mappings":""}

package/dist/views/Environment/EnvironmentColorModal.vue.script.js

@@ -0,0 +1,47 @@
+import SidebarListElementForm_default from "../../components/Sidebar/Actions/SidebarListElementForm.vue.js";
+import EnvironmentColors_default from "./EnvironmentColors.vue.js";
+import { createBlock, createElementVNode, createVNode, defineComponent, openBlock, ref, unref, withCtx } from "vue";
+import { ScalarModal } from "@scalar/components";
+//#region src/views/Environment/EnvironmentColorModal.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "flex flex-col gap-4" };
+var EnvironmentColorModal_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "EnvironmentColorModal",
+	props: {
+		state: {},
+		selectedColor: {}
+	},
+	emits: ["cancel", "submit"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const newColor = ref("");
+		const handleColorSelect = (color) => {
+			newColor.value = color;
+		};
+		const handleSubmit = () => {
+			emit("submit", newColor.value);
+			newColor.value = "";
+		};
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(ScalarModal), {
+				size: "xxs",
+				state: __props.state,
+				title: "Edit Environment Color"
+			}, {
+				default: withCtx(() => [createElementVNode("div", _hoisted_1, [createVNode(EnvironmentColors_default, {
+					activeColor: newColor.value || props.selectedColor,
+					class: "w-full p-1",
+					onSelect: handleColorSelect
+				}, null, 8, ["activeColor"]), createVNode(SidebarListElementForm_default, {
+					onCancel: _cache[0] || (_cache[0] = ($event) => emit("cancel")),
+					onSubmit: handleSubmit
+				})])]),
+				_: 1
+			}, 8, ["state"]);
+		};
+	}
+});
+//#endregion
+export { EnvironmentColorModal_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=EnvironmentColorModal.vue.script.js.map

package/dist/views/Environment/EnvironmentColorModal.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EnvironmentColorModal.vue.script.js","names":[],"sources":["../../../src/views/Environment/EnvironmentColorModal.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarModal, type ModalState } from '@scalar/components'\nimport { ref } from 'vue'\n\nimport SidebarListElementForm from '@/components/Sidebar/Actions/SidebarListElementForm.vue'\n\nimport EnvironmentColors from './EnvironmentColors.vue'\n\nconst props = defineProps<{\n  state: ModalState\n  selectedColor: string\n}>()\n\nconst emit = defineEmits<{\n  (e: 'cancel'): void\n  (e: 'submit', color: string): void\n}>()\n\nconst newColor = ref('')\n\nconst handleColorSelect = (color: string) => {\n  newColor.value = color\n}\n\nconst handleSubmit = () => {\n  emit('submit', newColor.value)\n  newColor.value = ''\n}\n</script>\n<template>\n  <ScalarModal\n    size=\"xxs\"\n    :state=\"state\"\n    title=\"Edit Environment Color\">\n    <div class=\"flex flex-col gap-4\">\n      <EnvironmentColors\n        :activeColor=\"newColor || props.selectedColor\"\n        class=\"w-full p-1\"\n        @select=\"handleColorSelect\" />\n      <SidebarListElementForm\n        @cancel=\"emit('cancel')\"\n        @submit=\"handleSubmit\">\n      </SidebarListElementForm>\n    </div>\n  </ScalarModal>\n</template>\n"],"mappings":";;;;;;;;;;;;;;EAQA,MAAM,QAAQ;EAKd,MAAM,OAAO;EAKb,MAAM,WAAW,IAAI,GAAE;EAEvB,MAAM,qBAAqB,UAAkB;AAC3C,YAAS,QAAQ;;EAGnB,MAAM,qBAAqB;AACzB,QAAK,UAAU,SAAS,MAAK;AAC7B,YAAS,QAAQ;;;uBAIjB,YAcc,MAAA,YAAA,EAAA;IAbZ,MAAK;IACJ,OAAO,QAAA;IACR,OAAM;;2BAUA,CATN,mBASM,OATN,YASM,CARJ,YAGgC,2BAAA;KAF7B,aAAa,SAAA,SAAY,MAAM;KAChC,OAAM;KACL,UAAQ;kCACX,YAGyB,gCAAA;KAFtB,UAAM,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,SAAA;KACZ,UAAQ"}

package/dist/views/Environment/EnvironmentColors.vue.js

@@ -0,0 +1,7 @@
+import EnvironmentColors_vue_vue_type_script_setup_true_lang_default from "./EnvironmentColors.vue.script.js";
+//#region src/views/Environment/EnvironmentColors.vue
+var EnvironmentColors_default = EnvironmentColors_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { EnvironmentColors_default as default };
+
+//# sourceMappingURL=EnvironmentColors.vue.js.map

package/dist/views/Environment/EnvironmentColors.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EnvironmentColors.vue.js","names":[],"sources":["../../../src/views/Environment/EnvironmentColors.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarIcon } from '@scalar/components'\nimport { computed, nextTick, ref, watch } from 'vue'\n\nconst props = withDefaults(\n  defineProps<{\n    activeColor: string\n    selector?: boolean\n  }>(),\n  {\n    selector: false,\n  },\n)\n\nconst emit = defineEmits<{\n  (e: 'select', color: string): void\n}>()\n\nconst customColor = ref('')\nconst customColorInputRef = ref<HTMLInputElement | null>(null)\nconst showCustomInput = ref(false)\nconst showSelector = ref(false)\n\nconst colorOptions = [\n  { color: '#FFFFFF' },\n  { color: '#EF0006' },\n  { color: '#EDBE20' },\n  { color: '#069061' },\n  { color: '#FB892C' },\n  { color: '#0082D0' },\n  { color: '#5203D1' },\n  { color: '#FFC0CB' },\n]\n\nconst backgroundStyle = computed(() => {\n  return (props.activeColor &&\n    !colorOptions.some((option) => option.color === props.activeColor)) ||\n    customColor.value\n    ? `background-color: ${props.activeColor || customColor.value};`\n    : 'background: linear-gradient(to right, rgb(235, 87, 87), rgb(242, 201, 76), rgb(76, 183, 130), rgb(78, 167, 252), rgb(250, 96, 122));'\n})\n\nconst handleClick = () => {\n  showCustomInput.value = !showCustomInput.value\n  if (props.selector) {\n    showSelector.value = false\n  }\n  nextTick(() => {\n    if (customColorInputRef.value) {\n      customColorInputRef.value.focus()\n    }\n  })\n}\n\nwatch(customColor, (newColor) => {\n  if (newColor && !newColor.startsWith('#')) {\n    customColor.value = `#${newColor}`\n  }\n  showCustomInput.value = true\n})\n\nconst handleSelectorClick = () => {\n  if (props.selector) {\n    showSelector.value = !showSelector.value\n  }\n}\n\nconst selectColor = (color: string) => {\n  emit('select', color)\n  if (props.selector) {\n    showSelector.value = false\n  }\n}\n</script>\n<template>\n  <div>\n    <template v-if=\"!showCustomInput\">\n      <div\n        v-if=\"props.selector && !showSelector\"\n        class=\"flex cursor-pointer items-center justify-center rounded-full\"\n        :class=\"props.selector ? 'h-4 w-4' : 'h-5 w-5'\"\n        :style=\"{ backgroundColor: activeColor }\"\n        @click=\"handleSelectorClick\">\n        <ScalarIcon\n          v-if=\"activeColor\"\n          class=\"text-c-btn\"\n          :class=\"props.selector && 'p-0.5'\"\n          icon=\"Checkmark\"\n          size=\"xs\" />\n      </div>\n      <div\n        v-if=\"showSelector || !props.selector\"\n        class=\"color-selector flex flex-row items-center justify-between gap-1.5 space-x-1\"\n        :class=\"props.selector ? 'h-4' : 'min-h-10 min-w-[296px]'\">\n        <div\n          v-for=\"option in colorOptions\"\n          :key=\"option.color\"\n          class=\"flex cursor-pointer items-center justify-center rounded-full\"\n          :class=\"props.selector ? 'h-4 w-4' : 'h-5 w-5'\"\n          :style=\"{ backgroundColor: option.color }\"\n          @click=\"selectColor(option.color)\">\n          <ScalarIcon\n            v-if=\"activeColor === option.color && !customColor\"\n            class=\"text-c-btn\"\n            :class=\"props.selector && 'p-0.5'\"\n            icon=\"Checkmark\"\n            size=\"xs\" />\n        </div>\n        <hr class=\"border-ghost h-5 w-0.5 border-l\" />\n        <label\n          class=\"z-10 flex cursor-pointer flex-row items-center justify-center gap-2 rounded-full\"\n          :class=\"props.selector ? 'h-4 w-4' : 'h-5 w-5'\"\n          :style=\"backgroundStyle\"\n          @click=\"handleClick\">\n          <ScalarIcon\n            v-if=\"\n              !showCustomInput &&\n              (activeColor === customColor ||\n                (activeColor &&\n                  !colorOptions.some((option) => option.color === activeColor)))\n            \"\n            class=\"text-c-btn\"\n            icon=\"Checkmark\"\n            size=\"xs\" />\n        </label>\n      </div>\n    </template>\n    <div\n      v-if=\"showCustomInput\"\n      class=\"color-selector flex flex-1 items-center gap-2 rounded\"\n      :class=\"props.selector ? 'h-4' : 'min-h-10'\">\n      <span\n        class=\"absolute rounded-full border border-dashed\"\n        :class=\"props.selector ? 'h-4 w-4' : 'h-5 w-5'\" />\n      <span\n        class=\"z-[1] rounded-full\"\n        :class=\"props.selector ? 'h-4 w-4' : 'h-5 w-5'\"\n        :style=\"backgroundStyle\">\n      </span>\n      <input\n        ref=\"customColorInputRef\"\n        v-model=\"customColor\"\n        class=\"w-full flex-1 border-transparent text-sm outline-none\"\n        :placeholder=\"activeColor || '#000000'\"\n        type=\"text\"\n        @input=\"selectColor(customColor)\" />\n      <button\n        class=\"text-c-3 hover:bg-b-2 rounded-lg p-1.5\"\n        type=\"button\"\n        @click=\"handleClick\">\n        <ScalarIcon\n          icon=\"Checkmark\"\n          size=\"xs\" />\n      </button>\n    </div>\n  </div>\n</template>\n"],"mappings":""}