open-index/open-npm huggingface dataset:
npm package: @starlightpro/babel-preset-starlight
Description: Babel preset containing common plugins and presets used at Starlight.
Author: Starlight
Latest version: 1.1.14

# Babel Preset Starlight

> Babel preset containing common plugins and presets used at Starlight.


## Installation

`yarn add --dev @starlightpro/babel-preset-starlight`

Babel preset Starlight uses Babel 7.0 ([more detail](https://babeljs.io/blog/2017/09/12/planning-for-7.0))

> ⚠️
> * babel-loader 8.0 +
> * @babel/core
> * [uglifyjs-webpack-plugin](https://github.com/webpack-contrib/uglifyjs-webpack-plugin)
>   v1.0.0 or [babel-minify](https://github.com/babel/minify) (options)

## Usage

```json
{
  "presets": ["@starlightpro/babel-preset-starlight"]
}
```

#### Customized

```json
{
  "presets": [
    ["@starlightpro/babel-preset-starlight", {
      "node":true,
      "nodeTarget": "current",
      "env": {
        "debug": false
      },
      "srcDir": "./src"
    }]
  ]
}
```

## Options

### runtime BABEL_ENV

Supports either `production`, `development` or `test`

### runtime BABEL_OUTPUT

Supports either `esm` or `cjs`

Default to `esm` unless BABEL_ENV is set to test then it defaults to `cjs`

### options.env

All options from `@babel/preset-env` are available for configuration by adding `env: {}` to the options object.

See [`@babel/preset-env`](http://babeljs.io/docs/plugins/#plugin-preset-options) documentation.

### options.srcDir
`string`, defaults to not enabled.    
      
`babel-plugin-module-resolver` is enabled if `srcDir: '<src>'` is present.     
    
### options.node
`boolean`, defaults to false.
      
Add `node: true` to build specifically for node targets. Default is build for browser.
        
### options.nodeTarget
`string | number | "current"`, defaults to '8.9'     
       
allows you to specifically target a node version.       

### options.additionalTargets
`Array<string> | string`       
      
Target additional browsers not included in the default browser list targets.

Default browser targets:     
      
```javascript
[
  'last 4 Chrome major versions',
  'last 3 ChromeAndroid major versions',
  'last 2 ios major versions',
  'last 3 Edge major versions',
  'last 4 Firefox major versions',
  'last 3 Safari versions',
];
```
npm package: @starlightpro/dev-utils
Description: Helpers for SSR webpack
Author: Starlight
Latest version: 1.0.0

# dev-utils

Includes helpers for working with dual webpack instances. Modified from CRA.

### Entry Points

There is no single entry point. You can only import individual top-level modules.

#### `logger`

- `logger.log(thing: any): void`: Log to console. = `console.log`
- `logger.start(text: string): void`: Log the start of a task to console
- `logger.done(text: string): void`: Log the end of task to console
- `logger.info(text: string, data: object): void`: Log information and data to console
- `logger.debug(text: string, data: object): void`: Log debug message and data to console
- `logger.warn(text: string, data: object): void`: Log a warning with message and data to console
- `logger.error(text: string, err: object): void`: Log a message and an error to console

#### `new FriendlyErrorrWebpackPlugin({ verbose: boolean, onSuccessMessage: string, target: 'web' | 'server' })`

This will pretty print webpack errors to your console. It is mean to be used with a double webpack setup, where you have two webpack instances running in parallel. Otherwise the output looks almost identical to `create-react-app's` as it uses the same error formatter under the hood.


```js
const FriendlyErrorsPlugin = require('@starlightpro/dev-utils/FriendlyErrorsPlugin');

module.exports = {
  // ...
  plugins: [
    new FriendlyErrorsPlugin({
        verbose: false,
        target: 'web'
        onSuccessMessage: `Your application is running at http://${process.env.HOST}:${process.env.PORT}`,
      }),
    // ...
  ],
  // ...
}
```

#### `printErrors(summary: string, errors: Error[])`

Pretty print an array of errors with a message. Good for CI's.

```js
const printErrors = require('@starlightpro/dev-utils/printErrors');

try {
  // do something
} catch (e) {
  printErrors('Failed to compile.', [e]);
}
```

`makeLoaderFinder(loaderName: string): (rule: WebPackRule) => boolean;`

Helper function to find a loader in the webpack config object.

Example:
```js
// app.config.js
const loaderFinder = require('@starlightpro/dev-utils/makeLoaderFinder');

module.exports = {
  modify(config) {
    // Makes a finder function, to search for babel-loader
    const babelLoaderFinder = makeLoaderFinder('babel-loader');

    // Finds the JS rule containing babel-loader using our function
    const jsRule = config.module.rules.find(babelLoaderFinder);

    // Set cacheDirectory to true in our babel-loader
    jsRule.use.find(babelLoaderFinder).options.cacheDirectory = true;
  }
}
```
npm package: @starlightpro/eslint-config-starlight
Description: ESLint rules for Starlight.
Author: Steven Truesdell
Latest version: 0.7.0

# `eslint-config-starlight`

> Eslint configurations for every situation.

[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

All rules conflicting with [Prettier](https://github.com/prettier/prettier) are disabled.  

Documentation for **about 98%** of the Eslint rules is complete. You can find the rule explanations and a link to their eslint page above each rule definition.

**All eslint plugins are installed as dependencies**

## Plugins & Rulesets
Included by default:
- [`Babel`](https://github.com/babel/eslint-plugin-babel)   
- [`Prettier`](https://github.com/prettier/eslint-plugin-prettier)   

Opt-in Configurations
- [`Flowtype`](https://github.com/gajus/eslint-plugin-flowtype)
- [`Import`](https://github.com/benmosher/eslint-plugin-import)
- [`React`](https://github.com/yannickcr/eslint-plugin-react)
- [`jsx-a11y`](https://github.com/evcohen/eslint-plugin-jsx-a11y)

### Opt-In Configs
Enabling one (or all) opt-in configurations
----
Simply extend the config you'd like to include, like below.
```JSON
{
  "extends": [
    "@starlightpro/eslint-config-starlight",
    "@starlightpro/eslint-config-starlight/react",
    "@starlightpro/eslint-config-starlight/flowtype",
    "@starlightpro/eslint-config-starlight/jsx-a11y",
    "@starlightpro/eslint-config-starlight/import",
    "@starlightpro/eslint-config-starlight/promise"
  ]
}
```


Feel free to extend or submit comments / corrections.
npm package: @starlightpro/eslint-config-starlight-ts
Description: ESLint rules for Starlight.
Author: Steven Truesdell
Latest version: 0.1.3

# `eslint-config-starlight`

> Eslint configurations for every situation.

[![styled with prettier](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

All rules conflicting with [Prettier](https://github.com/prettier/prettier) are disabled.  

Documentation for **about 98%** of the Eslint rules is complete. You can find the rule explanations and a link to their eslint page above each rule definition.

**All eslint plugins are installed as dependencies**

## Plugins & Rulesets
Included by default:
- [`Babel`](https://github.com/babel/eslint-plugin-babel)   
- [`Prettier`](https://github.com/prettier/eslint-plugin-prettier)   

Opt-in Configurations
- [`Flowtype`](https://github.com/gajus/eslint-plugin-flowtype)
- [`Import`](https://github.com/benmosher/eslint-plugin-import)
- [`React`](https://github.com/yannickcr/eslint-plugin-react)
- [`jsx-a11y`](https://github.com/evcohen/eslint-plugin-jsx-a11y)

### Opt-In Configs
Enabling one (or all) opt-in configurations
----
Simply extend the config you'd like to include, like below.
```JSON
{
  "extends": [
    "@starlightpro/eslint-config-starlight",
    "@starlightpro/eslint-config-starlight/react",
    "@starlightpro/eslint-config-starlight/flowtype",
    "@starlightpro/eslint-config-starlight/jsx-a11y",
    "@starlightpro/eslint-config-starlight/import",
    "@starlightpro/eslint-config-starlight/promise"
  ]
}
```


Feel free to extend or submit comments / corrections.
npm package: @starlightromero/react-neumorphism
Description: A neumorphism React component library
Author: starlightromero
Latest version: 1.0.3

# react-neumorphism

> A neumorphism React component library

[![NPM](https://img.shields.io/npm/v/@starlightromero/react-neumorphism.svg)](https://www.npmjs.com/package/@starlightromero/react-neumorphism) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)

## Install

```bash
npm install --save @starlightromero/react-neumorphism
```

## Usage

```jsx
import React, { Component } from 'react'

import Button from '@starlightromero/react-neumorphism'

const App = () => {
  return <Button>Sign Up</Button>
}
```

## Example

[Live Example](https://starlightromero.github.io/react-neumorphism/)

![React Neumorphism Example](./react-neumorphism.png)

## License

MIT © [starlightromero](https://github.com/starlightromero)
npm package: @starling-tech/react-navigation-tabs
Description: Tab Navigation components for React Navigation
Author: Satyajit Sahoo
Latest version: 2.7.1

This package has been moved to https://github.com/react-navigation/react-navigation/tree/4.x

---

# React Navigation Tabs


[![Build Status][build-badge]][build]
[![Version][version-badge]][package]
[![MIT License][license-badge]][license]

Tab navigators for React Navigation.

## Installation

yarn add @starling-tech/react-navigation-tabs

Follow the instructions on the [the React Navigation "Getting Started" guide](https://reactnavigation.org/docs/en/getting-started.html), and then add the `react-navigation-tabs` package to your project.

## Usage

The package exports two different navigators:

- `createBottomTabNavigator`: iOS like bottom tabs.
- `createMaterialTopTabNavigator`: Material design themed top tabs with swipe gesture, from [react-native-tab-view](https://github.com/react-native-community/react-native-tab-view).

You can import individual navigators and use them:

```js
import { createBottomTabNavigator } from 'react-navigation-tabs';

export default createBottomTabNavigator({
  Album: { screen: Album },
  Library: { screen: Library },
  History: { screen: History },
  Cart: { screen: Cart },
});
```

You can install another package, [`react-navigation-material-bottom-tabs`](https://github.com/react-navigation/material-bottom-tabs), to use a third type of tab navigator:

- `createMaterialBottomTabNavigator`: Material design themed animated bottom tabs, from [react-native-paper](https://callstack.github.io/react-native-paper/bottom-navigation.html).

```js
import { createMaterialBottomTabNavigator } from 'react-navigation-material-bottom-tabs';

export default createMaterialBottomTabNavigator(
  {
    Album: { screen: Album },
    Library: { screen: Library },
    History: { screen: History },
    Cart: { screen: Cart },
  },
  {
    initialRouteName: 'Album',
    activeTintColor: '#F44336',
  },
);
```

## Docs

- [`createBottomTabNavigator`](https://reactnavigation.org/docs/en/bottom-tab-navigator.html)
- [`createMaterialTopTabNavigator`](https://reactnavigation.org/docs/en/material-top-tab-navigator.html)

<!-- badges -->
[build-badge]: https://img.shields.io/circleci/project/github/react-navigation/tabs/master.svg?style=flat-square
[build]: https://circleci.com/gh/react-navigation/tabs
[version-badge]: https://img.shields.io/npm/v/react-navigation-tabs.svg?style=flat-square
[package]: https://www.npmjs.com/package/react-navigation-tabs
[license-badge]: https://img.shields.io/npm/l/react-navigation-tabs.svg?style=flat-square
[license]: https://opensource.org/licenses/MIT
npm package: @starling-tech/ripple-touchable
Description: ripple touch
Author: Quang Hoang
Latest version: 0.1.5

# ripple-touchable

ripple touch

## Installation

```sh
npm install @starling-tech/ripple-touchable
yarn add @starling-tech/ripple-touchable
```

## Usage

```js
import RippleTouchable from "@starling-tech/ripple-touchable";

// ...

<RippleTouchable onPress={() => {}} style={{ width: 240, height: 48 }}>
    <Text>TEST BUTTON</Text>
</RippleTouchable>
```

## Contributing

See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

## License

MIT
npm package: @starlingtech/element
Description: starlingtech react native elements
Author: Quang Hoang
Latest version: 0.3.7

# @starlingtech/element

starlingtech react native elements

## Installation

```sh
npm install @starlingtech/element
```
or 

```sh
yarn add @starlingtech/element
```

## Usage

```js
import * as React from 'react';

import { Text, TextInput } from 'react-native';
import {
  AppBlock,
  AppButton,
  appSize,
  AppText,
  AppTextInput,
  KeyboardDismiss,
  Skeleton,
  StarlingContainer,
} from '@starlingtech/element';
import { useAppColor } from './color';
import light from '../vn.starlingTech/theme/color/light';

export default function App() {
  const refInput1 = React.useRef<TextInput>(null);
  const refInput2 = React.useRef<TextInput>(null);

  const [result, setResult] = React.useState<number | undefined>();

  React.useEffect(() => {
    setResult(appSize(100));
  }, []);

  const [processing, setProcessing] = React.useState(false);

  const onPress = () => {
    setProcessing(true);
    setTimeout(() => {
      setProcessing(false);
    }, 2000);
  };

  const onValidate = (e: string) => {
    if (e.includes('a')) {
      return 'Invalid password!';
    }
    return undefined;
  };

  const onButtonPress = () => {};

  const { colors } = useAppColor();

  return (
    <StarlingContainer
      theme={{
        colors: light,
      }}
    >
      <KeyboardDismiss flex>
        <AppBlock flex background="white" ph={16} center>
          <AppBlock row mb={20}>
            <Skeleton animation="pulse" height={45} width={45} radius={10} />
            <AppBlock ml={10}>
              <Skeleton animation="pulse" height={20} width={150} radius />
              <Skeleton
                animation="pulse"
                height={20}
                width={200}
                radius
                mt={5}
              />
            </AppBlock>
          </AppBlock>

          <Text>Result: {result}</Text>
          <AppText size={20} style={{ color: colors.primary1 }}>
            Result???
          </AppText>
          <AppText color={'primary'}>TEST COLOR</AppText>

          <AppTextInput
            required
            requiredLabel
            label="Name"
            ref={refInput1}
            nextInput={refInput2}
            mb={10}
          />
          <AppTextInput
            required
            onValidate={onValidate}
            ref={refInput2}
            secureTextEntry
            label="Password"
          />
          <AppButton
            processing={processing}
            onPress={onPress}
            text="Submit"
            primary
            mt={30}
          />
          <AppButton onPress={onButtonPress} border={1} mt={10}>
            <AppText>Hello world</AppText>
          </AppButton>
        </AppBlock>
      </KeyboardDismiss>
    </StarlingContainer>
  );
}

```

## Contributing

See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

## License

MIT
npm package: @starlingtech/image
Description: starlingtech react native image
Author: Quang Hoang
Latest version: 0.1.2

# @starlingtech/element

starlingtech react native elements

## Installation

```sh
npm install @starlingtech/element
```
```sh
yarn add @starlingtech/element
```

## Usage

```js
import { multiply } from '@starlingtech/element';

// ...

const result = await multiply(3, 7);
```

## Contributing

See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

## License

MIT

---

Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)
npm package: @starlingtech/util
Description: starlingtech react native image
Author: Quang Hoang
Latest version: 0.1.1

# @starlingtech/element

starlingtech react native elements

## Installation

```sh
npm install @starlingtech/element
```
```sh
yarn add @starlingtech/element
```

## Usage

```js
import { multiply } from '@starlingtech/element';

// ...

const result = await multiply(3, 7);
```

## Contributing

See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

## License

MIT

---

Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)