@zohodesk/dot 1.0.0-temp-224.1 → 1.0.0-temp-187.23

package/README.md

@@ -2,19 +2,24 @@
 
 In this Library, we Provide Some Basic Components to Build Your Application
 
-# 1.9.0
+# 1.9.2
 
-- Updated @zohodesk-private/color-variable-preprocessor package - Grayscale introduced
+- **Highlight options added**
+  -  Account Name, Contact Name, Department Text, Email, Phone Number, Priority, StatusText, TicketID, Website and Subject components
 
-- **TextEditor**
-  - customClass prop added
-  
-# 1.8.7
+# 1.9.1
 
 - **CheckBoxField, CurrencyField, DateField, MultiSelectField, RadioField, SelectField, TagsMultiSelectField, TextareaField, TextBoxField, TextEditorField**
   - Accessibility Enhanced Label component has been updated in above components
      (v1 folder components excluded)  
 
+# 1.9.0
+
+- Updated @zohodesk-private/color-variable-preprocessor package - Grayscale introduced
+
+- **TextEditor**
+  - customClass prop added
+
 # 1.8.6
 
 - **ToggleDropdown**

package/_react-cli.config.js

@@ -0,0 +1,27 @@
+exports.config= {
+  "preprocess": {
+    "runner": "./preprocess/index.js"
+  },
+  "css": {
+    "cssVariableReplacementConfig": "./node_modules/@zohodesk-private/css-variable-migrator/es/config/cssVariableReplacementOptions.json",
+    "plugins": {
+      "hasRTL": true,
+      "cssVariableReplacement": true
+    },
+    "patterns": {
+      "cssVariableReplacement": [
+        "**/src/**",
+        "**/lib/**",
+        "**/es/**",
+        "!**/node_modules/**"
+      ],
+      "hasRTL":[
+        "**/src/**",
+        "!**/node_modules/**"
+      ]
+    }
+  },
+  app:{
+    disableES5Transpile:true
+  }
+}

package/cbt.config.js

@@ -0,0 +1,41 @@
+
+const path = require('path');
+
+exports.config = {
+  preProcess: {
+    enable: true,
+    runner: './preprocess/index.js'
+  },
+  css: {
+    plugins: {
+      rtl: {
+        enable: true,
+        patterns: [
+          '**/src/**/*.css',
+          '!**/node_modules/**',
+          '**/assets/**/*.css'
+        ]
+      },
+      cssVariableReplacement: {
+        enable: true,
+        configFile:
+          './node_modules/@zohodesk-private/css-variable-migrator/es/config/cssVariableReplacementOptions.json',
+        patterns: [
+          "**/src/**",
+          "!**/node_modules/**"
+        ]
+      }
+    },
+     customPlugins: [
+      {
+        plugin: (options) =>
+          require('postcss-discard-comments')({
+            remove: (c) => { return c.includes('rtl:') }
+          }), 
+        patterns: ['**/assets/**/*.css'],
+        enable: true
+      }
+    ]
+  }
+ 
+};

package/es/AttachmentViewer/AttachmentViewer.js

@@ -1,3 +1,5 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import React, { Component } from 'react';
 import { AttachmentViewer_defaultProps } from "./props/defaultProps";
 import { AttachmentViewer_propTypes } from "./props/propTypes";
