open-index/open-npm huggingface dataset:
npm package: @joesanchezjr/clementine-ui
Description: A simple component library for projects built by Joe Sanchez Jr.
Author: joesanchezjr
Latest version: 0.1.0

# clementine-ui

> Made with create-react-library

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

## Install

```bash
npm install --save clementine-ui
```

## Usage

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

import MyComponent from 'clementine-ui'
import 'clementine-ui/dist/index.css'

class Example extends Component {
  render() {
    return <MyComponent />
  }
}
```

## License

MIT © [joesanchezjr](https://github.com/joesanchezjr)
npm package: @joesmackdown/platzom
Description: Traductor de idioma platzom
Author: jose molina
Latest version: 0.1.0

#Platzom

Platzom es un idioma inventado para el [Curso de fundamentos de Javascript](https://platzi.com/js) de [Platzi](https://platzi.com), el mejor lugar de educación online

## Descripción del idioma

-Si la palabra termina en "ar", se le quitan esos dos caracteres.
-Si la palabra incia con Z se le añade "pe" al final.
-Si la palabra traducida tiene 10 o mas letras se debe partir en la mitad y unir con un guion del medio.
-Si la palabra original es un palidromo, ninguna regla anterior cuenta y devuelve la misma palabra intercalando mayusculas y minusculas

## Instalación
 ```
 npm install platzom
 ```

 ## Uso

 ```
 import platzom from 'platzom'

platzom("Programar") // Programar
platzom("Zorro") // Zorrope
platzom("Zarpar") // Zarppe
platzom("abecedario") // abece-dario
platzom("sometemos") // SoMeTeMoS

 ```

## Créditos

- [José Molina](https://www.facebook.com/joeyandcely)

## Licencia

[MIT](https://opensource.org/licenses/MIT)
npm package: @joesonw/tslib
Description: `npm i @joesonw/tslib`
Author: Qiaosen Huang
Latest version: 0.3.2

![actions](https://github.com/joesonw/tslib/workflows/test/badge.svg)
![npm](https://img.shields.io/npm/v/@joesonw/tslib/latest)
![coverage](https://img.shields.io/coveralls/github/joesonw/tslib)

# Install

`npm i @joesonw/tslib`


# Library

## Queue\<T\>
a FIFO Queue

### Queue.add(task: T)
add item to queue

### Queue.get(): Promise\<T\>
wait and get an item from queue

## WaitGroup

### WaitGroup.count: number
count of not done 

### WaitGroup.wait(): Promise\<void\>
wait until all done

### WaitGroup.done(): void
done, reduce count by 1

### WaitGroup.add(amount: number): void
add count

## ThrottledWorkerPool\<T\>

### Worker
```ts
interface Worker<T> {
    work(task: T): Promise<void>;
    cancel?(): void;
}
```

### ThrottledFunction\<T\>
helper function to build simple worker

```
new ThrottledWorkerPool<string>(ThrottledFunction(task => console.log(task)));
```

### new ThrottledWorkerPool\<T\>(newWorker: (id: number) => Worker<T>, onError?: (err: Error) => void)
create a ThrottledWorkerPool

### ThrottledWorkerPool.add(task: T)
enqueue a task

### ThrottledWorkerPool.start(concurrency: number): void
start the pool with given concurrency

### ThrottledWorkerPool.stop(): Promise\<void\>
stop the pool and wait all worker done/canceled

## defer

### defer.sync(defer => Function)

```ts
const f = defer.sync((defer) => (name: string): string => {
    defer((result, err) => {
        if (err) {
            return 'something went wrong';
        }
        return 'nihao, ' + name;
    }) // last 
    defer((result, err) => {
        if (err) {
            return 'something went wrong';
        }
        return 'hola, ' + name;
    }) // first 
    if (Date.now() % 2 == 1) throw new Error('oops');
    return 'hello,' + name;
});

