feat(theme): re-export hideVisually from polished

bigcommerce · May 18, 2022 · e102e6d · e102e6d
1 parent 8757f42
commit e102e6d
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 3 deletions.
diff --git a/packages/big-design-theme/src/helpers/helpers.spec.ts b/packages/big-design-theme/src/helpers/helpers.spec.ts
@@ -1,6 +1,6 @@
 import { themeOptions } from '../options';
 
-import { addValues, createRGBA, emCalc, listReset, remCalc } from './helpers';
+import { addValues, createRGBA, emCalc, hideVisually, listReset, remCalc } from './helpers';
 
 describe('addValues', () => {
   test('adds px', () => {
@@ -101,3 +101,17 @@ test('listReset returns reset css', () => {
 
   expect(listReset).toEqual(expected);
 });
+
+test('listReset returns reset css', () => {
+  expect(hideVisually()).toEqual({
+    border: '0',
+    clip: 'rect(0 0 0 0)',
+    height: '1px',
+    margin: '-1px',
+    overflow: 'hidden',
+    padding: '0',
+    position: 'absolute',
+    whiteSpace: 'nowrap',
+    width: '1px',
+  });
+});
diff --git a/packages/big-design-theme/src/helpers/helpers.ts b/packages/big-design-theme/src/helpers/helpers.ts
@@ -1,4 +1,4 @@
-import { em, math, rem, transparentize } from 'polished';
+import { em, hideVisually, math, rem, transparentize } from 'polished';
 import { css, FlattenSimpleInterpolation } from 'styled-components';
 
 import { themeOptions } from '../options';
@@ -9,6 +9,7 @@ export interface Helpers {
   remCalc(value: string | number): string;
   emCalc(value: string | number): string;
   listReset: FlattenSimpleInterpolation;
+  hideVisually: typeof hideVisually;
 }
 
 export const addValues = (first: string, second: string) => {
@@ -43,3 +44,5 @@ export const listReset = css`
   margin: 0;
   padding: 0;
 `;
+
+export { hideVisually } from 'polished';
diff --git a/packages/big-design-theme/src/helpers/index.ts b/packages/big-design-theme/src/helpers/index.ts
@@ -1,10 +1,11 @@
-import { addValues, createRGBA, emCalc, listReset, remCalc } from './helpers';
+import { addValues, createRGBA, emCalc, hideVisually, listReset, remCalc } from './helpers';
 
 export * from './helpers';
 export const createHelpers = () => ({
   addValues,
   createRGBA,
   emCalc,
+  hideVisually,
   listReset,
   remCalc,
 });