css-engine-test-pb 0.1.8 → 0.2.0

package/dist/compiler.d.ts

@@ -1,8 +1,9 @@
 import { StyleRule, StyleBucket } from './types';
-interface CompiledRule {
+export interface CompiledRule {
     className: string;
     cssText: string;
     bucket: StyleBucket;
+    propertyKey?: string;
 }
 export type CompileMode = 'atomic' | 'monolithic';
 export declare class StyleCompiler {
@@ -18,4 +19,3 @@ export declare class StyleCompiler {
     private processCombinators;
     private processMediaQueries;
 }
-export {};

package/dist/compiler.js

@@ -154,10 +154,12 @@ export class StyleCompiler {
             if (media) {
                 cssText = `${media} { ${cssRule} }`;
             }
+            const propertyKey = `${kebabProperty}${pseudo || ''}${media || ''}`;
             rules.push({
                 className,
                 cssText,
-                bucket
+                bucket,
+                propertyKey
             });
         });
     }

package/dist/engine.d.ts

@@ -1,4 +1,5 @@
 import { StyleRule, StyleSlots, GeneratedClasses } from './types';
+export declare const atomicClassMap: Map<string, string>;
 export declare class StyleEngine {
     private compiler;
     private insertion;

package/dist/engine.js

@@ -1,5 +1,6 @@
 import { StyleCompiler } from './compiler';
 import { InsertionFactory } from './insertionFactory';
+export const atomicClassMap = new Map();
 export class StyleEngine {
     constructor() {
         this.compiler = new StyleCompiler();
@@ -14,6 +15,9 @@ export class StyleEngine {
         const rules = this.compiler.compile(styleDefinition, mode);
         rules.forEach(rule => {
             this.insertion.insertRule(rule.cssText, rule.bucket);
+            if (rule.propertyKey) {
+                atomicClassMap.set(rule.className, rule.propertyKey);
+            }
         });
         const classNames = Array.from(new Set(rules.map(r => r.className))).join(' ');
         this.cache.set(cacheKey, classNames);
@@ -35,6 +39,7 @@ export class StyleEngine {
     clear() {
         this.insertion.clear();
         this.cache.clear();
+        atomicClassMap.clear();
     }
 }
 let globalEngine = null;

package/dist/mergeClasses.js

@@ -1,3 +1,20 @@
+import { atomicClassMap } from './engine';
 export function mergeClasses(...classNames) {
-    return classNames.filter(Boolean).join(' ');
+    const allClasses = classNames
+        .filter((cn) => Boolean(cn))
+        .flatMap(cn => cn.split(' '));
+    const propertyWins = new Map();
+    const nonAtomic = [];
+    const seenNonAtomic = new Set();
+    for (const cls of allClasses) {
+        const propKey = atomicClassMap.get(cls);
+        if (propKey) {
+            propertyWins.set(propKey, cls);
+        }
+        else if (!seenNonAtomic.has(cls)) {
+            seenNonAtomic.add(cls);
+            nonAtomic.push(cls);
+        }
+    }
+    return [...nonAtomic, ...propertyWins.values()].join(' ');
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "css-engine-test-pb",
-  "version": "0.1.8",
+  "version": "0.2.0",
   "description": "",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",