@scalar/api-client 2.38.4 → 2.39.1

package/dist/views/Collection/CollectionEnvironment.vue.script.js

@@ -0,0 +1,238 @@
+import { useActiveEntities } from "../../store/active-entities.js";
+import { useWorkspace } from "../../store/store.js";
+import ViewLayoutSection_default from "../../components/ViewLayout/ViewLayoutSection.vue.js";
+import DeleteSidebarListElement_default from "../../components/Sidebar/Actions/DeleteSidebarListElement.vue.js";
+import EditSidebarListElement_default from "../../components/Sidebar/Actions/EditSidebarListElement.vue.js";
+import EnvironmentColorModal_default from "../Environment/EnvironmentColorModal.vue.js";
+import EnvironmentModal_default from "../Environment/EnvironmentModal.vue.js";
+import EnvironmentForm_default from "./components/EnvironmentForm.vue.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeStyle, openBlock, ref, renderList, toDisplayString, unref, withCtx } from "vue";
+import { ScalarButton, ScalarIcon, ScalarModal, useModal } from "@scalar/components";
+import { ScalarIconTrash } from "@scalar/icons";
+import { Draggable } from "@scalar/draggable";
+//#region src/views/Collection/CollectionEnvironment.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "flex h-full w-full flex-col gap-12 px-1.5 pt-8" };
+var _hoisted_2 = { class: "flex flex-col gap-4" };
+var _hoisted_3 = { class: "rounded-lg border" };
+var _hoisted_4 = { class: "bg-b-2 flex cursor-grab items-center justify-between rounded-t-lg px-1 py-1 text-sm" };
+var _hoisted_5 = { class: "flex items-center" };
+var _hoisted_6 = ["onClick"];
+var _hoisted_7 = { class: "text-c-3 flex h-full items-center justify-center rounded-lg border p-4" };
+var CollectionEnvironment_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "CollectionEnvironment",
+	setup(__props) {
+		const { activeCollection, activeWorkspace, activeEnvVariables } = useActiveEntities();
+		const { collectionMutators } = useWorkspace();
+		const colorModal = useModal();
+		const deleteModal = useModal();
+		const environmentModal = useModal();
+		const editModal = useModal();
+		const selectedColor = ref("");
+		const selectedEnvironmentName = ref(null);
+		const tempEnvironmentName = ref(void 0);
+		const collectionEnvironments = computed(() => {
+			if (!activeCollection.value?.["x-scalar-environments"]) return [];
+			return Object.entries(activeCollection.value["x-scalar-environments"]).map(([name, environment]) => ({
+				uid: name,
+				name,
+				value: JSON.stringify(environment.variables || {}),
+				color: environment.color || "#FFFFFF"
+			}));
+		});
+		const deleteEnvironment = () => {
+			if (!activeCollection.value?.uid || !selectedEnvironmentName.value) return;
+			collectionMutators.removeEnvironment(selectedEnvironmentName.value, activeCollection.value.uid);
+			deleteModal.hide();
+		};
+		const openDeleteModal = (environmentName) => {
+			selectedEnvironmentName.value = environmentName;
+			deleteModal.show();
+		};
+		const handleEnvironmentSubmit = (environment) => {
+			if (!activeCollection.value?.uid) return;
+			collectionMutators.addEnvironment(environment.name, {
+				variables: {},
+				color: environment.color
+			}, activeCollection.value.uid);
+			environmentModal.hide();
+		};
+		const handleOpenColorModal = (environment) => {
+			selectedEnvironmentName.value = environment.name;
+			selectedColor.value = environment.color || "#FFFFFF";
+			colorModal.show();
+		};
+		const submitColorChange = (color) => {
+			if (!activeCollection.value?.uid || !selectedEnvironmentName.value) return;
+			const environments = {
+				...activeCollection.value["x-scalar-environments"],
+				[selectedEnvironmentName.value]: {
+					variables: activeCollection.value["x-scalar-environments"]?.[selectedEnvironmentName.value]?.variables || {},
+					color
+				}
+			};
+			collectionMutators.edit(activeCollection.value.uid, "x-scalar-environments", environments);
+			colorModal.hide();
+		};
+		const openRenameModal = (environmentName) => {
+			selectedEnvironmentName.value = environmentName;
+			tempEnvironmentName.value = environmentName;
+			editModal.show();
+		};
+		const closeRenameModal = () => {
+			selectedEnvironmentName.value = null;
+			tempEnvironmentName.value = void 0;
+			editModal.hide();
+		};
+		const handleRename = (newName) => {
+			if (!activeCollection.value?.uid || !selectedEnvironmentName.value) return;
+			const environments = { ...activeCollection.value["x-scalar-environments"] };
+			if (!environments[selectedEnvironmentName.value]) return;
+			const orderedEnvs = {};
+			const envEntries = Object.entries(environments);
+			const envIndex = envEntries.findIndex(([key]) => key === selectedEnvironmentName.value);
+			envEntries.forEach(([key, value], index) => {
+				if (index === envIndex) orderedEnvs[newName] = value;
+				else orderedEnvs[key] = value;
+			});
+			collectionMutators.edit(activeCollection.value.uid, "x-scalar-environments", orderedEnvs);
+			selectedEnvironmentName.value = null;
+			tempEnvironmentName.value = void 0;
+			editModal.hide();
+		};
+		const handleDragEnd = (draggingItem, hoveredItem) => {
+			if (!activeCollection.value?.uid) return;
+			const environments = { ...activeCollection.value["x-scalar-environments"] };
+			const orderedEnvs = {};
+			const envEntries = Object.entries(environments);
+			const dragIndex = envEntries.findIndex(([key]) => key === draggingItem.id);
+			const hoverIndex = envEntries.findIndex(([key]) => key === hoveredItem.id);
+			if (dragIndex === -1 || hoverIndex === -1) return;
+			const draggedEnv = envEntries[dragIndex];
+			if (!draggedEnv) return;
+			envEntries.splice(dragIndex, 1);
+			envEntries.splice(hoverIndex, 0, draggedEnv);
+			envEntries.forEach(([key, value]) => {
+				orderedEnvs[key] = value;
+			});
+			collectionMutators.edit(activeCollection.value.uid, "x-scalar-environments", orderedEnvs);
+		};
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(ViewLayoutSection_default, null, {
+				default: withCtx(() => [createElementVNode("div", _hoisted_1, [
+					createElementVNode("div", _hoisted_2, [
+						_cache[5] || (_cache[5] = createElementVNode("div", { class: "flex items-start justify-between gap-2" }, [createElementVNode("div", { class: "flex flex-col gap-2" }, [createElementVNode("div", { class: "flex h-8 items-center" }, [createElementVNode("h3", { class: "font-bold" }, "Environment Variables")]), createElementVNode("p", { class: "text-sm" }, [
+							createTextVNode(" Set environment variables at your collection level. Use "),
+							createElementVNode("code", { class: "font-code text-c-2" }, "{{ variable }}"),
+							createTextVNode(" to add / search among the selected environment's variables in your request inputs. ")
+						])])], -1)),
+						(openBlock(true), createElementBlock(Fragment, null, renderList(collectionEnvironments.value, (environment) => {
+							return openBlock(), createBlock(unref(Draggable), {
+								key: environment.name,
+								id: environment.name,
+								isDraggable: true,
+								isDroppable: true,
+								parentIds: [],
+								onOnDragEnd: handleDragEnd
+							}, {
+								default: withCtx(() => [createElementVNode("div", _hoisted_3, [createElementVNode("div", _hoisted_4, [createElementVNode("div", _hoisted_5, [createVNode(unref(ScalarButton), {
+									class: "hover:bg-b-3 flex h-6 w-6 p-1",
+									onClick: ($event) => handleOpenColorModal(environment),
+									variant: "ghost"
+								}, {
+									default: withCtx(() => [createElementVNode("span", {
+										style: normalizeStyle({ backgroundColor: environment.color || "#FFFFFF" }),
+										class: "h-2.5 w-2.5 rounded-full"
+									}, null, 4)]),
+									_: 2
+								}, 1032, ["onClick"]), createElementVNode("button", {
+									class: "hover:bg-b-3 rounded px-1 py-0.5 text-sm",
+									onClick: ($event) => openRenameModal(environment.name)
+								}, toDisplayString(environment.name), 9, _hoisted_6)]), createVNode(unref(ScalarButton), {
+									class: "hover:bg-b-3 hover:text-c-1 h-fit p-1.25",
+									variant: "ghost",
+									onClick: ($event) => openDeleteModal(environment.name)
+								}, {
+									default: withCtx(() => [createVNode(unref(ScalarIconTrash), { class: "size-3.5" })]),
+									_: 1
+								}, 8, ["onClick"])]), unref(activeCollection) && unref(activeWorkspace) ? (openBlock(), createBlock(EnvironmentForm_default, {
+									key: 0,
+									collection: unref(activeCollection),
+									environment,
+									envVariables: unref(activeEnvVariables),
+									workspace: unref(activeWorkspace)
+								}, null, 8, [
+									"collection",
+									"environment",
+									"envVariables",
+									"workspace"
+								])) : createCommentVNode("", true)])]),
+								_: 2
+							}, 1032, ["id"]);
+						}), 128)),
+						createElementVNode("div", _hoisted_7, [createVNode(unref(ScalarButton), {
+							class: "hover:bg-b-2 hover:text-c-1 flex items-center gap-2",
+							size: "sm",
+							variant: "ghost",
+							onClick: _cache[0] || (_cache[0] = ($event) => unref(environmentModal).show())
+						}, {
+							default: withCtx(() => [createVNode(unref(ScalarIcon), {
+								class: "inline-flex",
+								icon: "Add",
+								size: "sm",
+								thickness: "1.5"
+							}), _cache[4] || (_cache[4] = createElementVNode("span", null, "Add Environment", -1))]),
+							_: 1
+						})])
+					]),
+					createVNode(unref(ScalarModal), {
+						size: "xxs",
+						state: unref(deleteModal),
+						title: `Delete ${selectedEnvironmentName.value || "Environment"}`
+					}, {
+						default: withCtx(() => [createVNode(DeleteSidebarListElement_default, {
+							variableName: "Environment",
+							warningMessage: "Are you sure you want to delete this environment? This action cannot be undone.",
+							onClose: _cache[1] || (_cache[1] = ($event) => unref(deleteModal).hide()),
+							onDelete: deleteEnvironment
+						})]),
+						_: 1
+					}, 8, ["state", "title"]),
+					createVNode(EnvironmentModal_default, {
+						activeWorkspaceCollections: unref(activeCollection) ? [unref(activeCollection)] : [],
+						collectionId: unref(activeCollection)?.uid,
+						state: unref(environmentModal),
+						onCancel: _cache[2] || (_cache[2] = ($event) => unref(environmentModal).hide()),
+						onSubmit: handleEnvironmentSubmit
+					}, null, 8, [
+						"activeWorkspaceCollections",
+						"collectionId",
+						"state"
+					]),
+					createVNode(EnvironmentColorModal_default, {
+						selectedColor: selectedColor.value,
+						state: unref(colorModal),
+						onCancel: _cache[3] || (_cache[3] = ($event) => unref(colorModal).hide()),
+						onSubmit: submitColorChange
+					}, null, 8, ["selectedColor", "state"]),
+					createVNode(unref(ScalarModal), {
+						size: "xxs",
+						state: unref(editModal),
+						title: `Edit ${selectedEnvironmentName.value}`
+					}, {
+						default: withCtx(() => [createVNode(EditSidebarListElement_default, {
+							name: tempEnvironmentName.value ?? "",
+							onClose: closeRenameModal,
+							onEdit: handleRename
+						}, null, 8, ["name"])]),
+						_: 1
+					}, 8, ["state", "title"])
+				])]),
+				_: 1
+			});
+		};
+	}
+});
+//#endregion
+export { CollectionEnvironment_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=CollectionEnvironment.vue.script.js.map

package/dist/views/Collection/CollectionEnvironment.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollectionEnvironment.vue.script.js","names":[],"sources":["../../../src/views/Collection/CollectionEnvironment.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  ScalarButton,\n  ScalarIcon,\n  ScalarModal,\n  useModal,\n} from '@scalar/components'\nimport { Draggable } from '@scalar/draggable'\nimport { ScalarIconTrash } from '@scalar/icons'\nimport type { Environment } from '@scalar/oas-utils/entities/environment'\nimport { computed, ref } from 'vue'\n\nimport DeleteSidebarListElement from '@/components/Sidebar/Actions/DeleteSidebarListElement.vue'\nimport EditSidebarListElement from '@/components/Sidebar/Actions/EditSidebarListElement.vue'\nimport ViewLayoutSection from '@/components/ViewLayout/ViewLayoutSection.vue'\nimport { useActiveEntities, useWorkspace } from '@/store'\nimport EnvironmentColorModal from '@/views/Environment/EnvironmentColorModal.vue'\nimport EnvironmentModal from '@/views/Environment/EnvironmentModal.vue'\n\nimport EnvironmentForm from './components/EnvironmentForm.vue'\n\nconst { activeCollection, activeWorkspace, activeEnvVariables } =\n  useActiveEntities()\nconst { collectionMutators } = useWorkspace()\n\nconst colorModal = useModal()\nconst deleteModal = useModal()\nconst environmentModal = useModal()\nconst editModal = useModal()\nconst selectedColor = ref('')\nconst selectedEnvironmentName = ref<string | null>(null)\nconst tempEnvironmentName = ref<string | undefined>(undefined)\n\nconst collectionEnvironments = computed(() => {\n  if (!activeCollection.value?.['x-scalar-environments']) {\n    return []\n  }\n  return Object.entries(activeCollection.value['x-scalar-environments']).map(\n    ([name, environment]) => ({\n      uid: name as Environment['uid'],\n      name,\n      value: JSON.stringify(environment.variables || {}),\n      color: environment.color || '#FFFFFF',\n    }),\n  )\n})\n\nconst deleteEnvironment = () => {\n  if (!activeCollection.value?.uid || !selectedEnvironmentName.value) {\n    return\n  }\n\n  collectionMutators.removeEnvironment(\n    selectedEnvironmentName.value,\n    activeCollection.value.uid,\n  )\n  deleteModal.hide()\n}\n\nconst openDeleteModal = (environmentName: string) => {\n  selectedEnvironmentName.value = environmentName\n  deleteModal.show()\n}\n\nconst handleEnvironmentSubmit = (environment: {\n  name: string\n  color: string\n  collectionId: string | undefined\n}) => {\n  if (!activeCollection.value?.uid) {\n    return\n  }\n\n  collectionMutators.addEnvironment(\n    environment.name,\n    {\n      variables: {},\n      color: environment.color,\n    },\n    activeCollection.value.uid,\n  )\n  environmentModal.hide()\n}\n\nconst handleOpenColorModal = (environment: {\n  name: string\n  color?: string | undefined\n}) => {\n  selectedEnvironmentName.value = environment.name\n  selectedColor.value = environment.color || '#FFFFFF'\n  colorModal.show()\n}\n\nconst submitColorChange = (color: string) => {\n  if (!activeCollection.value?.uid || !selectedEnvironmentName.value) {\n    return\n  }\n\n  const environments = {\n    ...activeCollection.value['x-scalar-environments'],\n    [selectedEnvironmentName.value]: {\n      variables:\n        activeCollection.value['x-scalar-environments']?.[\n          selectedEnvironmentName.value\n        ]?.variables || {},\n      color,\n    },\n  }\n\n  collectionMutators.edit(\n    activeCollection.value.uid,\n    'x-scalar-environments',\n    environments,\n  )\n  colorModal.hide()\n}\n\nconst openRenameModal = (environmentName: string) => {\n  selectedEnvironmentName.value = environmentName\n  tempEnvironmentName.value = environmentName\n  editModal.show()\n}\n\nconst closeRenameModal = () => {\n  selectedEnvironmentName.value = null\n  tempEnvironmentName.value = undefined\n  editModal.hide()\n}\n\nconst handleRename = (newName: string) => {\n  if (!activeCollection.value?.uid || !selectedEnvironmentName.value) {\n    return\n  }\n\n  const environments = { ...activeCollection.value['x-scalar-environments'] }\n  const environment = environments[selectedEnvironmentName.value]\n  if (!environment) {\n    return\n  }\n\n  // Create a new ordered environments object\n  const orderedEnvs: Record<string, any> = {}\n  const envEntries = Object.entries(environments)\n\n  // Find the index of the environment being renamed\n  const envIndex = envEntries.findIndex(\n    ([key]) => key === selectedEnvironmentName.value,\n  )\n\n  // Rebuild the environments object maintaining order\n  envEntries.forEach(([key, value], index) => {\n    if (index === envIndex) {\n      orderedEnvs[newName] = value\n    } else {\n      orderedEnvs[key] = value\n    }\n  })\n\n  collectionMutators.edit(\n    activeCollection.value.uid,\n    'x-scalar-environments',\n    orderedEnvs,\n  )\n\n  selectedEnvironmentName.value = null\n  tempEnvironmentName.value = undefined\n  editModal.hide()\n}\n\nconst handleDragEnd = (\n  draggingItem: { id: string },\n  hoveredItem: { id: string },\n) => {\n  if (!activeCollection.value?.uid) {\n    return\n  }\n\n  const environments = { ...activeCollection.value['x-scalar-environments'] }\n  const orderedEnvs: Record<string, any> = {}\n  const envEntries = Object.entries(environments)\n\n  // Find the indices of the dragged and hovered items\n  const dragIndex = envEntries.findIndex(([key]) => key === draggingItem.id)\n  const hoverIndex = envEntries.findIndex(([key]) => key === hoveredItem.id)\n\n  if (dragIndex === -1 || hoverIndex === -1) {\n    return\n  }\n\n  // Reorder the environments\n  const draggedEnv = envEntries[dragIndex]\n  if (!draggedEnv) {\n    return\n  }\n  envEntries.splice(dragIndex, 1)\n  envEntries.splice(hoverIndex, 0, draggedEnv)\n\n  // Rebuild the environments object in the new order\n  envEntries.forEach(([key, value]) => {\n    orderedEnvs[key] = value\n  })\n\n  collectionMutators.edit(\n    activeCollection.value.uid,\n    'x-scalar-environments',\n    orderedEnvs,\n  )\n}\n</script>\n\n<template>\n  <ViewLayoutSection>\n    <div class=\"flex h-full w-full flex-col gap-12 px-1.5 pt-8\">\n      <div class=\"flex flex-col gap-4\">\n        <div class=\"flex items-start justify-between gap-2\">\n          <div class=\"flex flex-col gap-2\">\n            <div class=\"flex h-8 items-center\">\n              <h3 class=\"font-bold\">Environment Variables</h3>\n            </div>\n            <p class=\"text-sm\">\n              Set environment variables at your collection level. Use\n              <code\n                class=\"font-code text-c-2\"\n                v-pre\n                >{{ variable }}</code\n              >\n              to add / search among the selected environment's variables in your\n              request inputs.\n            </p>\n          </div>\n        </div>\n        <Draggable\n          v-for=\"environment in collectionEnvironments\"\n          :key=\"environment.name\"\n          :id=\"environment.name\"\n          :isDraggable=\"true\"\n          :isDroppable=\"true\"\n          :parentIds=\"[]\"\n          @onDragEnd=\"handleDragEnd\">\n          <div class=\"rounded-lg border\">\n            <div\n              class=\"bg-b-2 flex cursor-grab items-center justify-between rounded-t-lg px-1 py-1 text-sm\">\n              <div class=\"flex items-center\">\n                <ScalarButton\n                  class=\"hover:bg-b-3 flex h-6 w-6 p-1\"\n                  @click=\"handleOpenColorModal(environment)\"\n                  variant=\"ghost\">\n                  <span\n                    :style=\"{ backgroundColor: environment.color || '#FFFFFF' }\"\n                    class=\"h-2.5 w-2.5 rounded-full\"></span>\n                </ScalarButton>\n                <button\n                  class=\"hover:bg-b-3 rounded px-1 py-0.5 text-sm\"\n                  @click=\"openRenameModal(environment.name)\">\n                  {{ environment.name }}\n                </button>\n              </div>\n              <ScalarButton\n                class=\"hover:bg-b-3 hover:text-c-1 h-fit p-1.25\"\n                variant=\"ghost\"\n                @click=\"openDeleteModal(environment.name)\">\n                <ScalarIconTrash class=\"size-3.5\" />\n              </ScalarButton>\n            </div>\n            <EnvironmentForm\n              v-if=\"activeCollection && activeWorkspace\"\n              :collection=\"activeCollection\"\n              :environment=\"environment\"\n              :envVariables=\"activeEnvVariables\"\n              :workspace=\"activeWorkspace\" />\n          </div>\n        </Draggable>\n        <div\n          class=\"text-c-3 flex h-full items-center justify-center rounded-lg border p-4\">\n          <ScalarButton\n            class=\"hover:bg-b-2 hover:text-c-1 flex items-center gap-2\"\n            size=\"sm\"\n            variant=\"ghost\"\n            @click=\"environmentModal.show()\">\n            <ScalarIcon\n              class=\"inline-flex\"\n              icon=\"Add\"\n              size=\"sm\"\n              thickness=\"1.5\" />\n            <span>Add Environment</span>\n          </ScalarButton>\n        </div>\n      </div>\n      <ScalarModal\n        :size=\"'xxs'\"\n        :state=\"deleteModal\"\n        :title=\"`Delete ${selectedEnvironmentName || 'Environment'}`\">\n        <DeleteSidebarListElement\n          :variableName=\"'Environment'\"\n          :warningMessage=\"'Are you sure you want to delete this environment? This action cannot be undone.'\"\n          @close=\"deleteModal.hide()\"\n          @delete=\"deleteEnvironment\" />\n      </ScalarModal>\n      <EnvironmentModal\n        :activeWorkspaceCollections=\"activeCollection ? [activeCollection] : []\"\n        :collectionId=\"activeCollection?.uid\"\n        :state=\"environmentModal\"\n        @cancel=\"environmentModal.hide()\"\n        @submit=\"handleEnvironmentSubmit\" />\n      <EnvironmentColorModal\n        :selectedColor=\"selectedColor\"\n        :state=\"colorModal\"\n        @cancel=\"colorModal.hide()\"\n        @submit=\"submitColorChange\" />\n      <ScalarModal\n        :size=\"'xxs'\"\n        :state=\"editModal\"\n        :title=\"`Edit ${selectedEnvironmentName}`\">\n        <EditSidebarListElement\n          :name=\"tempEnvironmentName ?? ''\"\n          @close=\"closeRenameModal\"\n          @edit=\"handleRename\" />\n      </ScalarModal>\n    </div>\n  </ViewLayoutSection>\n</template>\n\n<style>\n@import '@scalar/draggable/style.css';\n</style>\n"],"mappings":"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"}

package/dist/views/Collection/CollectionInfoForm.vue.js

@@ -0,0 +1,9 @@
+import _plugin_vue_export_helper_default from "../../_virtual/_plugin-vue_export-helper.js";
+import CollectionInfoForm_vue_vue_type_script_setup_true_lang_default from "./CollectionInfoForm.vue.script.js";
+/* empty css                                 */
+//#region src/views/Collection/CollectionInfoForm.vue
+var CollectionInfoForm_default = /* @__PURE__ */ _plugin_vue_export_helper_default(CollectionInfoForm_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-68d5218e"]]);
+//#endregion
+export { CollectionInfoForm_default as default };
+
+//# sourceMappingURL=CollectionInfoForm.vue.js.map

package/dist/views/Collection/CollectionInfoForm.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollectionInfoForm.vue.js","names":[],"sources":["../../../src/views/Collection/CollectionInfoForm.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton } from '@scalar/components'\nimport { LibraryIcon } from '@scalar/icons/library'\nimport { computed } from 'vue'\n\nimport LabelInput from '@/components/Form/LabelInput.vue'\nimport IconSelector from '@/components/IconSelector.vue'\nimport { useWorkspace } from '@/store'\nimport { useActiveEntities } from '@/store/active-entities'\n\nconst { activeCollection } = useActiveEntities()\nconst { collectionMutators } = useWorkspace()\n\nconst icon = computed(\n  () =>\n    activeCollection?.value?.['x-scalar-icon'] || 'interface-content-folder',\n)\n\nconst updateCollectionIcon = (value: string) => {\n  if (!activeCollection?.value?.uid) {\n    return\n  }\n\n  collectionMutators.edit(activeCollection?.value?.uid, 'x-scalar-icon', value)\n}\n\n/**\n * Update info.title\n */\nconst updateCollectionTitle = (value: string) => {\n  if (!activeCollection.value) {\n    return\n  }\n\n  collectionMutators.edit(activeCollection.value.uid, 'info.title', value)\n}\n\n/**\n * Alias for the data that we'd like to display.\n */\nconst data = computed(() => {\n  return {\n    icon: activeCollection?.value?.['x-scalar-icon'],\n    title: activeCollection?.value?.info?.title,\n    description: activeCollection?.value?.info?.description,\n    version: activeCollection?.value?.info?.version,\n  }\n})\n</script>\n\n<template>\n  <div\n    :aria-label=\"`Collection: ${data.title}`\"\n    class=\"mx-auto flex h-fit w-full flex-col gap-2 pt-6 pb-3 md:mx-auto md:max-w-[720px]\">\n    <IconSelector\n      :modelValue=\"icon\"\n      placement=\"bottom-start\"\n      @update:modelValue=\"(value) => updateCollectionIcon(value)\">\n      <ScalarButton\n        class=\"hover:bg-b-2 aspect-square h-7 w-7 cursor-pointer rounded border border-transparent p-0 hover:border-inherit\"\n        variant=\"ghost\">\n        <LibraryIcon\n          class=\"text-c-2 size-5\"\n          :src=\"icon\"\n          stroke-width=\"2\" />\n      </ScalarButton>\n    </IconSelector>\n    <div class=\"group relative ml-1.25\">\n      <LabelInput\n        class=\"text-xl font-bold\"\n        inputId=\"collectionName\"\n        placeholder=\"Untitled Collection\"\n        :value=\"data.title\"\n        @updateValue=\"updateCollectionTitle\" />\n    </div>\n  </div>\n</template>\n\n<style scoped>\n@reference \"@/style.css\";\n\n:deep(.markdown) h2 {\n  @apply text-lg;\n}\n</style>\n"],"mappings":""}

