https://github.com/ember-polyfills/ember-named-blocks-polyfill

A polyfill for the Yieldable Named Blocks feature in Ember.
https://github.com/ember-polyfills/ember-named-blocks-polyfill

Last synced: 3 months ago
JSON representation

A polyfill for the Yieldable Named Blocks feature in Ember.

• Host: GitHub
• URL: https://github.com/ember-polyfills/ember-named-blocks-polyfill
• Owner: ember-polyfills
• License: mit
• Created: 2020-05-22T01:30:59.000Z (over 4 years ago)
• Default Branch: main
• Last Pushed: 2022-12-12T20:49:52.000Z (almost 2 years ago)
• Last Synced: 2024-08-02T17:59:20.207Z (3 months ago)
• Language: JavaScript
• Size: 1.65 MB
• Stars: 39
• Watchers: 4
• Forks: 8
• Open Issues: 27
• Metadata Files:
  • Readme: README.md
  • Contributing: CONTRIBUTING.md
  • License: LICENSE.md

Awesome Lists containing this project

• awesome-ember - ember-named-blocks-polyfill - This addon provides a polyfill for the Yieldable Named Blocks feature. (Packages / Polyfills)

README

        
ember-named-blocks-polyfill

==============================================================================

This addon provides a polyfill for the [Yieldable Named Blocks][RFC] feature.

On Ember.js versions with native support for the feature (3.25+), this addon is

inert.

Compatibility

------------------------------------------------------------------------------

* Ember.js v3.12.4 or above

* Ember CLI v2.13 or above

* Node.js v10 or above

Installation

------------------------------------------------------------------------------

```

ember install ember-named-blocks-polyfill

```

Usage

------------------------------------------------------------------------------

To pass named blocks to a component:

```hbs

  <:header>This list is fancy!

  <:row as |item|>

    {{#if item.isHotTip}}

      
Hot Tip™

      
{{item}}

    {{/if}}

  


```

To yield to named blocks:

```hbs

  {{yield to="header"}}



  {{#each @items as |item|}}

    
{{yield item to="row"}}

  {{/each}}



{{#if (has-block "footer")}}

  {{yield to="footer"}}

{{else}}

  Powered by <FancyList>

{{/if}}

```

See the [RFC][RFC] for more information on the named blocks feature.

Limitations

------------------------------------------------------------------------------

This addon aims to be a high fidelity polyfill both in syntax and semantics.

However, there are some minor limitations:

* It is not currently possible to pass an `<:else>` or `<:inverse>` named

  block. See [#1][issue-1].

* When passing only named blocks (without passing a `<:default>` block) to an

  addon component whose template was not preprocessed by this polyfill,

  `{{has-block}}` in that component's template will return `true`.

  This is unlikely to be an issue in practice – if you are running an Ember

  version that requires this polyfill and the addon itself is not also using

  the polyfill, it problably means that the addon component you are invoking

  does not accept named blocks anyway, so there is no use in passing them.

  See [#4][issue-4].

Contributing

------------------------------------------------------------------------------

See the [Contributing](CONTRIBUTING.md) guide for details.

License

------------------------------------------------------------------------------

This project is licensed under the [MIT License](LICENSE.md).

[RFC]: https://github.com/emberjs/rfcs/blob/master/text/0460-yieldable-named-blocks.md

[issue-1]: https://github.com/ember-polyfills/ember-named-blocks-polyfill/issues/1

[issue-4]: https://github.com/ember-polyfills/ember-named-blocks-polyfill/issues/4