@zohodesk/dot 1.2.4 → 1.3.0-temp-158

package/es/v1/svg/SnippetIcon.js

@@ -1,34 +1,27 @@
 import React from 'react';
 import { SnippetIcon_defaultProps } from '../../svg/props/defaultProps';
 import { SnippetIcon_propTypes } from '../../svg/props/propTypes';
-import SVG from '@zohodesk/svg/lib/SVG/SVG';
-export default class SnippetIcon extends React.Component {
-  render() {
-    let {
-      isRender,
-      isSymbol,
-      className
-    } = this.props;
-    return /*#__PURE__*/React.createElement(SVG, {
-      viewBox: "0 0 31 32",
-      name: "SnippetIcon",
-      isRender: isRender,
-      isSymbol: isSymbol,
-      className: className
-    }, /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("path", {
-      d: "M14.4,8.2L15.6,9L16,8.4l-1-0.7l2.5-3.7L11.5,0L8.9,3.8L7.9,3L7.6,3.6l1.2,0.8c-2.3,3-5.9,0.8-6,0.7L2.3,4.9L0,23.8 l16.6-9.3l-0.4-0.3C15.9,13.9,12.6,11.5,14.4,8.2L14.4,8.2z M1.5,22l5.2-7.7c0.3,0.1,0.6,0.2,0.9,0.2c1.2,0,2.1-0.9,2.2-2.1 c0-1.2-0.9-2.1-2.1-2.2c-1.2,0-2.1,0.9-2.2,2.1c0,0.6,0.2,1.2,0.7,1.6L1,21.6L2.8,6c1.2,0.6,4.4,1.7,6.5-1.1l4.5,3 c-1.8,3,0.4,5.6,1.4,6.5L1.5,22L1.5,22z M6.7,13.6c-0.7-0.4-0.8-1.3-0.4-2s1.3-0.8,2-0.4c0.7,0.4,0.8,1.3,0.4,2 c-0.2,0.3-0.5,0.5-0.9,0.6C7.5,13.9,7.1,13.8,6.7,13.6L6.7,13.6z"
-    }), /*#__PURE__*/React.createElement("path", {
-      style: {
-        fill: '#03A3FE'
-      },
-      d: "M30.9,25c-4.9,0.7-5.4,1.2-5.9,6.7c-0.6-5.4-1.1-6-6.1-6.5c4.9-0.7,5.4-1.2,5.9-6.7 C25.4,23.9,25.9,24.5,30.9,25z M30.3,8.2c-4.5,0.6-4.9,1.1-5.5,6.3c-0.5-5.3-0.9-5.8-5.4-6.4c4.5-0.6,4.9-1.1,5.5-6.3 C25.4,7.1,25.8,7.6,30.3,8.2z M16.2,25.7c-4.5,0.6-4.9,1.1-5.5,6.3c-0.5-5.3-0.9-5.8-5.4-6.4c4.5-0.6,4.9-1.1,5.5-6.3 C11.3,24.6,11.7,25.1,16.2,25.7z"
-    })));
-  }
-
+import SVG from '@zohodesk/svg/lib/v1/SVG/SVG';
+export default function SnippetIcon(props) {
+  let {
+    isRender,
+    isSymbol,
+    className
+  } = props;
+  return /*#__PURE__*/React.createElement(SVG, {
+    viewBox: "0 0 31 32",
+    name: "SnippetIcon",
+    isRender: isRender,
+    isSymbol: isSymbol,
+    className: className
+  }, /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("path", {
+    d: "M14.4,8.2L15.6,9L16,8.4l-1-0.7l2.5-3.7L11.5,0L8.9,3.8L7.9,3L7.6,3.6l1.2,0.8c-2.3,3-5.9,0.8-6,0.7L2.3,4.9L0,23.8 l16.6-9.3l-0.4-0.3C15.9,13.9,12.6,11.5,14.4,8.2L14.4,8.2z M1.5,22l5.2-7.7c0.3,0.1,0.6,0.2,0.9,0.2c1.2,0,2.1-0.9,2.2-2.1 c0-1.2-0.9-2.1-2.1-2.2c-1.2,0-2.1,0.9-2.2,2.1c0,0.6,0.2,1.2,0.7,1.6L1,21.6L2.8,6c1.2,0.6,4.4,1.7,6.5-1.1l4.5,3 c-1.8,3,0.4,5.6,1.4,6.5L1.5,22L1.5,22z M6.7,13.6c-0.7-0.4-0.8-1.3-0.4-2s1.3-0.8,2-0.4c0.7,0.4,0.8,1.3,0.4,2 c-0.2,0.3-0.5,0.5-0.9,0.6C7.5,13.9,7.1,13.8,6.7,13.6L6.7,13.6z"
+  }), /*#__PURE__*/React.createElement("path", {
+    style: {
+      fill: '#03A3FE'
+    },
+    d: "M30.9,25c-4.9,0.7-5.4,1.2-5.9,6.7c-0.6-5.4-1.1-6-6.1-6.5c4.9-0.7,5.4-1.2,5.9-6.7 C25.4,23.9,25.9,24.5,30.9,25z M30.3,8.2c-4.5,0.6-4.9,1.1-5.5,6.3c-0.5-5.3-0.9-5.8-5.4-6.4c4.5-0.6,4.9-1.1,5.5-6.3 C25.4,7.1,25.8,7.6,30.3,8.2z M16.2,25.7c-4.5,0.6-4.9,1.1-5.5,6.3c-0.5-5.3-0.9-5.8-5.4-6.4c4.5-0.6,4.9-1.1,5.5-6.3 C11.3,24.6,11.7,25.1,16.2,25.7z"
+  })));
 }
 SnippetIcon.propTypes = SnippetIcon_propTypes;
