import { computed, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, guardReactiveProps, mergeProps, nextTick, normalizeProps, onMounted, openBlock, ref, renderSlot, unref, vModelText, withCtx, withDirectives, withKeys, withModifiers } from "vue";
import { ScalarButton, useBindCx } from "@scalar/components";
//#region src/components/CommandPalette/CommandActionForm.vue?vue&type=script&setup=true&lang.ts
var _hoisted_1$1 = { class: "flex gap-2" };
var _hoisted_2 = { class: "flex max-h-8 flex-1" };
//#endregion
//#region src/components/CommandPalette/CommandActionForm.vue
var CommandActionForm_default = /* @__PURE__ */ defineComponent({
	__name: "CommandActionForm",
	props: {
		loader: {},
		disabled: {
			type: Boolean,
			default: false
		}
	},
	emits: [
		"submit",
		"cancel",
		"back"
	],
	setup(__props) {
		const { cx } = useBindCx();
		return (_ctx, _cache) => {
			return openBlock(), createElementBlock("form", {
				class: "flex w-full flex-col gap-3",
				onKeydown: _cache[0] || (_cache[0] = withKeys(withModifiers(() => {}, ["stop"]), ["enter"])),
				onSubmit: _cache[1] || (_cache[1] = withModifiers(($event) => !__props.disabled && _ctx.$emit("submit"), ["prevent", "stop"]))
			}, [createElementVNode("div", normalizeProps(guardReactiveProps(unref(cx)("relative flex min-h-20 flex-col rounded"))), [renderSlot(_ctx.$slots, "default")], 16), createElementVNode("div", _hoisted_1$1, [createElementVNode("div", _hoisted_2, [renderSlot(_ctx.$slots, "options")]), createVNode(unref(ScalarButton), {
				class: "max-h-8 px-3 text-xs",
				disabled: __props.disabled,
				loader: __props.loader,
				type: "submit"
			}, {
				default: withCtx(() => [renderSlot(_ctx.$slots, "submit", {}, () => [_cache[2] || (_cache[2] = createTextVNode("Continue", -1))])]),
				_: 3
			}, 8, ["disabled", "loader"])])], 32);
		};
	}
});
//#endregion
//#region src/components/CommandPalette/CommandActionInput.vue?vue&type=script&setup=true&lang.ts
var _hoisted_1 = ["placeholder"];
//#endregion
//#region src/components/CommandPalette/CommandActionInput.vue
var CommandActionInput_default = /* @__PURE__ */ defineComponent({
	inheritAttrs: false,
	__name: "CommandActionInput",
	props: {
		modelValue: {},
		placeholder: {},
		autofocus: { type: Boolean }
	},
	emits: ["update:modelValue", "onDelete"],
	setup(__props, { emit: __emit }) {
		const props = __props;
		const emit = __emit;
		const input = ref(null);
		onMounted(() => nextTick(() => {
			if (props.autofocus) input.value?.focus();
		}));
		const model = computed({
			get: () => props.modelValue ?? "",
			set: (v) => emit("update:modelValue", v)
		});
		/** Re-emits enter as a submit event for the form  */
		function handleEnter(event) {
			if (event.shiftKey || !event.target) return;
			event.preventDefault();
			const target = event.target;
			const submitEvent = new Event("submit", { cancelable: true });
			target.form?.dispatchEvent(submitEvent);
		}
		/** Emits a back event if the input is empty */
		function handleBack(event) {
			if (model.value !== "") return;
			event.preventDefault();
			event.stopPropagation();
			emit("onDelete", event);
		}
		return (_ctx, _cache) => {
			return withDirectives((openBlock(), createElementBlock("textarea", mergeProps({
				id: "command-action-input",
				ref_key: "input",
				ref: input,
				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.value = $event),
				class: "min-h-8 w-full flex-1 resize-none border border-transparent py-1.5 pl-8.5 text-sm outline-none focus:border-b-1",
				placeholder: props.placeholder ?? "",
				wrap: "hard"
			}, _ctx.$attrs, { onKeydown: [_cache[1] || (_cache[1] = withKeys(($event) => handleBack($event), ["delete"])), _cache[2] || (_cache[2] = withKeys(($event) => handleEnter($event), ["enter"]))] }), null, 16, _hoisted_1)), [[vModelText, model.value]]);
		};
	}
});
//#endregion
export { CommandActionForm_default as n, CommandActionInput_default as t };

//# sourceMappingURL=CommandActionInput-TkcAx6E8.js.map