react dnd wip

src/LexEdit.tsx

@@ -3,7 +3,8 @@ import * as _ from 'lodash';
 import {
   textInput,
   selectInput,
-  imagePreview
+  imagePreview,
+  listInput
 } from './LexSingleInput';
 import {
   Card,
@@ -53,6 +54,9 @@ export class LexEdit extends React.Component<any, any> {
         case 'preview': {
           return imagePreview(params);
         }
+        case 'list': {
+          return listInput(params);
+        }
         default: {
           console.log('type discarded :', fieldMeta.type);
           console.log('values discarded :', fieldMeta.get(li));

src/LexSingleInput.tsx

@@ -6,6 +6,10 @@ import {
   Input,
   Image
 } from 'semantic-ui-react';
+// import {
+//   SortableContainer,
+//   SortableElement
+// } from 'react-sortable-hoc';
 
 class LexSingleInput extends React.Component<any, any> {
   public render() {
@@ -88,3 +92,27 @@ export function imagePreview(params: any) {
     </LexSingleInput>
   ) : textInput(params);
 }
+
+// const SortableItem = SortableElement(({ value }) =>
+//   <li>{value}</li>
+// );
+//
+// const SortableList = SortableContainer(({ items }) => {
+//   return (
+//     <ul>
+//       {items.map((value: any, index: any) => (
+//         <SortableItem key={`item-${index}`} index={index} value={value} />
+//       ))}
+//     </ul>
+//   );
+// });
+
+export function listInput(params: any) {
+  let { field, defaultText, changed } = params;
+  let imageSrc = imageRoot + defaultText;
+  return (
+    <LexSingleInput key={field} label={changedLabel(changed, field)}>
+      <Image src={imageSrc} size="tiny" bordered={true} />
+    </LexSingleInput>
+  );
+}