UNPKG

@dnb/eufemia

Version:

DNB Eufemia Design System UI Library

156 lines (155 loc) 4.17 kB
"use client"; import React, { useCallback, useContext, useEffect, useReducer, useRef } from 'react'; import ReactDOM from 'react-dom'; import DataContext, { defaultContextState } from "../../DataContext/Context.js"; import WizardContext from "../Context/WizardContext.js"; import useEventListener from "../../DataContext/Provider/useEventListener.js"; export function PrerenderFieldPropsOfOtherSteps({ prerenderFieldPropsRef, stepsRef }) { const { activeIndex } = useContext(WizardContext) || {}; const { renderContent, hasRenderedRef } = usePrerenderState(); usePreventSubmit(); return React.createElement(PrerenderPortal, null, React.createElement(PrerenderFieldPropsProvider, { showAllErrorsNow: hasRenderedRef.current === null }, React.createElement("iframe", { title: "Wizard Prerender", hidden: true }, renderContent && Object.values(prerenderFieldPropsRef.current).map(({ index, fn: Fn }) => { if (activeIndex === index) { return null; } const step = stepsRef.current.get(index); if (step?.keepInDOM === true) { return null; } return React.createElement(Fn, { key: index }); })))); } function usePrerenderState() { const [, forceUpdate] = useReducer(() => ({}), {}); let renderContent = true; const hasRenderedRef = useRef(false); const handleBeforeSubmit = useCallback(() => { hasRenderedRef.current = null; forceUpdate(); }, []); useEventListener('onBeforeSubmit', handleBeforeSubmit); const state = hasRenderedRef.current; useEffect(() => { if (hasRenderedRef.current === null) { hasRenderedRef.current = true; forceUpdate(); } }, [state]); if (hasRenderedRef.current) { renderContent = false; } if (hasRenderedRef.current !== null) { hasRenderedRef.current = true; } return { renderContent, hasRenderedRef }; } function useEffectPromise() { const promiseRef = useRef(); const resolveRef = useRef(); const effectPromise = useCallback(() => { promiseRef.current = new Promise(resolve => { resolveRef.current = resolve; }); return promiseRef.current; }, []); useEffect(() => { if (resolveRef.current) { resolveRef.current?.(); resolveRef.current = null; } }); return effectPromise; } function usePreventSubmit() { const { setFieldEventListener } = useContext(DataContext); const { hasInvalidStepsState } = useContext(WizardContext) || {}; const effectPromise = useEffectPromise(); const hasUnknownSteps = hasInvalidStepsState(undefined, ['unknown']); const handleSubmit = useCallback(async ({ preventSubmit }) => { if (hasUnknownSteps) { await effectPromise(); } if (hasInvalidStepsState(undefined, ['error'])) { return preventSubmit(); } }, [hasUnknownSteps, hasInvalidStepsState, effectPromise]); if (hasUnknownSteps) { setFieldEventListener?.(undefined, 'onSubmit', handleSubmit); } useEffect(() => { return () => { setFieldEventListener?.(undefined, 'onSubmit', handleSubmit, { remove: true }); }; }, [handleSubmit, setFieldEventListener]); } function PrerenderPortal({ children }) { if (typeof document !== 'undefined') { return ReactDOM.createPortal(children, document.body); } } function PrerenderFieldPropsProvider({ showAllErrorsNow, children }) { const dataContext = useContext(DataContext); const { data, internalDataRef, setFieldInternals, updateDataValue, showAllErrors } = dataContext || {}; if (showAllErrorsNow) { return React.createElement(DataContext.Provider, { value: { ...dataContext, hasContext: true, prerenderFieldProps: true, showAllErrors: showAllErrorsNow ? true : showAllErrors } }, children); } return React.createElement(DataContext.Provider, { value: { ...defaultContextState, hasContext: true, prerenderFieldProps: true, data, internalDataRef, setFieldInternals, updateDataValue } }, children); } //# sourceMappingURL=PrerenderFieldPropsOfOtherSteps.js.map