test(typings): initial tests for typings

index.d.ts

@@ -64,7 +64,7 @@ export { default as Flag, FlagProps } from './dist/commonjs/elements/Flag'
 
 export { default as Header, HeaderProps } from './dist/commonjs/elements/Header'
 export { default as HeaderContent, HeaderContentProps } from './dist/commonjs/elements/Header/HeaderContent'
-export { default as HeaderSubheader, HeaderSubHeaderProps } from './dist/commonjs/elements/Header/HeaderSubheader'
+export { default as HeaderSubheader, HeaderSubheaderProps } from './dist/commonjs/elements/Header/HeaderSubheader'
 
 export { default as Icon, IconProps } from './dist/commonjs/elements/Icon'
 export { default as IconGroup, IconGroupProps } from './dist/commonjs/elements/Icon/IconGroup'

src/collections/Breadcrumb/BreadcrumbSection.d.ts

@@ -15,6 +15,9 @@ export interface BreadcrumbSectionProps {
   /** Additional classes. */
   className?: string;
 
+  /** Shorthand for primary content. */
+  content?: any;
+
   /** Render as an `a` tag instead of a `div` and adds the href attribute. */
   href?: string;
 

src/collections/Form/FormButton.d.ts

@@ -4,6 +4,13 @@ import { ButtonProps } from '../../elements/Button';
 import { FormFieldProps } from './FormField';
 
 export interface FormButtonProps extends FormFieldProps, ButtonProps {
+  [key: string]: any;
+
+  /** An element type to render as (string or function). */
+  as?: any;
+
+  /** A FormField control prop. */
+  control?: any;
 }
 
 declare const FormButton: React.StatelessComponent<FormButtonProps>;

src/collections/Form/FormCheckbox.d.ts

@@ -4,7 +4,13 @@ import { CheckboxProps } from '../../modules/Checkbox';
 import { FormFieldProps } from './FormField';
 
 export interface FormCheckboxProps extends FormFieldProps, CheckboxProps {
-  type?: 'checkbox' | 'radio';
+  [key: string]: any;
+
+  /** An element type to render as (string or function). */
+  as?: any;
+
+  /** A FormField control prop. */
+  control?: any;
 }
 
 declare const FormCheckbox: React.StatelessComponent<FormCheckboxProps>;

src/collections/Form/FormDropdown.d.ts

@@ -4,6 +4,13 @@ import { DropdownProps } from '../../modules/Dropdown';
 import { FormFieldProps } from './FormField';
 
 export interface FormDropdownProps extends FormFieldProps, DropdownProps {
+  [key: string]: any;
+
+  /** An element type to render as (string or function). */
+  as?: any;
+
+  /** A FormField control prop. */
+  control?: any;
 }
 
 declare const FormDropdown: React.StatelessComponent<FormDropdownProps>;

src/collections/Form/FormInput.d.ts

@@ -4,6 +4,13 @@ import { InputProps } from '../../elements/Input';
 import { FormFieldProps } from './FormField';
 
 export interface FormInputProps extends FormFieldProps, InputProps {
+  [key: string]: any;
+
+  /** An element type to render as (string or function). */
+  as?: any;
+
+  /** A FormField control prop. */
+  control?: any;
 }
 
 declare const FormInput: React.StatelessComponent<FormInputProps>;

src/collections/Form/FormRadio.d.ts

@@ -4,7 +4,13 @@ import { RadioProps } from '../../addons/Radio';
 import { FormFieldProps } from './FormField';
 
 export interface FormRadioProps extends FormFieldProps, RadioProps {
-  type?: 'checkbox' | 'radio';
+  [key: string]: any;
+
+  /** An element type to render as (string or function). */
+  as?: any;
+
+  /** A FormField control prop. */
+  control?: any;
 }
 
 declare const FormRadio: React.StatelessComponent<FormRadioProps>;

src/collections/Form/FormSelect.d.ts

@@ -4,6 +4,13 @@ import { SelectProps } from '../../addons/Select';
 import { FormFieldProps } from './FormField';
 
 export interface FormSelectProps extends FormFieldProps, SelectProps {
+  [key: string]: any;
+
+  /** An element type to render as (string or function). */
+  as?: any;
+
+  /** A FormField control prop. */
+  control?: any;
 }
 
 declare const FormSelect: React.StatelessComponent<FormSelectProps>;

src/collections/Form/FormTextArea.d.ts

@@ -4,6 +4,13 @@ import { TextAreaProps } from '../../addons/TextArea';
 import { FormFieldProps } from './FormField';
 
 export interface FormTextAreaProps extends FormFieldProps, TextAreaProps {
+  [key: string]: any;
+
+  /** An element type to render as (string or function). */
+  as?: any;
+
+  /** A FormField control prop. */
+  control?: any;
 }
 
 declare const FormTextArea: React.StatelessComponent<FormTextAreaProps>;

src/collections/Message/Message.js

@@ -88,12 +88,12 @@ export default class Message extends Component {
     /** A message may be formatted to display a positive message.  Same as `success`. */
     positive: PropTypes.bool,
 
-    /** A message may be formatted to display a positive message.  Same as `positive`. */
-    success: PropTypes.bool,
-
     /** A message can have different sizes. */
     size: PropTypes.oneOf(_.without(SUI.SIZES, 'medium')),
 
+    /** A message may be formatted to display a positive message.  Same as `positive`. */
+    success: PropTypes.bool,
+
     /** A message can be set to visible to force itself to be shown. */
     visible: PropTypes.bool,
 

src/collections/Table/TableHeaderCell.d.ts

@@ -2,6 +2,15 @@ import * as React from 'react';
 import { TableCellProps } from './TableCell';
 
 export interface TableHeaderCellProps extends TableCellProps {
+  [key: string]: any;
+
+  /** An element type to render as (string or function). */
+  as?: any;
+
+  /** Additional classes. */
+  className?: string;
+
+  /** A header cell can be sorted in ascending or descending order. */
   sorted?: 'ascending' | 'descending';
 }
 

src/elements/Button/Button.js

@@ -65,12 +65,12 @@ class Button extends Component {
       ),
     ]),
 