package/dist/views/Collection/CollectionInfoForm.vue.script.js

@@ -0,0 +1,73 @@
+import { useActiveEntities } from "../../store/active-entities.js";
+import { useWorkspace } from "../../store/store.js";
+import IconSelector_default from "../../components/IconSelector.vue.js";
+import LabelInput_default from "../../components/Form/LabelInput.vue.js";
+import { computed, createElementBlock, createElementVNode, createVNode, defineComponent, openBlock, unref, withCtx } from "vue";
+import { ScalarButton } from "@scalar/components";
+import { LibraryIcon } from "@scalar/icons/library";
+//#region src/views/Collection/CollectionInfoForm.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = ["aria-label"];
+var _hoisted_2 = { class: "group relative ml-1.25" };
+var CollectionInfoForm_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "CollectionInfoForm",
+	setup(__props) {
+		const { activeCollection } = useActiveEntities();
+		const { collectionMutators } = useWorkspace();
+		const icon = computed(() => activeCollection?.value?.["x-scalar-icon"] || "interface-content-folder");
+		const updateCollectionIcon = (value) => {
+			if (!activeCollection?.value?.uid) return;
+			collectionMutators.edit(activeCollection?.value?.uid, "x-scalar-icon", value);
+		};
+		/**
+		* Update info.title
+		*/
+		const updateCollectionTitle = (value) => {
+			if (!activeCollection.value) return;
+			collectionMutators.edit(activeCollection.value.uid, "info.title", value);
+		};
+		/**
+		* Alias for the data that we'd like to display.
+		*/
+		const data = computed(() => {
+			return {
+				icon: activeCollection?.value?.["x-scalar-icon"],
+				title: activeCollection?.value?.info?.title,
+				description: activeCollection?.value?.info?.description,
+				version: activeCollection?.value?.info?.version
+			};
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				"aria-label": `Collection: ${data.value.title}`,
+				class: "mx-auto flex h-fit w-full flex-col gap-2 pt-6 pb-3 md:mx-auto md:max-w-[720px]"
+			}, [createVNode(IconSelector_default, {
+				modelValue: icon.value,
+				placement: "bottom-start",
+				"onUpdate:modelValue": _cache[0] || (_cache[0] = (value) => updateCollectionIcon(value))
+			}, {
+				default: withCtx(() => [createVNode(unref(ScalarButton), {
+					class: "hover:bg-b-2 aspect-square h-7 w-7 cursor-pointer rounded border border-transparent p-0 hover:border-inherit",
+					variant: "ghost"
+				}, {
+					default: withCtx(() => [createVNode(unref(LibraryIcon), {
+						class: "text-c-2 size-5",
+						src: icon.value,
+						"stroke-width": "2"
+					}, null, 8, ["src"])]),
+					_: 1
+				})]),
+				_: 1
+			}, 8, ["modelValue"]), createElementVNode("div", _hoisted_2, [createVNode(LabelInput_default, {
+				class: "text-xl font-bold",
+				inputId: "collectionName",
+				placeholder: "Untitled Collection",
+				value: data.value.title,
+				onUpdateValue: updateCollectionTitle
+			}, null, 8, ["value"])])], 8, _hoisted_1);
+		};
+	}
+});
+//#endregion
+export { CollectionInfoForm_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=CollectionInfoForm.vue.script.js.map

package/dist/views/Collection/CollectionInfoForm.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollectionInfoForm.vue.script.js","names":[],"sources":["../../../src/views/Collection/CollectionInfoForm.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton } from '@scalar/components'\nimport { LibraryIcon } from '@scalar/icons/library'\nimport { computed } from 'vue'\n\nimport LabelInput from '@/components/Form/LabelInput.vue'\nimport IconSelector from '@/components/IconSelector.vue'\nimport { useWorkspace } from '@/store'\nimport { useActiveEntities } from '@/store/active-entities'\n\nconst { activeCollection } = useActiveEntities()\nconst { collectionMutators } = useWorkspace()\n\nconst icon = computed(\n  () =>\n    activeCollection?.value?.['x-scalar-icon'] || 'interface-content-folder',\n)\n\nconst updateCollectionIcon = (value: string) => {\n  if (!activeCollection?.value?.uid) {\n    return\n  }\n\n  collectionMutators.edit(activeCollection?.value?.uid, 'x-scalar-icon', value)\n}\n\n/**\n * Update info.title\n */\nconst updateCollectionTitle = (value: string) => {\n  if (!activeCollection.value) {\n    return\n  }\n\n  collectionMutators.edit(activeCollection.value.uid, 'info.title', value)\n}\n\n/**\n * Alias for the data that we'd like to display.\n */\nconst data = computed(() => {\n  return {\n    icon: activeCollection?.value?.['x-scalar-icon'],\n    title: activeCollection?.value?.info?.title,\n    description: activeCollection?.value?.info?.description,\n    version: activeCollection?.value?.info?.version,\n  }\n})\n</script>\n\n<template>\n  <div\n    :aria-label=\"`Collection: ${data.title}`\"\n    class=\"mx-auto flex h-fit w-full flex-col gap-2 pt-6 pb-3 md:mx-auto md:max-w-[720px]\">\n    <IconSelector\n      :modelValue=\"icon\"\n      placement=\"bottom-start\"\n      @update:modelValue=\"(value) => updateCollectionIcon(value)\">\n      <ScalarButton\n        class=\"hover:bg-b-2 aspect-square h-7 w-7 cursor-pointer rounded border border-transparent p-0 hover:border-inherit\"\n        variant=\"ghost\">\n        <LibraryIcon\n          class=\"text-c-2 size-5\"\n          :src=\"icon\"\n          stroke-width=\"2\" />\n      </ScalarButton>\n    </IconSelector>\n    <div class=\"group relative ml-1.25\">\n      <LabelInput\n        class=\"text-xl font-bold\"\n        inputId=\"collectionName\"\n        placeholder=\"Untitled Collection\"\n        :value=\"data.title\"\n        @updateValue=\"updateCollectionTitle\" />\n    </div>\n  </div>\n</template>\n\n<style scoped>\n@reference \"@/style.css\";\n\n:deep(.markdown) h2 {\n  @apply text-lg;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;EAUA,MAAM,EAAE,qBAAqB,mBAAkB;EAC/C,MAAM,EAAE,uBAAuB,cAAa;EAE5C,MAAM,OAAO,eAET,kBAAkB,QAAQ,oBAAoB,2BAClD;EAEA,MAAM,wBAAwB,UAAkB;AAC9C,OAAI,CAAC,kBAAkB,OAAO,IAC5B;AAGF,sBAAmB,KAAK,kBAAkB,OAAO,KAAK,iBAAiB,MAAK;;;;;EAM9E,MAAM,yBAAyB,UAAkB;AAC/C,OAAI,CAAC,iBAAiB,MACpB;AAGF,sBAAmB,KAAK,iBAAiB,MAAM,KAAK,cAAc,MAAK;;;;;EAMzE,MAAM,OAAO,eAAe;AAC1B,UAAO;IACL,MAAM,kBAAkB,QAAQ;IAChC,OAAO,kBAAkB,OAAO,MAAM;IACtC,aAAa,kBAAkB,OAAO,MAAM;IAC5C,SAAS,kBAAkB,OAAO,MAAM;IAC1C;IACD;;uBAIC,mBAwBM,OAAA;IAvBH,cAAU,eAAiB,KAAA,MAAK;IACjC,OAAM;OACN,YAYe,sBAAA;IAXZ,YAAY,KAAA;IACb,WAAU;IACT,uBAAiB,OAAA,OAAA,OAAA,MAAG,UAAU,qBAAqB,MAAK;;2BAQ1C,CAPf,YAOe,MAAA,aAAA,EAAA;KANb,OAAM;KACN,SAAQ;;4BAIa,CAHrB,YAGqB,MAAA,YAAA,EAAA;MAFnB,OAAM;MACL,KAAK,KAAA;MACN,gBAAa;;;;;0BAGnB,mBAOM,OAPN,YAOM,CANJ,YAKyC,oBAAA;IAJvC,OAAM;IACN,SAAQ;IACR,aAAY;IACX,OAAO,KAAA,MAAK;IACZ,eAAa"}