@@ -300,11 +302,10 @@ export default class AttachmentViewer extends Component {
   }
 
   renderIframe(previewurl) {
-    return /*#__PURE__*/React.createElement("iframe", {
+    return /*#__PURE__*/React.createElement("iframe", _extends({
       src: previewurl,
-      className: style.previewFrame,
-      ...this.props.customProps.iframeProps
-    });
+      className: style.previewFrame
+    }, this.props.customProps.iframeProps));
   }
 
   imgPreviewView(downloadUrl) {
@@ -387,25 +388,23 @@ export default class AttachmentViewer extends Component {
       }, /*#__PURE__*/React.createElement(Box, {
         className: style.imgRef,
         id: `imgPreviewRef${i}`
-      }, selectedIndex == i && /*#__PURE__*/React.createElement(React.Fragment, null, _this.isAudioFileType(name) ? /*#__PURE__*/React.createElement("audio", {
+      }, selectedIndex == i && /*#__PURE__*/React.createElement(React.Fragment, null, _this.isAudioFileType(name) ? /*#__PURE__*/React.createElement("audio", _extends({
         controls: true,
         className: style.zoomIn,
         "data-id": `${dataId}_audioPreview`,
-        "data-test-id": `${dataId}_audioPreview`,
-        ...audioProps
-      }, /*#__PURE__*/React.createElement("source", {
+        "data-test-id": `${dataId}_audioPreview`
+      }, audioProps), /*#__PURE__*/React.createElement("source", {
         src: previewurl || viewUrl,
         type: `audio/${extension}`
-      })) : _this.isVideoFileType(name) ? /*#__PURE__*/React.createElement("video", {
+      })) : _this.isVideoFileType(name) ? /*#__PURE__*/React.createElement("video", _extends({
         controls: true,
         className: style.zoomIn,
         "data-id": `${dataId}_videoPreview`,
-        "data-test-id": `${dataId}_videoPreview`,
-        ...videoProps
-      }, /*#__PURE__*/React.createElement("source", {
+        "data-test-id": `${dataId}_videoPreview`
+      }, videoProps), /*#__PURE__*/React.createElement("source", {
         src: viewUrl,
         type: `video/${extension}`
-      })) : _this.isImageFileType(name) || children ? /*#__PURE__*/React.createElement(AttachmentImage, {
+      })) : _this.isImageFileType(name) || children ? /*#__PURE__*/React.createElement(AttachmentImage, _extends({
         customClass: {
           customImageClass: `${style.img} ${style.altText} ${canZoom || retainZoom ? isZoomed ? `${style.zoomedImg} ${style.zoomOutCursor}` : `${style.normalImg} ${style.zoomInCursor}` : ''} ${customImageClass}`,
           customChildrenClass
@@ -415,9 +414,8 @@ export default class AttachmentViewer extends Component {
         alt: name,
         dataId: dataId,
         id: `img${i}`,
-        isCover: false,
-        ...imageProps
-      }, children) : type === "document" && previewurl != null ? _this.renderIframe(previewurl) : typeof renderUnSupportedElement === 'function' ? renderUnSupportedElement(data) : /*#__PURE__*/React.createElement("div", {
+        isCover: false
+      }, imageProps), children) : type === "document" && previewurl != null ? _this.renderIframe(previewurl) : typeof renderUnSupportedElement === 'function' ? renderUnSupportedElement(data) : /*#__PURE__*/React.createElement("div", {
         className: style.previewNone
       }, /*#__PURE__*/React.createElement("div", {
         className: style.fileTypeImg
@@ -639,13 +637,12 @@ export default class AttachmentViewer extends Component {
       }, /*#__PURE__*/React.createElement(Container, {
         alignBox: "row",
         align: "both"
-      }, /*#__PURE__*/React.createElement(Avatar, {
+      }, /*#__PURE__*/React.createElement(Avatar, _extends({
         name: authorName,
         size: "xmedium",
         src: authorHref,
-        palette: "info",
-        ...avatarProps
-      }), /*#__PURE__*/React.createElement(Box, {
+        palette: "info"
+      }, avatarProps)), /*#__PURE__*/React.createElement(Box, {
         flexible: true,
         className: style.authorName,
         "data-title": authorName
@@ -681,7 +678,7 @@ export default class AttachmentViewer extends Component {
           eleRef: el => this[`img_${index}`] = el,
           dataId: "attachPreviewList",
           "data-title": name
-        }, isImageFileType || children ? /*#__PURE__*/React.createElement(AttachmentImage, {
+        }, isImageFileType || children ? /*#__PURE__*/React.createElement(AttachmentImage, _extends({
           src: thumbnail || viewUrl,
           size: "small",
           alt: name,
@@ -689,9 +686,8 @@ export default class AttachmentViewer extends Component {
             customImageClass: `${style.image} ${style.altText} ${customImageClass}`,
             customChildrenClass: `${style.crsrPointer} ${customChildrenClass}`
           },
-          dataId: dataId,
-          ...customProps
-        }, children) : this.getPreviewIconData(name, '40'));
+          dataId: dataId
+        }, customProps), children) : this.getPreviewIconData(name, '40'));
       }))))), totalLen !== 1 && /*#__PURE__*/React.createElement(IconButton, {
         dataId: "attachToggle",
         onClick: this.togglePViewList,

package/es/AudioPlayer/Timer/__tests__/Timer.spec.js

@@ -13,8 +13,7 @@ describe('Timer test Cases', () => {
   test('rendering the defult props', () => {
     const {
       asFragment
-    } = render( /*#__PURE__*/React.createElement(Timer, { ...defaultProps
-    }));
+    } = render( /*#__PURE__*/React.createElement(Timer, defaultProps));
     expect(asFragment()).toMatchSnapshot();
   });
 });

package/es/AudioPlayer/__tests__/AudioPlayer.spec.js

@@ -1,3 +1,5 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import React from 'react';
 import { render, fireEvent, screen } from '@testing-library/react';
 import AudioPlayer from "../AudioPlayer";
@@ -11,129 +13,128 @@ describe('AudioPlayer - Snapshot', () => {
   test('Render with default props', () => {
     const {
       asFragment
-    } = render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS
-    }));
+    } = render( /*#__PURE__*/React.createElement(AudioPlayer, DEFAULT_PROPS));
     expect(asFragment()).toMatchSnapshot();
   });
   test('Render with customId and testId', () => {
     const {
       asFragment
-    } = render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    } = render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       customId: "audio-player-customId",
       testId: "audio-player-testId"
-    }));
+    })));
     expect(asFragment()).toMatchSnapshot();
   });
   test('Render with tag attributes', () => {
     const {
       asFragment
-    } = render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    } = render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       tagAttributes: {
         'data-custom-attr': 'true'
       }
-    }));
+    })));
     expect(asFragment()).toMatchSnapshot();
   });
   test('Render with a11y attributes', () => {
     const {
       asFragment
-    } = render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    } = render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       a11yAttributes: {
         role: 'region'
       }
-    }));
+    })));
     expect(asFragment()).toMatchSnapshot();
   });
   test('Render with customClass', () => {
     const {
       asFragment
-    } = render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    } = render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       customClass: "my-audio-player"
-    }));
+    })));
     expect(asFragment()).toMatchSnapshot();
   });
   test('Render with i18nKeys', () => {
     const {
       asFragment
-    } = render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    } = render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       i18nKeys: {
         play: 'Play',
         pause: 'Pause'
       }
-    }));
+    })));
     expect(asFragment()).toMatchSnapshot();
   });
   test('Render with needClose=false', () => {
     const {
       asFragment
-    } = render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    } = render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       needClose: false
-    }));
+    })));
     expect(asFragment()).toMatchSnapshot();
   });
   test('Render with needDownload=false', () => {
     const {
       asFragment
-    } = render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    } = render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       needDownload: false
-    }));
+    })));
     expect(asFragment()).toMatchSnapshot();
   });
   test('Render with needMuteIcon=true', () => {
     const {
       asFragment
-    } = render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    } = render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       needMuteIcon: true
-    }));
+    })));
     expect(asFragment()).toMatchSnapshot();
   });
   test('Render with isPlay=true', () => {
     const {
       asFragment
-    } = render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    } = render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       isPlay: true
-    }));
+    })));
     expect(asFragment()).toMatchSnapshot();
   });
   test('Render with timerFormat=ss:mm', () => {
     const {
       asFragment
-    } = render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    } = render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       timerFormat: "ss:mm"
-    }));
+    })));
     expect(asFragment()).toMatchSnapshot();
   });
   test('Render with forwardStepInSec=10', () => {
     const {
       asFragment
-    } = render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    } = render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       forwardStepInSec: 10
-    }));
+    })));
     expect(asFragment()).toMatchSnapshot();
   });
   test('Render with backwardStepInSec=10', () => {
     const {
       asFragment
-    } = render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    } = render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       backwardStepInSec: 10
-    }));
+    })));
     expect(asFragment()).toMatchSnapshot();
   });
   test('Render with range=50', () => {
     const {
       asFragment
-    } = render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    } = render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       range: 50
-    }));
+    })));
     expect(asFragment()).toMatchSnapshot();
   });
 });
 describe('AudioPlayer - Unit', () => {
   test('Should call togglePlayer on close button click', () => {
     const togglePlayer = jest.fn();
-    render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       togglePlayer: togglePlayer
-    }));
+    })));
     const closeBtn = screen.queryByTestId('audioPlayerClose');
 
     if (closeBtn) {
@@ -143,9 +144,9 @@ describe('AudioPlayer - Unit', () => {
   });
   test('Should call downloadFile on download button click', () => {
     const downloadFile = jest.fn();
-    render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       downloadFile: downloadFile
-    }));
+    })));
     const downloadBtn = screen.queryByTestId('audioDownload');
 
     if (downloadBtn) {
@@ -155,9 +156,9 @@ describe('AudioPlayer - Unit', () => {
   });
   test('Should toggle play/pause on play button click', () => {
     const togglePlayer = jest.fn();
-    render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       togglePlayer: togglePlayer
-    }));
+    })));
     const playBtn = screen.queryByTestId('audioPlayPause');
 
     if (playBtn) {
@@ -166,9 +167,9 @@ describe('AudioPlayer - Unit', () => {
     }
   });
   test('Should mute/unmute on mute button click', () => {
-    render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       needMuteIcon: true
-    }));
+    })));
     const muteBtn = screen.queryByTestId('audioMute');
 
     if (muteBtn) {
@@ -176,9 +177,9 @@ describe('AudioPlayer - Unit', () => {
     }
   });
   test('Should change range on slider input', () => {
-    render( /*#__PURE__*/React.createElement(AudioPlayer, { ...DEFAULT_PROPS,
+    render( /*#__PURE__*/React.createElement(AudioPlayer, _extends({}, DEFAULT_PROPS, {
       range: 0
-    }));
+    })));
     const rangeInput = screen.queryByTestId('audioRange');
 
     if (rangeInput) {

package/es/ChannelIcon/ChannelIcon.js

@@ -1,3 +1,5 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import React, { Component } from 'react';
 import { defaultProps } from "./props/defaultProps";
 import { propTypes } from "./props/propTypes";
@@ -54,7 +56,7 @@ export default class ChannelIcon extends Component {
     return /*#__PURE__*/React.createElement("span", {
       className: style.container,
       "data-selector-id": dataSelectorId
-    }, customizedChannelName ? /*#__PURE__*/React.createElement(Avatar, {
+    }, customizedChannelName ? /*#__PURE__*/React.createElement(Avatar, _extends({
       name: customizedChannelName,
       size: size,
       palette: palette,
@@ -62,9 +64,8 @@ export default class ChannelIcon extends Component {
       customClass: customTextClass,
       dataId: dataId,
       needTitle: title,
-      title: title,
-      ...avatarProps
-    }) : !renderIconOnly ? iconName ? /*#__PURE__*/React.createElement(AvatarIcon, {
+      title: title
+    }, avatarProps)) : !renderIconOnly ? iconName ? /*#__PURE__*/React.createElement(AvatarIcon, _extends({
       name: iconName,
       iconSize: iconSize,
       size: size,
@@ -72,9 +73,8 @@ export default class ChannelIcon extends Component {
       dataId: dataId,
       className: className,
       iconColor: iconColor,
-      title: iconTitle,
-      ...avatarIconProps
-    }) : /*#__PURE__*/React.createElement(Avatar, {
+      title: iconTitle
+    }, avatarIconProps)) : /*#__PURE__*/React.createElement(Avatar, _extends({
       name: name,
       size: size,
       palette: palette,
@@ -82,16 +82,14 @@ export default class ChannelIcon extends Component {
       customClass: customTextClass,
       dataId: dataId,
       needTitle: title,
-      title: title,
-      ...avatarProps
-    }) : /*#__PURE__*/React.createElement(Icon, {
+      title: title
+    }, avatarProps)) : /*#__PURE__*/React.createElement(Icon, _extends({
       name: iconName,
       size: iconSize,
       iconClass: `${iconClass ? iconClass : ''} ${style.iconStyle} ${name && action ? style[`${name.toLowerCase()}_${action.toLowerCase()}`] : ''}`,
       title: iconTitle,
-      dataId: dataId,
-      ...iconProps
-    }), topicIcon ? /*#__PURE__*/React.createElement("span", {
+      dataId: dataId
+    }, iconProps)), topicIcon ? /*#__PURE__*/React.createElement("span", {
       className: `${style.thread} ${needTopicBorder ? style.threadBorder : ''} ${topicClass ? topicClass : ''}`,
       "data-title": topicIconTitle
     }, /*#__PURE__*/React.createElement(Icon, {

package/es/DotProvider/DotProvider.js

@@ -1,3 +1,5 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import React, { useRef, useCallback, forwardRef } from "react";
 import { defaultProps } from "./props/defaultProps";
 import { propTypes } from "./props/propTypes";
@@ -51,9 +53,9 @@ const DotProvider = /*#__PURE__*/forwardRef((props, ref) => {
     onAssetsDownloadSuccess: onAssetsDownloadSuccess,
     getAssetsPromises: getAssetsPromises
   });
-  return /*#__PURE__*/React.createElement(Element, { ...rest,
+  return /*#__PURE__*/React.createElement(Element, _extends({}, rest, {
     ref: getEleRef
-  }, children);
+  }), children);
 });
 DotProvider.propTypes = propTypes;
 DotProvider.defaultProps = defaultProps;

package/es/Drawer/Drawer.js

@@ -1,3 +1,5 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import React from 'react';
 import { Header_defaultProps, Footer_defaultProps, Drawer_defaultProps } from "./props/defaultProps";
 import { Header_propTypes, Content_propTypes, Footer_propTypes, Drawer_propTypes } from "./props/propTypes";
@@ -174,13 +176,12 @@ export default class Drawer extends React.Component {
 
       return child;
     });
-    let content = /*#__PURE__*/React.createElement(Box, {
+    let content = /*#__PURE__*/React.createElement(Box, _extends({
       className: `${style.container} ${style.columns} ${style.drawerModal} ${uptoTablet ? style.mbleSize : style[size]} ${customDrawerClass}`,
       "data-a11y-need-focus-style": "false",
       tabindex: -1,
-      eleRef: this.createRef,
-      ...a11y
-    }, /*#__PURE__*/React.createElement(Card, {
+      eleRef: this.createRef
+    }, a11y), /*#__PURE__*/React.createElement(Card, {
       onClick: e => {
         e && e.stopPropagation && e.stopPropagation();
         onBodyClick(e);

package/es/ExternalLink/ExternalLink.js

@@ -1,3 +1,5 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 /**** Libraries ****/
 import React from 'react';
 import { defaultProps } from "./props/defaultProps";
@@ -29,7 +31,7 @@ export default class ExternalLink extends React.Component {
       customProps
     } = this.props;
     const urlOutput = href && typeof href !== 'boolean' ? this.addHttp(String(href)) : 'javascript:void(0);';
-    return /*#__PURE__*/React.createElement("a", {
+    return /*#__PURE__*/React.createElement("a", _extends({
       href: urlOutput,
       target: target,
       className: `${style.link} ${className ? className : ''}`,
@@ -37,9 +39,8 @@ export default class ExternalLink extends React.Component {
       rel: rel,
       "data-id": dataId,
       "data-test-id": dataId,
-      onClick: onClick,
-      ...customProps
-    }, children);
+      onClick: onClick
+    }, customProps), children);
   }
 
 }

package/es/FlipCard/FlipCard.js

@@ -1,3 +1,5 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import React, { Component } from 'react';
 import { defaultProps } from "./props/defaultProps";
 import { propTypes } from "./props/propTypes";
@@ -87,17 +89,16 @@ export default class FlipCard extends Component {
     }, !noNeedFlip ? /*#__PURE__*/React.createElement(Container, {
       align: "both",
       className: `${style.front} ${frontClass ? frontClass : ''}`
-    }, /*#__PURE__*/React.createElement(CheckBox, {
+    }, /*#__PURE__*/React.createElement(CheckBox, _extends({
       isFilled: isFilledCheckbox,
       checked: isChecked,
       onChange: this.onChange,
       id: `checkbox_${id}`,
-      dataId: `listViewCheckBox_${id}`,
-      ...CheckBoxProps
-    })) : null, /*#__PURE__*/React.createElement(Container, {
+      dataId: `listViewCheckBox_${id}`
+    }, CheckBoxProps))) : null, /*#__PURE__*/React.createElement(Container, {
       align: "both",
       className: style.back
-    }, channel && action ? /*#__PURE__*/React.createElement(ChannelIcon, {
+    }, channel && action ? /*#__PURE__*/React.createElement(ChannelIcon, _extends({
       name: channel,
       action: action,
       size: size,
@@ -110,9 +111,8 @@ export default class FlipCard extends Component {
       customTextClass: customTextClass,
       iconColor: iconColor,
       title: channelTitle,
-      iconTitle: channelTitle,
-      ...ChannelIconProps
-    }) : icon ? /*#__PURE__*/React.createElement(AvatarIcon, {
+      iconTitle: channelTitle
+    }, ChannelIconProps)) : icon ? /*#__PURE__*/React.createElement(AvatarIcon, _extends({
       name: icon,
       iconSize: iconSize,
       size: size,
@@ -120,9 +120,8 @@ export default class FlipCard extends Component {
       dataId: icon,
       className: className,
       iconColor: iconColor,
-      title: needTitle ? name : '',
-      ...AvatarIconProps
-    }) : /*#__PURE__*/React.createElement(AvatarUser, {
+      title: needTitle ? name : ''
+    }, AvatarIconProps)) : /*#__PURE__*/React.createElement(AvatarUser, _extends({
       name: name,
       initial: initial,
       size: size,
@@ -133,9 +132,8 @@ export default class FlipCard extends Component {
       needTitle: needTitle,
       palette: palette,
       textPalette: textPalette,
-      customTextClass: customTextClass,
-      ...AvatarUserProps
-    }))));
+      customTextClass: customTextClass
+    }, AvatarUserProps)))));
   }
 
 }

package/es/IconButton/IconButton.js

@@ -1,3 +1,5 @@
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 import React from 'react';
 import { defaultProps } from "./props/defaultProps";
 import { propTypes } from "./props/propTypes";
@@ -106,7 +108,7 @@ export default class IconButton extends React.Component {
       hoverType: hoverType,
       isDisabled: isDisabled,
       isNeedEffect: isNeedEffect
-    }, /*#__PURE__*/React.createElement(Container, {
+    }, /*#__PURE__*/React.createElement(Container, _extends({
       "aria-label": ariaLabel,
       "aria-haspopup": ariaHaspopup,
       "aria-expanded": ariaExpanded,
@@ -130,9 +132,8 @@ export default class IconButton extends React.Component {
       onKeyDown: this.handleToggle,
       onFocus: this.triggerMouseOver,
       onBlur: this.onBlur,
-      disabled: isDisabled,
-      ...customProps
-    }, iconName ? /*#__PURE__*/React.createElement(Icon, {
+      disabled: isDisabled
+    }, customProps), iconName ? /*#__PURE__*/React.createElement(Icon, {
       isBold: isBold,
       size: iconSize,
       name: iconName,