fix(Dropdown): handle text as a content in renderLabel

[layershifter]

Fixes #4046.

---

This PR fixes a regression from #4003 (v1.1.0).

That change affected renderLabel prop in Dropdown (will be used to render labels with multiple). In #4003 I decided to avoid breaking changes and keep the existing behavior via this condition:

if (React.isValidElement(text) || _.isFunction(text)) {

However, I can't consider the previous behavior as valid as it will break the layout once text will be a JSX element (see behaviors below).

test snippet

<Grid columns={2}>
  <Grid.Column>
    <Dropdown
      placeholder="Select Friend"
      fluid
      selection
      multiple
      options={[
        {
          key: "Jenny Hess",
          text: <span>Jenny Hess</span>,
          value: "Jenny Hess"
        },
        {
          key: "Elliot Fu",
          text: "Elliot Fu",
          value: "Elliot Fu"
        }
      ]}
    />
  </Grid.Column>
  <Grid.Column>
    <Dropdown
      placeholder="Select Friend"
      fluid
      selection
      options={[
        {
          key: "Jenny Hess",
          text: <span>Jenny Hess</span>,
          value: "Jenny Hess"
        },
        {
          key: "Elliot Fu",
          text: "Elliot Fu",
          value: "Elliot Fu"
        }
      ]}
    />
  </Grid.Column>
</Grid>

Mention that in the first case text is a JSX element.

pre v1.1.0 behavior

https://codesandbox.io/s/busy-hooks-5p5pq

v1.1.0 behavior

https://codesandbox.io/s/distracted-dawn-xg28c

fix in this PR

---

To keep previous behavior use:

<Dropdown renderLabel={({ text }) => text} />

[github-actions]

size-limit report

Path	Size
bundle-size/dist/Button.size.js	66.39 KB (0%)
bundle-size/dist/Icon.size.js	30.58 KB (0%)
bundle-size/dist/Image.size.js	61.63 KB (0%)
bundle-size/dist/Modal.size.js	76.65 KB (0%)
bundle-size/dist/Portal.size.js	47.78 KB (0%)

[codecov-commenter]

Codecov Report

Merging #4047 into master will increase coverage by 0.00%.
The diff coverage is 100.00%.

@@           Coverage Diff           @@
##           master    #4047   +/-   ##
=======================================
  Coverage   99.84%   99.84%           
=======================================
  Files         186      183    -3     
  Lines        3255     3280   +25     
=======================================
+ Hits         3250     3275   +25     
  Misses          5        5           

Impacted Files	Coverage Δ
src/addons/Portal/Portal.js	100.00% <ø> (ø)
src/addons/Portal/PortalInner.js	100.00% <ø> (ø)
src/addons/TextArea/TextArea.js	100.00% <ø> (ø)
src/behaviors/Visibility/Visibility.js	100.00% <ø> (ø)
src/collections/Form/FormField.js	100.00% <ø> (ø)
src/elements/Button/Button.js	95.55% <ø> (ø)
src/elements/Input/Input.js	100.00% <ø> (ø)
src/elements/Placeholder/Placeholder.js	100.00% <ø> (ø)
src/modules/Checkbox/Checkbox.js	100.00% <ø> (ø)
src/modules/Dimmer/DimmerInner.js	100.00% <ø> (ø)
... and 13 more

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update c3640e4...c4c62b0. Read the comment docs.

[layershifter]

Released in [email protected] 🚢