import HttpMethod_default from "../../../blocks/operation-code-sample/components/HttpMethod.vue.js";
import CommandActionForm_default from "./CommandActionForm.vue.js";
import CommandActionInput_default from "./CommandActionInput.vue.js";
import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, ref, renderList, toDisplayString, unref, watch, withCtx } from "vue";
import { ScalarButton, ScalarDropdown, ScalarDropdownItem, ScalarIcon, ScalarListbox } from "@scalar/components";
//#region src/v2/features/command-palette/components/CommandPaletteExample.vue?vue&type=script&setup=true&lang.ts
var _hoisted_1 = {
	key: 0,
	class: "flex flex-1 gap-1"
};
var _hoisted_2 = {
	key: 0,
	class: "text-c-1 truncate"
};
var _hoisted_3 = {
	key: 1,
	class: "text-c-3"
};
var _hoisted_4 = { class: "flex items-center gap-2" };
var _hoisted_5 = { class: "custom-scroll max-h-40" };
var _hoisted_6 = { class: "truncate" };
var CommandPaletteExample_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
	name: "CommandPaletteExample",
	props: {
		workspaceStore: {},
		eventBus: {},
		documentName: {},
		operationId: {},
		example: {}
	},
	emits: ["close", "back"],
	setup(__props, { emit: __emit }) {
		const emit = __emit;
		/** Operation option type for selectors */
		const isEditMode = computed(() => __props.example !== void 0);
		const exampleName = ref(__props.example?.name ?? "");
		const exampleNameTrimmed = computed(() => exampleName.value.trim());
		/** All available documents (collections) in the workspace */
		const availableDocuments = computed(() => Object.entries(__props.workspaceStore.workspace.documents).map(([name, document]) => ({
			id: name,
			label: document.info.title || name
		})));
		const selectedDocument = ref(__props.documentName ? availableDocuments.value.find((document) => document.id === __props.documentName) : availableDocuments.value[0] ?? void 0);
		/**
		* Recursively traverse navigation entries to find all operations.
		* Operations can be nested under tags or at the document level.
		*/
		const getAllOperations = (entries) => {
			const operations = [];
			for (const entry of entries) {
				if (entry.type === "operation") operations.push(entry);
				/** Recursively traverse child entries if they exist */
				if ("children" in entry && entry.children) operations.push(...getAllOperations(entry.children));
			}
			return operations;
		};
		/** All available operations for the selected document */
		const availableOperations = computed(() => {
			if (!selectedDocument.value) return [];
			const document = __props.workspaceStore.workspace.documents[selectedDocument.value.id];
			if (!document || !document["x-scalar-navigation"]) return [];
			const navigation = document["x-scalar-navigation"];
			return getAllOperations(navigation.children ?? []).map((operation) => ({
				id: operation.id,
				label: `${operation.method.toUpperCase()} ${operation.path}`,
				path: operation.path,
				method: operation.method,
				exampleNames: operation.children?.filter((child) => child.type === "example").map((child) => child.name) ?? []
			}));
		});
		const selectedOperation = ref(__props.operationId ? availableOperations.value.find((operation) => operation.id === __props.operationId) : void 0);
		/** Reset operation selection when document changes */
		watch(selectedDocument, () => {
			selectedOperation.value = __props.operationId ? availableOperations.value.find((operation) => operation.id === __props.operationId) : availableOperations.value[0] ?? void 0;
		}, { immediate: true });
		/** Handle operation selection from dropdown */
		const handleSelect = (operation) => {
			if (operation) selectedOperation.value = operation;
		};
		/**
		* Check if the form should be disabled.
		* Disabled when any required field is missing or empty.
		*/
		const isDisabled = computed(() => {
			if (!exampleNameTrimmed.value || !selectedDocument.value || !selectedOperation.value) return true;
			if (isEditMode.value && __props.example) {
				if (exampleNameTrimmed.value === __props.example.name) return true;
			}
			if (selectedOperation.value.exampleNames.some((name) => name === exampleNameTrimmed.value && name !== __props.example?.name)) return true;
			return false;
		});
		/**
		* Navigate to the example route which will create it automatically.
		* The route handler will create the example with the provided details.
		*/
		const handleSubmit = () => {
			if (isDisabled.value || !selectedDocument.value || !selectedOperation.value) return;
			if (isEditMode.value && __props.example) {
				__props.eventBus.emit("operation:rename:example", {
					documentName: selectedDocument.value.id,
					meta: {
						path: selectedOperation.value.path,
						method: selectedOperation.value.method,
						exampleKey: __props.example.name
					},
					payload: { name: exampleNameTrimmed.value }
				});
				emit("close");
				return;
			}
			__props.eventBus.emit("operation:create:draft-example", {
				documentName: selectedDocument.value.id,
				meta: {
					path: selectedOperation.value.path,
					method: selectedOperation.value.method
				},
				exampleName: exampleNameTrimmed.value
			});
			emit("close");
		};
		/** Handle back navigation when user presses backspace on empty input */
		const handleBack = (event) => {
			if (isEditMode.value) return;
			emit("back", event);
		};
		/** Handle cancel action in edit mode */
		const handleCancel = () => {
			emit("close");
		};
		return (_ctx, _cache) => {
			return openBlock(), createBlock(CommandActionForm_default, {
				disabled: isDisabled.value,
				onSubmit: handleSubmit
			}, {
				options: withCtx(() => [!isEditMode.value ? (openBlock(), createElementBlock("div", _hoisted_1, [createVNode(unref(ScalarListbox), {
					modelValue: selectedDocument.value,
					"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => selectedDocument.value = $event),
					options: availableDocuments.value
				}, {
					default: withCtx(() => [createVNode(unref(ScalarButton), {
						class: "hover:bg-b-2 max-h-8 w-[150px] min-w-[150px] justify-between gap-1 p-2 text-xs",
						variant: "outlined"
					}, {
						default: withCtx(() => [createElementVNode("span", { class: normalizeClass(selectedDocument.value ? "text-c-1 truncate" : "text-c-3") }, toDisplayString(selectedDocument.value ? selectedDocument.value.label : "Select Document"), 3), createVNode(unref(ScalarIcon), {
							class: "text-c-3",
							icon: "ChevronDown",
							size: "md"
						})]),
						_: 1
					})]),
					_: 1
				}, 8, ["modelValue", "options"]), createVNode(unref(ScalarDropdown), {
					placement: "bottom",
					resize: ""
				}, {
					items: withCtx(() => [createElementVNode("div", _hoisted_5, [(openBlock(true), createElementBlock(Fragment, null, renderList(availableOperations.value, (operation) => {
						return openBlock(), createBlock(unref(ScalarDropdownItem), {
							key: operation.id,
							class: "flex h-7 w-full items-center justify-between px-1 pr-[26px]",
							onClick: ($event) => handleSelect(operation)
						}, {
							default: withCtx(() => [createElementVNode("span", _hoisted_6, toDisplayString(operation.path), 1), createVNode(HttpMethod_default, { method: operation.method }, null, 8, ["method"])]),
							_: 2
						}, 1032, ["onClick"]);
					}), 128))])]),
					default: withCtx(() => [createVNode(unref(ScalarButton), {
						class: "hover:bg-b-2 max-h-8 w-full justify-between gap-1 p-2 text-xs",
						disabled: !availableOperations.value.length,
						variant: "outlined"
					}, {
						default: withCtx(() => [selectedOperation.value ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(selectedOperation.value.path), 1)) : (openBlock(), createElementBlock("span", _hoisted_3, " Select Operation ")), createElementVNode("div", _hoisted_4, [selectedOperation.value ? (openBlock(), createBlock(HttpMethod_default, {
							key: 0,
							method: selectedOperation.value.method
						}, null, 8, ["method"])) : createCommentVNode("", true), createVNode(unref(ScalarIcon), {
							class: "text-c-3",
							icon: "ChevronDown",
							size: "md"
						})])]),
						_: 1
					}, 8, ["disabled"])]),
					_: 1
				})])) : (openBlock(), createBlock(unref(ScalarButton), {
					key: 1,
					class: "max-h-8 px-3 text-xs",
					variant: "outlined",
					onClick: handleCancel
				}, {
					default: withCtx(() => [..._cache[2] || (_cache[2] = [createTextVNode(" Cancel ", -1)])]),
					_: 1
				}))]),
				submit: withCtx(() => [createTextVNode(toDisplayString(isEditMode.value ? "Save" : "Create Example"), 1)]),
				default: withCtx(() => [createVNode(CommandActionInput_default, {
					modelValue: exampleName.value,
					"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => exampleName.value = $event),
					label: "Example Name",
					placeholder: "Example Name",
					onDelete: handleBack
				}, null, 8, ["modelValue"])]),
				_: 1
			}, 8, ["disabled"]);
		};
	}
});
//#endregion
export { CommandPaletteExample_vue_vue_type_script_setup_true_lang_default as default };

//# sourceMappingURL=CommandPaletteExample.vue.script.js.map