fix: unique keys

src/FlexibleTable/FlexibleTable.jsx

@@ -120,7 +120,7 @@ export default function FlexibleTable({
 									style={{padding: 0, listStyle: "none"}}
 								>
 									{headers.map((header, index) => (
-										<Draggable key={header} draggableId={header} index={index}>
+										<Draggable key={`fitb-draggable-${index}-${header}`} draggableId={header} index={index}>
 											{(provided) => (
 												<li
 													ref={provided.innerRef}

src/FlexibleTable/TableBody.jsx

@@ -38,7 +38,7 @@ export default function TableBody({tableStyles, updateCell, rows, states}) {
 			}}>
 				{rows.map((row, index) => (
 					states[index] ?
-						<td className={"fitb-item-table-cell"} key={index}
+						<td className={"fitb-item-table-cell"} key={`fitb-item-table-cell-${index}`}
 							style={{
 								borderWidth: "0px",
 								borderStyle: "solid",
@@ -48,7 +48,7 @@ export default function TableBody({tableStyles, updateCell, rows, states}) {
 							}}>
 							<RichText
 								tagName="div"
-								key={index}
+								key={`fitb-item-table-cell-text-${index}`}
 								value={row}
 								style={{
 									color: (multipleBodyBackground && trIndex === 1) ? bodyTextColorEven : bodyTextColor,

src/FlexibleTable/TableHead.jsx

@@ -41,7 +41,7 @@ export default function TableHead( {headers, updateHeader, tableStyles, states}
 						}}>
 						<RichText
 							tagName="div"
-							key={index}
+							key={`fitb-item-table-header-cell-${index}`}
 							value={header}
 							style={{
 								color: headerTextColor,