Stop currying click event to action handlers

addon/components/polaris-button.js

@@ -1,5 +1,5 @@
 import Component from '@ember/component';
-import { computed } from '@ember/object';
+import { action, computed } from '@ember/object';
 import { or } from '@ember/object/computed';
 import { isPresent } from '@ember/utils';
 import { classify } from '@ember/string';
@@ -371,4 +371,9 @@ export default class PolarisButtonComponent extends Component {
       }
     );
   }
+
+  @action
+  handleClick(/* event */) {
+    this.onClick();
+  }
 }

addon/components/polaris-link.js

@@ -1,5 +1,5 @@
 import Component from '@ember/component';
-import { computed } from '@ember/object';
+import { action, computed } from '@ember/object';
 import { tagName, layout as templateLayout } from '@ember-decorators/component';
 import layout from '../templates/components/polaris-link';
 
@@ -73,4 +73,9 @@ export default class PolarisLink extends Component {
 
     return linkClasses.join(' ');
   }
+
+  @action
+  handleClick(/* event */) {
+    this.onClick();
+  }
 }

addon/components/polaris-page/action.js

@@ -1,5 +1,5 @@
 import Component from '@ember/component';
-import { computed } from '@ember/object';
+import { action, computed } from '@ember/object';
 import { isBlank } from '@ember/utils';
 import { tagName, layout } from '@ember-decorators/component';
 import template from '../../templates/components/polaris-page/action';
@@ -66,8 +66,6 @@ export default class ActionComponent extends Component {
    */
   onAction() {}
 
-  type = 'button';
-
   handleMouseUpByBlurring = handleMouseUpByBlurring;
 
   @computed('text', 'icon')
@@ -88,4 +86,9 @@ export default class ActionComponent extends Component {
 
     return classes.join(' ');
   }
+
+  @action
+  handleClick(/* event */) {
+    this.onAction();
+  }
 }

addon/components/polaris-resource-list/checkable-button.js

@@ -1,4 +1,5 @@
 import Component from '@ember/component';
+import { action, computed } from '@ember/object';
 import { not, and } from '@ember/object/computed';
 import { tagName, layout as templateLayout } from '@ember-decorators/component';
 import layout from '../../templates/components/polaris-resource-list/checkable-button';
@@ -76,4 +77,41 @@ export default class CheckableButton extends Component {
 
   @and('isNotPlain', 'measuring')
   shouldApplyMeasuringClass;
+
+  @computed(
+    'plain',
+    'shouldApplySelectModeClass',
+    'shouldApplySelectedClass',
+    'shouldApplyMeasuringClass'
+  )
+  get classes() {
+    let classes = ['Polaris-ResourceList-CheckableButton'];
+    if (this.plain) {
+      classes.push(
+        'Polaris-ResourceList-CheckableButton__CheckableButton--plain'
+      );
+    }
+    if (this.shouldApplySelectModeClass) {
+      classes.push(
+        'Polaris-ResourceList-CheckableButton__CheckableButton--selectMode'
+      );
+    }
+    if (this.shouldApplySelectedClass) {
+      classes.push(
+        'Polaris-ResourceList-CheckableButton__CheckableButton--selected'
+      );
+    }
+    if (this.shouldApplyMeasuringClass) {
+      classes.push(
+        'Polaris-ResourceList-CheckableButton__CheckableButton--measuring'
+      );
+    }
+
+    return classes.join(' ');
+  }
+
+  @action
+  toggleAll(/* event */) {
+    this.onToggleAll();
+  }
 }

addon/components/polaris-unstyled-link.js

@@ -147,6 +147,6 @@ export default class PolarisUnstyledLinkComponent extends Component {
   @action
   handleClick(event) {
     event.stopPropagation();
-    this.onClick(event);
+    this.onClick();
   }
 }

addon/templates/components/polaris-button.hbs

