@blueprintui/cli 0.7.1 → 0.8.0

package/.nvmrc

@@ -1 +1 @@
-20.8.0
+20.14.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## 0.8.0
+- add import attributes support
+
+## 0.7.2
+- bump dependencies
+
 ## 0.7.1
 - bump dependencies
 

package/README.md

@@ -17,7 +17,7 @@ Web Component libraries. This project is still an experimental work in progress.
 
 | Options        | Description                                |
 | -------------- | ------------------------------------------ |
-| --config        | Path for `blueprint.config.js` file          |
+| --config       | Path for `blueprint.config.js` file          |
 | --watch        | Runs build in watch mode for development   |
 
 
@@ -32,7 +32,7 @@ Web Component libraries. This project is still an experimental work in progress.
 
 | Command      | Description                   |
 | ------------ | ----------------------------- |
-| api          | API lockfile management        |
+| api          | API lockfile management       |
 
 | Options        | Description                                                                                     |
 | -------------- | ----------------------------------------------------------------------------------------------- |

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blueprintui/cli",
-  "version": "0.7.1",
+  "version": "0.8.0",
   "description": "",
   "main": "./index.mjs",
   "bin": {
@@ -14,30 +14,30 @@
   "author": "Crylan Software",
   "license": "MIT",
   "dependencies": {
-    "@custom-elements-manifest/analyzer": "0.9.0",
-    "@lit/ts-transformers": "2.0.0",
+    "@custom-elements-manifest/analyzer": "0.10.2",
+    "@lit/ts-transformers": "2.0.1",
     "@rollup/plugin-node-resolve": "15.2.3",
-    "@rollup/plugin-replace": "5.0.5",
-    "@rollup/plugin-typescript": "11.1.5",
+    "@rollup/plugin-replace": "5.0.7",
+    "@rollup/plugin-typescript": "11.1.6",
     "@rollup/plugin-virtual": "3.0.2",
     "@skypack/package-check": "0.2.2",
-    "acorn-import-attributes": "1.9.2",
+    "acorn-import-attributes": "1.9.5",
     "acorn-import-assertions": "1.9.0",
-    "browserslist": "4.22.1",
-    "commander": "11.1.0",
-    "glob": "10.3.10",
-    "lightningcss": "1.22.0",
+    "browserslist": "4.23.1",
+    "commander": "12.1.0",
+    "glob": "10.4.1",
+    "lightningcss": "1.25.1",
     "minify-html-literals": "1.3.5",
     "path": "0.12.7",
-    "rollup": "3.29.3",
+    "rollup": "4.18.0",
     "rollup-plugin-copy": "3.5.0",
+    "rollup-plugin-css-modules": "0.1.2",
     "rollup-plugin-delete": "2.0.0",
-    "rollup-plugin-import-css": "3.3.5",
     "rollup-plugin-shell": "1.0.9",
-    "terser": "5.24.0",
-    "tslib": "2.6.2",
-    "typescript": "~5.2.2",
-    "zx": "7.2.3"
+    "terser": "5.31.1",
+    "tslib": "2.6.3",
+    "typescript": "~5.4.5",
+    "zx": "8.1.2"
   },
   "devDependencies": {
     "lite-server": "2.6.1"

package/src/index.mjs

@@ -1,9 +1,8 @@
 #!/usr/bin/env node
 
 import * as url from 'url';
-import { path } from 'zx';
+import { path, spinner } from 'zx';
 import { cwd } from 'process';
-import { spinner } from 'zx/experimental';
 import { rollup, watch } from 'rollup';
 import { program } from 'commander';
 import { loadConfigFile } from 'rollup/loadConfigFile';
@@ -118,10 +117,6 @@ function buildRollup(args) {
 
         try {
           watcher.on('event', (event) => {
-            if (event.result) {
-              event.result.watchFiles = null;
-            }
-
             switch (event.code) {
               case 'START':
                 console.log(status.info, 'Building...');

package/src/plugin-minify-css.mjs

@@ -1,106 +1,31 @@
 import browserslist from 'browserslist';
-import { createFilter } from '@rollup/pluginutils';
 import { transform, browserslistToTargets } from 'lightningcss';
-import { path } from 'zx';
 
 const targets = browserslistToTargets(browserslist('Chrome > 116'));
 
-// fork of https://github.com/jleeson/rollup-plugin-import-css to enable import attributes and minificaiton
+// fork of https://github.com/justinfagnani/rollup-plugin-css-modules/tree/main
 export const css = (options = {}) => {
-  const styles = {};
-  const filter = createFilter(
-    options.include ?? ['**/*.css'],
-    options.exclude ?? []
-  );
-
-  /* function to sort the css imports in order - credit to rollup-plugin-postcss */
-  const getRecursiveImportOrder = (id, getModuleInfo, seen = new Set()) => {
-    if (seen.has(id)) return [];
-
-    seen.add(id);
-
-    const result = [id];
-
-    getModuleInfo(id).importedIds.forEach((importFile) => {
-      result.push(...getRecursiveImportOrder(importFile, getModuleInfo, seen));
-    });
-
-    return result;
-  };
-
   return {
-    name: 'import-css',
-
-    /* convert the css file to a module and save the code for a file output */
+    name: 'css-modules',
     transform(code, id) {
-      if (!filter(id)) return;
-
-      const output = options.minify
-        ? transform({
-            targets,
-            drafts: {
-              nesting: true,
-            },
-            analyzeDependencies: true,
-            code: Buffer.from(code),
-            minify: true,
-            sourceMap: false,
-          }).code.toString()
-        : code;
-
-      /* cache the result */
-      if (!styles[id] || styles[id] != output) {
-        styles[id] = output;
+      const isCssModule = this.getModuleInfo(id)?.attributes.type === 'css';
+      if (isCssModule) {
+        const output = options.minify
+          ? transform({
+              targets,
+              drafts: {
+                nesting: true,
+              },
+              analyzeDependencies: true,
+              code: Buffer.from(code),
+              minify: true,
+              sourceMap: false,
+            }).code.toString()
+          : code;
+
+        return `const stylesheet = new CSSStyleSheet();stylesheet.replaceSync(\`${output}\`);export default stylesheet;`;
       }
-
-      return {
-        code: `const sheet = new CSSStyleSheet();sheet.replaceSync(${JSON.stringify(
-          output
-        )});export default sheet;`,
-        map: { mappings: '' },
-      };
-    },
-
-    /* output a css file with all css that was imported without being assigned a variable */
-    generateBundle(opts, bundle) {
-      /* collect all the imported modules for each entry file */
-      let modules = {};
-      let entryChunk = null;
-      for (let file in bundle) {
-        modules = Object.assign(modules, bundle[file].modules);
-        if (!entryChunk) entryChunk = bundle[file].facadeModuleId;
-      }
-
-      /* get the list of modules in order */
-      const moduleIds = getRecursiveImportOrder(entryChunk, this.getModuleInfo);
-
-      /* remove css that was imported as a string */
-      const css = Object.entries(styles)
-        .sort((a, b) => moduleIds.indexOf(a[0]) - moduleIds.indexOf(b[0]))
-        .map(([id, code]) => {
-          if (!modules[id]) return code;
-        })
-        .join('\n');
-
-      /* return the asset name by going through a set of possible options */
-      const getAssetName = () => {
-        const fileName = options.output ?? opts.file ?? 'bundle.js';
-        return `${path.basename(fileName, path.extname(fileName))}.css`;
-      };
-
-      /* return the asset fileName by going through a set of possible options */
-      const getAssetFileName = () => {
-        if (options.output) return options.output;
-        if (opts.assetFileNames) return undefined;
-        return `${getAssetName()}.css`;
-      };
-
-      this.emitFile({
-        type: 'asset',
-        name: getAssetName(),
-        fileName: getAssetFileName(),
-        source: css,
-      });
+      return null;
     },
   };
 };

package/src/project/package.json

@@ -34,10 +34,10 @@
     "url": "https://cli.blueprintui.dev"
   },
   "dependencies": {
-    "lit": "^2.2.5"
+    "lit": "^3.1.4"
   },
   "devDependencies": {
-    "@blueprintui/cli": "^0.1.0",
-    "typescript": "~4.7.4"
+    "@blueprintui/cli": "^0.7.1",
+    "typescript": "~5.4.5"
   }
 }

package/src/rollup.config.mjs

@@ -6,8 +6,6 @@ import copy from 'rollup-plugin-copy';
 import del from 'rollup-plugin-delete';
 import execute from 'rollup-plugin-shell';
 import { fs, glob, path } from 'zx';
-import { importAssertions } from 'acorn-import-assertions';
-// import { importAttributes } from 'acorn-import-attributes'; // enable when TypeScript supports import attributes
 import { idiomaticDecoratorsTransformer, constructorCleanupTransformer } from '@lit/ts-transformers';
 import { fileURLToPath } from 'url';
 import { css } from './plugin-minify-css.mjs';
@@ -48,10 +46,6 @@ export default [
       sourcemap: project.sourcemap,
       sourcemapExcludeSources: true
     },
-    acornInjectPlugins: [
-      importAssertions
-      // importAttributes
-    ],
     plugins: [
       project.prod ? cleanOutDir() : [],
       css({ minify: project.prod }),