move ItemCard into own file

src/cards/ItemCard.tsx

@@ -0,0 +1,12 @@
+import { ItemProps } from 'cards/CardRenderProps';
+import * as React from 'react';
+
+export const ItemCard = (props: ItemProps) => {
+  const style = {
+    display: 'inline-block',
+    borderRadius: '20px'
+  } as React.CSSProperties;
+
+  const src = `/~https://github.com/any2cards/gloomhaven/raw/master/images/${props.path}`;
+  return <img key={props.id} style={style} src={src} alt={props.name}/>;
+};

src/cards/PersonalGoalCard.tsx

@@ -1,6 +1,5 @@
-import { ItemProps } from 'cards/CardRenderProps';
-import * as React from "react";
-import { NoState } from "../lang/react";
+import * as React from 'react';
+import { NoState } from '../lang/react';
 
 interface PersonalGoalCardProps {
   cardId: number;
@@ -18,12 +17,3 @@ export class PersonalGoalCard extends React.Component<PersonalGoalCardProps, NoS
   }
 }
 
-export const ItemCard = (props: ItemProps) => {
-  const style = {
-    display: "inline-block",
-    borderRadius: '20px'
-  } as React.CSSProperties;
-
-  const src = `/~https://github.com/any2cards/gloomhaven/raw/master/images/${props.path}`
-  return <img key={props.id} style={style} src={src} alt={props.name}/>
-}

src/cards/cards.tsx

@@ -1,5 +1,6 @@
+import { ItemCard } from 'cards/ItemCard';
 import { gloomhavenItems } from 'cards/items-data';
-import { ItemCard, PersonalGoalCard } from 'cards/PersonalGoalCard';
+import { PersonalGoalCard } from 'cards/PersonalGoalCard';
 import * as React from 'react';
 import { CardRenderProps, isItemProps, isPersonalGoalProps, isRandomItemDesignProps, isRandomSideScenarioProps, ItemProps } from './CardRenderProps';