diff options
Diffstat (limited to 'src/utils/modal.tsx')
-rw-r--r-- | src/utils/modal.tsx | 91 |
1 files changed, 60 insertions, 31 deletions
diff --git a/src/utils/modal.tsx b/src/utils/modal.tsx index f142aee..4c8df6c 100644 --- a/src/utils/modal.tsx +++ b/src/utils/modal.tsx @@ -1,15 +1,6 @@ import { filters } from "../webpack"; -import { lazyWebpack } from "./misc"; import { mapMangledModuleLazy } from "../webpack/webpack"; -const ModalRoot = lazyWebpack(filters.byCode("headerIdIsManaged:")); -const Modals = mapMangledModuleLazy("onCloseRequest:null!=", { - openModal: filters.byCode("onCloseRequest:null!="), - closeModal: filters.byCode("onCloseCallback&&") -}); - -let modalId = 1337; - export enum ModalSize { SMALL = "small", MEDIUM = "medium", @@ -17,26 +8,64 @@ export enum ModalSize { DYNAMIC = "dynamic", } -/** - * Open a modal - * @param Component The component to render in the modal - * @returns The key of this modal. This can be used to close the modal later with closeModal - */ -export function openModal(Component: React.ComponentType, modalProps: Record<string, any>) { - let key = `Vencord${modalId++}`; - Modals.openModal(props => ( - <ModalRoot {...props} {...modalProps}> - <Component /> - </ModalRoot> - ), { modalKey: key }); - - return key; -} - -/** - * Close a modal by key. The id you need for this is returned by openModal. - * @param key The key of the modal to close - */ -export function closeModal(key: string) { - Modals.closeModal(key); +enum ModalTransitionState { + ENTERING, + ENTERED, + EXITING, + EXITED, + HIDDEN, +} + +export interface ModalProps { + transitionState: ModalTransitionState; + onClose(): Promise<void>; +} + +export interface ModalOptions { + modalKey?: string; + onCloseRequest?: (() => void); + onCloseCallback?: (() => void); +} + +interface ModalRootProps { + transitionState: ModalTransitionState; + children: React.ReactNode; + size?: ModalSize; + role?: "alertdialog" | "dialog"; + className?: string; + onAnimationEnd?(): string; +} + +type RenderFunction = (props: ModalProps) => React.ReactNode; + +export const Modals = mapMangledModuleLazy(".onAnimationEnd,", { + ModalRoot: filters.byCode("headerIdIsManaged:"), + ModalHeader: filters.byCode("children", "separator", "wrap", "NO_WRAP", "grow", "shrink", "id", "header"), + ModalContent: filters.byCode("scrollerRef", "content", "className", "children"), + ModalFooter: filters.byCode("HORIZONTAL_REVERSE", "START", "STRETCH", "NO_WRAP", "footerSeparator"), + ModalCloseButton: filters.byCode("closeWithCircleBackground", "hideOnFullscreen"), +}); + +export const ModalRoot = (props: ModalRootProps) => <Modals.ModalRoot {...props} />; +export const ModalHeader = (props: any) => <Modals.ModalHeader {...props} />; +export const ModalContent = (props: any) => <Modals.ModalContent {...props} />; +export const ModalFooter = (props: any) => <Modals.ModalFooter {...props} />; +export const ModalCloseButton = (props: any) => <Modals.ModalCloseButton {...props} />; + +const ModalAPI = mapMangledModuleLazy("onCloseRequest:null!=", { + openModal: filters.byCode("onCloseRequest:null!="), + closeModal: filters.byCode("onCloseCallback&&"), + openModalLazy: m => m?.length === 1 && filters.byCode(".apply(this,arguments)")(m), +}); + +export function openModalLazy(render: () => Promise<RenderFunction>, options?: ModalOptions & { contextKey?: string; }): Promise<string> { + return ModalAPI.openModalLazy(render, options); +} + +export function openModal(render: RenderFunction, options?: ModalOptions, contextKey?: string): string { + return ModalAPI.openModal(render, options, contextKey); +} + +export function closeModal(modalKey: string, contextKey?: string): void { + return ModalAPI.closeModal(modalKey, contextKey); } |