@zohodesk/dot 1.7.7 → 1.7.8

package/es/IconButton/__tests__/__snapshots__/IconButton.spec.js.snap

@@ -4,7 +4,7 @@ exports[`IconButton Checking the "Children" 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -27,7 +27,7 @@ exports[`IconButton eleRef prop is a function 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -45,7 +45,7 @@ exports[`IconButton rendering ally 1`] = `
     aria-label="ariaLabel"
     aria-labelledby="ariaLabelledby"
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -60,7 +60,7 @@ exports[`IconButton rendering ally 2`] = `
     aria-expanded="false"
     aria-haspopup="false"
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -73,7 +73,7 @@ exports[`IconButton rendering in ClassName 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper IconButtonClass undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper IconButtonClass undefined effect default border defaultHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -86,7 +86,7 @@ exports[`IconButton rendering in Icon 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -108,7 +108,7 @@ exports[`IconButton rendering in dataIsHtml is True 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="true"
     data-selector-id="iconButton"
@@ -121,7 +121,7 @@ exports[`IconButton rendering in isDisabled is True 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border defaultHover   disabled inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border defaultHover   disabled inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -135,7 +135,7 @@ exports[`IconButton rendering in title 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -149,7 +149,7 @@ exports[`IconButton rendering isNeedEffect is False 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  undefined  inflex coldir both"
+    class="buttonReset large wrapper  undefined  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -162,7 +162,7 @@ exports[`IconButton rendering needButtonTag 1`] = `
 <DocumentFragment>
   <div
     aria-pressed="false"
-    class="false wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    class="large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -175,7 +175,7 @@ exports[`IconButton rendering the defult props 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -188,7 +188,7 @@ exports[`IconButton rendering the hovertypes- bg 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border bgHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border bgHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -201,7 +201,7 @@ exports[`IconButton rendering the hovertypes- border 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border borderHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border borderHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -214,7 +214,7 @@ exports[`IconButton rendering the hovertypes- default 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -227,7 +227,7 @@ exports[`IconButton rendering the isActive true with palette of- default 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border defaultHover active hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border defaultHover active hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -240,7 +240,7 @@ exports[`IconButton rendering the isActive true with palette of- primary 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  primary_active effect primary border defaultHover active hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  primary_active effect primary border defaultHover active hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -253,7 +253,7 @@ exports[`IconButton rendering the isActive true with palette of- primaryFilled 1
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  primaryFilled_active effect primaryFilled border defaultHover active hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  primaryFilled_active effect primaryFilled border defaultHover active hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -266,7 +266,7 @@ exports[`IconButton rendering the palette of- default 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -279,7 +279,7 @@ exports[`IconButton rendering the palette of- primary 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  primary effect primary border defaultHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  primary effect primary border defaultHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -292,7 +292,72 @@ exports[`IconButton rendering the palette of- primaryFilled 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  primaryFilled effect primaryFilled border defaultHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  primaryFilled effect primaryFilled border defaultHover  hoverEffect  inflex coldir both"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  />
+</DocumentFragment>
+`;
+
+exports[`IconButton rendering the size of- large 1`] = `
+<DocumentFragment>
+  <button
+    aria-pressed="false"
+    class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  />
+</DocumentFragment>
+`;
+
+exports[`IconButton rendering the size of- medium 1`] = `
+<DocumentFragment>
+  <button
+    aria-pressed="false"
+    class="buttonReset medium wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  />
+</DocumentFragment>
+`;
+
+exports[`IconButton rendering the size of- small 1`] = `
+<DocumentFragment>
+  <button
+    aria-pressed="false"
+    class="buttonReset small wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  />
+</DocumentFragment>
+`;
+
+exports[`IconButton rendering the size of- xlarge 1`] = `
+<DocumentFragment>
+  <button
+    aria-pressed="false"
+    class="buttonReset xlarge wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  />
+</DocumentFragment>
+`;
+
+exports[`IconButton rendering the size of- xsmall 1`] = `
+<DocumentFragment>
+  <button
+    aria-pressed="false"
+    class="buttonReset xsmall wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"
@@ -305,7 +370,7 @@ exports[`IconButton rendering tourId 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
     data-id="iconContainer"
     data-ishtml="false"
     data-selector-id="iconButton"

package/es/IconButton/props/defaultProps.js

@@ -1,6 +1,7 @@
 export const defaultProps = {
   palette: 'default',
   iconSize: '13',
+  size: 'large',
   className: '',
   iconClass: '',
   dataId: 'iconContainer',

package/es/IconButton/props/propTypes.js

@@ -9,6 +9,7 @@ export const propTypes = {
   iconClass: PropTypes.string,
   iconName: PropTypes.string,
   iconSize: PropTypes.string,
+  size: PropTypes.oneOf(['xsmall', 'small', 'medium', 'large', 'xlarge']),
   isActive: PropTypes.bool,
   isBold: PropTypes.bool,
   isDisabled: PropTypes.bool,

package/es/alert/AlertHeader/__tests__/__snapshots__/AlertHeader.spec.js.snap

@@ -761,7 +761,7 @@ exports[`AlertHeader renders with onClose function and closeTitle 1`] = `
     >
       <button
         aria-pressed="false"
-        class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+        class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
         data-id="alertHeader_close"
         data-ishtml="false"
         data-selector-id="iconButton"

package/es/form/fields/TextEditorField/__tests__/__snapshots__/TextEditorField.spec.js.snap

@@ -14,7 +14,7 @@ exports[`TextEditorField rendering the defult props 1`] = `
         data-selector-id="textEditorWrapper"
       >
         <textarea
-          class="textBox  container xsmall primary needBorder noresize     effect  borderColor_default"
+          class="textBox  container xsmall  defaultWidth primary needBorder noresize     effect  borderColor_default"
           data-id="TextareaComp"
           data-selector-id="textarea"
           data-test-id="TextareaComp"

package/es/form/fields/TextEditorWrapper/__tests__/__snapshots__/TextEditorWrapper.spec.js.snap

@@ -7,7 +7,7 @@ exports[`TextEditorWrapper rendering the defult props 1`] = `
     data-selector-id="textEditorWrapper"
   >
     <textarea
-      class="textBox  container small primary needBorder noresize  smallanimated   effect  borderColor_default"
+      class="textBox  container small  defaultWidth primary needBorder noresize  smallanimated   effect  borderColor_default"
       data-id="TextareaComp"
       data-selector-id="textarea"
       data-test-id="TextareaComp"

package/es/form/fields/TextareaField/__tests__/__snapshots__/TextareaField.spec.js.snap

@@ -10,7 +10,7 @@ exports[`TextareaField rendering the defult props 1`] = `
       class="fieldContainer "
     >
       <textarea
-        class="  container xsmall primary needBorder resizeY  xsmallanimated   effect  borderColor_default"
+        class="  container xsmall  defaultWidth primary needBorder resizeY  xsmallanimated   effect  borderColor_default"
         data-id="property(undefined)"
         data-selector-id="textarea"
         data-test-id="property(undefined)"

package/es/lookup/header/Close/__tests__/__snapshots__/Close.spec.js.snap

@@ -4,7 +4,7 @@ exports[`AlphabeticList rendering the defult props 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
     data-id="closeButton"
     data-ishtml="false"
     data-selector-id="iconButton"

package/es/lookup/header/TicketHeader/__tests__/__snapshots__/TicketHeader.spec.js.snap

@@ -38,7 +38,7 @@ exports[`TicketHeader rendering the defult props 1`] = `
     >
       <button
         aria-pressed="false"
-        class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+        class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
         data-id="close"
         data-ishtml="false"
         data-selector-id="iconButton"

package/lib/AttachmentViewer/__tests__/__snapshots__/AttachmentViewer.spec.js.snap

@@ -79,7 +79,7 @@ exports[`AttachmentViewer rendering the when isActive is true  1`] = `
                   >
                     <div
                       aria-pressed="false"
-                      class="false wrapper menuIcon undefined effect default border borderHover  hoverEffect  inflex coldir both"
+                      class="large wrapper menuIcon undefined effect default border borderHover  hoverEffect  inflex coldir both"
                       data-id="iconContainer"
                       data-ishtml="false"
                       data-selector-id="iconButton"
@@ -103,7 +103,7 @@ exports[`AttachmentViewer rendering the when isActive is true  1`] = `
                 >
                   <button
                     aria-pressed="false"
-                    class="buttonReset wrapper menuIcon undefined effect default border borderHover  hoverEffect  inflex coldir both"
+                    class="buttonReset large wrapper menuIcon undefined effect default border borderHover  hoverEffect  inflex coldir both"
                     data-id="iconContainer"
                     data-ishtml="false"
                     data-selector-id="iconButton"
@@ -361,7 +361,7 @@ exports[`AttachmentViewer rendering the when isActive is true  1`] = `
         </div>
         <button
           aria-pressed="false"
-          class="buttonReset wrapper button undefined effect default border borderHover  hoverEffect  inflex coldir both"
+          class="buttonReset large wrapper button undefined effect default border borderHover  hoverEffect  inflex coldir both"
           data-id="attachToggle"
           data-ishtml="false"
           data-selector-id="iconButton"

package/lib/IconButton/IconButton.js

@@ -122,6 +122,7 @@ var IconButton = /*#__PURE__*/function (_React$Component) {
       var _this$props4 = this.props,
           palette = _this$props4.palette,
           iconSize = _this$props4.iconSize,
+          size = _this$props4.size,
           iconName = _this$props4.iconName,
           className = _this$props4.className,
           iconClass = _this$props4.iconClass,
@@ -163,7 +164,7 @@ var IconButton = /*#__PURE__*/function (_React$Component) {
         tourId: tourId,
         align: "both",
         isCover: false,
-        className: "".concat(needButtonTag && _semanticButtonModule["default"].buttonReset, " ").concat(_IconButtonModule["default"].wrapper, " ").concat(className ? className : '', " ").concat(isActive ? _IconButtonModule["default"]["".concat(palette, "_active")] : _IconButtonModule["default"][palette]),
+        className: "".concat(needButtonTag ? _semanticButtonModule["default"].buttonReset : '', " ").concat(_IconButtonModule["default"][size], " ").concat(_IconButtonModule["default"].wrapper, " ").concat(className || '', " ").concat(isActive ? _IconButtonModule["default"]["".concat(palette, "_active")] : _IconButtonModule["default"][palette]),
         dataId: dataId,
         dataSelectorId: dataSelectorId,
         onClick: this.triggerClick,

package/lib/IconButton/IconButton.module.css

@@ -1,22 +1,49 @@
 .varClass {
   --iconColor: var(--zdt_iconButton_icon_black);
 }
+
 .wrapper {
-  height: var(--zd_size28) ;
-  width: var(--zd_size28) ;
   composes: offSelection from '~@zohodesk/components/lib/common/common.module.css';
   composes: varClass;
   color: var(--iconColor);
   cursor: pointer;
 }
+
+.xsmall {
+  width: var(--zd_size16) ;
+  height: var(--zd_size16) ;
+}
+
+.small {
+  width: var(--zd_size20) ;
+  height: var(--zd_size20) ;
+}
+
+.medium {
+  width: var(--zd_size24) ;
+  height: var(--zd_size24) ;
+}
+
+.large {
+  width: var(--zd_size28) ;
+  height: var(--zd_size28) ;
+}
+
+.xlarge {
+  width: var(--zd_size32) ;
+  height: var(--zd_size32) ;
+}
+
 .primary {
   --iconColor: var(--zdt_iconButton_icon_primary);
 }
+
 .primary:hover {
   --iconColor: var(--zdt_iconButton_icon_primaryHover);
 }
+
 .primary_active,
 .primaryFilled,
 .primaryFilled_active {
   --iconColor: var(--zdt_iconButton_icon_primaryActive);
-}
+}

package/lib/IconButton/__tests__/IconButton.spec.js

@@ -33,25 +33,34 @@ describe('IconButton', function () {
 
     expect(asFragment()).toMatchSnapshot();
   });
+  var sizes = ['xsmall', 'small', 'medium', 'large', 'xlarge'];
+  test.each(sizes)('rendering the size of- %s', function (size) {
+    var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+      size: size
+    })),
+        asFragment = _render4.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
   var hoverType = ['default', 'border', 'bg'];
   test.each(hoverType)('rendering the hovertypes- %s', function (hoverType) {
-    var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+    var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
       hoverType: hoverType
     })),
-        asFragment = _render4.asFragment;
+        asFragment = _render5.asFragment;
 
     expect(asFragment()).toMatchSnapshot();
   });
   test('rendering isNeedEffect is False', function () {
-    var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+    var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
       isNeedEffect: false
     })),
-        asFragment = _render5.asFragment;
+        asFragment = _render6.asFragment;
 
     expect(asFragment()).toMatchSnapshot();
   });
   test('rendering ally', function () {
-    var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+    var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
       a11y: {
         ariaLabel: 'ariaLabel',
         ariaControls: 'ariaControls',
@@ -60,77 +69,77 @@ describe('IconButton', function () {
         ariaExpanded: true
       }
     })),
-        asFragment = _render6.asFragment;
+        asFragment = _render7.asFragment;
 
     expect(asFragment()).toMatchSnapshot();
   });
   test('rendering ally', function () {
-    var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+    var _render8 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
       a11y: {
         ariaHaspopup: false,
         ariaExpanded: false
       }
     })),
-        asFragment = _render7.asFragment;
+        asFragment = _render8.asFragment;
 
     expect(asFragment()).toMatchSnapshot();
   });
   test('rendering needButtonTag', function () {
-    var _render8 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+    var _render9 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
       needButtonTag: false
     })),
