@zohodesk/dot 1.0.0-temp-181 → 1.0.0-temp-181.1

package/coverage/ExternalLink/ExternalLink.js.html

@@ -214,7 +214,7 @@ ExternalLink.propTypes = propTypes;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/ExternalLink/ExternalLink.module.css.html

@@ -79,7 +79,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/ExternalLink/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/ExternalLink/props/defaultProps.js.html

@@ -85,7 +85,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/ExternalLink/props/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/ExternalLink/props/propTypes.js.html

@@ -109,7 +109,7 @@ export const propTypes = {
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/IconButton/IconButton.js.html

@@ -451,7 +451,7 @@ IconButton.defaultProps = defaultProps;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/IconButton/IconButton.module.css.html

@@ -139,7 +139,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/IconButton/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/IconButton/props/defaultProps.js.html

@@ -121,7 +121,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/IconButton/props/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/IconButton/props/propTypes.js.html

@@ -172,7 +172,7 @@ export const propTypes = {
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/Image/Image.js.html

@@ -169,7 +169,7 @@ Image.defaultProps = defaultProps;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/Image/Image.module.css.html

@@ -103,7 +103,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/Image/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/Image/props/defaultProps.js.html

@@ -82,7 +82,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/Image/props/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/Image/props/propTypes.js.html

@@ -112,7 +112,7 @@ export const propTypes = {
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/avatar/AvatarWithTeam/AvatarWithTeam.js.html

@@ -433,7 +433,7 @@ AvatarWithTeam.propTypes = propTypes;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/avatar/AvatarWithTeam/AvatarWithTeam.module.css.html

@@ -118,7 +118,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/avatar/AvatarWithTeam/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/avatar/AvatarWithTeam/props/defaultProps.js.html

@@ -97,7 +97,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/avatar/AvatarWithTeam/props/index.html

@@ -116,7 +116,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/avatar/AvatarWithTeam/props/propTypes.js.html

@@ -148,7 +148,7 @@ export const propTypes = {
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/index.html

@@ -206,7 +206,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2024-03-18T12:38:30.098Z
+                at 2024-03-22T13:20:51.764Z
             </div>
         <script src="prettify.js"></script>
         <script>

package/es/v1/DotWrapper/DotWrapper.js

@@ -1,6 +1,9 @@
 import React from 'react';
-import '@zohodesk/variables/assets/sizeVariables.module.css';
-import { getAppearance, getTheme } from './libraryChunks/dynamicImports';
+import { getAppearance, getTheme, getZoomSize, getFontSize } from './libraryChunks/dynamicImports';
+import '@zohodesk/variables/assets/colorVariables.module.css';
+import '@zohodesk/variables/assets/dotVariables.module.css';
+import '@zohodesk/components/es/common/basic.module.css';
+import '@zohodesk/variables/lib/fontFamilyVariables.module.css';
 import { propTypes } from './props/propTypes';
 import { defaultProps } from './props/defaultProps';
 export default function DotWrapper(props) {
@@ -8,20 +11,26 @@ export default function DotWrapper(props) {
     appearance,
     theme,
     library,
-    isZoom,
-    baseZoomSize
+    baseZoomSize,
+    baseFontSize,
+    className
   } = props;
   getAppearance(appearance, library);
   getTheme(appearance, theme, library);
-  const wrapperStyle = {
-    background: 'aqua',
-    color: '#000',
-    padding: 'var(--zd_size20)',
+  baseZoomSize && getZoomSize();
+  baseFontSize && getFontSize();
+  const baseZoom = {
     '--zd_baseSize': baseZoomSize
   };
+  const baseFont = {
+    '--zd_baseFontSize': baseFontSize
+  };
+  const combinedStyles = { ...baseZoom,
+    ...baseFont
+  };
   return /*#__PURE__*/React.createElement("div", {
-    className: "rootWrapper",
-    style: wrapperStyle
+    className: `${className} rootWrapper`,
+    style: combinedStyles
   }, "Dot Wrapper");
 }
 DotWrapper.propTypes = propTypes;

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

@@ -1,5 +1,6 @@
 import { appearanceImports, appearanceMapping } from "../utils/appearanceProperties";
 import { themeImports, themeMapping } from "../utils/themeProperties";
+import { imports, mapping } from "../utils/sizeProperties";
 import { importFiles } from "../utils/importFiles";
 import { errorMessage } from "../utils/errorMessage";
 const defaultLib = ['component', 'dot', 'svg'];
@@ -9,11 +10,19 @@ export function getAppearance(mode, library) {
   const libArray = typeof library === 'string' ? [library] : library != undefined ? library : defaultLib;
   console.log('get appearance -->', mode, libArray);
   errorMessage(modeArray, mode, 'appearance');
-  importFiles(libArray, appearanceMapping, appearanceImports, mode);
+  importFiles('appearance', libArray, appearanceMapping, appearanceImports, mode);
 }
 export function getTheme(mode, theme, library) {
   const libArray = typeof library === 'string' ? [library] : library != undefined ? library : defaultLib;
   console.log('get theme -->', theme, libArray);
   errorMessage(themeArray, theme, 'theme');
-  importFiles(libArray, themeMapping, themeImports, mode, theme);
+  importFiles('theme', libArray, themeMapping, themeImports, mode, theme);
+}
+export function getZoomSize() {
+  console.log('get zoom size variables');
+  importFiles('zoom', null, mapping, imports);
+}
+export function getFontSize() {
+  console.log('font size variables');
+  importFiles('font', null, mapping, imports);
 }

package/es/v1/DotWrapper/libraryChunks/size/fontSize.js

@@ -0,0 +1 @@
+import '@zohodesk/variables/assets/fontsizeVariables.module.css';

package/es/v1/DotWrapper/libraryChunks/size/zoomSize.js

@@ -0,0 +1 @@
+import '@zohodesk/variables/assets/sizeVariables.module.css';

package/es/v1/DotWrapper/props/defaultProps.js

@@ -2,6 +2,5 @@ export const defaultProps = {
   appearance: 'light',
   theme: 'blue',
   library: ['component'],
-  isZoom: false,
-  baseZoomSize: '1'
+  className: ''
 };

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

@@ -3,6 +3,7 @@ export const propTypes = {
   appearance: PropTypes.oneOf(['light', 'dark', 'pureDark']),
   theme: PropTypes.oneOf(['blue', 'green', 'orange', 'red', 'yellow']),
   library: PropTypes.arrayOf(PropTypes.oneOf(['component', 'dot', 'svg'])),
-  isZoom: PropTypes.bool,
-  baseZoomSize: PropTypes.number
+  baseZoomSize: PropTypes.number,
+  baseFontSize: PropTypes.number,
+  className: PropTypes.string
 };

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

@@ -1,18 +1,28 @@
-export function importFiles(libArray, mapping, imports, mode, theme) {
-  return libArray.map(libName => {
-    const importFile = theme ? [mapping[libName][theme][mode]] : [mapping[libName][mode]];
-    console.log(`Import file for ${libName} -->`, importFile);
-    const promises = [];
-    importFile.forEach(fileKey => {
-      if (imports[fileKey]) {
-        promises.push(imports[fileKey]());
-      } else {
-        console.error(`Import not found for ${fileKey}`);
-      }
+export function importFiles(type, libArray, mapping, imports, mode, theme) {
+  if (type === 'appearance' || type === 'theme') {
+    return libArray.map(libName => {
+      const importFile = theme ? [mapping[libName][theme][mode]] : [mapping[libName][mode]];
+      console.log(`Import file for ${libName} -->`, importFile);
+      const promises = [];
+      importFile.forEach(fileKey => {
+        if (imports[fileKey]) {
+          promises.push(imports[fileKey]());
+        } else {
+          console.error(`Import not found for ${fileKey}`);
+        }
+      });
+      return Promise.all(promises).catch(error => {
+        console.error(`Error importing files for ${libName}:`, error);
+        return Promise.reject(error);
+      });
     });
-    return Promise.all(promises).catch(error => {
-      console.error(`Error importing files for ${libName}:`, error);
-      return Promise.reject(error);
-    });
-  });
+  }
+
+  if (type === 'zoom') {
+    return imports[mapping.zoomSize]();
+  }
+
+  if (type === 'font') {
+    return imports[mapping.fontSize]();
+  }
 }

package/es/v1/DotWrapper/utils/sizeProperties.js

@@ -0,0 +1,12 @@
+export const imports = {
+  Lib_ZoomSize: () => import(
+  /* webpackChunkName: 'Lib_ZoomSize' */
+  '../libraryChunks/size/zoomSize'),
+  Lib_FontSize: () => import(
+  /* webpackChunkName: 'Lib_FontSize' */
+  '../libraryChunks/size/fontSize')
+};
+export const mapping = {
+  zoomSize: 'Lib_ZoomSize',
+  fontSize: 'Lib_FontSize'
+};

package/es/v1/form/layout/Section/props/propTypes.js

@@ -1,5 +1,6 @@
 import PropTypes from 'prop-types';
 export const propTypes = {
+  children: PropTypes.node,
   className: PropTypes.string,
   containerClass: PropTypes.string,
   dataId: PropTypes.string,

package/lib/v1/DotWrapper/DotWrapper.js

@@ -7,33 +7,51 @@ exports["default"] = DotWrapper;
 
 var _react = _interopRequireDefault(require("react"));
 
-require("@zohodesk/variables/assets/sizeVariables.module.css");
-
 var _dynamicImports = require("./libraryChunks/dynamicImports");
 
+require("@zohodesk/variables/assets/colorVariables.module.css");
+
+require("@zohodesk/variables/assets/dotVariables.module.css");
+
+require("@zohodesk/components/es/common/basic.module.css");
+
+require("@zohodesk/variables/lib/fontFamilyVariables.module.css");
+
 var _propTypes = require("./props/propTypes");
 
 var _defaultProps = require("./props/defaultProps");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function DotWrapper(props) {
   var appearance = props.appearance,
       theme = props.theme,
       library = props.library,
-      isZoom = props.isZoom,
-      baseZoomSize = props.baseZoomSize;
+      baseZoomSize = props.baseZoomSize,
+      baseFontSize = props.baseFontSize,
+      className = props.className;
   (0, _dynamicImports.getAppearance)(appearance, library);
   (0, _dynamicImports.getTheme)(appearance, theme, library);
-  var wrapperStyle = {
-    background: 'aqua',
-    color: '#000',
-    padding: 'var(--zd_size20)',
+  baseZoomSize && (0, _dynamicImports.getZoomSize)();
+  baseFontSize && (0, _dynamicImports.getFontSize)();
+  var baseZoom = {
     '--zd_baseSize': baseZoomSize
   };
+  var baseFont = {
+    '--zd_baseFontSize': baseFontSize
+  };
+
+  var combinedStyles = _objectSpread(_objectSpread({}, baseZoom), baseFont);
+
   return /*#__PURE__*/_react["default"].createElement("div", {
-    className: "rootWrapper",
-    style: wrapperStyle
+    className: "".concat(className, " rootWrapper"),
+    style: combinedStyles
   }, "Dot Wrapper");
 }
 

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

@@ -4,12 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getAppearance = getAppearance;
+exports.getFontSize = getFontSize;
 exports.getTheme = getTheme;
+exports.getZoomSize = getZoomSize;
 
 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");
@@ -22,12 +26,22 @@ function getAppearance(mode, library) {
   var libArray = typeof library === 'string' ? [library] : library != undefined ? library : defaultLib;
   console.log('get appearance -->', mode, libArray);
   (0, _errorMessage.errorMessage)(modeArray, mode, 'appearance');
-  (0, _importFiles.importFiles)(libArray, _appearanceProperties.appearanceMapping, _appearanceProperties.appearanceImports, mode);
+  (0, _importFiles.importFiles)('appearance', libArray, _appearanceProperties.appearanceMapping, _appearanceProperties.appearanceImports, mode);
 }
 
 function getTheme(mode, theme, library) {
   var libArray = typeof library === 'string' ? [library] : library != undefined ? library : defaultLib;
   console.log('get theme -->', theme, libArray);
   (0, _errorMessage.errorMessage)(themeArray, theme, 'theme');
-  (0, _importFiles.importFiles)(libArray, _themeProperties.themeMapping, _themeProperties.themeImports, mode, theme);
+  (0, _importFiles.importFiles)('theme', libArray, _themeProperties.themeMapping, _themeProperties.themeImports, mode, theme);
+}
+
+function getZoomSize() {
+  console.log('get zoom size variables');
+  (0, _importFiles.importFiles)('zoom', null, _sizeProperties.mapping, _sizeProperties.imports);
+}
+
+function getFontSize() {
+  console.log('font size variables');
+  (0, _importFiles.importFiles)('font', null, _sizeProperties.mapping, _sizeProperties.imports);
 }

package/lib/v1/DotWrapper/libraryChunks/size/fontSize.js

@@ -0,0 +1,3 @@
+"use strict";
+
+require("@zohodesk/variables/assets/fontsizeVariables.module.css");

package/lib/v1/DotWrapper/libraryChunks/size/zoomSize.js

@@ -0,0 +1,3 @@
+"use strict";
+
+require("@zohodesk/variables/assets/sizeVariables.module.css");

package/lib/v1/DotWrapper/props/defaultProps.js

@@ -8,7 +8,6 @@ var defaultProps = {
   appearance: 'light',
   theme: 'blue',
   library: ['component'],
-  isZoom: false,
-  baseZoomSize: '1'
+  className: ''
 };
 exports.defaultProps = defaultProps;

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

@@ -13,7 +13,8 @@ var propTypes = {
   appearance: _propTypes["default"].oneOf(['light', 'dark', 'pureDark']),
   theme: _propTypes["default"].oneOf(['blue', 'green', 'orange', 'red', 'yellow']),
   library: _propTypes["default"].arrayOf(_propTypes["default"].oneOf(['component', 'dot', 'svg'])),
-  isZoom: _propTypes["default"].bool,
-  baseZoomSize: _propTypes["default"].number
+  baseZoomSize: _propTypes["default"].number,
+  baseFontSize: _propTypes["default"].number,
+  className: _propTypes["default"].string
 };
 exports.propTypes = propTypes;

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

@@ -5,21 +5,31 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.importFiles = importFiles;
 
-function importFiles(libArray, mapping, imports, mode, theme) {
-  return libArray.map(function (libName) {
-    var importFile = theme ? [mapping[libName][theme][mode]] : [mapping[libName][mode]];
-    console.log("Import file for ".concat(libName, " -->"), importFile);
-    var promises = [];
-    importFile.forEach(function (fileKey) {
-      if (imports[fileKey]) {
-        promises.push(imports[fileKey]());
-      } else {
-        console.error("Import not found for ".concat(fileKey));
-      }
+function importFiles(type, libArray, mapping, imports, mode, theme) {
+  if (type === 'appearance' || type === 'theme') {
+    return libArray.map(function (libName) {
+      var importFile = theme ? [mapping[libName][theme][mode]] : [mapping[libName][mode]];
+      console.log("Import file for ".concat(libName, " -->"), importFile);
+      var promises = [];
+      importFile.forEach(function (fileKey) {
+        if (imports[fileKey]) {
+          promises.push(imports[fileKey]());
+        } else {
+          console.error("Import not found for ".concat(fileKey));
+        }
+      });
+      return Promise.all(promises)["catch"](function (error) {
+        console.error("Error importing files for ".concat(libName, ":"), error);
+        return Promise.reject(error);
+      });
     });
-    return Promise.all(promises)["catch"](function (error) {
-      console.error("Error importing files for ".concat(libName, ":"), error);
-      return Promise.reject(error);
-    });
-  });
+  }
+
+  if (type === 'zoom') {
+    return imports[mapping.zoomSize]();
+  }
+
+  if (type === 'font') {
+    return imports[mapping.fontSize]();
+  }
 }