open-index/open-npm huggingface dataset:
npm package: @phemium-costaisa/phemium-web-components
Description: Phemium Web Components Library build with Stencil One
Latest version: 1.2.27

# Phemium Web Components

<!-- TOC depthFrom:2 -->

- [Introduction](#introduction)
- [Installation](#installation)
  - [AngularJS (1.x)](#angularjs-1x)
  - [Angular 2+](#angular-2)
  - [React](#react)
  - [Vue](#vue)
- [Contribute](#contribute)

<!-- /TOC -->

## Introduction

The Phemium Web Components are web utilities to accelerate the integrations of some Phemium parts in web technologies projects.

Here you can find the list of the current available components:

- [Phemium Card](./src/components/phemium-card/README.md)
- [Phemium Push](./src/components/phemium-push/README.md)

## Installation

The first step to use the Phemium Web Components is to download the dependency. Using _npm_ you must execute:

```bash
 npm i @phemium-costaisa/phemium-web-components
```

Depending on the JS framework you're using, you'll need to follow the proper steps. These are the Frameworks now supported:

- AngularJS
- Angular 2+
- React
- Vue

### AngularJS (1.x)

First of all you need to copy all the content from node_modules/@phemium-costaisa/phemium-web-components/dist into to somewhere else inside your project (e.g. your-app/phemium-web-components).

Once you have all the compiled files inside your project you will need to add the following line inside HEAD tag of your index.html:

```html
<script src="phemium-web-components/phemium-web-components.js"></script>
```

### Angular 2+

- Import the loader somewhere in your project (e.g. `main.ts`):

  ```typescript
  import { defineCustomElements as phemiumLoader } from "@phemium-costaisa/phemium-web-components/loader";
  ```

- In the same file, you must add this line to initialize the loader:

  ```typescript
  phemiumLoader(window);
  ```

- In your page modules definition you'll need to add _CUSTOM_ELEMENTS_SCHEMA_ to your available schemas (e.g. `app.module.ts`):

  ```typescript
  import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';

  // Other imports and declarations

  @NgModule({
    declarations: [AppComponent],
    providers: [
      StatusBar,
      SplashScreen,
      { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
      { provide: RouteReuseStrategy, useClass: IonicRouteStrategy },
      Push,
    ],
    bootstrap: [AppComponent]
    bootstrap: [AppComponent],
    schemas: [CUSTOM_ELEMENTS_SCHEMA] // <-- Add Here!
  })
  ```

### React

On your index.js:

```javascript
import { defineCustomElements as phemiumLoader } from "@phemium-costaisa/phemium-web-components/loader";
phemiumLoader(window);
```

### Vue

```javascript
import { defineCustomElements as phemiumLoader } from "@phemium-costaisa/phemium-web-components/loader";
Vue.config.ignoredElements = [/test-\w*/];
phemiumLoader(window);
```

## Contribute

```bash
git clone https://gitlab.phemium.com/phemium/phemium-web-components
cd phemium-web-components
```

and run:

```bash
npm install
npm start
```

To build the component for production, run:

```bash
npm run build
```
npm package: @phen0menon/html-to-draftjs
Description: A library for converting plain HTML to DraftJS Editor content. Build for use with **[react-draft-wysiwyg](https://github.com/jpuri/react-draft-wysiwyg)**.
Author: phen0menon
Latest version: 1.5.3

# HTML To DraftJS

A library for converting plain HTML to DraftJS Editor content.
Build for use with **[react-draft-wysiwyg](https://github.com/jpuri/react-draft-wysiwyg)**.

## Installation

```
npm install html-to-draftjs --save
```

## Usage

```
import { EditorState, ContentState } from 'draft-js';
import htmlToDraft from 'html-to-draftjs';

const blocksFromHtml = htmlToDraft(this.props.content);
const { contentBlocks, entityMap } = blocksFromHtml;
const contentState = ContentState.createFromBlockArray(contentBlocks, entityMap);
const editorState = EditorState.createWithContent(contentState);
```

### (optional) customChunkRenderer
Use to define additional html nodes. Only supports atomic blocks.

* _nodeName: string_ - the name of the node, in lowercase
* _node: HTMLElement_ - the parsed node itself

This renderer function is executed before any other html to draft conversion.
Return nothing (or something falsy) to continue with the normal translation.

Example:

```
htmlToDraft('<hr/>', (nodeName, node) => {
  if (nodeName === 'hr') {
    return {
      type: 'HORIZONTAL_RULE',
      mutability: 'MUTABLE',
      data: {}
    };
  }
})
```


**Take Care:** Plz not use version `1.2.0` it has build issues.
npm package: @phen0menon/react-draft-wysiwyg
Description: A wysiwyg on top of DraftJS.
Author: phen0menon
Latest version: 1.14.13

# React Draft Wysiwyg

A Wysiwyg editor built using ReactJS and DraftJS libraries.
[Demo Page](https://jpuri.github.io/react-draft-wysiwyg).

[![Build Status](https://travis-ci.org/jpuri/react-draft-wysiwyg.svg?branch=master)](https://travis-ci.org/jpuri/react-draft-wysiwyg)

![](http://i.imgur.com/tU7kJ6i.gif)

## Features

- Configurable toolbar with option to add/remove controls.
- Option to change the order of the controls in the toolbar.
- Option to add custom controls to the toolbar.
- Option to change styles and icons in the toolbar.
- Option to show toolbar only when editor is focused.
- Support for inline styles: Bold, Italic, Underline, StrikeThrough, Code, Subscript, Superscript.
- Support for block types: Paragraph, H1 - H6, Blockquote, Code.
- Support for setting font-size and font-family.
- Support for ordered / unordered lists and indenting.
- Support for text-alignment.
- Support for coloring text or background.
- Support for adding / editing links
- Choice of more than 150 emojis.
- Support for mentions.
- Support for hashtags.
- Support for adding / uploading images.
- Support for aligning images, setting height, width.
- Support for Embedded links, flexibility to set height and width.
- Option provided to remove added styling.
- Option of undo and redo.
- Configurable behavior for RTL and Spellcheck.
- Support for placeholder.
- Support for WAI-ARIA Support attributes
- Using editor as controlled or un-controlled React component.
- Support to convert Editor Content to HTML, JSON, Markdown.
- Support to convert the HTML generated by the editor back to editor content.
- Support for internationalization.

## Installing

The package can be installed from npm `react-draft-wysiwyg`

```
$ npm install --save react-draft-wysiwyg draft-js
```

## Getting started

Editor can be used as simple React Component:

```js
import { Editor } from "react-draft-wysiwyg";
import "react-draft-wysiwyg/dist/react-draft-wysiwyg.css";
<Editor
  editorState={editorState}
  toolbarClassName="toolbarClassName"
  wrapperClassName="wrapperClassName"
  editorClassName="editorClassName"
  onEditorStateChange={this.onEditorStateChange}
/>;
```

## Docs

For more documentation check [here](https://jpuri.github.io/react-draft-wysiwyg/#/docs?_k=jjqinp).

## Questions Discussions

For discussions join public channel #rd_wysiwyg in [DraftJS Slack Organization](https://draftjs.herokuapp.com/).

## Fund

You can fund project at [Patreon](https://www.patreon.com/jyotipuri).

## Thanks

Original motivation and sponsorship for this work came from [iPaoo](http://www.ipaoo.com/). I am thankful to them for allowing the Editor to be open-sourced.

## License

MIT.
npm package: @phen0menon/react-spreadsheet
Description: Simple, customizable yet performant spreadsheet for React
Author: phen0menon. The original author is Iddan Aaronsohn
Latest version: 0.6.9

<div align="center">
  <img src="https://raw.githubusercontent.com/iddan/react-spreadsheet/master/assets/logo.svg?sanitize=true" height="120">
</div>

# React Spreadsheet

## Credits

The original repository is https://iddan.github.io/react-spreadsheet

## License

[![FOSSA Status](https://app.fossa.io/api/projects/git%2Bgithub.com%2Fiddan%2Freact-spreadsheet.svg?type=large)](https://app.fossa.io/projects/git%2Bgithub.com%2Fiddan%2Freact-spreadsheet?ref=badge_large)