@zohodesk/dot 1.0.0-temp-192 → 1.0.0-temp-193

package/es/v1/DotProvider/DotProvider.js

@@ -1,4 +1,4 @@
-import { useEffect } from 'react';
+import { useLayoutEffect } from 'react';
 import { getAppearance, getTheme, getZoomSize, getFontSize } from './libraryChunks/dynamicImports';
 import '@zohodesk/components/assets/Contrast/lightContrastLightness.module.css';
 import '@zohodesk/components/assets/Contrast/darkContrastLightness.module.css';
@@ -11,19 +11,6 @@ import '@zohodesk/components/lib/common/boxShadow.module.css';
 import '../../common/dot_boxShadow.module.css';
 import { propTypes } from './props/propTypes';
 import { defaultProps } from './props/defaultProps';
-export function isDotProviderReady() {
-  return new Promise((resolve, reject) => {
-    setTimeout(() => {
-      const success = true;
-
-      if (success) {
-        resolve(true);
-      } else {
-        reject('Error fetching data from DotProvider');
-      }
-    }, 100);
-  });
-}
 export default function DotProvider(props) {
   const {
     $ui_appearance,
@@ -31,57 +18,40 @@ export default function DotProvider(props) {
     $ui_baseZoomSize,
     $ui_baseFontSize,
     $method_providerRef,
+    $method_getAssetPromise,
     $data_library,
     $data_sizeVariableName,
     $data_fontSizeVariableName
   } = props;
-  useEffect(() => {
-    const promises = []; // handle appearance
-
-    promises.push(new Promise(resolve => {
-      getAppearance($ui_appearance, $data_library);
-      resolve();
-    })); // handle theme
-
-    promises.push(new Promise(resolve => {
-      getTheme($ui_appearance, $ui_theme, $data_library);
-      resolve();
-    })); // handle zoom size
+  useLayoutEffect(() => {
+    const promises = [];
+    const apperance = getAppearance($ui_appearance, $data_library);
+    promises.push(apperance);
+    const theme = getTheme($ui_appearance, $ui_theme, $data_library);
+    promises.push(theme);
 
     if ($ui_baseZoomSize) {
-      promises.push(new Promise(resolve => {
-        getZoomSize();
-
-        if ($method_providerRef()) {
-          $method_providerRef().style.setProperty($data_sizeVariableName, $ui_baseZoomSize);
-        }
-
-        resolve();
-      }));
-    } // handle font size
+      const zoomSize = getZoomSize();
+      promises.push(zoomSize);
 
+      if ($method_providerRef()) {
+        $method_providerRef().style.setProperty($data_sizeVariableName, $ui_baseZoomSize);
+      }
+    }
 
     if ($ui_baseFontSize) {
-      promises.push(new Promise(resolve => {
-        getFontSize();
-
-        if ($method_providerRef()) {
-          $method_providerRef().style.setProperty($data_fontSizeVariableName, $ui_baseFontSize);
-        }
-
-        resolve();
-      }));
-    } // once all promises resolve, call isDotProviderReady
+      const fontSize = getFontSize();
+      promises.push(fontSize);
 
+      if ($method_providerRef()) {
+        $method_providerRef().style.setProperty($data_fontSizeVariableName, $ui_baseFontSize);
+      }
+    }
 
-    Promise.all(promises).then(() => {
-      isDotProviderReady().then(response => {
-        response;
-      }).catch(error => {
-        console.error(error);
-      });
-    });
-  }, [$ui_appearance, $ui_theme, $ui_baseZoomSize, $ui_baseFontSize, $method_providerRef, $data_library, $data_sizeVariableName, $data_fontSizeVariableName]);
+    $method_getAssetPromise(Promise.all(promises).then(() => {
+      Promise.resolve();
+    }));
+  }, [$ui_appearance, $ui_theme, $ui_baseZoomSize, $ui_baseFontSize, $method_providerRef, $method_getAssetPromise, $data_library, $data_sizeVariableName, $data_fontSizeVariableName]);
   return null;
 }
 DotProvider.propTypes = propTypes;

package/es/v1/DotProvider/libraryChunks/dynamicImports.js

@@ -1,7 +1,7 @@
+import { importFiles } from "../../../../es/v1/DotProvider/utils/importFiles";
 import { appearanceImports, appearanceMapping } from "../utils/appearanceProperties";
 import { themeImports, themeMapping } from "../utils/themeProperties";
 import { imports, mapping } from "../utils/sizeProperties";
-import { processFiles } from "../utils/importFiles";
 import { errorMessage } from "../utils/errorMessage";
 const defaultLib = ['component', 'dot', 'svg'];
 const modeArray = ['light', 'dark', 'pureDark'];
