Kullanım

Ana export edilen component: NvsDynamicForm.

Minimal örnek

import React from 'react';
import { NvsDynamicForm } from '@nvs-dynamic-form/react-core';

export function Example() {
  return (
    <NvsDynamicForm
      fields={[]}
      formElements={{}}
      buttonComponent={(props) => <button {...props} />}
      submitButtonDefaultOptions={{
        label: 'Gönder',
        isFullWidth: false,
        position: 'right',
      }}
      onSubmit={async (values) => {
        console.log(values);
      }}
    />
  );
}

Props

NvsDynamicForm props’ları (INvsDynamicForm):

Prop	Tip	Notlar
onSubmit	(values: unknown) => void | Promise<void>	Submit callback (sync veya async).
fields	Array<FieldBase | GroupField | ArrayField>	Formun yapısını tanımlar.
formClass	string	Alttaki <form> için opsiyonel className.
formElements	Record<string, { component: React.FC<any>; class: typeof FieldBase }>	fieldType → renderer + field model class registry’si.
container	React.FC<any>	Formu/grupları sarmalamak için opsiyonel container component’i.
containerOptions	Record<string, any>	Container’a forward edilen props/opsiyonlar.
containerVisible	boolean	true ise tüm form container ile sarılır (bazı modlarda hariç).
useContainersOutsideGroup	boolean	Nested group/array layout’larında container kullanım davranışını kontrol eder.
useGroupContainer	boolean	Group container davranışını açar.
buttonComponent	React.FC<any>	Submit/add/remove butonları bu component ile render edilir.
submitButtonDefaultOptions	ISubmitButtonDefaultOptions	Varsayılan submit button konfigürasyonu (label, position, full width).
submitButtonOptions	Record<string, any>	Submit button component’ine forward edilen ekstra props.
submitButtonVisible	boolean	Submit butonu göster/gizle.
submitButtonLabel	string	Submit butonu label override.
submitButtonPosition	'left' | 'center' | 'right'	Submit butonu hizası.
submitButtonIsFullWidth	boolean	Tam genişlik submit butonu.
submitButtonContainerClass	string	Submit button container wrapper class adı.
addButtonDefaultOptions	ArrayFieldAddButton	ArrayField “add” butonu için varsayılan opsiyonlar.
removeButtonDefaultOptions	ArrayFieldRemoveButton	ArrayField “remove” butonu için varsayılan opsiyonlar.
labelDefaultOptions	LabelOptions	Internal label/field component’lerinin varsayılan label opsiyonları.
doubleSubmitProtection	boolean	Submit sürerken ikinci submit’i engeller.

not

Field tipleri ve default option type’ları paket içinde types export’u altındadır.

Examples

Paket repo’sunda birçok Storybook örneği var.

Bu dokümanda her örnek Examples altında ayrı sayfada:

• Basic
• Group fields
• Array fields
• Container