@zohodesk/components 1.0.0-temp-199.5 → 1.0.0-temp-215

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

@@ -117,8 +117,7 @@ export const MultiSelect_defaultProps = {
   keepSelectedOptions: false,
   selectedOptionsCount: 0,
   cardHeaderName: '',
-  needResponsive: true,
-  customProps: {}
+  needResponsive: true
 };
 export const MultiSelectHeader_defaultProps = {
   dataId: 'MultiSelectHeader'
@@ -162,6 +161,5 @@ export const SelectedOptions_defaultProps = {
   dataId: 'selectedOptions'
 };
 export const Suggestions_defaultProps = {
-  a11y: {},
-  needMultiLineText: false
+  a11y: {}
 };

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

@@ -108,10 +108,7 @@ export const MultiSelect_propTypes = {
   needSelectAll: PropTypes.bool,
   selectAllText: PropTypes.string,
   setAriaId: PropTypes.string,
-  ariaErrorId: PropTypes.string,
-  customProps: {
-    suggestionsProps: PropTypes.object
-  }
+  ariaErrorId: PropTypes.string
 };
 export const MultiSelectHeader_propTypes = {
   dataId: PropTypes.string,
@@ -176,8 +173,7 @@ export const Suggestions_propTypes = {
     logo: PropTypes.string,
     optionType: PropTypes.string,
     listItemProps: PropTypes.object
-  })),
-  needMultiLineText: PropTypes.bool
+  }))
 };
 export const AdvancedGroupMultiSelect_propTypes = {
   animationStyle: PropTypes.string,

package/es/v1/Select/GroupSelect.js

@@ -590,12 +590,8 @@ export class GroupSelectComponent extends PureComponent {
       htmlId,
       iconOnHover,
       isLoading,
-      dataSelectorId,
-      customProps
+      dataSelectorId
     } = this.props;
-    const {
-      suggestionsProps = {}
-    } = customProps;
     i18nKeys = Object.assign({}, i18nKeys, {
       emptyText: i18nKeys.emptyText || emptyMessage,
       searchEmptyText: i18nKeys.searchEmptyText || searchEmptyMessage
@@ -788,8 +784,7 @@ export class GroupSelectComponent extends PureComponent {
             ariaParentRole: 'listbox',
             role: 'option'
           },
-          dataId: `${dataId}_Options`,
-          ...suggestionsProps
+          dataId: `${dataId}_Options`
         }));
       }) : /*#__PURE__*/React.createElement(EmptyState, {
         options: revampedGroups,

package/es/v1/Select/SelectWithAvatar.js

@@ -163,12 +163,8 @@ class SelectWithAvatarComponent extends SelectComponent {
       needEffect,
       isLoading,
       dataSelectorId,
-      getTargetRef,
-      customProps
+      getTargetRef
     } = this.props;
-    const {
-      suggestionsProps = {}
-    } = customProps;
     i18nKeys = Object.assign({}, i18nKeys, {
       emptyText: i18nKeys.emptyText || emptyMessage,
       searchEmptyText: i18nKeys.searchEmptyText || searchEmptyMessage
@@ -325,8 +321,7 @@ class SelectWithAvatarComponent extends SelectComponent {
         a11y: {
           ariaParentRole: 'listbox',
           role: 'option'
-        },
-        ...suggestionsProps
+        }
       }) : /*#__PURE__*/React.createElement(EmptyState, {
         isLoading: isFetchingOptions,
         options: options,

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

@@ -69,8 +69,7 @@ export const GroupSelect_defaultProps = {
   isRestrictScroll: false,
   i18nKeys: {},
   iconOnHover: false,
-  isLoading: false,
-  customProps: {}
+  isLoading: false
 };
 export const SelectWithAvatar_defaultProps = {
   animationStyle: 'bounce',
@@ -96,8 +95,7 @@ export const SelectWithAvatar_defaultProps = {
   isRestrictScroll: false,
   i18nKeys: {},
   needEffect: true,
-  isLoading: false,
-  customProps: {}
+  isLoading: false
 };
 export const SelectWithIcon_defaultProps = {
   isReadOnly: false,

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

@@ -174,10 +174,7 @@ export const GroupSelect_propTypes = {
   }),
   isLoading: PropTypes.bool,
   dataSelectorId: PropTypes.string,
-  isDefaultSelectValue: PropTypes.bool,
-  customProps: PropTypes.shape({
-    suggestionsProps: PropTypes.object
-  })
+  isDefaultSelectValue: PropTypes.bool
 };
 export const SelectWithAvatar_propTypes = { ...Select_propTypes,
   textBoxClass: PropTypes.string,
@@ -238,8 +235,7 @@ export const SelectWithAvatar_propTypes = { ...Select_propTypes,
   htmlId: PropTypes.string,
   needEffect: PropTypes.bool,
   isLoading: PropTypes.bool,
-  dataSelectorId: PropTypes.string,
-  customProps: PropTypes.object
+  dataSelectorId: PropTypes.string
 };
 export const SelectWithIcon_propTypes = {
   animationStyle: PropTypes.oneOf(['default', 'bounce']),

package/es/v1/Typography/Typography.js

@@ -3,7 +3,7 @@ import { defaultProps } from "./props/defaultProps";
 import { propTypes } from "./props/propTypes";
 import cssJSLogic from "./css/cssJSLogic";
 import { mergeStyle } from '@zohodesk/utils';
-import defaultStyle from "./css/Typography.module.css";
+import defaultStyle from "./css/v1_Typography.module.css";
 
 const Typography = props => {
   const {

package/lib/CheckBox/CheckBox.js

@@ -126,16 +126,17 @@ var CheckBox = /*#__PURE__*/function (_React$Component) {
           role = _a11y$role === void 0 ? 'checkbox' : _a11y$role,
           _a11y$ariaChecked = a11y.ariaChecked,
           ariaChecked = _a11y$ariaChecked === void 0 ? checked : _a11y$ariaChecked;
+      var isEditable = !(isReadOnly || disabled);
       return /*#__PURE__*/_react["default"].createElement(_Layout.Container, _extends({
         dataId: dataId,
         isCover: false,
         isInline: text ? false : true,
         alignBox: "row",
         align: "vertical",
-        className: "".concat(_CheckBoxModule["default"].container, " ").concat(accessMode, " ").concat(isReadOnly || disabled ? '' : "".concat(_CheckBoxModule["default"][palette]), " \n        ").concat(checked ? "".concat(_CheckBoxModule["default"]["checked".concat(palette)]) : '', " ").concat(customCheckBox),
+        className: "".concat(_CheckBoxModule["default"].container, " ").concat(accessMode, " ").concat(!isEditable ? '' : "".concat(_CheckBoxModule["default"][palette]), " \n        ").concat(checked ? "".concat(_CheckBoxModule["default"]["checked".concat(palette)]) : '', "  ").concat(customCheckBox),
         "data-title": toolTip,
-        onClick: isReadOnly || disabled ? null : this.onChange,
-        tabIndex: isReadOnly || disabled || ariaHidden ? '-1' : '0',
+        onClick: !isEditable ? null : this.onChange,
+        tabIndex: !isEditable || ariaHidden ? '-1' : '0',
         "aria-checked": ariaChecked,
         eleRef: this.handleGetContainerRef,
         role: role,
@@ -144,7 +145,7 @@ var CheckBox = /*#__PURE__*/function (_React$Component) {
         "aria-hidden": ariaHidden,
         "data-selector-id": dataSelectorId || id
       }, CheckBoxProps), /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
-        className: "".concat(_CheckBoxModule["default"].boxContainer, " ").concat(_CheckBoxModule["default"][size], " ").concat(customCBoxSize, " ").concat(isFilled ? _CheckBoxModule["default"].filled : '')
+        className: "".concat(_CheckBoxModule["default"].boxContainer, " ").concat(_CheckBoxModule["default"][size], " ").concat(customCBoxSize, " ").concat(isFilled ? _CheckBoxModule["default"].filled : '', " ").concat(!isEditable ? "".concat(_CheckBoxModule["default"]["disabled"]) : '')
       }, /*#__PURE__*/_react["default"].createElement("input", {
         type: "hidden",
         id: id,

package/lib/CheckBox/CheckBox.module.css

@@ -97,10 +97,10 @@
   margin-right: var(--zd_size6) ;
 }
 
-.checkedprimary,
+ .checkedprimary,
 .checkeddanger {
   stroke: var(--checkbox_checked_stroke_color);
-}
+} 
 .primary:hover
 /* .primary:focus  */
 {
@@ -138,6 +138,9 @@
 .checkeddangerLabel {
   --checkbox_checked_active_color: var(--zdt_checkbox_danger_stroke_border);
 }
+.disabled {
+  opacity: 0.7
+}
 @keyframes tickAnimate {
   0% {
     stroke-dashoffset: 40;