Skip to main content

interweave

Build Status npm version npm deps

Interweave is a robust React library that can...

  • Safely render HTML without using dangerouslySetInnerHTML.
  • Safely strip HTML tags.
  • Automatic XSS and injection protection.
  • Clean HTML attributes using filters.
  • Interpolate components using matchers.
  • Autolink URLs, IPs, emails, and hashtags.
  • Render Emoji and emoticon characters.
  • And much more!
<Interweave content="This string contains <b>HTML</b> and will safely be rendered!" />
<Interweave
    content="This contains a URL, https://github.com/milesj/interweave, and a hashtag, #interweave, that will be converted to an anchor link!"
    matchers={[new UrlMatcher('url'), new HashtagMatcher('hashtag')]}
/>

Requirements​

  • React 16.8+ / 17+
  • IE 11+
  • Emoji support: fetch, sessionStorage

Installation​

Interweave requires React as a peer dependency.

yarn add interweave react
// Or
npm install interweave react

Documentation​

https://interweave.dev

Index

Classes

Functions

Interfaces

Type aliases

Variables

Type aliases

AfterParseCallback

AfterParseCallback<T>: (content: Node[], props: T) => Node[]

Type parameters

  • T

AttributeValue

AttributeValue: boolean | number | object | string

Attributes

Attributes: Record<string, AttributeValue>

BeforeParseCallback

BeforeParseCallback<T>: (content: string, props: T) => string

Type parameters

  • T

ChildrenNode

ChildrenNode: Node[] | string

ConfigMap

ConfigMap: Record<string, Partial<NodeConfig>>

ElementAttributes

ElementAttributes: React.AllHTMLAttributes<unknown>

FilterMap

FilterMap: Record<string, number>

MatchCallback

MatchCallback<T>: (matches: string[]) => T

Type parameters

  • T

MatchResponse

MatchResponse<T>: T & { index: number; length: number; match: string; valid: boolean; void?: boolean }

Type parameters

  • T

MatcherElementsMap

MatcherElementsMap: Record<string, { children: string; matcher: MatcherInterface<{}>; props: object }>

Node

Node: React.ReactElement<unknown> | string | null

TransformCallback

TransformCallback: (node: HTMLElement, children: Node[], config: NodeConfig) => React.ReactNode

Variables

constALLOWED_TAG_LIST

ALLOWED_TAG_LIST: string[] = ...

constATTRIBUTES

ATTRIBUTES: FilterMap = ...

constATTRIBUTES_TO_PROPS

ATTRIBUTES_TO_PROPS: Record<string, string> = ...

constBANNED_TAG_LIST

BANNED_TAG_LIST: string[] = ...

constFILTER_ALLOW

FILTER_ALLOW: 1 = 1

constFILTER_CAST_BOOL

FILTER_CAST_BOOL: 4 = 4

constFILTER_CAST_NUMBER

FILTER_CAST_NUMBER: 3 = 3

constFILTER_DENY

FILTER_DENY: 2 = 2

constFILTER_NO_CAST

FILTER_NO_CAST: 5 = 5

constTAGS

TAGS: ConfigMap = ...

constTYPE_EMBEDDED

TYPE_EMBEDDED: number = ...

constTYPE_FLOW

TYPE_FLOW: 1 = 1

constTYPE_HEADING

TYPE_HEADING: number = ...

constTYPE_INTERACTIVE

TYPE_INTERACTIVE: number = ...

constTYPE_PALPABLE

TYPE_PALPABLE: number = ...

constTYPE_PHRASING

TYPE_PHRASING: number = ...

constTYPE_SECTION

TYPE_SECTION: number = ...