Remove ember-decorators and ember-component-css (#1135)

* Remove ember-decorators, bump some deps

* Remove ember-component-css

package.json

@@ -47,7 +47,7 @@
     "broccoli-source": "^3.0.0",
     "broccoli-stew": "^3.0.0",
     "chalk": "4.1.2",
-    "ember-auto-import": "^2.2.4",
+    "ember-auto-import": "^2.4.0",
     "ember-cli-autoprefixer": "^2.0.0",
     "ember-cli-babel": "^7.26.11",
     "ember-cli-clipboard": "^0.16.0",
@@ -59,7 +59,6 @@
     "ember-code-snippet": "^3.0.0",
     "ember-composable-helpers": "^5.0.0",
     "ember-concurrency": "^2.0.0",
-    "ember-decorators": "^6.1.1",
     "ember-fetch": "^8.1.1",
     "ember-get-config": "^1.0.0",
     "ember-keyboard": "^7.0.1",
@@ -104,7 +103,7 @@
     "@babel/preset-env": "^7.16.4",
     "@ember/optional-features": "^2.0.0",
     "@ember/test-helpers": "^2.6.0",
-    "@embroider/test-setup": "^1.1.0",
+    "@embroider/test-setup": "^1.2.0",
     "@fullhuman/postcss-purgecss": "^4.0.3",
     "broccoli-asset-rev": "^3.0.0",
     "chai": "^4.2.0",
@@ -121,7 +120,6 @@
     "ember-cli-mirage": "^3.0.0-alpha.2",
     "ember-cli-sri": "^2.1.1",
     "ember-cli-terser": "^4.0.2",
-    "ember-component-css": "^0.7.4",
     "ember-data": "~4.1.0",
     "ember-disable-prototype-extensions": "^1.1.3",
     "ember-export-application-global": "^2.0.1",
@@ -149,7 +147,7 @@
     "qunit-dom": "^2.0.0",
     "release-it": "^14.12.1",
     "release-it-lerna-changelog": "^4.0.1",
-    "webpack": "^5.66.0"
+    "webpack": "^5.68.0"
   },
   "peerDependencies": {
     "ember-data": ">= 3.0.0",

tests/dummy/app/styles/app.scss

@@ -1 +1,32 @@
-@import 'pod-styles';
+// BEGIN-SNIPPET docs-logo-ember-styles.scss
+.my-ember-addon-logo {
+  background: #333;
+  color: white;
+  width: 50%;
+  height: 50%;
+  margin: 0 auto;
+  padding: 20px;
+}
+// END-SNIPPET
+
+// BEGIN-SNIPPET docs-logo-ember-cli-styles.scss
+.my-ember-cli-addon-logo {
+  background: #F44336;
+  color: white;
+  width: 50%;
+  height: 50%;
+  margin: 0 auto;
+  padding: 20px;
+}
+// END-SNIPPET
+
+// BEGIN-SNIPPET docs-logo-ember-data-styles.scss
+.my-ember-data-addon-logo {
+  background: #2196F3;
+  color: white;
+  width: 50%;
+  height: 50%;
+  margin: 0 auto;
+  padding: 20px;
+}
+// END-SNIPPET

tests/dummy/app/templates/docs/components/docs-logo.md

@@ -0,0 +1,42 @@
+# Docs Logo
+
+An SVG logo that fills its container and takes on the current color.
+
+By default it renders the Ember logo (you can also pass `@logo="ember"`):
+
+<DocsDemo as |demo|>
+  <demo.example @name="docs-logo-ember.hbs">
+    <div class="my-ember-addon-logo">
+      <DocsLogo />
+    </div>
+  </demo.example>
+
+  <demo.snippet @name="docs-logo-ember.hbs" />
+  <demo.snippet @name="docs-logo-ember-styles.scss" />
+</DocsDemo>
+
+Pass `@logo="ember-cli"` for the Ember CLI logo:
+
+<DocsDemo as |demo|>
+  <demo.example @name="docs-logo-ember-cli.hbs">
+    <div class="my-ember-cli-addon-logo">
+      <DocsLogo @logo="ember-cli" />
+    </div>
+  </demo.example>
+
+  <demo.snippet @name="docs-logo-ember-cli.hbs" />
+  <demo.snippet @name="docs-logo-ember-cli-styles.scss" />
+</DocsDemo>
+
+Pass `@logo="ember-data"` for the Ember Data logo:
+
+<DocsDemo as |demo|>
+  <demo.example @name="docs-logo-ember-data.hbs">
+    <div class="my-ember-data-addon-logo">
+      <DocsLogo @logo="ember-data" />
+    </div>
+  </demo.example>
+
+  <demo.snippet @name="docs-logo-ember-data.hbs" />
+  <demo.snippet @name="docs-logo-ember-data-styles.scss" />
+</DocsDemo>