From 044454110d67dad4d6ffab0a6bdb7e1475dbeebf Mon Sep 17 00:00:00 2001
From: Dominic Go <18517029+dominicstop@users.noreply.github.com>
Date: Sat, 22 Apr 2023 09:22:17 +0800
Subject: [PATCH] =?UTF-8?q?=20=E2=AD=90=EF=B8=8F=20Update:=20Add=20Placeho?=
 =?UTF-8?q?lder=20for=20`Test09=20`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 example/src/examples/Test09.tsx    | 62 ++++++++++++++++++++++++++++++
 example/src/screens/HomeScreen.tsx |  2 +
 2 files changed, 64 insertions(+)
 create mode 100644 example/src/examples/Test09.tsx

diff --git a/example/src/examples/Test09.tsx b/example/src/examples/Test09.tsx
new file mode 100644
index 00000000..2ac328c7
--- /dev/null
+++ b/example/src/examples/Test09.tsx
@@ -0,0 +1,62 @@
+import * as React from 'react';
+import { StyleSheet } from 'react-native';
+
+import type { ExampleProps } from './SharedExampleTypes';
+
+import { ExampleCard } from '../components/ExampleCard';
+
+import { CardBody, CardButton, CardTitle } from '../components/Card';
+
+import { ModalView } from 'react-native-ios-modal';
+
+export function Test09(props: ExampleProps) {
+  const modalRef = React.useRef<ModalView>(null);
+
+  const [counter, setCounter] = React.useState(0);
+
+  return (
+    <ExampleCard
+      style={props.style}
+      index={props.index}
+      title={'Test09'}
+      subtitle={'test - TBA'}
+      description={['desc - TBA']}
+    >
+      <ModalView
+        // TBA
+        ref={modalRef}
+        containerStyle={styles.modalContainer}
+      >
+        <React.Fragment>
+          <CardBody style={styles.modalCard}>
+            <CardTitle title={'Title - TBA'} />
+          </CardBody>
+          <CardButton
+            title={'🌼 TBA'}
+            onPress={() => {
+              // TBA
+            }}
+          />
+        </React.Fragment>
+      </ModalView>
+      <CardButton
+        title={'Show Modal'}
+        onPress={() => {
+          modalRef.current.setVisibility(true);
+        }}
+      />
+    </ExampleCard>
+  );
+}
+
+export const styles = StyleSheet.create({
+  modalContainer: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  modalCard: {
+    alignSelf: 'stretch',
+    backgroundColor: 'white',
+  },
+});
diff --git a/example/src/screens/HomeScreen.tsx b/example/src/screens/HomeScreen.tsx
index af5a53e2..549c3749 100644
--- a/example/src/screens/HomeScreen.tsx
+++ b/example/src/screens/HomeScreen.tsx
@@ -17,6 +17,7 @@ import { Test05 } from '../examples/Test05';
 import { Test06 } from '../examples/Test06';
 import { Test07 } from '../examples/Test07';
 import { Test08 } from '../examples/Test08';
+import { Test09 } from '../examples/Test09';
 
 import { Example01 } from '../examples/Example01';
 
@@ -49,6 +50,7 @@ const EXAMPLE_COMPONENTS: Array<ExampleComponentItem> = [
   Test06,
   Test07,
   Test08,
+  Test09,
   Example01,
   SHARED_ENV.enableReactNavigation && DebugControls,
 ];