Rebuild ember-css-modules on top of the new transform

Author: dfreeman

packages/ember-css-modules/addon/-runtime.js

@@ -0,0 +1 @@
+export * from 'glimmer-local-class-transform/-runtime';

packages/ember-css-modules/addon/helpers/local-class.js

@@ -12,27 +12,6 @@ module.exports = function (defaults) {
     'ember-cli-babel': {
       throwUnlessParallelizable: true,
     },
-
-    cssModules: {
-      _silenceAfterModuleDeprecation: true,
-      headerModules: [
-        'dummy/styles/testing/ordering/h',
-        'dummy/styles/testing/ordering/g',
-      ],
-      footerModules: [
-        'dummy/styles/testing/ordering/t',
-        'dummy/styles/testing/ordering/u',
-      ],
-      virtualModules: {
-        'virtual-constants': {
-          superbold: 800,
-          'important-background': 'rgb(255, 255, 0)',
-        },
-      },
-      plugins: {
-        postprocess: [require('postcss-color-rebeccapurple')()],
-      },
-    },
   });
 
   const { maybeEmbroider } = require('@embroider/test-setup');

packages/ember-css-modules/addon/index.js

@@ -4,7 +4,7 @@ const path = require('path');
 const fs = require('fs');
 const debug = require('debug')('ember-css-modules:addon');
 
-const HtmlbarsPlugin = require('./lib/htmlbars-plugin');
+const { localClassRegistryPlugin } = require('glimmer-local-class-transform');
 const ModulesPreprocessor = require('./lib/modules-preprocessor');
 const OutputStylesPreprocessor = require('./lib/output-styles-preprocessor');
 const PluginRegistry = require('./lib/plugin/registry');
@@ -61,12 +61,20 @@ module.exports = {
       );
     }
 
+    let fileExtension = `.${this.getFileExtension()}`;
+    let defaultExtension = this.includeExtensionInModulePath()
+      ? fileExtension
+      : '';
+    let runtimeModule = 'ember-css-modules/-runtime';
+    let pathMapping = {
+      '/template\\.hbs$': `/styles${defaultExtension}`,
+      '/templates/(.*/)?(.*)\\.hbs$': `/styles/$1$2${defaultExtension}`,
+      '(\\.g?[tj]s|\\.hbs)+$': fileExtension,
+    };
+
     this.parentPreprocessorRegistry.add(
       'htmlbars-ast-plugin',
-      HtmlbarsPlugin.instantiate({
-        fileExtension: this.getFileExtension(),
-        includeExtensionInModulePath: this.includeExtensionInModulePath(),
-      })
+      localClassRegistryPlugin({ pathMapping, runtimeModule })
     );
   },
 
@@ -151,9 +159,7 @@ module.exports = {
   },
 
   getFileExtension() {
-    return (
-      (this.cssModulesOptions && this.cssModulesOptions.extension) || 'css'
-    );
+    return (this.cssModulesOptions.extension ?? 'css').replace(/^\./, '');
   },
 
   includeExtensionInModulePath() {