Like Ember's builtin `(component)` helper, but with dynamic arguments, and JS compatibility
npm install ember-curry-componentLike Ember's builtin (component) helper, but with dynamic arguments, and JS compatibility.
```
ember install ember-curry-component
`gjs
import Component from "@glimmer/component";
import { getOwner } from "@ember/owner";
import curryComponent from "ember-curry-component";
import SomeOtherComponent from "./some-other-component";
class MyComponent extends Component {
get curriedComponent(){
const args = {
name: "David"
};
return curryComponent(SomeOtherComponent, args, getOwner(this))
}
}
`
`gjs
import Component from "@glimmer/component";
import { getOwner } from "@ember/owner";
import curryComponent from "ember-curry-component";
import SomeOtherComponent from "./some-other-component";
class MyComponent extends Component {
@tracked name = "David";
get curriedComponent() {
const instance = this;
const args = {
get name() {
return instance.name;
}
};
return curryComponent(SomeOtherComponent, args, getOwner(this));
}
}
`this.name
When is reassigned, the @name argument on the curried component will be invalidated. The curriedComponent getter will not be re-evaluated.
`gjs
import Component from "@glimmer/component";
import { getOwner } from "@ember/owner";
import curryComponent from "ember-curry-component";
import SomeOtherComponent from "./some-other-component";
class MyComponent extends Component {
@tracked name = "David";
get curriedComponent(){
const args = {
name: this.name
};
return curryComponent(SomeOtherComponent, args, getOwner(this));
}
}
`this.name
When is reassigned, the curriedComponent getter will be invalidated, and the curried component will be completely rerendered.
In .gjs/.gjs files, the curryComponent helper can be used directly in a template. In this case, the owner does not need to be passed explicitly.
`gjs
import SomeOtherComponent from "./some-other-component";
const args = { name: "david" }
{{#let (curryComponent MyComponent args) as |curriedComponent|}}
{{/let}}
`
In , curried components cannot be rendered from the local scope. This will fail:
`gjs`
// Do not copy!
const curried = curryComponent(MyComponent, args, owner){{#let}}
You must wrap the invocation in instead:`gjs``
// Do not copy!
const curried = curryComponent(MyComponent, args, owner)
{{#let curried as |myComponent|}}
{{/let}}
See the Contributing guide for details.
This project is licensed under the MIT License.