import { createElementBlock, createElementVNode, defineComponent, mergeModels, openBlock, unref, useId, useModel, vModelText, withDirectives, withKeys } from "vue";
//#region src/v2/features/collection/components/LabelInput.vue?vue&type=script&setup=true&lang.ts
var _hoisted_1 = { class: "group pointer-events-none flex flex-1 items-center gap-1" };
var _hoisted_2 = ["for"];
var _hoisted_3 = ["id", "placeholder"];
var LabelInput_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
	__name: "LabelInput",
	props: /* @__PURE__ */ mergeModels({ placeholder: {} }, {
		"modelValue": { required: true },
		"modelModifiers": {}
	}),
	emits: /* @__PURE__ */ mergeModels(["blur"], ["update:modelValue"]),
	setup(__props, { emit: __emit }) {
		const emit = __emit;
		const model = useModel(__props, "modelValue");
		const id = useId();
		const handleBlur = () => {
			emit("blur", model.value);
		};
		return (_ctx, _cache) => {
			return openBlock(), createElementBlock("div", _hoisted_1, [createElementVNode("label", {
				class: "pointer-events-auto absolute top-0 left-0 h-full w-full cursor-text opacity-0",
				for: unref(id)
			}, null, 8, _hoisted_2), withDirectives(createElementVNode("input", {
				id: unref(id),
				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.value = $event),
				class: "text-c-1 group-hover-input pointer-events-auto relative -ml-0.5 h-8 w-full flex-1 rounded pl-1.25 has-[:focus-visible]:outline md:-ml-1.25",
				placeholder: __props.placeholder ?? "Untitled Document",
				onBlur: handleBlur,
				onKeydown: _cache[1] || (_cache[1] = withKeys(($event) => $event.target?.blur(), ["enter"]))
			}, null, 40, _hoisted_3), [[vModelText, model.value]])]);
		};
	}
});
//#endregion
export { LabelInput_vue_vue_type_script_setup_true_lang_default as default };

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