Komponentenzusammensetzungen + React Context → Übertragung von formEntity durch den Provider in Form und Nutzung in FormItem. Form umschließt seine Kinder mit FormContext.Provider, und FormItem verwendet cloneElement, um value und onChange in Input zu injizieren. Hindernis: Stelle sicher, dass FormItem den Namen an den Aktualisierungs-Handler übergibt. ```javascript const Form = ({ children, formEntity }) => ( <FormContext.Provider value={formEntity}>{children}</FormContext.Provider> ); const FormItem = ({ name, children }) => { const { state, handlers } = useContext(FormContext); return React.cloneElement(children, { value: state[name], onChange: (e) => handlers.updateValues({ name, value: e.target.value }), }); }; ```

В данном примере используется паттерн Compound Components с React Context для управления состоянием формы.

• Компонент Form создаёт контекст FormContext и передаёт в него объект formEntity, содержащий состояние формы и методы обновления.
• FormItem получает из контекста состояние и обработчики, затем с помощью React.cloneElement инъецирует в дочерний элемент (например, <input>) пропсы value и onChange.

Ключевой момент — передача name в обработчик onChange, чтобы обновлять именно нужное поле формы:

onChange: (e) => handlers.updateValues({ name, value: e.target.value })

Без передачи name обновление состояния формы будет некорректным, так как не будет понятно, какое поле изменилось.

Такой подход позволяет централизованно управлять состоянием формы и упрощает работу с вложенными компонентами формы.