@blueprintui/cli 0.0.0

package/custom-elements-manifest.config.mjs

@@ -0,0 +1,40 @@
+// import { readonlyPlugin } from 'cem-plugin-readonly';
+import { resolve } from 'path';
+
+const cwd = process.cwd();
+
+export default {
+  globs: [resolve(cwd, './src/**/element.ts')],
+  outdir: './dist/lib',
+  litelement: true,
+  plugins: [tsExtensionPlugin(), baseDir(), orderElements()],
+};
+
+export function orderElements() {
+  return {
+    name: 'order-elements',
+    packageLinkPhase({ customElementsManifest }) {
+      customElementsManifest.modules.sort((a, b) => (a.path < b.path ? -1 : 1));
+    },
+  };
+}
+
+export function baseDir(config = { baseDir: 'src' }) {
+  return {
+    name: 'base-dir',
+    packageLinkPhase({ customElementsManifest }) {
+      customElementsManifest.modules = JSON.parse(
+        JSON.stringify(customElementsManifest.modules).replaceAll(`"/${config.baseDir}/`, '"').replaceAll(`"${config.baseDir}/`, '"')
+      );
+    },
+  };
+}
+
+export function tsExtensionPlugin() {
+  return {
+    name: 'ts-extensions',
+    packageLinkPhase({ customElementsManifest }) {
+      customElementsManifest.modules = JSON.parse(JSON.stringify(customElementsManifest.modules).replace(/\.ts"/g, '.js"'));
+    },
+  };
+}

package/index.mjs

@@ -0,0 +1,105 @@
+#!/usr/bin/env node
+
+// const path = require('path');
+// const url = require('url');
+// const loadConfigFile = require('rollup/loadConfigFile');
+// const rollupModule = require('rollup');
+// const commander = require('commander');
+// const { rollup, watch } = rollupModule;
+// const { program } = commander;
+
+import path from 'path';
+import * as url from 'url';
+import loadConfigFile from 'rollup/loadConfigFile';
+import { rollup, watch } from 'rollup';
+import { program } from 'commander';
+
+const __dirname = url.fileURLToPath(new URL('.', import.meta.url));
+const ERROR = '\x1b[31m%s\x1b[0m'; //red
+const WARN = '\x1b[33m%s\x1b[0m'; //yellow
+const INFO = '\x1b[36m%s\x1b[0m'; //cyan
+const SUCCESS = '\x1b[32m%s\x1b[0m'; //green
+
+program
+  .command('build')
+  .option('--config', 'path for custom config')
+  .option('--watch')
+  .option('--prod')
+  .description('build library')
+  .action((options, command) => {
+    process.env.BLUEPRINTUI_BUILD = options.prod || !options.watch ? 'production' : 'development';
+    // const configPath = path.resolve(command.args[0]);
+    // const baseDir = configPath.replace('blueprint.config.js', '');
+    // const dist = resolve(baseDir, config.dist);
+    buildRollup(options);
+  });
+
+program.parse();
+
+function buildRollup(args) {
+  loadConfigFile(path.resolve(__dirname, './rollup.config.js'), {}).then(
+    async ({ options, warnings }) => {
+      if (warnings.count) {
+        console.log(`${warnings.count} warnings`);
+      }
+
+      warnings.flush();
+
+      if (!args.watch) {
+        const start = Date.now();
+        let bundle;
+        let buildFailed = false;
+        try {
+          console.log(INFO, 'Building...');
+          bundle = await rollup(options[0]);
+          await bundle.write(options[0].output[0]);
+        } catch (error) {
+          buildFailed = true;
+          console.error(ERROR, error);
+        }
+        if (bundle) {
+          const end = Date.now();
+          console.log(SUCCESS, `Completed in ${(end - start) / 1000} seconds 🎉`);
+          await bundle.close();
+        }
+        process.exit(buildFailed ? 1 : 0);
+      }
+
+      if (args.watch) {
+        const watcher = watch(options[0]);
+
+        try {
+          watcher.on('event', (event) => {
+            if (event.result) {
+              event.result.watchFiles = null;
+            }
+
+            switch (event.code) {
+              case 'START':
+                console.log(INFO, 'Building...');
+                break;
+              case 'ERROR':
+                console.error(ERROR, event.error);
+                event.result.close();
+                break;
+              case 'WARN':
+                console.error(ERROR, event.error);
+                break;
+              case 'BUNDLE_END':
+                console.log(SUCCESS, `Complete in ${event.duration / 1000} seconds`);
+                event.result.close();
+                break;
+            }
+          });
+        } catch (error) {
+          console.error(error);
+        }
+        watcher.on('event', ({ result }) => {
+          if (result) {
+            result.close();
+          }
+        });
+      }
+    }
+  );
+}

package/package.json

@@ -0,0 +1,38 @@
+{
+  "name": "@blueprintui/cli",
+  "version": "0.0.0",
+  "description": "",
+  "main": "./index.mjs",
+  "bin": {
+    "bp": "./index.mjs"
+  },
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "MIT",
+  "dependencies": {
+    "@custom-elements-manifest/analyzer": "^0.6.1",
+    "@lit/ts-transformers": "^1.1.1",
+    "@rollup/plugin-node-resolve": "^13.3.0",
+    "@rollup/plugin-replace": "^4.0.0",
+    "@rollup/plugin-typescript": "^8.3.2",
+    "@rollup/plugin-virtual": "^2.1.0",
+    "@skypack/package-check": "^0.2.2",
+    "acorn-import-assertions": "^1.8.0",
+    "commander": "^9.2.0",
+    "csso": "^5.0.3",
+    "fs-extra": "^10.1.0",
+    "glob": "^8.0.3",
+    "path": "^0.12.7",
+    "rollup": "^2.74.1",
+    "rollup-plugin-copy": "^3.4.0",
+    "rollup-plugin-delete": "^2.0.0",
+    "rollup-plugin-import-assert": "^2.1.0",
+    "rollup-plugin-minify-html-literals": "^1.2.6",
+    "rollup-plugin-shell": "^1.0.3",
+    "rollup-plugin-terser": "^7.0.2",
+    "tslib": "2.3.1",
+    "typescript": "4.6.4"
+  }
+}

package/rollup.config.js

@@ -0,0 +1,172 @@
+import * as fs from 'fs-extra';
+import * as glob from 'glob';
+import typescript from '@rollup/plugin-typescript';
+import nodeResolve from '@rollup/plugin-node-resolve';
+import replace from '@rollup/plugin-replace';
+import virtual from '@rollup/plugin-virtual';
+import copy from 'rollup-plugin-copy';
+import del from 'rollup-plugin-delete';
+import minifyHTML from 'rollup-plugin-minify-html-literals';
+import execute from 'rollup-plugin-shell';
+import { terser } from 'rollup-plugin-terser';
+import { resolve, extname } from 'path';
+import { importAssertionsPlugin } from 'rollup-plugin-import-assert';
+import { importAssertions } from 'acorn-import-assertions';
+import { idiomaticDecoratorsTransformer, constructorCleanupTransformer } from '@lit/ts-transformers';
+import * as csso from 'csso';
+import { exec as _exec } from 'child_process';
+import { promisify } from 'util';
+import { dirname } from 'path';
+import { fileURLToPath } from 'url';
+
+const exec = promisify(_exec);
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = dirname(__filename)
+
+
+const config = {
+  externals: [/^tslib/, /^lit/, /^@lit-labs\/context/, /^@floating-ui\/dom/, /^date-fns/, /^@blueprintui/],
+  assets: ['./README.md', './LICENSE', './package.json'],
+  baseDir: './src',
+  outDir: './dist/lib',
+  entryPoints: ['./src/**/index.ts', './src/include/*.ts'],
+  tsconfig: './tsconfig.json',
+  customElementsManifestConfig: './custom-elements-manifest.config.mjs',
+  sourcemap: false,
+};
+
+const cwd = process.cwd();
+const project = {
+  externals: config.externals,
+  packageFile: resolve(cwd, './package.json'),
+  assets: config.assets.map(a => resolve(cwd, a)),
+  baseDir: resolve(cwd, config.baseDir),
+  outDir: resolve(cwd, config.outDir),
+  entryPoints: config.entryPoints.map(e => resolve(cwd, e)),
+  tsconfig: resolve(cwd, config.tsconfig),
+  customElementsManifestConfig: resolve(__dirname, config.customElementsManifestConfig),
+  prod: process.env.BLUEPRINTUI_BUILD === 'production',
+  sourcemap: config.sourcemap
+}
+
+export default [
+  {
+    external: project.externals,
+    input: 'library-entry-points',
+    treeshake: false,
+    preserveEntrySignatures: 'strict',
+    output: {
+      format: 'esm',
+      dir: project.outDir,
+      preserveModules: true,
+      sourcemap: project.sourcemap,
+      sourcemapExcludeSources: true
+    },
+    acornInjectPlugins: [importAssertions],
+    plugins: [
+      // del({ targets: [project.outDir], hook: 'buildStart', runOnce: true }),
+      copyAssets(),
+      project.prod ? cssOptimize() : [],
+      importAssertionsPlugin(),
+      createEntrypoints(),
+      nodeResolve({ exportConditions: [project.prod ? 'production' : 'development'] }),
+      compileTypescript(),
+      project.prod ? [] : typeCheck(),
+      project.prod ? [] : writeCache(),
+      project.prod ? minifyHTML() : [],
+      project.prod ? minifyJavaScript() : [],
+      project.prod ? inlinePackageVersion() : [],
+      project.prod ? postClean(): [],
+      // project.prod ? customElementsAnalyzer() : [],
+      // project.prod ? packageCheck() : [],
+    ],
+  },
+];
+
+function copyAssets() {
+  return copy({ copyOnce: true, targets: project.assets.map(src => ({ src, dest: config.outDir }))});
+}
+
+function createEntrypoints() {
+  return virtual({ 'library-entry-points': [...project.entryPoints.flatMap(i => glob.sync(i))].map(entry => `export * from '${entry}';`).join('\n') });
+}
+
+function compileTypescript() {
+  return typescript({
+    tsconfig: project.tsconfig,
+    noEmitOnError: project.prod,
+    compilerOptions: { sourceMap: project.sourcemap },
+    transformers: {
+      before: [{ type: 'program', factory: idiomaticDecoratorsTransformer }],
+      after: [{ type: 'program', factory: constructorCleanupTransformer }],
+    }
+  });
+}
+
+function typeCheck() {
+  return execute({ commands: [`tsc --noEmit --project ${project.tsconfig}`], hook: 'buildEnd' });
+}
+
+function minifyJavaScript() {
+  return terser({ ecma: 2022, module: true, format: { comments: false }, compress: { passes: 2, unsafe: true } });
+}
+
+function inlinePackageVersion() {
+  return replace({ preventAssignment: false, values: { PACKAGE_VERSION: fs.readJsonSync(project.packageFile).version } })
+}
+
+function postClean() {
+  return del({ targets: [`${project.outDir}/**/.tsbuildinfo`, `${project.outDir}/**/_virtual`, `${project.outDir}/**/*.spec.d.ts`, `${project.outDir}/**/*.performance.d.ts`], hook: 'writeBundle' });
+}
+
+function packageCheck() {
+  return execute({ commands: [`package-check --cwd ${project.outDir}`], sync: true, hook: 'writeBundle' });
+};
+
+function customElementsAnalyzer() {
+  let copied = false;
+  return {
+    name: 'custom-elements-analyzer',
+    writeBundle: async () => {
+      console.log('custom-elements-analyzer');
+      if (copied) {
+        return;
+      } else {
+        await exec(`cem analyze --config ${project.customElementsManifestConfig}`);
+        const json = await fs.readJson(project.packageFile);
+        const packageFile = { ...json, customElements: './custom-elements.json', scripts: undefined, devDependencies: undefined };
+        await fs.writeFile(`${project.outDir}/package.json`, JSON.stringify(packageFile, null, 2));
+      }
+    }
+  };
+}
+
+function cssOptimize() {
+  return {
+    load(id) { return id.slice(-4) === '.css' ? this.addWatchFile(resolve(id)) : null },
+    transform: async (css, id) => id.slice(-4) === '.css' ? ({ code: csso.minify(css, { comments: false }).css, map: { mappings: '' } }) : null
+  };
+};
+
+const fileCache = {};
+/**
+ * Rollup plugin for local file writes
+ * Compares the output of rollup to the current file on disk. If same it will
+ * prevent rollup from writting to the file again preventing file watchers from being triggered
+ */
+function writeCache() {
+  return {
+    name: 'esm-cache',
+    generateBundle(_options, bundles) {
+      for (const [key, bundle] of Object.entries(bundles)) {
+        const path = `${project.outDir}/${bundle.fileName}`;
+
+        if (extname(path) === '.js' && fileCache[path] !== bundle.code) {
+          fileCache[path] = bundle.code;
+        } else {
+          delete bundles[key];
+        }
+      }
+    },
+  };
+};