open-index/open-npm huggingface dataset:
npm package: @r.fathi/expo-mapboxnavigation
Description: My new module
Author: r.fathi
Latest version: 0.2.10

# expo-mapbox-navigation

My new module

# API documentation

- [Documentation for the main branch](https://github.com/expo/expo/blob/main/docs/pages/versions/unversioned/sdk/mapbox-navigation.md)
- [Documentation for the latest stable release](https://docs.expo.dev/versions/latest/sdk/mapbox-navigation/)

# Installation in managed Expo projects

For [managed](https://docs.expo.dev/archive/managed-vs-bare/) Expo projects, please follow the installation instructions in the [API documentation for the latest stable release](#api-documentation). If you follow the link and there is no documentation available then this library is not yet usable within managed projects &mdash; it is likely to be included in an upcoming Expo SDK release.

# Installation in bare React Native projects

For bare React Native projects, you must ensure that you have [installed and configured the `expo` package](https://docs.expo.dev/bare/installing-expo-modules/) before continuing.

### Add the package to your npm dependencies

```
npm install expo-mapbox-navigation
```

### Configure for iOS

Run `npx pod-install` after installing the npm package.


### Configure for Android



# Contributing

Contributions are very welcome! Please refer to guidelines described in the [contributing guide]( https://github.com/expo/expo#contributing).
npm package: @r.stierli/first-test
Description: my first npm package
Author: r.stierli
Latest version: 0.0.4

# simple-first-test-example
A Simple Example Package

## Installation
Install via NPM:

```bash
npm install @r.stierli/first-test

```

## Usage

#### javascript

```javascript

var myApp = require("@r.stierli/first-test");

myApp.printTest(); // print and return " Hello World! " 

```

## License

This project is licensed under the terms of the
[MIT license](/LICENSE).
npm package: @r/horse-react
Description: react-specific implementation of `horse`
Author: reddit
Latest version: 1.3.0

horse-react
===========

[![Build Status](https://travis-ci.org/reddit/horse-react.svg?branch=master)](https://travis-ci.org/reddit/horse-react)

horse-react is an implementation of the
[horse](https://github.com/reddit/horse) application building library, with
some helpers to make working with react easily.

Go check out that documentation, then return to see how you'd use it with
React a little easier.

New APIs
--------

`horse-react` exposes pre-built `render` and `error` functions that you can
hook into, through `ClientApp` and `ServerApp` classes. It expects your
middleware to attach a `layout`, `body`, and `props` property to the `context`
object during the course of your route handling, and at the end, it will render
it out (either with `layout`, if on the server, or it will mount the `body` if
on the client.)


A Brief Overview
----------------

An example usage might be like: (es6 incoming)

`routes.es6.js`

```javascript
// This is used both client- and server- side, and simply sets up an app with
// routes; in this case, returning React elements.

import Layout from '../layouts/layout.jsx';
import Index from '../pages/index.jsx';

function setupRoutes(app) {
  app.router.get('/', function *(next) {
    this.data = new Map({
      user: db.getUser(1)
    });

    this.layout = Layout;

    this.body = function(props) {
      return <Index {...this.props} />;
    });
  });
}

export default setupRoutes;
```


`server.es6.js`

```javascript
import koa from 'koa';

import {ServerReactApp} from 'horse-react';
import setupRoutes from './setupRoutes';

var server = koa();

var app = new App();
setupRoutes(app);

server.use(ServerReactApp.serverRender(app));
```

`client.es6.js`

You'll want to add push state too, but that's outside the scope of our
example.

```javascript
import React from 'react';
import {ClientReactApp} from 'horse-react';

import setupRoutes from './setupRoutes';

import jQuery as $ from 'jquery';

var app = new ClientApp({
  mountPoint: document.getElementById('app-container')
});

setupRoutes(app);

$(function() {
  $('body').on('click', 'a', function(e) {
    e.preventDefault();
    app.render(this.href);
  });
});
```

Additional Notes
----------------

If you want to mount a client application directly on the server-rendered
markup, add `this.staticMarkup` to the context before `serverRender` is called.
Your `layout` should include `!!CONTENT!!` as the magic word where rendered
body markup should be inserted (instead of `{this.children}`.)
npm package: @r/middleware
Description: Middleware for Redux
Author: nramadas
Latest version: 0.8.1

# r/middleware
Helpful Redux middleware

## Installation
Install via npm.

`npm install -S @r/middleware`

## Modules
@r/middleware exports two middlewares: `Thunker` and `PromiseWell`;

### Thunker
Thunker expands on a traditional Redux thunk utility. Namely, it requires that the thunking action returns a promise. As a result, it becomes easier to know when the thunked actions have completed: when the promise resolves, all thunked actions have fired.

```es6
// Initializing a Thunker
import Thunker from '@r/middleware/Thunker';

const thunk = Thunker.create();

// in Redux
applyMiddleware(..., thunk, ...);
```

To simplify using Thunker, it is highly recommended es7 style async functions are used.

```es6
// example thunked action

const getData = () => async (dispatch, getState, utils) => {
  // immediately dispatch synchronous actions as normal
  dispatch(/* sync action */);

  // wait for data if need be
  const { foo, bar } = await asyncFunctionCall();

  // continue to dispatch as normal
  dispatch(/* another action */);
};
```

Thunker performs an additional task. Many times, it becomes necessary to wait for some piece of state to update, or to wait for a particular action to be dispatched before another action is dispatched. Thunker solves this by surfacing two utility methods: `waitForState` and `waitForAction`. Both return a promise that can be `await`-ed on.

#### waitForState

```
waitForState(stateFn: Function, cb: Function [, stateFailedFn: Function]): Promise
```

`stateFn(state: Object): Boolean`

A function that creates the condition that must be met for the callback to fire. Receives a copy of state as its argument. Expected to return a truthy/falsey value.

`cb(state: Object): void`

A function that is called when the conditional is met. Receives a copy of state as its argument.

`stateFailedFn(state: Object): void` (OPTIONAL)

A function that is called the *first* time the conditional is *not* met. Only fires once. Receives a copy of state as its argument.


#### waitForAction

```
waitForAction(actionFn: Function, cb: Function): Promise
```

`actionFn: Function(action: Object)`

A function that receives a Redux action, represents the condition that must be met for the callback to fire. *After* `waitForAction` is invoked, if `action` is dispatched, the callback will fire.

`cb(state: Object): void`

A function that is called when the `action` is dispatched. Receives a copy of state as its argument.

### PromiseWell
The PromiseWell merely collects promises that dispatched by other middleware. It should be one of the last middleware invoked.

```es6
// Initializing a PromiseWell
import PromiseWell from '@r/middleware/PromiseWell';

const well = PromiseWell.create();

// in Redux
applyMiddleware(..., well.middleware, ...);

// on the server side
await well.onComplete();
```

In addition to capturing promises, the PromiseWell lets you query to check if all the captured promises have been completed through the use of `onComplete`.
npm package: @r/private
Description: first-party reddit apis
Author: Jack Lawson
Latest version: 1.1.2

\@r/private
============

A module that provides utilities for when you own your own reddit install.

Snoode Enhancements
-------------------

Login, Register, and Token Refresh

### Usage

```javascript
import APIOptions from '@r/api-client';
import { PrivateAPI } from '@r/private';

const myAppOptions = {
  ...APIOptions,
  clientSecret: 'my-client-secret'
  clientId: 'my-super-secret-app-id',
  withEmailScope: false, // only supported for non-embedded apps
};

const token = await PrivateAPI.login(myAppOptions, username, password);
const newToken = await PrivateAPI.refreshToken(myAppOptions, token.refresh_token);

const token = await PrivateAPI.convertCookiesToAuthToken(myAppOptions, cookies.split(';'));
```
npm package: @r/redux-state-archiver
Description: A collection of React components for serializing your redux state
Author: schwers
Latest version: 0.0.5

# @r/redux-state-archiver

makeStateArchiver returns a React Component to be used in a subtree of
<Provdider /> from react-redux. It will listen to your redux state and archive that data
when it changes.

The arguments to makeStateArchiver are simliar to createSelector, pass in an array
of selectors that extract the data you from state you wish to serialize.

```javascript
const themeSelector = (state) => state.theme;
```

After your selectors, pass in a 'combiner' to merge the data from your selectors
into an object that will represent the overall state of data you wish to serialize;

```javascript
const combiner = (theme) => ({ theme });
```

Finally pass in a state archiver, a function that takes an object, and persists it
in some manner. You probably will never pass this, as most apps can use the helper functions
`makeCookieArchiver` or `makeLocalStorageArchiver`. These functions try to match the signature
of `connect` from 'react-redux', so you pass your selectors as arguments without wrapping them
in an array.

Note: Your archiver should be able to deal with persisting the diff of what's output from your combiner.

Full example:
```javascript
import React from 'react';
import { Provider } from 'react-redux';
import { makeCookieArchiver } from '@r/redux-state-archiver';
import { UrlSync } from '@r/platform/components';
import App from './src/App';

const themeSelector = (state) => state.theme;
const compactSelector = (state) => state.compact;
const combiner = (theme, compact) => ({ theme, compact });
const CookieSync = makeCookieArchiver(
  themeSelector,
  compactSelector,
  combiner,
);

const renderApp = (store) => (
  <Provider store={ store }>
    <App />
    <UrlSync />
    <CookieSync />
  </Provider>
);

```
npm package: @r00t80y/array-shuffle
Description: Array shuffle
Author: nnu17ip1y
Latest version: 0.1.1

# Array Shuffle

Implementation of the "Fisher-Yates Shuffle" algorithm

## Install

```bash
pnpm i @r00t80y/array-shuffle
```

## How to use it

```ts
import { shuffle } from '@r00t80y/array-shuffle';

console.log(shuffle([1, 2, 3, 4, 5])); // [3, 2, 5, 4, 1]
```

```ts
const arr1 = [1, 2, 3, 4];
const arr2 = shuffle(arr1.slice());

console.log(arr1); // [1, 2, 3, 4]
console.log(arr2); // [3, 2, 4, 1]
```
npm package: @r0b0t/itcss
Description: Creates a folder structure for the  ITCSS methodology
Author: Antonio Maina
Latest version: 1.0.2

# @r0b0t/itcss 

[![npm](https://img.shields.io/npm/v/@r0b0t/itcss.svg)](https://www.npmjs.com/package/@r0b0t/itcss)
[![npm bundle size (minified)](https://img.shields.io/bundlephobia/min/@r0b0t/itcss.svg)](https://www.npmjs.com/package/@r0b0t/itcss)

Creates the folder structure for the ITCSS methodology.  
```
1. Settings
2. Tools
3. Generic
4. Elements
5. Objects
6. Components
7. Utilities
4. ```
```

Run itcss and specify your main sass file. This imports the various base files into your main sass folder.
```
$ itcss --file=main.scss
```
```
$ itcss --file=main.sass
```
npm package: @r0b0t3d/portal
Description: Render everything on top with Portal
Author: Tuan Luong
Latest version: 0.1.3

# @r0b0t3d/portal

Render everything on top with Portal

## Installation

```sh
npm install @r0b0t3d/portal
```

## Usage


```js
import { multiply } from '@r0b0t3d/portal';

// ...

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: @r0b0t3d/react-native-hooks
Description: >
Author: Tuan Luong
Latest version: 1.0.6

# @tl/react-native-hooks

> 

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

## Install

```bash
yarn add @r0b0t3d/react-native-hooks
```

## Hooks
- useAndroidBack
- useAppState
- useDebounce
- useInterval
- useKeyboardEvent
- usePrevious
- useTimeout

## License

MIT © [Tuan Luong](https://github.com/Tuan Luong)
npm package: @r0b0t3d/react-native-swipeable
Description: Swipeable component for react native powered by Reanimated 2 and Gesture Handler
Author: Tuan Luong
Latest version: 0.1.1

# react-native-swipeable

Swipeable component for react native powered by Reanimated 2 and Gesture Handler

![alt text](pictures/intro.gif "Intro")
## Installation

```sh
yarn add @r0b0t3d/react-native-swipeable
```

Also add dependencies, and follow instructions there to setup your project
```
yarn add react-native-reanimated react-native-gesture-handler
```
## Usage

```js
import {
  SwipeableItem,
  withSwipeableContext,
  useSwipeableContext,
} from 'react-native-swipeable';

// ...

function YourComponent() {
    const { close } = useSwipeableContext();

    ... 

    const renderLeftActions = useCallback(() => {
        return (
            <SwipeableItem.Button onPress={handlePinPress}>
                <View style={[styles.delete, { backgroundColor: 'yellow' }]}>
                    <Text>Pin</Text>
                </View>
            </SwipeableItem.Button>
        );
    }, [handlePinPress]);

    return (
        <SwipeableItem
            containerStyle={styles.container}
            renderRightActions={renderRightActions}
            renderLeftActions={renderLeftActions}
            onStartDrag={handleStartDrag}
            onOpened={handleOnOpened}
            onClosed={handleOnClosed}
            onItemPress={handleItemPress}
        >
            <View style={styles.overlay}>
            <Image source={{ uri: item.avatar }} style={styles.avatar} />
            <View style={styles.info}>
                <Text style={styles.name}>{item.name}</Text>
                <Text>
                Lorem Ipsum is simply dummy text of the printing and typesetting
                industry.
                </Text>
            </View>
            </View>
        </SwipeableItem>
    );
}

export default withSwipeableContext(YourComponent);
```

Check [Example](example/src) for the trick I did to close the item when other opened. 

**Hint:** I used `Animated.ShareValue<number>` to set the current item with menu opened

## Contributing

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

## License

MIT
npm package: @r0mflip/logtag
Description: Generate releases/changelog/history file from tags(default)/releases of a GitHub repo.
Author: r0mflip
Latest version: 0.6.0

# logtag

Generate releases/changelog/history file from tags(default)/releases
of a GitHub repo.

The output file is written in markdown and commit messages are used for tags.

> The [CHANGELOG.md](CHANGELOG.md) in this repo is generated by using `logtag`
> from the [releases](https://github.com/r0mflip/logtag/releases/).


## Installation

``` sh
$ npm i -g @r0mflip/logtag
```

## Usage

``` sh
$ logtag --repo expressjs/express \
    --token <GitHubAccesToken> \       # Personal access token for GitHub API
    --out <OutputFile>.md \            # Output to file, default is stdout
    --releases                         # Use GitHub releases instead of git tags
```

### Options
- `--repo <repo>` Specify repo in `<scope>/<repo>` format (`-r`)
- `--token <token>` - GitHub access token (`-t`)
- `--out <file>` - Save formatted markdown output into file (`-o`)
- `--releases` - If specified gets info from releases instead of tags
- `--noempty` - Skip entities with empty or same body as release name (`-n`)

_**Note:**_ Equivalent of `--noempty` is not available programatically

## API

```js
// CJS
const logtag = require('@r0mflip/logtag');

// ESM
import logtag from '@r0mflip/logtag';


// logtag is an AsyncGeneratorFunction
// which returns an AsyncGenerator
const tagSpitter = logtag({
  repo: 'expressjs/express',
  token: '<GITHUB_TOKEN>',
  releases: false,
});

(async _ => {
  for await (const tag of tagSpitter) {
    // Use tag of type
    AsyncGenerator<{
      name: String;
      author: String;
      prerelease: Boolean;
      date: String;
      body: String;
    }, void, unknown>
  }
})();
```

Know more about [Asynchronous generators](https://exploringjs.com/impatient-js/ch_async-iteration.html#async-generators)

# LICENSE
[MIT](LICENSE)
npm package: @r0mm4k/jsonapi-fractal
Description: FORK: JSON:API Serializer inspired by Fractal (ORIGIN: npm i jsonapi-fractal)
Author: r0mm4k
Latest version: 1.1.27

# jsonapi-fractal-fork
JSON:API Serializer inspired by Fractal (ORIGIN: npm i jsonapi-fractal)

### **Changes:**
 - FEATURE: Add features for new v1.1 jsonapi spec (https://jsonapi.org/format/1.1/)
 - BUGFIX: Fix empty object attributes by jsonapi spec


ORIGINAL GIT: https://github.com/andersondanilo/jsonapi-fractal

ORIGINAL NPM: https://www.npmjs.com/package/jsonapi-fractal
npm package: @r0neko/osuparser
Description: Syncronous osu! beatmap file parser written in JavaScript.
Author: r0neko
Latest version: 1.0.3

# osuParser
Syncronous osu! beatmap file parser written in JavaScript.

### Installation

osuParser requires [node.js](https://nodejs.org/) v4+ to run.

Install this package through npm(NodeJS Package Manager).

```sh
$ npm install @r0neko/osuparser
```
### Usage

Example code:

```js
const osuParser = require("@r0neko/osuparser");

console.log("Opening the beatmap!");
let map = osuParser.ParseFile("./TestMap.osu");
// or osuParser.Parse(string) if you want to parse the map from raw string

console.log(`Map opened; ${map.title} - ${map.artist}(${map.creator}) [${map.version}] - Designed for GameMode ${map.mode}`);
console.log(`Audio file: ${map.audio}`);
console.log(`HP: ${map.hp}; CS: ${map.cs}; OD: ${map.od}; CS: ${map.cs}`);
```
npm package: @r0sari0/ts-timer
Description: Timer
Author: r0sari0
Latest version: 1.0.2

# Timer in typescript

Timer for typescript application

## Usage

Create object of timer:

`
const timer = new Timer();
`

Set timer time (in seconds) and laps (default one lap):

`
timer.setTime(10);
timer.setLaps(5);
`

Start timer:

`
timer.start();
`

Stop timer:

`
timer.stop();
`

Reset timer:

`
timer.reset();
`

Restart timer:

`
timer.restart();
`

Pause timer:

`
timer.pause();
`

Get time object (return laps, remaining laps, time, remaining time):

`
timer.getTime();
`

Add listeners (objects with IObserver interface implemented, will be notified after every second):

`
timer.addObserver(IObserver observer);
`
npm package: @r1ch/eslint-config
Description: Ritchie Zhu's ESLint config preset
Author: Ritchie Zhu
Latest version: 1.0.6

# @r1ch/eslint-config

[![CI](https://github.com/laozhu/eslint-config/actions/workflows/ci.yml/badge.svg)](https://github.com/laozhu/eslint-config/actions/workflows/ci.yml)

Ritchie Zhu's ESLint config preset

You need to install this sharable config with eslint

```bash
pnpm install --dev @r1ch/eslint-config eslint
```
npm package: @r1ch/prettier-config
Description: Ritchie Zhu's Prettier config preset
Author: Ritchie Zhu
Latest version: 1.3.4

# @r1ch/prettier-config

[![CI](https://github.com/laozhu/prettier-config/actions/workflows/ci.yml/badge.svg)](https://github.com/laozhu/prettier-config/actions/workflows/ci.yml)

Ritchie Zhu's Prettier config preset

## Install

You need to install this sharable config with required plugins, run below CLI to install all peer dependencies together.

```bash
npx install-peerdeps --pnpm --dev @r1ch/prettier-config
```
npm package: @r1o/primereact
Description: [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
Latest version: 3.1.8-SNAPSHOT.5

[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)

# Forked from primefaces/primereact
Including bug fixes, and some new features.

# PrimeReact

PrimeReact is a rich set of open source UI Components for React.

[![PrimeReact Logo](https://www.primefaces.org/wp-content/uploads/2017/09/primereact-transparent-250.png "PrimeReact")](https://www.primefaces.org/primereact)

See [PrimeReact homepage](https://www.primefaces.org/primereact) for live showcase and documentation.


<p align="center">
  <a href="https://bitsrc.io/primefaces/primereact"><img src="https://i.imagesup.co/images2/0__05c8234cb5e0df.jpg"></a>
</p>

[Components demo](https://bitsrc.io/primefaces/primereact)

## Download

PrimeReact is available at npm, if you have an existing application run the following command to download it to your project.

```
npm install @r1o/primereact --save
npm install @r1o/primeicons --save
```

## Import

```javascript
//import {ComponentName} from 'primereact/{componentname}';
import {Dialog} from 'primereact/dialog';
import {Accordion,AccordionTab} from 'primereact/accordion';
```

## Dependencies

Majority of PrimeReact components (95%) are native and there are some exceptions having 3rd party dependencies such as Google Maps for GMap.

In addition, components require PrimeIcons for icons, classNames package to manage style classes and react-transition-group for animations.

```json
dependencies: {
    "react": "^16.0.0",
    "react-dom": "^16.0.0",
    "react-transition-group": "^2.2.1",
    "classnames": "^2.2.5",
    "primeicons": "^1.0.0-beta.10"
}
```

## Styles
The css dependencies are as follows, note that you may change the theme with another one of your choice.

```
@r1o/primereact/resources/themes/nova-light/theme.css
@r1o/primereact/resources/primereact.min.css
primeicons/primeicons.css
```

If you are using a bundler such as webpack with a css loader you may also import them to your main application component, an example from create-react-app would be.

```javascript
import '@r1o/primereact/resources/themes/nova-light/theme.css';
import '@r1o/primereact/resources/primereact.min.css';
import '@r1o/primeicons/primeicons.css';
```

## QuickStart

An [example application](https://github.com/primefaces/primereact-quickstart) based on create-react-app is available at github.

## TypeScript

Typescript
Typescript is fully supported as type definition files are provided in the npm package of PrimeReact. A sample [typescript-primereact application](https://github.com/primefaces/primereact-typescript-quickstart) is available as well at github.
npm package: @r1tsu/db-mongodb
Description: The officially supported MongoDB database adapter for Payload
Author: Payload
Latest version: 3.0.0-beta.31

# Payload MongoDB Adapter

Official MongoDB adapter for [Payload](https://payloadcms.com).

- [Main Repository](https://github.com/payloadcms/payload)
- [Payload Docs](https://payloadcms.com/docs)

## Installation

```bash
npm install @payloadcms/db-mongodb
```

## Usage

```ts
import { buildConfig } from 'payload/config'
import { mongooseAdapter } from '@payloadcms/db-mongodb'

export default buildConfig({
  db: mongooseAdapter({
    url: process.env.DATABASE_URI,
  }),
  // ...rest of config
})
```

More detailed usage can be found in the [Payload Docs](https://payloadcms.com/docs/configuration/overview).