@tamagui/portal 1.7.10 → 1.8.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/GorhomPortal.js +14 -11
- package/dist/cjs/GorhomPortal.js.map +2 -2
- package/dist/esm/GorhomPortal.js +14 -11
- package/dist/esm/GorhomPortal.js.map +2 -2
- package/dist/esm/GorhomPortal.mjs +14 -11
- package/dist/esm/GorhomPortal.mjs.map +2 -2
- package/package.json +5 -5
- package/src/GorhomPortal.tsx +25 -19
- package/types/GorhomPortal.d.ts +7 -1
- package/types/GorhomPortal.d.ts.map +1 -1
package/dist/cjs/GorhomPortal.js
CHANGED
|
@@ -182,8 +182,9 @@ const PortalProviderComponent = ({
|
|
|
182
182
|
};
|
|
183
183
|
const PortalProvider = (0, import_react.memo)(PortalProviderComponent);
|
|
184
184
|
PortalProvider.displayName = "PortalProvider";
|
|
185
|
+
const defaultRenderer = (children) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children });
|
|
185
186
|
const PortalHostComponent = (props) => {
|
|
186
|
-
const { name, forwardProps } = props;
|
|
187
|
+
const { name, forwardProps, render = defaultRenderer } = props;
|
|
187
188
|
const isServer = !(0, import_core.useDidFinishSSR)();
|
|
188
189
|
const state = usePortalState(name);
|
|
189
190
|
const { registerHost: registerHost2, deregisterHost: deregisterHost2 } = usePortal(props.name);
|
|
@@ -196,17 +197,19 @@ const PortalHostComponent = (props) => {
|
|
|
196
197
|
};
|
|
197
198
|
}, [isServer]);
|
|
198
199
|
if (forwardProps) {
|
|
199
|
-
return
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
return import_react.default.
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
200
|
+
return render(
|
|
201
|
+
state.map((item) => {
|
|
202
|
+
let next = item.node;
|
|
203
|
+
if (forwardProps) {
|
|
204
|
+
return import_react.default.Children.map(next, (child) => {
|
|
205
|
+
return import_react.default.isValidElement(child) ? import_react.default.cloneElement(child, { key: child.key, ...forwardProps }) : child;
|
|
206
|
+
});
|
|
207
|
+
}
|
|
208
|
+
return next;
|
|
209
|
+
})
|
|
210
|
+
);
|
|
208
211
|
}
|
|
209
|
-
return
|
|
212
|
+
return render(state.map((item) => item.node));
|
|
210
213
|
};
|
|
211
214
|
const PortalHost = (0, import_react.memo)(PortalHostComponent);
|
|
212
215
|
PortalHost.displayName = "PortalHost";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/GorhomPortal.tsx"],
|
|
4
|
-
"sourcesContent": ["// from https://github.com/gorhom/react-native-portal\n// MIT License Copyright (c) 2020 Mo Gorhom\n// fixing SSR issue\n\nimport {\n spacedChildren,\n useDidFinishSSR,\n useEvent,\n useIsomorphicLayoutEffect,\n} from '@tamagui/core'\nimport React, {\n ReactNode,\n cloneElement,\n createContext,\n isValidElement,\n memo,\n startTransition,\n useCallback,\n useContext,\n useEffect,\n useId,\n useMemo,\n useReducer,\n useRef,\n} from 'react'\n\ninterface PortalType {\n name: string\n node: ReactNode\n}\n\nenum ACTIONS {\n REGISTER_HOST,\n DEREGISTER_HOST,\n ADD_UPDATE_PORTAL,\n REMOVE_PORTAL,\n}\n\nconst INITIAL_STATE = {}\n\nexport { ACTIONS, INITIAL_STATE }\n\nexport interface AddUpdatePortalAction {\n type: ACTIONS\n hostName: string\n portalName: string\n node: ReactNode\n}\n\nexport interface RemovePortalAction {\n type: ACTIONS\n hostName: string\n portalName: string\n}\n\nexport interface RegisterHostAction {\n type: ACTIONS\n hostName: string\n}\n\nexport interface UnregisterHostAction {\n type: ACTIONS\n hostName: string\n}\n\nexport type ActionTypes =\n | AddUpdatePortalAction\n | RemovePortalAction\n | RegisterHostAction\n | UnregisterHostAction\n\nconst registerHost = (state: Record<string, Array<PortalType>>, hostName: string) => {\n if (!(hostName in state)) {\n state[hostName] = []\n }\n return state\n}\n\nconst deregisterHost = (state: Record<string, Array<PortalType>>, hostName: string) => {\n delete state[hostName]\n return state\n}\n\nconst addUpdatePortal = (\n state: Record<string, Array<PortalType>>,\n hostName: string,\n portalName: string,\n node: any\n) => {\n if (!(hostName in state)) {\n state = registerHost(state, hostName)\n }\n\n /**\n * updated portal, if it was already added.\n */\n const index = state[hostName].findIndex((item) => item.name === portalName)\n if (index !== -1) {\n state[hostName][index].node = node\n } else {\n state[hostName].push({\n name: portalName,\n node,\n })\n }\n return state\n}\n\nconst removePortal = (\n state: Record<string, Array<PortalType>>,\n hostName: string,\n portalName: string\n) => {\n if (!(hostName in state)) {\n // eslint-disable-next-line no-console\n console.log(\n `Failed to remove portal '${portalName}', '${hostName}' was not registered!`\n )\n return state\n }\n\n const index = state[hostName].findIndex((item) => item.name === portalName)\n if (index !== -1) state[hostName].splice(index, 1)\n return state\n}\n\nconst reducer = (state: Record<string, Array<PortalType>>, action: ActionTypes) => {\n const { type } = action\n switch (type) {\n case ACTIONS.REGISTER_HOST:\n return registerHost({ ...state }, action.hostName)\n case ACTIONS.DEREGISTER_HOST:\n return deregisterHost({ ...state }, action.hostName)\n case ACTIONS.ADD_UPDATE_PORTAL:\n return addUpdatePortal(\n { ...state },\n action.hostName,\n (action as AddUpdatePortalAction).portalName,\n (action as AddUpdatePortalAction).node\n )\n case ACTIONS.REMOVE_PORTAL:\n return removePortal(\n { ...state },\n action.hostName,\n (action as RemovePortalAction).portalName\n )\n default:\n return state\n }\n}\n\nconst PortalStateContext = createContext<Record<string, Array<PortalType>> | null>(null)\nconst PortalDispatchContext = createContext<React.Dispatch<ActionTypes> | null>(null)\n\nconst usePortalState = (hostName: string) => {\n const state = useContext(PortalStateContext)\n\n if (state === null) {\n throw new Error(\n \"'PortalStateContext' cannot be null, please add 'PortalProvider' to the root component.\"\n )\n }\n\n return state[hostName] || []\n}\n\nexport const usePortal = (hostName = 'root') => {\n const dispatch = useContext(PortalDispatchContext)\n\n if (dispatch === null) {\n throw new Error(\n \"'PortalDispatchContext' cannot be null, please add 'PortalProvider' to the root component.\"\n )\n }\n\n //#region methods\n const registerHost = useCallback(() => {\n dispatch({\n type: ACTIONS.REGISTER_HOST,\n hostName: hostName,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const deregisterHost = useCallback(() => {\n dispatch({\n type: ACTIONS.DEREGISTER_HOST,\n hostName: hostName,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const addUpdatePortal = useCallback((name: string, node: ReactNode) => {\n dispatch({\n type: ACTIONS.ADD_UPDATE_PORTAL,\n hostName,\n portalName: name,\n node,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const removePortal = useCallback((name: string) => {\n dispatch({\n type: ACTIONS.REMOVE_PORTAL,\n hostName,\n portalName: name,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n //#endregion\n\n return {\n registerHost,\n deregisterHost,\n addPortal: addUpdatePortal,\n updatePortal: addUpdatePortal,\n removePortal,\n }\n}\n\nexport interface PortalProviderProps {\n /**\n * Defines whether to add a default root host or not.\n *\n * @default true\n * @type boolean\n */\n shouldAddRootHost?: boolean\n\n /**\n * Defines the root portal host name.\n *\n * @default \"root\"\n * @type string\n */\n rootHostName?: string\n\n children: ReactNode | ReactNode[]\n}\n\nconst PortalProviderComponent = ({\n rootHostName = 'root',\n shouldAddRootHost = true,\n children,\n}: PortalProviderProps) => {\n const [state, dispatch] = useReducer(reducer, INITIAL_STATE)\n const transitionDispatch = useMemo(() => {\n const next = (value: any) => {\n startTransition(() => {\n dispatch(value)\n })\n }\n return next as typeof dispatch\n }, [dispatch])\n\n return (\n <PortalDispatchContext.Provider value={transitionDispatch}>\n <PortalStateContext.Provider value={state}>\n {children}\n {shouldAddRootHost && <PortalHost name={rootHostName} />}\n </PortalStateContext.Provider>\n </PortalDispatchContext.Provider>\n )\n}\n\nexport const PortalProvider = memo(PortalProviderComponent)\nPortalProvider.displayName = 'PortalProvider'\n\nexport interface PortalHostProps {\n /**\n * Host's key or name to be used as an identifier.\n * @type string\n */\n name: string\n\n forwardProps?: Record<string, any>\n}\n\nconst PortalHostComponent = (props: PortalHostProps) => {\n const { name, forwardProps } = props\n const isServer = !useDidFinishSSR()\n const state = usePortalState(name)\n const { registerHost, deregisterHost } = usePortal(props.name)\n\n //#region effects\n useEffect(() => {\n if (isServer) return\n registerHost()\n return () => {\n deregisterHost()\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isServer])\n //#endregion\n\n if (forwardProps) {\n return (\n <>\n {state.map((item) => {\n let next = item.node\n\n if (forwardProps) {\n return React.Children.map(next, (child) => {\n return React.isValidElement(child)\n ? React.cloneElement(child, { key: child.key, ...forwardProps })\n : child\n })\n }\n\n return next\n })}\n </>\n )\n }\n\n //#region render\n return <>{state.map((item) => item.node)}</>\n //#endregion\n}\n\nexport const PortalHost = memo(PortalHostComponent)\nPortalHost.displayName = 'PortalHost'\n\nexport interface PortalItemProps {\n /**\n * Portal's key or name to be used as an identifier.\n * @type string\n * @default generated unique key.\n */\n name?: string\n /**\n * Host's name to teleport the portal content to.\n * @type string\n * @default 'root'\n */\n hostName?: string\n /**\n * Override internal mounting functionality, this is useful\n * if you want to trigger any action before mounting the portal content.\n * @type (mount?: () => void) => void\n * @default undefined\n */\n handleOnMount?: (mount: () => void) => void\n /**\n * Override internal un-mounting functionality, this is useful\n * if you want to trigger any action before un-mounting the portal content.\n * @type (unmount?: () => void) => void\n * @default undefined\n */\n handleOnUnmount?: (unmount: () => void) => void\n /**\n * Override internal updating functionality, this is useful\n * if you want to trigger any action before updating the portal content.\n * @type (update?: () => void) => void\n * @default undefined\n */\n handleOnUpdate?: (update: () => void) => void\n /**\n * Portal's content.\n * @type ReactNode\n * @default undefined\n */\n children?: ReactNode | ReactNode[]\n}\n\nconst PortalComponent = (props: PortalItemProps) => {\n const {\n name: _providedName,\n hostName,\n handleOnMount: _providedHandleOnMount,\n handleOnUnmount: _providedHandleOnUnmount,\n handleOnUpdate: _providedHandleOnUpdate,\n children,\n } = props\n const { addPortal: addUpdatePortal, removePortal } = usePortal(hostName)\n const id = useId()\n const name = _providedName || id\n\n const handleOnMount = useEvent(() => {\n if (_providedHandleOnMount) {\n _providedHandleOnMount(() => addUpdatePortal(name, children))\n } else {\n addUpdatePortal(name, children)\n }\n })\n\n const handleOnUnmount = useEvent(() => {\n if (_providedHandleOnUnmount) {\n _providedHandleOnUnmount(() => removePortal(name))\n } else {\n removePortal(name)\n }\n })\n\n const handleOnUpdate = useEvent(() => {\n if (_providedHandleOnUpdate) {\n _providedHandleOnUpdate(() => addUpdatePortal(name, children))\n } else {\n addUpdatePortal(name, children)\n }\n })\n\n useIsomorphicLayoutEffect(() => {\n handleOnMount()\n return () => {\n handleOnUnmount()\n }\n }, [])\n\n useEffect(() => {\n handleOnUpdate()\n }, [children])\n\n return null\n}\n\nexport const PortalItem = memo(PortalComponent)\nPortalItem.displayName = 'Portal'\n"],
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["// from https://github.com/gorhom/react-native-portal\n// MIT License Copyright (c) 2020 Mo Gorhom\n// fixing SSR issue\nimport { AnimatePresence } from '@tamagui/animate-presence'\nimport {\n spacedChildren,\n useDidFinishSSR,\n useEvent,\n useIsomorphicLayoutEffect,\n} from '@tamagui/core'\nimport React, {\n ReactNode,\n cloneElement,\n createContext,\n isValidElement,\n memo,\n startTransition,\n useCallback,\n useContext,\n useEffect,\n useId,\n useMemo,\n useReducer,\n useRef,\n} from 'react'\n\ninterface PortalType {\n name: string\n node: ReactNode\n}\n\nenum ACTIONS {\n REGISTER_HOST,\n DEREGISTER_HOST,\n ADD_UPDATE_PORTAL,\n REMOVE_PORTAL,\n}\n\nconst INITIAL_STATE = {}\n\nexport { ACTIONS, INITIAL_STATE }\n\nexport interface AddUpdatePortalAction {\n type: ACTIONS\n hostName: string\n portalName: string\n node: ReactNode\n}\n\nexport interface RemovePortalAction {\n type: ACTIONS\n hostName: string\n portalName: string\n}\n\nexport interface RegisterHostAction {\n type: ACTIONS\n hostName: string\n}\n\nexport interface UnregisterHostAction {\n type: ACTIONS\n hostName: string\n}\n\nexport type ActionTypes =\n | AddUpdatePortalAction\n | RemovePortalAction\n | RegisterHostAction\n | UnregisterHostAction\n\nconst registerHost = (state: Record<string, Array<PortalType>>, hostName: string) => {\n if (!(hostName in state)) {\n state[hostName] = []\n }\n return state\n}\n\nconst deregisterHost = (state: Record<string, Array<PortalType>>, hostName: string) => {\n delete state[hostName]\n return state\n}\n\nconst addUpdatePortal = (\n state: Record<string, Array<PortalType>>,\n hostName: string,\n portalName: string,\n node: any\n) => {\n if (!(hostName in state)) {\n state = registerHost(state, hostName)\n }\n\n /**\n * updated portal, if it was already added.\n */\n const index = state[hostName].findIndex((item) => item.name === portalName)\n if (index !== -1) {\n state[hostName][index].node = node\n } else {\n state[hostName].push({\n name: portalName,\n node,\n })\n }\n return state\n}\n\nconst removePortal = (\n state: Record<string, Array<PortalType>>,\n hostName: string,\n portalName: string\n) => {\n if (!(hostName in state)) {\n // eslint-disable-next-line no-console\n console.log(\n `Failed to remove portal '${portalName}', '${hostName}' was not registered!`\n )\n return state\n }\n\n const index = state[hostName].findIndex((item) => item.name === portalName)\n if (index !== -1) state[hostName].splice(index, 1)\n return state\n}\n\nconst reducer = (state: Record<string, Array<PortalType>>, action: ActionTypes) => {\n const { type } = action\n switch (type) {\n case ACTIONS.REGISTER_HOST:\n return registerHost({ ...state }, action.hostName)\n case ACTIONS.DEREGISTER_HOST:\n return deregisterHost({ ...state }, action.hostName)\n case ACTIONS.ADD_UPDATE_PORTAL:\n return addUpdatePortal(\n { ...state },\n action.hostName,\n (action as AddUpdatePortalAction).portalName,\n (action as AddUpdatePortalAction).node\n )\n case ACTIONS.REMOVE_PORTAL:\n return removePortal(\n { ...state },\n action.hostName,\n (action as RemovePortalAction).portalName\n )\n default:\n return state\n }\n}\n\nconst PortalStateContext = createContext<Record<string, Array<PortalType>> | null>(null)\nconst PortalDispatchContext = createContext<React.Dispatch<ActionTypes> | null>(null)\n\nconst usePortalState = (hostName: string) => {\n const state = useContext(PortalStateContext)\n\n if (state === null) {\n throw new Error(\n \"'PortalStateContext' cannot be null, please add 'PortalProvider' to the root component.\"\n )\n }\n\n return state[hostName] || []\n}\n\nexport const usePortal = (hostName = 'root') => {\n const dispatch = useContext(PortalDispatchContext)\n\n if (dispatch === null) {\n throw new Error(\n \"'PortalDispatchContext' cannot be null, please add 'PortalProvider' to the root component.\"\n )\n }\n\n //#region methods\n const registerHost = useCallback(() => {\n dispatch({\n type: ACTIONS.REGISTER_HOST,\n hostName: hostName,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const deregisterHost = useCallback(() => {\n dispatch({\n type: ACTIONS.DEREGISTER_HOST,\n hostName: hostName,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const addUpdatePortal = useCallback((name: string, node: ReactNode) => {\n dispatch({\n type: ACTIONS.ADD_UPDATE_PORTAL,\n hostName,\n portalName: name,\n node,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const removePortal = useCallback((name: string) => {\n dispatch({\n type: ACTIONS.REMOVE_PORTAL,\n hostName,\n portalName: name,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n //#endregion\n\n return {\n registerHost,\n deregisterHost,\n addPortal: addUpdatePortal,\n updatePortal: addUpdatePortal,\n removePortal,\n }\n}\n\nexport interface PortalProviderProps {\n /**\n * Defines whether to add a default root host or not.\n *\n * @default true\n * @type boolean\n */\n shouldAddRootHost?: boolean\n\n /**\n * Defines the root portal host name.\n *\n * @default \"root\"\n * @type string\n */\n rootHostName?: string\n\n children: ReactNode | ReactNode[]\n}\n\nconst PortalProviderComponent = ({\n rootHostName = 'root',\n shouldAddRootHost = true,\n children,\n}: PortalProviderProps) => {\n const [state, dispatch] = useReducer(reducer, INITIAL_STATE)\n const transitionDispatch = useMemo(() => {\n const next = (value: any) => {\n startTransition(() => {\n dispatch(value)\n })\n }\n return next as typeof dispatch\n }, [dispatch])\n\n return (\n <PortalDispatchContext.Provider value={transitionDispatch}>\n <PortalStateContext.Provider value={state}>\n {children}\n {shouldAddRootHost && <PortalHost name={rootHostName} />}\n </PortalStateContext.Provider>\n </PortalDispatchContext.Provider>\n )\n}\n\nexport const PortalProvider = memo(PortalProviderComponent)\nPortalProvider.displayName = 'PortalProvider'\n\nexport interface PortalHostProps {\n /**\n * Host's key or name to be used as an identifier.\n * @type string\n */\n name: string\n\n forwardProps?: Record<string, any>\n\n /**\n * Useful when trying to animate children with AnimatePresence.\n *\n * Not a part of gorhom/react-native-portal\n */\n render?: (children: React.ReactNode) => React.ReactElement\n}\nconst defaultRenderer: PortalHostProps['render'] = (children) => <>{children}</>\n\nconst PortalHostComponent = (props: PortalHostProps) => {\n const { name, forwardProps, render = defaultRenderer } = props\n const isServer = !useDidFinishSSR()\n const state = usePortalState(name)\n const { registerHost, deregisterHost } = usePortal(props.name)\n\n //#region effects\n useEffect(() => {\n if (isServer) return\n registerHost()\n return () => {\n deregisterHost()\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isServer])\n //#endregion\n\n if (forwardProps) {\n return render(\n state.map((item) => {\n let next = item.node\n\n if (forwardProps) {\n return React.Children.map(next, (child) => {\n return React.isValidElement(child)\n ? React.cloneElement(child, { key: child.key, ...forwardProps })\n : child\n })\n }\n\n return next\n })\n )\n }\n\n //#region render\n return render(state.map((item) => item.node))\n //#endregion\n}\n\nexport const PortalHost = memo(PortalHostComponent)\nPortalHost.displayName = 'PortalHost'\n\nexport interface PortalItemProps {\n /**\n * Portal's key or name to be used as an identifier.\n * @type string\n * @default generated unique key.\n */\n name?: string\n /**\n * Host's name to teleport the portal content to.\n * @type string\n * @default 'root'\n */\n hostName?: string\n /**\n * Override internal mounting functionality, this is useful\n * if you want to trigger any action before mounting the portal content.\n * @type (mount?: () => void) => void\n * @default undefined\n */\n handleOnMount?: (mount: () => void) => void\n /**\n * Override internal un-mounting functionality, this is useful\n * if you want to trigger any action before un-mounting the portal content.\n * @type (unmount?: () => void) => void\n * @default undefined\n */\n handleOnUnmount?: (unmount: () => void) => void\n /**\n * Override internal updating functionality, this is useful\n * if you want to trigger any action before updating the portal content.\n * @type (update?: () => void) => void\n * @default undefined\n */\n handleOnUpdate?: (update: () => void) => void\n /**\n * Portal's content.\n * @type ReactNode\n * @default undefined\n */\n children?: ReactNode | ReactNode[]\n}\n\nconst PortalComponent = (props: PortalItemProps) => {\n const {\n name: _providedName,\n hostName,\n handleOnMount: _providedHandleOnMount,\n handleOnUnmount: _providedHandleOnUnmount,\n handleOnUpdate: _providedHandleOnUpdate,\n children,\n } = props\n const { addPortal: addUpdatePortal, removePortal } = usePortal(hostName)\n const id = useId()\n const name = _providedName || id\n\n const handleOnMount = useEvent(() => {\n if (_providedHandleOnMount) {\n _providedHandleOnMount(() => addUpdatePortal(name, children))\n } else {\n addUpdatePortal(name, children)\n }\n })\n\n const handleOnUnmount = useEvent(() => {\n if (_providedHandleOnUnmount) {\n _providedHandleOnUnmount(() => removePortal(name))\n } else {\n removePortal(name)\n }\n })\n\n const handleOnUpdate = useEvent(() => {\n if (_providedHandleOnUpdate) {\n _providedHandleOnUpdate(() => addUpdatePortal(name, children))\n } else {\n addUpdatePortal(name, children)\n }\n })\n\n useIsomorphicLayoutEffect(() => {\n handleOnMount()\n return () => {\n handleOnUnmount()\n }\n }, [])\n\n useEffect(() => {\n handleOnUpdate()\n }, [children])\n\n return null\n}\n\nexport const PortalItem = memo(PortalComponent)\nPortalItem.displayName = 'Portal'\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAkQM;AA9PN,kBAKO;AACP,mBAcO;AAOP,IAAK,UAAL,kBAAKA,aAAL;AACE,EAAAA,kBAAA;AACA,EAAAA,kBAAA;AACA,EAAAA,kBAAA;AACA,EAAAA,kBAAA;AAJG,SAAAA;AAAA,GAAA;AAOL,MAAM,gBAAgB,CAAC;AAiCvB,MAAM,eAAe,CAAC,OAA0C,aAAqB;AACnF,MAAI,EAAE,YAAY,QAAQ;AACxB,UAAM,QAAQ,IAAI,CAAC;AAAA,EACrB;AACA,SAAO;AACT;AAEA,MAAM,iBAAiB,CAAC,OAA0C,aAAqB;AACrF,SAAO,MAAM,QAAQ;AACrB,SAAO;AACT;AAEA,MAAM,kBAAkB,CACtB,OACA,UACA,YACA,SACG;AACH,MAAI,EAAE,YAAY,QAAQ;AACxB,YAAQ,aAAa,OAAO,QAAQ;AAAA,EACtC;AAKA,QAAM,QAAQ,MAAM,QAAQ,EAAE,UAAU,CAAC,SAAS,KAAK,SAAS,UAAU;AAC1E,MAAI,UAAU,IAAI;AAChB,UAAM,QAAQ,EAAE,KAAK,EAAE,OAAO;AAAA,EAChC,OAAO;AACL,UAAM,QAAQ,EAAE,KAAK;AAAA,MACnB,MAAM;AAAA,MACN;AAAA,IACF,CAAC;AAAA,EACH;AACA,SAAO;AACT;AAEA,MAAM,eAAe,CACnB,OACA,UACA,eACG;AACH,MAAI,EAAE,YAAY,QAAQ;AAExB,YAAQ;AAAA,MACN,4BAA4B,iBAAiB;AAAA,IAC/C;AACA,WAAO;AAAA,EACT;AAEA,QAAM,QAAQ,MAAM,QAAQ,EAAE,UAAU,CAAC,SAAS,KAAK,SAAS,UAAU;AAC1E,MAAI,UAAU;AAAI,UAAM,QAAQ,EAAE,OAAO,OAAO,CAAC;AACjD,SAAO;AACT;AAEA,MAAM,UAAU,CAAC,OAA0C,WAAwB;AACjF,QAAM,EAAE,KAAK,IAAI;AACjB,UAAQ,MAAM;AAAA,IACZ,KAAK;AACH,aAAO,aAAa,EAAE,GAAG,MAAM,GAAG,OAAO,QAAQ;AAAA,IACnD,KAAK;AACH,aAAO,eAAe,EAAE,GAAG,MAAM,GAAG,OAAO,QAAQ;AAAA,IACrD,KAAK;AACH,aAAO;AAAA,QACL,EAAE,GAAG,MAAM;AAAA,QACX,OAAO;AAAA,QACN,OAAiC;AAAA,QACjC,OAAiC;AAAA,MACpC;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,EAAE,GAAG,MAAM;AAAA,QACX,OAAO;AAAA,QACN,OAA8B;AAAA,MACjC;AAAA,IACF;AACE,aAAO;AAAA,EACX;AACF;AAEA,MAAM,yBAAqB,4BAAwD,IAAI;AACvF,MAAM,4BAAwB,4BAAkD,IAAI;AAEpF,MAAM,iBAAiB,CAAC,aAAqB;AAC3C,QAAM,YAAQ,yBAAW,kBAAkB;AAE3C,MAAI,UAAU,MAAM;AAClB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AAEA,SAAO,MAAM,QAAQ,KAAK,CAAC;AAC7B;AAEO,MAAM,YAAY,CAAC,WAAW,WAAW;AAC9C,QAAM,eAAW,yBAAW,qBAAqB;AAEjD,MAAI,aAAa,MAAM;AACrB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EACF;AAGA,QAAMC,oBAAe,0BAAY,MAAM;AACrC,aAAS;AAAA,MACP,MAAM;AAAA,MACN;AAAA,IACF,CAAC;AAAA,EAEH,GAAG,CAAC,CAAC;AAEL,QAAMC,sBAAiB,0BAAY,MAAM;AACvC,aAAS;AAAA,MACP,MAAM;AAAA,MACN;AAAA,IACF,CAAC;AAAA,EAEH,GAAG,CAAC,CAAC;AAEL,QAAMC,uBAAkB,0BAAY,CAAC,MAAc,SAAoB;AACrE,aAAS;AAAA,MACP,MAAM;AAAA,MACN;AAAA,MACA,YAAY;AAAA,MACZ;AAAA,IACF,CAAC;AAAA,EAEH,GAAG,CAAC,CAAC;AAEL,QAAMC,oBAAe,0BAAY,CAAC,SAAiB;AACjD,aAAS;AAAA,MACP,MAAM;AAAA,MACN;AAAA,MACA,YAAY;AAAA,IACd,CAAC;AAAA,EAEH,GAAG,CAAC,CAAC;AAGL,SAAO;AAAA,IACL,cAAAH;AAAA,IACA,gBAAAC;AAAA,IACA,WAAWC;AAAA,IACX,cAAcA;AAAA,IACd,cAAAC;AAAA,EACF;AACF;AAsBA,MAAM,0BAA0B,CAAC;AAAA,EAC/B,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB;AACF,MAA2B;AACzB,QAAM,CAAC,OAAO,QAAQ,QAAI,yBAAW,SAAS,aAAa;AAC3D,QAAM,yBAAqB,sBAAQ,MAAM;AACvC,UAAM,OAAO,CAAC,UAAe;AAC3B,wCAAgB,MAAM;AACpB,iBAAS,KAAK;AAAA,MAChB,CAAC;AAAA,IACH;AACA,WAAO;AAAA,EACT,GAAG,CAAC,QAAQ,CAAC;AAEb,SACE,4CAAC,sBAAsB,UAAtB,EAA+B,OAAO,oBACrC,uDAAC,mBAAmB,UAAnB,EAA4B,OAAO,OACjC;AAAA;AAAA,IACA,qBAAqB,4CAAC,cAAW,MAAM,cAAc;AAAA,KACxD,GACF;AAEJ;AAEO,MAAM,qBAAiB,mBAAK,uBAAuB;AAC1D,eAAe,cAAc;AAkB7B,MAAM,kBAA6C,CAAC,aAAa,2EAAG,UAAS;AAE7E,MAAM,sBAAsB,CAAC,UAA2B;AACtD,QAAM,EAAE,MAAM,cAAc,SAAS,gBAAgB,IAAI;AACzD,QAAM,WAAW,KAAC,6BAAgB;AAClC,QAAM,QAAQ,eAAe,IAAI;AACjC,QAAM,EAAE,cAAAH,eAAc,gBAAAC,gBAAe,IAAI,UAAU,MAAM,IAAI;AAG7D,8BAAU,MAAM;AACd,QAAI;AAAU;AACd,IAAAD,cAAa;AACb,WAAO,MAAM;AACX,MAAAC,gBAAe;AAAA,IACjB;AAAA,EAEF,GAAG,CAAC,QAAQ,CAAC;AAGb,MAAI,cAAc;AAChB,WAAO;AAAA,MACL,MAAM,IAAI,CAAC,SAAS;AAClB,YAAI,OAAO,KAAK;AAEhB,YAAI,cAAc;AAChB,iBAAO,aAAAG,QAAM,SAAS,IAAI,MAAM,CAAC,UAAU;AACzC,mBAAO,aAAAA,QAAM,eAAe,KAAK,IAC7B,aAAAA,QAAM,aAAa,OAAO,EAAE,KAAK,MAAM,KAAK,GAAG,aAAa,CAAC,IAC7D;AAAA,UACN,CAAC;AAAA,QACH;AAEA,eAAO;AAAA,MACT,CAAC;AAAA,IACH;AAAA,EACF;AAGA,SAAO,OAAO,MAAM,IAAI,CAAC,SAAS,KAAK,IAAI,CAAC;AAE9C;AAEO,MAAM,iBAAa,mBAAK,mBAAmB;AAClD,WAAW,cAAc;AA4CzB,MAAM,kBAAkB,CAAC,UAA2B;AAClD,QAAM;AAAA,IACJ,MAAM;AAAA,IACN;AAAA,IACA,eAAe;AAAA,IACf,iBAAiB;AAAA,IACjB,gBAAgB;AAAA,IAChB;AAAA,EACF,IAAI;AACJ,QAAM,EAAE,WAAWF,kBAAiB,cAAAC,cAAa,IAAI,UAAU,QAAQ;AACvE,QAAM,SAAK,oBAAM;AACjB,QAAM,OAAO,iBAAiB;AAE9B,QAAM,oBAAgB,sBAAS,MAAM;AACnC,QAAI,wBAAwB;AAC1B,6BAAuB,MAAMD,iBAAgB,MAAM,QAAQ,CAAC;AAAA,IAC9D,OAAO;AACL,MAAAA,iBAAgB,MAAM,QAAQ;AAAA,IAChC;AAAA,EACF,CAAC;AAED,QAAM,sBAAkB,sBAAS,MAAM;AACrC,QAAI,0BAA0B;AAC5B,+BAAyB,MAAMC,cAAa,IAAI,CAAC;AAAA,IACnD,OAAO;AACL,MAAAA,cAAa,IAAI;AAAA,IACnB;AAAA,EACF,CAAC;AAED,QAAM,qBAAiB,sBAAS,MAAM;AACpC,QAAI,yBAAyB;AAC3B,8BAAwB,MAAMD,iBAAgB,MAAM,QAAQ,CAAC;AAAA,IAC/D,OAAO;AACL,MAAAA,iBAAgB,MAAM,QAAQ;AAAA,IAChC;AAAA,EACF,CAAC;AAED,6CAA0B,MAAM;AAC9B,kBAAc;AACd,WAAO,MAAM;AACX,sBAAgB;AAAA,IAClB;AAAA,EACF,GAAG,CAAC,CAAC;AAEL,8BAAU,MAAM;AACd,mBAAe;AAAA,EACjB,GAAG,CAAC,QAAQ,CAAC;AAEb,SAAO;AACT;AAEO,MAAM,iBAAa,mBAAK,eAAe;AAC9C,WAAW,cAAc;",
|
|
6
6
|
"names": ["ACTIONS", "registerHost", "deregisterHost", "addUpdatePortal", "removePortal", "React"]
|
|
7
7
|
}
|
package/dist/esm/GorhomPortal.js
CHANGED
|
@@ -158,8 +158,9 @@ const PortalProviderComponent = ({
|
|
|
158
158
|
};
|
|
159
159
|
const PortalProvider = memo(PortalProviderComponent);
|
|
160
160
|
PortalProvider.displayName = "PortalProvider";
|
|
161
|
+
const defaultRenderer = (children) => /* @__PURE__ */ jsx(Fragment, { children });
|
|
161
162
|
const PortalHostComponent = (props) => {
|
|
162
|
-
const { name, forwardProps } = props;
|
|
163
|
+
const { name, forwardProps, render = defaultRenderer } = props;
|
|
163
164
|
const isServer = !useDidFinishSSR();
|
|
164
165
|
const state = usePortalState(name);
|
|
165
166
|
const { registerHost: registerHost2, deregisterHost: deregisterHost2 } = usePortal(props.name);
|
|
@@ -172,17 +173,19 @@ const PortalHostComponent = (props) => {
|
|
|
172
173
|
};
|
|
173
174
|
}, [isServer]);
|
|
174
175
|
if (forwardProps) {
|
|
175
|
-
return
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
return React.
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
176
|
+
return render(
|
|
177
|
+
state.map((item) => {
|
|
178
|
+
let next = item.node;
|
|
179
|
+
if (forwardProps) {
|
|
180
|
+
return React.Children.map(next, (child) => {
|
|
181
|
+
return React.isValidElement(child) ? React.cloneElement(child, { key: child.key, ...forwardProps }) : child;
|
|
182
|
+
});
|
|
183
|
+
}
|
|
184
|
+
return next;
|
|
185
|
+
})
|
|
186
|
+
);
|
|
184
187
|
}
|
|
185
|
-
return
|
|
188
|
+
return render(state.map((item) => item.node));
|
|
186
189
|
};
|
|
187
190
|
const PortalHost = memo(PortalHostComponent);
|
|
188
191
|
PortalHost.displayName = "PortalHost";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/GorhomPortal.tsx"],
|
|
4
|
-
"sourcesContent": ["// from https://github.com/gorhom/react-native-portal\n// MIT License Copyright (c) 2020 Mo Gorhom\n// fixing SSR issue\n\nimport {\n spacedChildren,\n useDidFinishSSR,\n useEvent,\n useIsomorphicLayoutEffect,\n} from '@tamagui/core'\nimport React, {\n ReactNode,\n cloneElement,\n createContext,\n isValidElement,\n memo,\n startTransition,\n useCallback,\n useContext,\n useEffect,\n useId,\n useMemo,\n useReducer,\n useRef,\n} from 'react'\n\ninterface PortalType {\n name: string\n node: ReactNode\n}\n\nenum ACTIONS {\n REGISTER_HOST,\n DEREGISTER_HOST,\n ADD_UPDATE_PORTAL,\n REMOVE_PORTAL,\n}\n\nconst INITIAL_STATE = {}\n\nexport { ACTIONS, INITIAL_STATE }\n\nexport interface AddUpdatePortalAction {\n type: ACTIONS\n hostName: string\n portalName: string\n node: ReactNode\n}\n\nexport interface RemovePortalAction {\n type: ACTIONS\n hostName: string\n portalName: string\n}\n\nexport interface RegisterHostAction {\n type: ACTIONS\n hostName: string\n}\n\nexport interface UnregisterHostAction {\n type: ACTIONS\n hostName: string\n}\n\nexport type ActionTypes =\n | AddUpdatePortalAction\n | RemovePortalAction\n | RegisterHostAction\n | UnregisterHostAction\n\nconst registerHost = (state: Record<string, Array<PortalType>>, hostName: string) => {\n if (!(hostName in state)) {\n state[hostName] = []\n }\n return state\n}\n\nconst deregisterHost = (state: Record<string, Array<PortalType>>, hostName: string) => {\n delete state[hostName]\n return state\n}\n\nconst addUpdatePortal = (\n state: Record<string, Array<PortalType>>,\n hostName: string,\n portalName: string,\n node: any\n) => {\n if (!(hostName in state)) {\n state = registerHost(state, hostName)\n }\n\n /**\n * updated portal, if it was already added.\n */\n const index = state[hostName].findIndex((item) => item.name === portalName)\n if (index !== -1) {\n state[hostName][index].node = node\n } else {\n state[hostName].push({\n name: portalName,\n node,\n })\n }\n return state\n}\n\nconst removePortal = (\n state: Record<string, Array<PortalType>>,\n hostName: string,\n portalName: string\n) => {\n if (!(hostName in state)) {\n // eslint-disable-next-line no-console\n console.log(\n `Failed to remove portal '${portalName}', '${hostName}' was not registered!`\n )\n return state\n }\n\n const index = state[hostName].findIndex((item) => item.name === portalName)\n if (index !== -1) state[hostName].splice(index, 1)\n return state\n}\n\nconst reducer = (state: Record<string, Array<PortalType>>, action: ActionTypes) => {\n const { type } = action\n switch (type) {\n case ACTIONS.REGISTER_HOST:\n return registerHost({ ...state }, action.hostName)\n case ACTIONS.DEREGISTER_HOST:\n return deregisterHost({ ...state }, action.hostName)\n case ACTIONS.ADD_UPDATE_PORTAL:\n return addUpdatePortal(\n { ...state },\n action.hostName,\n (action as AddUpdatePortalAction).portalName,\n (action as AddUpdatePortalAction).node\n )\n case ACTIONS.REMOVE_PORTAL:\n return removePortal(\n { ...state },\n action.hostName,\n (action as RemovePortalAction).portalName\n )\n default:\n return state\n }\n}\n\nconst PortalStateContext = createContext<Record<string, Array<PortalType>> | null>(null)\nconst PortalDispatchContext = createContext<React.Dispatch<ActionTypes> | null>(null)\n\nconst usePortalState = (hostName: string) => {\n const state = useContext(PortalStateContext)\n\n if (state === null) {\n throw new Error(\n \"'PortalStateContext' cannot be null, please add 'PortalProvider' to the root component.\"\n )\n }\n\n return state[hostName] || []\n}\n\nexport const usePortal = (hostName = 'root') => {\n const dispatch = useContext(PortalDispatchContext)\n\n if (dispatch === null) {\n throw new Error(\n \"'PortalDispatchContext' cannot be null, please add 'PortalProvider' to the root component.\"\n )\n }\n\n //#region methods\n const registerHost = useCallback(() => {\n dispatch({\n type: ACTIONS.REGISTER_HOST,\n hostName: hostName,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const deregisterHost = useCallback(() => {\n dispatch({\n type: ACTIONS.DEREGISTER_HOST,\n hostName: hostName,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const addUpdatePortal = useCallback((name: string, node: ReactNode) => {\n dispatch({\n type: ACTIONS.ADD_UPDATE_PORTAL,\n hostName,\n portalName: name,\n node,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const removePortal = useCallback((name: string) => {\n dispatch({\n type: ACTIONS.REMOVE_PORTAL,\n hostName,\n portalName: name,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n //#endregion\n\n return {\n registerHost,\n deregisterHost,\n addPortal: addUpdatePortal,\n updatePortal: addUpdatePortal,\n removePortal,\n }\n}\n\nexport interface PortalProviderProps {\n /**\n * Defines whether to add a default root host or not.\n *\n * @default true\n * @type boolean\n */\n shouldAddRootHost?: boolean\n\n /**\n * Defines the root portal host name.\n *\n * @default \"root\"\n * @type string\n */\n rootHostName?: string\n\n children: ReactNode | ReactNode[]\n}\n\nconst PortalProviderComponent = ({\n rootHostName = 'root',\n shouldAddRootHost = true,\n children,\n}: PortalProviderProps) => {\n const [state, dispatch] = useReducer(reducer, INITIAL_STATE)\n const transitionDispatch = useMemo(() => {\n const next = (value: any) => {\n startTransition(() => {\n dispatch(value)\n })\n }\n return next as typeof dispatch\n }, [dispatch])\n\n return (\n <PortalDispatchContext.Provider value={transitionDispatch}>\n <PortalStateContext.Provider value={state}>\n {children}\n {shouldAddRootHost && <PortalHost name={rootHostName} />}\n </PortalStateContext.Provider>\n </PortalDispatchContext.Provider>\n )\n}\n\nexport const PortalProvider = memo(PortalProviderComponent)\nPortalProvider.displayName = 'PortalProvider'\n\nexport interface PortalHostProps {\n /**\n * Host's key or name to be used as an identifier.\n * @type string\n */\n name: string\n\n forwardProps?: Record<string, any>\n}\n\nconst PortalHostComponent = (props: PortalHostProps) => {\n const { name, forwardProps } = props\n const isServer = !useDidFinishSSR()\n const state = usePortalState(name)\n const { registerHost, deregisterHost } = usePortal(props.name)\n\n //#region effects\n useEffect(() => {\n if (isServer) return\n registerHost()\n return () => {\n deregisterHost()\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isServer])\n //#endregion\n\n if (forwardProps) {\n return (\n <>\n {state.map((item) => {\n let next = item.node\n\n if (forwardProps) {\n return React.Children.map(next, (child) => {\n return React.isValidElement(child)\n ? React.cloneElement(child, { key: child.key, ...forwardProps })\n : child\n })\n }\n\n return next\n })}\n </>\n )\n }\n\n //#region render\n return <>{state.map((item) => item.node)}</>\n //#endregion\n}\n\nexport const PortalHost = memo(PortalHostComponent)\nPortalHost.displayName = 'PortalHost'\n\nexport interface PortalItemProps {\n /**\n * Portal's key or name to be used as an identifier.\n * @type string\n * @default generated unique key.\n */\n name?: string\n /**\n * Host's name to teleport the portal content to.\n * @type string\n * @default 'root'\n */\n hostName?: string\n /**\n * Override internal mounting functionality, this is useful\n * if you want to trigger any action before mounting the portal content.\n * @type (mount?: () => void) => void\n * @default undefined\n */\n handleOnMount?: (mount: () => void) => void\n /**\n * Override internal un-mounting functionality, this is useful\n * if you want to trigger any action before un-mounting the portal content.\n * @type (unmount?: () => void) => void\n * @default undefined\n */\n handleOnUnmount?: (unmount: () => void) => void\n /**\n * Override internal updating functionality, this is useful\n * if you want to trigger any action before updating the portal content.\n * @type (update?: () => void) => void\n * @default undefined\n */\n handleOnUpdate?: (update: () => void) => void\n /**\n * Portal's content.\n * @type ReactNode\n * @default undefined\n */\n children?: ReactNode | ReactNode[]\n}\n\nconst PortalComponent = (props: PortalItemProps) => {\n const {\n name: _providedName,\n hostName,\n handleOnMount: _providedHandleOnMount,\n handleOnUnmount: _providedHandleOnUnmount,\n handleOnUpdate: _providedHandleOnUpdate,\n children,\n } = props\n const { addPortal: addUpdatePortal, removePortal } = usePortal(hostName)\n const id = useId()\n const name = _providedName || id\n\n const handleOnMount = useEvent(() => {\n if (_providedHandleOnMount) {\n _providedHandleOnMount(() => addUpdatePortal(name, children))\n } else {\n addUpdatePortal(name, children)\n }\n })\n\n const handleOnUnmount = useEvent(() => {\n if (_providedHandleOnUnmount) {\n _providedHandleOnUnmount(() => removePortal(name))\n } else {\n removePortal(name)\n }\n })\n\n const handleOnUpdate = useEvent(() => {\n if (_providedHandleOnUpdate) {\n _providedHandleOnUpdate(() => addUpdatePortal(name, children))\n } else {\n addUpdatePortal(name, children)\n }\n })\n\n useIsomorphicLayoutEffect(() => {\n handleOnMount()\n return () => {\n handleOnUnmount()\n }\n }, [])\n\n useEffect(() => {\n handleOnUpdate()\n }, [children])\n\n return null\n}\n\nexport const PortalItem = memo(PortalComponent)\nPortalItem.displayName = 'Portal'\n"],
|
|
5
|
-
"mappings": "AAkQM,
|
|
4
|
+
"sourcesContent": ["// from https://github.com/gorhom/react-native-portal\n// MIT License Copyright (c) 2020 Mo Gorhom\n// fixing SSR issue\nimport { AnimatePresence } from '@tamagui/animate-presence'\nimport {\n spacedChildren,\n useDidFinishSSR,\n useEvent,\n useIsomorphicLayoutEffect,\n} from '@tamagui/core'\nimport React, {\n ReactNode,\n cloneElement,\n createContext,\n isValidElement,\n memo,\n startTransition,\n useCallback,\n useContext,\n useEffect,\n useId,\n useMemo,\n useReducer,\n useRef,\n} from 'react'\n\ninterface PortalType {\n name: string\n node: ReactNode\n}\n\nenum ACTIONS {\n REGISTER_HOST,\n DEREGISTER_HOST,\n ADD_UPDATE_PORTAL,\n REMOVE_PORTAL,\n}\n\nconst INITIAL_STATE = {}\n\nexport { ACTIONS, INITIAL_STATE }\n\nexport interface AddUpdatePortalAction {\n type: ACTIONS\n hostName: string\n portalName: string\n node: ReactNode\n}\n\nexport interface RemovePortalAction {\n type: ACTIONS\n hostName: string\n portalName: string\n}\n\nexport interface RegisterHostAction {\n type: ACTIONS\n hostName: string\n}\n\nexport interface UnregisterHostAction {\n type: ACTIONS\n hostName: string\n}\n\nexport type ActionTypes =\n | AddUpdatePortalAction\n | RemovePortalAction\n | RegisterHostAction\n | UnregisterHostAction\n\nconst registerHost = (state: Record<string, Array<PortalType>>, hostName: string) => {\n if (!(hostName in state)) {\n state[hostName] = []\n }\n return state\n}\n\nconst deregisterHost = (state: Record<string, Array<PortalType>>, hostName: string) => {\n delete state[hostName]\n return state\n}\n\nconst addUpdatePortal = (\n state: Record<string, Array<PortalType>>,\n hostName: string,\n portalName: string,\n node: any\n) => {\n if (!(hostName in state)) {\n state = registerHost(state, hostName)\n }\n\n /**\n * updated portal, if it was already added.\n */\n const index = state[hostName].findIndex((item) => item.name === portalName)\n if (index !== -1) {\n state[hostName][index].node = node\n } else {\n state[hostName].push({\n name: portalName,\n node,\n })\n }\n return state\n}\n\nconst removePortal = (\n state: Record<string, Array<PortalType>>,\n hostName: string,\n portalName: string\n) => {\n if (!(hostName in state)) {\n // eslint-disable-next-line no-console\n console.log(\n `Failed to remove portal '${portalName}', '${hostName}' was not registered!`\n )\n return state\n }\n\n const index = state[hostName].findIndex((item) => item.name === portalName)\n if (index !== -1) state[hostName].splice(index, 1)\n return state\n}\n\nconst reducer = (state: Record<string, Array<PortalType>>, action: ActionTypes) => {\n const { type } = action\n switch (type) {\n case ACTIONS.REGISTER_HOST:\n return registerHost({ ...state }, action.hostName)\n case ACTIONS.DEREGISTER_HOST:\n return deregisterHost({ ...state }, action.hostName)\n case ACTIONS.ADD_UPDATE_PORTAL:\n return addUpdatePortal(\n { ...state },\n action.hostName,\n (action as AddUpdatePortalAction).portalName,\n (action as AddUpdatePortalAction).node\n )\n case ACTIONS.REMOVE_PORTAL:\n return removePortal(\n { ...state },\n action.hostName,\n (action as RemovePortalAction).portalName\n )\n default:\n return state\n }\n}\n\nconst PortalStateContext = createContext<Record<string, Array<PortalType>> | null>(null)\nconst PortalDispatchContext = createContext<React.Dispatch<ActionTypes> | null>(null)\n\nconst usePortalState = (hostName: string) => {\n const state = useContext(PortalStateContext)\n\n if (state === null) {\n throw new Error(\n \"'PortalStateContext' cannot be null, please add 'PortalProvider' to the root component.\"\n )\n }\n\n return state[hostName] || []\n}\n\nexport const usePortal = (hostName = 'root') => {\n const dispatch = useContext(PortalDispatchContext)\n\n if (dispatch === null) {\n throw new Error(\n \"'PortalDispatchContext' cannot be null, please add 'PortalProvider' to the root component.\"\n )\n }\n\n //#region methods\n const registerHost = useCallback(() => {\n dispatch({\n type: ACTIONS.REGISTER_HOST,\n hostName: hostName,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const deregisterHost = useCallback(() => {\n dispatch({\n type: ACTIONS.DEREGISTER_HOST,\n hostName: hostName,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const addUpdatePortal = useCallback((name: string, node: ReactNode) => {\n dispatch({\n type: ACTIONS.ADD_UPDATE_PORTAL,\n hostName,\n portalName: name,\n node,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const removePortal = useCallback((name: string) => {\n dispatch({\n type: ACTIONS.REMOVE_PORTAL,\n hostName,\n portalName: name,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n //#endregion\n\n return {\n registerHost,\n deregisterHost,\n addPortal: addUpdatePortal,\n updatePortal: addUpdatePortal,\n removePortal,\n }\n}\n\nexport interface PortalProviderProps {\n /**\n * Defines whether to add a default root host or not.\n *\n * @default true\n * @type boolean\n */\n shouldAddRootHost?: boolean\n\n /**\n * Defines the root portal host name.\n *\n * @default \"root\"\n * @type string\n */\n rootHostName?: string\n\n children: ReactNode | ReactNode[]\n}\n\nconst PortalProviderComponent = ({\n rootHostName = 'root',\n shouldAddRootHost = true,\n children,\n}: PortalProviderProps) => {\n const [state, dispatch] = useReducer(reducer, INITIAL_STATE)\n const transitionDispatch = useMemo(() => {\n const next = (value: any) => {\n startTransition(() => {\n dispatch(value)\n })\n }\n return next as typeof dispatch\n }, [dispatch])\n\n return (\n <PortalDispatchContext.Provider value={transitionDispatch}>\n <PortalStateContext.Provider value={state}>\n {children}\n {shouldAddRootHost && <PortalHost name={rootHostName} />}\n </PortalStateContext.Provider>\n </PortalDispatchContext.Provider>\n )\n}\n\nexport const PortalProvider = memo(PortalProviderComponent)\nPortalProvider.displayName = 'PortalProvider'\n\nexport interface PortalHostProps {\n /**\n * Host's key or name to be used as an identifier.\n * @type string\n */\n name: string\n\n forwardProps?: Record<string, any>\n\n /**\n * Useful when trying to animate children with AnimatePresence.\n *\n * Not a part of gorhom/react-native-portal\n */\n render?: (children: React.ReactNode) => React.ReactElement\n}\nconst defaultRenderer: PortalHostProps['render'] = (children) => <>{children}</>\n\nconst PortalHostComponent = (props: PortalHostProps) => {\n const { name, forwardProps, render = defaultRenderer } = props\n const isServer = !useDidFinishSSR()\n const state = usePortalState(name)\n const { registerHost, deregisterHost } = usePortal(props.name)\n\n //#region effects\n useEffect(() => {\n if (isServer) return\n registerHost()\n return () => {\n deregisterHost()\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isServer])\n //#endregion\n\n if (forwardProps) {\n return render(\n state.map((item) => {\n let next = item.node\n\n if (forwardProps) {\n return React.Children.map(next, (child) => {\n return React.isValidElement(child)\n ? React.cloneElement(child, { key: child.key, ...forwardProps })\n : child\n })\n }\n\n return next\n })\n )\n }\n\n //#region render\n return render(state.map((item) => item.node))\n //#endregion\n}\n\nexport const PortalHost = memo(PortalHostComponent)\nPortalHost.displayName = 'PortalHost'\n\nexport interface PortalItemProps {\n /**\n * Portal's key or name to be used as an identifier.\n * @type string\n * @default generated unique key.\n */\n name?: string\n /**\n * Host's name to teleport the portal content to.\n * @type string\n * @default 'root'\n */\n hostName?: string\n /**\n * Override internal mounting functionality, this is useful\n * if you want to trigger any action before mounting the portal content.\n * @type (mount?: () => void) => void\n * @default undefined\n */\n handleOnMount?: (mount: () => void) => void\n /**\n * Override internal un-mounting functionality, this is useful\n * if you want to trigger any action before un-mounting the portal content.\n * @type (unmount?: () => void) => void\n * @default undefined\n */\n handleOnUnmount?: (unmount: () => void) => void\n /**\n * Override internal updating functionality, this is useful\n * if you want to trigger any action before updating the portal content.\n * @type (update?: () => void) => void\n * @default undefined\n */\n handleOnUpdate?: (update: () => void) => void\n /**\n * Portal's content.\n * @type ReactNode\n * @default undefined\n */\n children?: ReactNode | ReactNode[]\n}\n\nconst PortalComponent = (props: PortalItemProps) => {\n const {\n name: _providedName,\n hostName,\n handleOnMount: _providedHandleOnMount,\n handleOnUnmount: _providedHandleOnUnmount,\n handleOnUpdate: _providedHandleOnUpdate,\n children,\n } = props\n const { addPortal: addUpdatePortal, removePortal } = usePortal(hostName)\n const id = useId()\n const name = _providedName || id\n\n const handleOnMount = useEvent(() => {\n if (_providedHandleOnMount) {\n _providedHandleOnMount(() => addUpdatePortal(name, children))\n } else {\n addUpdatePortal(name, children)\n }\n })\n\n const handleOnUnmount = useEvent(() => {\n if (_providedHandleOnUnmount) {\n _providedHandleOnUnmount(() => removePortal(name))\n } else {\n removePortal(name)\n }\n })\n\n const handleOnUpdate = useEvent(() => {\n if (_providedHandleOnUpdate) {\n _providedHandleOnUpdate(() => addUpdatePortal(name, children))\n } else {\n addUpdatePortal(name, children)\n }\n })\n\n useIsomorphicLayoutEffect(() => {\n handleOnMount()\n return () => {\n handleOnUnmount()\n }\n }, [])\n\n useEffect(() => {\n handleOnUpdate()\n }, [children])\n\n return null\n}\n\nexport const PortalItem = memo(PortalComponent)\nPortalItem.displayName = 'Portal'\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["ACTIONS", "registerHost", "deregisterHost", "addUpdatePortal", "removePortal"]
|
|
7
7
|
}
|
|
@@ -158,8 +158,9 @@ const PortalProviderComponent = ({
|
|
|
158
158
|
};
|
|
159
159
|
const PortalProvider = memo(PortalProviderComponent);
|
|
160
160
|
PortalProvider.displayName = "PortalProvider";
|
|
161
|
+
const defaultRenderer = (children) => /* @__PURE__ */ jsx(Fragment, { children });
|
|
161
162
|
const PortalHostComponent = (props) => {
|
|
162
|
-
const { name, forwardProps } = props;
|
|
163
|
+
const { name, forwardProps, render = defaultRenderer } = props;
|
|
163
164
|
const isServer = !useDidFinishSSR();
|
|
164
165
|
const state = usePortalState(name);
|
|
165
166
|
const { registerHost: registerHost2, deregisterHost: deregisterHost2 } = usePortal(props.name);
|
|
@@ -172,17 +173,19 @@ const PortalHostComponent = (props) => {
|
|
|
172
173
|
};
|
|
173
174
|
}, [isServer]);
|
|
174
175
|
if (forwardProps) {
|
|
175
|
-
return
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
return React.
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
176
|
+
return render(
|
|
177
|
+
state.map((item) => {
|
|
178
|
+
let next = item.node;
|
|
179
|
+
if (forwardProps) {
|
|
180
|
+
return React.Children.map(next, (child) => {
|
|
181
|
+
return React.isValidElement(child) ? React.cloneElement(child, { key: child.key, ...forwardProps }) : child;
|
|
182
|
+
});
|
|
183
|
+
}
|
|
184
|
+
return next;
|
|
185
|
+
})
|
|
186
|
+
);
|
|
184
187
|
}
|
|
185
|
-
return
|
|
188
|
+
return render(state.map((item) => item.node));
|
|
186
189
|
};
|
|
187
190
|
const PortalHost = memo(PortalHostComponent);
|
|
188
191
|
PortalHost.displayName = "PortalHost";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/GorhomPortal.tsx"],
|
|
4
|
-
"sourcesContent": ["// from https://github.com/gorhom/react-native-portal\n// MIT License Copyright (c) 2020 Mo Gorhom\n// fixing SSR issue\n\nimport {\n spacedChildren,\n useDidFinishSSR,\n useEvent,\n useIsomorphicLayoutEffect,\n} from '@tamagui/core'\nimport React, {\n ReactNode,\n cloneElement,\n createContext,\n isValidElement,\n memo,\n startTransition,\n useCallback,\n useContext,\n useEffect,\n useId,\n useMemo,\n useReducer,\n useRef,\n} from 'react'\n\ninterface PortalType {\n name: string\n node: ReactNode\n}\n\nenum ACTIONS {\n REGISTER_HOST,\n DEREGISTER_HOST,\n ADD_UPDATE_PORTAL,\n REMOVE_PORTAL,\n}\n\nconst INITIAL_STATE = {}\n\nexport { ACTIONS, INITIAL_STATE }\n\nexport interface AddUpdatePortalAction {\n type: ACTIONS\n hostName: string\n portalName: string\n node: ReactNode\n}\n\nexport interface RemovePortalAction {\n type: ACTIONS\n hostName: string\n portalName: string\n}\n\nexport interface RegisterHostAction {\n type: ACTIONS\n hostName: string\n}\n\nexport interface UnregisterHostAction {\n type: ACTIONS\n hostName: string\n}\n\nexport type ActionTypes =\n | AddUpdatePortalAction\n | RemovePortalAction\n | RegisterHostAction\n | UnregisterHostAction\n\nconst registerHost = (state: Record<string, Array<PortalType>>, hostName: string) => {\n if (!(hostName in state)) {\n state[hostName] = []\n }\n return state\n}\n\nconst deregisterHost = (state: Record<string, Array<PortalType>>, hostName: string) => {\n delete state[hostName]\n return state\n}\n\nconst addUpdatePortal = (\n state: Record<string, Array<PortalType>>,\n hostName: string,\n portalName: string,\n node: any\n) => {\n if (!(hostName in state)) {\n state = registerHost(state, hostName)\n }\n\n /**\n * updated portal, if it was already added.\n */\n const index = state[hostName].findIndex((item) => item.name === portalName)\n if (index !== -1) {\n state[hostName][index].node = node\n } else {\n state[hostName].push({\n name: portalName,\n node,\n })\n }\n return state\n}\n\nconst removePortal = (\n state: Record<string, Array<PortalType>>,\n hostName: string,\n portalName: string\n) => {\n if (!(hostName in state)) {\n // eslint-disable-next-line no-console\n console.log(\n `Failed to remove portal '${portalName}', '${hostName}' was not registered!`\n )\n return state\n }\n\n const index = state[hostName].findIndex((item) => item.name === portalName)\n if (index !== -1) state[hostName].splice(index, 1)\n return state\n}\n\nconst reducer = (state: Record<string, Array<PortalType>>, action: ActionTypes) => {\n const { type } = action\n switch (type) {\n case ACTIONS.REGISTER_HOST:\n return registerHost({ ...state }, action.hostName)\n case ACTIONS.DEREGISTER_HOST:\n return deregisterHost({ ...state }, action.hostName)\n case ACTIONS.ADD_UPDATE_PORTAL:\n return addUpdatePortal(\n { ...state },\n action.hostName,\n (action as AddUpdatePortalAction).portalName,\n (action as AddUpdatePortalAction).node\n )\n case ACTIONS.REMOVE_PORTAL:\n return removePortal(\n { ...state },\n action.hostName,\n (action as RemovePortalAction).portalName\n )\n default:\n return state\n }\n}\n\nconst PortalStateContext = createContext<Record<string, Array<PortalType>> | null>(null)\nconst PortalDispatchContext = createContext<React.Dispatch<ActionTypes> | null>(null)\n\nconst usePortalState = (hostName: string) => {\n const state = useContext(PortalStateContext)\n\n if (state === null) {\n throw new Error(\n \"'PortalStateContext' cannot be null, please add 'PortalProvider' to the root component.\"\n )\n }\n\n return state[hostName] || []\n}\n\nexport const usePortal = (hostName = 'root') => {\n const dispatch = useContext(PortalDispatchContext)\n\n if (dispatch === null) {\n throw new Error(\n \"'PortalDispatchContext' cannot be null, please add 'PortalProvider' to the root component.\"\n )\n }\n\n //#region methods\n const registerHost = useCallback(() => {\n dispatch({\n type: ACTIONS.REGISTER_HOST,\n hostName: hostName,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const deregisterHost = useCallback(() => {\n dispatch({\n type: ACTIONS.DEREGISTER_HOST,\n hostName: hostName,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const addUpdatePortal = useCallback((name: string, node: ReactNode) => {\n dispatch({\n type: ACTIONS.ADD_UPDATE_PORTAL,\n hostName,\n portalName: name,\n node,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const removePortal = useCallback((name: string) => {\n dispatch({\n type: ACTIONS.REMOVE_PORTAL,\n hostName,\n portalName: name,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n //#endregion\n\n return {\n registerHost,\n deregisterHost,\n addPortal: addUpdatePortal,\n updatePortal: addUpdatePortal,\n removePortal,\n }\n}\n\nexport interface PortalProviderProps {\n /**\n * Defines whether to add a default root host or not.\n *\n * @default true\n * @type boolean\n */\n shouldAddRootHost?: boolean\n\n /**\n * Defines the root portal host name.\n *\n * @default \"root\"\n * @type string\n */\n rootHostName?: string\n\n children: ReactNode | ReactNode[]\n}\n\nconst PortalProviderComponent = ({\n rootHostName = 'root',\n shouldAddRootHost = true,\n children,\n}: PortalProviderProps) => {\n const [state, dispatch] = useReducer(reducer, INITIAL_STATE)\n const transitionDispatch = useMemo(() => {\n const next = (value: any) => {\n startTransition(() => {\n dispatch(value)\n })\n }\n return next as typeof dispatch\n }, [dispatch])\n\n return (\n <PortalDispatchContext.Provider value={transitionDispatch}>\n <PortalStateContext.Provider value={state}>\n {children}\n {shouldAddRootHost && <PortalHost name={rootHostName} />}\n </PortalStateContext.Provider>\n </PortalDispatchContext.Provider>\n )\n}\n\nexport const PortalProvider = memo(PortalProviderComponent)\nPortalProvider.displayName = 'PortalProvider'\n\nexport interface PortalHostProps {\n /**\n * Host's key or name to be used as an identifier.\n * @type string\n */\n name: string\n\n forwardProps?: Record<string, any>\n}\n\nconst PortalHostComponent = (props: PortalHostProps) => {\n const { name, forwardProps } = props\n const isServer = !useDidFinishSSR()\n const state = usePortalState(name)\n const { registerHost, deregisterHost } = usePortal(props.name)\n\n //#region effects\n useEffect(() => {\n if (isServer) return\n registerHost()\n return () => {\n deregisterHost()\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isServer])\n //#endregion\n\n if (forwardProps) {\n return (\n <>\n {state.map((item) => {\n let next = item.node\n\n if (forwardProps) {\n return React.Children.map(next, (child) => {\n return React.isValidElement(child)\n ? React.cloneElement(child, { key: child.key, ...forwardProps })\n : child\n })\n }\n\n return next\n })}\n </>\n )\n }\n\n //#region render\n return <>{state.map((item) => item.node)}</>\n //#endregion\n}\n\nexport const PortalHost = memo(PortalHostComponent)\nPortalHost.displayName = 'PortalHost'\n\nexport interface PortalItemProps {\n /**\n * Portal's key or name to be used as an identifier.\n * @type string\n * @default generated unique key.\n */\n name?: string\n /**\n * Host's name to teleport the portal content to.\n * @type string\n * @default 'root'\n */\n hostName?: string\n /**\n * Override internal mounting functionality, this is useful\n * if you want to trigger any action before mounting the portal content.\n * @type (mount?: () => void) => void\n * @default undefined\n */\n handleOnMount?: (mount: () => void) => void\n /**\n * Override internal un-mounting functionality, this is useful\n * if you want to trigger any action before un-mounting the portal content.\n * @type (unmount?: () => void) => void\n * @default undefined\n */\n handleOnUnmount?: (unmount: () => void) => void\n /**\n * Override internal updating functionality, this is useful\n * if you want to trigger any action before updating the portal content.\n * @type (update?: () => void) => void\n * @default undefined\n */\n handleOnUpdate?: (update: () => void) => void\n /**\n * Portal's content.\n * @type ReactNode\n * @default undefined\n */\n children?: ReactNode | ReactNode[]\n}\n\nconst PortalComponent = (props: PortalItemProps) => {\n const {\n name: _providedName,\n hostName,\n handleOnMount: _providedHandleOnMount,\n handleOnUnmount: _providedHandleOnUnmount,\n handleOnUpdate: _providedHandleOnUpdate,\n children,\n } = props\n const { addPortal: addUpdatePortal, removePortal } = usePortal(hostName)\n const id = useId()\n const name = _providedName || id\n\n const handleOnMount = useEvent(() => {\n if (_providedHandleOnMount) {\n _providedHandleOnMount(() => addUpdatePortal(name, children))\n } else {\n addUpdatePortal(name, children)\n }\n })\n\n const handleOnUnmount = useEvent(() => {\n if (_providedHandleOnUnmount) {\n _providedHandleOnUnmount(() => removePortal(name))\n } else {\n removePortal(name)\n }\n })\n\n const handleOnUpdate = useEvent(() => {\n if (_providedHandleOnUpdate) {\n _providedHandleOnUpdate(() => addUpdatePortal(name, children))\n } else {\n addUpdatePortal(name, children)\n }\n })\n\n useIsomorphicLayoutEffect(() => {\n handleOnMount()\n return () => {\n handleOnUnmount()\n }\n }, [])\n\n useEffect(() => {\n handleOnUpdate()\n }, [children])\n\n return null\n}\n\nexport const PortalItem = memo(PortalComponent)\nPortalItem.displayName = 'Portal'\n"],
|
|
5
|
-
"mappings": "AAkQM,
|
|
4
|
+
"sourcesContent": ["// from https://github.com/gorhom/react-native-portal\n// MIT License Copyright (c) 2020 Mo Gorhom\n// fixing SSR issue\nimport { AnimatePresence } from '@tamagui/animate-presence'\nimport {\n spacedChildren,\n useDidFinishSSR,\n useEvent,\n useIsomorphicLayoutEffect,\n} from '@tamagui/core'\nimport React, {\n ReactNode,\n cloneElement,\n createContext,\n isValidElement,\n memo,\n startTransition,\n useCallback,\n useContext,\n useEffect,\n useId,\n useMemo,\n useReducer,\n useRef,\n} from 'react'\n\ninterface PortalType {\n name: string\n node: ReactNode\n}\n\nenum ACTIONS {\n REGISTER_HOST,\n DEREGISTER_HOST,\n ADD_UPDATE_PORTAL,\n REMOVE_PORTAL,\n}\n\nconst INITIAL_STATE = {}\n\nexport { ACTIONS, INITIAL_STATE }\n\nexport interface AddUpdatePortalAction {\n type: ACTIONS\n hostName: string\n portalName: string\n node: ReactNode\n}\n\nexport interface RemovePortalAction {\n type: ACTIONS\n hostName: string\n portalName: string\n}\n\nexport interface RegisterHostAction {\n type: ACTIONS\n hostName: string\n}\n\nexport interface UnregisterHostAction {\n type: ACTIONS\n hostName: string\n}\n\nexport type ActionTypes =\n | AddUpdatePortalAction\n | RemovePortalAction\n | RegisterHostAction\n | UnregisterHostAction\n\nconst registerHost = (state: Record<string, Array<PortalType>>, hostName: string) => {\n if (!(hostName in state)) {\n state[hostName] = []\n }\n return state\n}\n\nconst deregisterHost = (state: Record<string, Array<PortalType>>, hostName: string) => {\n delete state[hostName]\n return state\n}\n\nconst addUpdatePortal = (\n state: Record<string, Array<PortalType>>,\n hostName: string,\n portalName: string,\n node: any\n) => {\n if (!(hostName in state)) {\n state = registerHost(state, hostName)\n }\n\n /**\n * updated portal, if it was already added.\n */\n const index = state[hostName].findIndex((item) => item.name === portalName)\n if (index !== -1) {\n state[hostName][index].node = node\n } else {\n state[hostName].push({\n name: portalName,\n node,\n })\n }\n return state\n}\n\nconst removePortal = (\n state: Record<string, Array<PortalType>>,\n hostName: string,\n portalName: string\n) => {\n if (!(hostName in state)) {\n // eslint-disable-next-line no-console\n console.log(\n `Failed to remove portal '${portalName}', '${hostName}' was not registered!`\n )\n return state\n }\n\n const index = state[hostName].findIndex((item) => item.name === portalName)\n if (index !== -1) state[hostName].splice(index, 1)\n return state\n}\n\nconst reducer = (state: Record<string, Array<PortalType>>, action: ActionTypes) => {\n const { type } = action\n switch (type) {\n case ACTIONS.REGISTER_HOST:\n return registerHost({ ...state }, action.hostName)\n case ACTIONS.DEREGISTER_HOST:\n return deregisterHost({ ...state }, action.hostName)\n case ACTIONS.ADD_UPDATE_PORTAL:\n return addUpdatePortal(\n { ...state },\n action.hostName,\n (action as AddUpdatePortalAction).portalName,\n (action as AddUpdatePortalAction).node\n )\n case ACTIONS.REMOVE_PORTAL:\n return removePortal(\n { ...state },\n action.hostName,\n (action as RemovePortalAction).portalName\n )\n default:\n return state\n }\n}\n\nconst PortalStateContext = createContext<Record<string, Array<PortalType>> | null>(null)\nconst PortalDispatchContext = createContext<React.Dispatch<ActionTypes> | null>(null)\n\nconst usePortalState = (hostName: string) => {\n const state = useContext(PortalStateContext)\n\n if (state === null) {\n throw new Error(\n \"'PortalStateContext' cannot be null, please add 'PortalProvider' to the root component.\"\n )\n }\n\n return state[hostName] || []\n}\n\nexport const usePortal = (hostName = 'root') => {\n const dispatch = useContext(PortalDispatchContext)\n\n if (dispatch === null) {\n throw new Error(\n \"'PortalDispatchContext' cannot be null, please add 'PortalProvider' to the root component.\"\n )\n }\n\n //#region methods\n const registerHost = useCallback(() => {\n dispatch({\n type: ACTIONS.REGISTER_HOST,\n hostName: hostName,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const deregisterHost = useCallback(() => {\n dispatch({\n type: ACTIONS.DEREGISTER_HOST,\n hostName: hostName,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const addUpdatePortal = useCallback((name: string, node: ReactNode) => {\n dispatch({\n type: ACTIONS.ADD_UPDATE_PORTAL,\n hostName,\n portalName: name,\n node,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n\n const removePortal = useCallback((name: string) => {\n dispatch({\n type: ACTIONS.REMOVE_PORTAL,\n hostName,\n portalName: name,\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n //#endregion\n\n return {\n registerHost,\n deregisterHost,\n addPortal: addUpdatePortal,\n updatePortal: addUpdatePortal,\n removePortal,\n }\n}\n\nexport interface PortalProviderProps {\n /**\n * Defines whether to add a default root host or not.\n *\n * @default true\n * @type boolean\n */\n shouldAddRootHost?: boolean\n\n /**\n * Defines the root portal host name.\n *\n * @default \"root\"\n * @type string\n */\n rootHostName?: string\n\n children: ReactNode | ReactNode[]\n}\n\nconst PortalProviderComponent = ({\n rootHostName = 'root',\n shouldAddRootHost = true,\n children,\n}: PortalProviderProps) => {\n const [state, dispatch] = useReducer(reducer, INITIAL_STATE)\n const transitionDispatch = useMemo(() => {\n const next = (value: any) => {\n startTransition(() => {\n dispatch(value)\n })\n }\n return next as typeof dispatch\n }, [dispatch])\n\n return (\n <PortalDispatchContext.Provider value={transitionDispatch}>\n <PortalStateContext.Provider value={state}>\n {children}\n {shouldAddRootHost && <PortalHost name={rootHostName} />}\n </PortalStateContext.Provider>\n </PortalDispatchContext.Provider>\n )\n}\n\nexport const PortalProvider = memo(PortalProviderComponent)\nPortalProvider.displayName = 'PortalProvider'\n\nexport interface PortalHostProps {\n /**\n * Host's key or name to be used as an identifier.\n * @type string\n */\n name: string\n\n forwardProps?: Record<string, any>\n\n /**\n * Useful when trying to animate children with AnimatePresence.\n *\n * Not a part of gorhom/react-native-portal\n */\n render?: (children: React.ReactNode) => React.ReactElement\n}\nconst defaultRenderer: PortalHostProps['render'] = (children) => <>{children}</>\n\nconst PortalHostComponent = (props: PortalHostProps) => {\n const { name, forwardProps, render = defaultRenderer } = props\n const isServer = !useDidFinishSSR()\n const state = usePortalState(name)\n const { registerHost, deregisterHost } = usePortal(props.name)\n\n //#region effects\n useEffect(() => {\n if (isServer) return\n registerHost()\n return () => {\n deregisterHost()\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isServer])\n //#endregion\n\n if (forwardProps) {\n return render(\n state.map((item) => {\n let next = item.node\n\n if (forwardProps) {\n return React.Children.map(next, (child) => {\n return React.isValidElement(child)\n ? React.cloneElement(child, { key: child.key, ...forwardProps })\n : child\n })\n }\n\n return next\n })\n )\n }\n\n //#region render\n return render(state.map((item) => item.node))\n //#endregion\n}\n\nexport const PortalHost = memo(PortalHostComponent)\nPortalHost.displayName = 'PortalHost'\n\nexport interface PortalItemProps {\n /**\n * Portal's key or name to be used as an identifier.\n * @type string\n * @default generated unique key.\n */\n name?: string\n /**\n * Host's name to teleport the portal content to.\n * @type string\n * @default 'root'\n */\n hostName?: string\n /**\n * Override internal mounting functionality, this is useful\n * if you want to trigger any action before mounting the portal content.\n * @type (mount?: () => void) => void\n * @default undefined\n */\n handleOnMount?: (mount: () => void) => void\n /**\n * Override internal un-mounting functionality, this is useful\n * if you want to trigger any action before un-mounting the portal content.\n * @type (unmount?: () => void) => void\n * @default undefined\n */\n handleOnUnmount?: (unmount: () => void) => void\n /**\n * Override internal updating functionality, this is useful\n * if you want to trigger any action before updating the portal content.\n * @type (update?: () => void) => void\n * @default undefined\n */\n handleOnUpdate?: (update: () => void) => void\n /**\n * Portal's content.\n * @type ReactNode\n * @default undefined\n */\n children?: ReactNode | ReactNode[]\n}\n\nconst PortalComponent = (props: PortalItemProps) => {\n const {\n name: _providedName,\n hostName,\n handleOnMount: _providedHandleOnMount,\n handleOnUnmount: _providedHandleOnUnmount,\n handleOnUpdate: _providedHandleOnUpdate,\n children,\n } = props\n const { addPortal: addUpdatePortal, removePortal } = usePortal(hostName)\n const id = useId()\n const name = _providedName || id\n\n const handleOnMount = useEvent(() => {\n if (_providedHandleOnMount) {\n _providedHandleOnMount(() => addUpdatePortal(name, children))\n } else {\n addUpdatePortal(name, children)\n }\n })\n\n const handleOnUnmount = useEvent(() => {\n if (_providedHandleOnUnmount) {\n _providedHandleOnUnmount(() => removePortal(name))\n } else {\n removePortal(name)\n }\n })\n\n const handleOnUpdate = useEvent(() => {\n if (_providedHandleOnUpdate) {\n _providedHandleOnUpdate(() => addUpdatePortal(name, children))\n } else {\n addUpdatePortal(name, children)\n }\n })\n\n useIsomorphicLayoutEffect(() => {\n handleOnMount()\n return () => {\n handleOnUnmount()\n }\n }, [])\n\n useEffect(() => {\n handleOnUpdate()\n }, [children])\n\n return null\n}\n\nexport const PortalItem = memo(PortalComponent)\nPortalItem.displayName = 'Portal'\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["ACTIONS", "registerHost", "deregisterHost", "addUpdatePortal", "removePortal"]
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/portal",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.8.0",
|
|
4
4
|
"source": "src/index.ts",
|
|
5
5
|
"types": "./types/index.d.ts",
|
|
6
6
|
"main": "dist/cjs",
|
|
@@ -27,16 +27,16 @@
|
|
|
27
27
|
}
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@tamagui/core": "1.
|
|
31
|
-
"@tamagui/stacks": "1.
|
|
32
|
-
"@tamagui/use-event": "1.
|
|
30
|
+
"@tamagui/core": "1.8.0",
|
|
31
|
+
"@tamagui/stacks": "1.8.0",
|
|
32
|
+
"@tamagui/use-event": "1.8.0"
|
|
33
33
|
},
|
|
34
34
|
"peerDependencies": {
|
|
35
35
|
"react": "*",
|
|
36
36
|
"react-native": "*"
|
|
37
37
|
},
|
|
38
38
|
"devDependencies": {
|
|
39
|
-
"@tamagui/build": "1.
|
|
39
|
+
"@tamagui/build": "1.8.0",
|
|
40
40
|
"react": "^18.2.0",
|
|
41
41
|
"react-native": "^0.71.4"
|
|
42
42
|
},
|
package/src/GorhomPortal.tsx
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
// from https://github.com/gorhom/react-native-portal
|
|
2
2
|
// MIT License Copyright (c) 2020 Mo Gorhom
|
|
3
3
|
// fixing SSR issue
|
|
4
|
-
|
|
4
|
+
import { AnimatePresence } from '@tamagui/animate-presence'
|
|
5
5
|
import {
|
|
6
6
|
spacedChildren,
|
|
7
7
|
useDidFinishSSR,
|
|
@@ -275,10 +275,18 @@ export interface PortalHostProps {
|
|
|
275
275
|
name: string
|
|
276
276
|
|
|
277
277
|
forwardProps?: Record<string, any>
|
|
278
|
+
|
|
279
|
+
/**
|
|
280
|
+
* Useful when trying to animate children with AnimatePresence.
|
|
281
|
+
*
|
|
282
|
+
* Not a part of gorhom/react-native-portal
|
|
283
|
+
*/
|
|
284
|
+
render?: (children: React.ReactNode) => React.ReactElement
|
|
278
285
|
}
|
|
286
|
+
const defaultRenderer: PortalHostProps['render'] = (children) => <>{children}</>
|
|
279
287
|
|
|
280
288
|
const PortalHostComponent = (props: PortalHostProps) => {
|
|
281
|
-
const { name, forwardProps } = props
|
|
289
|
+
const { name, forwardProps, render = defaultRenderer } = props
|
|
282
290
|
const isServer = !useDidFinishSSR()
|
|
283
291
|
const state = usePortalState(name)
|
|
284
292
|
const { registerHost, deregisterHost } = usePortal(props.name)
|
|
@@ -295,27 +303,25 @@ const PortalHostComponent = (props: PortalHostProps) => {
|
|
|
295
303
|
//#endregion
|
|
296
304
|
|
|
297
305
|
if (forwardProps) {
|
|
298
|
-
return (
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
return React.
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
})}
|
|
313
|
-
</>
|
|
306
|
+
return render(
|
|
307
|
+
state.map((item) => {
|
|
308
|
+
let next = item.node
|
|
309
|
+
|
|
310
|
+
if (forwardProps) {
|
|
311
|
+
return React.Children.map(next, (child) => {
|
|
312
|
+
return React.isValidElement(child)
|
|
313
|
+
? React.cloneElement(child, { key: child.key, ...forwardProps })
|
|
314
|
+
: child
|
|
315
|
+
})
|
|
316
|
+
}
|
|
317
|
+
|
|
318
|
+
return next
|
|
319
|
+
})
|
|
314
320
|
)
|
|
315
321
|
}
|
|
316
322
|
|
|
317
323
|
//#region render
|
|
318
|
-
return
|
|
324
|
+
return render(state.map((item) => item.node))
|
|
319
325
|
//#endregion
|
|
320
326
|
}
|
|
321
327
|
|
package/types/GorhomPortal.d.ts
CHANGED
|
@@ -59,8 +59,14 @@ export interface PortalHostProps {
|
|
|
59
59
|
*/
|
|
60
60
|
name: string;
|
|
61
61
|
forwardProps?: Record<string, any>;
|
|
62
|
+
/**
|
|
63
|
+
* Useful when trying to animate children with AnimatePresence.
|
|
64
|
+
*
|
|
65
|
+
* Not a part of gorhom/react-native-portal
|
|
66
|
+
*/
|
|
67
|
+
render?: (children: React.ReactNode) => React.ReactElement;
|
|
62
68
|
}
|
|
63
|
-
export declare const PortalHost: React.MemoExoticComponent<(props: PortalHostProps) =>
|
|
69
|
+
export declare const PortalHost: React.MemoExoticComponent<(props: PortalHostProps) => React.ReactElement<any, string | React.JSXElementConstructor<any>>>;
|
|
64
70
|
export interface PortalItemProps {
|
|
65
71
|
/**
|
|
66
72
|
* Portal's key or name to be used as an identifier.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GorhomPortal.d.ts","sourceRoot":"","sources":["../src/GorhomPortal.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,EACZ,SAAS,EAaV,MAAM,OAAO,CAAA;AAOd,aAAK,OAAO;IACV,aAAa,IAAA;IACb,eAAe,IAAA;IACf,iBAAiB,IAAA;IACjB,aAAa,IAAA;CACd;AAED,QAAA,MAAM,aAAa,IAAK,CAAA;AAExB,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,CAAA;AAEjC,MAAM,WAAW,qBAAqB;IACpC,IAAI,EAAE,OAAO,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;IAChB,UAAU,EAAE,MAAM,CAAA;IAClB,IAAI,EAAE,SAAS,CAAA;CAChB;AAED,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,OAAO,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;IAChB,UAAU,EAAE,MAAM,CAAA;CACnB;AAED,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,OAAO,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;CACjB;AAED,MAAM,WAAW,oBAAoB;IACnC,IAAI,EAAE,OAAO,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;CACjB;AAED,MAAM,MAAM,WAAW,GACnB,qBAAqB,GACrB,kBAAkB,GAClB,kBAAkB,GAClB,oBAAoB,CAAA;AAiGxB,eAAO,MAAM,SAAS;;;sBA0BuB,MAAM,QAAQ,SAAS;yBAAvB,MAAM,QAAQ,SAAS;yBAU1B,MAAM;CAiB/C,CAAA;AAED,MAAM,WAAW,mBAAmB;IAClC;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAE3B;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB,QAAQ,EAAE,SAAS,GAAG,SAAS,EAAE,CAAA;CAClC;AA2BD,eAAO,MAAM,cAAc,6EArBxB,mBAAmB,iBAqBqC,CAAA;AAG3D,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,IAAI,EAAE,MAAM,CAAA;IAEZ,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"GorhomPortal.d.ts","sourceRoot":"","sources":["../src/GorhomPortal.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,EACZ,SAAS,EAaV,MAAM,OAAO,CAAA;AAOd,aAAK,OAAO;IACV,aAAa,IAAA;IACb,eAAe,IAAA;IACf,iBAAiB,IAAA;IACjB,aAAa,IAAA;CACd;AAED,QAAA,MAAM,aAAa,IAAK,CAAA;AAExB,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,CAAA;AAEjC,MAAM,WAAW,qBAAqB;IACpC,IAAI,EAAE,OAAO,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;IAChB,UAAU,EAAE,MAAM,CAAA;IAClB,IAAI,EAAE,SAAS,CAAA;CAChB;AAED,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,OAAO,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;IAChB,UAAU,EAAE,MAAM,CAAA;CACnB;AAED,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,OAAO,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;CACjB;AAED,MAAM,WAAW,oBAAoB;IACnC,IAAI,EAAE,OAAO,CAAA;IACb,QAAQ,EAAE,MAAM,CAAA;CACjB;AAED,MAAM,MAAM,WAAW,GACnB,qBAAqB,GACrB,kBAAkB,GAClB,kBAAkB,GAClB,oBAAoB,CAAA;AAiGxB,eAAO,MAAM,SAAS;;;sBA0BuB,MAAM,QAAQ,SAAS;yBAAvB,MAAM,QAAQ,SAAS;yBAU1B,MAAM;CAiB/C,CAAA;AAED,MAAM,WAAW,mBAAmB;IAClC;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAE3B;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB,QAAQ,EAAE,SAAS,GAAG,SAAS,EAAE,CAAA;CAClC;AA2BD,eAAO,MAAM,cAAc,6EArBxB,mBAAmB,iBAqBqC,CAAA;AAG3D,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,IAAI,EAAE,MAAM,CAAA;IAEZ,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;IAElC;;;;OAIG;IACH,MAAM,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,KAAK,KAAK,CAAC,YAAY,CAAA;CAC3D;AA2CD,eAAO,MAAM,UAAU,oCAxCa,eAAe,wEAwCA,CAAA;AAGnD,MAAM,WAAW,eAAe;IAC9B;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAA;IACb;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,IAAI,KAAK,IAAI,CAAA;IAC3C;;;;;OAKG;IACH,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,IAAI,KAAK,IAAI,CAAA;IAC/C;;;;;OAKG;IACH,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,IAAI,KAAK,IAAI,CAAA;IAC7C;;;;OAIG;IACH,QAAQ,CAAC,EAAE,SAAS,GAAG,SAAS,EAAE,CAAA;CACnC;AAqDD,eAAO,MAAM,UAAU,oCAnDS,eAAe,UAmDA,CAAA"}
|