QuillRenderer index.tsx

0% Statements 0/4

100% Branches 0/0

0% Functions 0/1

0% Lines 0/4

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import 'quill/dist/quill.snow.css';
import 'quill/dist/quill.bubble.css';
import { QuillDeltaToHtmlConverter } from 'quill-delta-to-html';
import { styled } from 'styled-components';
 
interface QuillRendererProps {
  delta: unknown[];
}
 
export default function QuillRenderer({ delta }: QuillRendererProps) {
  const converter = new QuillDeltaToHtmlConverter(delta, {});
 
  const html = converter.convert();
 
  return <Container className="ql-editor" dangerouslySetInnerHTML={{ __html: html }} />;
}
 
const Container = styled.div`
  position: relative;
  width: 100%;
  height: min-content;
  border: 1px solid #eee;
  background-color: #fafafa;
 
  .ql-image {
    max-width: 100%;
  }
`;