diff --git a/active/0000-component-unification.md b/active/0000-component-unification.md new file mode 100644 index 0000000000..3d41114931 --- /dev/null +++ b/active/0000-component-unification.md @@ -0,0 +1,215 @@ +- Start Date: 2015-05-24 +- RFC PR: (leave this empty) +- Ember Issue: (leave this empty) + +# Summary + +This RFC proposes a unification of the way that components and their containing element are defined. It also unifies "element" components and "fragment" or "tagless" components. + +# Motivation + +The motivation of this RFC is to unify: + +* a component's template with its outer element +* element-style components with fragment-style components + +In particular, it is an attempt to eliminate the gap between templates and APIs like `attributeBindings`, `classNames`, `classNameBindings`, `tagName`, `elementId` and others on the component itself. It is also an attempt to allow fragment-style components ("tagless components") to specify one of its elements to use as the root element for event handling and attribute shadowing. + +In brief, an invocation of an angle bracket component would be replaced with the rendered contents of its layout in all cases: + +```hbs +{{!-- application.hbs --}} + +``` + +```hbs +{{!-- my-button.hbs --}} + +``` + +This invocation would result in (roughly): + +```hbs + +``` + +This also works if you have multiple top-level elements in your component layout: + +```hbs +{{!-- my-button.hbs --}} + +

+

{{attrs.content}}

+

+``` + +The same invocation as above would result in: + +```hbs +

+

hello

+

+``` + +At the basic level, this mental model makes it easy to use components for all kinds of different abstractions, including abstractions in special HTML contexts, like ``s, `