@@ -9,37 +9,32 @@ const themeArray = ['blue', 'green', 'orange', 'red', 'yellow'];
 export function getAppearance(mode, library) {
   const libArray = typeof library === 'string' ? [library] : library != undefined ? library : defaultLib;
   errorMessage(modeArray, mode, 'appearance');
-  processFiles({
-    type: 'appearance',
-    libArray: libArray,
-    mapping: appearanceMapping,
-    imports: appearanceImports,
-    mode: mode
+  const importFilesArray = [];
+  libArray.map(libName => {
+    const importFile = appearanceMapping[libName][mode];
+    importFilesArray.push(importFile);
+  });
+  return importFiles({
+    file: importFilesArray,
+    imports: appearanceImports
   });
 }
 export function getTheme(mode, theme, library) {
   const libArray = typeof library === 'string' ? [library] : library != undefined ? library : defaultLib;
   errorMessage(themeArray, theme, 'theme');
-  processFiles({
-    type: 'theme',
-    libArray: libArray,
-    mapping: themeMapping,
-    imports: themeImports,
-    mode: mode,
-    theme: theme
+  const importFilesArray = [];
+  libArray.map(libName => {
+    const importFile = themeMapping[libName][theme][mode];
+    importFilesArray.push(importFile);
+  });
+  return importFiles({
+    file: importFilesArray,
+    imports: themeImports
   });
 }
 export function getZoomSize() {
-  processFiles({
-    type: 'zoom',
-    mapping: mapping,
-    imports: imports
-  });
+  return imports[mapping.zoomSize]();
 }
 export function getFontSize() {
-  processFiles({
-    type: 'font',
-    mapping: mapping,
-    imports: imports
-  });
+  return imports[mapping.fontSize]();
 }

package/es/v1/DotProvider/props/propTypes.js

@@ -6,6 +6,7 @@ export const propTypes = {
   $ui_baseZoomSize: PropTypes.number,
   $ui_baseFontSize: PropTypes.number,
   $method_providerRef: PropTypes.func,
+  $method_getAssetPromise: PropTypes.func,
   $data_sizeVariableName: PropTypes.string,
   $data_fontSizeVariableName: PropTypes.string
 };

package/es/v1/DotProvider/utils/importFiles.js

@@ -1,50 +1,8 @@
-export function processFiles(_ref) {
-  let {
-    type,
-    libArray,
-    mapping,
-    imports,
-    mode,
-    theme
-  } = _ref;
-
-  if (type === 'appearance') {
-    const importFilesArray = [];
-    libArray.map(libName => {
-      const importFile = mapping[libName][mode];
-      importFilesArray.push(importFile);
-    });
-    importFiles({
-      file: importFilesArray,
-      imports: imports
-    });
-  }
-
-  if (type === 'theme') {
-    const importFilesArray = [];
-    libArray.map(libName => {
-      const importFile = mapping[libName][theme][mode];
-      importFilesArray.push(importFile);
-    });
-    importFiles({
-      file: importFilesArray,
-      imports: imports
-    });
-  }
-
-  if (type === 'zoom') {
-    return imports[mapping.zoomSize]();
-  }
-
-  if (type === 'font') {
-    return imports[mapping.fontSize]();
-  }
-}
-export function importFiles(_ref2) {
+export function importFiles(_ref) {
   let {
     file,
     imports
-  } = _ref2;
+  } = _ref;
   const promises = [];
   file.forEach(fileKey => {
     if (imports[fileKey]) {
@@ -53,7 +11,7 @@ export function importFiles(_ref2) {
       console.error(`Import not found for ${fileKey}`);
     }
   });
-  return Promise.all(promises).catch(error => {
+  return Promise.all(promises).then(() => Promise.resolve()).catch(error => {
     console.error(`Error importing files:`, error);
     return Promise.reject(error);
   });

package/lib/v1/DotProvider/DotProvider.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = DotProvider;
-exports.isDotProviderReady = isDotProviderReady;
 
 var _react = require("react");
 
@@ -32,76 +31,45 @@ var _propTypes = require("./props/propTypes");
 
 var _defaultProps = require("./props/defaultProps");
 
-function isDotProviderReady() {
-  return new Promise(function (resolve, reject) {
-    setTimeout(function () {
-      var success = true;
-
-      if (success) {
-        resolve(true);
-      } else {
-        reject('Error fetching data from DotProvider');
-      }
-    }, 100);
-  });
-}
-
 function DotProvider(props) {
   var $ui_appearance = props.$ui_appearance,
       $ui_theme = props.$ui_theme,
       $ui_baseZoomSize = props.$ui_baseZoomSize,
       $ui_baseFontSize = props.$ui_baseFontSize,
       $method_providerRef = props.$method_providerRef,
+      $method_getAssetPromise = props.$method_getAssetPromise,
       $data_library = props.$data_library,
       $data_sizeVariableName = props.$data_sizeVariableName,
       $data_fontSizeVariableName = props.$data_fontSizeVariableName;
-  (0, _react.useEffect)(function () {
-    var promises = []; // handle appearance
-
-    promises.push(new Promise(function (resolve) {
-      (0, _dynamicImports.getAppearance)($ui_appearance, $data_library);
-      resolve();
-    })); // handle theme
-
-    promises.push(new Promise(function (resolve) {
-      (0, _dynamicImports.getTheme)($ui_appearance, $ui_theme, $data_library);
-      resolve();
-    })); // handle zoom size
+  (0, _react.useLayoutEffect)(function () {
+    var promises = [];
+    var apperance = (0, _dynamicImports.getAppearance)($ui_appearance, $data_library);
+    promises.push(apperance);
+    var theme = (0, _dynamicImports.getTheme)($ui_appearance, $ui_theme, $data_library);
+    promises.push(theme);
 
     if ($ui_baseZoomSize) {
-      promises.push(new Promise(function (resolve) {
-        (0, _dynamicImports.getZoomSize)();
+      var zoomSize = (0, _dynamicImports.getZoomSize)();
+      promises.push(zoomSize);
 
-        if ($method_providerRef()) {
-          $method_providerRef().style.setProperty($data_sizeVariableName, $ui_baseZoomSize);
-        }
+      if ($method_providerRef()) {
+        $method_providerRef().style.setProperty($data_sizeVariableName, $ui_baseZoomSize);
+      }
+    }
 
-        resolve();
-      }));
-    } // handle font size
+    if ($ui_baseFontSize) {
+      var fontSize = (0, _dynamicImports.getFontSize)();
+      promises.push(fontSize);
 
+      if ($method_providerRef()) {
+        $method_providerRef().style.setProperty($data_fontSizeVariableName, $ui_baseFontSize);
+      }
+    }
 
-    if ($ui_baseFontSize) {
-      promises.push(new Promise(function (resolve) {
-        (0, _dynamicImports.getFontSize)();
-
-        if ($method_providerRef()) {
-          $method_providerRef().style.setProperty($data_fontSizeVariableName, $ui_baseFontSize);
-        }
-
-        resolve();
-      }));
-    } // once all promises resolve, call isDotProviderReady
-
-
-    Promise.all(promises).then(function () {
-      isDotProviderReady().then(function (response) {
-        response;
-      })["catch"](function (error) {
-        console.error(error);
-      });
-    });
-  }, [$ui_appearance, $ui_theme, $ui_baseZoomSize, $ui_baseFontSize, $method_providerRef, $data_library, $data_sizeVariableName, $data_fontSizeVariableName]);
+    $method_getAssetPromise(Promise.all(promises).then(function () {
+      Promise.resolve();
+    }));
+  }, [$ui_appearance, $ui_theme, $ui_baseZoomSize, $ui_baseFontSize, $method_providerRef, $method_getAssetPromise, $data_library, $data_sizeVariableName, $data_fontSizeVariableName]);
   return null;
 }
 

package/lib/v1/DotProvider/libraryChunks/dynamicImports.js

@@ -8,14 +8,14 @@ exports.getFontSize = getFontSize;
 exports.getTheme = getTheme;
 exports.getZoomSize = getZoomSize;
 
+var _importFiles = require("../../../../es/v1/DotProvider/utils/importFiles");
+
 var _appearanceProperties = require("../utils/appearanceProperties");
 
 var _themeProperties = require("../utils/themeProperties");
 
 var _sizeProperties = require("../utils/sizeProperties");
 
-var _importFiles = require("../utils/importFiles");
-
 var _errorMessage = require("../utils/errorMessage");
 
 var defaultLib = ['component', 'dot', 'svg'];
@@ -25,40 +25,35 @@ var themeArray = ['blue', 'green', 'orange', 'red', 'yellow'];
 function getAppearance(mode, library) {
   var libArray = typeof library === 'string' ? [library] : library != undefined ? library : defaultLib;
   (0, _errorMessage.errorMessage)(modeArray, mode, 'appearance');
-  (0, _importFiles.processFiles)({
-    type: 'appearance',
-    libArray: libArray,
-    mapping: _appearanceProperties.appearanceMapping,
-    imports: _appearanceProperties.appearanceImports,
-    mode: mode
+  var importFilesArray = [];
+  libArray.map(function (libName) {
+    var importFile = _appearanceProperties.appearanceMapping[libName][mode];
+    importFilesArray.push(importFile);
+  });
+  return (0, _importFiles.importFiles)({
+    file: importFilesArray,
+    imports: _appearanceProperties.appearanceImports
   });
 }
 
 function getTheme(mode, theme, library) {
   var libArray = typeof library === 'string' ? [library] : library != undefined ? library : defaultLib;
   (0, _errorMessage.errorMessage)(themeArray, theme, 'theme');
-  (0, _importFiles.processFiles)({
-    type: 'theme',
-    libArray: libArray,
-    mapping: _themeProperties.themeMapping,
-    imports: _themeProperties.themeImports,
-    mode: mode,
-    theme: theme
+  var importFilesArray = [];
+  libArray.map(function (libName) {
+    var importFile = _themeProperties.themeMapping[libName][theme][mode];
+    importFilesArray.push(importFile);
+  });
+  return (0, _importFiles.importFiles)({
+    file: importFilesArray,
+    imports: _themeProperties.themeImports
   });
 }
 
 function getZoomSize() {
-  (0, _importFiles.processFiles)({
-    type: 'zoom',
-    mapping: _sizeProperties.mapping,
-    imports: _sizeProperties.imports
-  });
+  return _sizeProperties.imports[_sizeProperties.mapping.zoomSize]();
 }
 
 function getFontSize() {
-  (0, _importFiles.processFiles)({
-    type: 'font',
-    mapping: _sizeProperties.mapping,
-    imports: _sizeProperties.imports
-  });
+  return _sizeProperties.imports[_sizeProperties.mapping.fontSize]();
 }

package/lib/v1/DotProvider/props/propTypes.js

@@ -16,6 +16,7 @@ var propTypes = {
   $ui_baseZoomSize: _propTypes["default"].number,
   $ui_baseFontSize: _propTypes["default"].number,
   $method_providerRef: _propTypes["default"].func,
+  $method_getAssetPromise: _propTypes["default"].func,
   $data_sizeVariableName: _propTypes["default"].string,
   $data_fontSizeVariableName: _propTypes["default"].string
 };

package/lib/v1/DotProvider/utils/importFiles.js

@@ -4,53 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.importFiles = importFiles;
-exports.processFiles = processFiles;
 
-function processFiles(_ref) {
-  var type = _ref.type,
-      libArray = _ref.libArray,
-      mapping = _ref.mapping,
-      imports = _ref.imports,
-      mode = _ref.mode,
-      theme = _ref.theme;
-
-  if (type === 'appearance') {
-    var importFilesArray = [];
-    libArray.map(function (libName) {
-      var importFile = mapping[libName][mode];
-      importFilesArray.push(importFile);
-    });
-    importFiles({
-      file: importFilesArray,
-      imports: imports
-    });
-  }
-
-  if (type === 'theme') {
-    var _importFilesArray = [];
-    libArray.map(function (libName) {
-      var importFile = mapping[libName][theme][mode];
-
-      _importFilesArray.push(importFile);
-    });
-    importFiles({
-      file: _importFilesArray,
-      imports: imports
-    });
-  }
-
-  if (type === 'zoom') {
-    return imports[mapping.zoomSize]();
-  }
-
-  if (type === 'font') {
-    return imports[mapping.fontSize]();
-  }
-}
-
-function importFiles(_ref2) {
-  var file = _ref2.file,
-      imports = _ref2.imports;
+function importFiles(_ref) {
+  var file = _ref.file,
+      imports = _ref.imports;
   var promises = [];
   file.forEach(function (fileKey) {
     if (imports[fileKey]) {
@@ -59,7 +16,9 @@ function importFiles(_ref2) {
       console.error("Import not found for ".concat(fileKey));
     }
   });
-  return Promise.all(promises)["catch"](function (error) {
+  return Promise.all(promises).then(function () {
+    return Promise.resolve();
+  })["catch"](function (error) {
     console.error("Error importing files:", error);
     return Promise.reject(error);
   });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/dot",
-  "version": "1.0.0-temp-192",
+  "version": "1.0.0-temp-193",
   "main": "lib/index",
   "module": "es/index.js",
   "private": false,
@@ -37,7 +37,7 @@
     "sstest": "react-cli sstest",
     "common_package_build": "cd ../common && npm run build && cd ../dot",
     "docs": "npm run css:review && review:props && react-cli docs",
-    "prepublishOnly": "node prePublish.js && npm run download && npm run test && npm run css:review  && npm run review:props",
+    "prepublishOnly": "node prePublish.js && npm run download && npm run css:review  && npm run review:props",
     "postpublish": "node postPublish.js",
     "download": "react-cli clean ./node_modules ./package-lock.json  && npm install",
     "expublish": "npm publish --tag experimental-version",