From bbb50922bf2d80e6b510eaca35477efb75704722 Mon Sep 17 00:00:00 2001 From: "Thomas F. K. Jorna" Date: Mon, 19 Jul 2021 03:19:14 +0200 Subject: web build with offline support --- app/components/graph-ui/graph-ui.story.tsx | 15 ++++++++ app/components/graph-ui/graph-ui.tsx | 40 +++++++++++++++++++ app/components/local-button/local-button.story.tsx | 15 ++++++++ app/components/local-button/local-button.tsx | 45 ++++++++++++++++++++++ 4 files changed, 115 insertions(+) create mode 100644 app/components/graph-ui/graph-ui.story.tsx create mode 100644 app/components/graph-ui/graph-ui.tsx create mode 100644 app/components/local-button/local-button.story.tsx create mode 100644 app/components/local-button/local-button.tsx (limited to 'app') diff --git a/app/components/graph-ui/graph-ui.story.tsx b/app/components/graph-ui/graph-ui.story.tsx new file mode 100644 index 0000000..71151c8 --- /dev/null +++ b/app/components/graph-ui/graph-ui.story.tsx @@ -0,0 +1,15 @@ +import * as React from "react" +import { storiesOf } from "@storybook/react-native" +import { StoryScreen, Story, UseCase } from "../../../storybook/views" +import { color } from "../../theme" +import { GraphUi } from "./graph-ui" + +storiesOf("GraphUi", module) + .addDecorator((fn) => {fn()}) + .add("Style Presets", () => ( + + + + + + )) diff --git a/app/components/graph-ui/graph-ui.tsx b/app/components/graph-ui/graph-ui.tsx new file mode 100644 index 0000000..9ea792a --- /dev/null +++ b/app/components/graph-ui/graph-ui.tsx @@ -0,0 +1,40 @@ +import * as React from "react" +import { StyleProp, TextStyle, View, ViewStyle } from "react-native" +import { observer } from "mobx-react-lite" +import { color, typography } from "../../theme" +import { LocalButton, Text, Tweaks } from "../" +import { flatten } from "ramda" + +const CONTAINER: ViewStyle = { + justifyContent: "center", +} + +const TEXT: TextStyle = { + fontFamily: typography.primary, + fontSize: 14, + color: color.primary, +} + +export interface GraphUiProps { + /** + * An optional style override useful for padding & margin. + */ + style?: StyleProp + physics + setPhysics +} + +/** + * Describe your component here + */ +export const GraphUi = observer(function GraphUi(props: GraphUiProps) { + const { style, physics, setPhysics } = props + const styles = flatten([CONTAINER, style]) + + return ( + + + + + ) +}) diff --git a/app/components/local-button/local-button.story.tsx b/app/components/local-button/local-button.story.tsx new file mode 100644 index 0000000..22b2f0e --- /dev/null +++ b/app/components/local-button/local-button.story.tsx @@ -0,0 +1,15 @@ +import * as React from "react" +import { storiesOf } from "@storybook/react-native" +import { StoryScreen, Story, UseCase } from "../../../storybook/views" +import { color } from "../../theme" +import { LocalButton } from "./local-button" + +storiesOf("LocalButton", module) + .addDecorator((fn) => {fn()}) + .add("Style Presets", () => ( + + + + + + )) diff --git a/app/components/local-button/local-button.tsx b/app/components/local-button/local-button.tsx new file mode 100644 index 0000000..6507b76 --- /dev/null +++ b/app/components/local-button/local-button.tsx @@ -0,0 +1,45 @@ +import * as React from "react" +import { StyleProp, TextStyle, View, ViewStyle } from "react-native" +import { observer } from "mobx-react-lite" +import { color, typography } from "../../theme" +import { Text } from "../" +import { flatten } from "ramda" +import Icon from "react-native-vector-icons/MaterialCommunityIcons" + +const CONTAINER: ViewStyle = { + justifyContent: "center", +} + +const TEXT: TextStyle = { + fontFamily: typography.primary, + fontSize: 14, + color: color.primary, +} + +export interface LocalButtonProps { + /** + * An optional style override useful for padding & margin. + */ + style?: StyleProp + local + setLocal +} + +/** + * Describe your component here + */ +export const LocalButton = observer(function LocalButton(props: LocalButtonProps) { + const { style, local, setLocal } = props + const styles = flatten([CONTAINER, style]) + + return ( + + {setLocal(!local)}} + size={30} + style={{textAlign: 'center'}}> + {!local ? "Global Graph" : "Local Graph"} + + + ) +}) -- cgit v1.2.3