-        asFragment = _render8.asFragment;
+        asFragment = _render9.asFragment;
 
     expect(asFragment()).toMatchSnapshot();
   });
   test('rendering tourId', function () {
-    var _render9 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+    var _render10 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
       tourId: "tourId"
     })),
-        asFragment = _render9.asFragment;
+        asFragment = _render10.asFragment;
 
     expect(asFragment()).toMatchSnapshot();
   });
   test('rendering in Icon', function () {
-    var _render10 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+    var _render11 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
       iconName: "ZD-GN-infoStroke",
       isBold: true,
       iconSize: "13",
       iconClass: "iconClass"
     })),
-        asFragment = _render10.asFragment;
+        asFragment = _render11.asFragment;
 
     expect(asFragment()).toMatchSnapshot();
   });
   test('rendering in dataIsHtml is True', function () {
-    var _render11 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+    var _render12 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
       dataIsHtml: true
     })),
-        asFragment = _render11.asFragment;
+        asFragment = _render12.asFragment;
 
     expect(asFragment()).toMatchSnapshot();
   });
   test('rendering in isDisabled is True', function () {
-    var _render12 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+    var _render13 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
       isDisabled: true
     })),
-        asFragment = _render12.asFragment;
+        asFragment = _render13.asFragment;
 
     expect(asFragment()).toMatchSnapshot();
   });
   test('rendering in ClassName', function () {
-    var _render13 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+    var _render14 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
       className: "IconButtonClass"
     })),
