This image shows five components that can be used for popups. These are:

• af:dialog: This is a popup with an X button in the top right corner and two buttons in the bottom right corner. The sample contains an input field with a label, as well as a collapsed information box.

• af:panelWindow: This is a popup with an X button in the top right corner. The sample contains a multi-select, scrollable list of check boxes for beverages.

• af:noteWindow: This is a simple box with a text note. The box has a tail pointing to its parent component.

• af:menu: This is a right-click context menu. The sample shows options for Cut, Copy, and Paste.

• af:contextInfo: This component indicates itself as an orange square in the parent component. Upon hover, the square expands to a triangle and an icon. Upon clicking, a window opens with contextual information about the clicked component. The information is formatted and aligned.