open-index/open-npm huggingface dataset:
npm package: @shiftytab/reactselectlist
Description: A React component that renders a select list with a custom dropdown
Author: Rodrigo Ramos
Latest version: 0.1.7

# About this package

This package allows you to set up a dropdown selection list in React. Below, you will find all the options related to the component and how to install it in your project.
## Installation
Follow these steps to install the package:

#### NPM
```bash
  npm i @shiftytab/reactselectlist
```

#### YARN
```bash
  yarn add @shiftytab/reactselectlist
```

## Deployment

Once you have installed the package, simply import it into your project.

```bash
import SelectList from '@shiftytab/reactselectlist';
```

```JSX
<SelectList 
    options={[
        {
            "value": "Test 1"
        },
        {
            "value": "Test 2"
        },
        {
            "value": "Test 3"
        }
    ]}
    onChange={e => console.log(e)}
    label="State"
    placeholder='Select a value'
/>
```


## Authors

- [@shiftytab](https://www.github.com/shiftytab)


[![MIT License](https://img.shields.io/badge/License-MIT-green.svg)](https://choosealicense.com/licenses/mit/)
[![GPLv3 License](https://img.shields.io/badge/License-GPL%20v3-yellow.svg)](https://opensource.org/licenses/)
[![AGPL License](https://img.shields.io/badge/license-AGPL-blue.svg)](http://www.gnu.org/licenses/agpl-3.0)
npm package: @shigde/core
Description: Shig Lobby Library
Latest version: 0.0.2

# Shig Core

Shig Core is an AngularJS library designed to serve as the foundation for the Shig Lobby.
It can be also seamlessly integrated into an Angular application. 
If you are not using Angular, utilize the JavaScript SDK directly via [Lobby web component](https://github.com/shigde/shig-js-sdk).

## Install

```
npm i @shigde/core
```

## Integrate the Shig Lobby component

Shig Core is used in [Shig Web Client](https://github.com/shigde/web-client). Please use the [Shig Web Client](https://github.com/shigde/web-client) as a reference.

To display a Shig Lobby  component in your app you need to import the ShigModule by adding the following lines to your app.module.ts file.

```typescript
import { ShigModule } from '@shigde/core';

@NgModule({
    imports: [
        ShigModule,
    ]
})
class AppModule {
}
```

Add the ```<shig-lobby>``` tag to your own component html like so:

```html

<shig-lobby [stream]="streamId" [space]="spaceId" [token]="userToken" [api-prefix]="" [user]=user-id"></shig-lobby>
```

#### Shig Lobby Components Parameters:

| Parameter  | Description                                                                                           |
|------------|-------------------------------------------------------------------------------------------------------|
| stream     | UUID for the stream, such as the ActivityPub stream UUID.                                             |
| space      | Space Identifier, such as a UUID or the ActivityPub Channel Identifier like `mychannel@video.shig.de` |
| token      | JWT user token provided by the Shig instance                                                          |
| api-prefix | Prefix path for the Shig REST API. Useful when the API is behind a proxy.                             |
| user       | Current user Identifier, such as a ActivityPub  Identifier like `user@video.shig.de`                  |



#### Allow Common js

Because `shigde/core` is using `sdp-transform` lib add in your `angular.json`:

```
"build": {
  "builder": "@angular-devkit/build-angular:browser",
  "options": {
    "allowedCommonJsDependencies": [
      "sdp-transform"
    ],
  }
}
```

## Build

Run `ng build core` from root directory to build the project. The build artifacts will be stored in the `dist/core` directory.
npm package: @shiggydoodah/segment-events
Description: A simple library for track listeners & events for Segment.io
Author: Outfund
Latest version: 1.4.8

# Outfund Segment Tracking Events

A collection of event listeners and triggers for use with segment io.
To learn more about segment io please visit the docs: https://segment.com/docs/

## Usage

To install run `npm install @outfund/segment` or `yarn add @outfund/segment`

### import with ES6 Modules

`import { initSegment, track } from "@outfund/segment`

### import with via commonjs script

coming soon 🕰

### How to Initializing Segment in your code

The initSegment function requires your Segment ID key which you can get from your account.
`initSegment(id: string)`

`const segmentKey = 'abc123'`  
`initSegment(segmentKey)`

## Track Events

`import {track} from '@outfund/segment'`

**Page Views**:
`track.page(pageName: string, regions: string[], platform: string );`

`track.page('Homepage' ['uk','de', 'us' 'es'], 'website' )`

**Element Clicked**: `clicks(selector: string, regions: string[], platform: string)`

**Option Selected**: `optionSelected(selector: string, regions: string[], platform: string)`

**Text Entered**: `textEntered(selector: string, regions: string[], platform: string)`

**Custom Event**: `customEvent(eventName: string, data: any)`

## Data Attributes

`[data-trait=""]`: Fires an identifyer for the event, name the triat you want to track and the value will be the name of the event.

`[element-name=""]`: This will be the name of the event, useful for grouping events, or if you want custom names for event triggers

`[element-type=""]`: The type of element i.e button, hyperlink etc.

`[data-surface-type=""]` Used for the type of surface the event is being fired on, i.e hero, footer, modal, etc.

`[data-surface-title=""]`: The title of the surface the event is being fired on. Not required but useful in some cases.

`[element-state=""]`: Used for defining the state of an element, i.e. active, inactive, open, closed etc.

## Features to be added

- [ ] Automatically pass the region/country in track events
- [ ] Events for Toggles, Modals & Video played
- [ ] Custom Page Names
npm package: @shigma/esbuild-register
Description: Transpile JSX, TypeScript and esnext features on the fly with esbuild
Latest version: 1.1.1

# esbuild-register

[![npm version](https://badgen.net/npm/v/esbuild-register)](https://npm.im/esbuild-register) [![npm downloads](https://badgen.net/npm/dm/esbuild-register)](https://npm.im/esbuild-register)

## Install

```bash
npm i esbuild esbuild-register -D
# Or Yarn
yarn add esbuild esbuild-register --dev
# Or pnpm
pnpm add esbuild esbuild-register -D
```

## Usage

```bash
node -r esbuild-register file.ts
```

It will use `jsxFactory`, `jsxFragmentFactory` and `target` options from your `tsconfig.json`

### Experimental loader support

When using in a project with `type: "module"` in `package.json`, you need the `--loader` flag to load TypeScript files:

```bash
node --loader esbuild-register/loader -r esbuild-register ./file.ts
```

## Programmatic Usage

```ts
const { register } = require('esbuild-register/dist/node')

const { unregister } = register({
  // ...options
})

// Unregister the require hook if you don't need it anymore
unregister()
```

## Sponsors

[![sponsors](https://sponsors-images.egoist.dev/sponsors.svg)](https://github.com/sponsors/egoist)

## License

MIT &copy; [EGOIST](https://egoist.dev)
npm package: @shigma/koishi-plugin-usage-checker
Description: Usage checker for Koishi
Latest version: 0.2.2

# [koishi-plugin-og](https://og.koishi.chat)

[![Codecov](https://img.shields.io/codecov/c/og/koishijs/koishi-plugin-og?style=flat-square)](https://codecov.io/gh/koishijs/koishi-plugin-og)
[![npm](https://img.shields.io/npm/v/koishi-plugin-og?style=flat-square)](https://www.npmjs.com/package/koishi-plugin-og)

Detect links and generate preview images, based on [Open Graph](https://ogp.me/) protocol.

检测链接并生成预览图，基于 [Open Graph](https://ogp.me/) 协议。

## 用法

直接发送任意链接，只要是支持 Open Graph 协议的网站，此插件都会自动发送预览图。

## 许可证

使用 [MIT](./LICENSE) 许可证发布。

```
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
```
npm package: @shigma/prochain
Description: Proxified Promise Chain in JavaScript.
Author: Shigma
Latest version: 1.0.0

# prochain

Proxified Promise Chain in JavaScript.

It allows for method and property chaining without need for intermediate then() or await for cleaner and simpler code.

```js
const { wrap } = require('prochain')
 
// Instead of thens
fetch(url)
  .then(res => res.json())
  .then(json => json.foo.bar)
  .then(value => console.log(value))

// Instead of awaits
const res = await fetch(url)
const json = await res.json()
const value = json.foo.bar
console.log(value)

// With prochain
const value = await wrap(fetch(url)).json().foo.bar
console.log(value)

// Or you can even create a wrapped fetch
const wrapFetch = wrap(fetch)
const value = await wrapFetch(url).json().foo.bar
console.log(value)
```