ui-buttongroup: html option labels

[bartbutenaers]

Description

Allow (sanetized) html content in the labels of all buttons, both via the config screen and dynamically:

Example flow:

[{"id":"1f3c7f17674ebf7e","type":"ui-button-group","z":"5d03484c007ac7f6","name":"","group":"bbec16a84d289909","order":1,"width":6,"height":1,"label":"button group","className":"","rounded":true,"useThemeColors":true,"passthru":false,"options":[{"label":"<span style=\"color: red;\">Button 1</span>","icon":"","value":"option_0","valueType":"str","color":"#009933"},{"label":"<span style=\"color: green;\">Button 2</span>","icon":"","value":"option_1","valueType":"str","color":"#999999"}],"topic":"topic","topicType":"msg","x":1150,"y":240,"wires":[[]]},{"id":"90b82937f79c17b6","type":"inject","z":"5d03484c007ac7f6","name":"Options as strings","props":[{"p":"ui_update.options","v":"[\"<span style='color: purple;'>Button A</span>\",\"<span style='color: brown;'>Button B</span>\"]","vt":"json"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":930,"y":240,"wires":[["1f3c7f17674ebf7e"]]},{"id":"10587d350cbf8655","type":"inject","z":"5d03484c007ac7f6","name":"Options as objects","props":[{"p":"ui_update.options","v":"[{\"label\":\"<span style='color: blue;'>Button X</span>\",\"value\":\"button_x\"},{\"label\":\"<span style='color: magenta;'>Button Y</span>\",\"value\":\"button_y\"}]","vt":"json"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":930,"y":300,"wires":[["1f3c7f17674ebf7e"]]},{"id":"bbec16a84d289909","type":"ui-group","name":"Group 1","page":"361c099f0b8b4fd9","width":6,"height":1,"order":1,"showTitle":true,"className":"","visible":true,"disabled":false,"groupType":"default"},{"id":"361c099f0b8b4fd9","type":"ui-page","name":"Page 1","ui":"ba0979b23b606ba0","path":"/page1","icon":"home","layout":"grid","theme":"c10c66e2e8a774ed","breakpoints":[{"name":"Default","px":0,"cols":3},{"name":"Tablet","px":576,"cols":6},{"name":"Small Desktop","px":768,"cols":9},{"name":"Desktop","px":1024,"cols":12}],"order":1,"className":"","visible":"true","disabled":"false"},{"id":"ba0979b23b606ba0","type":"ui-base","name":"My Dashboard","path":"/dashboard","appIcon":"","includeClientData":true,"acceptsClientConfig":["ui-notification","ui-control"],"showPathInSidebar":false,"headerContent":"page","navigationStyle":"default","titleBarStyle":"default","showReconnectNotification":true,"notificationDisplayTime":1,"showDisconnectNotification":true},{"id":"c10c66e2e8a774ed","type":"ui-theme","name":"Default Theme","colors":{"surface":"#ffffff","primary":"#0094CE","bgPage":"#eeeeee","groupBg":"#ffffff","groupOutline":"#cccccc"},"sizes":{"density":"default","pagePadding":"12px","groupGap":"12px","groupBorderRadius":"4px","widgetGap":"12px"}}]

Related Issue(s)

Closes #1566

Checklist

• I have read the contribution guidelines
• Suitable unit/system level tests have been added and they pass
• Documentation has been updated
  • Upgrade instructions
  • Configuration details
  • Concepts
• Changes flowforge.yml?
  • Issue/PR raised on FlowFuse/helm to update ConfigMap Template
  • Issue/PR raised on FlowFuse/CloudProject to update values for Staging/Production

Labels

• Includes a DB migration? -> add the area:migration label