@zohodesk/components 1.0.0-temp-49 → 1.0.0-temp-52

package/README.md

@@ -32,6 +32,10 @@ In this Package, we Provide Some Basic Components to Build Web App
 - TextBoxIcon
 - Tooltip
 
+# 1.0.0-alpha-230
+
+- Avatar, AdvancedGroupMultiSelect, AdvancedMultiSelect, MultiSelect, MultiSelectWithAvatar, GroupSelect, Select, SelectWithAvatar, SelectWithIcon, TextBoxIcon => Tooltip undefined case solved
+
 # 1.0.0-alpha-229
 
 - MultiSelect, AdvancedMultiSelect => disabledOption Clear icon handled properly

package/{assets → es}/Appearance/dark/mode/darkMode.module.css

@@ -66,8 +66,6 @@
 	--zdt_button_tick_primary_border: var(--zdt_cta_secondary_text);
 	--zdt_button_loading_default_bg: var(--dot_ebonyclay);
 	--zdt_button_loading_linear_gradient: linear-gradient(0deg, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0.9) 100%) 0% 0%, linear-gradient(90deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.6) 100%) 100% 0%, linear-gradient(180deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%) 100% 100%, linear-gradient(360deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 100%) 0% 100%;
-	--zdt_button_loading_primary_linear_gradient: linear-gradient(0deg, rgba(71, 157, 255, 1) 50%, rgba(71, 157, 255, 0.9) 100%) 0% 0%, linear-gradient(90deg, rgba(71, 157, 255, 0.9) 0%, rgba(71, 157, 255, 0.6) 100%) 100% 0%, linear-gradient(180deg, rgba(71, 157, 255, 0.6) 0%, rgba(71, 157, 255, 0.3) 100%) 100% 100%, linear-gradient(360deg, rgba(71, 157, 255, 0.3) 0%, rgba(71, 157, 255, 0) 100%) 0% 100%;
-	--zdt_button_loading_danger_linear_gradient: linear-gradient(0deg, rgba(255, 107, 107, 1) 50%, rgba(255, 107, 107, 0.9) 100%) 0% 0%, linear-gradient(90deg, rgba(255, 107, 107, 0.9) 0%, rgba(255, 107, 107, 0.6) 100%) 100% 0%, linear-gradient(180deg, rgba(255, 107, 107, 0.6) 0%, rgba(255, 107, 107, 0.3) 100%) 100% 100%, linear-gradient(360deg, rgba(255, 107, 107, 0.3) 0%, rgba(255, 107, 107, 0) 100%) 0% 100%;
 	
 	/* button group */
 	--zdt_buttongroup_default_bg: var(--dot_ebonyclay);
@@ -206,9 +204,9 @@
 	
 	/* stencils */
 	--zdt_stencil_primary_bg: var(--zdt_cta_grey_10_bg);
