diff --git a/src/component/container/pattern_list.tsx b/src/component/container/pattern_list.tsx
index fbf2fb7c8..959f9c4b0 100644
--- a/src/component/container/pattern_list.tsx
+++ b/src/component/container/pattern_list.tsx
@@ -1,12 +1,10 @@
 import Input from '../../lsg/patterns/input/';
 import { PatternFolder } from '../../store/pattern/folder';
-// import { Headline } from '../../lsg/patterns/headline';
 import List, { Label, Li, ListItemProps, Ul, Value } from '../../lsg/patterns/list';
 import { action } from 'mobx';
 import { observer } from 'mobx-react';
 import { PageElement } from '../../store/page/page_element';
 import { Pattern } from '../../store/pattern';
-// import PatternListItem from '../../lsg/patterns/pattern-list-item';
 import * as React from 'react';
 import { Store } from '../../store';
 
@@ -39,9 +37,7 @@ export class PatternList extends React.Component<PatternListProps> {
 		return (
 			<div>
 				<Input handleChange={this.handleSearchInputChange} />
-				<List headline="Patterns">
-					{list}
-				</List>
+				<List headline="Patterns">{list}</List>
 			</div>
 		);
 	}
@@ -83,7 +79,7 @@ export class PatternList extends React.Component<PatternListProps> {
 					return (
 						<Li
 							draggable={props.draggable}
-							onDragStart={props.handleDragStart}
+							handleDragStart={props.handleDragStart}
 							key={index}
 							active={props.active}
 							onClick={props.onClick}
diff --git a/src/component/container/project_list.tsx b/src/component/container/project_list.tsx
index 58fd1c2d8..56eec4cd1 100644
--- a/src/component/container/project_list.tsx
+++ b/src/component/container/project_list.tsx
@@ -44,7 +44,7 @@ export class ProjectList extends React.Component<ProjectListProps> {
 					return (
 						<Li
 							draggable={props.draggable}
-							onDragStart={props.handleDragStart}
+							handleDragStart={props.handleDragStart}
 							key={index}
 							active={props.active}
 							onClick={props.onClick}
diff --git a/src/lsg/patterns/list/index.tsx b/src/lsg/patterns/list/index.tsx
index 4854bb38b..8dd4f3770 100644
--- a/src/lsg/patterns/list/index.tsx
+++ b/src/lsg/patterns/list/index.tsx
@@ -27,6 +27,14 @@ interface StyledListItemProps {
 	draggable?: boolean;
 }
 
+export interface LiProps {
+	active?: boolean;
+	draggable?: boolean;
+
+	onClick?: React.MouseEventHandler<HTMLElement>;
+	handleDragStart?: React.DragEventHandler<HTMLElement>;
+}
+
 const StyledUl = styledComponents.ul`
 	box-sizing: border-box;
 	padding: 0 0 0 15px;
@@ -46,47 +54,35 @@ const StyledLabel = styledComponents.span`
 	padding-right 4px;
 `;
 
-const StyledValue	 = styledComponents.span`
+const StyledValue = styledComponents.span`
 	color: ${colors.black.toString()};
 `;
 
 export class Ul extends React.Component<{}> {
 	public render(): JSX.Element {
-		return (
-		<StyledUl>
-			{this.props.children}
-		</StyledUl>
-		);
+		return <StyledUl>{this.props.children}</StyledUl>;
 	}
 }
 
-export class Li extends React.Component<{}> {
+export class Li extends React.Component<LiProps> {
+	public constructor(props: LiProps) {
+		super(props);
+	}
+
 	public render(): JSX.Element {
-		return (
-		<StyledLi>
-			{this.props.children}
-		</StyledLi>
-		);
+		return <StyledLi {...this.props}>{this.props.children}</StyledLi>;
 	}
 }
 
 export class Label extends React.Component<{}> {
 	public render(): JSX.Element {
-		return (
-		<StyledLabel>
-			{this.props.children}
-		</StyledLabel>
-		);
+		return <StyledLabel>{this.props.children}</StyledLabel>;
 	}
 }
 
 export class Value extends React.Component<{}> {
 	public render(): JSX.Element {
-		return (
-		<StyledValue>
-			{this.props.children}
-		</StyledValue>
-		);
+		return <StyledValue>{this.props.children}</StyledValue>;
 	}
 }