@scalar/api-client 2.38.0 → 2.38.2

package/dist/environments-ByLK9lnC.js

@@ -0,0 +1,592 @@
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BmmBcIzD.js";
+import { n as CommandActionForm_default, t as CommandActionInput_default } from "./CommandActionInput-TkcAx6E8.js";
+import { t as CodeInput_default } from "./code-input-iq-moLxi.js";
+import { i as DataTableHeader_default, n as DataTableRow_default, o as DataTableCell_default, s as DataTable_default } from "./data-table-PL7e8NRO.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, nextTick, normalizeClass, normalizeStyle, openBlock, ref, renderList, toDisplayString, unref, vModelText, watch, withCtx, withDirectives } from "vue";
+import { ScalarButton, ScalarIcon, ScalarIconButton, ScalarModal, useModal } from "@scalar/components";
+import { ScalarIconNotePencil, ScalarIconPlus, ScalarIconTrash } from "@scalar/icons";
+//#region src/v2/features/environments/components/EnvironmentColors.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$4 = {
+	key: 1,
+	class: "color-selector flex h-4 flex-row items-center justify-between gap-1.5 space-x-1"
+};
+var _hoisted_2$2 = ["onClick"];
+var _hoisted_3$1 = {
+	key: 2,
+	class: "color-selector flex h-4 flex-1 items-center gap-2 rounded"
+};
+var _hoisted_4$1 = ["placeholder"];
+var DEFAULT_GRADIENT = "linear-gradient(to right, rgb(235, 87, 87), rgb(242, 201, 76), rgb(76, 183, 130), rgb(78, 167, 252), rgb(250, 96, 122))";
+//#endregion
+//#region src/v2/features/environments/components/EnvironmentColors.vue
+var EnvironmentColors_default = /* @__PURE__ */ defineComponent({
+	__name: "EnvironmentColors",
+	props: { activeColor: {} },
+	emits: ["select"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		const customColor = ref("");
+		const customColorInputRef = ref(null);
+		const showCustomInput = ref(false);
+		const showSelector = ref(false);
+		/**
+		* Predefined color options available in the color picker.
+		* Each option provides a standard color choice for the environment.
+		*/
+		const colorOptions = [
+			"#FFFFFF",
+			"#EF0006",
+			"#EDBE20",
+			"#069061",
+			"#FB892C",
+			"#0082D0",
+			"#5203D1",
+			"#FFC0CB"
+		];
+		/** Default gradient shown when no custom color is selected. */
+		const isPresetColor = computed(() => colorOptions.includes(__props.activeColor));
+		/** Check if a custom color is being used (not in the preset list). */
+		const isCustomColor = computed(() => __props.activeColor && !isPresetColor.value && !showCustomInput.value);
+		/** Check if the given color matches the currently active color. */
+		const isActiveColor = (color) => __props.activeColor === color;
+		/**
+		* Style for the custom color button.
+		* Shows the actual color if custom, otherwise shows a gradient.
+		*/
+		const customButtonStyle = computed(() => {
+			const displayColor = customColor.value || __props.activeColor;
+			return isCustomColor.value || customColor.value ? `background-color: ${displayColor};` : `background: ${DEFAULT_GRADIENT};`;
+		});
+		/**
+		* Toggle the custom color input visibility.
+		* Focuses the input after it becomes visible.
+		*/
+		const toggleCustomInput = async () => {
+			showCustomInput.value = !showCustomInput.value;
+			showSelector.value = false;
+			if (!showCustomInput.value) return;
+			await nextTick();
+			customColorInputRef.value?.focus();
+		};
+		/** Toggle the color selector visibility. */
+		const toggleSelector = () => {
+			showSelector.value = !showSelector.value;
+		};
+		/**
+		* Select a color and emit the selection event.
+		* Ensures the color value has a # prefix for hex colors.
+		*/
+		const selectColor = (color) => {
+			emit("select", color && !color.startsWith("#") ? `#${color}` : color);
+			showSelector.value = false;
+		};
+		/**
+		* Handle custom color input changes.
+		* Formats the color and emits the selection.
+		*/
+		const handleCustomColorInput = () => {
+			if (!customColor.value) return;
+			const formattedColor = customColor.value.startsWith("#") ? customColor.value : `#${customColor.value}`;
+			customColor.value = formattedColor;
+			selectColor(formattedColor);
+		};
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", null, [
+				!showCustomInput.value && !showSelector.value ? (openBlock(), createElementBlock("div", {
+					key: 0,
+					class: "flex h-4 w-4 cursor-pointer items-center justify-center rounded-full",
+					style: normalizeStyle({ backgroundColor: __props.activeColor }),
+					onClick: toggleSelector
+				}, [__props.activeColor ? (openBlock(), createBlock(unref(ScalarIcon), {
+					key: 0,
+					class: "text-c-btn p-0.5",
+					icon: "Checkmark",
+					size: "xs"
+				})) : createCommentVNode("", true)], 4)) : createCommentVNode("", true),
+				!showCustomInput.value && showSelector.value ? (openBlock(), createElementBlock("div", _hoisted_1$4, [
+					(openBlock(), createElementBlock(Fragment, null, renderList(colorOptions, (option) => {
+						return createElementVNode("div", {
+							key: option,
+							class: "flex h-4 w-4 cursor-pointer items-center justify-center rounded-full",
+							style: normalizeStyle({ backgroundColor: option }),
+							onClick: ($event) => selectColor(option)
+						}, [isActiveColor(option) ? (openBlock(), createBlock(unref(ScalarIcon), {
+							key: 0,
+							class: "text-c-btn p-0.5",
+							icon: "Checkmark",
+							size: "xs"
+						})) : createCommentVNode("", true)], 12, _hoisted_2$2);
+					}), 64)),
+					_cache[1] || (_cache[1] = createElementVNode("hr", { class: "border-ghost h-5 w-0.5 border-l" }, null, -1)),
+					createElementVNode("button", {
+						class: "z-10 flex h-4 w-4 cursor-pointer flex-row items-center justify-center gap-2 rounded-full",
+						style: normalizeStyle(customButtonStyle.value),
+						type: "button",
+						onClick: toggleCustomInput
+					}, [isCustomColor.value ? (openBlock(), createBlock(unref(ScalarIcon), {
+						key: 0,
+						class: "text-c-btn",
+						icon: "Checkmark",
+						size: "xs"
+					})) : createCommentVNode("", true)], 4)
+				])) : createCommentVNode("", true),
+				showCustomInput.value ? (openBlock(), createElementBlock("div", _hoisted_3$1, [
+					_cache[2] || (_cache[2] = createElementVNode("span", { class: "absolute h-4 w-4 rounded-full border border-dashed" }, null, -1)),
+					createElementVNode("span", {
+						class: "z-[1] h-4 w-4 rounded-full",
+						style: normalizeStyle(customButtonStyle.value)
+					}, null, 4),
+					withDirectives(createElementVNode("input", {
+						ref_key: "customColorInputRef",
+						ref: customColorInputRef,
+						"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => customColor.value = $event),
+						class: "w-full flex-1 border-transparent text-sm outline-none",
+						placeholder: __props.activeColor || "#000000",
+						type: "text",
+						onInput: handleCustomColorInput
+					}, null, 40, _hoisted_4$1), [[vModelText, customColor.value]]),
+					createElementVNode("button", {
+						class: "text-c-3 hover:bg-b-2 rounded-lg p-1.5",
+						type: "button",
+						onClick: toggleCustomInput
+					}, [createVNode(unref(ScalarIcon), {
+						icon: "Checkmark",
+						size: "xs"
+					})])
+				])) : createCommentVNode("", true)
+			]);
+		};
+	}
+});
+//#endregion
+//#region src/v2/features/environments/components/EnvironmentCreateModal.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$3 = { class: "flex items-start gap-2" };
+var _hoisted_2$1 = {
+	key: 0,
+	class: "text-red text-xs"
+};
+var DEFAULT_COLOR = "#FFFFFF";
+//#endregion
+//#region src/v2/features/environments/components/EnvironmentCreateModal.vue
+var EnvironmentCreateModal_default = /* @__PURE__ */ defineComponent({
+	__name: "EnvironmentCreateModal",
+	props: {
+		environments: {},
+		selectedEnvironmentName: {},
+		state: {},
+		eventBus: {},
+		collectionType: {}
+	},
+	setup(__props) {
+		/** Default color for new environments. */
+		const name = ref("");
+		const selectedColor = ref(DEFAULT_COLOR);
+		/** Ensure [re]set the form on open */
+		watch(() => __props.state.open, (isOpen) => {
+			if (isOpen) {
+				const environment = __props.environments[__props.selectedEnvironmentName ?? ""];
+				if (__props.selectedEnvironmentName && environment) {
+					name.value = __props.selectedEnvironmentName;
+					selectedColor.value = environment.color;
+				} else {
+					name.value = "";
+					selectedColor.value = DEFAULT_COLOR;
+				}
+			}
+		});
+		/**
+		* Handle color selection from the color picker.
+		* Updates the selected color for the new environment.
+		*/
+		const handleColorSelect = (color) => {
+			selectedColor.value = color;
+		};
+		/** Emits an event to create the environment with the provided name and color. */
+		const handleSubmit = () => {
+			if (__props.selectedEnvironmentName) __props.eventBus.emit("environment:upsert:environment", {
+				oldEnvironmentName: __props.selectedEnvironmentName,
+				payload: { color: selectedColor.value },
+				environmentName: name.value.trim(),
+				collectionType: __props.collectionType
+			});
+			else __props.eventBus.emit("environment:upsert:environment", {
+				environmentName: name.value.trim(),
+				payload: { color: selectedColor.value },
+				collectionType: __props.collectionType
+			});
+			__props.state.hide();
+		};
+		/** Check if the environment name is a duplicate */
+		const isDuplicateName = computed(() => {
+			if (__props.selectedEnvironmentName) return name.value !== __props.selectedEnvironmentName && Object.keys(__props.environments).includes(name.value);
+			return Object.keys(__props.environments).includes(name.value);
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(ScalarModal), {
+				bodyClass: "border-t-0 rounded-t-lg",
+				size: "xs",
+				state: __props.state
+			}, {
+				default: withCtx(() => [createVNode(CommandActionForm_default, {
+					disabled: !name.value.trim() || isDuplicateName.value,
+					onSubmit: handleSubmit
+				}, {
+					submit: withCtx(() => [createTextVNode(toDisplayString(__props.selectedEnvironmentName ? "Update" : "Add") + " Environment ", 1)]),
+					default: withCtx(() => [createElementVNode("div", _hoisted_1$3, [createVNode(EnvironmentColors_default, {
+						activeColor: selectedColor.value,
+						class: "peer",
+						onSelect: handleColorSelect
+					}, null, 8, ["activeColor"]), createVNode(CommandActionInput_default, {
+						modelValue: name.value,
+						"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => name.value = $event),
+						class: "-mt-[.5px] !p-0 peer-has-[.color-selector]:hidden",
+						placeholder: "Environment name"
+					}, null, 8, ["modelValue"])]), isDuplicateName.value ? (openBlock(), createElementBlock("div", _hoisted_2$1, " This environment name is already in use. ")) : createCommentVNode("", true)]),
+					_: 1
+				}, 8, ["disabled"])]),
+				_: 1
+			}, 8, ["state"]);
+		};
+	}
+});
+//#endregion
+//#region src/v2/features/environments/components/EnvironmentDeleteModal.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$2 = { class: "flex justify-between" };
+//#endregion
+//#region src/v2/features/environments/components/EnvironmentDeleteModal.vue
+var EnvironmentDeleteModal_default = /* @__PURE__ */ defineComponent({
+	__name: "EnvironmentDeleteModal",
+	props: {
+		state: {},
+		name: { default: "unknown" }
+	},
+	emits: ["cancel", "submit"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(ScalarModal), {
+				bodyClass: "border-t-0 rounded-t-lg flex flex-col gap-4",
+				size: "xxs",
+				state: __props.state,
+				title: `Delete ${__props.name}`
+			}, {
+				default: withCtx(() => [_cache[4] || (_cache[4] = createElementVNode("p", { class: "text-c-2 text-sm leading-normal text-pretty" }, " Are you sure you want to delete this environment? This action cannot be undone. ", -1)), createElementVNode("div", _hoisted_1$2, [createVNode(unref(ScalarButton), {
+					size: "sm",
+					variant: "outlined",
+					onClick: _cache[0] || (_cache[0] = () => {
+						emit("cancel");
+						__props.state.hide();
+					})
+				}, {
+					default: withCtx(() => [..._cache[2] || (_cache[2] = [createTextVNode(" Cancel ", -1)])]),
+					_: 1
+				}), createVNode(unref(ScalarButton), {
+					size: "sm",
+					variant: "danger",
+					onClick: _cache[1] || (_cache[1] = () => {
+						emit("submit");
+						__props.state.hide();
+					})
+				}, {
+					default: withCtx(() => [..._cache[3] || (_cache[3] = [createTextVNode(" Delete Environment ", -1)])]),
+					_: 1
+				})])]),
+				_: 1
+			}, 8, ["state", "title"]);
+		};
+	}
+});
+//#endregion
+//#region src/v2/features/environments/components/EnvironmentVariablesTable.vue
+var EnvironmentVariablesTable_default = /* @__PURE__ */ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "EnvironmentVariablesTable",
+	props: {
+		environment: {},
+		environmentName: {},
+		eventBus: {},
+		collectionType: {}
+	},
+	setup(__props) {
+		/** Column widths: Name, Value, Actions (delete button) */
+		const COLUMNS = [
+			"1fr",
+			"1fr",
+			"36px"
+		];
+		/** Adds an empty row at the end for creating new variables */
+		const displayRows = computed(() => {
+			/** Normalize the variables to have a name and value */
+			const variableRows = __props.environment.variables.map((v) => ({
+				name: v.name,
+				value: typeof v.value === "string" ? v.value : v.value.default
+			}));
+			const lastRow = __props.environment.variables.at(-1);
+			const hasContentInLastRow = lastRow && (lastRow.name !== "" || lastRow.value !== "");
+			if (!lastRow || hasContentInLastRow) return [...variableRows, {
+				name: "",
+				value: ""
+			}];
+			return variableRows;
+		});
+		/** Updates an existing variable or creates a new one */
+		const handleVariableChange = (name, value, index) => {
+			const isNewVariable = index >= __props.environment.variables.length;
+			/**
+			* Do not allow adding a new variable with an empty name on the last row,
+			* we allow it on other rows as it will delete the row
+			*/
+			if (!name && isNewVariable) return;
+			if (index >= __props.environment.variables.length) {
+				__props.eventBus.emit("environment:upsert:environment-variable", {
+					environmentName: __props.environmentName,
+					variable: {
+						name,
+						value
+					},
+					collectionType: __props.collectionType
+				});
+				return;
+			}
+			__props.eventBus.emit("environment:upsert:environment-variable", {
+				environmentName: __props.environmentName,
+				variable: {
+					name,
+					value
+				},
+				index,
+				collectionType: __props.collectionType
+			});
+		};
+		/** Deletes a variable by index */
+		const handleVariableDelete = (index) => __props.eventBus.emit("environment:delete:environment-variable", {
+			environmentName: __props.environmentName,
+			index,
+			collectionType: __props.collectionType
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(DataTable_default), {
+				class: "group/table data-table h-min flex-1 rounded",
+				columns: COLUMNS
+			}, {
+				default: withCtx(() => [createVNode(unref(DataTableRow_default), { class: "sr-only !block" }, {
+					default: withCtx(() => [
+						createVNode(unref(DataTableHeader_default), null, {
+							default: withCtx(() => [..._cache[0] || (_cache[0] = [createTextVNode("Name", -1)])]),
+							_: 1
+						}),
+						createVNode(unref(DataTableHeader_default), null, {
+							default: withCtx(() => [..._cache[1] || (_cache[1] = [createTextVNode("Value", -1)])]),
+							_: 1
+						}),
+						createVNode(unref(DataTableHeader_default), null, {
+							default: withCtx(() => [..._cache[2] || (_cache[2] = [createTextVNode("Actions", -1)])]),
+							_: 1
+						})
+					]),
+					_: 1
+				}), (openBlock(true), createElementBlock(Fragment, null, renderList(displayRows.value, (row, index) => {
+					return openBlock(), createBlock(unref(DataTableRow_default), {
+						key: index,
+						class: "group/row"
+					}, {
+						default: withCtx(() => [
+							createVNode(unref(DataTableCell_default), null, {
+								default: withCtx(() => [createVNode(unref(CodeInput_default), {
+									"aria-label": "Environment Variable Name",
+									disableCloseBrackets: "",
+									disableTabIndent: "",
+									environment: void 0,
+									lineWrapping: "",
+									modelValue: row.name,
+									placeholder: "Name",
+									"onUpdate:modelValue": (name) => handleVariableChange(name, row.value, index)
+								}, null, 8, ["modelValue", "onUpdate:modelValue"])]),
+								_: 2
+							}, 1024),
+							createVNode(unref(DataTableCell_default), null, {
+								default: withCtx(() => [createVNode(unref(CodeInput_default), {
+									"aria-label": "Environment Variable Value",
+									disableTabIndent: "",
+									environment: void 0,
+									lineWrapping: "",
+									modelValue: row.value,
+									placeholder: "Value",
+									"onUpdate:modelValue": (value) => handleVariableChange(row.name, value, index)
+								}, null, 8, ["modelValue", "onUpdate:modelValue"])]),
+								_: 2
+							}, 1024),
+							createVNode(unref(DataTableCell_default), { class: "flex items-center justify-center" }, {
+								default: withCtx(() => [index < __props.environment.variables.length ? (openBlock(), createBlock(unref(ScalarButton), {
+									key: 0,
+									class: "text-c-2 hover:text-c-1 hover:bg-b-2 hidden h-fit rounded p-1 group-focus-within:flex group-hover/row:flex",
+									size: "sm",
+									variant: "ghost",
+									onClick: ($event) => handleVariableDelete(index)
+								}, {
+									default: withCtx(() => [createVNode(unref(ScalarIconTrash), { class: "size-3.5" })]),
+									_: 1
+								}, 8, ["onClick"])) : createCommentVNode("", true)]),
+								_: 2
+							}, 1024)
+						]),
+						_: 2
+					}, 1024);
+				}), 128))]),
+				_: 1
+			});
+		};
+	}
+}), [["__scopeId", "data-v-28c8509c"]]);
+//#endregion
+//#region src/v2/features/environments/components/Environment.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1$1 = { class: "flex items-center gap-1.5" };
+var _hoisted_2 = { class: "flex h-6 w-6 items-center justify-center p-1" };
+var _hoisted_3 = { class: "px-1 py-0.5 text-sm font-medium" };
+var _hoisted_4 = {
+	key: 0,
+	class: "bg-c-accent text-b-1 flex items-center gap-1 rounded px-1.5 py-0.5 text-xs font-medium",
+	title: "This is the active environment"
+};
+var _hoisted_5 = { class: "hidden flex-row items-center gap-1 group-hover:flex" };
+//#endregion
+//#region src/v2/features/environments/components/Environment.vue
+var Environment_default = /* @__PURE__ */ defineComponent({
+	__name: "Environment",
+	props: {
+		environment: {},
+		environmentName: {},
+		eventBus: {},
+		isActive: {
+			type: Boolean,
+			default: false
+		},
+		collectionType: {}
+	},
+	emits: ["edit", "delete"],
+	setup(__props, { emit: __emit }) {
+		const emit = __emit;
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(["group relative rounded-lg border transition-colors", __props.isActive ? "border-c-accent bg-c-accent/5" : ""]) }, [createElementVNode("div", { class: normalizeClass(["flex justify-between rounded-t-lg px-1 py-1 text-sm", __props.isActive ? "bg-c-accent/10" : "bg-b-2"]) }, [createElementVNode("div", _hoisted_1$1, [
+				createElementVNode("div", _hoisted_2, [createElementVNode("span", {
+					class: "h-2.5 w-2.5 rounded-full",
+					style: normalizeStyle({ backgroundColor: __props.environment.color })
+				}, null, 4)]),
+				createElementVNode("span", _hoisted_3, toDisplayString(__props.environmentName), 1),
+				__props.isActive ? (openBlock(), createElementBlock("span", _hoisted_4, [..._cache[2] || (_cache[2] = [createElementVNode("span", { class: "size-1.5 rounded-full bg-current" }, null, -1), createTextVNode(" Active ", -1)])])) : createCommentVNode("", true)
+			]), createElementVNode("div", _hoisted_5, [createVNode(unref(ScalarIconButton), {
+				icon: unref(ScalarIconNotePencil),
+				label: "Edit Environment",
+				size: "sm",
+				onClick: _cache[0] || (_cache[0] = ($event) => emit("edit"))
+			}, null, 8, ["icon"]), createVNode(unref(ScalarIconButton), {
+				icon: unref(ScalarIconTrash),
+				label: "Delete Environment",
+				size: "sm",
+				onClick: _cache[1] || (_cache[1] = ($event) => emit("delete"))
+			}, null, 8, ["icon"])])], 2), createVNode(EnvironmentVariablesTable_default, {
+				collectionType: __props.collectionType,
+				environment: __props.environment,
+				environmentName: __props.environmentName,
+				eventBus: __props.eventBus
+			}, null, 8, [
+				"collectionType",
+				"environment",
+				"environmentName",
+				"eventBus"
+			])], 2);
+		};
+	}
+});
+//#endregion
+//#region src/v2/features/environments/EnvironmentsList.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "text-c-3 flex h-full items-center justify-center rounded-lg border p-4" };
+//#endregion
+//#region src/v2/features/environments/EnvironmentsList.vue
+var EnvironmentsList_default = /* @__PURE__ */ defineComponent({
+	__name: "EnvironmentsList",
+	props: {
+		environments: {},
+		eventBus: {},
+		activeEnvironment: {},
+		collectionType: {}
+	},
+	setup(__props) {
+		const createEnvironmentModalState = useModal();
+		const deleteEnvironmentModalState = useModal();
+		/** Track the currently selected environment for editing or deleting */
+		const selectedEnvironmentName = ref(null);
+		/** Opens the delete modal */
+		const openDeleteModal = (name) => {
+			selectedEnvironmentName.value = name;
+			deleteEnvironmentModalState.show();
+		};
+		/** Deletes the selected environment */
+		const deleteEnvironment = () => {
+			if (!selectedEnvironmentName.value) return;
+			__props.eventBus.emit("environment:delete:environment", {
+				environmentName: selectedEnvironmentName.value,
+				collectionType: __props.collectionType
+			});
+		};
+		/** Opens the upsert modal, leave name empty for add */
+		const openUpsertModal = (name) => {
+			selectedEnvironmentName.value = name ?? null;
+			createEnvironmentModalState.show();
+		};
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock(Fragment, null, [
+				(openBlock(true), createElementBlock(Fragment, null, renderList(Object.entries(__props.environments), ([environmentName, environment]) => {
+					return openBlock(), createBlock(Environment_default, {
+						key: environmentName,
+						collectionType: __props.collectionType,
+						environment,
+						environmentName,
+						eventBus: __props.eventBus,
+						isActive: __props.activeEnvironment === environmentName,
+						onDelete: () => openDeleteModal(environmentName),
+						onEdit: () => openUpsertModal(environmentName)
+					}, null, 8, [
+						"collectionType",
+						"environment",
+						"environmentName",
+						"eventBus",
+						"isActive",
+						"onDelete",
+						"onEdit"
+					]);
+				}), 128)),
+				createElementVNode("div", _hoisted_1, [createVNode(unref(ScalarButton), {
+					class: "hover:bg-b-2 hover:text-c-1 flex items-center gap-2",
+					size: "xs",
+					variant: "ghost",
+					onClick: _cache[0] || (_cache[0] = () => openUpsertModal())
+				}, {
+					default: withCtx(() => [createVNode(unref(ScalarIconPlus)), _cache[1] || (_cache[1] = createTextVNode(" Add Environment ", -1))]),
+					_: 1
+				})]),
+				createVNode(EnvironmentCreateModal_default, {
+					collectionType: __props.collectionType,
+					environments: __props.environments,
+					eventBus: __props.eventBus,
+					selectedEnvironmentName: selectedEnvironmentName.value,
+					state: unref(createEnvironmentModalState)
+				}, null, 8, [
+					"collectionType",
+					"environments",
+					"eventBus",
+					"selectedEnvironmentName",
+					"state"
+				]),
+				createVNode(EnvironmentDeleteModal_default, {
+					name: selectedEnvironmentName.value,
+					state: unref(deleteEnvironmentModalState),
+					onSubmit: deleteEnvironment
+				}, null, 8, ["name", "state"])
+			], 64);
+		};
+	}
+});
+//#endregion
+export { EnvironmentsList_default as t };
+
+//# sourceMappingURL=environments-ByLK9lnC.js.map