oa-componentbook 0.17.34 → 0.17.35

package/build/components/GridSystem.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = GridSystem;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+require("./grid-system.css");
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _templateObject, _templateObject2, _templateObject3;
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+function GridSystem(_ref) {
+  let {
+    children,
+    isFluid
+  } = _ref;
+  const BasicGrid = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    display: grid;\n    /* \n    Small breakpoint: 4 columns.\n    */\n    grid-template-columns: repeat(4, 1fr);\n    gap: 16px;\n\n    /* \n    Medium breakpoint: 8 columns.\n    */\n    @media screen and (min-width: 768px) {\n        grid-template-columns: repeat(8, 1fr);\n        gap: 16px;\n    }\n\n    /* \n    Large breakpoint : 12 columns.\n    */\n    @media screen and (min-width: 992px) {\n        grid-template-columns: repeat(12, 1fr);\n        gap: 24px;\n    }\n\n    /* \n    Extra Large breakpoint: 12 columns.\n    */\n    @media screen and (min-width: 1200px) {\n        grid-template-columns: repeat(12, 1fr);\n        gap: 24px;\n    }\n  "])));
+  let FluidOrFixedGrid;
+  if (isFluid) {
+    FluidOrFixedGrid = (0, _styledComponents.default)(BasicGrid)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n        width: 100%;\n    "])));
+  } else {
+    FluidOrFixedGrid = (0, _styledComponents.default)(BasicGrid)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n        margin: 0 16px;\n\n        /* \n        Medium breakpoint: 8 columns.\n        */\n        @media screen and (min-width: 768px) {\n            margin: 0 32px;\n        }\n\n        /* \n        Large breakpoint : 12 columns.\n        */\n        @media screen and (min-width: 992px) {\n            margin: 0 32px;\n        }\n\n        /* \n        Extra Large breakpoint: 12 columns.\n        */\n        @media screen and (min-width: 1200px) {\n            width: 1128px;\n            margin: 0 auto;\n        }        \n    "])));
+  }
+  return /*#__PURE__*/_react.default.createElement(FluidOrFixedGrid, null, children);
+}
+GridSystem.propTypes = {
+  children: _propTypes.default.node.isRequired,
+  isFluid: _propTypes.default.bool
+};
+GridSystem.defaultProps = {
+  isFluid: false
+};

package/build/components/grid-system.css

