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

Author: Karthik-B-06

example/src/AppRoot.tsx

@@ -9,6 +9,7 @@ import {
   CheckboxScreen,
   MeterComponentScreen,
   SpinnerScreen,
+  TagScreen,
   TooltipScreen,
 } from "./modules";
 
@@ -57,6 +58,11 @@ const AppRoot = () => {
         name="TooltipScreen"
         component={TooltipScreen}
       />
+      <Drawer.Screen
+        options={{ title: "TagScreen" }}
+        name="TagScreen"
+        component={TagScreen}
+      />
     </Drawer.Navigator>
   );
 };

example/src/modules/primitives/TagScreen.tsx

@@ -0,0 +1,54 @@
+import React from "react";
+import {
+  Box,
+  CaretRight,
+  Icon,
+  Info,
+  Tag,
+  useTheme,
+} from "@adaptui/react-native-tailwind";
+
+export const TagScreen = () => {
+  const tailwind = useTheme();
+  return (
+    <Box
+      style={tailwind.style("flex-1 justify-center items-center bg-white-900")}
+    >
+      <Tag style={tailwind.style("my-1")}>Default</Tag>
+      <Tag
+        style={tailwind.style("my-1")}
+        prefix={<Icon icon={<Info />} />}
+        variant="outline"
+      >
+        Default Outline
+      </Tag>
+      <Tag style={tailwind.style("my-1")} variant="subtle">
+        Default Subtle
+      </Tag>
+      <Tag style={tailwind.style("my-1")} themeColor="primary">
+        Primary Solid
+      </Tag>
+
+      <Tag
+        prefix={<Icon icon={<Info />} />}
+        style={tailwind.style("my-1")}
+        themeColor="primary"
+        variant="outline"
+      >
+        Primary Outline
+      </Tag>
+      <Tag
+        suffix={<Icon icon={<CaretRight />} />}
+        style={tailwind.style("my-1")}
+        themeColor="primary"
+        variant="subtle"
+        closable
+      >
+        Primary Subtle
+      </Tag>
+      <Tag closable style={tailwind.style("my-1")} themeColor="primary">
+        Close
+      </Tag>
+    </Box>
+  );
+};

example/src/modules/primitives/index.ts

@@ -5,3 +5,4 @@ export * from "./ButtonScreen";
 export * from "./CheckboxScreen";
 export * from "./MeterComponentScreen";
 export * from "./SpinnerScreen";
+export * from "./TagScreen";