chore(example-app): ✨ create Progress Bar component screen with examples

Author: Karthik-B-06

example/src/AppRoot.tsx

@@ -8,6 +8,7 @@ import {
   ButtonScreen,
   CheckboxScreen,
   MeterComponentScreen,
+  ProgressScreen,
   SpinnerScreen,
   TagScreen,
   TooltipScreen,
@@ -63,6 +64,11 @@ const AppRoot = () => {
         name="TagScreen"
         component={TagScreen}
       />
+      <Drawer.Screen
+        options={{ title: "ProgressScreen" }}
+        name="ProgressScreen"
+        component={ProgressScreen}
+      />
     </Drawer.Navigator>
   );
 };

example/src/modules/feedback/ProgressScreen.tsx

@@ -0,0 +1,23 @@
+import React from "react";
+import { Box, ProgressBar, useTheme } from "@adaptui/react-native-tailwind";
+
+export const ProgressScreen = () => {
+  const tailwind = useTheme();
+  return (
+    <Box
+      style={tailwind.style(
+        "flex-1 justify-center items-center px-2 bg-white-900",
+      )}
+    >
+      {/* Base Theme Progress Bar */}
+      <ProgressBar style={tailwind.style("my-2")} />
+      {/* Primary Progress Bar */}
+      <ProgressBar themeColor="primary" />
+      {/* Customising Progress Bar */}
+      <ProgressBar
+        style={tailwind.style("my-2")}
+        trackStyle={tailwind.style("bg-green-600")}
+      />
+    </Box>
+  );
+};

example/src/modules/feedback/index.ts

@@ -0,0 +1 @@
+export * from "./ProgressScreen";

example/src/modules/index.ts

@@ -1,2 +1,3 @@
+export * from "./feedback";
 export * from "./popups";
 export * from "./primitives";