fix: shouldForwardProp updates

leather-io · May 1, 2020 · a2d3964 · a2d3964
1 parent c64a2ec
commit a2d3964
Show file tree

Hide file tree

Showing 4 changed files with 10 additions and 9 deletions.
diff --git a/packages/connect/package.json b/packages/connect/package.json
@@ -17,6 +17,7 @@
     "use-onclickoutside": "^0.3.1"
   },
   "devDependencies": {
+    "@babel/helper-validator-identifier": "^7.9.5",
     "@babel/plugin-proposal-optional-chaining": "^7.9.0",
     "@babel/preset-react": "^7.9.4",
     "@babel/preset-typescript": "^7.9.0",

diff --git a/packages/ui/src/box/config.tsx b/packages/ui/src/box/config.tsx
@@ -170,3 +170,5 @@ export const transformAliasProps = (props: any) => {
   }
   return result;
 };
+
+export const extraProps = Object.keys(config);
diff --git a/packages/ui/src/box/index.tsx b/packages/ui/src/box/index.tsx
@@ -1,5 +1,5 @@
 import React, { forwardRef, Ref } from 'react';
-import shouldForwardProp from '@styled-system/should-forward-prop';
+import { createShouldForwardProp, props } from '@styled-system/should-forward-prop';
 import styled from 'styled-components';
 import css from '@styled-system/css';
 
@@ -20,7 +20,7 @@ import {
   compose,
 } from 'styled-system';
 
-import extraConfig, { transformAliasProps as tx } from './config';
+import extraConfig, { extraProps, transformAliasProps as tx } from './config';
 import { BoxProps } from './types';
 
 export * from './types';
@@ -41,11 +41,11 @@ export const systemProps = compose(
   colorStyle
 );
 
-// eslint-disable-next-line @typescript-eslint/ban-ts-ignore
-// @ts-ignore
+const shouldForwardProp = createShouldForwardProp([...props, ...extraProps]);
+
 export const StyledBox = styled('div').withConfig({
-  shouldForwardProp,
-})`
+  shouldForwardProp: prop => shouldForwardProp(prop),
+})<BoxProps>`
   ${systemProps};
   ${extraConfig};
 `;

diff --git a/packages/ui/src/tooltip/hooks.tsx b/packages/ui/src/tooltip/hooks.tsx
@@ -118,7 +118,7 @@ export function useTooltip(props: UseTooltipProps = {}) {
 
   const ref = useRef<any>(null);
   const triggerRef = useMergeRefs(ref, popper.reference.ref);
-  console.log(triggerRef);
+
   const flushRef = useRef<Function>();
 
   useEffect(() => {
@@ -194,8 +194,6 @@ export function useTooltip(props: UseTooltipProps = {}) {
 
   useEventListener('keydown', onKeyDown);
 
-  console.log('popper', popper);
-
   return {
     isOpen,
     show: open,
-Original file line number
+Diff line change
@@ Expand Up / @@ -170,3 +170,5 @@ export const transformAliasProps = (props: any) => { @@
       }
       return result;
     };
+    export const extraProps = Object.keys(config);