f('xiaoming');
```

### defer.sync(defer => Function)

```ts
const f = defer.async((defer) => async (name: string): string => {
    defer(async (result, err) => {
        if (err) {
            return 'something went wrong';
        }
        return 'nihao, ' + name;
    })
    if (Date.now() % 2 == 1) throw new Error('oops');
    return 'hello,' + name;
});
await f('xiaoming');
```

## Condition\<T\>

### Condition.wait(): Promise\<T\>
wait for signal/broadcast

### Condition.signal(value: T): void
signal one waiting

### Condition.broadcast(value: T): void
wakeup/signal all

## Mutex

lock

### Mutex.lock(): Promise\<void\>

### Mutex.unlock(): void

## RWMutex

read/write lock

### RWMutex.lock(): Promise\<void\>
can only obtain the lock if no other lock/rlock called

### RWMutex.unlock(): void

### RWMutex.rLock(): Promise\<void\>
can simultaneously obtain multiple read lock 

### RWMutex.rUnlock(): void

## sleep(ms: number): Promise<void>

## Once

### Once.do<T>(f: () => T): Promise<T>
only one function will be executed at once, all other `do` calls will be discarded before the first one is returned.
npm package: @joeswann/streamtime-api
Description: Typescript packages for interacting with the streamtime API
Author: Joe Swann
Latest version: 0.1.1

# Streamtime API

Typescript packages for interacting with the Streamtime API.

## Installation

```bash
npm install @joeswann/streamtime-api
```

## Usage

```typescript
import { fetchOrganisation } from "@joeswann/streamtime-api";

const organisation = await fetchOrganisation();
console.log(organisation);
```

## Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Please make sure to update tests as appropriate.

## License

MIT
npm package: @joethefkingfrypan/sequelize-cli
Description: The Sequelize CLI
Latest version: 5.6.0-rc2

# sequelize/cli [![npm version](https://badge.fury.io/js/sequelize-cli.svg)](https://badge.fury.io/js/sequelize-cli) [![Build Status](https://travis-ci.org/sequelize/cli.svg?branch=master)](https://travis-ci.org/sequelize/cli) [![Greenkeeper badge](https://badges.greenkeeper.io/sequelize/cli.svg)](https://greenkeeper.io/)

The [Sequelize](https://sequelize.org) Command Line Interface (CLI)

## Table of Contents
- [Installation](#installation)
- [Contributing](#contributing)
- [Documentation](#documentation)

## Installation

Make sure you have [Sequelize](https://sequelize.org) installed. Then install the Sequelize CLI to be used in your project with

```bash
$ npm install --save-dev sequelize-cli
```

And then you should be able to run the CLI with

```bash
$ npx sequelize --help
```

### Usage

```
Sequelize CLI [Node: 10.15.0, CLI: 5.5.0, ORM: 5.11.0]

npx sequelize [command]

Commands:
  sequelize db:migrate                        Run pending migrations
  sequelize db:migrate:schema:timestamps:add  Update migration table to have timestamps
  sequelize db:migrate:status                 List the status of all migrations
  sequelize db:migrate:undo                   Reverts a migration
  sequelize db:migrate:undo:all               Revert all migrations ran
  sequelize db:seed                           Run specified seeder
  sequelize db:seed:undo                      Deletes data from the database
  sequelize db:seed:all                       Run every seeder
  sequelize db:seed:undo:all                  Deletes data from the database
  sequelize db:create                         Create database specified by configuration
  sequelize db:drop                           Drop database specified by configuration
  sequelize init                              Initializes project
  sequelize init:config                       Initializes configuration
  sequelize init:migrations                   Initializes migrations
  sequelize init:models                       Initializes models
  sequelize init:seeders                      Initializes seeders
  sequelize migration:generate                Generates a new migration file       [aliases: migration:create]
  sequelize model:generate                    Generates a model and its migration  [aliases: model:create]
  sequelize seed:generate                     Generates a new seed file            [aliases: seed:create]

Options:
  --version  Show version number                                         [boolean]
  --help     Show help                                                   [boolean]
