Support Embroider Pipeline

ember-theemo/.eslintignore

@@ -1,22 +1,21 @@
 # unconventional js
-/blueprints/*/files/
-/vendor/
+blueprints/*/files/
+vendor/
 
 # compiled output
-/dist/
-/tmp/
+dist/
+tmp/
 
 # dependencies
-/bower_components/
-/node_modules/
+node_modules/
 
 # misc
-/coverage/
+coverage/
 !.*
 .*/
 .eslintcache
 
 # ember-try
-/.node_modules.ember-try/
-/bower.json.ember-try
-/package.json.ember-try
+.node_modules.ember-try/
+bower.json.ember-try
+package.json.ember-try

ember-theemo/addon-main.js

@@ -8,13 +8,18 @@ const writeFile = require('broccoli-file-creator');
 const Funnel = require('broccoli-funnel');
 const mergeTrees = require('broccoli-merge-trees');
 
+// eslint-disable-next-line node/no-missing-require
+const { createConfig } = require('ember-theemo/lib');
+// eslint-disable-next-line node/no-missing-require
+const { findThemePackages } = require('ember-theemo/lib/package');
+
 const addonName = require('./package').name;
 
 const DEFAULT_OPTIONS = Object.freeze({
   /**
    * The default theme to load
    */
-  default: undefined
+  defaultTheme: undefined
 });
 
 module.exports = {
@@ -46,86 +51,29 @@ module.exports = {
   },
 
   contentFor(type) {
-    if (type !== 'head-footer') {
-      return;
+    if (type === 'body-footer') {
+      const theemoPackages = findThemePackages(this.project.pkg, this.project.root);
+      const config = createConfig(this.theemoOptions, theemoPackages);
+
+      return [
+        '<script id="theemo-config" type="application/json">',
+        JSON.stringify(config),
+        '</script>'
+      ].join('\n');
     }
 
-    const rootUrl = this.project.config(process.env.EMBER_ENV).rootURL;
+    if (type === 'head-footer' && this.theemoOptions.defaultTheme) {
+      const rootUrl = this.project.config(process.env.EMBER_ENV).rootURL;
 
-    if (this.theemoOptions.defaultTheme) {
       return `<link
-        href="${rootUrl}theemo/${this.theemoOptions.defaultTheme}.css"
-        rel="stylesheet"
-        title="${this.theemoOptions.defaultTheme}"
-        data-theemo="${this.theemoOptions.defaultTheme}"
-      >`;
-    }
-  },
-
-  findThemePackages() {
-    const keyword = 'theemo-theme';
-    const { dependencies = {}, devDependencies = {} } = this.project.pkg;
-
-    const deps = [...Object.keys(dependencies), ...Object.keys(devDependencies)];
-
-    const packages = deps
-      .map((name) => this.project.require(`${name}/package.json`))
-      .filter((json) => json.keywords && json.keywords.includes(keyword))
-      .map((json) => ({
-        name: (json.theemo && json.theemo.name) || json.name,
-        package: json
-      }));
-
-    // if (packages.length === 0) {
-    //   // throw new Error(
-    //   //   `Could not find a package with the '${keyword}' keyword.`
-    //   // );
-    // }
-    // return packages;
-
-    return packages;
-  },
-
-  treeForAddon(tree) {
-    const originalTree = this._super.treeForAddon.apply(this, tree);
-
-    // Only run for the root app.
-    if (this.parentAddon) return originalTree;
-
-    const packages = this.findThemePackages();
-
-    const themes = {};
-
-    for (const theme of packages) {
-      const theemo = theme.package.theemo || {};
-
-      themes[theme.name] = {
-        colorSchemes: theemo.colorSchemes || []
-      };
+          href="${rootUrl}theemo/${this.theemoOptions.defaultTheme}.css"
+          type="text/css"
+          rel="stylesheet"
+          title="${this.theemoOptions.defaultTheme}"
+          data-theemo="${this.theemoOptions.defaultTheme}"
+          data-embroider-ignore
+        >`;
     }
-
-    const configModuleName = `${this.name}/config`;
-    const config = {
-      options: this.theemoOptions,
-      themes
-    };
-
-    const configFile = writeFile(
-      `${configModuleName}.js`,
-      `define.exports('${configModuleName}', ${JSON.stringify(config)});`
-    );
-
-    const mergedTree = this.debugTree(
-      mergeTrees(
-        [originalTree, configFile].filter((tree) => tree !== undefined),
-        {
-          annotation: 'ember-theemo:merge-config'
-        }
-      ),
-      'treeForAddon'
-    );
-
-    return mergedTree;
   },
 
   treeForPublic(tree) {

ember-theemo/package.json

@@ -25,6 +25,7 @@
     "lint:fix": "concurrently 'npm:lint:*:fix'",
     "lint:js": "eslint . --cache",
     "lint:js:fix": "eslint . --fix",
+    "lint:types": "tsc --noEmit",
     "prepublishOnly": "pnpm build",
     "release": "release-it",
     "start": "rollup --config --bundleConfigAsCjs --watch"
@@ -35,7 +36,8 @@
     "broccoli-file-creator": "^2.1.1",
     "broccoli-funnel": "^3.0.8",
     "broccoli-merge-trees": "^4.2.0",
-    "ember-get-config": "^2.1.1"
+    "ember-get-config": "^2.1.1",
+    "unplugin": "^1.0.1"
   },
   "peerDependencies": {
     "@glimmer/tracking": "^1.1.2"
@@ -55,14 +57,18 @@
     "@gossi/config-prettier": "^0.3.0",
     "@gossi/config-targets": "^0.3.0",
     "@release-it-plugins/lerna-changelog": "^5.0.0",
+    "@rollup/plugin-commonjs": "^24.0.0",
     "@rollup/plugin-babel": "^6.0.3",
+    "@types/node": "^18.11.18",
     "concurrently": "^7.6.0",
     "ember-source": "^4.9.3",
     "eslint": "^8.30.0",
     "prettier": "^2.8.1",
     "release-it": "^15.5.1",
     "rollup": "^3.7.5",
     "rollup-plugin-ts": "^3.0.2",
+    "rollup-plugin-multi-input": "^1.3.1",
+    "type-fest": "^3.5.0",
     "typescript": "^4.9.4",
     "webpack": "^5.75.0"
   },
@@ -71,9 +77,16 @@
   },
   "exports": {
     ".": "./dist/index.js",
-    "./*": "./dist/*",
-    "./test-support": "./dist/test-support/index.js",
-    "./addon-main.js": "./addon-main.js"
+    "./addon-main.js": "./addon-main.js",
+    "./lib": {
+      "import": "./dist/lib/index.js",
+      "require": "./dist/lib/index.cjs"
+    },
+    "./lib/*": {
+      "import": "./dist/lib/*.js",
+      "require": "./dist/lib/*.cjs"
+    },
+    "./*": "./dist/*"
   },
   "ember": {
     "edition": "octane"

ember-theemo/rollup.config.js

@@ -1,57 +1,76 @@
 import ts from 'rollup-plugin-ts';
 import { Addon } from '@embroider/addon-dev/rollup';
 import { targets } from '@gossi/config-targets';
-
-const development = Boolean(process.env.ROLLUP_WATCH);
-const production = !development;
+import commonjs from '@rollup/plugin-commonjs';
+import multiInput from 'rollup-plugin-multi-input';
+import { defineConfig } from 'rollup';
 
 const addon = new Addon({
   srcDir: 'src',
   destDir: 'dist'
 });
 
-export default {
-  // This provides defaults that work well alongside `publicEntrypoints` below.
-  // You can augment this if you need to.
-  output: addon.output(),
-
-  plugins: [
-    // These are the modules that users should be able to import from your
-    // addon. Anything not listed here may get optimized away.
-    addon.publicEntrypoints(['index.ts', 'services/*.ts']),
-
-    // These are the modules that should get reexported into the traditional
-    // "app" tree. Things in here should also be in publicEntrypoints above, but
-    // not everything in publicEntrypoints necessarily needs to go here.
-    addon.appReexports(['services/*.{js,ts}']),
-
-    // This babel config should *not* apply presets or compile away ES modules.
-    // It exists only to provide development niceties for you, like automatic
-    // template colocation.
-    //
-    // By default, this will load the actual babel config from the file
-    // babel.config.json.
-    ts({
-      // can be changed to swc or other transpilers later
-      // but we need the ember plugins converted first
-      // (template compilation and co-location)
-      transpiler: 'babel',
-      browserslist: targets
-    }),
-
-    // Follow the V2 Addon rules about dependencies. Your code can import from
-    // `dependencies` and `peerDependencies` as well as standard Ember-provided
-    // package names.
-    addon.dependencies(),
-
-    // Ensure that standalone .hbs files are properly integrated as Javascript.
-    addon.hbs(),
-
-    // addons are allowed to contain imports of .css files, which we want rollup
-    // to leave alone and keep in the published output.
-    // addon.keepAssets(['**/*.css']),
-
-    // Remove leftover build artifacts when starting a new build.
-    addon.clean()
-  ]
-};
+export default defineConfig([
+  {
+    // This provides defaults that work well alongside `publicEntrypoints` below.
+    // You can augment this if you need to.
+    output: addon.output(),
+
+    external: ['node:fs', 'node:process'],
+
+    plugins: [
+      // These are the modules that users should be able to import from your
+      // addon. Anything not listed here may get optimized away.
+      addon.publicEntrypoints(['**/*.ts', 'services/*.ts']),
+
+      // These are the modules that should get reexported into the traditional
+      // "app" tree. Things in here should also be in publicEntrypoints above, but
+      // not everything in publicEntrypoints necessarily needs to go here.
+      addon.appReexports(['services/*.{js,ts}']),
+
+      // This babel config should *not* apply presets or compile away ES modules.
+      // It exists only to provide development niceties for you, like automatic
+      // template colocation.
+      //
+      // By default, this will load the actual babel config from the file
+      // babel.config.json.
+      ts({
+        transpiler: 'babel',
+        browserslist: targets
+      }),
+
+      // Follow the V2 Addon rules about dependencies. Your code can import from
+      // `dependencies` and `peerDependencies` as well as standard Ember-provided
+      // package names.
+      addon.dependencies(),
+
+      // Ensure that standalone .hbs files are properly integrated as Javascript.
+      addon.hbs(),
+
+      // addons are allowed to contain imports of .css files, which we want rollup
+      // to leave alone and keep in the published output.
+      // addon.keepAssets(['**/*.css']),
+
+      // Remove leftover build artifacts when starting a new build.
+      addon.clean()
+    ]
+  },
+  {
+    input: ['./src/lib/*.ts'],
+    output: {
+      dir: 'dist',
+      format: 'cjs',
+      entryFileNames: '[name].cjs',
+      preserveModules: true
+    },
+    external: ['unplugin', 'node:fs', 'node:process'],
+    plugins: [
+      multiInput.default(), // bcz of --bundleConfigAsCjs (we get a weird import)
+      ts({
+        transpiler: 'babel',
+        browserslist: targets
+      }),
+      commonjs()
+    ]
+  }
+]);

ember-theemo/src/index.ts

@@ -1,3 +1,4 @@
 import TheemoService from './services/theemo';
 
 export { TheemoService };
+export * from './types';

ember-theemo/src/lib/index.ts

@@ -0,0 +1,28 @@
+import { getThemeName } from './package';
+
+import type {
+  TheemoConfig,
+  TheemoDescriptor,
+  TheemoOptions,
+  TheemoPackage,
+  ThemeFeatures
+} from '../types';
+
+export function createConfig(options: TheemoOptions, packages: TheemoPackage[]): TheemoConfig {
+  const themes: Record<string, ThemeFeatures> = {};
+
+  for (const pkg of packages) {
+    const theemo: TheemoDescriptor = pkg.theemo || {};
+    const name = getThemeName(pkg);
+    const features: ThemeFeatures = {
+      colorSchemes: theemo.colorSchemes || []
+    };
+
+    themes[name] = features;
+  }
+
+  return {
+    options,
+    themes
+  };
+}