Chore/improve text

src/components/molecules/index.ts

@@ -1,4 +1,3 @@
-export * from './BootomSheetScrollables'
 export * from './Field'
 export * from './MenuItem'
 export * from './TextArea'

src/design-system/bottomSheets/BottomSheet.tsx

@@ -9,8 +9,8 @@ import {
 import { RefObject, useCallback } from 'react'
 import { Dimensions } from 'react-native'
 
+import { BottomSheetScrollView } from './BootomSheetScrollables'
 import { BottomSheetHeader } from './BottomSheetHeader'
-import { BottomSheetScrollView } from '../../components/molecules'
 
 const screenHeight = Dimensions.get('screen').height
 

src/design-system/bottomSheets/BottomSheetFlatList.tsx

@@ -1,2 +1,2 @@
 // export { BottomSheetFlatList } from '@gorhom/bottom-sheet'
-export { BottomSheetFlatList } from '../../components/molecules'
+export { BottomSheetFlatList } from './BootomSheetScrollables'

src/design-system/components/Button/__snapshots__/Button.test.tsx.snap

@@ -66,7 +66,7 @@ exports[`Button renders correctly 1`] = `
       style={
         {
           "color": "#FFFFFF",
-          "fontFamily": "Inter_Semibold",
+          "fontFamily": "Inter_SemiBold",
           "fontSize": 14,
           "fontStyle": "normal",
           "fontWeight": "400",

src/design-system/components/Text/Text.tsx

@@ -8,6 +8,7 @@ import {
   displayVariants,
   fontDisplaySize,
   fontTextSize,
+  FontWeight,
   fontWeights,
   TextVariant,
   textVariants,
@@ -73,25 +74,40 @@ const RawText = memo(
     ) => {
       const theme = useTheme()
 
-      const { fontWeight: variantFontWeight, fontSize: variantFontSize } =
-        type === 'text' ? textVariants[variant as TextVariant] : displayVariants[variant]
+      const { fontWeight: variantFontWeight, fontSize: variantFontSize } = useMemo(
+        () => (type === 'text' ? textVariants[variant as TextVariant] : displayVariants[variant]),
+        [type, variant]
+      )
 
-      const fontFamily = props.fontFamily || variantFontWeight
-      const fontWeight = bold ? 'bold' : props.fontWeight || fontWeights[variantFontWeight]
-      const fontSize =
-        props.fontSize ||
-        (type === 'text'
-          ? fontTextSize[variantFontSize as keyof typeof fontTextSize]
-          : fontDisplaySize[variantFontSize])
+      const fontFamily = useMemo(
+        (): FontWeight => props.fontFamily || variantFontWeight,
+        [props.fontFamily, variantFontWeight]
+      )
+      const fontWeight = useMemo(
+        (): TextStyle['fontWeight'] =>
+          bold ? 'bold' : props.fontWeight || fontWeights[variantFontWeight],
+        [bold, props.fontWeight, variantFontWeight]
+      )
+      const fontSize = useMemo(
+        (): number =>
+          props.fontSize ||
+          (type === 'text'
+            ? fontTextSize[variantFontSize as keyof typeof fontTextSize]
+            : fontDisplaySize[variantFontSize]),
+        [props.fontSize, type, variantFontSize]
+      )
 
       const fontFamilyStyle = useMemo<TextStyle>(
         () => ({
-          fontFamily: fontFamily ? theme.fonts[fontFamily] : undefined,
+          fontFamily: fontFamily ? theme.fonts[variantFontWeight] : undefined,
         }),
-        [theme, fontFamily]
+        [fontFamily, theme.fonts, variantFontWeight]
       )
 
-      const finalFontSize = fontSize && typeof fontSize === 'number' ? fontSize : undefined
+      const finalFontSize = useMemo(
+        () => (fontSize && typeof fontSize === 'number' ? fontSize : undefined),
+        [fontSize]
+      )
 
       const lineHeightStyle = useMemo<TextStyle>(
         () => ({

src/design-system/config/theme.ts

@@ -124,7 +124,7 @@ export const fontWeights: { [key in FontWeight]: '400' | '500' | '600' | '700' }
 export const fonts: { [key in FontWeight]: string } = {
   Regular: 'Inter_Regular',
   Medium: 'Inter_Medium',
-  Semibold: 'Inter_Semibold',
+  Semibold: 'Inter_SemiBold',
   Bold: 'Inter_Bold',
 } as const