chore(react-input, react-textarea): Deprecating filled with shadow appearance variants

[sopranopillow]

trafficstars

This PR removes the filled with shadow appearance variants. This is due to the shadow appearances not being visible when used on a background that meets our contrast ratio guidelines.

This is how our current docs show the variants:

To be able to see the shadow, a lighter background is required like this one:

This contradicts our guidelines on using a background with enough contrast ratio for accessibility requirements.

[spmonahan]

This PR removes the filled with shadow appearance variants due to encouraging the use of a background that doesn't meet an accessible contrast ratio.

Can you expand on the issue a bit more please?

[codesandbox-ci[bot]]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit b4077e21af85b5026b3b10d5a934532b655079a1:

Sandbox	Source
@fluentui/react 8 starter	Configuration
@fluentui/react-components 9 starter	Configuration

[fabricteam]

📊 Bundle size report

Package & Exports	Baseline (minified/GZIP)	PR	Change
react-input Input	23.757 kB 7.704 kB	23.762 kB 7.706 kB	5 B 2 B
react-textarea Textarea	25.013 kB 8.133 kB	25.018 kB 8.133 kB	5 B

Unchanged fixtures

Package & Exports	Size (minified/GZIP)
react-components react-components: Accordion, Button, FluentProvider, Image, Menu, Popover	188.672 kB 52.359 kB
react-components react-components: FluentProvider & webLightTheme	33.394 kB 11.007 kB
react-portal-compat PortalCompatProvider	5.851 kB 1.964 kB
react-spinbutton SpinButton	44.102 kB 12.425 kB

_{🤖 This report was generated against 483f160617f1037e672fe74b8e52abfee9378517}

[sopranopillow]

This PR removes the filled with shadow appearance variants due to encouraging the use of a background that doesn't meet an accessible contrast ratio.

Can you expand on the issue a bit more please?

I just updated it :) I'm mainly preparing this PR to discuss it next week.

[fabricteam]

Perf Analysis (@fluentui/react-components)

No significant results to display.

All results

Scenario	Render type	Master Ticks	PR Ticks	Iterations	Status
Avatar	mount	1295	1312	5000
Button	mount	933	949	5000
FluentProvider	mount	1604	1571	5000
FluentProviderWithTheme	mount	622	633	10
FluentProviderWithTheme	virtual-rerender	591	585	10
FluentProviderWithTheme	virtual-rerender-with-unmount	630	625	10
MakeStyles	mount	1886	1887	50000
SpinButton	mount	2529	2537	5000

[size-auditor[bot]]

Asset size changes

Size Auditor did not detect a change in bundle size for any component!

Baseline commit: 483f160617f1037e672fe74b8e52abfee9378517 (build)