A "widget" presents the values in a small div indicator, connected to the widget through a standard (Vue) reactive integration:

Add a widget:

addWidget('example', {
    fields: {
        x: { value: 0 }
        , y: { value: 0 }
    }
})

Update the widget with values:

updateWidgetValues('diff', {
    x: 10
    , y: -20
})

Raw example of updating the values within the widget:

appShared.widgetsApp.widgets.example.fields.x = 100

Therefore to create a basic mouse widget:

let widgetFields = appShared.widgetsApp.widgets.example.fields

let pos = this.mouse.position
widgetFields.x.value = ~~pos.x
widgetFields.y.value = ~~pos.y

This is identical to the updateWidgetValues call