diff options
author | Thomas F. K. Jorna <[email protected]> | 2021-07-14 15:10:31 +0200 |
---|---|---|
committer | Thomas F. K. Jorna <[email protected]> | 2021-07-14 15:10:31 +0200 |
commit | e5021187e96b78b53203bd95d08d6818aea47d17 (patch) | |
tree | 37ec45d00eb963db53cd4bb4f04a770414b351cc /ignite |
New Ignite 7.0.6 app
Diffstat (limited to 'ignite')
-rw-r--r-- | ignite/templates/component/NAME.story.tsx.ejs | 15 | ||||
-rw-r--r-- | ignite/templates/component/NAME.tsx.ejs | 37 | ||||
-rw-r--r-- | ignite/templates/model/NAME.test.ts.ejs | 7 | ||||
-rw-r--r-- | ignite/templates/model/NAME.ts.ejs | 16 | ||||
-rw-r--r-- | ignite/templates/navigator/NAME-navigator.tsx.ejs | 7 | ||||
-rw-r--r-- | ignite/templates/screen/NAME-screen.tsx.ejs | 25 |
6 files changed, 107 insertions, 0 deletions
diff --git a/ignite/templates/component/NAME.story.tsx.ejs b/ignite/templates/component/NAME.story.tsx.ejs new file mode 100644 index 0000000..fca346c --- /dev/null +++ b/ignite/templates/component/NAME.story.tsx.ejs @@ -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 { <%= props.pascalCaseName %> } from "./<%= props.kebabCaseName %>" + +storiesOf("<%= props.pascalCaseName %>", module) + .addDecorator((fn) => <StoryScreen>{fn()}</StoryScreen>) + .add("Style Presets", () => ( + <Story> + <UseCase text="Primary" usage="The primary."> + <<%= props.pascalCaseName %> style={{ backgroundColor: color.error }} /> + </UseCase> + </Story> + )) diff --git a/ignite/templates/component/NAME.tsx.ejs b/ignite/templates/component/NAME.tsx.ejs new file mode 100644 index 0000000..fffaf7d --- /dev/null +++ b/ignite/templates/component/NAME.tsx.ejs @@ -0,0 +1,37 @@ +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" + +const CONTAINER: ViewStyle = { + justifyContent: "center", +} + +const TEXT: TextStyle = { + fontFamily: typography.primary, + fontSize: 14, + color: color.primary, +} + +export interface <%= props.pascalCaseName %>Props { + /** + * An optional style override useful for padding & margin. + */ + style?: StyleProp<ViewStyle> +} + +/** + * Describe your component here + */ +export const <%= props.pascalCaseName %> = observer(function <%= props.pascalCaseName %>(props: <%= props.pascalCaseName %>Props) { + const { style } = props + const styles = flatten([CONTAINER, style]) + + return ( + <View style={styles}> + <Text style={TEXT}>Hello</Text> + </View> + ) +}) diff --git a/ignite/templates/model/NAME.test.ts.ejs b/ignite/templates/model/NAME.test.ts.ejs new file mode 100644 index 0000000..97c853a --- /dev/null +++ b/ignite/templates/model/NAME.test.ts.ejs @@ -0,0 +1,7 @@ +import { <%= props.pascalCaseName %>Model } from "./<%= props.kebabCaseName %>" + +test("can be created", () => { + const instance = <%= props.pascalCaseName %>Model.create({}) + + expect(instance).toBeTruthy() +}) diff --git a/ignite/templates/model/NAME.ts.ejs b/ignite/templates/model/NAME.ts.ejs new file mode 100644 index 0000000..2c9c9c8 --- /dev/null +++ b/ignite/templates/model/NAME.ts.ejs @@ -0,0 +1,16 @@ +import { Instance, SnapshotOut, types } from "mobx-state-tree" + +/** + * Model description here for TypeScript hints. + */ +export const <%= props.pascalCaseName %>Model = types + .model("<%= props.pascalCaseName %>") + .props({}) + .views((self) => ({})) // eslint-disable-line @typescript-eslint/no-unused-vars + .actions((self) => ({})) // eslint-disable-line @typescript-eslint/no-unused-vars + +type <%= props.pascalCaseName %>Type = Instance<typeof <%= props.pascalCaseName %>Model> +export interface <%= props.pascalCaseName %> extends <%= props.pascalCaseName %>Type {} +type <%= props.pascalCaseName %>SnapshotType = SnapshotOut<typeof <%= props.pascalCaseName %>Model> +export interface <%= props.pascalCaseName %>Snapshot extends <%= props.pascalCaseName %>SnapshotType {} +export const create<%= props.pascalCaseName %>DefaultModel = () => types.optional(<%= props.pascalCaseName %>Model, {}) diff --git a/ignite/templates/navigator/NAME-navigator.tsx.ejs b/ignite/templates/navigator/NAME-navigator.tsx.ejs new file mode 100644 index 0000000..320c9b5 --- /dev/null +++ b/ignite/templates/navigator/NAME-navigator.tsx.ejs @@ -0,0 +1,7 @@ +import { StackNavigator } from "react-navigation" +import { + SomeScreen +} from "../screens" + +export const <%= props.pascalCaseName %> = StackNavigator({ +})
\ No newline at end of file diff --git a/ignite/templates/screen/NAME-screen.tsx.ejs b/ignite/templates/screen/NAME-screen.tsx.ejs new file mode 100644 index 0000000..a54ccdd --- /dev/null +++ b/ignite/templates/screen/NAME-screen.tsx.ejs @@ -0,0 +1,25 @@ +import React from "react" +import { observer } from "mobx-react-lite" +import { ViewStyle } from "react-native" +import { Screen, Text } from "../../components" +// import { useNavigation } from "@react-navigation/native" +// import { useStores } from "../../models" +import { color } from "../../theme" + +const ROOT: ViewStyle = { + backgroundColor: color.palette.black, + flex: 1, +} + +export const <%= props.pascalCaseName %>Screen = observer(function <%= props.pascalCaseName %>Screen() { + // Pull in one of our MST stores + // const { someStore, anotherStore } = useStores() + + // Pull in navigation via hook + // const navigation = useNavigation() + return ( + <Screen style={ROOT} preset="scroll"> + <Text preset="header" text="<%= props.camelName %>" /> + </Screen> + ) +}) |