-	--zdt_stencil_primary_gradient_bg: linear-gradient(to left, #383f55 0, #414963 33.33%, #414961 66.66%, #383f55 100%);
+	--zdt_stencil_primary_gradient_bg: linear-gradient(left, #383f55 0, #414963 33.33%, #414961 66.66%, #383f55 100%);
 	--zdt_stencil_secondary_bg: var(--zdt_cta_grey_15_bg);
-	--zdt_stencil_secondary_gradient_bg: linear-gradient(to left, #383f55 0, #414963 33.33%, #414961 66.66%, #383f55 100%);
+	--zdt_stencil_secondary_gradient_bg: linear-gradient(left, #383f55 0, #414963 33.33%, #414961 66.66%, #383f55 100%);
 	
 	/* switch */
 	--zdt_switch_default_off_bg: var(--zdt_cta_grey_35_border);

package/es/Appearance/dark/themes/blue/blueDarkCTATheme.module.css

@@ -0,0 +1,34 @@
+[data-mode='dark'][data-theme='blue'], :global(.blueDarkTheme) [data-desk-theme="blue"] {
+	--zdt_cta_primary_text: #479dff;
+	--zdt_cta_primary_hover_text: #6eb2ff;
+	--zdt_cta_primary_bg: #479dff;
+	--zdt_cta_primary_hover_bg: #1065cc;
+	--zdt_cta_primary_border: #479dff;
+	--zdt_cta_primary_hover_border: #1065cc;
+	--zdt_cta_primary_box_shadow: rgba(10, 115, 235, 0.2);
+	--zdt_cta_primary_hover_box_shadow: rgba(0, 83, 184, 0.25);
+	--zdt_cta_primary_light_bg: #2c3b4d;
+	--zdt_cta_primary_light_hover_bg: #262f3d;
+	--zdt_cta_primary_light_border: var(--zd_primary13);
+	--zdt_cta_secondary_bg: #479dff;
+	--zdt_cta_secondary_text: var(--dot_white);
+	--zdt_cta_secondary_border: rgba(255, 255, 255, 0.15);
+	--zdt_cta_secondary_light_border: #3f536b;
+	--zdt_cta_alpha_text: #479dff;
+	--zdt_cta_alpha_hover_text: #6eb2ff;
+	--zdt_cta_alpha_border: #479dff;
+	--zdt_cta_alpha_hover_border: #1065cc;
+	--zdt_cta_alpha_bg: #253142;
+	--zdt_cta_beta_border: #479dff;
+	--zdt_cta_grey_10_bg: #262f3d;
+	--zdt_cta_grey_10_border: #262f3d;
+	--zdt_cta_grey_15_bg: #2d3748;
+	--zdt_cta_grey_15_border: #2d3748;
+	--zdt_cta_grey_20_bg: #161b23;
+	--zdt_cta_grey_35_bg: #384157;
+	--zdt_cta_grey_35_text: #384157;
+	--zdt_cta_grey_35_border: #384157;
+	--zdt_cta_grey_40_bg: #3e4d63;
+	--zdt_cta_grey_40_text: #3e4d63;
+	--zdt_cta_grey_40_border: #3e4d63
+}

package/es/Appearance/dark/themes/blue/blueDarkComponentTheme.module.css

@@ -0,0 +1,42 @@
+[data-mode='dark'][data-theme='blue'], :global(.blueDarkTheme) [data-desk-theme="blue"] {
+	/* stencil */
+	--zdt_stencil_dark_bg: #383f55;
+	--zdt_stencil_dark_gradient_bg: linear-gradient(left, #383f55 0, #414963 33.33%, #414961 66.66%, #383f55 100%);
+	
+	/* dropbox */
+	--zdt_dropbox_dark_bg: #232b38;
+	
+	/* listitem */
+	--zdt_listitem_dark_bg: #232b38;
+	--zdt_listitem_dark_text: #e2e4e6;
+	--zdt_listitem_dark_effect_bg: #262f3d;
+	--zdt_listitem_dark_active_bg: #3b4d6d;
+	--zdt_listitem_dark_tickicon: #479dff;
+	
+	/* tag */
+	--zdt_tag_dark_text: #d0d0d4;
+	--zdt_tag_dark_bg: #42485f;
+	--zdt_tag_dark_hover_text: #d0d0d4;
+	--zdt_tag_dark_hover_bg: #503348;
+	--zdt_tag_dark_close_bg: #864654;
+	--zdt_tag_dark_close_text: #de3535;
+	
+	/* multiselect */
+	--zdt_multiselect_dark_border: #4b5168;
+	--zdt_multiselect_darkmsg_bg: #232b38;
+	--zdt_multiselect_darkmsg_text: #d0d0d4;
+	--zdt_multiselect_darkdelete_hover_text: #e2e4e6;
+	
+	/* avatar */
+	--zdt_avatar_white_border: #a8b0bd;
+	--zdt_avatar_white_text: var(--dot_white);
+	
+	/* label */
+	--zdt_label_dark_text: #d0d0d4;
+	
+	/* textbox */
+	--zdt_textbox_light_text: var(--dot_white);
+	
+	/* dropdown */
+	--zdt_dropdown_darkheading_text: #a8b0bd;
+}

package/{assets → es}/Appearance/dark/themes/green/greenDarkCTATheme.module.css

@@ -20,15 +20,15 @@
 	--zdt_cta_alpha_hover_border: #0e7c1c;
 	--zdt_cta_alpha_bg: #2a433f;
 	--zdt_cta_beta_border: #45a159;
-	--zdt_cta_grey_10_bg: var(--dot_unknown1);
-	--zdt_cta_grey_10_border: var(--dot_unknown1);
-	--zdt_cta_grey_15_bg: var(--dot_tuna);
-	--zdt_cta_grey_15_border: var(--dot_tuna);
+	--zdt_cta_grey_10_bg: #262f3d;
+	--zdt_cta_grey_10_border: #262f3d;
+	--zdt_cta_grey_15_bg: #2d3748;
+	--zdt_cta_grey_15_border: #2d3748;
 	--zdt_cta_grey_20_bg: #161b23;
-	--zdt_cta_grey_35_bg: var(--dot_brightgrey);
-	--zdt_cta_grey_35_text: var(--dot_brightgrey);
-	--zdt_cta_grey_35_border: var(--dot_brightgrey);
-	--zdt_cta_grey_40_bg: var(--dot_riverbed);
-	--zdt_cta_grey_40_text: var(--dot_riverbed);
-	--zdt_cta_grey_40_border: var(--dot_riverbed)
+	--zdt_cta_grey_35_bg: #384157;
+	--zdt_cta_grey_35_text: #384157;
+	--zdt_cta_grey_35_border: #384157;
+	--zdt_cta_grey_40_bg: #3e4d63;
+	--zdt_cta_grey_40_text: #3e4d63;
+	--zdt_cta_grey_40_border: #3e4d63
 }

package/es/Appearance/dark/themes/green/greenDarkComponentTheme.module.css

@@ -0,0 +1,42 @@
+[data-mode='dark'][data-theme='green'] {
+	/* stencil */
+	--zdt_stencil_dark_bg: #383f55;
+	--zdt_stencil_dark_gradient_bg: linear-gradient(left, #383f55 0, #414963 33.33%, #414961 66.66%, #383f55 100%);
+	
+	/* dropbox */
+	--zdt_dropbox_dark_bg: #232b38;
+	
+	/* listitem */
+	--zdt_listitem_dark_bg: #232b38;
+	--zdt_listitem_dark_text: #e2e4e6;
+	--zdt_listitem_dark_effect_bg: #262f3d;
+	--zdt_listitem_dark_active_bg: #3b4d6d;
+	--zdt_listitem_dark_tickicon: #45a159;
+	
+	/* tag */
+	--zdt_tag_dark_text: #d0d0d4;
+	--zdt_tag_dark_bg: #42485f;
+	--zdt_tag_dark_hover_text: #d0d0d4;
+	--zdt_tag_dark_hover_bg: #503348;
+	--zdt_tag_dark_close_bg: #864654;
+	--zdt_tag_dark_close_text: #de3535;
+	
+	/* multiselect */
+	--zdt_multiselect_dark_border: #4b5168;
+	--zdt_multiselect_darkmsg_bg: #232b38;
+	--zdt_multiselect_darkmsg_text: #d0d0d4;
+	--zdt_multiselect_darkdelete_hover_text: #e2e4e6;
+	
+	/* avatar */
+	--zdt_avatar_white_border: #a8b0bd;
+	--zdt_avatar_white_text: var(--dot_white);
+	
+	/* label */
+	--zdt_label_dark_text: #d0d0d4;
+	
+	/* textbox */
+	--zdt_textbox_light_text: var(--dot_white);
+	
+	/* dropdown */
+	--zdt_dropdown_darkheading_text: #a8b0bd;
+}

package/{assets → es}/Appearance/dark/themes/orange/orangeDarkCTATheme.module.css

@@ -20,15 +20,15 @@
 	--zdt_cta_alpha_hover_border: #a85100;
 	--zdt_cta_alpha_bg: #393335;
 	--zdt_cta_beta_border: #ff801f;
-	--zdt_cta_grey_10_bg: var(--dot_unknown1);
-	--zdt_cta_grey_10_border: var(--dot_unknown1);
-	--zdt_cta_grey_15_bg: var(--dot_tuna);
-	--zdt_cta_grey_15_border: var(--dot_tuna);
+	--zdt_cta_grey_10_bg: #262f3d;
+	--zdt_cta_grey_10_border: #262f3d;
+	--zdt_cta_grey_15_bg: #2d3748;
+	--zdt_cta_grey_15_border: #2d3748;
 	--zdt_cta_grey_20_bg: #161b23;
-	--zdt_cta_grey_35_bg: var(--dot_brightgrey);
-	--zdt_cta_grey_35_text: var(--dot_brightgrey);
-	--zdt_cta_grey_35_border: var(--dot_brightgrey);
-	--zdt_cta_grey_40_bg: var(--dot_riverbed);
-	--zdt_cta_grey_40_text: var(--dot_riverbed);
-	--zdt_cta_grey_40_border: var(--dot_riverbed)
+	--zdt_cta_grey_35_bg: #384157;
+	--zdt_cta_grey_35_text: #384157;
+	--zdt_cta_grey_35_border: #384157;
+	--zdt_cta_grey_40_bg: #3e4d63;
+	--zdt_cta_grey_40_text: #3e4d63;
+	--zdt_cta_grey_40_border: #3e4d63
 }

package/es/Appearance/dark/themes/orange/orangeDarkComponentTheme.module.css

@@ -0,0 +1,42 @@
+[data-mode='dark'][data-theme='orange'] {
+	/* stencil */
+	--zdt_stencil_dark_bg: #383f55;
+	--zdt_stencil_dark_gradient_bg: linear-gradient(left, #383f55 0, #414963 33.33%, #414961 66.66%, #383f55 100%);
+	
+	/* dropbox */
+	--zdt_dropbox_dark_bg: #232b38;
+	
+	/* listitem */
+	--zdt_listitem_dark_bg: #232b38;
+	--zdt_listitem_dark_text: #e2e4e6;
+	--zdt_listitem_dark_effect_bg: #262f3d;
+	--zdt_listitem_dark_active_bg: #3b4d6d;
+	--zdt_listitem_dark_tickicon: #e94f4f;
+	
+	/* tag */
+	--zdt_tag_dark_text: #d0d0d4;
+	--zdt_tag_dark_bg: #42485f;
+	--zdt_tag_dark_hover_text: #d0d0d4;
+	--zdt_tag_dark_hover_bg: #503348;
+	--zdt_tag_dark_close_bg: #864654;
+	--zdt_tag_dark_close_text: #de3535;
+	
+	/* multiselect */
+	--zdt_multiselect_dark_border: #4b5168;
+	--zdt_multiselect_darkmsg_bg: #232b38;
+	--zdt_multiselect_darkmsg_text: #d0d0d4;
+	--zdt_multiselect_darkdelete_hover_text: #e2e4e6;
+	
+	/* avatar */
+	--zdt_avatar_white_border: #a8b0bd;
+	--zdt_avatar_white_text: var(--dot_white);
+	
+	/* label */
+	--zdt_label_dark_text: #d0d0d4;
+	
+	/* textbox */
+	--zdt_textbox_light_text: var(--dot_white);
+	
+	/* dropdown */
+	--zdt_dropdown_darkheading_text: #a8b0bd;
+}

package/{assets → es}/Appearance/dark/themes/red/redDarkCTATheme.module.css

@@ -20,15 +20,15 @@
 	--zdt_cta_alpha_hover_border: #a81111;
 	--zdt_cta_alpha_bg: #372f3a;
 	--zdt_cta_beta_border: #e94f4f;
-	--zdt_cta_grey_10_bg: var(--dot_unknown1);
-	--zdt_cta_grey_10_border: var(--dot_unknown1);
-	--zdt_cta_grey_15_bg: var(--dot_tuna);
-	--zdt_cta_grey_15_border: var(--dot_tuna);
+	--zdt_cta_grey_10_bg: #262f3d;
+	--zdt_cta_grey_10_border: #262f3d;
+	--zdt_cta_grey_15_bg: #2d3748;
+	--zdt_cta_grey_15_border: #2d3748;
 	--zdt_cta_grey_20_bg: #161b23;
-	--zdt_cta_grey_35_bg: var(--dot_brightgrey);
-	--zdt_cta_grey_35_text: var(--dot_brightgrey);
-	--zdt_cta_grey_35_border: var(--dot_brightgrey);
-	--zdt_cta_grey_40_bg: var(--dot_riverbed);
-	--zdt_cta_grey_40_text: var(--dot_riverbed);
-	--zdt_cta_grey_40_border: var(--dot_riverbed)
+	--zdt_cta_grey_35_bg: #384157;
+	--zdt_cta_grey_35_text: #384157;
+	--zdt_cta_grey_35_border: #384157;
+	--zdt_cta_grey_40_bg: #3e4d63;
+	--zdt_cta_grey_40_text: #3e4d63;
+	--zdt_cta_grey_40_border: #3e4d63
 }

package/es/Appearance/dark/themes/red/redDarkComponentTheme.module.css

@@ -0,0 +1,42 @@
+[data-mode='dark'][data-theme='red'] {
+	/* stencil */
+	--zdt_stencil_dark_bg: #383f55;
+	--zdt_stencil_dark_gradient_bg: linear-gradient(left, #383f55 0, #414963 33.33%, #414961 66.66%, #383f55 100%);
+	
+	/* dropbox */
+	--zdt_dropbox_dark_bg: #232b38;
+	
+	/* listitem */
+	--zdt_listitem_dark_bg: #232b38;
+	--zdt_listitem_dark_text: #e2e4e6;
+	--zdt_listitem_dark_effect_bg: #262f3d;
+	--zdt_listitem_dark_active_bg: #3b4d6d;
+	--zdt_listitem_dark_tickicon: #ff801f;
+	
+	/* tag */
+	--zdt_tag_dark_text: #d0d0d4;
+	--zdt_tag_dark_bg: #42485f;
+	--zdt_tag_dark_hover_text: #d0d0d4;
+	--zdt_tag_dark_hover_bg: #503348;
+	--zdt_tag_dark_close_bg: #864654;
+	--zdt_tag_dark_close_text: #de3535;
+	
+	/* multiselect */
+	--zdt_multiselect_dark_border: #4b5168;
+	--zdt_multiselect_darkmsg_bg: #232b38;
+	--zdt_multiselect_darkmsg_text: #d0d0d4;
+	--zdt_multiselect_darkdelete_hover_text: #e2e4e6;
+	
+	/* avatar */
+	--zdt_avatar_white_border: #a8b0bd;
+	--zdt_avatar_white_text: var(--dot_white);
+	
+	/* label */
+	--zdt_label_dark_text: #d0d0d4;
+	
+	/* textbox */
+	--zdt_textbox_light_text: var(--dot_white);
+	
+	/* dropdown */
+	--zdt_dropdown_darkheading_text: #a8b0bd;
+}

package/{assets → es}/Appearance/dark/themes/yellow/yellowDarkCTATheme.module.css

@@ -20,15 +20,15 @@
 	--zdt_cta_alpha_hover_border: #9b6808;
 	--zdt_cta_alpha_bg: #353638;
 	--zdt_cta_beta_border: #d79835;
-	--zdt_cta_grey_10_bg: var(--dot_unknown1);
-	--zdt_cta_grey_10_border: var(--dot_unknown1);
-	--zdt_cta_grey_15_bg: var(--dot_tuna);
-	--zdt_cta_grey_15_border: var(--dot_tuna);
+	--zdt_cta_grey_10_bg: #262f3d;
+	--zdt_cta_grey_10_border: #262f3d;
+	--zdt_cta_grey_15_bg: #2d3748;
+	--zdt_cta_grey_15_border: #2d3748;
 	--zdt_cta_grey_20_bg: #161b23;
-	--zdt_cta_grey_35_bg: var(--dot_brightgrey);
-	--zdt_cta_grey_35_text: var(--dot_brightgrey);
-	--zdt_cta_grey_35_border: var(--dot_brightgrey);
-	--zdt_cta_grey_40_bg: var(--dot_riverbed);
-	--zdt_cta_grey_40_text: var(--dot_riverbed);
-	--zdt_cta_grey_40_border: var(--dot_riverbed)
+	--zdt_cta_grey_35_bg: #384157;
+	--zdt_cta_grey_35_text: #384157;
+	--zdt_cta_grey_35_border: #384157;
+	--zdt_cta_grey_40_bg: #3e4d63;
+	--zdt_cta_grey_40_text: #3e4d63;
+	--zdt_cta_grey_40_border: #3e4d63
 }

package/es/Appearance/dark/themes/yellow/yellowDarkComponentTheme.module.css

@@ -0,0 +1,42 @@
+[data-mode='dark'][data-theme='yellow'] {
+	/* stencil */
+	--zdt_stencil_dark_bg: #383f55;
+	--zdt_stencil_dark_gradient_bg: linear-gradient(left, #383f55 0, #414963 33.33%, #414961 66.66%, #383f55 100%);
+	
+	/* dropbox */
+	--zdt_dropbox_dark_bg: #232b38;
+	
+	/* listitem */
+	--zdt_listitem_dark_bg: #232b38;
+	--zdt_listitem_dark_text: #e2e4e6;
+	--zdt_listitem_dark_effect_bg: #262f3d;
+	--zdt_listitem_dark_active_bg: #3b4d6d;
+	--zdt_listitem_dark_tickicon: #d79835;
+	
+	/* tag */
+	--zdt_tag_dark_text: #d0d0d4;
+	--zdt_tag_dark_bg: #42485f;
+	--zdt_tag_dark_hover_text: #d0d0d4;
+	--zdt_tag_dark_hover_bg: #503348;
+	--zdt_tag_dark_close_bg: #864654;
+	--zdt_tag_dark_close_text: #de3535;
+	
+	/* multiselect */
+	--zdt_multiselect_dark_border: #4b5168;
+	--zdt_multiselect_darkmsg_bg: #232b38;
+	--zdt_multiselect_darkmsg_text: #d0d0d4;
+	--zdt_multiselect_darkdelete_hover_text: #e2e4e6;
+	
+	/* avatar */
+	--zdt_avatar_white_border: #a8b0bd;
+	--zdt_avatar_white_text: var(--dot_white);
+	
+	/* label */
+	--zdt_label_dark_text: #d0d0d4;
+	
+	/* textbox */
+	--zdt_textbox_light_text: var(--dot_white);
+	
+	/* dropdown */
+	--zdt_dropdown_darkheading_text: #a8b0bd;
+}

package/{assets → es}/Appearance/default/mode/defaultMode.module.css

@@ -66,8 +66,6 @@
 	--zdt_button_tick_primary_border: var(--zdt_cta_secondary_text);
 	--zdt_button_loading_default_bg: var(--dot_white);
 	--zdt_button_loading_linear_gradient: linear-gradient(0deg, rgba(255, 255, 255, 1) 50%, rgba(255, 255, 255, 0.9) 100%) 0% 0%, linear-gradient(90deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.6) 100%) 100% 0%, linear-gradient(180deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.3) 100%) 100% 100%, linear-gradient(360deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0) 100%) 0% 100%;
-	--zdt_button_loading_primary_linear_gradient: linear-gradient(0deg, rgba(10, 115, 235, 1) 50%, rgba(10, 115, 235, 0.9) 100%) 0% 0%, linear-gradient(90deg, rgba(10, 115, 235, 0.9) 0%, rgba(10, 115, 235, 0.6) 100%) 100% 0%, linear-gradient(180deg, rgba(10, 115, 235, 0.6) 0%, rgba(10, 115, 235, 0.3) 100%) 100% 100%, linear-gradient(360deg, rgba(10, 115, 235, 0.3) 0%, rgba(10, 115, 235, 0) 100%) 0% 100%;
-	--zdt_button_loading_danger_linear_gradient: linear-gradient(0deg, rgba(222, 53, 53, 1) 50%, rgba(222, 53, 53, 0.9) 100%) 0% 0%, linear-gradient(90deg, rgba(222, 53, 53, 0.9) 0%, rgba(222, 53, 53, 0.6) 100%) 100% 0%, linear-gradient(180deg, rgba(222, 53, 53, 0.6) 0%, rgba(222, 53, 53, 0.3) 100%) 100% 100%, linear-gradient(360deg, rgba(222, 53, 53, 0.3) 0%, rgba(222, 53, 53, 0) 100%) 0% 100%;
 	
 	/* button group */
 	--zdt_buttongroup_default_bg: var(--dot_white);
@@ -206,9 +204,9 @@
 	
 	/* stencils */
 	--zdt_stencil_primary_bg: var(--zdt_cta_grey_10_bg);
-	--zdt_stencil_primary_gradient_bg: linear-gradient(to left, var(--dot_catskillWhite) 0%, var(--dot_hawkesBlue) 33.33%, var(--dot_catskillWhite) 66.66%, var(--dot_catskillWhite) 100%);
+	--zdt_stencil_primary_gradient_bg: linear-gradient(left, var(--dot_catskillWhite) 0, var(--dot_hawkesBlue) 33.33%, var(--dot_catskillWhite) 66.66%, var(--dot_catskillWhite) 100%);
 	--zdt_stencil_secondary_bg: var(--zdt_cta_grey_15_bg);
-	--zdt_stencil_secondary_gradient_bg: linear-gradient(to left, var(--dot_solitude) 0%, var(--dot_paleBlue) 33.33%, var(--dot_solitude) 66.66%, var(--dot_solitude) 100%);
+	--zdt_stencil_secondary_gradient_bg: linear-gradient(left, var(--dot_solitude) 0, var(--dot_paleBlue) 33.33%, var(--dot_solitude) 66.66%, var(--dot_solitude) 100%);
 	
 	/* switch */
 	--zdt_switch_default_off_bg: var(--zdt_cta_grey_35_border);

package/{assets → es}/Appearance/default/themes/blue/blueDefaultComponentTheme.module.css

@@ -1,13 +1,13 @@
 [data-mode='default'][data-theme='blue'], :global(.blueDefaultTheme) [data-desk-theme="blue"] {
 	/* stencil */
 	--zdt_stencil_dark_bg: #383f55;
-	--zdt_stencil_dark_gradient_bg: linear-gradient(to left, #383f55 0%, #414963 33.33%, #414961 66.66%, #383f55 100%);
+	--zdt_stencil_dark_gradient_bg: linear-gradient(left, #383f55 0, #414963 33.33%, #414961 66.66%, #383f55 100%);
 	
 	/* dropbox */
-	--zdt_dropbox_dark_bg: var(--dot_unknown2);
+	--zdt_dropbox_dark_bg: #383f57;
 	
 	/* listitem */
-	--zdt_listitem_dark_bg: var(--dot_unknown2);
+	--zdt_listitem_dark_bg: #383f57;
 	--zdt_listitem_dark_text: #d0d0d4;
 	--zdt_listitem_dark_effect_bg: #444a61;
 	--zdt_listitem_dark_active_bg: #3b4d6d;
@@ -17,13 +17,13 @@
 	--zdt_tag_dark_text: #d0d0d4;
 	--zdt_tag_dark_bg: #42485f;
 	--zdt_tag_dark_hover_text: #d0d0d4;
-	--zdt_tag_dark_hover_bg: var(--dot_matterhorn);
+	--zdt_tag_dark_hover_bg: #503348;
 	--zdt_tag_dark_close_bg: #864654;
-	--zdt_tag_dark_close_text: var(--dot_brightRed);
+	--zdt_tag_dark_close_text: #de3535;
 	
 	/* multiselect */
-	--zdt_multiselect_dark_border: var(--dot_mulledwine);
-	--zdt_multiselect_darkmsg_bg: var(--dot_unknown2);
+	--zdt_multiselect_dark_border: #4b5168;
+	--zdt_multiselect_darkmsg_bg: #383f57;
 	--zdt_multiselect_darkmsg_text: #d0d0d4;
 	--zdt_multiselect_darkdelete_hover_text: var(--dot_white);
 	

package/{assets → es}/Appearance/default/themes/green/greenDefaultCTATheme.module.css

@@ -7,12 +7,12 @@
 	--zdt_cta_primary_hover_border: #0e7526;
 	--zdt_cta_primary_box_shadow: rgba(38, 169, 66, 0.2);
 	--zdt_cta_primary_hover_box_shadow: rgba(14, 117, 38, 0.25);
-	--zdt_cta_primary_light_bg: var(--dot_blacksqueeze);
+	--zdt_cta_primary_light_bg: #f2faf5;
 	--zdt_cta_primary_light_hover_bg: #d4eed9;
 	--zdt_cta_primary_light_border: #d4eed9;
 	--zdt_cta_secondary_bg: #26a942;
 	--zdt_cta_secondary_text: var(--dot_white);
-	--zdt_cta_secondary_border: var(--dot_darkmint);
+	--zdt_cta_secondary_border: #4ac064;
 	--zdt_cta_secondary_light_border: #bee5c6;
 	--zdt_cta_alpha_text: #26a942;
 	--zdt_cta_alpha_hover_text: #0e7526;

package/{assets → es}/Appearance/default/themes/green/greenDefaultComponentTheme.module.css

@@ -1,7 +1,7 @@
 [data-mode='default'][data-theme='green'] {
 	/* stencil */
 	--zdt_stencil_dark_bg: rgba(255, 255, 255, 0.07);
-	--zdt_stencil_dark_gradient_bg: linear-gradient(to left, rgba(255, 255, 255, 0.07) 0%, rgba(255, 255, 255, 0.03) 33.33%, rgba(255, 255, 255, 0.03) 66.66%, rgba(255, 255, 255, 0.07) 100%);
+	--zdt_stencil_dark_gradient_bg: linear-gradient(left, rgba(255, 255, 255, 0.07) 0, rgba(255, 255, 255, 0.03) 33.33%, rgba(255, 255, 255, 0.03) 66.66%, rgba(255, 255, 255, 0.07) 100%);
 	
 	/* dropbox */
 	--zdt_dropbox_dark_bg: #1d2f33;
@@ -11,15 +11,15 @@
 	--zdt_listitem_dark_text: #d0d0d4;
 	--zdt_listitem_dark_effect_bg: rgba(255, 255, 255, 0.12);
 	--zdt_listitem_dark_active_bg: #2d484e;
-	--zdt_listitem_dark_tickicon: var(--dot_darkmint);
+	--zdt_listitem_dark_tickicon: #4ac064;
 	
 	/* tag */
 	--zdt_tag_dark_text: #d0d0d4;
 	--zdt_tag_dark_bg: rgba(255, 255, 255, 0.07);
 	--zdt_tag_dark_hover_text: #d0d0d4;
-	--zdt_tag_dark_hover_bg: var(--dot_matterhorn);
+	--zdt_tag_dark_hover_bg: #503348;
 	--zdt_tag_dark_close_bg: #864654;
-	--zdt_tag_dark_close_text: var(--dot_brightRed);
+	--zdt_tag_dark_close_text: #de3535;
 	
 	/* multiselect */
 	--zdt_multiselect_dark_border: rgba(255, 255, 255, 0.2);

package/{assets → es}/Appearance/default/themes/orange/orangeDefaultComponentTheme.module.css

@@ -1,7 +1,7 @@
 [data-mode='default'][data-theme='orange'] {
 	/* stencil */
 	--zdt_stencil_dark_bg: rgba(255, 255, 255, 0.07);
-	--zdt_stencil_dark_gradient_bg: linear-gradient(to left, rgba(255, 255, 255, 0.07) 0%, rgba(255, 255, 255, 0.03) 33.33%, rgba(255, 255, 255, 0.03) 66.66%, rgba(255, 255, 255, 0.07) 100%);
+	--zdt_stencil_dark_gradient_bg: linear-gradient(left, rgba(255, 255, 255, 0.07) 0, rgba(255, 255, 255, 0.03) 33.33%, rgba(255, 255, 255, 0.03) 66.66%, rgba(255, 255, 255, 0.07) 100%);
 	
 	/* dropbox */
 	--zdt_dropbox_dark_bg: #332e24;
@@ -17,9 +17,9 @@
 	--zdt_tag_dark_text: #d0d0d4;
 	--zdt_tag_dark_bg: rgba(255, 255, 255, 0.07);
 	--zdt_tag_dark_hover_text: #d0d0d4;
-	--zdt_tag_dark_hover_bg: var(--dot_matterhorn);
+	--zdt_tag_dark_hover_bg: #503348;
 	--zdt_tag_dark_close_bg: #864654;
-	--zdt_tag_dark_close_text: var(--dot_brightRed);
+	--zdt_tag_dark_close_text: #de3535;
 	
 	/* multiselect */
 	--zdt_multiselect_dark_border: rgba(255, 255, 255, 0.2);

package/{assets → es}/Appearance/default/themes/red/redDefaultCTATheme.module.css

@@ -1,25 +1,25 @@
 [data-mode='default'][data-theme='red'] {
-	--zdt_cta_primary_text: var(--dot_brightRed);
+	--zdt_cta_primary_text: #de3535;
 	--zdt_cta_primary_hover_text: #ab1a18;
-	--zdt_cta_primary_bg: var(--dot_brightRed);
+	--zdt_cta_primary_bg: #de3535;
 	--zdt_cta_primary_hover_bg: #ab1a18;
-	--zdt_cta_primary_border: var(--dot_brightRed);
+	--zdt_cta_primary_border: #de3535;
 	--zdt_cta_primary_hover_border: #ab1a18;
 	--zdt_cta_primary_box_shadow: rgba(222, 53, 53, 0.2);
 	--zdt_cta_primary_hover_box_shadow: rgba(171, 26, 24, 0.25);
 	--zdt_cta_primary_light_bg: #fdf3f3;
 	--zdt_cta_primary_light_hover_bg: #f8d7d7;
 	--zdt_cta_primary_light_border: #f8d7d7;
-	--zdt_cta_secondary_bg: var(--dot_brightRed);
+	--zdt_cta_secondary_bg: #de3535;
 	--zdt_cta_secondary_text: var(--dot_white);
 	--zdt_cta_secondary_border: #e55d5d;
 	--zdt_cta_secondary_light_border: #f8d7d7;
-	--zdt_cta_alpha_text: var(--dot_brightRed);
+	--zdt_cta_alpha_text: #de3535;
 	--zdt_cta_alpha_hover_text: #ab1a18;
-	--zdt_cta_alpha_border: var(--dot_brightRed);
+	--zdt_cta_alpha_border: #de3535;
 	--zdt_cta_alpha_hover_border: #ab1a18;
 	--zdt_cta_alpha_bg: #f8d7d7;
-	--zdt_cta_beta_border: var(--dot_brightRed);
+	--zdt_cta_beta_border: #de3535;
 	--zdt_cta_grey_10_bg: #f9f6f7;
 	--zdt_cta_grey_10_border: #f9f6f7;
 	--zdt_cta_grey_15_bg: #ede8e8;

package/{assets → es}/Appearance/default/themes/red/redDefaultComponentTheme.module.css

@@ -1,7 +1,7 @@
 [data-mode='default'][data-theme='red'] {
 	/* stencil */
 	--zdt_stencil_dark_bg: rgba(255, 255, 255, 0.07);
-	--zdt_stencil_dark_gradient_bg: linear-gradient(to left, rgba(255, 255, 255, 0.07) 0%, rgba(255, 255, 255, 0.03) 33.33%, rgba(255, 255, 255, 0.03) 66.66%, rgba(255, 255, 255, 0.07) 100%);
+	--zdt_stencil_dark_gradient_bg: linear-gradient(left, rgba(255, 255, 255, 0.07) 0, rgba(255, 255, 255, 0.03) 33.33%, rgba(255, 255, 255, 0.03) 66.66%, rgba(255, 255, 255, 0.07) 100%);
 	
 	/* dropbox */
 	--zdt_dropbox_dark_bg: #34222d;
@@ -17,9 +17,9 @@
 	--zdt_tag_dark_text: #d0d0d4;
 	--zdt_tag_dark_bg: rgba(255, 255, 255, 0.07);
 	--zdt_tag_dark_hover_text: #d0d0d4;
-	--zdt_tag_dark_hover_bg: var(--dot_matterhorn);
+	--zdt_tag_dark_hover_bg: #503348;
 	--zdt_tag_dark_close_bg: #864654;
-	--zdt_tag_dark_close_text: var(--dot_brightRed);
+	--zdt_tag_dark_close_text: #de3535;
 	
 	/* multiselect */
 	--zdt_multiselect_dark_border: rgba(255, 255, 255, 0.2);

package/{assets → es}/Appearance/default/themes/yellow/yellowDefaultComponentTheme.module.css

@@ -1,7 +1,7 @@
 [data-mode='default'][data-theme='yellow'] {
 	/* stencil */
 	--zdt_stencil_dark_bg: rgba(255, 255, 255, 0.07);
-	--zdt_stencil_dark_gradient_bg: linear-gradient(to left, rgba(255, 255, 255, 0.07) 0%, rgba(255, 255, 255, 0.03) 33.33%, rgba(255, 255, 255, 0.03) 66.66%, rgba(255, 255, 255, 0.07) 100%);
+	--zdt_stencil_dark_gradient_bg: linear-gradient(left, rgba(255, 255, 255, 0.07) 0, rgba(255, 255, 255, 0.03) 33.33%, rgba(255, 255, 255, 0.03) 66.66%, rgba(255, 255, 255, 0.07) 100%);
 	
 	/* dropbox */
 	--zdt_dropbox_dark_bg: #313323;
@@ -17,9 +17,9 @@
 	--zdt_tag_dark_text: #d0d0d4;
 	--zdt_tag_dark_bg: rgba(255, 255, 255, 0.07);
 	--zdt_tag_dark_hover_text: #d0d0d4;
-	--zdt_tag_dark_hover_bg: var(--dot_matterhorn);
+	--zdt_tag_dark_hover_bg: #503348;
 	--zdt_tag_dark_close_bg: #864654;
-	--zdt_tag_dark_close_text: var(--dot_brightRed);
+	--zdt_tag_dark_close_text: #de3535;
 	
 	/* multiselect */
 	--zdt_multiselect_dark_border: rgba(255, 255, 255, 0.2);

package/es/Avatar/Avatar.js

@@ -145,7 +145,7 @@ export default class Avatar extends React.Component {
     borderStyle = showAlternateAvatar ? '' : borderStyle;
     return /*#__PURE__*/React.createElement("div", _extends({
       className: `${style.avatar} ${style[size]} ${AvatarSize(size)} ${style[shapeStyle]} ${style[palette]} ${textStyle} ${borderStyle} ${customClass ? customClass : ''}`,
-      "data-title": needTitle ? title ? title : name : '',
+      "data-title": needTitle ? title ? title : name : null,
       "data-id": dataId,
       onClick: onClick
     }, AvatarProps), showInitial && !showAlternateAvatar && /*#__PURE__*/React.createElement("span", {