Add Context or Provide/Inject API to solve the Props Drilling problem

[AllanOricil]

Is your feature request related to a problem? Please describe.

I could not find a similar feature in lwc to solve the Props Drilling problem

Describe the solution you'd like

Maybe create something like Vue's Provide/Inject feature?

https://vuejs.org/guide/components/provide-inject.html

Describe alternatives you've considered

I would probably use this state management lib based redux

https://www.lwc-redux.com/

I'm not sure if this is the best solution because states are availble to any component in the tree, and not just the descendants of a component.

Additional context
N/A

[AllanOricil]

After googling lwc prop drilling I could not find anything about it. It seems that it is not a problem lwc devs are aware of.

[nolanlawson]

Thanks for opening the issue! This pattern is also called context.

We have a few ways of doing this currently:

• createContextProvider – not heavily documented, and will probably be deprecated at some point
• Using events, e.g. see the context protocol proposal which you can use for inspiration

We have some ideas for improving this – e.g. see the "signals" RFC: salesforce/lwc-rfcs#82

[AllanOricil]

Thanks for opening the issue! This pattern is also called context.

We have a few ways of doing this currently:

• createContextProvider – not heavily documented, and will probably be deprecated at some point
• Using events, e.g. see the context protocol proposal which you can use for inspiration

We have some ideas for improving this – e.g. see the "signals" RFC: salesforce/lwc-rfcs#82

This signals feature is really nice. I hope you can release it soon. It reminds me of VHDL/Verilog signals where some part of my code would activate when a signal changed.

[AllanOricil]

@nolanlawson would there be a way to predict the order components react to a signal change? For example, if I have 100 components all subscribed to the same signal, which one of the components would react to the signal change first?

[nolanlawson]

@AllanOricil That's a great question. Could you raise it in the RFC as a clarification?

Off the top of my head, I would assume depth-first tree traversal order, but it would be great to have it clarified in the RFC.

[jasonAtThinkLP]

+1 to this issue. Coming from React into Salesforce / LWC and I'm a little mystified about how I'm supposed to communicate from Parent to Child without props drilling.

It feels very strange to have events bubble up, but have no way of firing events down when the top of the tree is where data stores and controllers would typically live.