Formatted Long Text Area

README.md

Usage

<c:FormattedLongText inputValue="input text" [template="RenderTemplate"] />

Where RenderTemplate can be :-

1. br : Render simple line breaks [Default]
2. ol : Convert each line as ordered list item
3. ul : Convert each line as un-ordered list item
4. p : Convert each line as a paragraph
5. div : Convert each line wrapped in div tag

Alternative

Easy alternative to just replace \n with br breaks:

<apex:outputText value="{!SUBSTITUTE(JSENCODE(textVariableThanContainsNewLines), '\\n', '<br/>')}" escape="false"/>

FormattedLongText.component

<apex:component controller="FormattedLongTextController" >
    <apex:attribute name="inputValue" assignTo="{!longText}" description="input long text field" type="String" required="true"/>
    <apex:outputText escape="false" value="{!formattedLongText}" /> 
</apex:component>

FormattedLongTextController.cls

public with sharing class FormattedLongTextController {

	public String longText { set; get; }
	public String renderTemplateName { set; get; }

	public static final String OPENING_ANGLE_BRACKET 		= '<';
	public static final String CLOSING_ANGLE_BRACKET 		= '>';
	public static final String OPENING_ROUND_BRACKET 		= '(';
	public static final String CLOSING_ROUND_BRACKET 		= ')';
	public static final String DEFAULT_TEMPLATE 		 	= 'br';
	public static final String LINE_BREAK 				= '\n';
	public static final String TEMPLATE_POSTFIX			= '-template';
	public static final String ORDERED_LIST_TEMPLATE    		= 'ol';
	public static final String UNORDERED_LIST_TEMPLATE  		= 'ul';

	public static final Map<String,String> templateMap = new Map<String,String> {
			  'br' 				=> '{0}<br/>'
			, 'ol' 				=> '<li>{0}</li>'
			, 'ul' 				=> '<li>{0}</li>'
			, 'p'  				=> '<p>{0}</p>'
			, 'div'				=> '<div>{0}</div>'
			, 'ol-template' 		=> '<ol>{0}</ol>'
			, 'ul-template' 		=> '<ul>{0}</ul>'
	};

	public FormattedLongTextController() {
			renderTemplateName = DEFAULT_TEMPLATE;
	}

	public String getFormattedLongText() {
	    return formatText(longText);
	}

	private String formatText(String longAreaText) {

     		String templateString;
		String formattedText = '';

		if ( String.isBlank(longAreaText)  ) {
		     return '';
		} else {
			 templateString = getTemplateString();
			 longAreaText = longAreaText.replaceAll(OPENING_ANGLE_BRACKET,OPENING_ROUND_BRACKET)
										.replaceAll(CLOSING_ANGLE_BRACKET,CLOSING_ROUND_BRACKET);

			 for(String line : longAreaText.split(LINE_BREAK)){
						formattedText += String.format(templateString, new String[]{line});
			 }

			 if( ORDERED_LIST_TEMPLATE.equals(renderTemplateName) || UNORDERED_LIST_TEMPLATE.equals(renderTemplateName)  ){
					 templateString = templateMap.get(renderTemplateName+TEMPLATE_POSTFIX);
					 formattedText  = String.format(templateString, new String[]{formattedText});
			 }
		 }
		 return formattedText;
	}

	private String getTemplateString(){
		String templateString = templateMap.get(renderTemplateName);
		return String.isBlank(templateString) ? templateMap.get(DEFAULT_TEMPLATE) : templateString;
	}

}