@@ -0,0 +1,205 @@
+/* 
+Small breakpoint. 
+
+On small screens, there are only 4 columns, so an element can take 4 columns at max.
+*/
+.col-s-1 {
+    /* No start or end defined. Span 1 columns. */
+    grid-column: span 1 / auto;
+}
+
+.col-s-2 {
+    /* No start or end defined. Span 2 columns. */
+    grid-column: span 2 / auto;
+}
+
+.col-s-3 {
+/* No start or end defined. Span 3 columns. */
+    grid-column: span 3 / auto;
+}
+
+.col-s-4 {
+    /* No start or end defined. Span 4 columns. */
+    grid-column: span 4 / auto;
+}
+
+/* 
+Medium breakpoint.
+
+On medium screens, there are 8 columns, so an element can take 8 columns at max.
+*/
+@media screen and (min-width: 768px) {
+    .col-m-1 {
+    /* No start or end defined. Span 1 columns. */
+        grid-column: span 1 / auto;
+    }
+
+    .col-m-2 {
+        /* No start or end defined. Span 2 columns. */
+        grid-column: span 2 / auto;
+    }
+
+    .col-m-3 {
+        /* No start or end defined. Span 3 columns. */
+        grid-column: span 3 / auto;
+    }
+
+    .col-m-4 {
+        /* No start or end defined. Span 4 columns. */
+        grid-column: span 4 / auto;
+    }
+
+    .col-m-5 {
+        /* No start or end defined. Span 5 columns. */
+        grid-column: span 5 / auto;
+    }
+
+    .col-m-6 {
+        /* No start or end defined. Span 6 columns. */
+        grid-column: span 6 / auto;
+    }
+
+    .col-m-7 {
+        /* No start or end defined. Span 7 columns. */
+        grid-column: span 7 / auto;
+    }
+
+    .col-m-8 {
+        /* No start or end defined. Span 8 columns. */
+        grid-column: span 8 / auto;
+    }
+}
+
+/* 
+Large breakpoint. 
+
+On large screens, there are 12 columns, so an element can take 12 columns at max.
+*/
+@media screen and (min-width: 992px) {
+    .col-l-1 {
+    /* No start or end defined. Span 1 columns. */
+        grid-column: span 1 / auto;
+    }
+
+    .col-l-2 {
+        /* No start or end defined. Span 2 columns. */
+        grid-column: span 2 / auto;
+    }
+
+    .col-l-3 {
+        /* No start or end defined. Span 3 columns. */
+        grid-column: span 3 / auto;
+    }
+
+    .col-l-4 {
+        /* No start or end defined. Span 4 columns. */
+        grid-column: span 4 / auto;
+    }
+
+    .col-l-5 {
+        /* No start or end defined. Span 5 columns. */
+        grid-column: span 5 / auto;
+    }
+
+    .col-l-6 {
+    /* No start or end defined. Span 6 columns. */
+        grid-column: span 6 / auto;
+    }
+
+    .col-l-7 {
+        /* No start or end defined. Span 7 columns. */
+        grid-column: span 7 / auto;
+    }
+
+    .col-l-8 {
+        /* No start or end defined. Span 8 columns. */
+        grid-column: span 8 / auto;
+    }
+
+    .col-l-9 {
+        /* No start or end defined. Span 9 columns. */
+        grid-column: span 9 / auto;
+    }
+
+    .col-l-10 {
+        /* No start or end defined. Span 10 columns. */
+        grid-column: span 10 / auto;
+    }
+
+    .col-l-11 {
+        /* No start or end defined. Span 11 columns. */
+        grid-column: span 11 / auto;
+    }
+
+    .col-l-12 {
+        /* No start or end defined. Span 12 columns. */
+        grid-column: span 12 / auto;
+    }
+}
+
+/* 
+Extra Large breakpoint. 
+
+On extra large screens, there are 12 columns, so an element can take 12 columns at max.
+*/
+@media screen and (min-width: 1200px) {
+    .col-xl-1 {
+        /* No start or end defined. Span 1 columns. */
+        grid-column: span 1 / auto;
+    }
+
+    .col-xl-2 {
+        /* No start or end defined. Span 2 columns. */
+        grid-column: span 2 / auto;
+    }
+
+    .col-xl-3 {
+    /* No start or end defined. Span 3 columns. */
+        grid-column: span 3 / auto;
+    }
+
+    .col-xl-4 {
+        /* No start or end defined. Span 4 columns. */
+        grid-column: span 4 / auto;
+    }
+
+    .col-xl-5 {
+    /* No start or end defined. Span 5 columns. */
+        grid-column: span 5 / auto;
+    }
+
+    .col-xl-6 {
+        /* No start or end defined. Span 6 columns. */
+        grid-column: span 6 / auto;
+    }
+
+    .col-xl-7 {
+        /* No start or end defined. Span 7 columns. */
+        grid-column: span 7 / auto;
+    }
+
+    .col-xl-8 {
+        /* No start or end defined. Span 8 columns. */
+        grid-column: span 8 / auto;
+    }
+
+    .col-xl-9 {
+        /* No start or end defined. Span 9 columns. */
+        grid-column: span 9 / auto;
+    }
+
+    .col-xl-10 {
+        /* No start or end defined. Span 10 columns. */
+        grid-column: span 10 / auto;
+    }
+
+    .col-xl-11 {
+        /* No start or end defined. Span 11 columns. */
+        grid-column: span 11 / auto;
+    }
+
+    .col-xl-12 {
+        /* No start or end defined. Span 12 columns. */
+        grid-column: span 12 / auto;
+    }
+}

package/build/components/oa-component-accordion/Accordion.js

@@ -3,19 +3,16 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.SmallText = void 0;
+exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _antd = require("antd");
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-var _templateObject;
+var _styles = require("./styles");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-const SmallText = _styledComponents.default.small(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  font-size: 18px;\n  color: #E21616;\n  margin: 0 0 0 4px;\n"])));
-exports.SmallText = SmallText;
 function Accordion(_ref) {
   let {
     body,
+    'data-test': dataTest,
     disabled,
     headerText,
     smallText
@@ -32,23 +29,27 @@ function Accordion(_ref) {
     expandIconPosition: "end",
     defaultActiveKey: disabled ? '-1' : '1'
   }, /*#__PURE__*/_react.default.createElement(_antd.Collapse.Panel, {
+    "data-test": dataTest ? "".concat(dataTest, "--complete") : undefined,
     collapsible: disabled ? 'disabled' : undefined,
     key: "1",
     header: /*#__PURE__*/_react.default.createElement("div", {
+      "data-test": dataTest ? "".concat(dataTest, "--header") : undefined,
       className: "type-button-500"
-    }, headerText, smallText && /*#__PURE__*/_react.default.createElement(SmallText, null, smallText))
+    }, headerText, smallText && /*#__PURE__*/_react.default.createElement(_styles.SmallText, null, smallText))
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "gridContainer"
   }, body))));
 }
 Accordion.propTypes = {
   body: _propTypes.default.node,
+  'data-test': _propTypes.default.string,
   disabled: _propTypes.default.bool,
   headerText: _propTypes.default.string.isRequired,
   smallText: _propTypes.default.string
 };
 Accordion.defaultProps = {
   body: '',
+  'data-test': null,
   disabled: false,
   smallText: ''
 };

