Add support for gts and gjs preview

.github/workflows/ci.yml

@@ -16,10 +16,10 @@ jobs:
       CI: 'true'
 
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v4
       - uses: actions/setup-node@v2
         with:
-          node-version: 14.x
+          node-version: 18.x
       - name: Install yarn
         run: npm install -g yarn
       - name: Install dependencies

packages/ember/.docfy-config.js

@@ -20,7 +20,7 @@ module.exports = {
     ]
   ],
   plugins: [docfyWithProse],
-  rehypePlugins: [prism],
+  rehypePlugins: [() => [prism, { alias: { gts: 'ts', gjs: 'js' } }]],
   sources: [
     {
       root: path.join(__dirname, 'dummy-docs'),

packages/ember/dummy-docs/packages/ember/preview.md

@@ -0,0 +1,20 @@
+---
+category: ember
+---
+
+# Preview works with gts, gjs
+
+This works
+
+```gts preview
+import Component from '@glimmer/component';
+
+// components/hello.gjs
+export default class Hello extends Component {
+  isThisCool = true;
+
+  <template>
+    Is This Cool?: {{this.isThisCool}}
+  </template>
+}
+```

packages/ember/package.json

@@ -40,8 +40,8 @@
     "broccoli-source": "^3.0.1",
     "calculate-cache-key-for-tree": "2.0.0",
     "debug": "^4.3.3",
-    "ember-cli-babel": "^7.26.11",
-    "ember-cli-htmlbars": "^6.0.1",
+    "ember-cli-babel": "^8.2.0",
+    "ember-cli-htmlbars": "^6.3.0",
     "ember-cli-typescript": "^4.2.1",
     "ember-get-config": "^1.0.2",
     "mdast-util-to-string": "^2.0.0",
@@ -85,6 +85,7 @@
     "broccoli-asset-rev": "^3.0.0",
     "ember-auto-import": "^2.4.0",
     "ember-cli": "~4.1.1",
+    "ember-cli-babel": "8.2.0",
     "ember-cli-dependency-checker": "^3.2.0",
     "ember-cli-fastboot": "^3.2.0-beta.5",
     "ember-cli-fastboot-testing": "^0.6.0",
@@ -103,6 +104,7 @@
     "ember-sinon": "^5.0.0",
     "ember-source": "~4.1.0",
     "ember-source-channel-url": "^3.0.0",
+    "ember-template-imports": "^4.0.0",
     "ember-template-lint": "^2.18.0",
     "ember-try": "^2.0.0",
     "loader.js": "^4.7.0",

packages/ember/src/index.ts

@@ -35,7 +35,7 @@ function hasBackingJS(chunks: DemoComponentChunk[]): boolean {
   for (let i = 0; i < chunks.length; i++) {
     const chunk = chunks[i];
 
-    if (chunk.ext === 'js' || chunk.ext === 'ts') {
+    if (['js', 'ts', 'gts', 'gjs'].includes(chunk.ext)) {
       return true;
     }
   }

packages/ember/src/plugins/preview-template.ts

@@ -18,7 +18,7 @@ export default plugin({
       const demoComponents: DemoComponent[] = [];
 
       visit(page.ast, 'code', (node: CodeNode) => {
-        if (['preview-template'].includes(node.meta || '')) {
+        if (['preview-template', 'preview'].includes(node.meta || '')) {
           demoComponents.push({
             name: generateDemoComponentName(
               `docfy-demo-preview-${path.basename(page.meta.url)}`,