open-index/open-npm huggingface dataset:
npm package: @igloo_cloud/mui-otp-input
Description: A MUI-based input for OTPs
Author: IglooCloud
Latest version: 1.0.4

<p align="center">
  <img src="https://static.igloo.ooo/logo-192.png" alt="Igloo logo" width="128"/>
</p>

<h1 align="center">MUI OTP Input</h1>

A customizable input for numeric one-time passwords based on [MUI](https://mui.com/).

<p align="center">
  <img src="https://user-images.githubusercontent.com/23523551/144852579-c97643e5-bc97-48a6-9602-a59bedd75998.png" alt="Component screenshot" width="960"/>
</p>

# Installation

Just download the library from [npm](https://www.npmjs.com/package/@igloo_cloud/mui-otp-input).

**Using npm**

```bash
npm install @igloo_cloud/mui-otp-input --save
```

**Using Yarn**

```bash
yarn add @igloo_cloud/mui-otp-input
```

# Usage

This library exports an `OtpInput` component as default. Once added to your app the component will accept the following props:

| Name             | Type     | Default    | Description                                                                             |
| ---------------- | -------- | ---------- | --------------------------------------------------------------------------------------- |
| characters       | `number` | `4`        | Number of character fields to display.                                                  |
| onChange         | `func`   | `() => {}` | Callback function that is called when the value of one of the character fields changes. |
| value            | `array`  | `[]`       | An array on numbers corresponding to each of the character fields.                      |
| leadingCharacter | `string` | `null`     | An optional character to display before the input.                                      |

In addition to these props, the component will also accept all the props supported by [MUI Textfields](https://mui.com/api/text-field/).

# Try it out

Just clone this repository and run the following commands to open a live demo:

**Using npm**

```bash
cd example
npm start
```

**Using Yarn**

```bash
cd example
yarn start
```
npm package: @igloohr/hitomezashi
Description: Simple javascript class for generating hitomezashi stitch pattern svg backgrounds
Author: Kristijan Šimenić
Latest version: 1.0.2

# Hitomezashi stitch background generator

Hitomezashi is a simple javascript library for generating beautiful "stitch patterns". Initialy built for generating svg backgrounds.


## Usage

#### Basic usage

```html
<script type="text/javascript" src="node_modules/@igloohr/hitomezashi/dist/hitomezashi.min.js"></script>
<script type="text/javascript">
	/*
	new HitomezashiStitch(
		# array of binary numbers used as horizontal hash,
		# array of binary numbers used as vertical hash,
		# background color,
		# line color
	)
	*/
	document.addEventListener("DOMContentLoaded", function(event) {
		var stitch = new HitomezashiStitch(
			[0,1,1,0,1,0],
			[0,1,1,0,1,0],
			"#000000",
			"#ffffff"
		)
		stitch.render()
	});
</script>
```
#### Advanced usage
```html
<script type="text/javascript" src="node_modules/@igloohr/hitomezashi/dist/hitomezashi.min.js"></script>
<script type="text/javascript">
	document.addEventListener("DOMContentLoaded", function(event) {
		// Initial render
		var stitch = new HitomezashiStitch(
			[0,1,1,0,1,0],
			[0,1,1,0,1,0],
			"#000000",
			"#ffffff"
		)
		stitch.render()

		// Advanced usage

		// Setting horizontal hash
		stitch.setHHash([1,1,0,0,0,1])
		// Setting vertical hash (randomly)
		stitch.setVHash(new Array(10).fill(1).map(x => (Math.random() >= .5) ? 1 : 0)) 

		// Set background color
		stitch.setBColor("#000000")
		// Set line color (randomly)
		stitch.setSColor("#"+Math.floor(Math.random()*16777215).toString(16))

		// Set how dense lines will be, defaults to 10
		stitch.setDensity(12)
		// Set how thick lines will be, defaults to 1px
		stitch.setSWidth("2px")
		// Set line opacity, defaults to 100%
		stitch.setSOpacity("150%")

		// Don't forget to call render() at the end to re-render the pattern
		stitch.render()

	});
</script>
```

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

## License
[MIT](https://choosealicense.com/licenses/mit/)