feat: checkbox_group re-export

packages/components/src/spectrum/CheckboxGroup.tsx

@@ -1,10 +1,12 @@
+/* eslint-disable react/no-array-index-key */
 import { isElementOfType } from '@deephaven/react-hooks';
-import React, { ReactNode, useMemo, useState } from 'react';
+import React, { ReactNode, useMemo } from 'react';
 import {
   Checkbox,
   CheckboxGroup as SpectrumCheckboxGroup,
   SpectrumCheckboxGroupProps,
 } from '@adobe/react-spectrum';
+import { ensureArray } from '@deephaven/utils';
 
 export type CheckboxGroupProps = {
   children: ReactNode;
@@ -18,38 +20,24 @@
   children,
   ...props
 }: CheckboxGroupProps): JSX.Element {
-  const [checkedState, setCheckedState] = useState<{ [key: number]: boolean }>(
-    {}
-  );
-
-  const handleCheckboxChange = (index: number) => {
-    setCheckedState(prevState => ({
-      ...prevState,
-      [index]: !prevState[index],
-    }));
-  };
-
   const wrappedChildren = useMemo(
     () =>
-      React.Children.map(children, (child, index) => {
-        if (isElementOfType(child, Checkbox)) {
-          return React.cloneElement(child, {
-            isSelected: true,
-            value: `checkbox-${index}`,
-            onChange: () => handleCheckboxChange(index),
-          });
-        }
-        return (
+      ensureArray(children).map((child, index) =>
+        isElementOfType(child, Checkbox) ? (
+          React.cloneElement(child, {
+            key: `${index}-${String(child)}`,
+            value: `${index}-${String(child)}`,
+          })
+        ) : (
           <Checkbox
-            isSelected={checkedState[index] || false}
-            value={`checkbox-${index}`}
-            onChange={() => handleCheckboxChange(index)}
+            key={`${index}-${String(child)}`}
+            value={`${index}-${String(child)}`}
           >
             {String(child)}
           </Checkbox>
-        );
-      }) || [],
-    [children, checkedState]
+        )
+      ),
+    [children]
   );
 
   return (