-SnippetIcon.defaultProps = SnippetIcon_defaultProps; // if (__DOCS__) {
-//   SnippetIcon.docs = {
-//     componentGroup: 'SVG'
-//   };
-// }
+SnippetIcon.defaultProps = SnippetIcon_defaultProps;

package/es/v1/svg/TemplateIcon.js

@@ -1,35 +1,28 @@
 import React from 'react';
 import { TemplateIcon_defaultProps } from '../../svg/props/defaultProps';
 import { TemplateIcon_propTypes } from '../../svg/props/propTypes';
-import SVG from '@zohodesk/svg/lib/SVG/SVG';
-export default class TemplateIcon extends React.Component {
-  render() {
-    let {
-      isRender,
-      isSymbol,
-      className
-    } = this.props;
-    return /*#__PURE__*/React.createElement(SVG, {
-      viewBox: "0 0 40 40",
-      name: "TemplateIcon",
-      isRender: isRender,
-      isSymbol: isSymbol,
-      className: className
-    }, /*#__PURE__*/React.createElement("path", {
-      d: "M33.09,3H6.91A3.91,3.91,0,0,0,3,6.91V33.09A3.91,3.91,0,0,0,6.91,37H33.09A3.91,3.91,0,0,0,37,33.09V6.91A3.92,3.92,0,0,0,33.09,3ZM6.91,5H33.09A1.92,1.92,0,0,1,35,6.91v4.62H5V6.91A1.92,1.92,0,0,1,6.91,5ZM33.09,35H6.91A1.92,1.92,0,0,1,5,33.09V13.53H35V33.09A1.92,1.92,0,0,1,33.09,35Z"
-    }), /*#__PURE__*/React.createElement("path", {
-      d: "M9.33,9.33A1.07,1.07,0,1,0,8.27,8.27,1.06,1.06,0,0,0,9.33,9.33Z"
-    }), /*#__PURE__*/React.createElement("path", {
-      d: "M13.6,9.33a1.07,1.07,0,1,0-1.07-1.06A1.06,1.06,0,0,0,13.6,9.33Z"
-    }), /*#__PURE__*/React.createElement("path", {
-      d: "M24.87,23H21V19.13a1,1,0,1,0-2,0V23H15.13a1,1,0,0,0,0,2H19v3.86a1,1,0,0,0,2,0V25h3.87a1,1,0,1,0,0-2Z"
-    }));
-  }
-
+import SVG from '@zohodesk/svg/lib/v1/SVG/SVG';
+export default function TemplateIcon(props) {
+  let {
+    isRender,
+    isSymbol,
+    className
+  } = props;
+  return /*#__PURE__*/React.createElement(SVG, {
+    viewBox: "0 0 40 40",
+    name: "TemplateIcon",
+    isRender: isRender,
+    isSymbol: isSymbol,
+    className: className
+  }, /*#__PURE__*/React.createElement("path", {
+    d: "M33.09,3H6.91A3.91,3.91,0,0,0,3,6.91V33.09A3.91,3.91,0,0,0,6.91,37H33.09A3.91,3.91,0,0,0,37,33.09V6.91A3.92,3.92,0,0,0,33.09,3ZM6.91,5H33.09A1.92,1.92,0,0,1,35,6.91v4.62H5V6.91A1.92,1.92,0,0,1,6.91,5ZM33.09,35H6.91A1.92,1.92,0,0,1,5,33.09V13.53H35V33.09A1.92,1.92,0,0,1,33.09,35Z"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M9.33,9.33A1.07,1.07,0,1,0,8.27,8.27,1.06,1.06,0,0,0,9.33,9.33Z"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M13.6,9.33a1.07,1.07,0,1,0-1.07-1.06A1.06,1.06,0,0,0,13.6,9.33Z"
+  }), /*#__PURE__*/React.createElement("path", {
+    d: "M24.87,23H21V19.13a1,1,0,1,0-2,0V23H15.13a1,1,0,0,0,0,2H19v3.86a1,1,0,0,0,2,0V25h3.87a1,1,0,1,0,0-2Z"
+  }));
 }
 TemplateIcon.propTypes = TemplateIcon_propTypes;
-TemplateIcon.defaultProps = TemplateIcon_defaultProps; // if (__DOCS__) {
-//   TemplateIcon.docs = {
-//     componentGroup: 'SVG'
-//   };
-// }
+TemplateIcon.defaultProps = TemplateIcon_defaultProps;

package/lib/Drawer/Drawer.js

@@ -345,6 +345,7 @@ var Drawer = /*#__PURE__*/function (_React$Component4) {
           customClass = _this$props5.customClass,
           needAutoZindex = _this$props5.needAutoZindex,
           innerPortalName = _this$props5.innerPortalName;
+      var zindexNumber = this.getNextIndex();
       return /*#__PURE__*/_react["default"].createElement(_CustomResponsive.ResponsiveReceiver, {
         query: this.responsiveFunc,
         responsiveId: responsiveId
@@ -380,8 +381,8 @@ var Drawer = /*#__PURE__*/function (_React$Component4) {
           scroll: "none",
           eleRef: forwardRef,
           className: "".concat(_DrawerModule["default"].isOverlay, " ").concat(customClass),
-          style: isActive && needAutoZindex ? {
-            zIndex: "".concat(_this2.getNextIndex())
+          style: needAutoZindex ? {
+            zIndex: "".concat(zindexNumber)
           } : {}
         }, _this2.drawers(uptoTablet, styleByResolutions)));
       });

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

@@ -0,0 +1,156 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _react2 = require("@testing-library/react");
+
+var _IconButton = _interopRequireDefault(require("../IconButton.js"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+describe('IconButton', function () {
+  test('rendering the defult props', function () {
+    var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], null)),
+        asFragment = _render.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  var palette = ['primary', 'primaryFilled', 'default'];
+  test.each(palette)('rendering the palette of- %s', function (palette) {
+    var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+      palette: palette
+    })),
+        asFragment = _render2.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test.each(palette)('rendering the isActive true with palette of- %s', function (palette) {
+    var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+      isActive: true,
+      palette: palette
+    })),
+        asFragment = _render3.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"], {
+      hoverType: hoverType
+    })),
+        asFragment = _render4.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering isNeedEffect is False', function () {
+    var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+      isNeedEffect: false
+    })),
+        asFragment = _render5.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering ally', function () {
+    var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+      a11y: {
+        ariaLabel: 'ariaLabel',
+        ariaControls: 'ariaControls',
+        ariaLabelledby: 'ariaLabelledby',
+        ariaHaspopup: true,
+        ariaExpanded: true
+      }
+    })),
+        asFragment = _render6.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering ally', function () {
+    var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+      a11y: {
+        ariaHaspopup: false,
+        ariaExpanded: false
+      }
+    })),
+        asFragment = _render7.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering needButtonTag', function () {
+    var _render8 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+      needButtonTag: false
+    })),
+        asFragment = _render8.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering tourId', function () {
+    var _render9 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+      tourId: "tourId"
+    })),
+        asFragment = _render9.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering in Icon', function () {
+    var _render10 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+      iconName: "ZD-GN-infoStroke",
+      isBold: true,
+      iconSize: "13",
+      iconClass: "iconClass"
+    })),
+        asFragment = _render10.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering in dataIsHtml is True', function () {
+    var _render11 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+      dataIsHtml: true
+    })),
+        asFragment = _render11.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering in isDisabled is True', function () {
+    var _render12 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+      isDisabled: true
+    })),
+        asFragment = _render12.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering in ClassName', function () {
+    var _render13 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+      className: "IconButtonClass"
+    })),
+        asFragment = _render13.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('rendering in title', function () {
+    var _render14 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+      title: "IconTitle"
+    })),
+        asFragment = _render14.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('eleRef prop is a function', function () {
+    // Create a mock function
+    var mockEleRef = jest.fn();
+
+    var _render15 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
+      eleRef: mockEleRef
+    })),
+        asFragment = _render15.asFragment;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Checking the "Children"', function () {
+    var _render16 = (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;
+
+    expect(asFragment()).toMatchSnapshot();
+  });
+});

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

