Container

NvsDynamicForm, formu sarmalamak için bir container component’i destekler.

• tüm formu sarmalamak için: containerVisible
• group/array bloklarını sarmalamak için: useGroupContainer / useContainersOutsideGroup (senaryoya göre)

Örnek: tüm formu sarmala

import React from 'react';

import { DynamicForm } from '../components/dynamic-form/DynamicForm';
import { InputField } from '../components/dynamic-form/fields/input';

const Card: React.FC<{ title?: string; children: React.ReactNode }> = ({
  title,
  children,
}) => (
  <div style={{ border: '1px solid #eee', borderRadius: 8, padding: 16 }}>
    {title && <h3 style={{ marginTop: 0 }}>{title}</h3>}
    {children}
  </div>
);

export function ContainerExample() {
  return (
    <DynamicForm
      container={Card}
      containerVisible
      containerOptions={{ title: 'Profil formu' }}
      fields={[new InputField({ id: 'firstName', label: 'Ad' })]}
      onSubmit={(values) => console.log(values)}
    />
  );
}

Notlar

• containerOptions sizin container implementasyonunuza forward edilir.
• Daha kompleks senaryolarda useGroupContainer / useContainersOutsideGroup kombinleyebilirsiniz.