@@ -1,4 +1,4 @@
-{{#with
+{{#let
   (component
     "polaris-button/content"
     text=@text
@@ -40,10 +40,10 @@
         @external={{@external}}
         @download={{@download}}
         @ariaLabel={{@accessibilityLabel}}
-        @onClick={{action this.onClick}}
-        @onFocus={{action this.onFocus}}
-        @onBlur={{action this.onBlur}}
-        @onMouseUp={{action this.handleMouseUpByBlurring}}
+        @onClick={{this.handleClick}}
+        @onFocus={{this.onFocus}}
+        @onBlur={{this.onBlur}}
+        @onMouseUp={{this.handleMouseUpByBlurring}}
         ...attributes
       >
         {{#if hasBlock}}
@@ -68,7 +68,7 @@
       aria-controls={{@ariaControls}}
       aria-expanded={{if @ariaExpanded "true"}}
       aria-pressed={{if @ariaPressed "true"}}
-      {{on "click" this.onClick}}
+      {{on "click" this.handleClick}}
       {{on "focus" this.onFocus}}
       {{on "blur" this.onBlur}}
       {{on "keydown" this.onKeyDown}}
@@ -86,4 +86,4 @@
       {{/if}}
     </button>
   {{/if}}
-{{/with}}
+{{/let}}

addon/templates/components/polaris-link.hbs

@@ -3,7 +3,7 @@
     class={{this.linkClass}}
     @url={{@url}}
     @external={{@external}}
-    @onClick={{fn (or @onClick this.onClick)}}
+    @onClick={{this.handleClick}}
   >
     {{#if hasBlock}}
       {{yield}}
@@ -15,7 +15,7 @@
   <button
     type="button"
     class={{this.linkClass}}
-    {{on "click" (stop-propagation (or @onClick this.onClick))}}
+    {{on "click" (stop-propagation this.handleClick)}}
   >
     {{#if hasBlock}}
       {{yield}}

addon/templates/components/polaris-page/action.hbs

@@ -1,10 +1,10 @@
 {{! TODO: support url }}
 <button
+  type="button"
   class={{this.classes}}
   aria-label={{@accessibilityLabel}}
   disabled={{@disabled}}
-  type={{this.type}}
-  {{on "click" this.onAction}}
+  {{on "click" this.handleClick}}
   {{on "mouseup" this.handleMouseUpByBlurring}}
 >
   {{#if (or @icon @disclosure)}}

addon/templates/components/polaris-resource-list/checkable-button.hbs

@@ -1,12 +1,7 @@
 {{!-- template-lint-disable no-invalid-interactive --}}
 <div
-  {{on "click" (fn (or @onToggleAll this.onToggleAll))}}
-  class="Polaris-ResourceList-CheckableButton
-    {{if this.plain "Polaris-ResourceList-CheckableButton__CheckableButton--plain"}}
-    {{if this.shouldApplySelectModeClass "Polaris-ResourceList-CheckableButton__CheckableButton--selectMode"}}
-    {{if this.shouldApplySelectedClass "Polaris-ResourceList-CheckableButton__CheckableButton--selected"}}
-    {{if this.shouldApplyMeasuringClass "Polaris-ResourceList-CheckableButton__CheckableButton--measuring"}}
-  "
+  class={{this.classes}}
+  {{on "click" this.toggleAll}}
   ...attributes
 >
   <div class="Polaris-ResourceList-CheckableButton__Checkbox">

tests/integration/components/polaris-button-test.js

@@ -235,31 +235,21 @@ module('Integration | Component | polaris-button', function(hooks) {
     module('onClick()', function() {
       test('is called when the button is clicked', async function(assert) {
         this.set('handleClick', (_myArg, event) => {
-          assert.ok(true, 'triggers onClick handler');
-          assert.ok(
-            event instanceof MouseEvent,
-            'receives the MouseEvent as last argument'
-          );
+          assert.ok(true, 'triggers @onClick handler');
+          assert.notOk(event, 'does not curry click event to @onClick');
         });
 
-        await render(
-          hbs`{{polaris-button onClick=(action handleClick "myArg")}}`
-        );
+        await render(hbs`{{polaris-button onClick=this.handleClick}}`);
         await click('button');
       });
 
       test('is called when the link is clicked', async function(assert) {
-        this.set('handleClick', (_myArg, event) => {
-          assert.ok(true, 'triggers onClick handler');
-          assert.ok(
-            event instanceof MouseEvent,
-            'receives the MouseEvent as last argument'
-          );
+        this.set('handleClick', (event) => {
+          assert.ok(true, 'triggers @onClick handler');
+          assert.notOk(event, 'does not curry click event to @onClick');
         });
 
-        await render(
-          hbs`{{polaris-button onClick=(action handleClick "myArg") url="#"}}`
-        );
+        await render(hbs`{{polaris-button onClick=this.handleClick url="#"}}`);
         await click('[data-polaris-unstyled]');
       });
     });