mirror of
https://github.com/wassname/DefinitelyTyped.git
synced 2026-08-20 12:00:53 +08:00
Add rebass (#8925)
* Add type definitions for 'rebass' module https://github.com/jxnblk/rebass * Add tests for rebass.d.ts
This commit is contained in:
Linda_pp
committed by
Masahiro Wakame
Masahiro Wakame
parent
f5b469b012
commit
29db5e426c
@@ -0,0 +1,625 @@
|
||||
///<reference path='rebass.d.ts' />
|
||||
|
||||
import * as React from "react";
|
||||
import {
|
||||
Arrow
|
||||
, Avatar
|
||||
, Badge
|
||||
, Banner
|
||||
, Block
|
||||
, Blockquote
|
||||
, Breadcrumbs
|
||||
, Button
|
||||
, ButtonCircle
|
||||
, ButtonOutline
|
||||
, Card
|
||||
, CardImage
|
||||
, Checkbox
|
||||
, Close
|
||||
, Container
|
||||
, Divider
|
||||
, Donut
|
||||
, DotIndicator
|
||||
, Drawer
|
||||
, Dropdown
|
||||
, DropdownMenu
|
||||
, Embed
|
||||
, Fixed
|
||||
, Footer
|
||||
, Heading
|
||||
, HeadingLink
|
||||
, InlineForm
|
||||
, Input
|
||||
, Label
|
||||
, LinkBlock
|
||||
, Media
|
||||
, Menu
|
||||
, Message
|
||||
, NavItem
|
||||
, Overlay
|
||||
, PageHeader
|
||||
, Panel
|
||||
, PanelFooter
|
||||
, PanelHeader
|
||||
, Pre
|
||||
, Progress
|
||||
, Radio
|
||||
, Rating
|
||||
, Section
|
||||
, SectionHeader
|
||||
, Select
|
||||
, SequenceMap
|
||||
, SequenceMapStep
|
||||
, Slider
|
||||
, Space
|
||||
, Stat
|
||||
, Switch
|
||||
, Table
|
||||
, Text
|
||||
, Textarea
|
||||
, Toolbar
|
||||
, Tooltip
|
||||
} from "rebass";
|
||||
|
||||
interface IconProps extends React.Props<Icon> {
|
||||
fill: string;
|
||||
height: string;
|
||||
name: string;
|
||||
width: string;
|
||||
}
|
||||
|
||||
class Icon extends React.Component<IconProps, {}> {
|
||||
render() {
|
||||
return <div></div>;
|
||||
}
|
||||
}
|
||||
|
||||
class RebassTest extends React.Component<{}, {}> {
|
||||
render() {
|
||||
return <div>
|
||||
<Button
|
||||
backgroundColor="primary"
|
||||
color="white"
|
||||
inverted={true}
|
||||
rounded={true}
|
||||
>
|
||||
Arrow
|
||||
<Arrow direction="down" />
|
||||
</Button>
|
||||
|
||||
<Avatar
|
||||
circle={true}
|
||||
size={48}
|
||||
src="http://lorempixel.com/64/64/cats"
|
||||
/>
|
||||
|
||||
<div>
|
||||
<Heading level={4}>
|
||||
Rebass
|
||||
</Heading>
|
||||
<Space x={1} />
|
||||
<Badge
|
||||
rounded={true}
|
||||
theme="info"
|
||||
>
|
||||
0.2.0
|
||||
</Badge>
|
||||
<Space x={2} />
|
||||
<Heading level={4}>
|
||||
Pill
|
||||
</Heading>
|
||||
<Space x={1} />
|
||||
<Badge
|
||||
pill={true}
|
||||
rounded={true}
|
||||
theme="info"
|
||||
>
|
||||
Pill
|
||||
</Badge>
|
||||
<Space x={2} />
|
||||
<Heading level={4}>
|
||||
Circular
|
||||
</Heading>
|
||||
<Space x={1} />
|
||||
<Badge
|
||||
circle={true}
|
||||
rounded={true}
|
||||
theme="error"
|
||||
>
|
||||
4
|
||||
</Badge>
|
||||
</div>
|
||||
|
||||
<Banner
|
||||
align="center"
|
||||
backgroundImage="https://d262ilb51hltx0.cloudfront.net/max/2000/1*DZwdGMaeu-rvTroJYui6Uw.jpeg"
|
||||
>
|
||||
<Heading
|
||||
level={2}
|
||||
size={0}
|
||||
>
|
||||
Rebass
|
||||
</Heading>
|
||||
</Banner>
|
||||
|
||||
<Block
|
||||
borderLeft={true}
|
||||
color="blue"
|
||||
px={2}
|
||||
>
|
||||
<Media img="http://placehold.it/128/08e/fff">
|
||||
<Heading
|
||||
level={2}
|
||||
size={0}
|
||||
>
|
||||
Block
|
||||
</Heading>
|
||||
<Text>
|
||||
Generic box for containing things
|
||||
</Text>
|
||||
</Media>
|
||||
</Block>
|
||||
|
||||
<Blockquote
|
||||
href="http://webtypography.net/3.1.1"
|
||||
source="Robert Bringhurst"
|
||||
>
|
||||
In the sixteenth century, a series of common sizes developed among European typographers, and the series survived with little change and few additions for 400 years. […] Use the old familiar scale, or use new scales of your own devising, but limit yourself, at first, to a modest set of distinct and related intervals.
|
||||
</Blockquote>
|
||||
|
||||
<Breadcrumbs links={[{children: 'Jxnblk', href: '#!'}, {children: 'Rebass', href: '#!'}, {children: 'Breadcrumbs', href: '#!'}]} />
|
||||
|
||||
<div>
|
||||
<Button
|
||||
backgroundColor="primary"
|
||||
color="white"
|
||||
inverted={true}
|
||||
rounded={true}
|
||||
>
|
||||
Button
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<ButtonCircle title="Like">
|
||||
<Icon
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
name="heart"
|
||||
width="1em"
|
||||
/>
|
||||
</ButtonCircle>
|
||||
<ButtonCircle title="Comment">
|
||||
<Icon
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
name="chat"
|
||||
width="1em"
|
||||
/>
|
||||
</ButtonCircle>
|
||||
<ButtonCircle title="Repost">
|
||||
<Icon
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
name="repost"
|
||||
width="1em"
|
||||
/>
|
||||
</ButtonCircle>
|
||||
<ButtonCircle title="Bookmark">
|
||||
<Icon
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
name="bookmark"
|
||||
width="1em"
|
||||
/>
|
||||
</ButtonCircle>
|
||||
<ButtonCircle title="Tag">
|
||||
<Icon
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
name="tag"
|
||||
width="1em"
|
||||
/>
|
||||
</ButtonCircle>
|
||||
<Text small={true}>
|
||||
Example Icon component from react-geomicons
|
||||
</Text>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<ButtonOutline
|
||||
color="primary"
|
||||
inverted={false}
|
||||
rounded="left"
|
||||
>
|
||||
Button
|
||||
</ButtonOutline>
|
||||
<ButtonOutline
|
||||
color="primary"
|
||||
inverted={false}
|
||||
rounded={false}
|
||||
style={{marginLeft: -1}}
|
||||
>
|
||||
Group
|
||||
</ButtonOutline>
|
||||
<Button
|
||||
backgroundColor="primary"
|
||||
color="white"
|
||||
inverted={true}
|
||||
rounded="right"
|
||||
style={{marginLeft: -1}}
|
||||
>
|
||||
Button
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
<Card
|
||||
rounded={true}
|
||||
width={256}
|
||||
>
|
||||
<CardImage src="http://placehold.it/320/08e/fff" />
|
||||
<Heading
|
||||
level={2}
|
||||
size={3}
|
||||
>
|
||||
Card
|
||||
</Heading>
|
||||
<Text>
|
||||
Cats like cards too
|
||||
</Text>
|
||||
</Card>
|
||||
|
||||
<div style={{maxWidth: 192}}>
|
||||
<CardImage src="http://placehold.it/320/08e/fff" />
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Checkbox
|
||||
label="Checkbox"
|
||||
name="checkbox_1"
|
||||
/>
|
||||
<Checkbox
|
||||
checked={true}
|
||||
label="Checkbox"
|
||||
name="checkbox_1"
|
||||
readOnly={true}
|
||||
theme="success"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Close />
|
||||
|
||||
<Container>
|
||||
Container
|
||||
</Container>
|
||||
|
||||
<div>
|
||||
<Divider />
|
||||
<Divider
|
||||
ml={0}
|
||||
width={128}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Donut
|
||||
color="primary"
|
||||
size={256}
|
||||
strokeWidth={32}
|
||||
value={0.5625}
|
||||
/>
|
||||
<Donut
|
||||
color="primary"
|
||||
size={128}
|
||||
strokeWidth={8}
|
||||
value={0.5625}
|
||||
>
|
||||
9/16
|
||||
</Donut>
|
||||
<Donut
|
||||
color="primary"
|
||||
size={128}
|
||||
strokeWidth={8}
|
||||
value={0.625}
|
||||
/>
|
||||
<Donut
|
||||
color="primary"
|
||||
size={128}
|
||||
strokeWidth={8}
|
||||
value={0.125}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<DotIndicator
|
||||
active={0}
|
||||
length={3}
|
||||
onClick={function noRefCheck() {}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Dropdown>
|
||||
<Button
|
||||
backgroundColor="primary"
|
||||
color="white"
|
||||
inverted={true}
|
||||
rounded={true}
|
||||
>
|
||||
Dropdown
|
||||
<Arrow direction="down" />
|
||||
</Button>
|
||||
<DropdownMenu
|
||||
onDismiss={function noRefCheck() {}}
|
||||
open={false}
|
||||
>
|
||||
<NavItem is="a">
|
||||
Hello
|
||||
</NavItem>
|
||||
<NavItem is="a">
|
||||
Hi
|
||||
</NavItem>
|
||||
</DropdownMenu>
|
||||
</Dropdown>
|
||||
|
||||
<Embed ratio={0.5625}>
|
||||
<iframe
|
||||
allowFullScreen={true}
|
||||
src="https://www.youtube.com/embed/KO_3Qgib6RQ"
|
||||
/>
|
||||
</Embed>
|
||||
|
||||
<Footer>
|
||||
Footer™ ©2016 Jxnblk
|
||||
</Footer>
|
||||
|
||||
<InlineForm
|
||||
buttonLabel="Go"
|
||||
label="InlineForm"
|
||||
name="inline_form"
|
||||
onChange={function noRefCheck() {}}
|
||||
onClick={function noRefCheck() {}}
|
||||
/>
|
||||
|
||||
<Input
|
||||
label="Input"
|
||||
name="input_example"
|
||||
placeholder="Placeholder"
|
||||
rounded={true}
|
||||
type="text"
|
||||
/>
|
||||
|
||||
<Label>
|
||||
Label for form elements
|
||||
</Label>
|
||||
|
||||
<LinkBlock
|
||||
href="#LinkBlock"
|
||||
is="a"
|
||||
>
|
||||
<Media
|
||||
align="center"
|
||||
img="http://placehold.it/96/08e/fff"
|
||||
>
|
||||
<Heading level={3}>
|
||||
LinkBlock
|
||||
</Heading>
|
||||
</Media>
|
||||
</LinkBlock>
|
||||
|
||||
<Media
|
||||
align="center"
|
||||
img="http://placehold.it/128/08e/fff"
|
||||
>
|
||||
<Heading level={3}>
|
||||
Media Object
|
||||
</Heading>
|
||||
<Text>
|
||||
With alignment options
|
||||
</Text>
|
||||
</Media>
|
||||
|
||||
<Menu rounded={true}>
|
||||
<NavItem is="a">
|
||||
Menu
|
||||
</NavItem>
|
||||
<NavItem is="a">
|
||||
NavItem
|
||||
</NavItem>
|
||||
<NavItem is="a">
|
||||
NavItem
|
||||
</NavItem>
|
||||
</Menu>
|
||||
|
||||
<Message
|
||||
inverted={true}
|
||||
rounded={true}
|
||||
theme="success"
|
||||
>
|
||||
Hello Message!
|
||||
<Space
|
||||
auto={true}
|
||||
x={1}
|
||||
/>
|
||||
<Close />
|
||||
</Message>
|
||||
|
||||
<PageHeader
|
||||
description="Description about the page"
|
||||
heading="Page Header"
|
||||
/>
|
||||
|
||||
<Panel theme="info">
|
||||
<PanelHeader
|
||||
inverted={true}
|
||||
theme="default"
|
||||
>
|
||||
Panel
|
||||
</PanelHeader>
|
||||
<Text>
|
||||
Panels are great for visually separating UI, content, or data from the rest of the page.
|
||||
</Text>
|
||||
<PanelFooter theme="default">
|
||||
The footer is a good place for less important information
|
||||
</PanelFooter>
|
||||
</Panel>
|
||||
|
||||
<Pre>
|
||||
this is text
|
||||
this is text
|
||||
this is text
|
||||
</Pre>
|
||||
|
||||
<Progress
|
||||
color="primary"
|
||||
value={0.25}
|
||||
/>
|
||||
|
||||
<div>
|
||||
<Radio
|
||||
checked={true}
|
||||
circle={true}
|
||||
group="radios"
|
||||
label="Radio"
|
||||
name="radio_1"
|
||||
readOnly={true}
|
||||
/>
|
||||
<Radio
|
||||
circle={true}
|
||||
group="radios"
|
||||
label="Radio"
|
||||
name="radio_2"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Rating
|
||||
color="orange"
|
||||
value={3.5}
|
||||
/>
|
||||
|
||||
<Section>
|
||||
Section
|
||||
</Section>
|
||||
|
||||
<Section>
|
||||
<SectionHeader
|
||||
description="With linked header"
|
||||
heading="Section Header"
|
||||
/>
|
||||
Section
|
||||
</Section>
|
||||
|
||||
<Select
|
||||
label="Select"
|
||||
name="select_example"
|
||||
options={[{children: 'Two', value: 2}, {children: 'Four', value: 4}, {children: 'Eight', value: 8}, {children: 'Sixteen', value: 16}, {children: 'Thirty-Two', value: 32}, {children: 'Sixty-Four', value: 64}]}
|
||||
rounded={true}
|
||||
/>
|
||||
|
||||
<SequenceMap
|
||||
active={1}
|
||||
steps={[{children: 'Sign In', href: '#!'}, {children: 'Shipping Address', href: '#!'}, {children: 'Payment Method', href: '#!'}, {children: 'Place Order', href: '#!'}]}
|
||||
/>
|
||||
|
||||
<div>
|
||||
<Slider
|
||||
defaultValue={37.5}
|
||||
label="Slider"
|
||||
name="slider_1"
|
||||
/>
|
||||
<Slider
|
||||
color="blue"
|
||||
fill={true}
|
||||
label="Slider with color and fill"
|
||||
name="slider_2"
|
||||
readOnly={true}
|
||||
value={62.5}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Button
|
||||
backgroundColor="primary"
|
||||
color="white"
|
||||
inverted={true}
|
||||
rounded={true}
|
||||
>
|
||||
Button
|
||||
</Button>
|
||||
<Space x={1} />
|
||||
<Button
|
||||
backgroundColor="primary"
|
||||
color="white"
|
||||
inverted={true}
|
||||
rounded={true}
|
||||
>
|
||||
With
|
||||
</Button>
|
||||
<Space x={4} />
|
||||
<Button
|
||||
backgroundColor="primary"
|
||||
color="white"
|
||||
inverted={true}
|
||||
rounded={true}
|
||||
>
|
||||
Space
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<Stat
|
||||
label="Memory"
|
||||
unit="GB"
|
||||
value="512"
|
||||
/>
|
||||
<Stat
|
||||
label="PetaFLOPS"
|
||||
value="32"
|
||||
/>
|
||||
<Stat
|
||||
label="Upload"
|
||||
unit="Mbps"
|
||||
value="512"
|
||||
/>
|
||||
<Stat
|
||||
label="Download"
|
||||
unit="Mbps"
|
||||
value="1,024"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Switch checked={false}/>
|
||||
|
||||
<Table
|
||||
data={[['Hamburger', 'Beef', 'Onion', 'Bun'], ['Pizza', 'Pork', 'Tomato', 'Crust'], ['Corndog', 'Pork', 'Corn', 'Cornbread'], ['Hot Dog', 'Pork', 'Peppers', 'Bun']]}
|
||||
headings={['Name', 'Meat', 'Vegetable', 'Carb']}
|
||||
/>
|
||||
|
||||
<Toolbar>
|
||||
<NavItem is="a">
|
||||
Toolbar
|
||||
</NavItem>
|
||||
<NavItem is="a">
|
||||
NavItem
|
||||
</NavItem>
|
||||
<Space
|
||||
auto={true}
|
||||
x={1}
|
||||
/>
|
||||
<NavItem is="a">
|
||||
NavItem
|
||||
</NavItem>
|
||||
</Toolbar>
|
||||
|
||||
<Tooltip
|
||||
inverted={true}
|
||||
rounded={true}
|
||||
title="Hello!"
|
||||
>
|
||||
<Heading level={3}>
|
||||
Tooltip
|
||||
</Heading>
|
||||
</Tooltip>
|
||||
</div>;
|
||||
}
|
||||
}
|
||||
|
||||
Vendored
+497
@@ -0,0 +1,497 @@
|
||||
// Type definitions for Rebass 0.2.5
|
||||
// Project: https://github.com/jxnblk/rebass
|
||||
// Definitions by: rhysd <https://rhysd.github.io>
|
||||
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
|
||||
|
||||
///<reference path='../react/react.d.ts' />
|
||||
|
||||
declare module "rebass" {
|
||||
export import React = __React;
|
||||
|
||||
export interface BaseProps<C> extends React.Props<C> {
|
||||
tagName?: string;
|
||||
className?: string;
|
||||
baseStyle?: Object;
|
||||
style?: Object;
|
||||
m?: number;
|
||||
mt?: number;
|
||||
mr?: number;
|
||||
mb?: number;
|
||||
ml?: number;
|
||||
mx?: number;
|
||||
my?: number;
|
||||
p?: number;
|
||||
pt?: number;
|
||||
pr?: number;
|
||||
pb?: number;
|
||||
pl?: number;
|
||||
px?: number;
|
||||
py?: number;
|
||||
color?: string;
|
||||
backgroundColor?: string;
|
||||
inverted?: boolean;
|
||||
rounded?: boolean | "top" | "right" | "bottom" | "left";
|
||||
circle?: boolean;
|
||||
pill?: boolean;
|
||||
}
|
||||
|
||||
export interface ArrowProps extends BaseProps<ArrowClass> {
|
||||
direction?: "up" | "down";
|
||||
}
|
||||
type ArrowClass = React.StatelessComponent<ArrowProps>
|
||||
export const Arrow: ArrowClass;
|
||||
|
||||
export interface AvatarProps extends BaseProps<AvatarClass> {
|
||||
size?: number;
|
||||
src?: string;
|
||||
}
|
||||
type AvatarClass = React.StatelessComponent<AvatarProps>
|
||||
export const Avatar: AvatarClass;
|
||||
|
||||
export interface BadgeProps extends BaseProps<BadgeClass> {
|
||||
theme?: "primary" | "secondary" | "default" | "info" | "success" | "warning" | "error";
|
||||
rounded?: boolean | "top" | "right" | "bottom" | "left";
|
||||
pill?: boolean;
|
||||
circle?: boolean;
|
||||
}
|
||||
type BadgeClass = React.StatelessComponent<BadgeProps>
|
||||
export const Badge: BadgeClass;
|
||||
|
||||
export interface BannerProps extends BaseProps<BannerClass> {
|
||||
align?: "left" | "center" | "right";
|
||||
backgroundImage: string;
|
||||
}
|
||||
type BannerClass = React.StatelessComponent<BannerProps>
|
||||
export const Banner: BannerClass;
|
||||
|
||||
export interface BlockProps extends BaseProps<BlockClass> {
|
||||
m?: number;
|
||||
mt?: number;
|
||||
mr?: number;
|
||||
mb?: number;
|
||||
ml?: number;
|
||||
mx?: number;
|
||||
my?: number;
|
||||
p?: number;
|
||||
pt?: number;
|
||||
pr?: number;
|
||||
pb?: number;
|
||||
pl?: number;
|
||||
px?: number;
|
||||
py?: number;
|
||||
color?: string;
|
||||
backgroundColor?: string;
|
||||
borderColor?: string;
|
||||
border?: boolean;
|
||||
borderTop?: boolean;
|
||||
borderRight?: boolean;
|
||||
borderBottom?: boolean;
|
||||
borderLeft?: boolean;
|
||||
rounded?: boolean | "top" | "right" | "bottom" | "left";
|
||||
}
|
||||
type BlockClass = React.StatelessComponent<BlockProps>
|
||||
export const Block: BlockClass;
|
||||
|
||||
export interface BlockquoteProps extends BaseProps<BlockquoteClass> {
|
||||
source: string;
|
||||
href: string;
|
||||
}
|
||||
type BlockquoteClass = React.StatelessComponent<BlockquoteProps>
|
||||
export const Blockquote: BlockquoteClass;
|
||||
|
||||
export interface BreadcrumbsProps extends BaseProps<BreadcrumbsClass> {
|
||||
links: {
|
||||
children: any;
|
||||
href: string;
|
||||
}[];
|
||||
}
|
||||
type BreadcrumbsClass = React.StatelessComponent<BreadcrumbsProps>
|
||||
export const Breadcrumbs: BreadcrumbsClass;
|
||||
|
||||
export interface ButtonProps extends BaseProps<ButtonClass> {
|
||||
href?: string;
|
||||
color?: string;
|
||||
backgroundColor?: string;
|
||||
rounded?: boolean | "top" | "right" | "bottom" | "left";
|
||||
pill?: boolean;
|
||||
big?: boolean;
|
||||
theme?: "primary" | "secondary" | "default" | "info" | "success" | "warning" | "error";
|
||||
}
|
||||
type ButtonClass = React.StatelessComponent<ButtonProps>
|
||||
export const Button: ButtonClass;
|
||||
|
||||
export interface ButtonCircleProps extends BaseProps<ButtonCircleClass> {
|
||||
title?: string;
|
||||
href?: string;
|
||||
color?: string;
|
||||
backgroundColor?: string;
|
||||
size?: number;
|
||||
}
|
||||
type ButtonCircleClass = React.StatelessComponent<ButtonCircleProps>
|
||||
export const ButtonCircle: ButtonCircleClass;
|
||||
|
||||
export interface ButtonOutlineProps extends BaseProps<ButtonOutlineClass> {
|
||||
href?: string;
|
||||
color?: string;
|
||||
rounded?: boolean | "top" | "right" | "bottom" | "left";
|
||||
pill?: boolean;
|
||||
big?: boolean;
|
||||
}
|
||||
type ButtonOutlineClass = React.StatelessComponent<ButtonOutlineProps>
|
||||
export const ButtonOutline: ButtonOutlineClass;
|
||||
|
||||
export interface CardProps extends BaseProps<CardClass> {
|
||||
width?: number | string;
|
||||
}
|
||||
type CardClass = React.StatelessComponent<CardProps>
|
||||
export const Card: CardClass;
|
||||
|
||||
export interface CardImageProps extends BaseProps<CardImageClass> {
|
||||
src?: string;
|
||||
}
|
||||
type CardImageClass = React.StatelessComponent<CardImageProps>
|
||||
export const CardImage: CardImageClass;
|
||||
|
||||
export interface CheckboxProps extends BaseProps<CheckboxClass> {
|
||||
label?: string;
|
||||
checked?: boolean;
|
||||
name?: string;
|
||||
readOnly?: boolean;
|
||||
theme?: "primary" | "secondary" | "default" | "info" | "success" | "warning" | "error";
|
||||
}
|
||||
type CheckboxClass = React.StatelessComponent<CheckboxProps>
|
||||
export const Checkbox: CheckboxClass;
|
||||
|
||||
export interface CloseProps extends BaseProps<CloseClass> {
|
||||
}
|
||||
type CloseClass = React.StatelessComponent<CloseProps>
|
||||
export const Close: CloseClass;
|
||||
|
||||
export interface ContainerProps extends BaseProps<ContainerClass> {
|
||||
}
|
||||
type ContainerClass = React.StatelessComponent<ContainerProps>
|
||||
export const Container: ContainerClass;
|
||||
|
||||
export interface DividerProps extends BaseProps<DividerClass> {
|
||||
width?: number;
|
||||
}
|
||||
type DividerClass = React.StatelessComponent<DividerProps>
|
||||
export const Divider: DividerClass;
|
||||
|
||||
export interface DonutProps extends BaseProps<DonutClass> {
|
||||
value?: number;
|
||||
size?: number;
|
||||
strokeWidth?: number;
|
||||
color?: string;
|
||||
}
|
||||
type DonutClass = React.StatelessComponent<DonutProps>
|
||||
export const Donut: DonutClass;
|
||||
|
||||
export interface DotIndicatorProps extends BaseProps<DotIndicatorClass> {
|
||||
length?: number;
|
||||
active?: number;
|
||||
onClick?: Function;
|
||||
}
|
||||
type DotIndicatorClass = React.StatelessComponent<DotIndicatorProps>
|
||||
export const DotIndicator: DotIndicatorClass;
|
||||
|
||||
export interface DrawerProps extends BaseProps<DrawerClass> {
|
||||
size?: number;
|
||||
open?: boolean;
|
||||
position?: "top" | "right" | "bottom" | "left";
|
||||
onDismiss?: Function;
|
||||
}
|
||||
type DrawerClass = React.StatelessComponent<DrawerProps>
|
||||
export const Drawer: DrawerClass;
|
||||
|
||||
export interface DropdownProps extends BaseProps<DropdownClass> {
|
||||
}
|
||||
type DropdownClass = React.StatelessComponent<DropdownProps>
|
||||
export const Dropdown: DropdownClass;
|
||||
|
||||
export interface DropdownMenuProps extends BaseProps<DropdownMenuClass> {
|
||||
open?: boolean;
|
||||
right?: boolean;
|
||||
top?: boolean;
|
||||
onDismiss?: Function;
|
||||
}
|
||||
type DropdownMenuClass = React.StatelessComponent<DropdownMenuProps>
|
||||
export const DropdownMenu: DropdownMenuClass;
|
||||
|
||||
export interface EmbedProps extends BaseProps<EmbedClass> {
|
||||
ratio?: number;
|
||||
}
|
||||
type EmbedClass = React.StatelessComponent<EmbedProps>
|
||||
export const Embed: EmbedClass;
|
||||
|
||||
export interface FixedProps extends BaseProps<FixedClass> {
|
||||
top?: boolean;
|
||||
right?: boolean;
|
||||
bottom?: boolean;
|
||||
left?: boolean;
|
||||
zIndex?: number;
|
||||
}
|
||||
type FixedClass = React.StatelessComponent<FixedProps>
|
||||
export const Fixed: FixedClass;
|
||||
|
||||
export interface FooterProps extends BaseProps<FooterClass> {
|
||||
}
|
||||
type FooterClass = React.StatelessComponent<FooterProps>
|
||||
export const Footer: FooterClass;
|
||||
|
||||
export interface HeadingProps extends BaseProps<HeadingClass> {
|
||||
big?: boolean;
|
||||
level?: number;
|
||||
size?: number;
|
||||
alt?: boolean;
|
||||
}
|
||||
type HeadingClass = React.StatelessComponent<HeadingProps>
|
||||
export const Heading: HeadingClass;
|
||||
|
||||
export interface HeadingLinkProps extends BaseProps<HeadingLinkClass> {
|
||||
level?: number;
|
||||
size?: number;
|
||||
href?: string;
|
||||
}
|
||||
type HeadingLinkClass = React.StatelessComponent<HeadingLinkProps>
|
||||
export const HeadingLink: HeadingLinkClass;
|
||||
|
||||
export interface InlineFormProps extends BaseProps<InlineFormClass> {
|
||||
label?: string;
|
||||
name?: string;
|
||||
value?: number | string;
|
||||
placeholder?: string;
|
||||
onChange?: Function;
|
||||
buttonLabel?: string;
|
||||
onClick?: Function;
|
||||
}
|
||||
type InlineFormClass = React.StatelessComponent<InlineFormProps>
|
||||
export const InlineForm: InlineFormClass;
|
||||
|
||||
export interface InputProps extends BaseProps<InputClass> {
|
||||
label?: string;
|
||||
name?: string;
|
||||
type?: string;
|
||||
message?: string;
|
||||
hideLabel?: boolean;
|
||||
rounded?: boolean | "top" | "right" | "bottom" | "left";
|
||||
placeholder?: string;
|
||||
}
|
||||
type InputClass = React.StatelessComponent<InputProps>
|
||||
export const Input: InputClass;
|
||||
|
||||
export interface LabelProps extends BaseProps<LabelClass> {
|
||||
hide?: boolean;
|
||||
}
|
||||
type LabelClass = React.StatelessComponent<LabelProps>
|
||||
export const Label: LabelClass;
|
||||
|
||||
export interface LinkBlockProps extends BaseProps<LinkBlockClass> {
|
||||
is?: string | Object | Function;
|
||||
href?: string;
|
||||
}
|
||||
type LinkBlockClass = React.StatelessComponent<LinkBlockProps>
|
||||
export const LinkBlock: LinkBlockClass;
|
||||
|
||||
export interface MediaProps extends BaseProps<MediaClass> {
|
||||
img?: string;
|
||||
right?: boolean;
|
||||
align?: "top" | "center" | "bottom";
|
||||
}
|
||||
type MediaClass = React.StatelessComponent<MediaProps>
|
||||
export const Media: MediaClass;
|
||||
|
||||
export interface MenuProps extends BaseProps<MenuClass> {
|
||||
}
|
||||
type MenuClass = React.StatelessComponent<MenuProps>
|
||||
export const Menu: MenuClass;
|
||||
|
||||
export interface MessageProps extends BaseProps<MessageClass> {
|
||||
theme?: "primary" | "secondary" | "default" | "info" | "success" | "warning" | "error";
|
||||
}
|
||||
type MessageClass = React.StatelessComponent<MessageProps>
|
||||
export const Message: MessageClass;
|
||||
|
||||
export interface NavItemProps extends BaseProps<NavItemClass> {
|
||||
small?: boolean;
|
||||
is?: string | Object | Function;
|
||||
}
|
||||
type NavItemClass = React.StatelessComponent<NavItemProps>
|
||||
export const NavItem: NavItemClass;
|
||||
|
||||
export interface OverlayProps extends BaseProps<OverlayClass> {
|
||||
open?: boolean;
|
||||
dark?: boolean;
|
||||
box?: boolean;
|
||||
fullWidth?: boolean;
|
||||
onDismiss?: Function;
|
||||
}
|
||||
type OverlayClass = React.StatelessComponent<OverlayProps>
|
||||
export const Overlay: OverlayClass;
|
||||
|
||||
export interface PageHeaderProps extends BaseProps<PageHeaderClass> {
|
||||
heading?: string;
|
||||
description?: string;
|
||||
}
|
||||
type PageHeaderClass = React.StatelessComponent<PageHeaderProps>
|
||||
export const PageHeader: PageHeaderClass;
|
||||
|
||||
export interface PanelProps extends BaseProps<PanelClass> {
|
||||
theme?: "primary" | "secondary" | "default" | "info" | "success" | "warning" | "error";
|
||||
}
|
||||
type PanelClass = React.StatelessComponent<PanelProps>
|
||||
export const Panel: PanelClass;
|
||||
|
||||
export interface PanelFooterProps extends BaseProps<PanelFooterClass> {
|
||||
theme?: "primary" | "secondary" | "default" | "info" | "success" | "warning" | "error";
|
||||
}
|
||||
type PanelFooterClass = React.StatelessComponent<PanelFooterProps>
|
||||
export const PanelFooter: PanelFooterClass;
|
||||
|
||||
export interface PanelHeaderProps extends BaseProps<PanelHeaderClass> {
|
||||
theme?: "primary" | "secondary" | "default" | "info" | "success" | "warning" | "error";
|
||||
}
|
||||
type PanelHeaderClass = React.StatelessComponent<PanelHeaderProps>
|
||||
export const PanelHeader: PanelHeaderClass;
|
||||
|
||||
export interface PreProps extends BaseProps<PreClass> {
|
||||
}
|
||||
type PreClass = React.StatelessComponent<PreProps>
|
||||
export const Pre: PreClass;
|
||||
|
||||
export interface ProgressProps extends BaseProps<ProgressClass> {
|
||||
value?: number;
|
||||
color?: string;
|
||||
}
|
||||
type ProgressClass = React.StatelessComponent<ProgressProps>
|
||||
export const Progress: ProgressClass;
|
||||
|
||||
export interface RadioProps extends BaseProps<RadioClass> {
|
||||
checked?: boolean;
|
||||
group?: string;
|
||||
label?: string;
|
||||
name?: string;
|
||||
readOnly?: boolean;
|
||||
}
|
||||
type RadioClass = React.StatelessComponent<RadioProps>
|
||||
export const Radio: RadioClass;
|
||||
|
||||
export interface RatingProps extends BaseProps<RatingClass> {
|
||||
value?: number;
|
||||
onClick?: Function;
|
||||
}
|
||||
type RatingClass = React.StatelessComponent<RatingProps>
|
||||
export const Rating: RatingClass;
|
||||
|
||||
export interface SectionProps extends BaseProps<SectionClass> {
|
||||
}
|
||||
type SectionClass = React.StatelessComponent<SectionProps>
|
||||
export const Section: SectionClass;
|
||||
|
||||
export interface SectionHeaderProps extends BaseProps<SectionHeaderClass> {
|
||||
heading?: string;
|
||||
href?: string;
|
||||
description?: string;
|
||||
}
|
||||
type SectionHeaderClass = React.StatelessComponent<SectionHeaderProps>
|
||||
export const SectionHeader: SectionHeaderClass;
|
||||
|
||||
export interface SelectProps extends BaseProps<SelectClass> {
|
||||
label?: string;
|
||||
name?: string;
|
||||
options?: {
|
||||
children: any;
|
||||
value: any;
|
||||
}[];
|
||||
message?: string;
|
||||
hideLabel?: boolean;
|
||||
}
|
||||
type SelectClass = React.StatelessComponent<SelectProps>
|
||||
export const Select: SelectClass;
|
||||
|
||||
export interface SequenceMapProps extends BaseProps<SequenceMapClass> {
|
||||
steps?: {
|
||||
children: any;
|
||||
href: string;
|
||||
}[];
|
||||
active?: number;
|
||||
}
|
||||
type SequenceMapClass = React.StatelessComponent<SequenceMapProps>
|
||||
export const SequenceMap: SequenceMapClass;
|
||||
|
||||
export interface SequenceMapStepProps extends BaseProps<SequenceMapStepClass> {
|
||||
width?: string;
|
||||
first?: boolean;
|
||||
active?: boolean;
|
||||
}
|
||||
type SequenceMapStepClass = React.StatelessComponent<SequenceMapStepProps>
|
||||
export const SequenceMapStep: SequenceMapStepClass;
|
||||
|
||||
export interface SliderProps extends BaseProps<SliderClass> {
|
||||
label?: string;
|
||||
name?: string;
|
||||
fill?: boolean;
|
||||
hideLabel?: boolean;
|
||||
value?: number;
|
||||
defaultValue?: number;
|
||||
readOnly?: boolean;
|
||||
}
|
||||
type SliderClass = React.StatelessComponent<SliderProps>
|
||||
export const Slider: SliderClass;
|
||||
|
||||
export interface SpaceProps extends BaseProps<SpaceClass> {
|
||||
x?: number;
|
||||
auto?: boolean;
|
||||
}
|
||||
type SpaceClass = React.StatelessComponent<SpaceProps>
|
||||
export const Space: SpaceClass;
|
||||
|
||||
export interface StatProps extends BaseProps<StatClass> {
|
||||
value?: number | string;
|
||||
unit?: string;
|
||||
label?: string;
|
||||
topLabel?: boolean;
|
||||
}
|
||||
type StatClass = React.StatelessComponent<StatProps>
|
||||
export const Stat: StatClass;
|
||||
|
||||
export interface SwitchProps extends BaseProps<SwitchClass> {
|
||||
checked?: boolean;
|
||||
}
|
||||
type SwitchClass = React.StatelessComponent<SwitchProps>
|
||||
export const Switch: SwitchClass;
|
||||
|
||||
export interface TableProps extends BaseProps<TableClass> {
|
||||
headings?: any[];
|
||||
data?: any[][];
|
||||
}
|
||||
type TableClass = React.StatelessComponent<TableProps>
|
||||
export const Table: TableClass;
|
||||
|
||||
export interface TextProps extends BaseProps<TextClass> {
|
||||
small?: boolean;
|
||||
bold?: boolean;
|
||||
}
|
||||
type TextClass = React.StatelessComponent<TextProps>
|
||||
export const Text: TextClass;
|
||||
|
||||
export interface TextareaProps extends BaseProps<TextareaClass> {
|
||||
label?: string;
|
||||
name?: string;
|
||||
message?: string;
|
||||
hideLabel?: boolean;
|
||||
}
|
||||
type TextareaClass = React.StatelessComponent<TextareaProps>
|
||||
export const Textarea: TextareaClass;
|
||||
|
||||
export interface ToolbarProps extends BaseProps<ToolbarClass> {
|
||||
}
|
||||
type ToolbarClass = React.StatelessComponent<ToolbarProps>
|
||||
export const Toolbar: ToolbarClass;
|
||||
|
||||
export interface TooltipProps extends BaseProps<TooltipClass> {
|
||||
title?: string;
|
||||
}
|
||||
type TooltipClass = React.StatelessComponent<TooltipProps>
|
||||
export const Tooltip: TooltipClass;
|
||||
}
|
||||
Reference in New Issue
Block a user