components added

src/components/component-sample.tsx → src/components/_component-sample.tsx

@@ -1,13 +1,11 @@
 import React from 'react';
 import {View, Text} from 'react-native-ui-lib';
 
-type ExampleComponentProps = {
+type Props = {
   title?: string;
 };
 
-export const ExampleComponent: React.FC<ExampleComponentProps> = ({
-  title,
-}: ExampleComponentProps) => {
+export const ExampleComponent: React.FC<Props> = ({title}) => {
   return (
     <View>
       <Text>{title}</Text>

src/components/button.tsx

@@ -2,21 +2,17 @@ import React from 'react';
 import {View, Text, MarginModifiers} from 'react-native-ui-lib';
 import {Bounceable} from 'rn-bounceable';
 
-type ButtonProps = MarginModifiers & {
+type Props = MarginModifiers & {
   label?: string;
   onPress?: PureFunc;
 };
 
-export const BButton: React.FC<ButtonProps> = ({
-  label,
-  onPress,
-  ...modifiers
-}: ButtonProps) => {
+export const BButton: React.FC<Props> = ({label, onPress, ...modifiers}) => {
   return (
     <View {...modifiers}>
       <Bounceable onPress={onPress}>
         <View center bg-primary padding-s4 br40>
-          <Text text65M whitish>
+          <Text text65M _white>
             {label}
           </Text>
         </View>

src/components/reanimated2.tsx

@@ -7,16 +7,7 @@ import Animated, {
 } from 'react-native-reanimated';
 import {Bounceable} from 'rn-bounceable';
 
-import {genNativeId} from '../services/navigation/sharedTransition';
-import {SharedTransitionId} from '../services/navigation/types';
-
-type Reanimated2Props = {
-  stID?: SharedTransitionId;
-};
-
-export const Reanimated2: React.FC<Reanimated2Props> = ({
-  stID,
-}: Reanimated2Props) => {
+export const Reanimated2: React.FC = () => {
   const offset = useSharedValue(0);
 
   const animatedStyles = useAnimatedStyle(() => ({
@@ -32,13 +23,8 @@ export const Reanimated2: React.FC<Reanimated2Props> = ({
       <Animated.View style={[animatedStyles]}>
         <View center padding-s1>
           <Bounceable onPress={moveObject} activeScale={0.9}>
-            <View
-              nativeID={genNativeId(stID)}
-              center
-              bg-primary
-              padding-s8
-              br40>
-              <Text whitish>Bounceable</Text>
+            <View center bg-primary padding-s8 br40>
+              <Text _white>Bounceable</Text>
             </View>
           </Bounceable>
         </View>

src/components/section.tsx

@@ -1,36 +1,18 @@
-import React from 'react';
-import {View, Text} from 'react-native-ui-lib';
-
-type SectionProps = {
-  children: React.ReactNode;
-  title: string;
-  bg?: boolean;
-};
-
-export const Section: React.FC<SectionProps> = ({
-  children,
-  title,
-  bg,
-}: SectionProps) => {
-  const S = {
-    'bg-bg2Color': bg,
-    'paddingH-s1': bg,
-    'paddingV-s2': bg,
-  };
+import React, {PropsWithChildren} from 'react';
+import {Text, View} from 'react-native-ui-lib';
 
+export const Section: React.FC<
+  PropsWithChildren<{
+    title: string;
+  }>
+> = ({children, title}) => {
   return (
-    <View paddingV-s1>
-      <View row>
-        <Text textColor section>
-          {title}
-        </Text>
-      </View>
+    <View margin-s2 marginV-s3 paddingH-s3>
+      <Text section textColor>
+        {title}
+      </Text>
 
-      <View paddingH-s2 paddingV-s2>
-        <View br40 {...S}>
-          {children}
-        </View>
-      </View>
+      <View padding-s2>{children}</View>
     </View>
   );
 };