Skip to content

Widget Type 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

Types Documentation

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 .
(CommonFactoryFields & { [ index: string ]: any } })
(CommonFactoryFields & LoadRemoteModuleOptions & { [ index: string ]: any } })
(CommonFactoryFields & { [ index: string ]: any } })
(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
(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.
("success" | "info" | "warning" | "danger" | "caution" | "critical")
{ exposedModule: string, remoteEntry: string, remoteName: string, type: "script" }
{ exposedModule: string, remoteEntry: string, type: "module" }
{ exposedModule: string, remoteName: string, type: "manifest" }
("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

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