package/build/components/oa-component-accordion/styles.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.SmallText = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _templateObject;
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+var _default = {};
+exports.default = _default;
+const SmallText = _styledComponents.default.small(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  font-size: 18px;\n  color: #E21616;\n  margin: 0 0 0 4px;\n"])));
+exports.SmallText = SmallText;

package/build/components/oa-component-button/CustomButton.js

@@ -13,7 +13,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _Typography = _interopRequireDefault(require("../oa-component-typography/Typography"));
 var _styles = require("./styles");
-const _excluded = ["className", "disabled", "onClick", "iconConfig", "size", "label", "htmlType", "type"];
+const _excluded = ["className", "disabled", "onClick", "iconConfig", "size", "label", "htmlType", "type", "data-test"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -29,16 +29,18 @@ function CustomButton(_ref) {
       size,
       label,
       htmlType,
-      type
+      type,
+      'data-test': dataTest
     } = _ref,
     domProps = _objectWithoutProperties(_ref, _excluded);
   const [buttonTypo] = (0, _react.useState)((0, _styles.getButtonTypography)(size));
   return /*#__PURE__*/_react.default.createElement(_styles.ColoredStyledButton, _extends({
-    className: "\n        ".concat(disabled ? "".concat(type.replace('danger-', ''), "-disabled") : type, " \n        \n        ").concat(type.replace('danger-', '') === 'text-only' ? 'text-only-size' : size, "\n\n        ").concat(className, "\n      "),
+    className: "".concat(disabled ? "".concat(type.replace('danger-', ''), "-disabled") : type, " ").concat(type.replace('danger-', '') === 'text-only' ? 'text-only-size' : size, " ").concat(className),
     disabled: disabled,
     onClick: disabled ? null : onClick,
     type: htmlType,
-    size: size
+    size: size,
+    "data-test": dataTest
   }, domProps), /*#__PURE__*/_react.default.createElement("div", {
     className: "text-container"
   }, iconConfig.position === 'left' && iconConfig.icon, label && /*#__PURE__*/_react.default.createElement(_Typography.default, {
@@ -47,6 +49,7 @@ function CustomButton(_ref) {
 }
 CustomButton.propTypes = {
   className: _propTypes.default.string,
+  'data-test': _propTypes.default.string,
   disabled: _propTypes.default.bool,
   onClick: _propTypes.default.func.isRequired,
   size: _propTypes.default.oneOf(['small', 'medium', 'large']),
@@ -61,6 +64,7 @@ CustomButton.propTypes = {
 };
 CustomButton.defaultProps = {
   className: '',
+  'data-test': null,
   disabled: false,
   iconConfig: {},
   label: '',

package/build/components/oa-component-checkbox/CustomCheckBox.js

@@ -9,18 +9,19 @@ var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _antd = require("antd");
 var _Typography = _interopRequireDefault(require("../oa-component-typography/Typography"));
-const _excluded = ["label", "disabled", "onChange", "size", "value"];
+var _utils = require("../../../utils");
+const _excluded = ["data-test", "disabled", "label", "onChange", "size"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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 _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 function CustomCheckBox(_ref) {
   let {
-      label,
+      'data-test': dataTest,
       disabled,
+      label,
       onChange,
-      size,
-      value
+      size
       /*
       Instead of keeping a `checked` prop explicitly,
       we keep it optional by directly passing extra props to the antd component.
@@ -33,17 +34,22 @@ function CustomCheckBox(_ref) {
     onChange(event);
   };
   return /*#__PURE__*/_react.default.createElement(_antd.Checkbox, _extends({
+    "data-test": dataTest,
     disabled: disabled,
-    onChange: handleChange,
-    value: value
-  }, antDesignProps), /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    onChange: handleChange
+  }, antDesignProps),
+  // The label is a string or a number
+  ((0, _utils.isString)(label) || (0, _utils.isNumber)(label)) && /*#__PURE__*/_react.default.createElement(_Typography.default, {
     typography: size === 'large' ? 'type-b1-400' : 'type-b2-400'
-  }, label));
+  }, label) ||
+  // The label is a node
+  (0, _utils.isObject)(label) && label || undefined);
 }
 
 // This allows us referencing the Group container in our Checkbox component
 CustomCheckBox.Group = _antd.Checkbox.Group;
 CustomCheckBox.propTypes = {
+  'data-test': _propTypes.default.string,
   disabled: _propTypes.default.bool,
   label: _propTypes.default.node,
   onChange: _propTypes.default.func,
@@ -51,6 +57,7 @@ CustomCheckBox.propTypes = {
   value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number, _propTypes.default.bool])
 };
 CustomCheckBox.defaultProps = {
+  'data-test': null,
   disabled: false,
   label: null,
   onChange: value => {},

package/build/components/oa-component-drawer/CustomDrawer.js

@@ -1,26 +1,28 @@
 "use strict";
 
 require("core-js/modules/es.object.assign.js");
-require("core-js/modules/es.weak-map.js");
-require("core-js/modules/web.dom-collections.iterator.js");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _nanoid = require("nanoid");
 var _icons = require("@ant-design/icons");
 var _CustomButton = _interopRequireDefault(require("../oa-component-button/CustomButton"));
 var _Typography = _interopRequireDefault(require("../oa-component-typography/Typography"));
 var _styles = require("./styles");
-const _excluded = ["buttonConfig", "children", "isBaseDrawer", "onClose", "open", "placement", "title", "height", "width"];
+var _utils = require("../../../utils");
+const _excluded = ["buttonConfig", "children", "isBaseDrawer", "onClose", "open", "placement", "title", "height", "width", "data-test"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 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 _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function DrawerTitle(title) {
+  return ((0, _utils.isString)(title) || (0, _utils.isNumber)(title)) && /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    typography: "type-sl1-700"
+  }, title) || !(0, _utils.isObject)(title) && title || undefined;
+}
 function CustomDrawer(_ref) {
   let {
       buttonConfig,
@@ -37,7 +39,8 @@ function CustomDrawer(_ref) {
       placement,
       title,
       height,
-      width
+      width,
+      'data-test': dataTest
     } = _ref,
     antDesignProps = _objectWithoutProperties(_ref, _excluded);
   /*
@@ -52,19 +55,18 @@ function CustomDrawer(_ref) {
   };
   return /*#__PURE__*/_react.default.createElement(_styles.CustomStyledDrawer, _extends({
     closeIcon: false,
+    "data-test": dataTest,
     onClose: handleClose,
     open: open,
     placement: placement,
     push: false,
-    title: isBaseDrawer ? /*#__PURE__*/_react.default.createElement(_styles.BaseDrawerTitle, null, /*#__PURE__*/_react.default.createElement(_Typography.default, {
-      typography: "type-sl1-700"
-    }, title), /*#__PURE__*/_react.default.createElement(_icons.CloseOutlined, {
-      onClick: handleClose
+    title: isBaseDrawer ? /*#__PURE__*/_react.default.createElement(_styles.BaseDrawerTitle, null, DrawerTitle(title), /*#__PURE__*/_react.default.createElement(_icons.CloseOutlined, {
+      onClick: handleClose,
+      "data-test": dataTest ? "".concat(dataTest, "--close-drawer-button") : undefined
     })) : /*#__PURE__*/_react.default.createElement(_styles.LayeredDrawerTitle, null, /*#__PURE__*/_react.default.createElement(_icons.LeftOutlined, {
-      onClick: handleClose
-    }), /*#__PURE__*/_react.default.createElement(_Typography.default, {
-      typography: "type-sl1-700"
-    }, title)),
+      onClick: handleClose,
+      "data-test": dataTest ? "".concat(dataTest, "--close-drawer-button") : undefined
+    }), DrawerTitle(title)),
     height: height,
     width: width,
     footer: (buttonConfig === null || buttonConfig === void 0 ? void 0 : buttonConfig.length) > 0 && /*#__PURE__*/_react.default.createElement(_styles.DrawerFooter, null, buttonConfig.map(button => /*#__PURE__*/_react.default.createElement(_CustomButton.default, {
@@ -77,19 +79,22 @@ function CustomDrawer(_ref) {
       label: button.label,
       onClick: button.callback,
       size: "large",
-      type: button.type
+      type: button.type,
+      "data-test": button['data-test']
     })))
   }, antDesignProps), children);
 }
 CustomDrawer.propTypes = {
   // Array of button configurations
   buttonConfig: _propTypes.default.arrayOf(_propTypes.default.shape({
+    'data-test': _propTypes.default.string,
     disabled: _propTypes.default.bool,
     callback: _propTypes.default.func.isRequired,
     label: _propTypes.default.string.isRequired,
     type: _propTypes.default.oneOf(['secondary', 'primary']).isRequired
   })),
   children: _propTypes.default.node,
+  'data-test': _propTypes.default.string,
   isBaseDrawer: _propTypes.default.bool,
   onClose: _propTypes.default.func,
   open: _propTypes.default.bool,
@@ -101,6 +106,7 @@ CustomDrawer.propTypes = {
 CustomDrawer.defaultProps = {
   buttonConfig: null,
   children: null,
+  'data-test': null,
   isBaseDrawer: true,
   onClose: () => {},
   open: false,

package/build/components/oa-component-radio/CustomRadio.js

@@ -7,20 +7,19 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _antd = require("antd");
 var _Typography = _interopRequireDefault(require("../oa-component-typography/Typography"));
-const _excluded = ["label", "disabled", "onChange", "size", "value"];
-var _templateObject;
+var _utils = require("../../../utils");
+var _styles = require("./styles");
+const _excluded = ["label", "data-test", "disabled", "onChange", "size", "value"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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 _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-const StyledRadio = (0, _styledComponents.default)(_antd.Radio)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .ant-radio-checked .ant-radio-inner{\n    background: #fff;\n    border:1px solid #1677ff;\n  }\n  .ant-radio-inner::after{\n    background: #1677ff;\n  }\n"])));
 function CustomRadio(_ref) {
   let {
       label,
+      'data-test': dataTest,
       disabled,
       onChange,
       size,
@@ -44,19 +43,21 @@ function CustomRadio(_ref) {
         }
       }
     }
-  }, /*#__PURE__*/_react.default.createElement(StyledRadio, _extends({
+  }, /*#__PURE__*/_react.default.createElement(_styles.StyledRadio, _extends({
     disabled: disabled,
     onChange: handleChange,
-    value: value
-  }, antDesignProps), label !== undefined && /*#__PURE__*/_react.default.createElement(_Typography.default, {
+    value: value,
+    "data-test": dataTest
+  }, antDesignProps), ((0, _utils.isString)(label) || (0, _utils.isNumber)(label)) && /*#__PURE__*/_react.default.createElement(_Typography.default, {
     typography: size === 'large' ? 'type-b1-400' : 'type-b2-400'
-  }, label)));
+  }, label) || !(0, _utils.isObject)(label) && label || undefined));
 }
 
 // This allows us referencing the Group container and Button component in our Checkbox component
 CustomRadio.Group = _antd.Radio.Group;
 CustomRadio.Button = CustomRadio;
 CustomRadio.propTypes = {
+  'data-test': _propTypes.default.string,
   disabled: _propTypes.default.bool,
   label: _propTypes.default.node,
   onChange: _propTypes.default.func,
@@ -64,8 +65,9 @@ CustomRadio.propTypes = {
   value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number, _propTypes.default.bool])
 };
 CustomRadio.defaultProps = {
+  'data-test': null,
   disabled: false,
-  label: undefined,
+  label: null,
   onChange: value => {},
   size: 'small',
   value: ''

package/build/components/oa-component-radio/styles.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.StyledRadio = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _antd = require("antd");
+var _templateObject;
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+var _default = {};
+exports.default = _default;
+const StyledRadio = (0, _styledComponents.default)(_antd.Radio)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .ant-radio-checked .ant-radio-inner{\n    background: #fff;\n    border:1px solid #1677ff;\n  }\n  .ant-radio-inner::after{\n    background: #1677ff;\n  }\n"])));
+exports.StyledRadio = StyledRadio;

package/build/components/oa-component-table/CustomTable.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
+var _antd = require("antd");
 var _styles = require("./styles");
 const _excluded = ["columns", "dataSource", "pagination", "rowKey"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -21,13 +22,22 @@ function CustomTable(_ref) {
       rowKey
     } = _ref,
     antDesignProps = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/_react.default.createElement(_styles.StyledTable, _extends({
+  return /*#__PURE__*/_react.default.createElement(_antd.ConfigProvider, {
+    theme: {
+      components: {
+        Table: {
+          // bodySortBg: '#000000',
+          // rowHoverBg: '#000000',
+        }
+      }
+    }
+  }, /*#__PURE__*/_react.default.createElement(_styles.StyledTable, _extends({
     columns: columns,
     dataSource: dataSource,
     pagination: pagination,
     rowKey: rowKey
     // This allows for all ant design props to be supported.
-  }, antDesignProps));
+  }, antDesignProps)));
 }
 CustomTable.propTypes = {
   columns: _propTypes.default.array,