summaryrefslogtreecommitdiff
path: root/storybook
diff options
context:
space:
mode:
Diffstat (limited to 'storybook')
-rw-r--r--storybook/index.ts2
-rw-r--r--storybook/storybook-registry.ts20
-rw-r--r--storybook/storybook.tsx17
-rw-r--r--storybook/toggle-storybook.tsx16
-rw-r--r--storybook/toggle-storybook.web.tsx6
-rw-r--r--storybook/views/index.ts6
-rw-r--r--storybook/views/story-screen.tsx14
-rw-r--r--storybook/views/story.tsx8
-rw-r--r--storybook/views/use-case.tsx28
9 files changed, 64 insertions, 53 deletions
diff --git a/storybook/index.ts b/storybook/index.ts
index 4a0399a..43bfa66 100644
--- a/storybook/index.ts
+++ b/storybook/index.ts
@@ -1,4 +1,4 @@
// this is the native storybook entry point
// import { StorybookUI } from "./config"
-export * from "./storybook"
+export * from './storybook'
diff --git a/storybook/storybook-registry.ts b/storybook/storybook-registry.ts
index 83f0ed8..453b0d0 100644
--- a/storybook/storybook-registry.ts
+++ b/storybook/storybook-registry.ts
@@ -1,10 +1,10 @@
-require("../app/components/text/text.story")
-require("../app/components/auto-image/auto-image.story")
-require("../app/components/button/button.story")
-require("../app/components/form-row/form-row.story")
-require("../app/components/switch/switch.story")
-require("../app/components/text-field/text-field.story")
-require("../app/components/checkbox/checkbox.story")
-require("../app/components/wallpaper/wallpaper.story")
-require("../app/components/icon/icon.story")
-require("../app/components/header/header.story")
+require('../app/components/text/text.story')
+require('../app/components/auto-image/auto-image.story')
+require('../app/components/button/button.story')
+require('../app/components/form-row/form-row.story')
+require('../app/components/switch/switch.story')
+require('../app/components/text-field/text-field.story')
+require('../app/components/checkbox/checkbox.story')
+require('../app/components/wallpaper/wallpaper.story')
+require('../app/components/icon/icon.story')
+require('../app/components/header/header.story')
diff --git a/storybook/storybook.tsx b/storybook/storybook.tsx
index 0479d4e..c48e3ef 100644
--- a/storybook/storybook.tsx
+++ b/storybook/storybook.tsx
@@ -1,26 +1,27 @@
-import React, { useEffect } from "react"
-import { getStorybookUI, configure } from "@storybook/react-native"
-import { initFonts } from "../app/theme/fonts"
+import React, { useEffect } from 'react'
+import { getStorybookUI, configure } from '@storybook/react-native'
+import { initFonts } from '../app/theme/fonts'
declare let module
configure(() => {
- require("./storybook-registry")
+ require('./storybook-registry')
}, module)
const StorybookUI = getStorybookUI({
port: 9001,
- host: "localhost",
+ host: 'localhost',
onDeviceUI: true,
- asyncStorage: require("@react-native-async-storage/async-storage").default || null,
+ asyncStorage:
+ require('@react-native-async-storage/async-storage').default || null,
})
export function StorybookUIRoot() {
useEffect(() => {
;(async () => {
await initFonts() // expo only
- if (typeof __TEST__ === "undefined" || !__TEST__) {
- const Reactotron = require("../app/services/reactotron")
+ if (typeof __TEST__ === 'undefined' || !__TEST__) {
+ const Reactotron = require('../app/services/reactotron')
const reactotron = new Reactotron.Reactotron()
reactotron.setup()
}
diff --git a/storybook/toggle-storybook.tsx b/storybook/toggle-storybook.tsx
index 394ecf4..301695a 100644
--- a/storybook/toggle-storybook.tsx
+++ b/storybook/toggle-storybook.tsx
@@ -1,6 +1,6 @@
-import React, { useState, useEffect } from "react"
-import { DevSettings } from "react-native"
-import { loadString, saveString } from "../app/utils/storage"
+import React, { useState, useEffect } from 'react'
+import { DevSettings } from 'react-native'
+import { loadString, saveString } from '../app/utils/storage'
/**
* Toggle Storybook mode, in __DEV__ mode only.
@@ -19,18 +19,18 @@ export function ToggleStorybook(props) {
useEffect(() => {
if (__DEV__ && DevSettings) {
// Load the setting from storage if it's there
- loadString("devStorybook").then((storedSetting) => {
+ loadString('devStorybook').then((storedSetting) => {
// Set the initial value
- setShowStorybook(storedSetting === "on")
+ setShowStorybook(storedSetting === 'on')
// Add our toggle command to the menu
- DevSettings.addMenuItem("Toggle Storybook", () => {
+ DevSettings.addMenuItem('Toggle Storybook', () => {
setShowStorybook((show) => {
// On toggle, flip the current value
show = !show
// Write it back to storage
- saveString("devStorybook", show ? "on" : "off")
+ saveString('devStorybook', show ? 'on' : 'off')
// Return it to change the local state
return show
@@ -38,7 +38,7 @@ export function ToggleStorybook(props) {
})
// Load the storybook UI once
- setStorybookUIRoot(() => require("./storybook").StorybookUIRoot)
+ setStorybookUIRoot(() => require('./storybook').StorybookUIRoot)
})
}
}, [])
diff --git a/storybook/toggle-storybook.web.tsx b/storybook/toggle-storybook.web.tsx
index f1bd034..9da2ada 100644
--- a/storybook/toggle-storybook.web.tsx
+++ b/storybook/toggle-storybook.web.tsx
@@ -1,5 +1,5 @@
-import React, { useState, useEffect } from "react"
-import * as QueryString from "query-string"
+import React, { useState, useEffect } from 'react'
+import * as QueryString from 'query-string'
interface StorybookQueryParams {
storybook?: boolean
@@ -12,7 +12,7 @@ export const ToggleStorybook = (props) => {
useEffect(() => {
if (__DEV__) {
// Load the storybook UI once
- setStorybookUIRoot(() => require("./storybook").StorybookUIRoot)
+ setStorybookUIRoot(() => require('./storybook').StorybookUIRoot)
}
}, [])
diff --git a/storybook/views/index.ts b/storybook/views/index.ts
index a722e53..fb7ed3e 100644
--- a/storybook/views/index.ts
+++ b/storybook/views/index.ts
@@ -1,3 +1,3 @@
-export * from "./story-screen"
-export * from "./story"
-export * from "./use-case"
+export * from './story-screen'
+export * from './story'
+export * from './use-case'
diff --git a/storybook/views/story-screen.tsx b/storybook/views/story-screen.tsx
index d83f6f5..1e59efd 100644
--- a/storybook/views/story-screen.tsx
+++ b/storybook/views/story-screen.tsx
@@ -1,15 +1,19 @@
-import * as React from "react"
-import { ViewStyle, KeyboardAvoidingView, Platform } from "react-native"
+import * as React from 'react'
+import { ViewStyle, KeyboardAvoidingView, Platform } from 'react-native'
-const ROOT: ViewStyle = { backgroundColor: "#f0f0f0", flex: 1 }
+const ROOT: ViewStyle = { backgroundColor: '#f0f0f0', flex: 1 }
export interface StoryScreenProps {
children?: React.ReactNode
}
-const behavior = Platform.OS === "ios" ? "padding" : undefined
+const behavior = Platform.OS === 'ios' ? 'padding' : undefined
export const StoryScreen = (props: StoryScreenProps) => (
- <KeyboardAvoidingView style={ROOT} behavior={behavior} keyboardVerticalOffset={50}>
+ <KeyboardAvoidingView
+ style={ROOT}
+ behavior={behavior}
+ keyboardVerticalOffset={50}
+ >
{props.children}
</KeyboardAvoidingView>
)
diff --git a/storybook/views/story.tsx b/storybook/views/story.tsx
index c85f7f0..68d298e 100644
--- a/storybook/views/story.tsx
+++ b/storybook/views/story.tsx
@@ -1,5 +1,5 @@
-import * as React from "react"
-import { ScrollView, View, ViewStyle } from "react-native"
+import * as React from 'react'
+import { ScrollView, View, ViewStyle } from 'react-native'
export interface StoryProps {
children?: React.ReactNode
@@ -10,7 +10,9 @@ const ROOT: ViewStyle = { flex: 1 }
export function Story(props: StoryProps) {
return (
<View style={ROOT}>
- <ScrollView keyboardShouldPersistTaps="handled">{props.children}</ScrollView>
+ <ScrollView keyboardShouldPersistTaps="handled">
+ {props.children}
+ </ScrollView>
</View>
)
}
diff --git a/storybook/views/use-case.tsx b/storybook/views/use-case.tsx
index 08b04b9..b7f6647 100644
--- a/storybook/views/use-case.tsx
+++ b/storybook/views/use-case.tsx
@@ -1,33 +1,33 @@
-import * as React from "react"
-import { View, Text, TextStyle, ViewStyle } from "react-native"
+import * as React from 'react'
+import { View, Text, TextStyle, ViewStyle } from 'react-native'
-const ROOT: ViewStyle = { backgroundColor: "#eee" }
-const TITLE: TextStyle = { fontWeight: "600", color: "#3d3d3d" }
+const ROOT: ViewStyle = { backgroundColor: '#eee' }
+const TITLE: TextStyle = { fontWeight: '600', color: '#3d3d3d' }
const TITLE_WRAPPER: ViewStyle = {}
const USE_CASE_WRAPPER: ViewStyle = {
- position: "absolute",
+ position: 'absolute',
top: 0,
left: 0,
right: 0,
- borderTopColor: "#e6e6e6",
+ borderTopColor: '#e6e6e6',
borderTopWidth: 1,
- flexDirection: "row",
+ flexDirection: 'row',
}
const USE_CASE: TextStyle = {
fontSize: 10,
- color: "#666",
+ color: '#666',
paddingHorizontal: 4,
paddingBottom: 2,
}
-const USAGE: TextStyle = { color: "#666", fontSize: 10, paddingTop: 0 }
+const USAGE: TextStyle = { color: '#666', fontSize: 10, paddingTop: 0 }
const HEADER: ViewStyle = {
paddingTop: 20,
paddingBottom: 10,
paddingHorizontal: 10,
- borderBottomColor: "#e6e6e6",
+ borderBottomColor: '#e6e6e6',
borderBottomWidth: 1,
}
-const COMPONENT: ViewStyle = { backgroundColor: "#fff" }
+const COMPONENT: ViewStyle = { backgroundColor: '#fff' }
export interface UseCaseProps {
/** The title. */
@@ -48,7 +48,11 @@ export function UseCase(props: UseCaseProps) {
const style: ViewStyle = {
...COMPONENT,
...{ padding: props.noPad ? 0 : 10 },
- ...{ backgroundColor: props.noBackground ? "rgba(0,0,0,0)" : COMPONENT.backgroundColor },
+ ...{
+ backgroundColor: props.noBackground
+ ? 'rgba(0,0,0,0)'
+ : COMPONENT.backgroundColor,
+ },
...props.style,
}
generated by cgit v1.2.3 (git 2.46.2) at 2024-12-23 18:46:37 +0000