Implement drag and drop (#21)

Reviewed-on: https://git.siklos-chaneru.duckdns.org/Siklos/svg-layout-designer-react/pulls/21

src/Components/Sidebar/Sidebar.tsx

@@ -8,14 +8,21 @@ interface ISidebarProps {
   buttonOnClick: (type: string) => void
 }
 
+function handleDragStart(event: React.DragEvent<HTMLButtonElement>): void {
+  event.dataTransfer.setData('type', (event.target as HTMLButtonElement).id);
+}
+
 export default class Sidebar extends React.PureComponent<ISidebarProps> {
   public render(): JSX.Element {
     const listElements = this.props.componentOptions.map(componentOption =>
       <button
         className='justify-center transition-all sidebar-component'
         key={componentOption.Type}
+        id={componentOption.Type}
         title={componentOption.Type}
         onClick={() => this.props.buttonOnClick(componentOption.Type)}
+        draggable={true}
+        onDragStart={(event) => handleDragStart(event)}
       >
         {truncateString(componentOption.Type, 5)}
       </button>