Function NewCustomCodeLine

www/src/components/NewCode.tsx:146–200

({ line, typesToDisplay, showLineNumber, lineNumber, getLineProps, getTokenProps, hide, highlight }:
  {
    line: any;
    lineNumber: number;
    showLineNumber: boolean;
    typesToDisplay: TypeViewInferface[];
    getLineProps: any;
    getTokenProps: any;
    hide: boolean;
    highlight: boolean
  }
)

}

const NewCustomCodeLine = ({ line, typesToDisplay, showLineNumber, lineNumber, getLineProps, getTokenProps, hide, highlight }:
  {
    line: any;
    lineNumber: number;
    showLineNumber: boolean;
    typesToDisplay: TypeViewInferface[];
    getLineProps: any;
    getTokenProps: any;
    hide: boolean;
    highlight: boolean
  }
) => {
  return (
    <div className="transition-all duration-700"
      style={{
        display: 'block',
        opacity: hide ? 0 : 1,
        maxHeight: hide ? 0 : 25,
        background: highlight ? "rgb(255, 255, 255, 0.04)" : "rgb(255, 255, 255, 0)",
        borderLeftStyle: "solid",
        borderLeftWidth: 4,
        borderLeftColor: highlight ? "#A175FF" : "rgb(255,255,255,0)",
        overflow: hide ? 'hidden' : 'none'
      }}>
      {showLineNumber &&
        <div
          style={{
            fontSize: 14,
            textAlign: 'right',
            userSelect: 'none',
            opacity: 0.5,
            paddingRight: '1em',
            paddingLeft: '0.5em',
          }}
        >
          {lineNumber + 1}
        </div>
      }
      <div style={{
        width: "100%",
        fontSize: '14px',
        padding: "2px 20px"
      }}>
        {line.map((token, key) => {
          const toShow = typesToDisplay.find((el) => { return el.token === token.content.trim() && el.line + 1 === lineNumber })
          console.log(token)
          if (toShow) {
            return (<span data-lsp={toShow.code} className="bg-white bg-opacity-5 transition-all hover:bg-opacity-10 border border-white border-opacity-25 hover:border-opacity-40 cursor-default rounded-md relative" style={{ padding: "0px 0px" }}> <span key={key} {...getTokenProps({ token, key })} /> </span>)
          }
          return (<span key={key} {...getTokenProps({ token, key })} />)
        })}
      </div>
    </div>
  )
}

const NewCustomCodeLineMemo = memo(NewCustomCodeLine)