wip

carbon-components-ember/package.json

@@ -131,7 +131,7 @@
     "@types/qunit-dom": "^0.7.0",
     "@typescript-eslint/eslint-plugin": "^6.7.2",
     "@typescript-eslint/parser": "^6.7.2",
-    "babel-plugin-ember-template-compilation": "^2.2.0",
+    "babel-plugin-ember-template-compilation": "^2.2.1",
     "bower": "^1.8.8",
     "broccoli": "^3.4.2",
     "broccoli-asset-rev": "^3.0.0",
@@ -171,7 +171,7 @@
     "eslint-plugin-qunit": "^7.3.4",
     "loader.js": "^4.7.0",
     "prettier": "^3.2.5",
-    "prettier-plugin-ember-template-tag": "^2.0.0",
+    "prettier-plugin-ember-template-tag": "^2.0.1",
     "qunit": "^2.19.4",
     "qunit-dom": "^2.0.0",
     "release-it": "^15.10.3",

carbon-components-ember/rollup.config.mjs

@@ -3,8 +3,12 @@ import fs from 'fs';
 import { babel } from '@rollup/plugin-babel';
 import copy from 'rollup-plugin-copy';
 import { Addon } from '@embroider/addon-dev/rollup';
-import astroturf from 'rollup-plugin-astroturf';
-import postcss from 'rollup-plugin-postcss';
+
+
+// rollup-plugin-astroturf mjs has wrong import specifiers...
+import { createRequire } from 'module';
+const require = createRequire(import.meta.url);
+const astroturf = require('rollup-plugin-astroturf');
 
 const addon = new Addon({
   srcDir: 'src',

carbon-components-ember/src/components/button.gts

@@ -107,7 +107,7 @@ class CarbonButton extends Component<ButtonSignature> {
   @tracked loading: boolean;
   @tracked disabled;
   @tracked showDialog;
-  @service('carbon.dialog-manager') dialogManager: DialogManagerService;
+  @service('carbon-components-ember@dialog-manager') dialogManager: DialogManagerService;
 
   @defaultArgs
   args: Args = {

carbon-components-ember/src/components/notification.gts

@@ -23,7 +23,7 @@ export interface NotificationComponentSignature {
 
 export default class NotificationComponent extends Component<NotificationComponentSignature> {
   @tracked show = true;
-  @service('carbon.notifications') notifications: NotificationService;
+  @service('carbon-components-ember@notifications') notifications: NotificationService;
 
   get icon(): IconNames {
     const mapping: Record<Required<NotificationOptions>['kind'], IconNames> = {

doc-app/app/pods/application/route.gts

@@ -1,12 +1,12 @@
 import DocsHeader from 'ember-cli-addon-docs/components/docs-header';
 import Notification from 'carbon-components-ember/components/notification';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 import { inject as service } from '@ember/service';
 
 class RouteComponent extends Component {
   @service('carbon-components-ember@dialog-manager') dialogManager;
-  @service('carbon.notifications') notifications;
+  @service('carbon-components-ember@notifications') notifications;
 
   <template>
     <DocsHeader />

doc-app/app/pods/docs/components/accordion/route.gts

@@ -10,7 +10,7 @@ import Toggle from 'carbon-components-ember/components/toggle';
 import Select from 'carbon-components-ember/components/select';
 import RadioButtonGroup from 'carbon-components-ember/components/radio/group';
 import Radio from 'carbon-components-ember/components/radio';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/breadcrumbs/route.gts

@@ -1,6 +1,6 @@
 import Demo from 'ember-cli-addon-docs/components/docs-demo';
 import { array } from '@ember/helper';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 import Breadcrumbs from 'carbon-components-ember/components/breadcrumbs';
 

doc-app/app/pods/docs/components/button/route.gts

@@ -6,7 +6,7 @@ import set from 'carbon-components-ember/helpers/set';
 import not from 'ember-truth-helpers/helpers/not';
 import eq from 'ember-truth-helpers/helpers/eq';
 import { fn } from '@ember/helper';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/charts/route.gts

@@ -6,7 +6,7 @@ import BarChart from 'carbon-components-ember/components/charts/bar';
 import LineChart from 'carbon-components-ember/components/charts/line';
 import PieChart from 'carbon-components-ember/components/charts/pie';
 import { array } from '@ember/helper';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/checkbox/route.gts

@@ -3,7 +3,7 @@ import Demo from 'ember-cli-addon-docs/components/docs-demo';
 import set from 'carbon-components-ember/helpers/set';
 import Checkbox from 'carbon-components-ember/components/checkbox';
 import { fn } from '@ember/helper';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/code-snippet/route.gts

@@ -2,7 +2,7 @@ import Input from 'carbon-components-ember/components/form-input';
 import Demo from 'ember-cli-addon-docs/components/docs-demo';
 import set from 'carbon-components-ember/helpers/set';
 import CodeSnippet from 'carbon-components-ember/components/code-snippet';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/confirm/route.gts

@@ -4,7 +4,7 @@ import Notification from 'carbon-components-ember/components/notification';
 import Select from 'carbon-components-ember/components/select';
 import Tag from 'carbon-components-ember/components/tag';
 import Confirm from 'carbon-components-ember/components/dialogs/confirm';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/data-table/route.gts

@@ -4,7 +4,7 @@ import Demo from 'ember-cli-addon-docs/components/docs-demo';
 import set from 'carbon-components-ember/helpers/set';
 import DataTable from 'carbon-components-ember/components/data-table';
 import { fn } from '@ember/helper';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/icon/route.gts

@@ -2,7 +2,7 @@ import Icon from 'carbon-components-ember/components/icon';
 import DocsDemo from 'ember-cli-addon-docs/components/docs-demo';
 import { fn } from '@ember/helper';
 import noop from 'doc-app/helpers/noop';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/list/route.gts

@@ -1,6 +1,6 @@
 import List from 'carbon-components-ember/components/list';
 import DocsDemo from 'ember-cli-addon-docs/components/docs-demo';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/loading/route.gts

@@ -4,7 +4,7 @@ import DocsDemo from 'ember-cli-addon-docs/components/docs-demo';
 import { fn } from '@ember/helper';
 import not from 'ember-truth-helpers/helpers/not';
 import newObj from 'carbon-components-ember/helpers/new-obj';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/menu/route.gts

@@ -5,7 +5,7 @@ import Checkbox from 'carbon-components-ember/components/checkbox';
 import set from 'carbon-components-ember/helpers/set';
 import not from 'ember-truth-helpers/helpers/not';
 import { fn } from '@ember/helper';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/modal/route.gts

@@ -3,7 +3,7 @@ import Demo from 'ember-cli-addon-docs/components/docs-demo';
 import set from 'carbon-components-ember/helpers/set';
 import eq from 'ember-truth-helpers/helpers/equal';
 import Modal from 'carbon-components-ember/components/modal';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/notification/controller.js

@@ -7,7 +7,7 @@ export default class NotificationController extends Controller {
   /**
    * @type {NotificationService}
    */
-  @service('carbon.notifications') notifications;
+  @service('carbon-components-ember@notifications') notifications;
   @action
   showNotification(type) {
     this.notifications.info({

doc-app/app/pods/docs/components/notification/route.gts

@@ -1,7 +1,7 @@
 import Button from 'carbon-components-ember/components/button';
 import DocsDemo from 'ember-cli-addon-docs/components/docs-demo';
 import Notification from 'carbon-components-ember/components/notification';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/pagination/route.gts

@@ -6,7 +6,7 @@ import FormInput from 'carbon-components-ember/components/form-input';
 import split from '@ascua/arrays/helpers/split';
 import { fn } from '@ember/helper';
 import not from 'ember-truth-helpers/helpers/not';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/progress-bar/route.gts

@@ -4,7 +4,7 @@ import newObj from 'carbon-components-ember/helpers/new-obj';
 import { fn } from '@ember/helper';
 import not from 'ember-truth-helpers/helpers/not';
 import ProgressBar from 'carbon-components-ember/components/progress-bar';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/select/route.gts

@@ -5,7 +5,7 @@ import Select from 'carbon-components-ember/components/select';
 import Tag from 'carbon-components-ember/components/tag';
 import join from 'ember-composable-helpers/helpers/join';
 import { fn } from '@ember/helper';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/tabs/route.gts

@@ -4,7 +4,7 @@ import newObj from 'carbon-components-ember/helpers/new-obj';
 import { fn } from '@ember/helper';
 import not from 'ember-truth-helpers/helpers/not';
 import Tabs from 'carbon-components-ember/components/tabs';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/tag/route.gts

@@ -1,7 +1,7 @@
 import Tag from 'carbon-components-ember/components/tag';
 import Demo from 'ember-cli-addon-docs/components/docs-demo';
 import castToAny from 'doc-app/helpers/cast-to-any';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 import { array } from '@ember/helper';
 

doc-app/app/pods/docs/components/tile/route.gts

@@ -4,7 +4,7 @@ import newObj from 'carbon-components-ember/helpers/new-obj';
 import { fn } from '@ember/helper';
 import not from 'ember-truth-helpers/helpers/not';
 import Tile from 'carbon-components-ember/components/tile';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/toggle/route.gts

@@ -3,7 +3,7 @@ import Toggle from 'carbon-components-ember/components/toggle';
 import newObj from 'carbon-components-ember/helpers/new-obj';
 import { fn } from '@ember/helper';
 import not from 'ember-truth-helpers/helpers/not';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/components/ui-shell/route.gts

@@ -4,7 +4,7 @@ import UiShell from 'carbon-components-ember/components/ui-shell';
 import Icon from 'carbon-components-ember/components/icon';
 import Menu from 'carbon-components-ember/components/menu';
 import Tabs from 'carbon-components-ember/components/tabs';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {

doc-app/app/pods/docs/index/route.gts

@@ -1,6 +1,6 @@
 import Hero from 'ember-cli-addon-docs/components/docs-hero';
 import Demo from 'ember-cli-addon-docs/components/docs-demo';
-import RouteTemplate from 'ember-route-template/route';
+import RouteTemplate from 'ember-routable-component';
 import Component from '@glimmer/component';
 
 class RouteComponent extends Component {
@@ -9,7 +9,7 @@ class RouteComponent extends Component {
       @prefix='Ember'
       @heading='Carbon Componente'
       @byline='Carbon Components for Ember'
-    />
+        />
 
     <div class='container'>
       <Demo as |demo|>

doc-app/app/pods/docs/template.hbs

@@ -0,0 +1,40 @@
+hi
+<DocsViewer as |viewer|>
+  <viewer.nav as |nav|>
+    <nav.section @label='Getting Started' />
+    <nav.item
+      @label='Installation'
+      @route='docs.getting-started.installation'
+    />
+
+    <nav.section @label='Components' />
+    <nav.item @label='Accordion' @route='docs.components.accordion' />
+    <nav.item @label='Button' @route='docs.components.button' />
+    <nav.item @label='Breadcrumbs' @route='docs.components.breadcrumbs' />
+    <nav.item @label='charts' @route='docs.components.charts' />
+    <nav.item @label='checkbox' @route='docs.components.checkbox' />
+    <nav.item @label='code-snippet' @route='docs.components.code-snippet' />
+    <nav.item @label='copy-button' @route='docs.components.copy-button' />
+    <nav.item @label='data-table' @route='docs.components.data-table' />
+    <nav.item @label='confirm' @route='docs.components.confirm' />
+    <nav.item @label='form-input' @route='docs.components.form-input' />
+    <nav.item @label='icon' @route='docs.components.icon' />
+    <nav.item @label='list' @route='docs.components.list' />
+    <nav.item @label='loading' @route='docs.components.loading' />
+    <nav.item @label='menu' @route='docs.components.menu' />
+    <nav.item @label='modal' @route='docs.components.modal' />
+    <nav.item @label='notification' @route='docs.components.notification' />
+    <nav.item @label='pagination' @route='docs.components.pagination' />
+    <nav.item @label='progress-bar' @route='docs.components.progress-bar' />
+    <nav.item @label='search-input' @route='docs.components.search-input' />
+    <nav.item @label='select' @route='docs.components.select' />
+    <nav.item @label='tabs' @route='docs.components.tabs' />
+    <nav.item @label='tag' @route='docs.components.tag' />
+    <nav.item @label='tile' @route='docs.components.tile' />
+    <nav.item @label='toggle' @route='docs.components.toggle' />
+    <nav.item @label='ui-shell' @route='docs.components.ui-shell' />
+  </viewer.nav>
+  <viewer.main>
+    {{outlet}}
+  </viewer.main>
+</DocsViewer>