@navita/core 0.0.0 → 0.0.2

package/createRenderer.d.ts

@@ -1,15 +1,25 @@
-import * as fela from 'fela';
-import { StyleRule } from '@navita/types';
+import { Options as Options$1, Engine, UsedIdCache } from '@navita/engine';
+export { Engine, Options as EngineOptions, UsedIdCache } from '@navita/engine';
+import { ImportMap } from '@navita/types';
+export { ImportMap } from '@navita/types';
 
-declare module 'fela' {
-    type CacheItemIsh = Parameters<Parameters<IRenderer['subscribe']>[number]>[number];
-    interface IRenderer {
-        cache: Record<string, CacheItemIsh>;
-        renderRule(rule: () => StyleRule): string;
-        renderStatic(css: StyleRule, selector: string): void;
-    }
+interface Options {
+    resolver: (filepath: string, request: string) => Promise<string>;
+    readFile: (filepath: string) => Promise<string>;
+    importMap: ImportMap;
+    engineOptions?: Options$1;
 }
-declare function createRenderer(): fela.IRenderer;
+declare function createRenderer({ resolver, readFile, importMap, engineOptions, }: Options): {
+    engine: Engine;
+    transformAndProcess({ content, filePath, }: {
+        content: string;
+        filePath: string;
+    }): Promise<{
+        result: string;
+        dependencies: string[];
+        usedIds: UsedIdCache;
+    }>;
+};
 type Renderer = ReturnType<typeof createRenderer>;
 
-export { Renderer, createRenderer };
+export { Options, Renderer, createRenderer };

package/createRenderer.js

@@ -1,325 +1,55 @@
 'use strict';
 
-var fela = require('fela');
-var felaTools = require('fela-tools');
-var types = require('node:util/types');
-var v8 = require('node:v8');
-
-function _interopNamespaceDefault(e) {
-  var n = Object.create(null);
-  if (e) {
-    Object.keys(e).forEach(function (k) {
-      if (k !== 'default') {
-        var d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: function () { return e[k]; }
-        });
-      }
-    });
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
-
-var v8__namespace = /*#__PURE__*/_interopNamespaceDefault(v8);
-
-const chars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
-const charLength = chars.length;
-function nextString(id, className = '') {
-    if (id <= charLength) {
-        return chars[id - 1] + className;
-    }
-    return nextString(id / charLength | 0, chars[(id - 1) % charLength] + className);
-}
-function generateString(getId, blacklist = []) {
-    const className = nextString(getId());
-    if (blacklist.includes(className.toLowerCase())) {
-        return generateString(getId, blacklist);
-    }
-    return className;
-}
-function className(blacklist = []) {
-    return (renderer)=>{
-        renderer.generateClassName = ()=>{
-            return generateString(renderer.getNextRuleIdentifier, blacklist);
-        };
-        renderer.generateAnimationName = ()=>{
-            return generateString(renderer.getNextKeyframeIdentifier, blacklist);
-        };
-        return renderer;
-    };
-}
-
-function createResult(renderer, filePath, isServer) {
-    const values = renderer.evaluatedResults.get(filePath) || [];
-    if (isServer && renderer.classPropertyList) {
-        // Todo: this is just a POC. It needs to be cleaned up, but it's a different build for
-        //  the server. On the client we'll use browser APIs.
-        //  We're using this class list to be able to merge during runtime.
-        const newResult = (values || []).map((item)=>{
-            if (typeof item === "string") {
-                const rules = item.split(' ').map((x)=>renderer.classPropertyList.has(x) ? [
-                        x,
-                        [
-                            ...renderer.classPropertyList.get(x)
-                        ]
-                    ] : false).filter(Boolean);
-                return `new (require('@navita/css').ClassList)("${item}", ${JSON.stringify(rules)})`;
-            }
-            return JSON.stringify(item);
-        });
-        return `const $$evaluatedValues = [${newResult}];`;
-    }
-    return `const $$evaluatedValues = ${JSON.stringify(values || [])};`;
-}
-function evaluatedResult() {
-    return (renderer)=>{
-        renderer.evaluatedResults = new Map();
-        renderer.setEvaluatedResult = (fileName, index, value)=>{
-            if (!renderer.evaluatedResults.has(fileName)) {
-                renderer.evaluatedResults.set(fileName, []);
+var engine = require('@navita/engine');
+var swc = require('@navita/swc');
+var evaluateAndProcess = require('./evaluateAndProcess.js');
+require('node:path');
+require('node:vm');
+require('node:fs');
+require('enhanced-resolve');
+require('@navita/adapter');
+
+function startsWithRSCDirective(content) {
+    return /^(['"])use client\1;?/.test(content);
+}
+
+function createRenderer({ resolver , readFile , importMap =[] , engineOptions  }) {
+    const engine$1 = new engine.Engine(engineOptions);
+    return {
+        engine: engine$1,
+        async transformAndProcess ({ content , filePath  }) {
+            const [newContent, { result , dependencies  }] = await Promise.all([
+                swc.transformer(content, {
+                    filename: filePath,
+                    importMap
+                }),
+                evaluateAndProcess.evaluateAndProcess({
+                    type: 'entryPoint',
+                    source: content,
+                    filePath,
+                    resolver,
+                    readFile,
+                    importMap,
+                    engine: engine$1
+                })
+            ]);
+            const finalContent = [];
+            // Check if content starts with "use client".
+            if (startsWithRSCDirective(content)) {
+                const [directive, ...restContent] = newContent.trim().split('\n');
+                finalContent.push(directive, result, ...restContent);
+            } else {
+                finalContent.push(result, newContent.trim());
             }
-            renderer.evaluatedResults.get(fileName)[index] = value;
-        };
-        renderer.getResult = (filePath, isServer)=>{
-            const result = createResult(renderer, filePath, isServer || false);
             return {
-                result,
-                get css () {
-                    return renderer.renderToString?.(filePath) || "";
-                }
+                result: finalContent.join('\n'),
+                dependencies,
+                usedIds: engine$1.getUsedCacheIds([
+                    filePath
+                ])
             };
-        };
-        return renderer;
-    };
-}
-
-function isMediaQuery(rule) {
-    return rule.startsWith('@media');
-}
-function isSupportsQuery(rule) {
-    return rule.startsWith('@supports');
-}
-function isPseudoSelector(rule) {
-    return rule.startsWith(':');
-}
-function wrapWith(atRule, query, content) {
-    return query.length > 0 ? `${atRule} ${query} {${content}}` : content;
-}
-function createCssRule(selector, properties) {
-    return `${selector}{${properties.map((rule)=>`${cssifyProperty(rule.property)}: ${rule.value};`).join('')}}`;
-}
-function generateCombinedMediaQuery(currentMediaQuery, nestedMediaQuery) {
-    if (currentMediaQuery.length === 0) {
-        return nestedMediaQuery;
-    }
-    return `${currentMediaQuery} and ${nestedMediaQuery}`;
-}
-function cssifyProperty(property) {
-    return property.replace(/([a-zA-Z])([A-Z])/g, '$1-$2').toLowerCase();
-}
-function isObject(value) {
-    return typeof value === 'object' && !Array.isArray(value);
-}
-function collectAndGroupRules(cssObj, currentSupportsQuery = '', currentMediaQuery = '', currentPseudoSelector = '', groupedRules = {}) {
-    for (const [property, value] of Object.entries(cssObj)){
-        if (!isObject(value)) {
-            if (!groupedRules[currentSupportsQuery]) {
-                groupedRules[currentSupportsQuery] = {};
-            }
-            const supportsGroup = groupedRules[currentSupportsQuery];
-            if (!supportsGroup[currentMediaQuery]) {
-                supportsGroup[currentMediaQuery] = {};
-            }
-            const mediaGroup = supportsGroup[currentMediaQuery];
-            if (!mediaGroup[currentPseudoSelector]) {
-                mediaGroup[currentPseudoSelector] = [];
-            }
-            mediaGroup[currentPseudoSelector].push({
-                property,
-                value
-            });
-            continue;
         }
-        if (isMediaQuery(property)) {
-            collectAndGroupRules(value, currentSupportsQuery, generateCombinedMediaQuery(currentMediaQuery, property.slice(6).trim()), currentPseudoSelector, groupedRules);
-            continue;
-        }
-        if (isSupportsQuery(property)) {
-            collectAndGroupRules(value, generateCombinedMediaQuery(currentSupportsQuery, property.slice(9).trim()), currentMediaQuery, currentPseudoSelector, groupedRules);
-            continue;
-        }
-        if (isPseudoSelector(property)) {
-            collectAndGroupRules(value, currentSupportsQuery, currentMediaQuery, currentPseudoSelector + property, groupedRules);
-        }
-    }
-    return groupedRules;
-}
-function serializeCss(selector, cssObj) {
-    const processPseudoSelectors = (pseudoSelectors)=>Object.entries(pseudoSelectors).map(([pseudo, properties])=>createCssRule(`${selector}${pseudo}`, properties)).join('');
-    const processMediaQueries = (mediaQueries)=>Object.entries(mediaQueries).map(([media, pseudoSelectors])=>wrapWith('@media', media, processPseudoSelectors(pseudoSelectors))).join('');
-    const rules = collectAndGroupRules(cssObj);
-    return Object.entries(rules).map(([supports, mediaQueries])=>wrapWith('@supports', supports, processMediaQueries(mediaQueries))).join('');
-}
-function nestedStatic() {
-    // Fela doesn't handle nested static styles correctly. This is a workaround for now.
-    // https://github.com/robinweser/fela/issues/876
-    // https://github.com/robinweser/fela/issues/465#issuecomment-594396150
-    // https://github.com/robinweser/fela/issues/863
-    return (renderer)=>{
-        const { renderStatic  } = renderer;
-        renderer.renderStatic = (staticStyle, selector)=>{
-            return renderStatic(serializeCss(selector, staticStyle), undefined);
-        };
-        return renderer;
     };
 }
 
-function renderToString() {
-    return (renderer)=>{
-        renderer.renderToString = (fileName)=>{
-            if (!renderer.getScopedCache || !renderer.accessedKeys) {
-                return felaTools.renderToString(renderer);
-            }
-            if (fileName) {
-                return felaTools.renderToString({
-                    ...renderer,
-                    cache: renderer.getScopedCache(fileName)
-                });
-            }
-            const newCache = {};
-            for (const keys of renderer.accessedKeys.values()){
-                for (const key of keys){
-                    const item = renderer.cache[key];
-                    if (!item) {
-                        continue;
-                    }
-                    newCache[key] = item;
-                }
-            }
-            return felaTools.renderToString({
-                ...renderer,
-                cache: newCache
-            });
-        };
-        return renderer;
-    };
-}
-
-function scopedCache() {
-    return (renderer)=>{
-        let currentFileName;
-        const ensureCache = ()=>{
-            if (types.isProxy(renderer.cache)) {
-                return;
-            }
-            renderer.cache = new Proxy(renderer.cache, {
-                getOwnPropertyDescriptor (target, key) {
-                    const result = Reflect.getOwnPropertyDescriptor(target, key);
-                    const { accessedKeys  } = renderer;
-                    if (!currentFileName) {
-                        return result;
-                    }
-                    if (!accessedKeys.has(currentFileName)) {
-                        accessedKeys.set(currentFileName, new Set());
-                    }
-                    accessedKeys.get(currentFileName)?.add(key);
-                    return result;
-                }
-            });
-        };
-        renderer.setFilePath = (filePath)=>{
-            currentFileName = filePath;
-            // After we've set the file path, we need to ensure that the cache is a proxy,
-            // and set up to record accessed keys.
-            // Without a filePath, the proxy on the cache doesn't make sense, so this is a good place to do it.
-            ensureCache();
-        };
-        renderer.accessedKeys = new Map();
-        renderer.clearAccessedKeys = (filePath)=>{
-            renderer.accessedKeys.get(filePath)?.clear();
-        };
-        renderer.getScopedCache = (filePath)=>{
-            const { accessedKeys  } = renderer;
-            const newCache = {};
-            if (accessedKeys.has(filePath)) {
-                const keys = accessedKeys.get(filePath);
-                for (const key of keys){
-                    const item = renderer.cache[key];
-                    if (!item) {
-                        continue;
-                    }
-                    newCache[key] = item;
-                }
-            }
-            return newCache;
-        };
-        renderer.classPropertyList = new Map();
-        renderer.subscribe((message)=>{
-            if (message.type === 'RULE') {
-                const { declaration , className  } = message;
-                const [property] = declaration.split(':');
-                if (!property) {
-                    return;
-                }
-                const { classPropertyList  } = renderer;
-                if (!classPropertyList.has(className)) {
-                    classPropertyList.set(className, new Set());
-                }
-                classPropertyList.get(className)?.add(property);
-            }
-        });
-        return renderer;
-    };
-}
-
-function serializedCache(keys = []) {
-    return (renderer)=>{
-        renderer.serialize = ()=>{
-            const obj = {};
-            for (const key of keys){
-                const value = renderer[key];
-                if (types.isProxy(value)) {
-                    obj[key] = Object.assign({}, value);
-                } else {
-                    obj[key] = value;
-                }
-            }
-            return v8__namespace.serialize(obj).toString('base64');
-        };
-        renderer.deserialize = (serialized)=>{
-            if (!serialized) {
-                return;
-            }
-            const data = v8__namespace.deserialize(Buffer.from(serialized, 'base64'));
-            for (const [key, value] of Object.entries(data)){
-                renderer[key] = value;
-            }
-        };
-        return renderer;
-    };
-}
-
-function createRenderer() {
-    return fela.createRenderer({
-        enhancers: [
-            className([
-                'ad'
-            ]),
-            scopedCache(),
-            serializedCache([
-                'cache',
-                'classPropertyList',
-                'accessedKeys',
-                'uniqueRuleIdentifier',
-                'uniqueKeyframeIdentifier'
-            ]),
-            evaluatedResult(),
-            renderToString(),
-            nestedStatic()
-        ]
-    });
-}
-
 exports.createRenderer = createRenderer;