Sha256: 7df555713ae8e63a84886e9865bc3844604ca9f8f2be495c5e0e67bae6b8075f

Contents?: true

Size: 1.02 KB

Versions: 384

Compression:

Stored size: 1.02 KB

Contents

/* eslint-disable react/no-multi-comp, flowtype/space-before-type-colon */
import Highlighter from 'react-highlight-words'
import React from 'react'
import classnames from 'classnames'
import { globalProps, GlobalProps } from '../utilities/globalProps'

type HighlightProps = {
  className?: string,
  data?: {[key: string]: string},
  id?: string,
  children?: React.ReactChild[] | React.ReactChild | string,
  text?: string,
  highlightedText?: string[],
} & GlobalProps

const Highlight = (props: HighlightProps): React.ReactElement => {
  const {
    children,
    className = 'pb_highlight_kit',
    data = {},
    highlightedText = ['highlight'],
    id = '',
    text = '',
  } = props

  const highlightContent: any = text || children;

  return (
    <Highlighter
        autoEscape
        data={data}
        highlightClassName={classnames(globalProps(props), className)}
        highlightTag="mark"
        id={id}
        searchWords={highlightedText}
        textToHighlight={highlightContent}
    />
  )
}

export default Highlight

Version data entries

384 entries across 384 versions & 1 rubygems

Version Path
playbook_ui-10.27.0.pre.lazysizes1 app/pb_kits/playbook/pb_highlight/_highlight.tsx
playbook_ui-10.27.0.pre.datepicker1 app/pb_kits/playbook/pb_highlight/_highlight.tsx
playbook_ui-10.26.0 app/pb_kits/playbook/pb_highlight/_highlight.tsx
playbook_ui-10.26.0.pre.alpha5 app/pb_kits/playbook/pb_highlight/_highlight.tsx