React wrapper: Wrap internal utilities into a context provided from HotTable to its children #10789
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Context
Changing the way
HotTable
communicates withHotColumn
s below. Right now, to avoid props passing and expose simple<HotTable ...><HotColumn ... /></HotTable>
children-based API, the utilities are shared fromHotTable
to HotColumn via React.Children iteration and cloneElement "magic". We agreed it's not idiomatic React and React way to do it would be to use context.However, it turned out that besides shared utils, the
HotColumn
instances getcolumnIndex
prop which obviously its different for each children, so the only way to do it without forcing end-users to specify these indices is to keep a part of the current approach.I also skipped moving
hotInstance
access to the context as right now there's no need to do so.HotInstance
is initialized and accessed only fromHotTable
- moving it elsewhere will only introduce unnecessary complexity.How has this been tested?
Types of changes
☝️ actually, none of them. This is purely a structural change with no behavior change intended.
Related issue(s):
Affected project(s):
handsontable
@handsontable/angular
@handsontable/react
@handsontable/vue
@handsontable/vue3
Checklist: