open-index/open-npm huggingface dataset:
npm package: @kevin-j/simple-react-modal
Description: A simple React modal component
Author: Kevin Jerbic
Latest version: 1.0.1

# Simple React Modal

A simple and customizable React modal component, designed for ease of use and flexibility.

## Getting Started

Install this package:

```shell
npm i @kevin-j/simple-react-modal
```

Import the Modal component:

```js
import Modal from '@kevin-j/simple-react-modal/src/modal.jsx';
```

## Usage

Here's how you can use the modal component in your React project.

# Basic Example

```js
import { useState } from 'react';
import Modal from '@kevin-j/simple-react-modal/src/modal.jsx';

const App = () => {
    const [showModal, setShowModal] = useState(false);

    return (
        <div>
            <button onClick={() => setShowModal(true)}>Open my Modal</button>
            <Modal
                message="Hello, I am a modal"
                toggle={() => setShowModal(false)}
                isOpen={showModal}
            />
        </div>
    );
};

export default App;
```

# Props

The Modal component accepts the following props:

| Prop      | Type         | Required | Description                                    |
| --------- | ------------ | -------- | ---------------------------------------------- |
| `message` | `string`     | Yes      | The content to be displayed.                   |
| `toggle`  | `() => void` | Yes      | Callback function to handle closing the modal. |
| `isOpen`  | `boolean`    | Yes      | Controls wether the modal is visible or not.   |

# CSS Styling

If you want to customize the styles, you can either modify Modal.css or override the styles in your own stylesheet by targeting the following class names:

-   **`.modal`** – The background the modal.
-   **`.modal-content`** – The main modal container.
-   **`.modal-close`** – The close button inside the modal.
npm package: @kevin-k/redux-samples
Description: A collection of redux examples, for educational purposes.
Author: Kevin Kelly
Latest version: 0.0.3

# Redux: basic counter example
An introductory example to the workflow of redux.

## How to run this example
1. Make sure your node modules are installed (as part of the whole "redux-samples" project).
```
npm install
```
2. Run using `node -r esm src/<directory>`. The esm library loaded through -r allows us to use the import/export functionality of ES6 within node.
npm package: @kevin-lambda/kindly
Description: Helper functions
Latest version: 0.0.5

