Add a design system (#34)

* Add theming system

* Add standard Button control and update RadioButtons

* Unify radiobutton with design system

* Update debug screen to have multiple views

* Add ToggleButton

* Update error controls to use design system

* Add typography to <Text> element

* Move DropdownButton into the design system

* Clean out old code

* Move Text into design system

* Add 'inverted' color palette

* Move LoadingPlaceholder into the design system

1 files changed, 23 insertions, 0 deletions

diff --git a/src/view/com/util/text/Text.tsx b/src/view/com/util/text/Text.tsx
new file mode 100644
index 000000000..549eb2901
--- /dev/null
+++ b/src/view/com/util/text/Text.tsx
@@ -0,0 +1,23 @@
+import React from 'react'
+import {Text as RNText, TextProps} from 'react-native'
+import {s} from '../../../lib/styles'
+import {useTheme, TypographyVariant} from '../../../lib/ThemeContext'
+
+export type CustomTextProps = TextProps & {
+  type?: TypographyVariant
+}
+
+export function Text({
+  type = 'body1',
+  children,
+  style,
+  ...props
+}: React.PropsWithChildren<CustomTextProps>) {
+  const theme = useTheme()
+  const typography = theme.typography[type]
+  return (
+    <RNText style={[s.black, typography, style]} {...props}>
+      {children}
+    </RNText>
+  )
+}