-        asFragment = _render13.asFragment;
+        asFragment = _render14.asFragment;
 
     expect(asFragment()).toMatchSnapshot();
   });
   test('rendering in title', function () {
-    var _render14 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+    var _render15 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
       title: "IconTitle"
     })),
-        asFragment = _render14.asFragment;
+        asFragment = _render15.asFragment;
 
     expect(asFragment()).toMatchSnapshot();
   });
@@ -138,18 +147,18 @@ describe('IconButton', function () {
     // Create a mock function
     var mockEleRef = jest.fn();
 
-    var _render15 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+    var _render16 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
       eleRef: mockEleRef
     })),
-        asFragment = _render15.asFragment;
+        asFragment = _render16.asFragment;
 
     expect(asFragment()).toMatchSnapshot();
   });
   test('Checking the "Children"', function () {
-    var _render16 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+    var _render17 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
       customClass: "customClassButtonGroup"
     }, /*#__PURE__*/_react["default"].createElement("span", null, "Element 1"), /*#__PURE__*/_react["default"].createElement("span", null, "Element 2"), /*#__PURE__*/_react["default"].createElement("span", null, "Element 3"))),
-        asFragment = _render16.asFragment;
+        asFragment = _render17.asFragment;
 
     expect(asFragment()).toMatchSnapshot();
   });