| <?xml version="1.0" encoding="UTF-8"?> |
| |
| <!-- |
| * Licensed to the Apache Software Foundation (ASF) under one or more |
| * contributor license agreements. See the NOTICE file distributed with |
| * this work for additional information regarding copyright ownership. |
| * The ASF licenses this file to You under the Apache License, Version 2.0 |
| * (the "License"); you may not use this file except in compliance with |
| * the License. You may obtain a copy of the License at |
| * |
| * http://www.apache.org/licenses/LICENSE-2.0 |
| * |
| * Unless required by applicable law or agreed to in writing, software |
| * distributed under the License is distributed on an "AS IS" BASIS, |
| * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| * See the License for the specific language governing permissions and |
| * limitations under the License. |
| --> |
| |
| <ui:composition template="/main.xhtml" |
| xmlns="http://www.w3.org/1999/xhtml" |
| xmlns:tc="http://myfaces.apache.org/tobago/component" |
| xmlns:ui="http://xmlns.jcp.org/jsf/facelets"> |
| |
| <p>The <code class="language-markup"><tc:out/></code> display an outputtext combined with a label.</p> |
| <tc:link label="Tag Library Documentation" image="#{request.contextPath}/image/feather-leaf.png" |
| link="#{apiController.tldBase}/#{apiController.currentRelease}/tld/tc/out.html"/> |
| <tc:section label="Basics"> |
| <p>To put a label in front of a outputtext, use the <code>label</code> attribute.</p> |
| <demo-highlight language="markup"><tc:out label="Output" value="Some Text"/></demo-highlight> |
| <tc:out id="o1" label="Output" value="Some Text"/> |
| <tc:out id="o2" value="Output without a label"/> |
| <tc:section label="Skip with compact"> |
| <p>If using <code>labelLayout="skip"</code> there is still a tag surrounding the output text.</p> |
| <tc:out id="outSkip" value="This text is rendered by tc:out with labelLayout=skip." labelLayout="skip"/> |
| <p>Set <code>compact="true"</code> to remove the surrounding tag as well.</p> |
| <tc:out id="outSkipCompact" value="This text is rendered by tc:out with labelLayout=skip and compact=true." |
| labelLayout="skip" plain="true"/> |
| </tc:section> |
| </tc:section> |
| <tc:section label="Markups"> |
| <tc:segmentLayout extraSmall="4seg"> |
| <tc:out value="thin" markup="thin"/> |
| <tc:out value="normal"/> |
| <tc:out value="bold" markup="bold"/> |
| <tc:out value="italic" markup="italic"/> |
| </tc:segmentLayout> |
| <tc:segmentLayout extraSmall="4seg"> |
| <tc:out value="primary" markup="primary"/> |
| <tc:out value="secondary" markup="secondary"/> |
| <tc:out value="success" markup="success"/> |
| <tc:out value="danger" markup="danger"/> |
| <tc:out value="warning" markup="warning"/> |
| <tc:out value="info" markup="info"/> |
| <tc:out value="light" markup="light"/> |
| <tc:out value="dark" markup="dark"/> |
| <tc:out value="muted" markup="muted"/> |
| </tc:segmentLayout> |
| </tc:section> |
| <tc:section label="Escape"> |
| <p>If the given string to the output field is HTML/XML code, it will be escaped by default. |
| But you can turn it off with the <code>escape</code> attribute.</p> |
| <tc:section label="Escape on (default)"> |
| <demo-highlight language="markup"><tc:out label="Escape on (default)" escape="true" value="\#{outController.html}"/></demo-highlight> |
| <tc:out id="o3" label="Escape on (default)" escape="true" value="#{outController.html}"/> |
| </tc:section> |
| <tc:section label="Escape off"> |
| <p>Although the HTML code is not escaped, you can see, that the text is not colored. |
| This is, because the code is sanitzed (see next section).</p> |
| <demo-highlight language="markup"><tc:out label="Escape off" escape="false" value="\#{outController.html}"/></demo-highlight> |
| <tc:out id="o4" label="Escape off" escape="false" value="#{outController.html}"/> |
| </tc:section> |
| </tc:section> |
| <tc:section label="Sanitize"> |
| <p>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 |
| <code>org.apache.myfaces.tobago.sanitizer.Sanitizer</code>.</p> |
| <p>Sanitzing can be deactivated for a component using the <code>sanitize</code> attribute. |
| But be careful, because of XSS vulnerability.</p> |
| <demo-highlight language="markup"><tc:out label="Sanitize off" escape="false" sanitize="never" value="\#{outController.html}"/></demo-highlight> |
| <tc:out id="o5" label="Sanitize off" escape="false" sanitize="never" value="#{outController.html}"/> |
| </tc:section> |
| </ui:composition> |