# \[Announce\] Dashboard version 2.10.0

**URL:** <https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196>\
**Category:** Dashboard\
**Created:** [22 October 2018 18:58 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196 "2018-10-22T18:58:39Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [22 October 2018 18:58 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/1 "2018-10-22T18:58:39Z")

</div>

I have just pushed a new version of Dashboard to npm

Version 2.10.0 - now allows users to create their own simple widgets that can be installed like other nodes.

To go along with this users can now choose to use the default underlying Angular-Material theming, instead of the Node-RED themes... these may look better for any nodes made using the Angular-Material libraries, though we have also tried to update the Node-RED ones to keep looking good.

Obviously there will be things we've missed and no doubt you will let us know 🙂

Here is a simple extra widget to try - and is a good place to start if you want to see how to create your own. Thanks to @nisiyama for this - [https://github.com/node-red-hitachi/ui\_list](https://github.com/node-red-hitachi/ui_list)

More docs on the API here - [https://github.com/node-red/node-red-dashboard/wiki/Creating-New-Dashboard-Widgets](https://github.com/node-red/node-red-dashboard/wiki/Creating-New-Dashboard-Widgets)

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [22 October 2018 19:43 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/2 "2018-10-22T19:43:19Z")

</div>

Updating using Palette manager. After restart the following happened

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/5/53f511624af24b933ea76cf0640947c6e0df0992.png)

22 Oct 22:36:39 - [info] Node-RED version: v0.19.4  
22 Oct 22:36:39 - [info] Node.js version: v8.11.3  
22 Oct 22:36:39 - [info] Windows\_NT 10.0.17134 x64 LE  
22 Oct 22:36:40 - [info] Loading palette nodes  
22 Oct 22:37:02 - [warn] ------------------------------------------------------  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_base] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_button] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_dropdown] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_switch] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_slider] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_numeric] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_text\_input] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_date\_picker] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_colour\_picker] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_form] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_text] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_gauge] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_chart] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_audio] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_toast] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_ui\_control] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_template] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] [node-red-dashboard/ui\_link] Error: Cannot find module 'setprototypeof'  
22 Oct 22:37:02 - [warn] ------------------------------------------------------  
22 Oct 22:37:02 - [info] Settings file : C:\Users\Richard.node-red\settings.js  
22 Oct 22:37:02 - [info] Context store : 'default' [module=localfilesystem]  
22 Oct 22:37:02 - [info] Context store : 'memory' [module=memory]  
22 Oct 22:37:02 - [info] User directory : C:\Users\Richard.node-red  
22 Oct 22:37:02 - [info] Server now running at [http://127.0.0.1:1880/](http://127.0.0.1:1880/)  
22 Oct 22:37:03 - [info] Active project : ControlBoard  
22 Oct 22:37:03 - [info] Flows file : C:\Users\Richard.node-red\projects\ControlBoard\flow.json  
22 Oct 22:37:03 - [info] Waiting for missing types to be registered:  
22 Oct 22:37:03 - [info] - ui\_base  
22 Oct 22:37:03 - [info] - ui\_template  
22 Oct 22:37:03 - [info] - ui\_button  
22 Oct 22:37:03 - [info] - ui\_ui\_control  
22 Oct 22:37:03 - [info] - ui\_dropdown  
22 Oct 22:37:03 - [info] - ui\_form  
22 Oct 22:37:03 - [info] - ui\_slider

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [22 October 2018 20:03 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/3 "2018-10-22T20:03:40Z")

</div>

that is a module inside serve-static module - no idea why it didn't get pulled in - or wasn't there from before.

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [22 October 2018 20:14 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/4 "2018-10-22T20:14:10Z")

</div>

can you try installing / re-installing manually ?

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [22 October 2018 20:26 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/5 "2018-10-22T20:26:11Z")

</div>

> [@dceejay](#):
>
> now allows users to create their own simple widgets that can be installed like other nodes

Hi Dave,  
Do you mean we can now publish **custom dashboard nodes** on npm? If so, that would be an awesome feature!  
But had a '_quick_' look at the example, and I see only one html and one js file, which seem to contain flow editor related stuff. Where do we have to put the dashboard related (html and js) stuff ??  
Thanks !!  
Bart

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [22 October 2018 20:33 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/6 "2018-10-22T20:33:45Z")

</div>

> [@dceejay](#):
>
> can you try installing / re-installing manually ?

manual installation - still same story

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [22 October 2018 21:31 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/7 "2018-10-22T21:31:45Z")

</div>

Uninstalled 2.10.0 and installed 2.9.8 with no issues. No luck with 2.10.0.

---

<div class="post-metadata">

**Author:** ![machadotiago](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/machadotiago/32/23776_2.png) [@machadotiago](https://discourse.nodered.org/u/machadotiago)\
**Post date:** [22 October 2018 23:17 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/8 "2018-10-22T23:17:49Z")

</div>

Yes !!! I was waiting for that since so long.  
Just found the doccumentation for that: [https://github.com/node-red/node-red-dashboard/wiki/Creating-New-Dashboard-Widgets](https://github.com/node-red/node-red-dashboard/wiki/Creating-New-Dashboard-Widgets)

---

<div class="post-metadata">

**Author:** ![nisiyama](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/nisiyama/32/85_2.png) [@nisiyama](https://discourse.nodered.org/u/nisiyama)\
**Post date:** [22 October 2018 23:38 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/9 "2018-10-22T23:38:00Z")

</div>

Hi. Official document can be found here: [https://github.com/node-red/node-red-dashboard/wiki/Creating-New-Dashboard-Widgets](https://github.com/node-red/node-red-dashboard/wiki/Creating-New-Dashboard-Widgets)

---

<div class="post-metadata">

**Author:** ![JayDickson](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/jaydickson/32/90592_2.png) [@JayDickson](https://discourse.nodered.org/u/JayDickson)\
**Post date:** [23 October 2018 00:01 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/10 "2018-10-23T00:01:50Z")

</div>

😰 You're going to force me to learn to do stuff with letters instear of brightly colored rectangular bubbles and string...

---

<div class="post-metadata">

**Author:** ![nisiyama](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/nisiyama/32/85_2.png) [@nisiyama](https://discourse.nodered.org/u/nisiyama)\
**Post date:** [23 October 2018 00:29 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/11 "2018-10-23T00:29:49Z")

</div>

Please try new Angular-Material theming.

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [23 October 2018 08:52 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/12 "2018-10-23T08:52:25Z")

</div>

@JayDickson - we can only blow up so many bubbles for you - at some point you have to make your own. Happy to provide the string once you have done so 🙂

@BartButenaers - yes - that is the hope. Most of the dashboard UI side is in the js file... in the ui\_list example it is in a variable called html - as a string.

@hotNipi - not sure what to suggest - just tried on Windows 10 here - all good here so far... it's in the package-lock.json file so should be installed.

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [23 October 2018 09:06 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/13 "2018-10-23T09:06:48Z")

</div>

Thank you. Just minutes ago I got it installed. I did many things, full restart included so it is impossible to tell what was the key move. But all OK for now. Thank you. 🙂

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [23 October 2018 09:14 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/14 "2018-10-23T09:14:39Z")

</div>

The choice of theming is under the Dashboard **Site** tab  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/2/2cd19e80d81db47e07914a940e48b46e3094cb68.png)  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/3/38533898b02bb609cf42afdccdce26d78b98b1b8.png)

The options are

- Use the Node-RED (existing) themes everywhere - which should work with all built in widgets.
- Use the Angular theme in the ui\_template only - IE don't use the Node-RED theme overrides inside any template you add.
- Use the Angular theme everywhere - This should work for any widgets that are built with the angular-material libraries - [https://material.angularjs.org/1.1.10/](https://material.angularjs.org/1.1.10/) - but any widgets that aren't may well look odd (eg Wave gauge etc)

Note: Any custom UI widgets will be treated (style-wise) as if they are ui\_templates.

Happy to look at PR's and suggestions to fix any crossover cases which could be improved, but hopefully this is a sensible compromise for now

---

<div class="post-metadata">

**Author:** ![Unpuertomex](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/unpuertomex/32/655_2.png) [@Unpuertomex](https://discourse.nodered.org/u/Unpuertomex)\
**Post date:** [26 October 2018 01:24 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/15 "2018-10-26T01:24:33Z")

</div>

Hi, I just updated to the latest release of the dashboard and noticed that the icons are now blurry and contain a green highlight around the edges as in this example  
 ![snip_20181025200642](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/f/f7811d1cc761930f3b967357a44fa61da7a92b1e.png)

and custom buttons now have a green background around the letters  
 ![snip_20181025201615](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/e/e533e9a2c8092264ecfa63fafecd5f8cce675867.png)

I cleared the cache but no change. I using Chrome Version 70.0.3538.77 node-red v0.19.4

Update: Never mind, I wasn't aware I could now change to Angular theme in ui\_template.

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [26 October 2018 06:47 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/16 "2018-10-26T06:47:56Z")

</div>

Yeah, noted. Already patched in master, not quite yet on npm

---

<div class="post-metadata">

**Author:** ![Marooned](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/marooned/32/2858_2.png) [@Marooned](https://discourse.nodered.org/u/Marooned)\
**Post date:** [1 November 2018 14:00 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/17 "2018-11-01T14:00:50Z")

</div>

> [@dceejay](#):
>
> The choice of theming is under the Dashboard **Site** tab  
> ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/2/2cd19e80d81db47e07914a940e48b46e3094cb68.png)  
> ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/3/38533898b02bb609cf42afdccdce26d78b98b1b8.png)

Just out of curiosity, should I see any difference in the dashboard look? I can't spot any change to be honest. Not in "regular" widgets nor in wave (that supposed to look odd). That new ui\_list also looks the same on all themes (btw, it renders with default black color while all other widgets have light text color for dark theme, so would be nice to make it consistent). Also, should height of ui\_list expand to the content? Now I have tiny row and vertical scrollbar.

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [1 November 2018 14:22 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/18 "2018-11-01T14:22:56Z")

</div>

Yes they should look different - you may need to ensure you have flushed your browser cache to ensure the dashboard code is the latest at the browser side.

---

<div class="post-metadata">

**Author:** ![Marooned](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/marooned/32/2858_2.png) [@Marooned](https://discourse.nodered.org/u/Marooned)\
**Post date:** [2 November 2018 17:38 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/19 "2018-11-02T17:38:43Z")

</div>

Yeah, refreshed without cache, still no difference. Fine by me (current theme looks nice) but maybe you could add screenshots from two themes so it's obvious what was the goal? Thanks.

BTW, any way to make tiles of dashboard stick to their positions? Every few updates of the view they get shifted around and the only way to bring the correct order is to rearrange them on Layout tab, deploy, then undo rearrangement and deploy once again. (probably wrong thread for this issue).

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [2 November 2018 19:44 UTC](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196/20 "2018-11-02T19:44:59Z")

</div>

This is ui\_list example shown with default light theme

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/7/7d4687f1e7719487bb0eb6750904fbbd7e87a770.png)  
and standard dark theme  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/6/61cfb72d603af28866d0dad13a04c92923c5e137.png)  
And Default Angular theme  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/6/619b9892480b5d8557ac73f80c6366ca6bc59257.png)

[Next page](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196.md?page=2)