feat(textInput, textArea, Select): move classNames to outer wrapper

[andreancardona]

Closes #9465

Uses the feature-flags package to move the className prop to the outer wrapper.

Changelog

New

• Moved the className prop to the outermost wrapper so that all elements inside are targetable via css

Changed

• If the className prop was being added inside an element, it now returns null when the V11 feature flag is enabled. Instead, it is placed on the outer wrapper

Testing / Reviewing

Test the following components, which each have a test story: Class Name Change Test that will be removed before merging:

• Select
• TextArea
• TextInput

Ensure className is placed on the outer wrapper if wrapped in the FeatureFlag element. className should remain in the same spot otherwise

[netlify]

✔️ Deploy Preview for carbon-react-next ready!

🔨 Explore the source changes: 8714b90

🔍 Inspect the deploy log: https://app.netlify.com/sites/carbon-react-next/deploys/6130ed3f3d2bfc0007f56fc8

😎 Browse the preview: https://deploy-preview-9502--carbon-react-next.netlify.app/

[netlify]

✔️ Deploy Preview for carbon-elements ready!

🔨 Explore the source changes: 60c5512

🔍 Inspect the deploy log: https://app.netlify.com/sites/carbon-elements/deploys/611d4929a5e13b0008fcb295

😎 Browse the preview: https://deploy-preview-9502--carbon-elements.netlify.app

[netlify]

✔️ Deploy Preview for carbon-elements ready!

🔨 Explore the source changes: 8714b90

🔍 Inspect the deploy log: https://app.netlify.com/sites/carbon-elements/deploys/6130ed3f4d41b1000709a0e0

😎 Browse the preview: https://deploy-preview-9502--carbon-elements.netlify.app

[netlify]

✔️ Deploy Preview for carbon-components-react ready!
Built without sensitive environment variables

🔨 Explore the source changes: 8714b90

🔍 Inspect the deploy log: https://app.netlify.com/sites/carbon-components-react/deploys/6130ed3fca168d00070cfbbe

😎 Browse the preview: https://deploy-preview-9502--carbon-components-react.netlify.app

[tw15egan]

Looks like TextInput is still adding the class to the inner input. I think we need to conditional render it [here] (https://github.com/carbon-design-system/carbon/pull/9502/files#diff-7820afc8fe28f023d88aad65b058606d670d1451929594acfce5505010358fb2R56) (L56)

const textInputClasses = classNames(`${prefix}--text-input`, [enabled ? null : className]

[tw15egan]

LGTM once test stories are removed