vhad/DefinitelyTyped
1
0
Fork 0
mirror of https://github.com/gosticks/DefinitelyTyped.git synced 2026-08-11 20:40:20 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge pull request #23385 from FaithForHumans/reactstrap_addonsUpdate

Browse Source 
[reactstrap] v5 beta update changes.
This commit is contained in:
Ron Buckton
2018-02-08 20:16:36 -08:00
committed by GitHub
parent 7e0a4b74d7 8644f396ba
commit e8248b11bc
11 changed files with 218 additions and 196 deletions
Download Patch File Download Diff File Expand all files Collapse all files
types/reactstrap/index.d.ts
Vendored
+77 -79
View File
@@ -14,82 +14,80 @@ export interface CSSModule {
[className: string]: string;
}
export { default as Alert, AlertProps } from './lib/Alert';
export { default as Badge, BadgeProps } from './lib/Badge';
export { default as Breadcrumb, BreadcrumbProps } from './lib/Breadcrumb';
export { default as BreadcrumbItem, BreadcrumbItemProps } from './lib/BreadcrumbItem';
export { default as Button, ButtonProps } from './lib/Button';
export { default as ButtonDropdown, ButtonDropdownProps } from './lib/ButtonDropdown';
export { default as ButtonGroup, ButtonGroupProps } from './lib/ButtonGroup';
export { default as ButtonToolbar, ButtonToolbarProps } from './lib/ButtonToolbar';
export { default as Card, CardProps } from './lib/Card';
export { default as CardBody, CardBodyProps } from './lib/CardBody';
export { default as CardBlock, CardBlockProps } from './lib/CardBlock';
export { default as CardColumns, CardColumnsProps } from './lib/CardColumns';
export { default as CardDeck, CardDeckProps } from './lib/CardDeck';
export { default as CardFooter, CardFooterProps } from './lib/CardFooter';
export { default as CardGroup, CardGroupProps } from './lib/CardGroup';
export { default as CardHeader, CardHeaderProps } from './lib/CardHeader';
export { default as CardImg, CardImgProps } from './lib/CardImg';
export { default as CardImgOverlay, CardImgOverlayProps } from './lib/CardImgOverlay';
export { default as CardLink, CardLinkProps } from './lib/CardLink';
export { default as CardSubtitle, CardSubtitleProps } from './lib/CardSubtitle';
export { default as CardText, CardTextProps } from './lib/CardText';
export { default as CardTitle, CardTitleProps } from './lib/CardTitle';
export { default as Carousel, CarouselProps } from './lib/Carousel';
export { default as CarouselItem, CarouselItemProps } from './lib/CarouselItem';
export { default as CarouselControl, CarouselControlProps } from './lib/CarouselControl';
export { default as CarouselIndicators, CarouselIndicatorsProps } from './lib/CarouselIndicators';
export { default as CarouselCaption, CarouselCaptionProps } from './lib/CarouselCaption';
export { default as Col, ColProps } from './lib/Col';
export { default as Collapse, CollapseProps } from './lib/Collapse';
export { default as Container, ContainerProps } from './lib/Container';
export { default as Dropdown, DropdownProps } from './lib/Dropdown';
export { default as DropdownItem, DropdownItemProps } from './lib/DropdownItem';
export { default as DropdownMenu, DropdownMenuProps } from './lib/DropdownMenu';
export { default as DropdownToggle, DropdownToggleProps } from './lib/DropdownToggle';
export { default as Fade, FadeProps } from './lib/Fade';
export { default as Form, FormProps } from './lib/Form';
export { default as FormFeedback, FormFeedbackProps } from './lib/FormFeedback';
export { default as FormGroup, FormGroupProps } from './lib/FormGroup';
export { default as FormText, FormTextProps } from './lib/FormText';
export { default as Input, InputProps } from './lib/Input';
export { default as InputGroup, InputGroupProps } from './lib/InputGroup';
export { default as InputGroupAddon, InputGroupAddonProps } from './lib/InputGroupAddon';
export { default as InputGroupButton, InputGroupButtonProps } from './lib/InputGroupButton';
export { default as Jumbotron, JumbotronProps } from './lib/Jumbotron';
export { default as Label, LabelProps } from './lib/Label';
export { default as ListGroup, ListGroupProps } from './lib/ListGroup';
export { default as ListGroupItem, ListGroupItemProps } from './lib/ListGroupItem';
export { default as ListGroupItemHeading, ListGroupItemHeadingProps } from './lib/ListGroupItemHeading';
export { default as ListGroupItemText, ListGroupItemTextProps } from './lib/ListGroupItemText';
export { default as Media, MediaProps } from './lib/Media';
export { default as Modal, ModalProps } from './lib/Modal';
export { default as ModalBody, ModalBodyProps } from './lib/ModalBody';
export { default as ModalFooter, ModalFooterProps } from './lib/ModalFooter';
export { default as ModalHeader, ModalHeaderProps } from './lib/ModalHeader';
export { default as Nav, NavProps } from './lib/Nav';
export { default as Navbar, NavbarProps } from './lib/Navbar';
export { default as NavbarBrand, NavbarBrandProps } from './lib/NavbarBrand';
export { default as NavbarToggler, NavbarTogglerProps } from './lib/NavbarToggler';
export { default as NavDropdown, NavDropdownProps } from './lib/NavDropdown';
export { default as NavItem, NavItemProps } from './lib/NavItem';
export { default as NavLink, NavLinkProps } from './lib/NavLink';
export { default as Pagination, PaginationProps } from './lib/Pagination';
export { default as PaginationItem, PaginationItemProps } from './lib/PaginationItem';
export { default as PaginationLink, PaginationLinkProps } from './lib/PaginationLink';
export { default as Popover, PopoverProps } from './lib/Popover';
export { default as PopoverBody, PopoverBodyProps } from './lib/PopoverBody';
export { default as PopoverHeader, PopoverHeaderProps } from './lib/PopoverHeader';
export { default as Progress, ProgressProps } from './lib/Progress';
export { default as Row, RowProps } from './lib/Row';
export { default as TabContent, TabContentProps } from './lib/TabContent';
export { default as Table, TableProps } from './lib/Table';
export { default as TabPane, TabPaneProps } from './lib/TabPane';
export { default as Tag, TagProps } from './lib/Tag';
export { default as Tooltip, TooltipProps } from './lib/Tooltip';
export { UncontrolledAlert, UncontrolledAlertProps } from './lib/Uncontrolled';
export { UncontrolledButtonDropdown, UncontrolledButtonDropdownProps } from './lib/Uncontrolled';
export { UncontrolledDropdown, UncontrolledDropdownProps } from './lib/Uncontrolled';
export { UncontrolledNavDropdown, UncontrolledNavDropdownProps } from './lib/Uncontrolled';
export { UncontrolledTooltip, UncontrolledTooltipProps } from './lib/Uncontrolled';
export { default as Alert, AlertProps } from './lib/Alert';
export { default as Badge, BadgeProps } from './lib/Badge';
export { default as Breadcrumb, BreadcrumbProps } from './lib/Breadcrumb';
export { default as BreadcrumbItem, BreadcrumbItemProps } from './lib/BreadcrumbItem';
export { default as Button, ButtonProps } from './lib/Button';
export { default as ButtonDropdown, ButtonDropdownProps } from './lib/ButtonDropdown';
export { default as ButtonGroup, ButtonGroupProps } from './lib/ButtonGroup';
export { default as ButtonToolbar, ButtonToolbarProps } from './lib/ButtonToolbar';
export { default as Card, CardProps } from './lib/Card';
export { default as CardBody, CardBodyProps } from './lib/CardBody';
export { default as CardColumns, CardColumnsProps } from './lib/CardColumns';
export { default as CardDeck, CardDeckProps } from './lib/CardDeck';
export { default as CardFooter, CardFooterProps } from './lib/CardFooter';
export { default as CardGroup, CardGroupProps } from './lib/CardGroup';
export { default as CardHeader, CardHeaderProps } from './lib/CardHeader';
export { default as CardImg, CardImgProps } from './lib/CardImg';
export { default as CardImgOverlay, CardImgOverlayProps } from './lib/CardImgOverlay';
export { default as CardLink, CardLinkProps } from './lib/CardLink';
export { default as CardSubtitle, CardSubtitleProps } from './lib/CardSubtitle';
export { default as CardText, CardTextProps } from './lib/CardText';
export { default as CardTitle, CardTitleProps } from './lib/CardTitle';
export { default as Carousel, CarouselProps } from './lib/Carousel';
export { default as CarouselItem, CarouselItemProps } from './lib/CarouselItem';
export { default as CarouselControl, CarouselControlProps } from './lib/CarouselControl';
export { default as CarouselIndicators, CarouselIndicatorsProps } from './lib/CarouselIndicators';
export { default as CarouselCaption, CarouselCaptionProps } from './lib/CarouselCaption';
export { default as Col, ColProps } from './lib/Col';
export { default as Collapse, CollapseProps } from './lib/Collapse';
export { default as Container, ContainerProps } from './lib/Container';
export { default as Dropdown, DropdownProps } from './lib/Dropdown';
export { default as DropdownItem, DropdownItemProps } from './lib/DropdownItem';
export { default as DropdownMenu, DropdownMenuProps } from './lib/DropdownMenu';
export { default as DropdownToggle, DropdownToggleProps } from './lib/DropdownToggle';
export { default as Fade, FadeProps } from './lib/Fade';
export { default as Form, FormProps } from './lib/Form';
export { default as FormFeedback, FormFeedbackProps } from './lib/FormFeedback';
export { default as FormGroup, FormGroupProps } from './lib/FormGroup';
export { default as FormText, FormTextProps } from './lib/FormText';
export { default as Input, InputProps } from './lib/Input';
export { default as InputGroup, InputGroupProps } from './lib/InputGroup';
export { default as InputGroupAddon, InputGroupAddonProps } from './lib/InputGroupAddon';
export { default as InputGroupButtonDropdown, InputGroupButtonDropdownProps } from './lib/InputGroupButtonDropdown';
export { default as InputGroupText, InputGroupTextProps } from './lib/InputGroupText';
export { default as Jumbotron, JumbotronProps } from './lib/Jumbotron';
export { default as Label, LabelProps } from './lib/Label';
export { default as ListGroup, ListGroupProps } from './lib/ListGroup';
export { default as ListGroupItem, ListGroupItemProps } from './lib/ListGroupItem';
export { default as ListGroupItemHeading, ListGroupItemHeadingProps } from './lib/ListGroupItemHeading';
export { default as ListGroupItemText, ListGroupItemTextProps } from './lib/ListGroupItemText';
export { default as Media, MediaProps } from './lib/Media';
export { default as Modal, ModalProps } from './lib/Modal';
export { default as ModalBody, ModalBodyProps } from './lib/ModalBody';
export { default as ModalFooter, ModalFooterProps } from './lib/ModalFooter';
export { default as ModalHeader, ModalHeaderProps } from './lib/ModalHeader';
export { default as Nav, NavProps } from './lib/Nav';
export { default as Navbar, NavbarProps } from './lib/Navbar';
export { default as NavbarBrand, NavbarBrandProps } from './lib/NavbarBrand';
export { default as NavbarToggler, NavbarTogglerProps } from './lib/NavbarToggler';
export { default as NavItem, NavItemProps } from './lib/NavItem';
export { default as NavLink, NavLinkProps } from './lib/NavLink';
export { default as Pagination, PaginationProps } from './lib/Pagination';
export { default as PaginationItem, PaginationItemProps } from './lib/PaginationItem';
export { default as PaginationLink, PaginationLinkProps } from './lib/PaginationLink';
export { default as Popover, PopoverProps } from './lib/Popover';
export { default as PopoverBody, PopoverBodyProps } from './lib/PopoverBody';
export { default as PopoverHeader, PopoverHeaderProps } from './lib/PopoverHeader';
export { default as Progress, ProgressProps } from './lib/Progress';
export { default as Row, RowProps } from './lib/Row';
export { default as TabContent, TabContentProps } from './lib/TabContent';
export { default as Table, TableProps } from './lib/Table';
export { default as TabPane, TabPaneProps } from './lib/TabPane';
export { default as Tag, TagProps } from './lib/Tag';
export { default as Tooltip, TooltipProps } from './lib/Tooltip';
export { UncontrolledAlert, UncontrolledAlertProps } from './lib/Uncontrolled';
export { UncontrolledButtonDropdown, UncontrolledButtonDropdownProps } from './lib/Uncontrolled';
export { UncontrolledDropdown, UncontrolledDropdownProps } from './lib/Uncontrolled';
export { UncontrolledTooltip, UncontrolledTooltipProps } from './lib/Uncontrolled';
types/reactstrap/lib/CardBlock.d.ts
Vendored
-10
View File
@@ -1,10 +0,0 @@
import { CSSModule } from '../index';
export interface CardBlockProps {
tag?: React.ReactType;
className?: string;
cssModule?: CSSModule;
}
declare const CardBlock: React.StatelessComponent<CardBlockProps>;
export default CardBlock;
types/reactstrap/lib/Dropdown.d.ts
Vendored
+1
View File
@@ -18,6 +18,7 @@ export interface Props extends UncontrolledProps {
group?: boolean;
size?: string;
tag?: React.ReactType;
addonType?: boolean | 'prepend' | 'append';
}
export interface DropdownProps extends Props {
/* intentionally blank */
types/reactstrap/lib/DropdownToggle.d.ts
Vendored
+1
View File
@@ -6,6 +6,7 @@ export interface DropdownToggleProps {
cssModule?: CSSModule;
disabled?: boolean;
onClick?: React.MouseEventHandler<any>;
outline?: boolean;
'data-toggle'?: string;
'aria-haspopup'?: boolean;
split?: boolean;
types/reactstrap/lib/InputGroupAddon.d.ts
Vendored
+2 -1
View File
@@ -1,9 +1,10 @@
import { CSSModule } from '../index';
export interface InputGroupAddonProps {
export interface InputGroupAddonProps extends React.HTMLAttributes<HTMLElement> {
tag?: React.ReactType;
className?: string;
cssModule?: CSSModule;
addonType: 'prepend' | 'append';
}
declare const InputGroupAddon: React.StatelessComponent<InputGroupAddonProps>;
types/reactstrap/lib/InputGroupButton.d.ts
Vendored
-13
View File
@@ -1,13 +0,0 @@
import { CSSModule } from '../index';
export interface InputGroupButtonProps {
tag?: React.ReactType;
groupClassName?: string;
groupAttributes?: any;
className?: string;
cssModule?: CSSModule;
color?: string;
}
declare const InputGroupButton: React.StatelessComponent<InputGroupButtonProps>;
export default InputGroupButton;
types/reactstrap/lib/InputGroupButtonDropdown.d.ts
Vendored
+8
View File
@@ -0,0 +1,8 @@
import { DropdownProps } from './Dropdown';
export interface InputGroupButtonDropdownProps extends DropdownProps {
addonType: 'prepend' | 'append';
}
declare const InputGroupButtonDropdown: React.StatelessComponent<InputGroupButtonDropdownProps>;
export default InputGroupButtonDropdown;
types/reactstrap/lib/InputGroupText.d.ts
Vendored
+9
View File
@@ -0,0 +1,9 @@
import { CSSModule } from '../index';
export interface InputGroupTextProps extends React.HTMLAttributes<HTMLElement> {
tag?: React.ReactType;
cssModule?: CSSModule;
}
declare const InputGroupText: React.StatelessComponent<InputGroupTextProps>;
export default InputGroupText;
types/reactstrap/lib/NavDropdown.d.ts
Vendored
-15
View File
@@ -1,15 +0,0 @@
import { UncontrolledDropdownProps, DropdownProps } from './Dropdown';
export interface UncontrolledProps extends UncontrolledDropdownProps {
/* intentionally blank */
}
export interface UncontrolledNavDropdownProps extends UncontrolledProps {
/* intentionally blank */
}
export interface NavDropdownProps extends DropdownProps {
/* intentionally blank */
}
declare const NavDropdown: React.StatelessComponent<NavDropdownProps>;
export default NavDropdown;
types/reactstrap/lib/Uncontrolled.d.ts
Vendored
-3
View File
@@ -1,17 +1,14 @@
import { UncontrolledAlertProps } from './Alert';
import { UncontrolledButtonDropdownProps } from './ButtonDropdown';
import { UncontrolledDropdownProps } from './Dropdown';
import { UncontrolledNavDropdownProps } from './NavDropdown';
import { UncontrolledTooltipProps } from './Tooltip';
export const UncontrolledAlert: React.StatelessComponent<UncontrolledAlertProps>;
export const UncontrolledButtonDropdown: React.StatelessComponent<UncontrolledButtonDropdownProps>;
export const UncontrolledDropdown: React.StatelessComponent<UncontrolledDropdownProps>;
export const UncontrolledNavDropdown: React.StatelessComponent<UncontrolledNavDropdownProps>;
export const UncontrolledTooltip: React.StatelessComponent<UncontrolledTooltipProps>;
export { UncontrolledAlertProps } from './Alert';
export { UncontrolledButtonDropdownProps } from './ButtonDropdown';
export { UncontrolledDropdownProps } from './Dropdown';
export { UncontrolledNavDropdownProps } from './NavDropdown';
export { UncontrolledTooltipProps } from './Tooltip';
types/reactstrap/reactstrap-tests.tsx
+120 -75
View File
@@ -15,7 +15,6 @@ import {
DropdownToggle,
Card,
CardBody,
CardBlock,
CardColumns,
CardDeck,
CardFooter,
@@ -44,7 +43,8 @@ import {
Input,
InputGroup,
InputGroupAddon,
InputGroupButton,
InputGroupButtonDropdown,
InputGroupText,
Pagination,
Label,
ListGroup,
@@ -61,7 +61,6 @@ import {
Navbar,
NavbarBrand,
NavbarToggler,
NavDropdown,
NavItem,
NavLink,
PaginationItem,
@@ -73,7 +72,6 @@ import {
TabPane,
UncontrolledButtonDropdown,
UncontrolledDropdown,
UncontrolledNavDropdown,
UncontrolledTooltip,
TabContent,
Table,
@@ -522,12 +520,12 @@ const Example25 = (props: any) => {
<div>
<Card>
<CardImg top width="100%" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=318%C3%97180&w=318&h=180" alt="Card image cap" />
<CardBlock>
<CardBody>
<CardTitle>Card title</CardTitle>
<CardSubtitle>Card subtitle</CardSubtitle>
<CardText>Some quick example text to build on the card title and make up the bulk of the card's content.</CardText>
<Button>Button</Button>
</CardBlock>
</CardBody>
</Card>
</div>
);
@@ -537,16 +535,16 @@ const Example26 = (props: any) => {
return (
<div>
<Card>
<CardBlock>
<CardBody>
<CardTitle>Card title</CardTitle>
<CardSubtitle>Card subtitle</CardSubtitle>
</CardBlock>
</CardBody>
<img width="100%" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=318%C3%97180&w=318&h=180" alt="Card image cap" />
<CardBlock>
<CardBody>
<CardText>Some quick example text to build on the card title and make up the bulk of the card's content.</CardText>
<CardLink href="#">Card Link</CardLink>
<CardLink href="#">Another Link</CardLink>
</CardBlock>
</CardBody>
</Card>
</div>
);
@@ -600,21 +598,21 @@ const Example29 = (props: any) => {
<div>
<Card>
<CardHeader>Header</CardHeader>
<CardBlock>
<CardBody>
<CardTitle>Special Title Treatment</CardTitle>
<CardText>With supporting text below as a natural lead-in to additional content.</CardText>
<Button>Go somewhere</Button>
</CardBlock>
</CardBody>
<CardFooter>Footer</CardFooter>
</Card>
<Card>
<CardHeader tag="h3">Featured</CardHeader>
<CardBlock>
<CardBody>
<CardTitle>Special Title Treatment</CardTitle>
<CardText>With supporting text below as a natural lead-in to additional content.</CardText>
<Button>Go somewhere</Button>
</CardBlock>
</CardBody>
<CardFooter className="text-muted">Footer</CardFooter>
</Card>
</div>
@@ -626,22 +624,22 @@ const Example30 = (props: any) => {
<div>
<Card>
<CardImg top width="100%" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=318%C3%97180&w=318&h=180" alt="Card image cap" />
<CardBlock>
<CardBody>
<CardTitle>Card Title</CardTitle>
<CardText>This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</CardText>
<CardText>
<small className="text-muted">Last updated 3 mins ago</small>
</CardText>
</CardBlock>
</CardBody>
</Card>
<Card>
<CardBlock>
<CardBody>
<CardTitle>Card Title</CardTitle>
<CardText>This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</CardText>
<CardText>
<small className="text-muted">Last updated 3 mins ago</small>
</CardText>
</CardBlock>
</CardBody>
<CardImg bottom width="100%" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=318%C3%97180&w=318&h=180" alt="Card image cap" />
</Card>
</div>
@@ -744,25 +742,25 @@ const Example34 = (props: any) => {
<CardGroup>
<Card>
<CardImg top width="100%" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=256%C3%97180&w=256&h=180" alt="Card image cap" />
<CardBlock>
<CardBody>
<CardTitle>Card title</CardTitle>
<CardSubtitle>Card subtitle</CardSubtitle>
<CardText>This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</CardText>
<Button>Button</Button>
</CardBlock>
</CardBody>
</Card>
<Card>
<CardImg top width="100%" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=256%C3%97180&w=256&h=180" alt="Card image cap" />
<CardBlock>
<CardBody>
<CardTitle>Card title</CardTitle>
<CardSubtitle>Card subtitle</CardSubtitle>
<CardText>This card has supporting text below as a natural lead-in to additional content.</CardText>
<Button>Button</Button>
</CardBlock>
</CardBody>
</Card>
<Card>
<CardImg top width="100%" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=256%C3%97180&w=256&h=180" alt="Card image cap" />
<CardBlock>
<CardBody>
<CardTitle>Card title</CardTitle>
<CardSubtitle>Card subtitle</CardSubtitle>
<CardText>
@@ -770,7 +768,7 @@ const Example34 = (props: any) => {
card has even longer content than the first to show that equal height action.
</CardText>
<Button>Button</Button>
</CardBlock>
</CardBody>
</Card>
</CardGroup>
);
@@ -781,25 +779,25 @@ const Example35 = (props: any) => {
<CardDeck>
<Card>
<CardImg top width="100%" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=256%C3%97180&w=256&h=180" alt="Card image cap" />
<CardBlock>
<CardBody>
<CardTitle>Card title</CardTitle>
<CardSubtitle>Card subtitle</CardSubtitle>
<CardText>This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</CardText>
<Button>Button</Button>
</CardBlock>
</CardBody>
</Card>
<Card>
<CardImg top width="100%" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=256%C3%97180&w=256&h=180" alt="Card image cap" />
<CardBlock>
<CardBody>
<CardTitle>Card title</CardTitle>
<CardSubtitle>Card subtitle</CardSubtitle>
<CardText>This card has supporting text below as a natural lead-in to additional content.</CardText>
<Button>Button</Button>
</CardBlock>
</CardBody>
</Card>
<Card>
<CardImg top width="100%" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=256%C3%97180&w=256&h=180" alt="Card image cap" />
<CardBlock>
<CardBody>
<CardTitle>Card title</CardTitle>
<CardSubtitle>Card subtitle</CardSubtitle>
<CardText>
@@ -807,7 +805,7 @@ const Example35 = (props: any) => {
even longer content than the first to show that equal height action.
</CardText>
<Button>Button</Button>
</CardBlock>
</CardBody>
</Card>
</CardDeck>
);
@@ -818,23 +816,23 @@ const Example36 = (props: any) => {
<CardColumns>
<Card>
<CardImg top width="100%" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=256%C3%97180&w=256&h=180" alt="Card image cap" />
<CardBlock>
<CardBody>
<CardTitle>Card title</CardTitle>
<CardSubtitle>Card subtitle</CardSubtitle>
<CardText>This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</CardText>
<Button>Button</Button>
</CardBlock>
</CardBody>
</Card>
<Card>
<CardImg top width="100%" src="https://placeholdit.imgix.net/~text?txtsize=33&txt=256%C3%97180&w=256&h=180" alt="Card image cap" />
</Card>
<Card>
<CardBlock>
<CardBody>
<CardTitle>Card title</CardTitle>
<CardSubtitle>Card subtitle</CardSubtitle>
<CardText>This card has supporting text below as a natural lead-in to additional content.</CardText>
<Button>Button</Button>
</CardBlock>
</CardBody>
</Card>
<Card block inverse style={{ backgroundColor: '#333', borderColor: '#333' }}>
<CardTitle>Special Title Treatment</CardTitle>
@@ -845,7 +843,7 @@ const Example36 = (props: any) => {
<CardImg top width="100%"
src="https://placeholdit.imgix.net/~text?txtsize=33&txt=256%C3%97180&w=256&h=180"
alt="Card image cap" />
<CardBlock>
<CardBody>
<CardTitle>Card title</CardTitle>
<CardSubtitle>Card subtitle</CardSubtitle>
<CardText>
@@ -853,7 +851,7 @@ const Example36 = (props: any) => {
has even longer content than the first to show that equal height action.
</CardText>
<Button>Button</Button>
</CardBlock>
</CardBody>
</Card>
<Card block inverse color="primary">
<CardTitle>Special Title Treatment</CardTitle>
@@ -883,12 +881,12 @@ class Example37 extends React.Component<any, any> {
<Button color="primary" onClick={this.toggle} style={{ marginBottom: '1rem' }}>Toggle</Button>
<Collapse isOpen={this.state.collapse}>
<Card>
<CardBlock>
<CardBody>
Anim pariatur cliche reprehenderit,
enim eiusmod high life accusamus terry richardson ad squid. Nihil
anim keffiyeh helvetica, craft beer labore wes anderson cred
nesciunt sapiente ea proident.
</CardBlock>
</CardBody>
</Card>
</Collapse>
</div>
@@ -925,12 +923,12 @@ class Example38 extends React.Component<any, any> {
<h5>Current state: {this.state.status}</h5>
<Collapse isOpen={this.state.collapse} onOpened={this.onOpened} onClosed={this.onClosed}>
<Card>
<CardBlock>
<CardBody>
Anim pariatur cliche reprehenderit,
enim eiusmod high life accusamus terry richardson ad squid. Nihil
anim keffiyeh helvetica, craft beer labore wes anderson cred
nesciunt sapiente ea proident.
</CardBlock>
</CardBody>
</Card>
</Collapse>
</div>
@@ -1422,12 +1420,12 @@ const Example52 = (props: any) => {
return (
<div>
<InputGroup>
<InputGroupAddon>@</InputGroupAddon>
<InputGroupAddon addonType="prepend">@</InputGroupAddon>
<Input placeholder="username" />
</InputGroup>
<br />
<InputGroup>
<InputGroupAddon>
<InputGroupAddon addonType="prepend">
<Input addon type="checkbox" aria-label="Checkbox for following text input" />
</InputGroupAddon>
<Input placeholder="Check it out" />
@@ -1435,21 +1433,25 @@ const Example52 = (props: any) => {
<br />
<InputGroup>
<Input placeholder="username" />
<InputGroupAddon>@example.com</InputGroupAddon>
<InputGroupAddon addonType="prepend">@example.com</InputGroupAddon>
</InputGroup>
<br />
<InputGroup>
<InputGroupAddon>$</InputGroupAddon>
<InputGroupAddon>$</InputGroupAddon>
<InputGroupAddon addonType="prepend">
<InputGroupText>$</InputGroupText>
<InputGroupText>$</InputGroupText>
</InputGroupAddon>
<Input placeholder="Dolla dolla billz yo!" />
<InputGroupAddon>$</InputGroupAddon>
<InputGroupAddon>$</InputGroupAddon>
<InputGroupAddon addonType="append">
<InputGroupText>$</InputGroupText>
<InputGroupText>$</InputGroupText>
</InputGroupAddon>
</InputGroup>
<br />
<InputGroup>
<InputGroupAddon>$</InputGroupAddon>
<InputGroupAddon addonType="prepend">$</InputGroupAddon>
<Input placeholder="Amount" type="number" step="1" />
<InputGroupAddon>.00</InputGroupAddon>
<InputGroupAddon addonType="append">.00</InputGroupAddon>
</InputGroup>
</div>
);
@@ -1459,19 +1461,19 @@ const Example53 = (props: any) => {
return (
<div>
<InputGroup>
<InputGroupAddon>To the Left!</InputGroupAddon>
<InputGroupAddon addonType="prepend">To the Left!</InputGroupAddon>
<Input />
</InputGroup>
<br />
<InputGroup>
<Input />
<InputGroupAddon>To the Right!</InputGroupAddon>
<InputGroupAddon addonType="append">To the Right!</InputGroupAddon>
</InputGroup>
<br />
<InputGroup>
<InputGroupAddon>To the Left!</InputGroupAddon>
<InputGroupAddon addonType="prepend">To the Left!</InputGroupAddon>
<Input placeholder="and..." />
<InputGroupAddon>To the Right!</InputGroupAddon>
<InputGroupAddon addonType="append">To the Right!</InputGroupAddon>
</InputGroup>
</div>
);
@@ -1481,17 +1483,17 @@ const Example54 = (props: any) => {
return (
<div>
<InputGroup size="lg">
<InputGroupAddon>@lg</InputGroupAddon>
<InputGroupAddon addonType="prepend">@lg</InputGroupAddon>
<Input />
</InputGroup>
<br />
<InputGroup>
<InputGroupAddon>@normal</InputGroupAddon>
<InputGroupAddon addonType="prepend">@normal</InputGroupAddon>
<Input />
</InputGroup>
<br />
<InputGroup size="sm">
<InputGroupAddon>@sm</InputGroupAddon>
<InputGroupAddon addonType="prepend">@sm</InputGroupAddon>
<Input />
</InputGroup>
</div>
@@ -1502,19 +1504,19 @@ const Example55 = (props: any) => {
return (
<div>
<InputGroup>
<InputGroupButton><Button>I'm a button</Button></InputGroupButton>
<InputGroupAddon addonType="prepend"><Button>I'm a button</Button></InputGroupAddon>
<Input />
</InputGroup>
<br />
<InputGroup>
<Input />
<InputGroupButton></InputGroupButton>
<InputGroupAddon addonType="append"></InputGroupAddon>
</InputGroup>
<br />
<InputGroup>
<InputGroupButton></InputGroupButton>
<InputGroupAddon addonType="prepend"></InputGroupAddon>
<Input placeholder="and..." />
<InputGroupButton><Button color="secondary">I'm a button</Button></InputGroupButton>
<InputGroupAddon addonType="append"><Button color="secondary">I'm a button</Button></InputGroupAddon>
</InputGroup>
</div>
);
@@ -1524,17 +1526,17 @@ const Example56 = (props: any) => {
return (
<div>
<InputGroup size="lg">
<InputGroupAddon>@lg</InputGroupAddon>
<InputGroupAddon addonType="prepend">@lg</InputGroupAddon>
<Input />
</InputGroup>
<br />
<InputGroup>
<InputGroupAddon>@normal</InputGroupAddon>
<InputGroupAddon addonType="prepend">@normal</InputGroupAddon>
<Input />
</InputGroup>
<br />
<InputGroup size="sm">
<InputGroupAddon>@sm</InputGroupAddon>
<InputGroupAddon addonType="prepend">@sm</InputGroupAddon>
<Input />
</InputGroup>
</div>
@@ -1545,19 +1547,19 @@ const Example57 = (props: any) => {
return (
<div>
<InputGroup>
<InputGroupButton><Button>I'm a button</Button></InputGroupButton>
<InputGroupAddon addonType="prepend"><Button>I'm a button</Button></InputGroupAddon>
<Input />
</InputGroup>
<br />
<InputGroup>
<Input />
<InputGroupButton></InputGroupButton>
<InputGroupAddon addonType="prepend"></InputGroupAddon>
</InputGroup>
<br />
<InputGroup>
<InputGroupButton></InputGroupButton>
<InputGroupAddon addonType="prepend"></InputGroupAddon>
<Input placeholder="and..." />
<InputGroupButton><Button color="secondary">I'm a button</Button></InputGroupButton>
<InputGroupAddon addonType="append"><Button color="secondary">I'm a button</Button></InputGroupAddon>
</InputGroup>
</div>
);
@@ -1567,19 +1569,19 @@ const Example58 = (props: any) => {
return (
<div>
<InputGroup>
<InputGroupButton>To the Left!</InputGroupButton>
<InputGroupAddon addonType="prepend">To the Left!</InputGroupAddon>
<Input />
</InputGroup>
<br />
<InputGroup>
<Input />
<InputGroupButton color="secondary">To the Right!</InputGroupButton>
<InputGroupAddon addonType="append" color="secondary">To the Right!</InputGroupAddon>
</InputGroup>
<br />
<InputGroup>
<InputGroupButton color="danger">To the Left!</InputGroupButton>
<InputGroupAddon addonType="prepend" color="danger">To the Left!</InputGroupAddon>
<Input placeholder="and..." />
<InputGroupButton color="success">To the Right!</InputGroupButton>
<InputGroupAddon addonType="append" color="success">To the Right!</InputGroupAddon>
</InputGroup>
</div>
);
@@ -2242,7 +2244,7 @@ class Example79 extends React.Component<any, any> {
<NavItem>
<NavLink href="#" active>Link</NavLink>
</NavItem>
<NavDropdown isOpen={this.state.dropdownOpen} toggle={this.toggle}>
<Dropdown nav isOpen={this.state.dropdownOpen} toggle={this.toggle}>
<DropdownToggle nav caret>
Dropdown
</DropdownToggle>
@@ -2253,7 +2255,7 @@ class Example79 extends React.Component<any, any> {
<DropdownItem divider />
<DropdownItem>Another Action</DropdownItem>
</DropdownMenu>
</NavDropdown>
</Dropdown>
<NavItem>
<NavLink href="#">Link</NavLink>
</NavItem>
@@ -2292,7 +2294,7 @@ class Example80 extends React.Component<any, any> {
<NavItem>
<NavLink href="#" active>Link</NavLink>
</NavItem>
<NavDropdown isOpen={this.state.dropdownOpen} toggle={this.toggle}>
<Dropdown nav isOpen={this.state.dropdownOpen} toggle={this.toggle}>
<DropdownToggle nav caret>
Dropdown
</DropdownToggle>
@@ -2303,7 +2305,7 @@ class Example80 extends React.Component<any, any> {
<DropdownItem divider />
<DropdownItem>Another Action</DropdownItem>
</DropdownMenu>
</NavDropdown>
</Dropdown>
<NavItem>
<NavLink href="#">Link</NavLink>
</NavItem>
@@ -3614,3 +3616,46 @@ class Example115 extends React.Component<any, any> {
);
}
}
const Example116 = (props: any) => {
return(
<div>
<InputGroup>
<InputGroupAddon addonType="prepend"><Button>I'm a button</Button></InputGroupAddon>
<Input />
</InputGroup>
<br />
<InputGroup>
<Input />
<InputGroupButtonDropdown addonType="append" isOpen={false}>
<DropdownToggle caret>
Button Dropdown
</DropdownToggle>
<DropdownMenu>
<DropdownItem header>Header</DropdownItem>
<DropdownItem disabled>Action</DropdownItem>
<DropdownItem>Another Action</DropdownItem>
<DropdownItem divider />
<DropdownItem>Another Action</DropdownItem>
</DropdownMenu>
</InputGroupButtonDropdown>
</InputGroup>
<br />
<InputGroup>
<InputGroupButtonDropdown addonType="prepend" isOpen={true}>
<Button outline>Split Button</Button>
<DropdownToggle split outline />
<DropdownMenu>
<DropdownItem header>Header</DropdownItem>
<DropdownItem disabled>Action</DropdownItem>
<DropdownItem>Another Action</DropdownItem>
<DropdownItem divider />
<DropdownItem>Another Action</DropdownItem>
</DropdownMenu>
</InputGroupButtonDropdown>
<Input placeholder="and..." />
<InputGroupAddon addonType="append"><Button color="secondary">I'm a button</Button></InputGroupAddon>
</InputGroup>
</div>
);
};