@@ -0,0 +1,316 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`IconButton Checking the "Children" 1`] = `
+<DocumentFragment>
+  <button
+    aria-pressed="false"
+    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  >
+    <span>
+      Element 1
+    </span>
+    <span>
+      Element 2
+    </span>
+    <span>
+      Element 3
+    </span>
+  </button>
+</DocumentFragment>
+`;
+
+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"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  />
+</DocumentFragment>
+`;
+
+exports[`IconButton rendering ally 1`] = `
+<DocumentFragment>
+  <button
+    aria-controls="ariaControls"
+    aria-expanded="true"
+    aria-haspopup="true"
+    aria-label="ariaLabel"
+    aria-labelledby="ariaLabelledby"
+    aria-pressed="false"
+    class="buttonReset 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 ally 2`] = `
+<DocumentFragment>
+  <button
+    aria-expanded="false"
+    aria-haspopup="false"
+    aria-pressed="false"
+    class="buttonReset 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 in ClassName 1`] = `
+<DocumentFragment>
+  <button
+    aria-pressed="false"
+    class="buttonReset wrapper IconButtonClass 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 in Icon 1`] = `
+<DocumentFragment>
+  <button
+    aria-pressed="false"
+    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  >
+    <i
+      aria-hidden="true"
+      class="zd_font_icons basic icon-infoStroke fbold iconClass  "
+      data-id="fontIcon"
+      data-selector-id="fontIcon"
+      data-test-id="fontIcon"
+      style="--zd-iconfont-size: var(--zd_font_size13);"
+    />
+  </button>
+</DocumentFragment>
+`;
+
+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"
+    data-id="iconContainer"
+    data-ishtml="true"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  />
+</DocumentFragment>
+`;
+
+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"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+    disabled=""
+  />
+</DocumentFragment>
+`;
+
+exports[`IconButton rendering in title 1`] = `
+<DocumentFragment>
+  <button
+    aria-pressed="false"
+    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+    data-title="IconTitle"
+  />
+</DocumentFragment>
+`;
+
+exports[`IconButton rendering isNeedEffect is False 1`] = `
+<DocumentFragment>
+  <button
+    aria-pressed="false"
+    class="buttonReset wrapper  undefined  inflex coldir both"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  />
+</DocumentFragment>
+`;
+
+exports[`IconButton rendering needButtonTag 1`] = `
+<DocumentFragment>
+  <div
+    aria-pressed="false"
+    class="false 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 defult props 1`] = `
+<DocumentFragment>
+  <button
+    aria-pressed="false"
+    class="buttonReset 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 hovertypes- bg 1`] = `
+<DocumentFragment>
+  <button
+    aria-pressed="false"
+    class="buttonReset wrapper  undefined effect default border bgHover  hoverEffect  inflex coldir both"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  />
+</DocumentFragment>
+`;
+
+exports[`IconButton rendering the hovertypes- border 1`] = `
+<DocumentFragment>
+  <button
+    aria-pressed="false"
+    class="buttonReset wrapper  undefined effect default border borderHover  hoverEffect  inflex coldir both"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  />
+</DocumentFragment>
+`;
+
+exports[`IconButton rendering the hovertypes- default 1`] = `
+<DocumentFragment>
+  <button
+    aria-pressed="false"
+    class="buttonReset 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 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"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  />
+</DocumentFragment>
+`;
+
+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"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  />
+</DocumentFragment>
+`;
+
+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"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  />
+</DocumentFragment>
+`;
+
+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"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  />
+</DocumentFragment>
+`;
+
+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"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  />
+</DocumentFragment>
+`;
+
+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"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+  />
+</DocumentFragment>
+`;
+
+exports[`IconButton rendering tourId 1`] = `
+<DocumentFragment>
+  <button
+    aria-pressed="false"
+    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    data-id="iconContainer"
+    data-ishtml="false"
+    data-selector-id="iconButton"
+    data-test-id="iconContainer"
+    data-tour="tourId"
+  />
+</DocumentFragment>
+`;

