open-index/open-npm huggingface dataset:
npm package: @jacobp100/babel-plugin-react-displayname-path
Description: Babel plugin to display React components names with file path prefix
Latest version: 2.0.1

# babel-plugin-react-displayname-path

<a href="https://jacobdoescode.com/technicalc"><img alt="Part of the TechniCalc Project" src="https://github.com/jacobp100/technicalc-core/blob/master/banner.png" width="200" height="60"></a>

Babel plugin to display React components names with file path prefix. Automatically detects and sets `displayName` property for React components.

This is useful for having meaningful component names show up in production builds of React apps.

This will work for top level functions that return JSX.

- Function declarations via `functionName.displayName = 'DisplayName'`
- Arrow functions and function expressions via `Object.assign(() => {...}, { displayName: 'DisplayName' })`

Class components are not supported.

## Install

- `yarn add @jacobp100/babel-plugin-react-displayname-path`
- Add `@jacobp100/react-displayname-path` to your `babel.config.js` file:

```js
const plugins = ["@jacobp100/react-displayname-path"];
```

## Troubleshooting

If `displayName` isn't added, make sure the plugin placed _before_ other plugins in your plugins list.

## Motivation

[Component stack traces](https://reactjs.org/docs/error-boundaries.html#component-stack-traces) are useless in production build:

```
    in b
    in li
    in ul
    in v
    in div
    in div
    in i
    in div
    in Unknown
    in t…
```
npm package: @jacobp100/dialog
Description: Accessible React Modal Dialog.
Author: React Training
Latest version: 0.17.0

# @reach/dialog

[![Stable release](https://img.shields.io/npm/v/@reach/dialog.svg)](https://npm.im/@reach/dialog) ![MIT license](https://badgen.now.sh/badge/license/MIT)

[Docs](https://reach.tech/dialog) | [Source](https://github.com/reach/reach-ui/tree/main/packages/dialog) | [WAI-ARIA](https://www.w3.org/TR/wai-aria-practices-1.2/#dialog_modal)

An accessible dialog or modal window.

```jsx
import { Dialog } from "@reach/dialog";
import "@reach/dialog/styles.css";

function Example(props) {
  const [showDialog, setShowDialog] = React.useState(false);
  const open = () => setShowDialog(true);
  const close = () => setShowDialog(false);

  return (
    <div>
      <button onClick={open}>Open Dialog</button>
      <Dialog isOpen={showDialog} onDismiss={close}>
        <button className="close-button" onClick={close}>
          <VisuallyHidden>Close</VisuallyHidden>
          <span aria-hidden>×</span>
        </button>
        <p>Hello there. I am a dialog</p>
      </Dialog>
    </div>
  );
}
```
npm package: @jacobp100/react-native-notifications
Description: Advanced Push Notifications (Silent, interactive notifications) for iOS & Android
Author: Lidan Hifi
Latest version: 3.1.2

# React Native Notifications
![npm](https://img.shields.io/npm/dw/react-native-notifications.svg)
[![Build Status](https://img.shields.io/jenkins/s/http/jenkins-oss.wixpress.com:8080/job/multi-react-native-notifications-master.svg)](https://jenkins-oss.wixpress.com/job/multi-react-native-notifications-master/)
[![npm (tag)](https://img.shields.io/npm/v/react-native-notifications/snapshot.svg)](https://github.com/wix/react-native-navigation/tree/master)

Handle all the aspects of push notifications for your app, including remote and local notifications, interactive notifications, silent notifications, and more.

**All the native iOS notifications features are supported!** 

_For information regarding proper integration with [react-native-navigation](https://github.com/wix/react-native-navigation), follow [this wiki](https://github.com/wix/react-native-notifications/wiki/Android:-working-with-RNN)._


### iOS

<img src="https://s3.amazonaws.com/nrjio/interactive.gif" alt="Interactive notifications example" width=350/>

- Remote (push) notifications
- Local notifications
- Background/Managed notifications (notifications that can be cleared from the server, like Facebook messenger and Whatsapp web)
- PushKit API (for VoIP and other background messages)
- Interactive notifications (allows you to provide additional functionality to your users outside of your application such as action buttons)

### Android

- Receiving notifications in any App state (foreground, background, "dead")
- Built-in notification drawer management
- High degree of code extensibility to allow for advanced custom layouts and any specific notifications behavior as available by [Android's API](https://developer.android.com/training/notify-user/build-notification.html)
- Android equivalent of React-Native's implementation of [`PushNotificationsIOS.getInitialNotification()`](https://facebook.github.io/react-native/docs/pushnotificationios.html#getinitialnotification).

_Upcoming: local notifications, background-state Rx queue (iOS equivalent)_


# Quick Links
- [Getting Started](https://wix.github.io/react-native-notifications/docs/getting-started)
- [API](https://wix.github.io/react-native-notifications/docs/general-api)
- [Documentation](https://wix.github.io/react-native-notifications/)

# License
The MIT License.

See [LICENSE](LICENSE)
npm package: @jacobp100/react-native-scrollintoview
Description: test
Author: Jacob Parker
Latest version: 0.1.3

# react-native-scrollintoview

Scolls a parent ScrollView to ensure the view is visible

## Installation

```sh
npm install @jacobp100/react-native-scrollintoview
```

## Usage

```js
import ScrollIntoView from '@jacobp100/react-native-scrollintoview';

const Example = () => {
  const ref = useRef();

  const scrollIntoView = () => {
    ref.current.scrollIntoView({
      behavior: 'smooth', // set to auto to disable animation
      inset: {
        top: 20,
        right: 20,
        bottom: 20,
        left: 20,
      }, // Add a margin around view when scrolling
    });
  };

  return (
    <ScrollView>
      <ScrollIntoView ref={ref} />
    </ScrollView>
  );
};
```

Also exports `AnimatedComponent` if you need to provide animated styles.

## 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: @jacobp100/react-native-sfimage
Description: test
Author: Jacob Parker
Latest version: 0.1.2

# react-native-sfimage

Use SFSymbols in react native. Requires iOS 13+.

<a href="https://jacobdoescode.com/technicalc"><img alt="Part of the TechniCalc Project" src="https://github.com/jacobp100/technicalc-core/blob/master/banner.png" width="200" height="60"></a>

![iOS Simulator with icons example](https://media.giphy.com/media/5gB4qLjkuYwVn10O77/giphy.gif) ![Example app](https://i.ibb.co/F03LBxj/Simulator-Screen-Shot-i-Phone-12-2021-06-23-at-11-47-54.png)

## Installation

```sh
npm install @jacobp100/react-native-sfimage
```

## Usage

```js
import SFImage from "@jacobp100/react-native-sfimage";

<SFImage
  systemName="thermometer.sun.fill"
  weight="semibold"
  scale="large"
  tintColor="red"
  size={16}
  resizeMode="center"
  multiColor={false}
/>;
```

## Credit

This library is mostly taken from [react-native-sfsymbols](https://github.com/birkir/react-native-sfsymbols). The key difference is that this library will automatically size the images, so you do not need to set the sizes via the `style` prop.

## 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: @jacobp100/react-native-uistepper
Description: test
Author: Jacob Parker
Latest version: 0.1.1

# React Native UIStepper

Native bindings to iOS's UIStepper

```
npm install -S @jacobp100/react-native-uistepper
```

Or

```
yarn add @jacobp100/react-native-uistepper
```

Props:-

- `value` (`number`)
- `isContinuous` (`boolean`)
- `autorepeat` (`boolean`)
- `wraps` (`boolean`)
- `minimumValue` (`number`)
- `maximumValue` (`number`)
- `stepValue` (`number`)
- `onChange` (`(e: ChangeEvent) => void`)
- `onValueChange` (`(value: number) => void`)
- `disabled` (`boolean`)

These props map directly to those as defined in [Apple's documentation](https://developer.apple.com/documentation/uikit/uistepper)
npm package: @jacobp100/stylis-plugin-extra-scope
Description: Stylis plugin which adds extra scope to each produced CSS rule.
Author: Mateusz Burzyński
Latest version: 0.3.0

# stylis-plugin-extra-scope

[Stylis](https://github.com/thysultan/stylis.js) plugin which adds extra scope to each produced CSS rule.

> ⚠️ This plugin is currently compatible with Stylis 3.

## Example

```js
import Stylis from 'stylis'
import extraScopePlugin from 'stylis-plugin-extra-scope'

const stylis = new Stylis()
stylis.use(extraScopePlugin('#my-scope'))

const rules = stylis(
  '.some-class',
  `
  div {
    span {
      font-size: 14px;
    }
    background-color: rebeccapurple;
  }

  .other-class {
    margin: 20px;
  }
`,
)

console.log(rules) // "#my-scope .some-class div{background-color:rebeccapurple;}#my-scope .some-class div span{font-size:14px;}#my-scope .some-class .other-class{margin:20px;}"
```
npm package: @jacobq/electron-prebuilt-compile
Description: electron-prebuilt that automatically understands Babel + React + LESS
Author: Paul Betts
Latest version: 7.1.1

# electron-prebuilt-compile

electron-prebuilt-compile is a drop-in replacement for [electron-prebuilt](https://github.com/mafintosh/electron-prebuilt) that natively understands ES6 + React + LESS + some other languages, powered by [electron-compile](https://github.com/electronjs/electron-compile).

## Installation

Download and install the latest build of electron for your OS and add it to your projects `package.json` as a `devDependency`:

```
npm install electron-prebuilt-compile --save-dev
```

Now you can just run `electron` to run electron:

```
electron
```

Electron will now understand ES6/ES7 and React components out-of-the-box, even in inline HTML:

```html
<head>
  <link rel="stylesheet" type="text/less" href="main.less" />
</head>

<body id="host">
  <script type="application/javascript">
  import React from 'react';
  import ReactDOM from 'react-dom';
  import TodoApp from './components/TodoApp';
  
  ReactDOM.render(React.createComponent(TodoApp), document.getElementById('host'));
  </script>
</body>
</html>
```
npm package: @jacobq/gulp-jest
Description: Gulp plugin for running your Jest tests
Latest version: 4.0.3-PR65

[![Build Status](https://travis-ci.org/alansouzati/gulp-jest.svg?branch=master)](https://travis-ci.org/alansouzati/gulp-jest)
[![Code Climate](https://codeclimate.com/github/alansouzati/gulp-jest/badges/gpa.svg)](https://codeclimate.com/github/alansouzati/gulp-jest)
[![Test Coverage](https://codeclimate.com/github/alansouzati/gulp-jest/badges/coverage.svg)](https://codeclimate.com/github/alansouzati/gulp-jest/coverage)

# [gulp](http://gulpjs.com)-jest

Gulp plugin for the Jest test library

## Installation

```bash
$ npm install gulp-jest jest
```

## Usage

```javascript
var jest = require('gulp-jest').default;

gulp.task('jest', function () {
  return gulp.src('__tests__').pipe(jest({
    "preprocessorIgnorePatterns": [
      "<rootDir>/dist/", "<rootDir>/node_modules/"
    ],
    "automock": false
  }));
});

```

## `process.env.NODE_ENV`

Unlike the `jest` CLI tool, `gulp-jest` does not automatically set `process.env.NODE_ENV` 
to be `test`. If you are using Webpack or Babel, you may need to manually set `process.env.NODE_ENV`
prior to running the task itself.

```javascript
gulp.task('jest', function () {
  process.env.NODE_ENV = 'test';
  
  return gulp.src('__tests__').pipe(jest({
    ...
  }));
});
```

## API

### jest(options)

#### options

as per [Jest config](http://facebook.github.io/jest/docs/configuration.html)

## License

MIT © [Dominic Barker](http://www.dombarker.co.uk)
npm package: @jacobq/ml-levenberg-marquardt
Description: Curve fitting method in javascript
Author: Miguel Asencio
Latest version: 1.0.3-pr.26

# levenberg-marquardt

[![NPM version][npm-image]][npm-url]
[![build status][travis-image]][travis-url]
[![Test coverage][codecov-image]][codecov-url]
[![David deps][david-image]][david-url]
[![npm download][download-image]][download-url]

Curve fitting method in javascript

## Installation

`$ npm install ml-levenberg-marquardt`

## [API Documentation](https://mljs.github.io/levenberg-marquardt/)

This algorithm is based on the article [Brown, Kenneth M., and J. E. Dennis. "Derivative free analogues of the Levenberg-Marquardt and Gauss algorithms for nonlinear least squares approximation." Numerische Mathematik 18.4 (1971): 289-297.](https://doi.org/10.1007/BF01404679)

In order to get a general idea of the problem you could also check the [Wikipedia article](https://en.wikipedia.org/wiki/Levenberg%E2%80%93Marquardt_algorithm).

## Example

```js
// import library
import LM from 'ml-levenberg-marquardt';
// const LM = require('ml-levenberg-marquardt').default;

// function that receives the parameters and returns
// a function with the independent variable as a parameter
function sinFunction([a, b]) {
  return (t) => a * Math.sin(b * t);
}

// array of points to fit
let data = {
  x: [
    /* x1, x2, ... */
  ],
  y: [
    /* y1, y2, ... */
  ]
};

// array of initial parameter values
let initialValues = [
  /* a, b, c, ... */
];

// Optionally, restrict parameters to minimum & maximum values
let minValues = [
  /* a_min, b_min, c_min, ... */    
];
let maxValues = [
  /* a_max, b_max, c_max, ... */    
];

const options = {
  damping: 1.5,
  initialValues,
  minValues,
  maxValues,
  gradientDifference: 10e-2,
  maxIterations: 100,
  errorTolerance: 10e-3
};

let fittedParams = LM(data, sinFunction, options);
```

Or test it in [Runkit](https://runkit.com/npm/ml-levenberg-marquardt)

## License

[MIT](./LICENSE)

[npm-image]: https://img.shields.io/npm/v/ml-levenberg-marquardt.svg?style=flat-square
[npm-url]: https://npmjs.org/package/ml-levenberg-marquardt
[travis-image]: https://img.shields.io/travis/mljs/levenberg-marquardt/master.svg?style=flat-square
[travis-url]: https://travis-ci.org/mljs/levenberg-marquardt
[codecov-image]: https://img.shields.io/codecov/c/github/mljs/levenberg-marquardt.svg?style=flat-square
[codecov-url]: https://codecov.io/gh/mljs/levenberg-marquardt
[david-image]: https://img.shields.io/david/mljs/levenberg-marquardt.svg?style=flat-square
[david-url]: https://david-dm.org/mljs/levenberg-marquardt
[download-image]: https://img.shields.io/npm/dm/ml-levenberg-marquardt.svg?style=flat-square
[download-url]: https://npmjs.org/package/ml-levenberg-marquardt