more fixes

src/Form/Input.tsx

@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { Component, ComponentProps } from 'react';
 import styled, { css } from 'styled-components';
 import { Field } from './Field';
 import StyledLabel from './Label';
@@ -29,13 +29,11 @@ export interface InputProps {
   placeholder?: string;
   multiline?: boolean;
   label?: any;
-  autofocus?: any;
+  autoFocus?: boolean;
   transformOnBlur?: any;
   onFocus?: any;
   onBlur?: any;
   onChange?: any;
-  autoFocus?: boolean;
-  maxLength?: number;
   onKeyDown?: any;
   minRows?: number;
   rows?: number;
@@ -242,7 +240,7 @@ export class InputClass extends Component<InputProps, any> {
   }
 
   componentDidMount() {
-    if (this.props.autofocus && this.ref.current) {
+    if (this.props.autoFocus && this.ref.current) {
       this.ref.current.focus();
     }
 
@@ -344,7 +342,7 @@ export class InputClass extends Component<InputProps, any> {
       label,
       multiline,
       autogrow,
-      autofocus,
+      autoFocus,
       id,
       error,
       floating,
@@ -428,4 +426,4 @@ export class InputClass extends Component<InputProps, any> {
   }
 }
 
-export const Input = createEasyInput<InputProps & EasyInputProps>(InputClass);
+export const Input = createEasyInput<ComponentProps<typeof StyledInput> & EasyInputProps>(InputClass);

src/Icon/Icon.tsx

@@ -15,8 +15,8 @@ export const Icon = createComponent<IconProps, 'i'>({
   props: ({ name }) => ({
     className: `mdi mdi-${name}`,
   }),
-  style: ({ theme, size, color, disabled, onClick }: any) => {
-    const colorFromTheme = theme.colors[color];
+  style: ({ theme, size, color, disabled, onClick }) => {
+    const colorFromTheme = color ? theme.colors[color] : '';
     const resolvedColor = colorFromTheme || color;
 
     return css`

src/Modal/Modal.stories.tsx

@@ -31,3 +31,5 @@ export const LongContent = () => (
 export const DropdownTrigger = () => <ModalDropdownExample body="I'm triggered by a dropdown" />;
 
 export const NoAutoFocus = () => <ModalNoAutoFocusExample body="I'm triggered by a dropdown" />;
+
+export const TitleElement = () => <ModalNoAutoFocusExample title={<h1>Hello world</h1>} />;

src/Modal/Modal.tsx

@@ -23,7 +23,7 @@ export interface ModalProps {
   animationOut?: string;
   animationDuration?: number;
   onClose?: any;
-  title?: string;
+  title?: string | JSX.Element;
 }
 
 const ModalContainer = createComponent({