@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
93 lines (92 loc) • 3.55 kB
JavaScript
;
"use client";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = useNextRouter;
var _push = _interopRequireDefault(require("core-js-pure/stable/instance/push.js"));
var _react = require("react");
var _useStep = _interopRequireDefault(require("./useStep.js"));
var _useIsomorphicLayoutEffect = require("../../../../shared/helpers/useIsomorphicLayoutEffect.js");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const routerStepChanges = new Map();
function useNextRouter(id = null, {
useRouter,
usePathname,
useSearchParams
}) {
const name = id ? `${id}-step` : 'step';
const {
setFormError
} = (0, _useStep.default)(id);
const router = useRouter();
const pathname = usePathname();
const searchParams = useSearchParams();
const routerRef = (0, _react.useRef)(router);
routerRef.current = router;
const pathnameRef = (0, _react.useRef)(pathname);
pathnameRef.current = pathname;
const searchParamsRef = (0, _react.useRef)(searchParams);
searchParamsRef.current = searchParams;
const routerStepChangeRef = (0, _react.useRef)(undefined);
const hasRouterStepRef = (0, _react.useRef)(false);
const onStepChange = (0, _react.useCallback)(index => {
try {
var _context;
const params = new URLSearchParams(searchParamsRef.current.toString());
const currentParams = new URLSearchParams(typeof window !== 'undefined' ? window.location.search : params.toString());
if (parseFloat(currentParams.get(name)) === index || routerStepChangeRef.current === index || routerStepChanges.get(name) === index) {
return;
}
routerStepChangeRef.current = index;
routerStepChanges.set(name, index);
hasRouterStepRef.current = true;
params.set(name, String(index));
(0, _push.default)(_context = routerRef.current).call(_context, `${pathnameRef.current}?${params.toString()}`);
} catch (error) {
routerStepChanges.delete(name);
setFormError(error);
}
}, [name, setFormError]);
const {
setActiveIndex,
onStepChangeEventsRef
} = (0, _useStep.default)(id, {
onStepChange
});
(0, _useIsomorphicLayoutEffect.useIsomorphicLayoutEffect)(() => {
return () => {
if (routerStepChanges.get(name) === routerStepChangeRef.current) {
routerStepChanges.delete(name);
}
};
}, [name]);
(0, _useIsomorphicLayoutEffect.useIsomorphicLayoutEffect)(() => {
return () => {
onStepChangeEventsRef?.current?.delete(onStepChange);
};
}, [onStepChange, onStepChangeEventsRef]);
const getIndex = (0, _react.useCallback)(() => parseFloat(searchParams.get(name)), [name, searchParams]);
(0, _useIsomorphicLayoutEffect.useIsomorphicLayoutEffect)(() => {
const routerIndex = getIndex();
const hasRouterIndex = !isNaN(routerIndex);
if (hasRouterIndex) {
hasRouterStepRef.current = true;
}
if (hasRouterIndex || hasRouterStepRef.current) {
const activeIndex = hasRouterIndex ? routerIndex : 0;
const skipStepChangeCall = hasRouterIndex && activeIndex === routerStepChangeRef.current;
routerStepChangeRef.current = undefined;
routerStepChanges.delete(name);
setActiveIndex?.(activeIndex, {
skipStepChangeCall,
skipStepChangeCallFromHook: true,
skipStepChangeCallBeforeMounted: true
});
}
}, [getIndex, id, name, searchParams, setActiveIndex, setFormError]);
return {
getIndex
};
}
//# sourceMappingURL=useNextRouter.js.map