@zohodesk/dot 1.0.0-temp-225 → 1.0.0-temp-226

package/README.md

@@ -2,6 +2,11 @@
 
 In this Library, we Provide Some Basic Components to Build Your Application
 
+# 1.9.7
+
+- **Upload** => upload_overlay_bg color contrast fixed
+- **DepartmentDropDown** Added DepartmentTextProps support under customProps
+
 # 1.9.5, # 1.9.6
 
 - **listCommon.module.css**  A css active ignore comment has been added to fix the hover and click pseudo-class collision issue on iOS tablets.

package/es/AttachmentViewer/AttachmentViewer.js

@@ -449,9 +449,7 @@ export default class AttachmentViewer extends Component {
       i18nKeys,
       isActive,
       dataId,
-      customProps,
-      showCount,
-      renderCustomIcons
+      customProps
     } = this.props;
     const {
       avatarProps = {}
@@ -497,7 +495,7 @@ export default class AttachmentViewer extends Component {
         "data-title": selectedAttachment.name,
         dataId: "attachName",
         id: ariaId
-      }, selectedAttachment.name), showCount && /*#__PURE__*/React.createElement(Box, {
+      }, selectedAttachment.name), /*#__PURE__*/React.createElement(Box, {
         flexible: true,
         className: style.count,
         dataId: "attachCountContainer"
@@ -509,11 +507,7 @@ export default class AttachmentViewer extends Component {
         align: uptoTablet ? 'bottom' : 'center',
         wrap: "wrap",
         isCover: false
-      }, typeof renderCustomIcons === 'function' && renderCustomIcons({
-        selectedAttachment,
-        selectedIndex,
-        totalLen
-      }), canZoom ? isZoomed ? /*#__PURE__*/React.createElement("div", {
+      }, canZoom ? isZoomed ? /*#__PURE__*/React.createElement("div", {
         className: uptoTablet ? style.mobileMenu : style.menu,
         onClick: this.zoomOut.bind(this, selectedIndex),
         "data-id": "zoomOut",

package/es/AttachmentViewer/props/defaultProps.js

@@ -12,6 +12,5 @@ export const AttachmentViewer_defaultProps = {
   isActive: false,
   dataId: 'AttachmentViewer',
   i18nKeys: {},
-  customProps: {},
-  showCount: true
+  customProps: {}
 };

package/es/AttachmentViewer/props/propTypes.js

@@ -44,7 +44,5 @@ export const AttachmentViewer_propTypes = {
   renderUnSupportedElement: PropTypes.func,
   customProps: PropTypes.shape({
     avatarProps: PropTypes.exact(AvatarProps)
-  }),
-  showCount: PropTypes.bool,
-  renderCustomIcons: PropTypes.func
+  })
 };

package/es/DotProvider/hooks/useDotProvider.js

@@ -1,8 +1,8 @@
 import { useLayoutEffect } from 'react';
 import useDownloadAssetsAndSetAttr from "./useDownloadAssetsAndSetAttr";
-import '@zohodesk/components/assets/Contrast/lightContrastLightness.module.css';
-import '@zohodesk/components/assets/Contrast/darkContrastLightness.module.css';
-import '@zohodesk/components/assets/Contrast/pureDarkContrastLightness.module.css';
+import '@zohodesk/variables/assets/Contrast/lightContrastLightness.module.css';
+import '@zohodesk/variables/assets/Contrast/darkContrastLightness.module.css';
+import '@zohodesk/variables/assets/Contrast/pureDarkContrastLightness.module.css';
 import '@zohodesk/variables/assets/colorVariables.module.css';
 import '@zohodesk/variables/assets/dotVariables.module.css';
 import '@zohodesk/components/es/common/basic.module.css';

package/es/DotProvider/libraryChunks/appearance/variables/Dark_Variables.js

@@ -0,0 +1 @@
+import '@zohodesk/variables/assets/Appearance/dark/mode/globalTokens_DarkMode.module.css';

package/es/DotProvider/libraryChunks/appearance/variables/Light_Variables.js

@@ -0,0 +1 @@
+import '@zohodesk/variables/assets/Appearance/light/mode/globalTokens_LightMode.module.css';

package/es/DotProvider/libraryChunks/appearance/variables/PureDark_Variables.js

@@ -0,0 +1 @@
+import '@zohodesk/variables/assets/Appearance/pureDark/mode/globalTokens_PureDarkMode.module.css';

package/es/DotProvider/libraryChunks/themes/component/blue/Blue_Dark_Component.js

@@ -1,3 +1 @@
-import '@zohodesk/components/assets/Appearance/dark/themes/blue/blue_CTA_DarkTheme.module.css';
-import '@zohodesk/components/assets/Appearance/dark/themes/blue/blue_CTA_DarkModifyCategory.module.css';
 import '@zohodesk/components/assets/Appearance/dark/themes/blue/blue_ComponentTheme_DarkTheme.module.css';

package/es/DotProvider/libraryChunks/themes/component/blue/Blue_Light_Component.js

@@ -1,3 +1 @@
-import '@zohodesk/components/assets/Appearance/light/themes/blue/blue_CTA_LightTheme.module.css';
-import '@zohodesk/components/assets/Appearance/light/themes/blue/blue_CTA_LightModifyCategory.module.css';
 import '@zohodesk/components/assets/Appearance/light/themes/blue/blue_ComponentTheme_LightTheme.module.css';

package/es/DotProvider/libraryChunks/themes/component/blue/Blue_PureDark_Component.js

@@ -1,3 +1 @@
-import '@zohodesk/components/assets/Appearance/pureDark/themes/blue/blue_CTA_PureDarkTheme.module.css';
-import '@zohodesk/components/assets/Appearance/pureDark/themes/blue/blue_CTA_PureDarkModifyCategory.module.css';
 import '@zohodesk/components/assets/Appearance/pureDark/themes/blue/blue_ComponentTheme_PureDarkTheme.module.css';

package/es/DotProvider/libraryChunks/themes/component/green/Green_Dark_Component.js

@@ -1,3 +1 @@
-import '@zohodesk/components/assets/Appearance/dark/themes/green/green_CTA_DarkTheme.module.css';
-import '@zohodesk/components/assets/Appearance/dark/themes/green/green_CTA_DarkModifyCategory.module.css';
 import '@zohodesk/components/assets/Appearance/dark/themes/green/green_ComponentTheme_DarkTheme.module.css';

package/es/DotProvider/libraryChunks/themes/component/green/Green_Light_Component.js

@@ -1,3 +1 @@
-import '@zohodesk/components/assets/Appearance/light/themes/green/green_CTA_LightTheme.module.css';
-import '@zohodesk/components/assets/Appearance/light/themes/green/green_CTA_LightModifyCategory.module.css';
 import '@zohodesk/components/assets/Appearance/light/themes/green/green_ComponentTheme_LightTheme.module.css';

package/es/DotProvider/libraryChunks/themes/component/green/Green_PureDark_Component.js

@@ -1,3 +1 @@
-import '@zohodesk/components/assets/Appearance/pureDark/themes/green/green_CTA_PureDarkTheme.module.css';
-import '@zohodesk/components/assets/Appearance/pureDark/themes/green/green_CTA_PureDarkModifyCategory.module.css';
 import '@zohodesk/components/assets/Appearance/pureDark/themes/green/green_ComponentTheme_PureDarkTheme.module.css';

package/es/DotProvider/libraryChunks/themes/component/orange/Orange_Dark_Component.js

@@ -1,3 +1 @@
-import '@zohodesk/components/assets/Appearance/dark/themes/orange/orange_CTA_DarkTheme.module.css';
-import '@zohodesk/components/assets/Appearance/dark/themes/orange/orange_CTA_DarkModifyCategory.module.css';
 import '@zohodesk/components/assets/Appearance/dark/themes/orange/orange_ComponentTheme_DarkTheme.module.css';

package/es/DotProvider/libraryChunks/themes/component/orange/Orange_Light_Component.js

@@ -1,3 +1 @@
-import '@zohodesk/components/assets/Appearance/light/themes/orange/orange_CTA_LightTheme.module.css';
-import '@zohodesk/components/assets/Appearance/light/themes/orange/orange_CTA_LightModifyCategory.module.css';
 import '@zohodesk/components/assets/Appearance/light/themes/orange/orange_ComponentTheme_LightTheme.module.css';

package/es/DotProvider/libraryChunks/themes/component/orange/Orange_PureDark_Component.js

@@ -1,3 +1 @@
-import '@zohodesk/components/assets/Appearance/pureDark/themes/orange/orange_CTA_PureDarkTheme.module.css';
-import '@zohodesk/components/assets/Appearance/pureDark/themes/orange/orange_CTA_PureDarkModifyCategory.module.css';
 import '@zohodesk/components/assets/Appearance/pureDark/themes/orange/orange_ComponentTheme_PureDarkTheme.module.css';

package/es/DotProvider/libraryChunks/themes/component/red/Red_Dark_Component.js

@@ -1,3 +1 @@
-import '@zohodesk/components/assets/Appearance/dark/themes/red/red_CTA_DarkTheme.module.css';
-import '@zohodesk/components/assets/Appearance/dark/themes/red/red_CTA_DarkModifyCategory.module.css';
 import '@zohodesk/components/assets/Appearance/dark/themes/red/red_ComponentTheme_DarkTheme.module.css';

package/es/DotProvider/libraryChunks/themes/component/red/Red_Light_Component.js

@@ -1,3 +1 @@
-import '@zohodesk/components/assets/Appearance/light/themes/red/red_CTA_LightTheme.module.css';
-import '@zohodesk/components/assets/Appearance/light/themes/red/red_CTA_LightModifyCategory.module.css';
 import '@zohodesk/components/assets/Appearance/light/themes/red/red_ComponentTheme_LightTheme.module.css';

package/es/DotProvider/libraryChunks/themes/component/red/Red_PureDark_Component.js

@@ -1,3 +1 @@
-import '@zohodesk/components/assets/Appearance/pureDark/themes/red/red_CTA_PureDarkTheme.module.css';
-import '@zohodesk/components/assets/Appearance/pureDark/themes/red/red_CTA_PureDarkModifyCategory.module.css';
 import '@zohodesk/components/assets/Appearance/pureDark/themes/red/red_ComponentTheme_PureDarkTheme.module.css';

package/es/DotProvider/libraryChunks/themes/component/yellow/Yellow_Dark_Component.js

@@ -1,3 +1 @@
-import '@zohodesk/components/assets/Appearance/dark/themes/yellow/yellow_CTA_DarkTheme.module.css';
-import '@zohodesk/components/assets/Appearance/dark/themes/yellow/yellow_CTA_DarkModifyCategory.module.css';
 import '@zohodesk/components/assets/Appearance/dark/themes/yellow/yellow_ComponentTheme_DarkTheme.module.css';

package/es/DotProvider/libraryChunks/themes/component/yellow/Yellow_Light_Component.js

@@ -1,3 +1 @@
-import '@zohodesk/components/assets/Appearance/light/themes/yellow/yellow_CTA_LightTheme.module.css';
-import '@zohodesk/components/assets/Appearance/light/themes/yellow/yellow_CTA_LightModifyCategory.module.css';
 import '@zohodesk/components/assets/Appearance/light/themes/yellow/yellow_ComponentTheme_LightTheme.module.css';

package/es/DotProvider/libraryChunks/themes/component/yellow/Yellow_PureDark_Component.js

@@ -1,3 +1 @@
-import '@zohodesk/components/assets/Appearance/pureDark/themes/yellow/yellow_CTA_PureDarkTheme.module.css';
-import '@zohodesk/components/assets/Appearance/pureDark/themes/yellow/yellow_CTA_PureDarkModifyCategory.module.css';
 import '@zohodesk/components/assets/Appearance/pureDark/themes/yellow/yellow_ComponentTheme_PureDarkTheme.module.css';

package/es/DotProvider/libraryChunks/themes/variables/blue/Blue_Dark_Variables.js

@@ -0,0 +1,2 @@
+import '@zohodesk/variables/assets/Appearance/dark/themes/blue/blue_ctaTokens_DarkTheme.module.css';
+import '@zohodesk/variables/assets/Appearance/dark/themes/blue/blue_ctaTokens_DarkModifyCategory.module.css';

package/es/DotProvider/libraryChunks/themes/variables/blue/Blue_Light_Variables.js

@@ -0,0 +1,2 @@
+import '@zohodesk/variables/assets/Appearance/light/themes/blue/blue_ctaTokens_LightTheme.module.css';
+import '@zohodesk/variables/assets/Appearance/light/themes/blue/blue_ctaTokens_LightModifyCategory.module.css';

package/es/DotProvider/libraryChunks/themes/variables/blue/Blue_PureDark_Variables.js

@@ -0,0 +1,2 @@
+import '@zohodesk/variables/assets/Appearance/pureDark/themes/blue/blue_ctaTokens_PureDarkTheme.module.css';
+import '@zohodesk/variables/assets/Appearance/pureDark/themes/blue/blue_ctaTokens_PureDarkModifyCategory.module.css';

package/es/DotProvider/libraryChunks/themes/variables/green/Green_Dark_Variables.js

@@ -0,0 +1,2 @@
+import '@zohodesk/variables/assets/Appearance/dark/themes/green/green_ctaTokens_DarkTheme.module.css';
+import '@zohodesk/variables/assets/Appearance/dark/themes/green/green_ctaTokens_DarkModifyCategory.module.css';

package/es/DotProvider/libraryChunks/themes/variables/green/Green_Light_Variables.js

@@ -0,0 +1,2 @@
+import '@zohodesk/variables/assets/Appearance/light/themes/green/green_ctaTokens_LightTheme.module.css';
+import '@zohodesk/variables/assets/Appearance/light/themes/green/green_ctaTokens_LightModifyCategory.module.css';

package/es/DotProvider/libraryChunks/themes/variables/green/Green_PureDark_Variables.js

@@ -0,0 +1,2 @@
+import '@zohodesk/variables/assets/Appearance/pureDark/themes/green/green_ctaTokens_PureDarkTheme.module.css';
+import '@zohodesk/variables/assets/Appearance/pureDark/themes/green/green_ctaTokens_PureDarkModifyCategory.module.css';

package/es/DotProvider/libraryChunks/themes/variables/orange/Orange_Dark_Variables.js

@@ -0,0 +1,2 @@
+import '@zohodesk/variables/assets/Appearance/dark/themes/orange/orange_ctaTokens_DarkTheme.module.css';
+import '@zohodesk/variables/assets/Appearance/dark/themes/orange/orange_ctaTokens_DarkModifyCategory.module.css';

package/es/DotProvider/libraryChunks/themes/variables/orange/Orange_Light_Variables.js

@@ -0,0 +1,2 @@
+import '@zohodesk/variables/assets/Appearance/light/themes/orange/orange_ctaTokens_LightTheme.module.css';
+import '@zohodesk/variables/assets/Appearance/light/themes/orange/orange_ctaTokens_LightModifyCategory.module.css';

package/es/DotProvider/libraryChunks/themes/variables/orange/Orange_PureDark_Variables.js

@@ -0,0 +1,2 @@
+import '@zohodesk/variables/assets/Appearance/pureDark/themes/orange/orange_ctaTokens_PureDarkTheme.module.css';
+import '@zohodesk/variables/assets/Appearance/pureDark/themes/orange/orange_ctaTokens_PureDarkModifyCategory.module.css';

package/es/DotProvider/libraryChunks/themes/variables/red/Red_Dark_Variables.js

@@ -0,0 +1,2 @@
+import '@zohodesk/variables/assets/Appearance/dark/themes/red/red_ctaTokens_DarkTheme.module.css';
+import '@zohodesk/variables/assets/Appearance/dark/themes/red/red_ctaTokens_DarkModifyCategory.module.css';

package/es/DotProvider/libraryChunks/themes/variables/red/Red_Light_Variables.js

@@ -0,0 +1,2 @@
+import '@zohodesk/variables/assets/Appearance/light/themes/red/red_ctaTokens_LightTheme.module.css';
+import '@zohodesk/variables/assets/Appearance/light/themes/red/red_ctaTokens_LightModifyCategory.module.css';

package/es/DotProvider/libraryChunks/themes/variables/red/Red_PureDark_Variables.js

@@ -0,0 +1,2 @@
+import '@zohodesk/variables/assets/Appearance/pureDark/themes/red/red_ctaTokens_PureDarkTheme.module.css';
+import '@zohodesk/variables/assets/Appearance/pureDark/themes/red/red_ctaTokens_PureDarkModifyCategory.module.css';

package/es/DotProvider/libraryChunks/themes/variables/yellow/Yellow_Dark_Variables.js

@@ -0,0 +1,2 @@
+import '@zohodesk/variables/assets/Appearance/dark/themes/yellow/yellow_ctaTokens_DarkTheme.module.css';
+import '@zohodesk/variables/assets/Appearance/dark/themes/yellow/yellow_ctaTokens_DarkModifyCategory.module.css';

package/es/DotProvider/libraryChunks/themes/variables/yellow/Yellow_Light_Variables.js

@@ -0,0 +1,2 @@
+import '@zohodesk/variables/assets/Appearance/light/themes/yellow/yellow_ctaTokens_LightTheme.module.css';
+import '@zohodesk/variables/assets/Appearance/light/themes/yellow/yellow_ctaTokens_LightModifyCategory.module.css';

package/es/DotProvider/libraryChunks/themes/variables/yellow/Yellow_PureDark_Variables.js

@@ -0,0 +1,2 @@
+import '@zohodesk/variables/assets/Appearance/pureDark/themes/yellow/yellow_ctaTokens_PureDarkTheme.module.css';
+import '@zohodesk/variables/assets/Appearance/pureDark/themes/yellow/yellow_ctaTokens_PureDarkModifyCategory.module.css';

package/es/DotProvider/utils/constants.js

@@ -1,3 +1,4 @@
+export const LIBRARY_VARIABLES = 'variables';
 export const LIBRARY_COMPONENT = 'component';
 export const LIBRARY_DOT = 'dot';
 export const LIBRARY_SVG = 'svg';
@@ -9,6 +10,6 @@ export const THEME_COLOR_GREEN = 'green';
 export const THEME_COLOR_ORANGE = 'orange';
 export const THEME_COLOR_RED = 'red';
 export const THEME_COLOR_YELLOW = 'yellow';
-export const LIBRARIES = [LIBRARY_COMPONENT, LIBRARY_DOT, LIBRARY_SVG];
+export const LIBRARIES = [LIBRARY_VARIABLES, LIBRARY_COMPONENT, LIBRARY_DOT, LIBRARY_SVG];
 export const THEME_APPEARANCES = [THEME_APPEARANCE_LIGHT, THEME_APPEARANCE_DARK, THEME_APPEARANCE_PURE_DARK];
 export const THEME_COLORS = [THEME_COLOR_BLUE, THEME_COLOR_GREEN, THEME_COLOR_ORANGE, THEME_COLOR_RED, THEME_COLOR_YELLOW];

package/es/DotProvider/utils/themeAppearanceAssetsConfig.js

@@ -1,5 +1,14 @@
-import { LIBRARY_COMPONENT, LIBRARY_DOT, LIBRARY_SVG, THEME_APPEARANCE_DARK, THEME_APPEARANCE_LIGHT, THEME_APPEARANCE_PURE_DARK } from "./constants";
+import { LIBRARY_VARIABLES, LIBRARY_COMPONENT, LIBRARY_DOT, LIBRARY_SVG, THEME_APPEARANCE_DARK, THEME_APPEARANCE_LIGHT, THEME_APPEARANCE_PURE_DARK } from "./constants";
 export const themeAppearanceImports = {
+  Lib_LightMode_Variables: () => import(
+  /* webpackChunkName: 'Lib_LightMode_Variables' */
+  "../libraryChunks/appearance/variables/Light_Variables"),
+  Lib_DarkMode_Variables: () => import(
+  /* webpackChunkName: 'Lib_DarkMode_Variables' */
+  "../libraryChunks/appearance/variables/Dark_Variables"),
+  Lib_PureDarkMode_Variables: () => import(
+  /* webpackChunkName: 'Lib_PureDarkMode_Variables' */
+  "../libraryChunks/appearance/variables/PureDark_Variables"),
   Lib_LightMode_Component: () => import(
   /* webpackChunkName: 'Lib_LightMode_Component' */
   "../libraryChunks/appearance/component/Light_Component"),
@@ -29,6 +38,11 @@ export const themeAppearanceImports = {
   '@zohodesk/svg/assets/Appearance/pureDark/mode/SVG_PureDarkMode.module.css')
 };
 export const themeAppearanceMapping = {
+  [LIBRARY_VARIABLES]: {
+    [THEME_APPEARANCE_LIGHT]: 'Lib_LightMode_Variables',
+    [THEME_APPEARANCE_DARK]: 'Lib_DarkMode_Variables',
+    [THEME_APPEARANCE_PURE_DARK]: 'Lib_PureDarkMode_Variables'
+  },
   [LIBRARY_COMPONENT]: {
     [THEME_APPEARANCE_LIGHT]: 'Lib_LightMode_Component',
     [THEME_APPEARANCE_DARK]: 'Lib_DarkMode_Component',

package/es/DotProvider/utils/themeColorAssetsConfig.js

@@ -1,5 +1,50 @@
-import { LIBRARY_COMPONENT, LIBRARY_DOT, LIBRARY_SVG, THEME_APPEARANCE_DARK, THEME_APPEARANCE_LIGHT, THEME_APPEARANCE_PURE_DARK, THEME_COLOR_BLUE, THEME_COLOR_GREEN, THEME_COLOR_ORANGE, THEME_COLOR_RED, THEME_COLOR_YELLOW } from "./constants";
+import { LIBRARY_VARIABLES, LIBRARY_COMPONENT, LIBRARY_DOT, LIBRARY_SVG, THEME_APPEARANCE_DARK, THEME_APPEARANCE_LIGHT, THEME_APPEARANCE_PURE_DARK, THEME_COLOR_BLUE, THEME_COLOR_GREEN, THEME_COLOR_ORANGE, THEME_COLOR_RED, THEME_COLOR_YELLOW } from "./constants";
 export const themeColorImports = {
+  Lib_Blue_Light_Variables: () => import(
+  /* webpackChunkName: 'Lib_Blue_Light_Variables' */
+  "../libraryChunks/variables/component/blue/Blue_Light_Variables"),
+  Lib_Blue_Dark_Variables: () => import(
+  /* webpackChunkName: 'Lib_Blue_Dark_Variables' */
+  "../libraryChunks/variables/component/blue/Blue_Dark_Variables"),
+  Lib_Blue_PureDark_Variables: () => import(
+  /* webpackChunkName: 'Lib_Blue_PureDark_Variables' */
+  "../libraryChunks/variables/component/blue/Blue_PureDark_Variables"),
+  Lib_Green_Light_Variables: () => import(
+  /* webpackChunkName: 'Lib_Green_Light_Variables' */
+  "../libraryChunks/variables/component/green/Green_Light_Variables"),
+  Lib_Green_Dark_Variables: () => import(
+  /* webpackChunkName: 'Lib_Green_Dark_Variables' */
+  "../libraryChunks/variables/component/green/Green_Dark_Variables"),
+  Lib_Green_PureDark_Variables: () => import(
+  /* webpackChunkName: 'Lib_Green_PureDark_Variables' */
+  "../libraryChunks/variables/component/green/Green_PureDark_Variables"),
+  Lib_Orange_Light_Variables: () => import(
+  /* webpackChunkName: 'Lib_Orange_Light_Variables' */
+  "../libraryChunks/variables/component/orange/Orange_Light_Variables"),
+  Lib_Orange_Dark_Variables: () => import(
+  /* webpackChunkName: 'Lib_Orange_Dark_Variables' */
+  "../libraryChunks/variables/component/orange/Orange_Dark_Variables"),
+  Lib_Orange_PureDark_Variables: () => import(
+  /* webpackChunkName: 'Lib_Orange_PureDark_Variables' */
+  "../libraryChunks/variables/component/orange/Orange_PureDark_Variables"),
+  Lib_Red_Light_Variables: () => import(
+  /* webpackChunkName: 'Lib_Red_Light_Variables' */
+  "../libraryChunks/variables/component/red/Red_Light_Variables"),
+  Lib_Red_Dark_Variables: () => import(
+  /* webpackChunkName: 'Lib_Red_Dark_Variables' */
+  "../libraryChunks/variables/component/red/Red_Dark_Variables"),
+  Lib_Red_PureDark_Variables: () => import(
+  /* webpackChunkName: 'Lib_Red_PureDark_Variables' */
+  "../libraryChunks/variables/component/red/Red_PureDark_Variables"),
+  Lib_Yellow_Light_Variables: () => import(
+  /* webpackChunkName: 'Lib_Yellow_Light_Variables' */
+  "../libraryChunks/variables/component/yellow/Yellow_Light_Variables"),
+  Lib_Yellow_Dark_Variables: () => import(
+  /* webpackChunkName: 'Lib_Yellow_Dark_Variables' */
+  "../libraryChunks/variables/component/yellow/Yellow_Dark_Variables"),
+  Lib_Yellow_PureDark_Variables: () => import(
+  /* webpackChunkName: 'Lib_Yellow_PureDark_Variables' */
+  "../libraryChunks/variables/component/yellow/Yellow_PureDark_Variables"),
   Lib_Blue_Light_Component: () => import(
   /* webpackChunkName: 'Lib_Blue_Light_Component' */
   "../libraryChunks/themes/component/blue/Blue_Light_Component"),
@@ -137,6 +182,33 @@ export const themeColorImports = {
   "../libraryChunks/themes/svg/yellow/Yellow_PureDark_SVG")
 };
 export const themeColorMapping = {
+  [LIBRARY_VARIABLES]: {
+    [THEME_COLOR_BLUE]: {
+      [THEME_APPEARANCE_LIGHT]: 'Lib_Blue_Light_Variables',
+      [THEME_APPEARANCE_DARK]: 'Lib_Blue_Dark_Variables',
+      [THEME_APPEARANCE_PURE_DARK]: 'Lib_Blue_PureDark_Variables'
+    },
+    [THEME_COLOR_GREEN]: {
+      [THEME_APPEARANCE_LIGHT]: 'Lib_Green_Light_Variables',
+      [THEME_APPEARANCE_DARK]: 'Lib_Green_Dark_Variables',
+      [THEME_APPEARANCE_PURE_DARK]: 'Lib_Green_PureDark_Variables'
+    },
+    [THEME_COLOR_ORANGE]: {
+      [THEME_APPEARANCE_LIGHT]: 'Lib_Orange_Light_Variables',
+      [THEME_APPEARANCE_DARK]: 'Lib_Orange_Dark_Variables',
+      [THEME_APPEARANCE_PURE_DARK]: 'Lib_Orange_PureDark_Variables'
+    },
+    [THEME_COLOR_RED]: {
+      [THEME_APPEARANCE_LIGHT]: 'Lib_Red_Light_Variables',
+      [THEME_APPEARANCE_DARK]: 'Lib_Red_Dark_Variables',
+      [THEME_APPEARANCE_PURE_DARK]: 'Lib_Red_PureDark_Variables'
+    },
+    [THEME_COLOR_YELLOW]: {
+      [THEME_APPEARANCE_LIGHT]: 'Lib_Yellow_Light_Variables',
+      [THEME_APPEARANCE_DARK]: 'Lib_Yellow_Dark_Variables',
+      [THEME_APPEARANCE_PURE_DARK]: 'Lib_Yellow_PureDark_Variables'
+    }
+  },
   [LIBRARY_COMPONENT]: {
     [THEME_COLOR_BLUE]: {
       [THEME_APPEARANCE_LIGHT]: 'Lib_Blue_Light_Component',

package/es/list/Comment/Comment.module.css

@@ -1,29 +1,29 @@
-.varClass {
-  --icon_color: var(--zdt_comment_iconText);
-}
-.container {
-  composes: varClass;
-  composes: inlineBlockMiddle from '../listCommon.module.css';
-  position: relative;
-  color: var(--icon_color);
-  padding: 0 var(--zd_size2) ;
-  cursor: pointer;
-}
-.container:hover {
-  --icon_color: var(--zdt_comment_hover_iconText);
-}
-.count {
-  position: absolute;
-  top: var(--zd_size1) ;
-  font-size: var(--zd_font_size9) ;
-  text-align: center;
-}
-[dir=ltr] .count {
-  left: 100% ;
-}
-[dir=rtl] .count {
-  right: 100% ;
-}
-.commentIcon {
-  font-size: var(--zd_font_size13) ;
-}
+.varClass {
+  --icon_color: var(--zdt_comment_iconText);
+}
+.container {
+  composes: varClass;
+  composes: inlineBlockMiddle from '../listCommon.module.css';
+  position: relative;
+  color: var(--icon_color);
+  padding: 0 var(--zd_size2) ;
+  cursor: pointer;
+}
+.container:hover {
+  --icon_color: var(--zdt_comment_hover_iconText);
+}
+.count {
+  position: absolute;
+  top: var(--zd_size1) ;
+  font-size: var(--zd_font_size9) ;
+  text-align: center;
+}
+[dir=ltr] .count {
+  left: 100% ;
+}
+[dir=rtl] .count {
+  right: 100% ;
+}
+.commentIcon {
+  font-size: var(--zd_font_size13) ;
+}

package/es/list/DepartmentDropDown/DepartmentDropDown.js

@@ -54,7 +54,8 @@ class DepartmentDropDown extends Component {
       customProps
     } = this.props;
     const {
-      ToggleDropDownProps = {}
+      ToggleDropDownProps = {},
+      DepartmentTextProps = {}
     } = customProps;
     let {
       title = 'Move Department',
@@ -73,10 +74,10 @@ class DepartmentDropDown extends Component {
     }, ToggleDropDownProps, {
       title: title,
       options: departmentList,
-      value: /*#__PURE__*/React.createElement(DepartmentText, {
+      value: /*#__PURE__*/React.createElement(DepartmentText, _extends({}, DepartmentTextProps, {
         text: departmentName,
         dataTitle: departmentName
-      }),
+      })),
       onClick: this.onMoveDepartment,
       isEditable: isEditable,
       onSelectLabel: onSelectLabel,

package/es/list/DepartmentDropDown/props/propTypes.js

@@ -22,6 +22,7 @@ export const propTypes = {
     placeholder: PropTypes.string
   }),
   customProps: PropTypes.shape({
-    ToggleDropDownProps: PropTypes.object
+    ToggleDropDownProps: PropTypes.object,
+    DepartmentTextProps: PropTypes.object
   })
 };

package/es/list/Dot/Dot.module.css

@@ -1,15 +1,15 @@
-.varClass {
-  --dotColor: var(--zdt_dot_text)
-}
-.dot {
-  composes: varClass;
-  font-size: var(--zd_font_size16) ;
-  color: var(--dotColor);
-  transform: perspective(1px);
-}
-.list {
-  margin: 0 var(--zd_size6) ;
-}
-.minimalList {
-  margin: 0 var(--zd_size6) ;
-}
+.varClass {
+  --dotColor: var(--zdt_dot_text)
+}
+.dot {
+  composes: varClass;
+  font-size: var(--zd_font_size16) ;
+  color: var(--dotColor);
+  transform: perspective(1px);
+}
+.list {
+  margin: 0 var(--zd_size6) ;
+}
+.minimalList {
+  margin: 0 var(--zd_size6) ;
+}