@master/css 2.0.0-alpha.51 → 2.0.0-alpha.52

package/esm/fill-color-scale.js

@@ -0,0 +1,59 @@
+import { hexToRgb } from './utils/hex-to-rgb';
+import { rgbToHex } from './utils/rgb-to-hex';
+export function fillColorScale(data) {
+    if (typeof data === 'string') {
+        data = { '': data };
+    }
+    const hasMainRgb = '' in data;
+    let isLevelMore100 = false;
+    for (const level in data) {
+        if (level && +level >= 100) {
+            isLevelMore100 = true;
+            break;
+        }
+    }
+    if (!isLevelMore100 && (!hasMainRgb || Object.keys(data).length > 1)) {
+        let startLevel = 0, startRgb = '0' in data
+            ? hexToRgb(data[0])
+            : [0, 0, 0], endLevel, endRgb;
+        const newLevels = [];
+        const generateColor = () => {
+            const levelDiff = endLevel - startLevel;
+            const rgbDiff = endRgb.map((color, i) => (color - startRgb[i]) / levelDiff);
+            for (const eachNewLevel of newLevels) {
+                const currentLevelDiff = eachNewLevel - startLevel;
+                const newRgb = startRgb.map((color, i) => Math.round(color + rgbDiff[i] * currentLevelDiff));
+                data[eachNewLevel] = '#' + rgbToHex.call(this, ...newRgb);
+            }
+        };
+        for (let i = 1; i < 100; i++) {
+            if (i in data) {
+                if (newLevels.length) {
+                    endLevel = i;
+                    endRgb = hexToRgb(data[i]);
+                    generateColor();
+                    newLevels.length = 0;
+                    startRgb = endRgb;
+                }
+                else {
+                    startRgb = hexToRgb(data[i]);
+                }
+                startLevel = i;
+            }
+            else {
+                newLevels.push(i);
+            }
+        }
+        if (newLevels.length) {
+            endLevel = 100;
+            endRgb = '100' in data
+                ? hexToRgb(data[100])
+                : [255, 255, 255];
+            generateColor();
+        }
+    }
+    if (!hasMainRgb) {
+        data[''] = data[isLevelMore100 ? '500' : '50'];
+    }
+    return data;
+}

package/esm/index.js

@@ -0,0 +1,9 @@
+export { default } from './core';
+export * from './rule';
+export * from './init';
+export * from './render';
+export * from './render-from-html';
+export * from './render-into-html';
+export * from './configure';
+export * from './config';
+export * from './fill-color-scale';

package/esm/init.js

@@ -0,0 +1,12 @@
+import MasterCSS from './core';
+export function init(config) {
+    if (typeof window !== 'undefined') {
+        const css = new MasterCSS(config, document.head);
+        MasterCSS.root = css;
+        css.observe(document.documentElement);
+        return css;
+    }
+    else {
+        return new MasterCSS(config);
+    }
+}

package/esm/polyfills/css-escape.d.ts

@@ -0,0 +1,2 @@
+declare const _exports: any;
+export = _exports;

package/esm/polyfills/css-escape.js

