add typings for @loadable/component

types/loadable__component/index.d.ts

@@ -0,0 +1,47 @@
+// Type definitions for @loadable/component 5.2
+// Project: https://github.com/smooth-code/loadable-components
+// Definitions by: Martynas Kadiša <https://github.com/martynaskadisa>
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+// TypeScript Version: 2.8
+
+import * as React from 'react';
+
+export interface DefaultImportedComponent<P> {
+	default: React.ComponentType<P>;
+}
+
+export type DefaultComponent<P> = React.ComponentType<P> | DefaultImportedComponent<P>;
+
+export interface Options {
+	fallback?: JSX.Element;
+}
+
+export type LoadableComponent<T> = React.ComponentType<T & { fallback?: JSX.Element }>;
+export type LoadableLibrary<TModule> = React.ComponentType<{
+	fallback?: JSX.Element;
+	children?: (module: TModule) => React.ReactNode;
+	ref?: React.Ref<TModule>;
+}> &
+	TModule;
+
+declare function lib<T>(
+	loadFn: (props: object) => Promise<T>,
+	options?: Options
+): LoadableLibrary<T>;
+
+declare function loadableFunc<T>(
+	loadFn: (props: T) => Promise<DefaultComponent<T>>,
+	options?: Options
+): LoadableComponent<T>;
+
+declare const loadable: typeof loadableFunc & { lib: typeof lib };
+
+export default loadable;
+
+export namespace lazy {
+	function lib<TModule>(loadFn: (props: object) => Promise<TModule>): LoadableLibrary<TModule>;
+}
+
+export function lazy<T>(loadFn: (props: T) => Promise<DefaultComponent<T>>): LoadableComponent<T>;
+
+export function loadableReady(done?: () => any): Promise<void>;

types/loadable__component/loadable__component-tests.tsx

@@ -0,0 +1,117 @@
+import * as React from 'react';
+import loadable, { lazy, loadableReady } from '@loadable/component';
+
+const TestComponent: React.SFC<{ foo: string }> = () => <>test</>;
+
+function defaultImportComponentLoader() {
+    return new Promise<{ default: typeof TestComponent }>(resolve => resolve({ default: TestComponent }));
+}
+
+function importComponentLoader() {
+    return new Promise<typeof TestComponent>(resolve => resolve(TestComponent));
+}
+
+const lib = {
+    getTestObj: () => ({ bar: 'bar', foo: 'foo' })
+};
+
+function defaultImportLibLoader() {
+    return new Promise<{ default: typeof lib }>(resolve => resolve(({ default: lib })));
+}
+
+function importLibLoader() {
+    return new Promise<typeof lib>(resolve => resolve(lib));
+}
+
+// loadable
+{
+    // Should infer props from imported component with default export
+    const LoadableDefaultComponent = loadable(defaultImportComponentLoader);
+    <LoadableDefaultComponent foo="test-prop" />;
+
+    // Should infer props from imported component without default export
+    const LoadableComponent = loadable(importComponentLoader);
+    <LoadableComponent foo="test-prop" />;
+
+    // Should allow passing JSX element to fallback in options
+    loadable(defaultImportComponentLoader, { fallback: <div>loading...</div> });
+
+    // Should allow passing `fallback` prop to loadable component
+    <LoadableComponent foo="test" fallback={<div>loading...</div>} />;
+}
+
+// lazy
+{
+    // Should infer props from imported component with default export
+    const LazyDefaultComponent = lazy(defaultImportComponentLoader);
+    <LazyDefaultComponent foo="test" />;
+
+    // Should infer props from imported component without default export
+    const LazyComponent = lazy(importComponentLoader);
+    <LazyDefaultComponent foo="test" />;
+
+    // Should allow passing fallback prop
+    <LazyComponent foo="test" fallback={<div>loading...</div>} />;
+}
+
+// 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>;
+
+    // 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>;
+
+    // Should allow passing fallback JSX element
+    loadable.lib(importLibLoader, { fallback: <div>loading lib...</div> });
+
+    // Should allow passing fallback prop
+    <LoadableLibrary fallback={<div>Loading library...</div>}>
+        {({ getTestObj }) => getTestObj().foo}
+    </LoadableLibrary>;
+
+    // Should reflect inferred types from module in ref
+    const ref = React.createRef<typeof LoadableLibrary>();
+    <LoadableLibrary ref={ref} />;
+    ref.current!.getTestObj().foo;
+}
+
+// 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>;
+
+    // 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>;
+
+    // Should allow passing fallback prop
+    <LazyLibrary fallback={<div>Loading library...</div>}>
+        {({ getTestObj }) => getTestObj().foo}
+    </LazyLibrary>;
+
+    // Should reflect inferred types from module in ref
+    const ref = React.createRef<typeof LazyLibrary>();
+    <LazyLibrary ref={ref} />;
+    ref.current!.getTestObj().foo;
+}
+
+// loadableReady
+{
+    // Should allow passing callback argument
+    loadableReady(() => {});
+
+    // Should return a promise
+    loadableReady().then(() => {});
+}

types/loadable__component/tsconfig.json

@@ -0,0 +1,29 @@
+{
+    "compilerOptions": {
+        "module": "commonjs",
+        "lib": [
+            "es6"
+        ],
+        "jsx": "react",
+        "noImplicitAny": true,
+        "noImplicitThis": true,
+        "strictNullChecks": true,
+        "strictFunctionTypes": true,
+        "baseUrl": "../",
+        "typeRoots": [
+            "../"
+        ],
+        "paths": {
+            "@loadable/component": [
+                "loadable__component"
+            ]
+        },
+        "types": [],
+        "noEmit": true,
+        "forceConsistentCasingInFileNames": true
+    },
+    "files": [
+        "index.d.ts",
+        "loadable__component-tests.tsx"
+    ]
+}

types/loadable__component/tslint.json

@@ -0,0 +1 @@
+{ "extends": "dtslint/dt.json" }