diff --git a/packages/code-studio/src/styleguide/CheckboxGroups.tsx b/packages/code-studio/src/styleguide/CheckboxGroups.tsx index c8b3e23a3..3c7071f42 100644 --- 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 { Single Child - Aaa + Aaa Multiple Children - Aaa - Bbb - Ccc + Aaa + Bbb + Ccc @@ -33,7 +35,7 @@ export function CheckboxGroups(): JSX.Element { {999} {true} {false} - Aaa + Aaa diff --git a/packages/components/src/spectrum/CheckboxGroup.tsx b/packages/components/src/spectrum/CheckboxGroup.tsx index 39b2d2328..1657aea9f 100644 --- 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 ( handleCheckboxChange(index)} > {String(child)}