devextreme-themebuilder 19.1.14 → 19.1.16

package/data/metadata/dx-theme-builder-metadata.js

@@ -60789,4 +60789,4 @@ ios7_default_metadata: [
     "IsLastSubGroupItem": false
   }
 ],
-_metadata_version: "19.1.14",}
+_metadata_version: "19.1.16",}

package/modules/builder.js

@@ -1,16 +1,10 @@
 const MetadataLoader = require('./metadata-loader.js');
-
 const MetadataRepository = require('./metadata-repository.js');
-
 const LessTemplateLoader = require('./less-template-loader.js');
-
 const themes = require('./themes.js');
-
 const normalize = require('./config-normalizer');
-
 const processTheme = (config, metadata, version) => {
   const lessTemplateLoader = new LessTemplateLoader(config, version);
-
   if (config.isBootstrap) {
     const bootstrapMetadata = config.bootstrapVersion === 3 ? require('../data/bootstrap-metadata/bootstrap-metadata.js') : require('../data/bootstrap-metadata/bootstrap4-metadata.js');
     return lessTemplateLoader.analyzeBootstrapTheme(config.themeName, config.colorScheme, metadata, bootstrapMetadata, config.data, config.bootstrapVersion);
@@ -18,7 +12,6 @@ const processTheme = (config, metadata, version) => {
     return lessTemplateLoader.load(config.themeName, config.colorScheme, metadata, config.items);
   }
 };
-
 const buildTheme = config => {
   normalize(config);
   const metadataRepository = new MetadataRepository(new MetadataLoader());
@@ -32,7 +25,6 @@ const buildTheme = config => {
     return processTheme(config, metadata, version);
   });
 };
-
 module.exports = {
   buildTheme: buildTheme
 };

package/modules/config-normalizer.js

@@ -1,19 +1,14 @@
 /* global console */
-
 /* eslint no-console: 0 */
-const commands = require('./commands');
 
+const commands = require('./commands');
 const themes = require('./themes');
-
 const DEFAULT_OUT_COLOR_SCHEME = 'custom-scheme';
-
 const extname = filename => filename.substring(filename.lastIndexOf('.'));
