You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Using an example from the reakit beta, let's say I want to make a button link
<Buttonto="/somewhere"use={Link}/>
This works, but it has the unexpected side effect of passing all of the props Button uses to Link. Unexpected attributes are written to the DOM and you'll get a warning for trying to write the boolean opaque. It's not impossible to get around this
but it has the side effect of adding another component to the tree. I think a better approach would be to allow the user to provide a list of props they want, then use that during the render over omit.
I propose an API like
import{select}from'reuse';// So instead of `omit(props, 'use', 'useNext')`, it'll do `pick(props, 'className', 'to')`.constSelectiveLink=select(Link,['className','to']);// ...<Buttonto="/somewhere"use={SelectiveLink}/>
It wouldn't supplant the current one, just add a hot path and a helper. A potentially less verbose option would be an omission helper
import{filter}from'reuse';// So it'll do `omit(props, 'opaque', 'palette', 'use', 'useNext')`.constSelectiveLink=filter(Link,['opaque','palette']);// ...<Buttonto="/somewhere"use={SelectiveLink}/>
but this is also potentially less performant. Additionally, the list of props could be provided by the implementing component.
constSelectiveLink=filter(Link,Button.propNames);
The text was updated successfully, but these errors were encountered:
Using an example from the
reakit
beta, let's say I want to make a button linkThis works, but it has the unexpected side effect of passing all of the props
Button
uses toLink
. Unexpected attributes are written to the DOM and you'll get a warning for trying to write the booleanopaque
. It's not impossible to get around thisbut it has the side effect of adding another component to the tree. I think a better approach would be to allow the user to provide a list of props they want, then use that during the render over
omit
.I propose an API like
It wouldn't supplant the current one, just add a hot path and a helper. A potentially less verbose option would be an omission helper
but this is also potentially less performant. Additionally, the list of props could be provided by the implementing component.
The text was updated successfully, but these errors were encountered: