flip/DefinitelyTyped
1
0
Fork 0
mirror of https://github.com/FlipsideCrypto/DefinitelyTyped.git synced 2026-02-06 10:56:53 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Update @loadable/component to 5.10 (#36692)

Browse Source 
* Add `load` instance method and `cacheKey` option.
This commit is contained in:
Shota Fuji 2019-07-12 08:05:09 +09:00 committed by Armando Aguirre
parent 5aa0f90d72
commit 1bcedc50f2
2 changed files with 58 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
types/loadable__component/index.d.ts vendored
View File

@ -1,4 +1,4 @@
// Type definitions for @loadable/component 5.9
// Type definitions for @loadable/component 5.10
// Project: https://github.com/smooth-code/loadable-components
// Definitions by: Martynas Kadiša <https://github.com/martynaskadisa>
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
@ -7,36 +7,40 @@
import * as React from 'react';
export interface DefaultImportedComponent<P> {
default: React.ComponentType<P>;
default: React.ComponentType<P>;
}
export type DefaultComponent<P> = React.ComponentType<P> | DefaultImportedComponent<P>;
export interface Options {
fallback?: JSX.Element;
ssr?: boolean;
export interface Options<T> {
cacheKey?(props: T): any;
fallback?: JSX.Element;
ssr?: boolean;
}
export interface LoadableReadyOptions {
namespace?: string;
namespace?: string;
}
export type LoadableComponent<T> = React.ComponentType<T & { fallback?: JSX.Element }> & { preload(props?: T): void };
export type LoadableLibrary<TModule> = React.ComponentType<{
fallback?: JSX.Element;
children?: (module: TModule) => React.ReactNode;
ref?: React.Ref<TModule>;
}> &
TModule & { preload(props?: object): void };
export interface LoadableComponentMethods<T> {
preload(props?: T): void;
load(props?: T): Promise<React.ComponentType<T>>;
}
declare function lib<T>(
loadFn: (props: object) => Promise<T>,
options?: Options
): LoadableLibrary<T>;
export type LoadableComponent<T> = React.ComponentType<T & { fallback?: JSX.Element }> & LoadableComponentMethods<T>;
export type LoadableLibrary<TModule> = React.ComponentType<{
fallback?: JSX.Element;
children?: (module: TModule) => React.ReactNode;
ref?: React.Ref<TModule>;
}> &
TModule &
LoadableComponentMethods<object>;
declare function lib<T>(loadFn: (props: object) => Promise<T>, options?: Options<any>): LoadableLibrary<T>;
declare function loadableFunc<T>(
loadFn: (props: T) => Promise<DefaultComponent<T>>,
options?: Options
loadFn: (props: T) => Promise<DefaultComponent<T>>,
options?: Options<T>
): LoadableComponent<T>;
declare const loadable: typeof loadableFunc & { lib: typeof lib };
@ -44,7 +48,7 @@ declare const loadable: typeof loadableFunc & { lib: typeof lib };
export default loadable;
export namespace lazy {
function lib<TModule>(loadFn: (props: object) => Promise<TModule>): LoadableLibrary<TModule>;
function lib<TModule>(loadFn: (props: object) => Promise<TModule>): LoadableLibrary<TModule>;
}
export function lazy<T>(loadFn: (props: T) => Promise<DefaultComponent<T>>): LoadableComponent<T>;

54
types/loadable__component/loadable__component-tests.tsx
View File

@ -12,11 +12,11 @@ function importComponentLoader() {
}
const lib = {
getTestObj: () => ({ bar: 'bar', foo: 'foo' })
getTestObj: () => ({ bar: 'bar', foo: 'foo' }),
};
function defaultImportLibLoader() {
return new Promise<{ default: typeof lib }>(resolve => resolve(({ default: lib })));
return new Promise<{ default: typeof lib }>(resolve => resolve({ default: lib }));
}
function importLibLoader() {
@ -39,11 +39,19 @@ function importLibLoader() {
// Should allow passing boolean to `ssr` in options
loadable(defaultImportComponentLoader, { ssr: true });
// Should allow passing function to `cacheKey` in options
loadable(defaultImportComponentLoader, { cacheKey: props => props.foo });
// Should allow passing `fallback` prop to loadable component
<LoadableComponent foo="test" fallback={<div>loading...</div>} />;
// Should allow preloading
LoadableComponent.preload();
// Should allow force loading
LoadableComponent.load().then(Component => {
<Component foo="test" />;
});
}
// lazy
@ -61,21 +69,22 @@ function importLibLoader() {
// Should allow preloading
LazyComponent.preload();
// Should allow force loading
LazyComponent.load().then(Component => {
<Component foo="test" />;
});
}
// loadable.lib
{
// Should infer types from module with default export and reflect them in children render prop
const LoadableDefaultLibrary = loadable.lib(defaultImportLibLoader);
<LoadableDefaultLibrary>
{({ default: { getTestObj } }) => getTestObj().foo}
</LoadableDefaultLibrary>;
<LoadableDefaultLibrary>{({ default: { getTestObj } }) => getTestObj().foo}</LoadableDefaultLibrary>;
// Should infer types from module without default export and reflect them in children render prop
const LoadableLibrary = loadable.lib(importLibLoader);
<LoadableLibrary>
{({ getTestObj }) => getTestObj().foo}
</LoadableLibrary>;
<LoadableLibrary>{({ getTestObj }) => getTestObj().foo}</LoadableLibrary>;
// Should allow passing fallback JSX element
loadable.lib(importLibLoader, { fallback: <div>loading lib...</div> });
@ -83,10 +92,11 @@ function importLibLoader() {
// Should allow passing boolean to `ssr` in options
loadable.lib(defaultImportComponentLoader, { ssr: true });
// Should allow passing function to `cacheKey` in options
loadable.lib(defaultImportComponentLoader, { cacheKey: props => props.foo });
// Should allow passing fallback prop
<LoadableLibrary fallback={<div>Loading library...</div>}>
{({ getTestObj }) => getTestObj().foo}
</LoadableLibrary>;
<LoadableLibrary fallback={<div>Loading library...</div>}>{({ getTestObj }) => getTestObj().foo}</LoadableLibrary>;
// Should reflect inferred types from module in ref
const ref = React.createRef<typeof LoadableLibrary>();
@ -95,26 +105,25 @@ function importLibLoader() {
// Should allow preloading
LoadableLibrary.preload();
// Should allow force loading
LoadableLibrary.load().then(Component => {
<Component />;
});
}
// lazy.lib
{
// Should infer types from module with default export and reflect them in children render prop
const LazyDefaultLibrary = lazy.lib(defaultImportLibLoader);
<LazyDefaultLibrary>
{({ default: { getTestObj } }) => getTestObj().foo}
</LazyDefaultLibrary>;
<LazyDefaultLibrary>{({ default: { getTestObj } }) => getTestObj().foo}</LazyDefaultLibrary>;
// Should infer types from module without default export and reflect them in children render prop
const LazyLibrary = lazy.lib(importLibLoader);
<LazyLibrary>
{({ getTestObj }) => getTestObj().foo}
</LazyLibrary>;
<LazyLibrary>{({ getTestObj }) => getTestObj().foo}</LazyLibrary>;
// Should allow passing fallback prop
<LazyLibrary fallback={<div>Loading library...</div>}>
{({ getTestObj }) => getTestObj().foo}
</LazyLibrary>;
<LazyLibrary fallback={<div>Loading library...</div>}>{({ getTestObj }) => getTestObj().foo}</LazyLibrary>;
// Should reflect inferred types from module in ref
const ref = React.createRef<typeof LazyLibrary>();
@ -123,6 +132,11 @@ function importLibLoader() {
// Should allow preloading
LazyDefaultLibrary.preload();
// Should allow force loading
LazyDefaultLibrary.load().then(Component => {
<Component />;
});
}
// loadableReady