Skip to content

Commit

Permalink
update addon docs
Browse files Browse the repository at this point in the history
  • Loading branch information
miguelcobain committed Jan 24, 2021
1 parent be0ec24 commit efae96c
Show file tree
Hide file tree
Showing 3 changed files with 23 additions and 10 deletions.
6 changes: 3 additions & 3 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@
"ember-disable-prototype-extensions": "^1.1.3",
"ember-export-application-global": "^2.0.1",
"ember-fetch": "^8.0.4",
"ember-leaflet-marker-cluster": "1.0.0-beta.1",
"ember-leaflet-marker-cluster": "^1.0.0",
"ember-load-initializers": "^2.1.2",
"ember-maybe-import-regenerator": "^0.1.6",
"ember-page-title": "^6.2.0",
Expand Down
25 changes: 19 additions & 6 deletions tests/dummy/app/pods/docs/addons/template.md
Original file line number Diff line number Diff line change
Expand Up @@ -85,14 +85,27 @@ The `registerComponent` method accepts two arguments:
- an options object. Only the `as` option is supported at the moment. The `as` option is the name
under which the component will yielded as from the `<LeafletMap>` component.

### Setting up the a new layer's template
### Yielding additional components from new components

If you're extending from `BaseLayer` (or another layer that extends from it), you might have to set up some boilerplate
on your template. This is required because in glimmer components and octane we don't have observers. So that means
that observing values requires the usage of [`ember-render-helpers`](https://github.com/buschtoens/ember-render-helpers), which
requires the template (better solutions are welcome).
It is usual for new components to yield additional components in addons. In the example above, there is a
new `<layers.cluster>` component that yields a `<cluster.marker>` component.

Check the `BaseLayer`'s template on github for more information on what the `BaseLayer` does by default.
If you're extending from `BaseLayer` (or another layer that extends from it), there is a special property you can
use called `componentsToYield`. This should be an array of objects that describes which components you
want to yield. You should use it like:

```js
// addon/components/market-cluster-layer.js
componentsToYield = [
...this.componentsToYield,
{ name: 'marker-layer', as: 'marker' }
];
```

- `name` is the name of the component itself
- `as` is the key that you want to put it under in the yielded hash (the key will default to the `name` value if an empty `as` is provided)

`BaseLayer`'s template will make sure to yield these components correctly for you.

### Including the leaflet plugin

Expand Down

0 comments on commit efae96c

Please sign in to comment.