feat(Modal): add mini and tiny sizes

docs/app/Examples/modules/Modal/Variations/ModalExampleSize.js

@@ -12,6 +12,8 @@ class ModalExampleSize extends Component {
 
     return (
       <div>
+        <Button onClick={this.show('mini')}>Mini</Button>
+        <Button onClick={this.show('tiny')}>Tiny</Button>
         <Button onClick={this.show('small')}>Small</Button>
         <Button onClick={this.show('large')}>Large</Button>
         <Button onClick={this.show('fullscreen')}>Fullscreen</Button>

src/modules/Modal/Modal.d.ts

@@ -84,7 +84,7 @@ export interface ModalProps extends PortalProps {
   open?: boolean;
 
   /** A modal can vary in size. */
-  size?: 'fullscreen' | 'large' | 'small';
+  size?: 'fullscreen' | 'large' | 'mini' | 'small' | 'tiny';
 
   /** Custom styles. */
   style?: React.CSSProperties;

src/modules/Modal/Modal.js

@@ -112,7 +112,7 @@ class Modal extends Component {
     open: PropTypes.bool,
 
     /** A modal can vary in size */
-    size: PropTypes.oneOf(['fullscreen', 'large', 'small']),
+    size: PropTypes.oneOf(['fullscreen', 'large', 'mini', 'small', 'tiny']),
 
     /** Custom styles. */
     style: PropTypes.object,

test/specs/modules/Modal/Modal-test.js

@@ -210,7 +210,7 @@ describe('Modal', () => {
 
   describe('size', () => {
     it('adds the size to the modal className', () => {
-      const sizes = ['fullscreen', 'large', 'small']
+      const sizes = ['fullscreen', 'large', 'mini', 'small', 'tiny']
 
       sizes.forEach(size => {
         wrapperMount(<Modal size={size} open />)