oa-componentbook 0.18.356 → 0.18.357

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -25,7 +25,8 @@ var _CustomTag = _interopRequireDefault(require("../oa-component-tag/CustomTag")
25
25
  var _MaterialIcon = _interopRequireDefault(require("../oa-component-icons/MaterialIcon"));
26
26
  var _utils = require("../../utils");
27
27
  var _styles = require("./styles");
28
- const _excluded = ["columns", "dataSource", "pagination", "rowKey", "size", "style", "tableBorder", "emptyText", "noOfColumnToShow", "defaultCardShow"],
28
+ var _CustomPagination = _interopRequireDefault(require("../oa-component-pagination/CustomPagination"));
29
+ const _excluded = ["columns", "dataSource", "pagination", "rowKey", "size", "style", "tableBorder", "emptyText", "noOfColumnToShow", "defaultCardShow", "onMobilePageChange", "showNumberPagination"],
29
30
  _excluded2 = ["title"];
30
31
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
31
32
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
@@ -64,7 +65,9 @@ function CustomTable(_ref) {
64
65
  tableBorder,
65
66
  emptyText,
66
67
  noOfColumnToShow,
67
- defaultCardShow
68
+ defaultCardShow,
69
+ onMobilePageChange,
70
+ showNumberPagination
68
71
  } = _ref,
69
72
  antDesignProps = _objectWithoutProperties(_ref, _excluded);
70
73
  const [viewMore, setViewMore] = (0, _react.useState)([]);
@@ -252,6 +255,18 @@ function CustomTable(_ref) {
252
255
  type: "secondary",
253
256
  size: "large",
254
257
  onClick: () => pagination === null || pagination === void 0 ? void 0 : pagination.onChangeHandlerForMobile()
258
+ })), cardShow && dataSource.length > 0 && onMobilePageChange && showNumberPagination && /*#__PURE__*/_react.default.createElement("div", {
259
+ className: "mobileViewPagination"
260
+ }, /*#__PURE__*/_react.default.createElement(_CustomPagination.default, {
261
+ current: pagination.current,
262
+ pageSize: pagination.pageSize,
263
+ total: pagination.total,
264
+ onChange: page => {
265
+ onMobilePageChange === null || onMobilePageChange === void 0 || onMobilePageChange({
266
+ current: page,
267
+ pageSize: pagination.pageSize
268
+ });
269
+ }
255
270
  })));
256
271
  }
257
272
  CustomTable.propTypes = {
@@ -264,7 +279,9 @@ CustomTable.propTypes = {
264
279
  tableBorder: _propTypes.default.bool,
265
280
  emptyText: _propTypes.default.string,
266
281
  noOfColumnToShow: _propTypes.default.number,
267
- defaultCardShow: _propTypes.default.bool
282
+ defaultCardShow: _propTypes.default.bool,
283
+ onMobilePageChange: _propTypes.default.func,
284
+ showNumberPagination: _propTypes.default.bool
268
285
  };
269
286
  CustomTable.defaultProps = {
270
287
  dataSource: [],
@@ -276,6 +293,8 @@ CustomTable.defaultProps = {
276
293
  tableBorder: true,
277
294
  emptyText: 'No Data',
278
295
  noOfColumnToShow: 5,
279
- defaultCardShow: false
296
+ defaultCardShow: false,
297
+ onMobilePageChange: null,
298
+ showNumberPagination: false
280
299
  };
281
300
  var _default = exports.default = CustomTable;
@@ -11,4 +11,4 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
11
11
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
12
12
  var _default = exports.default = {};
13
13
  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"])));
14
- 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"])));
14
+ 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\n@media only screen and (max-width: 600px) {\n .mobileViewPagination{display: flex;\n justify-content: flex-end;\n margin: 16px 0px;\n }\n\n .mobileViewPagination .ant-pagination {\n padding: 0;\n }\n}\n"])));
@@ -53,7 +53,7 @@ const getColorStyles = props => {
53
53
  if (type === 'blue') {
54
54
  return {
55
55
  backgroundColor: 'var(--color-background-info)',
56
- borderColor: 'var(--color-primary-content)',
56
+ borderColor: 'var(--color-primary)',
57
57
  textColor: 'var(--color-primary)'
58
58
  };
59
59
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "oa-componentbook",
3
- "version": "0.18.356",
3
+ "version": "0.18.357",
4
4
  "private": false,
5
5
  "description": "Reusable components",
6
6
  "main": "build/index.js",