Reactstrap: Add new Toast component.

types/reactstrap/index.d.ts

@@ -1,4 +1,4 @@
-// Type definitions for reactstrap 7.1
+// Type definitions for reactstrap 8.0
 // Project: https://github.com/reactstrap/reactstrap#readme
 // Definitions by: Ali Hammad Baig <https://github.com/alihammad>
 //                 Marco Falkenberg <https://github.com/mfal>
@@ -237,6 +237,15 @@ export { TabPaneProps } from './lib/TabPane';
 import { default as Tag_ } from './lib/Tag';
 export class Tag<T = {}> extends Tag_<T> {}
 export { TagProps } from './lib/Tag';
+import { default as Toast_ } from './lib/Toast';
+export class Toast<T = {}> extends Toast_<T> {}
+export { ToastProps } from './lib/Toast';
+import { default as ToastBody_ } from './lib/ToastBody';
+export class ToastBody<T = {}> extends ToastBody_<T> {}
+export { ToastBodyProps } from './lib/ToastBody';
+import { default as ToastHeader_ } from './lib/ToastHeader';
+export class ToastHeader<T = {}> extends ToastHeader_<T> {}
+export { ToastHeaderProps } from './lib/ToastHeader';
 import { default as Tooltip_ } from './lib/Tooltip';
 export class Tooltip<T = {}> extends Tooltip_<T> {}
 export { TooltipProps } from './lib/Tooltip';

types/reactstrap/lib/Toast.d.ts

@@ -0,0 +1,16 @@
+import * as React from "react";
+import { CSSModule } from "../index";
+import { FadeProps } from "./Fade";
+
+export type ToastProps<T = {}> = React.HTMLAttributes<HTMLElement> & {
+  tag?: React.ReactType;
+  className?: string;
+  cssModule?: CSSModule;
+  innerRef?: React.Ref<HTMLElement>;
+  isOpen?: boolean;
+  fade?: boolean;
+  transition?: FadeProps;
+} & T;
+
+declare class Toast<T> extends React.Component<ToastProps<T>> {}
+export default Toast;

types/reactstrap/lib/ToastBody.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { CSSModule } from '../index';
+
+export type ToastBodyProps<T = {}> = React.HTMLAttributes<HTMLElement> & {
+  tag?: React.ReactType;
+  className?: string;
+  cssModule?: CSSModule;
+  innerRef?: React.Ref<HTMLElement>;
+} & T;
+
+declare class ToastBody<T = {[key: string]: any}> extends React.Component<ToastBodyProps<T>> {}
+export default ToastBody;

types/reactstrap/lib/ToastHeader.d.ts

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { CSSModule } from '../index';
+
+export type ToastHeaderProps<T = {}> = React.HTMLAttributes<HTMLElement> & {
+  tag?: React.ReactType;
+  className?: string;
+  cssModule?: CSSModule;
+  wrapTag?: React.ReactType;
+  toggle?: () => void;
+  icon?: string | React.ReactNode;
+  close?: React.ReactNode;
+  charCode?: string | number;
+  closeAriaLabel?: string;
+} & T;
+
+declare class ToastHeader<T = {[key: string]: any}> extends React.Component<ToastHeaderProps<T>> {}
+export default ToastHeader;

types/reactstrap/reactstrap-tests.tsx

@@ -79,6 +79,9 @@ import {
   TabContent,
   Table,
   Tag,
+  Toast,
+  ToastBody,
+  ToastHeader,
   Tooltip,
   Spinner,
   UncontrolledPopover,
@@ -4357,3 +4360,26 @@ function Example126() {
         </div>
     );
 }
+
+function Example127() {
+    return (
+        <div>
+            <Toast>
+                <ToastHeader icon="primary">
+                    Reactstrap
+                </ToastHeader>
+                <ToastBody>
+                    This is a toast with a primary icon — check it out!
+                </ToastBody>
+            </Toast>
+            <Toast fade={false}>
+                <ToastHeader icon={<Spinner/>} toggle={() => {}}>
+                    Reactstrap
+                </ToastHeader>
+                <ToastBody>
+                    This is a toast with a custom icon — check it out!
+                </ToastBody>
+            </Toast>
+        </div>
+    );
+}