Raid Instance Creator working

src/components/personCharacter/RatingSelector.tsx

@@ -1,4 +1,5 @@
 import { useEffect, useState } from "react";
+import NumberInput from "../input/NumberInput";
 
 export default function RatingSelector({
 	rating,
@@ -8,6 +9,7 @@ export default function RatingSelector({
 	onChange?: (rating?: number) => void;
 }){
 	const ratings = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
+	const selectorId = crypto.randomUUID().replaceAll("-", "");
 	const [ currentRating, setCurrentRating ] = useState(rating);
 
 
@@ -20,6 +22,19 @@ export default function RatingSelector({
 	}, [ currentRating, onChange ]);
 
 
+	return (
+		<div>
+			<NumberInput
+				id={`characterRatingSelector${selectorId}`}
+				label="Rating"
+				value={currentRating}
+				onChange={(value) => setCurrentRating(value)}
+				min={0}
+				max={10}
+			/>
+		</div>
+	);
+
 	return (
 		<div>
 			<label>