package/dist/views/Collection/CollectionNavigation.vue.js

@@ -0,0 +1,7 @@
+import CollectionNavigation_vue_vue_type_script_setup_true_lang_default from "./CollectionNavigation.vue.script.js";
+//#region src/views/Collection/CollectionNavigation.vue
+var CollectionNavigation_default = CollectionNavigation_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { CollectionNavigation_default as default };
+
+//# sourceMappingURL=CollectionNavigation.vue.js.map

package/dist/views/Collection/CollectionNavigation.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollectionNavigation.vue.js","names":[],"sources":["../../../src/views/Collection/CollectionNavigation.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { LibraryIcon } from '@scalar/icons/library'\nimport { computed } from 'vue'\nimport { RouterLink, useRouter, type RouteLocationNamedRaw } from 'vue-router'\n\nimport { PathId } from '@/routes'\nimport { useActiveEntities } from '@/store'\n\nimport CollectionInfoForm from './CollectionInfoForm.vue'\n\ndefineProps<{\n  isSticky: boolean\n}>()\n\nconst { currentRoute } = useRouter()\nconst { activeCollection } = useActiveEntities()\n\ntype CollectionSidebarEntry = {\n  // icon: Icon\n  to: RouteLocationNamedRaw\n  displayName: string\n}\n\nconst routes = computed<CollectionSidebarEntry[]>(() => [\n  {\n    displayName: 'Overview',\n    // icon: 'Collection',\n    to: {\n      name: 'collection.overview',\n      params: {\n        [PathId.Collection]: activeCollection.value?.uid,\n      },\n    },\n  },\n  {\n    displayName: 'Servers',\n    // icon: 'Server',\n    to: {\n      name: 'collection.servers',\n      params: {\n        [PathId.Collection]: activeCollection.value?.uid,\n      },\n    },\n  },\n  {\n    displayName: 'Authentication',\n    // icon: 'Lock',\n    to: {\n      name: 'collection.authentication',\n      params: {\n        [PathId.Collection]: activeCollection.value?.uid,\n      },\n    },\n  },\n  {\n    displayName: 'Environment',\n    // icon: 'Brackets',\n    to: {\n      name: 'collection.environment',\n      params: {\n        [PathId.Collection]: activeCollection.value?.uid,\n      },\n    },\n  },\n  // {\n  //   displayName: 'Cookies',\n  //   // icon: 'Cookie',\n  //   to: {\n  //     name: 'collection.cookies',\n  //     params: {\n  //       [PathId.Collection]: activeCollection.value?.uid,\n  //     },\n  //   },\n  // },\n  // {\n  //   displayName: 'Scripts',\n  //   // icon: 'CodeFolder',\n  //   to: {\n  //     name: 'collection.scripts',\n  //     params: {\n  //       [PathId.Collection]: activeCollection.value?.uid,\n  //     },\n  //   },\n  // },\n  // {\n  //   displayName: 'Sync',\n  //   // icon: 'Download',\n  //   to: {\n  //     name: 'collection.sync',\n  //   },\n  // },\n  {\n    displayName: 'Settings',\n    // icon: 'Settings',\n    to: {\n      name: 'collection.settings',\n    },\n  },\n])\n</script>\n<template>\n  <div class=\"bg-b-1 sticky -top-[104px] z-10 mx-auto w-full\">\n    <CollectionInfoForm />\n    <div\n      class=\"items-center text-sm font-medium\"\n      :class=\"\n        isSticky\n          ? 'h-fit border-b md:grid md:grid-cols-[1fr_720px_1fr] md:px-4'\n          : 'flex md:mx-auto md:max-w-[720px]'\n      \">\n      <div\n        v-if=\"isSticky\"\n        class=\"flex max-w-40 items-center\">\n        <LibraryIcon\n          class=\"text-c-2 hidden size-3.5 md:block\"\n          :src=\"\n            activeCollection?.['x-scalar-icon'] || 'interface-content-folder'\n          \"\n          stroke-width=\"2\" />\n        <span\n          class=\"text-c-1 mr-[6.25px] hidden overflow-hidden px-2 font-medium text-ellipsis whitespace-nowrap md:block\"\n          >{{ activeCollection?.info?.title }}</span\n        >\n      </div>\n      <div\n        class=\"flex w-full max-w-[720px] gap-2 pl-1.5 md:ml-1.5 md:pl-0\"\n        :class=\"!isSticky && 'border-b'\">\n        <RouterLink\n          v-for=\"({ to, displayName }, i) in routes\"\n          :key=\"i\"\n          class=\"-ml-2 flex h-10 cursor-pointer items-center px-2 text-center text-sm font-medium whitespace-nowrap no-underline -outline-offset-1 has-[:focus-visible]:outline\"\n          :to=\"to\">\n          <span\n            class=\"flex-center h-full w-full border-b\"\n            :class=\"\n              typeof to.name === 'string' &&\n              typeof currentRoute.name === 'string' &&\n              currentRoute.name?.startsWith(to.name)\n                ? 'text-c-1 border-c-1'\n                : 'text-c-2 hover:text-c-1 border-transparent'\n            \">\n            {{ displayName }}\n          </span>\n        </RouterLink>\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":""}

package/dist/views/Collection/CollectionNavigation.vue.script.js

@@ -0,0 +1,75 @@
+import { PathId } from "../../routes.js";
+import { useActiveEntities } from "../../store/active-entities.js";
+import CollectionInfoForm_default from "./CollectionInfoForm.vue.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, normalizeClass, openBlock, renderList, toDisplayString, unref, withCtx } from "vue";
+import { RouterLink, useRouter } from "vue-router";
+import { LibraryIcon } from "@scalar/icons/library";
+//#region src/views/Collection/CollectionNavigation.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "bg-b-1 sticky -top-[104px] z-10 mx-auto w-full" };
+var _hoisted_2 = {
+	key: 0,
+	class: "flex max-w-40 items-center"
+};
+var _hoisted_3 = { class: "text-c-1 mr-[6.25px] hidden overflow-hidden px-2 font-medium text-ellipsis whitespace-nowrap md:block" };
+var CollectionNavigation_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "CollectionNavigation",
+	props: { isSticky: { type: Boolean } },
+	setup(__props) {
+		const { currentRoute } = useRouter();
+		const { activeCollection } = useActiveEntities();
+		const routes = computed(() => [
+			{
+				displayName: "Overview",
+				to: {
+					name: "collection.overview",
+					params: { [PathId.Collection]: activeCollection.value?.uid }
+				}
+			},
+			{
+				displayName: "Servers",
+				to: {
+					name: "collection.servers",
+					params: { [PathId.Collection]: activeCollection.value?.uid }
+				}
+			},
+			{
+				displayName: "Authentication",
+				to: {
+					name: "collection.authentication",
+					params: { [PathId.Collection]: activeCollection.value?.uid }
+				}
+			},
+			{
+				displayName: "Environment",
+				to: {
+					name: "collection.environment",
+					params: { [PathId.Collection]: activeCollection.value?.uid }
+				}
+			},
+			{
+				displayName: "Settings",
+				to: { name: "collection.settings" }
+			}
+		]);
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", _hoisted_1, [createVNode(CollectionInfoForm_default), createElementVNode("div", { class: normalizeClass(["items-center text-sm font-medium", __props.isSticky ? "h-fit border-b md:grid md:grid-cols-[1fr_720px_1fr] md:px-4" : "flex md:mx-auto md:max-w-[720px]"]) }, [__props.isSticky ? (openBlock(), createElementBlock("div", _hoisted_2, [createVNode(unref(LibraryIcon), {
+				class: "text-c-2 hidden size-3.5 md:block",
+				src: unref(activeCollection)?.["x-scalar-icon"] || "interface-content-folder",
+				"stroke-width": "2"
+			}, null, 8, ["src"]), createElementVNode("span", _hoisted_3, toDisplayString(unref(activeCollection)?.info?.title), 1)])) : createCommentVNode("", true), createElementVNode("div", { class: normalizeClass(["flex w-full max-w-[720px] gap-2 pl-1.5 md:ml-1.5 md:pl-0", !__props.isSticky && "border-b"]) }, [(openBlock(true), createElementBlock(Fragment, null, renderList(routes.value, ({ to, displayName }, i) => {
+				return openBlock(), createBlock(unref(RouterLink), {
+					key: i,
+					class: "-ml-2 flex h-10 cursor-pointer items-center px-2 text-center text-sm font-medium whitespace-nowrap no-underline -outline-offset-1 has-[:focus-visible]:outline",
+					to
+				}, {
+					default: withCtx(() => [createElementVNode("span", { class: normalizeClass(["flex-center h-full w-full border-b", typeof to.name === "string" && typeof unref(currentRoute).name === "string" && unref(currentRoute).name?.startsWith(to.name) ? "text-c-1 border-c-1" : "text-c-2 hover:text-c-1 border-transparent"]) }, toDisplayString(displayName), 3)]),
+					_: 2
+				}, 1032, ["to"]);
+			}), 128))], 2)], 2)]);
+		};
+	}
+});
+//#endregion
+export { CollectionNavigation_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=CollectionNavigation.vue.script.js.map

package/dist/views/Collection/CollectionNavigation.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollectionNavigation.vue.script.js","names":[],"sources":["../../../src/views/Collection/CollectionNavigation.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { LibraryIcon } from '@scalar/icons/library'\nimport { computed } from 'vue'\nimport { RouterLink, useRouter, type RouteLocationNamedRaw } from 'vue-router'\n\nimport { PathId } from '@/routes'\nimport { useActiveEntities } from '@/store'\n\nimport CollectionInfoForm from './CollectionInfoForm.vue'\n\ndefineProps<{\n  isSticky: boolean\n}>()\n\nconst { currentRoute } = useRouter()\nconst { activeCollection } = useActiveEntities()\n\ntype CollectionSidebarEntry = {\n  // icon: Icon\n  to: RouteLocationNamedRaw\n  displayName: string\n}\n\nconst routes = computed<CollectionSidebarEntry[]>(() => [\n  {\n    displayName: 'Overview',\n    // icon: 'Collection',\n    to: {\n      name: 'collection.overview',\n      params: {\n        [PathId.Collection]: activeCollection.value?.uid,\n      },\n    },\n  },\n  {\n    displayName: 'Servers',\n    // icon: 'Server',\n    to: {\n      name: 'collection.servers',\n      params: {\n        [PathId.Collection]: activeCollection.value?.uid,\n      },\n    },\n  },\n  {\n    displayName: 'Authentication',\n    // icon: 'Lock',\n    to: {\n      name: 'collection.authentication',\n      params: {\n        [PathId.Collection]: activeCollection.value?.uid,\n      },\n    },\n  },\n  {\n    displayName: 'Environment',\n    // icon: 'Brackets',\n    to: {\n      name: 'collection.environment',\n      params: {\n        [PathId.Collection]: activeCollection.value?.uid,\n      },\n    },\n  },\n  // {\n  //   displayName: 'Cookies',\n  //   // icon: 'Cookie',\n  //   to: {\n  //     name: 'collection.cookies',\n  //     params: {\n  //       [PathId.Collection]: activeCollection.value?.uid,\n  //     },\n  //   },\n  // },\n  // {\n  //   displayName: 'Scripts',\n  //   // icon: 'CodeFolder',\n  //   to: {\n  //     name: 'collection.scripts',\n  //     params: {\n  //       [PathId.Collection]: activeCollection.value?.uid,\n  //     },\n  //   },\n  // },\n  // {\n  //   displayName: 'Sync',\n  //   // icon: 'Download',\n  //   to: {\n  //     name: 'collection.sync',\n  //   },\n  // },\n  {\n    displayName: 'Settings',\n    // icon: 'Settings',\n    to: {\n      name: 'collection.settings',\n    },\n  },\n])\n</script>\n<template>\n  <div class=\"bg-b-1 sticky -top-[104px] z-10 mx-auto w-full\">\n    <CollectionInfoForm />\n    <div\n      class=\"items-center text-sm font-medium\"\n      :class=\"\n        isSticky\n          ? 'h-fit border-b md:grid md:grid-cols-[1fr_720px_1fr] md:px-4'\n          : 'flex md:mx-auto md:max-w-[720px]'\n      \">\n      <div\n        v-if=\"isSticky\"\n        class=\"flex max-w-40 items-center\">\n        <LibraryIcon\n          class=\"text-c-2 hidden size-3.5 md:block\"\n          :src=\"\n            activeCollection?.['x-scalar-icon'] || 'interface-content-folder'\n          \"\n          stroke-width=\"2\" />\n        <span\n          class=\"text-c-1 mr-[6.25px] hidden overflow-hidden px-2 font-medium text-ellipsis whitespace-nowrap md:block\"\n          >{{ activeCollection?.info?.title }}</span\n        >\n      </div>\n      <div\n        class=\"flex w-full max-w-[720px] gap-2 pl-1.5 md:ml-1.5 md:pl-0\"\n        :class=\"!isSticky && 'border-b'\">\n        <RouterLink\n          v-for=\"({ to, displayName }, i) in routes\"\n          :key=\"i\"\n          class=\"-ml-2 flex h-10 cursor-pointer items-center px-2 text-center text-sm font-medium whitespace-nowrap no-underline -outline-offset-1 has-[:focus-visible]:outline\"\n          :to=\"to\">\n          <span\n            class=\"flex-center h-full w-full border-b\"\n            :class=\"\n              typeof to.name === 'string' &&\n              typeof currentRoute.name === 'string' &&\n              currentRoute.name?.startsWith(to.name)\n                ? 'text-c-1 border-c-1'\n                : 'text-c-2 hover:text-c-1 border-transparent'\n            \">\n            {{ displayName }}\n          </span>\n        </RouterLink>\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;EAcA,MAAM,EAAE,iBAAiB,WAAU;EACnC,MAAM,EAAE,qBAAqB,mBAAkB;EAQ/C,MAAM,SAAS,eAAyC;GACtD;IACE,aAAa;IAEb,IAAI;KACF,MAAM;KACN,QAAQ,GACL,OAAO,aAAa,iBAAiB,OAAO,KAC9C;KACF;IACF;GACD;IACE,aAAa;IAEb,IAAI;KACF,MAAM;KACN,QAAQ,GACL,OAAO,aAAa,iBAAiB,OAAO,KAC9C;KACF;IACF;GACD;IACE,aAAa;IAEb,IAAI;KACF,MAAM;KACN,QAAQ,GACL,OAAO,aAAa,iBAAiB,OAAO,KAC9C;KACF;IACF;GACD;IACE,aAAa;IAEb,IAAI;KACF,MAAM;KACN,QAAQ,GACL,OAAO,aAAa,iBAAiB,OAAO,KAC9C;KACF;IACF;GA4BD;IACE,aAAa;IAEb,IAAI,EACF,MAAM,uBACP;IACF;GACF,CAAA;;uBAGC,mBA6CM,OA7CN,YA6CM,CA5CJ,YAAsB,2BAAA,EACtB,mBA0CM,OAAA,EAzCJ,OAAK,eAAA,CAAC,oCACW,QAAA,WAAA,gEAAA,mCAAA,CAAA,EAAA,EAAA,CAMT,QAAA,YAAA,WAAA,EADR,mBAaM,OAbN,YAaM,CAVJ,YAKqB,MAAA,YAAA,EAAA;IAJnB,OAAM;IACL,KAAkB,MAAA,iBAAgB,GAAA,oBAAA;IAGnC,gBAAa;yBACf,mBAGC,QAHD,YAGC,gBADK,MAAA,iBAAgB,EAAE,MAAM,MAAK,EAAA,EAAA,CAAA,CAAA,IAAA,mBAAA,IAAA,KAAA,EAGrC,mBAoBM,OAAA,EAnBJ,OAAK,eAAA,CAAC,4DAA0D,CACvD,QAAA,YAAQ,WAAA,CAAA,EAAA,EAAA,EAAA,UAAA,KAAA,EACjB,mBAgBa,UAAA,MAAA,WAfwB,OAAA,QAAM,EAA/B,IAAI,eAAe,MAAC;wBADhC,YAgBa,MAAA,WAAA,EAAA;KAdV,KAAK;KACN,OAAM;KACD;;4BAWE,CAVP,mBAUO,QAAA,EATL,OAAK,eAAA,CAAC,sCAAA,OACwB,GAAG,SAAI,YAAA,OAAsC,MAAA,aAAY,CAAC,SAAI,YAA+B,MAAA,aAAY,CAAC,MAAM,WAAW,GAAG,KAAI,GAAA,wBAAA,6CAAA,CAAA,EAAA,EAAA,gBAO7J,YAAW,EAAA,EAAA,CAAA,CAAA"}

package/dist/views/Collection/CollectionOverview.vue.js

@@ -0,0 +1,7 @@
+import CollectionOverview_vue_vue_type_script_setup_true_lang_default from "./CollectionOverview.vue.script.js";
+//#region src/views/Collection/CollectionOverview.vue
+var CollectionOverview_default = CollectionOverview_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { CollectionOverview_default as default };
+
+//# sourceMappingURL=CollectionOverview.vue.js.map

package/dist/views/Collection/CollectionOverview.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollectionOverview.vue.js","names":[],"sources":["../../../src/views/Collection/CollectionOverview.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport ViewLayoutSection from '@/components/ViewLayout/ViewLayoutSection.vue'\nimport { useWorkspace } from '@/store'\nimport { useActiveEntities } from '@/store/active-entities'\nimport MarkdownInput from '@/views/Collection/components/MarkdownInput.vue'\n\nconst {\n  activeCollection,\n  activeEnvironment,\n  activeEnvVariables,\n  activeWorkspace,\n} = useActiveEntities()\nconst { collectionMutators } = useWorkspace()\n\n/**\n * Update info.description\n */\nconst updateCollectionDescription = (value: string) => {\n  if (!activeCollection.value) {\n    return\n  }\n\n  collectionMutators.edit(activeCollection.value.uid, 'info.description', value)\n}\n</script>\n\n<template>\n  <ViewLayoutSection>\n    <MarkdownInput\n      v-if=\"activeEnvironment && activeWorkspace\"\n      :envVariables=\"activeEnvVariables\"\n      :environment=\"activeEnvironment\"\n      :modelValue=\"activeCollection?.info?.description ?? ''\"\n      :workspace=\"activeWorkspace\"\n      @update:modelValue=\"updateCollectionDescription\" />\n  </ViewLayoutSection>\n</template>\n"],"mappings":""}

