feat: formControl add valuePropName support

[myNameIsDu]

formControl add valuePropName support

[vercel]

@myNameIsDu is attempting to deploy a commit to the rsuite Team on Vercel.

A member of the Team first needs to authorize it.

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated
rsuite-nextjs	✅ Ready (Inspect)	Visit Preview	Apr 28, 2022 at 5:04PM (UTC)

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 22d6f24:

Sandbox	Source
rsuite-tp-ci	Configuration

[codecov]

Codecov Report

Merging #2461 (22d6f24) into main (69dee5e) will decrease coverage by 0.00%.
The diff coverage is 100.00%.

@@            Coverage Diff             @@
##             main    #2461      +/-   ##
==========================================
- Coverage   85.69%   85.68%   -0.01%     
==========================================
  Files         275      275              
  Lines        8666     8668       +2     
  Branches     2438     2439       +1     
==========================================
+ Hits         7426     7427       +1     
  Misses        653      653              
- Partials      587      588       +1     

Flag	Coverage Δ
ChromeCi	85.68% <100.00%> (+<0.01%)	⬆️
Firefox	85.67% <100.00%> (-0.01%)	⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files	Coverage Δ
src/FormControl/FormControl.tsx	93.54% <100.00%> (+0.21%)	⬆️
src/Menu/Menu.tsx	90.00% <0.00%> (-0.67%)	⬇️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 69dee5e...22d6f24. Read the comment docs.

[simonguo]

Hi @myNameIsDu
I'm not quite sure, what problem is it trying to solve?

[myNameIsDu]

Hi @myNameIsDu I'm not quite sure, what problem is it trying to solve?

Here's an example

The value of the Toggle component is actually checked,If I use it in a form, I have to wrap a layer, Others, such as Checkbox Component

[simonguo]

@myNameIsDu
In use, I think the encapsulation of the Toggle component is easier to understand than the valuePropName prop.

[myNameIsDu]

@myNameIsDu In use, I think the encapsulation of the Toggle component is easier to understand than the valuePropName prop.

Yeah,I think this is a very friendly prop for me,It can help me write lesser template code, And i think if one person knows how to wrap Toggle component, He must understand what this prop is doing

[SevenOutman]

I don't think a custom value prop is key to this <Toggle> case. We don't take checked from <Toggle> because it receives value via this "customized prop", but because it's a checkbox. The core of resolving this issue is to tell <FormControl> whether its accepter is a radio/checkbox or a normal textbox.

[myNameIsDu]

I don't think a custom value prop is key to this <Toggle> case. We don't take checked from <Toggle> because it receives value via this "customized prop", but because it's a checkbox. The core of resolving this issue is to tell <FormControl> whether its accepter is a radio/checkbox or a normal textbox.

Yeah, if we can handle it internally that's the perfect situation