Editor
Panel
Panel

Editor

If a p:textEditor needs to be used in with full-size inside a p:panel , the styleClass jeesl-panel and jeesl-editor needs to be applied.

If you want to prevent pasting of markup in the editor, please add this JavaScript file to your head:

library="jeeslJs" name="preventMarkupPasting.js"

<h:form id="fJeesl">
	<p:panel header="Editor" styleClass="jeesl-panel jeesl-editor">
		<f:facet name="actions">
			<j:svg type="jeeslSave" listener="#{stylePanelEditorBean.save()}" update="@form" library="jeeslGfx"/>
		</f:facet>
		<p:textEditor widgetVar="editorWidget1"
					  value="#{stylePanelEditorBean.html}"
					  placeholder="Enter your content">
	        <f:facet name="toolbar">
	             <span class="ql-formats">
	                <button class="ql-bold"></button>
	                <button class="ql-italic"></button>
	            </span>
				<span class="ql-formats">
					<button class="ql-list" value="ordered"></button>
					<button class="ql-list" value="bullet"></button>
				</span>
	        </f:facet>
	    </p:textEditor>
	</p:panel>
	<h:outputText value="#{stylePanelEditorBean.html}" escape="true"/>
</h:form>
<h:form id="fTabs">
	<p:tabView styleClass="jeesl-tabs jeesl-editor">  
  		<p:tab title="Editor">
  			<p:textEditor value="#{stylePanelEditorBean.html}"
			  			  placeholder="Enter your content">
				<f:facet name="toolbar">
					<span class="ql-formats">
						<button class="ql-bold"></button>
						<button class="ql-italic"></button>
					</span>
					<span class="ql-formats">
						<button class="ql-list" value="ordered"></button>
						<button class="ql-list" value="bullet"></button>
					</span>
				</f:facet>