package/dist/views/Collection/CollectionOverview.vue.script.js

@@ -0,0 +1,42 @@
+import { useActiveEntities } from "../../store/active-entities.js";
+import { useWorkspace } from "../../store/store.js";
+import ViewLayoutSection_default from "../../components/ViewLayout/ViewLayoutSection.vue.js";
+import MarkdownInput_default from "./components/MarkdownInput.vue.js";
+import { createBlock, createCommentVNode, defineComponent, openBlock, unref, withCtx } from "vue";
+//#region src/views/Collection/CollectionOverview.vue?vue&type=script&setup=true&lang.ts
+var CollectionOverview_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "CollectionOverview",
+	setup(__props) {
+		const { activeCollection, activeEnvironment, activeEnvVariables, activeWorkspace } = useActiveEntities();
+		const { collectionMutators } = useWorkspace();
+		/**
+		* Update info.description
+		*/
+		const updateCollectionDescription = (value) => {
+			if (!activeCollection.value) return;
+			collectionMutators.edit(activeCollection.value.uid, "info.description", value);
+		};
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(ViewLayoutSection_default, null, {
+				default: withCtx(() => [unref(activeEnvironment) && unref(activeWorkspace) ? (openBlock(), createBlock(MarkdownInput_default, {
+					key: 0,
+					envVariables: unref(activeEnvVariables),
+					environment: unref(activeEnvironment),
+					modelValue: unref(activeCollection)?.info?.description ?? "",
+					workspace: unref(activeWorkspace),
+					"onUpdate:modelValue": updateCollectionDescription
+				}, null, 8, [
+					"envVariables",
+					"environment",
+					"modelValue",
+					"workspace"
+				])) : createCommentVNode("", true)]),
+				_: 1
+			});
+		};
+	}
+});
+//#endregion
+export { CollectionOverview_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=CollectionOverview.vue.script.js.map

package/dist/views/Collection/CollectionOverview.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollectionOverview.vue.script.js","names":[],"sources":["../../../src/views/Collection/CollectionOverview.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport ViewLayoutSection from '@/components/ViewLayout/ViewLayoutSection.vue'\nimport { useWorkspace } from '@/store'\nimport { useActiveEntities } from '@/store/active-entities'\nimport MarkdownInput from '@/views/Collection/components/MarkdownInput.vue'\n\nconst {\n  activeCollection,\n  activeEnvironment,\n  activeEnvVariables,\n  activeWorkspace,\n} = useActiveEntities()\nconst { collectionMutators } = useWorkspace()\n\n/**\n * Update info.description\n */\nconst updateCollectionDescription = (value: string) => {\n  if (!activeCollection.value) {\n    return\n  }\n\n  collectionMutators.edit(activeCollection.value.uid, 'info.description', value)\n}\n</script>\n\n<template>\n  <ViewLayoutSection>\n    <MarkdownInput\n      v-if=\"activeEnvironment && activeWorkspace\"\n      :envVariables=\"activeEnvVariables\"\n      :environment=\"activeEnvironment\"\n      :modelValue=\"activeCollection?.info?.description ?? ''\"\n      :workspace=\"activeWorkspace\"\n      @update:modelValue=\"updateCollectionDescription\" />\n  </ViewLayoutSection>\n</template>\n"],"mappings":";;;;;;;;;EAMA,MAAM,EACJ,kBACA,mBACA,oBACA,oBACE,mBAAkB;EACtB,MAAM,EAAE,uBAAuB,cAAa;;;;EAK5C,MAAM,+BAA+B,UAAkB;AACrD,OAAI,CAAC,iBAAiB,MACpB;AAGF,sBAAmB,KAAK,iBAAiB,MAAM,KAAK,oBAAoB,MAAK;;;uBAK7E,YAQoB,2BAAA,MAAA;2BADmC,CAL7C,MAAA,kBAAiB,IAAI,MAAA,gBAAe,IAAA,WAAA,EAD5C,YAMqD,uBAAA;;KAJlD,cAAc,MAAA,mBAAkB;KAChC,aAAa,MAAA,kBAAiB;KAC9B,YAAY,MAAA,iBAAgB,EAAE,MAAM,eAAW;KAC/C,WAAW,MAAA,gBAAe;KAC1B,uBAAmB"}

