replace-css-names - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

lib/index.js

@@ -67,3 +67,3 @@ "use strict";
         this.type = this.isString(this.config.type) ? this.config.type : "";
-        this.attributes = this.isArray(this.config.attributes) ? __spreadArray(__spreadArray([], this.config.attributes, true), ['className', 'id',], false) : ['className', 'id'];
+        this.attributes = this.isArray(this.config.attributes) ? __spreadArray(['className', 'id'], this.config.attributes, true) : ['className', 'id'];
         this.forceReplace = this.isArray(this.config.forceReplace) ? this.config.forceReplace : [];
@@ -596,22 +596,23 @@ this.encoding = this.isString(this.config.encoding) ? this.config.encoding : "UTF-8";
     };
-    ReplaceCssNames.prototype.singleForce = function (c, data) {
+    ReplaceCssNames.prototype.singleForce = function (newCode, replacement) {
         var _this = this;
         return new Promise(function (resolve) { return __awaiter(_this, void 0, void 0, function () {
-            var _a, find, type, x, match;
-            return __generator(this, function (_b) {
-                _a = this.forceReplace[c], find = _a.find, type = _a.type;
-                if (0 !== this.matches.filter(function (x) { return x.find === find && x.type === type; }).length) {
-                    for (x = 0; x < this.matches.length; x++) {
-                        if (this.matches[x].find === find && this.matches[x].type === type) {
-                            match = new RegExp('\\b' + find + '\\b', 'g');
-                            data = data.replace(match, this.matches[x].replace);
-                            break;
-                        }
+            var splitBy, find, type, lines, match, lastChar, replace;
+            return __generator(this, function (_a) {
+                splitBy = replacement.splitBy, find = replacement.find, type = replacement.type;
+                lines = newCode.split(splitBy);
+                if (1 === lines.length) {
+                    return [2, resolve(newCode)];
+                }
+                else {
+                    match = this.matches.filter(function (h) { return h.find === find && h.type === type; });
+                    if (0 !== match.length) {
+                        lastChar = splitBy.substring(splitBy.length - 1, splitBy.length);
+                        replace = match[0].replace;
+                        return [2, resolve(lines.join("" + replace + lastChar))];
                     }
+                    else {
+                        return [2, resolve(newCode)];
+                    }
                 }
-                c += 1;
-                resolve({
-                    data: data,
-                    count: c
-                });
                 return [2];
@@ -621,3 +622,3 @@ });
     };
-    ReplaceCssNames.prototype.forceReplacement = function (data) {
+    ReplaceCssNames.prototype.forceReplacement = function (source, forceReplaceValidated) {
         var _this = this;
@@ -630,21 +631,18 @@ return new Promise(function (resolve) { return __awaiter(_this, void 0, void 0, function () {
                     case 0:
-                        this.charsLength = this.forceReplace.length;
-                        walkForces = function (i) {
-                            if (i === void 0) { i = 0; }
+                        this.charsLength = forceReplaceValidated.length;
+                        walkForces = function (i, str) {
                             return new Promise(function (walkForcesResolve) { return __awaiter(_this, void 0, void 0, function () {
-                                var response;
                                 return __generator(this, function (_a) {
                                     switch (_a.label) {
-                                        case 0: return [4, this.singleForce(i, data)];
+                                        case 0: return [4, this.singleForce(str, forceReplaceValidated[i])];
                                         case 1:
-                                            response = _a.sent();
-                                            i = response.count;
-                                            data = response.data;
+                                            str = _a.sent();
+                                            i += 1;
                                             this.log(i);
-                                            if (!(undefined !== this.forceReplace[i])) return [3, 3];
-                                            return [4, walkForces(i)];
+                                            if (!(undefined !== forceReplaceValidated[i])) return [3, 3];
+                                            return [4, walkForces(i, str)];
                                         case 2:
-                                            _a.sent();
-                                            return [2, walkForcesResolve(i)];
-                                        case 3: return [2, walkForcesResolve(i)];
+                                            str = _a.sent();
+                                            return [2, walkForcesResolve(str)];
+                                        case 3: return [2, walkForcesResolve(str)];
                                     }
@@ -654,6 +652,6 @@ });
                         };
-                        return [4, walkForces()];
+                        return [4, walkForces(0, source)];
                     case 1:
-                        _a.sent();
-                        resolve(data);
+                        source = _a.sent();
+                        resolve(source);
                         return [2];
@@ -664,2 +662,33 @@ }
     };
+    ReplaceCssNames.prototype.buildForceReplace = function () {
+        var _this = this;
+        return new Promise(function (resolve) {
+            var valited = [];
+            _this.forceReplace.map(function (o) {
+                var find = o.find, type = o.type;
+                if (_this.isString(find)
+                    && find.length
+                    && _this.isString(type)
+                    && type.length
+                    && 0 !== _this.matches.filter(function (h) { return h.find === find && h.type === type; }).length) {
+                    valited.push({
+                        splitBy: find + " ",
+                        find: find,
+                        type: type
+                    });
+                    valited.push({
+                        splitBy: find + "'",
+                        find: find,
+                        type: type
+                    });
+                    valited.push({
+                        splitBy: find + "\"",
+                        find: find,
+                        type: type
+                    });
+                }
+            });
+            resolve(valited);
+        });
+    };
     ReplaceCssNames.prototype.processReact = function (source) {
@@ -669,3 +698,3 @@ var _this = this;
         return new Promise(function (resolve, reject) { return __awaiter(_this, void 0, void 0, function () {
-            var newData;
+            var newData, forceReplaceValidated;
             return __generator(this, function (_a) {
@@ -676,8 +705,11 @@ switch (_a.label) {
                         newData = _a.sent();
-                        if (!this.forceReplace.length) return [3, 3];
-                        return [4, this.forceReplacement(newData)];
+                        return [4, this.buildForceReplace()];
                     case 2:
+                        forceReplaceValidated = _a.sent();
+                        if (!forceReplaceValidated.length) return [3, 4];
+                        return [4, this.forceReplacement(newData, forceReplaceValidated)];
+                    case 3:
                         newData = _a.sent();
-                        _a.label = 3;
-                    case 3:
+                        _a.label = 4;
+                    case 4:
                         resolve(newData);
@@ -749,3 +781,3 @@ return [2];
                                             case 0:
-                                                attrToDisplay = currentAttribute.replace(/[:\"\' ]/g, '');
+                                                attrToDisplay = currentAttribute.replace(/[:\"\']/g, '');
                                                 return [4, this.lineWalk(n, lines[n], attrToDisplay)];
@@ -895,2 +927,3 @@ case 1:
     ReplaceCssNames.prototype.getReplacementsReact = function (classNames, currentAttribute) {
+        currentAttribute = currentAttribute.trim();
         if (0 === this.matches.length || 0 === classNames.length) {
@@ -921,2 +954,5 @@ return classNames;
                     if (match.length) {
+                        if (-1 !== match[0].find.indexOf('bg')) {
+                            console.log(match[0].find);
+                        }
                         find = match[0].replace;
@@ -938,2 +974,11 @@ this_1.matchResult.push({ find: find, replace: match[0].replace, type: type, attribute: currentAttribute });
     };
+    ReplaceCssNames.prototype.getReplacementReact = function (match, type) {
+        for (var x = 0; x < this.matches.length; x++) {
+            if (this.matches[x].find === match && type === this.matches[x].type) {
+                match = this.matches[x].replace;
+                break;
+            }
+        }
+        return match;
+    };
     ReplaceCssNames.prototype.getAttributes = function () {
@@ -952,8 +997,8 @@ var n = [];
         return new Promise(function (resolve) { return __awaiter(_this, void 0, void 0, function () {
-            var m, sourceCode, data, sourceCode, data;
-            return __generator(this, function (_a) {
-                switch (_a.label) {
+            var m, sourceCode, data, sourceCode, _a, data;
+            return __generator(this, function (_b) {
+                switch (_b.label) {
                     case 0:
                         if (!this.isString(this.output)) {
-                            throw new Error("Expected type string for output, got: " + typeof this.output + ".");
+                            throw new Error("Expected type string for path, got: " + typeof this.output + ".");
                         }
@@ -971,31 +1016,34 @@ if (![this.TYPE_CSS, this.TYPE_REACT].includes(this.type)) {
                     case 1:
-                        _a.sent();
+                        _b.sent();
                         return [4, this.getCurrentData()];
                     case 2:
-                        sourceCode = _a.sent();
+                        sourceCode = _b.sent();
                         return [4, this.replaceByMatches(sourceCode)];
                     case 3:
-                        data = _a.sent();
+                        data = _b.sent();
                         return [4, this.writeNewCode(data)];
                     case 4:
-                        _a.sent();
+                        _b.sent();
                         console.log();
                         resolve(data);
-                        _a.label = 5;
+                        _b.label = 5;
                     case 5:
-                        if (!(this.TYPE_REACT === this.type)) return [3, 9];
+                        if (!(this.TYPE_REACT === this.type)) return [3, 10];
                         return [4, this.getCurrentData()];
                     case 6:
-                        sourceCode = _a.sent();
-                        this.attributes = this.getAttributes();
+                        sourceCode = _b.sent();
+                        _a = this;
+                        return [4, this.getAttributes()];
+                    case 7:
+                        _a.attributes = _b.sent();
                         return [4, this.processReact(sourceCode)];
-                    case 7:
-                        data = _a.sent();
+                    case 8:
+                        data = _b.sent();
                         return [4, this.writeNewCode(data)];
-                    case 8:
-                        _a.sent();
+                    case 9:
+                        _b.sent();
                         console.log();
                         resolve(data);
-                        _a.label = 9;
-                    case 9: return [2];
+                        _b.label = 10;
+                    case 10: return [2];
                 }
@@ -1002,0 +1050,0 @@ });

package.json

 {
   "name": "replace-css-names",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "",
@@ -5,0 +5,0 @@ "main": "index.js",

Readme.md

@@ -198,5 +198,2 @@ # Replace Css Names
 
-    const ReplaceCssNames = require('replace-css-names');
-    const fs = require("fs");
-
     gulp.task('replace:react', async (done) => 
@@ -296,73 +293,2 @@ {
 
-## Example how to use it with node js (for js file)
-
-    const ReplaceCssNames = require('replace-css-names');
-    const fs = require("fs");
-
-    /**
-    * Read matches from file
-    */
-    const output = `public/_App.js`;
-    /**
-    * Remove old replace file!
-    */
-    if(fs.existsSync(output))
-    {
-        fs.unlinkSync(output);
-    }
-
-    /**
-    * Get matches
-    */
-    const matchesFile = `public/css/extracted-names-for-js`;
-
-    if(!fs.existsSync(matchesFile))
-    {
-        throw new Error(`The required file cannot be found: ${matchesFile}`);
-    }
-
-    let matches = [];
-    try{
-        matches = fs.readFileSync(matchesFile, 'UTF-8');
-        matches = JSON.parse(matches);
-    }
-    catch(e)
-    {
-        throw new Error(e);
-    }
-
-    const replace = async () =>
-    {
-        await new ReplaceCssNames(
-            {
-                path: 'build/_App.js',
-                data: 'build/_App.js',
-                output,
-                logger: {
-                    logging: true,
-                    prefix: 'Replace',
-                    displayFilename: true,
-                    displayPercentage: true,
-                    type: 'arc',
-                    barBg: 'bgCyan'
-                },
-                type: 'react',
-                matches,
-                restModulo: 10000,
-                restTime: 200,
-                displayResult: false,
-                ignore: [],
-                attributes: [],
-                forceReplace: [
-                    {
-                        find: 'bg-schema-2-1',
-                        type: 'class'
-                    }
-                ]
-            }
-        );
-    }
-
-    replace();
-
 # Example of file before replacement (css file)
@@ -399,3 +325,3 @@
 | `attributes`    | array   | Array of strings/atrribute names to replace. Default [ 'className', 'id' ]. Only available if type is 'react'
-| `forceReplace`  | array   | Array of objects - only available if type='react'. If sensitive matcher/replacer, does not replace a class or id, you can force it ( the forced name has to be availbale in the matches array). Example: [ { find: 'bg-schema-2-1', type: 'class' } ]
+| `forceReplace`  | array   | Array of strings. If sensitive match, does not replace a class or id, you can force it ( the forced name has to be availbale in the matches array)
 | `restModulo`    | number  | Each number of lines should be made a break
@@ -418,25 +344,2 @@ | `restTime`      | number  | Duration of the break in ms
 
-# forceReplace worker
-
-If an class name or id not replaced, the reason could be an dynamic added class, for example: 
-
-    # React snipped
-    #
-    # The variable 'color' (with the value 'bg-schema-2-1') 
-    # passed to a function and added at the end of an 
-    # className of JSX element. The variable color not 
-    # available inside the className attribute as readable string, 
-    # so we have to find the plain value inside the source code
-
-    var text = data.text, link = data.link, color = data.color;
-        return (react_1.default.createElement("span", { className: "color-white-block " + color },
-
-    # The variable color passed as argument (object) to a function as plain value
-    _ColorBox_1.default({
-        text: Translations_1.default('pdf.product.protein') + " " + this.itemFromDb.calculation.protein + "g",
-        color: 'bg-schema-2-1'
-    }),
-
-So its not possible to replace a variable content. We have to replace he plain string inside the generated bundle file. Its the way, how the 'forceReplace' work.
-
 # Ignore match worker
@@ -443,0 +346,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

65078

increased by5.41%

Number of package files

8

increased by60%

Lines of code

1229

increased by23.52%

Worsened metrics

Number of lines in readme file

348

decreased by-21.8%

Number of low supply chain risk alerts

5

increased by150%

No dependency changes