Popular use case is used in PF dialogs. This example is for both demonstration and testing.
Source
<p:growl id="growl" keepAlive="true">
<p:autoUpdate/>
</p:growl>
<h:panelGrid columns="6" id="pnlDetails" styleClass="p-4" >
<p:commandButton value="Open Dialog" type="button" icon="pi pi-external-link" onclick="PF('dlg').show()"/>
</h:panelGrid>
<p:dialog header="Header" widgetVar="dlg" minHeight="40" width="60vw" showEffect="fade" closable="true" closeOnEscape="true" modal="true">
<pe:markdownEditor id="txtMarkdown" widgetVar="mde" value="#{markdownEditorController.markdown}"
maxHeight="200px" sideBySideFullscreen="false"
toolbar="bold, italic, |, guide">
</pe:markdownEditor>
</p:dialog>
@Named
@ViewScoped
public class MarkdownEditorController implements Serializable {
private static final long serialVersionUID = 1L;
private String markdown;
private boolean rtl;
@PostConstruct
public void init() {
this.markdown = "Markdown editing with **inline** styling!";
this.rtl = false;
}
public void addMessage(String message) {
FacesContext.getCurrentInstance().addMessage(null, new FacesMessage(message));
}
public void submit() {
addMessage(getMarkdown());
}
public void onPaste(AjaxBehaviorEvent e) {
addMessage("Paste event.");
}
public void onCopy(AjaxBehaviorEvent e) {
addMessage("Copy event.");
}
public void onCut(AjaxBehaviorEvent e) {
addMessage("Cut event.");
}
public String getMarkdown() {
return this.markdown;
}
public void setMarkdown(String markdown) {
this.markdown = markdown;
}
public boolean isRtl() {
return rtl;
}
public void setRtl(final boolean rtl) {
this.rtl = rtl;
}
}