package/dist/views/Collection/CollectionScripts.vue.js

@@ -0,0 +1,7 @@
+import CollectionScripts_vue_vue_type_script_setup_true_lang_default from "./CollectionScripts.vue.script.js";
+//#region src/views/Collection/CollectionScripts.vue
+var CollectionScripts_default = CollectionScripts_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { CollectionScripts_default as default };
+
+//# sourceMappingURL=CollectionScripts.vue.js.map

package/dist/views/Collection/CollectionScripts.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollectionScripts.vue.js","names":[],"sources":["../../../src/views/Collection/CollectionScripts.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport ViewLayoutSection from '@/components/ViewLayout/ViewLayoutSection.vue'\n</script>\n\n<template>\n  <ViewLayoutSection>\n    <template #title>Scripts</template>\n  </ViewLayoutSection>\n</template>\n"],"mappings":""}

package/dist/views/Collection/CollectionScripts.vue.script.js

@@ -0,0 +1,18 @@
+import ViewLayoutSection_default from "../../components/ViewLayout/ViewLayoutSection.vue.js";
+import { createBlock, createTextVNode, defineComponent, openBlock, withCtx } from "vue";
+//#region src/views/Collection/CollectionScripts.vue?vue&type=script&setup=true&lang.ts
+var CollectionScripts_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "CollectionScripts",
+	setup(__props) {
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(ViewLayoutSection_default, null, {
+				title: withCtx(() => [..._cache[0] || (_cache[0] = [createTextVNode("Scripts", -1)])]),
+				_: 1
+			});
+		};
+	}
+});
+//#endregion
+export { CollectionScripts_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=CollectionScripts.vue.script.js.map

package/dist/views/Collection/CollectionScripts.vue.script.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollectionScripts.vue.script.js","names":[],"sources":["../../../src/views/Collection/CollectionScripts.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport ViewLayoutSection from '@/components/ViewLayout/ViewLayoutSection.vue'\n</script>\n\n<template>\n  <ViewLayoutSection>\n    <template #title>Scripts</template>\n  </ViewLayoutSection>\n</template>\n"],"mappings":";;;;;;;uBAKE,YAEoB,2BAAA,MAAA;IADP,OAAK,cAAQ,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA,CAAA,gBAAP,WAAO,GAAA,CAAA,EAAA,CAAA"}

package/dist/views/Collection/CollectionServerForm.vue.js

@@ -0,0 +1,7 @@
+import CollectionServerForm_vue_vue_type_script_setup_true_lang_default from "./CollectionServerForm.vue.script.js";
+//#region src/views/Collection/CollectionServerForm.vue
+var CollectionServerForm_default = CollectionServerForm_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { CollectionServerForm_default as default };
+
+//# sourceMappingURL=CollectionServerForm.vue.js.map

package/dist/views/Collection/CollectionServerForm.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CollectionServerForm.vue.js","names":[],"sources":["../../../src/views/Collection/CollectionServerForm.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Server } from '@scalar/oas-utils/entities/spec'\nimport { REGEX } from '@scalar/oas-utils/helpers'\nimport { computed, watch } from 'vue'\n\nimport Form from '@/components/Form/Form.vue'\nimport ServerVariablesForm from '@/components/Server/ServerVariablesForm.vue'\nimport type { ServerVariables } from '@/components/Server/types'\nimport { useWorkspace } from '@/store'\nimport { useActiveEntities } from '@/store/active-entities'\n\nconst props = withDefaults(\n  defineProps<{\n    collectionId: string | string[]\n    serverUid: string | string[]\n  }>(),\n  {\n    collectionId: '',\n    serverUid: '',\n  },\n)\n\nconst { activeWorkspaceCollections } = useActiveEntities()\nconst { servers, serverMutators } = useWorkspace()\n\nconst options = [\n  {\n    label: 'URL',\n    key: 'url',\n    placeholder: 'https://void.scalar.com',\n    type: 'text',\n  },\n  {\n    label: 'Description',\n    key: 'description',\n    placeholder: 'Production',\n    type: 'text',\n  },\n]\n\nconst activeServer = computed(() => {\n  const activeCollection = activeWorkspaceCollections.value.find(\n    (collection) => collection.uid === props.collectionId,\n  )\n  return servers[\n    activeCollection &&\n    typeof props.serverUid === 'string' &&\n    props.serverUid === 'default'\n      ? (activeCollection.servers[0] ?? '')\n      : (activeCollection?.servers.find((uid) => uid === props.serverUid) ?? '')\n  ]\n})\n\nconst pathVariables = computed(() => {\n  if (!activeServer.value?.url) {\n    return []\n  }\n  return (\n    activeServer.value.url.match(REGEX.PATH)?.map((m) => m.slice(1, -1)) ?? []\n  )\n})\n\nwatch(\n  pathVariables,\n  (newPathVariables) => {\n    if (!activeServer.value) {\n      return\n    }\n\n    const variables = activeServer.value.variables\n      ? { ...activeServer.value.variables }\n      : {}\n\n    // Removes variables no longer in the server path\n    Object.keys(variables).forEach((key) => {\n      if (!newPathVariables.includes(key)) {\n        delete variables[key]\n      }\n    })\n\n    // Adds path variables\n    newPathVariables.forEach((variable) => {\n      if (!variables[variable]) {\n        variables[variable] = { default: '' }\n      }\n    })\n\n    serverMutators.edit(activeServer.value.uid, 'variables', variables)\n\n    // emitCustomEvent(wrapper.value, 'store-update-selected-server-properties', {\n    //   key: 'variables',\n    //   value: variables,\n    //   options: {\n    //     disableOldStoreUpdate: true,\n    //   },\n    // })\n  },\n  { immediate: true },\n)\n\nconst updateServer = (key: string, value: string) => {\n  if (!activeWorkspaceCollections.value || !activeServer.value) {\n    return\n  }\n  serverMutators.edit(activeServer.value.uid, key as keyof Server, value)\n\n  // if (key === 'url' || key === 'description') {\n  //   emitCustomEvent(wrapper.value, 'store-update-selected-server-properties', {\n  //     key: key,\n  //     value: value,\n  //     options: {\n  //       disableOldStoreUpdate: true,\n  //     },\n  //   })\n  // }\n}\n\nconst updateServerVariable = (key: string, value: string) => {\n  if (!activeServer.value) {\n    return\n  }\n\n  const variables = activeServer.value.variables || {}\n  variables[key] = { ...variables[key], default: value }\n\n  serverMutators.edit(activeServer.value.uid, 'variables', variables)\n\n  // emitCustomEvent(wrapper.value, 'store-update-selected-server-properties', {\n  //   key: 'variables',\n  //   value: variables,\n  //   options: {\n  //     disableOldStoreUpdate: true,\n  //   },\n  // })\n}\n</script>\n\n<template>\n  <div\n    class=\"divide-0.5 flex w-full flex-col divide-y rounded-b-lg text-sm\"\n    :class=\"activeServer?.variables && 'bg-b-1'\">\n    <template v-if=\"activeServer\">\n      <Form\n        :data=\"activeServer\"\n        :onUpdate=\"updateServer\"\n        :options=\"options\" />\n      <ServerVariablesForm\n        v-if=\"activeServer.variables\"\n        :variables=\"activeServer.variables as ServerVariables\"\n        @update:variable=\"updateServerVariable\" />\n    </template>\n  </div>\n</template>\n"],"mappings":""}