Modak Metric Copy this Tailwind ProductRegistrationFormto Your Project

Const [formData, setFormData] = useState({ productName: '', category: '', kilo: 0, grams: 0, mrp: '', mfg_date: '', exp_date: '', saleMrp: '', unit: 'piece' }) const renderUnitInputs = () => { switch (formData.unit) { case 'kg': case 'liter': return ( <> <label className="text gray 800 dark:text white"> {formData.unit === 'liter' ? 'Liters' : 'Kilo'} </label> <input type="number" name="kilo" value={formData.kilo} onChange={handleChange} step="0.001" className={inputClass} /> {formData.unit === 'liter' ? 'Milli Liter' : 'grams'} <input type="number" name="grams" value={formData.grams} onChange={handleChange} step="1" className={inputClass} /> </> ) case 'g': case 'ml': return ( <> <label className='text gray 800 dark:text white'>Grams:</label> <input type="number" name="grams" value={formData.grams} onChange={handleChange} step="1" className={inputClass} /> </> ) case 'quintal': case 'tonne': return ( <> <label className='text gray 800 dark:text white'>Kilo:</label> <input type="number" name="kilo" value={formData.kilo} onChange={handleChange} step="0.001" className={inputClass} /> </> ) case 'dozen': case 'piece': return ( <> <label className='text gray 800 dark:text white'>Count:</label> <input type="number" name="grams" value={formData.grams} onChange={handleChange} step="1" className={inputClass} /> </> ) default: return null } } create modak form desing