diff options
Diffstat (limited to 'app_expo/components/auto-image/auto-image.story.tsx')
-rw-r--r-- | app_expo/components/auto-image/auto-image.story.tsx | 33 |
1 files changed, 33 insertions, 0 deletions
diff --git a/app_expo/components/auto-image/auto-image.story.tsx b/app_expo/components/auto-image/auto-image.story.tsx new file mode 100644 index 0000000..af74efe --- /dev/null +++ b/app_expo/components/auto-image/auto-image.story.tsx @@ -0,0 +1,33 @@ +/* eslint-disable */ +import * as React from 'react' +import { storiesOf } from '@storybook/react-native' +import { StoryScreen, Story, UseCase } from '../../../storybook/views' +import { AutoImage } from './auto-image' + +declare let module + +const bowser = require('../../screens/welcome/bowser.png') +const morty = { + uri: 'https://rickandmortyapi.com/api/character/avatar/2.jpeg', +} + +storiesOf('AutoImage', module) + .addDecorator((fn) => <StoryScreen>{fn()}</StoryScreen>) + .add('Style Presets', () => ( + <Story> + <UseCase text="With require()"> + <AutoImage source={bowser} /> + <AutoImage source={bowser} style={{ width: 150 }} /> + <AutoImage source={bowser} style={{ width: 150, height: 150 }} /> + <AutoImage source={bowser} style={{ height: 150 }} /> + <AutoImage source={bowser} style={{ height: 150, resizeMode: 'contain' }} /> + </UseCase> + <UseCase text="With URL"> + <AutoImage source={morty} /> + <AutoImage source={morty} style={{ width: 150 }} /> + <AutoImage source={morty} style={{ width: 150, height: 150 }} /> + <AutoImage source={morty} style={{ height: 150 }} /> + <AutoImage source={morty} style={{ height: 150, resizeMode: 'contain' }} /> + </UseCase> + </Story> + )) |