UNPKG

react-native-ui-lib

Version:

<p align="center"> <img src="https://user-images.githubusercontent.com/1780255/105469025-56759000-5ca0-11eb-993d-3568c1fd54f4.png" height="250px" style="display:block"/> </p> <p align="center">UI Toolset & Components Library for React Native</p> <p a

47 lines (46 loc) 2.34 kB
{ "name": "Image", "category": "basic", "description": "Image wrapper with extra functionality like source transform and assets support", "extends": ["Image"], "extendsLink": ["https://reactnative.dev/docs/image"], "note": "please note that for SVG support you need to add both `react-native-svg` and `react-native-svg-transformer` and also configure them (see `metro.config.js`)", "modifiers": ["margin"], "example": "https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/ImageScreen.tsx", "props": [ { "name": "sourceTransformer", "type": "(props: any) => ImageSourcePropType", "description": "custom source transform handler for manipulating the image source (great for size control)" }, {"name": "assetName", "type": "string", "description": "if provided image source will be driven from asset name"}, {"name": "assetGroup", "type": "string", "description": "the asset group, default is icons"}, {"name": "tintColor", "type": "string", "description": "the asset tint"}, { "name": "supportRTL", "type": "boolean", "description": "whether the image should flip horizontally on RTL locals" }, { "name": "cover", "type": "boolean", "description": "Show image as a cover, full width, image (according to aspect ratio, default: 16:8)" }, {"name": "aspectRatio", "type": "number", "description": "The aspect ratio for the image"}, { "name": "overlayType", "type": "VERTICAL | TOP | BOTTOM | SOLID", "description": "The type of overlay to place on top of the image.", "note": "the image MUST have proper size, see examples in: https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/OverlaysScreen.tsx" }, { "name": "overlayIntensity", "type": "LOW | MEDIUM | HIGH", "description": "OverlayIntensityType", "default": "Image.overlayIntensityType.LOW" }, {"name": "overlayColor", "type": "string", "description": "Pass a custom color for the overlay"}, {"name": "customOverlayContent", "type": "JSX.Element", "description": "Render an overlay with custom content"}, {"name": "errorSource", "type": "ImageSourcePropType", "description": "Default image source in case of an error"} ] }