refactor: rename md3 to default

docs/src/components/BannerExample.tsx

@@ -9,8 +9,8 @@ import {
   Avatar,
   Button,
   FAB,
-  MD3DarkTheme as DarkTheme,
-  MD3LightTheme as DefaultTheme,
+  DarkTheme,
+  LightTheme,
   ProgressBar,
   PaperProvider,
   RadioButton,
@@ -167,7 +167,7 @@ const Shimmer = () => {
 const ThemedBannerExample = () => {
   const isDarkTheme = useColorMode().colorMode === 'dark';
   return (
-    <PaperProvider theme={isDarkTheme ? DarkTheme : DefaultTheme}>
+    <PaperProvider theme={isDarkTheme ? DarkTheme : LightTheme}>
       <BannerExample />
     </PaperProvider>
   );

docs/src/components/GetStartedButtons.tsx

@@ -9,8 +9,8 @@ import Link from '@docusaurus/Link';
 import { useColorMode } from '@docusaurus/theme-common';
 import {
   Button,
-  MD3DarkTheme as DarkTheme,
-  MD3LightTheme as DefaultTheme,
+  DarkTheme,
+  LightTheme,
   PaperProvider,
 } from 'react-native-paper';
 
@@ -95,7 +95,7 @@ const Shimmer = () => {
 const ThemedGetStarted = () => {
   const isDarkTheme = useColorMode().colorMode === 'dark';
   return (
-    <PaperProvider theme={isDarkTheme ? DarkTheme : DefaultTheme}>
+    <PaperProvider theme={isDarkTheme ? DarkTheme : LightTheme}>
       <GetStartedButton />
     </PaperProvider>
   );

example/src/DrawerItems.tsx

@@ -9,7 +9,7 @@ import {
   Button,
   Dialog,
   Drawer,
-  MD3Colors,
+  Colors,
   Switch,
   Text,
   TouchableRipple,
@@ -136,8 +136,8 @@ function DrawerItems() {
 
   const coloredLabelTheme = {
     colors: {
-      secondaryContainer: MD3Colors.tertiary80,
-      onSecondaryContainer: MD3Colors.tertiary20,
+      secondaryContainer: Colors.tertiary80,
+      onSecondaryContainer: Colors.tertiary20,
     },
   };
 
@@ -184,7 +184,7 @@ function DrawerItems() {
             {deviceColorsSupported ? (
               <TouchableRipple onPress={toggleShouldUseDeviceColors}>
                 <View style={styles.preference}>
-                  <Text variant="labelLarge">Use device colors *</Text>
+                  <Text variant="labelLarge">Use device colors</Text>
                   <View pointerEvents="none">
                     <Switch value={shouldUseDeviceColors} />
                   </View>
@@ -213,7 +213,7 @@ function DrawerItems() {
 
             <TouchableRipple onPress={toggleCollapsed}>
               <View style={styles.preference}>
-                <Text variant="labelLarge">Collapsed drawer *</Text>
+                <Text variant="labelLarge">Collapsed drawer</Text>
                 <View pointerEvents="none">
                   <Switch value={collapsed} />
                 </View>
@@ -222,7 +222,7 @@ function DrawerItems() {
 
             <TouchableRipple onPress={toggleCustomFont}>
               <View style={styles.preference}>
-                <Text variant="labelLarge">Custom font *</Text>
+                <Text variant="labelLarge">Custom font</Text>
                 <View pointerEvents="none">
                   <Switch value={customFontLoaded} />
                 </View>
@@ -232,19 +232,14 @@ function DrawerItems() {
             <TouchableRipple onPress={toggleRippleEffect}>
               <View style={styles.preference}>
                 <Text variant="labelLarge">
-                  {isIOS ? 'Highlight' : 'Ripple'} effect *
+                  {isIOS ? 'Highlight' : 'Ripple'} effect
                 </Text>
                 <View pointerEvents="none">
                   <Switch value={rippleEffectEnabled} />
                 </View>
               </View>
             </TouchableRipple>
           </Drawer.Section>
-          {!collapsed && (
-            <Text variant="bodySmall" style={styles.annotation}>
-              * - available only for MD3
-            </Text>
-          )}
           <Text variant="bodySmall" style={styles.annotation}>
             React Native Paper Version{' '}
             {require('react-native-paper/package.json').version}

example/src/Examples/ActivityIndicatorExample.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { StyleSheet, View } from 'react-native';
 
-import { ActivityIndicator, FAB, List, MD3Colors } from 'react-native-paper';
+import { ActivityIndicator, FAB, List, Colors } from 'react-native-paper';
 
 import ScreenWrapper from '../ScreenWrapper';
 
@@ -41,7 +41,7 @@ const ActivityIndicatorExample = () => {
       <List.Section title="Custom color">
         <ActivityIndicator
           animating={animating}
-          color={MD3Colors.error20}
+          color={Colors.error20}
           hidesWhenStopped={false}
         />
       </List.Section>

example/src/Examples/AnimatedFABExample/AnimatedFABExample.tsx

@@ -3,7 +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, MD3Colors, Text, useTheme } from 'react-native-paper';
+import { Avatar, Colors, Text, useTheme } from 'react-native-paper';
 
 import CustomFAB from './CustomFAB';
 import CustomFABControls, {
@@ -44,7 +44,7 @@ const AnimatedFABExample = () => {
           <Avatar.Text
             style={[styles.avatar, { backgroundColor: item.bgColor }]}
             label={item.initials}
-            color={MD3Colors.primary100}
+            color={Colors.primary100}
             size={40}
           />
           <View style={styles.itemTextContentContainer}>
@@ -86,9 +86,7 @@ const AnimatedFABExample = () => {
 
               <Icon
                 name={item.favorite ? 'star' : 'star-outline'}
-                color={
-                  item.favorite ? MD3Colors.error70 : MD3Colors.neutralVariant70
-                }
+                color={item.favorite ? Colors.error70 : Colors.neutralVariant70}
                 size={20}
                 onPress={() => setVisible(!visible)}
                 style={styles.icon}

example/src/Examples/AvatarExample.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { StyleSheet, View } from 'react-native';
 
-import { Avatar, List, MD3Colors } from 'react-native-paper';
+import { Avatar, List, Colors } from 'react-native-paper';
 
 import ScreenWrapper from '../ScreenWrapper';
 
@@ -14,11 +14,11 @@ const AvatarExample = () => {
             style={[
               styles.avatar,
               {
-                backgroundColor: MD3Colors.error70,
+                backgroundColor: Colors.error70,
               },
             ]}
             label="XD"
-            color={MD3Colors.primary0}
+            color={Colors.primary0}
           />
           <Avatar.Text style={styles.avatar} label="XD" />
           <Avatar.Text style={styles.avatar} label="XD" size={80} />
@@ -30,11 +30,11 @@ const AvatarExample = () => {
             style={[
               styles.avatar,
               {
-                backgroundColor: MD3Colors.error70,
+                backgroundColor: Colors.error70,
               },
             ]}
             icon="folder"
-            color={MD3Colors.primary0}
+            color={Colors.primary0}
           />
           <Avatar.Icon style={styles.avatar} icon="folder" />
           <Avatar.Icon style={styles.avatar} icon="folder" size={80} />

example/src/Examples/BadgeExample.tsx

@@ -5,7 +5,7 @@ import {
   Badge,
   IconButton,
   List,
-  MD3Colors,
+  Colors,
   Text,
   Switch,
 } from 'react-native-paper';
@@ -41,7 +41,7 @@ const BadgeExample = () => {
               style={[
                 styles.badge,
                 {
-                  backgroundColor: MD3Colors.primary80,
+                  backgroundColor: Colors.primary80,
                 },
               ]}
             >

example/src/Examples/BannerExample.tsx

@@ -8,7 +8,7 @@ import {
   View,
 } from 'react-native';
 
-import { Banner, FAB, MD3Colors, useTheme } from 'react-native-paper';
+import { Banner, FAB, Colors, useTheme } from 'react-native-paper';
 
 import ScreenWrapper from '../ScreenWrapper';
 
@@ -31,11 +31,11 @@ const BannerExample = () => {
   const customTheme = {
     ...theme,
     colors: {
-      onSurface: MD3Colors.tertiary100,
+      onSurface: Colors.tertiary100,
       elevation: {
-        level1: MD3Colors.tertiary50,
+        level1: Colors.tertiary50,
       },
-      primary: MD3Colors.tertiary10,
+      primary: Colors.tertiary10,
     },
   };
 

example/src/Examples/CheckboxExample.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { StyleSheet, View } from 'react-native';
 
-import { Checkbox, MD3Colors, Text, TouchableRipple } from 'react-native-paper';
+import { Checkbox, Colors, Text, TouchableRipple } from 'react-native-paper';
 
 import ScreenWrapper from '../ScreenWrapper';
 
@@ -26,7 +26,7 @@ const CheckboxExample = () => {
           <Text>Custom</Text>
           <View pointerEvents="none">
             <Checkbox
-              color={MD3Colors.error70}
+              color={Colors.error70}
               status={checkedCustom ? 'checked' : 'unchecked'}
             />
           </View>

example/src/Examples/ChipExample.tsx

@@ -2,11 +2,11 @@ import * as React from 'react';
 import { Image, StyleSheet, View } from 'react-native';
 
 import color from 'color';
-import { Chip, List, MD3Colors, Snackbar, Text } from 'react-native-paper';
+import { Chip, List, Colors, Snackbar, Text } from 'react-native-paper';
 
 import ScreenWrapper from '../ScreenWrapper';
 
-const customColor = MD3Colors.error50;
+const customColor = Colors.error50;
 
 const ChipExample = () => {
   const [snackbarProperties, setSnackbarProperties] = React.useState({

example/src/Examples/Dialogs/DialogWithCustomColors.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 
-import { Button, Portal, Dialog, MD3Colors } from 'react-native-paper';
+import { Button, Portal, Dialog, Colors } from 'react-native-paper';
 
 import { TextComponent } from './DialogTextComponent';
 
@@ -16,20 +16,18 @@ const DialogWithCustomColors = ({
       <Dialog
         onDismiss={close}
         style={{
-          backgroundColor: MD3Colors.primary10,
+          backgroundColor: Colors.primary10,
         }}
         visible={visible}
       >
-        <Dialog.Title style={{ color: MD3Colors.primary95 }}>
-          Alert
-        </Dialog.Title>
+        <Dialog.Title style={{ color: Colors.primary95 }}>Alert</Dialog.Title>
         <Dialog.Content>
-          <TextComponent style={{ color: MD3Colors.primary95 }}>
+          <TextComponent style={{ color: Colors.primary95 }}>
             This is a dialog with custom colors
           </TextComponent>
         </Dialog.Content>
         <Dialog.Actions>
-          <Button textColor={MD3Colors.primary95} onPress={close}>
+          <Button textColor={Colors.primary95} onPress={close}>
             Ok
           </Button>
         </Dialog.Actions>

example/src/Examples/Dialogs/DialogWithDismissableBackButton.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 
-import { Button, Portal, Dialog, MD3Colors } from 'react-native-paper';
+import { Button, Portal, Dialog, Colors } from 'react-native-paper';
 
 import { TextComponent } from './DialogTextComponent';
 
@@ -26,7 +26,7 @@ const DialogWithDismissableBackButton = ({
         </TextComponent>
       </Dialog.Content>
       <Dialog.Actions>
-        <Button textColor={MD3Colors.tertiary50} disabled>
+        <Button textColor={Colors.tertiary50} disabled>
           Disagree
         </Button>
         <Button onPress={close}>Agree</Button>

example/src/Examples/Dialogs/DialogWithIcon.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { StyleSheet } from 'react-native';
 
-import { Button, Portal, Dialog, MD3Colors } from 'react-native-paper';
+import { Button, Portal, Dialog, Colors } from 'react-native-paper';
 
 import { TextComponent } from './DialogTextComponent';
 
@@ -24,7 +24,7 @@ const DialogWithIcon = ({
           </TextComponent>
         </Dialog.Content>
         <Dialog.Actions>
-          <Button onPress={close} color={MD3Colors.error50}>
+          <Button onPress={close} color={Colors.error50}>
             Disagree
           </Button>
           <Button onPress={close}>Agree</Button>

example/src/Examples/Dialogs/DialogWithLoadingIndicator.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { ActivityIndicator, Platform, StyleSheet, View } from 'react-native';
 
-import { Dialog, MD3Colors, Portal } from 'react-native-paper';
+import { Dialog, Colors, Portal } from 'react-native-paper';
 
 import { TextComponent } from './DialogTextComponent';
 
@@ -21,7 +21,7 @@ const DialogWithLoadingIndicator = ({
         <Dialog.Content>
           <View style={styles.flexing}>
             <ActivityIndicator
-              color={MD3Colors.tertiary30}
+              color={Colors.tertiary30}
               size={isIOS ? 'large' : 48}
               style={styles.marginRight}
             />

example/src/Examples/Dialogs/UndismissableDialog.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 
-import { Button, Portal, Dialog, MD3Colors } from 'react-native-paper';
+import { Button, Portal, Dialog, Colors } from 'react-native-paper';
 
 import { TextComponent } from './DialogTextComponent';
 
@@ -18,7 +18,7 @@ const UndismissableDialog = ({
         <TextComponent>This is an undismissable dialog!!</TextComponent>
       </Dialog.Content>
       <Dialog.Actions>
-        <Button textColor={MD3Colors.tertiary50} disabled>
+        <Button textColor={Colors.tertiary50} disabled>
           Disagree
         </Button>
         <Button onPress={close}>Agree</Button>