-    /** Additional classes. */
-    className: PropTypes.string,
-
     /** A button can be circular. */
     circular: PropTypes.bool,
 
+    /** Additional classes. */
+    className: PropTypes.string,
+
     /** A button can have different colors */
     color: PropTypes.oneOf([
       ...SUI.COLORS,

src/elements/Header/HeaderSubheader.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 
-export interface HeaderSubHeaderProps {
+export interface HeaderSubheaderProps {
   [key: string]: any;
 
   /** An element type to render as (string or function). */
@@ -16,6 +16,6 @@ export interface HeaderSubHeaderProps {
   content?: React.ReactNode;
 }
 
-declare const HeaderSubHeader: React.StatelessComponent<HeaderSubHeaderProps>;
+declare const HeaderSubHeader: React.StatelessComponent<HeaderSubheaderProps>;
 
 export default HeaderSubHeader;

src/elements/Image/Image.d.ts

@@ -12,12 +12,12 @@ import ImageGroup from './ImageGroup';
 export interface ImageProps {
   [key: string]: any;
 
-  /** Alternate text for the image specified. */
-  alt?: string;
-
   /** An element type to render as (string or function). */
   as?: any;
 
+  /** Alternate text for the image specified. */
+  alt?: string;
+
   /** An image may be formatted to appear inline with text as an avatar. */
   avatar?: boolean;
 
@@ -27,6 +27,9 @@ export interface ImageProps {
   /** An image can appear centered in a content block. */
   centered?: boolean;
 
+  /** Primary content. */
+  children?: React.ReactNode;
+
   /** Additional classes. */
   className?: string;
 
@@ -43,7 +46,10 @@ export interface ImageProps {
   fluid?: boolean;
 
   /** The img element height attribute. */
-  height?: string|number;
+  height?: string | number;
+
+  /** An image can be hidden. */
+  hidden?: boolean;
 
   /** Renders the Image as an <a> tag with this href. */
   href?: string;

src/elements/Image/Image.js

@@ -137,8 +137,8 @@ Image.propTypes = {
 
   /** The img element height attribute. */
   height: PropTypes.oneOfType([
-    PropTypes.string,
     PropTypes.number,
+    PropTypes.string,
   ]),
 
   /** An image can be hidden. */

src/elements/Label/LabelGroup.d.ts

@@ -11,7 +11,7 @@ export interface LabelGroupProps {
   children?: React.ReactNode;
 
   /** Labels can share shapes. */
-  circular: boolean;
+  circular?: boolean;
 
   /** Additional classes. */
   className?: string;

src/elements/List/ListIcon.d.ts

@@ -4,6 +4,10 @@ import { SemanticVERTICALALIGNMENTS } from '../..';
 import { IconProps } from '../Icon';
 
 export interface ListIconProps extends IconProps {
+  /** Additional classes. */
+  className?: string;
+
+  /** An element inside a list can be vertically aligned. */
   verticalAlign?: SemanticVERTICALALIGNMENTS;
 }
 

src/elements/Reveal/Reveal.d.ts

@@ -15,12 +15,12 @@ export interface RevealProps {
     | 'move' | 'move right' | 'move up' | 'move down'
     | 'rotate' | 'rotate left';
 
-  /** Additional classes. */
-  className?: string;
-
   /** Primary content. */
   children?: React.ReactNode;
 
+  /** Additional classes. */
+  className?: string;
+
   /** A disabled reveal will not animate when hovered. */
   disabled?: boolean;
 

src/elements/Step/StepContent.js

@@ -44,12 +44,12 @@ StepContent.propTypes = {
   /** An element type to render as (string or function). */
   as: customPropTypes.as,
 
-  /** Additional classes. */
-  className: PropTypes.string,
-
   /** Primary content. */
   children: PropTypes.node,
 
+  /** Additional classes. */
+  className: PropTypes.string,
+
   /** Shorthand for StepDescription. */
   description: customPropTypes.itemShorthand,
 

src/elements/Step/StepDescription.js

@@ -33,12 +33,12 @@ StepDescription.propTypes = {
   /** An element type to render as (string or function). */
   as: customPropTypes.as,
 
-  /** Additional classes. */
-  className: PropTypes.string,
-
   /** Primary content. */
   children: PropTypes.node,
 
+  /** Additional classes. */
+  className: PropTypes.string,
+
   /** Shorthand for primary content. */
   description: customPropTypes.contentShorthand,
 }

src/elements/Step/StepTitle.js

@@ -36,12 +36,12 @@ StepTitle.propTypes = {
   /** An element type to render as (string or function). */
   as: customPropTypes.as,
 
-  /** Additional classes. */
-  className: PropTypes.string,
-
   /** Primary content. */
   children: PropTypes.node,
 
+  /** Additional classes. */
+  className: PropTypes.string,
+
   /** Shorthand for primary content. */
   title: customPropTypes.contentShorthand,
 }

src/modules/Accordion/AccordionContent.d.ts

@@ -14,6 +14,9 @@ export interface AccordionContentProps {
 
   /** Additional classes. */
   className?: string;
+
+  /** Shorthand for primary content. */
+  content?: any;
 }
 
 declare const AccordionContent: React.StatelessComponent<AccordionContentProps>;

src/modules/Accordion/AccordionTitle.d.ts

@@ -3,18 +3,21 @@ import * as React from 'react';
 export interface AccordionTitleProps {
   [key: string]: any;
 
-  /** Whether or not the title is in the open state. */
-  active?: boolean;
-
   /** An element type to render as (string or function). */
   as?: any;
 
+  /** Whether or not the title is in the open state. */
+  active?: boolean;
+
   /** Primary content. */
   children?: React.ReactNode;
 
   /** Additional classes. */
   className?: string;
 
+  /** Shorthand for primary content. */
+  content?: any;
+
   /**
    * Called on click.
    *

src/modules/Checkbox/Checkbox.d.ts

@@ -67,6 +67,9 @@ export interface CheckboxProps {
   /** Format to emphasize the current selection state. */
   slider?: boolean;
 
+  /** A checkbox can receive focus. */
+  tabIndex?: number | string;
+
   /** Format to show an on or off choice. */
   toggle?: boolean;
 

src/modules/Checkbox/Checkbox.js

@@ -91,6 +91,12 @@ export default class Checkbox extends Component {
       customPropTypes.disallow(['radio', 'toggle']),
     ]),
 
+    /** A checkbox can receive focus. */
+    tabIndex: PropTypes.oneOfType([
+      PropTypes.number,
+      PropTypes.string,
+    ]),
+
     /** Format to show an on or off choice. */
     toggle: customPropTypes.every([
       PropTypes.bool,
@@ -102,12 +108,6 @@ export default class Checkbox extends Component {
 
     /** The HTML input value. */
     value: PropTypes.string,
-
-    /** A checkbox can receive focus. */
-    tabIndex: PropTypes.oneOfType([
-      PropTypes.number,
-      PropTypes.string,
-    ]),
   }
 
   static defaultProps = {