Dialog API

Properties

Name	Description	Type	Required	Default value
headline	This is the title of the dialog window	string		-
no-keys	Disables the ESC key to prevent closing with it	boolean		false
no-close	Disables every interaction related to close	boolean		false
local	If set to true, dialog will opens locally in it's parent container. See example above	boolean		false
width	Width of the dialog in any CSS metric. This attribute doesn't change the size of an already opened dialog, so if you are also using the `opened="true"` attribute, make sure to set the width before it.	string		-
height	Height of the dialog in any CSS metric	string		-
preventClose	When true, dialog cannot be closed	boolean		false
opened	Handles opened state	boolean		false

Method

Name	Description
`open([object])`	The object can be any of the properties, and also there is an `opener` option. `opener` determines the element where the focus was before the dialog has opened.
`close()`	Close the dialog, if the dialog is open close it
`setContent([html]/[domNode])`	Changes the content of dialog with the given parameter in opened state. It restores original content on close.
`setHeader([html]/[domNode])`	Appends a secondary header to the dialog with the given parameter in opened state. It restores original headers on close.
`setSize([object])`	Sets the dimensions of the dialog to the given `{ width, height }` values. They must be valid CSS values e.g. '600px'. Be aware that the height means the height of the header + content + footer, not just the content.

Events

Event	Description	Returns
`dialog.open`	Fires on open	`{ detail: { component: [as object] } }`
`dialog.close`	Fires on close	`{ detail: { component: [as object] } }`
`dialog.beforeClose`	Fires on before close	`{ detail: { component: [as object] } }`

Floatingpage API Reference

Method

Name	Description
`window.e.utils.openFloatingPage({url: url})`	Opens the floatingpage with iframe. The iframe url come from parameter.
`window.e.utils.closeFloatingPage()`	Close all floatingpage on the page. You can call in or outside from iframe.

Confirmation Dialog API Reference

Method

Name	Description
`window.e.utils.openConsequentialConfirmationDialog({ headline, content, confirm, cancel })`	Opens consequential confirm dialog.
`window.e.utils.openDestructiveConfirmationDialog({ headline, content, confirm, cancel })`	Opens destructive confirm dialog.

Parameters

Name	Description	Type	Required	Default value
headline	This is the title of the confirmation dialog.	string	true	-
content	This is the content of the confirmation dialog. It will be sanitized by default.	html	true	-
disableSanitization	Turn off automatic HTML sanitization on content of the confirmation dialog. Make sure the given content is sanitized!	boolean		false
confirm.label	This is the label of the confirmation button.	string		Ok
confirm.callback	This is the code to execute when the confirmation button is clicked. The dialog is closed automatically, no need to programatically close it.	function
cancel.label	This is the label of the cancel button.	string		Cancel
cancel.callback	This is the code to execute when the cancel button is clicked. The dialog is closed automatically, no need to programatically close it.	function

Custom Dialog API Reference

Method

Name	Description
`window.e.utils.dialog({ content })`	Opens a custom dialog with given content. Content can be a string (or HTML) or a DOM Node. It returns the reference of the dialog.
`open`	Opens the custom dialog. Should be called on the reference of window.e.utils.dialog.
`close`	Closes the custom dialog. Should be called on the reference of window.e.utils.dialog.

Parameters

Name	Description	Type	Required	Default value
content	This is the content of the custom dialog.	domNode or html

`e-dialog-action` API Reference

Properties

Name	Description	Type	Required	Default value
key	An identifier for tracking events. It should be unique. In Vue.js `key` is a reserved attribute. Use `:key.prop="'somekey'"` to set this attribute.	string
disabled	Disabled state. Does not fire trigger event if true.	boolean		false
disabled-tooltip	Defines tooltip for disabled actions.	string

Events

Event	Description	Returns
trigger	Fires on clicking the action.

`e-dialog-back-button` API Reference

Events

Event	Description	Returns
click	Fires on clicking the button.

`e-dialog-cover` API Reference

Properties

Name	Description	Type	Required	Default value
src	Set the url source of the image.	string	true
height	Set the height of the whole header.	string	false
tone	Set the header color according to the image brightness.	`['dark', 'light']`	false	`'light'`