open-index/open-npm huggingface dataset:
npm package: @hiroyone/number-formatter
Description: NPM Mocule Sample
Author: hiroyone
Latest version: 0.0.1

Number Formatter
=========

A small library that adds commas to numbers

## Installation

  `npm install @hiroyone/number-formatter`

## Usage

    var numFormatter = require('@hiroyone/number-formatter');

    var formattedNum = numFormatter(35666);
  
  
  Output should be `35,666`


## Tests

  `npm test`

## Contributing

In lieu of a formal style guide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality. Lint and test your code.
npm package: @hiroyoshi-mori/bulma-inverted
Description: Dark theme, color inverted, for Bulma, the modern CSS framework.
Author: Hiroyoshi Mori
Latest version: 0.1.2

# Bulma Color Inverted Theme

[Bulma](https://bulma.io) is a **modarn CSS framework** based on [Flexbox](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes).
And this is dark theme with it.

And this theme makes colors in derived variables inverted, so you may not be able to use it with Bulma itself.

<a href="https://bulma.io"><img src="https://raw.githubusercontent.com/jgthms/bulma/master/docs/images/bulma-banner.png" alt="Bulma: a Flexbox CSS framework" style="max-width:100%;" width="600"></a>

## Quick Install

### Download

```shell
npm install @hiroyoshi-mori/bulma-inverted
```

### Import

After installation, you can import the CSS file into your project using this snippet:

```css
@import '@hiroyoshi-mori/bulma-inverted/css/bulma-inverted.css'
```

Feel free to raise an issue or submit a pull request.

## Documentation

The most documentation reside in the [Bulma online documentation here](https://bulma.io/documentation/overview/start/).

## Copyright and license ![Github](https://img.shields.io/github/license/jgthms/bulma?logo=Github)

Code copyright 2023 Hiroyoshi Mori. Code released under  [the MIT license](https://github.com/jgthms/bulma/blob/master/LICENSE).
npm package: @hiroyoshi-mori/storybook-css-framework-switcher
Description: Easy switcher it switches CSS Framework used in preview
Author: Hiroyoshi Mori
Latest version: 0.0.9

# Storybook Addon CSS Framework Switcher
Easy switcher it switches CSS Framework used in preview and add environment variable CSS_FRAMEWORK which can be
used to identify which css framework is used now
![Github](https://img.shields.io/github/v/release/HiroyoshiMori/storybook-css-framework-switcher)


## Installation

First, install the package.

```sh
npm install --save-dev @hiroyoshi-mori/storybook-css-framework-switcher
```

Then, register it as an addon in `.storybook/main.js`.

```js
// .storybook/main.ts

// Replace your-framework with the framework you are using (e.g., react-webpack5, vue3-vite)
import type { StorybookConfig } from '@storybook/your-framework';

const config: StorybookConfig = {
  // ...rest of config
  addons: [
    '@storybook/addon-essentials',
    '@hiroyoshi-mori/storybook-css-framework-switcher', // 👈 register the addon here
  ],
  staticDirs: [
    { from: '../node_modules/cirrus-ui/dist/', to: '/assets/cirrus-ui'}, // 👈 Copy files from css framework dist directories to /assets
    { from: '../node_modules/bulma/css/', to: '/assets/bulma'},
  ],
};

export default config;
```

## Usage

The primary way to use this addon is to define the `exampleParameter` parameter. You can do this the
component level, as below, to affect all stories in the file, or you can do it for a single story.

```typescript
const preview: Preview = {
  parameters: {
    cssFrameworkSwitcher: {
      frameworks: [
        { id: 'Cirrus', srcPath: '/assets/cirrus-ui/cirrus-all.css' },  // 👈 Set ID and css path to load
        { id: 'Bulma', srcPath: '/assets/bulma/bulma.css' },
      ],
    },
  },
};
```

## Copyright and license ![Github](https://img.shields.io/github/license/HiroyoshiMori/storybook-css-framework-switcher?logo=Github)

Copyright 2024 Hiroyoshi Mori / Script Laboratory.
npm package: @hirurgo/react-native-canvas
Description: <div align="center"> <img src="https://emojipedia-us.s3.amazonaws.com/thumbs/240/apple/96/fireworks_1f386.png"/> <h1>react-native-canvas</h1> </div>
Latest version: 0.1.26

<div align="center">
<img src="https://emojipedia-us.s3.amazonaws.com/thumbs/240/apple/96/fireworks_1f386.png"/>
<h1>react-native-canvas</h1>
</div>

A Canvas component for React Native

```bash
npm install react-native-canvas
```

### Usage

```JSX
import React, { Component } from 'react';
import Canvas from 'react-native-canvas';

class App extends Component {

  handleCanvas = (canvas) => {
    const ctx = canvas.getContext('2d');
    ctx.fillStyle = 'purple';
    ctx.fillRect(0, 0, 100, 100);
  }

  render() {
    return (
      <Canvas ref={this.handleCanvas}/>
    )
  }
}
```

### API

#### Canvas

###### Canvas#height

Reflects the height of the canvas in pixels

###### Canvas#width

Reflects the width of the canvas in pixels

###### Canvas#getContext()

Returns a canvas rendering context. Currently only supports 2d context.

###### Canvas#toDataURL()

Returns a `Promise` that resolves to DataURL.

#### CanvasRenderingContext2D

Standard CanvasRenderingContext2D. [MDN](https://developer.mozilla.org/en/docs/Web/API/CanvasRenderingContext2D). Only difference is `await` should be used to retrieve values from methods.

```javascript
const ctx = canvas.getContext('2d');
```

#### Image

WebView Image constructor. Unlike in the browsers accepts canvas as first argument. [MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/Image)

```javascript
const image = new Image(canvas, height, width);
```
npm package: @hirurgo/react-native-tcp
Description: node's net API for react-native
Author: Andy Prock
Latest version: 3.3.0

# TCP in React Native

node's [net](https://nodejs.org/api/net.html) API in React Native

This module is used by [Peel](http://www.peel.com/)

## Install

* Create a new react-native project. [Check react-native getting started](http://facebook.github.io/react-native/docs/getting-started.html#content)

* In your project dir:

```
npm install react-native-tcp --save
```

__Note for iOS:__ If your react-native version < 0.40 install with this tag instead:
```
npm install react-native-tcp@3.1.0 --save
```

## Link in the native dependency

```
react-native link react-native-tcp
```

## Additional dependencies

### Due to limitations in the react-native packager, streams need to be hacked in with [rn-nodeify](https://www.npmjs.com/package/rn-nodeify)

1. install rn-nodeify as a dev-dependency
``` npm install --save-dev rn-nodeify ```
2. run rn-nodeify manually
``` rn-nodeify --install stream,process,util --hack ```
3. optionally you can add this as a postinstall script
``` "postinstall": "rn-nodeify --install stream,process,util --hack" ```

## Usage

### package.json

_only if you want to write require('net') in your javascript_

```json
{
  "browser": {
    "net": "react-native-tcp"
  }
}
```

### JS

_see/run [index.ios.js/index.android.js](examples/rctsockets) for a complete example, but basically it's just like net_

```js
var net = require('net');
// OR, if not shimming via package.json "browser" field:
// var net = require('react-native-tcp')

var server = net.createServer(function(socket) {
  socket.write('excellent!');
}).listen(12345);

var client = net.createConnection(12345);

client.on('error', function(error) {
  console.log(error)
});

client.on('data', function(data) {
  console.log('message was received', data)
});
```

### TODO

add select tests from node's tests for net

PR's welcome!



_originally forked from [react-native-udp](https://github.com/tradle/react-native-udp)_