-
 const getBootstrapConfig = fileName => {
   const extension = extname(fileName);
   let bootstrap = false;
   let version = 0;
-
   if (extension === '.scss') {
     bootstrap = true;
     version = 4;
@@ -21,47 +16,39 @@ const getBootstrapConfig = fileName => {
     bootstrap = true;
     version = 3;
   }
-
   return {
     isBootstrap: bootstrap,
     bootstrapVersion: version
   };
 };
-
 const getOutParameters = (command, themeName, config) => {
   let outputFile = config.outputFile || '';
   let outColorScheme = config.outputColorScheme || '';
   let fileFormat = config.outputFormat || extname(outputFile).substr(1);
   const makeSwatch = !!config.makeSwatch;
   const base = !!config.base;
-
   if (!outColorScheme) {
     outColorScheme = DEFAULT_OUT_COLOR_SCHEME;
   } else if (!/^[\w\-.]+$/.test(outColorScheme)) {
     console.log(`'--output-color-scheme' is not valid. '${DEFAULT_OUT_COLOR_SCHEME}' will be used.`);
     outColorScheme = DEFAULT_OUT_COLOR_SCHEME;
   }
-
   if (!fileFormat) {
     switch (command) {
       case commands.BUILD_THEME:
         fileFormat = 'css';
         break;
-
       case commands.BUILD_VARS:
         fileFormat = 'less';
         break;
-
       case commands.BUILD_META:
         fileFormat = 'json';
         break;
     }
   }
-
   if (!outputFile) {
     outputFile = 'dx.' + themeName + '.' + outColorScheme + '.' + fileFormat;
   }
-
   return {
     outputFile: outputFile,
     fileFormat: fileFormat,
@@ -70,43 +57,35 @@ const getOutParameters = (command, themeName, config) => {
     base: base
   };
 };
-
 const getThemeAndColorScheme = config => {
   let themeName = 'generic';
   let colorScheme = 'light';
   let foundTheme = null;
-
   if (config.baseTheme) {
     const dotIndex = config.baseTheme.indexOf('.');
     const passedThemeName = config.baseTheme.substr(0, dotIndex);
     const passedColorScheme = config.baseTheme.substr(dotIndex + 1).replace(/\./g, '-');
     console.log(passedThemeName, passedColorScheme);
     foundTheme = themes.find(t => t.name === passedThemeName && t.colorScheme === passedColorScheme);
-
     if (!foundTheme) {
       console.log(`The base theme with name ${config.baseTheme} does not exist.`);
     }
   } else if (config.themeId) {
     foundTheme = themes.find(t => t.themeId === parseInt(config.themeId));
-
     if (!foundTheme) {
       console.log(`The theme with ID ${config.themeId} does not exist.`);
     }
   }
-
   if (foundTheme) {
     themeName = foundTheme.name;
     colorScheme = foundTheme.colorScheme;
   }
-
   return {
     themeName: themeName,
     colorScheme: colorScheme
   };
 };
-
 const normalizePath = path => path + (path[path.length - 1] !== '/' ? '/' : '');
-
 const parseConfig = config => {
   const command = config.command;
   const metadataFilePath = config.inputFile || '';
@@ -119,15 +98,12 @@ const parseConfig = config => {
   delete config.outputFile;
   delete config.inputFile;
   delete config.themeId;
-
   if (config.lessPath) {
     config.lessPath = normalizePath(config.lessPath);
   }
-
   if (config.scssPath) {
     config.scssPath = normalizePath(config.scssPath);
   }
-
   Object.assign(config, {
     data: config.data !== undefined ? config.data : {},
     fileFormat: output.fileFormat,
@@ -141,5 +117,4 @@ const parseConfig = config => {
     base: output.base
   });
 };
-
 module.exports = parseConfig;

package/modules/less-template-loader.js

@@ -1,79 +1,62 @@
 const LessPluginAutoPrefix = require('less-plugin-autoprefix');
-
 const BOOTSTRAP_SCSS_PATH = 'bootstrap/scss/';
 const THEMEBUILDER_LESS_PATH = 'devextreme-themebuilder/data/less/';
 const SWATCH_SELECTOR_PREFIX = '.dx-swatch-';
-
 const createModifyVars = modifyVars => {
   let result = '';
-
   for (const key in modifyVars) {
     if (Object.prototype.hasOwnProperty.call(modifyVars, key)) {
       result += `@${key}: ${modifyVars[key]};`;
     }
   }
-
   return result;
 };
-
 const addSwatchClass = (less, swatchSelector, modifyVars) => {
   if (!swatchSelector) return less;
   return swatchSelector + '{' + less + createModifyVars(modifyVars) + '}';
 };
-
 class LessFontPlugin {
   process(css) {
     return css.replace(/(\f)(\d+)/g, '\\f$2');
   }
-
 }
-
 class LessMetadataPreCompilerPlugin {
   constructor(metadata, swatchSelector, modifyVars) {
     this._metadata = metadata;
     this.swatchSelector = swatchSelector;
     this.modifyVars = modifyVars;
   }
-
   process(less, context) {
     if (context && context.fileInfo.filename !== 'input') {
       return less;
     }
-
     less += '#devexpress-metadata-compiler{';
-
     for (const key in this._metadata) {
       if (Object.prototype.hasOwnProperty.call(this._metadata, key)) {
         const value = this._metadata[key];
         less += key + ': ' + value + ';';
       }
     }
-
     less += '}';
     return addSwatchClass(less, this.swatchSelector, this.modifyVars);
   }
-
 }
-
 class LessMetadataPostCompilerPlugin {
   constructor(compiledMetadata, swatchSelector, colorScheme) {
     this._metadata = compiledMetadata;
     this.swatchSelector = swatchSelector;
     this.colorScheme = colorScheme;
   }
-
   process(css) {
     const metadataRegex = new RegExp('(?:' + this.swatchSelector + '\\s*)?\\s*#devexpress-metadata-compiler\\s*\\{((.|\\n|\\r)*?)\\}');
     metadataRegex.exec(css)[1].split(';').forEach(item => {
       const rule = getCompiledRule(item);
-
       for (const key in rule) {
         if (Object.prototype.hasOwnProperty.call(rule, key)) {
           this._metadata[key] = rule[key];
         }
       }
     });
-
     if (this.swatchSelector) {
       const escapedSelector = this.swatchSelector.replace('.', '\\.');
       const customStylesDuplicateRegex = new RegExp(`\\s+${escapedSelector}\\s+\\.dx-theme-.*?-typography\\s+\\.dx-theme-.*?{[\\s\\S]*?}[\\r\\n]*?`, 'g');
@@ -81,26 +64,20 @@ class LessMetadataPostCompilerPlugin {
       const themeMarkerRegex = /(\.dx-theme-marker\s*{\s*font-family:\s*['"]dx\..*?\.)(.*)(['"])/g;
       css = css.replace(swatchOrderRegex, '$1$3$2$4').replace(customStylesDuplicateRegex, '').replace(/\s\.dx-theme-.*?-typography/g, '').replace(themeMarkerRegex, '$1' + this.colorScheme + '$3');
     }
-
     return css.replace(metadataRegex, '');
   }
-
 }
-
 const getCompiledRule = cssString => {
   let result = {};
   const ruleRegex = /([-\w\d]*)\s*:\s*(.*)\s*/;
   const matches = ruleRegex.exec(cssString);
-
   if (matches) {
     result['@' + matches[1]] = matches[2];
   } else {
     result = null;
   }
-
   return result;
 };
-
 class LessTemplateLoader {
   constructor(config, version) {
     this.readFile = config.reader;
@@ -112,36 +89,31 @@ class LessTemplateLoader {
     this.outColorScheme = config.outColorScheme;
     this.version = version;
   }
-
   load(theme, colorScheme, metadata, modifiedItems) {
     return this._loadLess(theme, colorScheme).then(less => {
       const modifyVars = {};
       const metadataVariables = {};
-
       if (Array.isArray(modifiedItems)) {
         modifiedItems.forEach(item => {
           modifyVars[item.key.replace('@', '')] = item.value;
         });
       }
-
       metadata.forEach(metaItem => {
         metadataVariables[metaItem.Key.replace('@', '')] = metaItem.Key;
       });
       return this.compileLess(less, modifyVars, metadataVariables);
     });
   }
-
   compileLess(less, modifyVars, metadata) {
     return new Promise((resolve, reject) => {
       const browsersList = require('../package.json').browserslist;
-
       const compiledMetadata = {};
-      const options = {}; // while using `less/lib/less-browser`, the global options are not passed to the `render` method, lets do it by ourselves
+      const options = {};
 
+      // while using `less/lib/less-browser`, the global options are not passed to the `render` method, lets do it by ourselves
       if (this.lessCompiler.options && typeof this.lessCompiler.options === 'object') {
         Object.assign(options, this.lessCompiler.options);
       }
-
       const customOptions = {
         modifyVars: modifyVars,
         plugins: [new LessPluginAutoPrefix({
@@ -173,7 +145,6 @@ class LessTemplateLoader {
       });
     });
   }
-
   compileScss(less, metadata) {
     return new Promise((resolve, reject) => {
       const compiledMetadata = {};
@@ -191,31 +162,25 @@ class LessTemplateLoader {
       });
     });
   }
-
   analyzeBootstrapTheme(theme, colorScheme, metadata, bootstrapMetadata, customLessContent, version) {
     let metadataVariables = '';
-
     for (const key in bootstrapMetadata) {
       if (Object.prototype.hasOwnProperty.call(bootstrapMetadata, key)) {
         metadataVariables += bootstrapMetadata[key] + ': dx-empty' + (version === 4 ? ' !default' : '') + ';';
       }
     }
-
     return new Promise(resolve => {
       const processDxTheme = data => {
         const compiledMetadata = data.compiledMetadata;
         const modifyVars = {};
-
         for (const key in compiledMetadata) {
           if (Object.prototype.hasOwnProperty.call(compiledMetadata, key)) {
             const value = compiledMetadata[key];
-
             if (value !== 'dx-empty') {
               modifyVars[key] = value;
             }
           }
         }
-
         this._loadLess(theme, colorScheme).then(less => {
           const metadataVariables = {};
           metadata.forEach(metaItem => {
@@ -230,12 +195,11 @@ class LessTemplateLoader {
           });
         });
       };
-
       if (version === 3) {
         this.compileLess(metadataVariables + customLessContent, {}, bootstrapMetadata).then(processDxTheme);
       } else if (version === 4) {
         const defaultBootstrapVariablesUrl = this.bootstrapScssPath + '_variables.scss',
-              defaultBootstrapFunctionsUrl = this.bootstrapScssPath + '_functions.scss';
+          defaultBootstrapFunctionsUrl = this.bootstrapScssPath + '_functions.scss';
         Promise.all([this.readFile(defaultBootstrapFunctionsUrl), this.readFile(defaultBootstrapVariablesUrl)]).then(files => {
           this.compileScss(files[0] + customLessContent + files[1] + metadataVariables, bootstrapMetadata).then(processDxTheme);
         }, () => {
@@ -244,23 +208,18 @@ class LessTemplateLoader {
       }
     });
   }
-
   _loadLess(theme, colorScheme) {
     const themeName = theme ? theme + '-' : '';
     return this._loadLessByFileName('theme-builder-' + themeName + colorScheme + '.less');
   }
-
   _loadLessByFileName(fileName) {
     return this.readFile(this.themeBuilderLessPath + fileName);
   }
-
   _makeInfoHeader() {
     const generatedBy = '* Generated by the DevExpress ThemeBuilder';
     const versionString = '* Version: ' + this.version;
     const link = '* http://js.devexpress.com/ThemeBuilder/';
     return ['/*', generatedBy, versionString, link, '*/'].join('\n') + '\n\n';
   }
-
 }
-
 module.exports = LessTemplateLoader;

package/modules/metadata-loader.js

@@ -1,15 +1,12 @@
 const semver = require('semver');
-
 class MetadataLoader {
   constructor() {
     this.fullMetadata = require('../data/metadata/dx-theme-builder-metadata');
     this.migrationMetadata = require('../data/migration-metadata/migration-metadata');
   }
-
   load(theme, colorScheme) {
     return new Promise(resolve => {
       const metadata = this.fullMetadata[theme + '_' + colorScheme.replace(/-/g, '_') + '_metadata'];
-
       if (semver.gte(this.version(), '18.2.8') && this.migrationMetadata[theme]) {
         this.migrationMetadata[theme].forEach(value => {
           metadata.push({
@@ -17,15 +14,11 @@ class MetadataLoader {
           });
         });
       }
-
       resolve(metadata);
     });
   }
-
   version() {
     return this.fullMetadata['_metadata_version'];
   }
-
 }
-
 module.exports = MetadataLoader;

package/modules/metadata-repository.js

@@ -3,21 +3,17 @@ class MetadataRepository {
     this.repositoryData = {};
     this.metadataLoader = metadataLoader;
   }
-
   getDataItemByKey(key, theme) {
     let result = null;
     const themeData = this.repositoryData[theme.name + '-' + theme.colorScheme];
-
     for (let i = 0; i < themeData.length; i++) {
       if (themeData[i].Key === key) {
         result = themeData[i];
         break;
       }
     }
-
     return result;
   }
-
   init(themes) {
     const promises = [];
     themes.forEach(theme => {
@@ -30,23 +26,18 @@ class MetadataRepository {
     });
     return Promise.all(promises);
   }
-
   getData(theme) {
     if (!theme) return this.repositoryData;
     return this.repositoryData[theme.name + '-' + theme.colorScheme];
   }
-
   updateData(data, theme) {
     data.forEach(item => {
       const dataItem = this.getDataItemByKey(item.key, theme);
       if (item) dataItem.Value = item.value;
     });
   }
-
   getVersion() {
     return this.metadataLoader.version();
   }
-
 }
-
 module.exports = MetadataRepository;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "devextreme-themebuilder",
-  "version": "19.1.14",
+  "version": "19.1.16",
   "description": "DevExtreme ThemeBuilder",
   "keywords": ["devextreme", "devexpress"],
   "main": "modules/builder.js",