oa-componentbook 0.18.256 → 0.18.258

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

@@ -21,6 +21,7 @@ require("antd/dist/reset.css");
 var _ColorVariablesMap = _interopRequireDefault(require("../../global-css/ColorVariablesMap"));
 var _TypographiesMap = _interopRequireDefault(require("../../global-css/TypographiesMap"));
 var _CustomButton = _interopRequireDefault(require("../oa-component-button/CustomButton"));
+var _CustomTag = _interopRequireDefault(require("../oa-component-tag/CustomTag"));
 var _MaterialIcon = _interopRequireDefault(require("../oa-component-icons/MaterialIcon"));
 var _utils = require("../../utils");
 var _styles = require("./styles");
@@ -53,7 +54,6 @@ function CustomTable(_ref) {
     antDesignProps = _objectWithoutProperties(_ref, _excluded);
   const [viewMore, setViewMore] = (0, _react.useState)([]);
   const [cardShow, setCardShow] = (0, _react.useState)(false);
-  const lastItemRef = (0, _react.useRef)(null);
   (0, _react.useEffect)(() => {
     if (window.innerWidth <= 600) {
       if (defaultCardShow) {
@@ -65,13 +65,6 @@ function CustomTable(_ref) {
       }
     }
   }, [defaultCardShow, columns === null || columns === void 0 ? void 0 : columns.length, dataSource === null || dataSource === void 0 ? void 0 : dataSource.length]);
-  (0, _react.useEffect)(() => {
-    if (lastItemRef.current) {
-      lastItemRef.current.scrollIntoView({
-        behavior: 'smooth'
-      });
-    }
-  }, [dataSource]);
   const uppercaseColumns = columns.map(column => {
     const {
         title
@@ -109,15 +102,10 @@ function CustomTable(_ref) {
     }
     return arr;
   }
-  const handleViewMore = index => {
+  const handleViewMore = (index, row) => {
     const tempViewMore = JSON.parse(JSON.stringify(viewMore));
     setViewMore(checkAndUpdateArray(tempViewMore, index));
   };
-  const handleLoadMore = () => {
-    if (pagination !== null && pagination !== void 0 && pagination.onChangeHandlerForMobile) {
-      pagination.onChangeHandlerForMobile();
-    }
-  };
   const checkLastElementIsAction = colIndex => {
     var _uppercaseColumns;
     if ((uppercaseColumns === null || uppercaseColumns === void 0 || (_uppercaseColumns = uppercaseColumns[uppercaseColumns.length - 1]) === null || _uppercaseColumns === void 0 || (_uppercaseColumns = _uppercaseColumns.key) === null || _uppercaseColumns === void 0 ? void 0 : _uppercaseColumns.toLowerCase()) === 'action' && colIndex === uppercaseColumns.length - 1) {
@@ -134,9 +122,9 @@ function CustomTable(_ref) {
     }
     return '';
   };
-  const CheckMoreView = (0, _react.useMemo)(() => {
+  const CheckMoreView = (0, _react.useMemo)(colIndex => {
     var _uppercaseColumns2;
-    let tempNoOfColumnToShow = noOfColumnToShow + 1; // because of heading
+    let tempNoOfColumnToShow = noOfColumnToShow + 1; // bcz of heading
     if ((uppercaseColumns === null || uppercaseColumns === void 0 || (_uppercaseColumns2 = uppercaseColumns[uppercaseColumns.length - 1]) === null || _uppercaseColumns2 === void 0 || (_uppercaseColumns2 = _uppercaseColumns2.key) === null || _uppercaseColumns2 === void 0 ? void 0 : _uppercaseColumns2.toLowerCase()) === 'action') {
       tempNoOfColumnToShow += 1; // for action column
     }
@@ -226,7 +214,7 @@ function CustomTable(_ref) {
     label: "Load More",
     type: "secondary",
     size: "large",
-    onClick: handleLoadMore
+    onClick: () => pagination === null || pagination === void 0 ? void 0 : pagination.onChangeHandlerForMobile()
   })));
 }
 CustomTable.propTypes = {

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

@@ -11,4 +11,4 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 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 = {};
 const StyledTable = exports.StyledTable = (0, _styledComponents.default)(_antd.Table)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  tr > td {\n    vertical-align: top;\n  }\n  .ant-table-row:last-child td {\n    border: none;\n  }\n"])));
-const MainContainer = exports.MainContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n.fullWidthBtn button{\n  width: 100%;\n}\n.fullWidthBtn{\n  position: fixed;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  background: #fff;\n  padding: 16px;\n  box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n}\n.secondary:hover {\n  background: transparent;\n    border: 1px solid var(--color-primary);\n    color: var(--color-primary);\n}\n.cardStyles {\n    padding: 16px;\n    border-radius: 4px;\n    border: 1px solid var(--color-divider);\n    background: var(--color-primary-background);\n    margin: 0 0 24px;\n  }\n  .bottomPadding{\n    padding: 0 0 84px;\n  }\n  .showHideBtn {\n    padding: 8px 0 16px;\n  }\n  .keyValue {\n    display: flex;\n    gap: 12px;\n    margin: 0 0 16px;\n  }\n  .keyValue:last-child {\n    margin: 0;\n  }\n  .keyValue strong, .keyValue span {\n    width: 100%;\n  }\n  .keyValue strong {\n    color: var(--color-primary-content);\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 20px;\n  }\n  .keyValue span {\n    color: var(--color-primary-content);\n    font-size: 14px;\n    font-weight: 400;\n    line-height: 20px;\n  }\n  .srDetails {\n    padding: 0 0 12px;\n    margin: 0 0 16px;\n    border-bottom: 1px solid var(--color-divider);\n  }\n  .footerCta {\n    display: flex;\n    justify-content: space-between;\n    gap: 16px;\n    padding: 16px 16px 0;\n    border-top: 1px solid var(--color-divider);\n    width: 100%;\n  }\n  .footerCta button{\n    width: 100%;\n  }\n  .flexEnd {\n    display: flex;\n    justify-content: end;\n    margin: 0 0 12px;\n  }\n"])));
+const MainContainer = exports.MainContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n.fullWidthBtn button{\n  width: 100%;\n}\n.fullWidthBtn{\n  position: fixed;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  background: #fff;\n  padding: 16px;\n  box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.14);\n}\n.secondary:hover {\n  background: transparent;\n    border: 1px solid var(--color-primary);\n    color: var(--color-primary);\n}\n.cardStyles {\n    padding: 16px;\n    border-radius: 4px;\n    border: 1px solid var(--color-divider);\n    background: var(--color-primary-background);\n    margin: 0 0 24px;\n  }\n  .bottomPadding{\n    padding: 0 0 84px;\n  }\n  .showHideBtn {\n    padding: 8px 0 16px;\n  }\n  .keyValue {\n    display: flex;\n    gap: 12px;\n    margin: 0 0 16px;\n  }\n  .keyValue:last-child {\n    margin: 0;\n  }\n  .keyValue strong, .keyValue span {\n    width: 100%;\n  }\n  .keyValue strong {\n    color: var(--color-primary-content);\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 20px;\n  }\n  .keyValue span {\n    color: var(--color-primary-content);\n    font-size: 14px;\n    font-weight: 400;\n    line-height: 20px;\n  }\n  .srDetails {\n    padding: 0 0 12px;\n    margin: 0 0 16px;\n    border-bottom: 1px solid var(--color-divider);\n  }\n  .srDetails >span > .type-sl1-700{\n    font-size: initial;\n  }\n  .footerCta {\n    display: flex;\n    justify-content: space-between;\n    gap: 16px;\n    padding: 16px 16px 0;\n    border-top: 1px solid var(--color-divider);\n    width: 100%;\n  }\n  .footerCta button{\n    width: 100%;\n  }\n  .flexEnd {\n    display: flex;\n    justify-content: end;\n    margin: 0 0 12px;\n  }\n"])));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oa-componentbook",
-  "version": "0.18.256",
+  "version": "0.18.258",
   "private": false,
   "description": "Reusable components",
   "main": "build/index.js",