diff --git a/types/react-toastify/index.d.ts b/types/react-toastify/index.d.ts new file mode 100644 index 0000000000..e77ef01837 --- /dev/null +++ b/types/react-toastify/index.d.ts @@ -0,0 +1,227 @@ +// Type definitions for react-toastify 4.0 +// Project: https://github.com/fkhadra/react-toastify#readme +// Definitions by: icopp +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped +// TypeScript Version: 2.6 + +import * as React from 'react'; +import { Transition } from 'react-transition-group'; + +export type ToastCloseButton = React.ReactElement; + +export interface ToastAndToastContainerOptions { + /** + * @default 'top-right' + */ + position?: 'top-right' | 'top-center' | 'top-left' | 'bottom-right' | 'bottom-center' | 'bottom-left'; + + /** + * Delay in ms to close the toast. If set to false, the notification needs + * to be closed manually. + * @default 5000 + */ + autoClose?: false | number; + + /** + * A React Component to replace the default close button or false to + * hide the button. + */ + closeButton?: false | ToastCloseButton; + + /** + * A reference to a valid react-transition-group/Transition component. + */ + transition?: Transition; + + /** + * Display or not the progress bar below the toast (remaining time). + * @default false + */ + hideProgressBar?: boolean; + + /** + * Keep the timer running or not on hover. + * @default true + */ + pauseOnHover?: boolean; + + /** + * Dismiss toast on click. + * @default true + */ + closeOnClick?: boolean; + + /** + * Add optional classes to the toast body. + */ + bodyClassName?: string; + + /** + * Add optional classes to the progress bar. + */ + progressClassName?: string; + + /** + * Allow toast to be draggable. + * @default true + */ + draggable?: boolean; + + /** + * The percentage of the toast's width it takes for a drag to dismiss a + * toast (value between 0 and 100). + * @default 80 + */ + draggablePercent?: number; +} + +export interface ToastContainerProps extends ToastAndToastContainerOptions { + /** + * Support right to left content. + * @default false + */ + rtl?: boolean; + + /** + * Display newest toast on top. + * @default false + */ + newestOnTop?: boolean; + + /** + * Pause on document visibility change (resizing the window, for + * instance). + * @default true + */ + pauseOnVisibilityChange?: boolean; + + /** + * Add optional inline style to the container. + */ + style?: React.CSSProperties; + + /** + * Add optional classes to the container. + */ + className?: string; + + /** + * Add optional classes to the toast. + */ + toastClassName?: string; +} + +export interface ToastOptions extends ToastAndToastContainerOptions { + /** + * Kind of notification. + * @default 'default' + */ + type?: 'default' | 'success' | 'info' | 'warning' | 'error'; + + /** + * Called inside componentDidMount. + */ + onOpen?(childrenProps: React.Props): void; + + /** + * Called inside componentWillUnmount. + */ + onClose?(childrenProps: React.Props): void; + + /** + * Add optional classes to the toast. + */ + className?: string; + + /** + * String or React Element, only available when calling update. + */ + render?: string | React.ReactElement; +} + +export interface Toast { + /** + * @return The ID of the toast, for future reference. + */ + (content: React.ReactNode | ((props: { closeToast(): void }) => React.ReactNode), options?: ToastOptions): string; + + /** + * Dismiss the toast with the given ID, or all toasts if no ID is given. + */ + dismiss(toastId?: string): void; + + /** + * Test if the toast with the given ID is active. + */ + isActive(toastId?: string): boolean; + + /** + * Shorthand for a toast with `type: toast.TYPE.SUCCESS`. + */ + success(content: React.ReactNode, options?: ToastOptions): string; + + /** + * Shorthand for a toast with `type: toast.TYPE.INFO`. + */ + info(content: React.ReactNode, options?: ToastOptions): string; + + /** + * Shorthand for a toast with `type: toast.TYPE.WARNING`. + */ + warning(content: React.ReactNode, options?: ToastOptions): string; + + /** + * Shorthand for a toast with `type: toast.TYPE.ERROR`. + */ + error(content: React.ReactNode, options?: ToastOptions): string; + + /** + * Update an existing toast by ID. + */ + update(id: string, options: ToastOptions & { render: React.ReactNode }): void; + + POSITION: { + TOP_LEFT: 'top-left' + TOP_RIGHT: 'top-right' + TOP_CENTER: 'top-center' + BOTTOM_LEFT: 'bottom-left' + BOTTOM_RIGHT: 'bottom-right' + BOTTOM_CENTER: 'bottom-center' + }; + + TYPE: { + INFO: 'info' + SUCCESS: 'success' + WARNING: 'warning' + ERROR: 'error' + DEFAULT: 'default' + }; +} + +export interface CssTransitionOptions { + /** The class name that will be used when the toast enters. */ + enter: string; + /** The class name that will be used when the toast exits. */ + exit: string; + /** + * The transition duration in ms. + * @default 750 + */ + duration?: number | number[]; + /** + * Append or not the position to the class name: + * yourClassName--top-right, yourClassName--bottom-left... + * @default false + */ + appendPosition?: boolean; +} + +export function cssTransition(options: CssTransitionOptions): Transition; + +export const ToastContainer: React.StatelessComponent; +export const toast: Toast; + +export const Bounce: Transition; +export const Slide: Transition; +export const Zoom: Transition; +export const Flip: Transition; diff --git a/types/react-toastify/react-toastify-tests.ts b/types/react-toastify/react-toastify-tests.ts new file mode 100644 index 0000000000..06219125e4 --- /dev/null +++ b/types/react-toastify/react-toastify-tests.ts @@ -0,0 +1,9 @@ +import { toast } from 'react-toastify'; + +const someToastId = toast('Testing!'); // $ExpectType string + +// $ExpectType void +toast.update(someToastId, { + render: "New Content", + type: toast.TYPE.INFO +}); diff --git a/types/react-toastify/tsconfig.json b/types/react-toastify/tsconfig.json new file mode 100644 index 0000000000..2a02187994 --- /dev/null +++ b/types/react-toastify/tsconfig.json @@ -0,0 +1,23 @@ +{ + "compilerOptions": { + "module": "commonjs", + "lib": [ + "es6" + ], + "noImplicitAny": true, + "noImplicitThis": true, + "strictNullChecks": true, + "strictFunctionTypes": true, + "baseUrl": "../", + "typeRoots": [ + "../" + ], + "types": [], + "noEmit": true, + "forceConsistentCasingInFileNames": true + }, + "files": [ + "index.d.ts", + "react-toastify-tests.ts" + ] +} diff --git a/types/react-toastify/tslint.json b/types/react-toastify/tslint.json new file mode 100644 index 0000000000..3db14f85ea --- /dev/null +++ b/types/react-toastify/tslint.json @@ -0,0 +1 @@ +{ "extends": "dtslint/dt.json" }