```

## Contributing

Sequelize CLI is always looking for contributions. You can help us by fixing bugs, reporting bugs or improving documentation.

Please read the [contributing guidelines](CONTRIBUTING.md).

## Documentation

- [Migrations Documentation](https://sequelize.org/master/manual/migrations.html)
- [CLI Options](docs/README.md)
- [Frequently Asked Questions](docs/FAQ.md)
npm package: @joevalim/database
Description: Uma copia de Simple database library package (using MongoDB) for Docker Demo
Author: Joel Valim
Latest version: 1.2.4

[![npm (scoped)](https://img.shields.io/npm/v/@subfuzion/database.svg)](@subfuzion/database)
[![node (scoped)](https://img.shields.io/node/v/@subfuzion/database.svg)](@subfuzion/database)
[![Travis](https://img.shields.io/travis/subfuzion/docker-voting-app-nodejs.svg)](https://travis-ci.org/subfuzion/docker-voting-app-nodejs)

# @subfuzion/database

This is a simple database package intended for a demo application used for
educational purposes. It provides the ability to save and tally votes. 

It essentially provides a minimal facade for using MongoDB, and also serves to
illustrate how to use and test basic MongoDB operations using ES2017 async/await support
now available natively in Node.js.

The package uses [MongoDB](https://www.mongodb.com/) and the official
MongoDB [Node.js driver](http://mongodb.github.io/node-mongodb-native/2.2).
Votes are stored as documents in the votes collection of the voting database.

It is inspired by the existing [Docker Example Voting App](https://github.com/dockersamples/example-voting-app).
The existing app is an excellent example of a real world polyglot application, demonstrating
containerized processes created from a number of different programming languages. This
package is intended to support a simpler version of the voting application that only
uses Node.js and modern JavaScript that some developers may find a bit easier to follow while
trying to understand how the application actually works.

## Testing

MongoDB needs to be available before running tests. The tests default to
port the standard MongoDB port 27017 on localhost, but host and port can be overridden by setting
HOST and PORT environment variables.

If you have [Docker](https://www.docker.com/) installed, you can easily
start MongoDB with the default values by running the following command:

    $ docker run -d -p 27017:27017 --name mongodb mongodb

This will run a MongoDB container named mongodb in the background with port 27017
on your system mapped to the exposed port 27017 in the container.

To run the tests, enter the following:

    $ npm test

When finished, you can remove the running container from your system with:

    $ docker rm -f mongodb

## Using @subfuzion/database

Add the dependency to your package:

npm:

    $ npm install @subfuzion/database

yarn:

    $ yarn add @subfuzion/database

### Storing votes

    var db = new Database([options])
    let vote = { vote: 'a' } // valid values are 'a' or 'b'
    await db.updateVote(vote)
    // when finished with the database
    await db.close()
 
### Tallying votes

    var db = new Database([options])
    let tally = await db.tallyVotes()
    // tally is an object: { a: <number>, b: <number> }
    // when finished with the database
    await db.close()
npm package: @joewitt99/passport-openidconnect
Description: OpenID Connect authentication strategy for Passport.
Author: Jared Hanson
Latest version: 0.0.4

# Passport-OpenID Connect

[Passport](https://github.com/jaredhanson/passport) strategy for authenticating
with [OpenID Connect](http://openid.net/connect/).

This module lets you authenticate using OpenID Connect in your Node.js
applications.  By plugging into Passport, OpenID Connect authentication can be
easily and unobtrusively integrated into any application or framework that
supports [Connect](http://www.senchalabs.org/connect/)-style middleware,
including [Express](http://expressjs.com/).

## Credits

  - [Jared Hanson](http://github.com/jaredhanson)

## License

[The MIT License](http://opensource.org/licenses/MIT)

Copyright (c) 2011-2013 Jared Hanson <[http://jaredhanson.net/](http://jaredhanson.net/)>
npm package: @joey-c/priority-queue
Description: a js/ts priority queue implementation
Author: Joey
Latest version: 1.0.0

# priority-queue
[![codecov](https://codecov.io/gh/joeyczz/priority-queue/branch/main/graph/badge.svg?token=25AFW589LG)](https://codecov.io/gh/joeyczz/priority-queue)


# ts 优先队列 实现

```
import PriorityQueue from 'priority-queue';

