javivelasco / javivelasco/react-css-themr

Receiving/passing ref

Open
#65 7 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
589
Forks
65
PR merge metrics
No merged PRs in 30d

Description

Hi! To continue our conversation at https://github.com/javivelasco/react-css-themr/pull/46

In 2.1.0 you added `mapThemrProps` with example:
```javascript
function mapThemrProps(props, theme) {
const { composeTheme, innerRef, mapThemrProps, themeNamespace, ...rest } = props;
return { ...rest, withRef: innerRef, theme };
}
```

But `withRef` is usually boolean, for example in react-redux, so it doesn't work.

It was case, when `@themr` hoc wraps another hoc. But what if vice-versa, I have places where it's wrapped by `@connect`.

It used to be simple convention: In hoc's ref handler function it checked if underline instance also has getWrappedInstance and used it to take ref from it, so it's a chain when you can reach real component no matter how many hocs do you have on top of it
```javascript
saveComponentRef(instance) {
this.instance = instance && instance.getWrappedInstance ? instance.getWrappedInstance() : instance;
}
```

But now having somewhere `withRef`, somewhere `innerRef` or `mapThemrProps` I'm confused.
Feels like it has added complexity and problems instead of solving anything

Contributor guide

No contributing guide indexed for this repository

Research direction

Start by reading the discussion in pull request 46 and the 2.1.0 mapThemrProps example. Trace how refs are passed through @themr and react-redux-style HOCs, including withRef, innerRef, and getWrappedInstance; done requires an agreed convention that supports either wrapping order.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
frontend
Issue type
Bug
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.