Repository: adobe/react-spectrum
File: packages/@react-spectrum/s2/src/Picker.tsx (TypeScript)

Code before:
        })}>
        {(renderProps) => (
          <>
            <SelectValue className={valueStyles({isQuiet}) + ' ' + raw('&> :not([slot=icon], [slot=avatar], [slot=label], [data-slot=label]) {display: none;}')}>
              {({selectedItems, defaultChildren}) => {
                return (
                  <Provider
                    values={[
                      [IconContext, {
                        slots: {
                          icon: {
                            render: centerBaseline({slot: 'icon', styles: iconCenterWrapper}),
                            styles: icon
                          }
                        }
                      }],
                      [AvatarContext, {
                        slots: {
                          avatar: {
                            size: avatarSize[size ?? 'M'],
                            styles: avatar
                          }
                        }
                      }],
                      [TextContext, {
                        slots: {
                          description: {},
                          [DEFAULT_SLOT]: {
                            styles: style({
                              display: 'block',
                              flexGrow: 1,
                              truncate: true
                            }),
                            // @ts-ignore
                            'data-slot': 'label'
                          },
                          label: {
                            styles: style({
                              display: 'block',
                              flexGrow: 1,
                              truncate: true
                            }),
                            // @ts-ignore not technically necessary, but good for consistency
                            'data-slot': 'label'
                          }
                        }
                      }],
                      [InsideSelectValueContext, true]
                    ]}>
                    {selectedItems.length <= 1
                      ? defaultChildren

Review comment (bug):
This should probably be `selectedValues.length > 0` to prevent the edge case if you had all `null` items. Super edge case though, I don't even think null items is something we'd care to support.

Code after:
        ref={buttonRef}
        style={renderProps => pressScale(buttonRef)(renderProps)}
        // Prevent press scale from sticking while Picker is open.
        // @ts-ignore
        isPressed={false}
        className={renderProps => inputButton({
          ...renderProps,
          size: size,
          isOpen,
          isQuiet
        })}>
        {(renderProps) => (
          <>
            <SelectValue
              className={
                valueStyles({isQuiet}) +
                (renderValue ? '' : ' ' + raw('&> :not([slot=icon], [slot=avatar], [slot=label], [data-slot=label]) {display: none;}'))
              }>
              {({selectedItems, defaultChildren}) => {
                const selectedValues = selectedItems.filter((item): item is T => item != null);
                const defaultRenderedValue = selectedItems.length <= 1
                  ? defaultChildren
                  : <Text slot="label">{stringFormatter.format('picker.selectedCount', {count: selectedItems.length})}</Text>;
                const renderedValue = selectedItems.length > 0 && renderValue
                  ? renderValue(selectedValues)
                  : defaultRenderedValue;

                return (
                  <Provider
                    values={[
                      [IconContext, {
                        slots: {
                          icon: {
                            render: centerBaseline({slot: 'icon', styles: iconCenterWrapper}),
                            styles: icon
                          }
                        }
                      }],
                      [AvatarContext, {
                        slots: {
                          avatar: {
                            size: avatarSize[size ?? 'M'],
                            styles: avatar
                          }
                        }
                      }],
                      [TextContext, {
                        slots: {
                          description: {},
                          [DEFAULT_SLOT]: {
                            styles: style({