import { Fragment, createElementBlock, createElementVNode, defineComponent, guardReactiveProps, mergeProps, normalizeProps, openBlock, toDisplayString, unref } from "vue";
import { useBindCx } from "@scalar/components";
//#region src/components/Form/LabelInput.vue?vue&type=script&setup=true&lang.ts
var _hoisted_1 = ["for"];
var _hoisted_2 = [
	"id",
	"placeholder",
	"value"
];
var LabelInput_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
	__name: "LabelInput",
	props: {
		inputId: {},
		placeholder: {},
		value: {},
		layout: {}
	},
	emits: ["updateValue"],
	setup(__props, { emit: __emit }) {
		const emit = __emit;
		const { cx } = useBindCx();
		const onInput = (event) => {
			const target = event.target;
			emit("updateValue", target.value);
		};
		return (_ctx, _cache) => {
			return openBlock(), createElementBlock("div", normalizeProps(guardReactiveProps(unref(cx)("flex-1 flex gap-1 items-center pointer-events-none group"))), [__props.layout !== "modal" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createElementVNode("label", mergeProps(unref(cx)("absolute w-full h-full top-0 left-0 pointer-events-auto opacity-0 cursor-text"), { for: __props.inputId }), null, 16, _hoisted_1), createElementVNode("input", mergeProps(unref(cx)("flex-1 text-c-1 rounded pointer-events-auto relative w-full pl-1.25 -ml-0.5 md:-ml-1.25 h-8 group-hover-input has-[:focus-visible]:outline z-10"), {
				id: __props.inputId,
				placeholder: __props.placeholder,
				value: __props.value,
				onInput
			}), null, 16, _hoisted_2)], 64)) : (openBlock(), createElementBlock("span", normalizeProps(mergeProps({ key: 1 }, unref(cx)("flex items-center text-c-1 h-8"))), toDisplayString(__props.value), 17))], 16);
		};
	}
});
//#endregion
export { LabelInput_vue_vue_type_script_setup_true_lang_default as default };

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