@plumeria/webpack-plugin 0.26.0 → 0.28.0

package/dist/create.js

@@ -17,23 +17,38 @@ function compileToSingleCSS(object) {
             const hashes = new Set();
             const sheets = new Set();
             (0, zss_engine_1.processAtomicProps)({ [prop]: value }, hashes, sheets);
-            const propBaseSheets = [];
-            const propQuerySheets = [];
-            for (const sheet of sheets) {
+            const hashArray = [...hashes];
+            const sheetArray = [...sheets];
+            const baseSheetParts = [];
+            const baseHashParts = [];
+            const querySheetParts = [];
+            const queryHashParts = [];
+            for (let i = 0; i < sheetArray.length; i++) {
+                const sheet = sheetArray[i];
+                const hash = hashArray[i];
                 if (sheet.includes('@media') || sheet.includes('@container')) {
-                    propQuerySheets.push(sheet);
+                    querySheetParts.push(sheet);
+                    queryHashParts.push(hash);
                 }
                 else {
-                    propBaseSheets.push(sheet);
+                    baseSheetParts.push(sheet);
+                    baseHashParts.push(hash);
                 }
             }
-            const hash = [...hashes].join(' ');
-            const sheet = [...propBaseSheets, ...propQuerySheets].join('');
-            records.push({
-                key: prop,
-                hash,
-                sheet,
-            });
+            if (baseSheetParts.length > 0) {
+                records.push({
+                    key: prop,
+                    hash: baseHashParts.join(' '),
+                    sheet: baseSheetParts.join(''),
+                });
+            }
+            if (querySheetParts.length > 0) {
+                records.push({
+                    key: prop + '__queries__',
+                    hash: queryHashParts.join(' '),
+                    sheet: querySheetParts.join(''),
+                });
+            }
         });
         if (Object.keys(nonFlat).length > 0) {
             const modNonFlat = (0, zss_engine_1.transformNestedSelectors)(nonFlat);
@@ -41,7 +56,7 @@ function compileToSingleCSS(object) {
             const nonFlatHash = (0, zss_engine_1.genBase36Hash)(nonFlatObj, 1, 7);
             const { styleSheet } = (0, zss_engine_1.transpile)(nonFlatObj, nonFlatHash);
             Object.entries(nonFlat).forEach(([atRule, nestedObj]) => {
-                Object.entries(nestedObj).forEach(([prop]) => {
+                Object.keys(nestedObj).forEach((prop) => {
                     records.push({
                         key: atRule + prop,
                         hash: nonFlatHash,
@@ -62,7 +77,9 @@ function compileToSingleCSS(object) {
             }
         });
     });
-    return [...baseSheets, ...querySheets].join('\n');
+    const baseLayer = baseSheets.length > 0 ? `@layer base {\n${baseSheets.join('')}}` : '';
+    const queryLayer = querySheets.length > 0 ? `@layer queries {\n${querySheets.join('')}}` : '';
+    return [baseLayer, queryLayer].filter(Boolean).join('\n');
 }
 function createCSS(object) {
     const compiledCSS = compileToSingleCSS(object);

package/dist/index.d.ts

@@ -1,19 +1,11 @@
 import type { Compiler } from 'webpack';
 import { CSSObject } from './types';
-interface PlumeriaPluginOptions {
-    entryPaths: string;
-}
 export declare class PlumeriaPlugin {
     private stylesByFile;
-    private currentPageFiles;
     private outFile;
-    private options;
-    constructor(options: PlumeriaPluginOptions);
+    constructor();
     apply(compiler: Compiler): void;
-    private updateCurrentPageFiles;
     registerFileStyles(filePath: string, styles: CSSObject): void;
-    private isCurrentPageFile;
     private generateOrderedCSS;
     private writeCSS;
 }
-export {};

package/dist/index.js

@@ -9,24 +9,16 @@ const fs_1 = __importDefault(require("fs"));
 const PLUGIN_NAME = 'PlumeriaPlugin';
 class PlumeriaPlugin {
     stylesByFile = new Map();
-    currentPageFiles = new Set();
     outFile;
-    options;
-    constructor(options) {
-        this.options = options;
-    }
+    constructor() { }
     apply(compiler) {
         this.outFile = path_1.default.resolve(__dirname, '..', 'zero-virtual.css');
         compiler.hooks.invalid.tap(PLUGIN_NAME, (filename) => {
             if (filename) {
                 const absPath = path_1.default.resolve(filename);
                 this.stylesByFile.delete(absPath);
-                this.currentPageFiles.delete(absPath);
             }
         });
-        compiler.hooks.watchRun.tap(PLUGIN_NAME, (compiler) => {
-            this.updateCurrentPageFiles(compiler);
-        });
         compiler.hooks.normalModuleFactory.tap(PLUGIN_NAME, (nmf) => {
             nmf.hooks.createModule.tap(PLUGIN_NAME, (createData) => {
                 const modPath = createData.matchResource ?? createData.resourceResolveData?.path;
@@ -37,26 +29,6 @@ class PlumeriaPlugin {
             });
         });
     }
-    updateCurrentPageFiles(compiler) {
-        this.stylesByFile.clear();
-        const entries = compiler.options.entry;
-        if (entries && typeof entries === 'object') {
-            this.currentPageFiles.clear();
-            Object.keys(entries).forEach((entryName) => {
-                if (entryName.startsWith(this.options.entryPaths)) {
-                    const entry = entries[entryName];
-                    if (Array.isArray(entry)) {
-                        entry.forEach((file) => {
-                            this.currentPageFiles.add(path_1.default.resolve(file));
-                        });
-                    }
-                    else if (typeof entry === 'string') {
-                        this.currentPageFiles.add(path_1.default.resolve(entry));
-                    }
-                }
-            });
-        }
-    }
     registerFileStyles(filePath, styles) {
         const absPath = path_1.default.resolve(filePath);
         const prev = this.stylesByFile.get(absPath) || {
@@ -66,20 +38,13 @@ class PlumeriaPlugin {
             tokenStyles: '',
             baseStyles: '',
         };
-        const isCurrentPage = this.isCurrentPageFile(absPath);
         const updatedStyles = {
             ...prev,
             ...styles,
-            isCurrentPage,
-            lastAccessed: Date.now(),
         };
         this.stylesByFile.set(absPath, updatedStyles);
         this.writeCSS();
     }
-    isCurrentPageFile(filePath) {
-        return (this.currentPageFiles.has(filePath) ||
-            Array.from(this.currentPageFiles).some((pageFile) => filePath.includes(path_1.default.dirname(pageFile))));
-    }
     generateOrderedCSS() {
         const allStyles = Array.from(this.stylesByFile.values());
         if (allStyles.length === 0) {
@@ -110,7 +75,8 @@ class PlumeriaPlugin {
             .join('\n');
     }
     writeCSS() {
-        const css = this.generateOrderedCSS();
+        let css = this.generateOrderedCSS();
+        css = '@layer base, queries;\n\n' + css;
         fs_1.default.writeFileSync(this.outFile, css, 'utf-8');
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plumeria/webpack-plugin",
-  "version": "0.26.0",
+  "version": "0.28.0",
   "description": "Plumeria Webpack plugin",
   "repository": {
     "type": "git",
@@ -23,7 +23,7 @@
   "devDependencies": {
     "@types/babel__core": "^7.20.5",
     "webpack": "^5.101.0",
-    "zss-engine": "^0.2.98"
+    "zss-engine": "^0.2.99"
   },
   "publishConfig": {
     "access": "public"