const priorityQueue = new PriorityQueue<number>({
  initial: [3, 9, 6, 5, 10, 2, 7, 1],
  priorityFn: (a, b) => a < b,
});

priorityQueue.add(8);

console.log("出队元素：" + priorityQueue.pool());

console.log("出队元素：" + priorityQueue.pool());

```
npm package: @joey-c/storage
Description: a web storage util
Author: Joey
Latest version: 2.0.1

# storage

[![codecov](https://codecov.io/gh/joeyczz/storage/branch/master/graph/badge.svg)](https://codecov.io/gh/joeyczz/storage)

重写了storage

```
setValue('key', any);
<!-- 数据将以 JSON.stringify({ value: any }) 存入 -->
```
## 安装

```
npm install @joey-c/storage
or 
yarn add @joey-c/storage

```

## 使用

```
<!-- import -->
import { clearAll, localJStorage, sessionJStorage } from '@joey-c/storage';

<!-- localStorage 存 -->
localJStorage.setValue('key', 'hhhh');

<!-- localStorage 取 -->
const value = localJStorage.getValue('key');
console.log('storage', value);

<!-- localStorage 删除key -->
localJStorage.remove('key');

<!-- localStorage 清空 -->
localJStorage.clearAll();

<!-- sessionStorage 存 -->
sessionJStorage.setValue('sskey', ['sshhhh']);

<!-- sessionStorage 取 -->
const ssvalue = sessionJStorage.getValue('sskey');
console.log('storage', ssvalue);

<!-- sessionStorage 删除key -->
sessionJStorage.remove('sskey');

<!-- sessionStorage 清空 -->
sessionJStorage.clearAll();

<!-- 清空所有  localStorage、sessionStorage -->
clearAll();

```

## 标注

localJStorage 使用 window.localStorage

sessionJStorage 使用 window.sessionStorage
npm package: @joey2018/full-page
Description: full-page
Author: Joey
Latest version: 1.0.5

# full-page

## [Demo](https://full-page-pkg.now.sh/)

## Install

```sh
yarn add @joey2018/full-page
# or
npm install -S @joey2018/full-page
```

## Html

```html
<div id="full-page">
  <div class="section">
    1
  </div>
  <div class="section">
    2
  </div>
  <div class="section">
    3
  </div>
</div>
```

## Usage

```js
import '@joey2018/full-page/dist/full-page.css'
import Fullpage from '@joey2018/full-page'

...
new Fullpage(options?);
```

## CDN

```html
<!-- css -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@joey2018/full-page/dist/full-page.css"
/>
<!-- js -->
<script src="https://cdn.jsdelivr.net/npm/@joey2018/full-page/dist/full-page.umd.js"></script>
...
<div id="full-page">
  <div class="section">
    1
  </div>
  <div class="section">
    2
  </div>
  <div class="section">
    3
  </div>
</div>
...
<script>
  new Fullpage();
</script>
```

## Options

```ts
const defaultOptions = {
  navigation: true,
  containerSelector: "#full-page",
  sectionSelector: ".section",
};
```
npm package: @joey998/webpack-plugin-addip
Description: 1. 修改package.json里面的version 2. `nrm use npm` 3. 非scope账户 `npm publish`;      scope账户 `npm publish --access public`
Author: joey998
Latest version: 1.0.14

# webpack-plugin-addip
## 发布
1. 修改package.json里面的version
2. `nrm use npm`
3. 非scope账户 `npm publish`;   
  scope账户 `npm publish --access public`
npm package: @joeyangcy1157/component_test
Description: A react library developed with dumi
Latest version: 0.0.3

# component_test

[![NPM version](https://img.shields.io/npm/v/component_test.svg?style=flat)](https://npmjs.org/package/component_test)
[![NPM downloads](http://img.shields.io/npm/dm/component_test.svg?style=flat)](https://npmjs.org/package/component_test)

A react library developed with dumi

## Usage

TODO

## Options

TODO

## Development

```bash
# install dependencies
$ pnpm install

