[Feature]: Improve syntax / grammar of contexts

[FabianHummel]

Feature Category

Syntax/Language Improvement

Problem Statement

Ripple is looking really promising and I like the way it's using new keywords like component to better integrate the concept of UI with traditional Typescript. However, I think Contexts look very React-like and waste potential to be an outstanding and unique feature of Ripple.

Proposed Solution

I though of something like shown in the code snippet below (example taken from the README). Notice the use of a new keyword context and use. An added benefit is that this also removes the need for importing the function alltogether.

context MyContext = null;
^^^^^^^
component Child() {
  // Context is read in the Child component
  const value = use MyContext;
                ^^^
  // value is "Hello from context!"
  console.log(value);
}

component Parent() {
  const value = use MyContext;
                ^^^
  // Context is read in the Parent component, but hasn't yet
  // been set, so we fallback to the initial context value.
  // So the value is `null`
  console.log(value);

  // Context is set in the Parent component
  MyContext = "Hello from context!";

  <Child />
}

Alternatives Considered

I am open for alternatives, but I'd love to see contexts move into a direction I initially stated.

Examples & References

No response

Checklist

• I've searched for existing feature requests
• I'm willing to help implement this feature

[odamttenkelvin]

Another great way to have that is to efficientyly achieve:

• To reads a single array access.
• Provider: two function calls that write/read an array slot.
• Zero allocations, zero hashing, minimal branches.

`const __slot_MyContext = null;

component Child() {
const value = __ctx.peek(__slot_MyContext);
console.log(value);
}

component Parent() {
const value = __ctx.peek(__slot_MyContext);
console.log(value);

__ctx.push(__slot_MyContext, "Hello from context!");

__ctx.pop(__slot_MyContext);
}
`

[trueadm]

We're not going to go down the use syntax pipeline once again after React tried it. :)