question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[RFC] Form Components Refactor

See original GitHub issue

Hi all! 👋 Wanted to take a stab at suggesting some Form-related improvements we could make for Carbon X. These don’t represent anything that we’d need to commit to, just are suggestions for where we could take some of these components in the future. Curious what you all thing 😄

For Forms, I figured we could focus initially on some of the wrappers around some of the more primitive input types. These could include text inputs, Checkbox & Radio, Textarea, etc. The way we could improve some of these is by introducing the following types on top of these inputs:

  • Inline input component (InlineCheckbox)
    • These would be wrappers around the input itself, and for associating a label to it. They would not be wrapped in a form item, and would be ideal for incorporating an input inside of another component. For example, checkboxes for selection in a DataTable
    • These components would support forwarding refs to the underlying <input>
  • Input component (Checkbox)
    • Similar to what we have now, but would be a stateless variant that would be wrapped in a form item. Would forward refs to underlying <input> node
    • Also should support the render logic for displaying validation state, but not handling the validations themselves
  • Controlled input component (ControlledCheckbox)
    • Would control the underlying stateless inputs and provide an onChange hook for folks to register. Also could provide a validate method, as well, to help folks hook in and show validation status

Looking forward, consumers would use these alongside our existing Form or FormGroup components. We could also, down the line, provide aliases for popular form libraries if we wanted to help out more with this use-case.

Anyways, that’s it! Curious to hear what everyone thinks 😄

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:11 (7 by maintainers)

github_iconTop GitHub Comments

1reaction
asudohcommented, Sep 4, 2018

@joshblack Thank you for more background. I see your point. My comments wrt the controlled version is more for caution given the history of our project getting numerous issues against our controlled components, and a suggestion that getting out of that business will be easier for us considering our maintenance effort, and for consumers by eliminating potential confusions.

0reactions
stale[bot]commented, Jun 11, 2019

As there’s been no activity since this issue was marked as stale, we are auto-closing it.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Introducing Hooks - React
At React Conf 2018, Sophie Alpert and Dan Abramov introduced Hooks, followed by Ryan Florence demonstrating how to refactor an application to use...
Read more >
Blog - Layouts RFC | Next.js
Nested routes and layouts, client and server routing, React 18 features, and designed for Server Components.
Read more >
PHYSICAL RESIDUAL FUNCTIONAL CAPACITY ...
RFC ASSESSMENT IS FOR: PHYSICAL RESIDUAL FUNCTIONAL CAPACITY ASSESSMENT ... PRIVACY ACT NOTICE: The information requested on this form is authorized by ...
Read more >
@shopify/react-form-state examples - CodeSandbox
Learn how to use @shopify/react-form-state by viewing and forking example apps that make use of @shopify/react-form-state on CodeSandbox. ; Latest version2.0.4.
Read more >
Deprecations Added in Ember 2.x
Using the model param in the {{render helper is deprecated in favor of using components. Please refactor to a component and invoke thusly:....
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found