# develop library by docs demo
$ pnpm start

# build library source code
$ pnpm run build

# build library source code in watch mode
$ pnpm run build:watch

# build docs
$ pnpm run docs:build

# check your project for potential problems
$ pnpm run doctor
```

## LICENSE

MIT
npm package: @joeybaker/css-modules-require-hook
Description: A require hook to compile CSS Modules on the fly
Author: Alexey Litvinov
Latest version: 1.0.3
Deprecated: use css-modules-require-hook instead

css-modules-require-hook
========================

# DEPRECATED. USE [css-modules/css-modules-require-hook](https://github.com/css-modules/css-modules-require-hook) instead

Automatically compiles a CSS Module to a low-level interchange format called ICSS or [Interoperable&nbsp;CSS](https://github.com/css-modules/icss).

One of the ways you can compile [CSS Modules](https://github.com/css-modules/css-modules) to the ICSS format is through the require hook. The require hook will bind itself to node's require and automatically compile files on the fly. This is similar to Babel's [babel/register](https://babeljs.io/docs/usage/require/).

## Install

```bash
$ npm i css-modules-require-hook
```

## Usage

```javascript
require('css-modules-require-hook');
```

## Specifying options

```javascript
require('css-modules-require-hook')({
  // Setting this allows you to specify custom PostCSS plugins
  // You may use functions or strings, which match to the modules with the same name
  use: [] // may use `u` for short
});
```
npm package: @joeybaker/next-view-transitions
Description: View Transitions API for Next.js App Router. Forked just to bump the version for compatibility with react v19
Author: Shu Ding
Latest version: 0.3.6

# next-view-transitions

Use [View Transitions API](https://developer.mozilla.org/en-US/docs/Web/API/View_Transitions_API) in Next.js App Router.

[**Demo**](https://next-view-transitions.vercel.app).

## Disclaimer

This library is aimed at basic use cases of View Transitions and Next.js App Router. With more complex applications and use cases like concurrent rendering, Suspense and streaming, new primitives and APIs still need to be developed into the core of React and Next.js in the future ([more](https://twitter.com/shuding_/status/1779583281920344448)).

## Installation

Use your favorite package manager to install the `next-view-transitions` package. For example:

```bash
pnpm install next-view-transitions
```

## Usage

Wrap your content with the `<ViewTransitions>` component inside the layout file:

```jsx
import { ViewTransitions } from 'next-view-transitions'

export default function Layout({ children }) {
  return (
    <ViewTransitions>
      <html lang='en'>
        <body>
          {children}
        </body>
      </html>
    </ViewTransitions>
  )
}
```

Then, use the `<Link>` component for links that need to trigger a view transition:

```jsx
import { Link } from 'next-view-transitions'

export default function Component() {
  return (
    <div>
      <Link href='/about'>Go to /about</Link>
    </div>
  )
}
```

Or use the `useTransitionRouter` hook for programmatic navigation:

```jsx
import { useTransitionRouter } from 'next-view-transitions'

export default function Component() {
  const router = useTransitionRouter()

  return (
    <div>
      <button onClick={() => {
        // All Next.js router methods are supported
        router.push('/about')
      }}>Go to /about</button>
    </div>
  )
}
```

That's it!

## License

MIT.
npm package: @joeybaker/storybook-addon-smart-knobs
Description: Automatically created knobs for storybook.
Author: lucasconstantino
Latest version: 1.0.0

# Smart knobs addon for Storybook

This Storybook plugin uses storybook-addon-knobs but creates the knobs automatically based on PropTypes.

This fork is compatible with [@kadira/react-storybook-addon-info](https://github.com/kadirahq/react-storybook-addon-info).

## Installation:

```
npm i storybook-addon-smart-knobs --save-dev
```

## Usage:

```js
import React, { PropTypes } from 'react'
import { storiesOf } from '@kadira/storybook'
import { withKnobs } from '@kadira/storybook-addon-knobs'
import { withSmartKnobs } from 'storybook-addon-smart-knobs'

