@dnb/eufemia/cjs/components/pagination/PaginationProvider.js

DNB Eufemia Design System UI Library

"use strict";
"use client";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
require("core-js/modules/web.dom-collections.iterator.js");
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _Context = _interopRequireDefault(require("../../shared/Context"));
var _componentHelper = require("../../shared/component-helper");
var _PaginationHelpers = require("./PaginationHelpers");
var _PaginationContext = _interopRequireDefault(require("./PaginationContext"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
class PaginationProvider extends _react.default.PureComponent {
  static getDerivedStateFromProps(props, state) {
    if (props.page_count !== null) {
      state.pageCount = parseFloat(props.page_count) || 1;
    }
    if (props.current_page !== null && typeof state.currentPage === 'undefined') {
      state.currentPage = parseFloat(props.current_page) || 1;
    }
    if (typeof state.startupPage !== 'number') {
      state.startupPage = parseFloat(props.startup_page) || parseFloat(props.current_page) || state.currentPage;
    }
    state.parallelLoadCount = parseFloat(props.parallel_load_count) || 1;
    state.minTime = parseFloat(props.min_wait_time) || 0;
    state.placeMakerBeforeContent = (0, _componentHelper.isTrue)(props.place_maker_before_content) || (0, _componentHelper.isTrue)(props.place_marker_before_content);
    if (props.useMarkerOnly && (0, _componentHelper.isTrue)(props.reset_pagination_handler)) {
      state.lowerPage = undefined;
      state.upperPage = undefined;
    }
    if (props.useMarkerOnly) {
      if (typeof state.lowerPage === 'undefined') {
        state.lowerPage = state.startupPage || 1;
      }
      const cur = parseFloat(props.current_page);
      if (!isNaN(cur) && cur < state.lowerPage) {
        state.lowerPage = cur;
      }
      if (typeof state.upperPage === 'undefined') {
        state.upperPage = state.startupPage + (parseFloat(props.startup_count) || 1) - 1 || 1;
      }
    }
    if ((0, _componentHelper.isTrue)(props.reset_content_handler)) {
      state.items = [];
      state.pageCount = parseFloat(props.page_count) || 1;
    }
    if (typeof props.items === 'string' && props.items[0] === '[') {
      state.items = JSON.parse(props.items);
    } else if (Array.isArray(props.items)) {
      state.items = props.items;
    }
    return state;
  }
  constructor(_props) {
    var _this;
    super(_props);
    _this = this;
    _defineProperty(this, "setContent", function (newContent) {
      let content = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
      let position = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
      if (!Array.isArray(newContent) && content) {
        newContent = [newContent, content];
      }
      const pageNumber = parseFloat(newContent[0]) || 1;
      newContent = newContent[1];
      if (typeof newContent === 'function') {
        content = newContent();
      } else if (_react.default.isValidElement(newContent)) {
        content = newContent;
      }
      if (content) {
        let itemToPrepare = _this.state.items.find(_ref => {
          let {
            pageNumber: p
          } = _ref;
          return p === pageNumber;
        });
        let items = null;
        if (!itemToPrepare) {
          items = _this.prefillItems(pageNumber, {
            position
          });
          itemToPrepare = items.find(_ref2 => {
            let {
              pageNumber: p
            } = _ref2;
            return p === pageNumber;
          });
        }
        if (itemToPrepare.content) {
          itemToPrepare.update(content);
        } else {
          itemToPrepare.insert(content);
        }
        _this.setState({
          items: [...(items || _this.state.items)],
          currentPage: pageNumber
        }, _this.callOnPageUpdate);
      }
    });
    _defineProperty(this, "resetContent", () => {
      clearTimeout(this.resetContentTimeout);
      this.resetContentTimeout = setTimeout(() => {
        this.setState({
          items: []
        });
      }, 10);
    });
    _defineProperty(this, "resetInfinity", function () {
      let pageNumber = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this.state.startupPage;
      const lowerPage = pageNumber;
      const upperPage = pageNumber + parseFloat(_this.props.startup_count) - 1;
      const currentPage = pageNumber;
      _this.setState({
        items: [],
        hasEndedInfinity: true,
        lowerPage,
        upperPage,
        currentPage
      });
      _this.startInfinity();
    });
    _defineProperty(this, "startInfinity", () => {
      this.setState({
        hasEndedInfinity: false
      });
    });
    _defineProperty(this, "endInfinity", () => {
      this.setState({
        hasEndedInfinity: true
      }, () => {
        const pageNumber = this.state.currentPage + 1;
        (0, _componentHelper.dispatchCustomElementEvent)(this, 'on_end', _objectSpread({
          pageNumber
        }, this));
      });
    });
    _defineProperty(this, "setItems", (items, cb) => {
      this.setState({
        items
      }, cb);
    });
    _defineProperty(this, "prefillItems", function (pageNumber) {
      let props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
      let items = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : _this.state.items;
      const position = props.position || (pageNumber < _this.state.currentPage ? 'before' : 'after');
      if (isNaN(pageNumber)) {
        pageNumber = 1;
      }
      const exists = items.findIndex(_ref3 => {
        let {
          pageNumber: p
        } = _ref3;
        return p === pageNumber;
      }) > -1;
      if (exists) {
        return items;
      }
      const obj = _objectSpread({
        pageNumber,
        position,
        skipObserver: false
      }, props);
      switch (position) {
        case 'before':
          return [new _PaginationHelpers.ContentObject(obj), ...items];
        case 'after':
          return [...items, new _PaginationHelpers.ContentObject(obj)];
      }
    });
    _defineProperty(this, "setStateHandler", (state, cb) => {
      this.setState(_objectSpread({}, state), cb);
    });
    _defineProperty(this, "callOnPageUpdate", () => {
      if (Array.isArray(this._updateStack)) {
        this._updateStack.forEach(cb => {
          if (typeof cb === 'function') {
            cb();
          }
        });
        this._updateStack = [];
      }
    });
    _defineProperty(this, "updatePageContent", function () {
      let pageNumber = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : _this.state.currentPage;
      let potentialElement = _this.props.internalContent;
      if (typeof _this.props.internalContent === 'function') {
        potentialElement = _this.props.internalContent(_objectSpread(_objectSpread({}, _this), {}, {
          pageNumber,
          page: pageNumber
        }));
      }
      if (potentialElement && _react.default.isValidElement(potentialElement)) {
        _this.setContent([pageNumber, potentialElement]);
      }
    });
    _defineProperty(this, "onPageUpdate", fn => {
      this._updateStack = this._updateStack || [];
      this._updateStack.push(fn);
    });
    this.state = {
      items: [],
      isLoading: false
    };
    if (_props.rerender) {
      this.rerender = _ref4 => {
        let {
          current: store
        } = _ref4;
        if (store && store.pageNumber > 0) {
          clearTimeout(this.rerenderTimeout);
          this.rerenderTimeout = setTimeout(() => this.setContent(store.pageNumber, store.content), 1);
        }
      };
      _props.rerender.current = this.rerender;
    }
  }
  componentDidMount() {
    const {
      set_content_handler,
      reset_content_handler,
      reset_pagination_handler,
      end_infinity_handler
    } = this.props;
    if (typeof set_content_handler === 'function') {
      set_content_handler(this.setContent);
    }
    if (typeof reset_content_handler === 'function') {
      reset_content_handler(this.resetContent);
    }
    if (typeof reset_pagination_handler === 'function') {
      reset_pagination_handler(this.resetInfinity);
    }
    if (typeof end_infinity_handler === 'function') {
      end_infinity_handler(this.endInfinity);
    }
    if (this.props.store && this.props.store.current) {
      const store = this.props.store.current;
      this.setContent(store.pageNumber, store.content);
    }
    this._isMounted = true;
    this.updatePageContent(this.state.startupPage || this.state.currentPage);
  }
  componentWillUnmount() {
    clearTimeout(this.rerenderTimeout);
    clearTimeout(this.resetContentTimeout);
    clearTimeout(this.resetInfinityTimeout);
    clearTimeout(this.callOnPageUpdateTimeout);
    this._isMounted = false;
  }
  componentDidUpdate(_ref5) {
    let {
      current_page: current,
      internalContent: content
    } = _ref5;
    const {
      internalContent,
      current_page
    } = this.props;
    const currentPage = parseFloat(current_page);
    if (current_page !== current) {
      this.setState({
        currentPage
      });
      this.updatePageContent(currentPage);
    } else if (internalContent !== content) {
      this.updatePageContent();
    }
  }
  render() {
    const {
      children
    } = this.props;
    if (this.props.useMarkerOnly) {
      clearTimeout(this.callOnPageUpdateTimeout);
      this.callOnPageUpdateTimeout = setTimeout(this.callOnPageUpdate, 1);
    }
    return _react.default.createElement(_PaginationContext.default.Provider, {
      value: _objectSpread(_objectSpread({}, this.context), {}, {
        pagination: _objectSpread(_objectSpread({
          updatePageContent: this.updatePageContent,
          setContent: this.setContent,
          resetContent: this.resetContent,
          resetInfinity: this.resetInfinity,
          endInfinity: this.endInfinity,
          setItems: this.setItems,
          prefillItems: this.prefillItems,
          setState: this.setStateHandler,
          onPageUpdate: this.onPageUpdate
        }, this.props), this.state)
      })
    }, children);
  }
}
exports.default = PaginationProvider;
_defineProperty(PaginationProvider, "contextType", _Context.default);
_defineProperty(PaginationProvider, "defaultProps", {
  startup_page: null,
  current_page: null,
  page_count: null,
  set_content_handler: null,
  reset_content_handler: null,
  reset_pagination_handler: null,
  end_infinity_handler: null,
  rerender: null,
  store: null,
  useMarkerOnly: null,
  internalContent: null,
  children: null
});
process.env.NODE_ENV !== "production" ? PaginationProvider.propTypes = {
  startup_page: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
  current_page: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
  page_count: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]),
  set_content_handler: _propTypes.default.func,
  reset_content_handler: _propTypes.default.func,
  reset_pagination_handler: _propTypes.default.func,
  end_infinity_handler: _propTypes.default.func,
  rerender: _propTypes.default.shape({
    current: _propTypes.default.func
  }),
  store: _propTypes.default.shape({
    current: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.func])
  }),
  useMarkerOnly: _propTypes.default.bool,
  internalContent: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.func, _propTypes.default.node, _propTypes.default.object, _propTypes.default.array]),
  children: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.func, _propTypes.default.node, _propTypes.default.object, _propTypes.default.array])
} : void 0;
//# sourceMappingURL=PaginationProvider.js.map