open-index/open-npm huggingface dataset:
npm package: @haseeamarathunga/ng-image-viewer
Description: [![npm (scoped)](https://img.shields.io/npm/v/@bamblehorse/tiny.svg)](https://www.npmjs.com/package/@haseeamarathunga/ng-image-viewer) [![npm bundle size (minified)](https://img.shields.io/bundlephobia/min/@bamblehorse/tiny.svg)](https://www.npmjs.com/pac
Author: Hasitha Amarathunga
Latest version: 0.0.6

## @haseeamarathunga/ng-image-viewer

[![npm (scoped)](https://img.shields.io/npm/v/@bamblehorse/tiny.svg)](https://www.npmjs.com/package/@haseeamarathunga/ng-image-viewer)
[![npm bundle size (minified)](https://img.shields.io/bundlephobia/min/@bamblehorse/tiny.svg)](https://www.npmjs.com/package/@haseeamarathunga/ng-image-viewer)

Image Viewer with Following Features

## Features
* Image Zoom In
* Image Zoom Out
* Rotate Left
* Rotate Right
* Reset Position


## Prerequisites
You must install font-awesome library for load icons

### Runtime Dependencies
* Angular: `^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0`
* RxJs: `^5.0.0 || ^6.0.0`
* App must be served on a secure context (https or localhost)

## Usage
1) Install font-awesome library via standard npm command:

`npm install font-awesome --save`

2) Add it to style.css

```css
@import "~font-awesome/css/font-awesome.css";
```

3) Install ng-image-viewer library via standard npm command:

`npm install @haseeamarathunga/ng-image-viewer`

4) Import the `NgImageViewer` into your Angular module:

```typescript
import {NgImageViewerModule} from '@haseeamarathunga/ng-image-viewer.module';
@NgModule({
  imports: [
    NgImageViewerModule,
    ...
  ],
  ...
})
export class AppModule { }
```

3) Use the `NgImageViewer` on your pages:

In .html file

```html
 <ng-image-viewer [src]="images"
                  [width]="500"
                  [height]="400"
                  [(config)]="config"
                  (customImageEvent)="handleEvent($event)">
    </ng-image-viewer>

```

In .ts file

```typescript
  images = ['image-path.jpg'];

  config: ImageViewerConfig;

  handleEvent(event: CustomImageEvent) {
    console.log(`${event.name} has been click on img ${event.imageIndex + 1}`);

    switch (event.name) {
      case 'print':
        console.log('run print logic');
        break;
    }
  }
```
## Options and Events
This section describes the basic inputs/outputs of the component. All inputs are optional.
### Inputs

### Outputs

```typescript

```

## Development
Here you can find instructions on how to start developing this library.

### Build
Run `npm run packagr` to build the library. The build artifacts will be stored in the `dist/` directory.

### Start
Run `npm start` to build and run the surrounding webapp with the `NgImageViewerModule`. Essential for live-developing.

### Generate docs/
Run `npm run docs` to generate the live-demo documentation pages in the `docs/` directory.

### Running Unit Tests
Run `npm run test` to run unit-tests.
npm package: @haseebmernstack/clean-mongoose
Description: Utility to clean Mongoose documents (convert _id to id, remove __v, remove private fields). TypeScript-ready.
Author: Haseeb MernStack
Latest version: 0.1.0

# clean-mongoose

Tiny TypeScript utility to clean Mongoose documents and plain objects for safe API responses.

## Features

- Convert `_id` -> `id`
- Remove `__v`
- Optionally remove `password` fields and underscore-prefixed fields
- Works with arrays, nested objects, populated docs
- Zero dependencies, TypeScript types included

## Install

```bash
npm install @haseeb/clean-mongoose
# or
yarn add @haseeb/clean-mongoose
```
npm package: @haseebmernstack/react-axios-helper
Description: A simple React + Axios hook to simplify API requests in Vite or React apps.
Author: Haseeb MernStack
Latest version: 1.0.0

# 🚀 react-axios-helper

A lightweight React hook for making API requests using Axios — built for Vite + React developers.

## 💡 Features
- Easy `useAxios()` hook
- Auto-handles loading & error states
- Built-in refetch support
- Works out of the box with Vite & TypeScript

## ⚙️ Installation
```bash
npm install react-axios-helper
npm package: @hasenkrug/react-native-chessboard-adapted
Description: A lightweight, simple, and high-performing chessboard for React Native
Author: Enzo Manuel Mangano
Latest version: 0.1.7

This package is a fork of the [react-native-chessboard](https://github.com/enzomanuelmangano/react-native-chessboard) by [Enzo Mangano](https://github.com/enzomanuelmangano).

Extended by the `rotated?: boolean` Propertie.

---

### `rotated?: boolean`

If the game board is rotated 180 degrees via `transform: [{ rotate: "180deg" }]`, this setting will also rotate the gesture control animation.

Default: `false`
npm package: @hash-bang/license-exporter
Description: Export licenses used within a project to various formats
Author: Matt Carter
Latest version: 1.2.0

@hash-bang/license-exporter
===========================
Export licenses used within a project to various formats.

See this projects [LICENSES.md](./LICENSES.md) file for example `--template=detail` output.


```
Usage: license-exporter [directory/file...]

Options:
  -t, --template <path>  Select a template file to use, either locally or a
                         builtin (default: "simple")
  -o, --output <path>    Output to file (defaults to STDOUT)
  --json                 Output the JSON used in the template before compiling
                         - useful for debugging
  -v, --verbose          Be verbose
  -h, --help             display help for command
```
npm package: @hash-bang/pss
Description: Simple Linux process grep and kill
Author: Matt Carter
Latest version: 1.0.2

@hash-bang/PSS
==============
A nicer `pgrep` / `pkill`.

Features:

* Auto-sudo mode to enable all processes can be killed
* Globbing of process commands, PIDs and open ports are all supported
* `--zap` mode will politely try to kill a process (regular kill), wait then agressively kill (`-9`)
* Fancy colors to make reading the output easier


```
Usage: pss [-k | -z] [globs...]

Options:
  -a, --all            Show all processes not just this users
  -i, --interactive    Ask about all found processes
  -l, --list           Show all matching processes
  -f, --force          Force kill processes (implies --kill)
  -k, --kill           Attempt to kill found processes
  -n, --name           Match the name of the command only instead of args
  -p, --pid <pids...>  CSV of specific Process IDs to limit to (or specify
                       multiple times)
  -v, --verbose        Be verbose about what is happening
  -w, --wait <time>    Wait for a valid timestring before zapping (default:
                       "3s")
  -z, --zap            Try to politely kill a process then agressively (implies
                       --kill)
  --parent-pid <pid>   Specify the parent pid to use unless --no-skip-self
                       (internally used when sudo-ing)
  --no-case            Disable case insesitive searching
  --no-sudo            Do not try to elevate this process to sudo if possible
  --no-skip-self       Exclude the PSS process from the list
  --no-truncate        Do not truncate items so that only one listing appears
                       on a line
  --no-surround        Disable adding globstars at the start and end of search
                       strings
  --no-tree            Dont attempt to kill all sub-processes on --force /
                       --zap
  -h, --help           display help for command

Notes:
  * Globs can be any valid string, if the string is numeric and begins with `:` its assumed to be a port e.g. `:80` fetches the process listening on port 80
  * If --kill, --force, --zap and --list are omitted --list is assumed
  * --pid Can take a CSV of PIDs to filter by
```
npm package: @hashaio/react-contexify
Description: Add contextmenu to your react component with ease
Author: Fadi Khadra
Latest version: 5.0.0

<img width="645" alt="screenshot 2018-10-31 at 13 32 57" src="https://user-images.githubusercontent.com/5574267/47815610-1806fa00-dd51-11e8-981b-2f680244ae29.png">

![React-contexify CI](https://github.com/fkhadra/react-contexify/workflows/React-contexify%20CI/badge.svg) [![npm](https://img.shields.io/npm/dm/react-contexify.svg)]() [![npm](https://img.shields.io/npm/v/react-contexify.svg)]() [![license](https://img.shields.io/github/license/fkhadra/react-contexify.svg?maxAge=2592000)]()

<div style="text-align:center">

![contexify](https://user-images.githubusercontent.com/5574267/100552409-500dfd80-3287-11eb-96ee-fc1d17ef50b8.gif)

</div>


## Documentation

Go [here](https://fkhadra.github.io/react-contexify). 

## Installation

Using yarn

```sh
$ yarn add react-contexify
```

Using npm

```sh
$ npm install --save react-contexify
```

## The gist

```js
import React from 'react';
import { Menu, Item, Separator, Submenu, MenuProvider, useContextMenu } from 'react-contexify';
import 'react-contexify/dist/ReactContexify.css';

const MENU_ID = 'blahblah';

function App() {
  const { show } = useContextMenu({
    id: MENU_ID,
  });

  function handleContextMenu(event){
      event.preventDefault();
      show(event, {
        props: {
            key: 'value'
        }
      })
  }
  const handleItemClick = ({ event, props }) => console.log(event,props);

  return (
    <div>
    <p onContextMenu={handleContextMenu}>lorem ipsum blabladhasi blaghs blah</p>  
    <Menu id={MENU_ID}>
      <Item onClick={handleItemClick}>Item 1</Item>
      <Item onClick={handleItemClick}>Item 2</Item>
      <Separator />
      <Item disabled>Disabled</Item>
      <Separator />
      <Submenu label="Foobar">
        <Item onClick={handleItemClick}>Sub Item 1</Item>
        <Item onClick={handleItemClick}>Sub Item 2</Item>
      </Submenu>
    </Menu>
    </div>
  );
}
```

## Contribute

Any idea and suggestions are welcome. Please have a look at the contributing guide.

## License

React Contexify is licensed under MIT.