# rn-text-wrap

> React Native component that wraps some frequently used features of a text view into one.

Latest version **0.0.2** (published 2017-12-10) · 0 weekly downloads

## Install

```sh
npm install rn-text-wrap
pnpm add rn-text-wrap
yarn add rn-text-wrap
bun add rn-text-wrap
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.2 |
| Published | 2017-12-10 |
| First published | 2017-07-18 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Maintainers | akhoi90 |

## Links

- npm: https://www.npmjs.com/package/rn-text-wrap
- Repository: https://github.com/khoi-nguyen-2359/rn-text-wrap
- Homepage: https://github.com/khoi-nguyen-2359/rn-text-wrap#readme
- Issues: https://github.com/khoi-nguyen-2359/rn-text-wrap/issues
- npm.io page: https://npm.io/package/rn-text-wrap

## Recent versions

- 0.0.2 (latest) — 2017-12-10
- 0.0.1 — 2017-07-18

## README

# rn-text-wrap
React Native component that wraps some frequently used features of a text view into one.

## Installation

```
npm install --save rn-text-wrap
```

## Usage example

```javascript
import { TextWrap as Text } from 'rn-text-wrap'
<Text>Use same way as RN Text</Text>
```

### Touchable

Before
```javascript
<TouchableOpacity onPress={onPressHandler}>
	<Text>Press me</Text>
</TouchableOpacity>
```

Now
```javascript
<Text onPress={onPressHandler}>Press me</Text>
```

### Leading/Trailing parts

Before
```javascript
<View style={{
	flexDirection: 'row' // or 'column'
}}>
	<TouchableOpacity onPress={onPressLeadingImage}>
		<Image 
			source={leadingImageSource} 
			style={leadingImageStyle} />
	</TouchableOpacity>
	<Text>Text goes here</Text>
	<TouchableOpacity onPress={onPressTrailingImage}>
		<Image 
			source={trailingImageSource} 
			style={trailingImageStyle}/>
	</TouchableOpacity>
</View>
```

Now 
```javascript
<Text left={{
		onPress: onPressLeadingImage
		icon: leadingImageSource,
		style: leadingImageStyle,
		render: returnAnyComponent	// giving this will ignore above two
	}}	// or top={...}
	right={{
		onPress: onPressTrailingImage
		icon: trailingImageSource,
		style: trailingImageStyle,
		render: returnAnyComponent	// giving this will ignore above two
	}}	// or bottom={...}
>Text goes here</Text>
```

This library was tested with:
```
"react": "16.0.0-alpha.12",
"react-native": "0.46.4",
		```

---
_Source: https://npm.io/package/rn-text-wrap · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._