@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;
var _parse = _interopRequireDefault(require("core-js-pure/stable/json/parse.js"));
var _push = _interopRequireDefault(require("core-js-pure/stable/instance/push.js"));
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _Context = _interopRequireDefault(require("../../shared/Context.js"));
var _componentHelper = require("../../shared/component-helper.js");
var _PaginationHelpers = require("./PaginationHelpers.js");
var _PaginationContext = _interopRequireDefault(require("./PaginationContext.js"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: 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 = (0, _parse.default)(props.items);
    } else if (Array.isArray(props.items)) {
      state.items = props.items;
    }
    return state;
  }
  constructor(_props) {
    super(_props);
    _defineProperty(this, "setContent", (newContent, content = null, position = 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(({
          pageNumber: p
        }) => p === pageNumber);
        let items = null;
        if (!itemToPrepare) {
          items = this.prefillItems(pageNumber, {
            position
          });
          itemToPrepare = items.find(({
            pageNumber: p
          }) => 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", (pageNumber = 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', {
          pageNumber,
          ...this
        });
      });
    });
    _defineProperty(this, "setItems", (items, cb) => {
      this.setState({
        items
      }, cb);
    });
    _defineProperty(this, "prefillItems", (pageNumber, props = {}, items = this.state.items) => {
      const position = props.position || (pageNumber < this.state.currentPage ? 'before' : 'after');
      if (isNaN(pageNumber)) {
        pageNumber = 1;
      }
      const exists = items.findIndex(({
        pageNumber: p
      }) => p === pageNumber) > -1;
      if (exists) {
        return items;
      }
      const obj = {
        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({
        ...state
      }, cb);
    });
    _defineProperty(this, "callOnPageUpdate", () => {
      if (Array.isArray(this._updateStack)) {
        this._updateStack.forEach(cb => {
          if (typeof cb === 'function') {
            cb();
          }
        });
        this._updateStack = [];
      }
    });
    _defineProperty(this, "updatePageContent", (pageNumber = this.state.currentPage) => {
      let potentialElement = this.props.internalContent;
      if (typeof this.props.internalContent === 'function') {
        potentialElement = this.props.internalContent({
          ...this,
          pageNumber,
          page: pageNumber
        });
      }
      if (potentialElement && _react.default.isValidElement(potentialElement)) {
        this.setContent([pageNumber, potentialElement]);
      }
    });
    _defineProperty(this, "onPageUpdate", fn => {
      var _context;
      this._updateStack = this._updateStack || [];
      (0, _push.default)(_context = this._updateStack).call(_context, fn);
    });
    this.state = {
      items: [],
      isLoading: false
    };
    if (_props.rerender) {
      this.rerender = ({
        current: store
      }) => {
        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({
    current_page: current,
    internalContent: content
  }) {
    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: {
        ...this.context,
        pagination: {
          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