@zohodesk/react-cli 1.1.18 → 1.1.19-exp.10

package/packages/client_build_tool/lib/shared/constants.js

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.cliRootPath = exports.cliNodeModulesPath = exports.babelrcPath = exports.appPath = exports.appNodeModules = exports.CONFIG_ROOT = exports.BASE_CONFIG_KEY = void 0;
+exports.getTemplatePath = getTemplatePath;
+exports.joinWithAppPath = joinWithAppPath;
+exports.templatesPath = void 0;
+
+var _path = _interopRequireWildcard(require("path"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+const BASE_CONFIG_KEY = 'react-cli';
+exports.BASE_CONFIG_KEY = BASE_CONFIG_KEY;
+
+const cliRootPath = _path.default.resolve(__dirname, '..', '..');
+
+exports.cliRootPath = cliRootPath;
+const CONFIG_ROOT = 'client-build-config';
+exports.CONFIG_ROOT = CONFIG_ROOT;
+
+const cliNodeModulesPath = _path.default.resolve(cliRootPath, 'node_modules');
+
+exports.cliNodeModulesPath = cliNodeModulesPath;
+const babelrcPath = (0, _path.join)(cliRootPath, '.babelrc');
+exports.babelrcPath = babelrcPath;
+const appPath = process.cwd();
+exports.appPath = appPath;
+
+function joinWithAppPath(filePath) {
+  // TODO: test in windows
+  return (0, _path.join)(appPath, filePath);
+}
+
+;
+const appNodeModules = joinWithAppPath('node_modules');
+exports.appNodeModules = appNodeModules;
+const templatesPath = (0, _path.join)(__dirname, '..', '..', 'templates');
+exports.templatesPath = templatesPath;
+
+function getTemplatePath(...filePath) {
+  // TODO: test in windows
+  return (0, _path.join)(templatesPath, ...filePath);
+}

package/packages/client_build_tool/lib/shared/fileUtils/copyFile.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.copyFile = copyFile;
+exports.createParentDir = createParentDir;
+exports.writeFile = writeFile;
+
+var _fs = require("fs");
+
+var _path = _interopRequireDefault(require("path"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function createParentDir(filename) {
+  const {
+    dir
+  } = _path.default.parse(filename);
+
+  if (!(0, _fs.existsSync)(dir)) {
+    (0, _fs.mkdirSync)(dir, {
+      recursive: true
+    });
+  }
+}
+
+function copyFile(filename, outputFile) {
+  createParentDir(outputFile);
+  const readStream = (0, _fs.createReadStream)(filename);
+  const writeStream = (0, _fs.createWriteStream)(outputFile);
+  return readStream.pipe(writeStream);
+}
+
+function writeFile(filename, data) {
+  createParentDir(filename);
+  return (0, _fs.writeFileSync)(filename, data);
+}

package/packages/client_build_tool/lib/shared/fileUtils/directoryIterator.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.directoryIterator = directoryIterator;
+
+var _fs = require("fs");
+
+var _path = require("path");
+
+function directoryIterator(filename, callback) {
+  if (!(0, _fs.statSync)(filename).isDirectory()) {
+    callback(filename);
+    return;
+  }
+
+  (0, _fs.readdirSync)(filename).forEach(fileOrDir => {
+    directoryIterator((0, _path.join)(filename, fileOrDir), callback);
+  });
+}

package/packages/client_build_tool/lib/shared/fileUtils/watchRun.js

@@ -0,0 +1,112 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.watchRun = watchRun;
+
+var _path = _interopRequireDefault(require("path"));
+
+var _watcher = _interopRequireDefault(require("watcher"));
+
+var _runBabelForJSFile = require("../babel/runBabelForJSFile");
+
+var _runBabelForTsFile = require("../babel/runBabelForTsFile");
+
+var _runPostCssForCssFile = require("../postcss/runPostCssForCssFile");
+
+var _directoryIterator = require("./directoryIterator");
+
+var _copyFile = require("./copyFile");
+
+var _logger = require("../../logger");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+const isJs = ext => ext === '.js';
+
+const isTs = ext => ext === '.ts' || ext === '.tsx';
+
+const isCss = ext => ext === '.css';
+
+function watchRun({
+  options,
+  src,
+  target,
+  canWatch,
+  mode
+}) {
+  let updatedFileCount = 0;
+
+  function doWorkForSeparateFile(filename) {
+    const outputFile = filename.replace(src, target);
+
+    const {
+      ext
+    } = _path.default.parse(filename);
+
+    if (isJs(ext)) {
+      (0, _runBabelForJSFile.runBabelForJSFile)({
+        filename,
+        outputFile,
+        options,
+        mode
+      });
+    } else if (isCss(ext)) {
+      (0, _runPostCssForCssFile.runPostCssForCssFile)({
+        filename,
+        outputFile,
+        options
+      });
+    } else if (isTs(ext)) {
+      (0, _runBabelForTsFile.runBabelForTSFile)({
+        filename,
+        outputFile,
+        options,
+        mode
+      });
+    } else {
+      (0, _copyFile.copyFile)(filename, outputFile);
+    }
+
+    updatedFileCount++;
+  }
+
+  function doWork(foldername) {
+    updatedFileCount = 0;
+    const startTime = Date.now();
+    (0, _directoryIterator.directoryIterator)(foldername, filename => {
+      try {
+        doWorkForSeparateFile(filename);
+      } catch (error) {
+        (0, _logger.messageLogger)(`ERROR In: ${filename}`);
+        (0, _logger.messageLogger)(error);
+      }
+    });
+    (0, _logger.messageLogger)(`Successfully compiled ${updatedFileCount} files with Babel and Post-CSS (${Date.now() - startTime}ms).`);
+  }
+
+  doWork(src);
+
+  if (canWatch) {
+    const watcher = new _watcher.default(src, {
+      recursive: true,
+      ignoreInitial: true,
+      ignore: filename => filename.indexOf('__tests__') !== -1 // remove the test cases 
+
+    });
+    watcher.on('all', (event, filename) => {
+      if (event === 'unlink' || event === 'unlinkDir') {
+        return;
+      }
+
+      doWork(filename); // This is what the library does internally when you pass it a handler directly
+      //   arguments [0] (event); // => could be any target event: 'add', 'addDir', 'change', 'rename', 'renameDir', 'unlink' or 'unlinkDir'
+      //   arguments [1] (filename); // => the file system path where the event took place, this is always provided
+      //   arguments [2] (targetPathNext); // => the file system path "targetPath" got renamed to, this is only provided on 'rename'/'renameDir' events
+    });
+    watcher.on('error', error => {
+      (0, _logger.messageLogger)(error); // => true, "Error" instances are always provided on "error"
+    });
+  }
+}

package/packages/client_build_tool/lib/shared/postcss/__test__/ignoreTestCases.test.js

@@ -0,0 +1,80 @@
+"use strict";
+
+/* eslint-disable max-lines */
+const ignore = require('ignore');
+
+function checkIsPatternsMatchFilename(patterns, filename) {
+  return patterns.length ? ignore({
+    allowRelativePaths: true
+  }).add(patterns).ignores(filename) : true;
+}
+
+const testCases = [{
+  name: 'css selector',
+  patterns: ['common.*', 'layout.*'],
+  passtests: ['../../../client_build_tool/packages/client_build_tool/node_modules/react/common.css', '../../../client_build_tool/packages/client_build_tool/react/common.css', '../../../client_build_tool/packages/client_build_tool/node_modules/react/common/common.css', '../../../client_build_tool/packages/client_build_tool/node_modules/react/common/li/layout.css', '../../../client_build_tool/packages/client_build_tool/node_modules/react/common/li/common.css', '../../../client_build_tool/packages/client_build_tool/node_modules/react/layout.css', '../../../client_build_tool/packages/client_build_tool/react/layout.css', '../../../client_build_tool/packages/client_build_tool/node_modules/react/layout/layout.css', '../../../client_build_tool/packages/client_build_tool/node_modules/react/layout/li/common.css', '../../../client_build_tool/packages/client_build_tool/node_modules/react/layout/li/layout.css'],
+  falltests: ['../../../client_build_tool/packages/client_build_tool/node_modules/react/common/locall.css', '../../../client_build_tool/packages/client_build_tool/node_modules/react/layout/locall.css', '../../../client_build_tool/packages/client_build_tool/node_modules/react/common/sdsd/locall.css', '../../../client_build_tool/packages/client_build_tool/node_modules/react/layout/sdfsdf/locall.css', '../../../client_build_tool/packages/client_build_tool/node_modules/react/klaklk.css']
+}, {
+  name: 'react.vendor',
+  patterns: ['**/node_modules/react/', '**/node_modules/react-dom/'],
+  passtests: ['../../../client_build_tool/packages/client_build_tool/node_modules/react/index.js', '../../../client_build_tool/packages/client_build_tool/node_modules/react/index.js', '../../../client_build_tool/packages/client_build_tool/node_modules/react-dom/cjs/react-dom-server.browser.production.min.js', '../../../client_build_tool/packages/client_build_tool/node_modules/react-dom/index.js'],
+  falltests: []
+}, {
+  name: 'vendor',
+  patterns: ['node_modules', '!**/node_modules/react/', '!**/node_modules/react-dom/', '!*.css', '!**/publicPathConfig.js'],
+  passtests: []
+}, {
+  name: 'src',
+  patterns: ['**/src/**/*.css'],
+  passtests: ['/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/index.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/One.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/As.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/A.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/AppearanceBox.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/components/IconContent/IconContent.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/components/Icon/Icon.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/components/Header/Header.css'],
+  falltests: ['/Users/zohodesk-test/work/weirdo-components/examples/src/virtualizer/index.js', '/Users/zohodesk-test/work/client_build_tool/packages/client_build_tool/node_modules/scheduler/index.js', '/Users/zohodesk-test/work/client_build_tool/packages/client_build_tool/node_modules/scheduler/tracing.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/index.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/AppearanceBox.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/index.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/virtualizer/index.js', '/Users/zohodesk-test/work/client_build_tool/packages/client_build_tool/node_modules/prop-types/index.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Box.js', './Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Container.js', './Users/zohodesk-test/work/weirdo-components/examples/node_modules/react-router-dom/esm/react-router-dom.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Box.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Container.module.cs', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Container.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Sub/Box.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Sub/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Sub/Container.module.cs', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Sub/Container.js'],
+  // '.*@zohodesk\\/(icons)(?!.*\\/Appearance\\/).*\\.css$',
+  size: 1
+}, {
+  name: 'icons',
+  patterns: ['**/src/**/*.css', '**/@zohodesk/icons/**/*.css', '!**/@zohodesk/icons/**/Appearance/**'],
+  passtests: ['/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/index.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/One.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/As.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/A.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/AppearanceBox.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/components/IconContent/IconContent.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/components/Icon/Icon.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/components/Header/Header.css'],
+  falltests: ['/Users/zohodesk-test/work/weirdo-components/examples/src/virtualizer/index.js', '/Users/zohodesk-test/work/client_build_tool/packages/client_build_tool/node_modules/scheduler/index.js', '/Users/zohodesk-test/work/client_build_tool/packages/client_build_tool/node_modules/scheduler/tracing.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/index.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/index.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/AppearanceBox.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/virtualizer/index.js', '/Users/zohodesk-test/work/client_build_tool/packages/client_build_tool/node_modules/prop-types/index.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Box.js', './Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Container.js', './Users/zohodesk-test/work/weirdo-components/examples/node_modules/react-router-dom/esm/react-router-dom.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Box.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Container.module.cs', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Container.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Sub/Box.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Sub/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Sub/Container.module.cs', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Sub/Container.js'],
+  // '.*@zohodesk\\/(icons)(?!.*\\/Appearance\\/).*\\.css$',
+  size: 1
+}, {
+  name: 'components|variables',
+  patterns: ['**/@zohodesk/components/**/*.css', '**/@zohodesk/variables/**/*.css', '!**/@zohodesk/components/**/Appearance/**', '!**/@zohodesk/variables/**/Appearance/**'],
+  passtests: ['/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/lib/components/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/lib/components/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/es/components/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/es/components/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/lib/components/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/lib/components/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/es/components/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/es/components/Container.module.css'],
+  falltests: ['/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/lib/components/Appearance/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/lib/components/Appearance/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/es/components/Appearance/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/es/components/Appearance/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/lib/components/Appearance/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/lib/components/Appearance/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/es/components/Appearance/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/es/components/Appearance/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/virtualizer/index.js', '/Users/zohodesk-test/work/client_build_tool/packages/client_build_tool/node_modules/scheduler/index.js', '/Users/zohodesk-test/work/client_build_tool/packages/client_build_tool/node_modules/scheduler/tracing.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/index.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/index.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/index.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/One.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/As.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/A.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/AppearanceBox.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/AppearanceBox.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/virtualizer/index.js', '/Users/zohodesk-test/work/client_build_tool/packages/client_build_tool/node_modules/prop-types/index.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/components/IconContent/IconContent.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/components/Icon/Icon.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/components/Header/Header.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Box.js', './Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Container.js', './Users/zohodesk-test/work/weirdo-components/examples/node_modules/react-router-dom/esm/react-router-dom.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Box.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Container.module.cs', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Container.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Sub/Box.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Sub/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Sub/Container.module.cs', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Sub/Container.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/lib/components/Box.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/lib/components/Container.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/lib/components/Box.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/lib/components/Container.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Box.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/lib/components/Container.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/lib/components/Box.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Container.js'],
+  // '.*@zohodesk\\/(icons)(?!.*\\/Appearance\\/).*\\.css$',
+  size: 1
+}, {
+  name: 'styles',
+  patterns: ['*.css', '!**/@zohodesk/components/**/*.css', '!**/@zohodesk/variables/**/*.css', '!**/@zohodesk/icons/**/*.css'],
+  passtests: ['/Users/zohodesk-test/work/weirdo-components/examples/src/components/IconContent/IconContent.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/components/Icon/Icon.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/components/Header/Header.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/index.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/One.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/As.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/A.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/AppearanceBox.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/svg/lib/components/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/svg/lib/components/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/svg/es/components/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/svg/es/components/Container.module.css'],
+  falltests: ['/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/lib/components/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/lib/components/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/es/components/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/es/components/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/lib/components/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/lib/components/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/es/components/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/es/components/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/lib/components/Appearance/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/lib/components/Appearance/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/es/components/Appearance/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/es/components/Appearance/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/lib/components/Appearance/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/lib/components/Appearance/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/es/components/Appearance/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/es/components/Appearance/Container.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/src/virtualizer/index.js', '/Users/zohodesk-test/work/client_build_tool/packages/client_build_tool/node_modules/scheduler/index.js', '/Users/zohodesk-test/work/client_build_tool/packages/client_build_tool/node_modules/scheduler/tracing.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/index.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/index.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/Appearance/Header/SubHeader/AppearanceBox.js', '/Users/zohodesk-test/work/weirdo-components/examples/src/virtualizer/index.js', '/Users/zohodesk-test/work/client_build_tool/packages/client_build_tool/node_modules/prop-types/index.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Box.js', './Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Container.js', './Users/zohodesk-test/work/weirdo-components/examples/node_modules/react-router-dom/esm/react-router-dom.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Box.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Container.module.cs', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Container.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Sub/Box.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Sub/Box.module.css', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Sub/Container.module.cs', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Appearance/Sub/Container.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/lib/components/Box.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/lib/components/Container.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/components/lib/components/Box.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/lib/components/Container.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Box.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/lib/components/Container.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/variables/lib/components/Box.js', '/Users/zohodesk-test/work/weirdo-components/examples/node_modules/@zohodesk/icons/lib/components/Container.js'],
+  // '.*@zohodesk\\/(icons)(?!.*\\/Appearance\\/).*\\.css$',
+  size: 1
+}];
+
+function runTest(testSuite = testCases[0]) {
+  describe(`test suite for '${testSuite.name}' patterns:${JSON.stringify(testSuite.patterns)}`, () => {
+    const {
+      patterns,
+      passtests = [],
+      falltests = []
+    } = testSuite;
+    it('passtests', () => {
+      passtests.forEach(fileName => {
+        const ans = checkIsPatternsMatchFilename(patterns, fileName); // we had made it as array for debug purpose
+
+        expect([fileName, ans]).toStrictEqual([fileName, true]);
+      });
+    });
+    it('falltests', () => {
+      falltests.forEach(fileName => {
+        const ans = checkIsPatternsMatchFilename(patterns, fileName); // we had made it as array for debug purpose
+
+        expect([fileName, ans]).toStrictEqual([fileName, false]);
+      });
+    });
+  });
+}
+
+testCases.forEach(runTest); // runTest(testCases[0]);

package/packages/client_build_tool/lib/shared/postcss/__test__/postcss-rtl-all-cases.test.js

@@ -0,0 +1,119 @@
+"use strict";
+
+var _postcss = _interopRequireDefault(require("postcss"));
+
+var _getSpecificPostCssPlugin = require("../getSpecificPostCssPlugin");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+/* eslint-disable max-lines */
+
+/* eslint-disable no-use-before-define */
+// import { checkIsPatternsMatchFilename } from '../filterPluginsAllowedForSpecficFile';
+const normalize = cssString => cssString.replace(/} /g, '}');
+/* fix extra space added by `postcss-import` */
+
+
+const run = (expect, input, output, opts) => //   opts && console.log(opts);
+(0, _postcss.default)([(0, _getSpecificPostCssPlugin.configPostCssRtl)(opts)]).process(input, {
+  from: undefined
+}).then(result => {
+  expect(normalize(result.css)).toEqual(normalize(output));
+  expect(result.warnings().length).toEqual(0);
+});
+
+test('Should NOT add [dir] prefix to symmetric rules', () => run(expect, 'a { font-size: 1em }', 'a { font-size: 1em }'));
+test('Should ONLY create LTR & RTL rules to asymmetric rules', () => run(expect, 'a { font-size: 1em; text-align: left }', 'a { font-size: 1em }' + '[dir=ltr] a { text-align: left }' + '[dir=rtl] a { text-align: right }'));
+xtest('Should add [dir] prefix to symmetric rules with direction related declarations', () => run(expect, 'a { text-align: center }', '[dir] a { text-align: center }'));
+xtest('Should add [dir] prefix to symmetric rules with direction related declarations (2)', () => run(expect, 'a { font-size: 1em; text-align: center }', 'a { font-size: 1em }[dir] a { text-align: center }'));
+xtest('Should add [dir] prefix to symmetric rules with direction related declarations (3)', () => run(expect, 'a { text-align: left }a { text-align: center }', '[dir=ltr] a { text-align: left }' + '[dir=rtl] a { text-align: right }' + '[dir] a { text-align: center }'));
+xtest('Should add [dir] prefix to symmetric rules with direction related declarations (4)', () => run(expect, 'a { margin: 0 10px 0 0 }a { margin-top: 20px }', '[dir=ltr] a { margin: 0 10px 0 0 }' + '[dir=rtl] a { margin: 0 0 0 10px }' + '[dir] a { margin-top: 20px }'));
+test('Creates both LTR & RTL rules for asymmetric declarations', () => run(expect, 'a { text-align: left }', '[dir=ltr] a { text-align: left }[dir=rtl] a { text-align: right }'));
+test('Removes original rule without symmetric declarations', () => run(expect, 'a { text-align: left }', '[dir=ltr] a { text-align: left }[dir=rtl] a { text-align: right }'));
+xtest('Adds prefix to the html element', () => run(expect, 'html { text-align: left }', 'html[dir=ltr] { text-align: left }html[dir=rtl] { text-align: right }'));
+xtest('Adds prefix to the html element with class', () => run(expect, 'html.foo { text-align: left }', 'html[dir=ltr].foo { text-align: left }' + 'html[dir=rtl].foo { text-align: right }'));
+test('Adds prefix to the :root element', () => run(expect, ':root { text-align: left }', '[dir=ltr]:root { text-align: left }' + '[dir=rtl]:root { text-align: right }'));
+xtest('Adds prefix to the :root element with class', () => run(expect, ':root.foo { text-align: left }', '[dir=ltr]:root.foo { text-align: left }' + '[dir=rtl]:root.foo { text-align: right }'));
+xtest('Use custom `addPrefixToSelector` function', () => run(expect, 'a { text-align: left }', '[dir=ltr] > a { text-align: left }' + '[dir=rtl] > a { text-align: right }', {
+  addPrefixToSelector(selector, prefix) {
+    return `${prefix} > ${selector}`;
+  }
+
+}));
+test('Should correctly process values containing commas', () => run(expect, // eslint-disable-next-line no-useless-concat
+'div { background: url(\'ht' + 'tp://placecage.com/400/400\') 0 0 }', // eslint-disable-next-line no-useless-concat
+'[dir=ltr] div { background: url(\'ht' + 'tp://placecage.com/400/400\') 0 0 }' + // eslint-disable-next-line no-useless-concat
+'[dir=rtl] div { background: url(\'ht' + 'tp://placecage.com/400/400\') 100% 0 }'));
+test('Should correctly process values containing !important', () => run(expect, '.test { margin-left: 0 !important; padding-left: 0 !important }', '[dir=ltr] .test { margin-left: 0 !important; padding-left: 0 !important }' + '[dir=rtl] .test { margin-right: 0 !important; padding-right: 0 !important }'));
+test('Shouldn not create unnecessary duplications with !important', () => run(expect, '.test { display: none !important }', '.test { display: none !important }'));
+test('Should correctly process values containing _display', () => run(expect, '.test { float: left; _display: inline }', '.test { _display: inline }' + '[dir=ltr] .test { float: left }' + '[dir=rtl] .test { float: right }'));
+test('Should ignore declarations prefixed with /* rtl:ignore */', () => run(expect, '/* rtl:ignore */ .test { margin-left:0; padding-left:0 }', '.test { margin-left:0; padding-left:0 }'));
+test('/* rtl:ignore */: Should leave other selectors alone', () => run(expect, '/* rtl:ignore */ .test { margin-left:0 } ' + '.rtled { margin-left:0; padding-left:0 }', '.test { margin-left:0 } ' + '[dir=ltr] .rtled { margin-left:0; padding-left:0 } ' + '[dir=rtl] .rtled { margin-right:0; padding-right:0 }'));
+test('/* rtl:ignore */: should understand overrides', () => run(expect, '.x { left: 0 } /* rtl:ignore */.x { direction: ltr }', '[dir=ltr] .x { left: 0 }' + '[dir=rtl] .x { right: 0 }' + '.x { direction: ltr }'));
+test('/* rtl:begin:ignore */ starts ignore mode', () => run(expect, '/* rtl:begin:ignore */' + '.foo { padding-left: 0 }' + '.bar { direction: ltr }', '.foo { padding-left: 0 }.bar { direction: ltr }'));
+test('/* rtl:end:ignore */ stops ignore mode', () => run(expect, '/* rtl:begin:ignore */' + '.foo { padding-left: 0 }' + '/* rtl:end:ignore */' + '.bar { direction: ltr }', '.foo { padding-left: 0 }' + '[dir=ltr] .bar { direction: ltr }' + '[dir=rtl] .bar { direction: rtl }'));
+test('/* rtl:ignore */ can be used inside /* rtl:begin:ignore */ and /* rtl:end:ignore */', () => run(expect, '/* rtl:begin:ignore */' + '.foo { padding-left: 0 }' + '/* rtl:ignore */' + '.bar { direction: ltr }' + '.baz { left: 0 }' + '/* rtl:end:ignore */', '.foo { padding-left: 0 }.bar { direction: ltr }.baz { left: 0 }'));
+test('that it ignores normal comments', () => run(expect, '/* some comment */ .foo { padding-left: 0 }', '/* some comment */ [dir=ltr] .foo { padding-left: 0 } [dir=rtl] .foo { padding-right: 0 }'));
+test('Value based ignore comments are honored', () => run(expect, '.foo { margin-left: 12px; padding-left: 12px /* rtl:ignore */; }', '.foo { padding-left: 12px /* rtl:ignore */; }' + '[dir=ltr] .foo { margin-left: 12px; }' + '[dir=rtl] .foo { margin-right: 12px; }'));
+test('/*! rtl:ignore */ should consider as a valid directive', () => run(expect, '/*! rtl:ignore */ .test { margin-left:0; padding-left:0 }', '.test { margin-left:0; padding-left:0 }'));
+test('/*! rtl:begin:ignore */ and /*! rtl:end:ignore */ should consider as a valid directive', () => run(expect, '/*! rtl:begin:ignore */' + '.foo { padding-left: 0 }' + '/*! rtl:end:ignore */' + '.bar { direction: ltr }', '.foo { padding-left: 0 }' + '[dir=ltr] .bar { direction: ltr }' + '[dir=rtl] .bar { direction: rtl }'));
+test('Should add direction to flippable keyframes-animations', () => run(expect, '@keyframes bar { 100% { transform: rotate(360deg); } }', '@keyframes bar-ltr { 100% { transform: rotate(360deg); } }' + '@keyframes bar-rtl { 100% { transform: rotate(-360deg); } }'));
+test('Should handle multiple keyframes-animations', () => run(expect, '.loader {animation: load6 1.7s infinite ease, spinner 1.7s infinite ease;}' + '@keyframes load6 { 100% { transform: rotate(1deg) } }' + '@keyframes spinner { 100% { transform: rotate(-1deg) } }', '[dir=ltr] .loader {animation:  load6-ltr 1.7s infinite ease, spinner-ltr 1.7s infinite ease;}' + '[dir=rtl] .loader {animation:  load6-rtl 1.7s infinite ease, spinner-rtl 1.7s infinite ease;}' + '@keyframes load6-ltr { 100% { transform: rotate(1deg) } }' + '@keyframes load6-rtl { 100% { transform: rotate(-1deg) } }' + '@keyframes spinner-ltr { 100% { transform: rotate(-1deg) } }' + '@keyframes spinner-rtl { 100% { transform: rotate(1deg) } }'));
+test('Should ignore keyframes-animation prefixed with /* rtl:ignore */', () => run(expect, '/* rtl:ignore */ @keyframes bar { 100% { transform: rotate(360deg); } }', '@keyframes bar { 100% { transform: rotate(360deg); } }'));
+test('/* rtl:begin:ignore */ starts ignore mode for both keyframes and rules', () => run(expect, '/* rtl:begin:ignore */ @keyframes bar { 100% { transform: rotate(360deg); } } .foo { left: 5px }', '@keyframes bar { 100% { transform: rotate(360deg); } } .foo { left: 5px }'));
+test('/* rtl:end:ignore */ stops ignore mode for keyframes', () => run(expect, '/* rtl:begin:ignore */ @keyframes bar { 100% { transform: rotate(360deg); } } /* rtl:end:ignore */' + '.foo { left: 5px }', '@keyframes bar { 100% { transform: rotate(360deg); } }' + '[dir=ltr] .foo { left: 5px }' + '[dir=rtl] .foo { right: 5px }'));
+test('Should create only LTR version', () => run(expect, 'a { font-size: 1em; text-align: left }' + '@keyframes bar { 100% { transform: rotate(360deg); } }', 'a { font-size: 1em }' + '[dir=ltr] a { text-align: left }' + '@keyframes bar-ltr { 100% { transform: rotate(360deg); } }', {
+  onlyDirection: 'ltr'
+}));
+test('Should create only RTL version', () => run(expect, 'a { font-size: 1em; text-align: left }' + '@keyframes bar { 100% { transform: rotate(360deg); } }', 'a { font-size: 1em }' + '[dir=rtl] a { text-align: right }' + '@keyframes bar-rtl { 100% { transform: rotate(-360deg); } }', {
+  onlyDirection: 'rtl'
+}));
+test('Value replacement directives are honored', () => run(expect, '.foo { font-weight: bold; flex-direction: row/* rtl:row-reverse */; }', '.foo { font-weight: bold; }[dir=ltr] .foo { flex-direction: row/* rtl:row-reverse */; }[dir=rtl] .foo { flex-direction: row-reverse; }'));
+test('Value prepend directives are honored', () => run(expect, '.foo { font-weight: bold; font-family: "Droid Sans", "Helvetica Neue", Arial, sans-serif/*rtl:prepend:"Droid Arabic Kufi",*/; }', '.foo { font-weight: bold; }[dir=ltr] .foo { font-family: "Droid Sans", "Helvetica Neue", Arial, sans-serif/*rtl:prepend:"Droid Arabic Kufi",*/; }[dir=rtl] .foo { font-family: "Droid Arabic Kufi", "Droid Sans", "Helvetica Neue", Arial, sans-serif; }'));
+test('Value append directives are honored', () => run(expect, '.foo { font-weight: bold; transform: rotate(45deg)/* rtl:append: scaleX(-1) */; }', '.foo { font-weight: bold; }[dir=ltr] .foo { transform: rotate(45deg)/* rtl:append: scaleX(-1) */; }[dir=rtl] .foo { transform: rotate(45deg) scaleX(-1); }'));
+test('Value based ignore important comments are honored', () => run(expect, '.foo { margin-left: 12px; padding-left: 12px /*! rtl:ignore */; }', '.foo { padding-left: 12px /*! rtl:ignore */; }' + '[dir=ltr] .foo { margin-left: 12px; }' + '[dir=rtl] .foo { margin-right: 12px; }'));
+test('Value replacement directives with important comments are honored', () => run(expect, '.foo { font-weight: bold; flex-direction: row/*! rtl:row-reverse */; }', '.foo { font-weight: bold; }[dir=ltr] .foo { flex-direction: row/*! rtl:row-reverse */; }[dir=rtl] .foo { flex-direction: row-reverse; }'));
+test('Value prepend directives with important comments are honored', () => run(expect, '.foo { font-weight: bold; font-family: "Droid Sans", "Helvetica Neue", Arial, sans-serif/*!rtl:prepend:"Droid Arabic Kufi",*/; }', '.foo { font-weight: bold; }[dir=ltr] .foo { font-family: "Droid Sans", "Helvetica Neue", Arial, sans-serif/*!rtl:prepend:"Droid Arabic Kufi",*/; }[dir=rtl] .foo { font-family: "Droid Arabic Kufi", "Droid Sans", "Helvetica Neue", Arial, sans-serif; }'));
+test('Value append directives with important comments are honored', () => run(expect, '.foo { font-weight: bold; transform: rotate(45deg)/*! rtl:append: scaleX(-1) */; }', '.foo { font-weight: bold; }[dir=ltr] .foo { transform: rotate(45deg)/*! rtl:append: scaleX(-1) */; }[dir=rtl] .foo { transform: rotate(45deg) scaleX(-1); }'));
+test('Should keep comments', () => run(expect, '/* rtl:ignore */ a { text-align: left }', '/* rtl:ignore */ a { text-align: left }', {
+  removeComments: false
+}));
+test('Should respect custom prefix (attribute)', () => run(expect, 'a { text-align: left }', '[custom-dir-prefix=ltr] a { text-align: left }' + '[custom-dir-prefix=rtl] a { text-align: right }', {
+  prefix: 'custom-dir-prefix'
+}));
+test('Should respect custom prefix (class)', () => run(expect, 'a { text-align: left }', '.custom-dir-prefix-ltr a { text-align: left }' + '.custom-dir-prefix-rtl a { text-align: right }', {
+  prefix: 'custom-dir-prefix',
+  prefixType: 'class'
+}));
+test('Should not swap "left" and "right" subparts of selectors', () => run(expect, '.arrowLeft { margin-right: -3px }', '[dir=ltr] .arrowLeft { margin-right: -3px }' + '[dir=rtl] .arrowLeft { margin-left: -3px }'));
+test('Should respect multiline values', () => run(expect, `.multiline {
+        background: rgba(0, 0, 0, 0, .5),
+          linear-gradient(to right, transparent, #000);
+      }`, `[dir=ltr] .multiline {
+        background: rgba(0, 0, 0, 0, .5),
+          linear-gradient(to right, transparent, #000);
+      }` + `[dir=rtl] .multiline {
+        background: rgba(0, 0, 0, 0, .5),
+          linear-gradient(to left, transparent, #000);
+      }`));
+test('rtl:as: directive', () => run(expect, ':root { --padding /* rtl:as:padding */: 1px 2px 3px 4px }', '[dir=ltr]:root { --padding /* rtl:as:padding */: 1px 2px 3px 4px }' + '[dir=rtl]:root { --padding /* rtl:as:padding */: 1px 4px 3px 2px }'));
+test('rtl aliases', () => run(expect, ':root { --padding: 1px 2px 3px 4px }', '[dir=ltr]:root { --padding: 1px 2px 3px 4px }' + '[dir=rtl]:root { --padding: 1px 4px 3px 2px }', {
+  aliases: {
+    '--padding': 'padding'
+  }
+}));
+test('should ignore blacklist properties', () => run(expect, '.test {padding-left: 1rem;padding: 1rem 2rem 3rem 4rem}', '.test {padding: 1rem 2rem 3rem 4rem}' + '[dir=ltr] .test {padding-left: 1rem}' + '[dir=rtl] .test {padding-right: 1rem}', {
+  blacklist: ['padding']
+}));
+test('should process whitelist properties only', () => run(expect, '.test {padding-left: 1rem;padding: 1rem 2rem 3rem 4rem}', '.test {padding-left: 1rem}' + '[dir=ltr] .test {padding: 1rem 2rem 3rem 4rem}' + '[dir=rtl] .test {padding: 1rem 4rem 3rem 2rem}', {
+  whitelist: ['padding']
+}));
+/* ignored test cases */
+//   it('should ignore ignored @import', () =>
+//   run(
+//     expect,
+//     '/* rtl:begin:ignore */' +
+//       `@import "${__dirname}/../test-import.css";` +
+//       '/* rtl:end:ignore */',
+//     '.test-import { padding-left: 1rem }'
+//   ));

package/packages/client_build_tool/lib/shared/postcss/__test__/postcssRtl.spec.js

@@ -0,0 +1,34 @@
+"use strict";
+
+var _postcss = _interopRequireDefault(require("postcss"));
+
+var _getSpecificPostCssPlugin = require("../getSpecificPostCssPlugin");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+/* eslint-disable no-use-before-define */
+// import { checkIsPatternsMatchFilename } from '../filterPluginsAllowedForSpecficFile';
+describe('postcss-rtl plugin basic requirement tests', () => {
+  it('is creating rtl css code for for margin-left', () => {
+    const cssInputStr = '.main{margin-left:20px}';
+    const cssOutputStr = '[dir=ltr] .main{margin-left:20px}[dir=rtl] .main{margin-right:20px}';
+    const result = runRTLPostCssPluginForCssString(cssInputStr);
+    expect(result.css).toEqual(cssOutputStr);
+  });
+  it('is creating rtl css code for for margin-right', cb => {
+    const cssInputStr = '.main{margin-right:20px}';
+    const cssOutputStr = '[dir=ltr] .main{margin-right:20px}[dir=rtl] .main{margin-left:20px}'; // console.log(postcss);
+
+    runRTLPostCssPluginForCssString(cssInputStr).then(res => {
+      expect(res.css).toEqual(cssOutputStr);
+      cb();
+    });
+  });
+});
+
+function runRTLPostCssPluginForCssString(cssInputStr) {
+  return (0, _postcss.default)([(0, _getSpecificPostCssPlugin.configPostCssRtl)()]).process(cssInputStr, {
+    from: '',
+    to: ''
+  });
+}

package/packages/client_build_tool/lib/shared/postcss/custom_postcss_plugins/EmptyPlugin.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+// eslint-disable-next-line no-unused-vars
+const EmptyPlugin = (opts = {}) => ({
+  postcssPlugin: 'postcss-empty',
+
+  // eslint-disable-next-line no-unused-vars
+  Once(root, {
+    result
+  }) {}
+
+});
+
+EmptyPlugin.postcss = true;
+var _default = EmptyPlugin;
+exports.default = _default;

package/packages/client_build_tool/lib/shared/postcss/custom_postcss_plugins/HoverActivePlugin/constants.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.HOVER_NOTATION = void 0;
+
+/* eslint-disable no-use-before-define */
+const HOVER_NOTATION = ':hover';
+exports.HOVER_NOTATION = HOVER_NOTATION;

package/packages/client_build_tool/lib/shared/postcss/custom_postcss_plugins/HoverActivePlugin/handleIgnores.js

@@ -0,0 +1,66 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.handleIgnores = handleIgnores;
+
+var _typeCheckUtils = require("./typeCheckUtils");
+
+const hoverIgnoreQuery = 'Hover:ignore';
+const activeIgnoreQuery = 'Active:ignore';
+const hoverActiveIgnoreQuery = 'HoverActive:ignore';
+
+function handleIgnore() {
+  let isIgnored = false;
+  return {
+    isIgnored: () => isIgnored,
+    update: isGoingTobeIgnored => {
+      isIgnored = isGoingTobeIgnored;
+    },
+    reset: () => {
+      isIgnored = false;
+    }
+  };
+} // eslint-disable-next-line no-unused-vars
+
+
+function handleIgnores(options) {
+  const hoverHandler = handleIgnore();
+  const activeHandler = handleIgnore();
+
+  function generateReturnValue() {
+    return {
+      hoverIgnored: hoverHandler.isIgnored(),
+      activeIgnored: activeHandler.isIgnored()
+    };
+  }
+
+  const ignoreCommentMap = {
+    [hoverIgnoreQuery]: () => {
+      hoverHandler.update(true);
+    },
+    [activeIgnoreQuery]: () => {
+      activeHandler.update(true);
+    },
+    [hoverActiveIgnoreQuery]: () => {
+      hoverHandler.update(true);
+      activeHandler.update(true);
+    }
+  };
+  return node => {
+    if ((0, _typeCheckUtils.isComment)(node)) {
+      const commentText = node.text.trim();
+      ignoreCommentMap[commentText] && ignoreCommentMap[commentText](); //   NOTE: we return here because this is just comment we can skip it.
+
+      return generateReturnValue();
+    } //   NOTE: we get the here. But return after resetting for next. Because these comment Only works for once.
+    //  Even If we support multiple line Skip we must do it in reset or separate method.
+
+
+    const returnValue = generateReturnValue();
+    hoverHandler.reset();
+    activeHandler.reset();
+    return returnValue;
+  };
+}