Reorganize monorepo structure

* Move all config files to './configs' * Simplify './scripts' folder.
2026-06-04 11:04:58 +00:00 · 2022-06-30 23:17:16 -07:00
parent d31a8a1ec1
commit f81095442f
140 changed files with 110 additions and 98 deletions
@@ -0,0 +1,111 @@
+import React from 'react';
+import { StyleSheet, Text, Pressable, View } from 'react-native';
+import Example from '../../shared/example';
+
+const log = (...msg) => {
+  console.log(...msg);
+};
+
+const l1 = { width: '100%', paddingLeft: 0, paddingTop: 0 };
+const l2 = { width: '75%', paddingLeft: 10, paddingTop: 10 };
+
+function Box({ pointerEvents }) {
+  return (
+    <Pressable
+      onPress={log}
+      pointerEvents={pointerEvents}
+      style={({ pressed }) => [styles.box, pressed && styles.purple]}
+    >
+      <Pressable onPress={log} style={({ pressed }) => [styles.content, pressed && styles.orange]}>
+        <Text>{pointerEvents}</Text>
+      </Pressable>
+    </Pressable>
+  );
+}
+
+export default function ViewPage() {
+  const [layoutInfo, setLayoutInfo] = React.useState({});
+  const [layoutStyle, setLayoutStyle] = React.useState(l1);
+
+  React.useEffect(() => {
+    const interval = setInterval(() => {
+      setLayoutStyle((l) => (l.width === '100%' ? l2 : l1));
+    }, 2500);
+    return () => {
+      clearInterval(interval);
+    };
+  }, []);
+
+  const handleLayout = ({ nativeEvent }) => {
+    setLayoutInfo(() => ({ ...nativeEvent.layout }));
+  };
+
+  return (
+    <Example title="View">
+      <View style={styles.container}>
+        <Text accessibilityRole="heading" style={styles.heading}>
+          onLayout
+        </Text>
+        <View>
+          <View style={[styles.layoutContainer, layoutStyle]}>
+            <View onLayout={handleLayout} style={styles.layoutBox} />
+          </View>
+          <Text>{JSON.stringify(layoutInfo, null, 2)}</Text>
+        </View>
+
+        <Text accessibilityRole="heading" style={styles.heading}>
+          pointerEvents
+        </Text>
+        <View pointerEvents="box-none">
+          <View pointerEvents="box-none" style={styles.boxContainer}>
+            <Box pointerEvents="none" />
+            <Box pointerEvents="auto" />
+            <Box pointerEvents="box-only" />
+            <Box pointerEvents="box-none" />
+          </View>
+        </View>
+      </View>
+    </Example>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    alignSelf: 'stretch',
+    padding: 10
+  },
+  heading: {
+    fontWeight: 'bold',
+    marginVertical: '1rem'
+  },
+  layoutContainer: {
+    marginBottom: '1rem'
+  },
+  layoutBox: {
+    backgroundColor: '#FFAD1F',
+    height: 50
+  },
+  boxContainer: {
+    height: 50
+  },
+  box: {
+    backgroundColor: '#ececec',
+    padding: 30,
+    marginVertical: 5,
+    userSelect: 'none'
+  },
+  content: {
+    backgroundColor: 'white',
+    padding: 10,
+    borderWidth: 1,
+    borderColor: 'black',
+    borderStyle: 'solid',
+    userSelect: 'none'
+  },
+  orange: {
+    backgroundColor: 'orange'
+  },
+  purple: {
+    backgroundColor: 'purple'
+  }
+});