feat: ember@4 support

.ember-cli

@@ -5,5 +5,11 @@
 
     Setting `disableAnalytics` to true will prevent any data from being sent.
   */
-  "disableAnalytics": false
+  "disableAnalytics": false,
+
+  /**
+  Setting `isTypeScriptProject` to true will force the blueprint generators to generate TypeScript
+  rather than JavaScript by default, when a TypeScript version of a given blueprint is available.
+  */
+  "isTypeScriptProject": false
 }

.eslintignore

@@ -19,7 +19,10 @@
 # ember-try
 /.node_modules.ember-try/
 /bower.json.ember-try
+/npm-shrinkwrap.json.ember-try
 /package.json.ember-try
+/package-lock.json.ember-try
+/yarn.lock.ember-try
 
 # snippets
 /tests/dummy/snippets/

.eslintrc.js

@@ -56,7 +56,7 @@ module.exports = {
       extends: ['plugin:node/recommended'],
     },
     {
-      // Test files:
+      // test files
       files: ['tests/**/*-test.{js,ts}'],
       extends: ['plugin:qunit/recommended'],
     },

.github/workflows/ci.yml

@@ -17,9 +17,9 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
       - name: Install Node
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3
         with:
           node-version: 12.x
           cache: npm
@@ -35,8 +35,8 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-      - uses: actions/checkout@v2
-      - uses: actions/setup-node@v2
+      - uses: actions/checkout@v3
+      - uses: actions/setup-node@v3
         with:
           node-version: 12.x
           cache: npm
@@ -56,12 +56,13 @@ jobs:
         try-scenario:
           - ember-lts-3.20
           - ember-lts-3.24
+          - ember-lts-3.28
           - ember-classic
 
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
       - name: Install Node
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3
         with:
           node-version: 12.x
           cache: npm
@@ -89,9 +90,9 @@ jobs:
           - embroider-optimized
 
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v3
       - name: Install Node
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3
         with:
           node-version: 12.x
           cache: npm

.gitignore

@@ -9,6 +9,7 @@
 /node_modules/
 
 # misc
+.DS_Store
 /.env*
 /.pnp*
 /.sass-cache
@@ -23,7 +24,13 @@
 # ember-try
 /.node_modules.ember-try/
 /bower.json.ember-try
+/npm-shrinkwrap.json.ember-try
 /package.json.ember-try
+/package-lock.json.ember-try
+/yarn.lock.ember-try
+
+# broccoli-debug
+/DEBUG/
 
 # editors
 /.idea

.npmignore

@@ -14,6 +14,7 @@
 /.eslintignore
 /.eslintrc.js
 /.git/
+/.github/
 /.gitignore
 /.prettierignore
 /.prettierrc.js
@@ -33,4 +34,7 @@
 # ember-try
 /.node_modules.ember-try/
 /bower.json.ember-try
+/npm-shrinkwrap.json.ember-try
 /package.json.ember-try
+/package-lock.json.ember-try
+/yarn.lock.ember-try

.prettierignore

@@ -14,8 +14,12 @@
 /coverage/
 !.*
 .eslintcache
+.lint-todo/
 
 # ember-try
 /.node_modules.ember-try/
 /bower.json.ember-try
+/npm-shrinkwrap.json.ember-try
 /package.json.ember-try
+/package-lock.json.ember-try
+/yarn.lock.ember-try

CONTRIBUTING.md

