Checkbox component has warning

[yhrchan]

Checked out code, run npm install, then yarn start, accessed demo via localhost:8080

Steps to reproduce:

1. go to MUI demo
2. drag CHECKBOX component to form builder
3. enter in a value for "Label"
4. click the plus sign besides Options in the Properties Editor
5. click the plus sign again to create a 2nd options entry

Two warning messages encountered:

react-dom.development.js:88 Warning: The tag is unrecognized in this browser. If you meant to render a React component, start its name with an uppercase letter.
in checkbox (created by ForwardRef(ButtonBase))
in ForwardRef(ButtonBase) (created by WithStyles(ForwardRef(ButtonBase)))
in WithStyles(ForwardRef(ButtonBase)) (created by ForwardRef(IconButton))
in ForwardRef(IconButton) (created by WithStyles(ForwardRef(IconButton)))
in WithStyles(ForwardRef(IconButton)) (created by ForwardRef(SwitchBase))
in ForwardRef(SwitchBase) (created by WithStyles(ForwardRef(SwitchBase)))
in WithStyles(ForwardRef(SwitchBase)) (created by ForwardRef(Checkbox))
in ForwardRef(Checkbox) (created by WithStyles(ForwardRef(Checkbox)))
in WithStyles(ForwardRef(Checkbox)) (created by FinalCheckbox)
in label (created by ForwardRef(FormControlLabel))
in ForwardRef(FormControlLabel) (created by WithStyles(ForwardRef(FormControlLabel)))
in WithStyles(ForwardRef(FormControlLabel)) (created by FinalCheckbox)
in FinalCheckbox (created by SingleCheckbox)
in SingleCheckbox (created by MultipleChoiceList)
in div (created by ForwardRef(FormGroup))
in ForwardRef(FormGroup) (created by WithStyles(ForwardRef(FormGroup)))
in WithStyles(ForwardRef(FormGroup)) (created by Wrapper)
in fieldset (created by ForwardRef(FormControl))
in ForwardRef(FormControl) (created by WithStyles(ForwardRef(FormControl)))
in WithStyles(ForwardRef(FormControl)) (created by Wrapper)
in div (created by ForwardRef(Grid))
in ForwardRef(Grid) (created by WithStyles(ForwardRef(Grid)))

Warning: Encountered two children with the same key, 1621206633539-. Keys should be unique so that components maintain their identity across updates. Non-unique keys may cause children to be duplicated and/or omitted — the behavior is unsupported and could change in a future version.
in div (created by ForwardRef(FormGroup))
in ForwardRef(FormGroup) (created by WithStyles(ForwardRef(FormGroup)))
in WithStyles(ForwardRef(FormGroup)) (created by Wrapper)
in fieldset (created by ForwardRef(FormControl))
in ForwardRef(FormControl) (created by WithStyles(ForwardRef(FormControl)))
in WithStyles(ForwardRef(FormControl)) (created by Wrapper)
in div (created by ForwardRef(Grid))
in ForwardRef(Grid) (created by WithStyles(ForwardRef(Grid)))
in WithStyles(ForwardRef(Grid)) (created by Wrapper)
in Wrapper (created by MultipleChoiceList)
in MultipleChoiceList (created by MultipleChoiceList)
in MultipleChoiceList (created by Checkbox)
in Checkbox (created by ComponentWrapper)
in div (created by ComponentWrapper)
in ComponentWrapper (created by Draggable)
in div (created by ForwardRef(Paper))
in ForwardRef(Paper) (created by WithStyles(ForwardRef(Paper)))
in WithStyles(ForwardRef(Paper)) (created by ForwardRef(Card))
in ForwardRef(Card) (created by WithStyles(ForwardRef(Card)))
in WithStyles(ForwardRef(Card)) (created by FieldLayout)
in div (created by FieldLayout)
in FieldLayout (created by Draggable)
in div (created by Draggable)
in Draggable (created by Connect(Draggable))
in Connect(Draggable) (created by PrivateDraggable)
in PrivateDraggable (created by PublicDraggable)
in PublicDraggable

[Hyperkid123]

@yhrchan
The issue number will be fixed in the next release (should be published soon)

The second issue is caused when a field with a duplicate name is added to the builder. It is fixed by default in the new form builder version we want to release soon. It's on this branch: https://github.com/data-driven-forms/form-builder/tree/dnd-kit

We had to slow down a bit in the past few weeks because of other responsibilities but we will get back to the development soon.

[yhrchan]

Hi Martin, Thanks for the update. I'll wait for the fix. I did check out the dnd-kit branch and had a quick look, is there still lots of development work remaining on this branch? Was there a reason why your team has decided to utilize dnd kit versus the existing react-beautiful-dnd library? Thanks, Ricky Get Outlook for Android<https://aka.ms/AAb9ysg>

…

________________________________ From: Martin Maroši ***@***.***> Sent: Monday, May 24, 2021 6:39:40 AM To: data-driven-forms/react-forms ***@***.***> Cc: Ricky Chan ***@***.***>; Mention ***@***.***> Subject: Re: [data-driven-forms/react-forms] Checkbox component has warning (#1056) @yhrchan<https://github.com/yhrchan> The issue number will be fixed in the next release (should be published soon) The second issue is caused when a field with a duplicate name is added to the builder. It is fixed by default in the new form builder version we want to release soon. It's on this branch: https://github.com/data-driven-forms/form-builder/tree/dnd-kit We had to slow down a bit in the past few weeks because of other responsibilities but we will get back to the development soon. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub<#1056 (comment)>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/AA4DJYC7DHKVOABR54D5ZF3TPJCIZANCNFSM45NEOIPA>.

[rvsia]

@yhrchan

I can provide some information. Yes, there is probably still a lot of work to do on the dnd-kit branch but we got the most important thing to work already - it supports nested components unlike the beatiful-dnd. And that’s the reason why we choose to use different d&d package, because of the nesting. Without that, the form builder is too limited.