UNPKG

@zohodesk/client_build_tool

Version:

A CLI tool to build web applications and client libraries

347 lines (296 loc) 11.2 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _fs = _interopRequireDefault(require("fs")); var _path = _interopRequireDefault(require("path")); var _ErrorHandler = require("../../../bundler/webpack/custom_plugins/VariableConversionCollector/ErrorHandler"); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } const convertableProps = { 'font-size': true, margin: true, 'margin-left': true, 'margin-right': true, 'margin-top': true, 'margin-bottom': true, padding: true, 'padding-top': true, 'padding-bottom': true, 'padding-left': true, 'padding-right': true, width: true, 'min-width': true, 'max-width': true, height: true, 'min-height': true, 'max-height': true, top: true, bottom: true, left: true, right: true, 'text-indent': true, clip: true, 'flex-basis': true, 'row-gap': true, gap: true, 'column-gap': true, flex: true }; const constantValues = { inherit: true, initial: true, auto: true, 'fit-content': true, unset: true, cover: true, contain: true, top: true, bottom: true, left: true, center: true, right: true }; function getNumericValue(value) { if (value.includes('var')) { return parseInt(value.replace(/var\(--zd_size(\d+)\)/gi, '$1').replace(/var\(--zd_font_size(\d+)\)/gi, '$1')); } if (value.includes('rect')) { return parseInt(value.replace('rect(', '').replace(')', '').replace(',', '')); } // Not need for this dum loop // allowed.forEach(alwdUnit => { // if (value.includes(alwdUnit)) { // return parseInt(value); // } // }); if (constantValues[value.toLowerCase()]) { return 1; } return parseInt(value); } function pxToCalc(value) { const arr = value.split(' '); arr.forEach((val, index) => { ['px'].forEach(unit => { const valWithUnit = new RegExp(`(\\d+)${unit}`, 'gi'); if (valWithUnit.test(val)) { arr[index] = val.replace(valWithUnit, '(var(--zd_size$1))'); } }); }); return arr.join(' '); } const singleConvertor = (value, changeVal, details, range) => { const { path, filename, decl } = details; if (decl.prop === 'background-position') { if (isNaN(parseInt(value))) { // console.log(`${value} skipped`); return; } } if (value == '0px') { value = value.replace('px', ''); } if (getNumericValue(value) >= range.start && getNumericValue(value) <= range.end || getNumericValue(value) === 0) { let retVal = value.replace(/(\d+)px/gi, changeVal.replace('$$', '$1')); if (/^-var/.test(retVal)) { retVal = `calc( ${retVal.substring(1)} * -1 )`; } return retVal; } // if (!value.includes('rect')) { // if(unitErrorVal && unitErrorVal != '0' ){ // console.log(value, 'not within range') const errObj = { decl, type: 'RANGE_ERROR', filename, message: `value (${value}) (${typeof value}) not within range (${range.start},${range.end})\r`, path }; _ErrorHandler.errHandler.errorTable.push(errObj); _ErrorHandler.errHandler.errorFunction(errObj); // errorFunction( // { // decl, // type: 'RANGE_ERROR', // filename, // message: `value (${value}) (${typeof value}) not within range (${ // range.start // },${range.end})\r`, // path: path // }, // 'RANGE_ERROR' // ); // } // addError(` prop: ${decl.prop} ,\n value : ${decl.value} ,\n filename : ${filename} ,\n filepath : ${path} ,\n line : ${decl.source.start.line} ,\n message : value (${value}) not within range (${range.start},${range.end})\r`) // return value; // } else { // console.log('++++++++++++++++++++++rect val!', value); // } }; var _default = ({ configFile }) => { const rawdata = _fs.default.readFileSync(configFile); const data = JSON.parse(rawdata); const { errorsAllowed, settings: settingsObject // errorLog: errorLogStatus, // errorInConsole: errorConsoleStatus } = data; // const keys = Object.keys(settingsObject); _ErrorHandler.errHandler.setAllowedErrs(errorsAllowed); const replacementArray = []; Object.keys(settingsObject).forEach(key => { Object.values(settingsObject[key].replacements).forEach(val => { if (!replacementArray.includes(val)) { replacementArray.push(val); } }); }); let regValStr = ''; replacementArray.forEach((val, index) => { if (index !== replacementArray.length - 1) { regValStr += `${val.replace('$$', '\\d+').replace('(', '\\(').replace(')', '\\)')}|`; } else { regValStr += `${val.replace('$$', '\\d+').replace('(', '\\(').replace(')', '\\)')}`; } }); const valRegex = new RegExp(regValStr, 'gi'); return { postcssPlugin: 'postcss-variable-report', Once: rootOriginal => { rootOriginal.walkRules(rule => { // rule.nodes[-1] = {} // need map, forEach fine less memory rule.nodes.forEach((decl, position) => { // case font-size const commentStr = 'variable:ignore'; const prevNode = rule.nodes[position - 1]; const fromPath = rootOriginal.source.input.from; // this will be problem for linux and mac use require('path').sep // split not need use slice and lastIndexOf less memory const filename = fromPath.split(_path.default.sep).pop(); // if(filename.includes('AddFormResponsive.module.css'){ // } if (prevNode && prevNode.type === 'comment' && prevNode.text.toLowerCase().includes(commentStr)) { const errObj = { decl, type: 'DECLARATION_IGNORED', filename, message: 'Declaration Ignored', path: fromPath }; _ErrorHandler.errHandler.errorTable.push(errObj); _ErrorHandler.errHandler.DECLARATION_IGNORED(errObj); return; } if (settingsObject[decl.prop] && !decl.value.includes('var(--')) { const settings = settingsObject[decl.prop]; // console.log(settings) const { allowed, range } = settings; // suggestion filter !decl.value.includes('calc') // Reason below some of logic happen based on this const unit = decl.value.toString() // no need round braket since you do not need group for less memory .replace(/\d+/gi, '').replace('var(--zd_size)', 'px').replace('var(--zd_font_size)', 'px').replace('rect(', '').replace(')', '').replace('px,', 'px').replace(',', '').split(' ').filter(x => x !== ''); // unit = unit.replace(unit, unit.replace('-','')) // console.log('unit : '); // console.log(unit); unit.forEach((val, index) => { allowed.forEach(alwdVal => { if (val.includes(alwdVal)) { // ## for what purpose unit[index] = val // .replace(new RegExp('(\\d+).(\\d+)(\\w+)', 'gi'), '$3') .replace(`-${alwdVal}`, `${alwdVal}`).replace(`-.${alwdVal}`, `${alwdVal}`).replace(`${alwdVal},`, `${alwdVal}`); } }); }); let unitError = false; let unitErrorVal = ''; unit.forEach(val => { if (!val.includes('calc') && decl.prop !== 'clip') { if (!allowed.includes(val.toString())) { unitError = true; unitErrorVal = val; } } }); // console.log(allowed, replacements, range) if (!unitError) { // use variable decl.value.split(' ') if (range) { // console.log('multiple :', decl.value) let newVal = ''; decl.value.split(' ').filter(Boolean).forEach(singleVal => { newVal += `${singleConvertor(singleVal, settings.replacements.px, { decl, filename, path: fromPath }, range)} `; }); decl.value = newVal; } } else if (!decl.value.includes('calc')) { // addError(` prop: ${decl.prop} ,\n value : ${decl.value} ,\n filename : ${filename} ,\n filepath : ${path} ,\n line : ${decl.source.start.line} ,\n unit : ${unitErrorVal} ,\n message : ${unitErrorVal} (Unit) Not Allowed \r`); const errObj = { decl, filename, unitErrorVal, path: fromPath }; if (unitErrorVal.trim() === '.') { errObj.type = 'DECIMAL_CHECK'; errObj.message = `${unitErrorVal} (Decimal Value) Please check`; _ErrorHandler.errHandler.errorTable.push(errObj); _ErrorHandler.errHandler.DECIMAL_CHECK(errObj); } else if (unitErrorVal.includes('.') && !unitErrorVal.includes('%')) { errObj.type = 'DECIMAL_REJECT'; errObj.message = `${unitErrorVal} (Decimal Value) Not Allowed \r`; _ErrorHandler.errHandler.errorTable.push(errObj); _ErrorHandler.errHandler.DECIMAL_REJECT(errObj); } else if (!unitErrorVal.includes('%')) { errObj.type = 'UNIT_ERROR'; errObj.message = `${unitErrorVal} (Unit) Not Allowed`; _ErrorHandler.errHandler.errorTable.push(errObj); _ErrorHandler.errHandler.UNIT_ERROR(errObj); } } else { decl.value = pxToCalc(decl.value); } } else { if (settingsObject[decl.prop] && decl.value && decl.value.includes('px') && decl.value.includes('var(--')) { const valArr = decl.value.split(' '); const settings = settingsObject[decl.prop]; const { range } = settings; const convertedVals = valArr.map(val => { if (val.includes('px')) { const convertedVal = singleConvertor(val, settings.replacements.px, { decl, filename, path: fromPath }, range); return convertedVal || val; } return val; }); decl.value = convertedVals.join(' '); } if (decl.prop && decl.value && !decl.prop.includes('--') && valRegex.test(decl.value) && (settingsObject[decl.prop] || convertableProps[decl.prop]) && decl.value.includes('var') && !decl.value.includes('calc')) { const errObj = { decl, type: 'VARIABLE_PRESENT', filename, message: `value (${decl.value}) has var in it, kindly check`, path: fromPath }; _ErrorHandler.errHandler.errorTable.push(errObj); _ErrorHandler.errHandler.VARIABLE_PRESENT(errObj); } } }); }); } }; }; exports.default = _default;