modify according to review

deephaven · Sep 19, 2024 · 99abc1d · 99abc1d
1 parent 764d23f
commit 99abc1d
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 9 deletions.
diff --git a/packages/code-studio/src/styleguide/CheckboxGroups.tsx b/packages/code-studio/src/styleguide/CheckboxGroups.tsx
@@ -1,5 +1,7 @@
 import React from 'react';
-import { Checkbox, CheckboxGroup, Flex, Text } from '@deephaven/components';
+import { CheckboxGroup, Flex, Text } from '@deephaven/components';
+// eslint-disable-next-line no-restricted-imports
+import { Checkbox } from '@adobe/react-spectrum';
 import SampleSection from './SampleSection';
 
 export function CheckboxGroups(): JSX.Element {
@@ -10,16 +12,16 @@ export function CheckboxGroups(): JSX.Element {
  <Flex direction="column">
  <Text>Single Child</Text>
  <CheckboxGroup aria-label="Single Child">
- <Checkbox checked={false}>Aaa</Checkbox>
+ <Checkbox>Aaa</Checkbox>
  </CheckboxGroup>
  </Flex>
 
  <Flex direction="column">
  <Text>Multiple Children</Text>
  <CheckboxGroup aria-label="Multiple Children">
- <Checkbox checked={false}>Aaa</Checkbox>
- <Checkbox checked={false}>Bbb</Checkbox>
- <Checkbox checked={false}>Ccc</Checkbox>
+ <Checkbox>Aaa</Checkbox>
+ <Checkbox>Bbb</Checkbox>
+ <Checkbox>Ccc</Checkbox>
  </CheckboxGroup>
  </Flex>
 
@@ -33,7 +35,7 @@ export function CheckboxGroups(): JSX.Element {
  {999}
  {true}
  {false}
- <Checkbox checked={false}>Aaa</Checkbox>
+ <Checkbox>Aaa</Checkbox>
  </CheckboxGroup>
  </Flex>
  </Flex>

diff --git a/packages/components/src/spectrum/CheckboxGroup.tsx b/packages/components/src/spectrum/CheckboxGroup.tsx
@@ -1,10 +1,10 @@
 import { isElementOfType } from '@deephaven/react-hooks';
 import React, { ReactNode, useMemo, useState } from 'react';
 import {
+ Checkbox,
  CheckboxGroup as SpectrumCheckboxGroup,
  SpectrumCheckboxGroupProps,
 } from '@adobe/react-spectrum';
-import Checkbox from '../Checkbox';
 
 export type CheckboxGroupProps = {
  children: ReactNode;
@@ -34,13 +34,15 @@ export function CheckboxGroup({
  React.Children.map(children, (child, index) => {
  if (isElementOfType(child, Checkbox)) {
  return React.cloneElement(child, {
- checked: checkedState[index] || false,
+ isSelected: true,
+ value: `checkbox-${index}`,
  onChange: () => handleCheckboxChange(index),
  });
  }
  return (
  <Checkbox
- checked={checkedState[index] || false}
+ isSelected={checkedState[index] || false}
+ value={`checkbox-${index}`}
  onChange={() => handleCheckboxChange(index)}
  >
  {String(child)}