WIP: Paper deprecation fix

CHANGELOG.md

@@ -1,19 +1,75 @@
 # Ember Paper Changelog
 
-#### Migrating from releases prior to 1.0
-
-Version 1.0 introduces many API changes relative to previous releases. In addition to the specific changelog listing below, the follow general changes have been made. Note that during the development of 1.0, the `master` branch reflects the most up-to-date version, with a mixture of updated and to-be-updated components.
-
-Contributions and pull requests are always welcome. Contributors may often be found on the [#e-paper channel on slack](https://embercommunity.slack.com/messages/e-paper/). Building the dummy application by installing `ember-paper` as if it were an application will provide you an up-to-date interactive demo, templates, and code samples.
-
-- Attributes are now `camelCased` rather than `kebab-cased`.
-- Components which accept user input, such as `paper-input`, `paper-checkbox`, `paper-switch` and `paper-select` now receive their input via the one-way `value` attribute and notify of a changed value by the `onChange` actions.
-- When provided by the API, `onChange` actions are required and throw an assertion if not provided.
-- Actions maybe be specified by a string action name (`onChange="updateValue"`) or an action closure (`onChange=(action (mut "myValue"))`). If you need to specify a target or additional parameter, you must use an action closure.
-- Many attributes have been renamed for clarity and consistency. See the specific changes below.
-- `paper-icon`'s `size` attribute now takes a size in pixels, and `lg` or `sm` values are no longer supported.
-- renamed the `paper-radio-group` `paper-radio` to just `radio` -- usage would now be `group.radio` as opposed to `group.paper-radio`.
-- Flex and layout attributes are replaced by classes (see [the documentation](http://miguelcobain.github.io/ember-paper/#/layout/introduction)). `flex=true` on Ember Paper components has also been removed and replaced by classes.
+### master
+- [#794](https://github.com/miguelcobain/ember-paper/pull/794) forward primary/warn arguments to the toasts' paper-button.
+- [dd7979e](https://github.com/miguelcobain/ember-paper/commit/dd7979ec08a94be6470aa355c6da12db5b2ec20b) correctly escape paper-autocomplete-highlight output (fixes [#985](https://github.com/miguelcobain/ember-paper/issues/985)).
+
+### 1.0.0-beta.18
+- [68ca72e](https://github.com/miguelcobain/ember-paper/commit/d931d1918e9ddd208cecf045bb6378b39148d7d1) not using ember-cli-sass-variables-export addon anymore since it doesn't output the generated files when using `ember build` (just `ember s`). We're manually including the generated files until we find a better solution. The palettes aren't likely to change anyway.
+
+### 1.0.0-beta.17
+- [d931d19](https://github.com/miguelcobain/ember-paper/commit/d931d1918e9ddd208cecf045bb6378b39148d7d1) Fix several issues with default colors, hues and contrasts.
+
+### 1.0.0-beta.16
+- [e82f32d](https://github.com/miguelcobain/ember-paper/commit/e82f32d2830b1e645879a1a2fa7401d9ffbb1e3f) Fix tooltip contrast color.
+
+### 1.0.0-beta.15
+- [0b57abf](https://github.com/miguelcobain/ember-paper/commit/0b57abf78202db7b3de301557e7b6a914dc32391) Some background color expressions in AM scss weren't being replaced with the correct colors. This made, for example, `.md-avatar-icon` to have the wrong colors.
+
+### 1.0.0-beta.14
+- [df7b5af](https://github.com/miguelcobain/ember-paper/commit/df7b5af8a6245d855e3fc268866dd8c0fe00bf46) bump ember-cli-sass-variables-export. Should now correctly work with ember-cli-sass 7 and below.
+- [#980](https://github.com/miguelcobain/ember-paper/pull/980) fixes "You modified canPageBack twice in a single render" on paper tabs. Also fixes `_selectedTab` computed getting triggered multiple times unecessarily.
+- [#981](https://github.com/miguelcobain/ember-paper/pull/981) Correctly call `paper-contrast-color` on the deprecated `contrastColor` function.
+
+### 1.0.0-beta.13
+- [a9ac019](https://github.com/miguelcobain/ember-paper/commit/a9ac019ed9203e68f971fcb925827090aafa6d41) use `addAddonToProject` to install ember-cli-sass on ember-paper install. This makes sure that any ember-cli-sass blueprint is run.
+- [6bddb15](https://github.com/miguelcobain/ember-paper/commit/6bddb1500e99abef61081a44e322d44dddfc3863) support label and placeholder simultaneously on paper-inputs
+- [d53b9d7](https://github.com/miguelcobain/ember-paper/commit/d53b9d7a6a0ea796d3a7a6bdbc75a767de7f277f) bump ember-cli-sass-variables-export. ember-paper is now compatible with dart sass, node sass and latest ember-cli-sass versions.
+
+### 1.0.0-beta.12
+- [f63c337](https://github.com/miguelcobain/ember-paper/commit/f63c3377796dac642005f347da209d0323b1ce2c) fix for accidentally broken palette generation on beta.11
+
+### 1.0.0-beta.11
+- [0184166](https://github.com/miguelcobain/ember-paper/commit/0184166929aedb9ae26713b943a3d8e3a29c9fa3) move ember-invoke-action to dependencies
+- [07f591c](https://github.com/miguelcobain/ember-paper/commit/07f591ca50b3cd836eb7e3f36e0f7ad3367519db) rename `generateTheme` util to `generatePalette`
+- [20b99f9](https://github.com/miguelcobain/ember-paper/commit/20b99f9c259364b81e910baa171e541c8e6423b7) `generatePalette` should return string representations and not tinycolor instances
+
+### 1.0.0-beta.10
+- [#973](https://github.com/miguelcobain/ember-paper/pull/973) fix ember 3.4 closure actions deprecation
+
+### 1.0.0-beta.9
+- [#958](https://github.com/miguelcobain/ember-paper/pull/958) fix input validations
+- [#971](https://github.com/miguelcobain/ember-paper/pull/971) support disabled tabs
+- [8c637bc...0bb4ea1](https://github.com/miguelcobain/ember-paper/compare/8c637bcda8f51583fbcbaa6c0dff37ee08a363b6...0bb4ea110fb2dd9ba40ec455a2ee24e23d4aa073) implement runtime theming using css variables
+
+### 1.0.0-beta.8
+- [#924](https://github.com/miguelcobain/ember-paper/pull/924) fix css issue when paper-menu dense=true and content is scrollable
+- [666f06d](https://github.com/miguelcobain/ember-paper/commit/666f06d05dc0e90ce4726d1cd34f2daa28b1f542) fix progress-circular on fastboot (fixes [#927](https://github.com/miguelcobain/ember-paper/issues/927))
+- [#941](https://github.com/miguelcobain/ember-paper/pull/941) render md-select-header outside of md-content on paper-select when searchEnabled=true
+- [#954](https://github.com/miguelcobain/ember-paper/pull/954) support optional `defaultHighlighted` on paper-chips
+- [#956](https://github.com/miguelcobain/ember-paper/pull/956) don't use paper-autocomplete _innerText (fixes [#932](https://github.com/miguelcobain/ember-paper/issues/932), [#935](https://github.com/miguelcobain/ember-paper/issues/935) and [#787](https://github.com/miguelcobain/ember-paper/issues/787))
+- [#943](https://github.com/miguelcobain/ember-paper/pull/943) fix defaultAttrs error for paper-virtual-repeat
+- [#964](https://github.com/miguelcobain/ember-paper/pull/964) make ripple touch events passive
+- [#962](https://github.com/miguelcobain/ember-paper/pull/962) Grid list: handle tile order and length changes
+
+### 1.0.0-beta.7
+- [3d6f299](https://github.com/miguelcobain/ember-paper/commit/3d6f2996a4e24b9c76519dcc0dd094b61658ec77) bump angular material styles to 1.1.9
+
+### 1.0.0-beta.6
+- [#915](https://github.com/miguelcobain/ember-paper/pull/915) replace ember-wormhole with ember-maybe-in-element
+- [#895](https://github.com/miguelcobain/ember-paper/pull/895) fix paper-select positioning when content is scrollable
+- [#912](https://github.com/miguelcobain/ember-paper/pull/912) add `title` attribute to paper-item
+- [#903](https://github.com/miguelcobain/ember-paper/pull/903) fix progress-circular, now renders correctly in determinate mode
+
+### 1.0.0-beta.5
+- [#873](https://github.com/miguelcobain/ember-paper/pull/873) bump ember-composability tools (removes `project.nodeModulesPath` deprecation message)
+- [cf172a9](https://github.com/miguelcobain/ember-paper/commit/cf172a93b4d0c8bf7836e9e80092799aee216271) proxy `errors` proeprty to paper-autocomplete input
+- [a86534f](https://github.com/miguelcobain/ember-paper/commit/a86534faed32cedda653de4e8df774108a8eb3b7) register ember-paper version in ember inspector
+- [37444e6](https://github.com/miguelcobain/ember-paper/commit/37444e60b08f0de49c8d4c218848122f0f51c0b0) guard tooltip event handler when destroyed
+- [#875](https://github.com/miguelcobain/ember-paper/pull/875) add `autofocus` to autocomplete-trigger input
+- [#900](https://github.com/miguelcobain/ember-paper/pull/900) allows paper-radio values to be `0`
+- [#888](https://github.com/miguelcobain/ember-paper/pull/888) add `rel` to paper-button
+- [#911](https://github.com/miguelcobain/ember-paper/pull/911) removes [deprecation](https://deprecations-app-prod.herokuapp.com/deprecations/v3.x/#toc_ember-meta-descriptor-on-object) that caused `validationErrorMessages` computed to never update after it's initialized
 
 ### 1.0.0-beta.4
 - [68f4832](https://github.com/miguelcobain/ember-paper/commit/68f4832b67a3fd544164b1ace17d50d974b11ad2) add correct overflow class when dialog does not contain images (fixes [#807](https://github.com/miguelcobain/ember-paper/issues/807))
@@ -246,6 +302,21 @@ Contributions and pull requests are always welcome. Contributors may often be fo
   - Update your project's `bower.json` to require `"hammer.js": "^2.0.8"`. Remove `bower_components/hammerjs`. Run `bower cache clean`, then `bower install`.
 - [5521f3b](https://github.com/miguelcobain/ember-paper/commit/5521f3b246be4c24cd54f5e0b5383fc9e78e24dd ) Validation status on `paper-input` is exposed via `onInvalid` action.
 
+#### Migrating from releases prior to 1.0
+
+Version 1.0 introduces many API changes relative to previous releases. In addition to the specific changelog listing below, the follow general changes have been made. Note that during the development of 1.0, the `master` branch reflects the most up-to-date version, with a mixture of updated and to-be-updated components.
+
+Contributions and pull requests are always welcome. Contributors may often be found on the [#e-paper channel on Discord](https://discord.gg/zT3asNS). Building the dummy application by installing `ember-paper` as if it were an application will provide you an up-to-date interactive demo, templates, and code samples.
+
+- Attributes are now `camelCased` rather than `kebab-cased`.
+- Components which accept user input, such as `paper-input`, `paper-checkbox`, `paper-switch` and `paper-select` now receive their input via the one-way `value` attribute and notify of a changed value by the `onChange` actions.
+- When provided by the API, `onChange` actions are required and throw an assertion if not provided.
+- Actions maybe be specified by a string action name (`onChange="updateValue"`) or an action closure (`onChange=(action (mut "myValue"))`). If you need to specify a target or additional parameter, you must use an action closure.
+- Many attributes have been renamed for clarity and consistency. See the specific changes below.
+- `paper-icon`'s `size` attribute now takes a size in pixels, and `lg` or `sm` values are no longer supported.
+- renamed the `paper-radio-group` `paper-radio` to just `radio` -- usage would now be `group.radio` as opposed to `group.paper-radio`.
+- Flex and layout attributes are replaced by classes (see [the documentation](http://miguelcobain.github.io/ember-paper/#/layout/introduction)). `flex=true` on Ember Paper components has also been removed and replaced by classes.
+
 ### 0.2.14
 
   - Updated the dependency on Hammer.js from `hammerjs` to `hammer.js`.

CONTRIBUTING.md

@@ -2,7 +2,7 @@
 
 ## Coordination, communication and community
 
-Many ember-paper contributors hang out on the [e-paper channel on slack](https://embercommunity.slack.com/messages/e-paper/). Not a slack user? [Get your invitation.](https://ember-community-slackin.herokuapp.com/)
+Many ember-paper contributors hang out on the [#e-paper channel on Discord](https://discord.gg/zT3asNS).
 
 ## Coding style
 
@@ -11,7 +11,7 @@ Many ember-paper contributors hang out on the [e-paper channel on slack](https:/
 * **Comments.** Include block-style (`/**`) comments before  functions with a non-trivial or non-obvious purpose. Include line-style (`//`) comments wherever code might not be obvious to a future contributor, years later, without your knowledge of the functioning of the code. If an intermediate-level Ember developer will wonder why something works, explain it.
 
 * **Actions.** Accept action closures rather than strings representing action names.
-`{{some-component someAction=(action "myAction")}}`, not `{{some-component someAction="myAction" param="the stuff" target=someTarget}}`. Invoke the action with `this.sendAction('onWhatever');`. There is no need to test for the presence of `onWhatever` as `sendAction` handles that situation.
+`{{some-component someAction=(action "myAction")}}`, not `{{some-component someAction="myAction" param="the stuff" target=someTarget}}`. Starting from 3.4 sendAction is deprecated, so be sure to use closure Actions. `this.get('onClick')()`, there is an utility `invokeAction(this, 'onClick')` that you can use from ember-invoke-action addon which takes care about the presence of the action and everything for you.
 
 * **Encapsulation.** When communicating with a private ember-paper component, bind as many properties as are needed.
 When communicating between two public ember components, use `nearestOfType` in a computed property to find the outer component (for pre 2.3 compatibility), and override it when yielding a contextual component.

README.md

@@ -1,7 +1,9 @@
-# Ember Paper [![Build Status](https://travis-ci.org/miguelcobain/ember-paper.svg)](https://travis-ci.org/miguelcobain/ember-paper) [![Ember Observer Score](http://emberobserver.com/badges/ember-paper.svg)](http://emberobserver.com/addons/ember-paper) [![Slack Status](https://ember-community-slackin.herokuapp.com/badge.svg)](https://ember-community-slackin.herokuapp.com/)
+# Ember Paper [![Build Status](https://travis-ci.org/miguelcobain/ember-paper.svg)](https://travis-ci.org/miguelcobain/ember-paper) [![Ember Observer Score](http://emberobserver.com/badges/ember-paper.svg)](http://emberobserver.com/addons/ember-paper) [![Discord](https://img.shields.io/discord/480462759797063690.svg?logo=discord)](https://discord.gg/zT3asNS)
 
 This project aims to bring Google's new [Material Design](https://www.google.com/design/spec/material-design/introduction.html) to Ember. The goal is to encapsulate everything possible in Ember components. This project is packaged as an [Ember-cli](http://www.ember-cli.com/) addon.
 
+[Explore Ember Paper docs »](https://miguelcobain.github.io/ember-paper/)
+
 ## Installation
 
 Install the ember-cli addon in your ember-cli project:
@@ -19,7 +21,7 @@ Navigate through the docs to understand how to use each component.
 
 ## Resources
 
-- The team can often be found on the [#e-paper channel on slack](https://embercommunity.slack.com/messages/e-paper/). Features and designs are discussed there prior to implementation. Get your invite to Ember Community Slack [here](https://ember-community-slackin.herokuapp.com/).
+- The team can often be found on the [#e-paper channel on discord](https://discord.gg/zT3asNS). Features and designs are discussed there prior to implementation.
 
 - The [GitHub milestone issue](https://github.com/miguelcobain/ember-paper/issues/249) tracks our progress to version 1.0.
 
@@ -29,11 +31,10 @@ Navigate through the docs to understand how to use each component.
 
 ## Contributing
 
-This is a very ambitious project. Google's design specs are extensive, and non-trivial to implement. If you can port or fix a component or two, please drop a pull request or issue on GitHub or join us on slack.
+This is a very ambitious project. Google's design specs are extensive, and non-trivial to implement. If you can port or fix a component or two, please drop a pull request or issue on GitHub or join us on Discord.
 
 With everyone's help, we can bring this amazing design spec to Ember in a modular and elegant way. The Ember way.
 
-License
-------------------------------------------------------------------------------
+## License
 
 This project is licensed under the [MIT License](LICENSE.md).

addon/components/paper-autocomplete-highlight.js

@@ -4,7 +4,6 @@
 import Component from '@ember/component';
 
 import { computed } from '@ember/object';
-import { htmlSafe } from '@ember/string';
 import layout from '../templates/components/paper-autocomplete-highlight';
 
 /**
@@ -16,32 +15,67 @@ export default Component.extend({
   tagName: 'span',
   flags: '',
 
-  highlight: computed('searchText', 'label', 'flags', function() {
-    let text = `${this.get('label')}`;
-    let flags = this.get('flags');
-    let regex = this.getRegExp(this.get('searchText'), flags);
+  tokens: computed('regex', 'label', function() {
+    let string = `${this.get('label')}`;
+    let regex = this.get('regex');
 
-    let html = text.replace(regex, '<span class="highlight">$&</span>');
-    return htmlSafe(html);
-  }),
+    let tokens = [];
+    let lastIndex = 0;
+
+    // Use replace here, because it supports global and single regular expressions at same time.
+    string.replace(regex, (match, index) => {
+      let prev = string.slice(lastIndex, index);
+      if (prev) {
+        tokens.push({
+          text: prev,
+          isMatch: false
+        });
+      }
+
+      tokens.push({
+        text: match,
+        isMatch: true
+      });
 
-  sanitize(term) {
-    if (!term) {
-      return term;
+      lastIndex = index + match.length;
+    });
+
+    // Append the missing text as a token.
+    let last = string.slice(lastIndex);
+    if (last) {
+      tokens.push({
+        text: last,
+        isMatch: false
+      });
     }
-    return term.replace(/[\\^$*+?.()|{}[\]]/g, '\\$&');
-  },
 
-  getRegExp(text, flags) {
-    let str = '';
-    if (flags.indexOf('^') >= 1) {
-      str += '^';
+    return tokens;
+  }),
+
+  regex: computed('searchText', 'flags', function() {
+    let flags = this.get('flags');
+    let text = this.get('searchText');
+    return this.getRegExp(text, flags);
+  }),
+
+  getRegExp(term, flags) {
+    let startFlag = '';
+    let endFlag = '';
+    let regexTerm = this.sanitizeRegex(term);
+
+    if (flags.indexOf('^') >= 0) {
+      startFlag = '^';
     }
-    str += text;
-    if (flags.indexOf('$') >= 1) {
-      str += '$';
+
+    if (flags.indexOf('$') >= 0) {
+      endFlag = '$';
     }
-    return new RegExp(this.sanitize(str), flags.replace(/[$^]/g, ''));
+
+    return new RegExp(startFlag + regexTerm + endFlag, flags.replace(/[$^]/g, ''));
+  },
+
+  sanitizeRegex(term) {
+    return term && term.toString().replace(/[\\^$*+?.()|{}[\]]/g, '\\$&');
   }
 
 });

addon/components/paper-autocomplete.js

@@ -105,6 +105,11 @@ export default PowerSelect.extend(ValidationMixin, ChildMixin, {
     this._super(...arguments);
   },
 
+  updateSelection() {
+    this._super(...arguments);
+    this.notifyValidityChange();
+  },
+
   actions: {
 
     onTriggerMouseDown() {

addon/components/paper-backdrop.js

@@ -7,7 +7,7 @@ import Component from '@ember/component';
 import { computed } from '@ember/object';
 import { htmlSafe } from '@ember/string';
 import TransitionMixin from 'ember-css-transitions/mixins/transition-mixin';
-
+import { invokeAction } from 'ember-invoke-action';
 /**
  * @class PaperBackdrop
  * @extends Ember.Component
@@ -34,7 +34,7 @@ export default Component.extend(TransitionMixin, {
 
   sendClickAction(e) {
     e.preventDefault();
-    this.sendAction('onClick', e);
+    invokeAction(this, 'onClick', e);
   },
 
   click(e) {

addon/components/paper-button.js

@@ -9,6 +9,7 @@ import FocusableMixin from 'ember-paper/mixins/focusable-mixin';
 import RippleMixin from 'ember-paper/mixins/ripple-mixin';
 import ColorMixin from 'ember-paper/mixins/color-mixin';
 import ProxiableMixin from 'ember-paper/mixins/proxiable-mixin';
+import { invokeAction } from 'ember-invoke-action';
 
 /**
  * @class PaperButton
@@ -60,8 +61,8 @@ export default Component.extend(FocusableMixin, RippleMixin, ColorMixin, Proxiab
     }
   },
 
-  click(event) {
-    this.sendAction('onClick', event);
+  click(e) {
+    invokeAction(this, 'onClick', e);
     // Prevent bubbling, if specified. If undefined, the event will bubble.
     return this.get('bubbles');
   }