jsx import { jsx } from "@emotion/react" ; import { Wrapper , LoadingWrapperProps } from "./Wrapper" ; import { createPortalDOM } from "../utils/dom" ; import isPlainObject from "lodash/isPlainObject" ; param hint param option returns export function showLoading ( hint ? , option ? ) { const { mount , destroy } = createPortalDOM ( ) ; let props = { hint , status : "show" } ; if ( isPlainObject ( option ) ) { delete option ! . status ; props = { ... props , ... option } ; } const closeLoading = async ( ) => { props . status = "hide" ; props . onHide = destroy ; await mount ( < Wrapper { ... props } / > ) ; } ; const mountShow = mount ( < Wrapper { ... props } / > ) ; return async ( ) => { await mountShow ; await closeLoading ( ) ; } ; } param atLeast param hint param option returns export function showLoadingAtLeast ( atLeast = 300 , hint ? , option ? ) { const closeLoading = showLoading ( hint , option ) ; const start = Date . now ( ) ; return async ( ) => { const now = Date . now ( ) ; const diff = now - start ; if ( diff >= atLeast ) { await closeLoading ( ) ; return ; } await new Promise < void > ( ( resolve ) => { window . setTimeout ( resolve , atLeast - diff ) ; } ) ; await closeLoading ( ) ; } ; }