Namespace: cq-ui-manager

WebComponents. cq-ui-manager

Self registering global web component that manages the overall UI on the attached div tag. This component keeps track of open menus and dialogs and attaches click and tap (onclick or ontouch) events in order to close them.

By default it is attached to the "body", but it can be changed to a different div tag if this behavior is too broad for your particular implementation.

Methods


attachedCallback()

Attach a callback to an individual component as part of the context


closeMenu(element)

Closes the current acttive menu and resets the activeMenuStack

Parameters:
Name Type Description
element HTMLElement

closeTopMenu()

Since:
  • 6.2.0 Added "cq-close-top" menu attribute to optionally close parent menus
Example
<cq-dialog>
	<cq-drawing-context>
		<cq-menu cq-close-top="cq-dialog[cq-drawing-context]">
			<div>This is a sub-menu</div>
			<cq-menu-dropdown>
				<cq-item>A stxtap event that bubbles to body will call UIManager#closeTopMenu</cq-item>
				<cq-item>With the cq-close-top attribute above, the dialog will be closed as well</cq-item>
			</cq-menu-dropdown>
		</cq-menu>
	</cq-drawing-context>
</cq-dialog>

createdCallback()

Prevents underlay clicks and handles tap events and callbacks.

Creates an array of the active Menus to keep track of which component is currently active.


detachedCallback()

Removes a callback from a component


ifAllClosed()


openMenu(menu, params)

Opens a menu item within the UI.Context

Parameters:
Name Type Description
menu HTMLElement
params object

registerForResize(element)

Parameters:
Name Type Description
element HTMLElement

restoreLift(element)

Parameters:
Name Type Description
element HTMLElement

topMenu()

Sets the top level menu in the activeMenuStack

Returns:

activeMenuStack


unregisterForResize(element)

Parameters:
Name Type Description
element HTMLElement