Skip to content

Commit 45e07e9

Browse files
Inbal-TishInbal-Tish
authored
Feat/image demo broken (#1173)
1 parent e4b582b commit 45e07e9

File tree

5 files changed

+30
-22
lines changed

5 files changed

+30
-22
lines changed

‎demo/src/assets/images/placeholderMissingImage.png

6 KB
Loading

‎demo/src/configurations.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,18 @@ import {Assets, Typography, Spacings} from 'react-native-ui-lib'; // eslint-disa
22

33
Assets.loadAssetsGroup('icons.demo', {
44
add: require('./assets/icons/add.png'),
5+
camera: require('./assets/icons/cameraSelected.png'),
56
close: require('./assets/icons/close.png'),
67
dashboard: require('./assets/icons/dashboard.png'),
78
image: require('./assets/icons/image.png'),
89
refresh: require('./assets/icons/refresh.png'),
910
search: require('./assets/icons/search.png')
1011
});
1112

13+
Assets.loadAssetsGroup('images.demo', {
14+
brokenImage: require('./assets/images/placeholderMissingImage.png')
15+
});
16+
1217
Typography.loadTypographies({
1318
h1: {...Typography.text40},
1419
h2: {...Typography.text50},

‎demo/src/screens/componentScreens/ImageScreen.tsx

Lines changed: 11 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,20 @@
11
import React, {Component} from 'react';
2-
import {View, Text, Image, Colors} from 'react-native-ui-lib';
2+
import {View, Text, Image, Colors, Assets} from 'react-native-ui-lib';
33
import {renderBooleanOption, renderRadioGroup, renderSliderOption} from '../ExampleScreenPresenter';
44

5-
import cameraIcon from '../../assets/icons/cameraSelected.png';
65

76
const IMAGE_URL =
87
'https://images.pexels.com/photos/748837/pexels-photo-748837.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260';
9-
8+
const BROKEN_URL = 'file:///Desktop/website/img/cupcake.jpg';
109
const DEFAULT_SIZE = 100;
10+
1111
class ImageScreen extends Component {
1212
state = {
1313
cover: true,
1414
showOverlayContent: false,
1515
overlayType: 'none',
16-
margin: 0
16+
margin: 0,
17+
showErrorImage: false
1718
};
1819

1920
renderOverlayContent() {
@@ -25,7 +26,7 @@ class ImageScreen extends Component {
2526
<View row centerV>
2627
<Image
2728
style={{margin: 5, marginRight: 10}}
28-
source={cameraIcon}
29+
source={Assets.icons.demo.camera}
2930
tintColor={overlayType !== 'none' ? Colors.white : undefined}
3031
/>
3132
<Text text30 white={overlayType !== 'none'}>
@@ -35,19 +36,20 @@ class ImageScreen extends Component {
3536
</View>
3637
);
3738
} else {
38-
return <Image style={{margin: 5}} source={cameraIcon}/>;
39+
return <Image style={{margin: 5}} source={Assets.icons.demo.camera}/>;
3940
}
4041
}
4142
}
4243

4344
render() {
44-
const {cover, overlayType, margin} = this.state;
45+
const {cover, overlayType, margin, showErrorImage} = this.state;
4546

4647
return (
4748
<View flex>
4849
<View centerH height={250}>
4950
<Image
50-
source={{uri: IMAGE_URL}}
51+
source={{uri: showErrorImage ? BROKEN_URL : IMAGE_URL}}
52+
errorSource={Assets.images.demo.brokenImage}
5153
cover={cover}
5254
overlayType={overlayType !== 'none' ? overlayType : undefined}
5355
style={!cover && {width: DEFAULT_SIZE, height: DEFAULT_SIZE}}
@@ -61,6 +63,7 @@ class ImageScreen extends Component {
6163
<View flex>
6264
{renderBooleanOption.call(this, 'Show as Cover Image', 'cover')}
6365
{renderBooleanOption.call(this, 'Show Overlay Content', 'showOverlayContent')}
66+
{renderBooleanOption.call(this, 'Show Error Image', 'showErrorImage')}
6467
{renderRadioGroup.call(this, 'Overlay Type', 'overlayType', {none: 'none', ...Image.overlayTypes})}
6568
{renderSliderOption.call(this, 'Margin(margin-XX)', 'margin', {step: 4, min: 0, max: 40})}
6669
</View>

‎generatedTypes/incubator/TextField/index.d.ts

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -76,11 +76,11 @@ declare const _default: React.ComponentClass<(Partial<Record<"margin" | "marginL
7676
/**
7777
* Pass to render a leading element
7878
*/
79-
leadingAccessory?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
79+
leadingAccessory?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
8080
/**
8181
* Pass to render a trailing element
8282
*/
83-
trailingAccessory?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
83+
trailingAccessory?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
8484
/**
8585
* Pass to add floating placeholder support
8686
*/
@@ -131,11 +131,11 @@ declare const _default: React.ComponentClass<(Partial<Record<"margin" | "marginL
131131
/**
132132
* Pass to render a leading element
133133
*/
134-
leadingAccessory?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
134+
leadingAccessory?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
135135
/**
136136
* Pass to render a trailing element
137137
*/
138-
trailingAccessory?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
138+
trailingAccessory?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
139139
/**
140140
* Pass to add floating placeholder support
141141
*/
@@ -186,11 +186,11 @@ declare const _default: React.ComponentClass<(Partial<Record<"margin" | "marginL
186186
/**
187187
* Pass to render a leading element
188188
*/
189-
leadingAccessory?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
189+
leadingAccessory?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
190190
/**
191191
* Pass to render a trailing element
192192
*/
193-
trailingAccessory?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
193+
trailingAccessory?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
194194
/**
195195
* Pass to add floating placeholder support
196196
*/
@@ -241,11 +241,11 @@ declare const _default: React.ComponentClass<(Partial<Record<"margin" | "marginL
241241
/**
242242
* Pass to render a leading element
243243
*/
244-
leadingAccessory?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
244+
leadingAccessory?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
245245
/**
246246
* Pass to render a trailing element
247247
*/
248-
trailingAccessory?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, any> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
248+
trailingAccessory?: React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | undefined;
249249
/**
250250
* Pass to add floating placeholder support
251251
*/

‎generatedTypes/incubator/TextField/usePreset.d.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -198,8 +198,8 @@ export default function usePreset({ preset, ...props }: InternalTextFieldProps):
198198
retainSpace?: boolean | undefined;
199199
showCharCounter?: boolean | undefined;
200200
charCounterStyle?: import("react-native").TextStyle | undefined;
201-
leadingAccessory?: import("react").ReactElement<any, string | ((props: any) => import("react").ReactElement<any, any> | null) | (new (props: any) => import("react").Component<any, any, any>)> | undefined;
202-
trailingAccessory?: import("react").ReactElement<any, string | ((props: any) => import("react").ReactElement<any, any> | null) | (new (props: any) => import("react").Component<any, any, any>)> | undefined;
201+
leadingAccessory?: import("react").ReactElement<any, string | ((props: any) => import("react").ReactElement<any, string | any | (new (props: any) => import("react").Component<any, any, any>)> | null) | (new (props: any) => import("react").Component<any, any, any>)> | undefined;
202+
trailingAccessory?: import("react").ReactElement<any, string | ((props: any) => import("react").ReactElement<any, string | any | (new (props: any) => import("react").Component<any, any, any>)> | null) | (new (props: any) => import("react").Component<any, any, any>)> | undefined;
203203
validate?: "number" | Function | "required" | "email" | "url" | "price" | import("./types").Validator[] | undefined;
204204
validateOnStart?: boolean | undefined;
205205
validateOnChange?: boolean | undefined;
@@ -576,8 +576,8 @@ export default function usePreset({ preset, ...props }: InternalTextFieldProps):
576576
retainSpace?: boolean | undefined;
577577
showCharCounter?: boolean | undefined;
578578
charCounterStyle?: import("react-native").TextStyle | undefined;
579-
leadingAccessory?: import("react").ReactElement<any, string | ((props: any) => import("react").ReactElement<any, any> | null) | (new (props: any) => import("react").Component<any, any, any>)> | undefined;
580-
trailingAccessory?: import("react").ReactElement<any, string | ((props: any) => import("react").ReactElement<any, any> | null) | (new (props: any) => import("react").Component<any, any, any>)> | undefined;
579+
leadingAccessory?: import("react").ReactElement<any, string | ((props: any) => import("react").ReactElement<any, string | any | (new (props: any) => import("react").Component<any, any, any>)> | null) | (new (props: any) => import("react").Component<any, any, any>)> | undefined;
580+
trailingAccessory?: import("react").ReactElement<any, string | ((props: any) => import("react").ReactElement<any, string | any | (new (props: any) => import("react").Component<any, any, any>)> | null) | (new (props: any) => import("react").Component<any, any, any>)> | undefined;
581581
validate?: "number" | Function | "required" | "email" | "url" | "price" | import("./types").Validator[] | undefined;
582582
validateOnStart?: boolean | undefined;
583583
validateOnChange?: boolean | undefined;
@@ -1074,8 +1074,8 @@ export default function usePreset({ preset, ...props }: InternalTextFieldProps):
10741074
retainSpace?: boolean | undefined;
10751075
showCharCounter?: boolean | undefined;
10761076
charCounterStyle?: import("react-native").TextStyle | undefined;
1077-
leadingAccessory?: import("react").ReactElement<any, string | ((props: any) => import("react").ReactElement<any, any> | null) | (new (props: any) => import("react").Component<any, any, any>)> | undefined;
1078-
trailingAccessory?: import("react").ReactElement<any, string | ((props: any) => import("react").ReactElement<any, any> | null) | (new (props: any) => import("react").Component<any, any, any>)> | undefined;
1077+
leadingAccessory?: import("react").ReactElement<any, string | ((props: any) => import("react").ReactElement<any, string | any | (new (props: any) => import("react").Component<any, any, any>)> | null) | (new (props: any) => import("react").Component<any, any, any>)> | undefined;
1078+
trailingAccessory?: import("react").ReactElement<any, string | ((props: any) => import("react").ReactElement<any, string | any | (new (props: any) => import("react").Component<any, any, any>)> | null) | (new (props: any) => import("react").Component<any, any, any>)> | undefined;
10791079
validate?: "number" | Function | "required" | "email" | "url" | "price" | import("./types").Validator[] | undefined;
10801080
validateOnStart?: boolean | undefined;
10811081
validateOnChange?: boolean | undefined;

0 commit comments

Comments
 (0)