refactor: iOS Surface major refactoring (callstack#3738)

osman-turan · Mar 20, 2023 · 352dfc9 · 352dfc9
1 parent 844a2b1
commit 352dfc9
Show file tree

Hide file tree

Showing 37 changed files with 17,775 additions and 17,995 deletions.
diff --git a/example/src/Examples/SurfaceExample.tsx b/example/src/Examples/SurfaceExample.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { StyleSheet } from 'react-native';
+import { StyleSheet, View } from 'react-native';
 
-import { MD3Elevation, Surface, Text } from 'react-native-paper';
+import { MD3Elevation, Surface, Text, MD3Colors } from 'react-native-paper';
 
 import { useExampleTheme } from '..';
 import { isWeb } from '../../utils';
@@ -31,6 +31,23 @@ const SurfaceExample = () => {
  </Text>
  </Surface>
  ))}
+
+ <View style={styles.horizontalSurfacesContainer}>
+ <Surface style={styles.horizontalSurface}>
+ <Text style={styles.centerText}>Left</Text>
+ </Surface>
+ <Surface style={styles.horizontalSurface}>
+ <Text style={styles.centerText}>Right</Text>
+ </Surface>
+ </View>
+ <View style={styles.verticalSurfacesContainer}>
+ <Surface style={styles.verticalSurface}>
+ <Text style={styles.centerText}>Top</Text>
+ </Surface>
+ <Surface style={styles.verticalSurface}>
+ <Text style={styles.centerText}>Bottom</Text>
+ </Surface>
+ </View>
  </ScreenWrapper>
  );
 };
@@ -61,6 +78,37 @@ const styles = StyleSheet.create({
  alignItems: 'center',
  justifyContent: 'center',
  },
+
+ horizontalSurfacesContainer: {
+ flexDirection: 'row',
+ justifyContent: 'space-between',
+ width: '100%',
+ marginBottom: 20,
+ borderColor: MD3Colors.tertiary50,
+ padding: 10,
+ borderWidth: 1,
+ },
+ horizontalSurface: {
+ width: '48%',
+ },
+
+ verticalSurfacesContainer: {
+ height: 400,
+ justifyContent: 'space-between',
+ width: '100%',
+ marginBottom: 100,
+ borderColor: MD3Colors.tertiary50,
+ padding: 10,
+ borderWidth: 1,
+ },
+ verticalSurface: {
+ height: '48%',
+ justifyContent: 'center',
+ },
+
+ centerText: {
+ textAlign: 'center',
+ },
 });
 
 export default SurfaceExample;
diff --git a/src/components/FAB/FAB.tsx b/src/components/FAB/FAB.tsx
@@ -266,7 +266,6 @@ const FAB = forwardRef<View, Props>(
  },
  ],
  },
- styles.container,
  !isV3 && styles.elevated,
  !isV3 && disabled && styles.disabled,
  style,
@@ -286,6 +285,7 @@ const FAB = forwardRef<View, Props>(
  accessibilityRole="button"
  accessibilityState={newAccessibilityState}
  testID={testID}
+ style={{ borderRadius }}
  >
  <View
  style={[styles.content, label ? extendedStyle : fabStyle]}
@@ -330,9 +330,6 @@ const styles = StyleSheet.create({
  elevated: {
  elevation: 6,
  },
- container: {
- overflow: 'hidden',
- },
  content: {
  flexDirection: 'row',
  alignItems: 'center',