diff --git a/addon/components/dynamic-template.hbs b/addon/components/dynamic-template.hbs
new file mode 100644
index 0000000..ea7ebc8
--- /dev/null
+++ b/addon/components/dynamic-template.hbs
@@ -0,0 +1,7 @@
+{{#if false}}
+  {{!-- This is just here to tell embroider to include <ColorPallet /> in
+    any bundle that <DynamicTemplate /> is used in --}}
+  <ColorPallet />
+{{/if}}
+
+{{component (ensure-safe-component this.component)}}
\ No newline at end of file
diff --git a/addon/components/dynamic-template.js b/addon/components/dynamic-template.js
index 9b6f591..f423299 100644
--- a/addon/components/dynamic-template.js
+++ b/addon/components/dynamic-template.js
@@ -1,21 +1,14 @@
-/* eslint-disable ember/no-classic-components, ember/no-classic-classes, prettier/prettier, no-console */
-
-import Component from '@ember/component';
-import GlimmerComponent from '@glimmer/component';
-import layout from '../templates/components/dynamic-template';
-
-import { computed } from '@ember/object';
+import { setComponentTemplate } from '@ember/component';
 import { getOwner } from '@ember/application';
 import { compileTemplate } from '@ember/template-compilation';
+import { importSync } from '@embroider/macros';
+import Component from '@glimmer/component';
 
 let templateOwnerMap = new Map();
-let templateId = 0;
 
-export default Component.extend({
-  tagName: '',
-  layout,
-  init() {
-    this._super(...arguments);
+export default class DynamicTemplateComponent extends Component {
+  constructor() {
+    super(...arguments);
 
     let owner = getOwner(this);
     let templateMap = templateOwnerMap.get(owner);
@@ -23,39 +16,53 @@ export default Component.extend({
       templateMap = templateOwnerMap.set(owner, new Map());
     }
     this.templateMap = templateMap;
-  },
+  }
 
-  componentName: computed('templateString', 'componentId', function() {
-    let { templateMap, templateString } = this;
-    if (!templateString) { return null; }
+  get component() {
+    let owner = getOwner(this);
 
-    let componentName = templateMap.get(templateString);
-    if (componentName === undefined) {
-      let owner = getOwner(this);
+    let { templateString } = this.args;
+    if (!templateString) {
+      return null;
+    }
 
+    let component = this.templateMap.get(templateString);
+    if (component === undefined) {
       let compiledTemplate;
       try {
         compiledTemplate = compileTemplate(templateString);
       } catch (err) {
         console.error(err);
         console.error(templateString);
-        compiledTemplate = compileTemplate(`<DynamicTemplateError />`)
+        compiledTemplate = compileTemplate(`<DynamicTemplateError />`);
       }
 
-      let component = owner.factoryFor(`component:${this.componentId}`);
+      component = owner.factoryFor(`component:${this.args.componentId}`);
 
-      if(!component) {
-        component = class extends GlimmerComponent {};
+      if (component) {
+        component = class extends component.class {};
       } else {
-        component = class extends component.class {}
+        // if component couldn't be found the old way try importing it directly
+        let module;
+        try {
+          module = importSync(`/docs/${this.args.componentId}.js`);
+        } catch (err) {
+          // backing class doesn't exist so just ignore the error
+        }
+
+        component = module?.default;
+      }
+
+      if (!component) {
+        component = class extends Component {};
       }
 
-      componentName = `some-prefix-${templateId++}`;
+      setComponentTemplate(compiledTemplate, component);
 
-      owner.register(`component:${componentName}`, component);
-      owner.register(`template:components/${componentName}`, compiledTemplate);
+      // eslint-disable-next-line ember/no-side-effects
+      this.templateMap.set(templateString, component);
     }
 
-    return componentName;
-  })
-});
+    return component;
+  }
+}
diff --git a/addon/services/head-data.js b/addon/services/head-data.js
index bfbb430..e5c3909 100644
--- a/addon/services/head-data.js
+++ b/addon/services/head-data.js
@@ -2,7 +2,6 @@
 import HeadDataService from 'ember-meta/services/head-data';
 import { computed } from '@ember/object';
 import config from 'ember-get-config';
-import innertext from 'innertext';
 
 import { getExcerpt, stripHTML } from 'ember-html-excerpt/helpers/excerpt';
 
@@ -24,10 +23,6 @@ export default class CustomHeadDataService extends HeadDataService {
     return this.currentRouteMeta?.title ?? `${this.config.name} - ${this.config.tagLine ?? 'Field Guide'}`;
   }
 
-  get content() {
-    return innertext(this.currentRouteMeta.html);
-  }
-
   @computed('currentRouteMeta')
   get description() {
     let currentModel = this.currentRouteMeta;
diff --git a/addon/templates/components/dynamic-template.hbs b/addon/templates/components/dynamic-template.hbs
deleted file mode 100644
index 304b2c1..0000000
--- a/addon/templates/components/dynamic-template.hbs
+++ /dev/null
@@ -1 +0,0 @@
-{{component (ensure-safe-component (component this.componentName)) tagName=""}}
\ No newline at end of file
diff --git a/index.js b/index.js
index 72ded25..6c935b0 100644
--- a/index.js
+++ b/index.js
@@ -90,9 +90,18 @@ module.exports = {
       subdir: 'docs',
     });
 
+    let backingClasses = new Funnel(
+      'docs',
+      {
+        destDir: 'docs',
+        include: ['**/*.js']
+      }
+    );
+
     return new MergeTrees([
       docs,
       toc,
+      backingClasses,
     ]);
   },
 
diff --git a/package.json b/package.json
index 6b7045c..ba775ad 100644
--- a/package.json
+++ b/package.json
@@ -31,6 +31,7 @@
   },
   "dependencies": {
     "@babel/core": "^7.24.4",
+    "@embroider/macros": "^1.16.5",
     "@embroider/util": "^1.13.2",
     "@glimmer/component": "^1.1.2",
     "broccoli-funnel": "^3.0.3",
@@ -47,7 +48,6 @@
     "ember-meta": "^2.0.0",
     "ember-prism": "^0.13.0",
     "empress-blueprint-helpers": "^1.2.1",
-    "innertext": "^1.0.3",
     "resolve": "^1.17.0",
     "walk-sync": "^2.2.0"
   },
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index c362b35..c64d366 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -8,6 +8,9 @@ dependencies:
   '@babel/core':
     specifier: ^7.24.4
     version: 7.24.9
+  '@embroider/macros':
+    specifier: ^1.16.5
+    version: 1.16.5
   '@embroider/util':
     specifier: ^1.13.2
     version: 1.13.2(ember-source@5.8.0)
@@ -56,9 +59,6 @@ dependencies:
   empress-blueprint-helpers:
     specifier: ^1.2.1
     version: 1.2.1
-  innertext:
-    specifier: ^1.0.3
-    version: 1.0.3
   resolve:
     specifier: ^1.17.0
     version: 1.22.8
@@ -7666,10 +7666,6 @@ packages:
       whatwg-encoding: 2.0.0
     dev: true
 
-  /html-entities@1.4.0:
-    resolution: {integrity: sha512-8nxjcBcd8wovbeKx7h3wTji4e6+rhaVuPNpMqwWgnHh+N9ToqsCs6XztWRBPQ+UtzsoMAdKZtUENoVzU/EMtZA==}
-    dev: false
-
   /html-tags@3.3.1:
     resolution: {integrity: sha512-ztqyC3kLto0e9WbNp0aeP+M3kTt+nbaIveGmUxAtZa+8iFgKLUOD4YKM5j+f3QD89bra7UeumolZHKuOXnTmeQ==}
     engines: {node: '>=8'}
@@ -7894,12 +7890,6 @@ packages:
       xtend: 4.0.2
     dev: true
 
-  /innertext@1.0.3:
-    resolution: {integrity: sha512-ZC410b7IbrTrmt8bQb27xUOJgXkJu+XL6MVncb9FGyxjRIHyQqNjpSDY20zvSUttkAiYj0dait/67/sXyWvwYg==}
-    dependencies:
-      html-entities: 1.4.0
-    dev: false
-
   /inquirer@6.5.2:
     resolution: {integrity: sha512-cntlB5ghuB0iuO65Ovoi8ogLHiWGs/5yNrtUcKjFhSSiVeAIVpD7koaSU9RM8mpXw5YDi9RdYXGQMaOURB7ycQ==}
     engines: {node: '>=6.0.0'}
diff --git a/tests/acceptance/meta-test-test.js b/tests/acceptance/meta-test-test.js
index 55330ea..ec6650c 100644
--- a/tests/acceptance/meta-test-test.js
+++ b/tests/acceptance/meta-test-test.js
@@ -2,7 +2,7 @@
 import { module, test } from 'qunit';
 import { visit } from '@ember/test-helpers';
 import { setupApplicationTest } from 'ember-qunit';
-import config from '../../config/environment';
+import config from 'ember-get-config';
 
 let originalConfig;