`create-astro` UI (#164)

* refactor: improve create-astro layout, build script

* feat(create-astro): v0.1.0

* docs(create-astro): add README

* feat(create-astro): add meta files to starter templates

1 files changed, 20 insertions, 0 deletions

diff --git a/packages/create-astro/src/components/Header.tsx b/packages/create-astro/src/components/Header.tsx
new file mode 100644
index 000000000..1d894a60e
--- /dev/null
+++ b/packages/create-astro/src/components/Header.tsx
@@ -0,0 +1,20 @@
+import React from 'react';
+import { Box, Text } from 'ink';
+
+const getMessage = ({ projectName, template }) => {
+    switch (true) {
+        case !projectName: return <Text dimColor>Gathering mission details</Text>;
+        case !template: return <Text dimColor>Optimizing navigational system</Text>;
+        default: return <Text color="black" backgroundColor="white"> {projectName} </Text>
+    }
+}
+
+const Header: React.FC<{ context: any }> = ({ context }) => (
+    <Box width={48} display="flex" marginY={1}>
+        <Text backgroundColor="#882DE7" color="white">{' astro '}</Text>
+        <Box marginLeft={1}>
+            {getMessage(context)}
+        </Box>
+    </Box>
+)
+export default Header;