# @vikalp_p/native-x-screen

> Screen wrapper component

Latest version **1.0.1** (published 2022-12-30) · MIT license · 0 weekly downloads

## Install

```sh
npm install @vikalp_p/native-x-screen
pnpm add @vikalp_p/native-x-screen
yarn add @vikalp_p/native-x-screen
bun add @vikalp_p/native-x-screen
```

## Health

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

Positive: no vulnerabilities.

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

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2022-12-30 |
| First published | 2022-12-30 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 5 |
| Unpacked size | 6.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Rinto Jose |
| Maintainers | vikalp_p |

## Links

- npm: https://www.npmjs.com/package/@vikalp_p/native-x-screen
- Repository: https://github.com/VikalpP/native-x-screen
- Homepage: https://github.com/VikalpP/native-x-screen#readme
- Issues: https://github.com/VikalpP/native-x-screen/issues
- npm.io page: https://npm.io/package/@vikalp_p/native-x-screen

## Dependencies (5)

- [native-x-theme](https://npm.io/package/native-x-theme.md) ^1.1.0
- [react-native-screens](https://npm.io/package/react-native-screens.md) ^2.17.1
- [tachyons-react-native](https://npm.io/package/tachyons-react-native.md) ^1.0.4
- [react-native-keyboard-spacer](https://npm.io/package/react-native-keyboard-spacer.md) ^0.4.1
- [react-native-safe-area-context](https://npm.io/package/react-native-safe-area-context.md) ^4.4.1

## Recent versions

- 1.0.1 (latest) — 2022-12-30

## README

# native-x-screen

[![semantic-release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg)](https://github.com/semantic-release/semantic-release)

A wrapper components for screens

## Install

### Yarn

```sh
yarn add native-x-screen
```

### NPM

```sh
npm install native-x-screen
```

## Usage

```tsx
import { Screen, SafeAreaProvider } from 'native-x-screen'

function App() {
  return <SafeAreaProvider>...</SafeAreaProvider>;
}

function HomeScreen() {
  const header = (
    <View>
      <Text>HEADER</Text>
    </View>
  )
  return (
    <Screen header={header} hasForm scrollable keepKeyboard>
      ...
    </Screen>
  )
}
```

## API

| Property               | Default Value | Usage                                                 |
| ---------------------- | ------------- | ----------------------------------------------------- |
| fill?: boolean         | true          | Fill container or available space                     |
| scrollable?: boolean   | false         | Set true if the screen is scrollable                  |
| hasForm?: boolean      | false         | Set true if the screen has a form                     |
| header?: ReactNode     |               | Header component                                      |
| children?: ReactNode[] |               | Content of the screen                                 |
| keepKeyboard?: boolean | false         | If set to true, keyboard will stay up while scrolling |

## Automatic Release

Here is an example of the release type that will be done based on a commit messages:

| Commit message      | Release type          |
| ------------------- | --------------------- |
| fix: [comment]      | Patch Release         |
| feat: [comment]     | Minor Feature Release |
| perf: [comment]     | Major Feature Release |
| doc: [comment]      | No Release            |
| refactor: [comment] | No Release            |
| chore: [comment]    | No Release            |

---
_Source: https://npm.io/package/@vikalp_p/native-x-screen · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._