.map((paragraph: string, index: number) => {
     return {
         paragraphNo: index,
         safeHtml: this.sanitizer.bypassSecurityTrustHtml(paragraph),
         rawHtml: this.lineNumbering.stripLineNumbers(paragraph)
     };
 });

    /**
     * Creates the motion text - uses HTML to PDF
     *
     * @param motion the motion to convert to pdf
     * @param lnMode determine the used line mode
     * @param crMode determine the used change Recommendation mode
     * @returns doc def for the "the assembly may decide" preamble
     */
    private createText(motion: ViewMotion, lnMode: LineNumberingMode, crMode: ChangeRecoMode): object {
        let motionText: string;
        // get the line length from the config
        const lineLength = this.configService.instant<number>('motions_line_length');

        if (motion.isParagraphBasedAmendment()) {
            motionText = '';
            // this is logically redundant with the formation of amendments in the motion-detail html.
            // Should be refactored in a way that a service returns the correct html for both cases
            for (const paragraph of this.motionRepo.getAmendedParagraphs(motion, lineLength)) {
                if (paragraph.diffLineTo === paragraph.diffLineFrom + 1) {
                    motionText += `<h3>
                        ${this.translate.instant('Line')} ${paragraph.diffLineFrom}:
                    </h3>`;
                } else {
                    motionText += `<h3>
                        ${this.translate.instant('Line')} ${paragraph.diffLineFrom} - ${paragraph.diffLineTo - 1}:
                    </h3>`;
                }

                motionText += `<div class="paragraphcontext">${paragraph.textPre}</div>`;
                motionText += paragraph.text;
                motionText += `<div class="paragraphcontext">${paragraph.textPost}</div>`;
            }
        } else if (motion.isStatuteAmendment()) {
            // statute amendments
            const statutes = this.statuteRepo.getViewModelList();
            motionText = this.motionRepo.formatStatuteAmendment(statutes, motion, lineLength);
        } else {
            // lead motion or normal amendments
            // TODO: Consider tile change recommendation
            const changes: ViewUnifiedChange[] = Object.assign(
                [],
                this.changeRecoRepo.getChangeRecoOfMotion(motion.id)
            );

            // TODO: Cleanup, everything change reco and amendment based needs a unified structure.
            const amendments = this.motionRepo.getAmendmentsInstantly(motion.id);
            if (amendments) {
                for (const amendment of amendments) {
                    const changedParagraphs = this.motionRepo.getAmendmentAmendedParagraphs(amendment, lineLength);
                    for (const change of changedParagraphs) {
                        changes.push(change as ViewUnifiedChange);
                    }
                }
            }

            // changes need to be sorted, by "line from".
            // otherwise, formatMotion will make unexpected results by messing up the
            // order of changes applied to the motion
            changes.sort((a, b) => a.getLineFrom() - b.getLineFrom());
            motionText = this.motionRepo.formatMotion(motion.id, crMode, changes, lineLength);
            // reformat motion text to split long HTML elements to easier convert into PDF
            motionText = this.linenumberingService.splitInlineElementsAtLineBreaks(motionText);
        }

        return this.htmlToPdfService.convertHtml(motionText, lnMode);
    }