Fixes storybook (#697)

Author: abhijithsheheer

.node-version

@@ -1 +1 @@
-2.7.5
+3.2.2

.ruby-version

@@ -1,6 +1,6 @@
 source 'https://rubygems.org'
 
 # You may use http://rbenv.org/ or https://rvm.io/ to install and use this version
-ruby '2.7.5'
+ruby '3.2.2'
 
 gem 'cocoapods', '~> 1.11', '>= 1.11.2'

Gemfile

@@ -4,10 +4,10 @@ import { AppRegistry } from "react-native";
 
 import App from "./App";
 import { name as appName } from "./app.json";
-import sfBold from "./assets/fonts/SFProText-Bold.ttf";
-import sfMedium from "./assets/fonts/SFProText-Medium.ttf";
-import sfRegular from "./assets/fonts/SFProText-Regular.ttf";
-import sfSemiBold from "./assets/fonts/SFProText-Semibold.ttf";
+import sfBold from "./src/assets/fonts/SFProText-Bold.ttf";
+import sfMedium from "./src/assets/fonts/SFProText-Medium.ttf";
+import sfRegular from "./src/assets/fonts/SFProText-Regular.ttf";
+import sfSemiBold from "./src/assets/fonts/SFProText-Semibold.ttf";
 
 if (module.hot) {
   module.hot.accept();

index.web.js

@@ -13,7 +13,9 @@ import styled from "styled-components/native";
 import { flexbox, space, border, color, layout } from "styled-system";
 
 import ImagePlaceholder from "@assets/images/image-placeholder.svg";
-import { Container, Loader } from "@components";
+
+import { Container } from "./Container";
+import { Loader } from "./Loader";
 
 import { theme } from "../theme";
 

src/components/AnimatedImage.jsx

@@ -12,7 +12,8 @@ import Animated, {
 import { useSafeAreaInsets } from "react-native-safe-area-context";
 import { moderateScale } from "react-native-size-matters";
 
-import { Container, Typography } from "@components";
+import { Container } from "./Container";
+import { Typography } from "./Typography";
 
 const TabElement = ({
   isFocused,

src/components/BottomTabBar.jsx

@@ -9,6 +9,7 @@ import { Container } from "./Container";
 import { Loader } from "./Loader";
 import { Touchable } from "./Touchable";
 import { Typography } from "./Typography";
+
 // eslint-disable-next-line @bigbinary/neeto/no-dangling-constants
 export const BUTTON_VARIANTS = Object.freeze({
   SOLID: "solid",

src/components/Button.jsx

@@ -3,31 +3,33 @@ import * as React from "react";
 import PropTypes from "prop-types";
 import { moderateScale } from "react-native-size-matters";
 
-import { Container, Typography, Touchable } from "@components";
+import { Container } from "./Container";
+import { Touchable } from "./Touchable";
+import { Typography } from "./Typography";
 
 /**
  * ButtonGroup is a linear set of segments, each of which function as a button that can display a different view/or perform a different action.
  * <div class="screenshots">
  *   <img src="screenshots/buttonGroup/buttonGroup.png" />
  * </div>
- * 
+ *
  * ## Usage
  * ```js
  * import React, { useState } from 'react';
  * import { ButtonGroup } from '@bigbinary/neetoui-rn';
- * 
+ *
  * export default function Main(){
  *  const buttonItems = ["Button1", "Button2"];
  *  const [activeButton, setActiveButton] = useState(buttonItems[0]);
- *  
+ *
  *  return(
  *   <ButtonGroup
  *     buttonItems={buttonItems}
  *     onPress={setActiveButton}
  *     currentActiveBtn={activeButton}
- *    />    
+ *    />
  *  );
- * } 
+ * }
 
  * ```
  */

src/components/ButtonGroup.jsx

@@ -13,9 +13,9 @@ import { getShadowStyles } from "../utils";
 const StyledTouchableOpacity = styled(TouchableOpacity)`
   ${flexbox}
   ${space}
- ${border}
- ${color}
- ${layout}
+  ${border}
+  ${color}
+  ${layout}
 `;
 
 /**

src/components/Card.jsx

@@ -5,7 +5,7 @@ import PropTypes from "prop-types";
 import { moderateScale } from "react-native-size-matters";
 import CarouselParent, { Pagination } from "react-native-snap-carousel";
 
-import { Container } from "@components";
+import { Container } from "./Container";
 
 const { width } = Dimensions.get("screen");