Widget Pack Configuration

Each widget pack must include a mobro-widget-pack-config.json file in the root directory of the project. It defines the metadata of the widget pack. Projects created using dashboard-cli generate already contain this file.

caution

Without this file, MoBro doesn't detect the widget pack, and the CLI can neither run nor publish it.

Fields

Field	Type	Restrictions	Description
name	string	Required Pattern: ^[\w-]+$	The globally unique identifier of the widget pack. Not shown to users. See name.
displayName	string	Required	The name of the widget pack shown to users.
description	string	-	A short description of the widget pack.
author	string	-	The author of the widget pack.
tags	string[]	-	Tags to categorize the widget pack in the marketplace.
repositoryUrl	string	-	The URL of the widget pack's source code repository.
homepageUrl	string	-	The URL of the widget pack's homepage.
icon	string	-	Path to an icon, relative to this file. Currently not used; see Logo.

The file must not contain any other properties. The CLI validates the file against the JSON schema when running and publishing the widget pack.

name Field

The name identifies the widget pack in the marketplace and within MoBro. It may only contain letters, digits, _ and -, must be unique across all widget packs, and can't be changed after the widget pack has been published.

Version

The version of the widget pack is not defined in this file. It is taken from the version field in the package.json.

Logo

The logo shown in the marketplace is set from a logo.svg or logo.png file in the root directory of the project when the widget pack is first published, or using dashboard-cli update-logo. See Publish and Install.

Example

The following configuration is taken from the Charts widget pack:

mobro-widget-pack-config.json

{
  "name": "modbros_charts",
  "displayName": "Charts",
  "description": "Includes highly customizable base widgets such as textual values, bar/line charts, donuts and gauges.",
  "author": "ModBros",
  "tags": ["charts", "gauges"],
  "repositoryUrl": "https://github.com/ModBros/chart-widgets"
}

JSON Schemas

MoBro serves JSON schemas for both configuration files. With the schemas set up, your IDE suggests all available properties and validates the files while you type.

The schemas are available while MoBro is running:

File	Schema
mobro-widget-pack-config.json	http://localhost:42169/mobro-schema/mobro-widget-pack-config.schema.json
mobro-widget-config.json	http://localhost:42169/mobro-schema/mobro-widget-config.schema.json

JetBrains IDEs (WebStorm, IntelliJ IDEA, …): projects created with dashboard-cli generate already contain the mappings in .idea/jsonSchemas.xml.

Visual Studio Code: add the mappings to the .vscode/settings.json of the project:

.vscode/settings.json

{
  "json.schemas": [
    {
      "fileMatch": ["mobro-widget-pack-config.json"],
      "url": "http://localhost:42169/mobro-schema/mobro-widget-pack-config.schema.json"
    },
    {
      "fileMatch": ["mobro-widget-config.json"],
      "url": "http://localhost:42169/mobro-schema/mobro-widget-config.schema.json"
    }
  ]
}