Typescript port

.devcontainer/devcontainer.json

@@ -0,0 +1,27 @@
+// For format details, see https://aka.ms/devcontainer.json. For config options, see the
+// README at: https://github.com/devcontainers/templates/tree/main/src/typescript-node
+{
+  "name": "Node.js & TypeScript",
+  // Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
+  "image": "mcr.microsoft.com/devcontainers/typescript-node:1-22-bookworm",
+  "customizations": {
+    "vscode": {
+      "extensions": ["esbenp.prettier-vscode", "dbaeumer.vscode-eslint"]
+    }
+  }
+
+  // Features to add to the dev container. More info: https://containers.dev/features.
+  // "features": {},
+
+  // Use 'forwardPorts' to make a list of ports inside the container available locally.
+  // "forwardPorts": [],
+
+  // Use 'postCreateCommand' to run commands after the container is created.
+  // "postCreateCommand": "yarn install",
+
+  // Configure tool-specific properties.
+  // "customizations": {},
+
+  // Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root.
+  // "remoteUser": "root"
+}

.gitignore

@@ -5,3 +5,5 @@ package-lock.json
 yarn-error.log
 yarn.lock
 .eslintcache
+/dist
+tsconfig.tsbuildinfo

.npmignore

@@ -3,3 +3,4 @@
 /bin
 /docs
 /doc
+/dist

.prettierrc

@@ -0,0 +1,5 @@
+{
+  "bracketSpacing": false,
+  "singleQuote": false,
+  "trailingComma": "all"
+}

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "typescript.tsserver.experimental.enableProjectDiagnostics": true
+}

demo/.gitignore

@@ -0,0 +1,35 @@
+# Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files
+
+# dependencies
+node_modules/
+
+# Expo
+.expo/
+dist/
+web-build/
+
+# Native
+*.orig.*
+*.jks
+*.p8
+*.p12
+*.key
+*.mobileprovision
+
+# Metro
+.metro-health-check*
+
+# debug
+npm-debug.*
+yarn-debug.*
+yarn-error.*
+
+# macOS
+.DS_Store
+*.pem
+
+# local env files
+.env*.local
+
+# typescript
+*.tsbuildinfo

demo/App.tsx

@@ -0,0 +1,55 @@
+import { StatusBar } from "expo-status-bar";
+import { Text, View } from "react-native";
+
+import Markdown from "@ukdanceblue/react-native-markdown-display";
+import { useState } from "react";
+import Picker from "react-native-picker-select";
+import * as Samples from "./sampleFiles";
+
+const sampleList = Object.entries(Samples);
+
+export default function App() {
+  const [selectedSample, setSelectedSample] = useState(sampleList[0][1]);
+
+  return (
+    <View style={{ flex: 1 }}>
+      <StatusBar style="auto" />
+      <Picker
+        items={sampleList.map(([key, value]) => ({label: key, value}))}
+        onValueChange={(value: string) => {
+          setSelectedSample(value);
+        }}
+      />
+      <View
+        style={{
+          flex: 1,
+          flexDirection: "row",
+          backgroundColor: "#fff",
+          alignItems: "flex-start",
+          justifyContent: "flex-start",
+          overflow: "scroll",
+        }}
+      >
+        <Text
+          style={{
+            maxWidth: "50%",
+            width: "50%",
+            flex: 1,
+            fontFamily: "monospace",
+          }}
+        >
+          {selectedSample}
+        </Text>
+        <Markdown
+          style={{
+            maxWidth: "50%",
+            width: "50%",
+            flex: 1,
+          }}
+        >
+          {selectedSample}
+        </Markdown>
+      </View>
+    </View>
+  );
+}

demo/app.json

@@ -0,0 +1,27 @@
+{
+  "expo": {
+    "name": "demo",
+    "slug": "demo",
+    "version": "1.0.0",
+    "orientation": "portrait",
+    "icon": "./assets/icon.png",
+    "userInterfaceStyle": "light",
+    "splash": {
+      "image": "./assets/splash.png",
+      "resizeMode": "contain",
+      "backgroundColor": "#ffffff"
+    },
+    "ios": {
+      "supportsTablet": true
+    },
+    "android": {
+      "adaptiveIcon": {
+        "foregroundImage": "./assets/adaptive-icon.png",
+        "backgroundColor": "#ffffff"
+      }
+    },
+    "web": {
+      "favicon": "./assets/favicon.png"
+    }
+  }
+}

demo/babel.config.js

@@ -0,0 +1,6 @@
+module.exports = function(api) {
+  api.cache(true);
+  return {
+    presets: ['babel-preset-expo'],
+  };
+};

demo/package.json

@@ -0,0 +1,29 @@
+{
+  "name": "demo",
+  "version": "1.0.0",
+  "main": "expo/AppEntry.js",
+  "scripts": {
+    "start": "expo start",
+    "android": "expo start --android",
+    "ios": "expo start --ios",
+    "web": "expo start --web"
+  },
+  "dependencies": {
+    "@expo/metro-runtime": "~3.2.3",
+    "@react-native-picker/picker": "2.7.5",
+    "@ukdanceblue/react-native-markdown-display": "^0.1.3",
+    "expo": "~51.0.28",
+    "expo-status-bar": "~1.12.1",
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
+    "react-native": "0.74.5",
+    "react-native-picker-select": "^9.3.1",
+    "react-native-web": "~0.19.10"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.20.0",
+    "@types/react": "~18.2.45",
+    "typescript": "^5.1.3"
+  },
+  "private": true
+}