Making react-content-loader responsive

I've encountered an issue not so long ago with a problem making react-content-loader - https://github.com/danilowoz/react-content-loader

How should I approach this problem and how would you make it responsive?

EDIT : I opened an issue and he helped me solve it so I'm making this thread for anyone who encountered this issue and need the solution :) Thanks again to Danilo for this amazing solution and this amazing package.

import React from "react";
import { SafeAreaView, StyleSheet, View } from "react-native";

import ContentLoader, { Rect } from "react-content-loader/native";

// viewBox width / viewBox height
const ASPECT_RATIO = 300 / 70;

const MyLoader = () => (
  <ContentLoader height="100%" width="100%" viewBox="0 0 380 70">
    <Rect x="0" y="0" rx="5" ry="5" width="70" height="70" />
    <Rect x="80" y="17" rx="4" ry="4" width="300" height="13" />
    <Rect x="80" y="40" rx="3" ry="3" width="250" height="10" />
  </ContentLoader>
);

export default function App() {
  return (
    <SafeAreaView style={styles.container}>
      <View style={styles.small}>
        <MyLoader />
      </View>
      <View style={styles.haft}>
        <MyLoader />
      </View>
      <View style={styles.full}>
        <MyLoader />
      </View>
    </SafeAreaView>
  );
}

const styles = StyleSheet.create({
  container: {
    flexDirection: "column",
    justifyContent: "flex-start",
    flex: 1,
  },
  small: {
    aspectRatio: ASPECT_RATIO,
    width: "20%",
  },
  haft: {
    aspectRatio: ASPECT_RATIO,
    width: "50%",
  },
  full: {
    aspectRatio: ASPECT_RATIO,
    width: "100%",
  },
});