open-index/open-npm huggingface dataset:
npm package: @imsuresh206/testing
Description: A Select control built with and for ReactJS
Author: imsuresh206
Latest version: 62.73.0

# react-combo-box

react-combo-box is a select control component which helps to Narrow down your results by selecting one or more options provided.

## Installation

Install react-combo-box with npm

```npm
  npm install @imsuresh206/testing
```

## Usage/Examples

## Simple Example

```javascript
import React from 'react';
import { ComboBox } from '@imsuresh206/testing';

const dataProvider = [
  { label: 'Apple', value: 111 },
  { label: 'Pineapple', value: 112 },
  { label: 'Litchi', value: 113 },
  { label: 'Orange', value: 114 },
  { label: 'Banana', value: 115 },
];

export default function App() {
  const [selectedItems, setSelectedItems] = React.useState([]);

  return (
    <div>
      <ComboBox
        dataProvider={dataProvider}
        value={selectedItems}
        onComplete={(value) => {
          setSelectedItems(value);
        }}
      />
    </div>
  );
}
```

## Select items by default

```javascript
import React from 'react';
import { ComboBox } from '@imsuresh206/testing';

const dataProvider = [
  { label: 'Apple', value: 111 },
  { label: 'Pineapple', value: 112 },
  { label: 'Litchi', value: 113 },
  { label: 'Orange', value: 114 },
  { label: 'Banana', value: 115 },
];

export default function App() {
  const [selectedItems, setSelectedItems] = React.useState([
    { label: 'Apple', value: 111 },
    { label: 'Pineapple', value: 112 },
  ]);

  return (
    <div>
      <ComboBox
        dataProvider={dataProvider}
        value={selectedItems}
        onComplete={(value) => {
          setSelectedItems(value);
        }}
      />
    </div>
  );
}
```

## Props

Common props you may want to specify include:

- `cancelText` - text which replaces CANCEL text
- `dataProvider` - specify list of options for users to select
- `leftAdornment` - icon which appears left side of the Filter box
- `onComplete` - handler to get the selected items || [] on submit
- `placeHolder` - text which replaces Select... text
- `primaryColor` - color String which changes Button and Checkbox color
- `rightAdornment` - icon which appears right side of the Filter box
- `selectAllText` - text which replaces Select All text
- `submitText` - text which replaces OK text
- `value` - control the current value

## Demo

https://6480578bad52defd0eefe6ae-atroopthpc.chromatic.com/?path=/story/combo-box--simple

## Codesandbox

https://codesandbox.io/s/sparkling-breeze-4czv7l

## Features

- Customalizable
- Cross browser supported
- Light weighted
- Search and Filter options

## Contributing

Contributions are always 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.

## Authors

- @imsuresh206

## Feedback

If you have any feedback, please reach out to us at suresh@softsuave.com

## License
MIT License

Copyright (c) 2023 Suresh-SS
npm package: @imsuzan0/log-emoji
Description: Colorful emoji-powered console logger for Node.js with multiple log types, colors, and custom logs
Author: imsuzan0
Latest version: 1.0.5

# Log Emoji 🎉

**Logmoji** is a lightweight, zero-dependency Node.js logger that makes your console output **fun, colorful, and easy to read** using emojis + ANSI colors. Perfect for CLI tools, backend logs, or just making debugging less boring!

---

## ✨ Features

- 🎨 **40+ color & style options** (basic, bright, and background ANSI colors, no dependencies)
- 🚀 **30+ predefined log types**:  
  - **Standard:** `success`, `error`, `warning`, `info`, `debug`  
  - **Process:** `start`, `stop`, `complete`, `loading`, `update`, `pending`, `successAlt`  
  - **File & Data:** `save`, `delete`, `upload`, `download`, `search`  
  - **Network & System:** `connect`, `disconnect`, `retry`, `security`, `unlock`, `network`, `crash`
- 🌟 **Custom log support** — choose your own emoji, color, label, and message
- 🕒 Automatic timestamps for every log
- ⚡ Tiny, dependency-free, and colorful


---

## 📦 Installation

````bash
npm install @imsuzan0/log-emoji
````


# 🚀 Usage

