Hello world

Here is a very simple example.

Select text and hit "Enter" to create a new annotation.
Right click on an annotation to view its contextual menu.

() => {
  const sampleText = 'Hello world'
  const [annotations, setAnnotations] = React.useState([
    {
      key: 'sample_label',
      name: 'Sample label',
      values: [{ start: 0, end: 5 }],
    },
  ])
  return (
    <Annotator
      text={sampleText}
      annotations={annotations}
      relations={[]}
      onChangeAnnotations={setAnnotations}
    />
  )
}

() => {
  const sampleText = 'Hello world'
  const [annotations, setAnnotations] = React.useState([
    {
      key: 'sample_label',
      name: 'Sample label',
      values: [{ start: 0, end: 5 }],
    },
  ])
  return (
    <Annotator
      text={sampleText}
      annotations={annotations}
      relations={[]}
      onChangeAnnotations={setAnnotations}
    />
  )
}