react-component / react-component/trigger
[Proposal] Add topmost className prop and merge it into trigger element
Open
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 391
- Forks
- 245
- PR merge metrics
- No merged PRs in 30d
Description
Due to this issue: https://github.com/ant-design/ant-design/issues/10325, I suggest that we add className as a prop of Trigger for convenience.
Current
const props = this.props;
const children = props.children;
const child = React.Children.only(children);
const newChildProps = { key: 'trigger' };
// Merge some event handlers into `newChildProps`
const trigger = React.cloneElement(child, newChildProps);
Expected
import classNames from 'classnames';
// ...
const props = this.props;
const children = props.children;
const child = React.Children.only(children);
const newChildProps = {
key: 'trigger',
className: classNames(props.className, child.props.className),
};
// Merge some event handlers into `newChildProps`
const trigger = React.cloneElement(child, newChildProps);
| name | type | default | description |
|---|---|---|---|
| className | string | additional className added to trigger |
@yesmeck Shall I create a PR directly? Thanks.
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start at the Trigger implementation's child-cloning path described in the issue and inspect how props are merged into the trigger element. Add the proposed top-level className behavior, preserving the child's className, and verify that the resulting trigger receives both classes.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Feature
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100