fix: remove unwanted lodash dependency from the `@trendmicro/react-…

…styled-ui` package
trendmicro-frontend · Mar 19, 2022 · 4fe93f8 · 4fe93f8
1 parent 8c6dbd0
commit 4fe93f8
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 18 deletions.
diff --git a/packages/react/src/Skeleton/styles.js b/packages/react/src/Skeleton/styles.js
@@ -1,5 +1,4 @@
 import { css, keyframes } from '@emotion/react';
-import _includes from 'lodash/includes';
 import useColorMode from '../useColorMode';
 
 const pulse = keyframes`
@@ -121,7 +120,7 @@ const useSkeletonStyle = ({
   const variantProps = getVariantProps(_props);
 
   const builtinAnimationTypes = ['pulse', 'wave'];
-  if (_includes(builtinAnimationTypes, animation)) {
+  if (builtinAnimationTypes.includes(animation)) {
     animation = undefined;
   }
 

diff --git a/packages/react/src/Tabs/styles.js b/packages/react/src/Tabs/styles.js
@@ -1,5 +1,4 @@
 import { useContext } from 'react';
-import _merge from 'lodash/merge';
 import { TabContext } from './context';
 import useColorMode from '../useColorMode';
 import useTheme from '../useTheme';
@@ -44,19 +43,6 @@ const tabList = {
   borderStyle: 'solid'
 };
 
-const statusProps = {
-  _focus: {
-    zIndex: '3'
-  },
-  _selected: {
-    cursor: 'default'
-  },
-  _disabled: {
-    cursor: 'not-allowed',
-    borderColor: 'transparent',
-  },
-};
-
 const lineStyle = ({ size, colorMode, theme }) => {
   const _color = { light: theme.colors['black:primary'], dark: theme.colors['white:emphasis'] }[colorMode];
   const _fontColor = setColorWithOpacity(_color, 0.6);
@@ -82,13 +68,17 @@ const lineStyle = ({ size, colorMode, theme }) => {
       },
       _selected: {
         color: _selectedFontColor,
+        cursor: 'default',
         borderBottomColor: _selectedBorderColor
       },
       _focus: {
-        borderBottomColor: _focusBorderColor
+        borderBottomColor: _focusBorderColor,
+        zIndex: '3'
       },
       _disabled: {
         color: _disabledColor,
+        cursor: 'not-allowed',
+        borderColor: 'transparent',
         borderBottomColor: _disabledBorderColor,
         backgroundColor: _disabledBackgroundColor
       },
@@ -232,7 +222,7 @@ export const useTabStyle = () => {
   return {
     ...tabProps,
     ...(tabSizes[size] ? tabSizes[size] : tabSizes.md),
-    ..._merge(_variantStyle.tab, statusProps),
+    ..._variantStyle.tab,
     ...(_orientationStyle && _orientationStyle.tab),
     ...(isFitted && { flex: 1 }),
   };