Revert "Revert "components: Promote VisuallyHidden from ui into full …

…components (#31244)"" (#31902) * Revert "Revert "components: Promote VisuallyHidden from ui into full components (#31244)" (#31882)" This reverts commit 269f31a. * Convert to styled component * Update snapshots * Add children prop * Use View naming convention * Use inline styles and remove focus styles * Update color picker snapshots * Render a View to allow for polymorphism and forward the ref
WordPress · Jul 17, 2021 · 2d99d85 · 2d99d85
1 parent 2d346b9
commit 2d99d85
Show file tree

Hide file tree

Showing 34 changed files with 250 additions and 409 deletions.
diff --git a/packages/components/src/alignment-matrix-control/cell.js b/packages/components/src/alignment-matrix-control/cell.js
@@ -3,7 +3,7 @@
  */
 import { CompositeItem } from '../composite';
 import Tooltip from '../tooltip';
-import VisuallyHidden from '../visually-hidden';
+import { VisuallyHidden } from '../visually-hidden';
 
 /**
  * Internal dependencies

diff --git a/packages/components/src/base-control/index.js b/packages/components/src/base-control/index.js
@@ -6,7 +6,7 @@ import classnames from 'classnames';
 /**
  * Internal dependencies
  */
-import VisuallyHidden from '../visually-hidden';
+import { VisuallyHidden } from '../visually-hidden';
 import {
 	Wrapper,
 	StyledField,

diff --git a/packages/components/src/button/index.js b/packages/components/src/button/index.js
@@ -15,7 +15,7 @@ import { forwardRef } from '@wordpress/element';
  */
 import Tooltip from '../tooltip';
 import Icon from '../icon';
-import VisuallyHidden from '../visually-hidden';
+import { VisuallyHidden } from '../visually-hidden';
 
 const disabledEventsOnDisabledButton = [ 'onMouseDown', 'onClick' ];
 

diff --git a/packages/components/src/button/test/index.js b/packages/components/src/button/test/index.js
@@ -13,7 +13,7 @@ import { plusCircle } from '@wordpress/icons';
  * Internal dependencies
  */
 import ButtonWithForwardedRef, { Button } from '../';
-import VisuallyHidden from '../../visually-hidden';
+import { VisuallyHidden } from '../../visually-hidden';
 
 describe( 'Button', () => {
 	describe( 'basic rendering', () => {

diff --git a/packages/components/src/color-picker/hue.js b/packages/components/src/color-picker/hue.js
@@ -43,7 +43,7 @@ import { TAB } from '@wordpress/keycodes';
  */
 import { calculateHueChange } from './utils';
 import KeyboardShortcuts from '../keyboard-shortcuts';
-import VisuallyHidden from '../visually-hidden';
+import { VisuallyHidden } from '../visually-hidden';
 
 export class Hue extends Component {
 	constructor() {

diff --git a/packages/components/src/color-picker/inputs.js b/packages/components/src/color-picker/inputs.js
@@ -18,7 +18,7 @@ import { chevronDown } from '@wordpress/icons';
  */
 import Button from '../button';
 import TextControl from '../text-control';
-import VisuallyHidden from '../visually-hidden';
+import { VisuallyHidden } from '../visually-hidden';
 import { isValidHex } from './utils';
 
 /* Wrapper for TextControl, only used to handle intermediate state while typing. */

diff --git a/packages/components/src/color-picker/saturation.js b/packages/components/src/color-picker/saturation.js
@@ -44,7 +44,7 @@ import { compose, pure, withInstanceId } from '@wordpress/compose';
 import { calculateSaturationChange } from './utils';
 import Button from '../button';
 import KeyboardShortcuts from '../keyboard-shortcuts';
-import VisuallyHidden from '../visually-hidden';
+import { VisuallyHidden } from '../visually-hidden';
 
 export class Saturation extends Component {
 	constructor( props ) {