dist/ember.prod.js in ember-source-2.11.0.beta.4 vs dist/ember.prod.js in ember-source-2.11.0.beta.8
- old
+ new
@@ -1,14 +1,14 @@
;(function() {
/*!
* @overview Ember - JavaScript Application Framework
- * @copyright Copyright 2011-2016 Tilde Inc. and contributors
+ * @copyright Copyright 2011-2017 Tilde Inc. and contributors
* Portions Copyright 2006-2011 Strobe Inc.
* Portions Copyright 2008-2011 Apple Inc. All rights reserved.
* @license Licensed under MIT license
* See https://raw.github.com/emberjs/ember.js/master/LICENSE
- * @version 2.11.0-beta.4
+ * @version 2.11.0-beta.8
*/
var enifed, requireModule, Ember;
(function() {
@@ -6201,20 +6201,19 @@
surrounding context or outer controller; all
contextual information must be passed in.
The easiest way to create an `Ember.Component` is via
a template. If you name a template
- `components/my-foo`, you will be able to use
+ `app/components/my-foo.hbs`, you will be able to use
`{{my-foo}}` in other templates, which will make
an instance of the isolated component.
- ```handlebars
- {{app-profile person=currentUser}}
+ ```app/components/my-foo.hbs
+ {{person-profile person=currentUser}}
```
- ```handlebars
- <!-- app-profile template -->
+ ```app/components/person-profile.hbs
<h1>{{person.title}}</h1>
<img src={{person.avatar}}>
<p class='signature'>{{person.signature}}</p>
```
@@ -6222,64 +6221,469 @@
include the **contents** of any block attached to
the component. The block will be executed in the
context of the surrounding context or outer controller:
```handlebars
- {{#app-profile person=currentUser}}
+ {{#person-profile person=currentUser}}
<p>Admin mode</p>
{{! Executed in the controller's context. }}
- {{/app-profile}}
+ {{/person-profile}}
```
- ```handlebars
- <!-- app-profile template -->
+ ```app/components/person-profile.hbs
<h1>{{person.title}}</h1>
{{! Executed in the component's context. }}
{{yield}} {{! block contents }}
```
If you want to customize the component, in order to
handle events or actions, you implement a subclass
of `Ember.Component` named after the name of the
- component. Note that `Component` needs to be appended to the name of
- your subclass like `AppProfileComponent`.
+ component.
For example, you could implement the action
- `hello` for the `app-profile` component:
+ `hello` for the `person-profile` component:
- ```javascript
- App.AppProfileComponent = Ember.Component.extend({
+ ```app/components/person-profile.js
+ import Ember from 'ember';
+
+ export default Ember.Component.extend({
actions: {
- hello: function(name) {
+ hello(name) {
console.log("Hello", name);
}
}
});
```
And then use it in the component's template:
- ```handlebars
- <!-- app-profile template -->
+ ```app/templates/components/person-profile.hbs
<h1>{{person.title}}</h1>
{{yield}} <!-- block contents -->
<button {{action 'hello' person.name}}>
Say Hello to {{person.name}}
</button>
```
+
Components must have a `-` in their name to avoid
conflicts with built-in controls that wrap HTML
elements. This is consistent with the same
requirement in web components.
+
+ ## HTML Tag
+
+ The default HTML tag name used for a component's DOM representation is `div`.
+ This can be customized by setting the `tagName` property.
+ The following component class:
+
+ ```app/components/emphasized-paragraph.js
+ import Ember from 'ember';
+
+ export default Ember.Component.extend({
+ tagName: 'em'
+ });
+ ```
+
+ Would result in instances with the following HTML:
+
+ ```html
+ <em id="ember1" class="ember-view"></em>
+ ```
+
+
+ ## HTML `class` Attribute
+
+ The HTML `class` attribute of a component's tag can be set by providing a
+ `classNames` property that is set to an array of strings:
+
+ ```app/components/my-widget.js
+ import Ember from 'ember';
+
+ export default Ember.Component.extend({
+ classNames: ['my-class', 'my-other-class']
+ });
+ ```
+
+ Will result in component instances with an HTML representation of:
+
+ ```html
+ <div id="ember1" class="ember-view my-class my-other-class"></div>
+ ```
+
+ `class` attribute values can also be set by providing a `classNameBindings`
+ property set to an array of properties names for the component. The return value
+ of these properties will be added as part of the value for the components's `class`
+ attribute. These properties can be computed properties:
+
+ ```app/components/my-widget.js
+ import Ember from 'ember';
+
+ export default Ember.Component.extend({
+ classNameBindings: ['propertyA', 'propertyB'],
+ propertyA: 'from-a',
+ propertyB: Ember.computed(function() {
+ if (someLogic) { return 'from-b'; }
+ })
+ });
+ ```
+
+ Will result in component instances with an HTML representation of:
+
+ ```html
+ <div id="ember1" class="ember-view from-a from-b"></div>
+ ```
+
+ If the value of a class name binding returns a boolean the property name
+ itself will be used as the class name if the property is true.
+ The class name will not be added if the value is `false` or `undefined`.
+
+ ```app/components/my-widget.js
+ import Ember from 'ember';
+
+ export default Ember.Component.extend({
+ classNameBindings: ['hovered'],
+ hovered: true
+ });
+ ```
+
+ Will result in component instances with an HTML representation of:
+
+ ```html
+ <div id="ember1" class="ember-view hovered"></div>
+ ```
+
+ When using boolean class name bindings you can supply a string value other
+ than the property name for use as the `class` HTML attribute by appending the
+ preferred value after a ":" character when defining the binding:
+
+ ```app/components/my-widget.js
+ import Ember from 'ember';
+
+ export default Ember.Component.extend({
+ classNameBindings: ['awesome:so-very-cool'],
+ awesome: true
+ });
+ ```
+
+ Will result in component instances with an HTML representation of:
+
+ ```html
+ <div id="ember1" class="ember-view so-very-cool"></div>
+ ```
+
+ Boolean value class name bindings whose property names are in a
+ camelCase-style format will be converted to a dasherized format:
+
+ ```app/components/my-widget.js
+ import Ember from 'ember';
+
+ export default Ember.Component.extend({
+ classNameBindings: ['isUrgent'],
+ isUrgent: true
+ });
+ ```
+
+ Will result in component instances with an HTML representation of:
+
+ ```html
+ <div id="ember1" class="ember-view is-urgent"></div>
+ ```
+
+ Class name bindings can also refer to object values that are found by
+ traversing a path relative to the component itself:
+
+ ```app/components/my-widget.js
+ import Ember from 'ember';
+
+ export default Ember.Component.extend({
+ classNameBindings: ['messages.empty'],
+ messages: Ember.Object.create({
+ empty: true
+ })
+ });
+ ```
+
+ Will result in component instances with an HTML representation of:
+
+ ```html
+ <div id="ember1" class="ember-view empty"></div>
+ ```
+
+ If you want to add a class name for a property which evaluates to true and
+ and a different class name if it evaluates to false, you can pass a binding
+ like this:
+
+ ```app/components/my-widget.js
+ import Ember from 'ember';
+
+ export default Ember.Component.extend({
+ classNameBindings: ['isEnabled:enabled:disabled'],
+ isEnabled: true
+ });
+ ```
+
+ Will result in component instances with an HTML representation of:
+
+ ```html
+ <div id="ember1" class="ember-view enabled"></div>
+ ```
+
+ When isEnabled is `false`, the resulting HTML representation looks like
+ this:
+
+ ```html
+ <div id="ember1" class="ember-view disabled"></div>
+ ```
+
+ This syntax offers the convenience to add a class if a property is `false`:
+
+ ```app/components/my-widget.js
+ import Ember from 'ember';
+
+ // Applies no class when isEnabled is true and class 'disabled' when isEnabled is false
+ export default Ember.Component.extend({
+ classNameBindings: ['isEnabled::disabled'],
+ isEnabled: true
+ });
+ ```
+
+ Will result in component instances with an HTML representation of:
+
+ ```html
+ <div id="ember1" class="ember-view"></div>
+ ```
+
+ When the `isEnabled` property on the component is set to `false`, it will result
+ in component instances with an HTML representation of:
+
+ ```html
+ <div id="ember1" class="ember-view disabled"></div>
+ ```
+
+ Updates to the value of a class name binding will result in automatic
+ update of the HTML `class` attribute in the component's rendered HTML
+ representation. If the value becomes `false` or `undefined` the class name
+ will be removed.
+ Both `classNames` and `classNameBindings` are concatenated properties. See
+ [Ember.Object](/api/classes/Ember.Object.html) documentation for more
+ information about concatenated properties.
+
+
+ ## HTML Attributes
+
+ The HTML attribute section of a component's tag can be set by providing an
+ `attributeBindings` property set to an array of property names on the component.
+ The return value of these properties will be used as the value of the component's
+ HTML associated attribute:
+
+ ```app/components/my-anchor.js
+ import Ember from 'ember';
+
+ export default Ember.Component.extend({
+ tagName: 'a',
+ attributeBindings: ['href'],
+ href: 'http://google.com'
+ });
+ ```
+
+ Will result in component instances with an HTML representation of:
+
+ ```html
+ <a id="ember1" class="ember-view" href="http://google.com"></a>
+ ```
+
+ One property can be mapped on to another by placing a ":" between
+ the source property and the destination property:
+
+ ```app/components/my-anchor.js
+ import Ember from 'ember';
+
+ export default Ember.Component.extend({
+ tagName: 'a',
+ attributeBindings: ['url:href'],
+ url: 'http://google.com'
+ });
+ ```
+
+ Will result in component instances with an HTML representation of:
+
+ ```html
+ <a id="ember1" class="ember-view" href="http://google.com"></a>
+ ```
+
+ Namespaced attributes (e.g. `xlink:href`) are supported, but have to be
+ mapped, since `:` is not a valid character for properties in Javascript:
+
+ ```app/components/my-use.js
+ import Ember from 'ember';
+
+ export default Ember.Component.extend({
+ tagName: 'use',
+ attributeBindings: ['xlinkHref:xlink:href'],
+ xlinkHref: '#triangle'
+ });
+ ```
+
+ Will result in component instances with an HTML representation of:
+
+ ```html
+ <use xlink:href="#triangle"></use>
+ ```
+
+ If the return value of an `attributeBindings` monitored property is a boolean
+ the attribute will be present or absent depending on the value:
+
+ ```app/components/my-text-input.js
+ import Ember from 'ember';
+
+ export default Ember.Component.extend({
+ tagName: 'input',
+ attributeBindings: ['disabled'],
+ disabled: false
+ });
+ ```
+
+ Will result in a component instance with an HTML representation of:
+
+ ```html
+ <input id="ember1" class="ember-view" />
+ ```
+
+ `attributeBindings` can refer to computed properties:
+
+ ```app/components/my-text-input.js
+ import Ember from 'ember';
+
+ export default Ember.Component.extend({
+ tagName: 'input',
+ attributeBindings: ['disabled'],
+ disabled: Ember.computed(function() {
+ if (someLogic) {
+ return true;
+ } else {
+ return false;
+ }
+ })
+ });
+ ```
+
+ To prevent setting an attribute altogether, use `null` or `undefined` as the
+ return value of the `attributeBindings` monitored property:
+
+ ```app/components/my-text-input.js
+ import Ember from 'ember';
+
+ export default Ember.Component.extend({
+ tagName: 'form',
+ attributeBindings: ['novalidate'],
+ novalidate: null
+ });
+ ```
+
+ Updates to the property of an attribute binding will result in automatic
+ update of the HTML attribute in the component's rendered HTML representation.
+ `attributeBindings` is a concatenated property. See [Ember.Object](/api/classes/Ember.Object.html)
+ documentation for more information about concatenated properties.
+
+
+ ## Layouts
+
+ See [Ember.Templates.helpers.yield](/api/classes/Ember.Templates.helpers.html#method_yield)
+ for more information.
+
+
+ ## Responding to Browser Events
+
+ Components can respond to user-initiated events in one of three ways: method
+ implementation, through an event manager, and through `{{action}}` helper use
+ in their template or layout.
+
+
+ ### Method Implementation
+
+ Components can respond to user-initiated events by implementing a method that
+ matches the event name. A `jQuery.Event` object will be passed as the
+ argument to this method.
+
+ ```app/components/my-widget.js
+ import Ember from 'ember';
+
+ export default Ember.Component.extend({
+ click(event) {
+ // will be called when an instance's
+ // rendered element is clicked
+ }
+ });
+ ```
+
+
+ ### `{{action}}` Helper
+
+ See [Ember.Templates.helpers.action](/api/classes/Ember.Templates.helpers.html#method_action).
+
+
+ ### Event Names
+
+ All of the event handling approaches described above respond to the same set
+ of events. The names of the built-in events are listed below. (The hash of
+ built-in events exists in `Ember.EventDispatcher`.) Additional, custom events
+ can be registered by using `Ember.Application.customEvents`.
+
+ Touch events:
+
+ * `touchStart`
+ * `touchMove`
+ * `touchEnd`
+ * `touchCancel`
+
+ Keyboard events:
+
+ * `keyDown`
+ * `keyUp`
+ * `keyPress`
+
+ Mouse events:
+
+ * `mouseDown`
+ * `mouseUp`
+ * `contextMenu`
+ * `click`
+ * `doubleClick`
+ * `mouseMove`
+ * `focusIn`
+ * `focusOut`
+ * `mouseEnter`
+ * `mouseLeave`
+
+ Form events:
+
+ * `submit`
+ * `change`
+ * `focusIn`
+ * `focusOut`
+ * `input`
+
+ HTML5 drag and drop events:
+
+ * `dragStart`
+ * `drag`
+ * `dragEnter`
+ * `dragLeave`
+ * `dragOver`
+ * `dragEnd`
+ * `drop`
+
@class Component
@namespace Ember
@extends Ember.CoreView
@uses Ember.TargetActionSupport
@uses Ember.ClassNamesSupport
@uses Ember.ActionSupport
@uses Ember.ViewMixin
+ @uses Ember.ViewStateSupport
@public
*/
var Component = _emberViews.CoreView.extend(_emberViews.ChildViewsSupport, _emberViews.ViewStateSupport, _emberViews.ClassNamesSupport, _emberRuntime.TargetActionSupport, _emberViews.ActionSupport, _emberViews.ViewMixin, (_CoreView$extend = {
isComponent: true,
@@ -6297,13 +6701,13 @@
this.layout = this.defaultLayout;
}
// If in a tagless component, assert that no event handlers are defined
+ // indicate that the assertion should be triggered
},
- // indicate that the assertion should be triggered
rerender: function () {
this[DIRTY_TAG].dirty();
this._super();
},
@@ -6349,37 +6753,37 @@
Enables components to take a list of parameters as arguments.
For example, a component that takes two parameters with the names
`name` and `age`:
```javascript
let MyComponent = Ember.Component.extend;
- MyComponent.reopenClass({
- positionalParams: ['name', 'age']
+ MyComponent.reopenClass({
+ positionalParams: ['name', 'age']
});
```
It can then be invoked like this:
```hbs
{{my-component "John" 38}}
```
The parameters can be referred to just like named parameters:
```hbs
- Name: {{attrs.name}}, Age: {{attrs.age}}.
+ Name: {{name}}, Age: {{age}}.
```
Using a string instead of an array allows for an arbitrary number of
parameters:
```javascript
let MyComponent = Ember.Component.extend;
- MyComponent.reopenClass({
- positionalParams: 'names'
+ MyComponent.reopenClass({
+ positionalParams: 'names'
});
```
It can then be invoked like this:
```hbs
{{my-component "John" "Michael" "Scott"}}
```
The parameters can then be referred to by enumerating over the list:
```hbs
- {{#each attrs.names as |name|}}{{name}}{{/each}}
+ {{#each names as |name|}}{{name}}{{/each}}
```
@static
@public
@property positionalParams
@since 1.13.0
@@ -6484,10 +6888,71 @@
@public
@since 1.13.0
*/
/**
+ A component may contain a layout. A layout is a regular template but
+ supersedes the `template` property during rendering. It is the
+ responsibility of the layout template to retrieve the `template`
+ property from the component (or alternatively, call `Handlebars.helpers.yield`,
+ `{{yield}}`) to render it in the correct location.
+ This is useful for a component that has a shared wrapper, but which delegates
+ the rendering of the contents of the wrapper to the `template` property
+ on a subclass.
+ @property layout
+ @type Function
+ @public
+ */
+
+ /**
+ The name of the layout to lookup if no layout is provided.
+ By default `Ember.Component` will lookup a template with this name in
+ `Ember.TEMPLATES` (a shared global object).
+ @property layoutName
+ @type String
+ @default null
+ @private
+ */
+
+ /**
+ Returns a jQuery object for this component's element. If you pass in a selector
+ string, this method will return a jQuery object, using the current element
+ as its buffer.
+ For example, calling `component.$('li')` will return a jQuery object containing
+ all of the `li` elements inside the DOM element of this component.
+ @method $
+ @param {String} [selector] a jQuery-compatible selector string
+ @return {jQuery} the jQuery object for the DOM node
+ @public
+ */
+
+ /**
+ The HTML `id` of the component's element in the DOM. You can provide this
+ value yourself but it must be unique (just as in HTML):
+ ```handlebars
+ {{my-component elementId="a-really-cool-id"}}
+ ```
+ If not manually set a default value will be provided by the framework.
+ Once rendered an element's `elementId` is considered immutable and you
+ should never change it. If you need to compute a dynamic value for the
+ `elementId`, you should do this when the component or element is being
+ instantiated:
+ ```javascript
+ export default Ember.Component.extend({
+ init() {
+ this._super(...arguments);
+ var index = this.get('index');
+ this.set('elementId', `component-id${index}`);
+ }
+ });
+ ```
+ @property elementId
+ @type String
+ @public
+ */
+
+ /**
If `false`, the view will appear hidden in DOM.
@property isVisible
@type Boolean
@default null
@public
@@ -6906,11 +7371,11 @@
@class LinkComponent
@namespace Ember
@extends Ember.Component
@see {Ember.Templates.helpers.link-to}
- @private
+ @public
**/
var LinkComponent = _emberGlimmerComponent.default.extend({
layout: _emberGlimmerTemplatesLinkTo.default,
tagName: 'a',
@@ -7750,11 +8215,11 @@
exports.DOMChanges = _glimmerRuntime.DOMChanges;
exports.DOMTreeConstruction = _glimmerRuntime.DOMTreeConstruction;
exports.NodeDOMTreeConstruction = _glimmerNode.NodeDOMTreeConstruction;
});
-enifed('ember-glimmer/environment', ['exports', 'ember-utils', 'ember-metal', 'ember-views', 'glimmer-runtime', 'ember-glimmer/syntax/curly-component', 'ember-glimmer/syntax', 'ember-glimmer/syntax/dynamic-component', 'ember-glimmer/utils/iterable', 'ember-glimmer/utils/references', 'ember-glimmer/helpers/if-unless', 'ember-glimmer/utils/bindings', 'ember-glimmer/helpers/action', 'ember-glimmer/helpers/component', 'ember-glimmer/helpers/concat', 'ember-glimmer/helpers/debugger', 'ember-glimmer/helpers/get', 'ember-glimmer/helpers/hash', 'ember-glimmer/helpers/loc', 'ember-glimmer/helpers/log', 'ember-glimmer/helpers/mut', 'ember-glimmer/helpers/readonly', 'ember-glimmer/helpers/unbound', 'ember-glimmer/helpers/-class', 'ember-glimmer/helpers/-input-type', 'ember-glimmer/helpers/query-param', 'ember-glimmer/helpers/each-in', 'ember-glimmer/helpers/-normalize-class', 'ember-glimmer/helpers/-html-safe', 'ember-glimmer/protocol-for-url', 'ember-glimmer/modifiers/action'], function (exports, _emberUtils, _emberMetal, _emberViews, _glimmerRuntime, _emberGlimmerSyntaxCurlyComponent, _emberGlimmerSyntax, _emberGlimmerSyntaxDynamicComponent, _emberGlimmerUtilsIterable, _emberGlimmerUtilsReferences, _emberGlimmerHelpersIfUnless, _emberGlimmerUtilsBindings, _emberGlimmerHelpersAction, _emberGlimmerHelpersComponent, _emberGlimmerHelpersConcat, _emberGlimmerHelpersDebugger, _emberGlimmerHelpersGet, _emberGlimmerHelpersHash, _emberGlimmerHelpersLoc, _emberGlimmerHelpersLog, _emberGlimmerHelpersMut, _emberGlimmerHelpersReadonly, _emberGlimmerHelpersUnbound, _emberGlimmerHelpersClass, _emberGlimmerHelpersInputType, _emberGlimmerHelpersQueryParam, _emberGlimmerHelpersEachIn, _emberGlimmerHelpersNormalizeClass, _emberGlimmerHelpersHtmlSafe, _emberGlimmerProtocolForUrl, _emberGlimmerModifiersAction) {
+enifed('ember-glimmer/environment', ['exports', 'ember-utils', 'ember-metal', 'ember-views', 'glimmer-runtime', 'ember-glimmer/syntax/curly-component', 'ember-glimmer/syntax', 'ember-glimmer/syntax/dynamic-component', 'ember-glimmer/utils/iterable', 'ember-glimmer/utils/references', 'ember-glimmer/utils/debug-stack', 'ember-glimmer/helpers/if-unless', 'ember-glimmer/utils/bindings', 'ember-glimmer/helpers/action', 'ember-glimmer/helpers/component', 'ember-glimmer/helpers/concat', 'ember-glimmer/helpers/debugger', 'ember-glimmer/helpers/get', 'ember-glimmer/helpers/hash', 'ember-glimmer/helpers/loc', 'ember-glimmer/helpers/log', 'ember-glimmer/helpers/mut', 'ember-glimmer/helpers/readonly', 'ember-glimmer/helpers/unbound', 'ember-glimmer/helpers/-class', 'ember-glimmer/helpers/-input-type', 'ember-glimmer/helpers/query-param', 'ember-glimmer/helpers/each-in', 'ember-glimmer/helpers/-normalize-class', 'ember-glimmer/helpers/-html-safe', 'ember-glimmer/protocol-for-url', 'ember-glimmer/modifiers/action'], function (exports, _emberUtils, _emberMetal, _emberViews, _glimmerRuntime, _emberGlimmerSyntaxCurlyComponent, _emberGlimmerSyntax, _emberGlimmerSyntaxDynamicComponent, _emberGlimmerUtilsIterable, _emberGlimmerUtilsReferences, _emberGlimmerUtilsDebugStack, _emberGlimmerHelpersIfUnless, _emberGlimmerUtilsBindings, _emberGlimmerHelpersAction, _emberGlimmerHelpersComponent, _emberGlimmerHelpersConcat, _emberGlimmerHelpersDebugger, _emberGlimmerHelpersGet, _emberGlimmerHelpersHash, _emberGlimmerHelpersLoc, _emberGlimmerHelpersLog, _emberGlimmerHelpersMut, _emberGlimmerHelpersReadonly, _emberGlimmerHelpersUnbound, _emberGlimmerHelpersClass, _emberGlimmerHelpersInputType, _emberGlimmerHelpersQueryParam, _emberGlimmerHelpersEachIn, _emberGlimmerHelpersNormalizeClass, _emberGlimmerHelpersHtmlSafe, _emberGlimmerProtocolForUrl, _emberGlimmerModifiersAction) {
'use strict';
var builtInComponents = {
textarea: '-text-area'
};
@@ -11093,13 +11558,20 @@
};
return _class2;
})());
});
-enifed('ember-glimmer/syntax/curly-component', ['exports', 'ember-utils', 'glimmer-runtime', 'ember-glimmer/utils/bindings', 'ember-glimmer/component', 'ember-metal', 'ember-views', 'ember-glimmer/utils/process-args', 'container'], function (exports, _emberUtils, _glimmerRuntime, _emberGlimmerUtilsBindings, _emberGlimmerComponent, _emberMetal, _emberViews, _emberGlimmerUtilsProcessArgs, _container) {
+enifed('ember-glimmer/syntax/abstract-manager', ['exports', 'ember-metal'], function (exports, _emberMetal) {
'use strict';
+ var AbstractManager = function AbstractManager() {};
+
+ exports.default = AbstractManager;
+});
+enifed('ember-glimmer/syntax/curly-component', ['exports', 'ember-utils', 'glimmer-runtime', 'ember-glimmer/utils/bindings', 'ember-glimmer/component', 'ember-metal', 'ember-views', 'ember-glimmer/utils/process-args', 'container', 'ember-glimmer/syntax/abstract-manager'], function (exports, _emberUtils, _glimmerRuntime, _emberGlimmerUtilsBindings, _emberGlimmerComponent, _emberMetal, _emberViews, _emberGlimmerUtilsProcessArgs, _container, _emberGlimmerSyntaxAbstractManager) {
+ 'use strict';
+
exports.validatePositionalParameters = validatePositionalParameters;
var _templateObject = babelHelpers.taggedTemplateLiteralLoose(['template:components/-default'], ['template:components/-default']);
var DEFAULT_LAYOUT = _container.privatize(_templateObject);
@@ -11203,20 +11675,25 @@
function rerenderInstrumentDetails(component) {
return component.instrumentDetails({ initialRender: false });
}
- var CurlyComponentManager = (function () {
- function CurlyComponentManager() {}
+ var CurlyComponentManager = (function (_AbstractManager) {
+babelHelpers.inherits(CurlyComponentManager, _AbstractManager);
+ function CurlyComponentManager() {
+ _AbstractManager.apply(this, arguments);
+ }
+
CurlyComponentManager.prototype.prepareArgs = function prepareArgs(definition, args) {
validatePositionalParameters(args.named, args.positional.values, definition.ComponentClass.positionalParams);
return _emberGlimmerUtilsProcessArgs.gatherArgs(args, definition);
};
CurlyComponentManager.prototype.create = function create(environment, definition, args, dynamicScope, callerSelfRef, hasBlock) {
+
var parentView = dynamicScope.view;
var klass = definition.ComponentClass;
var processedArgs = _emberGlimmerUtilsProcessArgs.ComponentArgs.create(args);
@@ -11414,11 +11891,11 @@
CurlyComponentManager.prototype.getDestructor = function getDestructor(stateBucket) {
return stateBucket;
};
return CurlyComponentManager;
- })();
+ })(_emberGlimmerSyntaxAbstractManager.default);
var MANAGER = new CurlyComponentManager();
var TopComponentManager = (function (_CurlyComponentManager) {
babelHelpers.inherits(TopComponentManager, _CurlyComponentManager);
@@ -11773,11 +12250,11 @@
return _emberGlimmerSyntaxDynamicComponent.DynamicComponentSyntax.create(environment, args, symbolTable);
}
};
exports.InputSyntax = InputSyntax;
});
-enifed('ember-glimmer/syntax/mount', ['exports', 'glimmer-runtime', 'glimmer-reference', 'ember-metal', 'ember-glimmer/utils/references', 'ember-routing', 'ember-glimmer/syntax/outlet'], function (exports, _glimmerRuntime, _glimmerReference, _emberMetal, _emberGlimmerUtilsReferences, _emberRouting, _emberGlimmerSyntaxOutlet) {
+enifed('ember-glimmer/syntax/mount', ['exports', 'glimmer-runtime', 'glimmer-reference', 'ember-metal', 'ember-glimmer/utils/references', 'ember-routing', 'ember-glimmer/syntax/outlet', 'ember-glimmer/syntax/abstract-manager'], function (exports, _glimmerRuntime, _glimmerReference, _emberMetal, _emberGlimmerUtilsReferences, _emberRouting, _emberGlimmerSyntaxOutlet, _emberGlimmerSyntaxAbstractManager) {
/**
@module ember
@submodule ember-glimmer
*/
'use strict';
@@ -11828,13 +12305,17 @@
return MountSyntax;
})(_glimmerRuntime.StatementSyntax);
exports.MountSyntax = MountSyntax;
- var MountManager = (function () {
- function MountManager() {}
+ var MountManager = (function (_AbstractManager) {
+ babelHelpers.inherits(MountManager, _AbstractManager);
+ function MountManager() {
+ _AbstractManager.apply(this, arguments);
+ }
+
MountManager.prototype.prepareArgs = function prepareArgs(definition, args) {
return args;
};
MountManager.prototype.create = function create(environment, _ref, args, dynamicScope) {
@@ -11885,11 +12366,11 @@
MountManager.prototype.didUpdateLayout = function didUpdateLayout() {};
MountManager.prototype.didUpdate = function didUpdate(state) {};
return MountManager;
- })();
+ })(_emberGlimmerSyntaxAbstractManager.default);
var MOUNT_MANAGER = new MountManager();
var MountDefinition = (function (_ComponentDefinition) {
babelHelpers.inherits(MountDefinition, _ComponentDefinition);
@@ -11900,11 +12381,11 @@
}
return MountDefinition;
})(_glimmerRuntime.ComponentDefinition);
});
-enifed('ember-glimmer/syntax/outlet', ['exports', 'ember-utils', 'glimmer-runtime', 'ember-metal', 'ember-glimmer/utils/references', 'glimmer-reference'], function (exports, _emberUtils, _glimmerRuntime, _emberMetal, _emberGlimmerUtilsReferences, _glimmerReference) {
+enifed('ember-glimmer/syntax/outlet', ['exports', 'ember-utils', 'glimmer-runtime', 'ember-metal', 'ember-glimmer/utils/references', 'glimmer-reference', 'ember-glimmer/syntax/abstract-manager'], function (exports, _emberUtils, _glimmerRuntime, _emberMetal, _emberGlimmerUtilsReferences, _glimmerReference, _emberGlimmerSyntaxAbstractManager) {
/**
@module ember
@submodule ember-glimmer
*/
'use strict';
@@ -12083,18 +12564,23 @@
};
return StateBucket;
})();
- var OutletComponentManager = (function () {
- function OutletComponentManager() {}
+ var OutletComponentManager = (function (_AbstractManager) {
+ babelHelpers.inherits(OutletComponentManager, _AbstractManager);
+ function OutletComponentManager() {
+ _AbstractManager.apply(this, arguments);
+ }
+
OutletComponentManager.prototype.prepareArgs = function prepareArgs(definition, args) {
return args;
};
OutletComponentManager.prototype.create = function create(environment, definition, args, dynamicScope) {
+
var outletStateReference = dynamicScope.outletState = dynamicScope.outletState.get('outlets').get(definition.outletName);
var outletState = outletStateReference.value();
return new StateBucket(outletState);
};
@@ -12129,11 +12615,11 @@
OutletComponentManager.prototype.didUpdateLayout = function didUpdateLayout(bucket) {};
OutletComponentManager.prototype.didUpdate = function didUpdate(state) {};
return OutletComponentManager;
- })();
+ })(_emberGlimmerSyntaxAbstractManager.default);
var MANAGER = new OutletComponentManager();
var TopLevelOutletComponentManager = (function (_OutletComponentManager) {
babelHelpers.inherits(TopLevelOutletComponentManager, _OutletComponentManager);
@@ -12141,10 +12627,11 @@
function TopLevelOutletComponentManager() {
_OutletComponentManager.apply(this, arguments);
}
TopLevelOutletComponentManager.prototype.create = function create(environment, definition, args, dynamicScope) {
+
return new StateBucket(dynamicScope.outletState.value());
};
TopLevelOutletComponentManager.prototype.layoutFor = function layoutFor(definition, bucket, env) {
return env.getCompiledBlock(TopLevelOutletLayoutCompiler, definition.template);
@@ -12213,11 +12700,11 @@
exports.OutletLayoutCompiler = OutletLayoutCompiler;
OutletLayoutCompiler.id = 'outlet';
});
-enifed('ember-glimmer/syntax/render', ['exports', 'glimmer-runtime', 'glimmer-reference', 'ember-metal', 'ember-glimmer/utils/references', 'ember-routing', 'ember-glimmer/syntax/outlet'], function (exports, _glimmerRuntime, _glimmerReference, _emberMetal, _emberGlimmerUtilsReferences, _emberRouting, _emberGlimmerSyntaxOutlet) {
+enifed('ember-glimmer/syntax/render', ['exports', 'glimmer-runtime', 'glimmer-reference', 'ember-metal', 'ember-glimmer/utils/references', 'ember-routing', 'ember-glimmer/syntax/outlet', 'ember-glimmer/syntax/abstract-manager'], function (exports, _glimmerRuntime, _glimmerReference, _emberMetal, _emberGlimmerUtilsReferences, _emberRouting, _emberGlimmerSyntaxOutlet, _emberGlimmerSyntaxAbstractManager) {
/**
@module ember
@submodule ember-glimmer
*/
'use strict';
@@ -12341,13 +12828,17 @@
return RenderSyntax;
})(_glimmerRuntime.StatementSyntax);
exports.RenderSyntax = RenderSyntax;
- var AbstractRenderManager = (function () {
- function AbstractRenderManager() {}
+ var AbstractRenderManager = (function (_AbstractManager) {
+ babelHelpers.inherits(AbstractRenderManager, _AbstractManager);
+ function AbstractRenderManager() {
+ _AbstractManager.apply(this, arguments);
+ }
+
AbstractRenderManager.prototype.prepareArgs = function prepareArgs(definition, args) {
return args;
};
/* abstract create(environment, definition, args, dynamicScope); */
@@ -12381,11 +12872,11 @@
AbstractRenderManager.prototype.didUpdateLayout = function didUpdateLayout() {};
AbstractRenderManager.prototype.didUpdate = function didUpdate() {};
return AbstractRenderManager;
- })();
+ })(_emberGlimmerSyntaxAbstractManager.default);
var SingletonRenderManager = (function (_AbstractRenderManager) {
babelHelpers.inherits(SingletonRenderManager, _AbstractRenderManager);
function SingletonRenderManager() {
@@ -12750,10 +13241,17 @@
};
return ColonClassNameBindingReference;
})(_glimmerReference.CachedReference);
});
+enifed('ember-glimmer/utils/debug-stack', ['exports', 'ember-metal'], function (exports, _emberMetal) {
+ 'use strict';
+
+ var DebugStack = undefined;
+
+ exports.default = DebugStack;
+});
enifed('ember-glimmer/utils/iterable', ['exports', 'ember-utils', 'ember-metal', 'ember-runtime', 'ember-glimmer/utils/references', 'ember-glimmer/helpers/each-in', 'glimmer-reference'], function (exports, _emberUtils, _emberMetal, _emberRuntime, _emberGlimmerUtilsReferences, _emberGlimmerHelpersEachIn, _glimmerReference) {
'use strict';
exports.default = iterableFor;
@@ -14613,11 +15111,11 @@
};
return DefaultStore;
})();
});
-enifed('ember-metal/chains', ['exports', 'ember-utils', 'ember-metal/property_get', 'ember-metal/meta', 'ember-metal/watch_key', 'ember-metal/watch_path'], function (exports, _emberUtils, _emberMetalProperty_get, _emberMetalMeta, _emberMetalWatch_key, _emberMetalWatch_path) {
+enifed('ember-metal/chains', ['exports', 'ember-utils', 'ember-metal/property_get', 'ember-metal/meta', 'ember-metal/watch_key', 'ember-metal/computed', 'ember-metal/watch_path'], function (exports, _emberUtils, _emberMetalProperty_get, _emberMetalMeta, _emberMetalWatch_key, _emberMetalComputed, _emberMetalWatch_path) {
'use strict';
exports.finishChains = finishChains;
var FIRST_KEY = /^([^\.]+)/;
@@ -14798,12 +15296,12 @@
if (isVolatile(obj[key])) {
return _emberMetalProperty_get.get(obj, key);
// Otherwise attempt to get the cached value of the computed property
} else {
var cache = meta.readableCache();
- if (cache && key in cache) {
- return cache[key];
+ if (cache) {
+ return _emberMetalComputed.cacheFor.get(cache, key);
}
}
}
ChainNode.prototype = {
@@ -17627,11 +18125,11 @@
}
return original;
}
});
-enifed('ember-metal/meta', ['exports', 'ember-utils', 'ember-metal/features', 'ember-metal/meta_listeners', 'ember-metal/debug', 'ember-metal/chains'], function (exports, _emberUtils, _emberMetalFeatures, _emberMetalMeta_listeners, _emberMetalDebug, _emberMetalChains) {
+enifed('ember-metal/meta', ['exports', 'ember-utils', 'ember-metal/features', 'ember-metal/meta_listeners', 'ember-metal/debug', 'ember-metal/chains', 'require'], function (exports, _emberUtils, _emberMetalFeatures, _emberMetalMeta_listeners, _emberMetalDebug, _emberMetalChains, _require) {
'no use strict';
// Remove "use strict"; from transpiled module until
// https://bugs.webkit.org/show_bug.cgi?id=138038 is fixed
exports.Meta = Meta;
@@ -17692,11 +18190,15 @@
var META_DESTROYED = 1 << 3;
var IS_PROXY = 1 << 4;
if (false || false) {
members.lastRendered = ownMap;
- members.lastRenderedFrom = ownMap; // FIXME: not used in production, remove me from prod builds
+ if (_require.has('ember-debug')) {
+ //https://github.com/emberjs/ember.js/issues/14732
+ members.lastRenderedReferenceMap = ownMap;
+ members.lastRenderedTemplateMap = ownMap;
+ }
}
var memberNames = Object.keys(members);
var META_FIELD = '__ember_meta__';
@@ -17731,11 +18233,10 @@
// inherited, and we can optimize it much better than JS runtimes.
this.parent = parentMeta;
if (false || false) {
this._lastRendered = undefined;
- this._lastRenderedFrom = undefined; // FIXME: not used in production, remove me from prod builds
}
this._initializeListeners();
}
@@ -18093,28 +18594,15 @@
obj[key] = value;
}
};
}
- var HAS_NATIVE_WEAKMAP = (function () {
- // detect if `WeakMap` is even present
- var hasWeakMap = typeof WeakMap === 'function';
- if (!hasWeakMap) {
- return false;
- }
-
- var instance = new WeakMap();
- // use `Object`'s `.toString` directly to prevent us from detecting
- // polyfills as native weakmaps
- return Object.prototype.toString.call(instance) === '[object WeakMap]';
- })();
-
var setMeta = undefined,
peekMeta = undefined;
// choose the one appropriate for given platform
- if (HAS_NATIVE_WEAKMAP) {
+ if (_emberUtils.HAS_NATIVE_WEAKMAP) {
(function () {
var getPrototypeOf = Object.getPrototypeOf;
var metaStore = new WeakMap();
exports.setMeta = setMeta = function WeakMap_setMeta(obj, meta) {
@@ -21189,14 +21677,16 @@
if (false || false) {
(function () {
var counter = 0;
var inTransaction = false;
var shouldReflush = undefined;
+ var debugStack = undefined;
exports.default = runInTransaction = function (context, methodName) {
shouldReflush = false;
inTransaction = true;
+
context[methodName]();
inTransaction = false;
counter++;
return shouldReflush;
};
@@ -21214,28 +21704,31 @@
var meta = _meta || _emberMetalMeta.meta(object);
var lastRendered = meta.readableLastRendered();
if (lastRendered && lastRendered[key] === counter) {
raise((function () {
- var ref = meta.readableLastRenderedFrom();
- var parts = [];
- var lastRef = ref[key];
+ var templateMap = meta.readableLastRenderedTemplateMap();
+ var lastRenderedIn = templateMap[key];
+ var currentlyIn = debugStack.peek();
+ var referenceMap = meta.readableLastRenderedReferenceMap();
+ var lastRef = referenceMap[key];
+ var parts = [];
var label = undefined;
if (lastRef) {
while (lastRef && lastRef._propertyKey) {
parts.unshift(lastRef._propertyKey);
lastRef = lastRef._parentReference;
}
- label = parts.join();
+ label = parts.join('.');
} else {
label = 'the same value';
}
- return 'You modified ' + label + ' twice on ' + object + ' in a single render. This was unreliable and slow in Ember 1.x and ' + implication;
+ return 'You modified "' + label + '" twice on ' + object + ' in a single render. It was rendered in ' + lastRenderedIn + ' and modified in ' + currentlyIn + '. This was unreliable and slow in Ember 1.x and ' + implication;
})(), false);
shouldReflush = true;
}
};
@@ -32208,13 +32701,13 @@
/**
Remove all elements from the array. This is useful if you
want to reuse an existing array without having to recreate it.
```javascript
let colors = ['red', 'green', 'blue'];
- color.length(); // 3
- colors.clear(); // []
- colors.length(); // 0
+ colors.length; // 3
+ colors.clear(); // []
+ colors.length; // 0
```
@method clear
@return {Ember.Array} An empty Array.
@public
*/
@@ -33387,11 +33880,11 @@
Allow registering options for all factories of a type.
```javascript
let App = Ember.Application.create();
let appInstance = App.buildInstance();
// if all of type `connection` must not be singletons
- appInstance.optionsForType('connection', { singleton: false });
+ appInstance.registerOptionsForType('connection', { singleton: false });
appInstance.register('connection:twitter', TwitterConnection);
appInstance.register('connection:facebook', FacebookConnection);
let twitter = appInstance.lookup('connection:twitter');
let twitter2 = appInstance.lookup('connection:twitter');
twitter === twitter2; // => false
@@ -36362,11 +36855,11 @@
}
return ret;
}
}
});
-enifed('ember-utils/index', ['exports', 'ember-utils/symbol', 'ember-utils/owner', 'ember-utils/assign', 'ember-utils/empty-object', 'ember-utils/dictionary', 'ember-utils/guid', 'ember-utils/intern', 'ember-utils/super', 'ember-utils/inspect', 'ember-utils/lookup-descriptor', 'ember-utils/invoke', 'ember-utils/make-array', 'ember-utils/apply-str', 'ember-utils/name', 'ember-utils/to-string'], function (exports, _emberUtilsSymbol, _emberUtilsOwner, _emberUtilsAssign, _emberUtilsEmptyObject, _emberUtilsDictionary, _emberUtilsGuid, _emberUtilsIntern, _emberUtilsSuper, _emberUtilsInspect, _emberUtilsLookupDescriptor, _emberUtilsInvoke, _emberUtilsMakeArray, _emberUtilsApplyStr, _emberUtilsName, _emberUtilsToString) {
+enifed('ember-utils/index', ['exports', 'ember-utils/symbol', 'ember-utils/owner', 'ember-utils/assign', 'ember-utils/empty-object', 'ember-utils/dictionary', 'ember-utils/guid', 'ember-utils/intern', 'ember-utils/super', 'ember-utils/inspect', 'ember-utils/lookup-descriptor', 'ember-utils/invoke', 'ember-utils/make-array', 'ember-utils/apply-str', 'ember-utils/name', 'ember-utils/to-string', 'ember-utils/weak-map-utils'], function (exports, _emberUtilsSymbol, _emberUtilsOwner, _emberUtilsAssign, _emberUtilsEmptyObject, _emberUtilsDictionary, _emberUtilsGuid, _emberUtilsIntern, _emberUtilsSuper, _emberUtilsInspect, _emberUtilsLookupDescriptor, _emberUtilsInvoke, _emberUtilsMakeArray, _emberUtilsApplyStr, _emberUtilsName, _emberUtilsToString, _emberUtilsWeakMapUtils) {
/*
This package will be eagerly parsed and should have no dependencies on external
packages.
It is intended to be used to share utility methods that will be needed
@@ -36400,10 +36893,11 @@
exports.tryInvoke = _emberUtilsInvoke.tryInvoke;
exports.makeArray = _emberUtilsMakeArray.default;
exports.applyStr = _emberUtilsApplyStr.default;
exports.NAME_KEY = _emberUtilsName.default;
exports.toString = _emberUtilsToString.default;
+ exports.HAS_NATIVE_WEAKMAP = _emberUtilsWeakMapUtils.HAS_NATIVE_WEAKMAP;
});
enifed('ember-utils/inspect', ['exports'], function (exports) {
'use strict';
exports.default = inspect;
@@ -36700,12 +37194,12 @@
`setOwner` forces a new owner on a given object instance. This is primarily
useful in some testing cases.
@method setOwner
@for Ember
- @param {Object} object An object with an owner.
- @return {Object} An owner object.
+ @param {Object} object An object instance.
+ @param {Object} object The new owner object of the object instance.
@since 2.3.0
@public
*/
function setOwner(object, owner) {
@@ -36817,10 +37311,27 @@
} else {
return objectToString.call(obj);
}
}
});
+enifed('ember-utils/weak-map-utils', ['exports'], function (exports) {
+ 'use strict';
+
+ var HAS_NATIVE_WEAKMAP = (function () {
+ // detect if `WeakMap` is even present
+ var hasWeakMap = typeof WeakMap === 'function';
+ if (!hasWeakMap) {
+ return false;
+ }
+
+ var instance = new WeakMap();
+ // use `Object`'s `.toString` directly to prevent us from detecting
+ // polyfills as native weakmaps
+ return Object.prototype.toString.call(instance) === '[object WeakMap]';
+ })();
+ exports.HAS_NATIVE_WEAKMAP = HAS_NATIVE_WEAKMAP;
+});
enifed('ember-views/compat/attrs', ['exports', 'ember-utils'], function (exports, _emberUtils) {
'use strict';
var MUTABLE_CELL = _emberUtils.symbol('MUTABLE_CELL');
exports.MUTABLE_CELL = MUTABLE_CELL;
@@ -38720,485 +39231,10 @@
@module ember
@submodule ember-views
*/
/**
- `Ember.View` is the class in Ember responsible for encapsulating templates of
- HTML content, combining templates with data to render as sections of a page's
- DOM, and registering and responding to user-initiated events.
-
- ## HTML Tag
-
- The default HTML tag name used for a view's DOM representation is `div`. This
- can be customized by setting the `tagName` property. The following view
- class:
-
- ```javascript
- ParagraphView = Ember.View.extend({
- tagName: 'em'
- });
- ```
-
- Would result in instances with the following HTML:
-
- ```html
- <em id="ember1" class="ember-view"></em>
- ```
-
- ## HTML `class` Attribute
-
- The HTML `class` attribute of a view's tag can be set by providing a
- `classNames` property that is set to an array of strings:
-
- ```javascript
- MyView = Ember.View.extend({
- classNames: ['my-class', 'my-other-class']
- });
- ```
-
- Will result in view instances with an HTML representation of:
-
- ```html
- <div id="ember1" class="ember-view my-class my-other-class"></div>
- ```
-
- `class` attribute values can also be set by providing a `classNameBindings`
- property set to an array of properties names for the view. The return value
- of these properties will be added as part of the value for the view's `class`
- attribute. These properties can be computed properties:
-
- ```javascript
- MyView = Ember.View.extend({
- classNameBindings: ['propertyA', 'propertyB'],
- propertyA: 'from-a',
- propertyB: Ember.computed(function() {
- if (someLogic) { return 'from-b'; }
- })
- });
- ```
-
- Will result in view instances with an HTML representation of:
-
- ```html
- <div id="ember1" class="ember-view from-a from-b"></div>
- ```
-
- If the value of a class name binding returns a boolean the property name
- itself will be used as the class name if the property is true. The class name
- will not be added if the value is `false` or `undefined`.
-
- ```javascript
- MyView = Ember.View.extend({
- classNameBindings: ['hovered'],
- hovered: true
- });
- ```
-
- Will result in view instances with an HTML representation of:
-
- ```html
- <div id="ember1" class="ember-view hovered"></div>
- ```
-
- When using boolean class name bindings you can supply a string value other
- than the property name for use as the `class` HTML attribute by appending the
- preferred value after a ":" character when defining the binding:
-
- ```javascript
- MyView = Ember.View.extend({
- classNameBindings: ['awesome:so-very-cool'],
- awesome: true
- });
- ```
-
- Will result in view instances with an HTML representation of:
-
- ```html
- <div id="ember1" class="ember-view so-very-cool"></div>
- ```
-
- Boolean value class name bindings whose property names are in a
- camelCase-style format will be converted to a dasherized format:
-
- ```javascript
- MyView = Ember.View.extend({
- classNameBindings: ['isUrgent'],
- isUrgent: true
- });
- ```
-
- Will result in view instances with an HTML representation of:
-
- ```html
- <div id="ember1" class="ember-view is-urgent"></div>
- ```
-
- Class name bindings can also refer to object values that are found by
- traversing a path relative to the view itself:
-
- ```javascript
- MyView = Ember.View.extend({
- classNameBindings: ['messages.empty']
- messages: Ember.Object.create({
- empty: true
- })
- });
- ```
-
- Will result in view instances with an HTML representation of:
-
- ```html
- <div id="ember1" class="ember-view empty"></div>
- ```
-
- If you want to add a class name for a property which evaluates to true and
- and a different class name if it evaluates to false, you can pass a binding
- like this:
-
- ```javascript
- // Applies 'enabled' class when isEnabled is true and 'disabled' when isEnabled is false
- Ember.View.extend({
- classNameBindings: ['isEnabled:enabled:disabled']
- isEnabled: true
- });
- ```
-
- Will result in view instances with an HTML representation of:
-
- ```html
- <div id="ember1" class="ember-view enabled"></div>
- ```
-
- When isEnabled is `false`, the resulting HTML representation looks like
- this:
-
- ```html
- <div id="ember1" class="ember-view disabled"></div>
- ```
-
- This syntax offers the convenience to add a class if a property is `false`:
-
- ```javascript
- // Applies no class when isEnabled is true and class 'disabled' when isEnabled is false
- Ember.View.extend({
- classNameBindings: ['isEnabled::disabled']
- isEnabled: true
- });
- ```
-
- Will result in view instances with an HTML representation of:
-
- ```html
- <div id="ember1" class="ember-view"></div>
- ```
-
- When the `isEnabled` property on the view is set to `false`, it will result
- in view instances with an HTML representation of:
-
- ```html
- <div id="ember1" class="ember-view disabled"></div>
- ```
-
- Updates to the value of a class name binding will result in automatic
- update of the HTML `class` attribute in the view's rendered HTML
- representation. If the value becomes `false` or `undefined` the class name
- will be removed.
-
- Both `classNames` and `classNameBindings` are concatenated properties. See
- [Ember.Object](/api/classes/Ember.Object.html) documentation for more
- information about concatenated properties.
-
- ## HTML Attributes
-
- The HTML attribute section of a view's tag can be set by providing an
- `attributeBindings` property set to an array of property names on the view.
- The return value of these properties will be used as the value of the view's
- HTML associated attribute:
-
- ```javascript
- AnchorView = Ember.View.extend({
- tagName: 'a',
- attributeBindings: ['href'],
- href: 'http://google.com'
- });
- ```
-
- Will result in view instances with an HTML representation of:
-
- ```html
- <a id="ember1" class="ember-view" href="http://google.com"></a>
- ```
-
- One property can be mapped on to another by placing a ":" between
- the source property and the destination property:
-
- ```javascript
- AnchorView = Ember.View.extend({
- tagName: 'a',
- attributeBindings: ['url:href'],
- url: 'http://google.com'
- });
- ```
-
- Will result in view instances with an HTML representation of:
-
- ```html
- <a id="ember1" class="ember-view" href="http://google.com"></a>
- ```
-
- Namespaced attributes (e.g. `xlink:href`) are supported, but have to be
- mapped, since `:` is not a valid character for properties in Javascript:
-
- ```javascript
- UseView = Ember.View.extend({
- tagName: 'use',
- attributeBindings: ['xlinkHref:xlink:href'],
- xlinkHref: '#triangle'
- });
- ```
- Will result in view instances with an HTML representation of:
-
- ```html
- <use xlink:href="#triangle"></use>
- ```
-
- If the return value of an `attributeBindings` monitored property is a boolean
- the attribute will be present or absent depending on the value:
-
- ```javascript
- MyTextInput = Ember.View.extend({
- tagName: 'input',
- attributeBindings: ['disabled'],
- disabled: false
- });
- ```
-
- Will result in a view instance with an HTML representation of:
-
- ```html
- <input id="ember1" class="ember-view" />
- ```
-
- `attributeBindings` can refer to computed properties:
-
- ```javascript
- MyTextInput = Ember.View.extend({
- tagName: 'input',
- attributeBindings: ['disabled'],
- disabled: Ember.computed(function() {
- if (someLogic) {
- return true;
- } else {
- return false;
- }
- })
- });
- ```
-
- To prevent setting an attribute altogether, use `null` or `undefined` as the
- return value of the `attributeBindings` monitored property:
-
- ```javascript
- MyTextInput = Ember.View.extend({
- tagName: 'form',
- attributeBindings: ['novalidate'],
- novalidate: null
- });
- ```
-
- Updates to the property of an attribute binding will result in automatic
- update of the HTML attribute in the view's rendered HTML representation.
-
- `attributeBindings` is a concatenated property. See [Ember.Object](/api/classes/Ember.Object.html)
- documentation for more information about concatenated properties.
-
- ## Layouts
-
- Views can have a secondary template that wraps their main template. Like
- primary templates, layouts can be any function that accepts an optional
- context parameter and returns a string of HTML that will be inserted inside
- view's tag. Views whose HTML element is self closing (e.g. `<input />`)
- cannot have a layout and this property will be ignored.
-
- Most typically in Ember a layout will be a compiled template.
-
- A view's layout can be set directly with the `layout` property or reference
- an existing template by name with the `layoutName` property.
-
- A template used as a layout must contain a single use of the
- `{{yield}}` helper. The HTML contents of a view's rendered `template` will be
- inserted at this location:
-
- ```javascript
- AViewWithLayout = Ember.View.extend({
- layout: Ember.HTMLBars.compile("<div class='my-decorative-class'>{{yield}}</div>"),
- template: Ember.HTMLBars.compile("I got wrapped")
- });
- ```
-
- Will result in view instances with an HTML representation of:
-
- ```html
- <div id="ember1" class="ember-view">
- <div class="my-decorative-class">
- I got wrapped
- </div>
- </div>
- ```
-
- See [Ember.Templates.helpers.yield](/api/classes/Ember.Templates.helpers.html#method_yield)
- for more information.
-
- ## Responding to Browser Events
-
- Views can respond to user-initiated events in one of three ways: method
- implementation, through an event manager, and through `{{action}}` helper use
- in their template or layout.
-
- ### Method Implementation
-
- Views can respond to user-initiated events by implementing a method that
- matches the event name. A `jQuery.Event` object will be passed as the
- argument to this method.
-
- ```javascript
- AView = Ember.View.extend({
- click: function(event) {
- // will be called when an instance's
- // rendered element is clicked
- }
- });
- ```
-
- ### Event Managers
-
- Views can define an object as their `eventManager` property. This object can
- then implement methods that match the desired event names. Matching events
- that occur on the view's rendered HTML or the rendered HTML of any of its DOM
- descendants will trigger this method. A `jQuery.Event` object will be passed
- as the first argument to the method and an `Ember.View` object as the
- second. The `Ember.View` will be the view whose rendered HTML was interacted
- with. This may be the view with the `eventManager` property or one of its
- descendant views.
-
- ```javascript
- AView = Ember.View.extend({
- eventManager: Ember.Object.create({
- doubleClick: function(event, view) {
- // will be called when an instance's
- // rendered element or any rendering
- // of this view's descendant
- // elements is clicked
- }
- })
- });
- ```
-
- An event defined for an event manager takes precedence over events of the
- same name handled through methods on the view.
-
- ```javascript
- AView = Ember.View.extend({
- mouseEnter: function(event) {
- // will never trigger.
- },
- eventManager: Ember.Object.create({
- mouseEnter: function(event, view) {
- // takes precedence over AView#mouseEnter
- }
- })
- });
- ```
-
- Similarly a view's event manager will take precedence for events of any views
- rendered as a descendant. A method name that matches an event name will not
- be called if the view instance was rendered inside the HTML representation of
- a view that has an `eventManager` property defined that handles events of the
- name. Events not handled by the event manager will still trigger method calls
- on the descendant.
-
- ```javascript
- var App = Ember.Application.create();
- App.OuterView = Ember.View.extend({
- template: Ember.HTMLBars.compile("outer {{#view 'inner'}}inner{{/view}} outer"),
- eventManager: Ember.Object.create({
- mouseEnter: function(event, view) {
- // view might be instance of either
- // OuterView or InnerView depending on
- // where on the page the user interaction occurred
- }
- })
- });
-
- App.InnerView = Ember.View.extend({
- click: function(event) {
- // will be called if rendered inside
- // an OuterView because OuterView's
- // eventManager doesn't handle click events
- },
- mouseEnter: function(event) {
- // will never be called if rendered inside
- // an OuterView.
- }
- });
- ```
-
- ### `{{action}}` Helper
-
- See [Ember.Templates.helpers.action](/api/classes/Ember.Templates.helpers.html#method_action).
-
- ### Event Names
-
- All of the event handling approaches described above respond to the same set
- of events. The names of the built-in events are listed below. (The hash of
- built-in events exists in `Ember.EventDispatcher`.) Additional, custom events
- can be registered by using `Ember.Application.customEvents`.
-
- Touch events:
-
- * `touchStart`
- * `touchMove`
- * `touchEnd`
- * `touchCancel`
-
- Keyboard events
-
- * `keyDown`
- * `keyUp`
- * `keyPress`
-
- Mouse events
-
- * `mouseDown`
- * `mouseUp`
- * `contextMenu`
- * `click`
- * `doubleClick`
- * `mouseMove`
- * `focusIn`
- * `focusOut`
- * `mouseEnter`
- * `mouseLeave`
-
- Form events:
-
- * `submit`
- * `change`
- * `focusIn`
- * `focusOut`
- * `input`
-
- HTML5 drag and drop events:
-
- * `dragStart`
- * `drag`
- * `dragEnter`
- * `dragLeave`
- * `dragOver`
- * `dragEnd`
- * `drop`
-
@class View
@namespace Ember
@extends Ember.CoreView
@deprecated See http://emberjs.com/deprecations/v1.x/#toc_ember-view
@uses Ember.ViewSupport
@@ -39738,11 +39774,11 @@
// reduced computed macros
enifed("ember/version", ["exports"], function (exports) {
"use strict";
- exports.default = "2.11.0-beta.4";
+ exports.default = "2.11.0-beta.8";
});
enifed('internal-test-helpers/apply-mixins', ['exports', 'ember-utils'], function (exports, _emberUtils) {
'use strict';
exports.default = applyMixins;
@@ -49914,13 +49950,15 @@
NamedArgs.prototype.compile = function compile(compiler, env, symbolTable) {
var keys = this.keys;
var values = this.values;
- return new _glimmerRuntimeLibCompiledExpressionsArgs.CompiledNamedArgs(keys, values.map(function (value) {
- return value.compile(compiler, env, symbolTable);
- }));
+ var compiledValues = new Array(values.length);
+ for (var i = 0; i < compiledValues.length; i++) {
+ compiledValues[i] = values[i].compile(compiler, env, symbolTable);
+ }
+ return new _glimmerRuntimeLibCompiledExpressionsArgs.CompiledNamedArgs(keys, compiledValues);
};
return NamedArgs;
})();
@@ -50251,12 +50289,23 @@
});
enifed('glimmer-runtime/lib/utils', ['exports', 'glimmer-util'], function (exports, _glimmerUtil) {
'use strict';
- var EMPTY_ARRAY = Object.freeze([]);
+ var HAS_NATIVE_WEAKMAP = (function () {
+ // detect if `WeakMap` is even present
+ var hasWeakMap = typeof WeakMap === 'function';
+ if (!hasWeakMap) {
+ return false;
+ }
+ var instance = new WeakMap();
+ // use `Object`'s `.toString` directly to prevent us from detecting
+ // polyfills as native weakmaps
+ return Object.prototype.toString.call(instance) === '[object WeakMap]';
+ })();
+ var EMPTY_ARRAY = HAS_NATIVE_WEAKMAP ? Object.freeze([]) : [];
exports.EMPTY_ARRAY = EMPTY_ARRAY;
- var EMPTY_DICT = Object.freeze(_glimmerUtil.dict());
+ var EMPTY_DICT = HAS_NATIVE_WEAKMAP ? Object.freeze(_glimmerUtil.dict()) : _glimmerUtil.dict();
exports.EMPTY_DICT = EMPTY_DICT;
var ListRange = (function () {
function ListRange(list, start, end) {
this.list = list;