@@ -22,4 +22,4 @@
 * `ember serve`
 * Visit the dummy application at [http://localhost:4200](http://localhost:4200).
 
-For more information on using ember-cli, visit [https://ember-cli.com/](https://ember-cli.com/).
+For more information on using ember-cli, visit [https://cli.emberjs.com/release/](https://cli.emberjs.com/release/).

addon/components/paper-card-title-media.hbs

@@ -1,8 +1,7 @@
-{{! template-lint-disable no-implicit-this }}
 {{#if (has-block)}}
-  <div class="md-media-{{size}}">
+  <div class="md-media-{{this.size}}">
     {{yield}}
   </div>
 {{else}}
-  <img class="md-media-{{size}}" src={{src}} alt={{alt}} title={{title}}>
+  <img class="md-media-{{this.size}}" src={{@src}} alt={{@alt}} title={{@title}}>
 {{/if}}

addon/components/paper-card-title-media.js

@@ -4,11 +4,15 @@
  */
 import Component from '@ember/component';
 
+import { tagName, layout } from '@ember-decorators/component';
+import template from '../templates/components/paper-card-title-media';
+
 /**
  * @class PaperCardTitleMedia
  * @extends Ember.Component
  */
-export default Component.extend({
-  tagName: 'md-card-title-media',
-  size: 'md',
-});
+@tagName('md-card-title-media')
+@layout(template)
+export default class PaperCardTitleMedia extends Component {
+  size = 'md';
+}

addon/components/paper-icon.js

@@ -6,7 +6,7 @@
 import Component from '@ember/component';
 import { computed } from '@ember/object';
 import { reads } from '@ember/object/computed';
-import { htmlSafe } from '@ember/string';
+import { htmlSafe } from '@ember/template';
 
 import ColorMixin from 'ember-paper/mixins/color-mixin';
 

addon/components/paper-ink-bar.js

@@ -1,7 +1,7 @@
 /* eslint-disable ember/no-classic-components, ember/require-tagless-components, prettier/prettier */
 import { computed } from '@ember/object';
 import Component from '@ember/component';
-import { htmlSafe } from '@ember/string';
+import { htmlSafe } from '@ember/template';
 
 export default Component.extend({
   tagName: 'md-ink-bar',

addon/components/paper-item.hbs

@@ -1,5 +1,5 @@
 {{! template-lint-disable no-action no-implicit-this }}
-{{#with (hash
+{{#let (hash
   checkbox=(component "paper-checkbox" parentComponent=this bubbles=false shouldRegister=true)
   button=(component "paper-button" parentComponent=this bubbles=false shouldRegister=true skipProxy=true)
   switch=(component "paper-switch" parentComponent=this bubbles=false shouldRegister=true)
@@ -25,4 +25,4 @@
     </div>
   {{/if}}
 
-{{/with}}
+{{/let}}

addon/components/paper-menu/content/component.js

@@ -3,7 +3,7 @@ import Component from '@ember/component';
 import template from './template';
 
 import { action, computed } from '@ember/object';
-import { nextTick } from 'ember-css-transitions/utils/transition-utils';
+import { nextTick } from 'ember-css-transitions/modifiers/css-transition';
 
 import { tagName, layout } from '@ember-decorators/component';
 

addon/components/paper-ripple/component.js

@@ -5,7 +5,7 @@ import { tagName, layout } from '@ember-decorators/component';
 import { bind, later, cancel } from '@ember/runloop';
 import { computed, action } from '@ember/object';
 import { supportsPassiveEventListeners } from 'ember-paper/utils/browser-features';
-import { nextTick } from 'ember-css-transitions/utils/transition-utils';
+import { nextTick } from 'ember-css-transitions/modifiers/css-transition';
 
 const DURATION = 400;
 

addon/components/paper-select/ebd-content/component.js

@@ -6,7 +6,7 @@ import { tagName, layout } from '@ember-decorators/component';
 import { computed, action } from '@ember/object';
 
 import { next, scheduleOnce } from '@ember/runloop';
-import { nextTick } from 'ember-css-transitions/utils/transition-utils';
+import { nextTick } from 'ember-css-transitions/modifiers/css-transition';
 
 import { ESCAPE, LEFT_ARROW, UP_ARROW, RIGHT_ARROW, DOWN_ARROW, ENTER } from 'ember-paper/utils/key-constants';
 

addon/components/paper-sidenav-container.js

@@ -4,7 +4,7 @@
  */
 import Component from '@ember/component';
 
-import { htmlSafe } from '@ember/string';
+import { htmlSafe } from '@ember/template';
 
 /**
  * @class PaperSidenavContainer

addon/components/paper-slider/component.js

@@ -5,7 +5,7 @@
 import Component from '@ember/component';
 import { computed, action } from '@ember/object';
 import { bind } from '@ember/runloop';
-import { htmlSafe } from '@ember/string';
+import { htmlSafe } from '@ember/template';
 import template from './template';
 import clamp from 'ember-paper/utils/clamp';
 import { tagName, layout } from '@ember-decorators/component';

addon/components/paper-speed-dial-actions-action.js

@@ -1,7 +1,7 @@
 /* eslint-disable ember/no-classic-components, ember/no-component-lifecycle-hooks, ember/no-get, ember/require-tagless-components, prettier/prettier */
 import Component from '@ember/component';
 import { computed } from '@ember/object';
-import { htmlSafe } from '@ember/string';
+import { htmlSafe } from '@ember/template';
 
 function getElementIndex(node) {
   let index = 0;

addon/components/paper-tooltip-inner.js

@@ -2,7 +2,7 @@
 import Component from '@ember/component';
 import { computed } from '@ember/object';
 import { schedule } from '@ember/runloop';
-import { nextTick } from 'ember-css-transitions/utils/transition-utils';
+import { nextTick } from 'ember-css-transitions/modifiers/css-transition';
 import calculateTooltipPosition from 'ember-paper/utils/calculate-tooltip-position';
 
 export default Component.extend({

addon/components/paper-tooltip.js

@@ -3,7 +3,7 @@ import { or } from '@ember/object/computed';
 import Component from '@ember/component';
 import { computed } from '@ember/object';
 import { later } from '@ember/runloop';
-import { htmlSafe } from '@ember/string';
+import { htmlSafe } from '@ember/template';
 import { getOwner } from '@ember/application';
 import getParent from 'ember-paper/utils/get-parent';
 import { supportsPassiveEventListeners } from 'ember-paper/utils/browser-features';

addon/mixins/translate3d-mixin.js

@@ -3,10 +3,10 @@
  * @module ember-paper
  */
 import Mixin from '@ember/object/mixin';
-import { htmlSafe } from '@ember/string';
+import { htmlSafe } from '@ember/template';
 import { computed } from '@ember/object';
 import { schedule, later } from '@ember/runloop';
-import { nextTick, computeTimeout } from 'ember-css-transitions/utils/transition-utils';
+import { nextTick, computeTimeout } from 'ember-css-transitions/modifiers/css-transition';
 
 import { getOwner } from '@ember/application';
 

config/ember-try.js

@@ -7,18 +7,18 @@ module.exports = async function () {
   return {
     scenarios: [
       {
-        name: 'ember-lts-3.20',
+        name: 'ember-lts-3.24',
         npm: {
           devDependencies: {
-            'ember-source': '~3.20.5',
+            'ember-source': '~3.24.3',
           },
         },
       },
       {
-        name: 'ember-lts-3.24',
+        name: 'ember-lts-3.28',
         npm: {
           devDependencies: {
-            'ember-source': '~3.24.3',
+            'ember-source': '~3.28.0',
           },
         },
       },
@@ -46,19 +46,6 @@ module.exports = async function () {
           },
         },
       },
-      {
-        name: 'ember-default-with-jquery',
-        env: {
-          EMBER_OPTIONAL_FEATURES: JSON.stringify({
-            'jquery-integration': true,
-          }),
-        },
-        npm: {
-          devDependencies: {
-            '@ember/jquery': '^1.1.0',
-          },
-        },
-      },
       {
         name: 'ember-classic',
         env: {

index.js

@@ -366,6 +366,10 @@ const componentDependencies = {
 module.exports = {
   name: require('./package').name,
 
+  isDevelopingAddon() {
+    return true;
+  },
+
   options: {
     polyfills: {
       'polyfill-nodelist-foreach': {