diff --git a/packages/react-aria-components/src/Select.tsx b/packages/react-aria-components/src/Select.tsx index e58dbe36fae..50c3abaf448 100644 --- a/packages/react-aria-components/src/Select.tsx +++ b/packages/react-aria-components/src/Select.tsx @@ -257,7 +257,7 @@ function SelectValue(props: SelectValueProps, ref: Forwarde let renderProps = useRenderProps({ ...props, - defaultChildren: rendered || placeholder || stringFormatter.format('selectPlaceholder'), + defaultChildren: rendered ?? placeholder ?? stringFormatter.format('selectPlaceholder'), defaultClassName: 'react-aria-SelectValue', values: { selectedItem: state.selectedItem?.value as T ?? null, diff --git a/packages/react-aria-components/test/Select.test.js b/packages/react-aria-components/test/Select.test.js index 75f3cb0b15f..3bb2001a8ed 100644 --- a/packages/react-aria-components/test/Select.test.js +++ b/packages/react-aria-components/test/Select.test.js @@ -243,4 +243,33 @@ describe('Select', () => { expect(button).not.toHaveAttribute('aria-describedby'); expect(select).not.toHaveAttribute('data-invalid'); }); + + it('should support falsy (0) as a valid default value', async () => { + let {getByRole} = render( + + ); + + let button = getByRole('button'); + await user.click(button); + + let listbox = getByRole('listbox'); + let options = within(listbox).getAllByRole('option'); + await user.click(options[0]); + + expect(button).toHaveTextContent('0'); + }); });