open-index/open-npm huggingface dataset:
npm package: @jam3/detect
Description: User agent feature detection like Device Orientation, in App Browser Detection, etc
Latest version: 2.0.5

# detect

User Agent refined detect, it's using bowser as a base detector.

## Why do we need another detector?
This detector has some important features that we use at Jam3 like Device Orientation, in App Browser Detection, etc.

## Installation

```
npm install @jam3/detect
```

## Importing

```
import detect from '@jam3/detect';
import { os, browser, device } from '@jam3/detect';
```

## Usage

1. Know the OS Major Version

```
import { os } from '@jam3/detect';

console.log(os.majorVersion);
```

2. Get device orientation

```
import { device } from '@jam3/detect';

console.log(device.portrait);
console.log(device.landscape);
```
npm package: @jam3/gsap-promise
Description: a Promise wrapper around gsap / twenelite
Author: Matt DesLauriers
Latest version: 4.0.1

# @jam3/gsap-promise

[![experimental](http://badges.github.io/stability-badges/dist/experimental.svg)](http://github.com/badges/stability-badges)

A Promise wrapper around gsap / tweenlite. 

```js
var animate = require('gsap-promise')

Promise.all([
	animate(element, 1.0, { x: 10 }),
	animate(element, 1.0, { y: 10, delay: 0.5 })
]).then(function() {
	console.log("all animations finished")
})
```

**Note:** Version 2.x uses `global.Promise` (you will need to polyfill it yourself). If you want a promise implementation, switch to 1.x which defaults to using Bluebird.

## Usage

[![NPM](https://nodei.co/npm/gsap-promise.png)](https://nodei.co/npm/gsap-promise/)

This promisifies the `TweenMax` methods: `to`, `from`, `set` and `fromTo`.

#### ```animate.to(element, duration, params)```
#### ```animate.from(element, duration, from)```
#### ```animate.set(element, params)```
#### ```animate.fromTo(element, duration, from, to)```
#### ```animate.staggerFromTo(element, duration, from, to, stagger)```
#### ```animate.staggerFrom(element, duration, from, stagger)```
#### ```animate.staggerTo(element, duration, to, stagger)```

Matches the TweenMax methods by the same name, but returns a Promise for the onComplete event. 

#### ```animate.all(element)```

An alias for `Promise.all`, which will trigger all tweens in parallel.

#### ```animate.killTweensOf(elements)```

An alias for `gsap.killTweensOf(elements)`.

#### ```animate(element, duration, params)```

The default export is the same as `animate.to`.

## License

MIT, see [LICENSE.md](http://github.com/mattdesl/gsap-promise/blob/master/LICENSE.md) for details.
npm package: @jam3/preact-transition-router
Description: Connect your components up to that address bar.
Author: Jason Miller
Latest version: 2.5.3

# @jam3/preact-transition-router

This is a fork of [preact-router@2.5.2](https://github.com/developit/preact-router) that integrates with [preact-transition-group](https://github.com/developit/preact-transition-group).

This is used internally by Jam3 — you probably just want to use `preact-router` directly!

---


### License

[MIT]


[Preact]: https://github.com/developit/preact
[MIT]: http://choosealicense.com/licenses/mit/
npm package: @jam3/react-hooks
Description: Collection of useful hooks
Author: Jam3
Latest version: 1.0.1

# @jam3/react-hooks

> Repository for public react hooks

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

## Hooks List

- `use-intersection-observer`: Observes a DOM Element
- `use-mouse-position`: Mouse Position [ {x , y} ]
- `use-on-hover`: Detects hover events and accepts two callbacks for in & out
- `use-scroll-direction`: Scroll direction [top | up | down]
- `use-scroll-progress`: Scroll Progress [0-100]
- `use-scroll-to-top`: Scrolls To Top [fn]
- `use-window-size`: Window Size [ {innerHeight , innerWidth} ]

## Install

[![NPM](https://nodei.co/npm/@jam3/react-hooks.png)](https://nodei.co/npm/@jam3/react-hooks/)

```bash
npm install @jam3/react-hooks
yarn add @jam3/react-hooks
```

## Usage

Sample Usage for one of the hooks

```jsx
import React from "react";
import { useMousePosition } from "@jam3/react-hooks";

const Component = () => {
  const { x, y } = useMousePosition();

  return (
    <div>
      Mouse position x: {x}
      <br />
      Mouse position y: {y}
    </div>
  );
};
```

For more information, please refer to [Usage](https://jam3-react-hooks.netlify.com) in our documentation.

## Release

Steps:

1. `git checkout master; git pull origin master`
2. Document the changelog and bump the package.json version
3. `npm run build`
4. `npm publish`

By pushing `master`, Netlify will run `npm run deploy` and it will re-deply the docs [here](https://jam3-react-hooks.netlify.com)

## Contributing

Please make sure to read the [contributing guide](CONTRIBUTING.md) before making a pull request.

## Changelog

Detailed changes for each release are documented in the [release notes](CHANGELOG.md).

# What next

- Automate new hooks creation and publishing
- Improve docs and examples
- Typescript support
- SSR Support
- Conventional Commit Specifications

## License

MIT © [Jam3](https://github.com/Jam3)

---

This hook is created using [create-react-hook](https://github.com/hermanya/create-react-hook).
npm package: @jam3/react-ui
Description: React components that follow Jam3 standards
Latest version: 2.0.0

# Jam3 React UI [![stable](http://hughsk.github.io/stability-badges/dist/stable.svg)](http://github.com/hughsk/stability-badges)

Repository for public react components in Jam3. These components are used out of the box in the [Jam3 SPA Generator](https://github.com/Jam3/nyg-jam3)

## Component Library

https://jam3.github.io/react-ui/

## Installation

@Jam3/React-UI is available as an npm package

[![NPM](https://nodei.co/npm/@jam3/react-ui.png)](https://www.npmjs.com/package/@jam3/react-ui)

```
npm install @jam3/react-ui
yarn add @jam3/react-ui
```

# Eject Usage

The components in this library to be ejected for advanced customization while maintaining version control.
This functionality is achieved by npm post install hook that runs src/scripts/copy-component-utility.js
To use it, simply create a `react-ui.json` file with the following properties.

```
{
  "eject": true,
  "eject-path": "./src/components",
  "components": [
    {
      "name": BaseButton",
      "newName": "PillButton"
    },
    "VideoPlayer"
  ]
}
```

eject: Enables the ejection of components, if ommited the script will not be called.
eject-path: Specifies a custom path for the components to be ejected to, if ommited defaults to src/components.
components: A list of components to eject into your project. Components can be defined as strings (simple mode)
or as objects (advanced mode). In advanced mode you can specify a new ejected name to be used in your project.

Every time `npm install` runs in your project, it will analyze react-ui for any updates to the base component,
if an update is detected, it will generate git merge markers with the new changes while preserving any ejected changes
made in the project.

For more information, please refer to [Usage](USAGE.md) in our documentation.

## Contributing

Please make sure to read the [contributing guide](CONTRIBUTING.md) before making a pull request.

## Changelog

Detailed changes for each release are documented in the [release notes](CHANGELOG.md).

## Licence

@jam3/react-ui is open source and released under the MIT Licence.
npm package: @jam3/stats
Description: Default Performance Monitor @ Jam3
Latest version: 1.0.1

# stats

Default Performance Monitor @ Jam3

## Installation

```
npm install @jam3/stats
```

## Usage

The module is exporting a function, therefore after importing it, call that function. You will have the stats monitor running immediately in your browser.

```
const stats = require('@jam3/stats');

stats();
```

It's recommended to use this library only in development, a common way to use it at Jam3 is:

```
if (process.env.NODE_ENV !== 'production' && window.location.href.indexOf('?nostat') === -1) require('./util/stats')();

```
npm package: @jam3/wait
Description: Wait a specific amount of time and return a promise, "setTimeout promisified"
Latest version: 1.0.0

# wait

Minimalistic <nano> library that promisified `setTimeout`.

## Installation

```
npm install @jam3/wait
```

## Usage

### Basic usage

```
const wait = require('@jam3/wait');

wait(1500).then(callback);
```

### Async/Await example

```
const wait = require('@jam3/wait');

async function animate() {
  await wait(0); // Wait for JS to dequeue this call and do some rending in the meanwhile
  console.log('Waited at least 0 milliseconds');
}
```

### Promises example

```
const wait = require('@jam3/wait');

async function runProcess() {
  ...
  await Promise.all([setTimer, other]);
  ...
}

async setTimer() {
  return await wait(1000);
}
```

## Alternatives

If you want a more complete library, with a couple extra bytes, checkout [delay](https://www.npmjs.com/package/delay)
npm package: @jamadd/react-native-template-icons
Description: React Native Template Icons is a collection of icons designed by JaMa D&D.
Author: JaMaD&D
Latest version: 0.4.2

# React Native Template Icons

**React Native Template Icons** provides a set of icons designed by **JaMa D&D**.

## Features

- Comprehensive icon set
- Supports predefined icon sizes and custom icon sizes
- Customizable icon colors

## Installation

```sh
yarn add @jamadd/react-native-template-icons
```

or

```sh
npm install @jamadd/react-native-template-icons
```

## Usage

```js
import Icon, { IconSize } from "@jamadd/react-native-template-icons";

// Using predefined icon size
<Icon name={"reactnativetemplate"} color={"#7ccf6b"} size={IconSize.S} />;

// Using custom icon size
<Icon name={"reactnativetemplate"} color={"#7ccf6b"} size={24} />;
```

## Predefined Icon Sizes

```ts
export enum IconSize {
  XXS = 12,
  XS = 18,
  S = 24,
  M = 30,
  L = 36,
  XL = 42,
  XXL = 48,
}
```

## Available Icons

TODO

## Demo Applications

TODO

## Credits

This package is created using [react-native-vector-icons](https://github.com/oblador/react-native-vector-icons/blob/master/docs/CREATE_FONT_PACKAGE.md) and [Yeoman generator](https://yeoman.io/learning/).

## License

MIT
npm package: @jamais/vue-cli-plugin-babel
Description: babel plugin for vue-cli
Author: Jamais Ng
Latest version: 3.12.2

# @vue/cli-plugin-babel

> babel plugin for vue-cli

## Configuration

Uses Babel 7 + `babel-loader` + [@vue/babel-preset-app](https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/babel-preset-app) by default, but can be configured via `babel.config.js` to use any other Babel presets or plugins.

By default, `babel-loader` excludes files inside `node_modules` dependencies. If you wish to explicitly transpile a dependency module, you will need to add it to the `transpileDependencies` option in `vue.config.js`:

``` js
module.exports = {
  transpileDependencies: [
    // can be string or regex
    'my-dep',
    /other-dep/
  ]
}
```

## Caching

[cache-loader](https://github.com/webpack-contrib/cache-loader) is enabled by default and cache is stored in `<projectRoot>/node_modules/.cache/babel-loader`.

## Parallelization

[thread-loader](https://github.com/webpack-contrib/thread-loader) is enabled by default when the machine has more than 1 CPU cores. This can be turned off by setting `parallel: false` in `vue.config.js`.

## Installing in an Already Created Project

``` sh
vue add babel
```

## Injected webpack-chain Rules

- `config.rule('js')`
- `config.rule('js').use('babel-loader')`
- `config.rule('js').use('cache-loader')`
npm package: @jamal./gatsby-theme-shopify-manager
Description: The easiest way to build a Shopify shop on Gatsby.
Author: Trevor Harmon
Latest version: 0.2.4

![Gatsby Theme Shopify_Manager](https://gatsbythemeshopifymanager.com/social-header.png)

[![Netlify Status](https://api.netlify.com/api/v1/badges/a69b3855-3f3c-437f-bd8e-90567d58106a/deploy-status)](https://app.netlify.com/sites/gatsby-theme-shopify-manager/deploys)

## This is an adaption of the original package by thetrevorhamon

## Quickstart guide

Install this with npm:

```bash
npm install gatsby-theme-shopify-manager
```

Or with yarn:

```bash
yarn add gatsby-theme-shopify-manager
```

Set up your `gatsby-config.js`:

```javascript
{
  resolve: `gatsby-theme-shopify-manager`,
  options: {
    storeUrl: `your-shop-name`,
    password: `your-storefront-secret-key`,
    storefrontAccessToken: `your-storefrontAccessToken`
  },
},
```

Import a hook:

```javascript
import {useCart} from 'gatsby-theme-shopify-manager';
```

Start coding. 🚀

## Full documentation

The full docs are found at [https://gatsbythemeshopifymanager.com/](https://gatsbythemeshopifymanager.com/).

## Contributing

To contribute to this repo, pull the repo and ask for the appropriate `.env` values for the `/docs` site. Then to start the project, simply run `yarn start` at the project root.

To add a new version, take the following steps:

1. Increment the `/docs` version of `gatsby-theme-shopify-manager` to whatever it will be.
2. Stage any changes you want to be part of the commit.
3. Run `yarn version` within the `gatsby-theme-shopify-manager` directory.
4. Change the version number to the appropriate release number (major, minor, patch).
5. Run `git push --tags` and `git push`.
6. Run `npm publish`.
npm package: @jamalbelilet/gatsby-theme-elements
Description: This is a Gatsby theme built for [Theme Jam](https://themejam.gatsbyjs.org).
Author: Djamaleddine Belilet
Latest version: 1.0.1

# Gatsby Theme Elements

This is a Gatsby theme built for [Theme Jam](https://themejam.gatsbyjs.org).

See the [live demo](https://gatsby-theme-elements.netlify.com)

## Installation

To use this theme in your Gatsby sites, follow these instructions:

1.  Install the theme
    ```sh
    npm install --save gatsby-theme-elemetns
    ```

2.  Add the theme to your `gatsby-config.js`:
    ```js
    module.exports = {
      plugins: [
        'gatsby-theme-elements'
      ]
    }
    ```

4. Create src/articles/ folder for .md articles with the following frontmatter

  \-\-\-
  date: "2019-06-23"
  title: "Quis ad eiusmod qui irure"
  tags: ['javascript', 'webdev', 'tutorial', 'node', 'career', 'css']
  image: "./images/index.jpg"
  \-\-\-


5. Create src/stories/stories.yaml with the following structure

\- caption: 'Develop React or React native with backend Nodejs Laravel'
  image: 'react'

\- caption: 'Create a Gatsby website connected to a headless CMS'
  image: 'gatsby'

\- caption: 'Develop iOS and Android app using Flutter with back end'
  image: 'flutter'

6.  Start your site
    ```sh
    gatsby develop
    ```
npm package: @jamalkhan/steamworksjs
Description: A Fork of: https://github.com/ceifa/steamworks.js
Latest version: 0.0.32

# Steamworksjs

A Fork of: https://github.com/ceifa/steamworks.js

## API

```js
const steamworks = require('steamworks.js')

// You can pass an appId, or don't pass anything and use a steam_appid.txt file
const client = steamworks.init(480)

// Print Steam username
console.log(client.localplayer.getName())

// Tries to activate an achievement
if (client.achievement.activate('ACHIEVEMENT')) {
    // ...
}
```

You can refer to the [declarations file](https://github.com/ceifa/steamworks.js/blob/main/client.d.ts) to check the API support and get more detailed documentation of each function.

## Installation

To use steamworks.js you don't have to build anything, just install it from npm:

```sh
$: npm i steamworks.js
```

### Electron

Steamworks.js is a native module and cannot be used by default in the renderer process. To enable the usage of native modules on the renderer process, the following configurations should be made on `main.js`:

```js
const mainWindow = new BrowserWindow({
    // ...
    webPreferences: {
        // ...
        contextIsolation: false,
        nodeIntegration: true,
    },
})
```

To make the steam overlay working, call the `electronEnableSteamOverlay` on the end of your `main.js` file:

```js
require('steamworks.js').electronEnableSteamOverlay()
```

## How to build

> You **only** need to build if you are going to change something on steamworks.js code, if you are looking to just consume the library or use it in your game, refer to the [installation section](#installation).

Make sure you have the latest [node.js](https://nodejs.org/en/), [Rust](https://www.rust-lang.org/tools/install) and [Clang](https://rust-lang.github.io/rust-bindgen/requirements.html). We also need [Steam](https://store.steampowered.com/about/) installed and running.

Install dependencies with `npm install` and then run `npm run build:debug` to build the library.

There is no way to build for all targets easily. The good news is that you don't need to. You can develop and test on your current target, and open a PR. When the code is merged to main, a github action will build for all targets and publish a new version.