@snapdragonsnursery/react-components 1.19.4 → 1.19.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@snapdragonsnursery/react-components",
-  "version": "1.19.4",
+  "version": "1.19.5",
   "description": "",
   "main": "src/index.js",
   "scripts": {

package/src/ChildSearchModal.jsx

@@ -1,4 +1,10 @@
-import React, { useState, useEffect, useRef, useCallback } from "react";
+import React, {
+  useState,
+  useEffect,
+  useRef,
+  useCallback,
+  useMemo,
+} from "react";
 import { useMsal } from "@azure/msal-react";
 import { trackEvent } from "./telemetry";
 
@@ -25,7 +31,7 @@ const ChildSearchModal = ({
   showSiteFilter = true, // Whether to show site filter dropdown
   multiSelect = false, // Enable multiple child selection
   maxSelections = null, // Maximum number of children that can be selected (null = unlimited)
-  selectedChildren = [], // Array of already selected children (for multi-select mode)
+  selectedChildren, // Array of already selected children (for multi-select mode)
   // Auth options: provide token directly or a function to fetch it
   authToken = null,
   getAccessToken = null,
@@ -60,8 +66,12 @@ const ChildSearchModal = ({
   });
 
   // State for multi-select mode
+  const initialSelectedChildren = useMemo(
+    () => selectedChildren ?? [],
+    [selectedChildren]
+  );
   const [selectedChildrenState, setSelectedChildrenState] = useState(
-    selectedChildren || []
+    initialSelectedChildren
   );
 
   const { instance, accounts } = useMsal();
@@ -281,9 +291,9 @@ const ChildSearchModal = ({
   // Reset selection when modal opens (for multi-select mode)
   useEffect(() => {
     if (isOpen && multiSelect) {
-      setSelectedChildrenState(selectedChildren || []);
+      setSelectedChildrenState(initialSelectedChildren);
     }
-  }, [isOpen, multiSelect, selectedChildren]);
+  }, [isOpen, multiSelect, initialSelectedChildren]);
 
   const handleChildSelect = (child) => {
     if (multiSelect) {