const Button = ({ children, onClick }) => (
  <button onClick={ onClick }>{ children }</button>
)

Button.propTypes = {
  children: PropTypes.node,
  onClick: PropTypes.func
}

storiesOf('Button')
  .addDecorator(withSmartKnobs)
  .addDecorator(withKnobs)
  .add('simple', () => <Button>Smart knobed button</Button>)

```
npm package: @joeyfigaro/use-mutation-redirect
Description: React hook for tanstack-query for redirecting on mutation result
Author: Joey Figaro
Latest version: 1.0.0

# @joeyfigaro/use-mutation-redirect

## Installing

```shell
npm i @joeyfigaro/use-mutation-redirect
pnpm add @joeyfigaro/use-mutation-redirect
yarn add @joeyfigaro/use-mutation-redirect
```

## Requirements

- `react` + `react-dom` `v18.*`
- `@tanstack/react-query` `v5.*` (created using v5.69.0)

I plan to offer support for older versions of React and RQ (TQ?)

## Quickstart

1. import `useMutationRedirect`
2. use it in place of `useMutation`
3. provide options for `useMutation` as the first argument, and [`UseMutationRedirectOptions`](https://github.com/joeyfigaro/use-mutation-redirect/blob/main/src/lib/useMutationRedirect.ts#L12-L67) as the second

```tsx
import { useState } from 'react';
import { useMutationRedirect } from '@joeyfigaro/use-mutation-redirect';
import { useNavigate } from 'react-router-dom';

