chore: update example to use md3 only, removing md2 references

Author: xdimota7x

example/src/DrawerItems.tsx

@@ -9,7 +9,6 @@ import {
   Button,
   Dialog,
   Drawer,
-  MD2Colors,
   MD3Colors,
   Switch,
   Text,
@@ -107,7 +106,6 @@ function DrawerItems() {
     toggleShouldUseDeviceColors,
     toggleTheme,
     toggleRtl: toggleRTL,
-    toggleThemeVersion,
     toggleCollapsed,
     toggleCustomFont,
     toggleRippleEffect,
@@ -137,14 +135,10 @@ function DrawerItems() {
   };
 
   const coloredLabelTheme = {
-    colors: isV3
-      ? {
-          secondaryContainer: MD3Colors.tertiary80,
-          onSecondaryContainer: MD3Colors.tertiary20,
-        }
-      : {
-          primary: MD2Colors.tealA200,
-        },
+    colors: {
+      secondaryContainer: MD3Colors.tertiary80,
+      onSecondaryContainer: MD3Colors.tertiary20,
+    },
   };
 
   return (
@@ -217,15 +211,6 @@ function DrawerItems() {
               </TouchableRipple>
             )}
 
-            <TouchableRipple onPress={toggleThemeVersion}>
-              <View style={[styles.preference, isV3 && styles.v3Preference]}>
-                <Text variant="labelLarge">MD 2</Text>
-                <View pointerEvents="none">
-                  <Switch value={!isV3} />
-                </View>
-              </View>
-            </TouchableRipple>
-
             {isV3 && (
               <TouchableRipple onPress={toggleCollapsed}>
                 <View style={[styles.preference, isV3 && styles.v3Preference]}>

example/src/Examples/ActivityIndicatorExample.tsx

@@ -1,20 +1,12 @@
 import * as React from 'react';
 import { StyleSheet, View } from 'react-native';
 
-import {
-  ActivityIndicator,
-  FAB,
-  List,
-  MD2Colors,
-  MD3Colors,
-} from 'react-native-paper';
+import { ActivityIndicator, FAB, List, MD3Colors } from 'react-native-paper';
 
-import { useExampleTheme } from '../hooks/useExampleTheme';
 import ScreenWrapper from '../ScreenWrapper';
 
 const ActivityIndicatorExample = () => {
   const [animating, setAnimating] = React.useState<boolean>(true);
-  const { isV3 } = useExampleTheme();
 
   return (
     <ScreenWrapper style={styles.container}>
@@ -49,7 +41,7 @@ const ActivityIndicatorExample = () => {
       <List.Section title="Custom color">
         <ActivityIndicator
           animating={animating}
-          color={isV3 ? MD3Colors.error20 : MD2Colors.red500}
+          color={MD3Colors.error20}
           hidesWhenStopped={false}
         />
       </List.Section>

example/src/Examples/AnimatedFABExample/AnimatedFABExample.tsx

@@ -3,13 +3,7 @@ import type { NativeScrollEvent, NativeSyntheticEvent } from 'react-native';
 import { Animated, FlatList, Platform, StyleSheet, View } from 'react-native';
 
 import Icon from '@expo/vector-icons/MaterialCommunityIcons';
-import {
-  Avatar,
-  MD2Colors,
-  MD3Colors,
-  Paragraph,
-  Text,
-} from 'react-native-paper';
+import { Avatar, MD3Colors, Text } from 'react-native-paper';
 
 import CustomFAB from './CustomFAB';
 import CustomFABControls, {
@@ -32,7 +26,7 @@ type Item = {
 };
 
 const AnimatedFABExample = () => {
-  const { colors, isV3 } = useExampleTheme();
+  const { colors } = useExampleTheme();
 
   const isIOS = Platform.OS === 'ios';
 
@@ -47,63 +41,55 @@ const AnimatedFABExample = () => {
 
   const renderItem = React.useCallback(
     ({ item }: { item: Item }) => {
-      const TextComponent = isV3 ? Text : Paragraph;
-
       return (
         <View style={styles.itemContainer}>
           <Avatar.Text
             style={[styles.avatar, { backgroundColor: item.bgColor }]}
             label={item.initials}
-            color={isV3 ? MD3Colors.primary100 : MD2Colors.white}
+            color={MD3Colors.primary100}
             size={40}
           />
           <View style={styles.itemTextContentContainer}>
             <View style={styles.itemHeaderContainer}>
-              <TextComponent
+              <Text
                 variant="labelLarge"
                 style={[styles.header, !item.read && styles.read]}
                 ellipsizeMode="tail"
                 numberOfLines={1}
               >
                 {item.sender}
-              </TextComponent>
-              <TextComponent
+              </Text>
+              <Text
                 variant="labelLarge"
                 style={[styles.date, !item.read && styles.read]}
               >
                 {item.date}
-              </TextComponent>
+              </Text>
             </View>
 
             <View style={styles.itemMessageContainer}>
               <View style={styles.flex}>
-                <TextComponent
+                <Text
                   variant="labelLarge"
                   ellipsizeMode="tail"
                   numberOfLines={1}
                   style={!item.read && styles.read}
                 >
                   {item.header}
-                </TextComponent>
-                <TextComponent
+                </Text>
+                <Text
                   variant="labelLarge"
                   numberOfLines={1}
                   ellipsizeMode="tail"
                 >
                   {item.message}
-                </TextComponent>
+                </Text>
               </View>
 
               <Icon
                 name={item.favorite ? 'star' : 'star-outline'}
                 color={
-                  item.favorite
-                    ? isV3
-                      ? MD3Colors.error70
-                      : MD2Colors.orange500
-                    : isV3
-                    ? MD3Colors.neutralVariant70
-                    : MD2Colors.grey500
+                  item.favorite ? MD3Colors.error70 : MD3Colors.neutralVariant70
                 }
                 size={20}
                 onPress={() => setVisible(!visible)}
@@ -114,7 +100,7 @@ const AnimatedFABExample = () => {
         </View>
       );
     },
-    [visible, isV3]
+    [visible]
   );
 
   const onScroll = ({