@zohodesk/dot 1.0.0-temp-181.4 → 1.0.0-temp-181.5

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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </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-29T17:57:58.561Z
+                at 2024-04-02T17:28:03.276Z
             </div>
         <script src="prettify.js"></script>
         <script>

package/es/v1/DotWrapper/DotWrapper.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect } 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';
@@ -9,36 +9,31 @@ import '@zohodesk/components/es/common/basic.module.css';
 import '@zohodesk/variables/lib/fontFamilyVariables.module.css';
 import '@zohodesk/components/lib/common/boxShadow.module.css';
 import '../../common/dot_boxShadow.module.css';
-import '@zohodesk-private/desk-components/es/common/Dc_boxShadow.module.css';
 import { propTypes } from './props/propTypes';
 import { defaultProps } from './props/defaultProps';
 export default function DotWrapper(props) {
   let {
-    children,
     appearance,
     theme,
     library,
     baseZoomSize,
     baseFontSize,
-    className
+    selector
   } = props;
-  getAppearance(appearance, library);
-  getTheme(appearance, theme, library);
-  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 ${className}`,
-    style: combinedStyles
-  }, children);
+  useEffect(() => {
+    if (selector === 'libraryWrapper') {
+      getAppearance(appearance, library);
+      getTheme(appearance, theme, library);
+      baseZoomSize && getZoomSize();
+      baseFontSize && getFontSize();
+      const wrapperElements = document.querySelectorAll(`[selector="${selector}"]`);
+      wrapperElements.forEach(element => {
+        element.style.setProperty('--zd_baseSize', baseZoomSize);
+        element.style.setProperty('--zd_baseFontSize', baseFontSize);
+      });
+    }
+  }, [appearance, theme, library, baseZoomSize, baseFontSize, selector]);
+  return null;
 }
 DotWrapper.propTypes = propTypes;
 DotWrapper.defaultProps = defaultProps;

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

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

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

@@ -1,10 +1,9 @@
 import PropTypes from 'prop-types';
 export const propTypes = {
-  children: PropTypes.oneOfType([PropTypes.element, PropTypes.arrayOf(PropTypes.element)]),
   appearance: PropTypes.oneOf(['light', 'dark', 'pureDark']),
   theme: PropTypes.oneOf(['blue', 'green', 'orange', 'red', 'yellow']),
-  library: PropTypes.arrayOf(PropTypes.oneOf(['component', 'dot', 'svg', 'deskComponents'])),
+  library: PropTypes.arrayOf(PropTypes.oneOf(['component', 'dot', 'svg'])),
   baseZoomSize: PropTypes.number,
   baseFontSize: PropTypes.number,
-  className: PropTypes.string
+  selector: PropTypes.string
 };

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

@@ -25,16 +25,7 @@ export const appearanceImports = {
   '../libraryChunks/appearance/svg/DarkMode_SVG'),
   Lib_PureDarkMode_SVG: () => import(
   /* webpackChunkName: 'Lib_PureDarkMode_SVG' */
-  '../libraryChunks/appearance/svg/PureDarkMode_SVG'),
-  Lib_LightMode_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_LightMode_DeskComponent' */
-  '../libraryChunks/appearance/desk-components/LightMode_DeskComponent'),
-  Lib_DarkMode_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_DarkMode_DeskComponent' */
-  '../libraryChunks/appearance/desk-components/DarkMode_DeskComponent'),
-  Lib_PureDarkMode_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_PureDarkMode_DeskComponent' */
-  '../libraryChunks/appearance/desk-components/PureDarkMode_DeskComponent')
+  '../libraryChunks/appearance/svg/PureDarkMode_SVG')
 };
 export const appearanceMapping = {
   component: {
@@ -51,10 +42,5 @@ export const appearanceMapping = {
     light: 'Lib_LightMode_SVG',
     dark: 'Lib_DarkMode_SVG',
     pureDark: 'Lib_PureDarkMode_SVG'
-  },
-  deskComponents: {
-    light: 'Lib_LightMode_DeskComponent',
-    dark: 'Lib_DarkMode_DeskComponent',
-    pureDark: 'Lib_PureDarkMode_DeskComponent'
   }
 };

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

@@ -133,52 +133,7 @@ export const themeImports = {
   '../libraryChunks/themes/svg/yellow/Yellow_Dark_SVG'),
   Lib_Yellow_PureDark_SVG: () => import(
   /* webpackChunkName: 'Lib_Yellow_PureDark_SVG' */
-  '../libraryChunks/themes/svg/yellow/Yellow_PureDark_SVG'),
-  Lib_Blue_Light_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_Blue_Light_DeskComponent' */
-  '../libraryChunks/themes/desk-components/blue/Blue_Light_DeskComponent'),
-  Lib_Blue_Dark_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_Blue_Dark_DeskComponent' */
-  '../libraryChunks/themes/desk-components/blue/Blue_Dark_DeskComponent'),
-  Lib_Blue_PureDark_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_Blue_PureDark_DeskComponent' */
-  '../libraryChunks/themes/desk-components/blue/Blue_PureDark_DeskComponent'),
-  Lib_Green_Light_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_Green_Light_DeskComponent' */
-  '../libraryChunks/themes/desk-components/green/Green_Light_DeskComponent'),
-  Lib_Green_Dark_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_Green_Dark_DeskComponent' */
-  '../libraryChunks/themes/desk-components/green/Green_Dark_DeskComponent'),
-  Lib_Green_PureDark_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_Green_PureDark_DeskComponent' */
-  '../libraryChunks/themes/desk-components/green/Green_PureDark_DeskComponent'),
-  Lib_Orange_Light_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_Orange_Light_DeskComponent' */
-  '../libraryChunks/themes/desk-components/orange/Orange_Light_DeskComponent'),
-  Lib_Orange_Dark_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_Orange_Dark_DeskComponent' */
-  '../libraryChunks/themes/desk-components/orange/Orange_Dark_DeskComponent'),
-  Lib_Orange_PureDark_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_Orange_PureDark_DeskComponent' */
-  '../libraryChunks/themes/desk-components/orange/Orange_PureDark_DeskComponent'),
-  Lib_Red_Light_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_Red_Light_DeskComponent' */
-  '../libraryChunks/themes/desk-components/red/Red_Light_DeskComponent'),
-  Lib_Red_Dark_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_Red_Dark_DeskComponent' */
-  '../libraryChunks/themes/desk-components/red/Red_Dark_DeskComponent'),
-  Lib_Red_PureDark_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_Red_PureDark_DeskComponent' */
-  '../libraryChunks/themes/desk-components/red/Red_PureDark_DeskComponent'),
-  Lib_Yellow_Light_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_Yellow_Light_DeskComponent' */
-  '../libraryChunks/themes/desk-components/yellow/Yellow_Light_DeskComponent'),
-  Lib_Yellow_Dark_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_Yellow_Dark_DeskComponent' */
-  '../libraryChunks/themes/desk-components/yellow/Yellow_Dark_DeskComponent'),
-  Lib_Yellow_PureDark_DeskComponent: () => import(
-  /* webpackChunkName: 'Lib_Yellow_PureDark_DeskComponent' */
-  '../libraryChunks/themes/desk-components/yellow/Yellow_PureDark_DeskComponent')
+  '../libraryChunks/themes/svg/yellow/Yellow_PureDark_SVG')
 };
 export const themeMapping = {
   component: {
@@ -261,32 +216,5 @@ export const themeMapping = {
       dark: 'Lib_Yellow_Dark_SVG',
       pureDark: 'Lib_Yellow_PureDark_SVG'
     }
-  },
-  deskComponents: {
-    blue: {
-      light: 'Lib_Blue_Light_DeskComponent',
-      dark: 'Lib_Blue_Dark_DeskComponent',
-      pureDark: 'Lib_Blue_PureDark_DeskComponent'
-    },
-    green: {
-      light: 'Lib_Green_Light_DeskComponent',
-      dark: 'Lib_Green_Dark_DeskComponent',
-      pureDark: 'Lib_Green_PureDark_DeskComponent'
-    },
-    orange: {
-      light: 'Lib_Orange_Light_DeskComponent',
-      dark: 'Lib_Orange_Dark_DeskComponent',
-      pureDark: 'Lib_Orange_PureDark_DeskComponent'
-    },
-    red: {
-      light: 'Lib_Red_Light_DeskComponent',
-      dark: 'Lib_Red_Dark_DeskComponent',
-      pureDark: 'Lib_Red_PureDark_DeskComponent'
-    },
-    yellow: {
-      light: 'Lib_Yellow_Light_DeskComponent',
-      dark: 'Lib_Yellow_Dark_DeskComponent',
-      pureDark: 'Lib_Yellow_PureDark_DeskComponent'
-    }
   }
 };

package/lib/v1/DotWrapper/DotWrapper.js

@@ -1,11 +1,13 @@
 "use strict";
 
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports["default"] = DotWrapper;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _dynamicImports = require("./libraryChunks/dynamicImports");
 
@@ -27,45 +29,35 @@ require("@zohodesk/components/lib/common/boxShadow.module.css");
 
 require("../../common/dot_boxShadow.module.css");
 
-require("@zohodesk-private/desk-components/es/common/Dc_boxShadow.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 _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-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 _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; }
 
 function DotWrapper(props) {
-  var children = props.children,
-      appearance = props.appearance,
+  var appearance = props.appearance,
       theme = props.theme,
       library = props.library,
       baseZoomSize = props.baseZoomSize,
       baseFontSize = props.baseFontSize,
-      className = props.className;
-  (0, _dynamicImports.getAppearance)(appearance, library);
-  (0, _dynamicImports.getTheme)(appearance, theme, library);
-  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 ".concat(className),
-    style: combinedStyles
-  }, children);
+      selector = props.selector;
+  (0, _react.useEffect)(function () {
+    if (selector === 'libraryWrapper') {
+      (0, _dynamicImports.getAppearance)(appearance, library);
+      (0, _dynamicImports.getTheme)(appearance, theme, library);
+      baseZoomSize && (0, _dynamicImports.getZoomSize)();
+      baseFontSize && (0, _dynamicImports.getFontSize)();
+      var wrapperElements = document.querySelectorAll("[selector=\"".concat(selector, "\"]"));
+      wrapperElements.forEach(function (element) {
+        element.style.setProperty('--zd_baseSize', baseZoomSize);
+        element.style.setProperty('--zd_baseFontSize', baseFontSize);
+      });
+    }
+  }, [appearance, theme, library, baseZoomSize, baseFontSize, selector]);
+  return null;
 }
 
 DotWrapper.propTypes = _propTypes.propTypes;

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

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

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

@@ -10,12 +10,11 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var propTypes = {
-  children: _propTypes["default"].oneOfType([_propTypes["default"].element, _propTypes["default"].arrayOf(_propTypes["default"].element)]),
   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', 'deskComponents'])),
+  library: _propTypes["default"].arrayOf(_propTypes["default"].oneOf(['component', 'dot', 'svg'])),
   baseZoomSize: _propTypes["default"].number,
   baseFontSize: _propTypes["default"].number,
-  className: _propTypes["default"].string
+  selector: _propTypes["default"].string
 };
 exports.propTypes = propTypes;

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

@@ -56,21 +56,6 @@ var appearanceImports = {
     return Promise.resolve().then(function () {
       return _interopRequireWildcard(require('../libraryChunks/appearance/svg/PureDarkMode_SVG'));
     });
-  },
-  Lib_LightMode_DeskComponent: function Lib_LightMode_DeskComponent() {
-    return Promise.resolve().then(function () {
-      return _interopRequireWildcard(require('../libraryChunks/appearance/desk-components/LightMode_DeskComponent'));
-    });
-  },
-  Lib_DarkMode_DeskComponent: function Lib_DarkMode_DeskComponent() {
-    return Promise.resolve().then(function () {
-      return _interopRequireWildcard(require('../libraryChunks/appearance/desk-components/DarkMode_DeskComponent'));
-    });
-  },
-  Lib_PureDarkMode_DeskComponent: function Lib_PureDarkMode_DeskComponent() {
-    return Promise.resolve().then(function () {
-      return _interopRequireWildcard(require('../libraryChunks/appearance/desk-components/PureDarkMode_DeskComponent'));
-    });
   }
 };
 exports.appearanceImports = appearanceImports;
@@ -89,11 +74,6 @@ var appearanceMapping = {
     light: 'Lib_LightMode_SVG',
     dark: 'Lib_DarkMode_SVG',
     pureDark: 'Lib_PureDarkMode_SVG'
-  },
-  deskComponents: {
-    light: 'Lib_LightMode_DeskComponent',
-    dark: 'Lib_DarkMode_DeskComponent',
-    pureDark: 'Lib_PureDarkMode_DeskComponent'
   }
 };
 exports.appearanceMapping = appearanceMapping;