@zohodesk/components 1.0.0-temp-225-1 → 1.0.0-temp-227

package/lib/Tab/__tests__/__snapshots__/TabLayout.spec.js.snap

@@ -0,0 +1,341 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`TabWrapper rendering the align prop of - horizontal 1`] = `
+<DocumentFragment>
+  <div
+    class="flex cover rowdir"
+    data-id="containerComponent"
+    data-selector-id="tabWrapper"
+    data-test-id="containerComponent"
+  >
+    <div
+      class="shrinkOff"
+      data-id="boxComponent"
+      data-selector-id="tabs"
+      data-test-id="boxComponent"
+    >
+      <div
+        class="tab alpha alpha_border alpha_padding flex cover coldir"
+        data-id="containerComponent"
+        data-selector-id="container"
+        data-test-id="containerComponent"
+      >
+        <div
+          class="grow basis shrinkOff"
+          data-id="boxComponent"
+          data-selector-id="box"
+          data-test-id="boxComponent"
+        >
+          <div
+            class="flex cover coldir"
+            data-id="containerComponent"
+            data-selector-id="container"
+            data-test-id="containerComponent"
+          >
+            <div
+              class="menu  shrinkOff"
+              data-id="boxComponent"
+              data-selector-id="tabs_moreIcon"
+              data-test-id="boxComponent"
+            >
+              <button
+                aria-label="MoreTabs"
+                class="buttonReset   flex cover coldir both"
+                data-id="moreTabs"
+                data-selector-id="container"
+                data-test-id="moreTabs"
+                role="link"
+              >
+                <i
+                  aria-hidden="true"
+                  class="zd_font_icons basic icon-menu    rtl "
+                  data-id="fontIcon"
+                  data-selector-id="fontIcon"
+                  data-test-id="fontIcon"
+                  style="--zd-iconfont-size: var(--zd_font_size7);"
+                />
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="grow basis shrinkOff"
+      data-id="boxComponent"
+      data-selector-id="tabContentWrapper"
+      data-test-id="boxComponent"
+    >
+      <div
+        aria-labelledby="page1"
+        class="container flex cover coldir"
+        data-id="tabContent_TabContent"
+        data-scroll="true"
+        data-selector-id="tabContent"
+        data-test-id="tabContent_TabContent"
+        role="tabpanel"
+        tabindex="-1"
+      >
+        <div>
+          Page 1 Content
+        </div>
+      </div>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`TabWrapper rendering the align prop of - horizontal-reverse 1`] = `
+<DocumentFragment>
+  <div
+    class="flex cover rowReverse"
+    data-id="containerComponent"
+    data-selector-id="tabWrapper"
+    data-test-id="containerComponent"
+  >
+    <div
+      class="shrinkOff"
+      data-id="boxComponent"
+      data-selector-id="tabs"
+      data-test-id="boxComponent"
+    >
+      <div
+        class="tab alpha alpha_border alpha_padding flex cover coldir"
+        data-id="containerComponent"
+        data-selector-id="container"
+        data-test-id="containerComponent"
+      >
+        <div
+          class="grow basis shrinkOff"
+          data-id="boxComponent"
+          data-selector-id="box"
+          data-test-id="boxComponent"
+        >
+          <div
+            class="flex cover coldir"
+            data-id="containerComponent"
+            data-selector-id="container"
+            data-test-id="containerComponent"
+          >
+            <div
+              class="menu  shrinkOff"
+              data-id="boxComponent"
+              data-selector-id="tabs_moreIcon"
+              data-test-id="boxComponent"
+            >
+              <button
+                aria-label="MoreTabs"
+                class="buttonReset   flex cover coldir both"
+                data-id="moreTabs"
+                data-selector-id="container"
+                data-test-id="moreTabs"
+                role="link"
+              >
+                <i
+                  aria-hidden="true"
+                  class="zd_font_icons basic icon-menu    rtl "
+                  data-id="fontIcon"
+                  data-selector-id="fontIcon"
+                  data-test-id="fontIcon"
+                  style="--zd-iconfont-size: var(--zd_font_size7);"
+                />
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="grow basis shrinkOff"
+      data-id="boxComponent"
+      data-selector-id="tabContentWrapper"
+      data-test-id="boxComponent"
+    >
+      <div
+        aria-labelledby="page1"
+        class="container flex cover coldir"
+        data-id="tabContent_TabContent"
+        data-scroll="true"
+        data-selector-id="tabContent"
+        data-test-id="tabContent_TabContent"
+        role="tabpanel"
+        tabindex="-1"
+      >
+        <div>
+          Page 1 Content
+        </div>
+      </div>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`TabWrapper rendering the align prop of - vertical 1`] = `
+<DocumentFragment>
+  <div
+    class="flex cover coldir"
+    data-id="containerComponent"
+    data-selector-id="tabWrapper"
+    data-test-id="containerComponent"
+  >
+    <div
+      class="shrinkOff"
+      data-id="boxComponent"
+      data-selector-id="tabs"
+      data-test-id="boxComponent"
+    >
+      <div
+        class="tab alpha alpha_border alpha_padding flex cover rowdir"
+        data-id="containerComponent"
+        data-selector-id="container"
+        data-test-id="containerComponent"
+      >
+        <div
+          class="grow basis shrinkOff"
+          data-id="boxComponent"
+          data-selector-id="box"
+          data-test-id="boxComponent"
+        >
+          <div
+            class="flex cover rowdir"
+            data-id="containerComponent"
+            data-selector-id="container"
+            data-test-id="containerComponent"
+          >
+            <div
+              class="menu  shrinkOff"
+              data-id="boxComponent"
+              data-selector-id="tabs_moreIcon"
+              data-test-id="boxComponent"
+            >
+              <button
+                aria-label="MoreTabs"
+                class="buttonReset   flex cover coldir both"
+                data-id="moreTabs"
+                data-selector-id="container"
+                data-test-id="moreTabs"
+                role="link"
+              >
+                <i
+                  aria-hidden="true"
+                  class="zd_font_icons basic icon-menu    rtl "
+                  data-id="fontIcon"
+                  data-selector-id="fontIcon"
+                  data-test-id="fontIcon"
+                  style="--zd-iconfont-size: var(--zd_font_size7);"
+                />
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="grow basis shrinkOff"
+      data-id="boxComponent"
+      data-selector-id="tabContentWrapper"
+      data-test-id="boxComponent"
+    >
+      <div
+        aria-labelledby="page1"
+        class="container flex cover coldir"
+        data-id="tabContent_TabContent"
+        data-scroll="true"
+        data-selector-id="tabContent"
+        data-test-id="tabContent_TabContent"
+        role="tabpanel"
+        tabindex="-1"
+      >
+        <div>
+          Page 1 Content
+        </div>
+      </div>
+    </div>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`TabWrapper rendering the align prop of - vertical-reverse 1`] = `
+<DocumentFragment>
+  <div
+    class="flex cover colReverse"
+    data-id="containerComponent"
+    data-selector-id="tabWrapper"
+    data-test-id="containerComponent"
+  >
+    <div
+      class="shrinkOff"
+      data-id="boxComponent"
+      data-selector-id="tabs"
+      data-test-id="boxComponent"
+    >
+      <div
+        class="tab alpha alpha_border alpha_padding flex cover rowdir"
+        data-id="containerComponent"
+        data-selector-id="container"
+        data-test-id="containerComponent"
+      >
+        <div
+          class="grow basis shrinkOff"
+          data-id="boxComponent"
+          data-selector-id="box"
+          data-test-id="boxComponent"
+        >
+          <div
+            class="flex cover rowdir"
+            data-id="containerComponent"
+            data-selector-id="container"
+            data-test-id="containerComponent"
+          >
+            <div
+              class="menu  shrinkOff"
+              data-id="boxComponent"
+              data-selector-id="tabs_moreIcon"
+              data-test-id="boxComponent"
+            >
+              <button
+                aria-label="MoreTabs"
+                class="buttonReset   flex cover coldir both"
+                data-id="moreTabs"
+                data-selector-id="container"
+                data-test-id="moreTabs"
+                role="link"
+              >
+                <i
+                  aria-hidden="true"
+                  class="zd_font_icons basic icon-menu    rtl "
+                  data-id="fontIcon"
+                  data-selector-id="fontIcon"
+                  data-test-id="fontIcon"
+                  style="--zd-iconfont-size: var(--zd_font_size7);"
+                />
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="grow basis shrinkOff"
+      data-id="boxComponent"
+      data-selector-id="tabContentWrapper"
+      data-test-id="boxComponent"
+    >
+      <div
+        aria-labelledby="page1"
+        class="container flex cover coldir"
+        data-id="tabContent_TabContent"
+        data-scroll="true"
+        data-selector-id="tabContent"
+        data-test-id="tabContent_TabContent"
+        role="tabpanel"
+        tabindex="-1"
+      >
+        <div>
+          Page 1 Content
+        </div>
+      </div>
+    </div>
+  </div>
+</DocumentFragment>
+`;

package/lib/Tab/props/propTypes.js

@@ -11,7 +11,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
 
 var Tab_propTypes = {
   activeClass: _propTypes["default"].string,
-  align: _propTypes["default"].string,
+  align: _propTypes["default"].oneOf(['vertical', 'horizontal']),
   children: _propTypes["default"].oneOfType([_propTypes["default"].element, _propTypes["default"].string]),
   className: _propTypes["default"].string,
   dataId: _propTypes["default"].string,
@@ -115,7 +115,7 @@ var Tabs_propTypes = {
 };
 exports.Tabs_propTypes = Tabs_propTypes;
 var TabWrapper_propTypes = {
-  align: _propTypes["default"].oneOf(['vertical', 'horizontal']),
+  align: _propTypes["default"].oneOf(['vertical', 'horizontal', 'vertical-reverse', 'horizontal-reverse']),
   children: _propTypes["default"].node,
   dataId: _propTypes["default"].string,
   defaultTab: _propTypes["default"].string,

package/lib/Tab/utils/tabConfigs.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TAB_POPUP_POSITION_MAPPING = exports.TAB_DIRECTION_MAPPING = exports.TAB_ALIGN_MAPPING = void 0;
+var TAB_ALIGN_MAPPING = {
+  vertical: 'column',
+  horizontal: 'row',
+  'vertical-reverse': 'column-reverse',
+  'horizontal-reverse': 'row-reverse'
+};
+exports.TAB_ALIGN_MAPPING = TAB_ALIGN_MAPPING;
+var TAB_DIRECTION_MAPPING = {
+  vertical: 'column',
+  horizontal: 'row',
+  'vertical-reverse': 'column',
+  'horizontal-reverse': 'row'
+};
+exports.TAB_DIRECTION_MAPPING = TAB_DIRECTION_MAPPING;
+var TAB_POPUP_POSITION_MAPPING = {
+  vertical: 'bottomLeft',
+  horizontal: 'rightTop',
+  'vertical-reverse': 'topLeft',
+  'horizontal-reverse': 'leftTop'
+};
+exports.TAB_POPUP_POSITION_MAPPING = TAB_POPUP_POSITION_MAPPING;

package/lib/Tag/__tests__/Tag.spec.js

@@ -2,12 +2,20 @@
 
 var _react = _interopRequireDefault(require("react"));
 
-var _Tag = _interopRequireDefault(require("../Tag"));
-
 var _react2 = require("@testing-library/react");
 
+var _IdProvider = require("../../Provider/IdProvider");
+
+var _Tag = _interopRequireDefault(require("../Tag"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
+beforeEach(function () {
+  (0, _IdProvider.setGlobalId)(0);
+});
+afterEach(function () {
+  (0, _react2.cleanup)();
+});
 describe('Tag component', function () {
   var size = ['small', 'medium'];
   var palette = ['default', 'danger', 'secondary', 'pureDotted', 'primaryDotted', 'dark', 'pureDarkDotted', 'darkPrimaryDotted', 'defaultLink'];

package/lib/TextBoxIcon/TextBoxIcon.js

@@ -158,7 +158,8 @@ var TextBoxIcon = /*#__PURE__*/function (_React$Component) {
           isScrollPrevent = _this$props2.isScrollPrevent,
           customProps = _this$props2.customProps,
           needInputFocusOnWrapperClick = _this$props2.needInputFocusOnWrapperClick,
-          renderRightPlaceholderNode = _this$props2.renderRightPlaceholderNode;
+          renderRightPlaceholderNode = _this$props2.renderRightPlaceholderNode,
+          renderCustomClearComponent = _this$props2.renderCustomClearComponent;
       var isActive = this.state.isActive;
       var _customClass$customTB = customClass.customTBoxWrap,
           customTBoxWrap = _customClass$customTB === void 0 ? '' : _customClass$customTB,
@@ -213,7 +214,10 @@ var TextBoxIcon = /*#__PURE__*/function (_React$Component) {
         className: "".concat(_TextBoxIconModule["default"].iconContainer, " ").concat(customTBoxIcon)
       }, /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
         alignBox: "row"
-      }, value && onClear && value.length > 1 && !isDisabled && !isReadOnly || showClearIcon ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
+      }, value && onClear && value.length > 1 && !isDisabled && !isReadOnly || showClearIcon ? typeof renderCustomClearComponent == 'function' ? renderCustomClearComponent({
+        clearText: clearText,
+        handleClear: this.handleClear
+      }) : /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
         className: "".concat(_semanticButtonModule["default"].buttonReset, " ").concat(_TextBoxIconModule["default"].icon),
         onClick: this.handleClear,
         dataId: "".concat(dataId, "_ClearIcon"),

package/lib/TextBoxIcon/props/propTypes.js

@@ -67,7 +67,8 @@ var propTypes = _objectSpread(_objectSpread({}, _propTypes2.propTypes), {}, {
   customProps: _propTypes["default"].shape({
     TextBoxProps: _propTypes["default"].object
   }),
-  renderRightPlaceholderNode: _propTypes["default"].node
+  renderRightPlaceholderNode: _propTypes["default"].node,
+  renderCustomClearComponent: _propTypes["default"].func
 });
 
 exports.propTypes = propTypes;

package/lib/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup.js

@@ -1,7 +1,5 @@
 "use strict";
 
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -29,6 +27,20 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 
 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); }
 
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
@@ -63,35 +75,75 @@ var VelocityAnimationGroup = /*#__PURE__*/function (_React$Component) {
   var _super = _createSuper(VelocityAnimationGroup);
 
   function VelocityAnimationGroup(props) {
+    var _this;
+
     _classCallCheck(this, VelocityAnimationGroup);
 
-    return _super.call(this, props);
+    _this = _super.call(this, props);
+    _this.handleEnterComplete = _this.handleEnterComplete.bind(_assertThisInitialized(_this));
+    _this.handleExitComplete = _this.handleExitComplete.bind(_assertThisInitialized(_this));
+    return _this;
   }
 
   _createClass(VelocityAnimationGroup, [{
+    key: "handleEnterComplete",
+    value: function handleEnterComplete(elements) {
+      var _this$props = this.props,
+          onEnterComplete = _this$props.onEnterComplete,
+          postEnterStyles = _this$props.postEnterStyles;
+
+      if (typeof onEnterComplete === 'function') {
+        onEnterComplete(elements);
+      }
+
+      if (postEnterStyles && _typeof(postEnterStyles) === 'object') {
+        elements.forEach(function (rootElement) {
+          Object.entries(postEnterStyles).forEach(function (_ref) {
+            var _ref2 = _slicedToArray(_ref, 2),
+                cssProperty = _ref2[0],
+                cssValue = _ref2[1];
+
+            rootElement.style[cssProperty] = cssValue;
+          });
+        });
+      }
+    }
+  }, {
+    key: "handleExitComplete",
+    value: function handleExitComplete(elements) {
+      var onExitComplete = this.props.onExitComplete;
+
+      if (typeof onExitComplete === 'function') {
+        onExitComplete(elements);
+      }
+    }
+  }, {
     key: "render",
     value: function render() {
-      var _this$props = this.props,
-          children = _this$props.children,
-          enterName = _this$props.enterName,
-          exitName = _this$props.exitName,
-          enterDuration = _this$props.enterDuration,
-          exitDuration = _this$props.exitDuration,
-          isActive = _this$props.isActive,
-          component = _this$props.component,
-          runOnMount = _this$props.runOnMount,
-          enterShowStyle = _this$props.enterShowStyle,
-          enterHideStyle = _this$props.enterHideStyle,
-          exitDelay = _this$props.exitDelay,
-          isFlex = _this$props.isFlex,
-          enterDelay = _this$props.enterDelay,
-          isCustomized = _this$props.isCustomized,
-          name = _this$props.name,
-          needUIPack = _this$props.needUIPack;
-
-      var _ref = this.context || {},
-          direction = _ref.direction,
-          isReducedMotion = _ref.isReducedMotion;
+      var _this$props2 = this.props,
+          children = _this$props2.children,
+          enterName = _this$props2.enterName,
+          exitName = _this$props2.exitName,
+          enterDuration = _this$props2.enterDuration,
+          exitDuration = _this$props2.exitDuration,
+          isActive = _this$props2.isActive,
+          component = _this$props2.component,
+          runOnMount = _this$props2.runOnMount,
+          enterShowStyle = _this$props2.enterShowStyle,
+          enterHideStyle = _this$props2.enterHideStyle,
+          exitDelay = _this$props2.exitDelay,
+          isFlex = _this$props2.isFlex,
+          enterDelay = _this$props2.enterDelay,
+          isCustomized = _this$props2.isCustomized,
+          name = _this$props2.name,
+          needUIPack = _this$props2.needUIPack,
+          onEnterComplete = _this$props2.onEnterComplete,
+          onExitComplete = _this$props2.onExitComplete,
+          postEnterStyles = _this$props2.postEnterStyles;
+
+      var _ref3 = this.context || {},
+          direction = _ref3.direction,
+          isReducedMotion = _ref3.isReducedMotion;
 
       var childProps = clearProps(this.props);
       var enterAnimationObj = {
@@ -128,13 +180,15 @@ var VelocityAnimationGroup = /*#__PURE__*/function (_React$Component) {
         animation: isCustomized ? enterAnimationObj[name] : needUIPack ? "transition.".concat(enterName, "In") : enterName,
         duration: !isReducedMotion ? enterDuration : 0,
         delay: enterDelay ? enterDelay : 0,
-        display: isFlex ? 'flex' : ''
+        display: isFlex ? 'flex' : '',
+        complete: onEnterComplete || postEnterStyles ? this.handleEnterComplete : undefined
       };
       var exitAnimation = {
         animation: isCustomized ? exitAnimationObj[name] : needUIPack ? "transition.".concat(exitName ? exitName : enterName, "Out") : exitName ? exitName : enterName,
         duration: !isReducedMotion ? exitDuration : 0,
         delay: exitDelay ? exitDelay : 0,
-        display: 'none'
+        display: 'none',
+        complete: onExitComplete ? this.handleExitComplete : undefined
       };
       return /*#__PURE__*/_react["default"].createElement(_velocityReact.VelocityTransitionGroup, _extends({
         enter: enterAnimation,

package/lib/VelocityAnimation/VelocityAnimationGroup/props/propTypes.js

@@ -25,6 +25,9 @@ var propTypes = {
   isFlex: _propTypes["default"].bool,
   name: _propTypes["default"].oneOf(['fade', 'slideDown', 'flyDown', 'slideRight', 'shrink', 'expand', 'slideLeft']),
   needUIPack: _propTypes["default"].bool,
-  runOnMount: _propTypes["default"].bool
+  runOnMount: _propTypes["default"].bool,
+  onEnterComplete: _propTypes["default"].func,
+  onExitComplete: _propTypes["default"].func,
+  postEnterStyles: _propTypes["default"].object
 };
 exports.propTypes = propTypes;

package/lib/utils/Common.js

@@ -61,7 +61,7 @@ exports.parseDecimal = parseDecimal;
 
 var getTotalDimension = function getTotalDimension(elem, align) {
   var style = window.getComputedStyle(elem);
-  return align === 'vertical' ? elem.offsetWidth + parseDecimal(style.marginLeft) + parseDecimal(style.marginRight) : elem.offsetHeight + parseDecimal(style.marginTop) + parseDecimal(style.marginBottom);
+  return align === 'vertical-reverse' || align === 'vertical' ? elem.offsetWidth + parseDecimal(style.marginLeft) + parseDecimal(style.marginRight) : elem.offsetHeight + parseDecimal(style.marginTop) + parseDecimal(style.marginBottom);
 };
 
 exports.getTotalDimension = getTotalDimension;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/components",
-  "version": "1.0.0-temp-225-1",
+  "version": "1.0.0-temp-227",
   "main": "es/index.js",
   "module": "es/index.js",
   "private": false,
@@ -38,7 +38,7 @@
     "build:css:umd": "npm run clean &&  npm run init && react-cli build:css:umd",
     "coverage": "react-cli coverage",
     "prepare": "npm run init &&  npm run build && npm run rtl && npm run cssVariableConvert ",
-    "prepublishOnly": "node prePublish.js && npm run download && npm run css:review && npm run review:props ",
+    "prepublishOnly": "node prePublish.js && npm run test-clean && npm run download && npm run css:review && npm run review:props ",
     "postpublish": "node postPublish.js",
     "report": "react-cli publish:report",
     "test": "react-cli test",

package/react-cli.config.js

@@ -1,4 +1,4 @@
-exports.config= {
+exports.config = {
   "preprocess": {
     "runner": "./preprocess/index.js"
   },
@@ -14,7 +14,7 @@ exports.config= {
         "**/es/**",
         "!**/node_modules/**"
       ],
-      "hasRTL":[
+      "hasRTL": [
         "**/src/**",
         "!**/node_modules/**"
       ]