@@ -0,0 +1,90 @@
+/*! https://mths.be/cssescape v1.5.1 by @mathias | MIT license */
+;
+(function (root, factory) {
+    // https://github.com/umdjs/umd/blob/master/returnExports.js
+    if (typeof exports == 'object') {
+        // For Node.js.
+        module.exports = factory(root);
+    }
+    else if (typeof define == 'function' && define.amd) {
+        // For AMD. Register as an anonymous module.
+        define([], factory.bind(root, root));
+    }
+    else {
+        // For browser globals (not exposing the function separately).
+        factory(root);
+    }
+}(typeof global != 'undefined' ? global : this, function (root) {
+    if (root.CSS && root.CSS.escape) {
+        return root.CSS.escape;
+    }
+    // https://drafts.csswg.org/cssom/#serialize-an-identifier
+    var cssEscape = function (value) {
+        if (arguments.length == 0) {
+            throw new TypeError('`CSS.escape` requires an argument.');
+        }
+        var string = String(value);
+        var length = string.length;
+        var index = -1;
+        var codeUnit;
+        var result = '';
+        var firstCodeUnit = string.charCodeAt(0);
+        if (
+        // If the character is the first character and is a `-` (U+002D), and
+        // there is no second character, […]
+        length == 1 &&
+            firstCodeUnit == 0x002D) {
+            return '\\' + string;
+        }
+        while (++index < length) {
+            codeUnit = string.charCodeAt(index);
+            // Note: there’s no need to special-case astral symbols, surrogate
+            // pairs, or lone surrogates.
+            // If the character is NULL (U+0000), then the REPLACEMENT CHARACTER
+            // (U+FFFD).
+            if (codeUnit == 0x0000) {
+                result += '\uFFFD';
+                continue;
+            }
+            if (
+            // If the character is in the range [\1-\1F] (U+0001 to U+001F) or is
+            // U+007F, […]
+            (codeUnit >= 0x0001 && codeUnit <= 0x001F) || codeUnit == 0x007F ||
+                // If the character is the first character and is in the range [0-9]
+                // (U+0030 to U+0039), […]
+                (index == 0 && codeUnit >= 0x0030 && codeUnit <= 0x0039) ||
+                // If the character is the second character and is in the range [0-9]
+                // (U+0030 to U+0039) and the first character is a `-` (U+002D), […]
+                (index == 1 &&
+                    codeUnit >= 0x0030 && codeUnit <= 0x0039 &&
+                    firstCodeUnit == 0x002D)) {
+                // https://drafts.csswg.org/cssom/#escape-a-character-as-code-point
+                result += '\\' + codeUnit.toString(16) + ' ';
+                continue;
+            }
+            // If the character is not handled by one of the above rules and is
+            // greater than or equal to U+0080, is `-` (U+002D) or `_` (U+005F), or
+            // is in one of the ranges [0-9] (U+0030 to U+0039), [A-Z] (U+0041 to
+            // U+005A), or [a-z] (U+0061 to U+007A), […]
+            if (codeUnit >= 0x0080 ||
+                codeUnit == 0x002D ||
+                codeUnit == 0x005F ||
+                codeUnit >= 0x0030 && codeUnit <= 0x0039 ||
+                codeUnit >= 0x0041 && codeUnit <= 0x005A ||
+                codeUnit >= 0x0061 && codeUnit <= 0x007A) {
+                // the character itself
+                result += string.charAt(index);
+                continue;
+            }
+            // Otherwise, the escaped character.
+            // https://drafts.csswg.org/cssom/#escape-a-character
+            result += '\\' + string.charAt(index);
+        }
+        return result;
+    };
+    if (!root.CSS) {
+        root.CSS = {};
+    }
+    root.CSS.escape = cssEscape;
+    return cssEscape;
+}));

package/esm/render-from-html.js

@@ -0,0 +1,18 @@
+import MasterCSS from './core';
+import './polyfills/css-escape';
+export function renderFromHTML(html, css = new MasterCSS()) {
+    if (!html)
+        return;
+    const regexp = /\sclass="([^"]*)"/gm;
+    let results;
+    while (results = regexp.exec(html)) {
+        const classNames = results[1].replace(/\n/g, '').split(' ').filter(css => css);
+        for (const eachClassName of classNames) {
+            if (!(eachClassName in css.countOfName)) {
+                css.findAndInsert(eachClassName);
+                css.countOfName[eachClassName] = 1;
+            }
+        }
+    }
+    return css.rules.map(eachRule => eachRule.natives.reduce((a, b) => a + b.text, '')).join('');
+}

package/esm/render-into-html.js

@@ -0,0 +1,9 @@
+import MasterCSS from './core';
+import './polyfills/css-escape';
+import { renderFromHTML } from './render-from-html';
+export function renderIntoHTML(html, css = new MasterCSS()) {
+    if (!html)
+        return;
+    return html
+        .replace(/(<head>)/, `$1<style title="master">${renderFromHTML(html, css)}</style>`);
+}

package/esm/render.js

@@ -0,0 +1,13 @@
+import MasterCSS from './core';
+import './polyfills/css-escape';
+export function render(classes, css = new MasterCSS()) {
+    if (!classes?.length)
+        return;
+    for (const eachClassName of classes) {
+        if (!(eachClassName in css.countOfName)) {
+            css.findAndInsert(eachClassName);
+            css.countOfName[eachClassName] = 1;
+        }
+    }
+    return css.rules.map(eachRule => eachRule.natives.reduce((a, b) => a + b.text, '')).join('');
+}