const Login = () => {
  const [username, setUsername] = useState();
  const [password, setPassword] = useState();
  const navigate = useNavigate();
  const authenticate = useMutationRedirect(
    {
      mutationFn: async () => {
        try {
          // handle your fetching...
        } catch (error) {
          throw new AuthenticationError(error);
        }
      },
      retry: 3,
    },
    {
      to: '/forgot-password',
      navigateFn: navigate,
      // redirect user to forgot password view if a mutation fails 3 times
      trigger: (mutation) => mutation.isError && mutation.failureCount >= 3,
    },
  );

  return (
    <button onClick={() => authenticate.mutate({ username, password })}>
      Authenticate
    </button>
  );
};
```

## Why?

I got tired of rewriting the same post-mutation redirect logic over and over and over.

## License

MIT &copy; [joeyfigaro](https://github.com/sponsors/joeyfigaro)
npm package: @joeyfigaro/use-scroll
Description: Execute side-effects on target scroll progress
Author: Joey Figaro
Latest version: 1.0.6

# @joeyfigaro/use-scroll

[![version](https://badgen.net/npm/v/@joeyfigaro/use-scroll)](https://npm.im/@joeyfigaro/use-scroll) ![types](https://badgen.net/npm/types/@joeyfigaro/use-scroll) ![license](https://badgen.net/npm/license/@joeyfigaro/use-scroll) ![license](https://badgen.net/github/tag/joeyfigaro/use-scroll)

## Install

```bash
npm i @joeyfigaro/use-scroll
yarn add @joeyfigaro/use-scroll
pnpm add @joeyfigaro/use-scroll
```

💛 [Sponsor me](https://github.com/sponsors/)

## License

MIT &copy; [joeyfigaro](https://github.com/sponsors/joeyfigaro)
npm package: @joeyklee/compass.js
Description: A minimal javascript library for accessing the compass direction of a user relative to North.
Author: joeyklee
Latest version: 1.1.1

# compass.js
A minimal javascript library for accessing the compass direction of a user relative to North.

```html
<script src="https://unpkg.com/@joeyklee/compass.js@latest/dist/compass.js"></script>
```


![compass logo](./assets/compass.png)

## Quickstart

Include the reference to the script:
```html
<script src="https://unpkg.com/@joeyklee/compass.js@latest/dist/compass.js"></script>
```

Using Async/Await
```js
window.addEventListener("DOMContentLoaded", async() => {
  const compass = new Compass();
  await compass.init();

  const bearingToNorth = compass.getBearingToNorth();
  console.log(bearingToNorth); // 0;
})
```

Using Callbacks
```js
window.addEventListener("DOMContentLoaded", () => {
  const compass = new Compass();
  compass.init(compassLoaded);


  function compassLoaded(){
    const bearingToNorth = compass.getBearingToNorth();
    console.log(bearingToNorth); // 0;
  }
  
});
```

## Docs

You can read the docs to get a better understanding of the Compass `class`. 

See: [Docs](./docs/)

## Examples

![compass.js demo on mapbox gl map](./assets/compass-demo-mapboxgl.gif)

Here's a few examples to get you started:

* [p5 example](./examples/p5-compass)
* [Vanillajs example](./examples/vanillajs-compass)
* [Mapboxgl example](./examples/mapboxgl-example);


## Develop

To develop the Compass you can install the development dependencies and run the tests below. 

### Setup

```sh
$ npm install
```

### Tests

```sh
$ npm run test
```

### Generate Docs

```
$ npm run docs
```

### Examples

```
$ npm run examples
```

## TODO
* [ ] Add webpack build
* [ ] Allow customization for device orientation access trigger

## Credits
* Built by [Joey Lee](https://jk-lee.com)


## Notes
* A note on new iphone devices
  * device orientation requires user to confirm with a gesture
* A note on compass directions:
  * 0 deg = north 
  * 90 deg = east
  * 180 deg = south
  * 270 deg = west
npm package: @joeymeere/dreamcast
Description: Plug and play Solana programs with just a program ID.
Author: Joey Meere
Latest version: 1.1.0

<img src="https://firebasestorage.googleapis.com/v0/b/zircon-ac0b5.appspot.com/o/dreamcast.png?alt=media&token=35156d61-e316-4aa1-9c82-1b9f532199bd">
<div align="center">
  <img src="https://badgen.net/badge/version/1.0.6/blue">
  <img src="https://badgen.net/badge/contributions/open/blue">
</div>
<h1 align="center">Dreamcast</h1>
<div align="center">
  <h3>Fetching and interacting with Anchor IDLs made quicker and easier.</h3>
</div>

## Who Is This For?
Dreamcast is for both novice and expert developers who are looking to interact with programs that lack a Typescript SDK, but have a published IDL account on-chain.

Additionally, this library is suitable for those who have an IDL file for a custom program they are interacting with, but want a concise and reusable method for creating their provider and program instances.

## Installation
You can install Dreamcast with npm using the following command:
```
npm i @joeymeere/dreamcast
```
Additionally, you can load the source code via unpkg:
```
https://unpkg.com/@joeymeere/dreamcast@latest
```

## Usage

**Fetching IDLs**
```
// create a connection (web3.js)
const connection = new Connection("<rpc url>");
const programId = "STKUaKniasuqrfer3XNbmrrc578pkL1XACdK8H3YPu8";

// returns formatted IDL object
const idl = await getIDL(connection, programId); 
```

## Use with Next.js
If you're using this package with Next.js, you'll need to add some extra lines to your next.config.js to ensure IDLs are correctly loaded. 

```
transpilePackages: ['@joeymeere/dreamcast'],
webpack: (config) => {
    config.resolve.extensionAlias = {
        ".js": [".ts", ".tsx", ".js", ".jsx"],
        ".mjs": [".mts", ".mjs"],
        ".cjs": [".cts", ".cjs"],
    };
  return config;
},
```