package/lib/form/fields/FieldContainer/props/propTypes.js

@@ -15,7 +15,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 
 var propTypes = (_propTypes = {
   children: _propTypes2["default"].node,
-  alignContainer: _propTypes2["default"].oneOf('vertical', 'baseline'),
+  alignContainer: _propTypes2["default"].oneOf(['vertical', 'baseline']),
   renderProps: _propTypes2["default"].shape({
     start: _propTypes2["default"].func,
     middle: _propTypes2["default"].func,

package/lib/v1/ActionButton/ActionButton.js

@@ -11,19 +11,19 @@ var _defaultProps = require("../../ActionButton/props/defaultProps");
 
 var _propTypes = require("../../ActionButton/props/propTypes");
 
-var _Popup = _interopRequireDefault(require("@zohodesk/components/lib/Popup/Popup"));
+var _Popup = _interopRequireDefault(require("@zohodesk/components/es/v1/Popup/Popup"));
 
 var _icons = require("@zohodesk/icons");
 
-var _Button = _interopRequireDefault(require("@zohodesk/components/lib/Button/Button"));
+var _Button = _interopRequireDefault(require("@zohodesk/components/es/v1/Button/Button"));
 
-var _Layout = require("@zohodesk/components/lib/Layout");
+var _Layout = require("@zohodesk/components/es/v1/Layout");
 
-var _ResponsiveDropBox = _interopRequireDefault(require("@zohodesk/components/lib/ResponsiveDropBox/ResponsiveDropBox"));
+var _ResponsiveDropBox = _interopRequireDefault(require("@zohodesk/components/es/v1/ResponsiveDropBox/ResponsiveDropBox"));
 
-var _CssProvider = _interopRequireDefault(require("@zohodesk/components/lib/Provider/CssProvider"));
+var _CssProvider = _interopRequireDefault(require("@zohodesk/components/es/v1/Provider/CssProvider"));
 
-var _semanticButtonModule = _interopRequireDefault(require("@zohodesk/components/lib/semantic/Button/semanticButton.module.css"));
+var _semanticButtonModule = _interopRequireDefault(require("@zohodesk/components/es/semantic/Button/semanticButton.module.css"));
 
 var _ActionButtonModule = _interopRequireDefault(require("../../ActionButton/ActionButton.module.css"));
 
@@ -147,10 +147,12 @@ function ActionButton(props) {
 }
 
 ActionButton.defaultProps = _defaultProps.defaultProps;
-ActionButton.propTypes = _propTypes.propTypes; // ActionButton.docs = {
+ActionButton.propTypes = _propTypes.propTypes;
+var ActionButtonComponent = (0, _Popup["default"])(ActionButton);
+ActionButtonComponent.defaultProps = ActionButton.defaultProps;
+ActionButtonComponent.propTypes = ActionButton.propTypes; // ActionButton.docs = {
 //   componentGroup: 'Atom'
 // };
 
-var _default = (0, _Popup["default"])(ActionButton);
-
+var _default = ActionButtonComponent;
 exports["default"] = _default;