[d565449] | 1 | "use strict";
|
---|
| 2 | Object.defineProperty(exports, "__esModule", { value: true });
|
---|
| 3 | exports.useStateWithHistory = void 0;
|
---|
| 4 | var react_1 = require("react");
|
---|
| 5 | var useFirstMountState_1 = require("./useFirstMountState");
|
---|
| 6 | var hookState_1 = require("./misc/hookState");
|
---|
| 7 | function useStateWithHistory(initialState, capacity, initialHistory) {
|
---|
| 8 | if (capacity === void 0) { capacity = 10; }
|
---|
| 9 | if (capacity < 1) {
|
---|
| 10 | throw new Error("Capacity has to be greater than 1, got '" + capacity + "'");
|
---|
| 11 | }
|
---|
| 12 | var isFirstMount = useFirstMountState_1.useFirstMountState();
|
---|
| 13 | var _a = react_1.useState(initialState), state = _a[0], innerSetState = _a[1];
|
---|
| 14 | var history = react_1.useRef((initialHistory !== null && initialHistory !== void 0 ? initialHistory : []));
|
---|
| 15 | var historyPosition = react_1.useRef(0);
|
---|
| 16 | // do the states manipulation only on first mount, no sense to load re-renders with useless calculations
|
---|
| 17 | if (isFirstMount) {
|
---|
| 18 | if (history.current.length) {
|
---|
| 19 | // if last element of history !== initial - push initial to history
|
---|
| 20 | if (history.current[history.current.length - 1] !== initialState) {
|
---|
| 21 | history.current.push(initialState);
|
---|
| 22 | }
|
---|
| 23 | // if initial history bigger that capacity - crop the first elements out
|
---|
| 24 | if (history.current.length > capacity) {
|
---|
| 25 | history.current = history.current.slice(history.current.length - capacity);
|
---|
| 26 | }
|
---|
| 27 | }
|
---|
| 28 | else {
|
---|
| 29 | // initiate the history with initial state
|
---|
| 30 | history.current.push(initialState);
|
---|
| 31 | }
|
---|
| 32 | historyPosition.current = history.current.length && history.current.length - 1;
|
---|
| 33 | }
|
---|
| 34 | var setState = react_1.useCallback(function (newState) {
|
---|
| 35 | innerSetState(function (currentState) {
|
---|
| 36 | newState = hookState_1.resolveHookState(newState, currentState);
|
---|
| 37 | // is state has changed
|
---|
| 38 | if (newState !== currentState) {
|
---|
| 39 | // if current position is not the last - pop element to the right
|
---|
| 40 | if (historyPosition.current < history.current.length - 1) {
|
---|
| 41 | history.current = history.current.slice(0, historyPosition.current + 1);
|
---|
| 42 | }
|
---|
| 43 | historyPosition.current = history.current.push(newState) - 1;
|
---|
| 44 | // if capacity is reached - shift first elements
|
---|
| 45 | if (history.current.length > capacity) {
|
---|
| 46 | history.current = history.current.slice(history.current.length - capacity);
|
---|
| 47 | }
|
---|
| 48 | }
|
---|
| 49 | return newState;
|
---|
| 50 | });
|
---|
| 51 | }, [state, capacity]);
|
---|
| 52 | var historyState = react_1.useMemo(function () { return ({
|
---|
| 53 | history: history.current,
|
---|
| 54 | position: historyPosition.current,
|
---|
| 55 | capacity: capacity,
|
---|
| 56 | back: function (amount) {
|
---|
| 57 | if (amount === void 0) { amount = 1; }
|
---|
| 58 | // don't do anything if we already at the left border
|
---|
| 59 | if (!historyPosition.current) {
|
---|
| 60 | return;
|
---|
| 61 | }
|
---|
| 62 | innerSetState(function () {
|
---|
| 63 | historyPosition.current -= Math.min(amount, historyPosition.current);
|
---|
| 64 | return history.current[historyPosition.current];
|
---|
| 65 | });
|
---|
| 66 | },
|
---|
| 67 | forward: function (amount) {
|
---|
| 68 | if (amount === void 0) { amount = 1; }
|
---|
| 69 | // don't do anything if we already at the right border
|
---|
| 70 | if (historyPosition.current === history.current.length - 1) {
|
---|
| 71 | return;
|
---|
| 72 | }
|
---|
| 73 | innerSetState(function () {
|
---|
| 74 | historyPosition.current = Math.min(historyPosition.current + amount, history.current.length - 1);
|
---|
| 75 | return history.current[historyPosition.current];
|
---|
| 76 | });
|
---|
| 77 | },
|
---|
| 78 | go: function (position) {
|
---|
| 79 | if (position === historyPosition.current) {
|
---|
| 80 | return;
|
---|
| 81 | }
|
---|
| 82 | innerSetState(function () {
|
---|
| 83 | historyPosition.current =
|
---|
| 84 | position < 0
|
---|
| 85 | ? Math.max(history.current.length + position, 0)
|
---|
| 86 | : Math.min(history.current.length - 1, position);
|
---|
| 87 | return history.current[historyPosition.current];
|
---|
| 88 | });
|
---|
| 89 | },
|
---|
| 90 | }); }, [state]);
|
---|
| 91 | return [state, setState, historyState];
|
---|
| 92 | }
|
---|
| 93 | exports.useStateWithHistory = useStateWithHistory;
|
---|