An extended tooltip can be created with `<tc:popover/>`.

Tag Library Documentation:

Put a popover in a popover facet of a button.

<tc:button label="Simple Popover" omit="true"> <f:facet name="popover"> <tc:popover label="Popover title" value="Popover content"/> </f:facet> </tc:button>

To assign a CSS class on the popover window use the `<tc:style customClass="..."/>` attribute.

In the following example, the width is changed to 600px using a CSS class. By default the width of a popover window is `276px;`. It can be changed with `$popover-max-width` (SCSS variable when compiling a theme) or `--bs-popover-max-width` (CSS). See:

<tc:button label="Popover with a width of 600px" omit="true"> <f:facet name="popover"> <tc:popover label="Lorem Ipsum" value="\#{popoverController.loremIpsum}"> <tc:style customClass="popover-600"/> </tc:popover> </f:facet> </tc:button>

HTML/XML code will be escaped by default.

You can turn it off with the `escape` attribute.

Although the HTML code is not escaped, the text is not colored because the code is sanitzed. "Sanitize" remove HTML/XML-Tags from a given string if not escaped. It can be configured in the tobago-config.xml. If you want to write your own sanitizer, you have to implement `org.apache.myfaces.tobago.sanitizer.Sanitizer`. Use `sanitize=never` to deactivate this.