```javascript
import { log } from "@imsuzan0/log-emoji";

// Standard logs
log.success("Server started successfully");
log.error("Database connection failed");
log.warning("Low disk space");
log.info("Listening on port 3000");
log.debug("User is authenticated");

// Process logs
log.start("Deployment initiated");
log.stop("Deployment halted");
log.complete("Deployment successful");
log.loading("Fetching data...");
log.update("Pulling latest changes");
log.pending("Waiting for approval");
log.successAlt("Task completed");

// File & data logs
log.save("Configuration saved");
log.delete("Old logs removed");
log.upload("Uploading file to server...");
log.download("Downloading report...");
log.search("Looking for config file...");

// Network & system logs
log.connect("Connected to database");
log.disconnect("Disconnected from server");
log.retry("Retrying request...");
log.security("Security scan complete");
log.unlock("User account unlocked");
log.network("Network check passed");
log.crash("Server crashed unexpectedly!");

//💻 Custom logs
log.custom("🌟", "brightMagenta", "HIGHLIGHT", "Special log message");
log.custom("🔥", "brightRed", "ALERT", "Server CPU usage is high!");
````

## 🖌️ Available Colors

- **Basic Colors:** `black`, `red`, `green`, `yellow`, `blue`, `magenta`, `cyan`, `white`
- **Bright Colors:** `brightBlack`, `brightRed`, `brightGreen`, `brightYellow`, `brightBlue`, `brightMagenta`, `brightCyan`, `brightWhite`
- **Background Colors:** `bgRed`, `bgGreen`, `bgYellow`, `bgBlue`, `bgMagenta`, `bgCyan`, `bgWhite`


# 💻 Example Output
![Screenshot](https://i.postimg.cc/tCCMTFrs/Screenshot-2025-08-14-144733.png)

# 🔧 Custom Log

```javascript
log.custom(emoji, color, label, message);
```

- emoji → Your chosen emoji
- color → Any color from the list above
- label → Label to appear in the log
- message → Your log message
npm package: @imtala/gql-docs
Description: A svelte component that creates GraphQL documentation
Author: @des-des
Latest version: 1.0.7

# Graphql Documentation Creator

Easily create lightweight documentation for your Graphql API.

The resulting website has the following attributes
  - Fully static, which means you can host on any file server.
  - Each type document has its own rendered HTML document - Snappy and fast UI, good SEO & a low browser footprint.

This tool generates a static website - for every query, mutation or type in you schema a lightweight html page is created. Fast, simple and themeable.

## Usage

### Use as a svelte component
If you are using svelte and want to integrate gql docs into an existing website you can use the `GqlDocumentation` component exposed the the npm module: `@insola/gql-docs-svelte`.
  - you will need to install `graphql` as a dependency, since currently svelte/kit does not include this in the bundle

### Use as a cli tool
  - Raise an issue if you want to use this tool to create a static site without using svelte. A cli tool will be published on npm shortly.

## Examples
  - [Github's public GraphQL API](https://des-des.github.io/imtala/examples/github/)

<!-- ### Use as a cli tool
  1. Install either as a local module or globally - `npm i @insola/gql-docs-cli`
  2. Build your static documentation site.
  3. `insola-gql-docs-cli --output-directory documentation-website --introspection-source introspection-result.json` -->
npm package: @imtapan/re-storage
Description: A simple and lightweight library for managing local storage in JavaScript applications.
Author: imTapan
Latest version: 1.0.0

## 🗃️ re-storage

**A lightweight universal state persistence utility for JavaScript, Vue, React, Nuxt, Next, and more.**  
Access browser `localStorage` and `sessionStorage` using simple, reactive-like functions.

---

### 📦 Installation

```bash
npm i re-storage
```

Or using Yarn:

```bash
yarn add re-storage
```

---

### 🚀 Usage

```ts
import { useLocalStorage, useSessionStorage } from "re-storage";

const local = useLocalStorage("myKey", "defaultValue");
local.set("newValue");
console.log(local.get()); // 'newValue'

const session = useSessionStorage("sessionKey", { loggedIn: false });
session.set({ loggedIn: true });
console.log(session.get()); // { loggedIn: true }
```

---

### 📘 API

#### `useLocalStorage(key: string, defaultValue?: any)`

#### `useSessionStorage(key: string, defaultValue?: any)`

Each returns an object with:

| Method       | Description                        |
| ------------ | ---------------------------------- |
| `get()`      | Get the current value from storage |
| `set(value)` | Set a new value to storage         |
| `remove()`   | Remove the item from storage       |
| `key`        | The original key you passed        |

> Note: Automatically serializes/deserializes objects and arrays.

---

### 🔧 Works in

- ✅ Vanilla JS / TS
- ✅ Vue 3 / Nuxt 3
- ✅ React / Next.js
- ✅ Vite / Webpack / Node (in browser context)

---

### 💡 Example in Vue 3

```ts
<script setup>
import { useLocalStorage } from 're-storage';

const theme = useLocalStorage('theme', 'light');

function toggleTheme() {
  theme.set(theme.get() === 'light' ? 'dark' : 'light');
}
</script>
```

---

### 📄 License

MIT © [imTapan](https://github.com/imTapan)
npm package: @imtbl/design-system
Description: A repository to house all design system components utilised inside of IMX GUI.
Author: Tim Paul
Latest version: 7.7.7
Deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

# @imtbl/design-system

A repository to house all design system components utilised inside of Immutable GUI. Please note, this repo uses [GIT LFS](https://git-lfs.github.com/). Please make sure you check it out with git lfs enabled. :) 

## prerequisites

This library assumes the following peer dependencies are installed in the consumer application:

```
"react": "^18.2.0",
"react-dom": "^18.2.0",
"bignumber.js": "^9.0.1",
"@emotion/css": "^11.5.0"
```

## install

```
npm install @imtbl/design-system
```

## set up node and npm

```bash
nvm install
nvm use
npm install -g npm@7.21.0
```

## run local dev

```
npm ci; npm run dev
```

## build

```
npm run build:lib
```

## build watch

```
npm run build:lib:watch
```

## run tests (incl eslint + stylelint + types + cypress + coverage)

```
npm run test

## develop/edit cypress tests

```

npm run test:open

```

## Releasing Code

For complete instructions on how this repository is owned and released, please [Review the FE Handbook](https://immutable.atlassian.net/wiki/spaces/APOLLO/pages/1826291736/Immutable+Frontend+Engineering+Handbook+DRAFT#Ownership-%26-Releasing-of-Code)

## further info

You can read [further details](https://immutable.atlassian.net/wiki/spaces/APOLLO/pages/827621392) on confluence.
```