Skip to content

SiWidgetInstanceEditorDialogComponent documentation

selector
si-widget-instance-editor-dialog

The Dialog component is utilized when editing a widget instance within a dashboard. It dynamically loads and creates the associated widget editor and incorporates it into its content. The dialog component is accountable for interacting with the dashboard and offers options for saving changes or terminating the editing process.

Input Properties

NameTypeDefaultDescription
widget
Required		WidgetInput for the widget definition. It is required to retrieve the component factory to instantiate the widget editor.
widgetConfig
Required		WidgetConfigInput for the widget instance configuration. It is used to populate the widget editor.

Output Properties

NameTypeDescription
closed
(undefined | WidgetConfig)Emits the edited widget instance configuration if the user confirms by saving, or undefined if the user cancels the dialog.
editorSetupCompleted
voidEmits when the editor instantiation is completed.
widgetConfigChange
WidgetConfigInput for the widget instance configuration. It is used to populate the widget editor.

Types Documentation

Widgets describe the entries within the widget catalog and holds all default configuration and factory functionality to instantiate a widget instance, represented as WidgetConfig objects.
Properties
The factory to instantiate a widget instance component that is added to the dashboard.
componentFactory: WidgetComponentFactory
Optional default values that can be set to widget instances.
defaults?: Pick<WidgetConfig, ("width" | "height" | "minWidth" | "minHeight" | "heading" | "expandable" | "immutable" | "image" | "accentLine")>
An optional description that is visible in the widget catalog.
description?: string
A CSS icon class that specifies the widget icon, displayed in the catalog.
iconClass?: string
A unique id of the widget.
id: string
The name of the widget that is presented in the widget catalog.
name: string
Optional default payload object that is copied into every widget instance WidgetConfig .
payload?: any
An optional version string.
version?: string
A WidgetConfig holds the configuration of a widget instance component that is visible on a dashboard. It can be persisted and used to restore a dashboards state.
Properties
Optional type of the accent line.
accentLine?: AccentLineType
actionBarViewType?: ViewType
Defines whether the widget instance component can be expanded and enlarged over the dashboard.
expandable?: boolean
grid item header text.
heading?: string
Height of the grid item, where number represents how many rows it takes. (default?: 1)
height?: number
A unique id of a widget instance
id: string
Optional configuration for an image to be displayed on the widget instance.
image?: WidgetImage
immutable?: boolean
Widget instance editor components can use this property to indicate an invalid configuration. True if the config is invalid. False, undefined or null indicate a valid configuration.
Deprecated: Use the statusChanges emitter to notify about configuration status changes.
invalid?: boolean
isNotRemovable?: boolean
maximum height allowed during resize/creation (default?: undefined = un-constrained)
minHeight?: number
minimum width allowed during resize/creation (default?: undefined = un-constrained)
minWidth?: number
A widget specific payload object. Placeholder to pass in additional configuration.
payload?: any
Optionally, the version widget description that was used to create the widget config.
version?: string
The id of the widget descriptor that was used to instantiate the WidgetConfig and the widget instance component.
widgetId: string
Width of the grid item, where number represents how many columns it spans (default?: 1)
width?: number
Grid item position on x axis of the grid (default?: 0)
x?: number
Grid item position on y axis of the grid (default?: 0)
y?: number
(WidgetComponentTypeFactory | FederatedModule | WebComponent)
Factory type that is either a WidgetComponentTypeFactory , FederatedModule or WebComponent .
(StatusType | "caution" | "primary" | "inactive")
("collapsible" | "expanded" | "mobile")
Image is used to configure an image to be displayed on a widget instance.
Properties
The HTMLImageElement property alt provides fallback (alternate) text to display when the image specified by the element is not loaded.
alt: string
Defines if an image is placed on top or start (left) of the card.
dir?: ("horizontal" | "vertical")
Sets the image object-fit CSS property.
objectFit?: ObjectFit
Sets the image object-position CSS property.
objectPosition?: string
The image URL (See ).
src: string
(CommonFactoryFields & { [ index: string ]: any } })
(CommonFactoryFields & LoadRemoteModuleOptions & { [ index: string ]: any } })
(CommonFactoryFields & { [ index: string ]: any } })
("success" | "info" | "warning" | "danger" | "caution" | "critical")
(LoadRemoteModuleScriptOptions | LoadRemoteModuleEsmOptions | LoadRemoteModuleManifestOptions)
The Remote Module definition is based on @angular-architects . We take it over into this file to prevent adding a hard dependency.
("contain" | "cover" | "fill" | "none" | "scale-down")
ObjectFit configuration options for a widget image.
See https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit
{ exposedModule: string, remoteEntry: string, remoteName: string, type: "script" }
{ exposedModule: string, remoteEntry: string, type: "module" }
{ exposedModule: string, remoteName: string, type: "manifest" }

Except where otherwise noted, content on this site is licensed under MIT License.