open-index/open-npm huggingface dataset:
npm package: @sascha245/element-angular
Description: element ui for angular
Author: Sascha Braun
Latest version: 0.8.2


<div align="center">
<img src="https://camo.githubusercontent.com/462f24153b8e8739c8ea71f7102585c4cb0e1575/68747470733a2f2f63646e2e7261776769742e636f6d2f456c656d6546452f656c656d656e742f6465762f656c656d656e745f6c6f676f2e737667" width="250" height="100" align="center">
<img src="https://angular.cn/assets/images/logos/angular/angular.svg" width="90" height="90" align="center">
</div>

<h2 align="center"> Element for Angular </h2>

[![npm version](https://badge.fury.io/js/element-angular.svg)](https://badge.fury.io/js/element-angular)
[![npm](https://img.shields.io/npm/dt/element-angular.svg)](http://npm-stat.com/charts.html?package=v2ex-cli)
[![Join the chat at https://gitter.im/element-angular/Lobby](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/element-angular/Lobby?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)

*Forked from https://github.com/ElemeFE/element-angular*

## Catalog

-  [Documentation](#documentation)
-  [Getting Started](#getting-started)
-  [Contribution](#contribution)
-  [Support](#support)
-  [LICENSE](#license)


## Documentation

[element-angular](https://element-angular.faas.ele.me)


## Getting Started
1. Install:
```bash
# install
npm i --save element-angular
```
2. Usage:
```typescript
// improt module
import { ElModule } from 'element-angular'

// import styles
// if you use webpack, in app.module.ts:
import 'element-angular/theme/index.css'

// or anglar-cli, in /angular-cli.json:
{
  "app": [{
    "styles": [
      "../node_modules/element-angular/theme/index.css"
    ],
    // other configurations...
  }]
}

// or other, in /src/styles.css:
@import "~element-angular/theme/index.css"

```

More: [Doc](https://element-angular.faas.ele.me)



## Contribution

- [Contribution Guide](https://github.com/eleme/element-angular/blob/master/.github/CONTRIBUTING.en-US.md)

- [贡献指南](https://github.com/eleme/element-angular/blob/master/.github/CONTRIBUTING.zh-CN.md)



## Support

Modern browsers and Internet Explorer 9+.


## LICENSE

**MIT**
npm package: @saschazar/unicat-icons
Description: An SVG collection for React, React Native and react-sketchapp
Author: Sascha Zarhuber
Latest version: 0.1.0

[![Build Status](https://travis-ci.org/saschazar21/unicat-icons.svg?branch=master)](https://travis-ci.org/saschazar21/unicat-icons)
# :unicorn: :cat2: Unicat icons

> a collection of `.svg` icons for [React](https://reactjs.org/), [React Native](https://facebook.github.io/react-native/) and [react-sketchapp](http://airbnb.io/react-sketchapp/) with **TypeScript** support.

## Prerequisites

* [React](https://www.npmjs.com/package/react) v16.9 and up, or
* [React Native](https://www.npmjs.com/package/react-native) v0.61.1 and up, or
* [react-sketchapp](https://www.npmjs.com/package/react-sketchapp) v3.0.0-beta.9 and up
* optionally a working [TypeScript](https://www.npmjs.com/package/typescript) setup

(of course a [Next.js](https://nextjs.org) also works, when using React for the web)

## Install

`npm install @saschazar/unicat-icons` or `yarn add @saschazar/unicat-icons` respectively.

## Usage

### React (default)

```jsx
import { KeyIcon } from '@saschazar/unicat-icons';

export default function () {
  return <h1>A Headline with a key icon <KeyIcon /></h1>;
}
```

### React Native

```jsx
import { Text, View } from 'react-native';
import { KeyIcon } from '@saschazar/unicat-icons/native';

export default function () {
  return (
    <View>
      <Text>A Text with a key icon <KeyIcon /></Text>
    </View>
  );
}
```

### react-sketchapp

```jsx
import { Artboard, Text } from 'react-sketchapp';
import { KeyIcon } from '@saschazar/unicat-icons/sketchapp';

export default function () {
  return (
    <Artboard>
      <Text>A Text with a key icon <KeyIcon /></Text>
    </Artboard>
  );
}
```

## License

MIT
npm package: @saschazar/wasm-exif
Description: An EXIF reader using WebAssembly
Author: Sascha Zarhuber
Latest version: 3.0.0

[![npm](https://img.shields.io/npm/v/@saschazar/wasm-exif)](https://npmjs.org/package/@saschazar/wasm-exif)

# 📦 WebAssembly EXIF reader

> A dependency-free EXIF reader written in WebAssembly

It just needs valid JPEG/TIFF data in a `Uint8Array` to output EXIF information, if any is included in the source file.

## Installation

```bash
yarn add @saschazar/wasm-exif
```

or

```bash
npm install --save @saschazar/wasm-exif
```

## Usage

It supports usage in the browser, in a [Web Worker](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API) and of course Node.js.

```javascript
// Node.js
import wasm_exif from '@saschazar/wasm-exif';

// Web Worker - see: https://developer.mozilla.org/en-US/docs/Web/API/WorkerGlobalScope/importScripts
importScripts('wasm_exif.js');

// -------- Browser/Web Worker/Node.js code below --------

// Load an image into a buffer using the Fetch API
const buffer = fetch('some JPEG with EXIF data').then((res) => res.buffer());

// Initialize the WebAssembly Module
const exifModule = wasm_exif({
  onRuntimeInitialized() {
    // Let the Fetch Promise fulfill
    buffer()
      .then((result) => new Uint8Array(result)) // Convert to a Uint8Array
      .then((array) => exifModule.exif(array, array.length)) // Read EXIF
      .then(console.log); // Print result to console.log
  },
});
```

## Credits

This package uses [mayanklahiri/easyexif](https://github.com/mayanklahiri/easyexif)'s source code and lots of the emscripten setup code was copied from [tuananh/easyexif](https://github.com/tuananh/easy-exif).

## License

Licensed under the MIT license.

Copyright ©️ 2020—2021 [Sascha Zarhuber](https://sascha.work)
npm package: @saschazar/wasm-heif
Description: A WebAssembly powered HEIF/HEIC decoder
Author: Sascha Zarhuber
Latest version: 2.0.0

[![npm](https://img.shields.io/npm/v/@saschazar/wasm-heif)](https://npmjs.org/package/@saschazar/wasm-heif)

# 📦 WebAssembly HEIF decoder

> A dependency-free HEIF decoder written in WebAssembly

It decodes HEIF-encoded image data in a `Uint8Array` containing raw RGB pixels.

## Installation

```bash
yarn add @saschazar/wasm-heif
```

or

```bash
npm install --save @saschazar/wasm-heif
```

## Usage

It supports usage in the browser, in a [Web Worker](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API) and of course Node.js.

```javascript
// Node.js
import wasm_heif from '@saschazar/wasm-heif';

// Web Worker - see: https://developer.mozilla.org/en-US/docs/Web/API/WorkerGlobalScope/importScripts
importScripts('wasm_heif.js');

// -------- Browser/Web Worker/Node.js code below --------

// Load encoded HEIF image data in Uint8Array
const array = new Uint8Array(['some', 'encoded', 'heif', 'image', 'data']);
let result;

// Initialize the WebAssembly Module
const heifModule = wasm_heif({
  onRuntimeInitialized() {
    const alpha = false; // RGBA somehow not yet working ¯\_(ツ)_/¯
    result = heifModule.decode(array, array.length, alpha); // decode image data and return a new Uint8Array
    heifModule.free(); // clean up memory after encoding is done
  },
});
```

### ⚠️ Support

Although [libheif](https://github.com/strukturag/libheif) provides support for decoding HEIF images into an RGBA buffer, none of the respective tests has succeeded yet. Therefore, it is crucial to compare the `channels` property of the object returned from the `dimensions()` function, when `alpha` was set to true in the `decode()` function.

Not all HEIF/HEIC-encoded images seem to be supported, as there have occurred failures while attempting to decode sample images from the [nokiatech/heif](https://github.com/nokiatech/heif/tree/gh-pages/content/images) repository.

However, images encoded on [Cloudinary](https://cloudinary.com) and/or fetched as HEIF/HEIC using the [`fetch_format`](https://cloudinary.com/documentation/image_transformation_reference#fetch_format_parameter) parameter seem to work well.

## Status

The main backbone of the project is the [libheif](https://github.com/strukturag/libheif) library.

Currently only HEIF decoding using [libde265](https://github.com/strukturag/libde265) is enabled.

### Help needed

Concerning the encoding functionality, a few trials have been made towards using the [x265](https://github.com/videolan/x265) encoder, but as of now, there doesn't seem to be a possibility for compiling it in an Emscripten-compatible way.

## Credits

This module uses the [strukturag/libheif](https://github.com/strukturag/libheif)'s source code and most of the code is written according to the examples provided in that repository.

## License

Licensed under the MIT license.

Copyright ©️ 2020—2021 [Sascha Zarhuber](https://sascha.work)
npm package: @saschazar/wasm-image-loader
Description: Loads and resizes images using WebAssembly
Author: Sascha Zarhuber
Latest version: 4.0.0

[![npm](https://img.shields.io/npm/v/@saschazar/wasm-image-loader)](https://npmjs.org/package/@saschazar/wasm-image-loader)

# 📦 WebAssembly image loader/resizer

> A dependency-free image loader/resizer written in WebAssembly

It works primarily as JPEG/PNG decoder, but might as well load 'raw' images from a `Uint8Array` to resize them to a desired width/height.

## Installation

```bash
yarn add @saschazar/wasm-image-loader
```

or

```bash
npm install --save @saschazar/wasm-image-loader
```

## Usage

It supports usage in the browser, in a [Web Worker](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API) and of course Node.js.

```javascript
// Node.js
import wasm_image_loader from '@saschazar/wasm-image-loader';

// Web Worker - see: https://developer.mozilla.org/en-US/docs/Web/API/WorkerGlobalScope/importScripts
importScripts('wasm_image_loader.js');

// -------- Browser/Web Worker/Node.js code below --------

// Load an image into a buffer using the Fetch API
const buffer = fetch('some JPEG or PNG').then((res) => res.buffer());

// Initialize the WebAssembly Module
const imageLoaderModule = new Promise((resolve) => {
  const wasm = wasm_image_loader({
    onRuntimeInitialized() {
      // remove the 'then' property from wasm_image_loader,
      // otherwise Promise runs into an endless loop.
      const { then, ...other } = wasm;
      // let Promise resolve with 'other' properties.
      resolve(other);
    },
  });
});

async function loadImage() {
  // store image buffer in Uint8Array
  const array = new Uint8Array(await buffer());
  const channels = 3; // 3 if RGB, 4 if Alpha channel is present (e.g. PNG)

  // let imageLoaderModule Promise resolve
  const { decode, dimensions, free, resize } = await imageLoaderModule;

  const decoded = decode(array, array.length, channels);
  const { channels, height, width } = dimensions();
  const resized = resize(decoded, width, height, channels, 800, 600);
  console.log(resized); // logs the uncompressed 800x600 RGB Uint8Array

  // clean up memory, when loader is not needed anymore
  free();
}
```

### Example

A working example is available on [RunKit](https://runkit.com/saschazar21/5e8746e3c924510013db78f4).

## Credits

This package uses [nothings/stb](https://github.com/nothings/stb)'s source code (`stb_image.h` and `stb_image_resize.h` in particular).

## License

Licensed under the MIT license.

Copyright ©️ 2020—2021 [Sascha Zarhuber](https://sascha.work)
npm package: @saschazar/wasm-mean-color
Description: Calculates the mean color of an image
Author: Sascha Zarhuber
Latest version: 3.0.0

[![npm](https://img.shields.io/npm/v/@saschazar/wasm-mean-color)](https://npmjs.org/package/@saschazar/wasm-mean-color)

# 📦 WebAssembly mean-color calculator

> A dependency-free mean-color calculator written in WebAssembly

It calculates the mean color from raw RGB/A image data in a `Uint8Array` and returns a hex string.

## Installation

```bash
yarn add @saschazar/wasm-mean-color
```

or

```bash
npm install --save @saschazar/wasm-mean-color
```

## Usage

It supports usage in the browser, in a [Web Worker](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API) and of course Node.js.

```javascript
// Node.js
import wasm_mean_color from '@saschazar/wasm-mean-color';

// Web Worker - see: https://developer.mozilla.org/en-US/docs/Web/API/WorkerGlobalScope/importScripts
importScripts('wasm_mean_color.js');

// -------- Browser/Web Worker/Node.js code below --------

// Load raw RGB/A image data in Uint8Array (e.g. consistently chained [R][G][B] data)
const array = new Uint8Array(['some', 'raw', 'RGB', 'image', 'data']);

// Initialize the WebAssembly Module
const meanColorModule = wasm_mean_color({
  onRuntimeInitialized() {
    const channels = 3; // 3 if image has 3 color channels (RGB), 4 if image has an additional alpha channel (RGBA)
    console.log(meanColorModule.getColor(array, array.length, channels)); // returns e.g. '#FAFAFA'
  },
});
```

### Example

A working example is available on [RunKit](https://runkit.com/saschazar21/5e87484d3237810013d4ee6c).

## License

Licensed under the MIT license.

Copyright ©️ 2020—2021 [Sascha Zarhuber](https://sascha.work)
npm package: @saschazar/wasm-mozjpeg
Description: A MozJPEG encoder in WebAssembly
Author: Sascha Zarhuber
Latest version: 3.0.0

[![npm](https://img.shields.io/npm/v/@saschazar/wasm-mozjpeg)](https://npmjs.org/package/@saschazar/wasm-mozjpeg)

# 📦 WebAssembly MozJPEG encoder

> A dependency-free MozJPEG encoder written in WebAssembly

It encodes raw RGB(A) image data in a `Uint8Array` into the JPEG format.

## Installation

```bash
yarn add @saschazar/wasm-mozjpeg
```

or

```bash
npm install --save @saschazar/wasm-mozjpeg
```

## Usage

It supports usage in the browser, in a [Web Worker](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API) and of course Node.js.

```javascript
// Node.js
import wasm_mozjpeg from '@saschazar/wasm-mozjpeg';
import defaultOptions from '@saschazar/wasm-mozjpeg/options';

// Web Worker - see: https://developer.mozilla.org/en-US/docs/Web/API/WorkerGlobalScope/importScripts
importScripts('wasm_mozjpeg.js');

// -------- Browser/Web Worker/Node.js code below --------

// Load raw RGB image data in Uint8Array (e.g. consistently chained [R][G][B] data)
const array = new Uint8Array(['some', 'raw', 'RGB', 'image', 'data']);
const channels = 3; // 3 for RGB, 4 for RGBA (must adapt options.in_color_space!)
const width = 800; // the image's width
const height = 600; // the image's height
const options = defaultOptions; // MozJPEG's options, complete object crucially needed!
options.in_color_space = 6; // 6 for RGB, 12 for RGBA, see J_COLOR_SPACE in wasm_mozjpeg.d.ts
let result;

// Initialize the WebAssembly Module
const mozjpegModule = wasm_mozjpeg({
  onRuntimeInitialized() {
    result = mozjpegModule.encode(array, width, height, channels, options); // encode image data and return a new Uint8Array
    mozjpegModule.free(); // clean up memory after encoding is done
  },
});
```

### Example

A working example is available on [RunKit](https://runkit.com/saschazar21/5e8746e3c924510013db78f4).

### Options

⚠️ It's crucial to provide a full options object. The default options object may be imported from the `options.js` file.

Also take a close look at the `in_color_space` property, if an image Buffer containing an alpha channel is provided! (e.g. RGBA data from `<canvas />`). The `J_COLOR_SPACE` enum in `wasm_mozjpeg.d.ts` contains all the valid numeric values for the respective `in_color_space` and `out_color_space` properties.

## Credits

This module uses the [mozilla/mozjpeg](https://github.com/mozilla/mozjpeg)'s source code and most of the code is written according to the examples provided in that repository.

## License

Licensed under the MIT license.

Copyright ©️ 2020—2021 [Sascha Zarhuber](https://sascha.work)
npm package: @saschazar/wasm-webp
Description: Encodes and decodes WebP images using WebAssembly
Author: Sascha Zarhuber
Latest version: 3.0.1

[![npm](https://img.shields.io/npm/v/@saschazar/wasm-webp)](https://npmjs.org/package/@saschazar/wasm-webp)

# 📦 WebAssembly WebP decoder/encoder

> A dependency-free WebP decoder/encoder written in WebAssembly

It encodes raw RGB(A) image data in a `Uint8Array` into the WebP format and vice versa.

## Installation

```bash
yarn add @saschazar/wasm-webp
```

or

```bash
npm install --save @saschazar/wasm-webp
```

## Usage

It supports usage in the browser, in a [Web Worker](https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API) and of course Node.js.

```javascript
// Node.js
import wasm_webp from '@saschazar/wasm-webp';
import defaultOptions from '@saschazar/wasm-webp/options';

// Web Worker - see: https://developer.mozilla.org/en-US/docs/Web/API/WorkerGlobalScope/importScripts
importScripts('wasm_webp.js');

// -------- Browser/Web Worker/Node.js code below --------

// Decoding example:
// Load encoded WebP image data in Uint8Array
const array = new Uint8Array(['some', 'encoded', 'WebP', 'image', 'data']);
let result;

// Initialize the WebAssembly Module
const webpModule = wasm_webp({
  onRuntimeInitialized() {
    const alpha = true; // return RGBA Buffer, instead of RGB
    result = webpModule.encode(array, array.length, alpha); // decode image data and return a new Uint8Array
    webpModule.free(); // clean up memory after encoding is done
  },
});

// Encoding example:
// Load raw RGB image data in Uint8Array (e.g. consistently chained [R][G][B] data)
const array = new Uint8Array(['some', 'raw', 'RGB', 'image', 'data']);
const channels = 3; // 3 for RGB, 4 for RGBA
const width = 800; // the image's width
const height = 600; // the image's height
const options = defaultOptions; // WebP's options, a complete object is crucially needed!
let result;

// Initialize the WebAssembly Module
const webpModule = wasm_webp({
  onRuntimeInitialized() {
    result = webpModule.encode(array, width, height, channels, options); // encode image data and return a new Uint8Array
    webpModule.free(); // clean up memory after encoding is done
  },
});
```

### Example

A working example is available on [RunKit](https://runkit.com/saschazar21/5e8713b993ce6a00127b183b).

### Options

⚠️ It's crucial to provide a complete options object. The default options object may be imported from the `options.js` file.

## Credits

This module uses the [webmproject/libwebp](https://github.com/webmproject/libwebp)'s source code and most of the code is written according to the examples provided in that repository.

## License

Licensed under the MIT license.

Copyright ©️ 2020—2021 [Sascha Zarhuber](https://sascha.work)