const FormComponent = React.forwardRef((props, ref)=>{ const handleKeyDown = (e)=>{ if (e.key === 'Enter') { const formElements = e.target.form.elements; const index = Array.prototype.indexOf.call(formElements, e.target); formElements[index + 1]?.focus(); e.preventDefault(); } }; return /*#__PURE__*/ React.createElement("form", { ref: ref, className: "space-y-4", __source: { fileName: "", lineNumber: 12, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 13, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block font-sans mb-2", __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }, "Input 1:"), /*#__PURE__*/ React.createElement("input", { name: "input1", type: "text", className: "font-sans border w-full p-2", onKeyDown: handleKeyDown, __source: { fileName: "", lineNumber: 15, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block font-sans mb-2", __source: { fileName: "", lineNumber: 23, columnNumber: 9 }, __self: this }, "Input 2:"), /*#__PURE__*/ React.createElement("input", { name: "input2", type: "text", className: "font-sans border w-full p-2", onKeyDown: handleKeyDown, __source: { fileName: "", lineNumber: 24, columnNumber: 9 }, __self: this }))); }); function MainComponent() { const formRef1 = React.createRef(); const formRef2 = React.createRef(); const getValues = ()=>{ const values1 = new FormData(formRef1.current).entries(); const values2 = new FormData(formRef2.current).entries(); const formData1 = Object.fromEntries(values1); const formData2 = Object.fromEntries(values2); console.log("Form 1 Values:", formData1); console.log("Form 2 Values:", formData2); }; return /*#__PURE__*/ React.createElement("div", { className: "space-y-8", __source: { fileName: "", lineNumber: 51, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(FormComponent, { ref: formRef1, __source: { fileName: "", lineNumber: 52, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(FormComponent, { ref: formRef2, __source: { fileName: "", lineNumber: 53, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("button", { onClick: getValues, className: "font-sans bg-blue-500 text-white p-2 rounded", __source: { fileName: "", lineNumber: 54, columnNumber: 7 }, __self: this }, "Get Form Values")); }