Merge branch 'master' into paper-menu

CHANGELOG.md

@@ -18,6 +18,10 @@ Contributions and pull requests are always welcome. Contributors may often be fo
 
 #### 1.0.0-alpha.4
 - [#466](https://github.com/miguelcobain/ember-paper/pull/466) added autoprefixer configuration option
+- [#472](https://github.com/miguelcobain/ember-paper/pull/472) update ember-css-transitions
+- [#511](https://github.com/miguelcobain/ember-paper/issues/511) allow inner dialog clicks to bubble
+- [5f35cf5](https://github.com/miguelcobain/ember-paper/commit/5f35cf517530b06c850282a757d49096bff9a22b) Glimmer 2 compatible
+- [#506](https://github.com/miguelcobain/ember-paper/pull/506) Add super calls inside paper-input lifecycle hooks (fixes paper-form)
 
 #### 1.0.0-alpha.3
 - [#441](https://github.com/miguelcobain/ember-paper/pull/441) fixed fastboot service check

addon/components/paper-dialog-container.js

@@ -12,7 +12,15 @@ const { Component } = Ember;
 export default Component.extend({
   classNames: ['md-dialog-container'],
 
-  click() {
-    this.sendAction('outsideClicked');
+  mouseDown(ev) {
+    this._sourceEl = ev.target;
+  },
+
+  mouseUp(ev) {
+    if (this._sourceEl === this.element && ev.target === this.element) {
+      ev.stopPropagation();
+      ev.preventDefault();
+      this.sendAction('outsideClicked');
+    }
   }
 });

addon/components/paper-dialog-inner.js

@@ -30,13 +30,6 @@ export default Component.extend(Translate3dMixin, {
     if ($origin) {
       $origin.focus();
     }
-  },
-
-  click(ev) {
-    if (this.get('clickOutsideToClose')) {
-      ev.stopPropagation();
-      return false;
-    }
   }
 
 });

app/templates/components/paper-dialog.hbs

@@ -4,18 +4,15 @@
     opaque=true
     fixed=(unless parent true)
     class="md-dialog-backdrop"
-    onClick=(action "outsideClicked")
-  }}
+    onClick=(action "outsideClicked")}}
   {{#paper-dialog-container outsideClicked=(action "outsideClicked")}}
     {{#paper-dialog-inner
       origin=origin
       defaultedParent=defaultedParent
       defaultedOpenFrom=defaultedOpenFrom
       defaultedCloseTo=defaultedCloseTo
       fullscreen=fullscreen
-      clickOutsideToClose=clickOutsideToClose
-      focusOnOpen=focusOnOpen
-    }}
+      focusOnOpen=focusOnOpen}}
       {{yield}}
     {{/paper-dialog-inner}}
   {{/paper-dialog-container}}

package.json

@@ -1,7 +1,7 @@
 {
   "name": "ember-paper",
   "description": "The Ember approach to Material Design.",
-  "version": "1.0.0-alpha.3",
+  "version": "1.0.0-alpha.4",
   "directories": {
     "doc": "doc",
     "test": "tests"

tests/dummy/app/templates/demo/dialog.hbs

@@ -91,7 +91,7 @@
 {{/if}}
 
 {{#if showDialog}}
-  {{#paper-dialog onClose=(action "closeDialog" "cancel") origin=dialogOrigin}}
+  {{#paper-dialog onClose=(action "closeDialog" "cancel") origin=dialogOrigin clickOutsideToClose=true}}
     {{#paper-toolbar}}
       <div class="md-toolbar-tools">
         <h2>Mango (Fruit)</h2>
@@ -110,6 +110,7 @@
     {{/paper-dialog-content}}
 
     {{#paper-dialog-actions class="layout-row"}}
+      {{#paper-button href="http://en.wikipedia.org/wiki/Mango" target="_blank"}}More on Wikipedia{{/paper-button}}
       <span class="flex"></span>
       {{#paper-button onClick=(action "closeDialog" "cancel")}}Cancel{{/paper-button}}
       {{#paper-button onClick=(action "closeDialog" "ok")}}OK{{/paper-button}}

tests/integration/components/paper-dialog-test.js

@@ -136,7 +136,7 @@ test('click outside should close dialog if clickOutsideToClose', function(assert
 
   assert.ok(this.$('md-dialog').length, 'dialog is showing');
 
-  this.$('.md-dialog-container').click();
+  this.$('.md-dialog-container').mousedown().mouseup().click();
 });
 
 test('click outside should not close dialog by default', function(assert) {
@@ -148,7 +148,27 @@ test('click outside should not close dialog by default', function(assert) {
 
   assert.ok(this.$('md-dialog').length, 'dialog is showing');
 
-  this.$('.md-dialog-container').click();
+  this.$('.md-dialog-container').mousedown().mouseup().click();
+  assert.ok(this.$('md-dialog').length, 'dialog is still showing');
+});
+
+test('dialog shouldn\'t swallow click events', function(assert) {
+  assert.expect(3);
+
+  this.$().click(() => {
+    assert.ok(true, 'click event bubbled up');
+  });
+
+  this.render(hbs`
+    <div id="paper-wormhole"></div>
+    {{#paper-dialog clickOutsideToClose=true}}
+      <button id="the-button">Go somewhere</button>
+    {{/paper-dialog}}
+  `);
+
+  assert.ok(this.$('md-dialog').length, 'dialog is showing');
+
+  this.$('#the-button').mousedown().mouseup().click();
   assert.ok(this.$('md-dialog').length, 'dialog is still showing');
 });