React NLP Annotate

If you just want to edit NLP data, it's easier to just use the Universal Data Tool (MIT). This library is a module of the Universal Data Tool for use in custom react applications.

Interface for doing various NLP tasks. Here's a code playground. Please help this repository by adding documentation and issues!

• Audio transcription
• Text Labeling (Entity, Classification)
• Entity Relation Labeling

Installation

npm install react-nlp-annotate

Usage

Document Classification

import NLPAnnotator from "react-nlp-annotate"

const MyComponent = () => (
  <NLPAnnotator
    type="label-document"
    labels={[
      {
        "id": "gryffindor",
        "displayName": "Gryffindor",
        "description": "Daring, strong nerve and chivalry."
      },
      {
        "id": "slytherin",
        "displayName": "Slytherin",
        "description": "Cunning and ambitious. Possibly dark wizard."
      }
    ]}
    multipleLabels={false}
    document="Harry"
    onChange={(classification) => {
      console.log("Harry is a " + classification)
    }}
  />
)

Entity Relation Labeling

import React from "react";
import NLPAnnotator from "react-nlp-annotate";

const labels = [
  {
    id: "gryffindor",
    displayName: "Gryffindor",
    description: "Daring, strong nerve and chivalry."
  },
  {
    id: "slytherin",
    displayName: "Slytherin",
    description: "Cunning and ambitious. Possibly dark wizard."
  }
];

export default () => (
    <NLPAnnotator
      hotkeysEnabled
      type="label-relationships"
      labels={labels}
      multipleLabels={false}
      document="Harry was an honest to god good man"
      onChange={(output) => {
        console.log("Output is...", output);
      }}
      // this is just for label-relationships
      entityLabels={labels}
      relationshipLabels={labels}
    />
  </div>
);