![GitHub package.json version](https://img.shields.io/github/package-json/v/kevin-lambda/kindly)
![GitHub last commit](https://img.shields.io/github/last-commit/kevin-lambda/kindly)

This is my library of kindly helper functions which includes:

- findMaxInArrayOfObjects
- findMinInArrayOfObjects

<!--
npm publish --access=public
npm version patch/minor/major
-->
npm package: @kevin-oisp/kevin-ckeditor
Description: The classic custom editor build of CKEditor 5 – the best browser-based rich text editor.
Author: kevin
Latest version: 2.4.5

# Kevin Rich Text Editor

![Runtime](https://img.shields.io/node/v/@sab-international/rich-text-editor.svg) ![Release](https://img.shields.io/npm/v/@sab-international/rich-text-editor.svg) ![License](https://img.shields.io/npm/l/@sab-international/rich-text-editor.svg) ![Dependencies](https://david-dm.org/sab-international/rich-text-editor.svg)

A customized build of [CKEditor](https://ckeditor.com/ckeditor-5), a rich text editor.

## Development

- [Git repository](https://github.com/KevinDangVN/ckeditor)

- [npm package](https://www.npmjs.com/package/@kevin-oisp/kevin-ckeditor)

## Quick start

First, install the build from npm:

```bash
npm i @kevin-oisp/kevin-ckeditor
```

If you use in React app, install this package:

```bash
npm install --save @ckeditor/ckeditor5-react
```

And use it in your website:

```html
<div id="editor">
  <p>This is the editor content.</p>
</div>
<script src="./node_modules/@kevin-oisp/kevin-ckeditor/build/index.js"></script>
<script>
  ClassicEditor.create(document.querySelector("#editor"))
    .then((editor) => {
      window.editor = editor;
    })
    .catch((error) => {
      console.error("There was a problem initializing the editor.", error);
    });
</script>
```

Or in your JavaScript application:

```js
import ClassicEditor from "@kevin-oisp/kevin-ckeditor";

ClassicEditor.create(document.querySelector("#editor"))
  .then((editor) => {
    window.editor = editor;
  })
  .catch((error) => {
    console.error("There was a problem initializing the editor.", error);
  });
```

```js (ReactJS)
import React from "react";
import { CKEditor } from "@ckeditor/ckeditor5-react";
import ClassicEditor from "@kevin-oisp/kevin-ckeditor";

function App() {
  return (
    <div className="App">
      <header className="App-header">
        <CKEditor
          editor={ClassicEditor}
          data="<p>Hello from CKEditor 5!</p>"
          onReady={(editor) => {
            // You can store the "editor" and use when it is needed.
            console.log("Editor is ready to use!", editor);
          }}
          onChange={(event, editor) => {
            const data = editor.getData();
            console.log({ event, editor, data });
          }}
          onBlur={(event, editor) => {
            console.log("Blur.", editor);
          }}
          onFocus={(event, editor) => {
            console.log("Focus.", editor);
          }}
        />
      </header>
    </div>
  );
}

export default App;
```
npm package: @kevin-rd/clob-client
Description: TypeScript client for CLOB (Central Limit Order Book)
Latest version: 5.2.4

# Polymarket CLOB Client

<a href='https://www.npmjs.com/package/@polymarket/clob-client'>
    <img src='https://img.shields.io/npm/v/@polymarket/clob-client.svg' alt='NPM'/>
</a>

Typescript client for the Polymarket CLOB

### Usage

```ts
//npm install @polymarket/clob-client
//npm install ethers
//Client initialization example and dumping API Keys

import { ApiKeyCreds, ClobClient, OrderType, Side, } from "@polymarket/clob-client";
import { Wallet } from "@ethersproject/wallet";

const host = 'https://clob.polymarket.com';
const funder = '';//This is your Polymarket Profile Address, where you send UDSC to. 
const signer = new Wallet(""); //This is your Private Key. If using email login export from https://reveal.magic.link/polymarket otherwise export from your Web3 Application


//In general don't create a new API key, always derive or createOrDerive
const creds = new ClobClient(host, 137, signer).createOrDeriveApiKey();

//0: Browser Wallet(Metamask, Coinbase Wallet, etc)
//1: Magic/Email Login
const signatureType = 1; 
  (async () => {
    const clobClient = new ClobClient(host, 137, signer, await creds, signatureType, funder);
    const resp2 = await clobClient.createAndPostOrder(
        {
            tokenID: "", //Use https://docs.polymarket.com/developers/gamma-markets-api/get-markets to grab a sample token
            price: 0.01,
            side: Side.BUY,
            size: 5,
        },
        { tickSize: "0.001",negRisk: false }, //You'll need to adjust these based on the market. Get the tickSize and negRisk T/F from the get-markets above
        //{ tickSize: "0.001",negRisk: true },

        OrderType.GTC, 
    );
    console.log(resp2)
  })();
```

See [examples](examples/) for more information

### Error Handling

By default, API errors are returned as `{ error: "...", status: ... }` objects. To have the client throw errors instead, pass `throwOnError: true` as the last constructor argument:

```ts
import { ClobClient, ApiError } from "@polymarket/clob-client";

const clobClient = new ClobClient(
    host, 137, signer, await creds, signatureType, funder,
    undefined, // geoBlockToken
    undefined, // useServerTime
    undefined, // builderConfig
    undefined, // getSigner
    undefined, // retryOnError
    undefined, // tickSizeTtlMs
    true,      // throwOnError
);

try {
    const book = await clobClient.getOrderBook(tokenID);
} catch (e) {
    if (e instanceof ApiError) {
        console.log(e.message); // "No orderbook exists for the requested token id"
        console.log(e.status);  // 404
        console.log(e.data);    // full error response object from the API
    }
}
```
npm package: @kevin-rd/clob-client-sdk
Description: TypeScript client for CLOB (Central Limit Order Book)
Latest version: 5.2.5

# Polymarket CLOB Client

<a href='https://www.npmjs.com/package/@polymarket/clob-client'>
    <img src='https://img.shields.io/npm/v/@polymarket/clob-client.svg' alt='NPM'/>
</a>

Typescript client for the Polymarket CLOB

### Usage

```ts
//npm install @polymarket/clob-client
//npm install ethers
//Client initialization example and dumping API Keys

import { ApiKeyCreds, ClobClient, OrderType, Side, } from "@polymarket/clob-client";
import { Wallet } from "@ethersproject/wallet";

const host = 'https://clob.polymarket.com';
const funder = '';//This is your Polymarket Profile Address, where you send UDSC to. 
const signer = new Wallet(""); //This is your Private Key. If using email login export from https://reveal.magic.link/polymarket otherwise export from your Web3 Application


//In general don't create a new API key, always derive or createOrDerive
const creds = new ClobClient(host, 137, signer).createOrDeriveApiKey();

//0: Browser Wallet(Metamask, Coinbase Wallet, etc)
//1: Magic/Email Login
const signatureType = 1; 
  (async () => {
    const clobClient = new ClobClient(host, 137, signer, await creds, signatureType, funder);
    const resp2 = await clobClient.createAndPostOrder(
        {
            tokenID: "", //Use https://docs.polymarket.com/developers/gamma-markets-api/get-markets to grab a sample token
            price: 0.01,
            side: Side.BUY,
            size: 5,
        },
        { tickSize: "0.001",negRisk: false }, //You'll need to adjust these based on the market. Get the tickSize and negRisk T/F from the get-markets above
        //{ tickSize: "0.001",negRisk: true },

        OrderType.GTC, 
    );
    console.log(resp2)
  })();
```

See [examples](examples/) for more information

### Error Handling

By default, API errors are returned as `{ error: "...", status: ... }` objects. To have the client throw errors instead, pass `throwOnError: true` as the last constructor argument:

```ts
import { ClobClient, ApiError } from "@polymarket/clob-client";

const clobClient = new ClobClient(
    host, 137, signer, await creds, signatureType, funder,
    undefined, // geoBlockToken
    undefined, // useServerTime
    undefined, // builderConfig
    undefined, // getSigner
    undefined, // retryOnError
    undefined, // tickSizeTtlMs
    true,      // throwOnError
);

try {
    const book = await clobClient.getOrderBook(tokenID);
} catch (e) {
    if (e instanceof ApiError) {
        console.log(e.message); // "No orderbook exists for the requested token id"
        console.log(e.status);  // 404
        console.log(e.data);    // full error response object from the API
    }
}
```